@media screen {
    * {
        box-sizing: border-box;
    }
    html {
        height: 100%;
        padding: 0;
        margin: 0;
    }
    body {
        background-color: #f8f8f8;
        font-family: "Open Sans", sans-serif;
        font-size: 20px;
        line-height: 30px;
        margin: 0;
        word-wrap: break-word;
    }
    a:link {
        text-decoration: underline;
        color: #000;
    }
    a:visited {
        color: #000;
    }
    a:active,
    a:hover {
        color: #787878;
    }
    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;
    }
    .visuallyhidden {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }
    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: 30px 0;
        display: flex;
        flex-wrap: wrap;
    }
    .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-weight: 900;
        font-size: 15px;
    }
    .field .value:not(:last-child) {
        margin-bottom: 15px;
    }
    .field-description {
        font-size: 15px;
    }
    #skipnav {
        position: fixed;
        top: 30px;
        left: 50%;
        border: 1px solid #ababab;
        transform: translateX(-50%);
        z-index: -5;
        padding: 7.5px;
        background-color: #fff;
        opacity: 0
    }
    #skipnav:focus {
        z-index: 1000;
        opacity: 1
    }
    header h1 {
        margin: 0;
    }
    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";
        font-weight: 900;
        content: "\f0c9";
        display: block;
        width: 45px;
        height: 45px;
        border: 1px solid #dedede;
        text-align: center;
        border-radius: 2px;
        position: absolute;
        right: 1.69492%;
        top: -60px;
        cursor: pointer;
        line-height: 45px;
    }
    header nav.open:before {
        content: "\f00d";
    }
    header nav ul {
        padding-left: 0;
        list-style: none;
        position: relative;
        margin: 0 auto;
    }
    header nav ul span,
    header nav ul a {
        display: inline-block;
        width: 100%;
        padding: 7.5px;
    }
    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;
    }
    header nav ul li > ul:before {
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        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 #fefefe;
        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: 0.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;
    }
    .skip {
        position: absolute;
        left: -999em;
        padding: 0;
    }
    a.skip:active,
    a.skip:focus {
        left: 0em;
        top: 0em;
        border: 3px #3399cc solid;
        background-color: #fff;
        z-index: 999;
    }
    .site-title h1 {
        font-size: 25px;
        line-height: 30px;
        padding-right: 30px;
    }
    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 !important;
        margin-right: auto !important;
        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 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";
        font-weight: 900;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        text-align: center;
        text-indent: 0;
        line-height: 45px;
    }
    footer {
        padding: 0 1.69492% 30px;
        background-color: #fff;
        border-top: 1px solid #dedede;
    }
    footer h2 {
        font-size: 1rem;
        line-height: 1rem;
        font-weight: bold;
    }
    footer #ankle {
        font-size: 0.75rem;
        line-height: 1rem;
    }
    footer #logos-sponsors-section,
    footer #foot {
        font-size: 1rem;
    }
    footer > * {
        max-width: 1700px;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 1.69492%;
        display: block;
    }
}
@media screen and (min-width: 768px) {
    footer #license-citation-section {
        border-right: 2px solid #dedede;
    }
}
@media screen {
    #content {
        max-width: 1700px;
        margin-left: auto !important;
        margin-right: auto !important;
        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;
    }
    .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: 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 {
        margin-bottom: 30px;
    }
    .property h4 {
        margin-bottom: 0;
        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: 768px) {
    #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;
        clear: both;
    }
    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 {
        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,
    header nav ul.navigation > li > ul.open {
        max-width: 1700px;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 15px 3.38983%;
        left: 0;
        right: 0;
        border-bottom: 0;
        border-color: #dedede;
    }
    header nav ul.navigation > li:hover > ul:after,
    header nav ul.navigation > li > ul.open: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;
    }
    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";
        font-weight: 900;
        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 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;
    }
}

a:link {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
#user-bar a:link {
    text-decoration: none;
}
#user-bar a:hover {
    text-decoration: underline;
}

footer {
    padding-top: 40px;
}
footer h2 {
    margin-bottom: 20px !important;
    font-size: 20px !important;
}
footer p {
    font-size: 15px;
    margin-top: 20px !important;
}
footer #logos-sponsors-section {
    width: 100%;
    /* max-width: 100%; */
    text-align: center;
    flex: none;
}
@media screen and (max-width: 767px) {
    footer #ankle {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        max-width: 600px;
    }
    footer #logos-sponsors-section {
        margin-left: auto;
        margin-right: auto;
        max-width: 600px !important;
    }
}

@media screen and (max-width: 767px) {
    footer #logos-sponsors-section {
        max-width: 600px !important;
    }
}
@media screen and (max-width: 767px) {
    footer #logos-sponsors-section {
        max-width: 100%;
    }
}

body.media {
    display:initial;
}
