/*! HTML5 Boilerplate v6.1.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {color: #ffffff; font-size: 1em; line-height: 1.4; background: #111111;}
img {width: 100%; height: auto;}
a, button {text-decoration: none; transition: all 0.3s;}
.sitebg {width: 100%; background: url(/img/background.png) fixed center #ffffff;}

.sitebg .headerMain, #openMenuButton, .menu, .detail, .pageHeader, .pageHeaderFull, .main .container, .testimonials .container, .container .testimonials, .breadcrumbs ul, .footer .container, .bannerNav .container, section .container, .hero, .restaurants, contentArea, .gallery, .key, .fiftyFiftyImage, .backgroundSlim, .customerArea, .announcement span {animation-name: main; animation-delay: 0.5s; animation-duration: 1s; animation-fill-mode: both;}

@keyframes main {
    0%   {transform: translate(0,0); opacity: 0;}
    100% {transform: translate(0,0); opacity: 1;}
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

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

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio, canvas, iframe, img, svg, video {vertical-align: middle;}

/*
 * Remove default fieldset styles.
 */

fieldset {border: 0; margin: 0; padding: 0;}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {resize: vertical;}


/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0;}



/* ==========================================================================
   Styles by neilirwin.uk
   ========================================================================== */

/* ==========================================================================
   Default Fonts
   ========================================================================== */
   
h1 {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em;}
h1 strong {font-family: "cronos-pro-n6", "cronos-pro",sans-serif; font-style: normal; font-weight: 600; text-transform: uppercase; letter-spacing: 0.075em;}
h2 {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em;}
h3 {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em;}
h4 {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase;}
h5 {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase;}
h6 {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase;}
p {font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}
span {font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}
ul li {font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}
ol li {font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}
small {font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}
select {font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; letter-spacing: 0.05em;}
.date {display: none;}

@media screen and (min-width: 480px) {
	p {font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300;}
}

/* ==========================================================================
   Backgrounds
   ========================================================================== */

