/*
Theme name: Rehearsing Freedoms Theme
Author: Studio Hyte
Version: 1.0
*/

@font-face{
    font-family: 'MoonGet';
    src: url('assets/fonts/moon_get-Heavy.otf') format('embedded-opentype'),
        url('assets/fonts/moon_get-Heavy.woff2') format('woff2'),
        url('assets/fonts/moon_get-Heavy.woff') format('woff');
}

@font-face{
    font-family: 'GTAmerica';
    src: url('assets/fonts/GT-America-Standard-Medium.otf') format('embedded-opentype'),
        url('assets/fonts/GT-America-Standard-Medium.woff2') format('woff2'),
        url('assets/fonts/GT-America-Standard-Medium.woff') format('woff');
}

@font-face{
    font-family: 'GTAmericaExt';
    src: url('assets/fonts/GT-America-Extended-Regular.otf') format('embedded-opentype'),
        url('assets/fonts/GT-America-Extended-Regular.woff2') format('woff2'),
        url('assets/fonts/GT-America-Extended-Regular.woff') format('woff');
}

:root{
    --x: 15px;
    --y: 30px;
    --z: 60px;
    --pointer: pointer;
    --default: default;

    --caption: 12pt;
    --body: 18pt;
    --menu: 14pt;

    --h3: 42pt;
    --subtitles: 5vw;
    --titles: 9vw;

    /* accessibility variables */
    --title_lh: 1.74;
    --body_lh: 1.2;
    --standard_lh: 130%;

    --title_ls: normal;
    --body_ls: normal;

    --bgHighlight: ;
    --linkHighlight: ;

    --title_hl: none;
    --link_hl: none;
    --img_display: block;
    --img_filter: ;

    --black: black;
    --white: white;
    --yellow: #FCDF0F;
    --orange: #F26C47;
    --green: #52B041;
    --darkgreen: #248924;
}


body{
    margin: 0;
    cursor: var(--default);
    font-family: 'GTAmerica';
    font-size: var(--body);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

h1,
h2,
h3,
h4,
h5,
h6{
    line-height: var(--title_lh);
    letter-spacing: var(--title_ls);
    border: var(--title_hl);
    margin: 0;
}

h1:not(.page_title h1),
h2,
h3,
h4,
h5,
h6{
    background-color: var(--bgHighlight);
}

h1{
    font-family: 'MoonGet';
    font-size: var(--titles);
    text-transform: uppercase;
    letter-spacing: 0.5vw;
}

h2{
    font-family: 'MoonGet';
    font-size: var(--subtitles);
    text-transform: uppercase;
    letter-spacing: 0.5vw;
}

a{
    text-decoration: var(--link_hl);
    line-height: var(--body_lh);
    letter-spacing: var(--body_ls);
    cursor: var(--pointer);
    color: inherit;
/*    background-color: var(--linkHighlight);*/
}


p{
    line-height: var(--body_lh);
    letter-spacing: var(--body_ls);
    font-size: var(--body);
    word-wrap: break-word;
}

img{
    filter: var(--img_filter);
    display: var(--img_display);
}

figcaption{
    display: var(--img_display);
}

button{
    background: none;
    border: none;
    cursor: var(--pointer);
}

/* ----------------------------- Global ----------------------------- */


header{
    position: fixed;
    top: var(--y);
    left: var(--y);
    width: calc(100% - var(--z));
    text-align: center;
    font-size: var(--menu);
    font-family: 'GTAmericaExt';
    z-index: 1000;
}

header .menuButtons{
    position: relative;
    display: inline;
    padding: 5px;
    background: var(--yellow);
    cursor: var(--pointer);
}

header .menuButtons .menuLine{
    position: absolute;
    top: 6px;
    right: 0px;
    width: 2px;
    height: calc(100% - 12px);
    max-height: 22px;
    background: var(--black);
}

header .menuButtons:hover{
    color: var(--yellow);
    background: var(--black);
}

header .menuButtons a, header .menuButtons span{
    padding: 0px var(--y) 0px var(--y);
}

#menuMobileButton{
    display: none;
}

/* ----------------------------- Front Page ----------------------------- */

.firstPage .page-numbers {
    display: none;
}

.firstPage, .mostPages{
    text-align: center;
}

.firstPage .next {
    display: inline;
    padding: 0px 5px 0px 5px;
    color: var(--black);
    background-color: var(--yellow);
}

.mostPages {
    position: relative;
}

.mostPages .page-numbers:hover {
    text-decoration: underline;
}

.mostPages .dots:hover {
    text-decoration: none;
}

.mostPages .next, .mostPages .prev  {
    padding: 0px 5px 0px 5px;
    color: var(--black);
    background-color: var(--yellow);
}

.mostPages .next  {
    position: absolute;
    right: 0px;
}

.mostPages .prev  {
    position: absolute;
    left: 0px;
}

.mostPages .next:hover, .mostPages .prev:hover {
    color: var(--yellow);
    background-color: var(--black);
    text-decoration: none;
}

.firstPage .next:hover {
    color: var(--yellow);
    background-color: var(--black);
}

