:root {
    --main-theme-color: #c99281;
    /*--link-color: #C38755;*/
    --link-color: #ea9250;
    --items_background-color: #f9f3ee;
    --footer_background-color: #545c5d;
    --footer_bottom_background-color: #f7f7f7;
    --main-theme-color-2: #533132;
    /* new colors */
    --link-color-2: #312323;
    --items_background-color-2: #0f1514;
    --footer_background-color-2: #14282a;
    --footer_bottom_background-color-2: #193b40;
    --highlight-color: #7c2425;
}

a:hover{
    opacity: 1;
}

body #content:after {
    content: "";
    display: block;
    /*height: 200px; !* the footer's total height *!*/
}

footer{
    text-align: center;
    border-top: lightgray solid 2px;
    border-bottom: lightgray solid 1px;
    margin: 0!important;
    max-width: none!important;
    padding: 0!important;
    background-color: var(--footer_background-color);
}
footer p{
    margin: 0!important;
}
footer a{
    color: lightgray!important;
    opacity: 0.85;
    text-decoration: underline!important;
}
footer .top-footer{
    margin: 0 auto;
    width: 80%;
    text-align:center;
    padding: 30px;
    padding-top: 25px;
    padding-bottom: 20px;
}
footer .bottom-footer{
    color: lightgray;
    padding-top: 10px;
    padding-bottom: 20px;
    background-color: var(--footer_bottom_background-color);
}
footer .top-footer .first-section{
    vertical-align: top;
    max-width: 40%;
    display: inline-block;
    text-align:left;
}

footer .top-footer .second-section{
    margin-left: 35%;
    width: 300px;
    vertical-align: top;
    text-align:left;
    display: inline-block;
}

footer .bottom-footer{
}

footer .footer-text{
    font-size: 9pt;
}
footer .footer-separator{
    font-size: 9pt;
    color: lightgray;
}

footer .title{
    font-size: 12pt;
    color: lightgray;
}

.linkButton {
    border-radius: 6px;
    padding: 12px;
    display: inline-block;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: 0;
    cursor: pointer;
    color: #fff;
    background-color: #1f8676;
    margin: 10px 0;
}

.linkButton:hover {
    /*background-color: #194841;*/
    background-color: var(--link-color);
    transition: 0.4s;
}

.linkButton > span{
    font-family: sans-serif;
    color: #fff;
}

.whiteText {
    color: #fff!important;
    text-decoration: none;
    margin: 4px;
    font-family: sans-serif;
    font-weight: 500!important;
}

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

.linkButton > span > a:link {
    font-family: sans-serif;
    color: #fff;
}

#advanced-search .value>* {
    margin-top: 0;
    display: flex;
    margin: 0 4px;
}

