.wrapper-drop {
    z-index: 100000;
    position: absolute;
    right: 0;
    top: 20px;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: unset !important;
}

div#human
    :not(#template-content > div > div > div.wrapper-drop > div.nav-item) {
    display: none;
}

.dropdown-menu.show.dropdown-menu-right > a,
#template-content
    > div
    > div
    > div:nth-child(2)
    > div.help-page-content
    > div
    > div
    > div
    > div:nth-child(1)
    > div
    > a {
    color: white !important;
}

.dropdown-menu.show.dropdown-menu-right {
    inset: unset !important;
}

#template-content > div > div > div.wrapper-drop > div.nav-item {
    background-color: var(--color-primary);
    color: white;
    padding: 1px 5px;
    border-radius: 15px;
}

#template-content > div > div > div.wrapper-drop > div.nav-item > a {
    color: white !important;
    font-weight: bold;
}

.component-page-toolbar {
    display: none !important;
}

#filter-panel
    > div.collapse.show
    > div
    > div
    > div
    > div.facet-relations
    > div
    > div.facet__relation__body
    > div
    > div
    > div.FacetSlider--range
    > div
    > div
    > select {
    display: none !important;
}

.small-nav {
    cursor: pointer !important;
}

.header-link {
    color: white !important;
    text-decoration: underline;
}

.FacetSlider--range {
    display: flex;
    gap: 0.8vw;
    zoom: unset !important;
}

.header-link:hover {
    color: white !important;
}

.slick-dots li.slick-active button:before {
    color: var(--color-primary) !important;
}

.SparqlQueryEditor--queryControlPanel {
    gap: 1vw !important;
}

td.annotation-td {
    min-width: 200px !important;
    text-align: right !important;
}

table > thead > tr > th > div > span {
    width: max-content !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary.focus .btn,
button.btn.btn-primary,
.btn-secondary {
    background: none;
    background-color: var(--color-primary);
    border: none;
    color: white;
}

table td,
table th {
    width: max-content !important;
}

button.btn-icon.cardinality-support__remove-value.btn.btn-outline-secondary {
    background-color: var(--color-primary) !important;
}

#template-content
    > div
    > div
    > div
    > div.sidebar-container.d-none.d-lg-block
    > div
    > div.small-nav
    > div.wrapper-drop
    > div.show.dropdown.nav-item
    > div
    > a {
    color: white !important;
}

li.btn.ItemSelector--itemHolder.QueryBuilder--categorySelectionItem[aria-label="Double"] {
    display: none !important;
}

li.btn.ItemSelector--itemHolder.QueryBuilder--categorySelectionItem[aria-label="Research Site"] {
    display: none !important;
}

li.btn.ItemSelector--itemHolder.QueryBuilder--categorySelectionItem[aria-label="Workflow"] {
    display: none !important;
}

td > button {
    min-width: 8vw;
}

#search-results-tabpane-1
    > div
    > div.table-header-container.DataTable--header-container {
    display: none;
}

#knowledge-graph-bar-content > div > div.knowledgeGraphBar__actions > div {
    gap: 0 !important;
}

#template-content
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div.center-table
    > div:nth-child(3)
    > div:nth-child(1)
    > div
    > div
    > a {
    color: var(--color-primary) !important;
}

.nav-title.submenu {
    font-weight: 200 !important;
    margin-top: 3px;
}

#ontology-graph-ontodia
    > div.ontologyOntodia.assetStyles
    > div
    > div
    > div
    > div
    > div
    > div.ontologyToolbar
    > div.ontologyActions
    > div.moreActions.btn-group-sm.show.dropdown
    > div
    > a {
    color: var(--color-primary) !important;
}

button#resources-selection:focus,
button#resource-selection:active {
    color: white !important;
}

#moreActionsToggle:focus,
#moreActionsToggle:active {
    color: white !important;
}

.yasqe_buttons {
    display: none !important;
}

.subheader-title {
    color: white !important;
    margin-bottom: 10px !important;
    text-transform: unset !important;
}

.defaultButton {
    display: flex !important;
}

#template-content > div > div > div > div.help-page-content {
    max-width: 100%;
}

.help-page-content {
    max-width: 90%;
    margin-left: 10%;
}

#template-content
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > div
    > div
    > div.help-page-content {
    max-width: 100% !important;
}

button.btn.btn-secondary.btn-sm.btn-icon.knowledgeGraphBar__copyIri {
    align-items: center;
}

.researchspace-table-widget-holder
    .griddle-filter
    .filter-container
    .form-control {
    background-image: url(/assets/images/icons/icon-search.svg);
    background-repeat: no-repeat;
    background-size: 14px 14px;
    background-position: right 8px center;
}

.btn-group,
.btn-group-sm {
    display: flex;
    gap: 0.5vw !important;
}

body
    > div:nth-child(5)
    > div
    > div
    > div.overlay-modal__body.modal-body
    > div
    > div {
    display: flex !important;
    justify-content: center;
    gap: 1vw;
}

.my-link {
    text-decoration: underline;
    color: var(--color-primary);
}