.page_title h1{
    width: 100vw;
    padding-top: 120px;
    padding-bottom: var(--z);
    text-align: center;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

h1 .highlightText { 
  display: inline;
  background-color: var(--yellow); 
  padding: 0 var(--y);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.page_title mark{
    color: var(--black);
    background-color: var(--yellow) !important;
}

.page_title p{
    margin-top: var(--y);
    padding-left: var(--y);
    max-width: 750px;
}

.page_title .has-text-align-center{
    padding-left: calc(50% - 700px / 2);
    padding-right: calc(50% - 700px / 2);
}

.page_title .frontPageContent{
    padding-bottom: 120px;
}

.page_title .frontPageContent .wp-block-video{
    padding: var(--y) var(--y) 0px 0px;
}

.programme_homepage{
    position: relative;
    display: block;
    width: calc(100vw - var(--z));
    padding: var(--y);
    background: var(--green);
}

.programme_homepage h1{
    text-align: center;
    margin-bottom: var(--y);
}

.programmeLink{
    padding: 0px 5px 0px 5px;
    background-color: var(--yellow);
}

.programmeLink:hover{
    color: var(--yellow);
    background-color: var(--black);
}

.event_flex{
    display: block;
    width: 100%;
    margin-top: var(--y);
/*    background-color: red;*/
}

.event_flex .event_container{
    position: relative;
    display: inline-block;
    width: calc((100% / 3) - 25px);
    height: 35vw;
    margin-right: var(--y);
    margin-bottom: var(--y);
    vertical-align: top;
}

.event_flex .event_container:nth-child(3n){
    margin-right: 0px;
}

.event_flex .event_container .event_subcontainer{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background-color: var(--white);
    cursor: var(--pointer);
}

.event_flex .event_container .event_subcontainer:hover{
    background-color: var(--yellow);
}

.event_flex .event_container .event_subcontainer .event_row1{
    flex: 1;
    overflow: hidden;
}

.event_flex .event_container .event_subcontainer .event_row1 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event_flex .event_container .event_subcontainer .event_row2{
    flex: 0;
    font-size: var(--menu);
    padding: var(--x);
}

.event_flex .event_container .event_subcontainer .event_row2 h4{
    font-size: var(--caption);
    font-family: 'MoonGet';
    letter-spacing: 2px;
    text-transform: uppercase;
}

.event_flex .event_container .event_subcontainer .event_row2 p{
    font-size: var(--menu);
    margin: 0px;
}

.newsletter_signup{
    position: relative;
    display: block;
    width: calc(100vw - var(--z));
    padding: var(--z) var(--y) var(--z) var(--y);
    text-align: center;
}

.newsletter_signup h2 .highlightText { 
  display: inline;
  letter-spacing: 3px;
  color: var(--black);
  background-color: var(--yellow); 
  padding: 0 var(--y);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.newsletter_signup h2 .highlightText:hover { 
  color: var(--yellow);
  background-color: var(--black); 
}

.filterContainer{
    position: relative;
    display: inline-block;
    width: 100%;
    margin-top: var(--y);
}

.filterContainer .filterMenu{
    display: inherit;
    width: calc((100% / 3) - 25px);
/*    padding: 5px;*/
    border: 1px solid var(--black);
}

.filterSubmenu{
    display: none;
    width: 100%;
    max-height: 140px;
    overflow-y: scroll;
/*    background-color: red;*/
}

.filterMenu .filterRow{
    display: block;
    padding: 5px;
    cursor: var(--pointer);
}

.filterMenu .filterRow:hover{
    color: var(--white);
    background-color: var(--black);
}

.filterMenu .filterRow .filterSVGButton svg{
    fill: var(--black);
}

.filterMenu .filterRow:hover .filterSVGButton svg{
    fill: var(--white);
}

.filterSubmenu .venueRow{
    display: block;
    padding: 5px;
    border-top: 1px solid var(--black);
    cursor: var(--pointer);
}

.filterSubmenu .venueRow:hover{
    color: var(--white);
    background-color: var(--black);
}

.filterResults{
    display: block;
    width: 100%;
    margin-top: var(--y);
}

.filterSVGButton{
    display: inline;
    float: right;
}

.downloadButton{
    position: relative;
    display: inherit;
    font-family: inherit;
    font-size: var(--body);
    text-align: left;
    padding: 5px;
    width: calc((100% / 3) - 25px);
    border: 1px solid var(--black);
    margin-left: 18px;
    vertical-align: top;
}

.downloadButton:hover{
    color: var(--green);
    background-color: var(--black);
}

.downloadButton .downloadText{
    display: block;
}

.downloadButton .filterSVGButton{
    position: absolute;
    display: flex;
    align-items: center;
    width: 17px;
    height: 30px;
    top: 5px;
    right: 5px;
}

.downloadButton .filterSVGButton svg{
    width: 17px !important;
    height: 30px !important;
    fill: var(--black);
}

.downloadButton:hover .filterSVGButton svg{
    fill: var(--green);
}

/* ----------------------------- Programme Page ----------------------------- */

.event_dropdown {
    display: none;
}

.event_loadMore{
    display: block;
    width: 100%;
    text-align: center;
}

.event_loadMore .loadMore{
    font-size: inherit;
    font-family: inherit;
    padding: 0px 5px 0px 5px;
    color: var(--black);
    background-color: var(--yellow);
}

.event_loadMore .loadMore:hover{
    color: var(--yellow);
    background-color: var(--black);
}

.featuredProgramme{
    position: relative;
    display: block;
    width: calc(100vw - var(--y));
    margin-top: 120px;
    padding: var(--x);
/*    background-color: red;*/
}

.featuredContainer{
    position: relative;
    width: 100%;
    height: 40vw;
/*    background-color: blue;*/
}

.featuredSlideContainer{
    display: none;
}

.featuredContainer .featuredSlide{
    position: absolute;
    display: flex;
    flex-direction: row;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: var(--yellow);
    cursor: var(--pointer);
}

.featuredContainer .featuredSlide:hover{
    background-color: var(--white);
}

.featuredCol1{
    flex: 1;
    background-color: var(--white);
    overflow: hidden;
}

.featuredCol1 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.featuredCol2{
    width: calc(400px - var(--z));
    padding: var(--y);
    overflow-y: scroll;
}


.featuredCol2 h4{
    font-size: var(--body);
    font-family: 'MoonGet';
    letter-spacing: 2px;
    text-transform: uppercase;
}

.event_subtitle {
    display: block;
    width: 100%;
    margin-top: var(--y);
    margin-bottom: var(--y);
}

.event_subtitle h4{
    font-size: var(--body);
    font-family: 'MoonGet';
    letter-spacing: 2px;
    text-transform: uppercase;
}


#featuredNo1{
    display: inline;
}

.featuredCounterContainer{
    display: block;
    width: calc(100% - var(--y));
    text-align: center;
    padding: var(--x);
/*    background-color: red;*/
}

.featuredCircle{
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-left: 5px;
    margin-right: 5px;
    border-radius: 50%;
    background-color: var(--white);
    cursor: var(--pointer);
}

.featuredCircle:hover{
    background-color: var(--black);
}

#featuredCircle1{
    background-color: var(--black);
}

.programmeCalendarContainer{
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100px;
    border: 1px solid var(--black);
/*    background-color: red;*/
}

.programmeCalendarContainer .programmeSubcontainer1{
    position: relative;
    width: 100px;
    height: 100%;
    border-right: 1px solid var(--black);
    cursor: var(--pointer);
}

.programmeCalendarContainer .programmeSubcontainer1:hover{
    background-color: var(--yellow);
}

.programmeCalendarContainer .programmeSubcontainer2{
    flex: 1;
    float:left;
    overflow: hidden;
    white-space:nowrap;
}

.programmeCalendarContainer .programmeSubcontainer3{
    position: relative;
    width: 100px;
    height: 100%;
    border-left: 1px solid var(--black);
    cursor: var(--pointer);
}

.programmeCalendarContainer .programmeSubcontainer3:hover{
    background-color: var(--yellow);
}

.programmeCalendarContainer .programmeSubcontainer1 svg, .programmeCalendarContainer .programmeSubcontainer3 svg{
    position: absolute;
    top: 25%;
    left: 25%;
    width: 50%;
    height: 50%;
}

.programmeCalendarContainer .programmeSubcontainer2 .calendarDate{
    position: relative;
    display: inline-block;
    width: 100px;
    height: 100%;
    margin-left: -7px;
    vertical-align: top;
    white-space: normal;
    align-content: center;
    font-size: var(--caption);
    text-align: center;
    border-left: 1px solid var(--black);
    background-color: var(--green);
    cursor: var(--pointer);
}

.programmeCalendarContainer .programmeSubcontainer2 .weekDivider{
    position: relative;
    display: inline-block;
    width: 100px;
    height: 100%;
    margin-left: -7px;
    vertical-align: top;
    white-space: normal;
    align-content: center;
    font-size: var(--caption);
    text-align: center;
    border-left: 1px solid var(--black);
    background-color: var(--darkgreen);
    cursor: var(--pointer);
}

.programmeCalendarContainer .programmeSubcontainer2 .calendarDate:hover{
    background-color: var(--yellow);
}

.programmeCalendarContainer .programmeSubcontainer2 .calendarDate:first-of-type{
    margin-left: 0px;
    border-left: none;
}

.programmeCalendarContainer .programmeSubcontainer2 .calendarDate div{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}

/* ----------------------------- Single Event ----------------------------- */

.feat_img{
    position: relative;
    display: block;
    width: 100vw;
    height: 45vw;
}

.feat_img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.body_container{
    position: relative;
    display: block;
    width: calc(100% - var(--z));
    padding: var(--y);
    background-color: var(--white);
}

.body_container h3{
    font-family: 'MoonGet';
    font-size: var(--h3);
    text-transform: uppercase;
    letter-spacing: 0.5vw;
    line-height: var(--standard_lh);
}

.subBodyContainer{
    position: relative;
    display: table;
    width: 100%;
    padding-top: var(--y);
}

.subBodyContainer p{
    font-family: 'GTAmerica';
    font-size: var(--menu);
}

.subBodyContainer .subBodyCol{
    display: table-cell;
    font-family: 'GTAmerica';
    font-size: var(--menu);
    width: calc(100% - 750px);
    vertical-align: top;
}

.subBodyContainer .subBodyCol p:first-of-type{
    margin-top: 0px;
}

.subBodyContainer .subBodyCol:last-of-type{
    width: 750px;
}

.subBodyCol h1, .subBodyCol h2, .subBodyCol h3, .subBodyCol h4, .subBodyCol h5, .subBodyCol h6{
    font-size: var(--body);
    letter-spacing: 3px;
}

.subBodyCol a{
    background-color: var(--yellow);
}

.subBodyCol a:hover{
    color: var(--yellow);
    background-color: var(--black);
}

.leftCol_button{
    display: inline-block;
    margin-bottom: 5px;
    background-color: var(--yellow);
}

.leftCol_button:hover{
    color: var(--yellow);
    background-color: var(--black);
}

.relatedSection{
    position: relative;
    display: block;
    width: calc(100% - var(--z));
    padding: 0px var(--y) 0px var(--y);
}

.relatedOrange{
    background-color: var(--orange);
}

.relatedGreen{
    background-color: var(--green);
}


.relatedSection .relatedHeader{
    display: block;
    padding-top: var(--y);
    margin-bottom: var(--y);
}

.relatedSection .relatedHeader h4{
    font-family: 'MoonGet';
    font-size: var(--body);
    letter-spacing: 3px;
}

/* ----------------------------- About Page ----------------------------- */

.featureVideo{
    position: relative;
    display: block;
    width: 100%;
/*    background-color: yellow;*/
}

.featureVideo video{
    width: 100vw;
    height: 56.25vw;
    margin-bottom: -7px;
}

.aboutTitle {
    font-family: 'MoonGet';
    font-size: var(--h3) !important;
    text-transform: uppercase;
    letter-spacing: 0.5vw !important;
    line-height: var(--standard_lh);
    margin-top: var(--x);
    margin-bottom: var(--y);
}

.aboutDropdown{
    position: relative;
    display: block;
    width: 100%;
    width: calc(100% - var(--z));
    padding: var(--y);
}

.aboutDropdownHeader{
    position: relative;
    display: block;
    width: 100%;
    cursor: var(--pointer);
}

.aboutDropdownHeader .aboutTitle{
    margin-top: 0px;
    margin-bottom: 0px;
    padding-right: 100px;
}

.dropdownArrows{
    position: absolute;
    top: 50%;
    right: 0px;
    transform: translate(0%, -50%);
}

.dropdownContent{
    position: relative;
    width: 100%;
    display: none;
}

.dropdownContent .dropdownSubcontent{
    padding-right: calc(100% - 750px);
}

.dropdownContent p{
    font-family: 'GTAmerica';
    font-size: var(--menu);
} 

.partnerThumb img{
    object-fit: contain !important;
    background-color: var(--white);
}

#partnervenueContent .event_flex .event_container .event_subcontainer{
    background-color: var(--orange);
}

