/* Based off bioshare.css */

html {
    overflow: -moz-scrollbars-vertical;
    overflow-x: auto;
}

/* EGRP overrides */
.navBar {
    background: #0f2443;
}

.breadcrumb {
    padding: 6px 12px;
}

footer {
    background: #14315c;
    margin-top: 0em;
}

[role="main"] a {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

.date {
    min-width: 0;
    padding: 0.375rem 0.75rem;
    text-align: start;
}

#request-tabs {
    background: #f2f2f2;
}

.nav-tabs .nav-link::after {
    background: #484068;
}

.project-tracking-section-label {
    color: #2f70a8 !important;
    padding-bottom: 20px;
}

.tog-content a {
    text-decoration: underline;
}

.context-footer {
    margin-top: 2rem;
}

/* End EGRP overrides */

#request-tabs > .nav-item > .nav-link {
    padding: 0.5rem 0.625rem;
    display: block;
    box-shadow: none;
}

.request-btns {
    min-height: 2.875rem;
}

span.highlight {
    background-color: #ffa;
}

.container-fluid {
    padding-left: 5%;
    padding-right: 5%;
}
.page-header {
    border-bottom: none !important;
    margin-bottom: 0px !important;
    margin-top: 0px;
    padding-bottom: 0px !important;
}

a.skipnav {
    display: block;
    padding: 4px 0px;
    text-align: center;
}

#header-right {
    padding-top: 10px;
}
#header,
#nav,
#main {
    background-color: #fff;
}
#header .dropdown-menu,
#nav .dropdown-menu {
    min-width: 100%;
}

.hidden-icon {
    visibility: hidden;
}

.cursor-waiting {
    cursor: wait !important;
}

@media (min-width: 576px) {
    #search_and_login .dropdown {
        text-align: right;
        padding-bottom: 25px;
    }
}

/* Pgsearch */
.results-header {
    background-color: var(--bs-body-bg);
}

.form-check-input.pgsearch-toggle:checked {
    background-color: var(--bs-body-color);
    border-color: var(--bs-body-color);
}

.pgsearch-results-table th a {
    color: #333;
}

.keyword-helptext-icon {
    background-color: transparent;
    border: none;
}

.search-facet-label,
.keyword-helptext-icon {
    color: #006ee4;
}

button.add-additional-facets {
    margin-top: 1rem;
}

/* Wayf */
.idp {
    margin-top: 10px;
    margin-bottom: 10px;
}
#no-idp-note {
    margin-top: 10px;
    border-top: 1px dotted black;
}

/* Nested Comments (NOT Comments tab specific) */
.last_edited {
    font-size: smaller;
    font-style: italic;
    color: rgb(0, 0, 0, 0.5);
}
.comment-header.row {
    margin-left: 0;
}
div.comment-header {
    border: none;
}
.action-trigger-container {
    white-space: nowrap;
    display: inline-block;
}
.action-trigger-container > a {
    margin-right: 10px;
}
.action-trigger-container span {
    font-size: 12px;
}
.posting-user {
    font-size: 16px;
    font-weight: 700;
}
.comment-date-created {
    display: block;
    font-family: "Open Sans Condensed", "Arial Narrow", sans-serif;
    font-weight: normal !important;
    color: #767676;
}
.comment-header-right {
    float: right;
}
.comment-container {
    margin: 0px;
    padding: 15px 0px 15px 15px;
}
div.left-comment-indent {
    padding: 0px;
    margin-left: 50px;
    border-left: 1px solid rgb(0, 0, 0, 0.2);
}

.comments-node-container {
    position: relative;
    border-bottom: 1px solid rgb(0, 0, 0, 0.2);
}
.comments-node-container:not(.comments-wrapper) {
    overflow: auto;
}

/* Make sure the wrapper does not show a bottom border before initialization begins */
.comments-wrapper {
    border-bottom: none;
}