#application
    > div
    > div.page-holder.page--pageActive.page--knowledgeGraphBarShown.page--knowledgeGraphBarExpanded.page--noBreadcrumbs.isOptional
    > div.component-page-toolbar.hidden-print.btn-toolbar
    > div
    > a {
    background-color: transparent !important;
}

.ontologyBreadcrumbs {
    display: none !important;
}

.DataTable--column-indicator-active,
.DataTable--header-cell:hover .DataTable--column-indicator-trigger {
    background-color: unset !important;
}

.btn-sm.btn-icon.w-auto.px-2.dropdown-toggle.btn.btn-default {
    color: white !important;
    background-color: var(--color-primary) !important;
}

button.btn.btn-sm {
    gap: 0.7vw;
    min-width: 5vw;
    display: flex;
    align-items: center;
}

#ontology-graph-ontodia
    > div
    > div
    > div
    > div
    > div
    > div
    > div.ontology-content
    > div
    > div:nth-child(2)
    > div.ontodia-accordion-item__inner
    > div
    > div
    > div
    > div:nth-child(2)
    > div
    > div
    > div
    > button:focus {
    color: white !important;
}

#ontology-graph-ontodia
    > div
    > div
    > div
    > div
    > div
    > div
    > div.ontologyToolbar
    > div.ontologyActions.ontologyActions--edit {
    background-color: white !important;
}

.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
    background-color: var(--color-primary);
    color: white !important;
}

#structured-search > div:nth-child(1) {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.custom-primary-button:hover,
button.btn.btn-secondary.btn.btn-sm.btn-primary:hover,
button.btn.btn-primary:hover,
.btn-primary button.btn.btn-primary:hover {
    transform: none !important;
    box-shadow: unset;
}

.btn-light:hover {
    color: white;
    background-color: var(--color-primary);
    border-color: unset;
}

.QueryBuilder--searchArea > div:nth-child(1) {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

#noResults {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    align-items: -webkit-center !important;
    text-align: -webkit-center;
    text-align: center;
}

.ItemSelector--itemSelector {
    align-self: center !important;
}

.popover-body,
.popover-header {
    width: 30vw !important;
}

#mp-popover {
    border: none !important;
}

.btnExportJson:hover {
    cursor: pointer !important;
}

.note {
    text-align: center !important;
    color: var(--color-primary);
}

td {
    vertical-align: middle !important;
}

div#filter-panel {
    min-width: fit-content !important;
}

span.LinkSwitcher--linkLabel {
    color: var(--color-primary);
}

.fa {
    color: var(--color-primary);
}

i.fa.fa-filter.DataTable--button-icon-left,
i.fa.fa-search-plus,
i.fa.fa-search-minus,
i.fa.fa-arrows-alt {
    color: white !important;
}

i.fa.fa-filter.DataTable--column-indicator-text,
i.fa.fa-search.DataTable--global-filter-icon {
    color: var(--color-primary) !important;
}

h3,
.h3 {
    font-size: 15px !important;
}

.attr-table {
    padding-left: 4vw !important;
    padding-right: 4vw !important;
}

a#some-ide-tab- {
    font-weight: 100;
}

#filter-panel
    > div.collapse.show
    > div
    > div
    > div
    > div.facet-relations
    > div
    > div.facet__relation__body
    > div
    > div
    > div.FacetSlider--range
    > span {
    display: block !important;
    word-wrap: break-word !important;
}

.center-table {
    padding-left: 4vw;
    padding-right: 4vw;
}

.grey-header {
    flex-direction: column;
    padding: 2vh 7vw;
    min-height: 20vh;
    background-color: var(--color-primary);
    position: relative;
    top: -9vh;
    text-align: -webkit-center;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-grey-shade);
}

.green-header {
    flex-direction: column !important;
    height: 15vh;
    background-color: var(--color-primary);
    position: relative;
    top: -9vh;
    text-align: -webkit-center;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.has-success .form-control {
    color: unset !important;
}

.header-title {
    color: white !important;
}

.mr-5,
.mx-5 {
    margin-right: 0px !important;
}

.mp-breadcrumbs,
ol.page-breadcrumb {
    display: none !important;
}

.modal-btn {
    display: flex;
    text-align: -webkit-center;
    text-align: center;
    justify-content: center !important;
    gap: 1vw !important;
}

input#semantic-search-text-input {
    display: none !important;
}

button.btn.btn-default.btn-xs.pull-right.download-btn:hover {
    color: white !important;
}

.btn-default {
    border-color: var(--color-primary);
}

.btn-default:hover {
    border-color: var(--color-primary);
    background-color: var(--color-primary);
}

#template-content
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > div.page__body
    > a {
    color: white !important;
}

button.semantic-chart__type-button {
    color: white !important;
    background-color: var(--color-primary) !important;
    border-radius: 4px;
    width: 200px;
    align-items: center;
    border: white;
}

th {
    min-width: 100px !important;
}

.small-nav {
    display: flex;
    gap: 1vw;
}

.facet__relation__header {
    min-width: 100px !important;
}

.flex-box-annnotation {
    flex-wrap: wrap !important;
}