#partnervenueContent .event_flex .event_container .event_subcontainer:hover{
    background-color: var(--yellow);
}

/* ----------------------------- Default Page ----------------------------- */

.defaultTitle{
    position: relative;
    display: block;
    text-align: center;
    width: calc(100% - var(--y));
    margin-top: 90px;
    margin-bottom: 60px;
    padding: var(--x);
}

h2 .highlightText { 
  display: inline;
  background-color: var(--yellow); 
  padding: 0 var(--y);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.defaultContent{
    position: relative;
    display: block;
/*    width: calc(100% - 750px - var(--z));*/
    padding: var(--x) calc(100% - 750px) var(--y) var(--y);
    background-color: var(--white);
}

.defaultContent p{
   font-family: 'GTAmerica';
   font-size: var(--menu); 
}

.defaultContent h1, .defaultContent h2, .defaultContent h3, .defaultContent h4, .defaultContent h5, .defaultContent h6{
    font-size: var(--body);
    letter-spacing: 3px;
}

.defaultContent a{
    display: inline-block;
    margin-bottom: 5px;
    background-color: var(--green);
}

/* ----------------------------- Press Page ----------------------------- */

#featuredPress{
    margin-bottom: var(--y);
}

#press .event_flex .event_container{
    width: calc((100% / 3) - 25px - 2px);
    border: 1px solid var(--black);
}

