/* LIBRARY SEARCH HEADER */
header .libsearch_header_hidden{
    position:relative;
    overflow:visible;
}

/* hide libsearch if selected */
header .libsearch_header_hidden .search{
    display:none;
}

/* hide reveal button by default */
header #library_search_reveal{
    display:none;
}

/* javascript moves it in the DOM */
section#library_search_reveal{
    margin:0;
}

section#library_search_reveal .row{
    position:relative;
    z-index: 1;
    padding:0;
}

section#library_search_reveal .row a{
    display:inline-block;
    position:absolute;
    right:0;
    transition:all 0.1s linear;
    background-color:#6D6D6D;
    padding:7px 15px 10px 15px;
    color:#FFFFFF;
    border-radius:0 0 15px 15px;
    font-family:Derailed-Regular,Raleway-Regular,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size:1rem;
    box-shadow:inset 0px 11px 8px -10px #333333;
    box-shadow:0px 0px 15px 1px rgba(255,255,255,.2);
    border-top:0;
}

section#library_search_reveal .row a:hover{
    text-decoration:none;
    background-color:#267aa1;
    padding:12px 15px 15px 15px;
}

section#library_search_reveal .row a span[id*=library_search_reveal_icon]{
    display:inline-block;
    width:16px;
    height:16px;
}

section#library_search_reveal .row a span#library_search_reveal_spacer{
    display:inline-block;
    width:5px;
}

section#library_search_reveal .row a span#library_search_reveal_icon_search{
    background-image:url("../images/icon-search.svg");
    margin-bottom:-2px;
}

section#library_search_reveal .row a span#library_search_reveal_icon_account{
    background-image:url("../images/icon-account.svg");
}

@media screen and (max-width:48rem){
    section#library_search_reveal .row a{
        padding:4px 10px 6px 10px;
        font-size:.8rem;
        border-radius:0 0 10px 10px;
        margin-right:.9375rem;
    }

    section#library_search_reveal .row a:hover{
        padding:7px 10px 9px 10px;
    }

    section#library_search_reveal .row a span[id*=library_search_reveal_icon]{
        width:12px;
        height:12px;
    }

    section#library_search_reveal .row a span#library_search_reveal_spacer{
        width:5px;
    }
}

header form#searchForm select#searchBox,
header .search .searchBoxInput/*T4 selector*/{
    width:calc(70% - 63px) !important;
    font-size:1.2rem;
}

header form#searchForm select#searchBox::placeholder,
header .search .searchBoxInput::placeholder/*T4 selector*/{
    color:#FFFFFF;
    opacity:1;
}

header form#searchForm select#searchSelect{
    /* everything except width copied from T4 CSS */
    height:4rem;
    width:30%;
    position:absolute;
    -webkit-transition: background-color .2s ease-in-out;
    -o-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out;
    font-size:1.2rem;
    color:#FFFFFF;
    border:1px solid #FFFFFF;
    border-left-width:0;
    background-color:transparent;
    font-family:Derailed-Regular,Raleway-Regular,Helvetica Neue,Helvetica,Arial,sans-serif;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius:0;
    background-image:url("../images/icon-arrow-down-white.svg");
    background-size:auto 75%;
    background-repeat:no-repeat;
    background-position: right center;
    padding-right:45px !important;
    padding:1rem;
}

html.browser-ie header form#searchForm select#searchSelect{
    background-image:url("../images/icon-arrow-down-white.png");
    background-size:35px;
    background-position:right 10px center;
    margin-left:-4px;
}

html.browser-ie header form#searchForm select#searchSelect::-ms-expand {
    display: none;
}

header form#searchForm select#searchSelect:hover{
    background-color:rgba(0,0,0,.25);
}

#searchSelect option {
    background: #4c4c4c;
}

header #librarySearchLinks{
    /*font-family:Derailed-Bold;*/
    font-family:Derailed-Regular;
    color:#FFFFFF;
    margin-top:15px;
    /*font-size:1.1rem;*/
    font-size:.9rem;
}

header #librarySearchLinks a{
    color:#FFFFFF;
    margin-right:20px;
    text-decoration:none !important;
}

