@charset "UTF-8";
:root {
  --black: #000000;
  --yellow: #ffcd00;
  --orange: #ff4f00;
  --white: #ffffff;
  --offWhite: #f9f9f9;
  --lightBlue: #e6ebf1;
  --lightGrey: #f9f6f1;
  --darkOrange: #b53902;
  --beige: #e9d9c8;
  --lightYellow: #f0d461;
}

@font-face {
  font-family: "PublicSans";
  src: url("../fonts/PublicSans-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "PublicSans";
  src: url("../fonts/PublicSans-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "PublicSans";
  src: url("../fonts/PublicSans-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: "PublicSans";
  src: url("../fonts/PublicSans-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: "Lora";
  src: url("../fonts/Lora-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Lora";
  src: url("../fonts/Lora-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}

.daterangepickerclass {
  text-align: center;
}

.daterangepickerclass:focus {
  outline: none;
}

.selectize-dropdown {
  border-radius: 0;
}

.selectize-dropdown .selectize-dropdown-content .option.selected {
  background-color: #ff4f00;
  color: #000000;
}

.flex-col {
  display: flex;
  flex-direction: column;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.row {
  --bs-gutter-x: 0;
}

.split-top-border {
  border-top: 2px solid #f9f6f1;
  position: relative;
  width: 30%;
  margin: 1rem 0;
}

.split-top-border::before {
  content: "";
  position: absolute;
  width: 100px;
  height: 100%;
  top: -2px;
  left: 0;
  border-top: 2px solid #ffcd00;
}

.split-top-border.full {
  width: 100%;
}

.last-updated-parent {
  margin-left: auto;
  margin-top: 4rem;
  border-top: 2px solid #ffcd00;
  padding-top: 0.25rem;
  padding-right: 3rem;
  width: fit-content;
}

.mr-btn {
  background: #ffcd00;
  border: 2px solid #ffcd00;
  color: #000000;
  border-radius: 0;
  font-weight: bold;
  width: fit-content;
  padding: 0.5rem 2.5rem;
}

.mr-btn:hover {
  background: #ffcd00;
  border: 2px solid #ffcd00;
  color: #000000;
}

.white-btn {
  background: #ffffff;
  border: 2px solid #ffcd00;
  color: #ffcd00;
  border-radius: 0;
  font-weight: bold;
  width: fit-content;
  padding: 0.5rem 2.5rem;
}

.white-btn:hover {
  background: #ffffff;
  border: 2px solid #ffcd00;
  color: #ffcd00;
}

.black-btn {
  background: #000000;
  border: 2px solid #000000;
  color: #ffffff;
  border-radius: 0;
  font-weight: bold;
  width: fit-content;
  padding: 0.5rem 2.5rem;
}

.black-btn:hover {
  background: #000000;
  border: 2px solid #000000;
  color: #ffffff;
}

.link-btn:hover,
.link-btn:focus,
.link-btn {
  border: none;
  padding: 0;
  color: #ff4f00;
  text-decoration: underline;
  background: transparent;
  width: fit-content;
  height: fit-content;
}

span.aws-bucket,
span.aws-bucket *,
a,
a * {
  color: #ff4f00;
  gap: 10px;
}

span.aws-bucket:hover, span.aws-bucket *:hover,
a:hover,
a *:hover {
  cursor: pointer;
}

span.aws-bucket.ref-link,
a.ref-link {
  font-size: 0.6rem;
  text-decoration: none;
}

hr {
  margin: 1rem 0;
  border-color: transparent;
}

hr.big-hr {
  margin: 0;
  height: 100px;
}

* {
  font-family: "PublicSans", sans-serif;
}

div[data-path="404"] {
  border-radius: 0.5rem;
  margin: 2rem;
  text-align: center;
  padding: 60px 20px;
}

body #page-wrapper {
  padding: 0 3rem;
}

body #page-wrapper .virtual-select > .vscomp-ele-wrapper > .vscomp-toggle-button,
body #page-wrapper .daterangepickerclass,
body #page-wrapper .selectize-input {
  border-radius: 0;
  border: none;
  font-size: inherit;
  padding: 0.375rem 0.75rem;
  min-height: calc(1.5em + 0.75rem + 2px);
}

body #page-wrapper .virtual-select > .vscomp-ele-wrapper > .vscomp-toggle-button.focus,
body #page-wrapper .daterangepickerclass.focus,
body #page-wrapper .selectize-input.focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 79, 0, 0.25);
}

body #page-wrapper .virtual-select > .vscomp-ele-wrapper > .vscomp-toggle-button .vscomp-value,
body #page-wrapper .daterangepickerclass .vscomp-value,
body #page-wrapper .selectize-input .vscomp-value {
  height: 1.5rem;
  line-height: 1.5rem;
}

body #page-wrapper .daterangepickerclass {
  text-align: center;
}

body #page-wrapper .daterangepickerclass:focus {
  outline: none;
}

body #page-wrapper .selectize-dropdown {
  border-radius: 0;
}

body #page-wrapper .selectize-dropdown .selectize-dropdown-content .option.selected {
  background-color: #ff4f00;
  color: #000000;
}

