@import url('https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&family=Raleway:wght@400;500;700&display=swap');

@import url('https://fonts.googleapis.com/css?family=PT+Serif:400|Raleway:400,700|Roboto');

:root {
	--green: #C5D41E;
	--light-green: #d1dd4b;
	--content-width: 1000px;
	--inner-width: 900px;
	--grey: #EDEDED;
	--white: #FFFFFF;
	--black: #000000;
	/* from SFab */
	--bold: #406ab3;
	--text: #000000;
	
	--font-heading: 'Oxygen', sans-serif;
	--font-body: 'Raleway', sans-serif;

	--blue1: #406ab3;
	--blue2: #5c8bdc;
	--blue3: #acb6dd;
	--blue4: #d2d7ec;
	--blue5: #eaeefe;
	--silver: ##eeeee4;
	--brown1: #873e23;
	--brown2: #e28743;
	--brown3: #eab676;
}

html, body{width:100%; height: 100%; margin: 0; box-sizing: border-box}
body{font-family: var(--font-body); color: var(--text); position: relative; font-size:18px; padding-top: 120px; overflow-x: hidden;}
div{box-sizing: border-box}
p:empty{display:none}

hr{border:3px solid var(--blue4); max-width: 220px; margin: 30px auto; border-radius: 10px; font-weight:500}

h1{}
h2{}
h3{color:var(--blue1)}