div.comment-body {
    margin: 5px 0px 0px 15px;
}
span.last_edited {
    display: block;
    margin-bottom: 10px;
}

/* Comments which are purely status change comments, with an immediate sibling
   that is also purely a status change comment. */
.inner-comments-node-container {
    border-bottom: none;
}

/* Bring status change comments closer together */
.inner-comments-node-container > .comment-container {
    padding-bottom: 0px;
}

/* Leaf comments. */
.leaf-comments-node-container {
    border-bottom: none;
}

@media (min-width: 768px) {
    .comment-header-right {
        text-align: right;
    }
    .action-trigger-container > a > i.fa {
        margin-right: 5px;
    }
}
@media (max-width: 767px) {
    .action-trigger-container {
        display: block;
    }
    i.hidden-icon {
        display: none;
    }
    .comment-header-right {
        float: none;
    }
}

.comment_textarea {
    width: 100%;
    resize: vertical;
}

.original-message {
    margin-left: auto;
}

.comment-attachments {
    background: whitesmoke;
    padding-bottom: 10px;
}

.list-unstyled.attachments li {
    padding: 10px;
}

.node-has-children:not(.last-node-container) {
    border-bottom: 1px solid rgb(0, 0, 0, 0.2);
}

.last-node-container .comment-container,
.node-has-children > .comment-container,
.comments-node-container[data-level="0"] {
    border-bottom: none;
}

/* 404 */
#page-not-found-wrapper {
    text-align: center;
}
#page-not-found-wrapper p a {
    font-weight: bold;
}

/* Navigation */
.home .nav-home,
.about .nav-about,
.requests .nav-requests,
.studies .nav-studies,
.specimens .nav-specimens,
.publications .nav-publications,
.faq .nav-faq,
.histology .nav-histology,
.reports .nav-reports,
.admin .nav-admin {
    background-color: #5b5b5b;
}

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
    color: #6b6c70;
}

#main {
    padding-bottom: 60px;
}

.btn > i.fa,
.btn > span.fa {
    margin-right: 4px;
}

#profile-instructions {
    margin-bottom: 15px;
}

.form-group ul.errorlist {
    list-style-type: none;
    margin: 5px 0 0 !important;
    padding: 0;
}
.form-group ul.errorlist li {
    color: #dc3545;
}

.form-group.required > label:after,
.form-group.required > legend:after,
.form-group.required .form-check-inline:after,
.form-group.required .controls.clearfix > .form-check-label:after {
    content: " (required)";
    font-style: italic;
    font-weight: 300;
}

.form-wrap {
    margin-right: -15px;
}
.form-wrap .form-group {
    float: left;
    width: 33.3333%;
    padding-right: 15px;
    height: 100px;
}
.form-wrap .form-group.double {
    width: 66.6667%;
}
.form-wrap .form-group.block {
    clear: left;
    width: 100%;
    height: auto;
}

.form-actions {
    margin-top: 15px;
    margin-bottom: 15px;
}
.pagination {
    margin: 0;
}

.popover-footer {
    padding: 8px 14px;
    border-top: 1px solid #ebebeb;
    text-align: right;
    white-space: nowrap;
}

.request-header {
    background-color: #fff;
}
.affix {
    position: static;
}

.post-req-update {
    margin-left: 10px;
}
#refresh-warning {
    margin-bottom: 10px;
}
.alert-success {
    background-color: #2f70a8;
    color: #fff;
}
.masquerade-menu {
    right: 0;
    left: auto;
}
.request-info {
    margin: 0;
    border-top: 1px solid #dee2e6;
    background-color: #f2f2f2;
}
.request-workflow {
    margin: 0;
    background-color: #f4f4f4;
}
.request-info > div {
    padding-top: 5px;
    padding-bottom: 5px;
}
.request-workflow > div {
    padding-bottom: 10px;
}
.request-workflow .workflow-buttons {
    display: inline-block;
}
.workflow-button-margins {
    margin-left: 5px;
}
.request-info label {
    margin-bottom: 0px;
}

