/*
 Theme Name:   Jermyn Street Theatre
 Description: The 2020 redevelopment of jermynstreettheatre.co.uk
 Author: RMJI
 Author URI: http://www.rmjiold.co.uk
 Template:     bootstrap-basic
 Version:      1.0.0
*/
/*
Purple: #7a0f80 rgb(122,15,128);
LightPurple: #bd87bf rgb(189,135,191);
DarkPurple: #2f1036 rgb(47,16,54);
- The ornate stencil font is 'Dala Floda Bold'
- Body copy is 'Flama Regular'
- Buttons and a few other instances are 'Flama Medium'
 - http://fontsgeek.com/fonts/FlamaMedium-Regular/download
*/
/* --------------------------------------------------------------------------------------- */
@font-face {
    font-family: 'flama';
    src: url('/wp-content/themes/jst/fonts/Flama-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'flama';
    src: url('/wp-content/themes/jst/fonts/FlamaMedium-Regular.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'dalafloda';
    src: url('/wp-content/themes/jst/fonts/DalaFloda-Bold-Web.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
body{
    overflow-x:hidden;
    overflow-y:scroll;
    position:relative;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
*{
    font-family: flama, arial, helvetica;
    font-size: 17px;
    color: #2f1036;
}
/* --------------------------------------------------------------------------------------- */
#content.row{
    max-width:100% !important;
    margin-left:40px !important;
    margin-right:40px !important;
}
#main-column{
    max-width:100% !important;
    padding-left:46px !important;
    padding-right:0px !important;
}
#site-footer, .footinner, header, .entry-content, .container {
    max-width: 1024px;
    width:100%;
}
h1,h2,h3,h4,h5,h6{
    font-family: dalafloda,"Times new roman", Times;
    color: rgb(122,15,128);
}
h1{
    font-size:34px;
}
h3 a, h3 a:hover, h3 a:visited{
    font-family: dalafloda,"Times new roman", Times;
    color: rgb(122,15,128);
    font-size: 24px;
}
a, a:hover, a:visited{
    color: rgb(122,15,128);
}
.flama{
    font-family: flama, arial, helvetica;
}
.dalafloda{
    font-family: dalafloda,"Times new roman", Times;
}
.entry-content{
    max-width:1024px !important;
}
article{
    padding:10px 0;
}
.footinner{
    max-width:1024px;
    padding:0 40px;
}
#jstnav .footinner{
    padding:0;
}

/* --------------------------------------------------------------------------------------- */
.img-responsive{
    max-width:100%;
    width:100%;
    height:auto;
}
blockquote, blockquote p{
    font-family: dalafloda,"Times new roman", Times;
    font-size:43px;
    border-left:0 solid white;
    margin:20px;
    line-height:1em;
}
/* --------------------------------------------------------------------------------------- */
.topnav, .topnav a, .topnav a:visited{
    color:white;
    line-height:40px;
    font-size:20px;
}
.topnav div.h2{
    color:white;
    font-family: dalafloda,"Times new roman", Times;
    font-size:30px;
}
.site-footer div.h2{
    color:#2f1036;
    font-family: dalafloda,"Times new roman", Times;
    font-size:34px;
    margin-top:30px;
    margin-bottom:36px;
}

.topnav ul, #footmn ul{
    list-style-type: none;
    padding-left:0;
}
/* -- Quick Book footer -- */
#footqb, #footnl, #footmn{
    margin-left: calc(50% - 50vw);
    width: 100vw;
}
#footqb {
    background-color: rgb(122,15,128);
    padding: 0;
}
#footnl {
    background-color: rgb(255,255,255);
}
#footmn {
    background-color: rgb(189,135,191);
}
#footmn footer{
    padding:0 40px;
}
#footqb .row, #footqb p{
    font-size:20px;
    color:white !important;
}
#footqb h2{
    margin-top:60px;
    font-size:43px;
    color:white !important;
}
.qbform{
    margin:60px 0 60px 0;
    display:flex;
}
.qbform .qbouter{
    display:flex;
    width:100%;
    flex-wrap:wrap;
    justify-content:left;
}
.qbform .purpleButton{
    padding:10px 20px;
    background-color:rgb(122,15,128);
    border: 1px solid white;
    margin-left:40px;
    color:white;
    flex:0 1 auto;
    margin-bottom:20px;
}
.qbform .qbselect{
    flex:1 0 auto;
    min-width:600px;
    max-width:100% !important;
    margin-bottom:20px;
}

