/* Intended as a temp measure to be rolled in to the main theme once a complete restructure of it's SASS is done (and when time permits) */
/* There is also a font override in app.css of all 'Merriweather, serif' with 'Arial, sans-serif' (with a capital A, 1 lowercase instance already existed) */

.social-icon-youtube, .social-icon-twitter, .social-icon-facebook {
    background:url('../images/base/social-icons.png');
}

.social-icon-youtube {
    background-position: -70px 0;
}

.social-icon-facebook {
    background-position: -35px 0;
}

.social-icon-twitter {
    background-position: 0px 0;
}

/* Bring info box paragraph sizes in to line with standard paragraphs */
.info-box p {
    font-size: 1rem;
}

/* Alter the Support pages blue info box anchors to the alternate yellow for improved contrast */
.support-page .article-content .info-box--blue a {
    color: #00C7B1;
}
/* Ensure all anchors in info boxes are a AAA compliant contrasting blue */
.info-box a {
    color: #57D5FF;
}
/* AAA compliance on study page info box */
.study-page .article-content .info-box--blue p a {
    color: #AACFB5!important;    
}

/* .... & make other article anchors consistent, as some were support Brown and others generic Blue */
.support-page .article-content a {
    color: #0E3034;
}
/* Clear the People section list items to enable aligned image use within item */
.additional-interests li {
    clear: both;
}
/* Fix words overflowing element if joined by characters like a :  */;
html {
    word-break: break-word;
}
/* Patch left aligned captions width */
.wp-caption.alignleft {
    display: table!important;
}
.wp-caption.alignleft .wp-caption-text {
    padding-top: 15px;
    display: table-caption;
    caption-side: bottom;
    width: inherit;
}
/* Give the caption a little margin */
.wp-caption .wp-caption-text {
margin-top: 10px;
}

/* Quick clean up of event pages */
.event-instances .date, .event-instances .time {
    color: #3a7c7e;
    color: #615f88;
    font-size: 1.02rem;
    font-weight: 700;
}
.addthisevent-drop, .addthisevent-drop:hover {
    font-size: 1rem;
}
.addthisevent-drop:before {
    margin-right: 10px;
}

/* Adjust the footer to 4 columns */
@media only screen and (min-width: 48.063em) {
    .footer--nav {
        width: 75%;
        padding-right: 0;
        padding-left: 0;
    }
    .footer--nav>ul>li {
        width: 33.3333%;
    }
    .footer--info {
        width: 25%;
    }
}

/* Prevent the all-caps of the scroller headings */
.cta-scroller h3 {
    text-transform: capitalize !important;
}
.cta-scroller a {
    text-transform: capitalize !important;
}


/* Apply button stacking functionality */
.button-widget.stackbutton {
    float: left;
    max-width: 30%;
    margin-right: 3%;
}
.button-widget.stackbutton a {
    /* margin: 15px 0px; */
    width: inherit;
}

/* Bring mobile check to front-end for article-banner as possible caching issue with mobiledetect PHP */
@media only screen and (max-width: 767px) {
    .article-banner {
    max-height: 200px;
    }
    .article-header-image, .article-header-image span {
    max-height: 200px;
    }

    /* ...and adjust stack button widths for mobile */
    .button-widget.stackbutton {
        max-width: 100%;
        margin-right: 0%;
    }

}


/* Classes for applying text shadows where compensating for no dark overlay */
.addshadows h2, .addshadows p {
    text-shadow: 1px 1px 20px #717171;
}
.addshadows a.box-link {
    background: rgba(32,49,61,0.9);
}
.addshadows h2:empty, .addshadows p:empty {
    text-shadow: none;
}

/* Hack to quickly invert buttons on support pages, for Annual Fund launch use */
.support-page a.box-link.bigbtn {
    border:1px solid #fed266;
    color:#fff;
    background: #fed266;
    transition: all 1s;
    font-size:1.3em;
}