header #librarySearchLinks a:hover{
    text-decoration:underline !important;
}

header #librarySearchLinks a#library_search_account{
    background-image:url("../images/icon-account.svg");
    background-repeat:no-repeat;
    padding-left:25px;
}

html.browser-ie header #librarySearchLinks a#library_search_account{
    background-image:url("../images/icon-account.png");
    background-size:18px;
    background-position:left center;
}

#searchForm[name="heroSearchSpecialCollections"] #librarySearchLinks {
    text-align: right;
}

#searchForm[name="heroSearchSpecialCollections"] #librarySearchLinks a {
    margin-right:0;
    margin-left:20px;
}

header .search .row #searchForm{
    padding-bottom:1.4rem;
}

@media screen and (max-width:48rem){
    header .search .searchBoxInput{
        width:calc(100% - 63px) !important;
        font-size:1rem;
    }

    header form#searchForm select#searchSelect{
        position:static;
        width:100%;
        border-left-width:1px;
        border-top:0;
        height:3rem;
        padding:.5rem;
        font-size:1rem;
    }

    header #librarySearchLinks{
        font-size:.9rem;
    }
}

/* LIBRARY SEARCH HEADER AUTOCOMPLETE */
.header.headerWithAutocomplete {
    overflow: visible;
    z-index: 15;
}

.headerBackgroundWrapper {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

.headerAutocomplete {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 10;
    margin: 0;
    padding: 0;
    list-style: none;
    background: #ffffff;
    font-family: 'Derailed-Bold', 'Raleway-Bold', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
    box-shadow: 0 10px 20px 0 rgb(0 0 0 / 30%);
    color: #4c4c4c;
    font-size: 1rem;
    border: 1px solid #dcdcdc;
}

.headerAutocomplete mark {
    color: inherit;
    font-family: 'Derailed-Regular', 'Raleway-Regular', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
}

.headerAutocomplete li {
    margin: 0;
    padding: 10px 17px;
    cursor: pointer;
    border-bottom: 1px dashed #dcdcdc;
}

.headerAutocomplete li:last-of-type {
    border-bottom: none;
}

.headerAutocomplete li:hover,
.headerAutocomplete li:focus,
.headerAutocomplete li[aria-selected="true"] {
    background: #f0f0f0;
    text-decoration: underline;
}

.search .filterSubmit {
    right: 0;
}

@media screen and (min-width: 48rem){
    .headerAutocomplete {
        font-size: 1.125rem;
    }
}

/* my account button above header H1 */

.header #library_my_account_button a{
    float:right;
    font-family:Derailed-Bold;
    font-size:1rem;
    color:#FFF;
    background-image:url("../images/icon-account.svg");
    background-repeat:no-repeat;
    padding-left:25px;
    background-color:rgba(0,0,0,.6);
    padding:.4rem 1rem .4rem 2.3rem;
    background-size:auto 55%;
    background-position:left 10px center;
    border:1px solid rgba(255,255,255,.5);
    transition:all 0.2s ease-in-out;
    text-decoration:none;
}

html.browser-ie .header #library_my_account_button a{
    background-image:url("../images/icon-account.png");
}

.header #library_my_account_button a:hover{
    border-color:#FFFFFF;
    background-color:rgba(0,0,0,1);
}

.header{
    padding-top:12.5rem; /* adjust NCL defaults */
}

.header .headerContent{
    margin-top:1rem; /* adjust NCL defaults */
}

@media screen and (max-width:48rem){
    .header #library_my_account_button a{
        font-size:.8rem;
        padding:.3rem .5rem .3rem 1.6rem;
        background-position:left 5px center;
    }

    .header{
        padding-top:6.5rem; /* adjust NCL defaults */
    }

    .header .headerContent{
        margin-top:3.5rem; /* adjust NCL defaults */
    }
}

/* audio player */
section.audioPlayer audio{
    width:100%;
}

/* BLOG CAROUSEL CONTENT TYPE */

section.blogCarousel .row{
    /*background-color:#4a4a4a;*/
}