.qbform input, .qbform select, .qbform option, .qbform button, .qbform .select-selected, .qbform .select-arrow-active, .qbform .select-items div{
    font-size:20px;
}
.qbform .custom-select{
    height:50px;
}
.qbform .select-selected{
    padding:8px 16px;
}
/* -- Newsletter footer -- */
#footnl .row, #footnl p{
    font-size:20px;
}
#footnl input{
    text-transform:uppercase;
    font-size:20px;
}
#footnl h2{
    margin-top:60px;
    font-size:43px;
    color: #2f1036;
}
#mc4wp-form-1{
    width:100%;
}
#mc4wp-form-1 .mc4wp-form-fields{
    display:flex;
    flex-wrap:wrap;
    max-width:100%;
    justify-content: space-between;

}

.signup .mc4wp-form-fields input[type=submit]{
    padding:10px 20px;
    border: 1px solid rgb(47,16,54);
    background-color:white;
    color: #2f1036;
    flex:0 1 auto;
    margin-top:20px;
}
.signup{
    margin:40px 0 60px 0;
}
.signup .mc4wp-form-fields input[type=email], .signup .mc4wp-form-fields input[type=text]{
    padding:10px 20px;
    color: #2f1036;
    flex:0 0 auto;
    margin-top:20px;
}
/* -- Menu footer -- */
#footmn h2{
    font-size:30px;
    margin-top:30px;
    margin-bottom:36px;
}
#site-footer a, #site-footer a:hover, #site-footer a:visited{
    font-size:20px;
    line-height:40px;
}

/* --------------------------------------------------------------------------------------- */
#jstnav{
    z-index:99999;
    display:none;
    position:fixed;
    left:0;right:0;
    background-color:rgb(122,15,128);
    padding:0 0 30px 0;
}
/* --------------------------------------------------------------------------------------- */
.home-page #main-column{
    padding-left:0 !important;
}
.home-page #main-column article{
    padding:0 !important;
}
.homeblock{
    position: relative;
    padding-left:30px;
}
.homeblock h3, .homeblock h2.widget-title{
    font-size:43px;
    position: absolute;
    bottom: 0px;
    left: 20px;
    transform: rotate(-90deg);
    transform-origin: 0% 100%;
    padding:0px;
    margin:0;
}
#homeabout h3,#homeabout h2.widget-title {
    bottom: 5px;
    left: 30px;
}
#homeabout p a{
    font-size:14px;
    letter-spacing:0.06em;
}
#homeabout p {
    margin: -20px 0 20px 38px;
}
#homesupport h3,#homesupport h2.widget-title {
    bottom: 0px;
    left: 26px;
}
#homevisit h3, #homevisit h2.widget-title {
    bottom: 12px;
    left:4px;
}
#visitcell .so-panel, #homevisit{
    height:100%;
}
#homevisit{
    padding:0;
    position: relative;
    min-height:290px;
}
#homevisit blockquote{
    position: absolute;
    left:5px;
    top:0px;
}
#homevisit p{
    position:absolute;
    left:43px;
    bottom:30px;
}
#homework h3, #homework h2.widget-title {
    left:22px;
}
#scrollrow h3, #scrollrow h2.widget-title{
    bottom:20px;
}
.homeblock img{
    width:100%;
    max-width:406px;
    height:auto;
}
.doublecell .panel-first-child, .doublecell .panel-last-child{
    height: calc(50% - 24px);
}
.doublecell .panel-first-child{
    margin: 0 0 10px 0;
}
.doublecell .panel-last-child{
    margin: 10px 0 0 0;
}
.halfheight{
    max-height:100%;
    height:100%;
}
.withquote{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor:pointer;
}
.withquote blockquote, .withquote blockquote p{
    font-size:50px;
    line-height:50px;
    margin:30px 0 0 38px;
    padding:0;
}
.withquote a{
    font-size:14px;
    letter-spacing:0.06em;
    color: #2f1036;
}
#homevisit blockquote p {
    position:initial;
    font-size:50px;
    line-height:50px;
    margin:30px 0 0 0;
}
#homeabout blockquote p {
    font-size:50px;
    line-height:50px;
    font-size:36px;
    line-height:42px;
    margin:30px 0;
}
.overlayh4{
    font-size:14px;
    letter-spacing:0.06em;
    text-transform:uppercase;
}
/* --------------------------------------------------------------------------------------- */
#makeMeScrollable, #slider_2093 .owl-item
{
    padding: 0;
    width:calc(100% + 35px);
    position: relative;
    white-space:nowrap;
}
#slider_2093{
    width:102% !important;
}