#change-type-status label {
    margin-bottom: 0px;
}

ul.attachments {
    margin-top: 10px;
}
ul.attachments li {
    height: 1.5em;
    margin-bottom: 4px;
}
.attachments-container > .error {
    font-weight: bolder;
    color: red;
    border: 1px solid red;
    padding: 2px;
    margin: 10px 0;
}

.table-site-search em,
em.highlight {
    display: inline-block;
    padding: 0px 3px;
    background-color: #ffa;
    border: 1px solid #eee;
    border-radius: 2px;
    color: black;
}

.expand-updates {
    display: block;
    text-align: center;
}

/* Status information */
.comment-update-summary {
    color: #767676;
    font-size: smaller;
    font-style: italic;
    margin: 0px;
}

.comment-modified {
    font-style: italic;
    font-size: 80%;
    color: #999;
}

.multi-widget {
    margin-bottom: 10px;
}

.dropdown-container {
    display: inline-block;
    position: relative;
}
#saved-search-container a:hover,
#saved-search-container a:focus,
#saved-search-container a:visited,
#saved-search-container a:active {
    text-decoration: none;
}
#saved-search-header {
    display: none;
}
#results-count-header {
    display: flex;
}
#results-count-header.scroll-to-fixed-fixed {
    background-color: white;
}
.nav > li.display-none {
    display: none;
}
.display-none {
    display: none;
}

#ui-datepicker-div {
    z-index: 100000 !important;
}

div.tab-pane .input-group {
    width: 100%;
}

.smBtn {
    width: auto;
    float: right;
}
.blue-icon span.fa {
    background-color: #26557e;
    color: #fff;
    padding: 0.75em;
    margin-right: 10px;
}
a.btn.blue-icon {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    width: auto;
}
#cart-header {
    display: inline-block;
}

.search-tabs {
    position: relative;
}
#shadow-pane {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    background: rgb(255, 255, 255, 0.5);
    z-index: 100000;
    display: none;
}
#shadow-pane .spinner-wrapper {
    padding: 10%;
    text-align: center;
    position: sticky;
    top: 0;
}
#shadow-pane .spinner-border {
    height: 3rem;
    width: 3rem;
}

.form-check .handle {
    color: #ccc;
}
.form-check .handle-wrapper {
    float: right;
}

.facets .facet a[role="button"] label {
    cursor: pointer;
}
.unselected-facet {
    display: none;
}

#display fieldset {
    -webkit-padding-before: 0;
    -webkit-padding-after: 0;
}
#display-sortable div.form-check:first-child {
    margin-top: 0;
}

#loading-spinner {
    text-align: center;
}

#return-btn {
    margin-bottom: 20px;
}
.page-size-selector {
    display: inline-block;
    vertical-align: top;
    margin: 7px;
}
.pager {
    display: inline-block;
}

.display-tab-update-button-wrapper {
    margin-bottom: 10px;
}
#add-additional-facets {
    margin-top: 15px;
}

/* Sorting/Paging */

th.sort {
    background-repeat: no-repeat;
    background-position: left center;
}

div.post {
    margin-bottom: 40px;
}
ul.pagination li.page-item a.next {
    float: right;
}
ul.pagination li.page-item a.prev {
    margin-right: 20px;
}

.byline {
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
}
.byline > div {
    padding-bottom: 4px;
    font-weight: 500;
    color: #666;
}

.form-group > .controls > ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.form-group > .controls > ul > li > label {
    font-weight: normal;
}

.tab-content .instructions {
    background-color: #d9edf7;
    color: #31708f;
    border: 1px solid #bce8f1;
    border-radius: 4px;
    margin-bottom: 20px;
    padding: 15px;
}

