:root {
    --main-theme-color: #c99281;
    --link-color: #C38755;
    --items_background-color: #f9f3ee;
    --footer_background-color: #545c5d;
    --footer_bottom_background-color: #414a4c;
    --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;
}

@media screen{
    *{
        box-sizing:border-box
    }
    html{
        height:100%;
        padding:0;
        margin:0
    }
    body{
        font-family:"Open Sans", sans-serif;
        font-size:20px;
        line-height:30px;
        margin:0;
        word-wrap:break-word
    }
    a:link{
        /*text-decoration:none;*/
        color:#1f8677
    }
    a:visited{
        color:#1f8677
    }
    a:active,a:hover{
        color: var(--highlight-color);
    }
    h1{
        font-size:40px;
        line-height:60px
    }
    h2{
        font-size:30px;
        line-height:45px
    }
    h3{
        font-size:25px;
        line-height:45px
    }
    h4{
        font-size:22.5px
    }
    img{
        max-width:100%;
        height:auto
    }
    input,textarea,button,.button,select{
        font-family:"Open Sans", sans-serif;
        font-size:20px;
        line-height:30px;
        margin:0;
        vertical-align:top
    }
    input[type="text"],input[type="password"],input[type="email"],input[type="url"],textarea{
        -webkit-appearance:none;
        -moz-appearance:none;
        appearance:none;
        border-radius:0;
        height:45px;
        border:1px solid #dedede;
        padding:6.5px 1.69492%;
        margin:0
    }
    textarea{
        height:90px
    }
    input[type="file"]{
        line-height:1;
        vertical-align:bottom;
        font-size:15px
    }
    button,a.button,[type="submit"]{
        background-color:#dedede;
        border-radius:2px;
        padding:7.5px;
        display:inline-block;
        appearance:none;
        -webkit-appearance:none;
        -moz-appearance:none;
        border:0;
        cursor:pointer
    }
    select{
        background-color:#fff;
        padding:7.5px;
        border-color:#dedede;
        height:45px
    }
    ::-webkit-input-placeholder{
        font-style:italic
    }
    :-moz-placeholder{
        font-style:italic
    }
    ::-moz-placeholder{
        font-style:italic
    }
    :-ms-input-placeholder{
        font-style:italic
    }
    .field{
        margin:10px 0;
        display:flex;
        flex-wrap:wrap;
        /* new */
        flex-direction: column;
        border-top: 1px solid #d7d7d7;
        padding: 20px;
    }
    .field .field-meta{
        width:30%;
        padding:7.5px 1.69492% 0 0
    }
    .field .inputs{
        width:70%;
        /*padding-left:1.69492%*/
    }
    .field .inputs>select,.field .inputs>textarea,.field .inputs>input[type="text"],.field .inputs>input[type="password"],.field .inputs>input[type="email"],.field .inputs>input[type="url"]{
        width:100%
    }
    .field .inputs input[type="checkbox"]{
        vertical-align:bottom
    }
    .field.required .field-meta:after{
        content:"\f069";
        font-family:"Font Awesome 5 Free";
        font-size:15px
    }
    .field .value:not(:last-child){
        margin-bottom:15px
    }
    .field-description{
        font-size:15px
    }
    header nav{
        position:relative;
        margin:15px 0 -15px;
        padding:0
    }
    header nav.closed ul{
        height:0;
        overflow:hidden;
        margin:0
    }
    header nav:before{
        font-family:"Font Awesome 5 Free";
        content:"\f0c9";
        display:block;
        width:37.5px;
        height:37.5px;
        border:1px solid #dedede;
        text-align:center;
        border-radius:2px;
        position:absolute;
        right:1.69492%;
        top:-52.5px;
        cursor:pointer;
        line-height:37.5px
    }
    header nav.open:before{
        content:"\f00d"
    }
    header nav ul{
        padding-left:0;
        list-style:none;
        position:relative;
        margin:0 auto
    }
    header nav ul a{
        display:inline-block;
        width:100%;
        padding:7.5px;
        text-decoration: none;
    }
    header nav ul a:hover{
        border-bottom:0;
        background-color:#dedede
    }
    header nav ul li{
        border-top:1px solid #dedede;
        position:relative
    }
    header nav ul li li:last-of-type{
        padding-bottom:0
    }
    header nav ul li.active{
        font-weight:bold;
        background-color: #dedede;
    }
    header nav ul li>ul:before{
        font-family:"Font Awesome 5 Free";
        content:"\f105";
        position:absolute;
        right:0;
        top:-45px;
        color:#dedede;
        width:30px;
        height:45px;
        line-height:45px;
        text-align:center
    }
    header nav ul li>ul:hover:before{
        content:"\f107"
    }
    header nav ul a:hover ~ ul:before{
        color:#ababab
    }
    header nav>ul>li:last-child{
        border-bottom:1px solid #dedede;
        padding-bottom:-1px
    }
    header nav>ul ul li{
        height:0;
        overflow:hidden;
        border:0
    }
    header nav>ul ul:hover>li{
        height:auto;
        border-top:1px solid #dedede;
        padding-top:-1px
    }
    header nav>ul>li>ul>li.active>a{
        margin-left:-1.5em
    }
    header nav>ul>li>ul>li.active>a:before{
        content:">";
        display:inline-block;
        width:1.5em
    }
    header nav>ul>li>ul>li a{
        padding-left:30px
    }
    header nav>ul>li>ul>li>ul>li a{
        padding-left:60px
    }
    .sub-menu ul{
        padding-left:0;
        list-style-type:none;
        margin-top:15px
    }
    .sub-menu li{
        font-size:15px;
        font-weight:bold;
        border-bottom:1px solid #dedede;
        padding:7.5px 0 6.5px
    }
    .sub-menu li:first-of-type{
        border-top:1px solid #dedede;
        padding-top:6.5px
    }
    nav.pagination{
        margin-bottom:30px;
        font-size:20px;
        line-height:45px
    }
    .pagination input{
        text-align:center
    }
    .resource-list+.pagination{
        border-color:transparent
    }
    .pagination form{
        min-width:90px
    }
    .pagination form,.pagination .button,.pagination button,.pagination .page-count{
        display:inline-block;
        vertical-align:top;
        height:45px
    }
    .pagination .button{
        border:1px solid #dedede;
        background-color:#dedede;
        width:45px;
        text-align:center;
        padding:7.5px;
        border-radius:2px;
        color:#ababab;
        line-height:30px
    }
    .pagination .button:hover{
        background-color:#787878
    }
    .pagination .inactive.button{
        opacity:.5;
        background-color:white
    }
    .pagination .inactive.button:hover{
        background-color:white
    }
    .pagination form,.pagination .last{
        margin-right:7.5px
    }
    .pagination input{
        width:60px
    }
    .breadcrumbs{
        font-size:15px;
        margin:30px 0 -15px
    }
    .site-title h1{
        font-size:22px;
        line-height:30px;
        padding-right:30px;
        text-decoration: none;
    }
    header{
        background-color:#fff;
        margin:0 0 75px;
        padding-top:15px;
        border-bottom:1px solid #dedede;
        padding-bottom:14px;
        position:relative
    }
    header>*{
        max-width:1700px;
        margin-left:auto;
        margin-right:auto;
        padding:0 1.69492%;
        display:block
    }
    .site-title:hover,.site-title:active{
        border-bottom:0
    }
    .site-title h1{
        margin:0
    }
    button.o-icon-search{
        display:none
    }
    #search{
        position:absolute;
        top:100%;
        left:0;
        right:0;
        background-color:#fff;
        border-bottom:1px solid #dedede;
        border-top:1px solid #dedede;
        padding:7.5px 1.69492%
    }
    #search form{
        display:flex;
        flex-wrap:nowrap
    }
    #search form input[type="text"]{
        width:100%
    }
    #search form button[type="submit"]{
        height:45px;
        width:45px;
        text-indent:-9999px;
        position:relative;
        border-radius:0 3px 3px 0
    }
    #search form button[type="submit"]:before{
        content:"\f002";
        font-family:"Font Awesome 5 Free";
        position:absolute;
        top:0;
        left:0;
        right:0;
        text-align:center;
        text-indent:0;
        line-height:45px
    }
    footer{
        max-width:1700px;
        margin-left:auto;
        margin-right:auto;
        padding:0 1.69492% 30px
    }
    #content{
        max-width:1700px;
        margin-left:auto;
        margin-right:auto;
        padding:0 1.69492% 30px
    }
    .item-showcase{
        margin:30px 0;
        border-top:1px solid #dedede;
        border-bottom:1px solid #dedede;
        padding:29px 0 0;
        overflow:hidden;
        text-align:center;
        clear:both;
        display:flex;
        flex-wrap:wrap
    }
    .item.resource .caption{
        font-size:15px;
        line-height:30px
    }
    .item.resource .caption *{
        margin:0 0 30px 0
    }
    .item.resource .caption>*:last-child{
        margin-bottom:0
    }
    .item-showcase .resource.item{
        vertical-align:top;
        margin-bottom:30px
    }
    .item-showcase .resource.item img{
        margin-right:15px;
        border: 4px solid;
    }
    .item-showcase .resource.item:only-child img{
        margin:0 auto
    }
    .item-showcase .resource.item:not(:only-child){
        width:25%;
        clear:none;
        padding:0 1.69492%
    }
    .item-showcase .resource.item:not(:only-child) h3{
        clear:left;
        font-size:15px;
        line-height:30px;
        margin:15px 0 0
    }
    .item-showcase .resource.item:not(:only-child) img{
        max-height:210px;
        width:auto;
        float:none;
        margin-right:0;
        vertical-align:top
    }
    .right,.left{
        overflow:hidden
    }
    .left .item.resource,.right .item.resource{
        margin:0 0 30px 0;
        width:-webkit-min-content;
        width:-moz-min-content;
        width:min-content;
        max-width:40vw
    }
    .left .item.resource:first-of-type,.right .item.resource:first-of-type{
        border-top:1px solid #dedede;
        padding-top:29px;
        margin-top:0
    }
    .left .item.resource:last-of-type,.right .item.resource:last-of-type{
        border-bottom:1px solid #dedede;
        padding-bottom:29px
    }
    .left .item.resource .media-render>*,.left .item.resource img,.right .item.resource .media-render>*,.right .item.resource img{
        max-width:40vw
    }
    .left:not(.file) .item.resource,.right:not(.file) .item.resource{
        max-width:50%
    }
    .file{
        display:-ms-grid;
        -ms-grid-columns:min-content
    }
    .left.file,.right.file{
        max-width:50%
    }
    .left.file{
        float:left;
        clear:left
    }
    .right.file{
        float:right;
        clear:right
    }
    .left .item.resource{
        float:left;
        margin-right:30px;
        clear:left
    }
    .right .item.resource{
        float:right;
        margin-left:30px;
        clear:right
    }
    .left .item.resource>a:first-child,.right .item.resource>a:first-child{
        vertical-align:top
    }
    .medium .item.resource>h3,.square .item.resource>h3{
        font-size:20px;
        line-height:30px
    }
    .left .item.resource>h3,.right .item.resource>h3{
        margin:0
    }
    .left .item.resource+p,.right .item.resource+p{
        margin-top:0
    }
    .break{
        width:100%;
        clear:both;
        border-bottom:1px solid #dedede;
        padding-bottom:-1px;
        margin:30px 0
    }
    .break.transparent{
        border-color:transparent
    }
    .break.opaque{
        border-color:#dedede
    }
    .preview-block{
        margin:30px 0;
        overflow:hidden
    }
    .resource-list.preview+a{
        background-color:#dedede;
        text-align:center;
        padding:7.5px;
        border-radius:2px;
        line-height:30px;
        display:inline-block;
        font-weight:bold
    }
    .resource-list.preview+a:hover{
        background-color:#787878;
        border-bottom-width:0px;
        color:#fff
    }
    .toc-block>ul{
        margin:30px 0;
        list-style-type:none;
        border-left:5px solid #ababab
    }
    .toc-block>ul>li{
        margin-bottom:15px
    }
    .toc-block>ul>li>a{
        font-weight:bold
    }
    .toc-block ul ul{
        list-style-type:none;
        padding-left:0
    }
    .toc-block ul ul ul{
        padding-left:1.25em
    }
    .toc-block ul ul li:before{
        content:"\2014";
        color:#dedede
    }
    .item-with-metadata .show.resource{
        margin:60px 0
    }
    .site-page-pagination{
        margin-top:60px;
        clear:both
    }
    .site-page-pagination a{
        background-color:#dedede;
        border-radius:2px;
        padding:7.5px;
        display:inline-block;
        appearance:none;
        -webkit-appearance:none;
        -moz-appearance:none;
        border:0;
        cursor:pointer
    }
    .list-of-sites .site-list .site{
        margin-bottom:15px
    }
    .list-of-sites .site-list .site-link{
        display:inline-block;
        font-size:25px;
        margin-bottom:7.5px
    }
    .list-of-sites .site-list .site-summary{
        margin:0 0 0 15px;
        line-height:20px
    }
    ul.resource-list{
        list-style-type:none;
        padding-left:0
    }
    ul.resource-list .resource{
        border-bottom:1px solid #dedede;
        padding-bottom:29px;
        margin:30px 0;
        overflow:hidden;
        position:relative
    }
    ul.resource-list .resource>*:last-child{
        margin-bottom:0
    }
    ul.resource-list .resource:first-child{
        border-top:1px solid #dedede;
        padding-top:29px
    }
    ul.resource-list .resource img{
        height:auto;
        width:60px;
        float:right;
        margin-left:15px
    }
    ul.resource-list .resource h4{
        margin-top:0
    }
    ul.resource-list .resource .description{
        max-height:90px;
        overflow:hidden;
        position:relative
    }
    ul.resource-list .resource .description:after{
        content:"";
        position:absolute;
        top:52.5px;
        left:0;
        right:0;
        height:37.5px;
        background:linear-gradient(to top, #f8f8f8, rgba(248,248,248,0))
    }
    ul.resource-list .resource img ~ *{
        width:calc(100% - 75px)
    }
    .search-filters{
        margin-bottom:30px
    }
    .filter-label,.filter-value{
        display:inline-block;
        border:1px solid #dedede;
        padding:6.5px
    }
    .filter-label{
        background-color:#dedede
    }
    .filter-value{
        margin-left:-5px
    }
    .browse-controls{
        display:flex;
        justify-content:space-between;
        flex-wrap:wrap
    }
    .advanced-search{
        line-height:45px
    }
    body.resource #content>h2:first-of-type+h3{
        font-size:15px;
        text-transform:uppercase;
        margin:-30px 0 30px
    }
    .property{
        padding: 0 0 20px 0px;
        /* min-width: 600px; */
    }
    .property h4{
        margin-bottom:0px;
        margin-top:0px;
        font-size:15px
    }
    .resource-link img{
        width:auto;
        height:45px;
        display:inline-block;
        vertical-align:middle;
        margin-right:7.5px
    }
    .property .value a{
        display:inline-block;
        vertical-align:middle
    }
    .property .value:not(:last-child) img{
        margin-bottom:7.5px
    }
    .property .value:not(:last-child) img+a{
        margin-bottom:7.5px
    }
    .property .value .language{
        background-color:#d1d1d1;
        padding:3.75px;
        font-size:10px
    }
    #content .media.resource{
        display:inline-block;
        text-align:center;
        vertical-align:bottom;
        margin-right:7.5px
    }
    #content .media.resource:hover{
        border-bottom:0
    }
    #content .media.resource img{
        vertical-align:top;
        margin-bottom:15px
    }
    .media-render>*{
        max-width:100%
    }
    #linked-resources caption{
        text-align:left;
        font-weight:bold;
        border-bottom:3px solid #ababab;
        padding:7.5px 15px 4.5px
    }
    #linked-filter h4{
        margin-bottom:15px
    }
    #linked-resources .resource-link{
        margin-bottom:0;
        display:flex;
        align-items:center
    }
    #advanced-search .value:not(:last-child){
        margin-bottom:15px
    }
    .remove-value{
        text-indent:-9999px;
        position:relative;
        width:45px;
        margin-left:7.5px
    }
    .remove-value:before{
        text-indent:0;
        position:absolute;
        top:0;
        right:0;
        bottom:0;
        left:0;
        line-height:45px
    }
    a.metadata-browse-link{
        font-size:15px
    }
}
@media screen and (min-width: 800px){
    #content{
        padding:0 3.38983% 30px
    }
    table{
        margin:30px 0;
        border-collapse:collapse
    }
    th,td{
        text-align:left;
        padding:7.5px 15px;
        padding-bottom:6.5px;
        border-bottom:1px solid #ababab
    }
    header{
        position:relative;
        padding:15px 0 0 0;
        margin-bottom:60px
    }
    header>*{
        padding:0 3.38983%
    }
    footer{
        padding:0 3.38983% 30px
    }
    header nav{
        margin:15px auto 0;
        position:static;
        padding:0 3.38983%
    }
    header nav:before{
        content:"";
        border:0;
        display:none
    }
    header nav ul a{
        padding:0
    }
    header nav ul li{
        position:static
    }
    header nav.closed ul,header nav ul ul li{
        height:auto;
        overflow:visible
    }
    header nav ul a:hover{
        background-color:transparent
    }
    header nav ul li,header nav>ul li:last-child,header nav>ul ul:hover>li{
        border:0
    }
    header nav ul.navigation{
        margin-left:-7.5px;
        position:static
    }
    header nav ul.navigation li ul:before{
        display:none
    }
    header nav ul.navigation li ul{
        display:none
    }
    header nav ul.navigation>li{
        display:inline-block
    }
    header nav ul.navigation>li:not(:last-child){
        margin-right:15px
    }
    header nav ul.navigation>li>ul{
        position: absolute;
        top: 100%;
        /* left: -9999px; */
        background-color: #fff;
        padding: 0;
        list-style: none;
        /* width: 100%; */
        border: solid #ababab;
        border-width: 1px 0;
        padding: 14px 0 6.5px;
        /* display: flex; */
        /* flex-direction: row; */
        flex-flow: row wrap;
        z-index: 1;
    }
    header nav ul.navigation>li:hover>ul{
        position: absolute;
        background-color: #ffffff;
        padding: 10px;
        border-radius: 5px;
        display: inline-block;
        min-width: 150px;
        /*max-width:1700px;*/
        /*margin-left:auto;*/
        /*margin-right:auto;*/
        /*padding:15px 3.38983%;*/
        /*left:0;*/
        /*right:0;*/
        /*border-bottom:0;*/
        /*border-color:#dedede*/
    }
    header nav ul.navigation>li:hover>ul:after{
        content:"";
        /*left:-9999px;*/
        /*right:-9999px;*/
        /*background-color:#fff;*/
        /*position:absolute;*/
        /*top:0;*/
        /*bottom:0;*/
        /*border-bottom:1px solid #dedede;*/
        /*z-index:-1*/
    }
    header nav ul.navigation>li>ul>li{
        /*width:25%;*/
        font-size:15px;
        font-weight:bold;
        /*padding-bottom:30px*/
    }
    header nav ul.navigation>li>ul>li ul{
        font-weight:normal;
        padding:0;
        list-style-type:none;
        height:auto
    }
    header nav>ul>li>a{
        margin:7.5px;
        height:30px
    }
    header nav>ul>li>a:not(:only-child):after{
        font-family:"Font Awesome 5 Free";
        content:"\f107";
        display:inline-block;
        margin-left:7.5px
    }
    header nav>ul li:hover ul li{
        /*height:auto;*/
        /*padding:0*/
    }
    header nav>ul>li>ul>li a,header nav>ul>li>ul>li>ul>li a{
        padding-left:0
    }
    .sub-menu ul{
        border-bottom:1px solid #dedede;
        padding-bottom:14px
    }
    .sub-menu li{
        display:inline-block;
        border:0;
        padding:0;
        margin-right:15px
    }
    .sub-menu li:first-of-type{
        border:0;
        padding:0
    }
    #search{
        left:75%;
        border-left:1px solid #dedede;
        padding:7.5px
    }
    #search form input[type="text"],#search form button[type="submit"]{
        height:30px;
        font-size:15px;
        line-height:30px
    }
    #search form button[type="submit"]{
        width:30px;
        height:30px;
        padding:0
    }
    #search form button[type="submit"]:before{
        line-height:30px
    }
    ul.resource-list .resource img{
        width:120px;
        height:auto;
        float:right;
        margin-left:15px
    }
    ul.resource-list .resource img ~ *{
        width:calc(100% - 135px)
    }
    body.item-set.item #content{
        display:flex;
        flex-wrap:wrap;
        align-items:flex-start;
        justify-content:flex-end
    }
    body.item-set.item #content>h2,body.item-set.item #content>h3{
        width:100%
    }
    body.item-set .metadata{
        width:32.20339%;
        border-left:5px solid #dedede;
        padding-left:1.69492%;
        margin-right:1.69492%
    }
    body.item-set .metadata h4:first-of-type{
        margin-top:0
    }
    body.item-set #content .metadata ~ *{
        width:66.10169%;
        border-left:1px solid #dedede;
        padding-left:1.69492%
    }
    body.item-set .item-set-items h3{
        margin-top:0
    }
    body.item-set .metadata ~ nav.pagination:first-of-type{
        margin-bottom:0
    }
    .preview-block{
        clear:both
    }
    ul.preview.resource-list li:first-of-type{
        border-top:1px solid #dedede;
        padding-top:29px
    }
}