@media screen and (min-width: 800px){

    header{
        padding: 0%!important;
        padding-right: 15px!important;
        padding-left: 15px!important;
        margin-bottom: 0%!important;
        background-color: darkgray!impo;
    }
    header nav{
        display: inline-block;
        font-size: 12pt;
        width: 45%!important;
        padding: 0%!important;
    }
    header nav .navigation li.active{
        background-color: unset!important;
        background-color: #1f867b .8;
    }
    header nav .navigation li.active a{
        /*color: var(--link-color);*/
        color: #1f867b;
    }
    header nav .navigation li a:hover{
        /*color: var(--link-color);*/
        /*color: #ea924b;*/
        color: var(--highlight-color);
    }


    .site-title{
        display: inline-block!important;
        width: fit-content;
        padding:0 0 0 0!important;
        margin-right: 0%!important;
        text-decoration: none;
    }

    body.page #content{
        padding: 0!important;
        padding-top: 5px!important;
        margin-left: 0!important;
        margin-right: 0!important;
        max-width: none;
    }

    body.page #content .blocks{
        padding-right: 3%!important;
        padding-left: 3%!important;
        height: fit-content;
        margin-bottom: 150px;
    }

    #search{
        display: inline-block;
        position:relative!important;
        width: 24%!important;
        left: 0%!important;
        border: none!important;
        padding-right: 0%!important;
        margin-top: 10px;
        float: right;
    }

    #main_jumbotron{
        background-image: url("../../img/bg_img_5.jpg");
        image-rendering: -webkit-optimize-contrast;
        background-repeat:no-repeat;
        background-size: cover;
        background-size: 100% 150%;
        /*background-color: #a16c6c;*/
        opacity: 1;
        width: 100%;
        min-height: 450px;
        border-bottom: lightgray solid 5px;
    }

    #jumbotron_search{
        margin-top: 10px;
    }
    #jumbotron_search input{
        font-size: 16px;
        width: 80%;
        /*font-weight: bold;*/

    }
    #jumbotron_search button{
        font-size: 12pt;
        /*background-color: var(--link-color);*/
        background-color: #ea9250;
        color: white;
        border-radius: 2px;
        opacity: 1;
        max-width: 100px;
        width: 30%;
    }
    #jumbotron_search button:hover{
        opacity: 0.8;
        transition: 0.4s;
    }

    #search_container{
        position: relative;
        margin: 0 auto;
        left: 0%!important;
        display: table;
        background-color: rgba(247, 247, 247);
        top: 150px;
        padding: 15px;
        border: solid #12aa99 5px;
        border-radius: 10px;
        min-width: 40%;
        font-weight: bold;

    }
    #search_pre .var-txt{
        /*color: #478ec7;*/
        color: var(--highlight-color);
        font-size: 24px;
    }
    #content #main_jumbotron{
        padding: 0 !important;
    }
    .item-showcase-title{
        margin: 0 auto;
        max-width: 80%;
        margin-top: 30px;
        font-size: 14pt;
    }
    .item-showcase-title a{
        /*color: var(--link-color)!important;*/
        color: var(--highlight-color);
    }
    .item-showcase{
        margin: 0 auto!important;
        margin-top: 5px!important;
        margin-bottom: 15px!important;
        /*background-color: var(--items_background-color);*/
        /*border: lightgray solid 2px!important;*/
        max-width: 80%;
        border-radius: 10px;
    }
    .item-showcase .item.resource{
        opacity: 0.7;
    }
    .item-showcase .item.resource:hover{
        opacity: 1;
    }

    body.item.resource.show #content{
        padding-right: 30px;
        padding-left: 30px;
    }
    body.item.resource.show #content .title{
        font-size: 20pt;
    }
    body.item.resource.show #content .property + .property{
        margin: 0px!important;
    }
    body.item.resource.show #content .property .values{
        font-size: 11pt;
        /*border: 0.5px solid lightgray;*/
        background-color: white;
        width: 75%;
        /*padding: 5px;*/
        /*border-radius: 7px;*/
    }
    body.item.resource.show #content .property h4{
        font-size: 13pt;
    }
    .mirador.viewer.mirador-container{
        clear: both;
    }

    .slick-slide img {
        display: flex;
        top: 0;
        left: 0;
        border: 6px solid;
    }

    .slick-slide {
        opacity: 0.7;
        transition: 0.4s;
        transition-property: opacity;
    }

    .slick-slide:hover {
        opacity: 1;
    }


    .item-show{
        display: inline-flex;
        padding: 20px;
        /*overflow: scroll;*/
        /*max-height: 400px;*/
        border-left: 1px solid #dedede;
    }

    .item-media{
        float:left;
        /* position: relative; */
        width:30%;
        max-width: 300px;
        margin-right: 10px;
    }



    .item-img{
        border-radius: 15px;
    }

    .item-view-button {
        position: absolute;
        width: 150px;
        height: 40px;
        margin-top: 10px;
        margin-left: 10px;
        padding: 5px;
        border-radius: 5px;
        background-color: #577284; /* blue #0052cc | green #006622 */
        color: white!important;
        font-size: 18px;
        text-align: center;
        display: none;
    }

    .item-view-button:visited {
        color: white!important;
    }

    .item-view-img:hover .item-view-button{
        display: block;
    }

    .item-view-img:hover {
        opacity: 0.9;
    }

    .item-export{
    }

    .item-iiif-img{
        background-image: url("../../img/IIIF_logo.png");
        background-repeat: no-repeat;
        background-size: cover;
        width: 35px;
        height: 35px;
    }

    .item-json-img{
        background-image: url("../../img/JSON_logo.png");
        background-repeat: no-repeat;
        background-size: cover;
        width: 35px;
        height: 35px;
    }

    .item-metadata{
        float:left;
        width:100%;
        max-width: 900px;
        min-width: 650px;
    }

    .page.view-mirador
    body{
    }

    .page.view-mirador
    #mirador-view{
        padding: 0;
        margin: 0;
        width: 100%;
        height: 100vh;
    }
    .page.view-mirador
    footer{
        display: none !important;
    }

    .item.resource.show footer{

    }

}

@media screen and (max-width: 820px){

    #main_jumbotron{
        background-image: url("../../img/bg_img_5_sm.jpg");
        display: none;
    }

    .page.view-mirador
    #mirador-view {
        padding: 0;
        margin: 0;
        width: 100%;
        height: 100vh;
    }

    .page.view-mirador
    footer{
        display: none !important;
    }
    .item.resource.show footer{
    }

    footer .top-footer{
        width: 100%;
    }
    footer .top-footer .first-section{
        width: 40%;
    }
    footer .top-footer .second-section{
        margin-left: 0%;
        width: 40%;
    }
    footer .footer-text{
        font-size: 8pt;
    }
}