.download_field{
    position: relative;
    display: block;
    maergin-top: var(--y);
}

.download_field svg{
    float: right;
}

/* ----------------------------- Resources Page ----------------------------- */

#glossary .event_flex .event_container .event_subcontainer .event_row1, #readinglist .event_flex .event_container .event_subcontainer .event_row1{
    padding: var(--x);
}

#glossary .event_flex .event_container .event_subcontainer .event_row1 h4, #readinglist .event_flex .event_container .event_subcontainer .event_row1 h4{
    font-size: var(--caption);
    font-family: 'MoonGet';
    letter-spacing: 2px;
    text-transform: uppercase;
}


#glossary .event_subcontainer{
    background: none;
    cursor: var(--default);
}

#glossary .event_container{
    background: var(--yellow);
}

#glossary .event_container:nth-of-type(2n){
    background: var(--green);
}

#glossary .event_container:nth-of-type(3n){
    background: var(--orange);
}

.resourceSubmenu{
    display: block;
    text-align: right;
    width: calc(100% - var(--z));
    padding: var(--y);
    background: var(--white);
}

.resourceSubmenu a:first-of-type{
    background-color: var(--green);
}

.resourceSubmenu a:last-of-type{
    background-color: var(--orange);
}

.resourceSubmenu a:hover{
    background-color: var(--yellow);
}

/* ----------------------------- Venue Page ----------------------------- */

.venueContent{
    position: relative;
    display: table;
    width: 100%;
    background-color: var(--white);
}

.venueCol{
    display: table-cell;
    padding: var(--y);
    vertical-align: top;
}

.venueCol:first-of-type{
    width: calc(750px - var(--z));
}

.venueCol p{
    font-family: 'GTAmerica';
    font-size: var(--menu); 
}

#venues .event_flex .event_container{
    height: 45vw;
}

