/*
Author: Raphael Schleutker
 */
/* IMPORTS */
@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
/* FONT VARIABLES */
/* BACKGROUND VARIABLES */
/* ADDITIONAL COLORS */
/* NAVBAR */
/* SIDEBAR */
/* BUTTONS */
/* BASIC STYLE OF THE WEBSITE */
html, body {
  height: 100%;
  width: 100%;
}

body {
  background: #F9F9FA;
  color: #73879C;
  font-family: "Poppins", sans-serif;
  font-size: 0.9em;
}

.container {
  padding-top: 15px;
}

.modal-header, .modal-footer {
  background-color: rgba(0, 0, 0, 0.03);
}

/* GENERAL ELEMENTS */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  margin-bottom: 1rem;
  font-weight: 400;
  line-height: 1.2;
}

.h1, h1 {
  font-size: 1.75rem;
}

.h2, h2 {
  font-size: 1.6rem;
}

.h3, h3 {
  font-size: 1.45rem;
}

.h4, h4 {
  font-size: 1.3rem;
}

.h5, h5 {
  font-size: 1.15rem;
}

.h6, h6 {
  font-size: 1rem;
}

p {
  font-weight: 300;
  line-height: 1.7em;
  text-align: justify;
}
p.centered {
  text-align: center;
}
p.extra-margin {
  margin-top: 0.5rem;
  margin-bottom: 2rem;
}

b, strong {
  font-weight: 600;
}

.nav-tabs, .nav-pills {
  font-size: 0.75rem;
}

.opacity-40 {
  opacity: 0.4;
}

/* BUTTONS */
.btn-dark {
  color: #FFF;
  background-color: #172D44;
  border-color: #172D44;
}

.btn-dark:hover {
  background-color: #122335;
  border-color: #122335;
}

/* FORMS */
.input-group-text {
  min-width: 100px;
  font-size: 0.8rem;
}

.form-control::placeholder {
  opacity: 0.5;
}

.content-form .form-control {
  margin-bottom: 12px;
}

/* TABLES */
.table, thead, th, td {
  border-color: #D9DEE4;
}

.table {
  position: relative;
  color: unset;
  font-size: 0.85em;
}
.table td {
  vertical-align: middle;
}

.table-results {
  border-radius: 5px;
}
.table-results tbody tr:hover {
  background: #F9F9FA;
  cursor: pointer;
}
.table-results th {
  font-size: 1.1em;
  font-weight: 500;
}
.table-results tr {
  background: #FFF;
  border-style: solid;
  border-color: #D9DEE4;
  border-width: 1px 1px 0 1px;
}
.table-results tr.discarded {
  color: #BFBFBF;
}
.table-results tr.active {
  background-color: #F9F9FA;
  font-weight: 500;
}
.table-results tr:last-child {
  border-width: 1px;
}
.table-results td, .table-results th {
  padding: 1rem 0.5rem;
}

.table-details {
  font-size: 0.9em;
}
.table-details thead {
  font-weight: bold;
}
.table-details tr {
  height: unset;
  background: unset;
}
.table-details td {
  padding-top: 5px;
  padding-bottom: 5px;
}

/* FLASH MESSAGES */
.flash {
  position: fixed;
  bottom: 50px;
  margin-left: 20px;
  right: 20px;
  z-index: 1001;
}

/* SIDEBAR */
#sidebar {
  background-color: #2A3F54;
  color: #ECF0F1;
  width: 200px;
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  padding: 15px;
  z-index: 999;
  overflow-y: auto;
  transition: 0.5s;
}
#sidebar a {
  color: #ECF0F1;
}
#sidebar hr {
  border-color: #172D44;
}
#sidebar .close-button {
  position: absolute;
  top: 0;
  right: 15px;
  font-size: x-large;
}
#sidebar .search {
  margin-top: 50px;
}

/* NAVBAR */
.navbar {
  background: #1C3144;
  color: #ECF0F1;
}
.navbar .nav-link, .navbar .navbar-light, .navbar .navbar-brand {
  color: #ECF0F1;
}
.navbar .nav-link.active, .navbar .nav-link:active, .navbar .navbar-light.active, .navbar .navbar-light:active, .navbar .navbar-brand.active, .navbar .navbar-brand:active {
  color: #ECF0F1;
  font-weight: bolder;
}
.navbar .dropdown-menu {
  color: #ECF0F1;
  background-color: #0F6674;
}
.navbar .dropdown-item {
  color: #ECF0F1;
}
.navbar .dropdown-item.active, .navbar .dropdown-item:active, .navbar .dropdown-item:hover {
  color: #ECF0F1;
  background-color: #0B505B;
}
.navbar .dropdown-item.disabled, .navbar .dropdown-item:disabled {
  color: #ABB7C1;
}

/* MAIN */
#vertical-flex-container {
  position: absolute;
  top: 55px;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  height: calc(100vh - 55px);
  width: 100%;
}

