/*   
Theme Name: Ballet Edmonton
Description: Ballet Edmonton website
Author: Odvod Media
Version: 3
*/

/* default
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers. 
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img,
object,
embed {width: 100%; height:auto}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  background: transparent;
  text-decoration:none;
  transition: all .4s; -moz-transition: all .4s;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
}
a > span { transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s; -o-transition: all .4s; }
a:hover{ text-decoration:underline}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

h1,h2,h3,h4,h5,h6{ font-weight:400}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, b, th {font-weight: 600; }

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clear { clear: both; }

.hide { display: none !important; }

img { display: block; /*transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -o-transition: all .6s;*/ }

.show-right:before { position: relative; left: 100%; display: block; width: 100%; float: left; margin: 0 0 0 -100%; }

.left { float: left !important; }
.middle { float: none !important; }
.right { float: right !important; }

.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

.ab-right { position: absolute !important; right: 0; }
.ab-bottom { position: absolute !important; bottom: 0; }

.uppercase { text-transform: uppercase; letter-spacing: 1.2px; }

.background { background-position: center center; background-repeat: no-repeat; background-size: cover; }
.overlay { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; }

.transition { text-decoration:none; transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s; -o-transition: all .4s; }

span.break { display: block !important; margin: 0 !important; padding: 0 !important; }

.no-padding-bottom { padding-bottom: 0 !important; }

/*** site variables ***/

:root {
  --font-heading: "Wix Madefor Display", sans-serif;
  --font-content: "Wix Madefor Display", sans-serif;
  
  --bgColour: #000;
  --menuTextActiveColour: #FFF;
  --menuTextInactiveColour: #9b9b9b;
  --colour1: #ffffff;
  --colour2: #ffa3b5;
  --colour3: #AAA;
  --colour4: #000;
  --colour5: #FFF;
  --colour6: #000000;
  --colour7: #3c57a1;
  --colour9: #edeaeb;
  --colour10: #83869b;
  --colour12: #e9e9e9;
  --colour13: #B7B7B7;
  --colour14: #4D4D4D;
  --colour15: #EBE8E1;
  --colour16: #D3D3D3;
  
  --section-top-padding: 80px;
  --padding-width: 140px;
  --padding-height: 40px;
  --padding-height-2: 50px;
  
  --gap-width: 50px;
  --gap-width-2: 50px;
}

/*** site defaults ***/

html, BODY { height: 100%; }
BODY {
  background: var(--bgColour);
  font-family: var(--font-content);
  font-weight: 300;
  font-size: 20px;
  color: var(--colour4);
  line-height: 1.3;
  text-align: center;
  overflow-wrap: break-word;
}

h1, h2, h3, h4, h5 {
  margin: 0 0 15px;
  padding: 0;
  line-height: 1.3;
  font-family: var(--font-heading);
  color: var(--colour4);
}
h1 {
  font-size: 90px;
  font-weight: 800;
  text-transform: uppercase;
}
h2, h3, h4, h5 { font-size: 24px; font-weight: 400; }
h3:last-child { margin-bottom: 0; }
h3.page-title:last-child { margin-bottom: 15px; }

.size12 { font-size: 12px; }
.size13 { font-size: 13px; }
.size14 { font-size: 14px; }
.size16 { font-size: 16px; }
.size17 { font-size: 17px; }
.size18 { font-size: 18px; }
.size20 { font-size: 20px; }
.size24 { font-size: 24px; }
.size32 { font-size: 32px; }

.weightLight { font-weight: 300; }
.weightReg { font-weight: 400; }
.weightMedium { font-weight: 500; }
.weightSemi { font-weight: 600; }

.fontHeading { font-family: var(--font-heading); }
.fontContent { font-family: var(--font-content); }

a {
  color: var(--colour4);
}
a:hover {
  /*color: var(--colour5);*/
  text-decoration: underline;
}

p { padding: 0 0 25px; margin: 0; line-height: 1.5; }
p:last-child, p:last-of-type { padding-bottom: 0; }

ul, ol { margin: 0 0 30px 15px; padding: 0; list-style-type: disc; }
ol { list-style-type: decimal; }
li { margin: 0 0 10px 15px; padding: 0 0 0 2px; }
ul:last-child, ul:last-of-type, ol:last-child, ol:last-of-type { margin-bottom: 0; }
li > ul, li > ol { margin-top: 0; margin-left: 0; padding-top: 10px; }
ul:last-child + p, ol:last-child + p, .image-wrapper + ul, .image-wrapper + ol { padding-top: 30px; }
p:last-child + ul, p:last-of-type + ul, p:last-child + ol, p:last-of-type + ol { margin-top: 0; padding: 20px 0 0; }
p:last-of-type + h2, p:last-of-type + h3 { padding-top: 30px; }
ul + h3, h3 + h3 { padding-top: 30px; }
ul + p { padding-top: 10px; }
p + ul, p + ol { margin-top: -15px; }

hr { border-top-color: var(--colour3); opacity: .2; margin: var(--padding-height-2) 0; }
p + hr { margin-top: calc(var(--padding-height-2) - 20px); }
p:last-of-type + hr { margin-top: var(--padding-height-2); }

.wrap, .inner, .row, .col { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; overflow: hidden; }

.grid { display: grid; grid-template-columns: auto; grid-template-rows: auto; grid-auto-rows: minmax(min-content, max-content); }

.width-banner { width: 100%; max-width: 2330px; margin: 0 auto; }
.width-banner-content { width: 100%; max-width: 740px; }
.width-section { width: 100%; max-width: 1560px; margin: 0 auto; }
.width-content { width: 100%; max-width: 1280px; margin: 0 auto; }
.width-single { width: 100%; max-width: 900px; margin: 0 auto; }

.vert-bottom { display: grid; align-content: flex-end; }
.vert-middle { display: grid; align-content: center; }

.horiz-right { justify-content: right; }

.section {
  background-color: white;
  padding-top: var(--section-top-padding);
}
body > .section:not(:has(~ .section)){
  padding-bottom: var(--section-top-padding);
}
.section h1 {
  color: var(--colour16);
}
.section .row {
  column-gap: 80px;
}
.page-template-default > .section > .row, .page-template-page-season > .section > .row {
  padding-left: 20px;
  padding-right: 20px;
}
.section .row.stagger-images > .col {
    align-items: center;
}
.section .row.stagger-images > .col img {
  width: 620px;
  height: auto;
}
.section .row.stagger-images .image:first-child {
    z-index: 1;
}
.section .row.stagger-images .image:nth-child(2) {
  padding-left: 200px;
  margin-top: -140px;
}
.section .row h2 {
  font-size: 80px;
  font-family: 'Abhaya Libre';
  line-height: 60px;
  letter-spacing: 0.8px;
}

.section > .row.grid.cols-1 { grid-template-columns: 1fr; }
.section > .row.grid.cols-2 { grid-template-columns: 1fr 1fr; }
.section > .row.grid.cols-3 { grid-template-columns: 1fr 1fr 1fr; }

.flyout-btn {
  display: none;
  font-size: 22px;
  justify-content: end;
  font-size: 18px;
}
.flyout-btn a {
  text-decoration: none;
  color: var(--menuTextInactiveColour);
}
.flyout-btn a:hover { text-decoration: none; color: var(--colour7); }

.profile-shadow {
  padding-right: 40px;
}
.profile-shadow > img {
  display: inline;
  filter: drop-shadow(40px 40px 0px var(--colour16));
  padding-bottom: 40px;
}

/* no padding on these headers */
.single-dancer .bio-section h1, .section.company-director h1, .section.about-section h1 {
  line-height: 1;
  margin-bottom: -8px;
}

