/*
Theme Name: Dance Umbrella 20
Theme URI: n/a
Author: Raffaele Malanga / Els van Bloois
Author URI: https://farstudios.com/
Description: Theme for DanceUmbrella.co.uk
Version: 1.0
License: no license, use a theme from https://wordpress.org/themes/ instead.
License URI: n/a
Tags: n/a
Text Domain: danceumbrella20
*/

html,body,h1,h2,h3,h4,h5,h6,p,ul,li,form{
	padding:0;
	margin:0;
}
*{
	box-sizing:border-box;
	/* added this on 15/5, need to double check that it doesn't interferewith anything */
}
html{
	font-size:16px; /* for rem values */
}
ul{
	list-style:none;
}

.entry-content ul li,
.page-content ul li{
	padding-left:1em;
	background:url(img/bullet.png) transparent no-repeat 0 .6em / .3125rem auto;
}
.entry-content ul.photoslider li,
.page-content ul.photoslider li,
.entry-content ul.photogallery li,
.page-content ul.photogallery li,
.entry-content .nobullets ul li,
.page-content .nobullets ul li,
ul.people li{
	padding-left:0;
	background:transparent;
}
/* woocommerce that already use list-style:none on their own */
/* also need the background image and padding I set above to be removed  */
.entry-content .woocommerce-error li,
.entry-content .woocommerce-info li,
.entry-content .woocommerce-message li,
.entry-content .woocommerce ul.order_details li,
.page-content .woocommerce-error li,
.page-content .woocommerce-info li,
.page-content .woocommerce-message li,
.page-content .woocommerce ul.order_details li{
	background:transparent;
	/* padding-left is already set in woocommerce stylesheet */
}
.page-content ul.woocommerce-SavedPaymentMethods li,
.page-content ul.payment_methods li{
	background:transparent;
	padding-left:0;
}

/* other woocommerce overrides because it messes things up */

.woocommerce .quantity .qty{
	box-sizing: content-box !important;
	/* this is needed because the field has a set width and */
	/* assumed there was no 'box-sizing:border-box' set on input fields on the site */
}

.woocommerce-checkout #colophon label.screen-reader-text{
	position:absolute !important; /* the woo-style.css stylesheet is too generic, it applies position relative important to the whole page! */
	top:-40000px;
	left:-40000px;
}

.woocommerce form .show-password-input,
.woocommerce-page form .show-password-input{
	top:0; /* the woocommerce style of 0.7em is based on different heights on the fields */
}


.woocommerce-input-wrapper span.selection,
.woocommerce-input-wrapper span.selection span,
.woocommerce-input-wrapper span.dropdown-wrapper{
	font-size:.875rem;
}


.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea{
	line-height:1.7 !important;
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt{
	border-color:#000;
	color:#000;
	background-color:transparent;
	font-weight:400;
	border-radius:0;
	line-height:1.7;
	padding:.2em 1em !important;
}
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover{
	/* not sure if there should be styles here, and more :hover rules? */
}

.woocommerce #respond input#submit.alt.disabled,
.woocommerce #respond input#submit.alt.disabled:hover,
.woocommerce #respond input#submit.alt:disabled,
.woocommerce #respond input#submit.alt:disabled:hover,
.woocommerce #respond input#submit.alt:disabled[disabled],
.woocommerce #respond input#submit.alt:disabled[disabled]:hover,
.woocommerce a.button.alt.disabled,
.woocommerce a.button.alt.disabled:hover,
.woocommerce a.button.alt:disabled,
.woocommerce a.button.alt:disabled:hover,
.woocommerce a.button.alt:disabled[disabled],
.woocommerce a.button.alt:disabled[disabled]:hover,
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt.disabled:hover,
.woocommerce button.button.alt:disabled,
.woocommerce button.button.alt:disabled:hover,
.woocommerce button.button.alt:disabled[disabled],
.woocommerce button.button.alt:disabled[disabled]:hover,
.woocommerce input.button.alt.disabled,
.woocommerce input.button.alt.disabled:hover,
.woocommerce input.button.alt:disabled,
.woocommerce input.button.alt:disabled:hover,
.woocommerce input.button.alt:disabled[disabled],
.woocommerce input.button.alt:disabled[disabled]:hover{
	border-color:#000 !important;
	color:#000 !important;
	background-color:#EEEEEE !important;
	/* opacity: .5 set by woocommerce is fine */
	cursor:default;
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button{
	line-height:1.7;
	font-weight: 400;
	background:transparent;
	color:#000;
	border-color:#000;
	transition:.5s all ease-in-out 0s;
	display:inline-block;
	padding:.2em 1em !important; /* to override sizing from woocommerce styles */
	border-width:2px;
	border-style:solid;
	border-radius:0 !important;
	cursor:pointer;
	margin:auto;
}

/* more woo overrides */
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt{
	background:transparent !important;
	color:#000 !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:hover{
	background:black !important;
	color:#fff !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button:hover{
	background:black !important;
	color:#fff !important;
}




.nyp-wrapper-flex input[type=text]{
	margin-bottom:1em;
}



.screen-reader-text{
	position:absolute;
	top:-40000px;
	left:-40000px;
}
.skip-link:focus{
	top:2.5rem;
	left:2.5rem;
	background:white;
	color:black;
	padding:.625rem 1.25rem;
	border:2px solid black;
	text-decoration:none;
	text-transform:uppercase;
	font-size:100%;
	z-index:20000;
}
img,
iframe{
	max-width:100%;
}
.entry-attachment img,
.digital-pass-content img{
	height:auto !important;
}
b,strong{
	font-weight:600;
}
a{
	text-decoration:underline;
}
a:focus,
a:hover,
a:active{
	text-decoration:none;
}
#masthead a,
.breadcrumb a,
/*
.indexitem a.imglink,
.indexitem h2 a,
.indexitem h3 a,
.indexitem .posted-on a,
.indexitem .readmorebutton a,
*/ /* this might still be needed, in case there are situations where there could be a text link inside preview text? */
.indexitem a, /* this one should then be removed */
.recentposts a,
.filters a,
.trailerbutton a,
.playpopbutton a,
.subnavbar a,
.button,
.feature-button,
.fplist li a,
.otherlinks li a,
#colophon a{
	text-decoration:none;
}
#colophon a{
	font-weight:600;
}

.menu-toggle{
	display:none;
}

/* fonts */

body{
	font-family:'Inter',Arial,sans-serif;
	font-size:100%;
	line-height:1;
}
table,th,td,form,input,textarea,select,option{
	font-family:'Inter',Arial,sans-serif;
}
h1.page-title,
h2.benefits,
.benefits .joinnow,
h2.umbrellatitle,
h2.eventselection,
#secondary h2,
.section h2,
h2.sectionheading,
.historysection h2,
.digital-pass-cta h2,
.digital-pass-item h2,
.steps3 h3,
table.benefits td span{
	font-family:'Dirrrty',Arial,sans-serif;
	font-weight:400;
	text-transform:lowercase;
}
table.benefits td span{
	font-size:2.8125rem; /* Dirrrty */
}

h1{
	font-size:2.125rem;
	font-weight:500;
	line-height:1.4;
}
h1.site-title,
p.site-title{
	font-size:1.6875rem;
	line-height:1;
}
h1.page-title{
	font-size:3.25rem; /* Dirrrty */
	font-size:3.75rem; /* taken from festival page */
	line-height:1.3;
	text-align:center;
	padding-top:0.2em;
	/* testing if this works better: */
	padding-top:0;
	margin-bottom:0; /* was 0.6em */ /* transfered spacing to top of filterswrap list items */
}
.hero h1.page-title{
	font-size:8.75rem;
}
h2.page-subtitle{
	font-size:2.125rem; /* Inter */
	font-weight:400;
	line-height:1;
	text-align:center;
	padding-top:0;
	margin-bottom:.5em;
}
.pageintro h2{
	font-size:2.125rem; /* Inter */
	font-weight:700;
	padding-top:0;	
}

h1.event-title{
	font-weight:600;
}
h1.event-title span{
	display:block;
	font-weight:400;
}
h1.event-title span.countryorigin{
	display:inline !important;
	font-size:.45em;
	font-style:italic;
	white-space:nowrap;
}
h2.event-title span,
h3.event-title span{
	display:block;
	font-weight:500;
}
h2,
#colophon p.myaccountlink{
	font-size:1.6875rem;
	font-weight:400;
	line-height:1.3;
	padding-top:1em;
	margin-bottom:.5em;
}
.section .inner h2:first-child,
.sectionpadding .inner h2:first-child,
.greybox h2{
	padding-top:0;
}
.ocb h2.ocbheading{
	font-weight:600;
	padding-top:.8em !important; /* to overwrite the style for h2:first-child */
}

.tablereplacement h2{
	margin-bottom:0;
}
.tablereplacement h3{
	margin-bottom:.5em;
}

h2.benefits,
h2.eventselection{
	font-size:2.5rem; /* Dirrrty */
}
.section h2,
h2.sectionheading{
	font-size:3.75rem; /* Dirrrty */
	line-height:1.3;
	text-align:center;
	padding-top:0;
	margin-bottom:.8em;
}
.section.support1 h2{
	margin-bottom:.4em;
}
.digital-pass-cta h2{
	font-size:3.75rem; /* Dirrrty */
	line-height:1.3;
	padding-top:0;
	margin-bottom:.1em;
}
.digital-pass-item h2{
	font-size:3.75rem !important; /* Dirrrty */
	line-height:1 !important;
	padding-top:0;
	margin-bottom:.5em;
}
.section.support2 h2{
	font-size:2.5rem;
}
/*
.section.related h2{
	font-size:2.5rem;
	text-align:left;
}
*/
h2.umbrellatitle{
	font-size:2.625rem; /* Dirrrty */
	line-height:1.3;
	padding-top:0;
	margin-bottom:.2em;
}
.steps3 h3{
	font-size:2.5rem; /* Dirrrty */
	line-height:1;
	text-align:center;
	margin-bottom:.8em;
}
.historysection h2,
#secondary h2{
	font-size:1.6875rem; /* Dirrrty */
	line-height:1.3;
	padding-top:0;
	margin-bottom:.8em;
}
.benefits .joinnow{
	font-size:1.5625rem; /* Dirrrty */
	white-space:nowrap;
	line-height:1;
}
.subnavbar h2, /* only visible on mobile */
.eventsidebar h2{
	font-size:1.1875rem;
	font-weight:700;
	text-transform:uppercase;
	line-height:1.5;
	padding-top:0; /* overriding for when in subnavbar */
	margin-bottom:0;
}
h2.comments-title{
	font-size:1.1875rem;
}
.indexitem h2,
.indexitem h3{
	font-size:1.1875rem;
	line-height:1.3;
	font-weight:500;
}
.indexitem h2.event-title,
.indexitem h3.event-title,
.indexitem h3.subpage-title{
	font-weight:700;
}
.indexitem h2.event-title span,
.indexitem h3.event-title span{
	font-weight:500;
}
#colophon h2,
#colophon p.myaccountlink{
	font-size:1.1875rem;
	font-weight:600;
	text-transform:uppercase;
}
#colophon p.myaccountlink{
	text-transform:none;
}

/* h3 - h6 to be decided on sizes/weights still */
h3,h4{
	font-size:1.1875rem;
	font-weight:600;
	line-height:1.7;
}
.digital-pass-item h3{
	font-weight:600;
	margin-bottom:1.5em;
}
.ocbcontent h3{
	font-size:1.5rem;
	font-weight:400;
	line-height:1.7;
	padding-top:1em;
	margin-bottom:0;
}
.home .postindex .indexitem h3{
	font-weight:700;
}
h5,h6{
	font-size:1.1875rem;
	font-weight:500;
	line-height:1.7;
}
p,ul,ol,table,tr,td,
.feature-button{
	font-size:1.1875rem;
	font-weight:400;
	line-height:1.7;
	margin-bottom:0.7em;
}
.page-header p.tagline{
	text-align:center;
}
.page-header ul.event-dtl{
	font-size:1.1875rem;
	font-weight:700;
	line-height:1.7;
	margin-top:.8em;
}
.page-header ul.event-dtl li.extrainfo{
	font-weight:400;
}
.page-header ul.event-dtl li{
	margin-bottom:0;
}
.subnavbar ul{
	font-size:1rem;
	font-weight:600;
	margin-bottom:0;
}
.subnavbar p{
	font-size:1.125rem;
	font-weight:600;
	margin-bottom:0;
}
.eventsidebar h3,
.eventsidebar p,
.eventsidebar ul{
	font-size:1rem;
	font-weight:400;
	line-height:1.4;
	margin-bottom:.6em;
}
.entry-content .eventsidebar ul li{
	/* overriding entry-content list styles */
	list-style:none;
	padding-left:0;
	background:none;
	margin-bottom:.2em;
}
.eventsidebar h3,
.eventsidebar p.extrainfo,
.eventsidebar strong{
	font-weight:700;
}
.eventsidebar .festivalinfo p,
.eventsidebar .festivalinfo ul{
	font-size:.875rem;
	line-height:1.3;
	margin-bottom:0;
}