.venueSVGContainer{
    display: block;
    margin-top: var(--x);
}

.venueSVGContainer svg:first-of-type{
    margin-right: 5px;
}

/* ----------------------------- Single Venue Page ----------------------------- */

.venueInformation{
    position: relative;
    display: block;
    width: calc(100% - var(--z));
    padding: var(--y);
    background-color: var(--orange);
}

.venueInformation h3{
    font-family: 'MoonGet';
    font-size: var(--h3);
    text-transform: uppercase;
    letter-spacing: 0.5vw;
    line-height: var(--standard_lh);
}

.venueDescription{
    display: block;
    padding-right: calc(100% - 750px);
}

.venueDescription p{
    font-family: 'GTAmerica';
    font-size: var(--menu);
} 

.venueTable{
    display: table;
    width: calc(100vw - var(--z));
}

.venueTable .venueCol2{
    display: table-cell;
    width: 50%;
}

.venueTable .venueCol2 p{
    font-family: 'GTAmerica';
    font-size: var(--menu);
}

.venueTable .venueCol2:first-of-type{
    padding-right: var(--x);
}

.venueTable .venueCol2:last-of-type{
    padding-left: var(--x);
}

.venueCol2 h1, .venueCol2 h2, .venueCol2 h3, .venueCol2 h4, .venueCol2 h5, .venueCol2 h6 {
    font-size: var(--body);
    letter-spacing: 3px;
}

/* ----------------------------- Footer ----------------------------- */

footer{
    position: relative;
    display: table;
    font-family: 'GTAmerica';
    font-size: var(--menu);
    width: calc(100vw - var(--z));
    padding: var(--y);
    background-color: var(--yellow);
    z-index: 200;
}

footer .footerCol{
    display: table-cell;
    width: 33%;
}

footer .footerCol:last-of-type{
    text-align: right;
}

footer .footerCol a:hover{
    text-decoration: underline;
}

.socialmediaLink svg{
    vertical-align: middle;
}

/* ----------------------------- Google Maps ----------------------------- */

.mapsContainer{
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
}

.mapsContainer p iframe{
    margin-top: -90px;
    width: 100% !important;
    border: none;
}

.mapsContainerSecondary{
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
}

.mapsContainerSecondary p iframe{
    margin-top: -90px;
    width: 100% !important;
    border: none;
}

/* ----------------------------- Newsletter ----------------------------- */

.newsletterContent mark{
    color: var(--black);
    background-color: var(--yellow) !important;
}

/* ----------------------------- Accessibility ----------------------------- */

.accessibilityContainer{
    position: fixed;
    top: -100vh;
    left: 0px;
    width: calc(100vw - var(--z));
    height: calc(100vh - var(--z));
    padding: var(--y);
    background-color: var(--orange);
    z-index: 1000;
    overflow-y: scroll;
    transition: 2s top ease;
    display: none;
}

.accessibilitCloseButton{
    position: absolute;
    top: var(--y);
    right: var(--y);
    width: 60px;
    height: 60px;
}

.accessibilitCloseButton svg{
    width: 100%;
    height: 100%;
    fill: var(--black);
    transform: rotate(45deg);
}

.accessibilitySubcontainer{
    display: block;
    margin-top: 90px;
/*    background-color: yellow;*/
}

.mobileMenuButtons{
    display: block;
    font-size: var(--h3);
}

.mobileMenuButtons a:hover{
    text-decoration: underline;
}

.accessibilitySubcontainer .accessButton{
    display: inline;
    font-family: inherit;
    font-size: inherit;
    width: calc((100% - var(--z)) / 4 - 1px);
    height: 22vw;
    margin-right: var(--x);
    margin-bottom: 20px;
    padding: 0px;
    background-color: var(--white);
    vertical-align: top;
}

.accessibilitySubcontainer .accessButton:hover{
    background-color: var(--yellow);
}

.accessibilitySubcontainer .accessButton:nth-of-type(4n){
    margin-right: 0px;
}

.accessibilitySubcontainer .accessButton .accessSubButton{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
/*    background-color: var(--white);*/
}

.accessibilitySubcontainer .accessButton .accessSubButton .accessCol:first-of-type{
    flex: 1;
    width: calc(100% - 120px);
/*    height: calc(100% - 120px);*/
    padding: var(--y) var(--z) var(--y) var(--z);
/*    background-color: green;*/
}

.accessibilitySubcontainer .accessButton .accessSubButton .accessCol:first-of-type svg{
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

.accessibilitySubcontainer .accessButton .accessSubButton .accessCol:last-of-type{
    flex: 0;
    font-family: 'GTAmerica';
    font-size: var(--menu);
    padding: var(--x);
/*    background-color: red;*/
}

/* ----------------------------- Reading Mask ----------------------------- */

.dpkCursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 300vh;
  pointer-events: none;
  z-index: 2000;
  display: none;
}

.readingmaskTop{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: calc(50% - 75px);
    background-color: black;
    opacity: 0.5;
}

.readingmaskBottom{
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: calc(50% - 75px);
    background-color: black;
    opacity: 0.5;
}

/* ----------------------------- Mailchimp ----------------------------- */

#mc_embed_signup {
    background: none !important;
    false: ;
    clear: left;
    font: inherit !important;
    width: 750px !important;
    margin-left: calc(50% - 375px) !important;
    margin-bottom: var(--z);
}