body #page-wrapper .datatables thead .form-group.has-feedback + div,
body #page-wrapper input.form-control[type="text"],
body #page-wrapper input.form-control[type="search"] {
  margin: 0.25rem 0;
  border-radius: var(--bs-border-radius);
}

body #page-wrapper .datatables thead .form-group.has-feedback + div .selectize-control > .selectize-input:focus, body #page-wrapper .datatables thead .form-group.has-feedback + div:focus,
body #page-wrapper input.form-control[type="text"] .selectize-control > .selectize-input:focus,
body #page-wrapper input.form-control[type="text"]:focus,
body #page-wrapper input.form-control[type="search"] .selectize-control > .selectize-input:focus,
body #page-wrapper input.form-control[type="search"]:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 79, 0, 0.25);
}

body #page-wrapper .datatables thead .form-group.has-feedback + div .selectize-control > .selectize-input,
body #page-wrapper input.form-control[type="text"] .selectize-control > .selectize-input,
body #page-wrapper input.form-control[type="search"] .selectize-control > .selectize-input {
  border: 1px solid #000000 !important;
  min-height: unset;
  border-radius: var(--bs-border-radius);
}

body #page-wrapper input.form-control[type="text"],
body #page-wrapper input.form-control[type="search"] {
  border: 1px solid #000000 !important;
}

body #page-wrapper .datatables
thead
td:not([data-type="number"])
.form-group.has-feedback
+ div {
  border: none !important;
}

body #page-wrapper .datatables
thead
td:not([data-type="number"])
.form-group.has-feedback
+ div .selectize-input:has(input[type="text"]) {
  font-size: 0.9375rem;
  line-height: 1.5;
}

body #page-wrapper table {
  max-width: 100% !important;
}

body #page-wrapper .datatables .dataTables_filter {
  text-align: left;
}

body #page-wrapper .datatables .dataTables_filter label {
  font-weight: bold;
}

body #page-wrapper .datatables .dataTables_filter label input {
  border-radius: 3px;
  width: 300px;
  margin-left: 0.5rem;
}

body #page-wrapper .datatables .glyphicon-remove-circle.form-control-feedback {
  display: none !important;
}

body #page-wrapper .datatables .table.dataTable thead > tr:last-child > th,
body #page-wrapper .datatables .table.dataTable thead > tr:last-child > td,
body #page-wrapper .datatables .table.dataTable tbody > tr > td {
  border-bottom: 1px solid #000000;
  color: #000000;
  background-color: transparent;
  box-shadow: none !important;
}

body #page-wrapper .datatables .table.dataTable thead > tr:last-child > td {
  padding-top: 0;
}

body #page-wrapper .datatables .table.dataTable thead th.sorting::after {
  top: unset;
  bottom: 11px;
}

body #page-wrapper .datatables .table.dataTable thead th.sorting::before {
  top: unset;
  bottom: 20px;
}

body #page-wrapper .datatables .pagination {
  align-items: center;
  gap: 10px;
}

body #page-wrapper .datatables .pagination li.paginate_button {
  height: fit-content;
}

body #page-wrapper .datatables .pagination li.paginate_button.disabled {
  opacity: 0.6;
}