ul.filters{
	font-size:1.125rem;
	font-weight:600;
}
.page-header ul.filters{
	margin-bottom:0;
}
.intro form,
.entry-content form,
.page-content form{
	margin-bottom:1em;
}
form,
label,
button,
input,
textarea,
select,
option{
	font-size:.875rem;
	font-weight:400;
	line-height:1.7;
}
input[type=submit],
button[type=submit]{
	font-size:1.1875rem !important;
	font-weight:600;
}
.formbox input[type=submit],
.formbox button[type=submit]{
	font-size:.875rem !important;
}
.indicates-required{
	font-size:.75rem;
}
textarea,
select{
	vertical-align:top;
	padding:.2em 1em;
	border-width:2px;
	border-style:solid;
}

/* all form fields and labels are .875rem */

p.woocommerce-LostPassword.lost_password,
#mc_embed_signup p,
.form-group,
.form-group p,
.form-group label,
.mc-field-group,
.mc-field-group p,
.mc-field-group label,
.form-group input,
.mc-field-group input,
#respond label,
#respond input,
#respond form textarea{
	font-size:.875rem;
}

/* buttons are 1.1875rem */

.form-group input[type=submit],
.mc-field-group input[type=submit],
#respond input[type=submit]{
	font-size:1.1875rem;
}

ul.amounts.new li{
	line-height:1.6 !important;
}


ul.amounts.new li{
	display:inline-block;
	padding:0em .5em !important;
	border-width:2px;
	border-style:solid;
	cursor:pointer;
	transition:.5s all ease-in-out 0s;
}

ul li{
	margin-bottom:.6em;
}
#colophon ul li{
	margin-bottom:0;
}
ul.otherlinks{
	font-size:1.6875rem;
	font-weight:600;
	line-height:1.2em;
}
ul.people .name{
	font-weight:600;
}
#secondary ul{
	margin-bottom:3em;
}
ul.recentposts li{
	margin-bottom:1.2em;
}
.site-nav ul{
	font-size:1.125rem;
	font-weight:600;
}
ul.comment-list,
ul.comment-list p,
ul.comment-list ul{
	font-size:.9375rem;
	line-height:1.8;
	margin-bottom:1em;
}
ul.comment-list ul{
	margin-bottom:0;
}
ul.comment-list .comment-author{
	margin-bottom:0.2em;
}
ul.comment-list .comment-metadata{
	font-size:.8125rem;
	margin-bottom:0.2em;
}
.sharingiscaring p{
	font-size:1rem;
	font-weight:600;
}
p.caption,
p.posted-on,
p.eventdates,
span.eventcat,
p.eventloc,
p.prevtext,
p.credits,
p.excerpt,
p.byline-regular,
.smalltext p,
.smalltext ul,
p.comment-notes,
.comment-form p.comment-form-cookies-consent label,
.mc-field-group.input-group ul li label,
.mc-field-group.radio-group ul li label,
#colophon p,
#colophon ul,
#colophon input,
.formbox input, /* the margin affects the height of the input fields? */
#colophon p.myaccountlink a,
.headerflex .loggedinout-details p{
	font-size:.875rem;
	font-weight:400;
	line-height:1.7;
	margin-bottom:0.7em;
}
span.eventcat{
	margin-bottom:0;
}
.indexitem .entry-header h3.event-title{
	padding-top:.3em; /* overrides the rule for h3s in other indexitems */
}
.digital-pass-cta p{
	font-weight:500;
	margin-bottom:1.5em;
}
.digital-pass-cta p.alreadyhavepass{
	font-size:1rem;
	font-weight:400;
}
.digital-pass-item p{
	margin-bottom:1.3em;
}
.eventsidebar .button,
.eventsidebar .feature-button{
	font-size:1.125rem;
}
.eventsidebar .button,
.eventsidebar .feature-button,
.digital-pass-item .button{
	font-weight:600;
}


.formbox input,
#colophon p.myaccountlink a{
	font-weight:600;
}
span.eventcat{
	font-weight:700;
}
p.readmorebutton{
	font-weight:700;
}
p.caption{
	padding-top:1em;
}
p.byline-regular{
	margin-top:-0.5em;
	margin-bottom:2em;
}
.smalltext{
	margin-bottom:1.5em;
}
ul.recentposts li p.posted-on{
	padding-top:.15em;
}
p.cat-links,
p.tag-links{
	font-size:.75rem;
	text-transform:uppercase;
}
#colophon p.registered,
p.breadcrumb{
	font-size:.75rem;
}
p.breadcrumb a{
	font-weight:500;
}
.intro p{
	font-size:1.6875rem;
	font-weight:500;
	line-height:1.55;
	margin-bottom:1.55em;
}
.home .intro p{
	font-weight:400;
	line-height:1.7;
}
.herooverlay p{
	font-size:2.5rem;
	font-weight:600;
	line-height:1.25;
	margin-bottom:0;
}
.hero p.heroinfo{
	font-size:.75rem;
	font-weight:400;
	line-height:1.5;
	padding-bottom:1em;
	padding-bottom:calc(1.875rem - .8em); /* client requested it be "equal distance from the bottom as from the right" */
	margin-bottom:0;
	margin-top:1.5rem; /* so there is space between the credits/caption and the 'play trailer' button above it */
}
.hero .event-details p.heroinfo{
	padding-bottom:0;
}

/* .hero .event-details p.heroinfo.fortheimage, */
.herovideo p.heroinfo.fortheimage{
	display:none;
}
@media(max-width:620px){
	/* display the correct caption/credits for the correct situation */
	/* at 620px and below, the video is replaced with a vertical static image */
	/* .hero .event-details p.heroinfo.forthevideo, */
	.herovideo p.heroinfo.forthevideo{
		display:none;
	}
	/* .hero .event-details p.heroinfo.fortheimage, */
	.herovideo p.heroinfo.fortheimage{
		display:block;
	}
}


/* exception for when the image credtis are below the hero */
#homehero .hero p.heroinfo{
	margin-top:0; /* when it's displayed below the slider, there is no 'play trailer' button or anything else */
}
/* end exception */
p.heroinfo .desc{
	font-style:italic;
}
.herooverlay p.trailerbutton,
.herooverlay p.playpopbutton{
	font-size:.875rem;
	font-weight:400;
	margin-top:1.5rem; /* so there is space between it and the main event details when it's all left aligned on mobile */
}
.introlarge p{
	font-size:2.125rem;
	font-weight:400;
	line-height:1.4;
	margin-bottom:0.65em;
}
.dl{
	font-size:1.6875rem;
	font-weight:600;
}
.quotebox{
	padding:.5em 0;
	margin-bottom:1.5em;
}
p.quote{
	font-size:1.6875rem;
	font-weight:600;
	line-height:1.55;
	margin-bottom:0;
}
p.byline{
	font-size:1.1875rem;
	font-weight:500;
	line-height:1.7;
	padding-top:1em;
	margin-bottom:0;
}
.historysection .featuredperformances h3{
	font-size:1.1875rem;
	font-weight:500;
	margin-bottom:.3em;
}
.historysection .infotext p,
.historysection .featuredperformances ul{
	font-size:.9375rem;
}
table.benefits tr:first-child th{
	font-size:.875rem;
	font-weight:700;
	text-transform:uppercase;
}
table th p,
table td p{
	font-size:inherit;
}

table.benefits th:first-child{
	font-weight:400;
}
table.benefits tr:first-child th:first-child{
	font-size:1.6875rem;
	font-weight:600;
	text-transform:none;
}
table.benefits tr:first-child th span.monthly{
	font-weight:400;
	text-transform:none;
}




/* colours */


/* gradient colours per 24/4/2023 */
/* 
Orange 	– #EE69F6
Pink 	– #5E7BF8
Purple 	– #574E9C
*/

h2.benefits span,
h2.eventselection span,
#secondary h2 span,
.section h2 span,
h2.sectionheading span,
.historysection h2 span,
.digital-pass-cta h2 span{
	background: -webkit-linear-gradient(0deg, rgba(13,173,162,1),rgba(94,123,248,1),rgba(238,105,246,1));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	display:inline-block; /* otherwise the colours are wider than the text */
}
.section.rainbow h2 span{
	background:transparent;
	-webkit-background-clip:none;
	-webkit-text-fill-color:#fff;
	color:#fff;
	/* just in case we forget a span somewhere when the background colour is changed to rainbow */
}


/*
pink 		= #EFACB0 becomes orange #ff8c46 
                  239,172,176 becomes 255,140,70
                  20220622 #ff8c46 becomes teal #009696
                  255,140,70 becomes 0,150,150
                  20230424 #009696 becomes purple #574E9C (except in some cases)
                  
header text	= #000000
main text	= #000000
dark green 	= #283525 becomes purple #3F1659
		  20220622 #3F1659 becomes peach #f56950
		  20230424 #f56950 becomes orange #EE69F6 (except in some cases)
footer text 	= #FFFFFF
comments bg	= #F5F5F5
comments text	= #555555
comments dividers = #C2C2C2
*/

body,
#colophon{
	background:#2F2F2F; /* to never have white space below the footer */
	color:#fff;
}
#page{
	background:#fff; /* to not have green space above the masthead/navbar */
}
#masthead,
#main{
	background:#fff;
	color:#000;
}
.home #masthead{
	background:linear-gradient(to bottom, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 100%);
	background:linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.05) 90%, rgba(0,0,0,0) 100%);
	color:#fff;
}
.home #masthead .menu-toggle,
.home #masthead .minitoggle{
	filter:invert(1);
}
.home #masthead:hover{
	background:white;
	color:#000;
}
.home #masthead:hover .site-title a{
	/* background:url(img/dance-umbrella-logo-21-purple-black.png) transparent no-repeat left top / contain; */
	/* background:url(img/dance-umbrella-logo-22-peach-black.png) transparent no-repeat left top / contain; */
	background:url(img/dance-umbrella-logo-24-gradient-black.png) transparent no-repeat left top / contain;
	transition:background .4s ease-in-out .1s;
}
.home #masthead:hover .site-title a img{
	opacity:0;
	transition:opacity 0s ease-in-out .1s;
}
.home #masthead:hover .menu-toggle,
.home #masthead:hover .minitoggle{
	filter:invert(0);
}
.home #masthead .site-nav .minitoggle{
	transition:all .5s ease-in-out 0s;
}

.home #homehero{
	background:#fff;
	color:#000;
}

.hero .mhimgwrap .mhoverlayinside span{
	color:#fff;
    	text-shadow:1px 2px 4px #000000;
}
/* in homepage slider it goes *below* the image, so black on white, no shadow */
#homehero .hero .photoslider .mhimgwrap .mhoverlayinside span{
	color:#000;
    	text-shadow:none;
}


.section.whatyoumissed{
	background:#E6E6E6;
	color:#000;
}
.section.festival{
	background:#fff;
}
.section.takealook{
	background:#000;
	color:#fff;
}
.section.latest{
	background:#FFF;
	color:#000;
}
.section.latest h2,
.section.related h2{
	color:#EE69F6;
}
.sectionpadding.grey,
.section.grey{
	background:#E6E6E6;
	color:#000;
}
.section.exploredigital{
	background:#fff;
	color:#000;
}

.page-header.rainbow,
.section.rainbow{
	background:#5E7BF8;
	background:linear-gradient(90deg, #0DADA2, #5E7BF8, #EE69F6);
	color:#fff;
}

.page-header.rainbow button ,
.section.rainbow button {
	border-color:#fff;
}
.page-header.dark,
.section.dark,
.sectionpadding.dark{
	color:#fff;
}

.page-header.dark.rainbow,
.section.dark.rainbow,
.sectionpadding.dark.rainbow{
	color:#fff;
}

.page-header.light,
.section.light,
.sectionpadding.light{
	color:#fff;
}
.page-header.color1,
.section.color1,
.sectionpadding.color1{
	background:#EE69F6;
}
.page-header.color2,
.section.color2,
.sectionpadding.color2{
	background:#5E7BF8;
}
.page-header.color3,
.section.color3,
.sectionpadding.color3{
	background:#574E9C;
}
.page-header.hero{
	background:#000000;
}
.subnavbar{
	background:#000000;
	color:#fff;
}
.entry-comments{
	background:#F5F5F5;
	color:#555;
}
.single-du_event .entry-comments{
	background:#fff;
}

#eventcontent .sbbinside{
	background:#E6E6E6;
	color:#000;
}
#eventcontent .sbbhybrid h2{
	background:#574E9C;
	color:#fff;
}
#eventcontent .sbbdigital h2{
	background:#5E7BF8;
	color:#fff;
}
#eventcontent .sbbinperson h2{
	background:#EE69F6;
	color:#000;
}