.section.company-about h1, .section.company-director h1, .single-dancer .bio-section h1 {
  color: var(--colour16);
  opacity: 50%;
}

/* home page */
.section.banner {
  background-color: #000;
}

.section.banner .width-section {
  max-width: 100%;
}

.season-section {
  background-color: #f1ede6;
  padding-bottom: 100px;
  padding-top: 40px;
}
.season-section .row-1 h1 {
  color: var(--colour1);
  font-weight: 800;
}
.season-section .row-1 .season-sub-title h2 {
  color: #000;
  font-size: 50px;
  font-family: 'Abhaya Libre';
  font-weight: 800;
  letter-spacing: 2.5px;
}
.season-section .season-sub-title {
  margin-top: -68px;
  margin-left: 310px;
}
/* performance images overflow their rows */
.season-section .performance, .season-section .performance > .row, .season-section .performance > .row > .col,
.season-section .performance, .season-section .performance > .row > .col > .inner,
.season-section .performance, .season-section .performance > .row > .col > .inner > div {
  overflow: visible;
}
.season-section .performance + .performance img {
  margin-top: -100px;
}
.season-section .performance img {
  margin-top: 0px;
}
.season-section .performance > .row {
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0 50px;
}

.season-section .col-2 .inner {
  display: grid;
  grid-template-areas: "a a" "b b" "c c" "d d";
  grid-auto-columns: 1fr 1fr;
  gap: 0px 30px;
  padding: 20px 0 30px;
}
.season-section .col-2 .inner h2 {
  margin: 0;
}
.season-section .col-2 .inner div:nth-child(1) {
  grid-area: a;
}
.season-section .col-2 .inner div:nth-child(1) h2 {
  font-size: 35px;
  font-weight: 800;
  font-family: "Abhaya Libre";
  letter-spacing: 1.75px;
  line-height: 35px;
}
.season-section .col-2 .inner div:nth-child(2) {
  grid-area: b;
}
.season-section .col-2 .inner div:nth-child(2) h2 {
  font-family: "Wix Madefor Display", sans-serif;
  font-size: 20px;
  letter-spacing: 1px;
  line-height: 60px;
}
.season-section .col-2 .inner div:nth-child(3) {
  grid-area: c;
}
.season-section .col-2 .inner div:nth-child(3) h2 {
  font-size: 80px;
  font-weight: 400;
  font-family: "Abhaya Libre";
  letter-spacing: 0.8px;
  padding-bottom: 20px;
}
.season-section .col-2 .inner div:nth-child(4) {
  grid-area: d;
  padding: 0 15px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  gap: 20px;
}
.season-section .season-button-container div {
  min-width: 180px;
}
.season-section .row-2 .col-2 {
  background: linear-gradient(#000, #000) no-repeat center/1.5px 100%;
  align-items: center;
}
.season-section .row-2 .col-2 .inner {
  background-color: #f1ede6;
}

.tour-section {
  background-color: #FFF;
  padding-bottom: 80px;
}
.tour-section .title {
  text-align: left;
}
.tour-section .row-1 h1 {
  color: var(--colour15);
  font-weight: 800;
  line-height: 1;
}
.tour-section .tour-list {
  display: grid;
  grid-auto-rows: 1fr;
}
.tour-section .tour-list .one-date {
  display: grid;
  grid-template-columns: 1fr 2fr 2fr 1fr;
  row-gap: 30px;
  padding: 40px 0 0 0;
}
.tour-section .tour-list .one-date > * {
  align-self: center;
}
.tour-section .tour-border, #flyout-menu-main .tour-border {
  grid-column-start: 1;
  grid-column-end: 5;
  height: 3px;
  background-image: linear-gradient(to right, rgba(155, 155, 155, 1) 20%, rgba(255, 255, 255, 0) 0%);
  background-position: bottom;
  background-size: 12px 2px;
  background-repeat: repeat-x;
}
#flyout-menu-main .tour-border {
  background-image: linear-gradient(to right, rgba(211, 211, 211, 1) 20%, rgba(255, 255, 255, 0) 0%);
}
.tour-section .tour-date {
  margin-right: 8px;
  font-size: 32px;
  font-family: 'Abhaya Libre';
  font-weight: 800;
  letter-spacing: 1.75px;
  line-height: 38px;
}
.tour-section .tour-date-range {
  line-height: 2px;
}
.tour-section .tour-year {
  color: #9B9B9B;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.9px;
  line-height: 38px;
}
.tour-section .tour-location-cell {
  font-size: 38px;
  font-family: 'Abhaya Libre';
  letter-spacing: 0.4px;
}
.tour-section .tour-title-cell {
  font-size: 22px;
  letter-spacing: 0.55px;
}
.tour-section .tour-ticket-cell {
  font-size: 16px;
  font-weight: 500;
  text-transform: uppercase;
}
.tour-section .tour-ticket-cell span[class^="icon-"] {
  padding-right: 4px;
  font-size: 32px;
}

.tour-section .tour-list .tour-date-cell, .tour-section .tour-list .tour-ticket-cell {
  justify-self: center;
}
.tour-section .tour-list .tour-date-cell {
  display: grid;
  grid-template-columns: max-content max-content;
}

.section.fundraiser-section {
  background-color: #9B9B9B;
}
.fundraiser-section .row-1 h1 {
  color: var(--colour13);
  text-align: right;
  margin-bottom: -28px;
}

.about-section {
  background-color: #000;
  padding-bottom: 88px;
}
/* allow about header to overflow */
.about-section .row-1, .about-section .row-1 .col-1, .about-section .row-1 .col-1 .inner,
.about-section .row-1 .col-1 .inner .wrap {
  overflow: visible;
}
.about-section .row-1 .col-1 .inner .wrap {
  z-index: 2;
}
.about-section .row-1 h1 {
  color: var(--colour14);
}
.about-section .row-1 h1:after {
    content: url('images/key-heading.svg');
    width: 200px;
    height: 200px;
    position: relative;
    bottom: -54px;
    margin-left: 20px;
}
.about-section .row-2.grid.cols-2 {
  grid-template-columns: minmax(560px, 40%) minmax(400px, 60%);
  padding-bottom: 132px;
}
.about-section .row-2 .col-1 {
  background-color: #FFF;
  color: #000;
  padding: 80px;
  z-index: 1;
  align-self: start;
  letter-spacing: 0.2px;
  line-height: 22px;
}
.about-section .row-2 .col-1 p {
  line-height: 28px;
}
.about-section .row-2 .col-2 {
  padding-top: 230px;
  margin-left: -160px;
}
.about-section .blogs-list {
  display: flex;
  gap: 70px;
}
.about-section .blogs-list .single-blog {
  flex-basis: 50%;
  text-align: left;
  color: var(--colour1);
  background-color: rgba(155, 155, 155, 0.5);
}
.about-section .blogs-list .single-blog img {
  max-height: 416px;
  object-fit: contain;
}
.about-section .blogs-list .single-blog .blog-content-wrapper {
  padding: 53px 76px 65px 76px;
}
.about-section .blogs-list .single-blog .blog-content-wrapper .title {
  font-size: 30px;
  text-transform: uppercase;
  margin-bottom: 5px;
  font-weight: 600;
  line-height: 32px;
}
.about-section .blogs-list .single-blog .blog-content-wrapper .date {
  font-size: 16px;
  margin-bottom: 19px;
  color: var(--colour16);
  letter-spacing: 0.8px;
}
.about-section .blogs-list .single-blog .blog-content-wrapper .date .day {
  font-size: 22px;
  font-family: 'Abhaya Libre';
  font-weight: 600;
}
.about-section .blogs-list .single-blog .blog-content-wrapper .excerpt {
  margin-bottom: 16px;
  letter-spacing: 0.2px;

  /* multiline with ellipsis */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  text-overflow: ellipsis;
}
.about-section .blogs-list .single-blog .blog-content-wrapper .link {
  font-weight: 600;
  letter-spacing: 1px;
}
.about-section .blogs-list .single-blog .blog-content-wrapper .link a {
  text-decoration: underline;
  text-underline-offset: 4px;
  color: var(--colour1);
}