.support-page a.box-link.bigbtn:hover {
    background:#fed266;
    color:#fff;
    box-shadow: 0px 0px 5px #fed266;
}

/* Class to disable overlay where applied as an anchor background */
a.disableoverlay {
    background: none;
}

/* Styling for listing of past event instances */
li.pastevent {
    font-style: italic !important;
}
.event-instances li.pastevent .date, .event-instances li.pastevent .time {
    color:#6d6d6d;
    font-weight:normal;
}


/* Also patching the crap mobile infobox misalignment due to padding */

@media only screen and (min-width: 1000px)
{
        .footer--copy--uni-logo {
            width: inherit;
        }

        .footer--info--address div {
            width: 50%;
            margin-bottom: 0rem;
        }
}

/* Making use of the foundation 'small' breakpoint */
@media only screen and (min-width: 72.063em)
{

    /* Enabling infoboxes to be 3 columns */
        .info-box.large-4, .article-content--center.enwiden .info-box.large-4 {
            width: 33.33333%;
            margin: 20px 0px;
        }
}
/*
@media only screen and (max-width: 72.063em) {
    .info-box.large-4:last-child,  {
        clear: both;
    }
}
*/

/* Footer logo styling */

.footer--info {
        width: 100%;
}
.footer--info--partner-logos {
        text-align: center;
}
.footer--info--address, .footer--info--address div {
        color: white;
}
div.footer--info--address {
    width: 25%;
}
div.footer--info--partner-logos {
    width: 50%;
}
div.footer--info--social {
    width: 25%;
}
.footer--info div {
    margin-bottom: 0;
    float: left;
}
.footer--info--partner-logos img {
    margin: 0 1.5em;
}
.footer--info--social li {
    float: right;
}
.footer--info--social h3 {
    text-align: right;
}
.footer--info p, .footer--copy--text p {
    margin-bottom: 0;
}
.footer--info--address div {
    font-size: .75rem;
    text-transform: uppercase;
    line-height: 1.6;
    margin-bottom: 1rem;
}


.footer--copy--uni-logo img {
    padding: 25px;
}

img#uol-logo {
    margin-top: 35px;
}

img#res-eng {
    margin-top: 10px;
}

@media only screen and (max-width: 48.063em) {
        .info-box--white.info-box--left {
            padding: 15px 0px;
        }
        div.footer--info--address, div.footer--info--partner-logos, div.footer--info--social {
            width: 100%;
        }
        .footer--info div, .footer--info--social h3 {
            float: none;
            text-align: center;
        }
        .footer--info--social li {
            float: none;
            text-align: center;
            display: inline-block;
        }
}


/* To ensure left-align of header image on The Courtauld Friends page for left-align text image. PAGE ID IS DEV SPECIFIC */
.page-id-7150 .article-header-image {
    background-position: left center;
}

/* ...and to remove the daft overlay */
.page-id-7150 .article-header-image span {
    background: none;
}
/* To ensure left-align of header image on The Courtauld Friends page for left-align text image */
.page-id-67934 .article-header-image {
    background-position: left center;
}

/* ...and to remove the daft overlay */
.page-id-67934 .article-header-image span {
    background: none;
}

/* Clean up event article header */
.article-header .article-header-top {
    margin-bottom: 10px;
}

/* Float Gravity Forms forenames to the left
.has_first_name .name_first {
    float: left;
}
 */