#mc_embed_signup input {
    border: none !important;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
}

#mc_embed_signup .mc-field-group {
    clear: left;
    position: relative;
    width: 100% !important;
    padding-bottom: var(--x) !important;
    min-height: 0px !important;
    display: grid;
}

#mc_embed_signup .mc-field-group input {
    display: block;
    width: calc(100% - var(--y)) !important;
    padding: var(--x) !important;
    text-indent: 0px !important;
    text-align: center !important;
    background-color: var(--white);
    font-size: inherit !important;
}

#mc_embed_signup #mc-embedded-subscribe-form div.mce_inline_error {
    display: inline-block;
    margin: 0px !important;
    padding: 3px !important;
    background-color: var(--green) !important;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    font-size: var(--caption) !important;
    font-weight: inherit !important;
    z-index: 1;
    color: var(--black) !important;
}

#mc_embed_signup .button {
    clear: both;
    background-color: var(--green) !important;
    border: 0 none;
    border-radius: 4px;
    transition: none !important;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: inherit !important;
    font-weight: normal;
    height: auto !important;
    line-height: inherit !important;
    margin: 0;
    padding: var(--x) !important;
    text-align: center;
    text-decoration: none;
    vertical-align: top;
    white-space: nowrap;
    color: var(--black) !important;
    width: fit-content;
    width: -moz-fit-content;
}

#mc_embed_signup .button:hover{
    background-color: var(--yellow) !important;
}

#mc_embed_signup .clear {
    clear: both;
    text-align: center !important;
}

#mc_embed_signup div.response {
    margin: 0px 0px var(--x) 0px !important;
    padding: 3px !important;
    font-weight: inherit !important;
    float: left;
    top: -1.5em;
    z-index: 1;
    width: calc(100% - 6px !important);
    color: var(--black) !important;
    background: var(--green) !important;
}

#mc_embed_signup #mce-success-response {
    color: var(--black) !important;
    background: var(--green) !important;
}


#mc_embed_signup div#mce-responses {
    padding: 0px !important;
    width: 100% !important;
    margin: 0px !important;
}

#mc_embed_signup div.response {
    width: 100% !important;
}

/* ----------------------------- Read Speaker ----------------------------- */

#readspeaker_button1{
    position: fixed;
    left: var(--x);
    bottom: var(--x);
    width: 450px;
    z-index: 100 !important;
}

#rs-controlpanel{
    display: none;
}

.rs_addtools .rsbtn_tooltoggle, .rsbtn .rsbtn_tooltoggle {
    display: none !important;
}

.rs_addtools.mega_toggle .rsbtn_left, .rsbtn.mega_toggle .rsbtn_left {
    margin-left: 10px;
}

.rs_addtools .rsbtn_play, .rsbtn .rsbtn_play {
    background: var(--yellow);
    border: none;
    border-radius: 0px;
    display: inline-block;
    box-sizing: inherit;
    float: left;
    height: 2.17em;
    padding-top: 5px;
    padding-bottom: 5px;
    position: relative;
    z-index: 0;
}

.rs_addtools .rsbtn_play, .rsbtn .rsbtn_play:hover{
    background-color: var(--yellow);
}

.rs_addtools .rsbtn_play .rsbtn_right, .rsbtn .rsbtn_play .rsbtn_right {
    font-family: hl-icons!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-left: 1.5px solid var(--black);
    color: var(--black);
    float: left;
    font-size: 16.8px;
    height: 100%;
    line-height: 28px;
    margin: 0 10px 0 7px;
    padding: 0 0 0 10px;
}

.rsbtn .rsbtn_play:hover .rs_addtools .rsbtn_play .rsbtn_right::before, .rsbtn .rsbtn_play .rsbtn_right::before{
  color: var(--black) !important;
}

.rs_addtools .rsbtn_play .rsbtn_left .rsbtn_text span, .rsbtn .rsbtn_play .rsbtn_left .rsbtn_text span {
    color: var(--black);
    font-weight: 700;
    height: 100%;
    margin: 0;
    padding-left: 0px;
    padding-right: 0.2em;
    font-size: var(--caption);
    line-height: 26px;
}

/*.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item span.rsicn:hover {
    color: var(--black);
    background-color: var(--yellow);
}*/

#rsmpl_container .rs-player-loadindicator .rsbtn-progress, .rsbtn .rs-player-loadindicator .rsbtn-progress {
    background: var(--yellow);
    display: none;
    height: 100%;
    position: absolute;
    transition: width .5s ease;
    width: 50%;
    max-width: 100%;
}

#rsmpl_container .rs-player-loadindicator, .rsbtn .rs-player-loadindicator {
    display: block;
    background: var(--black);
    position: absolute;
    height: 3px;
    left: 0;
    right: -1px;
    top: -3px;
}

.rs_addtools .rsbtn_play .rsbtn_left .rsbtn_text::after, .rsbtn .rsbtn_play .rsbtn_left .rsbtn_text::after {
    display: none;
}

.rs_addtools .rsbtn_play .rsbtn_left .rsbtn_text::before, .rsbtn .rsbtn_play .rsbtn_left .rsbtn_text::before {
    display: none;
}

#rsmpl_container .rs-player-loadindicator, .rsbtn .rs-player-loadindicator {
    display: none !important;
}