.section.season-top-section {
  padding-top: 114px;
}
.section.season-top-section > .row.grid.cols-2 {
  grid-template-columns: 3fr 2fr;
  column-gap: 100px;
}
.section.season-top-section h1 {
  color: rgba(214, 208, 194, 0.5);
}
.section.season-top-section h2 {
  font-size: 50px;
  font-weight: 800;
  margin-top: -67px;
  margin-right: 95px;
  letter-spacing: 1.5px;
  text-align: right;
}
.section.season-top-section .wrap:has(> h2) {
  overflow: visible;
}
.section.season-top-section .content p {
  line-height: 28px;
}
.section.season-top-section a.btn {
  display: inline-block;
  margin-top: calc(var(--section-top-padding) / 2);
}

.page-template-page-season .section-1 {
  padding-bottom: var(--section-top-padding);
}
.page-template-page-season .section-2 {
  padding-bottom: calc(var(--section-top-padding) / 4);
}
.page-template-page-season .section-2, .page-template-page-season .section-3.upcoming-section {
  background-color: #EBE8E1;
  padding-bottom: 0;
}
.page-template-page-season .section-2 .row {
  column-gap: 0;
}
.page-template-page-season .section-2 .row .performance-details {
  display: block;
  overflow: visible;
  text-align: left;
  z-index: 1;
}
.page-template-page-season .section-2 .row .performance-details > div {
  margin-top: 65px;
  padding: 84px 95px;
  background-color: #FFF;
}
.page-template-page-season .section-2 .row .col-1.performance-details > div {
  margin-left: 96px;
  margin-right: -96px;
}
.page-template-page-season .section-2 .row .col-2.performance-details > div {
  margin-left: -96px;
  margin-right: 96px;
}

.season-page-section .performance .row.cols-2 {
  grid-template-columns: 1fr 1fr;
}

.page-template-page-season .performance-details .performance-dates-wrapper {
  display: grid;
  grid-template-columns: 1fr max-content;
}
.page-template-page-season .performance-details .performance-dates-wrapper .performance-dates {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 0px;
  row-gap: 5px;
}
.page-template-page-season .performance-details .performance-dates-wrapper .performance-dates > div:nth-child(odd) {
  border-right: 1px solid #000;
  padding-right: 22px;
}
.page-template-page-season .performance-details .performance-dates-wrapper .performance-dates > div:nth-child(even) {
  padding-left: 22px;
}
.page-template-page-season .performance-details .performance-date {
  font-family: 'Abhaya Libre';
  font-weight: 800;
  font-size: 35px;
  letter-spacing: 1.75px;
  line-height: 32px;
}
.page-template-page-season .performance-details .performance-time {
  font-size: 18px;
  letter-spacing: 0.9px;
}
.page-template-page-season .performance-details .performance-location {
  grid-column-start: 1;
  grid-column-end: 3;
}
.page-template-page-season .performance-details .performance-institution,
.page-template-page-season .performance-details .performance-building {
  font-size: 16px;
  line-height: 18px;
}
.page-template-page-season .performance-details .performance-building {
  font-weight: 600;
}
.page-template-page-season .performance-details .performance-year {
  text-align: right;
  font-size: 18px;
  line-height: 32px;
  padding-left: 22px;
}
.page-template-page-season .performance-details h2 {
  margin-top: 40px;
  font-size: 50px;
  line-height: 60px;
  letter-spacing: 0.5px;
}
.page-template-page-season .performance-details .choreo-heading {
  font-size: 30px;
  color: var(--colour16);
  text-transform: uppercase;
  line-height: 1;
  margin-bottom: 0;
}
.page-template-page-season .performance-details .choreo-value {
  font-weight: 600;
  line-height: 28px;
  font-size: 22px;
}
.page-template-page-season .performance-details .performance-content {
  line-height: 28px;
  font-size: 20px;
  margin-top: 28px;
  margin-bottom: 44px;
}
.page-template-page-season .season-button-container > .button {
  display: inline-block;
  min-width: 180px;
}
.page-template-page-season .season-button-container > .button ~ .button {
  padding-left: 20px;
}
.page-template-page-season .season-button-container > .button a {
  line-height: 50px;
}

.page-template-page-season .section-3 h2 {
  font-family: var(--font-content);
  text-transform: uppercase;
  font-size: 40px;
  line-height: 50px;
  letter-spacing: 2px;
  color: #9B9B9B;
}

.page-template-page-season .upcoming-slick button {
  position: absolute;
  top: -50px;
  font-size: 40px;
  border: none;
  background: transparent;
  color: #9B9B9B;
}
.page-template-page-season .upcoming-slick button.slick-disabled {
  color: #FFF;
  cursor: default;
}
.page-template-page-season .upcoming-slick .next-button {
  right: calc((100% - 1560px));
}
.page-template-page-season .upcoming-slick .prev-button {
  right: calc((100% - 1560px) + 100px);
}
.page-template-page-season .upcoming-section > .row,
.page-template-page-season .upcoming-section > .row > .col {
  overflow: visible;
}
.page-template-page-season .upcoming-wrapper-width {
  padding-left: calc((100% - 1560px)/2);
  background-color: #EBE8E1;
  padding-bottom: var(--section-top-padding);
}
.page-template-page-season .upcoming-container {
  display: grid !important;
  grid-template-columns: 490px minmax(0, 1fr);
  width: calc(0.8 * 1560px) !important;
  flex-shrink: 0;
  text-align: left;
  column-gap: 85px;
  background-color: #FFF;
  margin-right: 120px;
}
.page-template-page-season .upcoming-container img {
  max-width: 490px;
}
.page-template-page-season .upcoming-container .upcoming-details {
  display: grid;
  grid-template-columns: minmax(0, max-content) 1fr;
  grid-template-rows: auto;
  align-items: center;
  margin-bottom: 20px;
}
.page-template-page-season .upcoming-container .upcoming-details-wrapper {
  padding-top: var(--section-top-padding);
  padding-right: var(--section-top-padding);
}
.page-template-page-season .upcoming-container .upcoming-details .date {
  font-family: 'Abhaya Libre';
  font-size: 35px;
  font-weight: 800;
  line-height: 41px;
  letter-spacing: 1.75px;
}
.page-template-page-season .upcoming-container .upcoming-details .year {
  font-size: 18px;
  line-height: 23px;
  letter-spacing: 0.9px;
}
.page-template-page-season .upcoming-container .upcoming-details .time {
  font-size: 18px;
  line-height: 23px;
  letter-spacing: 0.9px;
  font-weight: 600;
  text-transform: uppercase;
  text-align: right;
}
.page-template-page-season .upcoming-container .upcoming-details .upcoming-title {
  font-family: 'Abhaya Libre';
  font-size: 50px;
  line-height: 60px;
  letter-spacing: 0.5px;
}
.page-template-page-season .upcoming-container .upcoming-details .upcoming-location {
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 0.2px;
  text-align: right;
}
.page-template-page-season .upcoming-container .upcoming-content {
  margin-bottom: 34px;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0.8px;
}