#template-content
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > div
    > div
    > div.help-page-content
    > div
    > section:nth-child(4)
    > div
    > div
    > div
    > div
    > div {
    width: 100000px !important;
}

* {
    overflow-wrap: anywhere;
}

#search-results-tabpane-3 > div > div > div > div:nth-child(2) > canvas {
    left: 0px !important;
}

.QueryBuilder--selectedItem {
    overflow: hidden;
}

#structured-search
    > div
    > div.QueryBuilder--searchAreaHolder
    > div
    > div
    > div
    > div.QueryBuilder--activeTerm
    > div
    > div
    > button
    > img {
    filter: url() !important;
}

.grid-resource-link {
    overflow-wrap: anywhere;
}

.flex-column.nav.nav-tabs {
    height: 100%;
    background: white !important;
}

@font-face {
    font-family: "Titillium Web";
    src: url("../fonts/Titillium_Web/TitilliumWeb-Regular.ttf");
}

@font-face {
    font-family: "Titillium Web Bold";
    src: url("../fonts/Titillium_Web/TitilliumWeb-Bold.ttf");
}

* {
    font-family: "Titillium Web";
}

.table-responsive {
    padding-top: 2vh !important;
}

#main-containers
    > div.team-uploader
    > div
    > div
    > div
    > div
    > div:nth-child(7)
    > div.cardinality-support
    > div
    > div
    > div.FileManager--FileUploader
    > div {
    border-color: var(--color-primary) !important;
}

.FileManager--mpDropZonePlaceHolder {
    color: var(--color-primary) !important;
}

input[type="checkbox"] {
    accent-color: var(--color-primary);
}

.form-control {
    border-color: var(--color-primary);
}

.form-control:hover,
div.Select-control:hover,
.clearable-input:hover {
    border-color: var(--color-primary);
}

.form-control:hover,
div.Select-control,
.clearable-input {
    border-color: var(--color-primary) !important;
}

.btn-outline-secondary {
    color: var(--color-primary) !important;
}

h4 {
    color: var(--color-primary) !important;
}

h1 {
    font-size: 32px !important;
}

.semantic-form-input-decorator__description-icon {
    color: var(--color-primary) !important;
}

.title {
    color: var(--color-primary) !important;
}

span.semantic-form-input-decorator__label {
    color: var(--color-primary) !important;
}

.download-btn,
.btn-light,
#template-content
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > div
    > div
    > div.help-page-content
    > div
    > div
    > table
    > tbody
    > tr
    > td:nth-child(3)
    > div
    > button {
    background-color: var(--color-primary);
    color: white;
    min-width: 100px;
}

.knowledgeGraphBar__summaryTitle h1 {
    font-size: 32px !important;
}

.header-logo {
    background-color: white;
    margin-bottom: 20px;
}

.SparqlQueryEditor--codeMirrorResult,
.SparqlQueryEditor--ontodiaContainer {
    position: unset !important;
}

#mp-semantic-chart-tooltip > div:nth-child(2) {
    padding: 10px;
}

#search-bar > div > div > div > button {
    background: none !important;
}

.knowledgeGraphBar__graphAction:before,
.knowledgeGraphBar__statementsAction:before,
.knowledgeGraphBar__pageAction:before {
    -webkit-filter: invert(100%) !important;
    filter: invert(100%) !important;
}

.dropdown-export {
    float: right;
    position: absolute;
    right: 110px;
    top: 4px;
    display: flex;
    gap: 1vw;
}

.modal-title-custom {
    font-size: 25px !important;
}

#download-menu {
    color: var(--color-primary) !important;
}

button.btn.btn-link.QueryBuilder--removeConjunctButton {
    background-color: white !important;
    background: white !important;
    color: var(--color-primary) !important;
}

span.QueryBuilder--magnifierIcon.QueryBuilder--magnifierIconThumbnailModifier {
    background-color: white !important;
    background: white !important;
    color: var(--color-primary) !important;
}

li.btn.ItemSelector--itemHolder {
    background-color: white !important;
    background: white !important;
    color: var(--color-primary) !important;
}

li.btn.ItemSelector--itemHolder.QueryBuilder--categorySelectionItem {
    background-color: white !important;
    background: white !important;
    color: var(--color-primary) !important;
    gap: 1vw;
}

.btn.category-item-holder.category-item {
    background-color: unset !important;
}

#filter-panel > div.card-header > button {
    background-color: white !important;
    color: var(--color-primary) !important;
}

.ontodia-accordion.ontodia-accordion--horizontal {
    height: 100% !important;
}

span.SearchSummary--word.SearchSummary--domain,
span.SearchSummary--word.SearchSummary--Resource {
    color: var(--color-primary) !important;
}

.custom-primary-button,
button.btn.btn-secondary.btn.btn-sm.btn-primary,
button.btn.btn-primary,
.btn-primary button.btn.btn-primary {
    padding: 6px 10px;
}

button.FacetBreadcrumbs--facetBreadcrumbsResetButton.btn.btn-link {
    border: 1px solid var(--color-grey-shade);
    background-color: var(--color-primary);
    color: white !important;
}