/* Provide the Gravity Forms gf_list_2col class */
.gform_wrapper li.gfield.gf_list_4col ul.gfield_checkbox li,
.gform_wrapper li.gfield.gf_list_4col ul.gfield_radio li {
  margin: 0;
  min-height: 1.8em;
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 992px) {
  .gform_wrapper li.gfield.gf_list_4col ul.gfield_checkbox li,
  .gform_wrapper li.gfield.gf_list_2col ul.gfield_radio li {
    float: left;
    width: 25%;
  }
}
@media (max-width: 992px) {
  .gform_wrapper li.gfield.gf_list_4col ul.gfield_checkbox li,
  .gform_wrapper li.gfield.gf_list_4col ul.gfield_radio li {
    display: inline-block;
    width: 45%;
  }
}
/* Hack fix Gravity Forms rogue breaks in checkboxes */
.gfield_checkbox br {
    display: none;
}
/* ..and rogue break tween name fields */
.ginput_container.has_first_name.has_last_name br {
    display: none;
}
/* .. and teeny ul li font */
.gform_body ul li {
    font-size: 1rem;
}
/* ... and failure to clear datepicker boxes */
.gform_body .datepicker {
    position: relative;
}

/* Patching up the mess of a slick slider for responsive */
@media (max-width: 770px) {
    .slider-respon-nav {
    display: block;
    margin-bottom: 10px !important;
    }
    .slider-nav {
    display: none;
    }
    .slider-for{
    display: none;
    }
    .slider-respon{
    display: block;
    }
}
@media (min-width: 771px) {
    .slider-respon-nav {
    display: none;
    }
    .slider-nav {
    display: block;
    }
    .slider-for{
    display: block;
    }
    .slider-respon{
    display: none;
    }
}
.slider-respon-nav .slick-next, .slider-respon-nav .slick-prev {
    background: transparent;
    color: white;
    height: 50px;
    outline: none;
    overflow: hidden;
    position: absolute;
    top: 35%;
    width: 20%;
    padding: 0;
}
/*Fix-up sponsor widget issues */
.sponsor-wrap {
    overflow: initial;
}
/* Make inline embeds responsive */
.ytplayer-container, .responsive.embed-container { 
    position: relative; 
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
}
.ytplayer-container iframe, .responsive.embed-container iframe,
.ytplayer-container object, .responsive.embed-container object,
.ytplayer-container embed, .responsive.embed-container embed { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* mae lecturer slider images fill space */
@media only screen and (max-width: 767px) {
    .lecturerimg-wrap, .lecturerimg-wrap img {
        min-height: 170px;
    }
}
.lecturerimg-wrap, .lecturerimg-wrap img {
    min-height: 250px;
    background-color: rgba(0, 0, 0, 0.05);
}

/* YouTube background */
#bkgvideo{
  position: relative;
  background: transparent;
  height: 100%;
  width:100%;
}
.ytplayer-container{
    height: 100%;
    min-width: 100%;
    overflow: hidden;
    position: absolute;
    z-index: 0;
}
.inner.bkginner {
  float: right;
}

/* Gallery landing page patch for full width text block and table borders */
.page-id-9 .fw-text-block {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}
.page-id-9 .fw-text-block table, .page-id-9 .fw-text-block table tbody td {
  border: 0px;
  border-right: 0px;
  vertical-align: top;
}
/* Patch where WordPress is displaying native gallery as HTML5 */
.gallery {
    margin-left: -0.5em;
    margin-right: -0.5em;
}
.gallery:after {
    display: table;
    content: "";
    clear: both;
}
.gallery-item {
    margin: 0;
    float: left;
    padding: 0.5em;
}
.gallery-item img {
    width: 100%;
}
.gallery-columns-1 .gallery-item {
    width: 100%;
    float: none;
}
.gallery-columns-2 .gallery-item {
    width: 50%
}
.gallery-columns-3 .gallery-item {
    width: 33.3333%
}
.gallery-columns-4 .gallery-item {
    width: 25%
}
.gallery-columns-5 .gallery-item {
    width: 20%
}
.gallery-columns-6 .gallery-item {
    width: 16.6667%
}
.gallery-columns-7 .gallery-item {
    width: 14.2857%
}
.gallery-columns-8 .gallery-item {
    width: 12.5%
}
.gallery-columns-9 .gallery-item {
    width: 11.1111%
}
.gallery-columns-2 .gallery-item:nth-child(2n+1),
.gallery-columns-3 .gallery-item:nth-child(3n+1),
.gallery-columns-4 .gallery-item:nth-child(4n+1),
.gallery-columns-5 .gallery-item:nth-child(5n+1),
.gallery-columns-6 .gallery-item:nth-child(6n+1),
.gallery-columns-7 .gallery-item:nth-child(7n+1),
.gallery-columns-8 .gallery-item:nth-child(8n+1),
.gallery-columns-9 .gallery-item:nth-child(9n+1) {
    clear: left;
}