.page-template-page-season .upcoming-container a.btn {
  display: inline-block;
  line-height: 48px;
  font-size: 18px;
}

.single-post .section-1 {
  background: var(--colour1);
}
.single-post .section-1 > .row {
  column-gap: 120px;
}
.single-post .section-1 h1 {
  font-family: 'Abhaya Libre';
  font-size: 40px;
  color: var(--colour4);
  text-align: left;
  text-transform: none;
  font-weight: 400;
  line-height: 1;
}
.single-post .section-1 > .row > .col-1 {
  font-size: 16px;
  line-height: 18px;
}
.single-post .section-1 > .row > .col-2 {
  border-left: 1px solid var(--colour4);
  padding-top: 80px;
}
.single-post .section-1 > .row > .col-2 img {
  max-height: 400px;
  width: auto;
}

.contact-section {
  background-color: var(--colour16);
  padding: 40px 20px 85px 20px;
  background-image: url('images/bewatermark.svg');
  background-repeat: no-repeat;
  background-size: 480px 480px;
  background-position: right -50px bottom -50px;
  font-size: 18px;
}
.contact-section .contact-wrapper {
  grid-template-columns: 630px 1fr;
  column-gap: 90px;
  row-gap: 37px;
}
.contact-section .title h1 {
    color: var(--colour12);
    margin: 0;
}
.contact-section .links {
  align-self: end;
  padding-bottom: 14px;
  grid-row-gap: 22px;
}
.contact-section .links > p {
  display: flex;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}
.contact-section .links > p > a {
  text-align: center;
}
.contact-section .links span[class^="icon-"] {
  font-size: 20px;
}
.contact-section .info {
  grid-template-columns: max-content 1fr;
  column-gap: 50px;
}
.contact-section .info .wrap:nth-child(3),
.contact-section .info .wrap:nth-child(4) {
  align-self: end;
}
.contact-section .info p {
  line-height: 25px;
}
.contact-section .signup {
  display: grid;
  grid-template-rows: max-content 1fr max-content;
  align-items: center;
}
.contact-section #mc_embed_signup input[type='email'] {
  border-width: 0;
  border-bottom: 1px solid rgb(118, 118, 118);
  color: var(--colour4);
  background: transparent;
  width: 450px;
  padding: 8px;
  font-size: 20px;
}
.contact-section input[type='email']::placeholder {
  color: #9b9b9b;
}
.contact-section #mce-success-response, .contact-section #mce-error-response {
  margin-top: 10px;
}
.contact-section #mc_embed_signup .mce_inline_error {
  background-color: transparent;
  color: #6B0505;
}
.contact-section input#mc-embedded-subscribe {
  border: 1px solid black;
  background: transparent;
  color: var(--colour4);
  font-size: 18px;
  padding: 8px 20px;
  text-transform: uppercase;
  font-weight: 500;
  width: auto;
  line-height: 1;
  letter-spacing: normal;
}
#email-popup {
	overflow: hidden;
	background-color: transparent;
  backdrop-filter: blur(10px);
	height: 100%;
	width: 100%;
	margin: 0;
	box-sizing: content-box;
	justify-content: center;
  align-items: center;
}

#email-popup .popup-inner {
	background-color: var(--colour1);
	color: var(--colour4);
	max-width: 800px;
	font-size: 16px;
	font-weight: 200;
	position: relative;
  text-align: left;
}
#email-popup img {
	height: 100%;
}
#email-popup .close-button {
	font-size: 40px;
	position: absolute;
  top: 23px;
  right: 20px;
  cursor: pointer;
}
#email-popup h1 {
	font-weight: 800;
	margin-top: 0;
  color: var(--colour12);
  line-height: 1;
}
#email-popup .popup-content {
	margin: 80px 60px;
	line-height: 16px;
}
#email-popup .wpcf7 {
  padding-top: 30px;
}
#email-popup .wpcf7 .row {
  margin-bottom: 10px;
}
#email-popup input, #email-popup textarea {
  border-bottom: 1px solid rgb(118, 118, 118);
  color: black;
}
#email-popup textarea {
  min-height: unset;
}
#email-popup input[type=submit] {
  background-color: transparent;
  border: 1px solid var(--colour4);
}
#email-popup input::placeholder, #email-popup textarea::placeholder {
  color: #9b9b9b;
}
#email-popup .wpcf7-response-output {
  margin: 20px 0 0 !important;
  padding: 15px 30px !important;
  border: none !important;
  background: transparent;
  color: var(--colour4);
  text-align: center;
}

.section.company-director .content a, .section.bio-section .content a, .section.about-section .content a {
  text-decoration: underline;
  text-underline-offset: 4px;
  font-weight: bold;
  letter-spacing: 1px;
}

/* company > about */
.section.company-about, .section.company-director {
  background-color: var(--colour5);
}
.section.company-about > .row-1 .image:nth-child(2) {
  padding-left: 200px;
  margin-top: -140px;
}
.section.company-about > .row-1 .image:first-child {
  z-index: 1;
}
.section.company-about > .row-1 img {
  width: 620px;
  height: auto;
}
.section.company-about > .row-1 > .col-2 {
  align-items: center;
}
.section.company-director {
  padding-bottom: 80px;
}
.section.company-director > .row-1 .col-2 {
  align-items: center;
}
.section.company-director > .row-2.grid {
  grid-template-columns: 1fr 420px;
  column-gap: 90px;
}
.section.company-director > .row-2 h2 {
  margin-top: -10px;
}
/* allow director header to overflow */
.section.company-director > .row-2, .section.company-director > .row-2 > .col-1,
.section.company-director > .row-2 > .col-1, .section.company-director > .row-2 > .col-1 .inner,
.section.company-director > .row-2 > .col-1 .inner .wrap {
  overflow: visible;
}

.section.company-dancers {
  background-color: #e9e9e9;
  padding-bottom: 80px;
  padding-top: 120px;
}
.section.company-dancers > .row-1.grid {
  padding-bottom: 70px;
  grid-template-columns: 1fr 1fr;
  column-gap: 80px;
}
.section.company-dancers > .row-2 {
  max-width: 1640px;
}
.section.company-dancers h1 {
  color: var(--colour1);
  line-height: 0.8;
}
.section.company-dancers .dancer-list {
  display: flex;
  flex-direction: row;
  gap: 0px;
  flex-wrap: wrap;
}
.section.company-dancers .dancer-list a:hover {
  text-decoration: none;
}
.section.company-dancers .dancer-list > * {
  flex-basis: 340px;
  padding: 20px;
}
.section.company-dancers .dancer-list > *:hover {
  background-color: white;
}
.section.company-dancers .dancer-list > * img {
  max-width: 380px;
  max-height: 425px;
  object-fit: cover;
}
.section.company-dancers .dancer-list .dancer-name {
  font-size: 27px;
  font-family: 'Abhaya Libre';
  text-align: right;
  font-weight: 800;
  border-bottom: 1px solid var(--colour4);
  margin-top: 20px;
  letter-spacing: 1.35px;
}