section.blogCarousel .row ul{
    margin:0;
    padding:0;
}

section.blogCarousel .row ul li{
    list-style:none;
    margin:0;
}

section.blogCarousel .row ul li a{
    position:relative;
    height:300px;
    display:block;
    overflow:hidden;
}

section.blogCarousel .row ul li a div.blogCarouselTitle{
    display:block;   
    width:100%;
    height:100%;
    top:0;
    left:0;
    position:absolute;
    background-color:rgba(0,0,0,.2);
    display:flex;
    justify-content:center;
    align-items:center;
}

section.blogCarousel .row ul li a div.blogCarouselTitle span{
    display:block;
    /*border:1px solid rgba(255,255,255,.5);*/
    font-family:Bariol,Helvetica Neue,Helvetica,Arial,sans-serif;
    color:#FFFFFF;
    font-size:2rem;
    margin:0 200px;
    text-align:center;
    background-color:rgba(0,0,0,.7);
    padding:30px 40px;
    transition:all 0.3s linear;
}

/* IIIF embed */

#mirador-container {
	/*width: 40%;*/
}

section.mirador-window {
	margin: 0;
}

@media screen and (max-width:48rem){
    
    section.blogCarousel .row ul li a{
        height:250px;
    }
    
    section.blogCarousel .row ul li a div.blogCarouselTitle span{
        font-size:1.2rem;
        margin:0 20px;
    }
    
}

section.blogCarousel .row ul li a:hover div.blogCarouselTitle span{
    background-color:rgba(0,0,0,.8);
}

section.blogCarousel .row ul li a div.blogCarouselTitle span strong{
    font-weight:normal;
}

section.blogCarousel .row ul li a div.blogCarouselTitle span strong:after{
    content:"\f054";
    font-family:"Font Awesome 5 Free";
    font-size:1.5rem;
    margin-left:20px;
    margin-right:10px;
    transition:all 0.3s ease-in-out;
}

section.blogCarousel .row ul li a:hover div.blogCarouselTitle span strong:after{
    margin-left:30px;
    margin-right:0px;
}

section.blogCarousel .row ul li a div.blogCarouselTitle span em{
    display:block;
    font-style:normal;
    font-size:1rem;
}

section.blogCarousel .row ul li a div.blogCarouselImage{
    display:block;
    height:100%;
    width:100%;
    top:0;
    left:0;
    position:absolute;
    background-repeat:no-repeat;
    background-size:110% auto;
    background-position:top 10% center;
    filter:blur(5px);
    webkit-filter:blur(5px);
    transition:all 0.3s linear;
}

section.blogCarousel .row ul li a:hover div.blogCarouselImage{
    filter:blur(0px);
    webkit-filter:blur(0px);
    background-color:rgba(0,0,0,0);
}

/* only show first one */
section.blogCarousel .row ul li:not(:first-child){
    display:none;
}

section.blogCarousel .row p{
    margin-top:30px;
}

/* BLOG KEY MESSAGES CONTENT TYPE */

section.blogKeyMessages .promo{
    margin-bottom:40px;
}

section.blogKeyMessages .promo a div{
    width:100%;
    height:200px;
    background-color:#DDDDDD;
    background-size:100% auto;
    background-repeat:no-repeat;
    background-position:center center;
}

section.blogKeyMessages .promo a div img{
    display:none;
}

/* DUAL PANEL TEXT/VIDEO */

section.dualPanelTextVideo div.introText{
    margin-bottom:1.5rem;
}

@media screen and (max-width: 60rem) {
    section.dualPanelTextVideo .panel-wrapper.media{
        margin-bottom: 0;
    }
}

@media screen and (min-width: 60rem) {
    section.dualPanelTextVideo div.introText{
        margin-bottom: 0;
    }

    section.dualPanelTextVideo .panel-wrapper.media{
        height: 21.875rem;
        min-height: unset;
    }
}

/* DUAL PANEL TEXT/PANEL */

section.dualPanelTextPanel div.introText.introTextPositionNormal{
	margin:0 2.5rem 1.25rem 0;
}