.rsbtn .rsbtn_exp .rsbtn_exp_inner {
    background: var(--yellow);
    border: none;
    border-radius: 2px;
    display: inline-block;
    border-bottom-left-radius: 0;
    border-left: 0;
    border-top-left-radius: 0;
    box-sizing: inherit;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    position: relative;
}

.rsbtn_speed, .rsbtn_volume{
    display: none;
}

.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause span.rsicn {
    color: var(--black);
    font-size: 16.8px;
}

.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_stop span.rsicn {
    color: var(--black);
    font-size: .9em;
    line-height: 1.9em;
}

.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_stop span.rsicn:hover{
    color: var(--white);
    background-color: var(--black);
}

.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item {
    border: none;
    color: var(--black);
    margin: 0;
    outline: 0;
    background: 0 0;
    border-left: 1.5px solid var(--black);
    float: left;
    font-size: 16px;
    height: 100%;
    line-height: 28px;
    padding: 0;
    width: 2.25em;
    box-shadow: none;
}

/*.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:hover{
    background-color: var(--white);
}*/

.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item span.rsicn:hover{
    color: var(--white);
    background-color: var(--black);
}

.rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_rewind span.rsicn{
    left: 0px;
}

.rsbtn_closer{
    display: none;
}

.rsbtn_tool, .rsmpl-pagemask, .rsmpl-dictionary, .rsmpl-clicklisten, .rsmpl-dl{
    display: none;
}

#rsmpl_container{
    border: none;
    box-shadow: none;
    background: var(--yellow);
    padding-top: 5px;
    padding-bottom: 5px;
    bottom: 25px;
}

#rsmpl_container .rsmpl-tools .rsmpl-tool button {
    border-right: 1px solid var(--black);
    color: var(--black);
}

#rsmpl_container.rsidle .rsmpl-tools .rsmpl-player .rsmpl-playpause .rsicn::before {
    content: "\e902";
    color: var(--black);
}

.rsicn-stop::before {
    content: "\e904";
    color: var(--black);
}

#rsmpl_container .rsmpl-tools .rsmpl-tool button {
    padding: 0px 10px 0px 10px;
}

#rsmpl_container .rsmpl-tools .rsmpl-tool .rsmpl-playpause .rsicn {
    color: var(--black);
}


.newsletterContent{
    width: calc(100% - var(--y));
    margin-left: var(--x);
}

/* ----------------------------- Optimisation ----------------------------- */

@media only screen and (max-width: 1250px) {
    .venueContent {
        display: block;
    }

    .venueCol {
        display: block;
    }

    .venueCol:last-of-type {
        width: 750px;
        padding-top: 0px;
    }
}

@media only screen and (max-width: 1176px) {
    #sitewideHeader .menuButtons:nth-of-type(8n){
        top: 10px;
    }

    #sitewideHeader .defaultTitle {
        margin-top: 160px;
    }

    .defaultTitle {
        margin-top: 140px;
    }

    .featuredContainer {
        height: 50vw;
    }
}

@media only screen and (max-width: 1045px) {
    #frontPageHeader .menuButtons:nth-of-type(7n){
        top: 10px;
    }

    #frontPageHeader .page_title h1 {
        padding-top: 160px;
    }

    .subBodyContainer .subBodyCol {
        width: calc(100% - 600px);
    }

    .subBodyContainer .subBodyCol:last-of-type {
        width: 600px;
    }

    .event_flex .event_container{
        width: calc((100% / 2) - 20px);
        height: 45vw;
    }

    .event_flex .event_container:nth-child(2n){
        margin-right: 0px;
    }

    .event_flex .event_container:nth-child(3n){
        margin-right: var(--y);
    }

    .event_flex .event_container:nth-child(6n){
        margin-right: 0px;
    }
}

@media only screen and (max-width: 1025px) {
    /* .event_flex .event_container{
        width: calc((100% / 2) - 20px);
        height: 45vw;
    }

    .event_flex .event_container:nth-child(2n){
        margin-right: 0px;
    }

    .event_flex .event_container:nth-child(3n){
        margin-right: var(--y);
    } */

    .filterContainer .filterMenu {
        width: calc((100% / 2) - 20px);
    }

    .downloadButton {
        width: calc((100% / 2) - 30px);
        margin-left: 29px;
    }

    .downloadButton:last-of-type {
        margin-top: var(--x);
        margin-left: 0px;
    }

    .event_flex .event_container {
        width: calc((100% / 2) - 20px);
        height: 60vw;
    }

    #venues .event_flex .event_container {
        height: 60vw;
    }

    .feat_img {
        height: 60vw;
    }
}

@media only screen and (max-width: 970px) {
    #sitewideHeader .menuButtons:nth-of-type(6n){
        top: 10px;
    }
}

@media only screen and (max-width: 950px) {
    .venueTable .venueCol2 {
        display: block;
        width: 750px    
    }

    .venueTable .venueCol2:last-of-type {
        padding-left: 0px;
    }
}

@media only screen and (max-width: 930px) {
    .page_title .frontPageContent .wp-block-column p{
        padding: 0px var(--y) 0px var(--y);
    }

    .page_title .frontPageContent .wp-block-video{
        padding: 0px var(--y) 0px var(--y);
    }
}

@media only screen and (max-width: 885px) {
    .subBodyContainer .subBodyCol {
        width: calc(100% - 500px);
    }

    .subBodyContainer .subBodyCol:last-of-type {
        width: 500px;
    }
}

