@media screen {
    * {
        box-sizing: border-box;
    }
    html {
        margin: 0;
        padding: 0;
    }
    body {
        background-color: white;
        font-family: "Open Sans", sans-serif;
        margin: auto;
        max-width: 1240px;
        word-wrap: break-word;
        display: flex;
        flex-direction: column;
        min-height: 100vh;
    }
    body > main {
        flex-grow: 1;
    }
    a:link {
        text-decoration: none;
        color: #4386e2;
        font-weight: bold;
    }
    a:visited {
        color: #4386e2;
    }
    button.update_selection,
    button.update_basket {
        border: none;
        background: none;
    }
    div.remove_selection,
    div.remove_basket {
        display: block;
        background: url('../img/remove_basket.png') no-repeat;
        background-size: cover;
        width: 16px;
        /* Height of new image */
        height: 16px;
        /* Equal to width of new image */
        padding-left: 8px;
    }
    .selection-update,
    .basket-update {
        line-height: 16px;
        padding: 0;
        border: 0 none;
        background-color: transparent;
        cursor: pointer;
    }
    .selection-update::before,
    .basket-update::before {
        content: '';
        display: inline-block;
        background-size: cover;
        /* Width of new image */
        width: 16px;
        /* Height of new image */
        height: 16px;
    }
    .selection-update.unselected::before,
    .selection-add::before,
    .basket-update.unselected::before,
    .basket-add::before {
        background-image: url('../img/pin.svg');
    }
    .selection-update.selected::before,
    .selection-delete::before,
    .basket-update.selected::before,
    .basket-delete::before {
        background-image: url('../img/pin-full.svg');
    }
    .user-links > * {
        font-size: 14px;
    }
    a.show_selection::before,
    a.show_basket::before {
        content: '';
        display: inline-block;
        background-image: url('../img/pin.svg');
        background-size: cover;
        width: 16px;
        height: 16px;
        margin-right: 0.5em;
    }
    a:active,
    a:hover {
        color: #366bb5;
    }
    img {
        max-width: 100%;
        max-height: 100%;
        height: auto;
    }
    .leaflet-container img {
        max-height: initial;
        max-width: initial;
    }

    /* @group ----- Forms ----- */

    input,
    textarea,
    button {
        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"] {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        height: 2.25em;
        border-color: rgba(0, 0, 0, 0.15);
        border-width: 0.05em;
        border-style: solid;
        padding: -0.05em;
        padding: 0.375em 1.69492%;
        margin: 0;
    }
    ::-webkit-input-placeholder,
    /* Firefox 18- */
    :-moz-placeholder,
    /* Firefox 19+ */
    ::-moz-placeholder,
    :-ms-input-placeholder {
        font-style: italic;
    }
    .field {
        display: -ms-flexbox;
        display: -webkit-box;
        display: flex;
        margin: 1em 0;
    }
    .field .field-meta {
        padding-right: 1em;
        display: flex;
        align-items: center;
    }
    #advanced-search .field .field-meta {
        width: 30%;
    }
    #advanced-search .field .inputs {
        width: 70%;
        padding-left: 1.69492%;
    }
    #advanced-search .field .collapsible {
        font-size: 13.5px;
        display: block;
        clear: both;
        line-height: 18px;
    }

    /* Header */

    body > header {
        display: flex;
        justify-content: space-between;
        align-items: right;
        flex-wrap: wrap;
        border-bottom: 1px solid rgb(166, 180, 198);
		padding-bottom: 10px;
    }
    body > header .inside > * {
        display: inline-block;
		margin-top: 10px;
		margin-bottom: 10px;
    }
    body > header .main-menu-small {
        display: none;
    }
    body > header nav li > a:link,
    body > header nav li > a:visited,
    body > header nav li > a:active {
        color: #404750;
    }
    body > header nav li:hover > a:link,
    body > header nav li:hover > a:visited,
    body > header nav li:hover > a:active {
        background-color: #4386e2;
        color: #ffffff;
    }
    body > header nav > ul {
        margin: 0;
        padding: 0;
        display: inline-block;
        flex-wrap: wrap;
        justify-content: flex-end;
		text-align: center;
    }
    body > header nav > ul > li {
        display: inline-block;
        position: relative;
    }
    body > header nav > ul > li > a {
        display: block;
        padding: 5px 5px 5px 10px;
        font-size: 22px;
        font-weight: bold;
        text-transform: uppercase;
    }
    body > header nav > ul > li > a::after {
        content: '';
        display: inline-block;
        margin-left: 5px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 10px 10px;
        border-color: transparent transparent #e3e3e6 transparent;
    }
    body > header nav > ul > li:hover > a::after {
        visibility: hidden;
    }
    body > header nav li ul {
        display: none;
        position: absolute;
        right: 0;
        margin: 0;
        padding: 0;
        width: 100%;
        z-index: 1;
        border: 1px solid #e3e3e6;
        background-color: white;
    }
    body > header nav li:hover ul {
        display: block;
    }
    body > header nav li ul li {
        display: block;
    }
    body > header nav li ul li a {
        display: block;
        padding: 7px 7px;
    }
    div.inside {
        display: inline-block;
		box-sizing: border-box;
		width: 100%;
		margin: 30px 1px 30px 1px;
		text-align: center;
	}
	div.user-links {
        text-align: end;
    }
	nav.breadcrumbs {
        margin-top: 0.5em;
        margin-bottom: 1em;
    }

    /* Footer */

    body > footer {
    display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: center;
	margin-top: 7em;
	border-top: solid 1px lightgray;
	padding-top: 2em;
	padding-bottom: 2em;
    }
    body > footer ul.menu {
        margin: 0;
        padding: 0;
    }
    body > footer ul.menu li {
        display: inline-block;
        margin: 0 10px;
    }
    body > footer ul.menu li a {
        text-transform: uppercase;
        font-weight: bold;
        color: #282836;
    }
    body > footer .copyright {
        font-weight: 300;
        font-size: 0.8em;
        line-height: 3em;
    }

    /* Advanced Search */

    #advanced-search .field .field-meta {
        font-size: 1.2em;
    }

    #advanced-search select,
    #advanced-search input[type="text"],
    #advanced-search input[type="password"],
    #advanced-search input[type="email"],
    #advanced-search input[type="url"],
    #advanced-search 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;
    }
    #advanced-search select[multiple] {
        height: inherit;
        min-width: 50%
    }
    #advanced-search input,
    #advanced-search textarea,
    #advanced-search button,
    #advanced-search .button,
    #advanced-search select {
        font-size: 1.2em;
        line-height: 30px;
        margin: 0;
        vertical-align: top;
    }
    #advanced-search button,
    #advanced-search a.button,
    #advanced-search [type="submit"] {
        border-radius: 2px;
        padding: 7.5px;
        display: inline-block;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border: 0;
        cursor: pointer;
    }
    .remove-value {
        background-color: #dedede;
        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;
    }

    /* Home page */

    #search-form-wrapper {
        background-color: #ffffff;
        background-image: url(../img/background.jpg);
        background-size: cover;
        background-position: 0 32px;
        background-repeat: no-repeat;
        /*padding: 0 20px;*/
        min-height: 560px;
    }

    #search {
        border: 1px solid rgb(188, 188, 188);
        margin-bottom: 2em;
    }
    #search-form {
        display: flex;
        background-color: white;
    }
    #search-form input[name=search] {
        flex: 1;
        position: static;
        border: 0 none;
        width: 100%;
        height: 100%;
        padding-left: 50px;
        font-size: 20px;
    }
    #search-form button[type=submit] {
        margin-right: 0;
        border-right: 0 none;
        background-color: rgb(67, 134, 226);
        border-bottom: 0 none;
        flex-basis: 50px;
        /* width: 100%; */
        /* height: 100%; */
        color: white;
        font-size: 20px;
    }

    ul.psl-tabs {
        background-color: white;
    }
    ul.psl-tabs li {
        background-color: rgb(67, 134, 226);
        border-right: 0 none;
        border-bottom: 0 none;
        margin-right: 10px;
    }
    ul.psl-tabs li:last-child {
        margin-right: 0;
    }
    ul.psl-tabs li.psl-tab-active {
        background-color: rgb(63, 55, 133);
    }
    ul.psl-tabs li.psl-tab-map a {
        background: url(../img/earth-globe.svg);
        background-repeat: no-repeat;
        background-position: center center;
    }
    ul.psl-tabs li.psl-tab-map i::before {
        content: '';
    }
    ul.psl-tabs li.psl-tab-date a {
        background: url(../img/clock.svg);
        background-repeat: no-repeat;
        background-position: center center;
    }
    ul.psl-tabs li.psl-tab-date i::before {
        content: '';
    }
    ul.psl-tabs li.psl-tab-itemset a {
        background: url(../img/shelf.svg);
        background-repeat: no-repeat;
        background-position: center center;
    }
    ul.psl-tabs li.psl-tab-itemset i::before {
        content: '';
    }
    ul.psl-tabs li.psl-tab-text a {
        background: url(../img/plus.svg);
        background-repeat: no-repeat;
        background-position: center center;
    }
    ul.psl-tabs li.psl-tab-text i::before {
        content: '';
    }
    ul.psl-tabs a {
        color: white;
    }
    ul.psl-tabs li.psl-tab-submit input {
        background-color: rgb(67, 134, 226);
        color: white;
    }

    #psl-search-form-wrapper .psl-new-search {
        background-color: rgb(228, 73, 17);
        color: white;
        margin-top: 55px;
        padding: 1px 6px;
        font-size: 20px;
    }
    #psl-search-form {
        border: 1px solid rgb(188, 188, 188);
    }
    #psl-search-form .psl-tab-search input {
        position: static;
    }
    #psl-search-form > div {
        border-top: 1px solid rgb(188, 188, 188);
        background-color: rgb(208, 225, 248);
    }
    #psl-search-form > div button.reset-tab {
        background-color: rgb(57, 134, 226);
        border: 0 none;
        color: white;
        padding: 0 6px;
        margin-top: 1em;
    }
    #psl-search-form > div#psl-search-form-map {
        padding: 0;
    }
    #psl-search-form > div#psl-search-form-map button.reset-tab {
        position: absolute;
        bottom: 0.5em;
        left: 1em;
    }
    #psl-search-form #psl-search-form-date {
        padding-left: 100px;
        padding-right: 100px;
    }
    #psl-search-form-date > label {
        text-transform: uppercase;
        color: rgb(67, 134, 226);
        font-size: 120%;
    }
    #psl-search-form-date #psl-search-form-date-slider .ui-slider-range {
        background-color: rgb(67, 134, 226);
    }
    #psl-search-form-date #psl-search-form-date-slider .ui-slider-handle {
        background-color: rgb(67, 134, 226);
    }
    #psl-search-form #psl-search-form-itemset {
        padding-left: 200px;
        padding-right: 200px;
    }
    #psl-search-form-itemset .field-meta {
        display: none;
    }
    #psl-search-form-itemset .inputs {
        display: flex;
        flex-wrap: wrap;
    }
    #psl-search-form-itemset label {
        flex-basis: 50%;
        margin-top: 1em;
    }
    #psl-search-form #psl-search-form-text {
        padding-left: 100px;
        padding-right: 100px;
    }
    #psl-search-form-text > div {
        display: flex;
        justify-content: space-around;
        align-items: flex-start;
    }
    #psl-search-form-text .filters {
        flex-grow: 1;
    }
    @supports (-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none) {
        #psl-search-form-text select {
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background-color: white;
            background-image: url(../img/caret-down.svg);
            background-size: 10px 10px;
            background-repeat: no-repeat;
            background-position: right 10px center;
            padding-left: 10px;
            padding-right: 30px;
            border: 1px solid grey;
        }
    }
    #psl-search-form-text button.psl-add-filter {
        background-color: white;
        border: 2px solid rgb(67, 134, 226);
        border-radius: 20px;
        color: rgb(67, 134, 226);
    }
    .leaflet-bar {
        box-shadow: none;
    }
    .leaflet-bar a {
        margin: 2px 0;
    }
    .leaflet-bar a,
    .leaflet-bar a:hover {
        line-height: 22px;
    }
    .leaflet-bar a,
    .leaflet-bar a:first-child,
    .leaflet-bar a:last-child {
        border-radius: 13px;
        border: 1px solid rgb(67, 134, 226);
    }
    .leaflet-touch .leaflet-bar a:first-child {
        border-top-left-radius: 13px;
        border-top-right-radius: 13px;
        border-bottom-left-radius: 2px;
        border-bottom-right-radius: 2px;
    }
    .leaflet-touch .leaflet-bar a:last-child {
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
        border-bottom-left-radius: 13px;
        border-bottom-right-radius: 13px;
    }

    .home .preview-block > header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .home .preview-block > header > .ruler {
        flex-grow: 1;
        border-top: 1px solid rgb(188, 188, 188);
        margin: 0 20px;
        height: 2px;
    }
    .home .preview-block > header a {
        white-space: nowrap;
        text-transform: uppercase;
        height: 1.5em;
        margin-top: 1.6em;
        margin-bottom: 1.6em;
    }
    .home .preview-block > header a img {
        vertical-align: middle;
        margin-right: 1em;
    }
    .home .preview-block > main {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .home .preview-block > main > * {
        flex-basis: 25%;
        padding: 0 10px;
        margin-bottom: 60px;
    }
    .home .preview-block .resource > a {
        position: relative;
        display: inline-block;
        height: 280px;
        width: 100%;
        background-size: cover;
        background-position: center;
        background-color: rgb(188, 188, 187);
    }
    .home .preview-block .resource .dcterms-title {
        width: 60%;
        position: absolute;
        bottom: -40px;
        right: 0;
    }
    .home .preview-block .resource .dcterms-title::after {
        content: '';
        display: block;
        border-right: 169px solid transparent;
        border-top: 40px solid black;
    }
    .home .preview-block .resource .dcterms-title > div {
        background-color: black;
        padding: 12px 12px 10px 12px;
        height: 85px;
    }
    .home .preview-block .resource .dcterms-title span {
        display: block;
        height: 100%;
        overflow: hidden;
        /*text-transform: uppercase;*/
        color: white;
        font-size: 13px;
        font-weight: bold;
    }
    .home .preview-block .resource:nth-child(8n+1) .dcterms-title > div {
        background-color: rgb(67, 134, 226);
    }
    .home .preview-block .resource:nth-child(8n+1) .dcterms-title::after {
        border-top-color: rgb(67, 134, 226);
    }
    .home .preview-block .resource:nth-child(8n+2) .dcterms-title > div {
        background-color: rgb(229, 73, 17);
    }
    .home .preview-block .resource:nth-child(8n+2) .dcterms-title::after {
        border-top-color: rgb(229, 73, 17);
    }
    .home .preview-block .resource:nth-child(8n+3) .dcterms-title > div {
        background-color: rgb(104, 125, 154);
    }
    .home .preview-block .resource:nth-child(8n+3) .dcterms-title::after {
        border-top-color: rgb(104, 125, 154);
    }
    .home .preview-block .resource:nth-child(8n+4) .dcterms-title > div {
        background-color: rgb(224, 27, 42);
    }
    .home .preview-block .resource:nth-child(8n+4) .dcterms-title::after {
        border-top-color: rgb(224, 27, 42);
    }
    .home .preview-block .resource:nth-child(8n+5) .dcterms-title > div {
        background-color: rgb(62, 55, 133);
    }
    .home .preview-block .resource:nth-child(8n+5) .dcterms-title::after {
        border-top-color: rgb(62, 55, 133);
    }
    .home .preview-block .resource:nth-child(8n+6) .dcterms-title > div {
        background-color: rgb(255, 215, 0);
    }
    .home .preview-block .resource:nth-child(8n+6) .dcterms-title::after {
        border-top-color: rgb(255, 215, 0);
    }
    .home .preview-block .resource:nth-child(8n+7) .dcterms-title > div {
        background-color: rgb(135, 196, 37);
    }
    .home .preview-block .resource:nth-child(8n+7) .dcterms-title::after {
        border-top-color: rgb(135, 196, 37);
    }
    .home .preview-block .resource:nth-child(8n+8) .dcterms-title > div {
        background-color: rgb(208, 225, 248);
    }
    .home .preview-block .resource:nth-child(8n+8) .dcterms-title::after {
        border-top-color: rgb(208, 225, 248);
    }

    /* Search/browse page. */

    .search-results-sort,
    .browse-sort {
        display: flex;
        margin-left: 0.5em;
        border-bottom: 2px solid rgb(83, 100, 123);
        align-items: center;
    }
    .search-results-sort > span,
    .browse-sort > span {
        margin-right: 2em;
        color: rgb(83, 100, 123);
    }
    .search-results-sort .sort-field,
    .browse-sort .sort-field {
        display: flex;
        align-items: center;
        margin-left: 1em;
        min-height: 40px;
        cursor: pointer;
    }
    .search-results-sort .sort-directions,
    .browse-sort .sort-directions {
        margin-left: 0.5em;
        min-width: 13px;
    }
    .search-results-sort .sort-direction,
    .browse-sort .sort-direction {
        cursor: pointer;
        display: none;
    }
    .search-results-sort .sort-direction:hover,
    .browse-sort .sort-direction:hover {
        background-color: 1px solid #efefef;
    }
    .search-results-sort .sort-field:hover .sort-direction,
    .browse-sort .sort-field:hover .sort-direction {
        display: block;
    }
    .search-results-sort .sort-direction.sort-active,
    .browse-sort .sort-direction.sort-active {
        display: block;
    }
    .search-results h3,
    .browse-list h3 {
        margin-left: 0.5em;
    }
    .search-view-type,
    .browse-view-type {
        display: inline-block;
        margin-left: 10px;
    }
    .search-view-type:last-child,
    .browse-view-type:last-child {
        margin-right: 1px;
    }
    .search-view-type img,
    .browse-view-type img {
        width: 49px;
        background-color: #687d9a;
        display: block;
    }
    .search-view-type.active img,
    .browse-view-type.active img {
        background-color: #53647b;
    }
    aside.search-sidebar {
        flex-basis: 25%;
        flex-shrink: 0;
        order: -1;
        margin-right: 2em;
        padding: 0 0.5em;
    }
    aside.search-sidebar > ul {
        margin: 0;
        margin-bottom: 1em;
        padding: 0;
        display: flex;
        border-bottom: 2px solid rgb(83, 100, 123);
        line-height: 52px;
        font-size: 20px;
        font-weight: normal;
        text-transform: uppercase;
    }
    aside.search-sidebar > ul li {
        display: inline-block;
        margin-right: 0.5em;
    }
    aside.search-sidebar > ul li a {
        color: rgb(104, 125, 154);
    }
    aside.search-sidebar > ul li a.active {
        font-weight: 600;
    }
    .search-facets {
        padding: 0;
    }
    .search-facets h3 {
        border-bottom: 1px solid rgb(104, 125, 154);
        font-size: 18px;
        font-weight: normal;
        text-transform: uppercase;
        color: rgb(104, 125, 154);
    }
    .search-facet-items {
        padding-left: 0;
    }
    .search-facet-items a {
        color: rgb(65, 71, 80);
        font-weight: normal;
    }
    .search-facet-item a::before {
        content: '';
        display: inline-block;
        width: 15px;
        height: 20px;
        background-image: url(../img/checkbox-empty.svg);
        background-size: 15px 15px;
        background-repeat: no-repeat;
        vertical-align: middle;
        margin-right: 1em;
    }
    .search-facet-item .active a::before {
        content: '';
        background-image: url(../img/checkbox-checked.svg);
    }
    .resource-list {
        display: flex;
    }
    .resource-list.list {
        flex-direction: column;
    }
    .resource-list.grid {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .resource-list.grid > * {
        flex-basis: 33%;
    }
    .resource-list.grid .resource {
        margin-bottom: 2em;
    }
    .resource-list .resource .resource-thumbnail {
        height: 200px;
        width: 200px;
        background-color: rgb(188, 188, 187);
        flex-shrink: 0;
    }
    .resource-list.list .resource .resource-metadata > div {
        margin-top: 0.5em;
    }
    .resource-list.grid .resource .resource-metadata > div {
        text-align: center;
    }
    .resource-list .resource h4 {
        /*font-size: 110%;*/
    }
    .resource-list.grid .resource h4 {
        margin: 0;
        font-weight: normal;
    }
    .resource-list .resource h4 button.selection-update,
    .resource-list .resource h4 button.basket-update {
        margin-right: 0.25em;
    }
    .resource-list .resource .creator {
        font-size: 110%;
        font-weight: 600;
    }
    .resource-list .resource .description {
        font-size: 90%;
    }
    .resource-list.grid .resource {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
    .resource-list.grid .resource h4 {
        text-align: center;
    }
    .resource-list.list .resource {
        margin-top: 2em;
        display: flex;
    }
    .resource-list.grid .resource-metadata > div {
        display: none;
    }
    .resource-list.grid .resource .items-count,
    .resource-list.grid .resource .dcterms-created {
        display: block;
    }
    .resource-list.list .resource .resource-thumbnail {
        margin-right: 2em;
    }
    .search-results-footer,
    .browse-footer {
        display: flex;
        justify-content: flex-end;
        margin-top: 2em;
    }
    nav.pagination {
        display: flex;
        justify-content: flex-end;
        margin-top: 2em;
    }
    nav.pagination .page {
        margin-left: 0.25em;
        margin-right: 0.25em;
    }
    nav.pagination .page > * {
        padding-left: 0.25em;
        padding-right: 0.25em;
    }
    nav.pagination .page a {
        color: rgb(65, 71, 80);
    }
    nav.pagination .page.active {
        color: rgb(67, 134, 226);
    }
    body.resource.item.show .media-list-wrapper {
        margin-top: 2em;
        margin-bottom: 2em;
    }
    body.resource.item.show .media-list-wrapper .media-list-toggle {
        display: inline-block;
        border: 1px solid rgb(188, 188, 188);
        padding: 0.5em 0.5em 0.5em 2em;
        cursor: pointer;
    }
    body.resource.item.show .media-list-wrapper .media-list-toggle::after {
        content: '';
        display: inline-block;
        background-size: contain;
        width: 12px;
        height: 10px;
        margin-left: 2em;
    }
    body.resource.item.show .media-list-wrapper .media-list-toggle.media-list-visible::after {
        background-image: url(../img/caret-up.svg);
    }
    body.resource.item.show .media-list-wrapper .media-list-toggle.media-list-hidden::after {
        background-image: url(../img/caret-down.svg);
    }
    body.resource.item.show .media-list {
        display: flex;
        flex-wrap: wrap;
    }
    body.resource.item.show .media-list > * {
        flex-basis: 12%;
        flex-shrink: 0;
        padding: 1em;
    }
    .resource-metadata-wrapper {
        /*display: inline-block;*/
        /* width: 600px;*/
        float: right;
        /* width: 46%; */
        width: 50%;
        min-height: 600px;
    }
    .resource-metadata-wrapper::after {
        content: '';
        display: block;
        border-right: 564px solid transparent;
        border-top: 150px solid rgb(231, 239, 250);
    }
    .resource-metadata-wrapper .resource-metadata {
        background-color: rgb(231, 239, 250);
        background-image: url(../img/metadata-corner.svg);
        background-repeat: no-repeat;
        padding: 2em 1em 0 1em;
    }
    .resource-metadata-wrapper .resource-metadata h2,
    .resource-metadata-wrapper .resource-metadata h4 {
        color: rgb(67, 134, 226);
        margin-top: 0;
    }
    .resource-metadata-wrapper .resource-metadata .property {
        /*margin-top: 1em;*/
        display: flex;
    }
    .resource-metadata-wrapper .resource-metadata .property h4 {
        /*margin-right: 2em;*/
        width: 23%;
        min-width: 23%;
        text-transform: uppercase;
    }
    .resource-metadata-wrapper .resource-metadata .property .value {
        margin-bottom: 1em;
        margin-left: 1em;
    }
    .selection-header,
    .basket-header {
        display: flex;
        justify-content: space-between;
    }
    .selection-header h2,
    .basket-header h2 {
        margin: 0;
        padding: 0.5em 1em;
        border: 1px solid rgb(188, 188, 188);
        text-transform: uppercase;
        color: rgb(108, 134, 30);
        font-weight: 600;
        font-size: 22px;
    }
    .selection-sort,
    .basket-sort {
        flex-grow: 1;
        display: flex;
        margin-left: 3em;
        margin-right: 3em;
        border-bottom: 2px solid rgb(83, 100, 123);
        align-items: center;
    }
    .selection-sort > span,
    .basket-sort > span {
        margin-right: 2em;
        color: rgb(83, 100, 123);
    }
    .selection-sort .sort-field,
    .basket-sort .sort-field {
        display: flex;
        align-items: center;
        margin-left: 1em;
        min-height: 40px;
        cursor: pointer;
    }
    .selection-sort .sort-directions,
    .basket-sort .sort-directions {
        margin-left: 0.5em;
        min-width: 13px;
    }
    .selection-sort .sort-direction,
    .basket-sort .sort-direction {
        cursor: pointer;
        display: none;
    }
    .selection-sort .sort-direction:hover,
    .basket-sort .sort-direction:hover {
        background-color: 1px solid #efefef;
    }
    .selection-sort .sort-field:hover .sort-direction,
    .basket-sort .sort-field:hover .sort-direction {
        display: block;
    }
    .selection-sort .sort-direction.sort-active,
    .basket-sort .sort-direction.sort-active {
        display: block;
    }
    #psl-toolbox {
        position: fixed;
        left: 0;
        top: 200px;
        border: 1px solid rgb(188, 188, 188);
        display: flex;
        background-color: white;
    }
    #psl-toolbox * {
        position: static;
    }
    #psl-toolbox ul {
        margin: 0;
        padding: 0;
    }
    #psl-toolbox ul li {
        display: block;
    }
    #psl-toolbox ul li > * {
        display: block;
        padding: 20px 10px;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    #psl-toolbox ul li > *::before {
        content: '';
        display: block;
        width: 28px;
        height: 31px;
        background-size: contain;
        background-repeat: no-repeat;
    }
    #psl-toolbox ul li.selection > button::before,
    #psl-toolbox ul li.basket > button::before {
        background-image: url(../img/pin-blue.svg);
    }
    #psl-toolbox ul li.selection > button.selection-update.selected::before,
    #psl-toolbox ul li.basket > button.basket-update.selected::before,
    #psl-toolbox ul li.basket > button.basket-delete::before {
        background-image: url(../img/pin-full-blue.svg);
    }
    #psl-toolbox ul li.share > a::before {
        background-image: url(../img/share-blue.svg);
    }
    #psl-toolbox ul li.download > a::before {
        background-image: url(../img/download.svg);
    }
    #psl-toolbox ul li:hover > * {
        background-color: rgb(40, 83, 141);
    }
    #psl-toolbox ul li.selection:hover > button::before,
    #psl-toolbox ul li.basket:hover > button::before {
        background-image: url(../img/pin-white.svg);
    }
    #psl-toolbox ul li.selection:hover > button.selection-updated.selected::before,
    #psl-toolbox ul li.basket:hover > button.basket-updated.selected::before,
    #psl-toolbox ul li.basket:hover > button.basket-delete::before {
        background-image: url(../img/pin-full-white.svg);
    }
    #psl-toolbox ul li.share:hover > a::before {
        background-image: url(../img/share-white.svg);
    }
    #psl-toolbox ul li.download:hover > a::before {
        background-image: url(../img/download-white.svg);
    }
    #psl-toolbox > div {
        display: none;
        border-left: 1px solid rgb(188, 188, 188);
        padding: 0.5em;
    }
    #psl-toolbox label {
        display: block;
        font-weight: 600;
        color: rgb(40, 83, 141);
    }
    #psl-toolbox-download a {
        display: block;
    }
}
@media screen and (min-width: 1200px) {
    body {
        font-size: 13px;
    }
    h1 {
        font-size: 30px;
    }
    h2 {
        font-size: 21px;
    }
    h3 {
        font-size: 13px;
    }
}
@media screen and (min-width: 992px) and (max-width: 1200px) {
    body {
        font-size: 13px;
    }
    h1 {
        font-size: 30px;
    }
    h2 {
        font-size: 241x;
    }
    h3 {
        font-size: 13px;
    }
}
@media screen and (min-width: 768px) and (max-width: 992px) {
    body {
        font-size: 12px;
    }
    h1 {
        font-size: 27px;
    }
    h2 {
        font-size: 19px;
    }
    h3 {
        font-size: 11px;
    }
    #psl-search-form #psl-search-form-date,
    #psl-search-form #psl-search-form-text {
        padding-left: 80px;
        padding-right: 80px;
    }
    #psl-search-form #psl-search-form-itemset {
        padding-left: 150px;
        padding-right: 150px;
    }
    .home .preview-block .resource .dcterms-title::after {
        border-right: 132px solid transparent;
    }
}
@media screen and (max-width: 944px) {
    .home .preview-block .resource .dcterms-title::after {
        border-right: 120px solid transparent;
    }
}
@media screen and (max-width: 880px) {
    .home .preview-block .resource .dcterms-title::after {
        border-right: 100px solid transparent;
    }
}
@media screen and (max-width: 768px) {
    body {
        font-size: 13px;
    }
    h1 {
        font-size: 30px;
    }
    h2 {
        font-size: 21px;
    }
    h3 {
        font-size: 13px;
    }
    #psl-search-form #psl-search-form-date,
    #psl-search-form #psl-search-form-itemset,
    #psl-search-form #psl-search-form-text {
        padding-left: 20px;
        padding-right: 20px;
    }
    .home .preview-block .resource .dcterms-title::after {
        border-right: 80px solid transparent;
    }
}
@media screen and (max-width: 600px) {
    .home .preview-block .resource .dcterms-title::after {
        border-right: 60px solid transparent;
    }
}

/* classes PSL*/

.resource.browse .advanced-search {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 2em;
    margin-top: 2em;
}

div.psl_item {
    overflow: hidden;
    width: 100%;
}
div.psl_uv {
    /* width: 53%; */
    width: 50%;
    float: left;
}
video {
    max-height: 100%;
    max-width: 100%;
}