h2.festivalevents,
.historysection h2{
	color:#009696;
	color:#574E9C;
}
/* these are overriden by the new gradient colour */

h2.benefits,
h2.otherevents{
	color:#f56950;
	color:#EE69F6;
}
/* these are overriden by the new gradient colour */

h2.umbrellatitle{
	color:#fff;
}
#secondary h2,
.quotebox p{
	color:#f56950;
	color:#574E9C;
}

.quotebox p {
	color:#5E7BF8;
}
#primary .intro,
.recentposts h3{
	color:#000; /* used to be dark green, but was not changed to purple */
}
a{
	color:inherit;
}

.digital-pass-item .iteminside{
	background:#5E7BF8;
	color:#000;
	/* background:url(img/deco-black.svg) #5E7BF8 no-repeat center bottom / 100% 11rem; */
	background:url(img/deco-black.svg) #5E7BF8 no-repeat center calc(100% - 1rem) / 100% 11rem;
	/* does calc() work in all browsers? */
}
.digital-pass-cta{
	background:url(img/deco-orange.svg) transparent no-repeat center bottom / 100% 10rem;
}
.digital-pass-highlight {
	color: #fff;
	background-color:rgba(230,0,126,.8);
}
.add-icon {
	color:#5E7BF8; 
}
#digitalpasspopup{
	background:transparent;
}
#digitalpasspopup .digital-pass-cta,
.digital-pass-content,
.fancybox-content{
	background-color:#fff;
	color:#000;
}


table.benefits th,
table.benefits td{
	border-top:.1875rem solid black;
}
table.benefits td span{
	color:#009696;
	color:#EE69F6;
}
table.benefits td.highlighted{
	border-top-color:#009696;
	border-top-color:#EE69F6;
}
th.highlighted:not(:first-child),
td.highlighted{
	background:#009696;
	background:#EE69F6;
	color:#fff;
}
table.benefits th span.joinnow,
table.benefits td span.joinnow,
table.benefits td.highlighted span.joinnow{
	color:#fff;
}
table.benefits th:first-child{
}
table.benefits td.highlighted span{
	color:inherit;
}
.dividerline{ /* ###split### */
	border-bottom:.375rem solid #5E7BF8;
}
.supportsectionflexed:after{
	background:#ffffff; /* makes the divider line between newsletter and support columns */
}
.greybox{
	background:#E6E6E6;
	color:black;
}
/* button colours */

/* generic, on white or coloured (not rainbow) background */
/* needs one more exception for footer and support header button */
.button,
.feature-button,
.form-submit,
.form-submit input,
.filters a,
ul.categories li a,
button,
input,
textarea,
select{
	background:transparent;
	color:#000;
	border-color:#000;
	transition:.5s all ease-in-out 0s;
}
.button:focus,
.button:hover,
.button:active,
.feature-button:focus,
.feature-button:hover,
.feature-button:active,
.form-submit:focus,
.form-submit:hover,
.form-submit:active,
.filters a:focus,
.filters a:hover,
.filters a:active,
ul.categories li a:focus,
ul.categories li a:hover,
ul.categories li a:active,
button:focus,
button:hover,
button:active{
	background:black;
	color:white;
}
.filters li.current-cat a,
.blog .filters li.cat-item-all a,
.page-template-page-festival-and-more .filters li.cat-item-all a,
.filters li.current-menu-item a{
	background:black;
	color:white;
}

/* these are not real buttons, but need to behave like them */
ul.amounts.new li{
    background:transparent;
    color:#000;
    border-color:#fff;
}
ul.amounts.new li.highlight,
ul.amounts.new li:focus,
ul.amounts.new li:hover,
ul.amounts.new li:active{
    background:#000;
    color:#fff;
}

/* exceptions */
ul.amounts.new li,
.nyp button[type="submit"]{
	background:#fff; /* exception to the transparent rule */
	color:#000;
}
.dark ul.amounts.new li,
.dark .nyp button[type="submit"]{
	border-color:#fff;
}
.nyp button[type="submit"]:focus,
.nyp button[type="submit"]:hover,
.nyp button[type="submit"]:active{
	background:#000;
	color:#fff;
}


/* on dark background */
/* this applies to the footer, and all rainbow backgrounds */

.dark .button,
.dark .feature-button,
.dark .form-submit,
.dark .form-submit input,
.dark .filters a,
.dark ul.categories li a,
.dark button,
.dark input,
.dark textarea,
.dark select{
	background:transparent;
	color:#fff;
	border-color:#fff;
	transition:.5s all ease-in-out 0s;
}
.dark .button:focus,
.dark .button:hover,
.dark .button:active,
.dark .feature-button:focus,
.dark .feature-button:hover,
.dark .feature-button:active,
.dark .form-submit:focus,
.dark .form-submit:hover,
.dark .form-submit:active,
.dark .filters a:focus,
.dark .filters a:hover,
.dark .filters a:active,
.dark ul.categories li a:focus,
.dark ul.categories li a:hover,
.dark ul.categories li a:active,
.dark button:focus,
.dark button:hover,
.dark button:active{
	background:#fff;
	color:#000;
}
.dark .filters li.current-cat a,
.dark .blog .filters li.cat-item-all a,
.dark .page-template-page-festival-and-more .filters li.cat-item-all a,
.dark .filters li.current-menu-item a,
.dark .playpopbutton a{
	background:#fff;
	color:#000;
}
.dark .playpopbutton a:focus,
.dark .playpopbutton a:hover,
.dark .playpopbutton a:active{
	background:#000;
	color:#fff;
}



/* exception for the one button on image background: */

.hero .mhinfowrap .mhinfocontent .scrollit .button{
	background:#fff;
	color:#000;
	border-color:#fff;
}
.hero .mhinfowrap .mhinfocontent .scrollit .button:focus,
.hero .mhinfowrap .mhinfocontent .scrollit .button:hover,
.hero .mhinfowrap .mhinfocontent .scrollit .button:active{
	background:#000;
	color:#fff;
	border-color:#000;
}

/* end button styles */

/* events coloured tags */

.eventcat{
	background:#EE69F6;
}
.eventcat.digital{
	background:#5E7BF8;
	color:#fff;
}
.eventcat.free{
	background:#0DADA2;
	color:#fff;;
}

	
/* layout */

#page{
	position:relative;
	/* so that position:absolute is relative to the admin bar */
	padding-top:7.4375rem; /* space for the #masthead */	
}
.home #page{
	padding-top:0; /* no space here, #masthead should go in front of the rest of the page */
}
.inner,
.mhoverlayinside{
	max-width:73.125rem; /* was 1110px before border-box setting */
	padding:0 1.875rem;
	margin:0 auto;
}
.section.widebox .inner{
	max-width:57.75rem; /* with 2 x 1.875rem padding, is 54rem content is 864px */
}

#masthead .inner{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
}
#masthead{
	padding:1.0625rem 0 1.1875rem 0;
}
#masthead{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	transition:all .5s ease-in-out 0s;
	z-index:10000;
}
.scrolled #masthead{
	top:-12.5rem;
}
.scrolledup #masthead{
	position:fixed;
	top:0 !important;
}
.admin-bar.scrolledup #masthead{
	top:32px !important;
}
@media(max-width:782px){
	.admin-bar.scrolledup #masthead{
		top:46px !important;
	}
}
.site-title{
	width:15.3125rem;
	margin-left:-1.25rem; /* based on the logo's swirl size */
	margin-bottom:0 !important; /* overriding both h1 and p styles */
}
.site-title a,
.site-title img{
	display:block;
}

#site-navigation .topnavcontent{
	display:flex;	
	align-items:center;
}
.site-nav .minimenu{
	position:relative;
	width:1.5rem; /* as wide as the burger icon */
	padding:.75rem;
	margin-left:2rem;
}
.minitoggle{
	position:absolute;
	top:-.75rem;
	left:-.75rem;
	display:block;
	width:3rem;
	height:3rem;
	background:url(img/menu.png) transparent no-repeat center / auto 1.25rem;
	border-width:0;
	margin-bottom:0;
	cursor:pointer;
	z-index:10002; /* in front of menu container */
}
.minitoggle span{
	position:absolute;
	left:-40000px;
}
.site-nav .minimenu .minimenucontent{
	position:absolute;
	left:-.75rem; /* same as toggle */
	top:2.25rem; /* height of minitoggle - top of minitogge */
	background:white;
	color:black;
	width:12rem;
	padding-top:1.9rem;
	display:none;
}
.minimenu-open .site-nav .minimenu .minimenucontent{
	display:block;
}
.minimenu-open .minitoggle{
	background-color:white;
	filter:invert(0) !important; /* override different situations on homepage */
	background-image:url(img/close.png);
}


.site-nav ul{
	margin-bottom:0;
}
.site-nav ul li{
	display:inline-block;
	margin-left:1.125rem;
	margin-bottom:0;
}
.site-nav ul li a{
	display:block;
	padding:.4em 0;
}
.site-nav .minimenu ul.nav-menu li{
	display:block; 
	margin-left:.75rem;
}
.site-nav .topnav3{
	margin-left:.2rem;
}
.site-nav .topnav3 ul li{
	margin-left:.95rem;
}
.site-nav ul li.search-link,
.site-nav ul li.my-account-link,
.site-nav ul li.my-basket-link{
	text-indent:-40000px;
}
.site-nav ul li.my-account-link{
	margin-top:0 !important; /* overriding woocommerce style! */
}
.site-nav ul li.search-link a{
	display:block;
	width:1.28125rem;
	background:url(img/search.png) transparent no-repeat center / contain;
}
.site-nav ul li.my-account-link a{
	display:block;
	width:1rem;
	background:url(img/my-account.png) transparent no-repeat center / contain;
}
.site-nav ul li.my-basket-link a{
	display:block;
	width:1.625rem;
	background:url(img/my-basket.png) transparent no-repeat center / contain;
}
/* when logged in */
.logged-in .site-nav ul li.my-account-link a{
	position:relative;
}
.logged-in .site-nav ul li.my-account-link a:after{
	content:"";
	display:block;
	width:.6875rem;
	height:.6875rem;
	position:absolute;
	right:-.3rem;
	top:calc(50% + .3rem);
	background:url(img/logged-in.svg) transparent no-repeat center / contain;
}



.home #masthead .site-nav ul li.search-link a,
.home #masthead .site-nav ul li.my-account-link a,
.home #masthead .site-nav ul li.my-basket-link a{
	transition:all .5s ease-in-out 0s;
	filter:invert(1);
}
.home #masthead:hover .site-nav ul li.search-link a,
.home #masthead:hover .site-nav ul li.my-account-link a,
.home #masthead:hover .site-nav ul li.my-basket-link a{
	filter:invert(0);
}
.socialnav ul{
	padding-top:1.125rem;
	margin-bottom:.5rem;
}
.socialnav ul li{
	margin-left:.75rem;
	margin-right:0;
	margin-bottom:0.15em;
}
.socialnav ul li a{
	display:block;
	width:1.5rem;
	height:1.5rem;
	background-repeat:no-repeat;
	background-color:transparent;
	background-position:center;
	background-size:contain;
}
.socialnav ul li.instagram a{
	background-image:url(img/icon-ig.png);
}
.socialnav ul li.twitter a{
	background-image:url(img/icon-tw.png);
}
.socialnav ul li.facebook a{
	background-image:url(img/icon-fb.png);
}
.socialnav ul li.youtube a{
	background-image:url(img/icon-yt.png);
}
.socialnav ul li.signup a{
	background-image:url(img/icon-su.png);
}


.section,
.sectionpadding{
	padding:3.125rem 0;
}
.home .section.festival{
	padding-top:3.75rem;
	/* request from client to not have the space when there is not festival section 20231129 */
	/* so we make the space part of this section, rather than a margin-bottom on the header */
	padding-bottom:0; /* to diminish space between slider and newletter banner below it */
	/* request from client 14/6 */
}
.sectionpadding.supportus{
	text-align:center;
}