div.tooltip-wrapper {
    display: inline-block;
}
div.tooltip-wrapper .btn[disabled] {
    /* don't let button block mouse events from reaching wrapper */
    pointer-events: none;
}
div.tooltip-wrapper.disabled {
    /* OPTIONAL pointer-events setting above blocks cursor setting, so set it here */
    cursor: not-allowed;
}

/** Default Homepage Styles **/

/* Clearfix */
.cf:before,
.cf:after {
    content: "";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    zoom: 1;
}

.roles-popup {
    padding-top: 15px;
    padding-bottom: 15px;
}

.roles-size {
    width: 40%;
}

/* Responsive Images */
img {
    max-width: 100%;
    height: auto;
    width: auto;
}

.summary-list {
    margin: 2em 0;
    padding: 0;
}
.summary-list li {
    float: left;
    width: 44%;
    margin: 0 0 1.5em 6%;
    padding: 0;
}
.summary-list .fa-li {
    font-size: 75%;
    color: #f26724;
    left: -2.3em;
    top: 0.5em;
}
@media (max-width: 47.99em) {
    .summary-list li {
        float: none;
        width: auto;
        margin: 0 0 1em 2em;
    }
}

/* Call to Action Area */
.grayBox {
    background: #fafafa;
    padding: 1em;
    margin-bottom: 1em;
    border: 1px solid #d5dce3;
    box-shadow: 0 0 5px rgb(0, 0, 0, 0.2);
    border-radius: 5px;
}

.ctaWrap {
    list-style: none;
    padding: 1em;
    margin: 0;
    background: #ebebeb;
    border-radius: 4px;
    box-shadow: inset 0 0 5px rgb(0, 0, 0, 0.1);
}

.largeRequestButton {
    display: block;
    padding-left: 2em;
    font-size: 1.15em;
    margin-bottom: 0.75em;
    border-radius: 6px;
    box-shadow: inset 0 -20px 0 rgb(0, 0, 0, 0.1);
    color: #fff;
    font-weight: bold;
    text-shadow: 0 1px 0 rgb(0, 0, 0, 1);
    letter-spacing: 0.06em;
    transition: box-shadow 0.1s linear;
}

.largeRequestButton:hover,
.largeRequestButton:focus {
    color: #fff;
    text-decoration: none;
    box-shadow: inset 0 0 0 rgb(0, 0, 0, 0.1);
    transition: box-shadow 0.1s linear;
}

a.largeRequestButton {
    background: #0c798a;
    border: 1px solid #176e8b;
}

a.largeRequestButton > span {
    display: block;
    padding: 0.6em 1em 0.6em 2.5em;
}

@media (max-width: 74.99em) {
    .ctaWrap {
        margin-bottom: 2em;
    }
}

@media (max-width: 61.99em) {
    .ctaWrap {
        margin-bottom: 0;
    }
}

@media (max-width: 47.99em) {
    .ctaWrap {
        margin-bottom: 2em;
    }
}

@media (max-width: 29.99em) {
    .largeRequestButton {
        padding-left: 1.5em;
        font-size: 1em;
        letter-spacing: 0.01em;
    }
}

.grayButton {
    color: #646464 !important;
    font-weight: normal;
    background-color: #f5f5f5;
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #b3b3b3 !important;
    border-radius: 4px;
    box-shadow:
        0 1px 0 rgb(255, 255, 255, 0.2) inset,
        0 1px 2px rgb(0, 0, 0, 0.05);
    text-align: center;
    text-shadow: 0 1px 1px rgb(255, 255, 255, 0.75);
    vertical-align: middle;
}

.grayButton-block {
    width: 100%;
}