/* Provides easily customisable site-wide Video CTA Top Text styling */
.video-text span.video-top-text {
  font-size: 1.3rem;
}

/* Return To Top styling */
@media (min-width: 993px) {
    #return-to-top, #return-to-top i {
        display: none;
    }
    .foottotop i.fa.fa-chevron-up {
    display: inline-block !important;
    float: right;
    }
    .foottotop {
        text-align: center;
        float: right;
        width: 160px;
        padding: 1em 0 0;
    }
    .foottotop h6 {
        color: white;
        text-transform: uppercase;
        margin: 0;
    }
}
@media only screen and (min-width: 48.063em) {
    .footer--copy .wrap {
        width: 100%;
    }
}
@media (max-width: 992px) {
    .foottotop, .foottotop h6 {
        display:none;
    }
    #return-to-top {
        position: fixed;
        bottom: 20px;
        right: 20px;
        background: rgb(0, 0, 0);
        background: rgba(10, 15, 19, 0.7);
        width: 50px;
        height: 50px;
        display: block;
        text-decoration: none;
        -webkit-border-radius: 35px;
        -moz-border-radius: 35px;
        border-radius: 35px;
        -webkit-transition: all 0.3s linear;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    #return-to-top i {
        color: #fff;
        margin: 0;
        position: relative;
        left: 16px;
        top: 13px;
        font-size: 19px;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    #return-to-top:hover {
        background: rgba(0, 0, 0, 0.9);
    }
    #return-to-top:hover i {
        color: #fff;
        top: 5px;
    }
}
/* Patch for switch to use of figure resulting in margins */
figure {
    margin: 0;
}

/* Patch for Safari 11+ having issues with OpenSeadragon captions - needs adding to SASS/app.css */
figcaption {
    display: block;
}

/* Lack of a clear was causing issue on Public Programmes use of a tab widget preceding this */
.headings-group {
    clear: left;
}

/* Make side nav anchors less shouty */
.article-nav .menu-item a, .article-nav .page_item a {
    text-transform: capitalize;
    font-size: 1rem;
}

/* Patch for new search results page */
/*455px

770px

821px

1154px
275px
*/

.coresearch.post-list-item {
    display: inline-block;
    height: auto;
    float: left;
    padding: 0 1% 0px;
    /* width: 32%; */
    list-style: none;
}
.coresearch.post-list-item img {
    vertical-align: baseline;
    width: 100%;
    max-width: 100%;
}
.coresearch.post-list-item h2 {
    font-size: 1.12rem;
}
.search-results .pagetitle {
    padding-bottom: 30px;
    text-align: center;
    color: #6d6d6d;
}
.result-meta {
    min-height: 120px;
    overflow: hidden;
}
span.search-meta-tag {
    font-weight: bold;
    font-size: 0.9rem;
}


/* Pagination */
.pagination {
    background:#E7E6E5;
    background:rgba(255,255,255,0.35);
    padding-bottom: 30px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    text-align: center;
    clear:both;
}
.pagination .page-numbers {
    padding:3px 6px;
    font-size:15px;
    font-weight:bold;
    border: 1px solid #6ebec4;
    color: #6ebec4;
}
.pagination .page-numbers:hover {
    padding:3px 6px;
    font-size:15px;
    font-weight:bold;
    background: #6ebec4;
    color: #fff;
}