.page-id-48 .sectionpadding.supportus{
	background: #5E7BF8;
}
.sectionpadding.supportus form{
	margin:0 auto;
}
.page-header{
	padding:1.5625rem 0 2.5rem 0;
	/* testing if this works better: */
	padding:2rem 0 2rem 0;
}
.single-du_event .page-header{
	padding:2.5rem 0;
}
.page-header.hero{
	padding:0 !important;
	position:relative;
}

/* note: the height of the image/video/slider, depends on the existence of the .mhinfowrap element. */

.hero .bx-wrapper,
.hero .bx-viewport,
.hero .photoslider,
.hero .photoslider li{
	height:100% !important;
}
.hero .bx-wrapper{
	position:absolute;
	left:0;
	top:0;
	width:100%;
}
.hero .mhimgwrap{
	position:absolute;
	width:100%;
	height:100%;
}
.hero .imgbg{
	position:absolute;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
}
.hero .imgbg.mobilehero{
	display:none;
}
@media(max-width:620px){
	.hero .imgbg.widehero{
		display:none;
	}
	.hero .imgbg.mobilehero{
		display:block;
	}
}
.hero .vidbg{
	position:absolute;
	top:0;
	left:50%;
	height:100%;
	width:0;
	padding:0 50%;
	margin-left:-50%;
}
.hero .vidbg iframe{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.hero .mhimgwrap .overlay{
	/* this is the photo credit */
	position:absolute;
	bottom:0;
	right:0;
	width:100%;
}
.hero .mhoverlayinside{
	text-align:right;
}
.hero p.heroinfo span{
	display:block;
}

/* in sliders with a dark fade overlay covering the credits, it should go *below* the image */
/* we are only doing this on the homepage slider. Other sliders don't need the fade overlay */
/* Events use fade overlay, but should not have sliders */
#homehero .hero .photoslider .mhimgwrap .overlay{
	bottom:auto;
	top:calc(100% + .5em);
}
#homehero .hero .bx-viewport{
	overflow:visible !important; /* otherwise the overlay below the images are being cut off and invisible */
	/* this causes a massive horizontal scrollbar, which can only be countered with an overflow:hidden on a */
	/* higher level element: #homehero: */
}
#homehero{
	overflow:hidden;
	/* note: this only shows the photo credits if those aren't higher than 3.75rem, which is the margin-bottom of .page-header */
}
.page-id-2 #homehero .page-header{
	/* margin-bottom:3.75rem !important; */
	/* client requested to not have this space if there is no festival section */
	/* so we add it as padding on .home .section.festival instead */
}
.page-id-2 #primary{
	padding-top:0 !important;
}
#homehero .hero .photoslider .mhimgwrap .mhoverlayinside span{
	display:inline-block;
	margin-left:1em;
}
#homehero .hero .photoslider .mhimgwrap .mhoverlayinside .heroinfo:before{
	content:" ";
	display:inline-block;
	width:.875rem;
	height:.5rem;
	background:url(img/up-arrow.svg) transparent no-repeat center / contain;
}


/* end exceptions for under-the-slide photo credits */

.hero .mhinfowrap{
	/* must not apply to non-hero page-headers! */
	width:100%;
	min-height:56.25vw;
	/* height can extend, and then the background imagery will gain in height to accommodate the text */
	position:relative; /* to go in front of absolute positioned image background */
}
.hero .mhinfowrap .mhinfocontent{
	height:100%;
	min-height:56.25vw;
}
@media(max-width:620px){
	.heroimage .mhinfowrap,
	.heroslider .mhinfowrap,
	.herovideo .mhinfowrap{
		min-height:177vw;
	}
	.heroimage .mhinfowrap .mhinfocontent,
	.heroslider .mhinfowrap .mhinfocontent,
	.herovideo .mhinfowrap .mhinfocontent{
		min-height:177vw;
	}
	.herovideo .mhimgwrap .vidbg{
		display:none;
	}
}
.hero .mhinfowrap .mhinfocontent.flexcenter{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	align-content:center;
}
.hero .mhinfowrap .mhinfocontent.flexbottom{
	display:flex;
	justify-content:center;
	text-align:center;
	align-items:flex-end;
}
.hero .mhinfowrap .mhinfocontent.flexbottomleft{
	display:flex;
	justify-content:space-between;
	text-align:left;
	align-items:flex-end;
}
.hero .mhinfowrap .herooverlay{
	background:linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,0));
	width:100%; 
	height:auto;
	min-height:3em;
}
.hero .mhinfowrap .mhinfocontent .inner{
	padding-bottom:5rem; /* to make room for image caption/credit */
	padding-top:5rem; /* for vertical balance */
}
.mhinfocontent .datetime .addtocal{
	display:inline-block;
	width:2.3em;
	padding-left:1em;
}
.mhinfocontent .datetime .addtocal img{
	height:1.3em;
	vertical-align:top;
}
.mhinfowrap .mhinfocontent .scrollit{
	padding-top:1.5rem;
	text-align:center;
}
.single-du_event .hero .mhinfowrap .mhinfocontent .inner{
	padding-bottom:3rem; /* image caption/credit is part of header content here */
}

p.trailerbutton a,
p.playpopbutton a{
	display:inline-block;
	border-width:1px;
	border-style:solid;
	border-radius:2em;
	padding:.75em 1.5em !important; /* overriding important padding on buttons */
}

.filterswrap{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	text-align:center;
	align-items:flex-start;
	padding-top:1em; /* transfered from margin-bottom of h1.page-title */
	padding-top:0;
}
.filterswrap.nopadding{
	padding-top:0;
}
.supportsectionflexed .filterswrap{
	text-align:left;
	margin-left:-.4375rem;
}
.filterswrap h3{
	font-weight:400;
	line-height:1.7;
	padding:.2em .5em .2em 0;
	margin:.125rem .4375rem .875rem .4375rem; /* adjusted to align things */
}
.filterswrap .filters li{
	display:inline-block;
	padding-top:1em; /* instead of on filterswrap and instead of margin-bottom */
	margin:0 .67em 0 .67em;
}
.page-content-top .breadcrumb{
	margin-top:-2.5rem;
	margin-bottom:1.25rem;
}
.pageintro{
	margin-bottom:2.5rem;
}

.postindex{
	display:flex;
	flex-wrap:wrap;
	margin-left:-0.9375rem;
	margin-right:-0.9375rem;
}
.postindex.withfloats{
	display:block;
	overflow:hidden;
}
.postindex .indexitem{
	width:33.3%;
	box-sizing:border-box;
	padding:0 0.9375rem 0 0.9375rem;
	text-align:left;
	margin-bottom:5rem;
}
.postindex.withfloats .indexitem{
	float:left;
}
.postindex.withfloats .indexitem.digital-pass-item{
	float:right;
}
.postindex.withfloats .indexitem:nth-child(4),
.postindex.withfloats .indexitem:nth-child(6),
.postindex.withfloats .indexitem:nth-child(3n+6){
	clear:left;
}
.digital-pass-highlight {
	position: absolute; 
	bottom: 0;
	left: 0;
	width: 100%;
	color: #fff;
	margin-bottom: 0;
	text-align: center;
	font-size: 1rem;
}

.postindex .indexitem .readmorebutton,
.eventsslider .indexitem .readmorebutton{
	display:none;
}
.postindex.withbuttons .indexitem .readmorebutton,
.eventsslider.withbuttons .indexitem .readmorebutton{
	display:block;
}
.postindex.withbuttons .indexitem,
.eventsslider.withbuttons .indexitem{
	position:relative; /* for positioning of read more button */
	padding-bottom:4rem; /* 4rem to have room for the readmore button */
}
.postindex .indexitem p.eventdates,
.eventsslider .indexitem p.eventdates{
	display:inline-block;
}
span.eventcat{
	display:inline-block;
	padding:0 1em;
	margin-right:.5em;
}
p.eventloc{
	display:inline-block;
	margin-bottom:0;
}
.readmorebutton{
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	text-align:center;
	padding:0 0.9375rem;
}
.readmorebutton a{
	padding-left:1em !important;
	padding-right:1em !important;
	/* padding overriding other overrides, so that it won't wrap too soon on narrow widths */
	width:14.75rem;
	max-width:100%;
}
.postindex.max2 .indexitem{
	width:50%;
}
.postindex.max1 .indexitem{
	width:33.75rem;
	max-width:100%;
	margin-left:auto;
	margin-right:auto;
}

p.prevtext{
	font-style:italic;
}


.eventssliderbox{
	margin-left:-0.9375rem;
	margin-right:-0.9375rem;
}
.eventssliderbox .bx-wrapper{
	margin-left:auto;
	margin-right:auto;
}
.eventsslider.withbuttons{
	height:100%; /* the height of the viewport, which is in the html */
}
.eventsslider .indexitem{
	box-sizing:border-box;
	padding:0 0.9375rem 5rem 0.9375rem;
	padding:0 0.9375rem 3rem 0.9375rem; /* changed 5 to 3 rem, hoping it won't cut off longer items? */
	text-align:left;
}
.eventsslider.withbuttons .indexitem{
	height:100%; /* for the button position */
}
.section.latest .postindex .indexitem{
	width:50%;
}
.introlatest{
	max-width:50rem;
	text-align:center;
	margin:-1.25rem auto 3em auto;
}
.section .readall{
	text-align:center;
}
.section .buttons{
	padding-top:1rem;
	text-align:center;
}
.section .readall.buttonwrap .button{
	margin:0 1rem 1rem 1rem;
}

.indexitem .entry-header{
	padding-top:.5em;
}
.indexitem .entry-header h2,
.indexitem .entry-header h3{
	padding-top:0;
	margin-bottom:0;
}
.indexitem .entry-header .posted-on{
/*	padding-top:.5em; */
	margin-bottom:0;
}
.indexitem .entry-header .eventdates{
	margin-bottom:0;
}
.indexitem .entry-header .prevtext{
	padding-top:.5em;
	margin-bottom:.5em;
}
.indexitem .entry-header .cat-links{
	padding-top:1.2em;
}
.section.latest .indexitem .entry-header{
	text-align:left;
}
.home .indexitem .entry-header .cat-links{
	display:none;
}
/* don't show dates on past events when they're still in the main festival & more page */
.page-template-page-festival-and-more .indexitem.enddatehaspassed p.eventdates{
	display:none;
}



.flexed{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.flexed .entry-header{
	width:100%;
	order:0;
}
.flexed .entry-comments{
	width:100%;
	order:3;
	padding-bottom:4em;
}
.flexed .related{
	width:100%;
	order:4;
}
.single-du_event .entry-comments .comments-title,
.single-du_event .entry-comments .comment-list,
.single-du_event .entry-comments #respond{
	/* max-width:57.5rem; */
	margin-left:auto;
	margin-right:auto;
}
#primary,
#secondary{
	padding-top:3.75rem !important;
}
#primary.withsidebar{
	width:49.375rem;
	max-width:68.5%;
	box-sizing:border-box;
	padding:3.75rem 1.875rem 0 1.875rem;
	order:1;
}
#primary.limited{
	width:100%;
	max-width:61.25rem; /* 980px - includes 3.75rem for 2 x 30 padding on .inner */
	/* this is now only used on Venue pages */
	margin:0 auto;
}
#primary.widelimited{
	width:100%;
	max-width:73.125rem; /* includes 3.75rem for 2 x 30 padding on .inner */
	margin:0 auto;
}
#primary.wide{
	width:100%;
	max-width:100%;
/*	background:rgba(0,0,0,.2); /* tempcolour */
}
.page-content.limited,
.entry-content.limited{
	width:100%;
	max-width:61.25rem;
	/* this is now only used on defunct Video pages */
	margin:0 auto;
}
.pageintro.limited{
	width:100%;
	max-width:50rem;
}
body.page-id-95 .breadcrumb{
	max-width:57.5rem; /* exception for history page */
	margin-left:auto;
	margin-right:auto;
}
body.page-id-95 .page-content.limited{
	max-width:61.25rem; /* exception for history page */
}

