/* FONTS (via fonts.com)

font-family:'Univers LT W01_49 Light Ult Cn';
font-family:'Univers LT W01_59 Ult Cond';
font-family:'Univers LT W01_67 Bold_1476016';

font-family: 'interstate-boldregular';
font-family: 'interstate-lightregular';
font-family: 'interstate-regularregular';

*/

@font-face {
    font-family: 'interstate-boldregular';
    src: url('/fonts/intbd___-webfont.woff2') format('woff2'),
         url('/fonts/intbd___-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'interstate-lightregular';
    src: url('/fonts/intlt___-webfont.woff2') format('woff2'),
         url('/fonts/intlt___-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'interstate-regularregular';
    src: url('/fonts/intr____-webfont.woff2') format('woff2'),
         url('/fonts/intr____-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


:root { 
	--accent-colour: rgb(119,189,29);
	--accent-colour-rgb: 119,189,29;
	--border-colour: #f69200;
	--border-colour-rgb: 246,146,0;

	/*--error-colour: rgb(255,51,0);*/
	--error-colour: rgb(250,90,60);
	--error-colour-rgb: 250,90,60;
}



/* theme */

body { font-size: 18px; color: #666; font-family: 'interstate-lightregular'; }

h1 { font-family:'Univers LT W01_59 Ult Cond'; font-size: 60px; display: block; line-height: 1.1;text-transform: uppercase; color: #76bd1d; text-align: left; margin-bottom: 40px;}
h2 { font-family:'Univers LT W01_59 Ult Cond'; font-size: 80px; display: block; line-height: 1.1;text-transform: uppercase; padding: 0 40px}
h3 { font-family:'Univers LT W01_59 Ult Cond'; font-size: 60px; display: block; line-height: 1.1;text-transform: uppercase; color: #666666; text-align: left; margin-bottom: 40px;}

/*HEADER*/

header { position: fixed; display: block; width: 100%; background: #fff; z-index: 99}
div.burger { display: none;}

header div.social-icons { height: 40px; background: #76bd1d; }
header div.social-icons ul { display: block; margin: 0 auto; max-width: 1280px; padding-right: 0px; text-align: right; font-size: 0}
header div.social-icons ul li { display: inline-block; vertical-align: top;}
header div.social-icons ul li a { display: block; padding-left: 20px; font-size: 20px; line-height: 40px; color: #fff;}
header div.social-icons ul li a:hover { color: #2e1b27;}

header div.navigation { background: #fff; margin: 0 auto; font-size: 0; text-align: center; font-size: 16px; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase; letter-spacing: 1px; max-width: 1280px;}
header div.logo { display: inline-block; vertical-align: top; margin-right: 25px; width: 180px;}
header div.logo { display: inline-block; vertical-align: top; margin-right: 25px; width: 150px;} /*pride*/
header div.logo a img { display: block; width: 100%; height: auto; margin-top: 20px;}

header nav {display: inline-block; vertical-align: top; width: calc(100% - 430px);}
header nav > ul {display: block; width: 100%; text-align: left; padding-top: 30px;}
header nav > ul > li {display: inline-block; vertical-align: top; text-align: center; position: relative}
header nav > ul > li > a {display: block; padding: 0 10px; line-height: 70px; color: #666}
header nav > ul > li > a:hover {color: #000}
header nav > ul > li.subnav > ul { position: absolute; top: 60px; left:0; width: 100%; min-width: 200px; max-height:0; opacity: 0; overflow: hidden; background: #76bd1d}
header nav > ul > li.subnav:hover{ background-color: #76bd1d}
header nav > ul > li.subnav:hover > ul { max-height: 600px; opacity: 1; overflow: hidden;}
header nav > ul > li.subnav > ul > li { display: block; width: 100%; }
header nav > ul > li.subnav > ul > li a { display: block; width: 100%; padding: 0 10px; line-height: 50px; text-align: left; color: #fff;}
header nav > ul > li.subnav > ul > li a:hover { color: #000}

div.login-area { display: inline-block; text-align: right; padding-top: 30px; padding-left: 45px; padding-right: 45px; position: relative;}

#cart-icon { height: 30px; position: absolute; right: 0; bottom: 20px; display: block}
#cart-icon img { display: block; height: 30px; width: auto;}

div.error { display: block; width: 100%; font-size: 0; position: fixed; top:-1px; left:0; max-height: 120px; z-index: 9999; overflow: hidden; opacity: 1;}
div.error p { display: block; width: 100%; background: #ff3300; color: #fff; font-size: 18px; padding: 20px; font-family: 'interstate-lightregular'; text-align: center;}
div.error.hide { max-height: 0px; opacity:0}

/*FOOTER*/

footer { padding: 50px 20px; background: #2e1b27;}
footer > div { display: block; max-width: 1080px; margin: 0 auto; position: relative;}
footer div.row { font-size: 0; }
footer div.row > div { display: inline-block; vertical-align: top; font-size: 16px; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase; letter-spacing: 1px}

footer div.social-icons  { width: 180px; text-align: right;}
footer div.social-icons ul { display: block; text-align: right; font-size: 0; padding-top: 25px;}
footer div.social-icons ul li { display: inline-block; vertical-align: top;}
footer div.social-icons ul li a { display: block; padding-left: 15px; font-size: 20px; line-height: 20px; color: #fff;}
footer div.social-icons ul li a:hover { color: #bbb;}

footer div.navigation {width: calc(100% - 180px);}

footer div.logo {display: block; text-align: left}
footer div.logo a img {display: block; width: 280px; }

footer ul.nav {display: block; width: 100%; text-align: left; margin-top: 40px; }
footer ul.nav > li {display: inline-block; vertical-align: top; text-align: center;}
footer ul.nav > li > a {display: block; padding: 0 40px 0 0px; line-height: 20px; color: #fff;  font-size: 16px; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase; letter-spacing: 1px}
footer ul.nav > li > a:hover {color: #bbb;}

footer div.disclaimer { text-align: left; margin-top: 60px; color: #fff; font-size: 14px; font-family: 'interstate-lightregular'; }
footer div.disclaimer p { line-height: 1.25;}
footer div.disclaimer a { color: #fff; }


/*CONTAINERS*/
article { display:block; width: 100%; padding-top: 140px;}
div.wrapper, div.masthead, div.content, div.banner { display: block; max-width: 1280px; margin: 0 auto; position: relative;}
div.wrapper-dashboard { max-width: 1080px; padding: 0 20px; margin: 100px auto;}
div.masthead img, div.banner img { width: 100%; display: block}
div.wrapper { margin-top: 20px; margin-bottom: 70px;}

div.splitter {display: block; width: 100%; font-size: 0; position: relative;}
div.splitter > div {display: inline-block; vertical-align: top}

div.splitter.s50_50 > div, div.splitter.split-2 > div { width: 50%; }

div.splitter.s50_50_spaced > div { width: 50%; padding-right: 10px;}
div.splitter.s50_50_spaced > div:last-child { width: 50%; padding-left: 10px; padding-right: 0px;}

div.splitter.s30_70 > div { width: 30%; }
div.splitter.s30_70 > div:last-child { width: 70%; }
div.splitter.s70_30 > div { width: 70%; }
div.splitter.s70_30 > div:last-child { width: 30%; }

div.splitter.split-3 > div { width: 33.33%; }
div.splitter.split-3 > div:nth-child(2) { width: 33.34%; }

div.splitter.split-4 > div  { width: 25%; }

/*CAPTIONS*/
div.caption { position: absolute; display: block; color: #000;}
div.caption.white { color: #fff;}
div.caption.gray { color: #666;}
div.caption.left { left: 0}
div.caption.right { right: 0}
div.caption.top { top: 0}
div.caption.bottom { bottom: 0}
div.caption.center{ left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);  -ms-transform: translateX(-50%); }
div.caption.middle { top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%); }
div.caption.quarter-top { top: 40%; transform: translateY(-50%); -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%); }
div.caption.center.middle { transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%);  -ms-transform: translateY(-50%) translateX(-50%); }
div.caption.center.quarter-top { transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%);  -ms-transform: translateY(-50%) translateX(-50%); }
div.half-width { width: 50% !important; }
div.full-width { width: 100%;}
div.w760 { width: 780px; padding: 0 20px;}
div.w460 { width: 500px; padding: 0 20px;}

div.caption div.title { font-family:'Univers LT W01_59 Ult Cond'; font-size: 80px; margin: 0 auto; display: block; line-height: 1.1;}
div.caption div.subtitle { font-family:'Univers LT W01_59 Ult Cond'; font-size: 48px; margin: 0 auto; display: block; line-height: 1.1; margin-top: 18px;}
div.caption div.description { font-family: 'interstate-lightregular'; font-size: 18px; margin: 0 auto; display: block; line-height: 1.5; margin-top: 15px;}
div.caption div.buttons { margin-top: 30px;}


/*BUTTONS*/
div.buttons { display: block; width: 100%; font-size: 0; text-align: center;}
div.buttons.left { text-align: left;}
a.button { display: table; text-align: center; line-height: 34px; font-size: 14px; font-family:'Univers LT W01_67 Bold_1476016'; padding: 0 9px; text-transform: uppercase; background: transparent; color: #666; border: 3px solid #666; margin: 0 auto; text-decoration: none; }
div.caption a.button { line-height: 40px; font-size: 18px; padding: 0 19px; border-width: 5px; }
a.button:hover { background: #666; color: #fff}
.white a.button { color: #fff; border-color: #fff; }
.white a.button:hover { background: #fff; color: #000}
.dark a.button { color: #000; border-color: #000; }
.dark a.button:hover { background: #000; color: #fff}
a.button.block { display: block}
div.buttons a.button { display: inline-block; margin: 0 5px; cursor: pointer;}
a.button-orange { display: table; width: auto;  margin: 20px auto; line-height: 30px; color: #fff !important; background: #f69200 !important; border-color: #f69200 !important; padding: 0 10px; }
a.button-orange:hover { background: #666 !important; border-color: #666 !important; }
a.button-green { display: table; width: auto;  margin: 0px 0 0 auto; line-height: 36px; color: #77bd1d !important; border: 3px solid #77bd1d !important;  background: transparent; padding: 0 20px; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 14px;}
a.button-green:hover { background-color: #77bd1d !important; color: #fff !important;}
a.left { margin: 20px auto 20px 0}

/*TEXT*/
.orange { color: #f69200 !important; }

/*BXSLIDER*/
.bx-wrapper { margin-bottom: 0}
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { bottom: 30px;}
.bx-wrapper .bx-pager.bx-default-pager a { background: transparent; border: 1px solid #fff; margin: 0 5px;}
.bx-wrapper .bx-pager.bx-default-pager a.active { background: #fff;}

/*GRIDS*/
ul.grid { font-size: 0; display: block; width: 100%; }
ul.grid li { display: inline-block; vertical-align: top; }
ul.grid li div.thumb { display: block; width: 100%; margin-bottom: 20px; position: relative;}
ul.grid li div.thumb img { display: block; width: 100%; }
ul.grid li div.thumb a:after { content:""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0); transition: all .3s ease-out}
ul.grid li div.thumb a:hover:after { content:""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,.2); transition: all .3s ease-out}
ul.grid li div.info { display: block; width: 100%; }
ul.grid li div.info h4 { display: block; width: 100%; text-align: center; font-size: 36px; font-family:'Univers LT W01_59 Ult Cond'; margin-bottom: 15px; }
ul.grid li div.info p { display: block; width: 100%; text-align: center; font-size: 14px; margin-bottom: 15px; line-height: 1.5;}
ul.grid li div.info p { display: block; width: 100%; text-align: center; font-size: 14px; margin-bottom: 15px; line-height: 1.5;}

ul.grid-4 li { width: 25%; padding: 0 10px; }

/*CIRCLES*/
div.indicator { width: 150px; display: inline-block; vertical-align: top; margin: 0 15px 30px 15px;}
div.indicator p { width: 150px; display: block; font-size: 18px; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase;  text-align: center; margin: 16px auto 0;}
div.circle { width: 150px; display: block; }
div.circle label { width: 150px; display: block; font-size: 48px; font-family:'Univers LT W01_59 Ult Cond'; text-align: center; line-height: 150px; position: relative}
div.circle svg { display: block; position: absolute; width: 150px; height: 150px; transform: rotate(-90deg)}

.inner {   fill: transparent;   stroke-width: 15;   stroke-dasharray: 0;  transition: stroke-dashoffset 1s;   -webkit-animation-play-state: running; stroke-dashoffset: 0; }
.outer {   fill: transparent;   stroke-width: 17;   stroke-dasharray: 410,410;  transition: all 1s ease-in;   -webkit-animation-play-state: running; stroke-dashoffset: 0; stroke: #ebebeb}

div.indicator.blue { color:#00aeef}
div.indicator.blue .inner { stroke: #00aeef;; }

div.indicator.red { color:#ed145b}
div.indicator.red .inner { stroke: #ed145b;; }

div.indicator.lblue { color:#1cbbb4}
div.indicator.lblue .inner { stroke: #1cbbb4;; }

/*COURSES*/
div.courses { padding: 0px 70px; display: block; max-width: 1280px; margin: 100px auto 0;}
div.courses div.course { display: block; width: 100%; margin: 0 auto; position: relative;}
div.course-description { display: block; width: 100%; font-size: 0; margin-top: 25px; margin-bottom: 100px}
div.course-description > div { display: inline-block; vertical-align: top; font-size: 0}
div.course-description div.info { width: calc(100% - 540px); padding: 0 50px 0 20px; }
div.course-description div.indicators { width: 540px; }

div.course-description div.description { display: block;   }
div.course-description div.description p { font-size: 18px; line-height: 1.75;}
div.course-description div.register { display: block; font-size: 0; margin-top: 25px;}
div.course-description div.register div.price { display: inline-block; width: 50%; text-align: left; color: #77bd1d; font-size: 48px; font-family:'Univers LT W01_59 Ult Cond';vertical-align: middle;}
div.course-description div.buttons { display: inline-block; width: 50%; text-align: right; vertical-align: middle; }
div.course-description div.buttons.full { display: block; width: 100%; padding-right: 50px}

/* temporary */
div.course-description div.info {  display: block; width: 100%;}
div.course-description div.indicators { width: 540px; display: none;}
div.course-description div.description { text-align: center;   }
div.course-description div.buttons { display: block; width: 100%; text-align: center; }
div.course-description div.buttons a.button-green { margin: 0 auto}


div.duration { display: table; margin: 14px auto; color: #77bd1d; background: #fff; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 18px; padding: 0 15px; line-height: 40px; text-transform: uppercase;}
div.ages { display: table; margin: 14px auto; color: #77bd1d; background: #fff; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 18px; padding: 5px 40px; line-height: 30px; text-transform: uppercase;}

ul.list { display: block; width: 100%; border-bottom: 1px solid #666; margin-top: 40px}
ul.list li { display: block; width: 100%;}
ul.list li a { display: block; width: 100%; padding: 15px 160px 15px 40px; font-size: 24px; text-align: left; position: relative; border-top: 1px solid #666; color: #666; line-height: 40px;}
ul.list li a:after { content: "REGISTER"; position: absolute; right: 40px; top: 15px; display: table; width: auto;  margin: 0px 0 0 auto; line-height: 32px; color: #77bd1d; border: 3px solid #77bd1d;  background: transparent; padding: 0 20px; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 14px;}
ul.list li a:hover { color: #77bd1d}
ul.list li a:hover:after { background-color: #77bd1d; color: #fff;}

ul.list.webinars { margin-bottom: 50px}
ul.list.webinars li { font-size: 0; border-top: 1px solid #666; padding: 15px 0}
ul.list.webinars li a { border: 0; display: inline-block; vertical-align: top; width: auto;  margin-left: 10px; line-height: 32px; color: #77bd1d; border: 3px solid #77bd1d;  background: transparent; padding: 0 20px; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 14px;}
ul.list.webinars li span {  display: inline-block; width: calc(100% - 210px); padding: 0px 10px 0px 0px; font-size: 24px; text-align: left; position: relative; color: #666; line-height: 1.5;}
ul.list.webinars li div {  display: inline-block; width: 210px; vertical-align:top; text-align: right;}
ul.list.webinars li a:after { display:none;}

ul.documents  { display: block; width: 100%; margin-top: 40px; font-size: 0}
ul.documents li { display: inline-block; width: 33.33%; vertical-align: top; padding: 0 50px}
ul.documents li a:first-child { display: block; width: 100%; font-size: 14px; color: #666; text-align: center; padding: 0 20px;}
ul.documents li a:first-child:hover img { transform: scale(1.05)}
ul.documents li a img { display: block; width: 120px; margin: 0 auto 0px;}
ul.documents li a.button-green { margin: 20px auto 0}

div.resource-holder { font-size: 0}
div.resource { display: inline-block; width: 33.33%; padding-right: 40px; vertical-align: top;}
h2.resources { margin-top: 0px; margin-bottom: 40px; padding: 0; text-align: left; font-size: 34px; color: var(--accent-colour);}
h3.resources { margin-top: 0px; margin-bottom: 30px; padding: 0; text-align: left; font-size: 28px;}
h4.resources { margin-top: 0px; margin-bottom: 0; padding: 0; text-align: left; font-size: 16px; text-transform: uppercase;}
ul.resources { display: block; width: 100%; margin-top: 5px; margin-bottom: 30px;}
ul.resources li { display: block; width: 100%; margin-bottom: 5px;}
ul.resources li a { display: block; width: 100%; line-height: 1.25; text-align: left; color: #444; font-size: 18px; color: var(--accent-colour);}

div.disclosure-holder { font-size: 0}
div.glossary { display: inline-block; width: 50%; margin-bottom: 30px; padding-right: 50px; vertical-align: top}
h2.glossary { margin-top: 0px; margin-bottom: 10px; padding: 0; text-align: left; font-size: 28px; color: var(--accent-colour);}
div.glossary p { display: block; width: 100%; font-size: 16px; color: #444; text-align: left; line-height: 1.5;}


div.more-info-required { display: block; width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 20px; color: #77bd1d; font-family:'Univers LT W01_67 Bold_1476016'; line-height: 1.5; text-align: center; font-size: 20px; margin-bottom: 100px}
div.more-info-required:before { content: ""; display: block; width: 100%; max-width: 440px; border-top: 1px solid #77bd1d; height: 1px; margin: 0 auto 45px;}

/* PROGRAMS */
div.program { padding: 0 70px 100px; font-size: 0; max-width: 1280px; margin: 0 auto}
div.program aside { display: inline-block; vertical-align: top; width: 250px; background: #ebebeb; padding: 0 30px 80px; position: relative;}
div.program aside:after { position: absolute; width: calc(100% - 20px); height: calc(100% - 10px); top: 0; left: 10px; border: 1px solid #fff; border-top: 0; content: ""}
div.program-main { display: inline-block; vertical-align: top; width: calc(100% - 250px); padding: 100px 0 0 70px;}
div.program-main div.banner { display: block; margin: 0 auto 50px;}

div.program aside > div { position: relative; z-index: 2;}
div.program aside div.title { font-family: georgia; font-style: italic; color: #76bd1d; font-size: 18px; text-align: left; padding-top: 100px;}
div.program aside ul { display: block; margin-top: 20px; }
div.program aside ul li { display: block; }
div.program aside ul li a { display: block; padding: 20px 0px; text-align: left; font-size: 24px; color: #666; border-bottom: 1px solid #666; line-height: 1.1; font-family:'Univers LT W01_59 Ult Cond'; position: relative;}
div.program aside ul li.active a { color: #76bd1d; }
div.program aside ul li.active a:after {  content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 5px; border-color: transparent transparent transparent #76bd1d; position: absolute; right: 0; top: 50%; margin-top: -5px}
div.program aside ul li:last-child a { border: 0}

ul.chapters  { display: block; width: 100%;}
ul.chapters li  { display: none; width: 100%; opacity: 0}
ul.chapters li.active  { display: block; opacity: 1;}

div.chapter-body { display: block; font-size: 18px}
div.chapter-body p { margin-bottom: 40px; line-height: 1.5}
div.chapters-nav { text-align: left;}
div.chapters-nav a.button { display: inline-block; margin-right: 10px; padding: 0 20px;}
div.chapters-nav a.button.next { color: #77bd1d; border-color: #77bd1d; }
div.chapters-nav a.button.next:hover { background-color: #77bd1d; color: #fff; }
div.chapters-nav label { display: inline-block; line-height: 40px; color: #77bd1d; font-size: 24px; font-family:'Univers LT W01_59 Ult Cond'; padding-top: 0px; vertical-align: middle}
div.chapters-nav label em { font-size: 0.66em; font-style: italic; font-family: 'interstate-lightregular'; margin: 0 10px 0 20px}

div.chapters-index { display: block; width: 100%; margin-bottom: 40px}
div.chapters-index ul { display: block; width: 100%; font-size: 0; text-align: left;}
div.chapters-index ul li { display: inline-block; height: 11px; width: 50px; vertical-align: middle; position: relative;}
div.chapters-index ul li:before { content:""; font-size: 0; display: block; position: absolute; height: 1px; background: #bfbfbf; top: 5px; left:0; width: 100%;}
div.chapters-index ul li a { font-size: 0; display: block; position: absolute; height: 11px; width: 11px; background: #bfbfbf; top: 0px; left:0; border-radius: 11px;}
div.chapters-index ul li.completed:before { background: #77bd1d; }
div.chapters-index ul li.completed a { background: #77bd1d; }
div.chapters-index ul li.active a { background: #f69200; }

/*LOGIN*/
.overlay { position: fixed; top: 0; left:0; z-index: 0; background: rgba(119,189,20,0); display: block; width: 100%; height: 100%;}
.overlay.active { z-index: 900; background: rgba(119,189,20,0.9);}
div.wrapper-register  { position: fixed; top: 0; left:0; z-index: 901; display: block; width: 100%; height: 100%; overflow: auto; padding: 40px; }
div.wrapper-register  a.close img {position: absolute; right: 30px; top:30px; width: 30px; height: 30px; }
div.forms { display: block; width: 100%; max-width: 1020px; margin: 0 auto; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%); background: #fff; font-size: 0}
div.forms > div { display: inline-block; vertical-align: top; padding: 50px; width: 50%;}

div.forms div.title {font-family:'Univers LT W01_59 Ult Cond'; font-size: 30px; color: #666; display: block; text-align: left; line-height: 1.1; margin-bottom: 20px; }
div.forms div.registration div.title {margin-top: 12px;}
div.forms div.description { font-family: 'interstate-regularregular'; font-size: 12px; color: #000; display: block; text-align: left; line-height: 1.5; margin-bottom: 20px; }
div.forms div.form-steps { font-family:'Univers LT W01_59 Ult Cond'; font-size: 18px; color: #666; display: block; text-align: left; line-height: 1.1; margin-bottom: 20px;  }

div.form-row { display: block; width: 100%; font-size: 0; margin-bottom: 10px;}
div.forms form div.form-row:last-child { margin-top: 20px;}
div.form-field { display: block; width: 100%; font-size: 0; position: relative;}
div.form-field.half-width { display: inline-block; width: 50%; vertical-align: top;}
input[type="text"], input[type="email"], input[type="password"] { display: block; width: 100%; border: 1px solid #ebebeb; border-radius: 4px; padding: 0 10px; line-height: 38px; font-family: 'interstate-regularregular'; color: #666; font-size: 16px; text-align: left; }
input[type="button"], input[type="submit"] { display: table; width: auto;  margin: 0px 0 0 auto; line-height: 32px; color: #77bd1d; border: 3px solid #77bd1d;  background: transparent; padding: 0 20px; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 14px;}
div.form-field.half-width:first-child input[type="button"] { margin: 0 auto 0 0}

div.form-field.missing input[type="text"], div.form-field.missing input[type="email"], div.form-field.missing input[type="password"] { border: 1px solid #ff3300;}
div.form-field.missing:after { position: absolute; top: 2px; color: #ff3300; content: "Please fill this field"; text-align: left; font-size: 11px; display: block; right: 5px;}


*::-webkit-input-placeholder { font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase;}
*::-moz-placeholder { font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase;}
*:-ms-input-placeholder { font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase;}


div.login img.logo { display: block; width: 100%; max-width: 280px; margin: 0 auto 60px 0;}
div.form-block, div#form-login, div#form-forgot { display: block; width: 100%;}
div#form-forgot, div.form-block { display: none}
div.form-block.active { display: block;}
#form-login #frmLogin a.forgot-password { font-family: Georgia; color: #666; font-size: 16px; font-style: italic; display: inline-block; padding-bottom: 1px; border-bottom:1px solid #666; margin: 5px auto 0 0;}

#frmRegister { margin-bottom: 30px;}







/*FORMS*/

form { display: block; width: 100%; max-width: 1280px; margin: 0 auto; font-size: 14px;}
div.form-row { display: block; width: 100%; font-size: 0; position: relative;}
div.form-row-hidden { display: none}
div.field { display: block; width: 100%; font-size: 16px; position: relative; margin-bottom: 0px; padding: 0 10px 0 0;}
div.field.half-width { display: inline-block; }
div.field.half-width.left input[type="button"], div.field.half-width.left  input[type="submit"]{ margin: 0 auto 0 0}
div.field label { display: none}
div.field.missing label { color: var(--error-colour) !important}
div.field.missing span.error-message { color: var(--error-colour); display: block; font-size: 11px; position: absolute; bottom: -12px; left: 10px}

.select2-results__options::-webkit-scrollbar-track, form *::-webkit-scrollbar-track {background-color: rgba(var(--border-colour-rgb), 0.2)  }
.select2-results__options::-webkit-scrollbar , form *::-webkit-scrollbar { width: 6px; height: 6px }
.select2-results__options::-webkit-scrollbar-thumb , form *::-webkit-scrollbar-thumb { background-color: rgba(var(--border-colour-rgb),1)  }

input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"] { display: block; width: 100%; line-height: 40px; border-color: #d7d7d7; border-width: 1px; border-style:  solid; border-radius: 0px; padding: 0 10px; text-align: left; color: #000; font-family: 'interstate-lightregular'; font-size: inherit}
input[type="text"]:focus, input[type="search"], input[type="tel"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="password"]:focus { box-shadow:inset 0 0 15px 1px rgba(0,0,0,0.1); }
input[type="search"].highlighted, input[type="tel"].highlighted, input[type="number"].highlighted, input[type="text"].highlighted, input[type="email"].highlighted, input[type="password"].highlighted { background-color: #ffbc9b}
select { display: block; width: 100%; line-height: 40px; min-height: 40px; border-color: #d7d7d7; border-width: 1px; border-style:  solid;  padding: 10px; line-height: 1.5; text-align: left; color: #000; font-family: 'interstate-lightregular'; font-size: inherit; text-transform: uppercase; }
textarea { display: block; width: 100%; border-width: 1px; border-style:  solid; border-radius: 0px; border-color: #d7d7d7; padding: 10px; line-height: 1.5; text-align: left; font-size: inherit}
form button[type="submit"], form button[type="button"] { display: table; width: auto; line-height: 40px; border: 0px; padding: 0 40px; text-align: center; background-color: #000; color: #fff; font-family: 'interstate-lightregular'; font-size: 14px; text-transform: uppercase; letter-spacing: 2px; cursor: pointer; position: relative;}
form button[type="submit"]:hover, form button[type="button"]:hover { background-color: var(--accent-colour)}

form.validation-in-progress button[type="submit"], form.submit-in-progress button[type="submit"] {color: #000; position: relative;}
form.validation-in-progress button[type="submit"]:after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; font-size: 0!important; content: ""; display: block; background: url(/lib/img/white/validate.gif) transparent  no-repeat center center; background-size: 80px 10px;}
form.submit-in-progress button[type="submit"]:after { position: absolute; width: 100%; height: 100%; font-size: 0!important; content: ""; display: block; background: url(/lib/img/white/spin.gif) #000 no-repeat center center !important; background-size: 34px 34px !important; top: 0; left: 0}
button.submit-in-progress, a.submit-in-progress { background: url(/lib/img/white/spin.gif) #000 no-repeat center center !important; background-size: 34px 34px !important; font-size: 0!important; transition: none;}

*::-webkit-input-placeholder {  font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase;}
*::-moz-placeholder {  font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase;}
*:-ms-input-placeholder {  font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase;}
.select2-container--default .select2-selection--single .select2-selection__placeholder {  font-family: Georgia; color: #666; font-size: 16px; font-style: italic; text-transform: lowercase; text-align: left}


div.field.missing *::-webkit-input-placeholder { color:var(--error-colour)}
div.field.missing *::-moz-placeholder { color:var(--error-colour)}
div.field.missing *:-ms-input-placeholder { color:var(--error-colour)}

.select2-container--default  { box-sizing: border-box; width: 100%!important}
.select2-container--default .select2-selection--single { border-radius: 0; border-color: #d7d7d7}
.select2-container .select2-selection--single { height: auto}
.select2-container--default .select2-selection--single .select2-selection__rendered { color: inherit; font-size: inherit; line-height: 40px; text-align: left}
.select2-container--default .select2-selection--single .select2-selection__arrow {width: 40px; height: 42px; right: 0; top: 0; background: url(/img/icons/dark/arrow.svg) no-repeat center center; background-size: 21px 12px; transform: rotate(270deg); transition: all .1s ease-out}
.select2-container--default .select2-selection--single .select2-selection__arrow:hover {background-size: 27px 17px; }
.select2-container--open .select2-selection--single .select2-selection__arrow {transform: rotate(90deg);}
.select2-container--default .select2-selection--single .select2-selection__arrow b { display: none;}
.select2-selection__rendered  { color: #000;  text-transform: uppercase}

.select2-results__option { font-size: 14px; text-transform: uppercase;}

div.checkbox { display: block; text-align: left; position: relative; width: 100%; }
div.checkbox input[type="checkbox"] { display: none;}
div.checkbox label { display: block; color: #000; font-family: 'interstate-lightregular'; text-align: left; position: relative; width: 100%; font-size: 14px; padding-left: 31px; min-height: 20px; padding-top: 1px; line-height: 1.25;}
div.checkbox label:before { content:""; position: absolute; left:0; top: 0; border: 1px solid #000; background: transparent; display: block; width: 20px; height: 20px; box-sizing: border-box;}
div.checkbox input:checked + label:before { background: url(/lib/img/dark/checkmark.svg) no-repeat center center; background-size: 14px 12px;}

div.radios { display: block; width: 100%; text-align: left; font-size: 0}
div.radios > label, div.radios > div { display: inline-block; vertical-align: middle; margin: 0 0px;position: relative; }
div.radios > label { margin: 0 10px 0 0;}
div.radio input[type="radio"] { display: none;}
div.radio label { display: inline-block; position: relative; padding-left: 32px; padding-top: 2px; line-height: 1.25; min-height: 22px; width: auto}
div.radio label:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 22px; height: 22px; background-color: transparent; border: 1px solid #ccc; border-radius: 32px; box-sizing: border-box;}
div.radio label:after { content: ""; display: block; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; background-color: transparent; border-radius: 16px;  border: 0px solid #ccc; box-sizing: border-box;}
div.radio input[type=radio]:checked + label:after { background-color: #ccc;   border: 3px solid #ccc;}


.field a.form-link { line-height: 40px;}

div.form-row div.info { display: block; position: relative; top: 5px; padding-right: 10px}
div.form-row div.info span { display: block; font-size: 14px;  line-height: 40px; color: #000; text-transform: uppercase; font-family: 'interstate-boldregular'; position: relative;}
div.form-row div.info a { display: block; font-size: 14px;  line-height: 40px; color: #000; text-transform: uppercase; font-family: 'interstate-boldregular'; position: relative;}
div.form-row div.info a:after { content:"i"; display: block; position: absolute; right: 0; top: 10px; border-radius: 20px; background-color: #d7d7d7; color: #000; font-style: italic; font-family:'Georgia'; font-size: 14px; text-align: center; height: 20px; width: 20px; line-height: 20px; text-transform: none; transform: rotate(10deg);}

#frmLogin { margin: 30px auto 80px;}
form.login div.form-row { margin: 0px auto 20px;}
#frmLogin.js-login-form a.forgot-password { font-family: 'interstate-boldregular'; text-align: right; font-size: 14px; color: #000; display: block; line-height: 40px; text-decoration: underline;}

form.checkout div.form-row { margin: 0px auto 20px;}
div.js-checkout-section { display: none;}
div.js-checkout-section.active { display: block;}

div.js-separate-billing { display: none;}
div.js-separate-billing.active { display: block;}
div.js-new-payment-method { display: none;}
div.js-new-payment-method.active { display: block;}

div.radios > div.radio { display: block; text-align: left; font-size: 14px; margin-bottom: 10px}
div.radios > label { margin: 0 10px 0 0;}
div.radio input[type="radio"] { display: none;}
div.radio label { display: inline-block; position: relative; padding-left: 32px; padding-top: 2px; line-height: 1.25; min-height: 22px; width: auto}
div.radio label:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 22px; height: 22px; background-color: transparent; border: 1px solid #ccc; border-radius: 32px; box-sizing: border-box;}
div.radio label:after { content: ""; display: block; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; background-color: transparent; border-radius: 16px;  border: 0px solid #ccc; box-sizing: border-box;}
div.radio input[type=radio]:checked + label:after { background-color: #000;   border: 3px solid #000;}










/*DASHBOARD*/
div.wrapper-welcome { display: block; width:100%; background: #76bd1d; padding: 120px 50px}
div.wrapper-welcome.smaller { padding: 100px 50px}
div.welcome { display: block; width:100%; max-width: 1020px; margin: 0 auto; text-align: center;}
div.welcome h1 { font-size: 80px; color: #fff; margin-bottom: 40px; text-align: left;}
div.wrapper-welcome.smaller div.welcome h1 { font-size: 72px; margin-bottom: 0}
div.welcome h1 small { font-size: 0.5em; }
div.welcome h2 { font-size: 48px; color: #fff; margin-bottom: 50px; text-align: left; font-family:'Univers LT W01_59 Ult Cond'; padding: 0}
div.welcome h2 + h1 { margin-top: -20px}

div.dash-courses { display: block; width:100%; max-width: 1060px; margin: 100px auto; text-align: center; padding:0px 20px;}

div.dash-course { display: block; width: 100%; font-size: 0; margin: 0 auto 50px;}
div.dash-course > div { display: inline-block; vertical-align: top;}
div.dash-course div.thumbnail { width: 300px;}
div.dash-course div.actions { width: 190px;}
div.dash-course div.info { width: calc(100% - 490px); padding: 0 50px; color: #666; text-align: left;}

div.dash-course div.info div.title { display: block; text-align: left; font-size: 36px; font-family:'Univers LT W01_59 Ult Cond'; margin-bottom: 10px; line-height: 1.1; text-transform: uppercase;}
div.dash-course div.info div.description { font-family: 'interstate-lightregular';; font-size: 16px; line-height: 1.5; margin-bottom: 30px;}
div.dash-course div.info div.description p { font-family: 'interstate-lightregular';; font-size: 16px; line-height: 1.5; margin-bottom: 30px;}
div.dash-course div.course-progress { position: relative; font-size: 0}
div.dash-course div.header label { display: inline-block; vertical-align: bottom; font-size: 24px; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase; text-align: left; width: 50%; line-height: 1;}
div.dash-course div.header span { display: inline-block; vertical-align: bottom; font-size: 16px; font-family:'interstate-lightregular'; text-transform: uppercase; text-align: right; width: 50%; line-height: 1;}
div.dash-course div.chapter-info { font-size: 16px; font-family:'interstate-lightregular'; }
div.dash-course div.chapter-info b { font-size: 16px; font-family: 'interstate-lightregular';}

div.bar { height: 10px; margin: 10px auto; background: rgba(119,189,20,0.2); position: relative; border-radius: 5px; overflow: hidden}
div.bar span { display: block; position: absolute; left: 0; top: 0; height: 10px; width: 40%; background: rgba(119,189,20,1);  }

div.actions a.button { width: 100%; display: block;}
div.actions a.button { color: #fff; background-color: #76bd1d; border-color: #76bd1d;}
div.actions a.button:hover { background-color: #fff; color: #76bd1d; }
div.active div.actions a.button { background: #fff; color: #76bd1d; border-color: #76bd1d;}
div.active div.actions a.button:hover { background-color: #76bd1d; color: #fff;}
div.completed div.actions a.button { background-color: #f69200; color: #fff; border-color: #f69200}
div.completed div.actions a.button:hover { background-color: #fff; color: #f69200;  }

div.dash-available-courses  {display: block; width: 100%; text-align: left; font-size: 0}
div.dash-available-courses  div.dash-available-course {display: block; width: 100%; vertical-align: top; padding-right: 50px; margin: 0 0px 50px 0}
/*div.dash-available-courses  div.dash-available-course:nth-child(2n) {padding-right: 0px; padding-left: 50px;}*/
div.dash-available-course > div { display: inline-block; vertical-align: top;}
div.dash-available-course div.thumbnail { width: 170px; padding-right: 30px}
div.dash-available-course div.info { width: calc(100% - 170px); padding: 0px; color: #666; text-align: left;}
div.dash-available-course div.info a.button { margin: 0 auto 0 0}
div.dash-available-course div.info div.title { display: block; text-align: left; font-size: 36px; font-family:'Univers LT W01_59 Ult Cond'; margin-bottom: 10px; line-height: 1.1; text-transform: uppercase;}
div.dash-available-course div.info div.description { font-family: 'interstate-lightregular';; font-size: 16px; line-height: 1.5; margin-bottom: 0px;}
div.dash-available-course div.info div.description p { font-family: 'interstate-lightregular';; font-size: 16px; line-height: 1.5; margin-bottom: 30px;}
div.dash-available-course div.info div.price { text-align: left; color: #77bd1d; font-size: 48px; font-family:'Univers LT W01_59 Ult Cond'; margin-bottom: 30px;	}


div.welcome div.dash-summary { width: 100%; display: block; text-align: center; font-size: 0}
div.welcome div.dash-course { max-width: 510px; position: relative; display: inline-block; padding-right: 40px; vertical-align: top}
div.welcome div.dash-course > div { vertical-align: top;}
div.welcome div.dash-course > div.dash-course-type { display: block; width: 100%; text-align: left; font-size: 24px; color: #fff; margin-bottom: 30px; line-height: 1; font-family:'Univers LT W01_59 Ult Cond';}
/*div.welcome div.dash-course:after { content: "ACTIVE COURSE"; position: absolute; top: 0; color: #fff; font-size: 24px; font-family:'Univers LT W01_59 Ult Cond'; text-align: left; display: block; left:0}*/
div.welcome div.dash-course div.thumbnail { width: 120px;}
div.welcome div.dash-course div.info { width: calc(100% - 120px); padding: 0 0px 0 20px; color: #fff; }
div.welcome div.dash-course div.info div.title { margin-top: -5px;}


div.welcome div.bar { background: rgba(255,255,255,0.2); margin: 8px auto;}
div.welcome div.bar span { background: rgba(255,255,255,1);  }

div.welcome div.buttons { text-align: left; margin-top: 20px; }
div.welcome a.button { color: #fff; border-color: #fff; margin: 0 10px 0 0}
div.welcome a.button:hover { background-color: #fff; color: #76bd1d;}



/*COURSE*/

div.module { max-width: 1280px; margin: 0 auto; font-size:0}
div.module > aside, div.module > div.module-main { display: inline-block; vertical-align: top;}
div.module aside {background-color: #76bd1d; width: 320px; color: #fff; padding:30px;}
div.module div.module-main {width: calc(100% - 320px); padding: 30px 40px;}

div.module aside div.thumbnail { margin-bottom: 30px;}
div.module aside div.thumbnail img { display: block; width: 100%;}
div.module aside div.title { text-align: left; font-size: 36px; margin-bottom: 34px; line-height: 1.1; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase;}
div.course-index > ul {display: block; width: 100%; }
div.course-index > ul > li {display: block; width: 100%; border-bottom: 1px solid #fff; padding: 10px 0px;}
div.course-index > ul > li.active { border: 0}
div.course-index > ul > li > a { display: block; width: 100%; font-size: 24px; line-height: 30px; position: relative; padding-right: 30px; color: #fff; cursor: pointer; font-family:'Univers LT W01_59 Ult Cond';}
div.course-index > ul > li > a:after { content:"+";display: block; position: absolute; text-align: right; line-height: 30px; font-size: 30px; color: #fff; font-family: 'interstate-lightregular'; width: 30px; top: 0; right:0}
div.course-index > ul > li.active > a:after { content:"-"; transform: scaleX(1.5); transform-origin: 100% 50%;}
div.course-index > ul > li ul { display: block; overflow: hidden; max-height: 0;}
div.course-index > ul > li.active ul { max-height: 500px; margin: 10px auto;}
div.course-index > ul > li ul li { display: block; }
div.course-index > ul > li ul li a { display: block; font-size: 14px; line-height: 1.25; padding: 3px 0 3px 25px; position: relative; color: #fff; opacity: .35; }
div.course-index > ul > li ul li.book a { opacity: 1; }
div.course-index > ul > li ul li.pending a { opacity: 0.5}
div.course-index > ul > li.pending > a { opacity: 0.7}
div.course-index > ul > li ul li.completed a, div.course-index > ul > li ul li.active a { opacity: 1}
div.course-index > ul > li ul li a:after { content: ""; display: block; width: 16px; height: 16px; background: url() no-repeat center center; background-size: 10px 14px; position: absolute; top: 3px; left:0;}
div.course-index > ul > li ul li.completed a:after { background-image: url(/img/icons/checkmark.svg); background-color: #fff; border-radius: 16px;}
div.course-index > ul > li ul li.active a:after { background-image: url(/img/icons/star.svg); background-size: 16px 16px; }

div.module-header {position: relative; padding-right: 280px; color: #666; border-bottom: 1px solid #ebebeb; min-height: 100px;}
div.module-header div.title { text-align: left; margin-bottom: 5px; text-align: left; line-height: 1.1; font-family:'Univers LT W01_59 Ult Cond'; font-size: 24px;}
div.module-header div.page-title { text-align: left; margin-bottom: 15px; text-align: left; line-height: 1.1; font-family:'Univers LT W01_59 Ult Cond'; font-size: 48px;}
div.module-header div.page-index { position: absolute; right: 0px ;bottom: -2px; height: 100%; width: 280px; text-align: right; }
div.module-header div.page-index a.button-resources { display: table; width: auto; margin: 0px 0 auto auto; line-height: 40px; color: #fff;  padding: 0 10px 0 56px; background: url(/img/icons/spectacles.svg) #f69200 no-repeat 10px center; background-size: 40px auto; font-size: 16px; font-family:'Univers LT W01_59 Ult Cond';}
div.module-header div.page-index a.button-resources:hover { background-color: #ccc; }
div.module-header div.page-index div.current-page { line-height: 1.1; font-family:'Univers LT W01_59 Ult Cond'; font-size: 24px; margin-bottom: 20px }
div.module-header div.page-index div.current-page small { font-size: 0.75em}

div.module-header div.page-index a.button { border-color: #76bd1d; line-height: 30px; color: #76bd1d; background: #fff; font-size: 15px; padding: 0 10px; display: inline-block; margin-left: 20px; margin-bottom: 15px}
div.module-header div.page-index a.button:hover { background-color: #76bd1d; color: #fff;}

div.module-body { padding-top: 30px;}

a.goback { line-height: 54px; padding: 0 20px; background: #76bd1d; color: #fff; display: table; width: auto; margin: 0 0 0 auto; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 18px; border: 3px solid #76bd1d}
a.goback.hidden { display: none}
a.continue { line-height: 54px; padding: 0 20px; background: #76bd1d; color: #fff; display: table; width: auto; margin: 0 0 0 auto; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 18px; border: 3px solid #76bd1d}
a.continue.inactive { display: none;}
a.take-quiz { line-height: 54px; padding: 0 20px; background: #76bd1d; color: #fff; display: none; width: auto; margin: 0 0 0 auto; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 18px; border: 3px solid #76bd1d}
a.take-quiz.active { display: table}
a.goback:hover { background: #fff; color: #76bd1d;}
a.continue:hover { background: #fff; color: #76bd1d;}
a.take-quiz:hover { background: #fff; color: #76bd1d;}
div.course-module-body a.continue { float: right;}
div.course-module-body a.goback { float: left;}
div.course-buttons { display: block; height: 94px; padding-top: 15px; border-top: 2px solid #76bd1d; border-bottom: 2px solid #76bd1d}

div.book-navigation  { display: table; width: auto; margin: 0 0 0 auto; width: 54px; position: fixed; top: 50%; right: 0; z-index: 10; transform: translateY(-50%); -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%); }
div.book-navigation.course-navigation  { display: none!important; top: 160px; transform: translateY(0%); -webkit-transform: translateY(0%);  -ms-transform: translateY(0%); }

div.book-navigation:before  { content: ""; display: block; width: 100%; color: #76bd1d; font-size: 18px; font-family:'Univers LT W01_59 Ult Cond'; content: "PAGES"; text-transform: uppercase; text-align: center; padding-bottom: 5px}
div.book-navigation.course-navigation:before  { display: none; }
div.book-navigation.empty:before  { display: none;}

div.book-navigation a  { line-height: 54px; padding: 0px; background: #76bd1d; color: #fff; display: block; width: 54px; margin: 0 0 0 auto; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 18px; text-align: center; margin-bottom: 1px; position: relative; opacity: .7}
div.book-navigation a.active  { opacity: 1}
div.book-navigation a span { display: block; width: 0; overflow: hidden; line-height: 54px; display: block; height: 100%; width: 300px; position: absolute; left: 0px; top: 0; background-color: #76bd1d; max-width: 0px;}
/*div.book-navigation a.icon:hover  { transform: scale(1.25)}*/
/*div.book-navigation a.icon.active  { background-color: #f69200}*/

div.book-navigation a.nav-page-link:hover span { max-width: 300px; left: -300px; padding: 0 10px;}
div.book-navigation.course-navigation a.nav-page-link { display: none !important}

div.book-icons { display: block; width: 100%; margin-top: 20px;}
div.book-navigation a.icon  { line-height: 1.1; padding: 0px; color: #f69200; background-color: transparent; display: block; width: 54px; margin: 0 0 0 auto; font-family:'Univers LT W01_67 Bold_1476016'; font-size: 32px; text-align: center; margin-bottom: 15px; }
div.book-navigation a.icon:hover  { transform: scale(1); color: #76bd1d}

div.book-navigation a.icon  svg { margin: 0 auto}
div.book-navigation a.icon span  { display: block; width: 100%; color: inherit; font-size: 18px; font-family:'Univers LT W01_59 Ult Cond'; text-transform: uppercase; text-align: center; padding-top: 0px}

div.tooltip { position: absolute; display: block; width: 400px; background: #f69200; padding: 30px; z-index: 100; opacity: 0; transition: opacity .3s ease-out; box-shadow: 5px 5px 8px rgba(0,0,0,0.3); }
div.tooltip.active { opacity: 1}
div.tooltip a.close { position: absolute; display: block; right: 20px; top:20px; }
div.tooltip a.close img { width: 12px; height: 12px; display: block;}
div.tooltip:before { content: ""; position: absolute; width: calc(100% - 20px); height: calc(100% - 20px); top:10px; left: 10px; border: 1px solid #fff;}
div.tooltip div { position: relative; color: #fff; text-align: left;}
div.tooltip div.title { font-size: 18px; font-family: 'interstate-lightregular'; line-height: 1;  margin-bottom: 12px;}
div.tooltip div.body { font-size: 14px; font-family: 'interstate-lightregular'; line-height: 1.5;}
div.tooltip div.body p { margin-bottom: 15px;}
div.tooltip div.body p:last-child { margin-bottom: 0px;}
/*FRAGMENTS*/
.fragment { display: block; margin: 0 auto 50px; color: #666; text-align: left;}
.fragment.with-two-columns p { column-count: 2; column-gap: 40px;}

.fragment h2 { font-size: 36px; font-family: 'interstate-regularregular'; line-height: 1.1; margin: 0 auto 20px; text-transform: none; padding: 0;}
.fragment h3 { font-size: 24px; font-family: 'interstate-regularregular'; line-height: 1.1; margin: 0 auto 10px; text-transform: none; padding: 0}
.fragment p { font-size: 18px; font-family: 'interstate-lightregular'; line-height: 1.5;}
.fragment a.tooltip { color: #f69200; display:inline-block; padding-bottom: 1px; border-bottom: 1px solid #f69200;}
.fragment a.tooltip:hover { background-color: #f69200; color: #fff; }
div.floating-image { float: left; margin: 0 20px 20px 0}




div.olp-wrapper { display: block; width: 100%; max-width: 100%; margin: 0 auto; color: #666}
div.olp-wrapper:after { display: block; width: 100%; content:""; clear: both;}

.margin-top-0 { margin-top: 0px !important; }
.margin-top-50 { margin-top: 50px !important; }
.margin-top-100 { margin-top: 100px !important; }
.margin-bottom-0 { margin-bottom: 0px !important; }
.margin-bottom-50 { margin-bottom: 50px !important; }
.margin-bottom-100 { margin-bottom: 100px !important; }

div.olp-content a, .olp-content a { color: #f69200}
div.olp-wrapper a, .olp-wrapper a { color: #f69200}
div.olp-column-wrapper { display: block; width: 100%; margin: 0 auto; font-size: 0; text-align: inherit; color: inherit;}
div.olp-column { display: block; margin: 0 auto;  text-align: inherit; color: inherit; width: 100%;}
div.olp-column-wrapper-content div.olp-column { padding: 0 20px;}
div.olp-column-wrapper-content div.olp-column:first-child { padding-left: 0px;}
div.olp-column-wrapper-content div.olp-column:last-child { padding-right: 0px;}
div.olp-columns-1 div.olp-column { display: block; width: 100%; vertical-align: top}
div.olp-columns-2 div.olp-column { display: inline-block; width: 50%; vertical-align: top}
div.olp-columns-3 div.olp-column { display: inline-block; width: 33.33%; vertical-align: top}
div.olp-columns-4 div.olp-column { display: inline-block; width: 25%; vertical-align: top}
div.olp-columns-2-large-left div.olp-column, div.olp-columns-2-large-right div.olp-column { width: 60%; }
div.olp-columns-2-large-left div.olp-column:last-child { width: 40%; }
div.olp-columns-2-large-right div.olp-column:first-child { width: 40%; }

div.olp-block { display: block; width: 100%; font-size: 18px; text-align: left; color: #666}
.olp-content { display: block; width: 100%; font-size: 18px; text-align: left; color: #666}
div.olp-wrapper.center .olp-content, div.olp-wrapper.center div.olp-block { text-align: center; }

.olp-content h1, .olp-content h2, .olp-content h3, .olp-content h4, .olp-content h5, .olp-content h6 { font-weight: normal; color: inherit; display: block; text-align: inherit; margin: 0; padding: 0; line-height: 1.1; text-transform: none; letter-spacing: default; text-transform: none;}
.olp-block h1, .olp-block h2, .olp-block h3, .olp-block h4, .olp-block h5, .olp-block h6 { font-weight: normal; color: inherit; display: block; text-align: inherit; margin: 0; padding: 0; line-height: 1.1; text-transform: none; letter-spacing: inherit; text-transform: none;}
h1:empty, h2:empty,h3:empty,h4:empty,h5:empty,h6:empty,.olp-content:empty { display: none !important}

.olp-content p { display: block; width: 100%; font-size: inherit; text-align: inherit; color: inherit; line-height: 1.5; font-family: 'interstate-lightregular'; margin: 0 auto 30px}
.olp-content p:last-child { margin-bottom: 0}
.olp-content b, .olp-content strong { font-weight: normal; font-family: 'interstate-boldregular'; }
.olp-content.with-two-columns { column-count: 2; column-gap: 40px; }
.olp-content.with-three-columns { column-count: 3; column-gap: 30px; }
.olp-content a { font-size: inherit; text-align: inherit; }
.olp-content a.button { font-size: 18px;}

div.olp-block h2, .olp-content h2 { font-family: 'interstate-regularregular'; font-size: 28px; margin: 30px auto 25px }
div.olp-block h2:empty, .olp-content h2:empty { display: none !important}
div.olp-block h3, .olp-content h3 { font-family: 'interstate-regularregular'; font-size: 24px; margin: 25px auto 5px }
div.olp-block h3:empty, .olp-content h3:empty { display:none !important}
div.olp-block h2:first-child, .olp-content h2:first-child { margin-top: 0 }
.olp-content h4 { font-family: 'interstate-regularregular'; font-size: 24px; margin: 25px auto 20px }
.olp-content h5 { font-family: 'interstate-regularregular'; font-size: 18px; margin: 25px auto 10px; font-weight: normal; }

.olp-float-left {float: left; clear: right;}
img.olp-float-left {display: block; margin: 0 30px 30px 0;  max-width: 30%;}
img.olp-banner { display: block; width: 100%; margin: 0 auto 30px;}

.olp-content ol { counter-reset: item; list-style-type: none;}
.olp-content ol > li {counter-increment: item; padding-left: 40px; position: relative; margin-bottom: 1.2em; line-height: 1.5;}
.olp-content ol > li:before {content: counter(item) "."; position: absolute; left: 0; top: 0.1em; line-height: 1; text-align: left; font-size: 1.2em;  font-family: 'interstate-boldregular';}

.olp-content ul { list-style-type: none;}
.olp-content ul > li {padding-left: 30px; position: relative; margin-bottom: 1.2em; line-height: 1.5;}
.olp-content ul > li:before {content: ""; position: absolute; left: 0; top: 0.4em; width: 10px; height: 10px; border-radius: 10px; background-color: #666; display: block;}
.olp-content ul > li ul {padding-left: 5px; position: relative; margin-bottom: 1.2em; line-height: 1.5; margin-top: 1.2em; }
.olp-content ul > li ul li {padding-left: 15px; position: relative; margin-bottom: 1.2em; line-height: 1.5; margin-top: 1.2em; }
.olp-content ul > li ul   li:before {content: "-"; position: absolute; left: 0px; top: 0em; width: auto; height: 10px; border-radius: 0px; background-color: transparent; display: block; }

.olp-content ol ul {padding-left: 30px; }
.olp-content ol ul > li {padding-left: 20px; margin-bottom: .5em}
.olp-content ol ul > li:before {top: 0.5em; width: 6px; height: 6px; border-radius: 6px; }


.olp-content.olp-references p { margin-bottom: 10px; font-size: 0.8em}

p.olp-important { background-color: #f6f6f6; padding: 20px; }

.olp-video-wrapper { display: block; width: 100%; }
.olp-video-wrapper > p { display: block; font-size: 18px; padding: 50px 20px; text-align: center; line-height: 1; color: #aaa}
.olp-video-wrapper.video-widescreen { display: block; width: 100%; position: relative; height: 0; padding-bottom: 56.25%}
.olp-video-wrapper.video-standard { display: block; width: 100%; position: relative; height: 0; padding-bottom: 75%}
.olp-video-wrapper.video-widescreen > span, .olp-video-wrapper.video-standard > span { display: block; width: 100%; position: absolute; height: 100%; top: 0; left: 0; border: 0;}
.olp-video-wrapper.video-widescreen iframe, .olp-video-wrapper.video-standard iframe { display: block; width: 100%; position: absolute; height: 100%; top: 0; left: 0; border: 0;}
#tinymce .video-widescreen, #tinymce .video-standard { border: 1px dotted #aaa}

div.book-list a { margin-bottom: 40px; display: block}

/* COURSE SPECIFIC */

/* containers */
div.three-cols, div.two-cols { display: block; width: 100%; font-size: 0; margin: 50px auto;}
div.three-cols > div { display: inline-block; vertical-align: top; padding: 0 20px; width: 33.33%; font-size: 16px;}
div.two-cols > div { display: inline-block; vertical-align: top; padding: 0 20px; width: 50%; font-size: 16px;}

/* images */
img.olp-centered { display: block; margin: 0 auto 35px}
img.olp-side-by-side { display: inline-block; width: 48%; margin-left: 4%;}
img.olp-side-by-side:first-child { margin-left: 0;}
img.float-right { float: right; margin: 0 0 50px 50px; display: block; max-width: 50%; }
img.float-left { float: left; margin: 0 50px 50px 0px; display: block; max-width: 50%; }
img.full-image { display: block; width: 100%;}

/*TABLES*/ 

table.olp-table-1 { background-color: #f6f6f6; border: 1px solid #d7d7d7; border-collapse: collapse; font-size: 18px; width: 100% !important}
table.olp-table-1 tr td { padding: 20px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.5; font-family: 'interstate-lightregular';}

table.olp-table-2 { background-color: #f6f6f6; border: 1px solid #d7d7d7; border-collapse: collapse; font-size: 18px; width: 100% !important}
table.olp-table-2 tr td { padding: 20px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.5; font-family: 'interstate-lightregular'; vertical-align: top;}
table.olp-table-2 thead tr td { padding: 20px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.5; font-family: 'interstate-lightregular'; background-color: #d7d7d7; vertical-align: top;}

table.olp-table-3 { background-color: #fff; border: 1px solid #d7d7d7; border-collapse: collapse; font-size: 18px; width: 100% !important}
table.olp-table-3 tr td { padding: 20px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.5; font-family: 'interstate-lightregular'; vertical-align: top; border: 1px solid #d7d7d7;}
table.olp-table-3 thead tr td { padding: 20px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.5; font-family: 'interstate-lightregular'; background-color: #d7d7d7; vertical-align: top;}

table.olp-table-4 { background-color: #fff; border: 1px solid #d7d7d7; border-collapse: collapse; font-size: 16px; width: 100% !important; height: auto !important}
table.olp-table-4 tr td { padding: 10px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.25; font-family: 'interstate-lightregular'; vertical-align: top; border: 1px solid #d7d7d7; height: auto !important}
table.olp-table-4 thead tr td { padding: 10px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.25; font-family: 'interstate-lightregular'; background-color: #d7d7d7; vertical-align: top; height: auto !important}

table.olp-table-5 { background-color: #fff; border: 1px solid #d7d7d7; border-collapse: collapse; font-size: 16px; width: 100% !important; height: auto !important}
table.olp-table-5 tr td { padding: 10px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.25; font-family: 'interstate-lightregular'; vertical-align: top; border: 1px solid #76bd1d; height: auto !important}
table.olp-table-5 thead tr td { padding: 10px;  font-size: inherit; text-align: inherit; color: inherit; line-height: 1.25; font-family: 'interstate-lightregular'; background-color: #76bd1d; vertical-align: top; height: auto !important; color: #fff;}

table.olp-table-two-eq-cols, table.olp-table-three-eq-cols, table.olp-table-four-eq-cols { width: 100% !important}
table.olp-table-two-eq-cols tr td { width: 50% !important}
table.olp-table-three-eq-cols tr td { width: 33.33% !important}
table.olp-table-four-eq-cols tr td { width: 25% !important}



/*CART*/

ul.js-cart-menu { display: block; width: 100%; font-size: 0; display: none;}
ul.js-cart-menu li { display: inline-block; padding-right: 50px; vertical-align: top;}
ul.js-cart-menu li a { display: block; font-size: 14px; color: #959595; text-transform: uppercase; padding-bottom: 7px; border-bottom: 2px solid transparent; line-height: 1; letter-spacing: 1px;  font-family: 'interstate-boldregular';}
ul.js-cart-menu li a:hover { color: #000}
ul.js-cart-menu li a.active { color: #000; border-bottom: 2px solid #000}

div.added-to-cart {position: absolute; top: 90px; right: calc(50vw - 640px); background: #fff; width: 400px; padding: 0px 20px; border: 1px solid #d7d7d7; font-size: 0; display: block; z-index: -1; opacity: 0; max-height: 0; transition: opacity .3s ease-out; overflow: hidden; box-shadow: 0px 7px 15px 0px rgba(0,0,0,0.55);}
div.added-to-cart.active { z-index: 1; opacity: 1; max-height: 9999px; padding: 50px 20px; }
div.added-to-cart > div.title {font-size: 14px; display: block; margin: 0 auto 50px; line-height: 1; color: #000; font-family: 'interstate-boldregular'; letter-spacing: 15px;  text-align: center;}
div.added-to-cart div.product { padding-bottom: 50px; border-bottom: 1px solid #d7d7d7;  display: block; font-size: 0; margin-bottom: 50px;}
div.added-to-cart div.product-image, div.added-to-cart div.product-information { width: 100px; display: inline-block; vertical-align: top; vertical-align: top}
div.added-to-cart div.product-information { width: calc(100% - 100px); padding-left: 30px; padding-right: 0px; color: #000; }
div.added-to-cart div.product-image img { display: block; width: 100px; border: 2px solid #d7d7d7;}
div.added-to-cart div.product-item-number {  width: 100%; display: block; font-size: 14px; font-family: 'interstate-regularregular'; line-height: 1; text-align: left; margin: 5px auto}
div.added-to-cart div.product-information div.brand {  width: 100%; display: block; font-size: 14px; font-family: 'interstate-boldregular'; line-height: 1; text-align: left; margin: 0px auto; color: #959595; letter-spacing: 2px;}
div.added-to-cart div.product-information div.price {  width: 100%; display: block; font-size: 14px; font-family:'Futura LT W01 Bold'; line-height: 1; text-align: left; margin: 10px auto;}
div.added-to-cart div.product-information div.title { font-size: 14px; font-family: 'interstate-boldregular'; letter-spacing: 1px; display: block; text-align: left; margin: 5px auto; padding: 0; line-height: 1.1; left: 0}
div.added-to-cart div.product-information a.button { display: block; width: 100%; line-height: 40px; text-align: center;  font-family: 'interstate-boldregular'; font-size: 14px; margin-top: 50px; background-color: #000; color: #fff; border: 1px solid #000; }

div.order-confirmation { display: block; width: 100%; color: #000; font-family: 'interstate-regularregular'; font-size: 18px; }
div.order-confirmation div.wrapper-cart { padding-top: 0;}


div.wrapper-cart { font-size: 0; padding: 100px 0; max-width: 1160px;}
div.cart-left, div.cart-right { display: inline-block; vertical-align: top; width:50%; padding: 0 40px;}
div.cart-left { padding-left: 0px;}
div.cart-right { padding-right: 0px;}
div.wrapper-cart h2 { line-height: 1; margin: 0; padding: 0}

div.cart-block {padding-bottom: 30px; border-bottom: 1px solid #d7d7d7}

div.cart-product { margin-top: 40px; font-size: 0}
div.wrapper-cart div.product-image, div.wrapper-cart div.product-information { width: 50%; display: inline-block; vertical-align: top}
div.wrapper-cart div.product-image { width: 140px; border: 2px solid #f69200;}
div.wrapper-cart div.photo { width: 100%; display: block; margin: 0 auto; position: relative;}
div.wrapper-cart div.product-information { color: #000; width: calc(100% - 140px); padding-left: 40px;}
div.wrapper-cart div.brand {  width: 100%; display: block; font-size: 12px; font-family: 'interstate-boldregular'; letter-spacing: 3px; line-height: 1; text-align: left;}
div.wrapper-cart div.product-item-number {  width: 100%; display: block; font-size: 10px; font-family: 'interstate-regularregular'; line-height: 1; text-align: left;}
div.wrapper-cart div.product-information div.price {  width: 100%; display: block; font-size: 18px; font-family: 'interstate-boldregular'; line-height: 1; text-align: left; margin: 20px auto 10px;}
div.wrapper-cart div.product-information h1 { font-size: 22px; font-family: 'interstate-lightregular'; letter-spacing: 0px; display: block; text-align: left; margin: 0px auto 10px; padding: 0; line-height: 1.1; left: 0}
div.wrapper-cart div.product-information div.product-details { font-size: 14px; font-family: 'interstate-regularregular'; display: block; text-align: left; margin: 0 auto; padding: 0; line-height: 1.75; }
div.wrapper-cart div.product-information div.cart-tools { width: 100%; display: block; font-size: 0px; text-align: left; margin: 14px auto 0;}
div.wrapper-cart div.product-information div.cart-tools > div { width: 180px; display: inline-block; vertical-align: middle}
div.wrapper-cart div.product-information div.cart-tools > div.cart-buttons { width: calc(100% - 180px); }
div.wrapper-cart div.product-information div.cart-tools div.qty { font-size: 14px; font-family: 'interstate-boldregular'; line-height: 40px; text-align: left;}
div.wrapper-cart div.product-information div.cart-tools div.qty input { line-height: 40px; display: inline-block; width: 60px; text-align: center; border: 1px solid #d7d7d7; color: #000; font-size: 14px; font-family: 'interstate-boldregular'; margin: 0 15px; }
div.wrapper-cart div.product-information div.cart-buttons a.button { display: inline-block; vertical-align: middle; width: auto; padding: 0 20px; border-right: 1px solid #d7d7d7; line-height: 40px; background: none;}
div.wrapper-cart div.product-information div.cart-buttons a.button:last-child { border: 0}
div.wrapper-cart div.product-information div.cart-buttons a.button img { display: block; width: 14px; }

div.cart-help { color: #959595;  font-family: 'interstate-regularregular'; font-size: 18px; letter-spacing: 3px; text-align: left; line-height: 23px; display: none}

div.promo-code { padding: 40px 0 10px; display: block; font-size: 0}
div.promo-code div.title { width: 100%; display: block; font-size: 18px; font-family: 'interstate-boldregular'; color: #000; text-align: left; margin-bottom: 14px; letter-spacing: 3px; line-height: 1}
div.promo-code div.code-holder { display: inline-block; width: calc(100% - 120px); vertical-align: top;}
div.promo-code div.code-holder input { width: 70%; margin: 0 auto 0 0; padding: 0 20px; line-height: 40px; letter-spacing: 1px; font-size: 14px;}
div.promo-code div.button-holder { display: inline-block; width: 120px; vertical-align: top;}
div.promo-code div.button-holder button { width: 100%; display: block; background: transparent; border: 1px solid #d7d7d7; color: #000; line-height: 38px;}

div.cart-totals { display: block; width: 100%; padding-top: 40px;}
div.cart-totals a.button { display: block; width: 100%; margin: 40px auto; font-size: 14px; letter-spacing: 0px}
div.cart-totals a.button.white { color: #000; background-color: #fff; border: 1px solid #d7d7d7; font-family: 'interstate-regularregular'; }
div.cart-totals img { display: table; margin: 0px auto;}
div.cart-totals div.cart-total-line { display: block; width: 100%; font-size: 0; height: 40px;}
div.cart-totals div.js-cart-total-line-discount { display: none;}
div.cart-totals div.js-cart-total-line-discount.active { display: block;}
div.cart-totals div.cart-total-line.grand-total { border-top: 1px solid #d7d7d7; padding-top: 30px; height: auto;}
div.cart-totals div.cart-total-line > div { display: inline-block; vertical-align: top; font-size: 14px; font-family: 'interstate-boldregular'; color: #000;}
div.cart-totals div.cart-total-line.grand-total > div { font-size: 18px;}
div.cart-total-label {   text-align: left; letter-spacing: 0px; line-height: 1; text-transform: uppercase; text-align: left; width: calc(100% - 130px);}
div.cart-total-label small {  font-size: 12px; color: #acacac; text-align: left; display: block; letter-spacing: 3px; line-height: 1; text-transform: uppercase; margin-top: 4px; display: none;}
div.cart-total-value { width: 130px; text-align: right;}

div.js-heavy-items-disclaimer { color: #ff3300; font-size: 18px; line-height: 1.5; padding: 20px 0px; display: none;}
div.js-heavy-items-disclaimer.active { display: block;}

div.js-save-card-row { display: none;}
div.js-save-card-row.active { display: block;}

div.sign-in-hint { display: block; margin-bottom: 50px; }
div.sign-in-hint a.button { display: inline-block; width: 100px; vertical-align: middle; font-size: 14px; padding: 0;}
div.sign-in-hint p { display: inline-block; width: calc(100% - 100px); padding-left: 20px;  vertical-align: middle; margin: 0; color: #000; font-size: 14px; font-family: 'interstate-boldregular'; }

div.form-title { text-align: left; display: block; font-size: 18px; font-family: 'interstate-boldregular'; color: #000;letter-spacing: 3px; line-height: 1; text-transform: uppercase; margin-top: 40px }
div.form-section-title { text-align: left; display: block; font-size: 14px; font-family: 'interstate-boldregular'; color: #acacac;letter-spacing: 1px; line-height: 1; text-transform: uppercase; padding: 20px 0}

div.shipping-info-review { display: block; font-size: 0; text-align: left; margin-top: 30px;}
div.shipping-info-review > div { display: inline-block; vertical-align: top; max-width: 220px; width: 50%; padding-right: 20px; font-family: 'interstate-boldregular';  font-size: 14px; color: #000; line-height: 1.5 }
div.shipping-info-review > div b { display: block; font-family: 'interstate-boldregular'; padding: 15px 0 }



div.js-review-block { display: block; font-size: 0; text-align: left; margin-bottom: 50px;}
div.js-review-block div.title {  text-align: left; display: block; font-size: 14px; font-family: 'interstate-boldregular'; color: #acacac;letter-spacing: 1px; line-height: 1; text-transform: uppercase; margin-top: 30px}
div.js-review-block-data { display: block; font-size: 0; text-align: left; margin-top: 10px;}
div.js-review-block-data > div { display: inline-block; vertical-align: top; max-width: 220px; width: 50%; padding-right: 20px; font-family: 'interstate-boldregular';  font-size: 14px; color: #000; line-height: 1.5 }
div.js-review-block-data > div div { display: block; font-family: 'interstate-regularregular';  font-size: 14px; color: #000; line-height: 1.5 }
div.js-review-block-data > div b { display: block; font-family: 'interstate-boldregular'; padding: 15px 0 }
div.js-review-block-data a { display: table; padding-bottom: 3px; border-bottom: 1px solid #000; margin-top: 20px; font-size: 14px; font-family: 'interstate-boldregular'; }

p.js-processing-disclaimer { display: none; text-align: center; color: #000; font-size: 14px; line-height: 1.5; padding: 0 40px; }
p.js-processing-disclaimer.active { display: block; }


div.field-info { display: block; line-height: 1.5; padding: 10px 0; font-size: 12px;}

div.cart-totals a.js-place-order {display: none;}
div.cart-totals a.js-place-order.active {display: block;}

div.js-sku-selection-wrapper { display: block; width: 100%; font-size: 18px; margin: 30px 0 0px; display: none}
div.js-sku-selection-wrapper.active { display: block; }

p.order-confirm { display: block; font-size: 20px; text-align: center; line-height: 1.5;}
p.order-confirm a { margin-top: 40px;}

div.acknowledgements { display: block; width: 100%; text-align: center; }
div.acknowledgements img { display: block; width: 80%; margin: 50px auto; max-width: 400px;}

div.inquiry-form { max-width: 1280px; margin: 0 auto; text-align: center;}
div.inquiry-form h3 { text-align: center;}
div.inquiry-form form { max-width: 800px; margin: 0 auto; text-align: center;}
div.inquiry-form p.reveal-response {display: block; margin: 50px auto; font-size: 18px; text-align: center;}


div.datepicker { z-index: 2; }
div.datepicker input { position: relative; z-index: 2; background: transparent; cursor: pointer; }
div.datepicker:after { content:""; border-left: 1px solid var(--border-colour); top: 0; right: 10px; position: absolute; width: 70px; height: 100%; background: url(/img/icons/dark/datepicker.png) no-repeat center center; cursor: pointer; z-index: 1;}
#ui-datepicker-div { display: block; width: 400px; background: #fff; max-width: 100vw; transform: translateY(10px); border: 1px solid var(--border-colour); box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.25); padding: 20px}
table.ui-datepicker-calendar { width: 100%;}
table.ui-datepicker-calendar td { text-align: center; line-height: 2;}
table.ui-datepicker-calendar th { text-align: center; line-height: 3;}
.ui-datepicker-title { display: block; width: 100%; text-align: center; line-height: 2;}
.ui-datepicker-prev { font-size: 0; position: absolute; left: 20px; top: 25px; width: 30px; height: 30px; background: url(/img/icons/dark/arrow.svg) no-repeat center center; background-size: 6px 12px; cursor: pointer;}
.ui-datepicker-prev.ui-state-disabled { background: none;}
.ui-datepicker-next { font-size: 0; position: absolute; right: 20px; top: 25px; width: 30px; height: 30px; background: url(/img/icons/dark/arrow.svg) no-repeat center center; background-size: 6px 12px; transform: rotate(180deg); cursor: pointer;}
.ui-datepicker-header { padding-top: 0px; border-bottom: 1px solid var(--border-colour); padding-bottom: 5px; }
.ui-state-disabled { color: #aaa;}

#pep-logo { display: block; width: 80%; max-width: 400px; margin: 100px auto;}

div.catalog { display: block; max-width: 1280px; margin: 50px auto;}
div.catalog h3 { font-size: 48px; padding: 0 35px; margin-bottom: 50px;}
div.products { display: block; max-width: 100%; margin: 0 auto 100px; font-size: 0; }
div.products div.product { display: inline-block; width: 33.33%; padding: 0 35px; font-size: 18px; vertical-align: top; margin-bottom: 100px;}
div.product div.title { display: block; font-size: 24px; margin-bottom: 20px; color: #666666; font-family:'Univers LT W01_49 Light Ult Cn'; margin-top: 25px;}
div.product div.description { display: block; font-size: 18px; margin-bottom: 50px; color: #666666}
div.product div.description p { line-height: 1.5; font-size: 16px}
div.product div.register { display: block; font-size: 0; margin-top: 25px;}
div.product div.register div.price { display: inline-block; width: 50%; text-align: left; color: #77bd1d; font-size: 48px; font-family:'Univers LT W01_59 Ult Cond';vertical-align: middle;}
div.product div.buttons { display: inline-block; width: 50%; text-align: right; vertical-align: middle; }
div.product div.buttons.full { display: block; width: 100%; padding-right: 0px; text-align: right;}

form.webinar-search { display: block; margin: 50px auto 50px}
form.webinar-search input[type="text"] { display: inline-block; width: 300px; margin-right: 10px;}
form.webinar-search input[type="submit"] { display: inline-block; width: 120px; font-size: 18px; color: #000}

@media screen and (max-width: 1320px) {
div.module div.module-main {padding-right: 100px}
}
@media screen and (max-width: 1280px) {
	header div.logo { width: 160px; margin-right: 15px;}
	header nav { width: calc(100% - 360px);}
	div.login-area { padding-left: 0}

	#dashboard div.wrapper { padding: 0 20px;}

}

@media screen and (max-width: 1180px) {
	div.course-description div.info { display: block; width: 100%; padding: 0 20px;}
	div.course-description div.indicators { width: 100%; display: block; text-align: center; margin-top: 50px; display: none}
	div.course-description div.description {text-align: center;}
	div.course-description div.register div.buttons { display: block; width: 100%; }
	div.course-description div.register div.buttons a.button-green { margin: 0 auto}
	div.course-description div.register div.price + div.buttons { display: inline-block; width: 50%; }
	div.course-description div.register div.price + div.buttons a.button-green { margin: 0 0 0 auto}

	div.courses {padding: 0 20px; margin: 50px auto 0}

	ul.list li a:after { right: 0}
	ul.list li a { padding-left: 0}

	h2 { font-size: 60px;}

	div.program { padding: 0 20px 100px}
	div.program-main { padding: 20px 0 20px}

	footer ul.nav > li > a { padding-right: 15px}

	div.added-to-cart { right: 0}

	header div.logo { position: absolute; top: 5px; left: 10px; height: 30px; background: url(/img/logo4.svg) no-repeat left center; background-size: contain;}
	header div.logo a img { display: none;}
	header nav { width: calc(100% - 170px);}
	div.login-area, header nav > ul { padding-top: 0}
	div.login-area { padding-left: 0; margin-right: 10px}
	header div.social-icons { padding-right: 10px}

	div.wrapper-cart { padding: 0 20px;}

}


@media screen and (max-width: 1080px) {
	
	header div.social-icons ul { padding-right: 20px}
	header div.navigation { padding: 0 20px;}
	header div.logo { width: 140px; margin-right: 15px;}
	div.login-area { padding-left: 0px;}
	header nav > ul > li > a { padding: 0 10px;}
/*	header nav { width: calc(100% - 290px)}*/

/*	footer div.navigation { display: block; width:100%;}*/
/*	footer div.social-icons { display: block; width:100%; text-align: left;}*/
/*	footer div.social-icons ul {text-align: left;}*/
/*	footer div.social-icons ul li a { padding-left: 0; padding-right: 15px}*/
	div.resource { width: 50%;}

	div.olp-columns-1 div.olp-column { display: block; width: 100%; }
	div.olp-columns-2 div.olp-column { display: block; width: 100%; }
	div.olp-columns-3 div.olp-column { display: block; width: 100%; }
	div.olp-columns-4 div.olp-column { display: block; width: 100%; }
	div.olp-columns-2-large-left div.olp-column, div.olp-columns-2-large-right div.olp-column { width: 100%; }
	div.olp-columns-2-large-left div.olp-column:last-child { width: 100%; }
	div.olp-columns-2-large-right div.olp-column:first-child { width: 100%; }
	div.olp-column-wrapper-content div.olp-column { padding-left: 0; padding-right: 0; padding-bottom: 20px}
	div.olp-column-wrapper-content div.olp-column:first-child { padding-left: 0; padding-right: 0}
	div.module-header div.page-title { display: block;}
	div.module-header div.page-index { position: static; display: block; width: 100%;}
	div.module-header { padding-right: 0}
	article#course div.module div.module-main { padding-right: 20px}

}

@media screen and (max-width: 980px) {
	header div.navigation { padding: 0 10px;}
	header div.social-icons ul { padding-right: 10px}
	header div.logo { width: 100px; margin-right: 10px;}
	div.login-area { padding-left: 0px; padding-top: 10px}
	header nav > ul > li > a { padding: 0 3px; }
/*	header nav { width: calc(100% - 240px)}*/
	header nav > ul { padding-top: 10px;}
	article { padding-top: 120px}

	div.caption div.title { font-size: 60px;}
	div.caption div.subtitle { font-size: 32px;}
	div.caption a.button { line-height: 34px; border-width: 3px}

	h2 {font-size: 40px;}

	ul.grid li div.info h4 { font-size: 28px;}

	footer { padding: 40px;}

	ul.grid-4 li { width: 50%; margin-bottom: 50px}

	div.forms > div { padding: 20px}
	div.wrapper-register { padding: 20px;}
	div.wrapper-register a.close img { right: 5px; top: 5px; width: 15px; height: 15px}

	footer { padding: 50px 20px}
	footer ul.nav > li > a { padding-right: 10px; }

	div.products div.product { display: inline-block; width: 50%; padding: 0 20px; }

	div.cart-left, div.cart-right { display: block; width: 100%; padding: 0 0px 50px; max-width: 800px; margin: 0 auto}  
}

@media screen and (max-width: 860px) {
	header div.social-icons { display: none;}
	header div.navigation  { background: #76bd1d; height: 60px;}
	header nav { position: fixed; top: 60px; left: 0px; width: 300px; display: block; background: #76bd1d;  max-height: 0px; overflow: hidden; transition: all .2s ease-out; z-index: 10}
	header.active nav { max-height: 100vh; transition: all 1.2s ease-out }
	header nav ul { padding-bottom: 20px; }
	header nav ul li { display: block; text-align: left;}
	header nav ul li a { padding: 10px 20px; line-height: 1.5; color: #fff; font-size: 18px;}
	div.login-area { position: fixed; right: 10px; top: 10px; padding: 0 45px 0 0;}
	div.login-area a.button-orange { margin: 0 auto; line-height: 40px;}
	#cart-icon img { display: none;}
	#cart-icon { bottom: auto; top: 5px; background: url(/img/icons/white/cart.svg) no-repeat center center; background-size: contain; width: 30px; height: 30px;}

	header nav > ul > li.subnav > ul { position: relative; top: 0px; left:0; padding: 0; margin: 0}
/*	header nav > ul > li.subnav:hover{ background-color: #76bd1d}*/
	header nav > ul > li.subnav:hover > ul { max-height: 0px; opacity: 0; overflow: hidden;}
	header nav > ul > li.subnav.open > ul { max-height: 600px; opacity: 1; }
	header nav > ul > li.subnav > ul li a { padding-left: 30px; }


	header div.logo { margin: 0 auto; height: 60px; width: 100px; background: url(/img/logo4.svg) no-repeat center center; background-size: contain; position: relative; top: 0; left: 0; padding: 0}
	header div.logo a { display: block; width: 100%; height: 60px}
	header div.logo a img { display: none;}

	header div.burger { display: block}

	article { padding-top: 60px}

	footer { padding: 40px 20px;}
	footer ul.nav > li > a { padding-right: 15px}

	div.course div.banner { overflow: hidden; }
	div.course div.banner img { width: 860px; position: relative; left: calc(50vw - 410px); max-width: 860px; }

	ul.list { padding: 0 20px;}
	ul.list.webinars { padding: 0; width: calc(100% - 40px); margin: 0 auto 40px;}
	h3.webinar-title { padding-left: 20px; font-size: 38px; margin-bottom: 20px}
	ul.list li a { font-size: 18px; line-height: 1.5; text-align: center; padding: 10px 0}
	ul.list li a:after { display: none;}

	ul.documents li { padding: 0 20px;}

	div.program aside { display: none;}
	div.program-main { display: block; width: 100%;}

	footer ul.nav > li { width: 25%;}

	div.resource { width: 100%; display: block; padding: 0}
	
}

@media screen and (max-width: 767px) {
	div.masthead div.caption div.description { display: none}

	div.caption div.title { font-size: 40px;}
	div.caption div.subtitle { font-size: 28px;}
	div.caption a.button { line-height: 26px; border-width: 2px; font-size: 14px;}

	h2 {font-size: 40px;}
	h1 { font-size: 40px}

	div.olp-columns-1 div.olp-column { display: block; width: 100%; }
	div.olp-columns-2 div.olp-column { display: block; width: 100%; }
	div.olp-columns-3 div.olp-column { display: block; width: 100%; }
	div.olp-columns-4 div.olp-column { display: block; width: 100%; }
	div.olp-columns-2-large-left div.olp-column, div.olp-columns-2-large-right div.olp-column { width: 100%; }
	div.olp-columns-2-large-left div.olp-column:last-child { width: 100%; }
	div.olp-columns-2-large-right div.olp-column:first-child { width: 100%; }

	ul.list.webinars li span {  font-size: 18px;}

}

@media screen and (max-width: 680px) {
	footer div.logo a img { margin: 0 auto	}
	footer div.navigation > ul { display: block; text-align: center;}
	footer div.navigation > ul li { display: block; text-align: center;}
	footer div.navigation > ul li a { display: block; text-align: center; padding: 15px 0px;}

	footer div.social-icons ul { text-align: center;}
	footer div.social-icons ul li a { padding: 0 10px;}

	footer div.disclaimer { text-align: center; font-size: 12px}

	ul.grid-4 li { width: 100%; }
	ul.grid li div.info p { font-size: 18px;}

	div.masthead { width: 680px; position: relative; left: calc(50vw - 340px);}
	
	div.courses { padding: 0}

	div.course div.banner img { left: calc(50vw - 430px); }

	div.chapters-index  { display: none}

	div.forms > div { display: block; width: 100%}

		footer div.navigation { width: 100%; display: block;}
		footer div.social-icons { width: 100%; display: block;}
		footer ul.nav > li { width: 33.33%;}

		div.products div.product { padding: 0 10px; }
		div.product div.buttons { display: block; margin-top: 20px; margin-left: 0; margin-right: auto; width: 100%;}
		div.product a.button-green { margin-left: 0; margin-right: auto}
		div.catalog h3 { padding-left: 10px}

		div.wrapper-cart div.product-information h1 { font-size: 18px;}
		div.wrapper-cart div.product-information { padding-left: 20px;}

		div.splitter.s50_50 > div, div.splitter.split-2 > div { display: block; width: 100%;}
		form.checkout div.form-row, div.splitter.s50_50 > div:first-child, div.splitter.split-2 > div:first-child  { margin-bottom: 10px}

		p.order-confirm { padding: 50px 0px}

		div.glossary { display: block; width: 100%; padding: 0}
 }

@media screen and (max-width: 600px) {
ul.list.webinars li a { margin-left: 0; margin-right: 10px;}
ul.list.webinars li span {  display: block; width: 100% }
ul.list.webinars li div {  display: block; width: 100%; vertical-align:top; text-align: left; margin-top: 10px}


}
@media screen and (max-width: 468px) {
	div.login-area { top: 60px; height: 30px; left: 0; right: auto; width: 100%; padding-right: 0;}
	#cart-icon { top: -46px; right: 10px}
	div.login-area a.button-orange { line-height: 30px; text-align: center; display: block; width: 100%;}
	article { padding-top: 90px;}

	ul.documents li { display: block; width: 100%; margin-bottom: 50px}

	div.chapters-nav { text-align: center;}
	div.chapters-nav label { display: block; text-align: center; margin-top: 30px}

		footer ul.nav > li { width: 100%; padding: 0 10px; display: block; text-align: center;}
		footer ul.nav > li a { width: 100%; padding: 0 0px; display: block; text-align: center;}

		div.products div.product { padding: 0 10px; width: 100%;}

	div.wrapper-cart div.product-image { width: 100px; }
	div.wrapper-cart div.product-information { width: calc(100% - 100px)}
}


/*DASHBOARD*/

@media screen and (max-height: 980px) {
	div.book-navigation { top: auto; bottom: 0; transform: translateY(0%); -webkit-transform: translateY(0%);  -ms-transform: translateY(0%); text-align: left;}
}

@media screen and (max-height: 780px) and (min-width: 860px) {
		div.book-navigation { width: 32px}
		div.book-navigation a { display: block; vertical-align: middle; margin: 0 0px 5px 0px; width: 100%; text-align: left; padding-left: 10px}
		div.book-navigation a  { line-height: 32px; width: 32px; font-size: 14px; }
	div.book-navigation a span { line-height: 32px; }
	div.book-navigation a.icon  { width: 32px; font-size: 24px; margin-bottom: 15px; }

}


@media screen and (max-width: 1080px) {
	 div.dash-courses {padding: 50px 20px; margin-top: 0}
	 div.dash-course div.thumbnail { width: 200px}
	 div.dash-course div.actions { width: 120px;}
	 div.dash-course div.info { width: calc(100% - 320px); padding: 0 20px;}
	 div.welcome h1 { font-size: 60px;}
	 div.wrapper-welcome { padding: 80px 20px}

	 div.module div.module-main { padding: 20px 100px 20px 20px}
}

@media screen and (max-width: 860px) {
	div.wrapper-welcome { margin-top: 20px}

	div.module aside { display: block; width: 100%; margin-top: 20px}
	div.module div.module-main { display: block; width: 100%; padding: 20px}

	div.book-navigation { display: block; width: 100%; position: relative; top: 0; left: 0; transform: translateY(0%); -webkit-transform: translateY(0%);  -ms-transform: translateY(0%); text-align: left;}
	div.book-navigation a { display: block; vertical-align: middle; margin: 0 0px 5px 0px; width: 100%; text-align: left; padding-left: 10px}
	div.book-navigation a span { display: inline-block; max-width: 100%; position: static; vertical-align: middle; margin-left: 15px; width: auto; line-height: 1.1; height: auto;}
	div.book-icons { display: inline-block; vertical-align: middle; width: auto; margin: 15px 0 0 0px; text-align: left;}
	div.book-navigation a.icon { display: inline-block; vertical-align: top; margin: 0 5px 5px 0px;}
	div.book-navigation a.icon span  { display: none;}
	div.book-navigation:before { text-align: left;}
	a.continue { margin: 50px auto 0 0}
	div.olp-wrapper.margin-bottom-100 + div.book-navigation { margin-top: -50px }

	div.module aside div.thumbnail { max-width: 200px; }

	div.added-to-cart > div.title { letter-spacing: 1px}
	div.added-to-cart div.product-information { padding-left: 10px;}
	div.added-to-cart div.product { padding-bottom: 15px; margin-bottom: 15px;}
}

@media screen and (max-width: 767px) {
	 div.dash-course { margin-bottom: 50px}
	 div.dash-course div.actions { display: block; margin-top: 20px}
	 div.dash-course div.info { width: calc(100% - 200px); padding: 0 20px;}

	div.welcome h1 { font-size: 40px}
	div.wrapper-welcome.smaller div.welcome h1 { font-size: 40px}
	div.welcome h2 { font-size: 24px; margin-bottom: 30px}

	div.welcome div.dash-course:after { display: none;}
	div.welcome div.dash-course { padding-left: 0px;}
	div.wrapper-welcome { padding: 50px 20px} 
	div.wrapper-welcome.smaller { padding: 50px 20px} 
}

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

	 div.dash-course > div { vertical-align: top}
	 div.dash-course div.thumbnail { width: 120px}
	 div.dash-course div.info { width: calc(100% - 120px); }

	 div.welcome a.button { margin-bottom: 10px}
	 div.added-to-cart { max-width: 100vw;}
}

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

	 div.dash-course > div { display: block; width: 100% !important;}
	 div.dash-course div.thumbnail img { width: 100%; margin-bottom: 20px}
	 div.dash-course div.info { padding:0}

	div.module div.module-main { padding: 20px 0px}
	div.module div.module-main div.module-header { width: 100%; padding: 0 10px}
	div.module div.module-main div.module-body { padding: 30px 20px}

	div.module-header div.page-index { position: static; display: block; width: 100%;}
	div.module-header div.page-index div.current-page  { position: static; text-align: left;}



}