.no-option {
    border: white !important;
    background-color: white !important;
    background: white !important;
}

.DataTable--table > thead > tr > th {
    min-width: 130px !important;
}

thead > tr > th {
    color: var(--color-primary) !important;
    font-size: small !important;
    font-family: "Titillium Web Bold";
}

.table > tbody > tr > td {
    border-bottom: 1px solid lightgray !important;
}

thead > tr {
    background-color: #f7f7f7 !important;
}

table,
thead,
tr,
th {
    border: none !important;
}

.RdfUpload__advance::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(/assets/images/icons/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 8px;
    vertical-align: middle;
}

.dropzone-area {
    background-image: url(/assets/images/icons/cloud-upload2.png);
    background-repeat: no-repeat;
    background-position: center 10px;
    vertical-align: middle;
}

.QueryBuilder--selectedItem.QueryBuilder--actionableItem {
    text-transform: uppercase;
    font-weight: 900;
    color: var(--color-primary);
}

.QueryBuilder--actionableItem:hover {
    background-color: var(--color-primary) !important;
}

.page-link {
    background-color: white !important;
}

.page-item.active .page-link {
    background-color: var(--color-primary) !important;
    color: white !important;
    border-color: var(--color-primary) !important;
}

.flex-buttons {
    display: flex !important;
    gap: 1vw !important;
}

#export-div,
.custom-primary-button,
button.btn.btn-secondary.btn.btn-sm.btn-primary,
button.btn.btn-primary,
.btn-primary button.btn.btn-primary {
    background-color: var(--color-primary) !important;
    background: var(--color-primary) !important;
    border: 1px solid var(--color-primary);
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px 0;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 400;
    outline: none;
    outline: 0;
    padding: 10px 25px;
    text-align: center;
    transform: translateY(0);
    transition:
        transform 150ms,
        box-shadow 150ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    max-width: 200px;
    max-height: 45px;
}

.btn-link {
    color: var(--color-primary) !important;
}

button.dropdown-toggle.btn.btn-primary:hover {
    box-shadow: none;
    color: var(--color-primary) !important;
}

button.dropdown-toggle.btn.btn-primary {
    box-shadow: none;
    color: var(--color-primary) !important;
}

.custom-primary-button:hover,
button.btn.btn-secondary.btn.btn-sm.btn-primary:hover,
button.btn.btn-primary:hover,
.btn-primary button.btn.btn-primary:hover {
    box-shadow: rgba(0, 0, 0, 0.15) 0 3px 9px 0;
    transform: translateY(-2px);
}

h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 0px !important;
}

li.dropdown {
    list-style: none;
}

.btnCreateOntology.btn.btn-primary {
    display: inline-block;
    width: 80px;
    height: 32px;
    text-align: center;
}

.vocabulary-warning {
    background-color: #fcf8eb;
    border: 1px solid #eccc7b;
    color: #3b3b3a;
}