.button{border:2px solid var(--blue1) !important; color: var(--blue1) !important; background-color: var(--blue5) !important; display: inline-block; padding: 10px 30px; text-decoration: none; cursor: pointer}
.button:hover{background-color: var(--blue1) !important; color: #fff !important}

#wrap{}
#wrapdiv{background-repeat:no-repeat; background-position: center; background-size: cover}
#wrap button{padding: 12px 25px 11px; text-transform: uppercase; cursor:pointer; transition:all 300ms ease; color:var(--text)}
main a{text-decoration: none; transition:all 300ms ease; color: var(--blue1)}
main a:hover{color: var(--blue2) !important}
#wrap.mobshift{position:absolute; top:0; left:0; width:100vw}

#wrap input[type=text], #wrap input[type=email], #wrap input[type=tel], #wrap input[type=password], #wrap select{padding:10px; border:1px solid var(--blue1); z-index: 0; box-sizing: border-box; margin: 0}  
#wrap input[type=submit], #wrap input[type=button]{display:inline-block; padding: 12px 30px; background: var(--blue1); color:#fff !important; border:0; cursor:pointer; transition:all 300ms ease}
#wrap input[type=submit]:hover, #wrap input:hover[type=button]{opacity:0.8}
textarea{border:1px solid var(--blue1); font-family: var(--font-body); box-sizing: border-box; padding: 10px}

#moblogo{font-size:40px; color:var(--blue1); font-family: var(--font-body); padding: 10px; margin: 0; box-shadow:0 1px 10px rgb(0,0,0,0.5); display: none}

#header{align-items: center; position: fixed; top:0; left:0; width:100%; background: #fff; box-shadow:0 0 15px rgb(0,0,0,0.3); z-index: 10; background: var(--blue1)}
.masthead{display: flex; justify-content: space-between; align-items: center; margin: 17px auto; max-width: 1200px}

#loginform label{min-width:120px; display: inline-block}
#wp-submit{background-color: var(--blue1) !important; color: #fff; font-weight:700; font-size:18px}

footer{padding:30px; color: #fff; margin: 0 auto; background: var(--blue1); display: flex; justify-content: space-between; align-items: center; grid-gap: 30px}
footer > div{width:100%}
footer > div:first-of-type{max-width: 60px; aspect-ratio:1/1}
footer > div:first-of-type img{object-fit: contain; width:100%; height: 100%}
footer > div:nth-of-type(2){ text-align: center}
footer > div:last-of-type{max-width: 120px}

footer a{color: #fff !important; text-decoration: none}
footer a:hover{text-decoration: underline}

footer > div p{padding: 0 0 15px; margin: 0}
.footerFlex a:hover{color: var(--blue1) !important}
.footerFlex{display:flex; justify-content: space-between; align-items: center; max-width: 1000px; margin: 0 auto}
.footerFlex > div{text-align:center; flex-grow: 1 ; border-left:3px solid  var(--blue1)}
.footerFlex > div:first-of-type{border:0}


#menu-footer-menu{list-style: none; padding: 0; margin: 0}
#menu-footer-menu li{padding: 0 0 10px !important; margin: 0; display: block !important}
#menu-footer-menu a{text-decoration: underline; font-weight: 400}

.herowrap{position: relative; width:100%; margin: 0 auto; box-sizing: border-box}
.herowrap .slide{width:100%; height: 100%; position: absolute; top:0; left:0; opacity:0}
.herowrap .slide:first-of-type{opacity:1}
.herowrap .slide img{object-fit: cover; object-position: top center; width:100%; height: 100%; position: absolute; z-index: 0 !important; top:0; left:0}
.herowrap h2{color: #fff !important}

.has-text-align-center{max-width:var(--inner-width); margin: 0 auto}

.hero{width:100%; display: flex; justify-content: center; align-items: center; color: #fff; z-index: 2 !important}
.hero > div{width:100%; max-width: 900px; text-align: center; z-index: 2}
.hero .ctaButton{border:4px solid #fff; background-color: transparent; color: #fff !important; transition:all 1s ease; display: block; margin: 0 auto; max-width: 240px; padding: 20px; font-weight:700px; font-size:26px; backdrop-filter: blur(3px); border-top-right-radius:40px; border-bottom-left-radius:40px; ; border-top-left-radius:40px}
.hero .ctaButton:hover{background-color: rgb(255,255,255,0.3); box-shadow: 2px 2px 8px rgb(0,0,0,0.8); color: #000}
.hero .ctaButton.hidden{opacity:0; transform:translate(0, 100px)}
.hero h2{font-size:80px !important; padding: 0; margin: 0 0 30px; text-shadow:1px 1px 8px rgb(0,0,0,0.7); opacity:0; text-align: center; color:#fff; z-index: 2}
.hero h3{font-size:40px !important; padding: 0; margin: 0 0 60px; text-shadow:1px 1px 8px rgb(0,0,0,0.7); opacity:0; color:#fff; z-index: 2}

section h1{color:var(--blue1)}
section h2{color:var(--blue1); text-align: center}
section h3{}
section img.alignnone {width:100%; margin: 30px auto}

#mobnavbutton{width:40px; position: fixed; right:15px; top:18px; transition:all 300ms ease; cursor:pointer; display: none; z-index: 160}
#mobnavbutton > div{border:4px solid var(--blue4); margin: 0 0 5px; transition:all 300ms ease}
#mobnavbutton:hover > div{border-color:var(--blue) !important}

#mobnav{width:100vw; height: 100vh; position:fixed; left:0; top:0; background-color: var(--blue1); color: #fff; display: none; z-index: 150; padding-top: 30px}
#mobnav ul{list-style: none; padding: 0; margin: 0}
#mobnav li{display: block}
#mobnav a{display: block; color:#fff; font-weight:700; padding: 12px 30px; border-bottom:1px solid rgb(255, 255, 255, 0.3); text-decoration: none; text-shadow:1px 1px 3px rgb(0,0,0,0.5)}
#mobnav a:hover{background-color: var(--blue4)}


#mobnav .sub-menu{position: relative !important; top:inherit !important; left: inherit !important;}
#mobnav .sub-menu a::before{content: '‣  '; margin-right: 10px}
#mobnav .sub-menu a{box-shadow: none !important; padding-left: 40px !important}

.masthead .menu{list-style: none; padding: 0; margin: 0; font-size:0.9rem}
.masthead .menu > li{display:inline-block; text-align: center; padding: 0 0 0 20px; position: relative}
.masthead .menu > li > a{color:#ffffff; text-decoration: none; display: block; padding: 5px 0px; border-bottom:3px solid var(--blue1); transition: all 300ms ease; cursor: pointer}
.masthead .menu > li > a:hover{border-bottom: 3px solid var(--blue2)}
.masthead .menu > li.current-menu-item a{border-bottom: 3px solid var(--blue3) }

/* Sub */
.masthead .menu > li > ul{position: absolute; top:27px; left:0; list-style: none; padding: 30px 0 0; margin: 0;  display:none}
.masthead .menu > li > ul > li{display:block; padding: 0; margin: 0; border:0; width:100%}
.masthead .menu > li > ul > li > a{display: block; background: #fff; padding: 15px; width:100%; text-align: left; cursor:pointer; transition:all 300ms ease; text-decoration: none; color: #333}
.masthead .menu > li > ul > li > a:hover{background-color: var(--blue2)}
.masthead .menu > li:hover ul{display: block}

.sub-menu > li a{box-shadow:1px 10px 10px rgb(0,0,0,0.3)}

#content{margin: 0 auto; min-height: calc(100vh - 357px); padding: 0}

.logo{width:100%; max-width: 80px; aspect-ratio:16/9.8}
.logo img{object-fit: contain; width:100%; height: 100%; display: block; margin: 0}


#content h1{text-align:center; font-family: var(--font-body); font-size:70px; font-weight:normal; margin: 30px 0 50px; padding: 0; color: var(--blue1)}
#content h2{font-size:36px; margin: 40px 0 30px; padding: 0; color: var(--blue1)}
#content p{line-height: 2rem}
#content img{max-width: 100%}
.underline{border:0px; border-bottom:5px solid var(--blue4); padding: 0; margin: 30px auto 50px; max-width: 200px}

.contFlex{justify-content: space-around; align-items: stretch; max-width: 900px; margin: 0 auto; display: none}
.contFlex > div{width:100%; margin: 30px; background-color: #333; color: #fff; padding: 30px}

.post-edit-block{text-align: center}
.post-edit-link{text-align:center; font-size:14px; font-weight:700; background: #ededed; border:1px solid #666; padding: 5px 15px; display: inline-block; border-radius:4px}

/* Blocks */
.text-content-block-wrap{padding: 15px 0 30px; transition:all 500ms ease-in-out; display: block; margin: 0 auto; box-sizing: border-box}
.text-content-block{max-width:var(--inner-width); margin: 30px auto; transition:all 1s ease-in-out}
.text-content-block ul{}
.text-content-block li{padding:5px 0 10px}
.text-content-block h2{font-family: 'Oxygen', sans-serif; font-weight:normal}
.text-content-block.start{transform: translate(0, 30px); opacity: 0}

.color-ffffff{color: #FFFFFF !important}
.color-ffffff h2, .color-ffffff h3, .color-ffffff h4, .color-ffffff a{color: #ffffff !important}

.color-1e459c{color: #1e459c !important}
.color-1e459c h2, .color-1e459c h3, .color-1e459c h4, .color-1e459c a{color: #1e459c !important}

.color-a9bde8{color: #a9bde8 !important}
.color-a9bde8 h2, .color-a9bde8 h3, .color-a9bde8 h4, .color-a9bde8 a{color: #a9bde8 !important}

.color-5670a8{color: #5670a8 !important}
.color-5670a8 h2, .color-5670a8 h3, .color-5670a8 h4, .color-5670a8 a{color: #5670a8 !important}

.full-width-image{margin: 30px auto; display: flex; justify-content: center; align-items: center; width:100%; max-width: var(--inner-width); background-repeat: no-repeat; background-size: cover; background-position: center; aspect-ratio: 16 / 9; transition:all 1s ease-in-out; position: relative}
.full-width-image > div{transition:all 1s ease-in-out}
.full-width-image > div h2{color:#fff !important; text-shadow:1px 1px 5px rgb(0,0,0,0.6)}
.full-width-image img{width:100%; max-width: 100%; object-position: center}

.full-width-image .start{transform: translate(0, 60px); opacity: 0}

.full-width-image .biggest{font-size:80px !important}
.full-width-image .bigger{font-size:55px !important}
.full-width-image .smaller{font-size:30px !important}
.full-width-image .smallest{font-size:20px !important}

.full-width-image-cta{transition:all 1s ease; text-align: center}
.full-width-image-cta .ctaButton{border:4px solid #fff; background-color: transparent; color: #fff !important; transition:all 1s ease; display: inline-block; margin: 0 auto; max-width: 240px; padding: 20px 40px; font-size:26px; backdrop-filter: blur(3px); text-align: center; border-radius:60px; border-bottom-right-radius:0}

.full-width-image-cta .ctaButton:hover{background-color: rgb(255,255,255,0.3); box-shadow: 2px 2px 8px rgb(0,0,0,0.8); color: #000}
.full-width-image-cta.hidden{opacity:0; transform:translate(0, 100px); border:1px solid orangered}

ol[type=i]{padding-left: 90px}

.quote-block{background-color: var(--blue4); border-radius:30px; padding: 30px; max-width:var(--inner-width); margin: 30px auto 60px}
.book-now-cta{text-align: center; margin: 60px auto}
.book-now-cta a{display: inline-block; padding: 20px 40px; border:4px solid var(--blue2); background: #fff; transition:all 300ms ease; font-size:18px; color:var(--blue2) !important; border-radius:30px; border-bottom-right-radius:0; font-weight:700}
.book-now-cta a:hover{background: var(--blue1); color: #fff !important}

.book-now-stripe{display: flex; justify-content: space-between; align-items: center; margin: 0 auto; padding: 15px; max-width: var(--inner-width)}
.book-now-stripe > div{width:100%; text-align: left}
.book-now-stripe > div:last-of-type{max-width:200px; text-align: center}
.book-now-stripe h2{text-align:left; padding: 0 !important; margin: 0 !important; font-size:26px !important}

.book-now-stripe .asp_product_item{border:0; box-shadow:none}
.book-now-stripe .asp_product_item_top{display:none}
.book-now-stripe .asp_product_description{display:none}
.book-now-stripe .asp_product_item{padding: 0 !important}
.book-now-stripe .asp_product_buy_btn.blue{background: #fff !important; color:var(--blue1) !important; font-weight:normal; padding: 15px 30px 25px !important; border-radius:0; border:4px solid var(--blue1); box-shadow: none; text-shadow: none}
.book-now-stripe .asp_product_buy_btn.blue:hover{border-color:var(--brown); background-color: var(--blue1)}
.book-now-stripe .asp_product_buy_btn span{vertical-align: top !important; display:inline !important}

.contact-form-block{text-align: center}
.wpcf7-spinner{display: none}

#menu-footer-menu{list-style: none; padding: 0; margin: 0}
#menu-footer-menu li{display: inline-block; padding: 0 30px 0 0}
#menu-footer-menu li:last-of-type{padding:0}

.credit-option{display: flex; justify-content: space-between; align-items: center; padding: 15px; max-width: var(--inner-width); background: var(--brown3); margin: 0 auto 15px; border-radius:5px}
.credit-option > div{width:100%; text-align: left}
.credit-option> div:last-of-type{max-width:200px; text-align: center}
.credit-option h2{text-align:left; padding: 0 !important; margin: 0 !important; font-size:26px !important}

.credit-option .asp_product_item{border:0; box-shadow:none}
.credit-option .asp_product_item_top{display:none}
.credit-option .asp_product_description{display:none}
.credit-option .asp_product_item{padding: 0 !important}
.credit-option .asp_product_buy_btn.blue{background: #fff !important; color:var(--blue1) !important; font-weight:normal; padding: 15px 30px 25px !important; border-radius:0; border:4px solid var(--blue1); box-shadow: none; text-shadow: none}
.bcredit-option .asp_product_buy_btn.blue:hover{border-color:var(--brown); background-color: var(--blue1)}
.credit-option .asp_product_buy_btn span{vertical-align: top !important; display:inline !important}

.imgCopyright{max-width:var(--inner-width); padding:0px; margin: 0 auto; text-align: right; color: #fff; font-size:10px; transform: translate(0, -55px); text-shadow:1px 1px 3px #000; opacity: 0.8; transition:all 300ms ease; position: absolute; right:10px; bottom:10px}
.imgCopyright:hover{opacity: 1}
.heroCopyright{max-width: 100%; transform: translate(0, -18px);}

.size-large{max-width:var(--inner-width); margin: 30px auto}
.size-large img{object-fit: contain; width:100%; height: 100%}

article .book-now-stripe:nth-of-type(odd){background: #f8f8f8}

.asp-thank-you-page-wrap{max-width: 800px; margin: 0 auto}

.register{max-width: 900px; margin: 0 auto}
.center{text-align: center}

.video-block{margin: 0 auto; max-width: 900px}
.videowrapper{width:100%; position: relative; padding-bottom: 56%}
.videowrapper iframe{width:100%; height: 100%; position: absolute; top:0; left:0; border:0}

.follow{text-align: center; font-size:12px; margin: 30px 0 5px; opacity: 0.6}

.socials{text-align:center; font-size:30px; margin: 0 10px 15px; display: flex; flex-wrap:wrap; column-count: 2; grid-row-gap: 15px; max-width: 120px; margin: 0 auto}
.socials > div{width:50%}
.socials i{display:inline-block; margin: 0px 10px; transition:all 300ms ease}
.socials i:hover{transform:scale(1.2)}

.yourOrders{max-width:900px; margin: 0 auto}
.yourOrders table{border:1px solid var(--blue4); padding: 0; margin: 0 auto}
.yourOrders table th{background-color: var(--blue4); padding: 5px 15px; color:#fff}
.yourOrders table th:first-of-type{border-right:2px solid var(--brown3)}
.yourOrders table td{padding: 5px 15px}
.yourOrders table td:first-of-type{border-right:2px solid var(--blue4)}

#members-menu{position: fixed; top:0; right:3px; z-index: 200; font-size:11px; padding: 3px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; background: var(--blue1); color:#FFFFFF}
#members-menu a{color:#fff}
#members-menu ul{list-style: none; padding: 0; margin: 0}
#members-menu ul li{display:inline-block}
#members-menu ul li a{display:block; padding: 2px 10px; border-left:1px solid #fff; text-decoration:none; transition:all 300ms ease; cursor:pointer}
#members-menu ul li a:hover{color:var(--blue4); text-decoration: underline}
#members-menu ul li:first-of-type a{border:0}

.book-class-block{max-width: 900px; margin: 0 auto; padding: 30px; background-color: #fff; box-shadow: 1px 1px 10px rgb(0,0,0,0.2); border-radius:5px}

#post-1693 .book-class-block{background: var(--brown3)}

#modal{position: fixed; width:100vw; height:100vh; top:0; left:0; z-index: 1000; background-color: rgb(255,255,255,0.7); display: none; justify-content: center; align-items: center}
#modal h2{font-size:2rem; color: var(--blue1); text-align: center}
#modal > div{background:#fff; box-shadow:1px 1px 15px rgb(0,0,0,0.6); padding: 30px; min-height: 300px; width:100%; max-width: 900px; position: relative}
#modal > div .fas{position: absolute; top:15px; right: 15px; font-size:2rem; cursor:pointer; transition:all 300ms ease}
#modal > div .fas:hover{opacity: 0.8}
#modal .button{background: var(--blue1); color: #fff; padding:10px 25px; display: inline-block; margin: 5px 5px 5px 0; text-align: center; cursor:pointer; transition:all 300ms ease; text-decoration: none}
#modal .button:hover{background: #333}

.photo-text-block{display:flex; justify-content: space-between; align-items: stretch; max-width: 1200px; margin: 30px auto}
.photo-text-block > div{width:100%; transition:all 1s ease-in-out}
.photo-text-block .photo-side{object-fit: cover; width:100%; height: 100%}

.photo-text-block.block-order-left{flex-direction:row-reverse}
.photo-text-block .text-side{padding:0 30px; background-color: var(--blue5); max-width: 50%; display: flex; justify-content: center; align-items: center}
.photo-text-block .photo-side{overflow: hidden; position: relative}
.photo-text-block .photo-side img{object-fit: cover; object-position: center; width:100%; height: 100%; display: block; z-index: 1}

.photo-text-block.block-order-left .text-side{border-top-right-radius:15px; border-bottom-right-radius:15px}
.photo-text-block.block-order-left .photo-side{border-top-left-radius:15px; border-bottom-left-radius:15px}

.photo-text-block.block-order-right .text-side{border-top-left-radius:15px; border-bottom-left-radius:15px}
.photo-text-block.block-order-right .photo-side{border-top-right-radius:15px; border-bottom-right-radius:15px}

.photo-text-block.block-order-left .text-side.start{transform:translate(200px, 0); opacity: 0}
.photo-text-block.block-order-left .photo-side.start{transform:translate(-200px, 0); opacity: 0}

.photo-text-block.block-order-right .text-side.start{transform:translate(-200px, 0); opacity: 0}
.photo-text-block.block-order-right .photo-side.start{transform:translate(200px, 0); opacity: 0}

.twoBlockCopyright{z-index: 2; position: absolute; right:15px !important; bottom:15px; transform:none !important; color: #fff}

.fullImgCopyright{z-index: 3; position: absolute; right:15px !important; bottom:15px; transform:none !important; color: #fff;}

.wpcf7-submit{border:3px solid var(--blue1)}

.login-panel{background: var(--blue5); text-align: center; max-width: 600px; margin: 30px auto; padding: 15px 30px; border-radius:4px}
.login-panel input{background: #fff !important}
.login-panel label{font-weight:700; color: var(--blue1)}

#members-area-menu{display: flex; justify-content: center; align-items: center; column-gap: 15px; margin: 15px auto}

.asp_product_item{background: var(--blue5); border:2px solid var(--blue1) !important; border-radius:4px}
.asp_product_name{color:var(--blue1); padding: 0 !important; margin: 0 !important; line-height: 1}
.asp_product_description{padding: 0 !important; margin: 0 !important}

.asp_product_buy_btn{background: var(--blue1) !important; text-transform:none !important; padding: 10px 30px 14px !important; color: #fff !important; margin: 15px 0 0 !important}
.asp_product_buy_btn:hover{background: var(--blue2) !important}
.asp_product_buy_btn span{color: #fff !important; text-shadow: none !important; display:block}

.asp_product_item_thumbnail img{width:120px !important; height: 120px !important; border-radius:5px}
.asp-order-details-wrap{max-width: 900px; padding: 15px; margin: 0 auto}
.asp-order-details-wrap h4{color: var(--blue1)}


.music-block{background: var(--blue5); max-width: 1000px; margin: 0 auto; padding: 30px; border-radius:15px; border:2px solid var(--blue1)}
.song-item{display: flex; justify-content: space-between; align-items: center; column-gap: 10px; grid-row-gap: 30px}
.song-item > div{width:100%}
.song-item > div:nth-of-type(2){max-width: 450px}
.song-item > div:nth-of-type(3){max-width: 150px}
.song-item > div:last-of-type{max-width: 150px}
.song-item .button{padding: 16px 30px; border-radius:30px; background-color: var(--blue1) !important; color: #ffffff !important}
.song-item .button:hover{background-color: var(--blue2) !important; color:#fff !important}


.audiobutton{min-width:120px}

audio{background-color: var(--blue1); padding: 2px; border-radius:30px}

.taster-wrap{background: var(--blue5); color:var(--blue1); padding: 30px; border-radius:15px; margin: 15px auto; max-width: 400px}
.taster-wrap h3{color: var(--blue1) !important}
.taster-wrap input{max-width: 94%}
.thank-you-message{text-align: center; font-size:2rem; color: #fff !important}

#user-registration{margin: 30px auto !important; border:2px solid var(--blue2)}

audio{display: none}
.player{height:60px; max-width:500px; margin:0px auto; position:relative; color:#fff; background-color: var(--blue1)}
.player i{color:#fff; position:absolute; top:17px; left:20px; cursor:pointer; font-size:22px}
.player i:hover{opacity:0.8}
.player .fa-pause{display:none}
.player .title{position:absolute; left:60px; top:16px}
.player audio{ position:absolute; top:0px; right:-300px; display:none}
.playbar{height:8px; width:100%; background-color:var(--blue2); position:absolute; left:0px; bottom:0px}
.playbarinner{height:100%; width:0px; background-color:var(--brown2); transition:all 300ms ease}
.playing{color:orange}
.playing .playbar{background-color:var(--brown3)}
.playing i{color:orange}
.playing .playbar{cursor:pointer}
.download{position:absolute; display:block; right:54px; top:5px}
.download i{display:block; font-size:18px; color:#fff; transition:all 200ms ease}
.download i:hover{color:orange}

/* Contact form */
#wpcf7-f231-p232-o1{padding-bottom: 30px}

/* Mailchimp subscribe box*/
#mailchimp-subscribe{padding: 15px 30px}
#mailchimp-subscribe > div{max-width:var(--inner-width); margin: 0 auto; text-align: center}
#mailchimp-subscribe label{display: inline-block; width:260px; font-size:0.9rem; font-weight:700}
#mailchimp-subscribe label input{margin: 6px 0 0}
#mailchimp-subscribe h2{color: var(--blue1)}
#mailchimp-subscribe input[type=submit]{margin:15px 0 0; border-radius:3px; font-weight:700}
#mailchimp-subscribe .mc-flex{display: flex; justify-content: center; align-items: stretch; flex-wrap:wrap; grid-gap: 15px}
#mailchimp-subscribe .mc-flex > div{width:100%; max-width: 40%}

/* Diagonal stripes */
.stripes {
    background: repeating-linear-gradient(
        45deg,
        #d8f3c6 0px,
        #e8f8de 30px
    );
}

/* Dot pattern */
.dots {
    background-color: #ededed;
    background-image: radial-gradient(
        #cee9bc 1.5px,
        transparent 1px
    );
    background-size: 24px 24px;
}


/* Nav breakpoint */
@media (max-width:800px) {
	body{margin-top: 0; padding-top: 0}
    #header{display:none}
	#mobnavbutton{display: block}
	.heroCopyright{max-width: 100%; transform: translate(0, -140px);}
}

/* Other breakpoints */
@media (max-width:1400px) {
	.heroCopyright{max-width: 100%; transform: translate(0, -140px);}
}

@media (max-width:900px) {
    footer{flex-direction: column}
    footer > div{padding: 0 0 30px !important; text-align: center; max-width:100% !important}
	footer > div:first-of-type{ max-width: 200px !important}
	
	#footer-nav-cell .menu{list-style: none; padding: 0; margin: 0}
	
	.block{margin-left:15px; margin-right:15px; max-width:100%; box-sizing: border-box}
	.full-width-image{max-width: 100% !important; box-sizing: border-box; margin: 15px 0}
}
@media (max-width:800px) {
	

	.photo-text-block{flex-direction: column; flex-wrap:wrap}
	.photo-text-block > div{max-width: 100% !important; border-radius:0 !important}
}

@media (max-width:700px) {
	.book-now-stripe{flex-direction: column; margin: 15px 0 30px}
	.book-now-stripe > div{max-width: 100%; text-align: center !important}
	.ur-frontend-form .ur-form-row .ur-form-grid{padding: 0}
	#ur-frontend-form{padding: 0 0 10px; margin: 0}
	#user-registration{margin: 0 !important; padding: 0 !important}
	.ur-form-grid input{width:100% !important; max-width: 100% !important; min-width:100% !important; margin: 0; box-sizing:border-box}
	#mailchimp-subscribe .mc-flex > div{max-width: 100%}
}
@media (max-width:600px) {
	.text-content-block-wrap{border-radius: 10px !important}
	#content h1{font-size:50px}
	#content h2{font-size: 30px}
	.hero h2{font-size:40px !important}
	.hero h3{font-size:40px !important}
	.imgCopyright{transform: translate(0, -15px)}
	.full-width-image-cta .ctaButton {
		border: 3px solid #fff;
		max-width: 240px;
		padding: 10px 20px;
		font-size: 20px;
	}
	.herowrap{margin-bottom: 15px}
	.heroCopyright{max-width: 100%; transform: translate(0, -130px);}
	.text-content-block.start{transform:none; opacity: 1}
	.full-width-image .start{transform:none; opacity: 1}
	.photo-text-block.block-order-left .text-side.start{transform:none; opacity: 1}
	.photo-text-block.block-order-left .photo-side.start{transform:none; opacity: 1}
	.photo-text-block.block-order-right .text-side.start{transform:none; opacity: 1}
	.photo-text-block.block-order-right .photo-side.start{transform:none; opacity: 1}
	
	.song-item{flex-direction: column}
	.song-item > div{max-width: 100% !important; box-sizing: border-box}
	.song-item .button{width:100%; margin: 0; box-sizing: border-box}
	.song-item h3{text-align: center; padding: 0; margin:40px 0 0}
	
	#members-area-menu{flex-direction: column; margin: 30px auto; width:290px; box-sizing: border-box}
	#members-area-menu > div{width:100%; max-width: 100%; text-align: center; padding: 5px 0}
	#members-area-menu .button{width:100% !important; display: block; box-sizing: border-box; border-radius:10px}
	
	
}