.grayButton:hover,
.grayButton:focus {
    background-color: #f5f5f5;
    color: #646464;
    background-image: linear-gradient(to bottom, #ffffff, #eee);
}

/* Help Section */
.home-help-section {
    background-color: #f1f1f1;
    font-size: 1.4em;
    font-weight: bold;
    margin-bottom: 1em;
    padding: 0.5em 2%;
    border-radius: 5px;
}

.icn-question {
    padding: 0.9em 0 0.9em 3.5em;
    display: inline-block;
    text-decoration: none;
    color: #3f68a8;
    line-height: 1.2;
}

.home-help-section .btn {
    margin-top: 1.2em;
}

@media (max-width: 1199px) {
    .btn-contact {
        margin-top: 1.75em;
    }
}

@media (max-width: 61.99em) {
    .home-help-section {
        font-size: 1.5em;
    }
    .home-help-section .btn {
        margin-top: 0.75em;
    }
}

@media (max-width: 29.99em) {
    .home-help-section {
        font-size: 1.2em;
    }
}

/*** Bootstrap additions ***/

/* Horizontal card: https://gist.github.com/seyDoggy/3946b2603ac8026a25d3 , http://jsfiddle.net/seydoggy/9jv5e8d1/ */
.card.card-horizontal {
    display: table;
    width: 100%;
}
.card.card-horizontal > .card-header,
.card.card-horizontal > .card-body,
.card.card-horizontal > .card-footer {
    display: table-cell;
}
.card.card-horizontal > .card-header,
.card.card-horizontal > .card-footer {
    text-align: center;
    vertical-align: middle;
    border: 0;
}
.card.card-horizontal > .card-header {
    border-right: 1px solid #ddd;
    border-top-right-radius: 0;
    border-bottom-left-radius: 3px;
}
.card.card-horizontal > .card-footer {
    border-left: 1px solid #ddd;
    border-top-left-radius: 0;
    border-bottom-right-radius: 3px;
}

/* Recovering btn-xs because it was removed from Bootstrap 4 with no replacement */
.btn-xs,
.btn-group-xs > .btn {
    padding: 0.0625rem 0.3125rem;
    font-size: 0.75rem;
    line-height: 1.5;
    border-radius: 0.1875rem;
}

/* Recovering badge color changing behavior from Bootstrap 3, while using new Bootstrap 4 colors (badge-light and badge-secondary) */
.nav-link:not(.active) .badge-light,
.list-group-item:not(.active) .badge-light {
    background-color: #6c757d;
    color: #fff;
}

/* Bootstrap overrides */
.table th {
    border-top: none;
}

label {
    font-weight: bold;
}
.form-check-label {
    font-weight: normal;
}

.has-error input,
.has-error textarea,
.has-error select {
    background-color: #fee;
}

.form-control-file {
    width: initial;
}

.table tr.header td,
.table tr.header th {
    color: #999;
    font-size: 80%;
}
.legend {
    color: #666;
    margin-right: 10px;
}
.nowrap {
    white-space: nowrap;
}
.large-icon {
    font-size: 200%;
}
.btn-inline {
    margin-left: 10px;
}

img.external {
    vertical-align: baseline;
}

@media (min-width: 768px) {
    #header {
        text-align: left;
    }
    #header > .dropdown {
        float: right;
    }

    .byline .timestamp {
        text-align: right;
    }
    .icon-controls {
        float: right;
    }
    ul.nav-justified > li > a {
        white-space: nowrap;
        padding: 0 13px;
    }
    .navbar-header {
        display: none;
    }

    /* set padding for all */

    /* .nav-home span,
    .nav-about span,
    .nav-requests span,
    .nav-studies span,
    .nav-specimens span,
    .nav-publications span,
    .nav-faq span,
    .nav-histology span,
    .nav-reports span,
    .nav-admin span {
        padding: 10px 2px;
        border-bottom: 3px solid transparent;
    } */

    /* .tab-content { margin-top: 20px; } */
}

.divider {
    height: 1px;
    width: 100%;
    display: block; /* for use on default inline elements like span */
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5;
}

@media (min-width: 1210px) {
    #req-tabs-select {
        display: none;
    }
    #request-tabs {
        display: flex;
    }
}

#criteria .dropdown-item {
    width: 250px;
    white-space: normal;
}

#criteria .dropdown-item > a {
    white-space: normal;
    display: inline-block;
}

