/* STYLESHEET */

@font-face {
    font-family: "FontAwesome";
    src: url("/library/fonts/FontAwesome/BrandsRegular5.otf") format('opentype');
}

@font-face {
    font-family: "OverlockRegular";
    src: url("/library/fonts/Overlock/Regular.otf");
}

@font-face {
    font-family: "OverlockBold";
    src: url("/library/fonts/Overlock/Bold.otf");
}

@font-face {
    font-family: "OverlockScRegular";
    src: url("/library/fonts/OverlockSC/Regular.otf");
}

/* CSS reset */

* { background-repeat: no-repeat; background-position: center center; }
body { margin: 0px; padding: 0px; background-color: #cccccc; color: #545454; font-family: OverlockRegular; font-size: 110%; line-height: 1.4; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
a { color: #000000; text-decoration: none; font-weight: normal; }
ul, ol { padding: 0px; margin: 0px; }
li { list-style-type: none; vertical-align: top; }
h1, h2, h3, h4, h5, h6 { padding: 0px 10px 10px 0px; margin: 0px; font-size: 100%; font-weight: normal; color: #000000; }
fieldset { padding: 0px; margin: 0px; border: none; }
.button, input, textarea, select { font-size: 90%; background: transparent; border: solid #686868 1px; padding: 5px; color: #000000; /* font-family: Arial; */ box-sizing: border-box; }
input[type=text], input[type=password]  { height: 30px; }
input[type=button], input[type=submit], .button { cursor: pointer; background-color: #4c9bd0; color: #ffffff; padding: 10px 20px 10px 20px; }
.pagecomponents .button {display: inline-block;text-decoration: none;}
select { height: 30px; padding-right: 30px; background-image: none; background-repeat: no-repeat; background-position: right 10px center; }
p { padding: 0px 0px 20px 0px; margin: 0px; }
strong { font-weight: normal; font-family: OverlockBold; }
.hidden { display: none; }
.spacer { clear: both; height: 0px; }
img { max-width: 100%; height: auto; }
table { border-spacing: 0px; }
td, th { padding: 0px; }

/* Layout */

.layout_standard { width: 1000px; background: #ffffff; margin: 25px auto 25px auto; }
.layouttopmenu { clear: both; }
.layoutcontent {  margin: 0px auto 0px auto; min-height: 300px; padding: 25px;  }
.layoutcredits { font-size: 70%; padding: 25px; text-align: right; }
.headerlogo { float: left; padding: 25px; }

/* Navigation */

.nav_multilevel a { color: #ffffff; }
.nav_multilevel { background: #4c9bd0; border-top: solid #4c9bd0 1px; border-bottom: solid #4c9bd0 1px; height: 40px; font-size: 130%; }
.nav_multilevel .level1>li:last-of-type { }
.nav_multilevel .level1>li:first-of-type {  }
.nav_multilevel .level1>li { float: left; line-height: 40px; text-align: center; padding: 0px 24px 0px 25px; }
.nav_multilevel .level2 { position: absolute; display: none; background-color: rgba(0,0,100,0.8); width: 166px;  }
.nav_multilevel .level2 a { color: #ffffff; }
.nav_multilevel .level2>li { clear: left; line-height: 30px; padding: 5px 10px 5px 10px; font-size: 80%; }
.nav_multilevel .level1>li:hover .level2 { display: block; }

/* Social media icons */

.social { float: right; vertical-align: bottom; text-align: right; }
.social p { line-height: 0.57; padding: 25px; }
.FontA { font-family: FontAwesome; font-size: 170%; top: 5px; }
.FontA a { text-decoration: none; color: #4c9bd0; }

a.instagram { letter-spacing: -3px; }

.facebook::before { content: "\f082"; }
.twitter::before { content: "\f099"; }
.instagram::before { content: "\f16d"; }


@media( max-width: 1000px )
{
    .layout_standard { width: auto; margin: 0px; }
    .nav_multilevel { font-size: 100%; height: auto; }
    .nav_multilevel .level1>li { display: inline-block; float: none; width: auto; padding: 0px 0px 0px 25px; }
}

@media( max-width: 600px )
{
	.headerlogo { float: right; }
	.social { float: none; position: absolute; }
}


/* Title */

h1, .pagetitle, .feat_portfolio .name { clear: both; font-size: 200%; margin: 0px 0px 20px 0px; color: #4c9bd0; font-weight: bold; font-family: OverlockScRegular; }
h2, .surv_standard .titletxt, .feat_galllist .name, .feat_portfolio .subtitle { color: #4c9bd0; font-size: 130%; margin: 0px 0px 10px 0px; }
h3 { font-weight: bold; }

/* Page content */
.pagecontent { color: #000000; }
.pagecontent a, .pagecomponents a {text-decoration: underline;}


/* Homepage */

.home .pagecontent { float: left; width: 625px; box-sizing: border-box; padding: 0px 25px 0px 0px; }
.home .pagecomponents { float: right; width: 325px; border-left: solid #cccccc 1px; padding: 0px 0px 0px 25px; box-sizing: border-box; }
.home .feat_twitter .status { padding: 0px 0px 20px 0px; }
.home .feat_twitter .text { display: block; padding: 0px 0px 10px 0px; font-size: 80%; }
.home .feat_twitter .age { display: block; font-size: 60%; }
.home .int_newsletter .field input { width: 100%;}
.home .int_newsletter .field {margin-bottom: 10px; }
.home .int_newsletter .buttons input { border: none;}
.home .int_newsletter .buttons { margin-top: 20px;}

@media( max-width: 1000px )
{
    .home .pagecontent { width: auto; float: none; padding: 0px; }
    .home .pagecomponents { width: auto; float: none; border: none; padding: 0px; }
}


/* Teachers page */

.teachers .util_textbox { width: 475px; box-sizing: border-box; }
.teachers .util_textbox .titletxt { border-bottom: solid #cccccc 1px; margin-bottom: 30px; }
.teachers .util_textbox .imagetop img { border-radius: 75px; }
.teachers .util_textbox .imagetop { float: left; margin: 0px 20px 20px 0px; }
.teachers .util_textbox .content { min-height: 450px; }
.teachers .util_textbox .content p:nth-of-type(2) { clear: both; }
.michelle-profile { float: left; padding: 0px 25px 0px 0px; }
.susie-profile { float: right; padding: 0px 0px 0px 25px; border-left: solid #cccccc 1px; }

@media( max-width: 1000px )
{
	.teachers .util_textbox { width: auto; }
	.michelle-profile { float: none; padding: 0px 0px 0px 0px; }
	.susie-profile { float: none; padding: 25px 0px 0px 0px; border-left: none; }
}

/* Classes */

.classes a {text-decoration: underline;}


/* Gallery */

.feat_carousel .carousel { overflow: hidden; width: 100%; height: 700px; background-color: #000000; }
.feat_carousel .carousel ul { width: 20000em; position: relative; }
.feat_carousel .carousel li { float: left; height: 700px; text-align: center; padding: 25px; box-sizing: border-box; }
.feat_carousel .carousel li img { max-width: 100%; width: auto; max-height: 500px; height: auto; }
.feat_carousel .carousel .image { height: 500px; }
.feat_carousel .carousel .caption { color: #ffffff; padding: 10px 20px 0px 20px; }


/* Performances list page */

.section8 .feat_galllist li { clear: both; }
.section8 .feat_galllist li div.image { width: 350px; float: right; padding: 0px 0px 40px 40px; }

.section8 .feat_galllist li div.name { line-height: 0.7; padding: 0px 0px 20px 0px; font-style: italic; }
.section8 .feat_galllist li div.name a { color: #4c9bd0 }


/* Performance pages */

.feat_portfolio .name { padding: 0px 0px 10px 0px; font-style: italic; }
.feat_portfolio .abstract { padding: 20px 0px 20px 0px; }


/* Contact us */

.contactus .std_content { float: left; padding: 0px 0px 20px 0px; }
.contactus .surv_standard { float: left; clear: left; width: 450px; }
.contactus .feat_googlemap { float: right; }

@media( max-width: 1000px )
{
	.contactus .std_content { float: none; width: auto; }
	.contactus .surv_standard { float: none; width: auto; padding: 20px 0px 0px 0px; }
	.contactus .feat_googlemap { float: none; }
	.contactus .feat_googlemap .map { width: 100% !important; }
}


/* Formbuilder */

.formbuilder .field { padding: 0px 0px 20px 0px; }
.formbuilder .field .label { font-family: OverlockBold; padding: 0px 0px 5px 0px; }
.formbuilder input[type=text], .formbuilder[type=password] { width: 100%; }
.formbuilder textarea { width: 100%; height: 200px; font-family: "OverlockRegular"; }


/* Booking */

.event_recurringlist li .name { font-weight: bold; padding: 0px 0px 5px 0px;}
.event_recurringlist .bookbutton{margin: 10px 0 0 0;}

.event_recurringlist ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
.event_recurringlist ul li { border: 1px solid #cccccc; padding: 20px; margin-bottom: 20px; } 

.event_recurringpage .info { padding: 0px 0px 30px 0px; }
.event_recurringpage .book{padding: 40px 0px 0px 0px;}
.event_recurringpage .booklogin{padding: 0px 0px 20px 0px;}
#fb-Attendees-div .help-block { display:none; }

.event_eventpage .info  {  }
.event_eventpage .info .venue::before, .event_eventpage .info .date::before { content: 'Location: '; font-family: OverlockBold; }
.event_eventpage .info .date::before { content: 'Date/Time: '}
.event_eventpage .info .venue, .event_eventpage .info .date { position: relative; padding-top: 10px; }
.event_eventpage .abstract, .event_eventpage .image, .event_eventpage .info { padding-bottom: 20px;}

/* Member */
.memb_loginbox .fieldemail { display: block; padding-bottom: 10px; }
.memb_loginbox .forgotpw, .memb_loginbox .register { display: block; padding: 20px 0px 0px 155px; }
.memb_loginbox .login { padding: 20px 0px 0px 155px; }
.memb_loginbox .label { width: 150px; display: inline-block; }
.memb_loginbox .input { width: 390px; display: inline-block; }
.memb_loginbox .input input { width: 100%; box-sizing: border-box; }

.memb_loginbox .status { margin: 0px 0px 10px 0px; }

@media(max-width:600px){
	.memb_loginbox .label, .memb_loginbox .input { display: block; width: 100%; }
	.memb_loginbox .login, .memb_loginbox .logout { padding: 20px 0px 0px 0px; width: 100%; }
	.memb_loginbox input[type="submit"] { width: 100%; text-align: center; padding: 15px 15px 15px 15px; }
	.memb_loginbox .forgotpw { padding: 60px 0px 0px 0px; text-align: center; }
	.memb_loginbox .register { padding: 40px 0px 0px 0px; text-align: center; }
}


/* Survey */

.surv_standard .message { color: #ff0000; padding-bottom: 20px; }


/* Shop */


.shop_basket table {
    text-align: left;
    width: 100%;
}

.shop_basket fieldset{
    width: 100%;
}

.shop_basket table th, .shop_basket table td {
    padding-bottom: 5px;
    border-bottom: solid #e4e4e4 1px;
    text-align: left;
}

.shop_basket table,
.shop_basket .details .contact, .shop_basket .details .billing, 
.shop_basket .discount, 
.shop_basket .paymentform { margin: 0px 0px 30px 0px; }
.shop_basket .buttons { padding-top: 30px; }
.shop_basket .buttons input { margin: 0px 5px 0px 5px; }
.shop_basket .buttons .button { margin: 0px 0px 0px 0px; }

.memb_myaccount ul.menu { list-style-type: bullet; }
.memb_myaccount ul.menu li { padding: 5px 0px 5px 0px; }

.formbuilder #fb-Company-div { display: none; }

.error, .errors {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}


.event_list li { display: inline-block; padding: 10px; margin: 0px 20px 20px 0px;}
.event_list li:hover { background: lightgray; }
.event_list li .name a, .event_list li .date a { text-decoration: none; }
.event_list li .time { color: #000000;}

/*physical shop*/
.shop_productlist ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.shop_productlist ul li {
    display: flex;
    flex-direction: row;
    align-items: center;
    border: #4c9bd0 solid 2px;
}
.shop_productlist ul li img {
    width: auto;
    height: 170px;
}
.shop_productlist ul li div {padding: 10px;}

/*product page*/
.shop_product .info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.shop_product .size {display: flex; flex-direction: row; gap: 10px; padding-bottom: 20px;}
.shop_product .detailedimages ul {
    display: flex;
    flex-direction: row;
    gap: 20px;
    margin: 10px 200px;
}
.price {padding-bottom: 20px}