section.dualPanelTextPanel div.introText.introTextPositionReverse{
	margin:0 0 1.25rem 2.5rem;
}

/* KEY MESSAGE BOXES COLOURED TAGS BENEATH */

section.promoPanels a.promoLink div.promoTags{
    display:inline-block;
    margin-top:5px;
}

section.promoPanels a.promoLink div.promoTagsOne span,
section.promoPanels a.promoLink div.promoTagsTwo span{
    color:#FFFFFF;
    text-transform:uppercase;
    display:inline-block;
    padding:3px 6px;
    font-size:0.75rem;
    margin:5px 5px 0 0;
}

section.promoPanels a.promoLink div.promoTagsOne span{
    background-color:#66baef;
}

section.promoPanels a.promoLink div.promoTagsTwo span{
    background-color:#de6a5d;
}

/* ANNOUNCEMENT BANNER */

section#announcement{
    background-image:linear-gradient(to right, #0D9EA8, #696BA3);
}
     
section#announcement a#announcement_text:hover{
    text-decoration:none;
}

body:not(.mobile) section#announcement a#announcement_dismiss{
    background-color:rgba(255,255,255,.8);
    color:#007494;
    padding:3px 6px;
    text-decoration:none;
    font-family:Derailed-Regular,Raleway-Regular,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size:1rem;
    margin-left:15px;
    transition:all 0.2s linear;
    float:right;
}

body:not(.mobile) section#announcement a#announcement_dismiss.announcement_no_float{
    float:none;
}

body:not(.mobile) section#announcement a#announcement_dismiss:hover{
    background-color:rgba(255,255,255,1);
}

/* LIBCAL EVENTS LOADER */

.eventsContainer{
  padding:0;
}
@media screen and (min-width:64rem){
    .event {
        -webkit-flex-basis:33.33%;
        -ms-flex-preferred-size:33.33%;
        flex-basis:33.33%;
        max-width:33.33%;
    }
}
.event .eventDetails{
    margin-top:0;
    padding-top:1rem;
    border-top:0;
}
.event .eventDetails .eventDescription{
    margin-bottom:1rem;
  display:block;
}

/* KEY METRICS */
.keyMetricsContainer {
  display: flex;
  flex-direction: column;
  margin: 0 -0.6875rem;
}

.keyMetricsCard {
  padding: 0 0.6875rem;
  margin-bottom: 1.25rem;
  text-align: center;
}

.keyMetricsCardIcon {
  max-width: 4rem;
  margin: auto;
}

.keyMetricsCardTitle {
  padding: 0;
  margin: 0.875rem 0 0.5rem;
  font-size: 1.25rem;
  color: #003a65;
}

@media screen and (min-width: 30rem) {
  .keyMetricsContainer {
    flex-direction: row;
    justify-content: space-around;
  }

  .keyMetricsCard {
    flex: 1 1 20%;
    max-width: 50%;
  }
}

@media screen and (min-width: 64rem) {
  .keyMetricsCardIcon {
    max-width: 5rem;
  }

  .keyMetricsCardTitle {
    margin-top: 1.125rem;
    font-size: 1.5rem;
  }
}

/* LIBRARY HELP FAQs */

.libraryHelpFAQs_container{
    /*background-image: SET IN T4 CONTENT TYPE */
    background-size:100% auto;
    background-position:top center;
    background-repeat:no-repeat;
}

.libraryHelpFAQs_container section.libraryHelpFAQs{
	background-color: rgba(0,51,102,0.95);
    padding:35px 0 20px 0;
}

section.libraryHelpFAQs>div.row>h2,
section.libraryHelpFAQs>div.row>ul>li,
section.libraryHelpFAQs>div.row>ul>li>a{
    color:#FFFFFF;
    text-decoration:none;
}

section.libraryHelpFAQs>div.row>ul{
    font-size:1.2rem;
    font-family:Derailed-Bold,Raleway-Bold,Helvetica Neue,Helvetica,Arial,sans-serif;
    margin:0;
    padding:0;
    margin-bottom:30px;
}

section.libraryHelpFAQs>div.row>ul>li{
    list-style:none !important;
    padding-bottom:5px;
    position:relative;
}