.card-content .btn {
    background-color: #2f70a8;
    color: #fff;
    border-color: initial;
}
.btn.btn-primary {
    background-color: #2f70a8;
    color: #fff;
    border-color: initial;
}

.btn.btn-primary:hover,
.btn.btn-focus,
.btn.btn-primary:not(:disabled, .disabled):active,
.show > .btn.btn-primary.dropdown-toggle {
    background: #183a57;
}

/* SmartMenu/New Layout */

/* Bootstrap Overwrites/Additions/Fixes */

/* Bootstrap has no way to eliminate the gutters between columns. Add helper class. */
.no-gutter {
    margin: 0;
}
.no-gutter > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}

/* The close button has opacity that makes it fail a contrast check and it has no visual focus cue. Opacity turned off, focus style added. */
.close {
    opacity: 1;
}
.close:focus {
    outline: 1px dotted #000;
}

#menu-button:hover {
    background: #eee;
    color: #333333;
}

.role-edit-form .select2-search-choice {
    width: 32%;
}

#permissions-list-link {
    padding-left: 5px;
    cursor: pointer;
}

.select2-buttons,
.range-buttons,
.text-facet-buttons {
    margin-top: 5px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~Table Gradient Styling~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.table-gradient .table {
    margin-bottom: 0px;
}

.table-gradient thead tr {
    background-color: #ffffff;
}

.table-gradient {
    position: relative;
}

.table-gradient a.gradient {
    position: absolute;
    top: 0;
    font-size: 3em;
    color: #333333;
    text-shadow: 0px 0px 34px #ffffff;
    height: 100%;
    width: 2em;
    text-align: center;
    cursor: pointer;
    z-index: 999;
}

.table-gradient #scroll-side-right {
    background-image: linear-gradient(to left, rgb(158, 158, 158, 0.6), rgb(255, 255, 255, 0));
    right: 0;
}

.table-gradient #scroll-side-right:hover {
    background-image: linear-gradient(to left, #7979798a, #fff0);
    color: #2c71ad;
}

.table-gradient #scroll-side-left {
    background-image: linear-gradient(to right, rgb(158, 158, 158, 0.6), rgb(255, 255, 255, 0));
    left: 0;
}

.table-gradient #scroll-side-left:hover {
    background-image: linear-gradient(to right, #7979798a, #fff0);
    color: #2c71ad;
}

.gradient {
    visibility: hidden;
}

.gradient:hover {
    text-decoration: none;
}

.scroll-arrow {
    position: absolute;
}

#scroll-side-arrow-left {
    left: 18.6px;
}

.gradient .scroll-arrow:after {
    font-family: FontAwesome;
    position: relative;
    font-size: 0.65em;
    z-index: 999;
    text-shadow: 0 0 28px #ffffff;
    color: #2c71ad;
}

.gradient #scroll-side-arrow-left:after {
    content: "\f137";
    color: #183a57;
}

.gradient #scroll-side-arrow-right:after {
    content: "\f138";
    color: #183a57;
}

.gradient .scroll-arrow:hover {
    text-decoration: none;
    cursor: pointer;
}

@media (max-width: 768px) {
    .gradient .scroll-arrow:after {
        content: none;
    }
}

@media (max-width: 500px) {
    .table-gradient a.gradient {
        font-size: 1em;
    }
}

@media (max-width: 1000px) {
    .float-right {
        float: none !important;
    }
}
@media (max-width: 500px) {
    .table-gradient span[id*="scroll-side-arrow-"] {
        display: none;
    }
}

/*
Hide the "today" button from the jQuery UI Datepicker because it doesn't do what you think it supposed to do
*/
button.ui-datepicker-current {
    display: none;
}

/*** Study Details Page ***/
#publications {
    font-size: 1.3em;
    margin-bottom: 15px;
}