body #page-wrapper .datatables .pagination li.paginate_button a {
  background-color: transparent;
  border: none;
  color: #000000;
  box-shadow: none;
  padding: 0 0.25rem;
}

body #page-wrapper .datatables .pagination li.paginate_button.active a {
  color: #ff4f00;
  border-bottom: 2px solid #ff4f00;
  box-shadow: none;
  border-radius: 0;
  background: transparent;
  padding: 3px 6px;
}

body #page-wrapper .datatables .pagination li.paginate_button.previous a, body #page-wrapper .datatables .pagination li.paginate_button.next a {
  color: #ff4f00;
}

body #page-wrapper .top-border {
  border-top: 2px solid grey;
  padding-top: 1rem;
}

body #page-wrapper .arrow-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: fit-content;
  font-weight: bold;
  gap: 0.25rem;
}

body #page-wrapper .arrow-link .arrow {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-block-end-color: transparent !important;
  border-block-start-color: transparent !important;
}

body #page-wrapper .arrow-link .arrow.down {
  border-width: 5px 5px 0 5px;
  border-color: #ff4f00 transparent transparent transparent;
}

body #page-wrapper .arrow-link .arrow.up {
  border-width: 0 5px 5px 5px;
  border-color: transparent transparent #ff4f00 transparent;
}

body #page-wrapper .arrow-link .arrow.right {
  border-width: 5px 0 5px 5px;
  border-color: transparent transparent transparent #ff4f00;
}

body #page-wrapper .arrow-link .arrow.left {
  border-width: 5px 5px 5px 0;
  border-color: transparent #ff4f00 transparent transparent;
}

body #page-wrapper .tabbable {
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

body #page-wrapper .tabbable > ul.nav {
  margin: 1rem 0;
  gap: 1.5rem;
  align-items: center;
}

body #page-wrapper .tabbable > ul.nav .nav-item.bslib-nav-item {
  flex-grow: 1;
}

body #page-wrapper .tabbable > ul.nav .nav-item.bslib-nav-item img {
  height: 2rem;
  margin: 1rem 0;
}

body #page-wrapper .tabbable > ul.nav .nav-item a {
  font-weight: bold;
  background-color: #f9f9f9;
  color: #000000;
  border-radius: 0;
}

body #page-wrapper .tabbable #genomes_nav, body #page-wrapper .tabbable #map_nav {
  padding: 0;
}

body #page-wrapper .tabbable #genomes_nav .nav-item a, body #page-wrapper .tabbable #map_nav .nav-item a {
  background-color: transparent;
  border-bottom: 0.5rem solid transparent;
  font-weight: normal;
  padding-top: 0;
}

body #page-wrapper .tabbable #genomes_nav .nav-item a[aria-selected="true"], body #page-wrapper .tabbable #map_nav .nav-item a[aria-selected="true"] {
  border-bottom: 0.5rem solid #ffcd00;
  font-weight: bold;
}

body #page-wrapper .tabbable .tab-content {
  flex-grow: 1;
}

body #page-wrapper .tabbable .tab-content .page-section.flex-col {
  margin-bottom: 1rem;
  padding-top: 1rem;
  border-top: 2px solid grey;
}

body #page-wrapper .tabbable .tab-content .main-page {
  padding-bottom: 5rem;
}

body #page-wrapper .tabbable .tab-content .main-page .tab-title {
  margin-bottom: 1.5rem;
}

body #page-wrapper .tabbable .tab-content .main-page .tab-subtitle {
  margin-bottom: 1rem;
}

body #page-wrapper .tabbable .tab-content .main-page .page-section {
  padding-top: 1rem;
  margin-bottom: 6rem;
  border-top: 2px solid grey;
}

body #page-wrapper .tabbable .tab-content .main-page .page-section.last-section {
  margin-bottom: 0;
}

body #page-wrapper .tabbable .tab-content .main-page .page-section.no-border {
  border-top: none;
}

body #page-wrapper .tabbable .tab-content .main-page .page-section .section-header {
  padding-bottom: 0.25rem;
}

body #page-wrapper .tabbable .tab-content .main-page .narrow-section {
  width: 60%;
}

