body {
    font-family: utopia-std;
    font-size: 1rem;

    @media (max-width: 768px) {
        font-size: 0.9rem;
    }
}

body.dark .uva-header{
    background-color: rgb(46,46,46);
    color: white;
    padding-left: 1em !important;
}


body .uva-header .logotext{
    font-weight: 200;
    text-shadow: 1px 1px 1px rgb(46, 46, 46);
}

body.dark .main-navigation ul.navbar-nav{
    padding-left: 1em !important;
}

/* Headings */

.title{
    padding: 2rem 0;
}

h1{

    font-size: 32px;
    
    @media (min-width: 768px) {
        font-size: 46px;
    }
    padding-left: 2rem;
    font-weight: 600;
    
}

h1 {
    border-left: 1px solid hsla(344, 100%, 37%, 1);
}


a.navbar-brand {
    --logo-height: 52px;
    --logo-width: 425px;

    @media (max-width: 768px) {
        --logo-height: 30px;
        --logo-width: 300px;
    }
    fill: currentColor;
    height: var(--logo-height);
    width: var(--logo-width);
}

a.navbar-brand svg {
    color:rgb(46, 46, 46);
    height: var(--logo-height);
    width: var(--logo-width);
}

body.dark a.navbar-brand svg {
    color:white;
}

a.navbar-brand svg use {
    height: var(--logo-height);
    width: var(--logo-width);
}

.footer-navigation .brand-logo {
    /* --footer-logo-height: 36px;
    --footer-logo-width: 360px;

    @media (max-width: 768px) {
        --footer-logo-height: 30px;
        --footer-logo-width: 300px;
    } */


    --footer-logo-height: 52px;
    --footer-logo-width: 425px;

    @media (max-width: 768px) {
        --footer-logo-height: 30px;
        --footer-logo-width: 300px;
    }

    color: white;
    fill: currentColor;
    height: var(--footer-logo-height);
    width: var(--footer-logo-width);
}

.footer-navigation .brand-logo svg {
    height: var(--footer-logo-height);
    width: var(--footer-logo-width);
}

.footer-navigation .brand-logo svg use {
    height: var(--footer-logo-height);
    width: var(--footer-logo-width);
}

.footer-navigation .legal-text {
    color: rgb(255, 255, 255, 90);
    font-family: source-sans-pro, sans-serif
}

.footer-navigation .footer-border {
    border-top: 1px solid rgb(56%, 56%, 56%);

    @media (min-width: 768px) {
        height: 2px;
        position: absolute;
        width: 100%;
        left: 0;
    }

}

@media screen and (max-device-width: 600px) {
    body {
        font-size: 2.4rem;

        @media (max-width: 768px) {
            font-size: 1.4rem;
        }
    }

    .navbar-dark .navbar-toggler {
        font-size: 6vw;
        margin-bottom: 2vw;
    }

    .form-control {
        font-size: 4vw;
    }

    .form-select {
        font-size: 4vw !important;
    }

    .text-muted {
        font-size: 2.4rem;
    }

}

.form-control.year.small{
    width: 5em !important;
    height: 1.7rem !important
}

.btn {
    font-family: source-sans-pro, sans-serif;
}

.dark .nav {
    background-color: rgb(46, 46, 46)
}

li.warning {
    color: #dc3545;
}

.dark .main-navigation {
    background: rgb(46, 46, 46);
    background: linear-gradient(180deg, rgba(46, 46, 46, 1) 0%, rgba(46, 46, 46, 1) 92%, rgb(50, 50, 50) 100%);
}

.main-navigation .navbar-nav .nav-item a:first-child{
    padding-left: 0 !important;
}

.main-navigation .navbar-nav .nav-item a {
    color: rgb(189, 0, 50);
}

.main-navigation .navbar-nav .nav-item:hover a {
    text-decoration: underline;
    text-underline-offset: 0.8rem;
    text-decoration-thickness: 3px;
}

.dark .main-navigation .navbar-nav .nav-item a {
    color: white;
}