.steps3{
	display:flex;
	justify-content:space-between;
	margin-left:-1.5rem;
	margin-right:-1.5rem;
}
.steps3 .step{
	width:33.33%;
}
.steps3 .step h3{
	position:relative;
}
.steps3 .step h3:after{
	content:" ";
	display:block;
	position:absolute;
	left:calc(100% - 2.5rem);
	top:0;
	width:5rem;
	height:100%;
	background:url(img/deco-arrow-straight-white.svg) transparent no-repeat center / contain;
}
.steps3 .step:last-child h3:after{
	display:none;
}
.steps3 .step .stepinside{
	height:calc(100% - 4.5rem);
	padding:0 1.5rem;
	border-width:0 1px 0 0;
	border-style:solid;
}
.steps3 .step:last-child .stepinside{
	border-width:0;
}
.subnavbar{
	position:sticky;
	top:0;
	z-index:1; /* might night a higher number if there are sliders inside content? */
	padding:1rem 0;
}
.subnavbar .inner{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	padding-top:.1rem;
	padding-bottom:.1rem;
	gap:.5rem;
}
.subnavbar .hideonwide{
	display:none;
}
.subnavbar ul{
	width:calc(100% - 12.5rem);
}
.subnavbar ul li{
	display:inline-block;
	margin-right:1rem;
	margin-bottom:0;
}

#eventcontent .entry-content{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
#eventcontent .eventsidebar{
	width:23.75rem;
	max-width:35%;
	margin-left:2rem;
	margin-bottom:2rem;
}
#eventcontent .eventsidebar h2{
	padding:1.2em 2rem 1em 2rem;
}
#eventcontent .eventsidebar .sbbinside{
	padding:1rem 2rem;
}
#eventcontent .eventsidebar .festivalinfo{
	min-height:4.25rem;
	padding:.5rem .9375rem .5rem 4.25rem;
	background:url(img/du-mark.png) #fff no-repeat .625rem center / 2.375rem auto;
	/* this image is a default holding one, the actual image is in the HTML for each festival */
	margin:1.5rem 0;
}
#eventcontent .eventcontent1{
	width:calc(100% - 23.75rem - 2rem);
	min-width:calc(65% - 2rem);
}
#eventcontent .eventcontent2,
#eventcontent .eventcontent3{
	width:100%;
}

#secondary{
	width:23.75rem;
	max-width:31.5%;
	box-sizing:border-box;
	padding:0 1.875rem 0 5%;
	order:2;
/*	background:yellow; /* tempcolour */
}
.page-header .breadcrumb{
	width:100%;
	padding:0;
}
.headerflex{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-content:flex-start;
	align-items:baseline;
}
.single-du_event .headerflex{
	justify-content:space-between;
	align-items:flex-end;
}
.headerflex .entry-title{
	width:49.375rem;
	max-width:68.5%;
	padding:1.375rem 0 0 0;
}
.headerflex .entry-meta{
	width:23.75rem;
	max-width:31.5%;
	text-align:right;
	padding:.5rem 0 0 5%;
}
.headerflex .event-heading{
	width:calc(100% - 14rem);
	padding:0;
}
.headerflex .event-details{
	width:12.75rem;
	text-align:right;
	padding:0;
}
.headerflex .event-heading.nexttologindetails{
	width:calc(100% - 32rem);
}
.headerflex .loggedinout-details{
	width:30rem;
}

.breadcrumb span{
	padding:0 .5rem;
}
.entry-content,
.page-content,
section.no-results,
section.nothing-found{
	padding-bottom:4em;
}
.othereventssection.issecondsection{
	border-top:2px solid #bbb;
}
.belowcontent{
	border-top:.375rem solid #000;
}
.section.related{ /* ###split### */
	border-top:.375rem solid #5E7BF8;
}
.horizontalsignup{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	padding:0 5%;
}
#main .horizontalsignup h2{
	width:100%;
	color: #fff;
}
#main .horizontalsignup p{
	max-width:57.2%;
	padding-right:2rem;
	margin-bottom:0;
	color: #fff;;
}

#main .horizontalsignup .form-input input  {
	border-color: #fff;
	 
}
#main .horizontalsignup .form-input input::placeholder, .supportus .supportsectionnewsletter input::placeholder {
	color: #fff;
}

#main .horizontalsignup .form-submit input, .supportus .supportsectionnewsletter input {
	border-color: #fff;
	color: #fff;
}

#makeadonation form label, #makeadonation h2 {
	color: #fff;
}
#makeadonation button {
	border: #fff;
}

#makeadonation form input[type="text"] {
	border-color: #fff;
}

.horizontalsignup form{
	width:42.8%;
	/* min-width:20rem; */
	/* causes it to go below text too soon */
}
.section.support1 .supportsection{
	text-align:center;
}
.section.support1 .supportsection input[type="text"] {
	border-color: #fff;
	color: #fff;
}
.supportsectionflexed{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	text-align:center;
	position:relative;
}
.supportsectionflexed:after{
	content:" ";
	width:1px;
	height:100%;
	position:absolute;
	left:50%;
	top:0;
}
.supportsectionsupport,
.supportsectionnewsletter{
	width:50%;
	padding:0 2.3125rem;
}
.supportsectionsupport ul li a{
	 border-color: #fff;
	 color: #fff;
}
.supportsectionflexed .introtext{
	text-align:left;
}
.supportsectionflexed form{
	width:80%;
	margin:0 auto;
}

.supportsectioncontent{
	width:65.77%;
	max-width:calc(100% - 21.25rem);
}
ul.otherlinks{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
	text-align:center;
	padding:1em 0 .5em 0;
	margin-bottom:0;
}
ul.otherlinks li{
	margin-bottom:.5em;
}
ul.otherlinks li a{
	display:inline-block;
	min-height:1.2em;
	vertical-align:middle;
	padding:0 1.25rem;
}
ul.otherlinks li a:before{
	content:" ";
	display:inline-block;
	width:2.375rem;
	height:1.2em;
	vertical-align:middle;
	background:url(img/arrow-right.png) transparent no-repeat left .15em / 1.75rem auto;
	transition:all .5s ease-in-out 0s;
}
ul.otherlinks li a:hover:before{
	background-position:center .15em;
}
#registrationform.externalcontent{
	border-top:.375rem solid black; 
	margin-top:1em;
}
#registrationform.externalcontent.greybox{
	border-top-width:0;
}
#registrationform #mc_embed_signup{
	margin-left:0;
}
.ocb{
	padding-bottom:.6em;
	border-top:.375rem solid black;
	border-bottom:.375rem solid black;
}
#ocb0{
	/* first ocb on page */
	margin-top:1em;
}
.ocbspacer{
	margin-bottom:1.5em;
}
.ocb.nobordertop{
	border-top-width:0;
}
.ocb h2.ocbheading,
.comment-respond h3.comment-reply-title{
	cursor:pointer;
}
.ocb .ocbheading span{
	display:inline-block;
	width:1.3125rem;
	margin-left:1.25rem;
	text-indent:-40000px;
	background:url(img/ocb-open.png) no-repeat transparent center / contain;
}
.ocb.boxclosed .ocbheading span{
	background-image:url(img/ocb-closed.png);
}
.ocb .ocbcontent{
	padding-bottom:.5em;
}
.ocb.boxclosed .ocbcontent{
	height:0;
	padding-bottom:0;
	overflow:hidden;
}

.historysection{
	border-top:1px solid #bbb;
	padding:3.125rem 0;
}
.historysection .historyflexed{
	overflow:hidden;
/*
	display:flex;
	flex-wrap:wrap;
*/
}
.historysection h2{
	float:left;
	width:5.9375rem;
}
.himgdl{
	float:left;
	width:15.9375rem;
}
.historysection .infotext{
	float:left;
	width:calc(100% - (5.9375rem + 15.9375rem + 23.75rem));
	padding:0 0 0 1.875rem;
	box-sizing:border-box;
}
.featuredperformances{
	float:right;
	width:23.75rem;
	padding:0 0 0 1.875rem;
	box-sizing:border-box;
}

div.tablereplacement{
	display:none;
}
table.benefits{
	border-collapse:collapse;
}
table.benefits th:first-child{
	text-align:left;
}
table.benefits a,
table.benefits span{
	display:block;
}
table.benefits th,
table.benefits td{
	position:relative;
	width:10.625rem;
	padding:1.25rem .3125rem;
	box-sizing:border-box;
	text-align:center;
}
table.benefits tr:first-child th{
	border-top-width:0;
	vertical-align:bottom;
}
table.benefits th:first-child{
	width:auto;
	padding-left:0;
	min-width:40%;
}
table.benefits th:first-child p{
	min-width:11.25rem;
}
table.benefits a{
	position:absolute;
	left:0;
	top:-.1875rem;
	width:100%;
	height:calc(100% + .1875rem);
	text-decoration:none;
	text-align:center;
}
table.benefits th div{
	position:relative;
	height:3.5em;
}
table.benefits th div span.joinnow{
	visibility:hidden;
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:1.4em;
}
table.benefits th.highlighted div span{
	visibility:hidden;
}
table.benefits th.highlighted div span.joinnow{
	visibility:visible;
}
table.benefits td.camouflage{
	height:5em;
}
table.benefits td.camouflage span.joinnow{
	display:inline-block;
	padding-top:1.5em;
}



.imgwrapper,
.videowrapper,
.externalcontent,
.photosliderbox,
.photogallerybox,
.logos{
	padding-top:1em;
	margin-bottom:2em;
}
.imgwrapper:first-child,
.videowrapper:first-child,
.externalcontent:first-child,
.photosliderbox:first-child,
.photogallerybox:first-child,
.logos:first-child{
	padding-top:0;
}
.imgwrapper img{
	display:block;
}
#homehero .imgwrapper,
#homehero .videowrapper{
	padding-top:0;
	margin-bottom:0;
}
.home #homehero .caption{
	padding-left:1.875rem;
	padding-right:1.875rem;
	margin-bottom:0;
}
.home .page-top{
	padding-top:3.125rem;
}
.videobox{
	position:relative;
	width:100%;
	height:0;
	padding-top:56.25%;
}
.videobox iframe,
.videobox .coverit{ /* .coverit is used where we do not want people to interact with the video, such as on the homepage hero */
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.videobox .coverit{
	box-sizing:border-box;
	border-bottom:3.125rem solid white; /* to cover up the play button and bar */
	height:101%; /* to remove grey line on ipad */
}
.home .videobox{
	/* fallback in case video iframe is absent */
	background:url(img/video-fallback-2022.jpg) transparent no-repeat center / auto 100%;
	margin-bottom:-3.125rem; /* so we don't notice the extra white space from .coverit */
}
.greybox{
	padding:1.875rem 1.875rem 1.25rem 1.875rem;
	margin-top:2.5rem;
	margin-bottom:2.5rem;
}
.textbox{
	overflow:hidden; /* keep float inside */
}
.sideimage{
	float:right;
	max-width:21.875rem;
	margin-left:1.5em;
	margin-bottom:.5em;
}
.photogallery{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
}
.photogallery li{
	margin-right:.9375rem;
	margin-bottom:.9375rem;
}
.photogallery li img{
	max-height:7.8125rem;
}
.photoslider .sliderimagewrapper{
	height:0;
	padding-top:70%;
	background-color:lightgrey;
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
}
.logos{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:center;
	margin-right:-1.875rem;
}
.logos img{
	max-height:3rem;
	max-width:9.6875rem;
}
.logos a,
.logos span{
	display:inline-block;
	margin:0 1.875rem 1.875rem 0;
}
.venuedetails{
	overflow:hidden;
}
.venuedetails .venuecitymapper{
	float:right;
	margin-left:3.75rem;
}
.columns2{
	display:flex;
	justify-content:flex-start;
}
.columns2 .column{
	box-sizing:border-box;
}
.columns2 .column:first-child{
	min-width:50%;
	padding-right:1.875rem;
}
.columns2 .column:last-child{
	padding-left:1.875rem;
}

form,
label,
button,
input,
textarea,
select{
	box-sizing:border-box;
}
button[type=submit],
input[type=submit],
input[type=button]{
	cursor:pointer;
}
.search-form{
	text-align:center;
}

ul.comment-list{
	padding-bottom:1em;
	border-bottom:1px solid #C2C2C2;
	margin-bottom:0;
}

.comment-list li{
	border-top:1px solid #C2C2C2;
	padding-top:.75rem;
	margin-bottom:0;
}
.comment-list span.says,
.comment-list span.edit-link{
	display:none;
}
.comment-list .comment-author{
	display:flex;
	justify-content:flex-start;
	align-items:center;
	/* this is all moot if avatars aren't shown */
}
.comment-list .comment-meta a{
	text-decoration:none;
	cursor:default;
}
.comment-list img.avatar{
	margin-right:.625rem;
}
.comment-list .comment-body .reply{
	padding-bottom:1.375rem;
}
.comment-list ul.children li{
	padding-left:1em;
}
.comment-respond{
	padding:.75rem 0;
}

.comment-form{
	max-width:31.25rem;
}
.comment-form p{
	width:100%;
	overflow:hidden;
	box-sizing:border-box;
}
.comment-form p label,
.comment-form p input,
.comment-form p textarea{
	display:block;
	width:100%;
}
.comment-form p.comment-form-cookies-consent,
.mc-field-group.input-group ul li,
.mc-field-group.radio-group ul li{
	display:flex;
	align-items:baseline;
}
.comment-form p input[type=checkbox],
.comment-form p input[type=radio],
.comment-form p.comment-form-cookies-consent label,
.mc-field-group.input-group ul li label,
.mc-field-group.radio-group ul li label{
	display:inline-block;
	width:auto;
}
.comment-form p.comment-form-cookies-consent label,
.mc-field-group.input-group ul li label,
.mc-field-group.radio-group ul li label,
.mc_fieldset label span{
	padding-left:1em;
}
.woocommerce .woocommerce-form-login .woocommerce-form-login__submit{
	float:none;
}
.woocommerce-checkout label.checkbox input[type=checkbox],
.woocommerce-form__label-for-checkbox input[type=checkbox]{
	margin-right:1em;
}
h3#order_review_heading{
	padding-top:1.5em;
	margin-bottom:1em;
}
.comment-form p.form-submit{
	width:auto;
}