@media (max-width: 844px) {
    a#main-header-dropdown.dropdown-toggle {
        font-size: 0;
        background-color: var(--color-primary) !important;
        background-image: url(/assets/images/icons/user_image.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 20px;
        border-radius: 14px;
        display: inline-block;
        width: 50px;
        height: 50px;
        text-align: center;
        position: absolute !important;
        top: 50% !important;
        right: -130px !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        float: none !important;
    }

    .navbar-collapse {
        position: absolute !important;
        top: 80px !important; /* adjust to match your header height */
        left: 100 !important;
        right: 15px !important;
        width: 50% !important;
        padding: 20px !important;
        z-index: 9999999 !important;
    }

    /* ensure it shows when “in” */
    .navbar-collapse.collapse.in {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        overflow: visible !important;
        z-index: 999999 !important;
        background: var(--color-primary) !important;
        color: white !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }
    .navbar-collapse.collapse.in * {
        visibility: visible !important;
        opacity: 1 !important;
        color: white !important;
    }

    /* enlarge each menu item */
    .navbar-collapse .nav > li > a {
        font-size: 1em !important;
        padding: 12px 0 !important;
    }

    button.navbar-toggle {
        position: absolute !important;
        top: 50% !important;
        right: 16px !important; /* adjust this to taste */
        transform: translateY(-50%) !important;
        z-index: 100 !important; /* stay above other elements */
    }

    a#main-header-dropdown.dropdown-toggle + .dropdown-menu {
        position: absolute !important;
        top: 100% !important;
        right: -130px !important;
        left: 50px !important;
        margin-top: 4px !important;
    }

    /* Move the main page container to the left to reduce empty space */
    #application,
    .page-holder {
        margin-left: -25px !important;
        padding-left: 0 !important;
    }

    /* make the collapse panel a bit narrower if desired */
    .navbar-collapse {
        width: 45% !important; /* was 50% */
        padding: 10px !important; /* was 20px */
    }

    /* shrink each menu item’s text & spacing */
    .navbar-collapse .nav > li > a {
        font-size: 0.9em !important; /* down from 1.2em */
        padding: 8px 0 !important; /* down from 12px */
    }

    /* shrink nested dropdown items too */
    .navbar-collapse .dropdown-menu > .dropdown-item-nav > a {
        font-size: 0.85em !important;
        padding: 6px 12px !important;
    }

    /* shrink the icons inside those links */
    .navbar-collapse .nav > li > a i.fa {
        font-size: 16px !important; /* down from default ~20px */
        line-height: 1 !important;
    }

    .green-header .header-title,
    .green-header .subheader-title,
    .header-title,
    .subheader-title {
        font-size: 4vw !important;
        max-width: 100vw;
        white-space: normal;
        word-break: break-word;
        text-align: center;
    }

    /* Prevent long text from overflowing in .grey-header on small screens */
    .grey-header {
        font-size: 3vw !important;
        white-space: normal;
        word-break: break-word;
        text-align: center;
        padding-left: 2vw !important;
        padding-right: -2vw !important;
    }

    #application
        > div
        > nav:nth-child(1)
        > div
        > div.navbar-collapse.collapse.in
        > ul.nav.navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        gap: 8px !important;
        overflow-x: hidden !important;
        background: transparent !important;
    }
    #application
        > div
        > nav:nth-child(1)
        > div
        > div.navbar-collapse.collapse.in
        > ul.nav.navbar-nav
        > li {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        text-align: center !important;
    }
    #application
        > div
        > nav:nth-child(1)
        > div
        > div.navbar-collapse.collapse.in
        > ul.nav.navbar-nav
        > li
        > a {
        display: block !important;
        width: 100% !important;
        padding: 10px 0 !important;
        white-space: normal !important;
        word-break: break-word !important;
        text-align: center !important;
        font-size: 1.1em !important;
        line-height: 1.3 !important;
    }

    /* 1) Hide every dropdown-menu by default */
    .dropdown-menu {
        display: none !important;
    }

    /* 2) Show when Bootstrap adds the .show class */
    .dropdown-menu.show {
        display: block !important;
    }

    /* 3) Show when the toggle’s aria-expanded flips to true for browse, assets, and tools dropdowns */
    #browse-nav-dropdown[aria-expanded="true"] + .dropdown-menu,
    #assets-nav-dropdown[aria-expanded="true"] + .dropdown-menu,
    #tools-nav-dropdown[aria-expanded="true"] + .dropdown-menu {
        display: block !important;
    }
}

a#main-header-dropdown.dropdown-toggle {
    font-size: 0;
    background-color: var(--color-primary) !important;
    background-image: url(/assets/images/icons/user_image.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px;
    border-radius: 14px;
    display: inline-block;
    width: 50px;
    height: 25px;
    text-align: center;
}

a {
    color: var(--color-primary) !important;
}

.nav-tabs > li.active > a {
    background-color: var(--color-primary) !important;
    color: white !important;
    border-radius: 8px 8px 0 0;
    font-weight: bold;
}

.nav-tabs > li:not(.active):hover > a {
    color: var(--color-primary) !important;
}

.nav-tabs > li.active:hover > a,
.nav-tabs > li.active > a:hover {
    background-color: white !important;
    color: var(--color-primary) !important;
}

.nav-tabs > li > a {
    transition:
        background-color 0s ease,
        color 0s ease;
}

a:hover {
    color: var(--color-primary) !important;
}

#export-div {
    align-items: center;
}

.green {
    color: white !important;
    background: var(--color-primary) !important;
}

.actions-modal-custom {
    padding: 10px;
    display: flex !important;
    gap: 2vw !important;
    justify-content: center;
}

button.btn.btn-secondary.btn.btn-sm.btn-primary,
button.btn.btn-primary {
    background: var(--color-primary);
    border: none;
    color: white !important;
}

.btn-primary {
    background-color: var(--color-primary);
    border: none;
}

.btn-primary:hover {
    background-color: var(--color-primary);
    border: none;
}

button.btn.btn-primary:hover {
    background-color: var(--color-primary);
}

a#assets-bg-nested-dropdown {
    color: white !important;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    background-color: var(--color-primary);
    color: white;
    border: none !important;
}

.btn-danger {
    background-color: var(--color-primary) !important;
    border: var(--color-primary) !important;
    font-weight: unset !important;
}

.btn-outline-danger {
    background-color: var(--color-primary) !important;
    border: var(--color-primary) !important;
}

.btn-outline-danger:hover {
    background-color: var(--color-primary) !important;
    border: var(--color-primary) !important;
}

.btn-danger:hover {
    background-color: var(--color-primary) !important;
    border: var(--color-primary) !important;
}

.btn-outline-danger {
    color: white !important;
    background-color: var(--color-primary) !important;
}

.navbar-dark .navbar-nav .nav-link {
    color: white !important;
}

.mp-breadcrumbs-container {
    display: none;
}

.dropdown-item {
    color: var(--color-primary) !important;
}

.dropdown-item-nav {
    color: white !important;
}

#ontology {
    color: var(--color-primary) !important;
}

#ontology:active {
    color: var(--color-primary) !important;
    background-color: white !important;
    background: white !important;
}

#template-content > div > div.page__body > div:nth-child(2) > button > i.fa {
    color: white !important;
}