section.libraryHelpFAQs:not(.disable_answer_previews)>div.row>ul>li>a{
    border-bottom:1px solid #FFFFFF;
    padding-bottom:10px;
    margin-top:15px;
    display:block;
}

section.libraryHelpFAQs:not(.disable_answer_previews)>div.row>ul>li>a:after{
    content:"";
    width:30px;
    height:30px;
    display:inline-block;
    float:right;
    background-image:url("../images/icon-expandable-white-down.svg");
    background-size:100%;
    background-repeat:no-repeat;
    background-position:center center;
    transition:all 0.2s ease-in-out;
}

section.libraryHelpFAQs:not(.disable_answer_previews)>div.row>ul>li>a.libraryHelpFAQs_answerPreview_visible:after{
    transform:rotate(180deg);
}

section.libraryHelpFAQs.disable_answer_previews>div.row>ul>li>a:after{
    content:"\f054";
    font-family:"Font Awesome 5 Free";
    font-size:1.2rem;
    margin-left:15px;
    margin-right:5px;
    transition:all 0.3s ease-in-out;
}

section.libraryHelpFAQs.disable_answer_previews>div.row>ul>li>a:hover:after{
    margin-left:25px;
    margin-right:0px;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview{
    display:none;
    padding:10px 20px;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview>*{
    color:#FFFFFF !important;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview h2{
    color:#FFFFFF !important;
    font-size:2rem;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview a{
    color:#FFFFFF;
    text-decoration:underline;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview a:hover{
    text-decoration:none;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_linkButtons{
    margin-top:20px;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_linkButtons a{
    border:1px solid #FFFFFF;
    background-color:rgba(255,255,255,.1);
    font-family:Bariol,Helvetica Neue,Helvetica,Arial,sans-serif;
    text-decoration:none;
    font-size:1.3rem;
    padding:10px 18px;
    transition:all 0.2s linear;
    margin-right:20px;
    display:inline-block; /* important for smaller widths */
    margin-bottom:10px;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_linkButtons a:hover{
    background-color:#FFFFFF;
    color:#934f9a;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_linkButtons a:after{
    content:"\f054";
    font-family:"Font Awesome 5 Free";
    font-size:1rem;
    margin-left:25px;
    margin-right:5px;
    transition:all 0.3s ease-in-out;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_linkButtons a:hover:after{
    margin-left:30px;
    margin-right:0px;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_fullClick{
    margin-top:30px;
    margin-bottom:40px;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_fullClick a{
    font-family:Derailed-Bold,Raleway-Bold,Helvetica Neue,Helvetica,Arial,sans-serif;
    text-decoration:none;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_fullClick a:before{
    display:inline-block;
    content:"";
    width:20px;
    height:20px;
    margin-bottom:-3px;
    margin-right:5px;
    background-image:url("../images/icon-search.svg");
    background-repeat:no-repeat;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_fullClick a:after{
    content:"\f054";
    font-family:"Font Awesome 5 Free";
    font-size:1rem;
    margin-left:15px;
    margin-right:5px;
    transition:all 0.3s ease-in-out;
}

section.libraryHelpFAQs ul>li>div.libraryHelpFAQs_answerPreview p.libraryHelpFAQs_fullClick a:hover:after{
    margin-left:25px;
    margin-right:0px;
}

section.libraryHelpFAQs .ctaContainer{
    margin-top:-10px !important;
}

section.libraryHelpFAQs .ctaContainer a.cta.full{
    background-color:transparent;
    border-color:#FFFFFF;
    color:#FFFFFF;
}

section.libraryHelpFAQs .ctaContainer a.cta.full:hover{
    color:#934f9a;
    background-color:#FFFFFF;
}

/* hover colour 934f9a */

/* hidden by default */
section.libraryHelpFAQs h2.heading_custom{
    display:none;
}

section.libraryHelpFAQs.libraryHelpFAQs_heading_custom  h2.heading_custom{
    display:block;
}

section.libraryHelpFAQs.libraryHelpFAQs_heading_custom  h2.heading_default{
    display:none;
}