.publication_group_block {
    border: 1px solid lightgrey;
    border-radius: 5px;
    background-color: #f5f5f5;
    padding: 10px;
    margin: 0 0 20px;
}

#document-type-form {
    margin-top: 20px;
}

.comment-btns {
    margin: 10px auto 10px 10px;
}

.comment-visible-fields {
    overflow: auto;
    margin-left: 10px;
}

.comment-link {
    padding: 0;
    margin-right: 0;
}

/* Request header 'Idle Date' info icon link to modal */

#request-idle-dialog-link {
    padding-left: 5px;
    cursor: pointer;
}

/* Data tables */

.dataTable > .row {
    width: 100%;
}
.dataTable {
    width: 100%;
}

.inline-label {
    display: inline;
}

/* Voter review forms */
#responses_dropdown {
    display: inline-block;
}

/********** Below NOT Taken from Bioshare **********/

/* Project Hub's leftnav, taken from parent site's leftnav styling */
.subNav li a:hover,
.subNav li a:focus,
.subNav li.is-hover > a {
    background: #f9f9f9;
    border-left-color: #2f70a8;
}
.subNav li a,
.subNav li .no-link {
    background: #f2f2f2;
    display: block;
    padding: 10px 35px 10px 10px;
    border-left: 5px solid #f2f2f2;
    line-height: 1.2;
    transition: all 0.1s linear;
}
.subNav li a.active {
    border-left-color: #2f70a8;
    background: #f9f9f9;
    color: #363636;
}

.sgBox {
    border-style: solid;
    border-color: #b4b8bc;
    border-width: 2px;
    background-color: #f8f8f8;
    margin-inline: 2%;
    margin-top: 2%;
    padding: 2%;
}
.sgLogo {
    max-height: 80px;
    max-width: 80px;
}
.sgTogContent {
    background-color: #ffffff;
}
.sgHome {
    background-color: #f2f2f2;
    border-color: #d9e1e9;
    border-width: 2px;
}
.egrp-login {
    color: #1f496f;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ CKEDITOR ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/**
 * When creating tables in CKEditor, they are wrapped in figure attributes with class "table".
 * This causes them to be always full width, so we unset width here.
 */
figure.ck-widget.table {
    width: unset !important;
}

.ck.ck-icon {
    --ck-icon-size: 15px;
}

.ck-editor__editable[role="textbox"] {
    min-height: 200px;
}

.egrp-facet-button {
    border: none;
    background-color: transparent;
    color: #006ee4;
    font-weight: bold;
}

#report-loading-spinner {
    display: none;
}
.nav-tabs {
    margin-bottom: 0.1vh;
}

#request-tabs > .nav-item > .nav-link.active {
    background: #fff;
}
.dropdown-menu.show {
    z-index: 10000;
}

.results-count-header {
    z-index: 1 !important;
}

.ck-sticky-panel__content_sticky_bottom-limit {
    z-index: 0 !important;
}

#my-documents-table_filter {
    display: none;
}

/* ~~~~~ REQUIRED ASTERISK ~~~~~ */
.bioshare-form-group.required > label:after,
.bioshare-form-group.required legend:after,
.bioshare-form-group.required .form-check-inline:after,
.bioshare-form-group.required .controls.clearfix > .form-check-label:after {
    content: " *";
    color: #999;
}
label,
.form-text {
    margin-bottom: 0px;
}

#id_are_biospecimens_required-label {
    font-weight: bold;
}

h2,
p {
    padding: 0px;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0.5rem;
}

.heading-style {
    background: #f2f2f2;
    border-radius: 4px;
    font-family: "Source Sans Pro", "Lucida Sans Unicode", Arial, sans-serif;
    margin-bottom: 1rem;
    padding-top: 0px;
}
.heading-style span {
    display: inline-block;
    width: 40px;
    padding: 5px 0;
    margin-right: 0.5rem;
    text-align: center;
    background: #31805c;
    color: #fff;
    border-radius: 4px 0 0 4px;
}