ul.categories li{
	display:inline-block;
	margin:0 1.125rem .875rem 0;
}
ul.categories li a{
	display:block;
	padding:.2em 1em;
	border-width:2px;
	border-style:solid;
}
.eventbuttons{
	padding-top:1em;
}
.eventbuttons .button{
	margin-right:.8125rem;
}


/* digital pass item block */

.digital-pass-item .iteminside{
	padding:11% 11% 10rem 11%;
}

/* digital pass CTA */

.digital-pass-cta{
	padding:3rem 3rem 10rem 3rem;
	/* 10 rem bottom padding is for arrow image that has its own space in it */
	text-align:center;
	border-width:2px;
	border-style:solid;
	margin-bottom:2rem;
	margin-top:2rem; /* to not stick to OCB above */
	position:relative;
}
#digitalpasspopup .digital-pass-cta{
	max-width:43.625rem;
	margin:0 auto;
}


#colophon{
	padding:1.875rem 0 6.25rem 0;
}
.fcols{
	display:flex;
	justify-content:space-between;
}
.fcol{
	width:auto;
	max-width:22%;
}
.fcol h2,
#colophon p.myaccountlink{
	width:100%;
}
.fsubcol{
	margin-bottom:2em;
}
#colophon form{
	width:100%;
}
.searchform{
	width:37.5rem;
	max-width:100%;
	margin:0 auto 1em auto;
}
.formbox{
	width:100%;
	display:flex;
}
.formbox div.form-input{
	position:relative;
	display:inline-block;
	padding:0;
	border-width:0;
	border-style:solid;
	overflow:hidden;
	flex-grow:2;
}
.formbox div.form-input input{
	height:100%;
	width:100%;
	padding:.2em 1em;
	border-width:2px 0 2px 2px;
	border-style:solid;
}

#colophon .footersocialnav ul{
	line-height:2rem;
}
#colophon .footersocialnav ul li{
	margin-bottom:0.75rem;
}
#colophon .footersocialnav ul li a{
	display:block;
	min-height:2rem;
	font-weight:400;
	background-repeat:no-repeat;
	background-color:transparent;
	background-position:center left;
	background-size:2rem auto;
	padding-left:3rem;
}
.footersocialnav ul li.instagram a{
	background-image:url(img/icon-footer-ig.svg);
}
.footersocialnav ul li.twitter a{
	background-image:url(img/icon-footer-tw.svg);
}
.footersocialnav ul li.facebook a{
	background-image:url(img/icon-footer-fb.svg);
}
.footersocialnav ul li.youtube a{
	background-image:url(img/icon-footer-yt.svg);
}
.footersocialnav ul li.signup a{
	background-image:url(img/icon-footer-su.svg);
}

.footer2{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	padding-top:2.0625rem;
}
.footer2 p.registered{
	width:100%;
	margin-bottom:3em !important;
}
.footer2 .footerlogos{
	max-width:50%;
}
.footer2 .hdk a,
.footer2 .hdk a img{
	display:block;
	width:3rem;
}



/* things that move */

.move{
	margin-top:9.375rem;
	opacity:.5;
	transition:all .5s ease-in-out 0s;
}
.move2{
	transition:all .5s ease-in-out .18s;
}
.move3{
	transition:all .5s ease-in-out .36s;
}
.move:hover{
	opacity:1;
}
.move.inview{
	opacity:1;
	margin-top:2.5rem;
}
.movenomargin{
	margin-top:6.875rem;
}
.movenomargin.inview{
	margin-top:0;
}


a.imglink{
	display:block;
	width:100%;
	height:0;
	padding-top:66.66%;
	overflow:hidden;
	position:relative;
}
a.imglink img{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	transition:all .5s ease-in-out 0s;
}
a.imglink:hover img{
	transform:scale(1.1);
}
.holdthis{
	margin-top:2rem; /* to separate from OCB blocks */
}
.holdthis h2.missingteaserimage{
	text-align:center;
	padding:2rem;
	border-width:2px;
	border-style:solid;
}
.holdthis a{
	display:block;
	position:relative;
}
.holdthis a img{
	display:block;
	height:auto !important; /* overriding in-html width/height */
}
.holdthis a:after,
a.imglink:after{
	content:" ";
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:clamp(43px,25%,10rem) auto;
}
.holdthis a:hover:after,
a:hover.imglink:after{
	background-color:rgba(0,0,0,.5);
}
.holdthis.iconvideo a:after,
.iconvideo a.imglink:after{
	background-image:url(img/video.svg);
}
.holdthis.iconaudio a:after,
.iconaudio a.imglink:after{
	/* background-image:url(img/audio.svg); */
	background-image:url(img/video.svg);
	/* 20230831: client requested play button instead of soundwaves */
}
.icontext a.imglink:after{
	background-image:url(img/text.svg);
}





/* buttons and filters size/style */

.content-area button.single_add_to_cart_button.button.alt.nyp-disabled,
.content-area button.button.alt,
.content-area .woocommerce input.button.alt,
button[type=submit],
.button,
.feature-button,
form input[type=submit],
.form-submit,
.filters a{
	position:relative;
	display:inline-block;
	padding:.2em 2.77em !important; /* to override sizing from woocommerce styles */
	border-width:2px;
	border-style:solid;
	cursor:pointer;
}
@media(max-width:1070px){
/* this one stays up here, so the other override styles will still work on smaller screens */
	.content-area button.single_add_to_cart_button.button.alt.nyp-disabled,
	.content-area button.button.alt,
	.content-area .woocommerce input.button.alt,
	button[type=submit],
	.button,
	.feature-button,
	form input[type=submit],
	.filters a{
		padding:.2em 4.5vw !important; /* to override sizing from woocommerce styles */
	}
}
.subnavbar .button{
	max-width:12.5rem;
	padding:.2em .8em !important; /* no room to fit it 2.77em here */
}
.form-submit{
	border-width:0 !important;
	padding:0 !important;
	/* border and padding should go on the input button, so the whole thing is clickable */
}
.form-submit input{
	padding:.2em 1em !important;
	border-width:2px !important;
	border-style:solid;
	height:100%;
	width:100%;
}
.filters a{
	display:block;
}
.eventsidebar .button,
.eventsidebar .feature-button,
.digital-pass-item .button{
	width:100%;
	padding:.2em 1em !important;
	border-width:2px;
	text-align:center;
}




/* twitter embed override */

.twitter-tweet,
.twitter-tweet iframe{
	max-width:100% !important;
	width:auto !important;
}


/* mailchimp + some other forms */

#mc_embed_signup{
	max-width:37.5rem;
	margin:0 auto 1.875rem auto;
}
.indicates-required{
	text-align:right;
}
.woocommerce form .form-row,
.form-group,
.form-group label,
.form-group input,
.mc-field-group,
.mc-field-group label,
.mc-field-group input{
	display:block;
	width:100%;
	box-sizing:border-box;
	margin-bottom:.3125rem;
}
.entry-content .form-group{
	max-width:37.5rem;
}
.entry-content .form-group br{
	display:none;
}
.entry-content div.nyp{
	padding-top:1em;
}
.form-group input,
.mc-field-group input{
	padding:.2em 1em;
}
.mc-field-group.input-group ul,
.mc-field-group.radio-group ul{
	margin-bottom:.7em;
}
.mc-field-group.input-group ul li,
.mc-field-group.radio-group ul li,
.mc-field-group.input-group ul li label,
.mc-field-group.radio-group ul li label{
	margin-bottom:0;
}
.mc-field-group.input-group ul li,
.mc-field-group.radio-group ul li{
	list-style:none;
	padding-left:0;
	background:transparent;
}

button,
input,
textarea,
select{
	border-style:solid;
	border-width:2px;
}
.woocommerce-page .form-row input[type=checkbox],
.woocommerce-form__label-for-checkbox input[type=checkbox],
.mc-field-group.input-group ul li label,
.mc-field-group.radio-group ul li label,
.mc-field-group input[type=checkbox],
.mc-field-group input[type=radio]{
	display:inline-block;
	width:auto !important;
}
.form-group,
.mc-field-group{
	margin-bottom:1em;
}
.woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme{
	display:block;
	margin-bottom:1em;
}
.woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme input[type=checkbox]{
	width:auto !important;
}

/* same style on other forms */
/* specific forms may need more than this though */
form label,
form input,
form textarea{
	box-sizing:border-box;
}
form input,
form textarea{
	padding:.2em 1em;
}
input[type=checkbox],
input[type=radio]{
	display:inline-block;
	width:auto;
}




/* sharing */

.sharingiscaring{
	display:flex;
	justify-content:flex-start;
	align-items:flex-start;
	margin-bottom:3.125rem;
}
.sharingiscaring p{
	margin-right:1em;
}

/* pagination */
/* kriesi */

.pagination{
	text-align:center;
	padding:3.125rem 0;
}
.page-numbers.prev,
.page-numbers.next{
	width:2.375rem;
	height:2em;
	background-position:center;
	background-repeat:no-repeat;
	background-size:1.75rem auto;
	text-indent:-40000px;
	transition:all .5s ease-in-out 0s;
}
.page-numbers.prev{background-image:url(img/arrow-left.png);}
.page-numbers.next{background-image:url(img/arrow-right.png);}

.page-numbers.prev:hover{
	background-position:left center;
}
.page-numbers.next:hover{
	background-position:right center;
}

.pagination a,
.pagination span{
	display:inline-block;
	font-size:1.1875rem;
	font-weight:600;
	line-height:2em;
	text-decoration:none;
	padding:0 .3125rem;
}
.pagination a.inactive{
	opacity:0.25;
	cursor:default;
}
.page-numbers{
	color:inherit;
	margin:0 .4375rem;
}
.page-numbers.current{ /* ###move?### */
	color:#C6C6C6;
}



/* webkit things */

form fieldset{
 	/* overriding Chrome styles */
	padding-block-start: 0;
	padding-inline-start: 0;
	padding-inline-end: 0;
	padding-block-end: 0;
	padding:.5em;
	border:1px solid black;
	margin-bottom:1em;
}
input[type=text],
input[type=search],
input[type=button],
input[type=email],
input[type=submit],
textarea{
	-webkit-appearance:none;
	-webkit-border-radius:0;
}
*{
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-ms-text-size-adjust:none;
}

/* Where placeholder needs to obey the styles */

/* fix the stupid placeholder colour */
/* separate rules, because: "a group of selectors containing an invalid selector is invalid". */
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	font-family:'Inter',Arial,sans-serif;
	font-size:100%;
	opacity:1;
	color:#000;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	font-family:'Inter',Arial,sans-serif;
	font-size:100%;
	opacity:1;
	color:#000;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	font-family:'Inter',Arial,sans-serif;
	font-size:100%;
	opacity:1;
	color:#000;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	font-family:'Inter',Arial,sans-serif;
	font-size:100%;
	opacity:1;
	color:#000;
}
::-ms-input-placeholder { /* Microsoft Edge */
	font-family:'Inter',Arial,sans-serif;
	font-size:100%;
	opacity:1;
	color:#000;
}


/* and again, for forms on dark/rainbow backgrounds */

.dark ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color:white;
}
.dark :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:white;
}
.dark ::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:white;
}
.dark :-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:white;
}
.dark ::-ms-input-placeholder { /* Microsoft Edge */
	color:white;
}