body #page-wrapper .tabbable .tab-content .main-page h1.split-top-border,
body #page-wrapper .tabbable .tab-content .main-page h2.split-top-border {
  width: 50%;
  padding: 1rem 0;
  margin: 0;
}

body #page-wrapper .tabbable .tab-content .main-page .section-content {
  padding-top: 2rem;
}

body #page-wrapper #explore-more-parent > div {
  display: flex;
  gap: 2rem;
  margin-bottom: 6rem;
}

body #page-wrapper #explore-more-parent > div .page-link-tile {
  aspect-ratio: 1/1;
  position: relative;
  height: 35vh;
  cursor: pointer;
}

body #page-wrapper #explore-more-parent > div .page-link-tile .page-link-image {
  position: absolute;
  height: 70%;
  width: 100%;
  background-size: cover;
  background-position: center;
}

body #page-wrapper #explore-more-parent > div .page-link-tile .page-link-text {
  position: absolute;
  background: #ffcd00;
  height: 31%;
  width: 100%;
  bottom: 0;
  color: #000000;
  font-size: 1.5rem;
  padding: 1rem;
  justify-content: space-between;
  align-items: center;
}

body #page-wrapper #explore-more-parent > div .page-link-tile .page-link-text img {
  height: 2rem;
  width: auto;
}

@media screen and (max-width: 1400px) {
  body #page-wrapper #explore-more-parent > div .page-link-tile .page-link-text {
    line-height: 1.6rem;
    padding: 0.5rem;
  }
  body #page-wrapper #explore-more-parent > div .page-link-tile .page-link-text img {
    height: 1.75rem;
  }
}

body .metadata-section > .flex-row {
  justify-content: space-between;
}

body .metadata-section .datatables thead td:last-child .form-group {
  display: none;
}

body .footer {
  background: #000000;
  color: #ffffff;
  padding-bottom: 30px;
  font-size: 0.8rem;
  height: 300px;
}

body .footer .container {
  justify-content: space-between;
  height: 100%;
}

body .footer .container img {
  display: block;
}

body .footer .container > div {
  padding-top: 30px;
  align-items: center;
}

body .footer .container > div:first-child {
  justify-content: space-between;
}

body .footer .container > div:first-child .logo-parent {
  gap: 2rem;
  align-items: center;
}

body .footer .container a {
  text-decoration: none;
  color: #ffffff;
}

.modal-dialog {
  max-width: 40vw;
}

.modal-dialog .modal-content {
  border-radius: 0;
}

.modal-dialog .modal-content .modal-body {
  padding: 2rem;
}

.modal-dialog .modal-content .modal-body > .btn-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.modal-dialog .modal-content .modal-body > .btn-close:hover {
  background: transparent;
  border: none;
  background: transparent var(--bs-btn-close-bg) center/1em auto no-repeat !important;
}

#shiny-modal .modal-title {
  font-weight: bold;
  width: 100%;
}

#shiny-modal .modal-sequence {
  word-break: break-all;
}

#shiny-modal i.fa-xmark {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  cursor: pointer;
}

.info-button-parent {
  align-items: center;
  gap: 1rem;
  width: fit-content;
}

.info-button-parent .info-button {
  color: #ff4f00;
  background: #ffffff;
  border: 2px solid #ff4f00;
  height: calc(1.25rem + 4px);
  aspect-ratio: 1/1;
  font-size: 0.75rem;
  box-sizing: border-box;
  border-radius: 100%;
  cursor: pointer;
}

.info-button-parent .info-button i {
  color: #ff4f00;
  cursor: pointer;
}

a[href=""] {
  pointer-events: none;
}

.shiny-output-error,
.no-data {
  width: 100%;
  min-height: 200px;
  background: rgba(255, 79, 0, 0.5);
  padding: 3rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  color: #000000;
}

.info-tooltip {
  --bs-tooltip-bg: #f9f9f9;
}

.info-tooltip .tooltip-inner {
  color: #000000;
}

.hide-search-content {
  visibility: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  max-height: 0 !important;
}

#ss-connect-dialog {
  border-radius: 0.5rem !important;
  padding: 2em !important;
}