/* Replace the last selector for the type of element you have in
   your scroller. If you have div's use #makeMeScrollable div.scrollableArea div,
   if you have links use #makeMeScrollable div.scrollableArea a and so on. */
#slider_2093 .owl-item .contentBox, #makeMeScrollable .contentBox
{
    position: relative;
    float: left;
    margin: 0;
    padding: 0;
    padding-right:0px;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}
#slider_2093 .owl-item .contentBox img, #makeMeScrollable .contentBox img{
    width: 412px;
    height:auto;
}
#slider_2093 .owl-item .contentBox h2,  #makeMeScrollable .contentBox h2,  .contentBoxInner h2{
    font-size:50px;
    margin-top:0;
    line-height:50px;
    white-space:normal;
}
.contentBoxInner{
    position:absolute;
    top:0;
    left:0;
    padding:20px 20px 20px 20px;
    z-index:500;
    overflow:hidden;
    height:100%;
    width:100%;
}
.hideme{
    visibility: hidden !important;
}

/* --------------------------------------------------------------------------------------- */
.headerbutton{
    text-align:center;
    border-right:1px solid silver;
    padding:12px 0;
}
.headerbutton a{
    font-size:21px;
    color:rgb(122,15,128);
}
.first-son{
    border-left:1px solid silver;
}
/* --------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------- */
.nownextBox{
    height:236px;
    padding:0px;
    margin:40px 0;
}
.nownextInfo, .nownextDates{
    height:100%;
    position: relative;
}
.nownextInfo{
    float:left;
    width: calc(100% - 408px);
}
.nownextDates{
    width:205px;
}
.nownextDates h4{
    font-size:20px;
    line-height:24px;
    text-align:left;
    position:absolute;
    left:0;
    top:0;
    text-transform:uppercase;
    margin:0;
}
.nownextDates button, .bookButton button, .bookBottom button{
    font-size:20px;
    position:absolute;
    bottom:0;
    text-align:center;
    border:1px solid rgb(122,15,128);
    padding:11px 40px;
    background-color:white;
    color:rgb(122,15,128);
    min-width:205px;
    text-transform:uppercase;
}
.bookBottom button{
    background-color:transparent;
    color:rgb(122,15,128);
}
.nownextDates a:hover button, .bookButton:hover button, .bookBottom:hover button{
    border:1px solid rgb(122,15,128);
    padding:11px 40px;
    color:white;
    background-color:rgb(122,15,128);
}
.nownextImage img{
    width:167px;
    height:auto;
}
.nownextImage{
    float:left;
    margin-right:34px
}
.nownextInfo h2{
    font-size:50px;
    line-height:50px;
    margin:20px 0 30px 0;
    color: #2f1036;
    position:absolute;
    top:15px;
}
.nownextInfo h4{
    color: #2f1036;
    text-transform:uppercase;
    font-size:14px;
    letter-spacing: 0.06em;
    margin:0;
}
.boxgenre{
    position:absolute;
    to-p:0;
}
.boxauthor{
    position:absolute;
    bottom:17px;
}
.boxauthorlong{
    position:absolute;
    bottom:30px;
}
.boxdirector{
    position:absolute;
    bottom:0;
    margin-left:102px !important;
    text-indent: -102px;
}
.nownextDates{
    float:right;
}
.nownextDates h4{
    color:#2f1036;
}
/* --------------------------------------------------------------------------------------- */
.custom-select {
    position: relative;
    background-color:rgb(122,15,128);
    border: 1px solid white;
/*    width:50%;*/
    float:left;
    height:46px;
}