#template-content
    > div
    > div.page__body
    > div:nth-child(4)
    > div
    > div
    > div.tree-view_item
    > span
    > div
    > div
    > button
    > i.fa {
    color: white !important;
}

#template-content
    > div
    > div.page__body
    > div:nth-child(4)
    > div
    > div
    > div.tree-view_children
    > span
    > div
    > div
    > button.btn.btn-sm.btn-secondary
    > i.fa {
    color: white;
}

#template-content
    > div
    > div.page__body
    > div:nth-child(4)
    > div
    > div
    > div.tree-view_children
    > span
    > div
    > div
    > button.btn.btn-sm.btn-danger
    > i.fa {
    color: white;
}

#application
    > div
    > nav:nth-child(1)
    > div.navbar-collapse.collapse
    > ul.nav.navbar-nav
    > div:nth-child(5)
    > div.show.dropdown.nav-item
    > div
    > a:nth-child(3) {
    color: white !important;
}

#application
    > div
    > nav:nth-child(1)
    > div.navbar-collapse.collapse
    > ul.nav.navbar-nav
    > div:nth-child(5)
    > div.show.dropdown.nav-item
    > div
    > a:nth-child(1) {
    color: white !important;
}

.bg-primary .dropdown-menu .dropdown-item.active,
.bg-primary .dropdown-menu .dropdown-item:hover,
.bg-primary .dropdown-menu .dropdown-item:focus {
    background-color: var(--color-primary) !important;
    color: white !important;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: white !important;
    color: black;
}

.navbar .dropdown-menu {
    border: none !important;
}

.bg-primary .dropdown-menu {
    background-color: var(--color-primary);
}

.dropdown-title {
    color: black;
}

#search-bar .searchBtn i.fa.fa-search {
    color: var(--color-primary);
}

span.mp-rdf-graph-action__download-dropdown-item.mp-rdf-graph-action {
    color: var(--color-primary);
}

.nav-title {
    color: black !important;
}

.nav {
    padding-top: 10px;
    padding-left: 10px;
}

.headerTitle {
    text-align: center;
    color: var(--color-primary);
}

.introText {
    text-align: center;
}

td.rs-page-resource__field-label-holder {
    width: 6vw !important;
}

#template-content
    > div.dataVisualization
    > div:nth-child(2)
    > div
    > div
    > div
    > div.ontodia-canvas
    > div
    > div:nth-child(4)
    > div {
    display: none;
}

.DataTable--table-grid-layout {
    gap: 5vw !important;
    padding: 15px;
}

.nav.nav-tabs {
    background-color: #f9f9f9;
    padding: 0px;
    border-radius: 8px 8px 0 0;
}

.nav.nav-tabs > li.active {
    box-shadow: none !important;
    background-color: #009137;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom: none;
    color: #009137;
    font-weight: bold;
}

/* Style inactive tabs */
.nav.nav-tabs > li {
    background-color: #f9f9f9;
    border-bottom: none;
    margin-right: 5px;
    color: #24a053;
}

.nav.nav-tabs > li:hover {
    background-color: #fff;
}

.tab-content {
    background-color: #fff;
    padding: 1px;
    margin-top: -1px;
}

.tab-content > .active {
    gap: 10px;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
    background-color: none !important;
}

.nav > li > a:hover,
.nav > li > a:focus,
.nav > li > a:active {
    background-color: unset;
}

.search-placeholder {
    display: flex;
    place-content: center;
    padding: 10px;
}

.simple-search-searchbar {
    text-align: center;
}

div#filter-search {
    padding: 4vw !important;
}

.no-results-select .no-option {
    min-height: 30px;
    font-size: 16px;
    margin-left: 25px;
    cursor: pointer;
}

.no-results-select {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
    margin-bottom: 50px;
}

.DataTable--header-cell {
    color: var(--color-primary);
}

#template-content
    > div
    > div
    > div
    > div.help-page-content
    > section:nth-child(5)
    > div
    > div
    > div
    > div
    > div
    > div
    > div
    > a:hover {
    color: var(--color-primary);
}

.panel-footer {
    color: var(--color-primary);
}

a#search-results-tab-Outgoing,
a#search-results-tab-Incoming,
a#search-results-tab-Information {
    color: var(--color-primary);
}

#structured-search
    > div
    > div.QueryBuilder--searchAreaHolder
    > div
    > div
    > div
    > div
    > span {
    color: var(--color-primary);
}

button#ontology-imort {
    background-color: var(--color-primary) !important;
    color: white !important;
    border: var(--color-primary) !important;
}

.knowledgeGraphBar__summaryLabel {
    color: var(--color-primary);
}

/* .btn:not(:disabled):not(.disabled):active:focus, .btn:not(:disabled):not(.disabled).active:focus, .show > .btn.dropdown-toggle:focus {
    box-shadow: none !important;
    color: var(--color-primary) !important;
} */

.knowledgeGraphBar--expanded .knowledgeGraphBar__content {
    height: fit-content !important;
}

.knowledgeGraphBar__description {
    margin-bottom: 20px;
}