#ss-connect-dialog::before {
  color: #000000;
  font-weight: bold;
  font-size: 1.25rem;
}

#ss-connect-dialog a {
  text-decoration: none;
  margin-top: 30px !important;
}

#ss-connect-dialog a::before {
  content: "Refresh" !important;
  padding: 0.75em 2em;
  text-decoration: none;
  border: 2px solid #ffcd00;
  color: #000000;
  background-color: #ffcd00;
}

#ss-connect-dialog a:hover::before {
  background-color: #ffcd00;
  color: #000000;
  border: 2px solid #ffcd00;
  text-decoration: none !important;
}

#page-wrapper #chat-page .page-section {
  width: 60%;
}

#page-wrapper #chat-page .page-section h5 {
  margin-bottom: 1rem;
}

@media screen and (max-width: 1400px) {
  #page-wrapper #chat-page .page-section {
    width: 80%;
  }
}

#page-wrapper #chat-page #first-chat-section {
  gap: 2rem;
  padding-bottom: 100px;
}

#page-wrapper #chat-page #first-chat-section div:first-child {
  width: 60%;
}

#page-wrapper #chat-page #first-chat-section .beta-message {
  width: 10%;
  flex-grow: 1;
}

#page-wrapper #chat-page #first-chat-section .beta-message ul {
  margin-bottom: 0;
}

@media screen and (max-width: 1400px) {
  #page-wrapper #chat-page #first-chat-section {
    width: 100%;
  }
  #page-wrapper #chat-page #first-chat-section div:first-child {
    width: 60%;
  }
}

#page-wrapper #chat-page #chat-parent .spinner-container {
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

#page-wrapper #chat-page #chat-parent .spinner-visible {
  display: flex !important;
}

#page-wrapper #chat-page #chat-parent .spinner {
  border: 4px solid #f3f3f3;
  /* Light grey */
  border-top: 4px solid #007bff;
  /* Bootstrap blue */
  border-radius: 50%;
  width: 30px;
  height: 30px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

#page-wrapper #chat-page #chat-parent .text-visible {
  display: block !important;
}

#page-wrapper #chat-page #chat-parent .text-invisible {
  display: none !important;
}

#page-wrapper #chat-page #chat-parent > div:first-child > .shiny-text-output {
  margin-left: auto;
  width: fit-content;
}

#page-wrapper #chat-page #chat-parent > div {
  border-top: 2px solid #000000;
  padding: 0;
}

#page-wrapper #chat-page #chat-parent > div h5 {
  font-weight: bold;
  margin: 0.75rem 0;
}

#page-wrapper #chat-page #chat-parent div:first-child .form-group {
  max-width: unset;
  width: 100%;
}

#page-wrapper #chat-page #chat-parent div:first-child .form-group textarea {
  border-radius: 0px;
  border: 1px solid black;
  width: 100%;
  min-height: 200px;
}

#page-wrapper #chat-page #chat-parent div:first-child .form-group + div {
  gap: 1rem;
  align-items: end;
}

#page-wrapper #chat-page #chat-parent div:first-child .form-group + div .link-btn {
  margin-right: auto;
}

#page-wrapper #chat-page #chat-parent div:first-child .form-group + div .white-btn {
  padding: 0.5rem;
  aspect-ratio: 1/1;
  height: 100%;
  justify-self: end;
  font-size: 1.4rem;
  line-height: 1.2rem;
}

#page-wrapper #chat-page #chat-python_output h1 {
  font-size: 16px;
  color: #444;
  font-weight: bold;
  font-style: italic;
  font-family: "Courier";
}

#page-wrapper #chat-page .accordion-item {
  border-color: #f9f6f1;
  border-radius: 0;
}

#page-wrapper #chat-page .accordion-item .accordion-header button {
  background-color: #f9f6f1;
  color: #000000;
}

#page-wrapper #chat-page .accordion-item .accordion-header button:focus {
  box-shadow: none;
  background-color: #f9f6f1;
  color: #000000;
}

#page-wrapper #chat-page .accordion-item .accordion-body {
  background-color: #f9f6f1;
}

#page-wrapper #chat-page .accordion-item .accordion-header button::after {
  content: "+";
  background-image: none;
  font-size: 2rem;
  line-height: 1rem;
  max-width: 1rem;
  overflow: hidden;
}