@media(max-width:1240px){
}
@media(max-width:1120px){
	.historysection .infotext,
	.featuredperformances{
		width:calc(100% - 21.875rem);
	}
	.featuredperformances{
		padding-top:1.875rem;
	}

}
@media(max-width:1000px){
	#primary.withsidebar,
	.headerflex .entry-title{
		max-width:calc(100% - 19.375rem);
	}
	#secondary,
	.headerflex .entry-meta{
		max-width:19.375rem;
	}
}
@media(max-width:870px){
	.fcols{
		flex-wrap:wrap;
	}
	.fcols .fcol1,
	.fcols .fcol3{
		max-width:calc(100% - 14rem);
	}
	.fcols .fcol2,
	.fcols .fcol4{
		width:10rem;
		max-width:100%;
	}
	
}
@media(max-width:868px){
	#primary.withsidebar,
	#secondary{
		width:100%;
		max-width:100%;
	}
	.headerflex .entry-title,
	.headerflex .entry-meta,
	.headerflex .event-heading,
	.headerflex .event-heading.nexttologindetails,
	.headerflex .event-details,
	.headerflex .loggedinout-details{
		width:100%;
		max-width:100%;
	}
	.headerflex .entry-meta{
		padding-bottom:0;
	}
	.headerflex .loggedinout-details{
		text-align:left;
		padding-top:1em;
	}
	.headerflex .event-details{
		text-align:left;
	}
	#secondary{
		order:4;
		padding-top:1.875rem;
		border-top:1px solid #C2C2C2;
	}
	.subnavbar.sbbinperson{
		background:#EE69F6;
	}
	.subnavbar.sbbdigital{
		background:#5E7BF8;
	}
	.subnavbar ul#subnav{
		display:none;
	}
	.subnavbar .hideonwide{
		display:block;
	}
	#eventcontent .entry-content{
		display:block;
	}
	#eventcontent .eventsidebar{
		width:100%;
		max-width:100%;
		margin-left:unset;
	}
	#eventcontent .eventsidebar h2{
		display:none;
	}
	#eventcontent .eventcontent1{
		width:100%;
	}

	.supportsectionflexed .filterswrap{
		text-align:center;
		margin-left:auto;
	}
	.supportus.support2{
		padding:0;
	}
	.supportsectionflexed{
		display:block;
		text-align:center;
	}
	.supportus.support2 .supportsectionflexed{
		padding-left:0;
		padding-right:0;
		background:white;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter{
		background:#EE69F6;
		color:#000;
		padding:3.125rem 1.875rem;
		margin-bottom:0;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter h2 span{
		-webkit-text-fill-color:#000;
		color:#000;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter input{
		border-color:#000;
		color:#000;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
		color:black;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
		color:black;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter ::-moz-placeholder { /* Mozilla Firefox 19+ */
		color:black;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter :-ms-input-placeholder { /* Internet Explorer 10-11 */
		color:black;
	}
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter ::-ms-input-placeholder { /* Microsoft Edge */
		color:black;
	}
	
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter input[type=submit]:focus,
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter input[type=submit]:hover,
	.supportus.support2 .supportsectionflexed .supportsectionnewsletter input[type=submit]:active{
		background:#000;
		color:#fff !important;
	}
	.supportus.support2 .supportsectionflexed .supportsectionsupport{
		background:#5E7BF8;
		text-align:center;
		padding:3.125rem 1.875rem;
	}
	.supportus.support2 .supportsectionflexed .introtext{
		text-align:center;	
	}
	.supportsectionsupport,
	.supportsectionnewsletter,
	.supportsectioncontent{
		width:100%;
		max-width:100%;
	}
	.supportsectionflexed:after{
		display:none;
	}
	.supportsectionnewsletter{
		margin-bottom:4rem;
	}
	.postindex .indexitem{
		width:50%;
	}
	.postindex.withfloats .indexitem:nth-child(6),
	.postindex.withfloats .indexitem:nth-child(3n+6){
		clear:none;
	}
	
	.postindex.withfloats .indexitem:nth-child(4),
	.postindex.withfloats .indexitem:nth-child(2n+4){
		clear:left;
	}
}
@media(max-width:850px){
	.hero .mhinfowrap .mhinfocontent .inner{
		padding-bottom:9.4vw;
		padding-top:9.4vw;
	}
}

@media(max-width:780px){
	.sideimage{
		max-width:50%;
	}
}
@media(max-width:710px){
	.horizontalsignup{
		flex-wrap:wrap;
		padding:0;
	}
	.horizontalsignup p{
		width:100%;
		max-width:100%;
		margin-right:auto;
		margin-bottom:1em;
	}
	.horizontalsignup form{
		width:100%;
		min-width:13rem;
	}
	.historysection h2{
		width:5.9375rem;
		margin-bottom:1.25rem;
	}
	.himgdl{
		clear:left;
		width:11.25rem;
	}
	.historysection .infotext,
	.featuredperformances{
		width:calc(100% - 12.5rem);
	}
}
@media(max-width:700px){
	ul.otherlinks{
		font-size:1.1875rem;
		margin-left:-1.25rem;
		margin-right:-1.25rem;
	}
	ul.otherlinks li a{
		padding:0 1.25rem;
	}
	ul.otherlinks li a:before{
		width:1.75rem;
		background-size:1.1875rem auto;
	}
}
@media(max-width:640px){
	.supportsectionflexed form{
		width:100%;
	}
	.steps3{
		display:block;
		margin:0 auto;
	}
	.steps3 .step{
		width:100%;
	}
	.steps3 .step h3{
		position:relative;
	}
	.steps3 .step h3:after{
		display:none;
	}
	.steps3 .step .stepinside{
		height:auto;
		padding:0;
		border-width:0;
	}
	.fcols .fcol{
		width:100%;
		max-width:100%;
	}
	.footersocialnav ul{
		padding-top:.2rem;
	}
	.footersocialnav ul li{
		display:inline-block;
		width:50%;
	}
}
@media(max-width:540px){
	.supportsectionsupport,
	.supportsectionnewsletter{
		padding:0;
	}

	/* switch the two sets of benefits info */
	table.benefits{
		display:none;
	}
	div.tablereplacement{
		display:block;
	}
	.page-template-page-festival .page-header .filterswrap li.cat-item:first-child{
		width:100%;
		margin:0;
	}
	.page-template-page-festival .page-header .filterswrap li.cat-item:first-child a{
		display:inline-block;
	}

}
@media(max-width:530px){
	.historysection h2{
		width:5.9375rem;
		margin-bottom:1.25rem;
	}
	.himgdl{
		clear:none;
		width:15.9375rem;
		max-width:100%;
	}
	.historysection .infotext,
	.featuredperformances{
		clear:both;
		float:none;
		width:100%;
		padding-top:1.875rem;
		padding-left:0;
	}
}
@media(max-width:340px){
	.sharingiscaring{
		display:block;
	}
	.sharingiscaring p{
		width:100%;
		margin-right:auto;
	}
	.footersocialnav ul li{
		width:100%;
	}
}

/* temp testing */
/* all font-sizes */

@media(max-width:1120px){
	.hero h1.page-title{
		font-size:7rem; /* was 8.75rem */ /* Dirrrty */
	}
}
@media(max-width:900px){
	.hero h1.page-title{
		font-size:5rem; /* was 8.75rem */ /* Dirrrty */
	}
}
@media(max-width:850px){
	.herooverlay p{
		font-size:4.5vw;
	}
}
@media(max-width:800px){
	h1{
		font-size:1.75rem; /* was 2.125rem; */
	}
	h2{
		font-size:1.375rem; /* was 1.6875rem; */
	}
	/* h3 - h6 to be decided on sizes/weights still */
	h3,
	h4,
	h5,h6{
		font-size:1.0625rem; /* was 1.1875rem; */
	}
	p,ul,ol,table,tr,td,
	.feature-button{
		font-size:1.0625rem; /* was 1.1875rem; */
	}
	.ocbcontent h3{
		font-size:1.25rem; /* was 1.5rem; */
	}
	h1.page-title{
		font-size:2.6875rem; /* was 3.25rem; */ /* Dirrrty */
	}
	h2.page-subtitle,
	.pageintro h2{
		font-size:1.75rem; /* was 2.125rem */
	}

	table.benefits th:first-child{
		font-size:1rem; /* was same as rest of table/th/td */
	}
	table.benefits td span{
		font-size:2.3125rem; /* was 2.8125rem;  */ /* Dirrrty */
	}
	.benefits .joinnow{
		font-size:1.25rem; /* was 1.5625rem; */ /* Dirrrty */
	}
	.section h2,
	h2.sectionheading{
		font-size:3.125rem; /* was 3.75rem;  */ /* Dirrrty */
	}
	.section.related h2{
		/* font-size:2.125rem; /* was 2.5rem; */ /* Dirrrty */
	}
	h2.umbrellatitle{
		font-size:2.1875rem; /* was 2.625rem;  */ /* Dirrrty */
	}
	#secondary h2{
		font-size:1.375rem; /* was 1.6875rem;  */ /* Dirrrty */
	}

	h2.benefits,
	h2.eventselection{
		font-size:2.0625rem; /* was 2.5rem; */
	}
	.introlarge p{
		font-size:1.875rem; /* was 2.125rem; */
	}
	h1.site-title,
	p.site-title,
	.intro p,
	.dl,
	p.quote,
	table.benefits tr:first-child th:first-child{
		font-size:1.375rem; /* was 1.6875rem; */
	}
	h2.comments-title,
	.indexitem h2,
	.indexitem h3,
	#colophon h2,
	#colophon p.myaccountlink,
	p.byline{
		font-size:1rem; /* was 1.1875rem; */
	}

	.site-nav ul{
		font-size:1rem; /* was 1.125rem; */
	}
	.eventsidebar p,
	.eventsidebar ul,
	ul.event-dtl .extrainfo,
	ul.event-adaa,
	ul.comment-list,
	ul.comment-list p,
	ul.comment-list ul{
		font-size:.9375rem;
	}
	p.caption,
	p.posted-on,
	p.eventdates,
	p.credits,
	.smalltext p,
	.smalltext ul,
	#colophon p,
	#colophon ul,
	#colophon input,
	#colophon p.myaccountlink a,
	table.benefits tr:first-child th{
		font-size:.875rem;
	}

	ul.comment-list .comment-metadata{
		font-size:.8125rem;
	}
	p.cat-links,
	p.tag-links,
	p.breadcrumb{
		font-size:.75rem;
	}
}
@media(max-width:720px){
	.hero h1.page-title{
		font-size:4rem; /* was 8.75rem */ /* Dirrrty */
	}
}
@media(max-width:700px){
	.benefits .joinnow{
		font-size:1.125rem; /* was 1.5625rem; */ /* Dirrrty */
	}
	table.benefits th:first-child{
		font-size:.9375rem; /* was same as rest of table/th/td */
	}
}
@media(max-width:600px){
	.digital-pass-item h2{
		font-size:3rem !important;
	}
	.benefits .joinnow{
		font-size:1.0625rem; /* was 1.5625rem; */ /* Dirrrty */
	}
	table.benefits th:first-child{
		font-size:.875rem; /* was same as rest of table/th/td */
	}
}
@media(max-width:500px){
	.hero h1.page-title{
		font-size:3rem; /* was 8.75rem */ /* Dirrrty */
	}
}
@media(max-width:488px){
	/* same width as where items go to single column */
	.digital-pass-item h2{
		font-size:3.75rem !important;
	}
}
@media(max-width:480px){
	h1{
		font-size:1.5rem; /* was 2.125rem; */
	}
	h2{
		font-size:1.25rem; /* was 1.6875rem; */
	}
	/* h3 - h6 to be decided on sizes/weights still */
	h3,
	h4,
	h5,h6{
		font-size:1rem; /* was 1.1875rem; */
	}
	p,ul,ol,table,tr,td,
	.feature-button{
		font-size:1rem; /* was 1.1875rem; */
	}
	.ocbcontent h3{
		font-size:1.125rem; /* was 1.5rem; */
	}
	.hero h1.page-title,
	h1.page-title{
		font-size:2.25rem; /* was 3.25rem; */ /* Dirrrty */
	}
	h2.page-subtitle,
	.pageintro h2{
		font-size:1.5rem; /* was 2.125rem */
	}
	
	table.benefits td span{
		font-size:2rem; /* was 2.8125rem;  */ /* Dirrrty */
	}
	.section h2,
	h2.sectionheading{
		font-size:2.625rem; /* was 3.75rem;  */ /* Dirrrty */
	}
	.section.related h2{
		/* font-size:1.75rem; /* was 2.5rem; */ /* Dirrrty */
	}
	h2.umbrellatitle{
		font-size:1.875rem; /* was 2.625rem;  */ /* Dirrrty */
	}
	#secondary h2{
		font-size:1.125rem; /* was 1.6875rem;  */ /* Dirrrty */
	}

	h2.benefits,
	h2.eventselection{
		font-size:1.75rem; /* was 2.5rem; */
	}
	.introlarge p{
		font-size:1.5rem; /* was 2.125rem; */
	}
	h1.site-title,
	p.site-title,
	.intro p,
	.dl,
	p.quote,
	table.benefits tr:first-child th:first-child{
		font-size:1.125rem; /* was 1.6875rem; */
	}
	.eventsidebar p,
	.eventsidebar ul,
	ul.event-dtl .extrainfo,
	ul.event-adaa,
	ul.comment-list,
	ul.comment-list p,
	ul.comment-list ul{
		font-size:.9375rem;
	}
	p.caption,
	p.posted-on,
	p.eventdates,
	p.credits,
	.smalltext p,
	.smalltext ul,
	#colophon p,
	#colophon ul,
	#colophon input,
	#colophon p.myaccountlink a,
	table.benefits tr:first-child th{
		font-size:.875rem;
	}

	ul.comment-list .comment-metadata{
		font-size:.8125rem;
	}
	p.cat-links,
	p.tag-links,
	p.breadcrumb{
		font-size:.75rem;
	}
	.hero p.heroinfo{
		font-size:.5rem; /* too small?? */
	}
	ul.otherlinks{
		font-size:1.1875rem;
		margin-left:-1.25rem;
		margin-right:-1.25rem;
	}
	ul.otherlinks li a{
		padding:0 1.25rem;
	}
	ul.otherlinks li a:before{
		width:1.75rem;
		background-size:1.1875rem auto;
	}

}
@media(max-width:340px){
	.digital-pass-item h2{
		font-size:3rem !important;
	}
}
@media(max-width:300px){
	.section.support2 h2{
		font-size:12vw;
	}
}

/* end temp testing */
/* all font-sizes */


/* nav changes for mobile */

@media(max-width:940px){
	#masthead .site-title,
	#masthead .menu-toggle,
	#masthead .inner .site-nav .main-navigation .topnavcontent,
	#masthead .inner .site-nav ul,
	#masthead .site-nav ul li.search-link a,
	#masthead .site-nav ul li.my-account-link a,
	#masthead .site-nav ul li.my-basket-link a{
		transition:all .5s ease-in-out 0s;
	}
	#masthead{
		z-index:10001;
		box-sizing:border-box;
		/* note: there is still padding on this element, so don't colour the background toggling */
	}
	.site-nav{
		width:100%;
		text-align:center;
		position:relative;
	}
	.menu-toggle{
		position:absolute;
		top:-3.25rem;
		right:0;
		display:block;
		width:3.125rem;
		height:1.6875rem;
		background:url(img/menu.png) transparent no-repeat right center / contain;
		padding:0;
		border-width:0;
		margin-bottom:.625rem;
		cursor:pointer;
		z-index:10002; /* in front of menu container */
	}
	.site-nav ul{
		padding-bottom:0;
		margin-bottom:0;
	}
	.minitoggle{
		display:none;
	}
	.site-nav .minimenu{
		width:100%;
		padding:0;
		margin:0 auto;
	}
	.site-nav .minimenu .minimenucontent{
		display:block;
		position:static;
		background:transparent;
		color:inherit;
		width:auto;
		padding:0;
	}
	.site-nav ul.nav-menu{
		padding-bottom:0;
		margin-bottom:0;
	}
	.site-nav .minimenu ul.nav-menu li{
		margin-left:auto;
		margin-right:auto;
	}
	.site-nav .topnav2 .socialnav ul li,
	.site-nav .topnav3 ul li{
		margin-left:.5rem;
		margin-right:.5rem;
	}
	.site-title{
		position:relative;
		z-index:10002; /* in front of menu container */
	}
	.menu-toggle span{
		position:absolute;
		left:-40000px;
	}
	.site-nav ul.nav-menu li{ /* to not apply to social nav */
		display:block;
		width:100%; /* to make the links 100% wide */
		margin:0 auto;
	}
	#masthead .inner .site-nav .main-navigation .topnavcontent{
		position:fixed;
		top:0;
		left:0;
		display:block;
		width:100%;
		height:0;
		box-sizing:border-box;
		background:#5E7BF8;
		color:#fff;
		overflow:hidden;
		z-index:10001;
	}
	.toggled-on #masthead .inner .site-nav .main-navigation .topnavcontent{
		height:100%;
	}
	.site-nav ul.nav-menu{ /* to only aply to regular nav items */
		display:flex;
		flex-direction:column;
		width:100%; /* to make the links 100% wide */
		overflow:none;
		justify-content:space-around;
		box-sizing:border-box;
	}
	.site-nav .topnav1 ul.nav-menu{
		padding-top:8.75rem; /* room for logo and burger */
	}
	.site-nav .topnav3 ul.account-menu{
		padding-bottom:3.125rem;
	}
	#masthead .site-title a{
		background:transparent;
		transition:background 0s ease-in-out 0.4s;
	}
	#masthead .site-title a img{
		opacity:1;
		transition:opacity 0s ease-in-out .4s;
	}
	.toggled-on #masthead .site-title a{
		background:url(img/dance-umbrella-logo-23-white.png) transparent no-repeat left top / contain !important;
		transition:background .4s ease-in-out .1s;
	}
	.toggled-on #masthead .site-title a img{
		opacity:0;
		transition:opacity 0s ease-in-out .1s;
	}
	.toggled-on #masthead .menu-toggle,
	.toggled-on #masthead .site-nav ul li.search-link a,
	.toggled-on #masthead .site-nav ul li.my-account-link a,
	.toggled-on #masthead .site-nav ul li.my-basket-link a{
		filter:invert(1) !important;
	}
	.toggled-on .site-nav ul#menu-top-nav{ /* to not apply to social nav */
		height:100%;
		overflow:auto;
	}
	.toggled-on .site-nav .topnav1 ul,
	.toggled-on .site-nav .topnav2 ul{
		font-size:1.875rem;
	}
	.toggled-on .site-nav ul#menu-top-nav li.search-link a,
	.toggled-on .site-nav ul#menu-top-nav li.my-account-link a,
	.toggled-on .site-nav ul#menu-top-nav li.my-basket-link a{
		width:1.875rem;
	}
}
@media(max-width:488px){
	.postindex .indexitem,
	.section.latest .postindex .indexitem{
		width:100%;
	}
	.postindex.withfloats .indexitem:nth-child(4),
	.postindex.withfloats .indexitem:nth-child(2n+4){
		clear:none;
	}

	.site-title{
		width:10rem;
		margin-left:-.8125rem;
	}
	.menu-toggle{
		width:2.5rem;
		top:-2.6875rem;
	}
}