.navbar-collapse.collapse.show {
    background-color: var(--color-primary);
}

@media (max-width: 800px) {
    h4,
    .h4 {
        font-size: 14px !important;
    }
}

/* .page{
    padding-top: 5px !important;
} */
.knowledgeGraphBar__pageAction,
.knowledgeGraphBar__statementsAction,
.knowledgeGraphBar__graphAction,
.knowledgeGraphBar__statementsAction:hover,
.knowledgeGraphBar__graphAction:hover
    .knowledgeGraphBar__statementsAction:focus,
.knowledgeGraphBar__graphAction:focus,
.knowledgeGraphBar__pageAction:hover,
.knowledgeGraphBar__pageAction:focus {
    min-width: 50px !important;
}

.knowledgeGraphBar {
    padding-left: 4vw;
}

.knowledgeGraphBar__content {
    padding-top: 6vh;
}

a.btn.btn-secondary.component-page-toolbar__btn_edit:hover {
    border: none;
    background: none;
}

.base-breadcrumb,
.mp-breadcrumbs,
div.page-breadcrumb,
ol.page-breadcrumb {
    height: 40px;
    top: 8vh;
    left: 0;
}

.breadlinks {
    display: flex;
    gap: 1.5vw;
    padding-right: 5vw;
}

.export-nav {
    padding: 5px;
    cursor: pointer;
}

.nav-link {
    padding: 0.2rem 1rem;
}

.page-holder.page--pageActive.page--knowledgeGraphBarShown.page--knowledgeGraphBarCollapsed.page--noBreadcrumbs.isOptional {
    top: 4vh;
}

.component-page-toolbar {
    z-index: 2012;
    position: fixed;
    right: 15px;
    height: 44px;
    display: flex;
    align-items: center;
    top: 5px;
}

@media (min-width: 1396px) {
    .sections-nav {
        display: none !important;
    }

    .ml-5,
    .mx-5 {
        margin-left: 0px !important;
    }
}

.annotation-field {
    width: -moz-fit-content;
    width: fit-content;
    display: flex;
    flex-direction: row;
    align-self: flex-end;
    gap: 5px;
    padding: 7px;
    justify-content: right !important;
    align-items: center;
}

.annotation-cell {
    display: flex;
    flex-direction: column;
    float: right !important;
}

.annotation-td {
    width: 300px;
    border-top: none !important;
}

#search-results-tabpane-Information
    > div
    > div
    > div.card-body
    > div
    > table
    > thead {
    display: none;
}

#rsbv > table > td,
td.rsbv-value-cell {
    border-top: none;
    height: 100% !important;
}

button.icon--annotation.fa.fa-pencil {
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    border-radius: 35px;
    padding: 10px;
    background: #ffffff;
}

.joyride-tooltip__button--primary {
    background-color: var(--color-primary) !important;
}

button.icon--annotation.fa.fa-pencil:hover {
    background: #ececec;
    box-shadow: rgb(0 0 0 / 25%) 0px 0px 6px;
}

.annotation-uri {
    display: flex;
    gap: 5px;
    align-items: center;
}

.navbar-collapse.collapse.show {
    background-color: var(--color-primary);
}

#rsbv > table > table > tbody > tr > td {
    min-width: 70px;
}

#rsbv > table > tbody > tr > table > tbody > tr > td.rsbv-value-cell,
#rsbv > table > tbody > tr > table > tbody > td.rsbv-value-cell {
    min-width: 160px !important;
}

td.rs-page-resource__field-label-holder {
    min-width: 12vw !important;
}

@media (max-width: 800px) {
    .knowledgeGraphBar__thumbnail {
        display: none !important;
    }

    .knowledgeGraphBar {
        padding-top: 0px !important;
        flex-direction: column;
    }

    h4,
    .h4 {
        font-size: 14px !important;
    }

    #template-content
        > div
        > div
        > div
        > div.help-page-content
        > div
        > div
        > div
        > div
        > div.help-page-content
        > div
        > section:nth-child(2)
        > div
        > h3,
    #template-content
        > div
        > div
        > div
        > div.help-page-content
        > div
        > div
        > div
        > div
        > div.help-page-content
        > div
        > section:nth-child(1)
        > div
        > h3 {
        max-width: 100% !important;
    }

    .QueryBuilder--searchSummaryHolder {
        flex-direction: column-reverse !important;
    }

    #structured-search .QueryBuilder--domainSelection {
        top: unset !important;
    }

    .slick-prev {
        left: -30px !important;
    }

    .slick-next {
        right: -30px !important;
    }
}

ul.nav.navbar-nav {
    background-color: var(--color-primary);
}

.dropdown-menu.show.dropdown-menu-right {
    background-color: var(--color-primary);
}

.open-sidebar {
    overflow: hidden;
}

#template-content
    > div
    > div
    > div.resource-options
    > div.btn.btn-secondary.knowledgeGraphBar
    > div
    > div {
    background-color: white !important;
    margin-left: 8px !important;
    margin-top: 5px !important;
}

.export-nav.nav-item {
    padding: 5px;
}