#filters {
  vertical-align: middle;
  padding: 40px;
}
#filters .form-inline {
  justify-content: center;
  align-items: last baseline;
}
#filters .form-inline label {
  -ms-flex-align: unset;
  align-items: unset;
  -ms-flex-pack: unset;
  justify-content: unset;
  margin-bottom: 0.25em;
  font-weight: 500;
}
#filters #filter-help {
  color: #9DABB9;
  font-size: smaller;
}
#filters #filter-help div {
  transition: 0s;
  text-align: center;
}
#filters svg:hover {
  cursor: pointer;
  color: #495562;
}

#horizontal-flex-container {
  display: flex;
  flex-direction: row;
  width: 100%;
  flex-grow: 1;
  overflow-y: hidden;
}

#content {
  overflow: auto;
  scrollbar-width: none;
  padding: 0 10px;
  height: 100%;
  width: 100%;
  /* -ms-overflow-style : none; /* IE and Edge */
  /* scrollbar-width    : none; /* Firefox */
  /*&::-webkit-scrollbar {
    display : none;
  }*/
}

#sidebar-left, #sidebar-right {
  flex-shrink: 0;
  padding: 0 10px 10px 10px;
  scrollbar-width: none;
}
#sidebar-left::-webkit-scrollbar, #sidebar-right::-webkit-scrollbar {
  display: none;
}
#sidebar-left p, #sidebar-right p {
  margin-bottom: 6px;
}
#sidebar-left ul, #sidebar-right ul {
  margin-top: 10px;
}
#sidebar-left ul.list-group > li, #sidebar-right ul.list-group > li {
  padding: 10px;
}
#sidebar-left .list-group, #sidebar-right .list-group {
  margin-bottom: 1em;
}
#sidebar-left .list-group-mine, #sidebar-right .list-group-mine {
  background: unset;
  border-color: #D9DEE4;
}
#sidebar-left .ul-complex-attribute, #sidebar-right .ul-complex-attribute {
  list-style-type: none;
  position: relative;
  margin: 0 5px;
  padding: 0 10px;
}
#sidebar-left .ul-complex-attribute hr, #sidebar-right .ul-complex-attribute hr {
  margin: 3px 0;
}
#sidebar-left .ul-complex-attribute li, #sidebar-right .ul-complex-attribute li {
  margin-bottom: 15px;
}
#sidebar-left li.empty, #sidebar-right li.empty {
  color: #BFBFBF;
}
#sidebar-left strong, #sidebar-right strong {
  font-size: 1.1em;
  font-weight: 400;
}
#sidebar-left .entity-attribute, #sidebar-right .entity-attribute {
  font-size: 0.9em;
  text-align: center;
  margin-top: 5px;
}
#sidebar-left .primer-sequence, #sidebar-right .primer-sequence {
  word-wrap: anywhere;
}
#sidebar-left .h1, #sidebar-left h1, #sidebar-right .h1, #sidebar-right h1 {
  font-size: 1.4rem;
}
#sidebar-left .h2, #sidebar-left h2, #sidebar-right .h2, #sidebar-right h2 {
  font-size: 1.3rem;
  margin-bottom: 1em;
}
#sidebar-left .h3, #sidebar-left h3, #sidebar-right .h3, #sidebar-right h3 {
  font-size: 1.2rem;
}
#sidebar-left .h4, #sidebar-left h4, #sidebar-right .h4, #sidebar-right h4 {
  font-size: 1.1rem;
}
#sidebar-left .h5, #sidebar-left h5, #sidebar-right .h5, #sidebar-right h5 {
  font-size: 1.05rem;
}
#sidebar-left .h6, #sidebar-left h6, #sidebar-right .h6, #sidebar-right h6 {
  font-size: 1rem;
}
#sidebar-left .tab-content, #sidebar-right .tab-content {
  font-size: 0.9em;
}
#sidebar-left .tab-top-link, #sidebar-right .tab-top-link {
  padding: 5px;
  text-align: center;
}

.sidebar-header {
  background: #F9F9FA;
  position: sticky;
  top: 0;
  z-index: 999;
}

#sidebar-left {
  width: 200px;
}

#sidebar-right {
  width: 550px;
}
#sidebar-right .btn-sm {
  font-size: 0.75rem;
}

.ul-additional-options {
  padding: 0;
  list-style-type: none;
}
.ul-additional-options > li {
  padding: 4px 0;
}

/* GENOTYPE DISPLAY */
.chromosome, .allele-1, .allele-2 {
  padding: 0 5px;
}

.chromosome {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
}

.allele-2 {
  border-top: 1px solid;
  display: block;
}

/* ADDITIONAL */
.soft-wrap {
  word-break: break-all;
}

.lower-seq {
  background: #FDCDCD;
}

.card-login {
  margin-top: 200px;
  margin-bottom: auto;
  width: 450px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.remember {
  margin-bottom: 15px;
}

.remember input {
  width: 20px;
  height: 20px;
  margin-left: 15px;
  margin-right: 5px;
}

.found-primers {
  background: #F9F9F9;
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #CCC;
  font-family: monospace;
}

.mfp-figure::after {
  background: #F9F9FA;
}

/*# sourceMappingURL=style.css.map */