#page-wrapper #chat-page .accordion-item .accordion-header button[aria-expanded="true"]::after {
  content: "—";
}

#page-wrapper #chat-page .accordion {
  margin-top: 2rem;
  max-height: 300px;
  overflow-y: auto;
}

#page-wrapper #chat-page .accordion-header button {
  font-weight: bold;
}

#page-wrapper #chat-page p:empty {
  display: none;
}

#page-wrapper #chat-page #show-example-text {
  align-items: center;
  gap: 0.5rem;
}

#page-wrapper #chat-page #show-example-text bslib-tooltip {
  pointer-events: none;
}

#chat-modal-content {
  gap: 10px;
}

#genomes-page .genomes-page-two #genome-tiles {
  margin: 3rem 0;
  gap: 3rem;
  display: grid;
  grid-template-columns: 1fr;
  --tiles-in-row: 5;
  grid-template-columns: repeat(var(--tiles-in-row), 1fr);
}

@media screen and (max-width: 1400px) {
  #genomes-page .genomes-page-two #genome-tiles {
    --tiles-in-row: 4;
  }
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile {
  border-top: 1px solid grey;
  padding-top: 0.5rem;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-image {
  margin: 0.5rem 0;
  aspect-ratio: 1 / 1;
  width: 100%;
  background-color: #99afc6;
  position: relative;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-image img {
  aspect-ratio: 1 / 1;
  width: 100%;
  position: absolute;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-image img::before {
  color: transparent;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-image i {
  color: #ffffff;
  font-size: 4rem;
  position: absolute;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-link {
  border-left: 0.75rem solid #ffcd00;
  padding-left: 0.5rem;
  align-items: center;
  text-decoration: none;
  gap: 1rem;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-link * {
  color: #000000;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-link *:hover, #genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-link:hover {
  cursor: pointer;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-link p:hover {
  text-decoration: underline;
}

#genomes-page .genomes-page-two #genome-tiles .genome-tile .genome-link p {
  margin: 0;
  font-size: 1.2rem;
}

#genomes-page .genomes-page-two .load-more {
  width: fit-content;
  margin: 1rem auto;
  color: #000000;
  background: #ffcd00;
  border: 2px solid #ffcd00;
}

#genomes-page .genomes-page-two .load-more:hover {
  color: #ffcd00;
  background: #ffffff;
  border: 2px solid #ffcd00;
}

#genomes-page #samples-parent {
  gap: 2rem;
}

#genomes-page #samples-parent > div {
  gap: 0.5rem;
}

#genomes-page #samples-parent > div strong {
  margin-bottom: 0.5rem;
  font-size: 1.2em;
}

#genomes-page #samples-parent > div .samples-legend-item {
  align-items: center;
  gap: 1rem;
}

#genomes-page #samples-parent > div .samples-legend-item .samples-legend-color {
  width: 20px;
  height: 20px;
  border-radius: 100%;
  border: 1px solid #000000;
}

#genomes-page #samples-parent > div .samples-legend-item p {
  margin: 0;
}

#edna-map-page .map-page-one table thead tr th:last-child {
  padding: 0;
}

#edna-map-page .map-page-one #samples-map-parent {
  gap: 3rem;
}

#edna-map-page .map-page-one #samples-map-parent > *:first-child {
  width: 60%;
}

#edna-map-page .map-page-one #samples-map-parent > .flex-col {
  gap: 0.5rem;
}

#edna-map-page .map-page-one #samples-map-parent > .flex-col .samples-legend-item {
  align-items: center;
  gap: 1rem;
}

#edna-map-page .map-page-one #samples-map-parent > .flex-col .samples-legend-item .samples-legend-color {
  width: 20px;
  height: 20px;
  border-radius: 100%;
  border: 1px solid #000000;
}

#edna-map-page .map-page-one #samples-map-parent > .flex-col .samples-legend-item p {
  margin: 0;
}

#edna-map-page .map-page-one #krona-filters {
  gap: 2rem;
}

#edna-map-page .map-page-one #krona-filters .selectize-input {
  border: 1px solid #000000;
}