.custom-select select {
    display: none; /*hide original SELECT element: */
}

.select-selected {
    background-color:rgb(122,15,128);
}

/* Style the arrow inside the select element: */
.select-selected:after {
    position: absolute;
    content: "";
    top: 22px;
    right: 18px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    top: 7px;
}
/* style the items (options), including the selected item: */
.select-items div,.select-selected {
    color: #ffffff;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
}
/* Style items (options): */
.select-items {
    position: absolute;
    background-color: rgb(122,15,128);
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
}
/* Hide the items when the select box is closed: */
.select-hide {
    display: none;
}
.select-items div:hover, .same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
}
.showcreative img{
    float:left;
}
.showcreative div{
    margin-top:20px;
    margin-left:5px;
}
h5.ticketcat{
    font-size:17px !important;
    font-weight:400;
    font-family: flama, arial, helvetica;
}
.so-widget-sow-image .widget-title{
    font-size:1.1em;
}
.wpcf7-form label{
    width:100%;
}
select.wpcf7-form-control{
    padding:10px 18px;
    font-size:20px;
}
select.wpcf7-form-control option{
    font-size:20px;
}
.wpcf7 input, .wpcf7 textarea{
    padding:10px 20px;
    font-size:20px;
}
.wpcf7 select{
    color:#777777;
}
.wpcf7-submit{
    text-transform:uppercase;
    background-image:none;
    background-color:white;
    border:1px solid silver;
}

input[type=text].wpcf7-form-control, input[type=email].wpcf7-form-control, select.wpcf7-form-control, textarea.wpcf7-form-control {
    width:100% !important;
}
.staff{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
    align-items:stretch;
}
.staff-member{
    flex: 0 1 auto;
    width:49%;
    min-width:240px;
    margin-top:5px;
    margin-bottom:95px;
    max-width:406px;
}
.staff-member img{
    float:left;
    margin:8px 34px 20px 0;
    max-width:110px;
}
.staff-member p{
    margin-right:34px;
}

.staff-member h3{
    margin:-6px 0 0 0;
}
.staff-member h4{
    color:#2f1036;text-transform:uppercase;font-size:14px;letter-spacing:0.06em;
    margin:12px 0;
    line-height:1.3em;
}
.staff-member .su-spoiler-title{
    font-family: dalafloda,"Times new roman", Times;
    color: rgb(122,15,128);
}
.staff-member .su-spoiler-icon{
    color: rgb(122,15,128);
}
/* ---------------------------------------------------------------------------------------

    Standard page - implemented by adding a class in header.php, it is NOT on homepage/show pages

*/
.standard-header{

}
.standard-title{
    margin:20px 0;
}
.standard-page #main-column .post, .standard-page #main-column .page{
    padding: 0;
    padding-top:16px;
}
.standard-page .standardrow{
    width:100%;
}
.standard-page .standardleft blockquote, .standard-page .standardleft blockquote p{
    font-size:43px;
    line-height:43px;
    margin:0 0 60px 0;
    padding:0;
}
.standard-page .standardleft p{
    line-height:22px;
    margin-bottom:16px;
}
.standard-page .standardleft{
    width:100%;
}
.standard-page .standardleft{
    width:100%;
}
.standard-page .standardleft h2, .standard-page .standardright h2{
    font-size:34px;
    margin-top:0px;
    color:#2f1036;
}
.standard-page .standardleft h3, .standard-page .standardright h3{
    font-size:34px;
    margin-top:0px;
    color:#2f1036;
}
.standard-page .standardleft li{
    margin-bottom:10px;
}
.standard-page .standardleft .su-spoiler-title{
    font-family: dalafloda,"Times new roman", Times;
    font-size:34px;
    line-height:34px;
}
.standard-page .standardright .wp-caption{
    border:0px solid transparent;
}
.standard-page .standardright .widget_sow-image .widget-title, .standard-page .standardright .wp-caption-text, .masonry-item{
    font-family: flama, arial, helvetica;
    color:silver;
    margin-top:15px;
    font-size:15px;
    line-height:18px;
    text-transform:uppercase;
    text-align:left;
}
.standard-page .standardright .widget_sow-image .widget-title span, .standard-page .standardright .wp-caption-text span{
    font-size:10px;
    color:silver;
}
.owl-carousel .owl-stage-outer{
    height:340px;
}
.sa_owl_theme .owl-nav div, .sa_owl_theme .owl-nav button, .owl-next, .owl-prev{
    top:41% !important;
}
/* --------------------------------------------------------------------------------------

    SHOW/ARCHIVE page

*/
hr.fullwidth{
    width:102vw;
    margin-left:calc(50% - 51vw);
    border-top:1px solid silver;
    clear:both;
}
hr.notopmargin{
    margin-top:0;
}