.btn.btn-secondary.knowledgeGraphBar {
    width: 150px;
}

.resource-options {
    display: flex;
    float: right;
}

#template-content
    > div
    > div
    > div.resource-options
    > div.btn.btn-secondary.knowledgeGraphBar
    > div {
    place-self: center;
}

.export-options {
    float: right;
    margin-right: 3.3vw;
    padding-top: 2vh;
}

.table th,
.table td {
    border-top: none;
}

.download-tr {
    display: flex;
    gap: 1vw;
    padding: 12px;
    flex-direction: column;
}

.download-td {
    display: flex;
    align-items: center;
    gap: 1vw;
}

.card {
    border: none !important;
}

.card-header {
    border-bottom: none !important;
}

.navbar-expand-md .navbar-nav .nav-link-dropdown {
    padding-left: 0px;
    padding-right: 0px;
}

#template-content
    > div
    > div
    > div
    > div.sidebar-container.d-none.d-lg-block
    > div
    > div:nth-child(2)
    > div {
    border-top: none !important;
}

.page-holder {
    padding-bottom: 40vh !important;
}

.Toolbar--component {
    display: flex !important;
    gap: 5px !important;
}

#export-div > div > div {
    width: max-content !important;
}

body
    > div.fade.rdfEditorDialog.largeDialog.modal.show
    > div
    > div
    > div.rdfEditorDialog.largeDialog__body.modal-body
    > div
    > div:nth-child(2)
    > div:nth-child(2) {
    gap: 1vw !important;
}

.searchBtn {
    background-color: white !important;
}

#template-content
    > div
    > div
    > div
    > div.sidebar-container.d-none.d-lg-block
    > div
    > div
    > div {
    border: none;
}

.FacetSlider--slidergraph {
    padding: 16px 0px 16px 16px !important;
}

#artwork-filter-search {
    max-width: 26% !important;
}

.panel-body {
    padding: 0 !important;
}

.open > .btn-default.dropdown-toggle,
.btn-default:active {
    border-color: var(--color-primary) !important;
}

.dropdown-menu li {
    float: unset !important;
}

@media (min-width: 620px) {
    .form-inline label {
        flex-wrap: wrap !important;
    }
}

.grey-header {
    height: 15vh;
    background-color: var(--color-primary);
    position: relative;
    top: -9vh;
    text-align: -webkit-center;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-grey-shade);
}
.header-title {
    color: white !important;
}
.panel-default > .panel-heading {
    background: white !important;
    border-color: var(--color-primary);
    border-radius: 0;
}
.show-facet-button__hide {
    display: none;
}
.panel-default {
    border: 1px solid var(--color-primary) !important;
    border-radius: 1px;
    box-shadow: none;
}

.facet__relation__header {
    border: unset !important;
}

.panel-heading {
    padding: 10px 15px !important;
}

.facet__category-selector-holder {
    display: none !important;
}

.btn-default:focus {
    border-color: var(--color-primary) !important;
}

.facet-reset-button {
    background: var(--color-primary);
    color: white;
    border: solid 1px var(--color-primary);
    margin-left: 10px;
    font-size: 14px;
    padding: 10px;
}

.facet-reset-button:hover {
    background: var(--color-primary);
    color: white;
}

.copy-to-clipboard-btn {
    width: 25px;
    aspect-ratio: 1;
    background: unset;
    border: unset;
    display: grid;
    place-items: center;
}

.copy-to-clipboard-btn > img {
    width: 25px;
    aspect-ratio: 1;
}

.popover-title {
    background: white;
    color: var(--color-primary);
}

.popover-content {
    background: white;
    color: var(--color-dark);
}

.popover.top > .arrow {
    border: var(--color-primary);
    background: var(--color-primary);
}

.popover.top > .arrow::after {
    border: var(--color-primary);
    background: var(--color-primary);
}

#mp-popover {
    border: none !important;
    background: white;
}

.top-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.download-graph-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    justify-content: start;
    margin-right: 2.5vw;
}

.edit-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    justify-content: end;
    margin-right: 2.5vw;
}

.edit-btn > img {
    width: 20px;
    aspect-ratio: 1;
}

.semantic-form-input-decorator__label {
    font-size: 18px !important;
}

.download-csv-btn {
    margin: 5px 0;
}

.facet__rule_restricted > .facet__relation__header {
    color: red;
}

@media (max-width: 844px) {
    #filter-panel {
        max-width: 90vw !important;
        width: 90vw !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow-x: auto !important;
    }
    #filter-panel .panel-body,
    #filter-panel .semantic-facet-holder,
    #filter-panel .facet,
    #filter-panel .facet-relations {
        width: 90vw !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow-x: auto !important;
    }
    #filter-panel .facet__relation__values__value {
        max-width: 90vw !important;
        box-sizing: border-box !important;
        overflow-x: auto !important;
        word-break: break-word !important;
    }
    #filter-panel input[type="text"] {
        max-width: 80vw !important;
        box-sizing: border-box !important;
    }
}

.griddle-footer .pagination a[data-value] {
    font-size: 1.4rem;
    font-style: normal;
    font-weight: 500;
}