.pagination .current {
    color:#000;
    border: none;
}

/* Prevent any cases of tabs widget tabs overrunning the width of the page and becoming unusable */
@media only screen and (max-width: 48em) {
    .tab-title {
        float: left !important;
    }
    .article-content .tabs-widget {
        float: none;
    }
}

/* Quick patch of the ugly People page li being inconsistent with the p elements */
.additional-interests ul {
    font-size: initial;
}

/* Add styling for a footer banner/promo bar */
.wrap.foot-banner {
  padding: 0;
}
.wrap.head-banner {
  padding: 0;
  background: #00C7B1;
  color: #0E3034;
}

a.footer--promo{
    background: #00C7B1;
    color: white;
    display: block;
    padding-left: .9375rem;
    padding-right: .9375rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
    text-align: center;
    color: #0E3034;
}
img#cc-logo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
    height: auto;
}
.foot-banner h4 {
    color: #0E3034;
    margin-top: 2rem;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    line-height: initial;
    max-width: 60rem;
}
.header--banner h5 {
    color: #0E3034;
    margin-top: 0.7rem;
    margin-bottom: 0.7rem;
    margin-left: auto;
    margin-right: auto;
    line-height: initial;
    max-width: 90%;
    font-size: 1rem;
    text-align: center;
}

/* Blackbaud Embed Form Background Removal */
.BBFormContainer[data-bbox-part-id="c071d325-3e5c-4aa7-bad4-a1009f9ddb83"] .BBFormPricingTable {
    background-image: none !important;
    background-color: rgba(255, 255, 255, 0);
}

.BBFormSection fieldset {
    background: rgba(255,255,255,0);
}

/* Enable editors to make sidebar-less page wider */
@media only screen and (min-width: 72.063em) {
    .article-content--center.enwiden {
        width: 100%;
    } 

    .article-content--center.enwiden .info-box {
        width:50%;
        margin:20px 0px;
        padding: 15px 30px 15px 0;
    }

}

/* Override the size of gallery captions */

.wp-caption .wp-caption-text, .gallery-caption {
    line-height: 1.5;
    font-size: 12px;
    margin: 0;
}

/* Provide a class for use with footnotes. Needs adding to SASS/app.css */
.footnotes, .footnotes p {
font-size: 0.8rem;
}


/* Stylize 'blockquote' elements. Needs adding to SASS/app.css */
q {
    font-style: italic;
}
blockquote.contentquote {
    margin: 1rem 3rem;
    color: #757575;
    font-size: 1rem;
}
blockquote.contentquotemarks {
    margin: 1rem;
    quotes: "\201C""\201D""\2018""\2019";
    font-style: italic;
    color: #757575;
    font-size: 1rem;
}
blockquote.contentquote p {
    font-size: 1.1rem;
    color: #757575;
    line-height: 1.5;
}
blockquote.contentquotemarks:before {
    content: open-quote;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}
blockquote.contentquotemarks:after {
    content: close-quote;
    vertical-align: -2rem;
    line-height: 0.1rem;
}
blockquote.contentquote:before, blockquote.contentquote:after {
    font-size: 4rem;
}

/* Accessibility contrast patch */
.mega-menu__col>li li>a {
    color: #4f4f4f;
}

/* Hurried patch to enable multiple Main CTAs on the homepage with decent layout */
.home .main-cta {
    margin-bottom: 1.8rem;
    /* height: 280px; */
}

/* Provide a generic Button styling for cases of no parent colourway */
.button-widget a {
    background-color: transparent;
    border: 1px solid #263744;
    color: #263744;
}

.button-widget a:hover {
    background: #263744;
    color: #fff;
}

/* Interim Brand Refresh */

button.search-close {
    color: white;
}

/* Horrible hack for short-term alignment of PG Open Day page headings */
.page-id-103743 h4 {
    min-height: 3em;
}