.showposter{
    padding-left:0;
}
.showinfo{
    padding-left:46px;
    padding-right:0;
}
.showinfo h3{
    font-size:14px;
    letter-spacing:0.06em;
    font-family:flama, arial, helvetica;
    text-transform:uppercase;
    margin-top:0;
    color:rgb(47,16,54);"
}
.showinfo h1{
    font-size:50px;
    line-height:50px;
    margin-bottom:20px;
}
.showinfo .byby{
    font-size:14px;
    letter-spacing:0.06em;
    line-height:17px;
}
.showinfo .booking{
    margin:80px 0 0 0;
}
.showinfo .dates{
    font-size:20px;
    line-height:24px;
    margin:40px 0;
    text-transform: uppercase;
}
.showinfo .times{
    font-size:17px;
    line-height:24px;
    margin:20px 0;
}
#overview h2{
    font-size:43px;
    margin-top:0;
}
#overview blockquote{
    font-size:43px;
    margin:10px 6px;
}
#overview .overview{
    margin:40px 0px 40px 46px;
    font-weight:normal;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:flex-start;
}
#overview .overviewleft{
    flex: 0 0 auto;
    max-width:406px;
    width:48%;
    padding:0;
}
#overview .overviewright{
    flex: 0 0 auto;
    padding:0;
    max-width:406px;
    width:48%;
}
#people h2{
    font-size:34px;
}
.show-cast-list,.show-creative-list,.review-list{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:flex-start;
    margin:0px 0px 20px 40px;
    padding-left:5px;
}
.review-list{
    margin-top:40px;
}

.show-cast{
    width:45%;
    max-width:406px;
    min-width:300px;
    display:flex-item;
    margin:50px 0;
}
.show-creative{
    width:33%;
    max-width:240px;
    min-width:200px;
    display:flex-item;
    margin:50px 0;
}
.show-cast img{
    float:left;
    margin-right:40px;
    max-width:120px;
    height:auto;
}
.show-cast-name, .show-creative-name{
    font-family: dalafloda,"Times new roman", Times;
    color: rgb(47,16,54);
    font-size:34px;
    line-height:34px;
    margin-bottom:18px;
    margin-top:0;
    flex: 0 1 auto;
}
.show-cast-role, .show-creative-role{
    text-transform:uppercase;
    color: rgb(47,16,54);
    font-size:16px;
    flex: 0 1 auto;
    font-weight:normal;
    letter-spacing: 0.06em;
}
#media h2{
    font-size:34px;
}
.review-item{
    width:33%;
    max-width:240px;
    min-width:200px;
    margin-bottom:60px;
}
.review-noquote{
    width:33%;
    max-width:240px;
    min-width:200px;
    margin-bottom:30px;
}
.review-item blockquote{
    padding:0;
    margin:0;
    font-size:34px;
    line-height:34px;
}
.review-item .pubname{
    margin:37px 0 25px 0;
    clear:both;
    font-size:15px;
    text-transform:uppercase;
}
.review-noquote .pubname{
    margin:37px 0 10px 0;
    clear:both;
    font-size:15px;
    text-transform:uppercase;
}
.masonry{
    width:100%;
}
.masonry-item{
    width:calc(calc(100% - 68px) / 3);
    text-align:left;
    color:silver;
    font-size:0.8em;
    margin-bottom:10px;
}
.mediayt{
    max-height:200px;
}