@media only screen and (max-width: 840px) {
    #frontPageHeader .menuButtons:nth-of-type(6n){
        top: 10px;
    }

    .accessibilitySubcontainer .accessButton {
        width: calc((100% - var(--y)) / 3 - 5px);
        height: 35vw;
    }

    .accessibilitySubcontainer .accessButton:nth-of-type(3n){
        margin-right: 0px;
    }

    .accessibilitySubcontainer .accessButton:nth-of-type(4n){
        margin-right: var(--x);
    }
}

@media only screen and (max-width: 790px) {
    .subBodyContainer .subBodyCol {
        display: block;
        margin-bottom: var(--y);
    }

    .subBodyContainer .subBodyCol:first-of-type {
        width: 100%;
        column-count: 2;
    }

    .subBodyContainer .subBodyCol:last-of-type {
        width: 100%;
    }

    .venueTable .venueCol2 {
        width: 100%;
    }
}

@media only screen and (max-width: 775px) {
    .defaultContent {
        padding: var(--x) var(--y) var(--y) var(--y);
    }
}

@media only screen and (max-width: 775px) {
    #sitewideHeader .menuButtons:nth-of-type(5n){
        top: 10px;
    }
}

@media only screen and (max-width: 750px) {
    .event_flex .event_container{
        height: 60vw;
    }

    footer .footerCol {
        display: inline-block;
        width: 100%;
        margin-bottom: var(--x);
    }

    footer .footerCol:last-of-type {
        text-align: left;
    }

    #mc_embed_signup {
        width: 100% !important;
        margin-left: 0px !important;
    }

    .featuredContainer .featuredSlide {
        flex-direction: column;
    }

    .featuredContainer {
        height: 80vw;
    }

    .featuredCol2 {
        font-size: var(--menu);
    }

    .featuredCol2 p {
        font-size: var(--menu);
    }

    .filterContainer .filterMenu {
        width: 100%;
    }

    .downloadButton {
        width: calc(100% - 10px);
        margin-top: var(--x);
        margin-left: 0px;
    }

    .downloadButton:last-of-type {
        margin-top: var(--x);
        margin-left: 0px;
    }

    .venueCol:first-of-type {
        width: calc(100% - var(--z));
    }

    .venueCol:last-of-type {
        width: calc(100% - var(--z));
    }

    .featuredCol2 {
        width: calc(100% - var(--z));
    }

    .event_flex .event_container{
        width: 100%;
/*        width: calc(100% - 20px);*/
        height: 45vw;
    }
}

@media only screen and (max-width: 680px) {
    header .menuButtons{
        display: none;
    }

    #accessibilityMobileButton, #menuMobileButton{
        display: inline;
    }

    #frontPageHeader .menuButtons:nth-of-type(6n) {
        top: 0px;
    }

    #frontPageHeader .menuButtons:nth-of-type(7n) {
        top: 0px;
    }

    #sitewideHeader .menuButtons:nth-of-type(8n) {
        top: 0px;
    }
}

@media only screen and (max-width: 640px) {
    :root{
        --h3: 28pt;
    }

    .event_flex .event_container{
        height: 75vw;
    }

    #venues .event_flex .event_container {
        height: 85vw;
    }

    .feat_img {
        height: 80vw;
    }
}

@media only screen and (max-width: 600px) {
    .event_flex .event_container{
        width: 100%;
        height: 90vw;
    }

    .event_flex .event_container:nth-child(2n){
        margin-right: 0px;
    }

    .event_flex .event_container:nth-child(3n){
        margin-right: 0px;
    }

    .subBodyContainer .subBodyCol:first-of-type {
        width: 100%;
        column-count: 1;
    }

    #venues .event_flex .event_container {
        height: 100vw;
    }

    .accessibilitySubcontainer .accessButton {
        width: calc((100% - var(--x)) / 2 - 5px);
        height: 45vw;
    }

    .accessibilitySubcontainer .accessButton:nth-of-type(3n){
        margin-right: var(--x);
    }

    .accessibilitySubcontainer .accessButton:nth-of-type(2n){
        margin-right: 0px;
    }
 
}

@media only screen and (max-width: 570px) {
    .featuredContainer {
        height: 100vw;
    }
}

@media only screen and (max-width: 500px) {
    :root{
        --subtitles: 8vw;
        --h3: 22pt;
    }

    .page_title .has-text-align-center {
        padding-left: var(--x);
        padding-right: var(--x);
    }

    .page_title p {
        padding-left: var(--y);
        padding-right: var(--y);
    }

    .featuredContainer {
        height: 180vw;
    }

    .defaultTitle {
        margin-top: 110px;
    }

    #readingMask {
        display: none;
    }

    .newsletter_signup {
        width: calc(100vw - var(--y));
        padding: var(--z) var(--x) var(--z) var(--x);
    }

    .newsletter_signup h2 .highlightText {
        font-size: 7vw;
        padding: 0;
    }

    .mostPages .page-numbers{
        display: none;
    }

    .mostPages .next, .mostPages .prev {
        display: inline;
    }

    .mostPages {
        margin-bottom: var(--y);
    }
}

@media only screen and (max-width: 414px) {


.event_flex .event_container{
    height: 120vw;
}

}

@media only screen and (max-width: 375px) {


    .event_flex .event_container{
        height: 150vw;
    }
    
    }

    @media only screen and (max-width: 320px) {


        .event_flex .event_container{
            height: 90vh;
        }
        
        }