.darkGrey {background: rgba(40,40,40,0.95); color: #ffffff;}
.white {background: rgba(255,255,255,0.95); color: #111111;}
.yellow {color: #111111; background-color: #FFD667; background: rgba(255,214,103,0.95);}


/* ==========================================================================
   Containers
   ========================================================================== */
   
.container {margin: 0 auto; padding: 0;}

@media screen and (min-width: 1400px) {
	.container {font-size: 100%; width: 1350px;}
}

@media screen and (max-width: 1400px) {
	.container {margin: 0 auto; width: 90%;}
	.menu .container {margin: 0 auto; width: 96%;}
}

@media screen and (max-width: 700px) {
	.header .container {margin: 0 auto; width: 100%;}
}


/* ==========================================================================
   Header
   ========================================================================== */
   
.home .header {margin: 0; padding: 0; height: 100vh; min-height: 100vh; position: relative; width: 100%; background: #000000;}
.class .header {margin: 0; padding: 0; height: 45vh; min-height: 450px; position: relative; width: 100%; background: #000000;}
.global .header {margin: 0; padding: 0; height: 45vh; min-height: 450px; position: relative; width: 100%; background: #000000;}
.globalFull .header {margin: 0; padding: 0; min-height: 100vh; position: relative; width: 100%; background: #000000;}
.forms .header {margin: 0; padding: 0; position: relative; width: 100%; background: #000000; z-index: 300;}

.home .header .headerMain {margin: 0 auto; position: absolute; z-index: 300; background: #707070;}
.global .header .headerMain {margin: 0 auto; position: absolute; z-index: 300; background: #707070;}
.globalFull .header .headerMain {margin: 0 auto; position: absolute; z-index: 5000; background: #707070;}
.header .headerLogo {margin: 0; padding: 20px 30px 20px 30px; width: 180px; background: #ffffff; position: absolute; box-sizing: border-box; text-align: left;}
/* .header .headerLogo {margin: 0; padding: 20px 30px 20px 30px; width: 180px; position: absolute; box-sizing: border-box; background: #ffffff; text-align: left;} */
.header .headerLogo .headerLogoImg.desktop {display: none;}
.header .headerLogo img {max-width: 180px;}
.header .headerLogoTitle {display: none;}

.header .headerNav {margin: 0; padding: 0; position: fixed; z-index: 3000; top: 5px; right: 55px; transition: all 0.3s;}
.header .headerNav .menu {margin: 0; padding: 0; color: #fff;}
.header .headerNav .menu ul {margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; transition: all 0.3s;}
body.reveal .header .headerNav .menu ul {background: #707070;}
body.menuOpen .header .headerNav .menu ul {background: #707070;}
.header .headerNav .menu ul li {margin: 0; padding: 0; list-style: none; line-height: 50px;}
.header .headerNav .menu span {display: none;}
.header .headerNav .menu i {font-style: normal;}
.header .headerNav .menu ul li a {border: none; height: 50px; width: 50px; font-size: 25px; line-height: 50px; color: #FFD667; cursor: pointer; font-family: "Font Awesome 5 Free"; font-weight: 900; text-decoration: none; text-align: center; display: block; align-self: center;}
.header .headerNav .menu ul li a:hover {color: #FFFFFF;}

.header .headerNav .menu ul li a.phone {padding: 0 0 0 1em; width: auto; display: flex; flex-direction: row; justify-content: center;}
.header .headerNav .menu ul li a.phone span {padding: 0 0.5em 0 0.5em; display: inherit; font-size: 0.9em;}
.header .headerNav .menu ul li a.phone::before {content: "\f095";}
.header .headerNav .menu ul li a.email::before {content: "\f0e0";}
.header .headerNav .menu ul li a.book {padding: 0 20px; border: none; background: #FFD667; height: 50px; width: inherit; font-size: 1.25em; line-height: 50px; color: #707070; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; display: block;}
.header .headerNav .menu ul li a.book:hover {color: #707070; background: #FFFFFF;}
body.menuOpen .header .headerNav .menu ul li a.book {color: #707070; background: #FFFFFF;}
body.menuOpen .header .headerNav .menu ul li a.book:hover {color: #ffffff; background: #ED6B06;}
.header .headerNav .menu ul li a.schedule {display: flex; align-content: center; padding: 0 20px; border: none; height: 50px; width: inherit; font-size: 1.25em; line-height: 50px; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em;}
.header .headerNav .menu ul li a.schedule::before {margin-right: 10px; font-size: 25px; height: 50px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content: '\f073'; text-align: center}
.header .headerNav .menu ul li a.icon::before {content: "\f0c9";}
.header .headerNav .menu ul li a.user::before {content: "\f2bd";}
.header .headerNav .menu ul li a.basket::before {content: "\f291";}

/*
.header .headerNav {margin: 0; padding: 0; position: fixed; z-index: 3000; top: 5px; right: 55px; transition: all 0.3s;}
.header .headerNav .menu {margin: 0; padding: 0; color: #fff;}
.header .headerNav .menu ul {margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; }
.header .headerNav .menu ul li {margin: 0; padding: 0; list-style: none; line-height: 50px;}
.header .headerNav .menu span {display: none;}
.header .headerNav .menu i {font-style: normal;}
.header .headerNav .menu ul li a {border: none; background: #707070; height: 50px; width: 50px; font-size: 25px; line-height: 50px; color: #FFD667; cursor: pointer; font-family: "Font Awesome 5 Free"; font-weight: 900; text-decoration: none; text-align: center; display: block; align-self: center;}
.header .headerNav .menu ul li a:hover {color: #ffffff; background: #ED6B06;}
*/

/*
.header .headerNav .menu ul li a.phone {background: #707070; color: #FFD667;}
.header .headerNav .menu ul li a.phone::before {content: "\f095";}
.header .headerNav .menu ul li a.phone:hover {color: #ffffff; background: #ED6B06;}
.header .headerNav .menu ul li a.email {background: #707070; color: #FFD667;}
.header .headerNav .menu ul li a.email::before {content: "\f0e0";}
.header .headerNav .menu ul li a.email:hover {color: #ffffff; background: #ED6B06;}
.header .headerNav .menu ul li a.book {padding: 0 20px; border: none; background: #FFD667; height: 50px; width: inherit; font-size: 1.25em; line-height: 50px; color: #707070; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; display: block;}
.header .headerNav .menu ul li a.book:hover {color: #707070; background: #FFFFFF;}
body.menuOpen .header .headerNav .menu ul li a.book {color: #707070; background: #FFFFFF;}
body.menuOpen .header .headerNav .menu ul li a.book:hover {color: #ffffff; background: #ED6B06;}
.header .headerNav .menu ul li a.schedule {display: flex; align-content: center; padding: 0 20px; border: none; background: #707070; height: 50px; width: inherit; font-size: 1.25em; line-height: 50px; color: #FFD667; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em;}
.header .headerNav .menu ul li a.schedule::before {margin-right: 10px; font-size: 25px; height: 50px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content: '\f073'; text-align: center}
.header .headerNav .menu ul li a.schedule:hover {color: #ffffff; background: #ED6B06;}
.header .headerNav .menu ul li a.icon::before {content: "\f0c9";}
.header .headerNav .menu ul li a.user::before {content: "\f2bd";}
.header .headerNav .menu ul li a.basket::before {content: "\f291";}
*/

.header .bannerNav {margin: 0; padding: 0; height: 10vh; background: #FFD667;}

@media screen and (min-width: 1050px) {
	.header .headerLogo {margin: 0; padding: 20px 30px 30px 30px;}
	.header .headerLogo .headerLogoImg.mobile {display: none;}
	.header .headerLogo .headerLogoImg.desktop {display: block;}
	
	.forms .header .headerLogo {margin: 0; padding: 20px 30px 20px 30px;}
	.forms .header .headerLogo .headerLogoImg.mobile {display: block; text-align: left;}
	.forms .header .headerLogo .headerLogoImg.desktop {display: none;}
}

@media screen and (max-width: 1050px) {
	.header .headerLogo {padding: 30px; background: none;}
	.header .headerLogo img {text-shadow: 0px 0px 10px rgba(0,0,0,0.8);}
	.header .headerLogo img {-webkit-filter: drop-shadow(0 0 10px #000); filter: drop-shadow(0 0 10px #000);}
}

@media screen and (max-width: 960px) {
	.header .headerNav .menu ul li a.phone {padding: 0 0 0 0; width: 50px; flex-direction: row;}
	.header .headerNav .menu ul li a.phone span {padding: 0 0 0 0; display: none;}
}

@media screen and (max-width: 900px) {
	.header .headerNav .menu ul li a.schedule {padding: 0 0;}
	.header .headerNav .menu ul li a.schedule i {display: none;}
	.header .headerNav .menu ul li a.schedule::before {margin-right: 0; width: 50px;}
}

@media screen and (max-width: 700px) {
	.headerMain {display: flex; justify-content: center; width: 100%;}
	.header .headerLogo {left: 0;}
	.header .headerNav {top: 0; left: 0; right: 0; width: 100%;}
/* 	.header .headerNav {top: 0; left: 0; right: 0; background: #707070; width: 100%;} */
	.header .headerMain {top: 50px;}
	.forms .header .headerMain {margin-top: 50px;}
	.header .headerNav .menu ul li.itemBook {margin-right: 50px; flex-grow: 1;}
	
	.class .header {height: 40vh; min-height: 350px;}
	.global .header {height: 40vh; min-height: 350px;}
}

@media screen and (max-width: 500px) {
	.header .headerLogo {margin: 0; padding: 15px 20px 15px 20px; width: 160px;}
	.header .headerLogo img {max-width: 160px;}
	.header .headerNav .menu ul li a.user {display: none;}
	.header .headerNav .menu ul li a.schedule {display: none;}
}

@media screen and (max-width: 360px) {
	.header .headerNav .menu ul li a.book i {display: none;}
}


/* ==========================================================================
   Main Nav
   ========================================================================== */

.mainMenu {display: block;}

body.menuOpen {overflow: hidden;}

body.menuOpen .mainNav .container {animation-name: navOpen; animation-duration: 1s; animation-fill-mode: both;}
@keyframes navOpen {
    0%   {transform: translate(0,-10%); opacity: 0;}
    100% {transform: translate(0,0); opacity: 1;}
}


#mainNav {width: 100vw; overflow-y: scroll; top: 0; right: 0; bottom: 0; left: 0; height: 100%; min-height: 100%; background: rgba(255,214,103,1); position: fixed; opacity: 0; z-index: -2000; transition: 0.5s ease-in-out; display: flex; flex-direction: column; justify-content: flex-start; align-content: flex-start; display: none;}
body.menuOpen #mainNav {opacity: 1; background: rgba(255,214,103,0.95); z-index: 2000; display: block;}
#mainNav .container {position: relative; margin: 0 auto; min-height: 100vh;}
body.menuOpen .mainNav {padding-top: 20vh;}

/* Main Nav Button */

#openMenuButton {position: fixed; width: 50px; height: 50px; top: 5px; right: 5px; z-index: 3001; transition: 0.5s ease-in-out; cursor: pointer; display: block; background: rgba(237,107,6,1);}
#openMenuButton.background {background: rgba(237,107,6,1);}
#openMenuButton:hover {background: rgba(237,107,6,1);}
body.menuOpen #openMenuButton {background: rgba(237,107,6,1);}

.menuIcon {display: block; position: relative; overflow: hidden; margin: 0 auto; padding: 0; width: 50px; height: 50px; font-size: 0; text-indent: -9999px; background: none; border: none; cursor: pointer;}
.menuIcon:focus {outline: none;}
.menuIcon span {display: block; position: absolute; top: 23px; left: 10px; right: 10px; height: 3px; background: #ffffff;}
.menuIcon span::before,
.menuIcon span::after {position: absolute; display: block; left: 0; width: 100%; height: 3px; background: #ffffff; content: "";}
.menuIcon span::before {top: -9px;}
.menuIcon span::after {bottom: -9px;}
.menuIconX span {transition: background 0s 0.3s;}
.menuIconX span::before,
.menuIconX span::after {transition-duration: 0.3s, 0.3s; transition-delay: 0.3s, 0s;}
.menuIconX span::before {transition-property: top, transform;}
.menuIconX span::after {transition-property: bottom, transform;}

.menuOpen .menuIconX {}
.menuOpen .menuIconX span {background: none;}
.menuOpen .menuIconX span::before {top: 0; transform: rotate(45deg);}
.menuOpen .menuIconX span::after {bottom: 0; transform: rotate(-45deg);}
.menuOpen .menuIconX span::before,
.menuOpen .menuIconX span::after {transition-delay: 0s, 0.3s;}

/* Main Navigation */

#mainNav {transition: 0.5s ease-in-out; opacity: 0;}
body.menuOpen #mainNav {opacity: 1; overflow-y: scroll;}

.mainNav .container {padding: 0 0 50vh 0; display: flex; justify-content: flex-start; color: #707070;}
.mainNav h5 {margin: 0; padding: 0; font-size: 2em;}
.mainNav ul {margin: 0; padding: 0;}
.mainNav ul li {margin: 0; padding: 0;}
.mainNav a {color: #707070;}
.mainNav a:hover {color: #111111;}

#mainNavigation {margin-right: 10%; width: 50%}
#mainNavigation ul {margin: 0; padding: 0; text-align: left; display: flex; flex-direction: column;}
#mainNavigation ul li {margin: 0; padding: 0; line-height: 45px; list-style: none; font-size: 1.5em; letter-spacing: 0.1em; text-transform: uppercase;}
#mainNavigation ul li a {padding: 0.25em 0; display: block; position: relative; line-height: 1.5; color: #707070; transition: all 500ms; text-decoration: none;}
#mainNavigation ul li a:hover {color: #111111; text-decoration: none;}

#sideNavigation {width: 40%;}
#sideNavigation .sideNavArea {padding: 0 0 0 2em; border-left: 1px solid #707070;}
#sideNavigation h5 {margin: 0; padding: 0; font-size: 1.5em;}

.mainNavList {margin: 0 0 2em 0;}
.mainNavList ul {margin: 0; padding: 0; text-align: left; display: flex; flex-direction: column;}
.mainNavList ul li {margin: 0; padding: 0; line-height: 1.5; list-style: none; font-size: 1em; letter-spacing: 0.1em; text-transform: uppercase;}
.mainNavList ul li a {padding: 0.25em 0; display: block; position: relative; line-height: 1.5; color: #707070; transition: all 500ms; text-decoration: none;}
.mainNavList ul li a:hover {color: #111111; text-decoration: none;}

.mainNavContact {margin: 0; padding: 0;}
.mainNavContact h5 {margin: 0; padding: 0;}
.mainNavContact .vcard ul {display: flex; flex-direction: column; justify-content: center; align-content: center;}
.mainNavContact .vcard ul li {margin: 0; padding: 0; display: block; font-size: 1em; display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.mainNavContact .vcard ul li strong {display: none;}
.mainNavContact .vcard ul li::before {width: }
.mainNavContact .vcard ul li.email::before {margin: 0; padding: 0; color: #707070; height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f0e0'; text-align: left;}
.mainNavContact .vcard ul li.mobile::before {margin: 0; padding: 0; color: #707070; height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f3cd'; text-align: left;}
.mainNavContact .vcard ul li.tel::before {margin: 0; padding: 0; color: #707070; height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f095'; text-align: left;}

.mainNavContact .link {margin: 1em 0 0 0; text-align: left;}
.mainNavContact .link a {text-decoration: none;}
.mainNavContact .link span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(112,112,112,1); border-radius: 0.25em; display: inline-block;}
.mainNavContact .link span a:hover {background: rgba(112,112,112,0.8);}

.mainNavContact .social {margin: 1em 0 0 0; padding: 0;}
.mainNavContact .social ul {margin: 0.25em 0 0 0 !important; padding: 0; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
.mainNavContact .social ul li {list-style: none;}
.mainNavContact .social ul li a {margin: 0.25em 0.25em 0.25em 0; padding: 0.25em!important; display: block; list-style: none; font-size: 1.5em; height: 1.5em; width: 1.5em; line-height: 1.5em; text-rendering: auto; border-radius: 50%; text-align: center; align-self: center; color: #ffffff !important; background: #707070; overflow: hidden; position: relative; transition: all 0.5s ease;}
.mainNavContact .social ul li a:hover {color: #707070!important; background: #ffffff;}

@media screen and (max-height: 768px) {
	body.menuOpen .mainNav {padding-top: 15vh;}
}

@media screen and (max-width: 700px) {
	
	body.menuOpen #mainNav {background: rgba(255,214,103,1);}
	#mainNav .container {width: 90%;}
	body.menuOpen .mainNav {padding-top: 80px; overflow-y: scroll;}
		
	#openMenuButton {top: 0; right: 0;}
	
	#openMenuButton:hover {background: rgba(237,107,6,1);}
	body.menuOpen #openMenuButton {background: rgba(237,107,6,1);}
	
	.mainNav .container {flex-direction: column;}
	.mainNav h5 {margin: 0; padding: 0; font-size: 1.5em;}
	
	#mainNavigation {margin-right: 0; width: 100%}
	#mainNavigation ul li {font-size: 1.25em;}
	#mainNavigation ul li a {padding: 0.25em 0; min-height: inherit; line-height: 1.2;}
	
	#mainNavigation {display: none;}
	
	#sideNavigation {width: 100%;}
	#sideNavigation .sideNavArea {padding: 2em 0 0 0; border-left: none; border-top: none;}
	.mainNavList {margin: 0 0 1em 0;}
	.mainNavList ul li a {min-height: 25px; line-height: 25px; font-size: 1.35em;}
}

@media screen and (max-width: 700px) {
}

/* ==========================================================================
   Breadcrumbs
   ========================================================================== */
   
.breadcrumbs {margin: 0; padding: 0;}
.breadcrumbs ul {margin: 0; padding: 0; display: flex; justify-content: flex-start; align-content: center;}
.breadcrumbs ul li {margin: 0; padding: 1em 0; list-style: none; font-size: 1em; line-height: 1.5;}
.breadcrumbs ul li a {margin: 0; padding: 0; color: rgba(0,0,0,1);}
.breadcrumbs ul li a.item::after {margin: 0; padding: 0 0.75em; list-style: none; font-size: 0.75em; line-height: 1.5; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f054'; text-align: center;}
.breadcrumbs ul li a:hover {color: rgba(0,0,0,0.5);}

/* ==========================================================================
   Page Header
   ========================================================================== */

.pageHeader {margin: 0; padding: 0; z-index: 3; height: 40vh; min-height: 400px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; background: no-repeat; content:''; top: 0; position: absolute; width: 100%; text-align: center;}

.pageHeader .pageHeaderContent {margin: 0 auto; z-index: 3; max-width: 70%; text-align: center; min-width: 260px;}
.pageHeader .pageHeaderContent h1 {margin: 0; padding: 0; color: #ffffff; font-size: 3.5em; line-height: 1,2; font-weight: 500; text-transform: uppercase; letter-spacing: 0.2em; text-shadow: 0px 0px 30px rgba(0,0,0,0.8);}
.pageHeader .pageHeaderContent p {margin: 0 0 0.5em 0; padding: 0; color: #ffffff; font-size: 1.5em; font-weight: 100; letter-spacing: 0.1em; text-transform: uppercase; text-shadow: 0px 0px 30px rgba(0,0,0,0.5);}
.pageHeader .pageHeaderContent a {margin: 0; padding: 0.5em 0; color: #ffffff; background: rgba(222,192,119,0.4); display: block; width: 100%; font-weight: 500; letter-spacing: 0.1em; text-decoration: none; font-size: 1.5em; }

.pageHeaderFull {margin: 0; padding: 0; z-index: 3; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; background: no-repeat; content:''; top: 0; position: absolute; width: 100%; text-align: center; display: none;}

.pageHeaderFull .pageHeaderContent {margin: 0 auto; z-index: 300; max-width: 70%; text-align: center; min-width: 260px;}
.pageHeaderFull .pageHeaderContent h1 {margin: 0; padding: 0; color: #ffffff; font-size: 3.5em; line-height: 1,2; font-weight: 500; text-transform: uppercase; letter-spacing: 0.2em; text-shadow: 0px 0px 30px rgba(0,0,0,0.8);}
.pageHeaderFull .pageHeaderContent p {margin: 0 0 0.5em 0; padding: 0; color: #ffffff; font-size: 1.5em; font-weight: 100; letter-spacing: 0.1em; text-transform: uppercase; text-shadow: 0px 0px 30px rgba(0,0,0,0.5);}
.pageHeaderFull .pageHeaderContent a {margin: 0; padding: 0.5em 0; color: #ffffff; background: rgba(222,192,119,0.4); display: block; width: 100%; font-weight: 500; letter-spacing: 0.1em; text-decoration: none; font-size: 1.5em; }


@media screen and (max-width: 1400px) {
	.pageHeader .pageHeaderContent {max-width: 60%;}
	.pageHeader .pageHeaderContent h1 {font-size: 3em;}
}

@media screen and (max-width: 1050px) {
	.pageHeader .pageHeaderContent {max-width: 80%;}
}

@media screen and (max-width: 700px) {
	.pageHeader {height: 35vh; min-height: 325px;}
	.pageHeader .pageHeaderContent {max-width: 90%;}
	.pageHeader .pageHeaderContent h1 {font-size: 2em;}
	
	.pageHeaderFull .pageHeaderContent {max-width: 90%;}
	.pageHeaderFull .pageHeaderContent h1 {font-size: 2em;}
}

@media screen and (max-width: 700px) {
	.pageHeader .pageHeaderContent h1 {font-size: 1.75em;}	
}

/* ==========================================================================
   Page Header Form
   ========================================================================== */




/* ==========================================================================
   Header Background
   ========================================================================== */
   
.backgroundFull {margin: 0; padding: 0; min-height: 100vh; top: 0; background: #191c1f;}
.backgroundFull .item {margin: 0; padding: 0; width: 100%; display: inline-block; vertical-align: top; position: relative; overflow: hidden; min-height: 100vh;}
.backgroundFull .item > figure {margin: 0; padding: 0; backface-visibility: hidden; background-size: cover; background-position: top center; background-repeat: no-repeat; left: 0px; position: absolute; top: 0px; width: 100%; min-height: 100vh; z-index: 1;}
.backgroundFull .item a {text-decoration: none;}
.backgroundFull .overlay {margin: 0; padding: 0; min-height: 100vh; width: 100%; z-index: 2; position: absolute; top: 0; left: 0; background: linear-gradient(rgba(0,0,0, 0.7), rgba(0,0,0, 0.3));}
.behind {margin: 0; padding: 0; min-height: 100vh; width: 100%; z-index: 0; position: absolute; top: 0; left: 0; background: rgba(0,0,0,1);}
   
.backgroundSlim {margin: 0; padding: 0;  height: 45vh; min-height: 450px; top: 0; background: #191c1f;}
.backgroundSlim .item.desktop {display: none;}
.backgroundSlim .item {margin: 0; padding: 0; width: 100%; display: inline-block; vertical-align: top; position: relative; overflow: hidden; height: 45vh; min-height: 450px;}
.backgroundSlim .item > figure {margin: 0; padding: 0; backface-visibility: hidden; background-size: cover; background-position: top center; background-repeat: no-repeat; left: 0px; position: absolute; top: 0px; width: 100%; height: 45vh; min-height: 450px; z-index: 0;}
.backgroundSlim .item a {text-decoration: none;}
.backgroundSlim .overlay {margin: 0; padding: 0; min-height: 20vh; width: 100%; z-index: 1; position: absolute; top: 0; left: 0; background: linear-gradient(rgba(0,0,0, 0.7), rgba(0,0,0, 0));}

@media screen and (min-width: 700px) {
	.backgroundSlim .item.mobile {display: none;}
	.backgroundSlim .item.desktop {display: block;}
}


@media screen and (max-width: 700px) {
	.backgroundSlim {margin: 0; padding: 0; height: 40vh; min-height: 350px;}
	.backgroundSlim .item {height: 40vh; min-height: 350px;}
	.backgroundSlim .item > figure {height: 40vh; min-height: 350px;}
	.backgroundSlim .overlay {min-height: 30vh;}
	
	.backgroundSlim .item.mobile {display: block;}
	.backgroundSlim .item.desktop {display: none;}
}


/* ==========================================================================
   Main
   ========================================================================== */
   
.main {}


/* ==========================================================================
   Banner
   ========================================================================== */
   
.banner {margin: 0; padding: 0; min-height: 90vh; max-height: 90vh; top: 0; background: #191c1f;}
.banner .item {margin: 0; padding: 0; width: 100%; display: inline-block; vertical-align: top; position: relative; overflow: hidden; min-height: 90vh; max-height: 90vh;}
.banner .item.desktop {display: none;}
.banner .item > figure {margin: 0; padding: 0; backface-visibility: hidden; background-size: cover; background-position: top center; background-repeat: no-repeat; left: 0px; position: absolute; top: 0px; width: 100%; min-height: 90vh; z-index: 0;}
.banner .item a {text-decoration: none;}

.banner .overlay {margin: 0; padding: 0; min-height: 20vh; width: 100%; z-index: 299; position: absolute; top: 0; left: 0; background: linear-gradient(rgba(0,0,0, 0.7), rgba(0,0,0, 0));}

.bannerNav .container {text-align: center;}
.bannerNav nav ul {margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center; height: 10vh; list-style: none; font-size: 1.25em;}
.bannerNav nav ul li {margin: 0; padding: 0; flex: 1;}
.bannerNav nav ul li a {text-decoration: none; display: block; height: 10vh; display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center; line-height: 1.2; color: rgba(0,0,0,0.8); letter-spacing: 0.05em;}
.bannerNav nav ul li a:hover {color: rgba(0,0,0,1); background: #ffffff;}

@media screen and (min-width: 500px) {
	.banner .item.mobile {display: none;}
	.banner .item.desktop {display: block;}
}

@media screen and (max-width: 1200px) {
	.banner {min-height: 100vh; max-height: 100vh;}
	.banner .item {min-height: 100vh; max-height: 100vh;}
	.banner .item > figure {min-height: 100vh;}
	.bannerNav {display: none;}
	.banner .overlay {min-height: 30vh;}
}

/*
.banner {margin: 0; padding: 0; min-height: 90vh; max-height: 90vh; top: 0; background: #191c1f;}
.banner .item {margin: 0; padding: 0; width: 100%; display: inline-block; vertical-align: top; position: relative; overflow: hidden; min-height: 90vh; max-height: 90vh;}
.banner .item.desktop {display: none;}
.banner .item > figure {margin: 0; padding: 0; backface-visibility: hidden; background-size: cover; background-position: top center; background-repeat: no-repeat; left: 0px; position: absolute; top: 0px; width: 100%; min-height: 90vh; z-index: 0;}
.banner .item a {text-decoration: none;}

.banner .overlay {margin: 0; padding: 0; min-height: 20vh; width: 100%; z-index: 299; position: absolute; top: 0; left: 0; background: linear-gradient(rgba(0,0,0, 0.7), rgba(0,0,0, 0));}

.bannerNav .container {text-align: center;}
.bannerNav nav ul {margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center; height: 10vh; list-style: none; font-size: 1.25em;}
.bannerNav nav ul li {margin: 0; padding: 0; flex: 1;}
.bannerNav nav ul li a {text-decoration: none; display: block; height: 10vh; display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center; line-height: 1.2; color: rgba(0,0,0,0.8); letter-spacing: 0.05em;}
.bannerNav nav ul li a:hover {color: rgba(0,0,0,1); background: #ffffff;}

@media screen and (min-width: 500px) {
	.banner .item.mobile {display: none;}
	.banner .item.desktop {display: block;}
}

@media screen and (max-width: 1200px) {
	.banner {min-height: 100vh; max-height: 100vh;}
	.banner .item {min-height: 100vh; max-height: 100vh;}
	.banner .item > figure {min-height: 100vh;}
	.bannerNav {display: none;}
	.banner .overlay {min-height: 30vh;}
}
*/


/* ==========================================================================
   Timetable
   ========================================================================== */
   
.timetable {margin: 0; padding: 2em 0 0 0; display: flex; flex-direction: row; justify-content: space-between; align-items: stretch; flex-wrap: wrap;}
.availableClasses .timetable {justify-content: flex-start;}
.timetable .timetableHeader {margin: 0 0 2em 0; padding: 0; background: rgba(112,112,112,1); width: 100%;}
.timetable .timetableHeader h2 {margin: 0; padding: 0.75em; color: #FFD667; line-height: 1; font-size: 1.5em;}

.timetable .item {margin: 0 0 3em 0; padding: 0; border-bottom: 2px solid #FFD667; width: 48.25%; display: flex;}
.timetable .item .itemContent {margin: 0; padding: 0; display: flex; flex-direction: column; width: 100%;}

.timetable .item .itemContent .itemHeader {margin: 0 0 1em 0;}
.timetable .item .itemContent .itemHeader h3 {margin: 0; padding: 10px 15px; font-size: 2em; line-height: 1; color: #707070; background: rgba(255,214,103,1);}
.timetable .item .itemContent .itemHeader h4 {margin: 0; padding: 10px 15px; font-size: 1em; line-height: 1; color: #FFD667; background: rgba(112,112,112,1);}

.timetable .item .itemDuration {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff;}
.timetable .item .itemDuration span {padding: 0 1em; line-height: 1.2;}
.timetable .item .itemDuration::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f2f2'; background: rgba(112,112,112,1); text-align: center;}

.timetable .item .itemTime {margin: 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff;}
.timetable .item .itemTime span {padding: 0 1em; line-height: 1.2;}
.timetable .item .itemTime::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content:'\f017'; background: rgba(112,112,112,1); text-align: center;}

.timetable .item .itemHeader {flex: 1 0 auto;}

.timetable .item .itemDirections {margin: 1em 0 1em 0; padding: 0; display: flex; color: #ffffff;}
.timetable .item .itemDirections a {padding: 0.5em 0.75em; color: #ffffff; text-decoration: none; text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1em; background: rgba(237,107,6,1); display: flex; align-content: center; line-height: 25px; border-radius: 0.25em;}
.timetable .item .itemDirections a span {padding: 0 0 0 0.5em;}
.timetable .item .itemDirections a::before {margin: 0; padding: 0; color: #ffffff; font-size: 25px; line-height: 25px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f3c5'; text-align: center;}
.timetable .item .itemDirections a:hover {background: rgba(237,107,6,0.8);}


.timetableLink {margin: 0; padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.timetableLink a {padding: 1em 0; text-decoration: none; background: rgba(112,112,112,0.9); flex-grow: 1; text-align: center; width: 100%;}
.timetableLink a span {padding: 0 0 0 0.5em; color: #FFD667; text-decoration: none; text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; line-height: 40px; font-size: 1.5em;}
.timetableLink a::before {margin: 0; padding: 0; color: #FFD667; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 400; content:'\f073'; text-align: center;}
.timetableLink a:hover {background: rgba(112,112,112,1);}


/* ==========================================================================
   Announcement
   ========================================================================== */

.announcement {margin: 0; padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-decoration: none; background: rgba(112,112,112,0.9); flex-grow: 1; text-align: center; width: 100%;}
.announcement span {padding: 1em; color: #FFD667; text-decoration: none; text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; line-height: 40px; font-size: 1.5em;}


/* ==========================================================================
   Available Classes
   ========================================================================== */
   
.availableClasses {margin: 0; padding: 2em 0 0 0;}
.availableClasses .availableClassesHeader {padding: 0 0 1em 0;}
.availableClasses .availableClassesHeader h2 {margin: 0; padding: 0; font-size: 2.5em;}

.availableClasses .timetable {margin: 0; padding: 0 0 0 0;}
.availableClasses .timetable .item {margin: 0 0 2em 0; padding: 0; border-bottom: 2px solid #FFD667; width: 31%; display: flex;}
.availableClasses .timetable .item.odd {margin: 0 0 2em 0;}
.availableClasses .timetable .item:nth-child(3n+2) {margin: 0 3.5% 2em 3.5%;}

.availableClasses .timetable .item .itemContent .itemHeader h3 {margin: 0; padding: 10px 15px; font-size: 2em; line-height: 1; color: #707070; background: rgba(255,214,103,1);}
.availableClasses .timetable .item .itemContent .itemHeader h4 {margin: 0; padding: 10px 15px; font-size: 1em; line-height: 1; color: #FFD667; background: rgba(112,112,112,1);}


@media screen and (max-width: 800px) { 
	.availableClasses .timetable .item {width: 48.25%;}
	.availableClasses .timetable .item:nth-child(3n+2) {margin: 0 0 2em 0;}
	.availableClasses .timetable .item.odd {margin: 0 3.5% 2em 0;}
}

@media screen and (max-width: 600px) { 
	.timetable .timetableHeader {margin: 0 0 1em 0;}
	
	.timetable {flex-direction: column;}
	.timetable .item {width: 100%;}
	.timetable .item.odd {margin: 0 0 2em 0;}
	
	.timetable .item .itemContent .itemHeader h3 {font-size: 1.5em;}
	
	.availableClasses .timetable .item {width: 100%;}
	.availableClasses .timetable .item.odd {margin: 0 0 2em 0;}
	.availableClasses .timetable .item .itemContent .itemHeader h3 {font-size: 1.5em;}
	
	.availableClasses .availableClassesHeader h2 {margin: 0; padding: 0; font-size: 2em;}
}


/* ==========================================================================
   Classes
   ========================================================================== */
   
.classes {margin: 0; padding: 0;}
.home .classes .contentHeader {display: none;}
.classes .listing {margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; width: 100%;}
.classes .listing .item {margin: 0 0 2em 0; width: 31%; vertical-align: top; position: relative; overflow: hidden; min-height: 275px; max-height: 275px;}
.classes .listing .item > a figure {margin: 0; padding: 0; backface-visibility: hidden; background-size: cover; background-position: top center; background-repeat: no-repeat; left: 0px; position: absolute; top: 0px; width: 100%; min-height: 275px; z-index: 0;}
.classes .listing .item:nth-child(3n+2) {margin: 0 3.5% 2em 3.5%;}
.classes .listing .item a {color: #FFD667; display: block;}
.classes .listing .item h3 {margin: 0; padding: 0; color: #FFD667; text-align: center;}

.classes .listing .item a .itemHeader {padding: 0.5em 0; position: absolute; height: 0; min-height: 70px; bottom: 0; background: rgba(112,112,112,0.8); display: flex; justify-content: center; align-items: center; width: 100%; transition: all 0.5s;}
.classes .listing .item a .itemHeader h3 {padding: 0 1em;}
.classes .listing .item a:hover .itemHeader {height: 100%; min-height: 100%; background: rgba(112,112,112,0.95);}


@media screen and (max-width: 900px) {
	.classes .listing .item {width: 48.25%;}
	.classes .listing .item:nth-child(3n+2) {margin: 0 0 2em 0;}
	.classes .listing .item:nth-child(odd) {margin: 0 3.5% 2em 0;}
}

@media screen and (max-width: 600px) {
	.classes .listing .item {width: 100%;}
	.classes .listing .item:nth-child(3n+2) {margin: 0 0 2em 0;}
	.classes .listing .item:nth-child(odd) {margin: 0 0 2em 0;}
}


/* ==========================================================================
   Content
   ========================================================================== */
   
.contentHeader {margin: 0 0 1em 0; padding: 0;}
.contentHeader .titles {margin: 0 0 0.75em 0;}
.contentHeader h2 {margin: 0; padding: 0; font-size: 2em; line-height: 1.25; color: rgba(237,107,6,1);}
.contentHeader h3 {margin: 0; padding: 0; font-size: 1.25em; line-height: 1.25; color: rgba(17,17,17,1);}
.contentHeader p {margin: 0; padding: 0; font-size: 1em; line-height: 1.25; color: rgba(17,17,17,1);}
.contentHeader p a {color: #111111; text-decoration: underline;}
.contentHeader p a:hover {text-decoration: none;}
.contentHeader .duration {margin: 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff; }
.contentHeader .duration span {padding: 0 1em;}
.contentHeader .duration::before {margin: 0; padding: 0; color: #FFFFFF; height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f2f2'; background: rgba(237,107,6,1); text-align: center;}

.content {margin: 0; padding: 0; text-align: justify; width: 100%;}
.content h1 {margin: 0; padding: 0; font-size: 2em; line-height: 1.2; letter-spacing: 0.1em;}
.content h2 {margin: 0; padding: 0.5em 0 0.5em 0; font-size: 1.75em; line-height: 1.2; letter-spacing: 0.1em;}
.content h3 {margin: 0; padding: 1em 0 0 0; line-height: 1.2; letter-spacing: 0.1em;}
.content h4 {margin: 0; padding: 1em 0 0.25em 0; line-height: 1.2; letter-spacing: 0.1em;}
.content h5 {margin: 0; padding: 0.5em 0 0 0; line-height: 1.2; letter-spacing: 0.1em;}
.content h6 {margin: 0; padding: 0.5em 0 0.25em 0; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.1em;}
.content ul {margin: 0; padding: 0.5em 0 1em 0; font-size: 1.1em; letter-spacing: 0.025em;}
.content ul li {margin: 0; padding: 0 0 0.5em 0.5em; list-style: none; line-height: 1.5; text-align: left; letter-spacing: 0.025em; display: flex; flex-direction: row;}
.content ul li ul {margin: 2em 0 0 0; padding: 0; display: block;}
.content ul li ul li {margin: 0; padding: 0 0 0.5em 0.5em; list-style: none; line-height: 1.5; text-align: left; letter-spacing: 0.025em; display: flex; flex-direction: row;}
.content ul li::before {padding-right: 1em; font-family: "Font Awesome 5 Free"; font-weight: 400; content: '\f192'; font-size: 1em; line-height: 1.5; color: rgba(112,112,112,1);}
.content ol {margin: 0; padding: 0.5em 0 1em 1.5em; font-size: 1.1em; letter-spacing: 0.025em;}
.content ol li { margin: 0; padding: 0 0 0.5em 0.3em; list-style: decimal; line-height: 1.5; text-transform: uppercase; text-align: left;}
.content img {margin: 0 0 0.75em 0;padding: 0; width: 100%;}
.content p {margin: 0; padding: 0.25em 0 0.5em 0; font-size: 1.1em; line-height: 1.4; letter-spacing: 0.025em;}
.content p em {margin: 0; padding: 0.25em 0 0.75em 0; font-size: 1.3em; line-height: 1.4; letter-spacing: 0.025em;}
.content strong {font-weight: 700; letter-spacing: 0.025em;}
.content strong span {font-weight: 700; letter-spacing: 0.025em;}
.content blockquote {margin: 1em 0 1em 0; padding: 2em; background: #ffffff; border-left: 5px solid rgba(237,107,6,1); display: flex; flex-direction: row;}
.content blockquote::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: '\f10d'; font-size: 3em; color: rgba(237,107,6,1);}
.content blockquote p {margin: 0; padding: 0 0 0 1em; font-size: 1.5em; line-height: 1.2;}
.content blockquote p br {margin: 0 0 0.5em 0; padding: 0 0 0.5em 0; display: block;}
.content blockquote p em {color: #ED6B06; font-size: 0.75em; font-weight: 300; font-style: normal;}
.content a {color: #ED6B06; text-decoration: none;}
.content p a {text-decoration: underline;}
.content a:hover {text-decoration: none;}

.link {margin: 1em 0 0 0; text-align: left;}
.link a {text-decoration: none;}
.link span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(237,107,6,1); border-radius: 0.25em;}
.link span a:hover {background: rgba(237,107,6,0.8);}

.detail {margin: 0; padding: 0 0 2em 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; width: 100%;}
.detail.full .detailContent {padding: 0 0 0 0; width: 100%;}
.detail .detailMedia {margin: 0; padding: 0; width: 31%;}
.detail.full .detailMedia {margin: 0; padding: 0; width: 100%;}
.detail .detailMediaVideo {margin: 0; padding: 0; width: 48.25%;}
.detail.full .detailMediaVideo {margin: 0; padding: 0; width: 100%;}
.detail .detailContent {margin: 0; padding: 0 0 0 3.5%; display: flex; flex-direction: column; width: 65.5%;}
.detail .detailContentFifty {margin: 0; padding: 0 0 0 3.5%; display: flex; flex-direction: column; width: 48.25%;} 
.detail.full .detailContent {padding: 0 0 0 0; width: 100%;}

.detail.right {flex-direction: row-reverse;}
.detail.right .detailContent {margin: 0; padding: 0 3.5% 0 0;}
.detail.right .detailContentFifty {margin: 0; padding: 0 3.5% 0 0;}
.detailImage {overflow: hidden;}
.detailImage img {transition: all 0.3s linear;}
.detailImage:hover img {transform: scale(1.05);}

.detailVideo {margin: 0 0 2em 0; padding: 0; text-align: center; position: relative; padding-bottom: 56.25%; /* 16:9 */ height: auto; display: block;}
.detailVideo iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 5px; display: block;}

@media screen and (max-width: 1050px) {
	.detail .detailMedia {width: 40%;}
	.detail .detailContent {width: 56.5%;}
}

@media screen and (max-width: 700px) {
	.detail {flex-direction: column;}
	.detail .detailMedia {margin: 0 0 1em 0; padding: 0; width: 100%;}
	.detail .detailMediaVideo {margin: 0 0 1em 0; width: 100%;}
	.detail .detailContent {padding: 0 0 0 0; display: flex; flex-direction: column; width: 100%;}
	.detail.right .detailContent {padding: 0 0 0 0;}
	.detail .detailContentFifty {padding: 0 0 0 0; width: 100%;}
	.detail.right .detailContentFifty {padding: 0 0 0 0;}
	.detailVideo {margin: 0 0 0 0;}
}

@media screen and (max-width: 600px) {
	.content blockquote {padding: 0.5em 1.5em 1.5em 1.5em; flex-direction: column;}
	.content blockquote p {padding: 0 0 0 0; font-size: 1.25em; text-align: left;}
}


/* ==========================================================================
   Forms
   ==========================================================================

#contact {margin: 0; padding:  0; z-index: 3; min-height: 100vh; display: flex; flex-direction: row; align-items: flex-end; justify-content: center; background: no-repeat; content:''; top: 0; position: absolute; width: 100%; text-align: center;}

.contactForm form {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: flex-start;}

.contactFormHeader {margin: 0; padding: 50px 0 0 0; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; letter-spacing: 0.025em;}
.contactFormHeader .content {display: flex; justify-content: center; align-content: flex-start; width: 100%; flex-direction: column;}
.contactFormHeader h2 {margin: 0 0 0.25em 0; padding: 0; font-size: 3em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.contactFormHeader h4 {margin: 0 0 0.75em 0; padding: 0; font-size: 1.15em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.contactFormHeader p {margin: 0; padding: 0; font-size: 1.1em; line-height: 1.2; font-weight: 100; display: block; letter-spacing: 0.025em;}

.contactFormArea {margin: 0 0 50px 0; text-align: left; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; color: #111111; letter-spacing: 0.025em; width: 65.5%;}

.contactForm .input label {padding: 0 0 0.25em 0; color: #111111; display: block; font-size: 1.1em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 300;}	
.contactForm .input label i {padding: 0 0 0.25em 0; color: #111111; font-size: 0.9em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 300;}	
.contactForm .input input {margin: 0 0 1.25em 0; padding: 0 3%; height: 60px; width: 94%; border: 1px solid #e5e5e5; display: block; line-height: 1; font-size: 1em; color: #111111; background: #e5e5e5; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border-radius: 5px; box-shadow: none;}	
.contactForm .input input::-webkit-input-placeholder,
.contactForm .input input::-moz-placeholder,
.contactForm .input input::placeholder-shown {color:#ffffff;}
.contactForm .input.address {display: none;}	
.contactForm .input input:hover {border: 1px solid #FFD667; color: #000; background: #ffffff;}	
.contactForm .input input:focus {border: 1px solid #FFD667; color: #000; background: #ffffff;}
.contactForm .select label {padding: 0 0 0.25em 0; color: #111111; display: block; font-size: 1.1em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300;}	
.contactForm .select label i {padding: 0 0 0.25em 0; color: #111111; font-size: 0.9em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300;}	
.contactForm .select .dropdown {margin: 0 0 1.25em 0; position: relative; background: #e5e5e5; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 5px; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear;}
.contactForm .select .dropdown:after {content: '\f078'; font-family: "Font Awesome 5 Free"; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-size: 1em; font-weight: 900; height: 1em; line-height: 1em; text-rendering: auto; width: 1em; -webkit-font-smoothing: antialiased; position: absolute; right: 1em; top: 40%; z-index: 1; pointer-events: none; color: #707070;}
.contactForm .select select {margin: 0; padding: 0 2em; height: 60px; width: 100%; border: none; display: block; font-size: 1.1em; color: #555; background: transparent; box-shadow: none; background-image: none; -webkit-appearance: none; line-height: 1;}	
.contactForm .select .dropdown:hover {border: 1px solid #FFD667; color: #000; background: #ffffff;}
.contactForm .select .dropdown:focus {border: 1px solid #FFD667; color: #000; background: #ffffff;}
.contactForm .textarea label {padding: 0 0 0.25em 0; color: #111111; display: block; font-size: 1.1em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300;}	
.contactForm .textarea textarea {margin: 0 0 1.25em 0; padding: 2%; width: 96%; border: 1px solid #e5e5e5; display: block; font-size: 1em; color: #000; background: #e5e5e5; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border-radius: 5px;}	
.contactForm .textarea textarea:hover {border: 1px solid #FFD667; color: #000; background: #ffffff;}	
.contactForm .textarea textarea:focus {border: 1px solid #FFD667; color: #000; background: #ffffff;}
.contactForm .checkbox {margin: 0 0 1em 0;}
.contactForm .checkbox label {padding: 0 0 0 0.5em; color: #111111; font-size: 1em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.contactForm .details {margin: 0 0 2em 0;}
.contactForm .submit input {margin: 0 0 0 0; padding: 0.75em 1.5em 0.75em 1.5em; border-radius: 0.2em; display: block; font-size: 1.25em; color: #707070; background: rgba(255,214,103,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer;}	
.contactForm .submit input:hover {color: #ffffff; background: rgba(237,107,6,1);}	
.contactForm .submit input:focus {color: #ffffff; background: rgba(237,107,6,1);}

.contactForm .contactFormFields {margin-bottom: 1em; padding: 2em; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; background: rgba(255,255,255,0.8); border-radius: 5px;}
.contactForm .contactFormFields .left {margin-bottom: 2em; width: 48%;}
.contactForm .contactFormFields .right {width: 48%;}


.contactForm .contactFormHeader {width: 31%; margin-right: 3.5%;}
.contactForm .contactFormHeader .content {margin: 0 auto; vertical-align: top;}
.contactForm .contactFormSuccess .content {margin: 0; vertical-align: top; display: inline-block; width: 80%;}
.contactForm .contactFormHeader i.fa {color: #111111; vertical-align: top; display: inline-block;}
.contactForm .contactFormSuccess i.fa {color: #111111; vertical-align: top; display: inline-block;}

@media screen and (max-width: 1100px) {
	.contactForm form {display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: flex-start;}
	.contactForm .contactFormHeader {width: 100%; margin-right: 0; margin-bottom: 30px;}
	.contactFormArea {width: 100%;}
}

@media screen and (max-width: 700px) {
	#contact {margin: 120px 0 0 0;}
}

@media screen and (max-width: 640px) {
	.contactForm {margin: 0 auto 0 auto; width: 90%;}
	.contactForm .contactFormFields {margin-bottom: 1em; width: 100%; display: flex; flex-direction: column; flex-wrap: wrap;}
	.contactForm .contactFormFields .left {margin-bottom: 0; width: 100%;}
	.contactForm .contactFormFields .right {margin-bottom: 2em; width: 100%;}
	.contactForm  p {font-weight: 300;}
	.contactForm .input label {font-weight: 300;}
	.contactForm .input input {font-weight: 300;}
	.contactForm .select label {font-weight: 300;}
	.contactForm .select select {font-weight: 300;}
	.contactForm .textarea label {font-weight: 300;}
	.contactForm .textarea textarea {font-weight: 300;}
	
	.contactForm .submit input {width: 100%;}
}

@media screen and (max-width: 480px) {
	.contactForm .contactFormHeader .content {font-size: 80%;}
	.contactForm .contactFormSuccess .content {font-size: 80%;}
	.contactForm .contactFormHeader i.fa-3x {font-size: 2em;}
	.contactForm .contactFormSuccess i.fa-3x {font-size: 2em;}
	.contactForm  p {text-align: left; font-weight: 300;}
}

*/


/* ==========================================================================
   Forms
   ========================================================================== */

#contact .container {padding: 3em 0;}

.contactForm {margin: 0 0 0 0; padding: 0; text-align: left; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; color: #111111; letter-spacing: 0.025em; width: 100%;}
.contactForm  h2 {margin: 0 0 0.25em 0; padding: 0; font-size: 2em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.contactForm  h4 {margin: 0 0 0.75em 0; padding: 0; font-size: 1.15em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.contactForm  p {margin: 0; padding: 0; font-size: 1.1em; line-height: 1.2; font-weight: 100; display: block; letter-spacing: 0.025em;}
.contactForm .input label {padding: 0; color: #111111; display: block; font-size: 1.1em; font-weight: 100; line-height: 1;}	
.contactForm .input label i {padding: 0; color: #111111; font-size: 0.9em; font-weight: 100; font-style: normal;}	
.contactForm .input input {margin: 0 0 1.5em 0; padding: 0; height: 40px; width: 100%; border: none; border-radius: 0; border-bottom: 2px solid #111111; display: block; line-height: 1; font-size: 1em; color: #111111; background: none; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; box-shadow: none;}	
.contactForm .input input::-webkit-input-placeholder,
.contactForm .input input::-moz-placeholder,
.contactForm .input input::placeholder-shown {color:#707070;}
.contactForm .input.address {display: none;}	
.contactForm .input input:hover {border-bottom: 2px solid #FFD667; color: #111111;}	
.contactForm .input input:focus {border-bottom: 2px solid #FFD667; color: #111111;}
.contactForm .select label {padding: 0; color: #111111; display: block; font-size: 1.1em; font-style: normal; font-weight: 100; line-height: 1;}	
.contactForm .select label i {padding: 0; color: #111111; font-size: 0.9em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.contactForm .select .dropdown {margin: 0 0 1.5em 0; position: relative; background: none; overflow: hidden; border: none; border-bottom: 2px solid #111111; border-radius: 0; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear;}
.contactForm .select .dropdown:after {content: '\f078'; font-family: "Font Awesome 5 Free"; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-size: 1em; font-weight: 900; height: 1em; line-height: 1em; text-rendering: auto; width: 1em; -webkit-font-smoothing: antialiased; position: absolute; right: 0.5em; top: 0.75em; z-index: 1; pointer-events: none; color: #111111;}
.contactForm .select select {margin: 0; padding: 0; height: 40px; width: 100%; border: none; display: block; font-size: 1.1em; color: #111111; background: transparent; box-shadow: none; background-image: none; -webkit-appearance: none; line-height: 1;}	
.contactForm .select .dropdown:hover {border-bottom: 2px solid #FFD667; color: #111111;}
.contactForm .select .dropdown:focus {border-bottom: 2px solid #FFD667; color: #111111;}
.contactForm .textarea label {padding: 0 0; color: #111111; display: block; font-size: 1.1em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.contactForm .textarea textarea {margin: 0; padding: 0; width: 100%; border: none; border-bottom: 2px solid #111111; display: block; font-size: 1em; color: #111111; background: none; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border-radius: 0;}	
.contactForm .textarea textarea:hover {border-bottom: 2px solid #FFD667;}	
.contactForm .textarea textarea:focus {border-bottom: 2px solid #FFD667;}
.contactForm .checkbox {margin: 0 0 1em 0;}
.contactForm .checkbox label {padding: 0 0 0 0.5em; color: #4a4644; font-size: 1em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.contactForm .details {margin: 0 0 2em 0;}
.contactForm .submit input {margin: 0 0 0 0; padding: 1em 1.5em 1em 1.5em; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer;}
.contactForm .submit input:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.contactForm .submit input:focus {color: #ffffff; background: rgba(237,107,6,0.8);}

.contactForm .contactFormFields {margin-bottom: 1em; width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start;}
.contactForm .contactFormFields .left {margin-bottom: 2em; width: 48%;}
.contactForm .contactFormFields .right {width: 48%;}

.contactForm .contactFormHeader {margin-bottom: 3em; border-bottom: 2px solid #111111; width: 100%;}
.contactForm .contactFormHeader .content {margin: 0 0 2em 0; vertical-align: top; display: inline-block; width: 100%;}
.contactForm .contactFormSuccess .content {margin: 0 0 2em 0; vertical-align: top; display: inline-block; width: 100%;}
.contactForm .contactFormHeader i.fa {color: #111111; vertical-align: top; display: inline-block;}
.contactForm .contactFormSuccess i.fa {color: #111111; vertical-align: top; display: inline-block;}

@media screen and (max-width: 900px) {
	.contactForm .contactFormHeader .content {margin: 0 0 2em 0; display: inline-block; width: 80%;}
	.contactForm .contactFormSuccess .content {margin: 0 0 2em 0; display: inline-block; width: 80%;}
}

@media screen and (max-width: 640px) {
	.contactForm {margin: 0 auto 0 auto; width: 90%;}
	.contactForm .contactFormFields {margin-bottom: 1em; width: 100%; display: flex; flex-direction: column; flex-wrap: wrap;}
	.contactForm .contactFormFields .left {margin-bottom: 0; width: 100%;}
	.contactForm .contactFormFields .right {margin-bottom: 2em; width: 100%;}
	.contactForm  p {font-weight: 300;}
	.contactForm .input label {font-weight: 300;}
	.contactForm .input input {font-weight: 300;}
	.contactForm .select label {font-weight: 300;}
	.contactForm .select select {font-weight: 300;}
	.contactForm .textarea label {font-weight: 300;}
	.contactForm .textarea textarea {font-weight: 300;}
	
	.contactForm .submit input {width: 100%;}
}

@media screen and (max-width: 480px) {
	.contactForm .contactFormHeader .content {font-size: 80%;}
	.contactForm .contactFormSuccess .content {font-size: 80%;}
	.contactForm .contactFormHeader i.fa-3x {font-size: 2em;}
	.contactForm .contactFormSuccess i.fa-3x {font-size: 2em;}
	.contactForm  p {text-align: left; font-weight: 300;}
}


/* ==========================================================================
   Customer Area
   ========================================================================== */

.customerArea {display: flex; flex-direction: row; justify-content: flex-start; align-content: center; width: 100%;}
.customerArea .customerAreaMain {width: 65%; display: flex; flex-direction: column; justify-content: center; align-content: center; align-items: stretch; flex-wrap: wrap;}
.customerArea .customerAreaMain .profile {margin-bottom: 2em; width: 100%; border-top: 0.2em solid #ED6B06; background: #f5f5f5;}
.customerArea .customerAreaMain .profile .listing {padding: 2em;}
.customerArea .customerAreaMain .orders {width: 100%; border-top: 0.2em solid #ED6B06; background: #ffffff;}
.customerArea .customerAreaMain .orders .listing .item {padding: 2em; border-bottom: 0.2em solid #d5d5d5;}
.customerArea .customerAreaMain .orders .listing .item:nth-child(even) {background: #f5f5f5;}
.customerArea .customerAreaMain .orders .listing .noResults {padding: 2em; background: #f5f5f5;}
.customerArea .customerAreaMain .membersForm {padding: 2em; border-top: 0.2em solid #ED6B06; background: #FFFFFF; width: 100%; box-sizing: border-box;}
.customerArea .customerAreaSidebar {margin-left: 5%; width: 30%;}

.customerArea .customerAreaMain .listing .listingHeader {margin: 0; padding: 0 0 1em 0;}
.customerArea .customerAreaMain .listing .listingHeader h3 {margin: 0; padding: 0; font-size: 1.5em;}
.customerArea .customerAreaMain .listing .item .itemHeader h4 {margin: 0 0 0 0; padding: 0; font-size: 1.2em; color: #ED6B06;}
.customerArea .customerAreaMain .orders .listing .listingHeader {padding: 2em; border-bottom: 0.2em solid #d5d5d5;}
.customerArea .customerAreaMain .listing .item ul {margin: 0 0 1em 0; padding: 0;}
.customerArea .customerAreaMain .listing .item ul li {margin: 0; padding: 0; list-style: none;}

.customerArea .customerAreaMain .listing span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(237,107,6,1); border: none; border-radius: 0.25em; cursor: pointer; display: inline-block;}
.customerArea .customerAreaMain .listing span a:hover {background: rgba(237,107,6,0.8);}

.customerArea .customerAreaSidebar .sidebarNav {margin: 0; padding: 0; border-top: 0.2em solid #111111; background: #ffffff;}
.customerArea .customerAreaSidebar .sidebarNav ul {margin: 0; padding: 0; display: flex; flex-direction: column;}
.customerArea .customerAreaSidebar .sidebarNav ul li {margin: 0; padding: 0; list-style: none; border-bottom: 1px solid #d5d5d5;}
.customerArea .customerAreaSidebar .sidebarNav ul li a {margin: 0; padding: 0.75em; list-style: none; display: block; color: #111111; font-weight: 300; border-left: 0.3em solid #ffffff;}
.customerArea .customerAreaSidebar .sidebarNav ul li a:hover {border-left: 0.3em solid #111111; color: #ED6B06;}
.customerArea .customerAreaSidebar .sidebarNav ul li.selected a {border-left: 0.3em solid #ED6B06; color: #ED6B06;}

@media screen and (max-width: 800px) {
	.customerArea {flex-direction: column;}
	.customerArea .customerAreaMain {width: 100%; margin-bottom: 2em;}
	.customerArea .customerAreaSidebar {margin-left: 0%;width: 100%;}
}


/* ==========================================================================
   Shop
   ========================================================================== */
   
.shop {margin: 0; padding: 0;}
.shop .listing {margin: 0; padding: 0;}

.shop .shopDayHeader {margin: 0 0 2em 0; padding: 0; background: rgba(112,112,112,1); width: 100%;}
.shop .shopDayHeader h2 {margin: 0; padding: 0.75em; color: #FFD667; line-height: 1; font-size: 1.5em;}

.shop .listing {display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap; width: 100%;}

.shop .listing .itemHeader {margin: 0; padding: 0;}
.shop .listing .itemFooter {margin: 0; padding: 0;}

.shop .listing .item {margin: 0 0 2em 0; padding: 0 0 2em 0; display: flex; flex-direction: column; border-bottom: 2px solid #FFD667; width: 48.75%;}
.shop .listing .item h3 {margin: 0; padding: 0; font-size: 2em;}

.shop .listing .item .itemHeader {margin: 0 0 1em 0;}
.shop .listing .item .itemHeader h3 {margin: 0; padding: 10px 15px; font-size: 2em; line-height: 1; color: #707070; background: rgba(255,214,103,1);}
.shop .listing .item .itemHeader h4 {margin: 0; padding: 10px 15px; font-size: 1em; line-height: 1; color: #FFD667; background: rgba(112,112,112,1);}

.shop .listing .item .itemTop {flex: 1 0 auto;}
.shop .listing .item .itemDetail {display: flex; flex-direction: row; justify-content: space-between; align-content: stretch; align-items: flex-end; width: 100%;}
.shop .listing .item .itemDetail .footerContent {width: 30%; min-width: 200px;}
.shop .listing .item .itemDetail .priceArea {padding: 0.5em; display: flex; flex-direction: column; justify-content: flex-end; align-content: center; align-items: flex-end; border: 1px solid #f5f5f5; border-radius: 0.2em; background: #ffffff; position: relative;}
.shop .listing .item .itemDetail .classInfo {width: 65%; margin-right: 5%;}

.shop .listing .item .itemDetail .from {margin: 0 0 0.25em 0; text-align: center; width: 100%;}

.shop .listing .item .itemDetail .price {margin: 0 0 0.5em 0; padding: 0.25em 0; width: 100%; text-align: center; border-radius: 0.2em; background: #f5f5f5; min-height: 80px; display: flex; flex-direction: column; justify-content: center; align-content: center;}
.shop .listing .item .itemDetail .price h4 {margin: 0; padding: 0.5em 0; color: #111111; font-size: 2.5em; line-height: 1;}

.shop .listing .item .itemDetail .sale {margin: 0 0 0.5em 0; padding: 0.25em 0; width: 100%; text-align: center; border-radius: 0.2em; background: #f5f5f5; min-height: 80px; display: flex; flex-direction: column; justify-content: center; align-content: center;}
.shop .listing .item .itemDetail .sale h4 {margin: 0; padding: 0; color: #ED6B06; font-size: 2.5em; line-height: 1;}
.shop .listing .item .itemDetail .sale h5 {margin: 0; padding: 0; color: #707070; font-size: 1.5em; line-height: 1; text-decoration: line-through;}

.shop .listing .item .itemDetail .variant {margin: 0 0 1em 0; padding: 0; position: relative; background: none; overflow: hidden; border: none; border-bottom: 2px solid #111111; border-radius: 0; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear;}
.shop .listing .item .itemDetail .variant:after {content: '\f078'; font-family: "Font Awesome 5 Free"; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-size: 1em; font-weight: 900; height: 1em; line-height: 1em; text-rendering: auto; width: 1em; -webkit-font-smoothing: antialiased; position: absolute; right: 0.5em; top: 0.75em; z-index: 1; pointer-events: none; color: #111111;}
.shop .listing .item .itemDetail select {margin: 0; padding: 0 0 0 10px; height: 40px; width: 100%; border: none; display: block; font-size: 1.1em; color: #111111; background: transparent; box-shadow: none; background-image: none; -webkit-appearance: none; -moz-appearance: none; line-height: 1; cursor: pointer;}	
.shop .listing .item .itemDetail .variant:hover {border-bottom: 2px solid #FFD667; color: #111111;}
.shop .listing .item .itemDetail .variant:focus {border-bottom: 2px solid #FFD667; color: #111111;}

.shop .listing .item .itemDescription {margin: 0 0 5px 0; padding: 0 15px; background: #ffffff; min-height: 40px; display: flex; align-items: center;}
.shop .listing .item .itemDescription h4 {margin: 0; padding: 0;}
   
.shop .listing .item .itemDuration {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff;}
.shop .listing .item .itemDuration span {padding: 0 1em; line-height: 1.2;}
.shop .listing .item .itemDuration::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f2f2'; background: rgba(112,112,112,1); text-align: center;}

.shop .listing .item .itemTime {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff;}
.shop .listing .item .itemTime span {padding: 0 1em; line-height: 1.2;}
.shop .listing .item .itemTime span strong {padding-right: 0.25em; font-family: "cronos-pro",sans-serif; font-style: normal; font-weight: 600; font-size: 1.25em;}
.shop .listing .item .itemTime::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content:'\f017'; background: rgba(112,112,112,1); text-align: center;}

.shop .listing .item .itemDate {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff;}
.shop .listing .item .itemDate span {margin: 0 0 5px 0;padding: 0 1em; line-height: 1.2;}
.shop .listing .item .itemDate::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content:'\f073'; background: rgba(112,112,112,1); text-align: center;}

.shop .listing .item .itemWeeks {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff;}
.shop .listing .item .itemWeeks span {padding: 0 1em; line-height: 1.2; font-weight: 700;}
.shop .listing .item .itemWeeks::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f3ff'; background: rgba(112,112,112,1); text-align: center;}   

.shop .listing .item .noStock {margin: 0 0 0 0; padding: 1em 0 1em 0; width: 100%; border-radius: 0.2em; color: #777777; text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; border: none; background: #f5f5f5; text-align: center;}
.shop .listing .item .noStock span {font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em;}

.shop .listing .item .submit {width: 100%; display: flex; text-align: center;}
.shop .listing .item .submit input {margin: 0 0 0 0; padding: 1em 0 1em 0; width: 100%; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer;}
.shop .listing .item .submit input:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.shop .listing .item .submit input:focus {color: #ffffff; background: rgba(237,107,6,0.8);}
.shop .listing .item .submit a {margin: 0 0 0 0; padding: 1em 0 1em 0; width: 100%; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer;}
.shop .listing .item .submit a:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.shop .listing .item .submit a:focus {color: #ffffff; background: rgba(237,107,6,0.8);}

.shop .column {display: flex; flex-direction: column; justify-content: space-between; flex-wrap: wrap; width: 100%;}

.shop .column .itemHeader {margin: 0; padding: 0;}
.shop .column .itemFooter {margin: 0; padding: 0;}

.shop .column .item {margin: 0 0 2em 0; padding: 1em 1em 1em 3em; display: flex; flex-direction: row; align-content: stretch; align-items: center; width: 100%; background: rgba(255,214,103,0.7); border-radius: 0.2em; box-sizing: border-box;}
.shop .column .item h3 {margin: 0; padding: 0; font-size: 2em;}

.shop .column .item .itemTop {width: 55%; display: flex; flex-direction: row;}
.shop .column .item .itemTop::before {margin: 0 25px 0 0; padding: 0; color: #707070; height: 60px; width: 60px; min-width: 60px; font-size: 60px; line-height: 60px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f3ff'; text-align: center; transform: rotate(-10deg);}   
.shop .column .item .itemHeader {margin: 0;}
.shop .column .item .itemHeader h3 {margin: 0; padding: 0; font-size: 3em; line-height: 1; color: #707070;}
.shop .column .item .itemHeader p {margin: 0; padding: 0; font-size: 1em; line-height: 1; color: #707070;}
 
.shop .column .item .itemDetail {margin-left: 5%; padding: 0.5em; display: flex; flex-direction: row; justify-content: flex-end; align-content: stretch; align-items: flex-end; width: 40%; background: #ffffff; border-radius: 0.2em;}
.shop .column .item .itemDetail .priceArea {margin-right: 5%; display: flex; flex-direction: column; justify-content: flex-end; align-content: center; align-items: flex-end; background: #ffffff; position: relative; width: 45%;}

.shop .column .item .itemDetail .from {margin: 0 0 0.25em 0; text-align: center; width: 100%;}
 
.shop .column .item .itemDetail .price {margin: 0; padding: 0.25em 0; width: 100%; text-align: center; border-radius: 0.2em; background: #f5f5f5; min-height: 80px; display: flex; flex-direction: column; justify-content: center; align-content: center;}
.shop .column .item .itemDetail .price h4 {margin: 0; padding: 0.5em 0; color: #111111; font-size: 2.5em; line-height: 1;}
 
.shop .column .item .itemDetail .sale {margin: 0 0 0.5em 0; padding: 0.25em 0; width: 100%; text-align: center; border-radius: 0.2em; background: #f5f5f5; min-height: 80px; display: flex; flex-direction: column; justify-content: center; align-content: center;}
.shop .column .item .itemDetail .sale h4 {margin: 0; padding: 0; color: #ED6B06; font-size: 2.5em; line-height: 1;}
.shop .column .item .itemDetail .sale h5 {margin: 0; padding: 0; color: #707070; font-size: 1.5em; line-height: 1; text-decoration: line-through;}

.shop .column .item .itemDetail .variant {margin: 0 0 1em 0; padding: 0; position: relative; background: none; overflow: hidden; border: none; border-bottom: 2px solid #111111; border-radius: 0; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear;}
.shop .column .item .itemDetail .variant:after {content: '\f078'; font-family: "Font Awesome 5 Free"; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-size: 1em; font-weight: 900; height: 1em; line-height: 1em; text-rendering: auto; width: 1em; -webkit-font-smoothing: antialiased; position: absolute; right: 0.5em; top: 0.75em; z-index: 1; pointer-events: none; color: #111111;}
.shop .column .item .itemDetail select {margin: 0; padding: 0 0 0 10px; height: 40px; width: 100%; border: none; display: block; font-size: 1.1em; color: #111111; background: transparent; box-shadow: none; background-image: none; -webkit-appearance: none;  -moz-appearance: none; line-height: 1; cursor: pointer;}	
.shop .column .item .itemDetail .variant:hover {border-bottom: 2px solid #FFD667; color: #111111;}
.shop .column .item .itemDetail .variant:focus {border-bottom: 2px solid #FFD667; color: #111111;}
 
.shop .column .item .submit {width: 55%;}
.shop .column .item .submit input {margin: 0 0 0 0; padding: 1em 0 1em 0; width: 100%; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer;}
.shop .column .item .submit input:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.shop .column .item .submit input:focus {color: #ffffff; background: rgba(237,107,6,0.8);} 
.shop .column .item .submit a {margin: 0 0 0 0; padding: 1em 0 1em 0; width: 100%; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer; display: flex; justify-content: center;}
.shop .column .item .submit a:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.shop .column .item .submit a:focus {color: #ffffff; background: rgba(237,107,6,0.8);}


@media screen and (max-width: 1100px) {
	.shop .listing .item .itemTime span strong {display: block;}
	
	.shop .column .item .itemTop {width: 50%;}
	.shop .column .item .itemDetail {width: 45%;}
	
	.shop .column .item .itemHeader h3 {font-size: 2em;}
}

@media screen and (max-width: 900px) {
	.shop .listing .item {width: 100%; padding: 0 0 1em 0; background: #f5f5f5;}
	.shop .listing .item .itemDetail {margin: 0 auto; display: flex; flex-direction: column; justify-content: flex-start; align-content: stretch; align-items: flex-end; width: 90%;}
	.shop .listing .item .itemDetail .classInfo {width: 100%; margin-right: 0; margin-bottom: 1em;}
	.shop .listing .item .itemDetail .footerContent {width: 100%;}
	
	.shop .column .item .itemTop {width: 40%;}
	.shop .column .item .itemDetail {width: 55%;}

}

@media screen and (max-width: 800px) {
	.shop .listing .item .itemHeader h3 {font-size: 1.5em;}
}

@media screen and (max-width: 700px) {
	.shop .column .item {padding: 2em 2em 1em 2em; flex-direction: column;}
	
	.shop .column .item .itemTop {width: 100%; margin-bottom: 1em;}
	.shop .column .item .itemDetail {width: 100%; margin-left: 0;}
}
	
@media screen and (max-width: 600px) {
	.shop .listing {display: flex; flex-direction: column; justify-content: flex-start; flex-wrap: wrap; width: 100%;}
	.shop .listing .item {width: 100%;}
}

@media screen and (max-width: 440px) {
	.shop .column .item .itemDetail {flex-direction: column;}
	.shop .column .item .itemDetail .priceArea {margin-right: 0; width: 100%;}
	.shop .column .item .submit {width: 100%;}
}

@media screen and (max-width: 370px) {
	.shop .column .item .itemTop {flex-direction: column; text-align: center;}
	.shop .column .item .itemTop::before {margin: 0 0 10px 0; width: 100%;}
}




/* ==========================================================================
   Members Forms
   ========================================================================== */

#contact .container {padding: 3em 0;}

.loginSignup {display: flex; flex-direction: row; justify-content: flex-end; align-content: center; flex-wrap: wrap; width: 100%;}
.loginSignup .existingCustomer {margin-right: 5%; width: 30%;}
.loginSignup .newCustomer {width: 65%;}

@media screen and (max-width: 1024px) {
	.loginSignup .existingCustomer {margin-right: 5%; width: 45%;}
	.loginSignup .newCustomer {width: 50%;}
}

@media screen and (max-width: 800px) {
	.loginSignup {flex-direction: column;} 
	.loginSignup .existingCustomer {margin-right: 0; margin-bottom: 2em; width: 100%;}
	.loginSignup .newCustomer {width: 100%;}
}

.loginSignup .existingCustomer .membersForm {padding: 2em; border-top: 0.2em solid #ED6B06; background: #F5F5F5;}
.loginSignup .existingCustomer .loggedIn {padding: 2em; border-top: 0.2em solid #ED6B06; background: #F5F5F5;}
.loginSignup .newCustomer .registered {margin: 0 0 2em 0;padding: 2em; border-top: 0.2em solid #ED6B06; background: #FFFFFF;}
.loginSignup .newCustomer .membersForm {padding: 2em; border-top: 0.2em solid #ED6B06; background: #ffffff;}

.loginSignup .existingCustomer .loggedIn .loggedInHeader h2 {margin: 0 0 0.5em 0; padding: 0; font-size: 2em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.loginSignup .existingCustomer .loggedIn .loggedInHeader  h4 {margin: 0 0 0.75em 0; padding: 0; font-size: 1.15em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.loginSignup .existingCustomer .loggedIn  p {margin: 0; padding: 0 0 1em 0; font-size: 1.1em; line-height: 1.2; font-weight: 100; display: block; letter-spacing: 0.025em;}
.loginSignup .existingCustomer .loggedIn span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(112,112,112,1); border: none; border-radius: 0.25em; cursor: pointer; display: inline-block;}
.loginSignup .existingCustomer .loggedIn span a:hover {background: rgba(112,112,112,0.8);}

.loginSignup .newCustomer .registered .registeredHeader h2 {margin: 0 0 0.5em 0; padding: 0; font-size: 2em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.loginSignup .newCustomer .registered .registeredHeader  h4 {margin: 0 0 0.75em 0; padding: 0; font-size: 1.15em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.loginSignup .newCustomer .registered  p {margin: 0; padding: 0 0 1em 0; font-size: 1.1em; line-height: 1.2; font-weight: 100; display: block; letter-spacing: 0.025em;}

.loginSignup .newCustomer .registered .profile {padding: 1.5em 2em 2em 2em; border: 1px solid #d5d5d5; background: #f5f5f5; border-radius: 0.25em;}
.loginSignup .newCustomer .registered .registeredDetail {margin: 0;}
.loginSignup .newCustomer .registered .listing  {display: flex; flex-direction: column; justify-content: flex-start; flex-wrap: wrap; width: 100%;}
.loginSignup .newCustomer .registered .listing .listingHeader {margin: 0; padding: 0 0 1em 0;}
.loginSignup .newCustomer .registered .listing .listingHeader h3 {margin: 0; padding: 0; font-size: 1.5em;}
.loginSignup .newCustomer .registered .listing .item {margin: 0 0 0 0; padding: 0 0 0 0; width: 100%; border-bottom: none;}
.loginSignup .newCustomer .registered .listing .item .itemHeader {margin: 0;}
.loginSignup .newCustomer .registered .listing .item .itemHeader h4 {margin: 0 0 0 0; padding: 0 0 0 0; font-size: 1.2em; line-height: 1.2; color: #ED6B06; background: none;}
.loginSignup .newCustomer .registered .listing .item ul {margin: 0 0 1em 0; padding: 0;}
.loginSignup .newCustomer .registered .listing .item ul li {margin: 0; padding: 0; list-style: none;}
.loginSignup .newCustomer .registered span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(112,112,112,1); border: none; border-radius: 0.25em; cursor: pointer; display: inline-block;}
.loginSignup .newCustomer .registered span a:hover {background: rgba(112,112,112,0.8);}


.registeredPayment {margin: 0 0 2em 0;padding: 2em; border-top: 0.2em solid #ED6B06; background: #FFFFFF;}

.registeredPayment .registeredHeader h2 {margin: 0 0 0.5em 0; padding: 0; font-size: 2em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.registeredPayment .registeredHeader  h4 {margin: 0 0 0.75em 0; padding: 0; font-size: 1.15em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.registeredPayment  p {margin: 0; padding: 0 0 1em 0; font-size: 1.1em; line-height: 1.2; font-weight: 100; display: block; letter-spacing: 0.025em;}

.registeredPayment .profile {padding: 1.5em 2em 2em 2em; border: 1px solid #d5d5d5; background: #f5f5f5; border-radius: 0.25em;}
.registeredPayment .registeredDetail {margin: 0;}
.registeredPayment .listing  {display: flex; flex-direction: column; justify-content: flex-start; flex-wrap: wrap; width: 100%;}
.registeredPayment .listing .listingHeader {margin: 0; padding: 0 0 1em 0;}
.registeredPayment .listing .listingHeader h3 {margin: 0; padding: 0; font-size: 1.5em;}
.registeredPayment .listing .item {margin: 0 0 0 0; padding: 0 0 0 0; width: 100%; border-bottom: none;}
.registeredPayment .listing .item .itemHeader {margin: 0;}
.registeredPayment .listing .item .itemHeader h4 {margin: 0 0 0 0; padding: 0 0 0 0; font-size: 1.2em; line-height: 1.2; color: #ED6B06; background: none;}
.registeredPayment .listing .item ul {margin: 0 0 1em 0; padding: 0;}
.registeredPayment .listing .item ul li {margin: 0; padding: 0; list-style: none;}
.registeredPayment span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(112,112,112,1); border: none; border-radius: 0.25em; cursor: pointer; display: inline-block;}
.registeredPayment span a:hover {background: rgba(112,112,112,0.8);}


.membersForm {margin: 0 0 0 0; padding: 0; text-align: left; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; color: #111111; letter-spacing: 0.025em;}
.membersForm  h2 {margin: 0 0 0.5em 0; padding: 0; font-size: 2em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.membersForm  h4 {margin: 0 0 0.75em 0; padding: 0; font-size: 1.15em; font-weight: 500; text-align: left; line-height: 1; display: block; vertical-align: middle; letter-spacing: 0.1em;}
.membersForm  p {margin: 0; padding: 0 0 1em 0; font-size: 1.1em; line-height: 1.2; font-weight: 100; display: block; letter-spacing: 0.025em;}
.membersForm .input label {padding: 0; color: #111111; display: block; font-size: 1.1em; font-weight: 100; line-height: 1;}	
.membersForm .input label i {padding: 0; color: #111111; font-size: 0.9em; font-weight: 100; font-style: normal;}	
.membersForm .input input {margin: 0 0 1.5em 0; padding: 0; height: 40px; width: 100%; border: none; border-radius: 0; border-bottom: 2px solid #111111; display: block; line-height: 1; font-size: 1em; color: #111111; background: none; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; box-shadow: none;}	
.membersForm .input input::-webkit-input-placeholder,
.membersForm .input input::-moz-placeholder,
.membersForm .input input::placeholder-shown {color:#707070;}
.membersForm .input.address {display: none;}	
.membersForm .input input:hover {border-bottom: 2px solid #FFD667; color: #111111;}	
.membersForm .input input:focus {border-bottom: 2px solid #FFD667; color: #111111;}
.membersForm .select label {padding: 0; color: #111111; display: block; font-size: 1.1em; font-style: normal; font-weight: 100; line-height: 1;}	
.membersForm .select label i {padding: 0; color: #111111; font-size: 0.9em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.membersForm .select .dropdown {margin: 0 0 1.5em 0; position: relative; background: none; overflow: hidden; border: none; border-bottom: 2px solid #111111; border-radius: 0; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear;}
.membersForm .select .dropdown:after {content: '\f078'; font-family: "Font Awesome 5 Free"; font-style: normal; font-variant-caps: normal; font-variant-ligatures: normal; font-size: 1em; font-weight: 900; height: 1em; line-height: 1em; text-rendering: auto; width: 1em; -webkit-font-smoothing: antialiased; position: absolute; right: 0.5em; top: 0.75em; z-index: 1; pointer-events: none; color: #111111;}
.membersForm .select select {margin: 0; padding: 0; height: 40px; width: 100%; border: none; display: block; font-size: 1.1em; color: #111111; background: transparent; box-shadow: none; background-image: none; -webkit-appearance: none;  -moz-appearance: none; line-height: 1; cursor: pointer;}	
.membersForm .select .dropdown:hover {border-bottom: 2px solid #FFD667; color: #111111;}
.membersForm .select .dropdown:focus {border-bottom: 2px solid #FFD667; color: #111111;}
.membersForm .textarea label {padding: 0 0; color: #111111; display: block; font-size: 1.1em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.membersForm .textarea textarea {margin: 0; padding: 0; width: 100%; border: none; border-bottom: 2px solid #111111; display: block; font-size: 1em; color: #111111; background: none; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border-radius: 0;}	
.membersForm .textarea textarea:hover {border-bottom: 2px solid #FFD667;}	
.membersForm .textarea textarea:focus {border-bottom: 2px solid #FFD667;}
.membersForm .checkbox {margin: 0 0 1em 0;}
.membersForm .checkbox label {padding: 0 0 0 0.5em; color: #4a4644; font-size: 1em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100;}	
.membersForm .details {margin: 0 0 2em 0;}
.membersForm .submit input {margin: 0 0 0 0; padding: 1em 1.5em 1em 1.5em; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer;}
.membersForm .submit input:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.membersForm .submit input:focus {color: #ffffff; background: rgba(237,107,6,0.8);}

.membersForm .terms {margin: 0 0 1em 0; padding: 1.5em; background: #555; border-radius: 0.25em; transition: all .3s linear;}
.membersForm .terms:hover {background: #222;}

.membersForm .checkbox {margin: 0 0 0 0;}
.membersForm .checkbox label {padding: 0 0 0.5em 0; font-size: 1.2em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; line-height: 1.2; color: #fff; display: block;}	
.membersForm .checkbox input {margin: 0; padding: 0 0.5em 0 0; border: 1px solid #ddd; font-size: 1em; color: #fff; background: #fff; border-radius: 0.25em; transition: all .3s linear; vertical-align: top;}	
.membersForm .checkbox input:hover {border: 1px solid #000; color: #fff; background: #fff;}	
.membersForm .checkbox input:focus {border: 1px solid #000; color: #fff; background: #fff;}
.membersForm .checkbox span{margin: 0 0 0.25em 0; padding: 0.25em 1em 0.5em 0.5em; line-height: 1.2; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; font-size: 0.9em; color: #fff; border-radius: 0.25em; vertical-align: top;}
.membersForm .checkbox span a {margin: 0; padding: 0 0 0 0.25em; line-height: 1.2; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; font-size: 0.9em; color: #fff; vertical-align: top; text-decoration: underline;}
.membersForm .checkbox span a:hover{text-decoration: none;}
.membersForm .checkbox p {margin: 0 0 0.25em 0; padding: 0.75em 1em 0.75em 1em; line-height: 1.2; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; font-size: 1em; color: #fff; background: #ED6B06; display: block; border-radius: 0.25em; text-decoration: none;}

.membersForm .membersFormFields {margin-bottom: 1em; width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start;}
.membersForm .membersFormFields .left {margin-bottom: 2em; width: 48%;}
.membersForm .membersFormFields .right {width: 48%;}

.membersForm .forgot {margin: 0.5em 0 0 0; padding: 0;}
.membersForm .forgot p {margin: 0; padding: 0; font-size: 0.9em;}
.membersForm .forgot a {color: #ED6B06;}
.membersForm .forgot a:hover {color: #707070;}

.membersForm .error {margin: 0 0 1em 0; padding: 0.75em 1em 0.75em 1em; background: #ED6B06; display: block;}
.membersForm .error p {margin: 0; padding: 0; line-height: 1.2; font-size: 1em; color: #fff;}
.membersForm .error span {margin: 0; padding: 0; line-height: 1.2; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; font-size: 0.9em; color: #ffffff;}
.membersForm .error span a {color: #fff;}
.membersForm .error span a:hover {text-decoration: none;}

.membersForm .membersFormHeader {margin-bottom: 3em; border-bottom: 2px solid #111111; width: 100%;}
.membersForm .membersFormHeader .content {margin: 0 0 2em 0; vertical-align: top; display: inline-block; width: 100%;}
.membersForm .membersFormSuccess .content {margin: 0 0 2em 0; vertical-align: top; display: inline-block; width: 100%;}
.membersForm .membersFormHeader i.fa {color: #111111; vertical-align: top; display: inline-block;}
.membersForm .membersFormSuccess i.fa {color: #111111; vertical-align: top; display: inline-block;}


@media screen and (max-width: 1000px) {	
	.membersForm .submit input {white-space: normal;}
}

@media screen and (max-width: 900px) {
	.membersForm .membersFormHeader .content {margin: 0 0 2em 0; display: inline-block; width: 80%;}
	.membersForm .membersFormSuccess .content {margin: 0 0 2em 0; display: inline-block; width: 80%;}
}

@media screen and (max-width: 640px) {
	.membersForm .membersFormFields {margin-bottom: 1em; width: 100%; display: flex; flex-direction: column; flex-wrap: wrap;}
	.membersForm .membersFormFields .left {margin-bottom: 0; width: 100%;}
	.membersForm .membersFormFields .right {margin-bottom: 2em; width: 100%;}
	.membersForm  p {font-weight: 300;}
	.membersForm .input label {font-weight: 300;}
	.membersForm .input input {font-weight: 300;}
	.membersForm .select label {font-weight: 300;}
	.membersForm .select select {font-weight: 300;}
	.membersForm .textarea label {font-weight: 300;}
	.membersForm .textarea textarea {font-weight: 300;}
	.membersForm .submit input {width: 100%;}
}

@media screen and (max-width: 480px) {
	.membersForm .membersFormHeader .content {font-size: 80%;}
	.membersForm .membersFormSuccess .content {font-size: 80%;}
	.membersForm .membersFormHeader i.fa-3x {font-size: 2em;}
	.membersForm .membersFormSuccess i.fa-3x {font-size: 2em;}
	.membersForm  p {text-align: left; font-weight: 300;}
}




/* ==========================================================================
   Testimonials
   ========================================================================== */
   
.testimonial {margin: 0; padding: 0;}
.testimonials {margin: 0; padding: 0;}

.testimonials .testimonialsHeader {margin: 0; padding: 0;}
.testimonials .testimonialsHeader h2 {margin: 0 0 1em 0; padding: 0; font-size: 1.5em;}
.testimonials .testimonialsHeader h3 {margin: 0 0 0.5em 0; padding: 0.5em 0.75em; font-size: 1.5em; background: #707070; color: #FFD667; display: inline-block;}

.testimonials .listing {margin: 0; padding: 0;}
.testimonials .listing .item {margin: 0 0 1em 0; padding: 2em; background: #ffffff; border-left: 5px solid rgba(237,107,6,1);}
.testimonials .listing .item blockquote {margin: 0; padding: 0; display: flex; flex-direction: row;}
.testimonials .listing .item blockquote .quote {margin: 0; padding: 0; display: flex; flex-direction: column-reverse;}
.testimonials .listing .item blockquote::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: '\f10d'; font-size: 3em; color: rgba(237,107,6,1);}
.testimonials .listing .item blockquote p {margin: 0; padding: 0 0 0 1em; font-size: 1.25em; line-height: 1.2;}
.testimonials .listing .item blockquote p br {margin: 0 0 0.5em 0; padding: 0; display: block;}
.testimonials .listing .item blockquote h3 {margin: 0; padding: 0.5em 0 0 1em; color: #ED6B06; font-size: 1.25em; font-weight: 300; font-style: normal; text-transform: inherit;}

@media screen and (max-width: 600px) {
	.testimonials .listing .item {padding: 0.5em 1.5em 1.5em 1.5em;}
	.testimonials .listing .item blockquote {flex-direction: column;}
	.testimonials .listing .item blockquote p {padding: 0 0 0 0; font-size: 1em; text-align: left;}
	.testimonials .listing .item blockquote h3 {margin: 0; padding: 0.5em 0 0 0; color: #ED6B06; font-size: 1em;}
}


/* ==========================================================================
   Class
   ========================================================================== */


   
/* ==========================================================================
   Basket
   ========================================================================== */
   
   
.myBasket {margin: 0 0 2em 0; padding: 0;}
.myBasketCenter {margin: 0; padding: 0;}
.myBasketMain {margin: 0; padding: 0;}
.myBasket img {margin: 0; padding: 0;}

.cartSteps {margin: 0 0 2em 0; padding: 0; border-bottom: 0.5em solid #FFD667;}
.cartSteps ol {margin: 0; padding: 0; text-transform: uppercase;}
.cartSteps ol li {margin: 0; padding: 0.6em 2.5% 0.5em 2.5%; list-style: none; display: inline-block; width: 28.33333333333333%; float: left; background: #e5e5e5; font-size: 1.25em; line-height: 1; text-align: center;}
.cartSteps ol li a {color: #777; text-decoration: none;}
.cartSteps ol li a:hover {color: #777; text-decoration: underline;}
.cartSteps ol li.selected {background: #FFD667; color: #707070; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase;}
.cartSteps ol li strong {padding: 0.75em 0 0 1em; text-align: left; float: left; font-family: "proxima-nova-n3","proxima-nova",sans-serif; font-style: normal; font-weight: 300; color: #777;}
.cartSteps ol li.selected strong {color: #707070; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase;}
.cartSteps ol li i {margin: 0; padding: 0.35em 0 0 0; font-size: 1.5em; background: #ffffff; border-radius: 50%; transition: all 0.3s ease; display: block; width: 1.65em; height: 1.3em; font-family: "proxima-nova-n7","proxima-nova",sans-serif; font-style: normal; font-weight: 700; float: left; color: #777777;}
.cartSteps ol li.selected i {color: #707070; background: #fff;}

.myBasketHeader {margin: 0; padding: 0 0 1.5em 0; text-align: left; background: none;}
.myBasketHeader h1 {margin: 0; padding: 0 0 0.25em 0; font-size: 2.5em; color: #ED6B06; line-height: 1.1;}
.myBasketHeader h1 strong {font-family: "proxima-nova-n6", "proxima-nova",sans-serif; font-style: normal; font-weight: 600;}
.myBasketHeader h2 {margin: 0; padding: 0 0 0.25em 0; font-size: 2em; color: #ED6B06; line-height: 1.1;}
.myBasketHeader h2 strong {font-family: "proxima-nova-n6", "proxima-nova",sans-serif; font-style: normal; font-weight: 600;}
.myBasketHeader span {margin: 0; padding: 0; font-size: 1em; color: #111111; line-height: 1.2; display: block;}
.myBasketHeader span a {color: #111111;}
.myBasketHeader span a:hover {text-decoration: none;}
.myBasketHeader span strong {margin: 0; padding: 0 0 0.5em 0; font-size: 1em; font-family: "proxima-nova-n6", "proxima-nova",sans-serif; font-style: normal; font-weight: 600; color: #333; line-height: 1.2;}

.myOrderHeader {margin: 0; padding: 0 0 1.5em 0; text-align: left; background: none;}
.myOrderHeader h1 {margin: 0; padding: 0 0 0.25em 0; font-size: 2.5em; color: #ED6B06; line-height: 1.1;}
.myOrderHeader h1 strong {font-family: "proxima-nova-n6", "proxima-nova",sans-serif; font-style: normal; font-weight: 600;}
.myOrderHeader h2 {margin: 0; padding: 0 0 0.25em 0; font-size: 2em; color: #ED6B06; line-height: 1.1;}
.myOrderHeader h2 strong {font-family: "proxima-nova-n6", "proxima-nova",sans-serif; font-style: normal; font-weight: 600;}
.myOrderHeader span {margin: 0; padding: 0; font-size: 1em; color: #111111; line-height: 1.2; display: block;}
.myOrderHeader span a {color: #111111;}
.myOrderHeader span a:hover {text-decoration: none;}
.myOrderHeader span strong {margin: 0; padding: 0 0.5em 0.5em 0; min-width: 100px; font-size: 1em; font-family: "proxima-nova-n6", "proxima-nova",sans-serif; font-style: normal; font-weight: 600; color: #333; line-height: 1.2; display: inline-block;}

.cart {margin: 0; width: 100%; border-collapse: collapse; border-bottom: 0.25em solid #ddd;}
.cartHeader {background: #dddddd;}
.cartHeader th {margin: 0; padding: 0; font-size: 1.25em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100; color: #222; line-height: 1.2; text-align: left; border: 1px solid #ddd;}
.cartHeader td,
.cartHeader th {border: none; vertical-align: top; padding: 0.75em 1em;}
.cartItem td,
.cartItem tr {border: none; vertical-align: top; padding: 0.75em 1em; border-bottom: 1px solid #d5d5d5;}
.cartItemImg {margin: 0; padding: 0; width: 10%;}
.cartItemImg img {margin: 0; padding: 0;}
.cartItemDetail {margin: 0; padding: 0; width: 70%;}
.cartItemDetail h3 {margin: 0; padding: 0; font-size: 1.5em; color: #111111; line-height: 1.2;}
.cartItemDetail h3 a {color: #222; text-decoration: none;}
.cartItemDetail h3 a:hover {text-decoration: underline;}
.cartItemDetail p {margin: 0; padding: 0 0 0.25em 0; font-size: 1em; color: #222; line-height: 1.2;}
.cartItemDetail h4 {margin: 0; padding: 0.25em 0 0.25em 0; font-size: 1.5em; color: #ED6B06; line-height: 1.2; display: block;}
.cartItemDetail h4 span {color: #707070; font-size: 0.75em;}
.cartItemDetail h5 {margin: 0; padding: 0 0 0.25em 0; font-size: 1.2em; color: #707070; line-height: 1.2; display: block;}
.cartItemDetail h5 span {color: #707070; font-size: 0.75em;}

.cartItemDetail .itemDuration {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff; border: 1px solid #d5d5d5;}
.cartItemDetail .itemDuration span {padding: 0 1em; line-height: 1.2;}
.cartItemDetail .itemDuration::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f2f2'; background: rgba(112,112,112,1); text-align: center;}

.cartItemDetail .itemTime {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff; border: 1px solid #d5d5d5;}
.cartItemDetail .itemTime span {padding: 0 1em; line-height: 1.2;}
.cartItemDetail .itemTime span strong {padding-right: 0.25em; font-family: "cronos-pro",sans-serif; font-style: normal; font-weight: 600; font-size: 1.25em;}
.cartItemDetail .itemTime::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content:'\f017'; background: rgba(112,112,112,1); text-align: center;}

.cartItemDetail .itemDate {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff; border: 1px solid #d5d5d5;}
.cartItemDetail .itemDate span {margin: 0 0 5px 0;padding: 0 1em; line-height: 1.2;}
.cartItemDetail .itemDate::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 400; content:'\f073'; background: rgba(112,112,112,1); text-align: center;}

.cartItemDetail .itemWeeks {margin: 0 0 5px 0; padding: 0; display: flex; align-items: center; color: #707070; background: #ffffff; border: 1px solid #d5d5d5;}
.cartItemDetail .itemWeeks span {padding: 0 1em; line-height: 1.2; font-weight: 700;}
.cartItemDetail .itemWeeks::before {margin: 0; padding: 0; color: #FFD667; height: 50px; width: 50px; min-width: 50px; font-size: 25px; line-height: 50px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f3ff'; background: rgba(112,112,112,1); text-align: center;}
   
.cartItemQuantity {margin: 0; padding: 0; width: 10%;}
.cartItemQuantity span {margin: 0 0 1.5em 0; padding: 0.75em 0; font-family: "cronos-pro",sans-serif; font-style: normal; font-weight: 600; font-size: 1.25em; text-align: center; width: 100%; border: none; border-radius: 0; border-bottom: 2px solid #111111; display: block; line-height: 1; font-size: 1em; color: #111111; background: none; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; box-shadow: none;}	
.cartItemQuantity input {margin: 0 0 1.5em 0; padding: 0; font-family: "cronos-pro",sans-serif; font-style: normal; font-weight: 600; font-size: 1.25em; height: 40px; text-align: center; width: 100%; border: none; border-radius: 0; border-bottom: 2px solid #111111; display: block; line-height: 1; font-size: 1em; color: #111111; background: none; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; box-shadow: none;}	
.cartItemQuantity input::-webkit-input-placeholder,
.cartItemQuantity input::-moz-placeholder,
.cartItemQuantity input::placeholder-shown {color:#707070;}
.cartItemPrice {margin: 0; padding: 0; width: 10%; text-align: right;}
th.cartItemPrice{text-align: right;}
.money span {margin: 0; padding: 0.7em 0 0 0; display: block;}
.cartItemTotal.money {color: #ED6B06;}
.cartItemTotal{margin: 0; padding: 0; width: 10%; text-align: right;}
th.cartItemTotal{text-align: right;}
.cartDelivery {margin: 0; padding: 0; text-align: right;}
.cartDelivery ul {margin: 0; padding: 0; text-align: right;}
.cartDelivery li {margin: 0; padding: 0.75em 0 0 0.5em; list-style: none; vertical-align: top; text-align: right; font-size: 1.4em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; color: #222; line-height: 1.2; display: inline-block;}
.cartDelivery li strong {font-size: 0.75em; font-family: "proxima-nova-n7", "proxima-nova",sans-serif; font-style: normal; font-weight: 700;}
.cartTotal {margin: 0; padding: 0; text-align: right;}
.cartTotal ul {margin: 0; padding: 0; text-align: right;}
.cartTotal li {margin: 0; padding: 0.75em 0 0.75em 0.5em; list-style: none; vertical-align: top; text-align: right; font-size: 1.4em; font-family: "proxima-nova-n3", "proxima-nova",sans-serif; font-style: normal; font-weight: 300; color: #222; line-height: 1.2; display: inline-block;}
.cartTotal li strong {font-size: 0.75em; font-family: "proxima-nova-n7", "proxima-nova",sans-serif; font-style: normal; font-weight: 700;}
.cartFooter {margin: 0; padding: 0 0 1em 0;}
.cartDiscount {margin: 0 0 0 0; padding: 0 0 1em 0; text-align: right; display: none;}
.cartDiscount h3 {margin: 0; padding: 0 0 0.25em 0; font-size: 1.5em; font-family: "proxima-nova-n1", "proxima-nova",sans-serif; font-style: normal; font-weight: 100; color: #222; line-height: 1.2;}
.cartDiscount input {margin: 0; padding: 0.75em 1em 0.75em 1em; border: 1px solid #ccc; display: inline-block; font-size: 1em; color: #555; background: #fff; transition: all .3s linear;}	
.cartDiscount input:hover {border: 1px solid #000; color: #000; background: #fff;}	
.cartDiscount input:focus {border: 1px solid #000; color: #000; background: #fff;}
.cartUpdate {margin: 0; padding: 0;	text-align: right;}
.cartUpdate .submit input {margin: 0 0 1em 0; padding: 0.6em 0.9em 0.6em 0.9em; font-size: 1em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; border: none; background: #231f20; line-height: 1.2; display: inline-block; transition: all .3s linear; text-align: center; text-transform: uppercase; border-radius: 0.2em; cursor: pointer;}	
.cartUpdate .submit input:hover {background: #444;}	
.cartUpdate .submit input:focus {background: #444;}
.cartCheckout {margin: 0; padding: 0; text-align: right;}
.cartCheckout a {margin: 0 0 0 0; padding: 1em 1.5em 1em 1.5em; border-radius: 0.2em; color: #ffffff; background: rgba(237,107,6,1); text-transform: uppercase; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0.1em; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all .3s linear; border: none; cursor: pointer; display: inline-block;}
.cartCheckout a:hover {color: #ffffff; background: rgba(237,107,6,0.8);}	
.cartCheckout a:focus {color: #ffffff; background: rgba(237,107,6,0.8);}
.cart tr.even {background: #ffffff;}
.cart tr.odd {background: #f5f5f5;}

.payment {display: flex; justify-content: flex-end;}
button.stripe-button-el {
    overflow: hidden;
    display: inline-block;
    visibility: visible !important;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    background-image: none;
    -webkit-font-smoothing: inherit;
    border: none;
    padding: 0;
    text-decoration: none;
    border-radius: none;
    box-shadow: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    cursor: pointer;
}
button.stripe-button-el span {
    display: block;
    position: relative;
    padding: 1em 1.5em 1em 1.5em;
    height: inherit;
    line-height: 30px;
    background-image: none;
    font-size: 14px;
    color: #fff;
    text-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    border-radius: 0.2em; 
    color: #ffffff; 
    background: rgba(237,107,6,1); 
    text-transform: uppercase; 
    font-family: "cronos-pro-n4", "cronos-pro",sans-serif; 
    font-style: normal; 
    font-weight: 400; 
    font-size: 1.1em; 
    letter-spacing: 0.1em; 
    -webkit-transition: all .3s linear; 
    -moz-transition: all .3s linear; 
    transition: all .3s linear; 
    border: none;
}
button.stripe-button-el span:hover {
    background: rgba(237,107,6,0.8);
}

@media screen and (max-width: 900px) {
	.cartSteps ol {text-align: center;}
	.cartSteps ol li strong {padding: 0.75em 0 0 0; float: none; text-align: center; display: inline-block; widtH: 100%;}
	.cartSteps ol li i {margin: 0 0 0 0; padding: 0.35em 0 0 0; display: inline-block; text-align: center; float: none;}
}

@media screen and (max-width: 800px) {
	.myBasketHeader {font-size: 85%;}
	.cart {font-size: 80%;}
	.cartItemDetail {width: 80%;}
}

@media screen and (max-width: 730px) {
	.cartSteps {font-size: 80%;}
}

@media screen and (max-width: 640px) {
	.myBasketCenter {margin: 0;}
	.cartSteps {font-size: 60%;}
	.cartItemTotal {display: none;}
	.cartTotal {text-align: left;}
	.cartTotal ul {text-align: left;}
	.cartTotal li {padding: 0.75em 0.5em 0.75em 0; text-align: left;}
	.cartUpdate {text-align: left;}
	.cartCheckout {text-align: left;}
}

@media screen and (max-width: 510px) {
	.cartSteps ol li strong {display: none;}
	.cartItemDetail {width: 90%;}
	.cartItemImg {display: none;}
	.cartItemQuantity {width: 10%;}
}


   
/* ==========================================================================
   Contact
   ========================================================================== */


/* ==========================================================================
   No Results
   ========================================================================== */

.noResults {margin: 0; padding: 0 0 2em 0;}
.noResults p {margin: 0; padding: 0; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; font-size: 1.25em;}
.noResults p a {color: rgba(255,255,255,1); text-decoration: underline;}
.noResults p a:hover {color: rgba(255,255,255,0.6); text-decoration: none;}


/* ==========================================================================
   Hide
   ========================================================================== */
   
.date {display: none;}


/* ==========================================================================
   Footer
   ========================================================================== */
   
.footer {background-color: #FFD667; background: rgba(255,214,103,0.95);}
.footer .footerArea {display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; flex: 1; color: #111111;}
.footer .footerArea h5 {margin: 0; padding: 0; font-size: 1.2em;}
.footer .footerArea a {margin: 0; padding: 0; text-decoration: none; color: rgba(17,17,17,1);}
.footer .footerArea a:hover {color: rgba(17,17,17,0.5);}
.footer .footerArea ul {margin: 0; padding: 0; list-style: none;}
.footer .footerArea ul li a span {margin: 0; padding: 0.25em 0; display: block; font-size: 1em; font-weight: 300;}

.footer .footerLogo {margin: 0 3.5% 0 0; padding: 20px 30px 30px 30px; width: 180px; box-sizing: border-box; background: #ffffff;}
.footer .footerLogo img {max-width: 180px;}

.footer .footerRight {margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; flex-basis: auto; flex-grow: 1; flex: 1;}
.footer .footerRight .footerNav {margin: 2em 0 2em 0; width: 31%;}
.footer .footerRight .footerNav:nth-child(3n+2) {margin: 2em 3.5% 2em 3.5%;}

.footer .footerRight .footerContact {margin: 2em 0; padding: 0; width: 31%;}
.footer .footerRight .footerContact h5 {margin: 0; padding: 0; font-size: 1.1em;}
.footer .footerRight .footerContact .vcard ul {margin-bottom: 1em; display: flex; flex-direction: column; justify-content: center; align-content: center;}
.footer .footerRight .footerContact .vcard ul li {margin: 0; padding: 0; display: block; font-size: 1em; font-weight: 300; display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.footer .footerRight .footerContact .vcard ul li strong {display: none;}
.footer .footerRight .footerContact .vcard ul li::before {width: }
.footer .footerRight .footerContact .vcard ul li.email::before {margin: 0; padding: 0; color: rgba(17,17,17,1); height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f0e0'; text-align: left;}
.footer .footerRight .footerContact .vcard ul li.mobile::before {margin: 0; padding: 0; color: rgba(17,17,17,1); height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f3cd'; text-align: left;}
.footer .footerRight .footerContact .vcard ul li.tel::before {margin: 0; padding: 0; color: rgba(17,17,17,1); height: 40px; width: 40px; font-size: 25px; line-height: 40px; font-family: "Font Awesome 5 Free"; font-weight: 900; content:'\f095'; text-align: left;}

.footer .footerRight .footerContact .link {margin: 0 0 0 0; text-align: left;}
.footer .footerRight .footerContact .link a {text-decoration: none;}
.footer .footerRight .footerContact .link span a {margin: 0; padding: 0.75em 1.25em 0.75em 1.25em; color: #ffffff; font-family: "cronos-pro-n4", "cronos-pro",sans-serif; font-style: normal; font-weight: 400; text-transform: uppercase; letter-spacing: 0.075em; background: rgba(17,17,17,1); border-radius: 0.25em; display: inline-block;}
.footer .footerRight .footerContact .link span a:hover {background: rgba(17,17,17,0.8);}

.footer .footerRight .footerCopyright {margin: 0; padding: 1em 80px 1em 0; box-sizing: border-box;}
.footer .footerRight .footerCopyright small {margin: 0; padding: 0; font-size: 0.9em; font-weight: 300;}
.footer .footerRight .footerCopyright small a {text-decoration: underline;}
.footer .footerRight .footerCopyright small a:hover {text-decoration: none;}
.footer .footerRight .footerCopyright small strong {font-weight: 600;}

@media screen and (max-width: 1000px) {
	.footer .footerRight .footerNav {margin: 2em 0 2em 0; width: 48.25%;}
	.footer .footerRight .footerNav:nth-child(3n+2) {margin: 2em 0 2em 3.5%;}
	.footer .footerRight .footerContact {margin: 0 0; padding: 2em 0; width: 100%; border-top: 1px solid #111111;}
}

@media screen and (max-width: 630px) {
	.footer .footerRight {flex-direction: column;}
	.footer .footerRight .footerNav {margin: 2em 0 2em 0; width: 100%;}
	.footer .footerRight .footerNav:nth-child(3n+2) {margin: 0 0 2em 0;}
}

@media screen and (max-width: 450px) {
	.footer .footerLogo {margin: 0 0 0 0; align-self: center;}
	.footer .footerArea {flex-direction: column;}
}


/* ==========================================================================
   Social
   ========================================================================== */

.footer .footerRight .footerContact .social {margin: 1em 0 0 0; padding: 0;}
.footer .footerRight .footerContact .social ul {margin: 0.25em 0 0 0 !important; padding: 0; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
.footer .footerRight .footerContact .social ul li {list-style: none;}
.footer .footerRight .footerContact .social ul li a {margin: 0.25em 0.25em 0.25em 0; padding: 0.25em!important; display: block; list-style: none; font-size: 1.5em; height: 1.5em; width: 1.5em; line-height: 1.5em; text-rendering: auto; border-radius: 50%; text-align: center; align-self: center; color: #ffffff !important; background: #111111; overflow: hidden; position: relative; transition: all 0.5s ease;}
.footer .footerRight .footerContact .social ul li a:hover {color: #111111!important; background: #ffffff;}


/* ==========================================================================
   Spacing
   ========================================================================== */
   
.spacing {padding: 3em 0;}
.spacingTop {padding: 3em 0 0 0;}
.spacingBottom {padding: 0 0 3em 0;}


/* ==========================================================================
   Back to top button
   ========================================================================== */

#back-top a {padding: 0; position: fixed; right: 0; bottom: -60px; color: #ffffff; z-index: 300; width: 60px; height: 60px; line-height: 60px; display: block; background: rgba(255,214,103,1); /* rounded corners *//* background color transition */ text-transform: uppercase; text-align: center; font-size: 2.5em; opacity: 0;}
#back-top a:hover {color: #ffffff; background: rgba(255,214,103,0.8);}

body.reveal #back-top a {bottom: 0; opacity: 1;}




/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap; /* 1 */
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
    white-space: inherit;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre {
        white-space: pre-wrap !important;
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