.section.company-credits, .section.company-board {
  background-color: var(--colour1);
}
.section.company-credits > .row-1, .section.company-board > .row-1 {
  max-width: 1640px;
  padding-left: 20px;
  padding-right: 20px;
  column-gap: 20px;
}
.section.company-credits > .row-1 > .col-1 {
  align-items: end;
}
.section.company-credits > .row-1 > .col-1 .content {
  display: grid;
  grid-template-areas: "a c" "b c";
  grid-template-columns: 1fr 1fr;
  row-gap: 40px;
  column-gap: 15px;
  padding-bottom: 60px;
  padding-top: 80px;
}
.section.company-credits > .row-1 > .col-1 .content *:nth-child(1) {
  grid-area: a;
}
.section.company-credits > .row-1 > .col-1 .content *:nth-child(2) {
  grid-area: b;
}
.section.company-credits > .row-1 > .col-1 .content *:nth-child(3) {
  grid-area: c;
}
.section.company-credits > .row-1 > .col-2 img {
  height: 100%;
  width: auto;
}
.section.company-credits .title, .section.company-board .title {
  padding-bottom: 20px;
}
.section.company-credits .person, .section.company-board .person {
  font-size: 27px;
  font-family: 'Abhaya Libre';
  font-weight: 800;
  line-height: 40px;
  letter-spacing: 1.35px;
}
.section.company-credits .subtitle, .section.company-board .subtitle {
  font-size: 20px;
  font-family: var(--font-heading);
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 15px;
  margin-top: -4px;
}
.section.company-credits .row-1 .col-1 .inner {
  position: unset;
}
.section.company-credits .row-1 .col-1 .inner::after{
  content: ' ';
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3px;
  background-image: linear-gradient(to right, rgba(155, 155, 155, 1) 20%, rgba(255, 255, 255, 0) 0%);
  background-size: 12px 2px;
  background-repeat: repeat-x;
  background-position: left bottom;
}
.section.company-board {
  padding-top: 60px;
  padding-bottom: 80px;
}
.section.company-board .people {
  display: grid;
  column-gap: 15px;
  grid-template-columns: repeat(4, 1fr);
}
.section.company-board .person {
  flex-basis: 360px;
}

/* single dancer page */
.single-dancer .bio-section {
  background-color: var(--colour1);
  padding-bottom: 80px;
}
.single-dancer .bio-section .row-1 .col-1 .title {
  padding-top: 50px;
}
.single-dancer .bio-section .row-2 {
  grid-template-columns: 1fr 420px;
  column-gap: 90px;
}
.single-dancer .bio-section .row-2 .col-1 .title {
  padding-bottom: 30px;
}

#flyout-menu {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background: var(--colour1);
  color: var(--colour4);
  padding: 40px 40px;
  z-index: 9999999;
  overflow-y: auto;
}
#flyout-menu-top {
  margin: 0 0 43px;
}
#flyout-menu-top .row-1 {
  grid-template-columns: 1fr auto;
  gap: 0 0;
}
#flyout-menu-top .row-1 .logo {
  width: 140px;
}
#flyout-menu-top li.btn-close .icon-feather-close {
  font-size: 27px;
}
#flyout-menu-main .row-1 .col-1 ul {
  margin-left: 0;
  padding-top: 17px;
  padding-bottom: 40px;
}
#flyout-menu-main .row-1 .col-1 li {
  display: block;
}
#flyout-menu-main .row-1 .col-1 li a {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color: var(--colour4);
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 0.9px;
  text-decoration: none;
  text-align: center;
  line-height: 64px;
  box-sizing: border-box; -moz-box-sizing: border-box;
}
#flyout-menu-main .row-1 .col-1 li a .icon {
  font-size: 15px;
}

/* 
#flyout-menu-top .row-1 ul, #flyout-menu-top .row-1 li, #flyout-menu-main .row-1 ul, #flyout-menu-main .row-1 li { list-style-type: none; margin: 0; padding: 0; }
#flyout-menu-top .row-1 li a { text-decoration: none; color: var(--colour1); font-size: 24px; }
#flyout-menu-top .row-1 li a:hover { text-decoration: none; color: var(--colour5); }
#flyout-menu-main .row-1 { grid-template-columns: auto; gap: 30px 0; }
.firefox #flyout-menu-main .row-1 li a { line-height: 1; padding-top: 20px; padding-bottom: 20px; }
#flyout-menu-main .row-1 .col-1 li a:hover, #flyout-menu-main .row-1 .col-1 li.current-menu-item a:hover { background: var(--colour5); color: var(--colour1); text-decoration: none; }
#flyout-menu-main .row-1 .col-2 { font-size: 16px; }
#flyout-menu-main .row-1 .col-3 a { color: var(--colour1); text-decoration: none; font-size: 24px; }
#flyout-menu-main .row-1 .col-3 a:hover { color: var(--colour5); text-decoration: none; }
#flyout-menu-sub { display: none; } */