.dark .main-navigation .navbar-nav .nav-item:hover a,
.footer-navigation .navbar-nav .nav-item:hover a {
    text-decoration: underline;
    text-underline-offset: 0.8rem;
    text-decoration-thickness: 3px;
}

.footer-navigation .navbar-nav .nav-item a {
    color: white;
    font-family: source-sans-pro, sans-serif
}

.footer-navigation .navbar-nav .nav-item a:before {
    content: "\003E";
    padding-left: 0.45em;
}

.main-navigation .navbar-nav .nav-item a.active,
.footer-navigation .navbar-nav .nav-item a.active {
    text-decoration: underline;
    text-underline-offset: 0.8rem;
    text-decoration-thickness: 3px;
}

.dark .side-navigation .navbar-nav .nav-item a {
    color: black
}

.dark .side-navigation .navbar-nav .nav-item:hover a,
.dark .side-navigation .navbar-nav .nav-item a.active {
    color: black;
    text-decoration: underline;
    text-underline-offset: 0.8rem;
    text-decoration-thickness: 3px;
}


.page-header .banner{
    background-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(230, 230, 230, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.main-content .banner {
    background-repeat: no-repeat;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: center;
    background-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(230, 230, 230, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.main-content .content div {
    clear: both;
}


:root {
    --bs-link-color-rgb: 188, 0, 49;
    --bs-border-radius: 0
}

.btn-primary {
    --bs-btn-bg: rgb(189, 0, 50);
    --bs-btn-border-color: rgb(0, 0, 0);
    --bs-btn-hover-bg: hsl(344, 100%, 31%);
    --bs-btn-hover-border-color: rgb(0, 0, 0);
    --bs-btn-focus-shadow: rgb(0, 0, 0);
    --bs-btn-active-color: rgb(189, 0, 50);
    --bs-btn-active-bg: rgb(189, 0, 50);
    --bs-btn-active-border-color: rgb(0, 0, 0);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: rgb(189, 0, 50);
    --bs-btn-disabled-bg: rgb(189, 0, 50);
    --bs-btn-disabled-border-color: rgb(0, 0, 0);
}

/* In content images */
p {
    clear: right;
}

figure {
    @media (max-width: 768px) {
        width: 100% !important;
    }
}

figure.image-style-align-center {
    text-align: center;
}

figure.image-style-align-left {
    float: left;
    margin-right: 1em;
}

figure.image-style-align-right {
    float: right;
    margin-left: 1em;
}

figure img {
    width: 100%;
    height: auto;
}

figure figcaption {
    font-size: 0.75em;
    color: rgb(0, 0, 0);
    background-color: rgb(220, 220, 220);
    padding: 0 0.5em;
}

/* Crumble path */

ol.crumble-path {
    background: rgb(245, 245, 245);
    background: linear-gradient(180deg, rgba(245, 245, 245, 1) 0%, rgba(235, 235, 235, 1) 100%);

}

ol.crumble-path li,
ol.crumble-path li a {
    color: black;
    font-family: source-sans-pro, sans-serif;
    text-decoration: none;
    font-size: 0.9rem;
    vertical-align: middle;
}

ol.crumble-path li a:after {
    content: "\003E";
    padding-left: 0.5em;
    padding-right: 0.5em;
}

/* Search results */

.card.search-result a{
    color: black;
    text-decoration: none;
}
.card.search-result a.link {
    color: black;
    text-decoration: underline;
}

.card.search-result a:hover{
    background-color: white;
    color: black;
    text-decoration: none;
}

.card.search-result .card-body p.intro-text {
    display: -webkit-box;
    -webkit-line-clamp: 3; 
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.facets-block{
    color: black;
    font-family: source-sans-pro, sans-serif;
}

.facets-block .facet label {
    color: black;
    text-decoration: none;
}

ul.facets-links li a{
    font-size: 1rem;
}

form.search-form input[type="text"] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    font-size: 1em;
}

form.search-form input[type="text"]::placeholder {
    color:rgb(155, 155, 155)
}

form.search-form .btn.search-submit{
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border-color: rgb(222, 226, 230)
}

/* Back to top */
#toTop {
    position: fixed;
    bottom: 2rem;
    right: 5rem;
    display: none;
}

/* Contact form */
form label.form-label.required:after{
    content: '*';
    color: rgb(189, 0, 50);
}

.filter-results {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  font: inherit;
  color: rgb(189, 0, 50);

}
.filter-results:hover,
.filter-results:focus {
  color: rgb(189, 0, 50);
  outline: none;
}

/* Repair all lower case text from index */

.sentence:first-letter{
    text-transform: uppercase !important;
}

/* Pager styling */
ul.pager li {
    color:black;
    border: solid black 1px;    
    font-size: 0.8em;
}

ul.pager li.first,
ul.pager li.last {
    border: none;    
}

ul.pager li.active,
ul.pager li:hover {
    color: white;
    background-color: black;
}

ul.pager li a {
    color:black;
    text-decoration: none;
}

ul.pager li:hover a {
    color: white;
}

ul.pager li.active a {
    color: white;
    text-decoration: none;
}

ul.selected-fields li{
    color: black;
}

ul.selected-fields li a.remove-link {
    text-decoration: none; 
    color: black;
    font-size: 1rem;
}

ul.selected-fields li a.remove-link:after {
    float: right;
    content: "\274c";
    color: black;
    font-size: 0.8rem;
}

ul.selected-fields li a.clear-all-link{
    text-align: right;
    font-size: 1rem;
}

.hide-expanded[aria-expanded="true"] {
    display: none;
}

.year:input[type="text"]{
    width: 4rem !important;
}

form.search-form input[type="text"].year {
    width: 4rem;
    height: 1.7rem;
}


form.search-form input[type="submit"].filter-submit {
    width: auto;
    color:hsl(344, 100%, 31%);
    height: 1.7rem;
    margin-left: 0.7rem;
    padding: 0 10px;
    text-decoration: none;
    border: solid 1px hsl(344, 100%, 31%);
}


form.search-form input[type="submit"].filter-submit:hover {
    background-color:hsl(344, 100%, 31%);
    color: white;
    border: solid 1px white;
}


form.search-form input[type="submit"].filter-submit:focus {
    background-color:hsl(340, 2%, 48%);
    color: white;
    border: solid 1px white;
}

form.search-form input[type="submit"].filter-submit.defaultSubmit {
    border: solid 2px hsl(344, 100%, 31%);
}

div.col.results-data{
    padding-top: 0.2em;
    font-size: 1.2rem;
}

button.btn.show-more, .btn.show-less {
    font-size: 0.8em;
}


.filters {
    max-height: 90%;
    max-height: 95%;
    left: 0;
    top: 10%;
    overflow: auto;
}

.btn.btn-filters {
    width: 90%;
    margin-bottom: 1em;
    color: black;
    background-color:rgb(214, 214, 214) ;
}

.btn.btn-filters:hover{
    color: white;
    background-color: rgb(52, 48, 48);
}

.btn-close{
    border: solid black 1px;
    border-radius: 50%; 
}


.img-thumbnail.portrait{
    width: 160px !important;
    margin-right: 1em;
}

.img-thumbnail.lowres {
    width: 80px !important;
    margin-right: 1em;
}

/* result list show apa */
div.rendering_apa {
    clear: none !important;
    color:#666;
    word-wrap: break-word;
}

div.rendering_apa::first-line {
	font-weight: bold;
	color: #333;
}

.rendering_apa a {
    z-index: 2;
    position: relative;
    text-decoration: underline;
    color: #666;
}

/* toggle show more/less button for long fields in detailpage */
.text-wrapper {
    max-height: 100px;        /* collapsed height */
    overflow: hidden;
    transition: max-height 0.4s ease;
}

.text-wrapper.expanded {
    max-height: 9999px;       /* enough to show full content */
}