/* bx slider overrides */

.hero .bx-wrapper .bx-controls-direction a{
	top:0;
	height:100%;
	margin-top:0;
}
.photosliderbox .bx-wrapper .bx-controls-direction a{
	top:0;
	padding-top:70%;
}
.eventssliderbox .bx-wrapper .bx-controls-direction a{
	top:0;
	padding-top:20%; /* this is the height of the image part of the slider */
}
.eventssliderbox .bx-wrapper .bx-prev{
	left:.9375rem;
}
.eventssliderbox .bx-wrapper .bx-next{
	right:.9375rem;
}

@media(max-width:838px){
	/* the point at which we go from 3 to 2 per row */
	/* forced by the max slider width, so we do not get */
	/* a difference between Mac, iOS, and pc */
	.eventssliderbox{
		max-width:47.5rem;
		margin:0 auto;
	}
	.eventssliderbox .bx-wrapper .bx-controls-direction a{
		padding-top:30%;
	}
}
@media(max-width:458px){
	/* the point at which we go from 3 to 2 per row */
	/* forced by the max slider width, so we do not get */
	/* a difference between Mac, iOS, and pc */
	.eventssliderbox{
		max-width:23.75rem;
		margin:0 auto;
	}
	.eventssliderbox .bx-wrapper .bx-controls-direction a{
		padding-top:60%;
	}
}

@media(max-width:420px){
	.home .videobox{
		padding-top:117%;
		background:url(img/video-fallback-2022-420.jpg) transparent no-repeat center / cover;
		margin-bottom:0;
	}
	.home .videobox iframe,
	.home .videobox .coverit{
		display:none;
	}
	form input[type=submit]{
		padding-left:1em !important; /* to override sizing from woocommerce styles */
		padding-right:1em !important; /* to override sizing from woocommerce styles */
	}
}


/* height related on hamburger menu */

@media(max-height:690px) AND (max-width:940px){
	.toggled-on .site-nav ul.nav-menu{
		font-size:1.25rem;
	}
}
@media(max-height:540px) AND (max-width:940px){
	.toggled-on .site-nav ul.nav-menu{
		font-size:1rem;
	}
}
@media(max-height:460px) AND (max-width:940px){
	.toggled-on #masthead .inner .site-nav .main-navigation .topnavcontent{
		overflow:auto;
	}
}

/* page transitions stuff */

html{
	background:#fff;
}

html.arrived div#pagecover{
	width:0% !important;
	transition:
		width .5s cubic-bezier(0.42, 0, 1, 0.32) 0s,
		opacity 0s ease-in-out 0s,
		height 1s ease-in-out 1s;
}
html.arriving #page{
	opacity:1 !important;
}
html.preleaving div#pagecover{
	width:100% !important;
	transition:
		width 0s ease-in-out 0s,
		opacity 0s ease-in-out 0s,
		height 1s ease-in-out 1s;
	opacity:0;
}
html.leaving div#pagecover{
	transition:
		width 0s ease-in-out 0s,
		opacity .4s ease-in-out 0s,
		height .5s ease-in-out 2s;
	opacity:1;
}

html.incaseuserreturns div#pagecover{
	transition:
		width 0s ease-in-out 0s,
		opacity .4s ease-in-out 0s,
		height .5s ease-in-out 2s !important;
	height:0% !important;
}


/* other extras below (?) */


.postid-5765 #registrationform.externalcontent.greybox {
	background-color: transparent;
	padding-left: 0;
}

.postid-5765 #mc_embed_signup {
	margin-left: 0 !important;
    background: #EE69F6;
    color: #fff;
}

.postid-5765 #mc_embed_signup input{
    background: #fff;
}

.postid-5765 #mc_embed_signup span.asterisk {
	color: #fff;
}


.postid-5765 #mc_embed_signup .button {
    background-color: #fff;
    border: 2px solid #000;
    border-radius: 0;
    color: #000;
    height: auto;
    margin: 0 .3125rem 0.625rem 0;
    padding: .4375rem 1.375rem !important;
}

.postid-5765 #mc_embed_signup .mc-field-group {
    padding-bottom: 0;
}

.single-du_event .modal {
	background-color: #009696;
	background-color:#574E9C;
}

.single-du_event .modal input[type=button] {
	width: auto;
	margin-top: 1.25rem;
}

.single-du_event .modal div {
	font-size: 1.1rem;

}
.single-du_event .modal .form-group {
	display: flex; 
	align-items: flex-start;
}
.single-du_event .modal .form-group span {
	margin-bottom: .625rem;
}
.single-du_event .modal div input{
	margin-bottom: .75rem;

}

#main .signup h2 {
	color: #fff;
}




/* font-size increases for large screens */

@media(min-width:1920px){html{font-size:16px;}}
@media(min-width:2040px){html{font-size:17px;}}
@media(min-width:2160px){html{font-size:18px;}}
@media(min-width:2280px){html{font-size:19px;}}
@media(min-width:2400px){html{font-size:20px;}}
@media(min-width:2520px){html{font-size:21px;}}
@media(min-width:2640px){html{font-size:22px;}}
@media(min-width:2760px){html{font-size:23px;}}
@media(min-width:2880px){html{font-size:24px;}}
@media(min-width:3000px){html{font-size:25px;}}
@media(min-width:3120px){html{font-size:26px;}}
@media(min-width:3240px){html{font-size:27px;}}
@media(min-width:3360px){html{font-size:28px;}}
@media(min-width:3480px){html{font-size:29px;}}
@media(min-width:3600px){html{font-size:30px;}}
@media(min-width:3720px){html{font-size:31px;}}
@media(min-width:3840px){html{font-size:32px;}}
@media(min-width:3960px){html{font-size:33px;}}
@media(min-width:4080px){html{font-size:34px;}}
@media(min-width:4200px){html{font-size:35px;}}
@media(min-width:4320px){html{font-size:36px;}}