#flyout-menu-tickets a, #flyout-menu-donate a {
  text-decoration: none;
  text-transform: uppercase;
}
#flyout-menu-tickets a > div, #flyout-menu-donate a > div {
  font-weight: 600;
  margin-top: 8px;
}
#flyout-menu-tickets .icon, #flyout-menu-donate .icon {
  line-height: 1;
}
#flyout-menu-tickets .icon {
  font-size: 32px;
}
#flyout-menu-donate .icon {
  font-size: 22px;
}
.nav-menu .menu {
  height: 100%;
  font-size: 18px;
  letter-spacing: 0.9px;
}
.nav-menu .menu li {
  height: 100%;
}
.menu ul, .menu li {
  display: inline-block;
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.menu ul {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding: 0 20px;
  gap: 4px 20px;
  flex-wrap: wrap;
  max-width: 800px;
  margin: auto;
}
.menu > ul > li a {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.menu li a { 
  font-family: var(--font-heading);
  text-decoration: none;
  color: var(--menuTextInactiveColour);
}
.menu li a:hover, .menu li.current-menu-item > a {
  text-decoration: none;
  color: var(--menuTextActiveColour);
}
.menu ul li ul {
  position: absolute;
  display: none;
  padding: 17px 31px;
  background: #1b1b1b;
  text-align: left;
  transition: all .4s;
  z-index: 1;
  flex-direction: column;
}
.menu ul li ul:before {
  content : "";
  position: absolute;
  left: 30px;
  right: 30px;
  top: 0;
  height: 1px;
  border-bottom: 1px solid #8d8d8d;
}
.menu ul li:hover ul {
  display: flex;
}

a.btn {
  display: block;
  background: var(--colour4);
  border: 1px solid var(--colour4);
  color: var(--colour1);
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-decoration: none;
  text-align: center;
  line-height: 40px;
  padding: 0px 20px 0 20px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
.firefox a.btn { line-height: 1; padding-top: 16px; padding-bottom: 11px; }
a.btn:hover {
  background: var(--colour1);
  color: var(--colour4);
  text-decoration: none;
}
a.btn.alt {
  background: transparent;
  color: var(--colour4);
}
a.btn.alt:hover {
  background: var(--colour4);
  color: var(--colour1);
}
a.btn.min-width { display: inline-block; min-width: 225px; }

form label { position: absolute; top: 0; display: none; width: 100%; opacity: 0; font-size: 12px; color: var(--colour10); -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; z-index: 1 }
form input, form select, form textarea { position: relative; width: 100%; background: var(--colour1); font-family: var(--font-content); font-size: 17px; letter-spacing: .02rem; color: var(--colour5); padding: 15px 15px; border: none; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-transition: all 0.3s ease-out; transition: all 0.2s ease-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
form textarea { height: 100%; min-height: 180px; }

form select { padding-top: 14px; padding-bottom: 13px; }
form .select-wrap { position: relative; display: block; background: var(--colour1); }
form .select-box-wrap { position: relative; display: block; z-index: 20; }
form select { -webkit-appearance: none; -moz-appearance: none; text-overflow: ''; background: none; border: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 60px; cursor: pointer; }
form select::-ms-expand { display: none; }
form .select-dir { position: absolute; top: 18px; right: 0px; display: block; height: 43%; padding: 0 15px; color: var(--colour4); line-height: 1.1; z-index: 10; }

form .floating label { display: block; margin-top: 2px; margin-left: 0; padding: 0 15px; text-align: left; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transform: translateY(3px); transform: translateY(3px); pointer-events: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 1; }
form .wpcf7-not-valid { background: var(--colour2); }
form .wpcf7-not-valid-tip { display: none; }
form .floating input, form .floating select, form .floating textarea { padding-top: 24px; padding-bottom: 6px; }
form .floating select { padding-top: 25px; padding-bottom: 5px; padding-left: 15px; }
.firefox form .floating select { padding-left: 11px; }

form input[type="submit"] { padding: 0 30px; border: none; background: var(--colour4); color: var(--colour1); font-size: 13px; font-weight: 500; border-radius: 0; letter-spacing: 1.2px; line-height: 40px; text-transform: uppercase; }
.firefox form input[type="submit"] { line-height: 1; padding-top: 16px; padding-bottom: 11px; }
form input[type="submit"]:hover { background: var(--colour5); color: var(--colour1); }


form .ajax-loader, form .wpcf7-spinner { display: none; }
form .wpcf7-response-output { margin: 20px 0 0 !important; padding: 15px 30px !important; border: none !important; background: var(--colour4); color: var(--colour1); text-align: center; }
form.invalid .wpcf7-response-output { background: #cc0000; color: var(--colour1); }

form .responsive-hide { display: none; }
form .responsive-hide input, form .responsive-hide select { display: none; }

input.placeholder, textarea.placeholder { color: var(--colour4); font-family: var(--font-content); font-weight: 500; letter-spacing: .03rem; }
::-webkit-input-placeholder { /* WebKit browsers */
	color: var(--colour4);
	font-family: var(--font-content); font-weight: 500; letter-spacing: .03rem;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color: var(--colour4);
	font-family: var(--font-content); font-weight: 500; letter-spacing: .03rem;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	color: var(--colour4);
	font-family: var(--font-content); font-weight: 500; letter-spacing: .03rem;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
	color: var(--colour4);
	font-family: var(--font-content); font-weight: 500; letter-spacing: .03rem;
}


/*** site styles ***/
header.grid {
  background: var(--bgColour);
  grid-template-columns: minmax(0, max-content) 1fr minmax(0, max-content);
  align-items: start;
  max-width: 1720px;
  margin: 0 auto;
}
header .logo {
  align-self: start;
  padding: 25px 0 25px 40px;
}
header .logo img {
  height: 50px;
}
header .nav-menu {
  align-self: center;
  height: 100%;
}
header .nav-menu a, header .buttons a {
  text-transform: uppercase;
}

header .buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 14px;
  padding: 25px 40px 25px 0px;
}
header .buttons > a {
  border: 1px solid var(--menuTextActiveColour);
  padding: 4px 17px;
}
header .buttons .icon {
  font-size: 22px;
  padding-right: 6px;
}
header .buttons a { 
  font-family: var(--font-heading);
  text-decoration: none;
  color: var(--menuTextActiveColour); 
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  font-weight: 600;
}
header .buttons a:hover {
  color: var(--colour4);
  background: var(--menuTextActiveColour);
}
header .buttons a div {
  padding-top: 2px;
}
header .buttons a.tickets {
  color: var(--colour4);
  background-color: var(--menuTextActiveColour);
  padding-top: 0;
  padding-bottom: 0;
}
header .buttons a.tickets:hover {
  background-color: var(--colour4);
  color: var(--menuTextActiveColour);
}
header .buttons a.tickets .icon {
  font-size: 32px;
  padding-right: 3px;
}

.alert { background: var(--colour2); color: var(--colour5); padding: 10px var(--padding-width); }
.bar { background: var(--colour2); height: 7px; }
.quote hr { margin: 0; }
.quote .row { padding: 25px 20px; }

.slick-dots { position: absolute; left: 0; bottom: 0; display: block; width: 100%;  padding: 15px var(--padding-width); box-sizing: border-box; -moz-box-sizing: border-box; }
.slick-dots ul, .slick-dots li { display: inline-block; list-style-type: none; margin: 0; padding: 0; }
.slick-dots li { margin-left: 30px; }
.slick-dots li:first-of-type { margin-left: 0; }
.slick-dots li button { font-size: 1px; line-height: 1; padding: 0; border: none; width: 10px; height: 10px; overflow: hidden; border-radius: 10px; color: var(--colour1); background: var(--colour1); opacity: .5; }
.slick-dots li.slick-active button { opacity: 1; }

.page-map { height: 550px; }

form .row.row-1 { grid-template-columns: 1fr 1fr; gap: 0 var(--gap-width-2); }
form .row.row-1 .row.row-2 { gap: 15px 0; }
form input[type="submit"] { max-width: 225px; margin-top: 20px; }

.form-alt form .row.row-1 { grid-template-columns: 1fr; gap: 15px 0; }
.form-alt form .row.row-2 { grid-template-columns: 1fr 1fr; gap: 15px 15px !important; }

footer {
  background: var(--colour5);
  color: var(--colour4);
  line-height: 1.6;
}
footer .sponsor-section {
  padding: 35px 20px;
}
footer .sponsor-section > .row-1 {
  display: grid;
  grid-template-areas: "notice supporters";
  grid-template-columns: 1fr 3fr;
  gap: 30px;
}
footer .footer-notice {
  grid-area: notice;
  text-align: left;
  font-size: 16px;
  letter-spacing: 0.8px;
  line-height: 18px;
}
footer .footer-notice, footer .footer-notice a {
  color: var(--menuTextInactiveColour);
}
footer .footer-supporters {
  grid-area: supporters;
  display: flex;
  gap: 20px;
  justify-content: space-between;
}
footer .footer-supporters img {
  height: 50px;
  width: auto;
}

@viewport { width: auto; }

@media only screen and (max-width: 1620px) {
  /* header .row-1.grid { grid-template-columns: 200px 1fr 200px; gap: 0 30px; }
  header .row-1.grid > .col-1 { font-size: 14px; }*/
  
}

@media only screen and (max-width: 1480px) {
  .page-template-page-season .performance-details .performance-dates-wrapper .performance-dates {
    grid-template-columns: 1fr;
  }
  .page-template-page-season .performance-details .performance-dates-wrapper .performance-dates > div:nth-child(odd),
  .page-template-page-season .performance-details .performance-dates-wrapper .performance-dates > div:nth-child(even) {
    border-right: none;
    padding-right: 0px;
    padding-left: 0px;
  }
  .section.season-top-section {
    padding-top: var(--section-top-padding);
  }
  .section.season-top-section > .row.grid.cols-2 {
    column-gap: 60px;
  }
}

@media only screen and (max-width: 1320px) {
  header .menu {
    max-width: 400px;
    margin: auto;
  }

  .about-section .blogs-list {
    gap: 50px;
  }
  .about-section .blogs-list .single-blog .blog-content-wrapper {
    padding: 40px 60px 50px 60px;
  }

  .section.company-about > .row-1 .image:nth-child(2) {
    padding-left: 0;
  }
  .section.company-about > .row-1 .image:first-child {
    margin-left: -200px;
  }

  .section > .row.stagger-images .image:nth-child(2) {
    padding-left: 0;
  }
  .section > .row.stagger-images .image:first-child {
    margin-left: -200px;
  }

  .single-dancer .bio-section {
    padding-left: 20px;
    padding-right: 20px;
  }

  footer .sponsor-section > .row-1 {
    grid-template-areas: "supporters" "notice";
    grid-template-columns: auto;
  }
  footer .footer-notice {
    justify-self: left;
  }
}

@media only screen and (max-width: 1240px) {
  /* header .row-1.grid { grid-template-columns: 0px 1fr auto; gap: 0 0; }
  header .row-1.grid > .col-1 { height: 1px; overflow: hidden; }
  header .row-1.grid > .col-3.vert-bottom { align-content: center; }
  header .row-2.grid { grid-template-columns: 0px 1fr 0px; gap: 0 0; }
  header .row-2.grid > .col-1, header .row-2.grid > .col-3 { height: 1px; overflow: hidden; }
  header .logo { width: 155px; } */
  
  :root {
    --section-top-padding: 65px;
  }

  header .row-1.grid > .col-3 ul { grid-template-columns: auto auto; gap: 0 20px; }

  .tour-section .title {
    text-align: center;
  }
  .tour-section .tour-list .one-date {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "a b c" "a d g" "e e e";
    row-gap: 0;
    column-gap: 10px;
    padding: 20px 0 20px 0;
  }
  .tour-section .tour-list .one-date > * {
    align-self: start;
  }
  .tour-section .tour-list .tour-date-cell {
    grid-area: a;
    grid-template-columns: 1fr;
  }
  .tour-section .tour-date {
    font-size: 22px;
    line-height: 26px;
    letter-spacing: 1.1px;
  }
  .tour-section .tour-year {
    font-size: 16px;
    letter-spacing: 0.8px;
  }
  .tour-section .tour-location-cell {
    grid-area: b;
    font-size: 24px;
    letter-spacing: 0.24px;
  }
  .tour-section .tour-title-cell {
    grid-area: d;
    font-size: 18px;
    letter-spacing: 0.45px;
  }
  .tour-section .tour-ticket-cell {
    grid-area: c;
  }
  .tour-section .tour-border {
    grid-area: e;
    padding-top: 20px
  }

  .section.season-top-section > .row.grid.cols-2 {
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
  }

  footer .sponsor-section {
    padding: 40px 20px 16px 20px;
  }
  footer .footer-supporters {
    flex-wrap: wrap;
  }
}

@media only screen and (max-width: 1100px) {
  .contact-section {
    padding-bottom: 70px;
  }
  .contact-section .contact-wrapper {
    grid-template-columns: max-content;
    grid-template-areas: "title" "info" "links" "signup";
    row-gap: 32px;
    justify-content: center;
  }
  .contact-section .contact-wrapper .title {
    grid-area: title;
  }
  .contact-section .contact-wrapper .links {
    grid-area: links;
    padding-bottom: 0;
  }
  .contact-section .links > p {
    justify-content: space-around;
  }
  .contact-section .contact-wrapper .info {
    grid-area: info;
    grid-template-columns: repeat(2, max-content);
    justify-content: space-between;
  }
  .contact-section .contact-wrapper .signup {
    grid-area: signup;
    row-gap: 20px;
  }
  .contact-section #mc_embed_signup input[type='email'] {
    width: 100%;
  }

  .company-director .row-1 h1 {
    text-align: center;
  }

  .section.company-dancers {
    padding-top: var(--section-top-padding);
  }
  .section.company-dancers .row-1 h1 {
    text-align: center;
  }
  .section.company-dancers > .row-1.grid {
    grid-template-columns: 1fr;
  }
  .section.company-dancers > .row-1.grid > .col-2 {
    padding: 20px;
  }
  .section.company-dancers .dancer-list {
    justify-content: space-around;
  }

  .page-template-page-season .section-2 .row .col-1.performance-details > div {
    margin-left: 0px;
    margin-right: 0px;
  }
  .page-template-page-season .section-2 .row .col-2.performance-details > div {
    margin-left: 0px;
    margin-right: 0px;
  }
}

@media only screen and (max-width: 930px) {
  :root {
    --section-top-padding: 50px;
  }
  h1 {
    font-size: 75px;
  }

  .section.banner {
    padding-top: 0;
  }
  .section.banner > .row-1 {
    padding-left: 0;
    padding-right: 0;
  }
  .section.banner img {
    width: 120%;
    margin-left: -10%;
  }

  /* restore padding on these headers */
  .section.about-section h1 {
    line-height: 1.3;
    margin-bottom: 15px;
    text-align: center !important;
  }

  .season-section {
    padding-bottom: 20px;
  }
  .season-section .performance > .row {
    grid-template-columns: auto;
    grid-template-areas: "img" "details";
  }
  .season-section .performance img, .season-section .performance + .performance img {
    margin-top: 0px;
  }
  .season-section .performance .performance-spacer {
    display: none;
  }
  .season-section .performance .performance-image {
    grid-area: img;
    padding: 5px 0 20px;
  }
  .season-section .performance .performance-details {
    grid-area: details;
  }
  .season-section .performance .performance-details .inner {
    padding-top: 0;
  }

  body > .section.about-section {
    padding-bottom: 60px;
  }
  .about-section .row-2.grid.cols-2 {
    grid-template-columns: 1fr;
    padding-bottom: 40px;
  }
  .about-section .row-1 h1:after {
    content: none;
  }
  .about-section .row-2.grid {
    grid-template-areas: "video" "content";
  }
  .about-section .row-2.grid .col-1 {
    grid-area: content;
    padding: 60px;
  }
  .about-section .row-2.grid .col-2 {
    grid-area: video;
  }
  .about-section .row-2 .col-2 {
    padding-top: 0;
    margin-left: 0;
  }
  .about-section .blogs-list {
    flex-wrap: wrap;
    gap: 40px;
  }
  .about-section .blogs-list .single-blog {
    flex-basis: 100%;
  }
  .about-section .blogs-list .single-blog .blog-content-wrapper {
    padding: 32px 37px 40px 37px;
  }
  .about-section .blogs-list .single-blog .blog-content-wrapper .title {
    margin-bottom: 0;
  }
  .about-section .blogs-list .single-blog .blog-content-wrapper .link a {
    font-size: 14px;
  }
  .about-section .blogs-list .single-blog .blog-content-wrapper .excerpt {
    letter-spacing: 0.16px;
  }

  .contact-section {
    padding-bottom: 55px;
  }

  .section.company-director > .row-2.grid {
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
  }

  .section.company-credits > .row-1.grid {
    grid-template-columns: 1fr;
  }
  .section.company-credits .row-1 .col-1 .inner::after {
    display: none;
  }

  .section.company-board .people {
    grid-template-columns: repeat(2, 1fr);
  }

  .section.bio-section > .row-2 h2 {
    font-size: 60px;
    line-height: 60px;
  }
  .single-dancer .bio-section .row-2 {
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
  }

  .section.section.season-top-section {
    padding-bottom: 60px;
  }
  .section.season-page-section {
    padding-top: 0;
  }
  .section.season-top-section > .row.grid.cols-2 {
    grid-template-columns: 1fr;
  }
  .section.season-top-section > .row.grid.cols-2 .col-2 {
    padding-top: 20px;
  }
  .section.season-top-section > .row.grid.cols-2 h1 {
    text-align: center;
  }
  .section.season-top-section h2 {
    font-size: 40px;
    font-weight: 800;
    margin-top: -67px;
    margin-left: 270px;
    margin-right: 0;
    letter-spacing: 1.5px;
    text-align: center;
  }
  .season-page-section .performance .row.cols-2 {
    grid-template-columns: 1fr;
    grid-template-areas: "img" "perf";
  }
  .season-page-section .performance .row > .performance-image {
    grid-area: img;
  }
  .season-page-section .performance .row > .performance-details {
    grid-area: perf;
  }
  .page-template-page-season .section-2 .row .col.performance-details > div {
    padding: 55px 30px 60px 30px;
    margin: -20px 20px var(--section-top-padding) 20px;
  }
  .page-template-page-season .performance-details .performance-year {
    border-left: 1px solid;
    font-size: 16px;
    line-height: 16px;
  }
  .page-template-page-season .performance-details .performance-dates-wrapper .performance-dates {
    row-gap: 0px;
  }
  .page-template-page-season .performance-details .performance-location {
    margin-top: 10px;
  }
  .page-template-page-season .performance-details .performance-content {
    margin-top: 18px;
    margin-bottom: 36px;
  }

  footer .sponsor-section {
    padding: 30px 20px 16px 20px;
  }
  footer .footer-supporters img {
    height: 40px;
    width: auto;
  }
}

@media only screen and (max-width: 770px) {
  :root {
    --section-top-padding: 35px;
  }

  h1 {
    font-size: 50px;
  }

  .season-section .row-1 .col-1 h1 {
    padding-right: 80px;
  }
  .season-section .row-1 .season-sub-title h2 {
    font-size: 27px;
    line-height: 37px;
    margin-bottom: 0;
  }
  .season-section .performance .col-2 .inner {
    padding-bottom: 40px;
  }

  .season-section .row-1 .season-sub-title {
    margin-left: 96px;
    margin-top: -46px;
  }
  .season-section .col-2 .inner div:nth-child(1) h2 {
    font-size: 22px;
    line-height: 22px;
  }
  .season-section .col-2 .inner div:nth-child(2) h2 {
    font-size: 16px;
    line-height: 22px;
  }
  .season-section .col-2 .inner div:nth-child(3) h2 {
    font-size: 45px;
    line-height: 45px;
    padding-top: 2px;
    padding-bottom: 14px;
  }

  .about-section {
    padding-bottom: 74px;
  }
  .about-section .row-2.grid .col-1 {
    padding: 50px;
  }

  header.grid {
    padding: 20px 30px;
  }
  header .logo img {
    height: 40px;
  }
  header .nav-menu, header .buttons {
    display: none;
  }
  .flyout-btn {
    display: grid;
  }

  body { font-size: 16px; }
  h2, h3, h4, h5 { font-size: 22px; }
  
  .size20, .size24 { font-size: 18px; }
  .size17 { font-size: 15px; }
  
  a.btn {
    font-size: 15px;
    padding-right: 12px;
    padding-left: 12px;
    line-height: 34px;
  }
  a.btn.min-width { width: 100%; }
  .season-section .season-button-container div {
    min-width: 130px;
  }
  
  .slick-dots li button { opacity: .2; }
  .slick-dots li.slick-active button { opacity: .5; }
  
  .page-map { height: 350px; }
  form .row.row-1 { grid-template-columns: 1fr; gap: 15px 0; }
  
  form input[type="submit"] { max-width: none; }

  .section.company-director h1 {
    margin-bottom: 0;
  }
  .section.company-director > .row-2 h2, .section.bio-section > .row-2 h2 {
    font-size: 30px;
    line-height: 30px;
    margin-top: 20px;
  }
  .profile-shadow {
    padding-right: 30px;
  }
  .profile-shadow > img {
    display: inline;
    filter: drop-shadow(30px 30px 0px var(--colour16));
    padding-bottom: 30px;
  }

  .section.season-top-section h2 {
    font-size: 27px;
    line-height: 37px;
    margin-top: -46px;
    margin-left: 183px;
  }
  .section.season-top-section .content p {
    line-height: 22px;
  }

  #email-popup .popup-content {
    margin: 30px;
  }

  footer .footer-supporters img {
    height: 35px;
    width: auto;
  }
}

@media only screen and (max-width: 660px) {
  header.grid {
    padding: 15px 20px 15px 18px;
  }
  header .logo img {
    height: 35px;
  }

  .tour-section .tour-ticket-cell .ticket-label {
    display: none;
  }

  .about-section {
    padding-bottom: 60px;
  }
  .about-section .row-2.grid .col-1 {
    padding: 40px;
  }

  .contact-section {
    font-size: 16px;
    padding-bottom: 40px;
  }
  .contact-section .contact-wrapper .info {
    grid-template-columns: 1fr;
    justify-content: left;
    row-gap: 16px;
  }
  .contact-section .contact-wrapper .signup {
    justify-content: left;
  }

  .section.company-about > .row-1 .image:nth-child(2) {
    display: none;
  }
  .section.company-about > .row-1 .image:first-child {
    margin: 0;
  }
  .section.company-about > .row-1.grid {
    grid-template-columns: 1fr;
  }

  .section > .row.stagger-images.grid {
    grid-template-columns: 1fr;
  }
  .section > .row.stagger-images .image:nth-child(2) {
    display: none;
  }
  .section > .row.stagger-images .image:first-child {
    margin: 0;
  }

  .section.company-director > .row-2.grid, .single-dancer .bio-section .row-2 {
    grid-template-columns: 1fr;
    grid-template-areas: "a" "b";
  }
  .section.company-director > .row-2.grid .col-1, .single-dancer .bio-section > .row-2.grid .col-1 {
    grid-area: b;
  }
  .section.company-director > .row-2.grid .col-2, .single-dancer .bio-section > .row-2.grid .col-2 {
    grid-area: a;
  }

  .single-dancer .bio-section .row-2 .col-1 .title {
    padding-bottom: 0;
  }

  .page-template-page-season .performance-details .performance-date {
    font-size: 24px;
    line-height: 22px;
  }
  .page-template-page-season .performance-details .performance-time {
    font-size: 16px;
    letter-spacing: 0.8px;
  }
  .page-template-page-season .performance-details .performance-content {
    line-height: 22px;
    font-size: 16px;
    letter-spacing: 0.16px;
  }
  .page-template-page-season .performance-details h2 {
    margin-top: 10px;
    font-size: 45px;
    line-height: 45px;
    letter-spacing: 0.45px;
  }
  .page-template-page-season .performance-details .choreo-heading {
    font-size: 20px;
  }
  .page-template-page-season .performance-details .choreo-value {
    line-height: 24px;
    font-size: 18px;
  }

  footer .footer-supporters img {
    height: 35px;
    width: auto;
  }
}

@media only screen and (max-width: 480px) {
  :root {
    --section-top-padding: 20px;
    /* --padding-width: 20px;
    --padding-height: 20px;
    --padding-height-2: 20px;

    --gap-width: 20px;
    --gap-width-2: 20px; */
  }
  h1 {
    font-size: 50px;
  }

  .about-section .row-2.grid .col-1 {
    padding: 35px 32px;
  }

  header.grid {
    padding: 15px 20px 15px 18px;
  }
  header .logo img {
    height: 30px;
  }
  header a.btn { font-size: 11px; padding-left: 10px; padding-right: 10px; }
  
  #flyout-menu-main .row-1 { grid-template-columns: auto; gap: 20px 0; }
  
  .form-alt form .row.row-2 { grid-template-columns: 1fr; gap: 15px 15px !important; }
  .page-map { height: 210px; }

  .section.company-board .people, .section.company-credits > .row-1 > .col-1 .content {
    grid-template-columns: 1fr;
    grid-template-areas: "a" "b" "c";
  }

  footer .sponsor-section {
    padding: 40px 20px 16px 20px;
  }
  footer .footer-notice {
    font-size: 12px;
    letter-spacing: 0.6px;
  }
}

@media only screen and (max-width: 360px) {
  /*h1 { font-size: 22px; }
  h2, h3, h4, h5 { font-size: 20px; }*/
  
  /* header .logo { width: 105px; }
  header .row-1.grid > .col-3 ul { gap: 0 10px; } */
}

@media only screen and (max-height: 700px) {
  #email-popup .popup-content {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}