#edna-map-page .map-page-two #genome-tiles {
  margin: 3rem 0;
  gap: 3rem;
  display: grid;
  grid-template-columns: 1fr;
  --tiles-in-row: 5;
  grid-template-columns: repeat(var(--tiles-in-row), 1fr);
}

@media screen and (max-width: 1400px) {
  #edna-map-page .map-page-two #genome-tiles {
    --tiles-in-row: 4;
  }
}

#edna-map-page .map-page-two #genome-tiles .genome-tile {
  border-top: 1px solid grey;
  padding-top: 0.5rem;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-image {
  margin: 0.5rem 0;
  aspect-ratio: 1 / 1;
  width: 100%;
  background-color: #99afc6;
  position: relative;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-image img {
  aspect-ratio: 1 / 1;
  width: 100%;
  position: absolute;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-image img::before {
  color: transparent;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-image i {
  color: #ffffff;
  font-size: 4rem;
  position: absolute;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-link {
  border-left: 0.75rem solid #ffcd00;
  padding-left: 0.5rem;
  align-items: center;
  text-decoration: none;
  gap: 1rem;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-link * {
  color: #000000;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-link *:hover, #edna-map-page .map-page-two #genome-tiles .genome-tile .genome-link:hover {
  cursor: pointer;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-link p:hover {
  text-decoration: underline;
}

#edna-map-page .map-page-two #genome-tiles .genome-tile .genome-link p {
  margin: 0;
  font-size: 1.2rem;
}

#edna-map-page .map-page-two .load-more {
  width: fit-content;
  margin: 1rem auto;
  color: #000000;
  background: #ffcd00;
  border: 2px solid #ffcd00;
}

#edna-map-page .map-page-two .load-more:hover {
  color: #ffcd00;
  background: #ffffff;
  border: 2px solid #ffcd00;
}

#edna-map-page #map-header {
  justify-content: space-between;
}

#edna-map-page .map-filters {
  gap: 2rem;
  align-items: flex-end;
}

#edna-map-page .map-filters .virtual-select > .vscomp-ele-wrapper > .vscomp-toggle-button,
#edna-map-page .map-filters .daterangepickerclass,
#edna-map-page .map-filters .selectize-input {
  border-radius: 0;
  border: 1px solid #000000;
  font-size: inherit;
  padding: 0.375rem 0.75rem;
  min-height: calc(1.5em + 0.75rem + 2px);
}

#edna-map-page .map-filters .virtual-select > .vscomp-ele-wrapper > .vscomp-toggle-button.focus,
#edna-map-page .map-filters .daterangepickerclass.focus,
#edna-map-page .map-filters .selectize-input.focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 79, 0, 0.25);
}

#edna-map-page .map-filters .virtual-select > .vscomp-ele-wrapper > .vscomp-toggle-button .vscomp-value,
#edna-map-page .map-filters .daterangepickerclass .vscomp-value,
#edna-map-page .map-filters .selectize-input .vscomp-value {
  height: 1.5rem;
  line-height: 1.5rem;
}

#edna-map-page .map-filters .daterangepickerclass {
  text-align: center;
}

#edna-map-page .map-filters .daterangepickerclass:focus {
  outline: none;
}

#edna-map-page .map-filters .selectize-dropdown {
  border-radius: 0;
}

#edna-map-page .map-filters .selectize-dropdown .selectize-dropdown-content .option.selected {
  background-color: #ff4f00;
  color: #000000;
}

#edna-map-page table {
  max-width: 100% !important;
}

#edna-map-page table .seqence-col {
  position: relative;
  width: 100%;
}

#edna-map-page table .seqence-col:first-child {
  text-wrap: wrap;
  word-break: break-word;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  /* Max 3 lines */
  -webkit-box-orient: vertical;
}

#edna-map-page table .seqence-col .overlay {
  background: #ffffff;
  padding: 0 0.5rem;
  align-items: center;
  position: absolute;
  right: 0;
  bottom: 0;
}

#edna-map-page table .seqence-col .overlay .read-more {
  color: #ff4f00;
  text-decoration: underline;
  cursor: pointer;
  padding-left: 2rem;
}