.wp-video, video.wp-video-shortcode, .mejs-container, .mejs-overlay.load {
    width: 100% !important;
    height: 100% !important;
}
#tickets h2{
    font-size:34px;
}
.post-list{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:stretch;
    margin:20px 40px;
}
.post-item{
    width:99%;
    display:flex-item;
    margin-bottom:40px;
}
.post-item a h2.post-title{
    margin-top:0 !important;
}

.post-item img{
    float:left;
    margin-right:30px;
    max-width:100px;
    height:auto;
}
.mediaimg{
    max-width:300px;
}
.mediaimg img, .mediayt .fluid-width-video-wrapper{
    margin-bottom:10px;
}
.news-item{
    margin-bottom:60px;
}

.news-item img{
    float:left;
    max-width:120px;
    height:auto;
    margin-right:35px;
    margin-top:8px;
}
.news-title{
    margin-top:0;
    color: #2f1036;
}
.news-sidebar .widgettitle{
    margin-top:0;
    color: #2f1036;
}
.news-sidebar ul{
    margin-bottom:60px;
}
.news-sidebar a{
    color: #2f1036 !important;
}
.news-date{
    text-transform: uppercase;
    letter-spacing:0.06em;
}
.news-item p{
    margin-top:10px;
}
.news-story h2{
    color: #2f1036;
}
    .onlymobile{
        display:none;
    }
    .notmobile{
        display:block;
    }

/* --------------------------------------------------------------------------------------

    Adjustments for homepage

*/
@media (min-width: 890px) and  (max-width:  1030px) {
    .homeblock h3, .homeblock h2.widget-title{
        font-size:40px;
    }
    .withquote blockquote, .withquote blockquote p{
        font-size:40px;
        line-height:40px;
    }
    #homevisit blockquote p {
        font-size:40px;
        line-height:40px;
    }
    #homeabout blockquote p {
        font-size:40px;
        line-height:40px;
        margin:30px 0;
    }
}
@media (max-width:  889px) {
    .homeblock h3, .homeblock h2.widget-title{
        font-size:30px;
    }
    .withquote blockquote, .withquote blockquote p{
        font-size:30px;
        line-height:30px;
    }
    #homevisit blockquote p {
        font-size:30px;
        line-height:30px;
    }
    #homeabout blockquote p {
        font-size:30px;
        line-height:30px;
        margin:30px 0;
    }
    .hidenarrow{
        display:none;
    }
    #homesupport h3, #homesupport h2.widget-title {
        bottom: -2px;
    }
    #homevisit h3, #homevisit h2.widget-title {
        bottom: 78px;
    }
    #scrollrow h3, #scrollrow h2.widget-title {
        bottom: 110px;
    }
    #homevisit{
        min-height: 200px;
    }
    #homework h3, #homework h2.widget-title{
        left:4px;
    }

}
@media (max-width:  740px) {
    .homeblock img{
        max-width:100%;
    }

}
/* --------------------------------------------------------------------------------------

    Adjustments for tablet 768px to 1024px  wide

*/
@media (min-width: 769px) and  (max-width:  1024px) {
    .show-cast-name, .show-creative-name{
        font-size:26px;
        line-height:26px;
    }
    .show-cast-role, .show-creative-role{
        font-size:14px;
        line-height:14px;
    }
    #footqb, #footnl, #footmn{
        padding-left:20px !important;
        padding-right:20px !important;
    }
}
/* --------------------------------------------------------------------------------------

    Adjustments for Now & Next page

*/
@media (max-width:  900px) {
    .nownextBox{
        height:auto;
        padding:0px;
        margin:40px 0;
    }
    .nownextInfo{
        width:60%;
        float:right;
        padding:10px 0;
        position:initial;
    }
    .nownextDates{
        width:100%;
        clear:both;
        padding:10px 0;
        position:initial;
    }
    .boxdirector, .boxauthor{
        position:initial;
    }

    .nownextDates h4{
        font-size:20px;
        line-height:24px;
        text-align:left;
        position:initial;
        text-transform:uppercase;
        margin:0;
        margin-top:18px;
    }
    .nownextDates button, .bookButton button, .bookBottom button{
        font-size:20px;
        position:initial;
        text-align:center;
        border:1px solid rgb(122,15,128);
        padding:11px 40px;
        background-color:white;
        color:rgb(122,15,128);
        min-width:205px;
        text-transform:uppercase;
    }
    .nownextInfo h2{
        font-size:40px;
        line-height:40px;
        position:initial;
        margin-bottom:20px;
    }
    .nownextDates h4{
        position: revert;
        float:left;
    }
    .nownextDates button{
        float:right;
        position: revert;
        margin-top:20px;
    }
    .qbform .purpleButton{
        margin-left:0
    }
}
/* --------------------------------------------------------------------------------------

    Adjustments for mobile <768px wide

*/
@media (max-width:  768px) {
    #footqb, #footnl, #footmn{
        padding-left:20px !important;
        padding-right:20px !important;
    }

    .staff-member{
        width:100%;
        max-width:initial;
    }
    .onlymobile{
        display:block;
    }
    .notmobile{
        display:none;
    }
    .showposter img{
        padding-bottom:30px;
        margin: 0 auto;
        width:100%;
        max-width:700px !important;
    }
    .showinfo{
        padding-left:0;
    }

    .show-cast{
        width:100%;
        max-width:100%;
    }
    .show-creative-name{
        font-size:26px;
        line-height:26px;
    }
    .show-creative-role{
        font-size:14px;
        line-height:14px;
    }
    .masonry-item {
        width: calc(calc(100% - 34px) / 2);
    }
    #overview .overviewleft, #overview .overviewright{
        width:100%;
        max-width:100%;
    }
    .showticketsright{
        padding-top:50px;
    }

    .qbform .qbselect{
        min-width:400px;
    }
    .nownextBox{
        height:auto;
        padding:0px;
        margin:40px 0;
    }
    .nownextInfo, .nownextDates{
        width:100%;
        clear:both;
        padding:10px 0;
        position:initial;
    }
    .boxdirector, .boxauthor{
        position:initial;
    }

    .nownextDates h4{
        font-size:20px;
        line-height:24px;
        text-align:left;
        position:initial;
        text-transform:uppercase;
        margin:0;
    }
    .nownextDates button, .bookButton button, .bookBottom button{
        font-size:20px;
        position:initial;
        text-align:center;
        border:1px solid rgb(122,15,128);
        padding:11px 40px;
        background-color:white;
        color:rgb(122,15,128);
        min-width:205px;
        text-transform:uppercase;
    }
    .nownextInfo h2{
        font-size:40px;
        line-height:40px;
        position:initial;
        margin-bottom:20px;
    }
    .nownextDates h4{
        position: revert;
        float:left;
    }
    .nownextDates button{
        float:right;
        position: revert;
        margin-top:20px;
    }
}
/* --------------------------------------------------------------------------------------

    Adjustments for very narrow devices

*/
@media (max-width:  460px) {
    .masonry-item {
        width: 100%;
    }
    .qbform .qbselect{
        min-width:200px;
    }
    .show-cast{
        min-width:10px;
    }
    .show-cast div{
        clear:both;
    }

}
@media (max-width:  570px) {
    .nownextImage{
        width:100%;
    }
    .nownextInfo{
        position:relative;
        top:0;
        left:0;
        float:none;
        width:100%;
    }
    .boxauthor, .boxdirector{
        position: initial;
    }
    .nownextDates button{
        min-width:100px;
        padding:11px;
    }
    .headerbutton a{
        font-size:18px;
    }
    .topnav, .topnav a, .topnav a:visited{
        line-height:28px;
        font-size:18px;
    }
    #main-column {
        max-width: 99% !important;
        padding-left: 16px !important;
        padding-right: 0px !important;
    }
    #scrollrow h3, #scrollrow h2.widget-title{
        bottom:18px;
    }
    .standard-page .standardleft h3, .standard-page .standardright h3{
        font-size:32px;
    }

}
#footnl input{
    text-transform: none !important;}
}