/*
#def2f2: light blue | page background
#0e0e0e: dark grey | body text
#ff7d00: pink | headlines
#b70059: dark pink | nav panel and toplinks
#ffc600: aqua | links and hovers
#fcc941: yellow | highlights
#122a67: green | highlights and completed modules
#eb6909: orange | highlights and underway modules
*/

@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');

/* BASE
----------------------------------------------------------------------------------------*/
html, body {}

html {font-size: 62.5%; font-family: 'Open Sans', sans-serif;}

body { 
	background:#ffffff;
	color: #0e0e0e;
	font-size:1.6rem;
	font-family: inherit;
	/* display: flex; 
    min-height: 100vh; 
    flex-direction: column; */
}

.main-content {}

h1, h2, h3, h4, h5, h6  {
	font-family: "urw-geometric", Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	color: #122a67;
	font-weight: 600;
	margin: 0;
	padding: 0;	
}


h4, h5, h6 {font-family: 'Open Sans', sans-serif;}

a:link, a:visited {
	color: #ff7d00;
	text-decoration: none; 
}

a:hover {text-decoration: underline;}

p {
	font-family:'Open Sans', sans-serif;
	color: #122a67;
	margin: 0 0 1em;
	font-size:1.6rem;
	line-height:2.3rem;
}

ul, ol {
	font-family: inherit;
	color: #122a67;
	margin: 0 0 1em;
    margin: 0;
	padding: 0;
	line-height:2.3rem;

}

form {
	behaviour: url(scripts/PIE.htc);
}

blockquote {margin: 1em 0; padding:25px 0; border-top: solid 1px #8696bf;  border-bottom: solid 1px #8696bf;}

blockquote p {
	font-family:'Open Sans', sans-serif;
	font-size: 1.6rem; 
	line-height: 2.3rem; 	 
	margin: 0; 
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {border-radius: 0; -webkit-appearance: none;}

select {
-webkit-appearance: none; 
-moz-appearance: none;
appearance: none;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
background: url(/images/interface/arrow-down.png);
background-repeat: no-repeat;
background-position: right 17px;
padding-right: 30px;
background-color: #ffffff;
color: #122a67;
border: 1px solid #122a67;
}

/* pure css */
.pure-g > div {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.pure-g [class *="pure-u"] {font-family:'Open Sans', sans-serif;}
.pure-g > div,
.pure-g > li {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


/** custom styles **/

.action-title {
	clear: both;
	color:#122a67;	
	font-family: "urw-geometric",Arial, sans-serif;
	font-size: 3rem;
	line-height: 100%;
	margin-bottom: 0.8em;
	display: block;
}

.bkgd-pink {background-color: #1a3781;}

.bkgd-yellow {background-color: #1a3781;}
.done .bkgd-yellow {background-color:#a2c037;}

.bkgd-green {background-color: #4fb4a2; color:#1a3781}
.bkgd-blue {background-color: #1a3781; color: #fff;}

.left {float: left;}
.right {float: right;}


.hidden /* screen readers only */ 
{position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;}

/* LAYOUT
----------------------------------------------------------------------------------------*/
/* -- SPRITE --*/
#svg-sprite {position: absolute; width: 0; height: 0;}

/* -- PURE: HEADER STYLING -- */

.header-wrap {background-color: #122a67; position: relative;}
.header-logo-wrap {background-color: #fff;}
.header-logo-wrap svg {}


.l-branding {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: center;
}

.l-branding h1 em {display:none;}

a.ttf-logo-link {}
img.ttf-logo {width:100%; height: 100%;}

.header-menu-wrap {position: relative}
.header-menu-inner {
	display: -webkit-box;	
	display: -ms-flexbox;	
	display: flex;	
	-webkit-box-pack: justify;	
	-ms-flex-pack: justify;	
	justify-content: space-between;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column; 
	height:100%;
  }
  
.mobile-menu-icon {display:none;}

.nav-wrap {}

.nav-01 {}

.header-menu-inner .nav-01 {	
	height:33%; width: 94%;
    background-color: #1a3781;
    padding: 0.5% 3%;
	
}

@media screen and (max-width:1023px) {	
	.header-menu-inner .nav-01 {display: none;}
}


.nav-02 {}

.partner-logos {margin:0 20px 0; padding:0; display: inline-flex;}
.partner-logos img {
	display:block;
	border: none; 
	padding:0; margin:0; height: 100%;
    width: auto;
}

.partner-logos a {display:flex; height: 100%;}

.no-dropdown .partner-logos {float: right;}

#courses {display: inline-block; float: left; padding-top: 30px;}

/** inactive anchor tag for locked courses */
.inactiveLink {	pointer-events: none; cursor: default;}

.course-selector {display: inline-block;}

a.login-link {display:inline-block;}
a.login-link.forgot {margin-right:10px; padding-right:10px; border-right:solid 1px #122a67;}
a.login-link.regsiter {}

.article p img { display: block; margin:0 15px 15px 0!important;}
.article img { height:auto!important; max-width:100%; width: 100%;}

.article-intro blockquote {
	margin: 1.5rem 0;
    padding: 15px 0;
    border-top: solid 1px #8696bf;
    border-bottom: solid 1px #8696bf;
}

.article-intro blockquote p {}


header[role="banner"] {
	margin: 0 auto;
	overflow: hidden;
	height: 100%;	
}

.l-topstrip {
	height: 66%;
	padding: 0; margin:0;
	display:flex; color: #ffffff; 
	align-items:center; 
	justify-content:flex-end;
}

.l-branding {
	background-color: #ffffff; padding:5% 20px; 
	z-index: 999; position: relative;
}

.l-branding h1,
.l-branding h2 {padding:0; margin:0;}

/** BANNER COLOURS **/
/*------- course colour schemes -------*/

/* */
.pink .l-navigation {background-color: #b068b0;}
.pink .toggle-tab,
.pink .header-wrap {background-color: #913482;} 
.pink .article h1 {color: #913482;}
.pink .article-intro blockquote p,
.pink .article .callout p {color: #913482;}
.colour-scheme-pink .course-title {}

/* */
.lime .l-navigation {background-color: #bfde6c;}
.lime .toggle-tab,
.lime .header-wrap {background-color: #abd33e;} 
.lime .article h1 {color: #abd33e;}
.lime .article-intro,
.lime .article blockquote p {color: #abd33e;}
.colour-scheme-lime .course-title {} 

/* */
.green .l-navigation {background-color: #009a6a;}
.green .toggle-tab {}
.green .header-wrap {background-color: #009a6a;} 
.green .article h1 {color: #009a6a;}
.green .article-intro blockquote p,
.green .article blockquote p {color: #009a6a;}
.colour-scheme-green .course-title {} 

/* */
.aqua .l-navigation {background-color: #54c6b7;}
.aqua .toggle-tab,
.aqua .header-wrap {background-color: #1eb4a1; height:100%;} 
.aqua .article h1 {color: #1eb4a1;}
.aqua .article-intro blockquote p,
.aqua .article blockquote p {color: #1eb4a1;}
.colour-scheme-aqua .course-title {}
	
/* */
.orange .l-navigation {background-color: #f69855;}
.orange .toggle-tab,
.orange .header-wrap {background-color: #ff7d00;} 
.orange .article h1 {color: #ff7d00;}
.orange .article-intro blockquote p,
.orange .article blockquote p{color: #ff7d00;}
.colour-scheme-orange .course-title {}
/*

#def2f2: light blue | page background
#0e0e0e: dark grey | body text
#ff7d00: pink | headlines
#b70059: dark pink | nav panel and toplinks
#ffc600: aqua | links and hovers
#fcc941: yellow | highlights
#122a67: green | highlights and completed modules
#eb6909: orange
*/

/** Navigation **/

@-webkit-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}  
@keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}

.l-navigation {display:none;}

ul.m-navigation {
	text-align: center; text-transform: uppercase; 
	font-family: "urw-geometric", Arial, sans-serif;
	background-color:#1a3781; padding:0 0 20px 0;
}

ul.m-navigation li {font-size: 1.9rem;}
ul.m-navigation a,
ul.m-navigation h3,
ul.m-navigation h4 {
	display: block; 
	background-color:#1a3781;
	color: #ffffff;
}

ul.m-navigation li.m-home-link a {background-color:#122a67;}

ul.m-navigation h3 {font-size: 3.5rem; padding:20px 0 0;}
ul.m-navigation h4 {font-size: 2rem; padding:20px 0 0; color:#51b4a3;}

ul.m-navigation a {font-size: 2rem; padding:15px 20px; border-bottom: solid 2px #122a67;}
ul.m-navigation {display:none;}

ul.m-navigation.show {
	display: block;
    -webkit-animation: fadeIn 2s;
    animation: fadeIn 2s;
}

@media screen and (min-width:1024px) {
	ul.m-navigation, 
	ul.m-navigation.show {display:none;}	
}

.l-hero {
	background-color: #ffffff;
    margin: 0 auto;
	overflow: hidden;
    position: relative;
    width: 100%;
}

.l-content {
    background-color: #ffffff;
    margin: 0 auto;
    padding: 60px; 
    max-width: 1540px; z-index: 99; display: block;  position: relative;
}


@media screen and (max-width:767px) {
	.l-content.main {padding:20px;}
}

.l-content.main.l-g-m-wrap {max-width:1600px; padding:0;}


.l-content.h1,
.l-content h2,
.l-content h3,
.l-content h4,
.l-content h5,
.l-content h6 {margin:0 0 1rem 0;}

.l-content-wrap.signed-in {background-color:#4fb4a2;}
.l-content-wrap.signed-in .l-content {background: none; padding:30px;}
.l-content-wrap.signed-in .l-content .home-wrap .hero-intro {
	padding:0; margin:0;
}
.l-content-wrap.signed-in .l-content h1.hero-header {
	color:#fff; line-height: 100%; margin: 0; padding: 0 0 15px 0;
}

.featured-course.logged-in-course {display: none;}

@media screen and (max-width:767px) {
	
	.l-content-wrap.signed-in .l-content h1.hero-header {text-align: center;}
	
}

.l-content-wrap.signed-in .l-content p {
	color:#fff; font-family:'Open Sans', sans-serif;
}

.l-content h4 {font-size:2rem;}

.l-grid {list-style-type: none;	margin: 0; padding: 0;}
.l-grid > li {}

.sidebar {
    margin-right: 15%;
    width: 85%;
    margin-bottom: 36px;
}

.article {
	margin-bottom: 20px;
	width: 92%;
    margin-right: 8%;
}

.article img.responsive-img {width:100%; max-width: 580px; height:auto;}

/* interactive map iframe */

.article iframe.interactive-map {
	width:200px; height:266px; 
	-webkit-transition: width 1s; 
    transition: width 1s;
}

@media only screen and (min-width : 350px) {
.article iframe.interactive-map {width:270px; height:357px;}
}

@media only screen and (min-width : 568px) {
.article iframe.interactive-map {width:528px; height:700px;}
}

@media only screen and (min-width : 768px) {
.article iframe.interactive-map {width:510px; height:676px;}
}

@media only screen and (min-width : 1024px) {
.article iframe.interactive-map {width:422px; height:560px;}
}

@media only screen and (min-width : 1280px) {
.article iframe.interactive-map {width:541px; height:717px;}
}

@media only screen and (min-width : 1600px) {
.article iframe.interactive-map {width:692px; height:900px;}
}

@media only screen and (min-width : 1920px) {
.article iframe.interactive-map {width:680px; height:900px;}
}


.article-aside {margin-bottom: 36px;}

@media only screen and (max-width:767px) {
	.article-aside {margin-bottom: 0;}
}

.article-aside img.entry_img {width:100%!important; display: block!important; height: auto!important;}

.article-aside .callout {display:inline-block;}

@media only screen and (max-width:567px) {

	.article-aside .callout {display:block;}
}


.article-aside > :last-child {margin-bottom: 0;}

.end-survey-content {}
.end-survey-content h2 {
	color:#122a67;
    font-family: 'Open Sans', sans-serif;
	font-size: 2.5rem;
	line-height: 100%;
	margin-bottom: 0.3em;
	margin-top:2em;

}

.end-survey-content h2:first-child {margin-top:.5rem;}

.end-survey-content h3 {
	font-size: 2rem;
	margin:1em 0;
}

.end-survey-content select {
	background-position: right 13px;
    padding: 5px 30px 5px 10px;
}



/* MODULES
----------------------------------------------------------------------------------------*/
/*------- branding 
/*------- partner logos -------*/

.partner-brand {
	bottom: 18px;
	line-height: 0;
    position: absolute;
    right: 30px;
}

.partner-brand img {margin-left: 14px;}

/*------- top strip area -------*/

.toplinks {list-style-type: none; display:inline-flex; align-content:center;}
.l-topstrip.mobile {display:none;}

.toplinks li {display:flex; align-items:center;}
.toplinks li.item-logout,
.toplinks li.item-login {}

.toplinks li:first-child {margin-left:0;}

.toplinks a {
	color: #ffffff;	
	font-size: 1.1rem; text-transform: uppercase;
	font-weight: 700;
	text-decoration: none;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
	margin: 0 30px 0 0;
	transition: .4s ease;
}

.toplinks a:hover {color: #ffc600;}

.toplinks-left {}

.toplinks-right {margin-right: 30px;}

.toplinks img {float:left; height:25px; width:25px; margin:0 10px 0 0;}

.ico {
	display: inline-block;
	background: url("/images/interface/toplinks.gif") no-repeat;
	line-height: 0;
	vertical-align: middle;
	height: 30px;
	margin-right: 5px;
}

.ico-login {
	background-position: 0 0;
	width: 16px;
}

.ico-register {
	background-position: -26px 0;
	width: 17px;
}

.ico-feedback a {
	background: url("/images/interface/icon-feedback.gif") no-repeat 0 0;
	height: 30px;
	line-height: 30px;
	padding-left: 28px;
}

/*------- site navigation -------*/

.sitenav {
	display: flex;
    margin: 0;
	color: #ffffff;
	font-family: "urw-geometric", Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size: 2.2rem;
	text-transform:none;
	font-weight: normal;
	list-style: none;        
    white-space: nowrap;

}

.nav-01.logged-in .sitenav {}
.nav-01.logged-out .sitenav {justify-content: flex-start}

.sitenav > li {
	display: inline;
    margin: 0px;
    padding: 10px;
    line-height: 30px;
}

.sitenav a {
	color: #ffffff;
	text-decoration: none;
}

.sitenav a:hover, .sitenav li.here a, .sitenav li.parent-here a {color: #fcc941;}

.sitenav span {color: #fcc941; padding: 0 4px;}

/*------- hero area -------*/

.hero-home,
.hero-page.hero-background {
	min-height: 600px;
	max-height: 600px;
	text-align: center;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
    -webkit-transition: 1s;
    transition: 1s;
}

.hero-home h1 {
	color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-size: 7rem;
    line-height: 100%;
    margin-bottom: 0.2em;
    width: 60%;
}

p.hero-sub-header {
	font-size: 2.8rem;
    line-height: normal;
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    padding: 0;
    margin: 0;
}



@media only screen and (max-width : 1484px) {
	p.hero-sub-header {font-size: 3.5rem; line-height: 3.8rem;}	
}

@media only screen and (max-width : 1279px) {	
	p.hero-sub-header {font-size: 3.5rem; line-height: 3.8rem;}
}

@media only screen and (max-width : 1023px) {
	p.hero-sub-header {font-size: 3rem; line-height: 3.83rem;}
}

@media only screen and (max-width : 767px) {
	p.hero-sub-header {font-size: 2.5rem; line-height: 2.8rem;}
	
}

.home-wrap .hero-intro {
    margin: 0 auto 0 auto;
    max-width: 1540px;
    padding: 0 20px 0 20px;
    text-align: left;
}

.home-wrap .hero-intro h1, .home-wrap .hero-intro h2, .home-wrap .hero-intro h3 {
	/* line-height: normal;
    color: #51b4a3;
    font-size: 8rem; */
    padding: 25px 0 10px 0;
    margin: 0;
}

@media only screen and (max-width : 1279px) {	
	.home-wrap .hero-intro h1, .home-wrap .hero-intro h2, .home-wrap .hero-intro h3 {font-size:5.6rem; line-height:5.2rem;}	
}

@media only screen and (max-width : 1023px) {
	.home-wrap .hero-intro h1 {}
}

@media only screen and (max-width : 767px) {
	.home-wrap .hero-intro h1, .home-wrap .hero-intro h2, .home-wrap .hero-intro h3 {font-size:4.6rem; line-height: 3.8rem;}	
}


.home-wrap .hero-intro p {
		font-family: "urw-geometric", Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
		font-size:2.2rem; color:#ffffff;
}	
	
.featured-course {
	text-align: left;
	background: url("/images/interface/graph-paper-home.png") no-repeat 0 0;
	/* float: right; height: 238px; */
	margin: 30px 30px 0 0;
	padding: 51px 30px 0 50px;
	position: absolute;
    right: 0;
    top: 150px;
	width: 355px;
}

.featured-course.doing {display: none;}

.featured-course h2 {
	color:#122a67;
	font-family: 'Open Sans', sans-serif;
	font-size: 3rem;
	line-height: 100%;
	margin-bottom: 0.3em;
	text-transform: uppercase;
}

.featured-course p {
	color: #0e0e0e;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.4rem;
}

.featured-course .summary {display:none;}

img.paperclip {
	position: absolute;
	right: 12px;
	top: -7px;
	z-index: 1;
}

img.feat-course-pic {
	-moz-box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.4); 
	-webkit-box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.4); 
	box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.4);
	float: right;
	margin: -40px -33px 10px 10px;
	-webkit-transform: rotate(3deg); 
	-moz-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	-o-transform: rotate(3deg); 
	transform: rotate(3deg);
}

.hero-page {height: auto; width: 1000px; margin:0 auto;}

.hero-page.hero-background {
	background-size: cover;
	background-position: center top;
	width: 100%;
	max-height: 450px;
	min-height: 450px;
}

/*------- sidebar styling -------*/

.sidebar h1 {
	color:#122a67;
	font-family: "urw-geometric", Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size: 1.6rem;
	line-height: 100%;
	margin-bottom: 0.5em;
	text-transform: uppercase;
	}

/*------- section navigation -------*/

.breadcrumb-sectionav {
	display: flex; justify-content: flex-start; align-items: center;
	flex-wrap: wrap;
	background-color: #1eb4a1; color:#ffffff; padding:20px;
}

.breadcrumb-sectionav a {color:#fff;}

.breadcrumb-sectionav > div {padding: 0 10px 5px 0;}
.breadcrumb-sectionav > div::after {color:#122a67; content: "\00BB"; padding-left:10px;}
.breadcrumb-sectionav > select {
    padding: 3px 5% 3px 0.5%;
    border: none;
    background-position: right 8px;
	
}

.breadcrumb-sectionav > select::-ms-expand {display: none;}

@media screen and (max-width: 567px) {
	.breadcrumb-sectionav > select {width:96%;}
}
	

.sectionav {list-style: none; margin-bottom: 20px;}

.sectionav a {
	background: url("/images/interface/arrow-pink.png") no-repeat 2px 10px; 
	display: block; 
	padding: 5px 0 5px 18px;
	text-decoration: none;
	transition: .4s ease;
}

.sectionav a:hover, .sectionav li.here a {color:#122a67;}

.sectionav li.done {
	background: url("/images/interface/sectionav-tick.png") no-repeat 2px 9px; 
	color: #cccccc; 
	display: block; 
	padding: 5px 0 5px 18px;
	text-decoration: none;	
}

/*------- article styling -------*/

.article h1 {
	color:#122a67;
	font-size: 5.6rem;
	line-height: 100%;
	margin-bottom: 0.3em;
	text-transform:none;
}

.article h2 {
    color:#122a67;
    font-size: 2.7rem;
    line-height: 100%;
    margin-bottom: 1.5rem;
}

.article h3 {
	color:#122a67;
	font-size: 2.5rem;
	line-height: 100%;
	margin: 0 0 1.5rem 0;
}

.article > ul {
	list-style: none; 
	margin: 1em 0;	
	padding: 0;
}

.article > ul > li {
	background-image: url("/images/interface/bullet-point-orange.png");
	background-repeat: no-repeat;
	background-position: 0px 6px;
	margin-bottom: 0.5em;
	line-height: 2.3rem;
	padding-left: 16px;
}

.article > ul > li > ul {
	list-style: none;	
	margin: 0.5em 0 1em 0;
}

.article > ul > li > ul > li {
	background-image: url("/images/interface/hyphen-pink.gif");
	background-repeat: no-repeat;
	background-position: 0px 6px;
	margin-bottom: 0.5em;
	padding-left: 16px;
}

.article > ol {
	list-style-type: decimal; 
	margin: 1em 0 1em 22px;
	padding: 0;
}

.article > ol > li {margin-bottom: 0.5em;}
.article a {color:#ff7d00; text-decoration: underline;}

/*------- callout panel -------*/

.callout {
	background-color: #ffc600;
	color: #ffffff;
	line-height: 100%;
	padding: 18px 18px 0 18px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 20px;
	overflow: hidden;
}

.callout p {
	font-family: 'Open Sans', sans-serif;
    font-size: 1.7rem;
	font-weight: normal;
	line-height: 100%;
	margin-bottom: 18px;
}

.callout p.alert {
	font-family: 'Open Sans', sans-serif;
	font-size: 2rem;
	margin-bottom: 18px;
}

.callout .btn {margin-bottom: 18px;}

img.icon {margin-bottom: 14px;}

/*------- footer area -------*/

.home-footer-wrap {background-color: #1a3781; padding:0 20px;}

.l-content.home-cta-link {background-color: transparent; padding:20px; color:#fff; margin:0 auto;}

.l-content.home-footerlink {
	padding:20px 20px 20px 40px; color:#fff;
	background-size: 40px 40px; max-width: 1500px;
	background-color: transparent; background-image: url(/images/interface/tft-screen-icon.svg);
	background-repeat: no-repeat; background-position: 0px 10px;
}
.l-content.home-footerlink a {color:#fff; transition: all 0.5s ease;}
.l-content.home-footerlink a:hover {color:#f3863e;}

.home-footer-wrap.cta {text-align: center; background-color: #f2853e; margin-top: 0.5em;}

.home-footer-wrap.cta h3 {font-family:'Open Sans', sans-serif; color:#fff; font-size: 2.8rem;}
.home-footer-wrap.cta h3 em {font-weight:800;font-style: normal;}

.btn.cta-btn {display:inline-block; margin: 0.5em 1em; background-color: #223769;}

.footer-wrap {
	display: flex;
	background-color: #122a67; 
	padding:35px 2%; width:96%;
}


footer[role="contentinfo"] {}
footer[role="contentinfo"].l-content {	
	padding:0; background-color: transparent;
	width:100%;
}


footer[role="contentinfo"] p {
	font-size:1.1rem;
	margin: 0;
	color:#ffffff;
}

footer[role="contentinfo"] ul {
	font-size:1.1rem;
	list-style: none;
	margin: 0;
}

footer[role="contentinfo"] li {
	border-left: 1px solid #0e0e0e;
	float: left;
	padding-left: 5px;
	margin-left: 5px;
}

footer[role="contentinfo"] li:first-child {
	border: none;
	padding: 0;
	margin: 0;
}

footer[role="contentinfo"] a {color: #ffffff;}
footer[role="contentinfo"] a:hover {color:#ffffff; text-decoration: none;}

.footer-info {
	text-align: left;
	display: flex;
	-webkit-justify-content:flex-start;
	justify-content:flex-start;
}

.footer-nav {
	text-align: right;
	display: flex;
	-webkit-justify-content:flex-end;
	justify-content:flex-end;
}

/*------- home page -------*/

.article-home-wrapper {position:relative;
	/* display: flex; align-items: flex-start; flex-direction: column; justify-content: space-between;
	height:100%;*/ 
}

.article-home {width: 86%; padding-right: 7%;}
.article-home h1, .article-home h2, .article-home h3 {color:#122a67; font-size:2.7rem; font-family: 'Open Sans', sans-serif;}

.article-home.a-h-02 {/* align-self: flex-end; */ padding-bottom:50px;}
.article-home.a-h-02 h2 {font-size:4rem; font-weight: normal; position: absolute; bottom:12px;}	
.article-home.a-h-02 h2 strong {font-weight:800;}
.article-home.a-h-02 h2 a {text-decoration: none;}

@media screen and (max-width:1023px) {
	.article-home.a-h-02 h2 { font-size:3rem; position: relative; bottom:auto;}	
}

/* .article-home div.cel-header {margin:3.5rem 0 0 0;} */
.article-home div.cel-header h2 {
	text-transform: uppercase;
    font-weight: 800;
    font-size: 2.5rem;
}


.article-home div.cel-header:nth-child(2) h2 {color:#834571;}
.article-home div.cel-header:nth-child(3) h2 {color:#834571;}
.article-home div.cel-header:nth-child(4) h2 {color:#f3863e;}
.article-home div.cel-header:nth-child(5) h2 {color:#f3863e;}
.article-home div.cel-header:nth-child(6) h2 {color:#51b4a3;}
.article-home div.cel-header:nth-child(7) h2 {color:#51b4a3;}

.article-home-inner {}
.article-home-inner ol,
.article-home-inner ul {margin:0 0 0 15px; padding:0;}

.article-home-inner li {padding:0 0 10px 0px; margin:0 0 0 5px;}

.article-home-inner.a-h-i-01 {margin-bottom: 35px;}
.article-home-inner.a-h-i-02 {}

.article-inner {}
.article-inner h3,
.article-inner h4,
.article-inner h5,
.article-inner h6 {font-size: 1.6rem; line-height: 2rem; font-family: 'Open Sans', sans-serif;}

.article-inner h3 a,
.article-aside-home .feature-panel .f-p-inner a {
	display: block; color:#fff; background-color: #122a67; 
	font-size: 1.6rem; text-transform: uppercase; padding: 14px 20px; 
	text-decoration: none; transition: .4s ease;
	font-family: 'Open Sans', sans-serif; font-weight: 800;
}

.article-inner h3 a:hover,
.article-aside-home .feature-panel .f-p-inner a:hover {background-color: #7ec3be;}

.a-s-h-wrap {position: relative;}
.article-aside-home .feature-panel .f-p-inner a:hover {background-color: #6cb1c4; text-decoration: none;}

.article-inner.a-i-01 {padding:0;}
.article-inner.a-i-02 {padding:0 12px;}

@media only screen and (max-width : 767px) {	
	.article-inner.a-i-02 {padding:12px 0;}	
}

.article-inner p {font-family: 'Open Sans', sans-serif; font-size: 1.6rem; line-height:2rem;}

.article-aside-home {}

.article-aside-home .feature-panel {margin-bottom:25px;}
.article-aside-home .feature-panel img {width:100%; max-width: 100%; height:auto;}

.video-inner {
	background-color:#fff;
	position: relative;
	padding-bottom: 56%; /* 16:9 */
	padding-top: 0;
	height: 0;
}
.video-inner iframe {
	background-color:#fff;
	border:none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.article-aside-home .feature-panel.panel-01 {background-color:#f3863e;}
.article-aside-home .feature-panel.panel-01.orange {background-color:#f3863e;}
.article-aside-home .feature-panel.panel-01.green {background-color:#4fb4a2;}
.article-aside-home .feature-panel.panel-01.blue {background-color:#122a67;}


.article-aside-home .feature-panel.panel-01 .f-p-inner .f-p-01-text p {
	background-image: url(/images/interface/case-study-icon.svg); background-size: 42px 60px;
}

.article-aside-home .feature-panel.panel-02 {background-color: #a7d16a; display:none;}
.article-aside-home .feature-panel.panel-02 .f-p-inner p {
	background-image: url(/images/interface/group-access-icon.svg); background-size: 42px 60px;
	color:#122a67;
}

.article-aside-home .feature-panel.panel-03 {}
.article-aside-home .feature-panel.panel-03.twitter {border:solid 1px #7ec3be; margin-bottom:85px;}
.article-aside-home .feature-panel.panel-03.twitter h4 {
	text-transform: uppercase; font-weight: 800; 
	font-size: 2.4rem; color:#7ec3be; text-align: left; padding:10px 15px;
	flex-wrap: wrap; word-wrap:break-word;
}

@media screen and (max-width:1279x) {
.article-aside-home .feature-panel.panel-03.twitter h4 {font-size: 1.6rem;}
}

@media screen and (max-width:1023px) {
.article-aside-home .feature-panel.panel-03.twitter h4 {font-size: 1.3rem;}
}

@media screen and (max-width:767px) {
.article-aside-home .feature-panel.panel-03.twitter h4 {font-size: 2.4rem;}
}

@media screen and (max-width:567px) {
.article-aside-home .feature-panel.panel-03.twitter h4 {font-size: 1.8rem;}
}

@media screen and (max-width:450px) {
.article-aside-home .feature-panel.panel-03.twitter h4 {font-size: 1.6rem;}
}

.article-aside-home  .panel-signup-options {
	position: absolute; bottom:0;
	width: 100%; margin-bottom:20px;
}

.article-aside-home  .panel-signup-options a.btn {
	margin:0; padding: 12px 20px; font-size:1.8rem; 
	font-family: 'Open Sans', sans-serif; font-weight: 700;
	background-image: none; text-align: center;
}

.article-aside-home  .panel-signup-options li:first-child a {}
.article-aside-home  .panel-signup-options li:last-child a {color:#122a67;}

.feature-panel-button {}
.feature-panel-button p {padding: 0; margin: 0;}

@media only screen and (min-width : 1280px) {
.article-aside-home  .panel-signup-options li:first-child a {margin-right:10px;}
.article-aside-home  .panel-signup-options li:last-child a {margin-left:10px;}
}

@media only screen and (max-width : 1279px) {
.article-aside-home  .panel-signup-options li:first-child a {margin-right:0px; margin-bottom:10px;}
.article-aside-home  .panel-signup-options li:last-child a {margin-left:0px;}
}

.article-aside-home .feature-panel .f-p-inner {padding:20px 20px 20px 20px;}
.article-aside-home .feature-panel .f-p-inner p,
.article-aside-home .feature-panel .f-p-inner a {color:#fff; text-align: center;}
.article-aside-home .feature-panel .f-p-inner p {background-repeat: no-repeat;}
.article-aside-home .feature-panel .f-p-inner .f-p-01-text p {
	padding:0 0 0 60px; 
	background-position: top left;
	min-height:60px;
}

.article-aside-home a.button {
	font-size:1.5rem; display: block;
	text-align: center; text-transform: uppercase; 
	background-color: #122a67; padding: 5px;
}

.article-aside-home a.button:hover {text-decoration:none; background-color:#122a67;}

.courses {margin:0 -30px;}

.courses > li {
	margin:0;
	padding:0;
	position: relative;
 }

.courses > li a {padding:0 30px; display:block;}

.courses > li > a > img {
	display: block; width:100%; 
	max-width: 100%; height: auto;
	transition: all 0.5s ease;
}

.courses > li > a:hover > img {
	opacity: 0.5; filter: alpha(opacity=50);
}

.courses > li:nth-child(1) a {}
.courses > li:nth-child(4n) a {}

h4.courses-sub-header {
    padding: 25px 12px 12px 0;
    font-size: 3rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
}

@media screen and (max-width:567px) {
	.courses > li a {padding:0 30px;}
}

@media screen and (max-width:1024px) {	
	.courses > li:nth-child(1n) a {}
	.courses > li:nth-child(4n) a {}
	.courses > li:nth-child(2n) a {}
}

.course-title {
	background-color: #f6c157; color:#122a67;
    padding: 10px 20px; margin-top: -56px;   z-index: 999;
	display: flex;   justify-content: center;
    align-items: center; transition: all 0.5s ease;
}

.hidden-course .course-title {background-color: #f3863e; color:#fff;}

.courses > li > a:hover .course-title {color:#fff; background-color: #122a67;}

.course-title-inner {margin: 0 auto; vertical-align: middle;}

.course-title-inner {
	display: flex;
	width:100%;
    justify-content: center;
	text-align:center;
    align-items: center;
	min-height:36px;
	font-size: 1.8rem;
	font-weight: 800;
	line-height:100%;
	text-transform: uppercase;
	padding: 0 12px;

}

.course-description {padding: 12px 12px 12px 0px; text-align: left;}
.course-description p {font-size: 1.6rem; line-height: normal; margin: 0 0 5px 0;}

.courses a:hover {text-decoration:none;}

.course-bottom {
	color: #0e0e0e;
	left: 0px; 
	margin: 0;
	text-align: center;
	position: relative;
    z-index: 1;
}

.doing p, .done  p {}
.doing .course-title {}
.done .course-title {}

/*------- course page -------*/

.article-intro {float: left; width: 65%;}

.modules {margin: 0}



.modules > li {
	background-color: #f7f7f7;
	margin: 0; padding: 0;
	position: relative;	
    border: solid #fff 20px;
}

@media screen and (max-width:767px) {
	.modules > li {border: solid #fff 15px;}
}

.modules > li.done {}
.modules .status {right: 20px;}

.modules h4 {
	color:#122a67;
	font-family: 'Open Sans', sans-serif;
	font-size: 2.2rem;
	line-height: 100%;
	margin: 18px 20px 0.4em 20px;
}

.modules p {margin: 0 20px; line-height: normal; color:#f7f7f7;}

.l-grid.modules p {color:#122a67;}

.modules > li.grid-module-item {padding-bottom:115px;}


/** ----- module / course sections ----- **/
.l-content.module-steps {
	margin: 0 0 40px 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
}
.l-content.module-steps .tab {max-width:1600px; margin:0 auto;}

.l-content.module-steps.fullscreen {}
.l-content.module-steps.fullscreen .tab {max-width: 100%; width: 100%;}

.module-steps-inner {padding:20px;}

.module-steps-wrap {z-index:999; width:100%; text-align: center; padding: 30px 0 0 0;}

.l-content.module-steps.fullscreen .module-steps-wrap {position: absolute}

.module-steps .module-steps-list {
	
	list-style-type: none; display: inline-flex; margin:0;
	background-image: url(/images/course-modules/module-steps-bg-divider.png);
	background-position: center center; background-repeat: repeat-x;
}

/* circles that indicate the steps of the form: */
.module-steps li.module-steps-item {
	display: inline-flex;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	width:40px; height:40px; margin-right:40px;
	border:solid 3px #d1d7e6;
	color:#d1d7e6; font-weight: 600;
	text-transform: uppercase; 
	background-color: #fff;
	justify-content: center;
	align-items: center;
}

.module-steps.fullscreen li.module-steps-item {
	background-color: #8ba4c1; color: #fff; border-color:#fff;
}

/* steps that are current : */
.module-steps li.module-steps-item.active {border-color: #122a67; color:#000;}
.module-steps.fullscreen li.module-steps-item.active {background-color: #fff; color:#122a67;}

/* steps that are finished and valid: */
.module-steps li.module-steps-item.finish {background-color: #1eb4a1;}

.module-steps li.module-steps-item:last-child {
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	padding:0 15px;
	margin-right:0;
}

/** module steps : fullscreen **/
.m-s-fullscreen-wrap {position:relative;  width:100%;/* z-index:-1;*/}
.m-s-fullscreen-image {width:100%; height:auto; display: block;}

.m-s-caption {
	position:absolute; left:0; width:40%; padding:3% 5% 3% 3%;
	color:#ffffff; background-color:rgba(0,0,0,0.55); 
	}

.m-s-caption.top {top:108px;}
.m-s-caption.bot {bottom:44px;}

.m-s-caption.interactive-caption,
.m-s-caption.interactive-caption.top,
.m-s-caption.interactive-caption.bottom {
	display:block; position: relative;
	text-align: center; width:96%; padding:2%;
	background-color:#6ea9bc; bottom:44px;
}

.m-s-caption.interactive-caption p {padding: 0; margin: 0;}

.m-s-caption p {font-size:1.8rem;  font-weight: 300; color:#fff; font-family: 'Open Sans', sans-serif; }
.m-s-caption p strong {font-size:2.4rem; font-weight: 300;}

@media screen and (max-width:767px) {
.m-s-caption,
.m-s-caption.top,
.m-s-caption.bot {
	position: relative; top:auto; bottom:auto; 
	width:92%;
	background-color: #000;
	
	}
.m-s-caption p {font-size:1.8rem;}
}


/** module steps : 2-col **/
.m-s-2col-wrap {}
.m-s-2col-inner {}
.m-s-2col-content  {}
.m-s-2col-content.r-hand {}
.m-s-2col-content.l-hand {padding:0 20rem 0 0;}

.m-s-2col-content.l-hand ul,
.m-s-2col-content.l-hand ol {margin-bottom:15px;}

.m-s-2col-content.l-hand li {
	padding: 0 0 5px 3px;
    margin: 0 0 0 18px;
}

.m-s-2col-content.l-hand img {max-width: 100%; width:100%!important; height:auto!important; display: block;}

/** module steps : bottom nav **/
.module-steps-nav-outer {
	position: relative;
    padding: 0;
    margin: 30px auto;
    z-index: 999;
    max-width: 1600px;
	}

.module-steps-nav {
	display:-webkit-box; display:-ms-flexbox; display:flex; 
	-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
	margin: 20px; padding: 20px 0;   border-top: solid 2px #c1c8d7;
}

.module-steps-nav button {
    border: none; font: inherit; cursor: pointer;
    outline: inherit !important; padding:10px 115px; background-color: #ef8333; 
	color:#fff; text-transform: uppercase;
}

.module-steps-nav button.prev {order:1; background-color:#c1c8d7;}
.module-steps-nav button.next {order:2; margin-left:auto;}

.module-steps-nav button.prev:hover {background-color:#122a67}
.module-steps-nav button.next:hover {background-color:#ff7d00;}

@media screen and (max-width:767px) {
	.module-steps-nav button {padding:10px 1%; width:49%;}
}



.infobar {
	background-color: #122a67;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-size: 1.7rem;
    position: absolute;
	bottom:0;
    left: 0px;
    margin:0;
    padding:0; 
    text-align: right;
    text-transform: uppercase;
    width: 100%;
}

.number {text-align:left; font-size: 2.5rem; padding:12px 0; padding-left:12px;}

.infobar .btn {margin:0;}
.infobar .review-button.r-b-start {background-color:#1a3781}
.infobar .review-button.r-b-start .btn {display:flex; justify-content: space-between; align-items: center;}
.infobar .review-button.r-b-start .btn em {font-size: 2.5rem; font-style: normal;}

.infobar .review-button.r-b-review {width:100%;}
.infobar .review-button.r-b-review .btn {}

.review-wrap {
	display: flex;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
	}
	
	.review-wrap.r-w-01 {}
	.review-wrap.r-w-02 {justify-content:flex-start;}
	
.review-text {line-height:normal;}

.done h4 {color: #122a67; margin-right:60px;}
.done .infobar {background-color: #122a67;}

#course_complete_pie {width:150px; height:100px; margin:0 auto;}

.accordion h5 {  
	background-color: #ff7d00;
	background-image: url(/images/interface/arrow-white-large.png);
    background-repeat: no-repeat;
    background-position: 10px center;
    display: block;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-family: 'Open Sans', sans-serif;
    font-size: 1.6rem;
    text-transform: uppercase;
    line-height: 100%;
    padding: 8px 10px 8px 25px;

}

.accordion h5 a {
   color: #fff; text-decoration:none;
}

.accordion .body {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    background-color: #f7f7f7;
    padding: 15px 10px;
}

.accordion .ui-accordion-header {
    margin: 8px 0 0 0;
}

.ui-accordion-content {}
.ui-accordion-content  p {}
.ui-accordion-content ul {list-style: none; margin: 1em 0; padding: 0;}
.ui-accordion-content  li {background-image: url("/images/interface/bullet-point-orange.png");
    background-repeat: no-repeat;
    background-position: 0px 6px;
    margin-bottom: 0.5em;
    padding-left: 16px;
	list-style: none;
	/* http://stackoverflow.com/questions/20356311/internet-explorer-11-ignores-list-stylenone-on-the-first-load */
	list-style-image: url(data:0);
}


.status {
	background-repeat: no-repeat;
	background-position: 0 0;
	display: block;
	height: 35px;
	position: absolute;
	right: 70px;
	top: 0;
	width: 32px;
}

.hidden-course .status {background-image: url(/images/interface/badge-locked.png);}

.done .course-bottom {}
.done .status {background-image: url(/images/interface/badge-done.png);}

.doing .course-bottom {}
.doing .status {background-image: url(/images/interface/badge-doing.png);}

.featured-status {
    background-repeat: none;
    background-position: 0 0;     
    display: block;
    height: 35px;
    float: left;
    margin-top: -4px;
    width: 35px;    
}

.done .featured-status {background: url("/images/interface/badge-done-featured.png");}
.doing .featured-status {background: url("/images/interface/badge-doing-featured.png");}


/*------- buttons -------*/

a.btn, .btn {
	background-repeat: no-repeat;
	background-position: center right;
	display: block;
	color: #ffffff;
	line-height: 22px;
	font-family: 'Open Sans', sans-serif;
	padding: 7px 30px 7px 20px;
	margin-bottom: 20px;
	border: none;
	position: relative;
	text-transform: uppercase;
	transition: .4s ease;
	vertical-align:middle;
}

a.btn:hover, .btn:hover {
	background-color: #6cb1c4;
	text-decoration: none;
}

.btn-reg {
	background-image: url("/images/interface/arrow-white.png");
	font-size: 1.6rem;
}

.btn-big {
	background-image: url("/images/interface/arrow-white-big.png");
	font-size: 1.8rem;
}

a.rosette {
	margin-top: 20px;
	padding-left: 58px;
	margin-right: 32px;
}

a.rosette span {
	background: url(/images/interface/icon-rosette.png) no-repeat 0 0;
	display: block;
	height: 51px;
	float: left;
	position: absolute;
	top: -13px;
	left: 10px;
	width: 38px;
}

.retake-course-form {display: inline; clear: both;}
.retake-course-btn {	
	background-repeat: no-repeat;
	background-position: center right;
	color: #ffffff;
	display: inline-block;
	font-family: 'Open Sans', sans-serif;
	line-height: 100%;
	padding: 10px 30px 10px 20px;
	position: relative;
	text-transform: uppercase;
	font-size: 1.8rem;
	margin-top: 20px;
	padding-left: 10px;
	margin-right: 32px;
	background-color: #ff7d00;
	border: none;
	background-image: url("/images/interface/arrow-white-big.png");
	transition: .4s ease;
}

.retake-course-btn:hover { background-color: #122a67; }

.course-buttons { 
	margin-bottom:2em; 
	overflow: hidden;
	clear: both;
	padding-bottom: 16px;
}
.course-buttons a, .course-buttons input {float: left;}
.course-home .article-intro { margin-bottom: 1em; }


/*------- global form styling -------*/

input.btn, .btn-next {
	background: #fcc941 url("/images/interface/arrow-white.png") no-repeat scroll center right;
	border: none;
	color: #122a67;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.6rem;
	padding: 10px 23px 10px 8px;
	text-transform: uppercase;
	transition: .4s ease;
    display: block;
}


input.btn:hover, input.btn:focus {
	background-color: #122a67; color:#ffffff;
}

.btn-next {
	background-color: #122a67;
}

a.btn-next:hover {
	background-color: #fcc941;
}

.btn.bkgd-yellow:hover {background-color: #ff7d00;}

/* hides default radio buttons and checkboxes in modern browsers (but not IE7, IE8) and sets background images */

.field:not(#cf) > input[type=checkbox], .field:not(#cf) > input[type=radio] {
	display: block;
	width:1px;
	overflow:hidden;
	position:absolute;
	left:-9999px;
}

.field:not(#cf) > label {
	background-repeat: no-repeat;
    background-position: 0 0;
    cursor: pointer;
    display: block;
    padding: 0 0 0 25px;
}

/* registration form styles */
#register_member_form .field:not(#cf) > label {
	background-position: left;
	display: inline-block;
    height: 21px;
    width: 21px;
	margin: 0 10px 0 0;
}


#register_member_form .review-question .field:not(#cf) > label {padding-left:25px;}

.field:not(#cf) > input[type=checkbox] + label {
	background-image: url("/images/interface/checkbox.png");
}

.field:not(#cf) > input[type=checkbox]:checked + label {
	background-image: url("/images/interface/checkbox-checked.png");
}

.field:not(#cf) > input[type=radio] + label {
	background-image: url("/images/interface/radio.png");
}

.field:not(#cf) > input[type=radio]:checked + label {
	background-image: url("/images/interface/radio-checked.png");
}

.field:not(#cf) > input:focus + label {
	text-decoration:underline;
	outline: 1px solid #863d7e;	
}

/*------- register and login forms -------*/

#register_member_form, #login {
	/*background: url("/images/interface/grid-bkgd-repeat.gif") repeat 0 0;*/
	background-color: #f7f7f7;
	padding: 20px 0 0 0;
	position: relative;
	margin: 0 auto 36px auto;
	width:100%; max-width: 600px;
}

#register_member_form h1, #login h1 {
	color:#122a67;
	font-family: 'Open Sans', sans-serif;
	font-size: 2rem;
	line-height: 100%;
	margin: 0 20px 18px 20px;
}

#register_member_form p, #login p {
	margin: 0 20px 18px 20px; 
}

.login-form-subtitle {
	margin: 0 20px 18px 20px;
}

#register_member_form ol, #login ol {
	list-style: none;
	margin: 0 0 30px 20px;
}

#register_member_form li, #login li {
	margin-bottom: 10px;
}

#register_member_form ol label, #login ol label {
	color:#122a67;
	display: block;
	margin:0 10px 5px 0;
}

#register_member_form input[type="text"], #register_member_form input[type="email"], #register_member_form input[type="password"], #login input[type="text"], #login input[type="email"], #login input[type="password"], #register_member_form select {
	border: none;
	color: #363636;
	display: block;
	font-family: 'Open Sans', sans-serif;
	font-size: 1.6rem;
	padding: 2%;
	width: 90%;
}

#register_member_form input:focus, #login input:focus {
	outline: 2px solid #122a67;
}

#regForm {
	background-color: #ffffff;
	margin: 100px auto;
	padding: 40px;
	width: 70%;
	min-width: 300px;
	}

input.btn-access {
	background-image: url("/images/interface/arrow-white-big.png");
	font-size: 1.8rem; height:30px;
	padding: 2px 28px 2px 10px; margin:0; border: none;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:center;
	justify-content:center;
	align-items: flex-start;
}

.form-foot {
	background-color: #122a67;
	color: #ffffff;
	overflow: hidden;
	padding: 10px 20px;
}

#login .form-foot {display:flex; justify-content: space-between; align-items: center;}

.form-foot > .field {display: flex; align-items: center; justify-content: flex-start;}

.error {
	font-size: 1.8rem;
	color:red;
	padding-top: 3px;
	font-weight:bold;
}
.error a {
	color: #122a67;
    text-decoration: underline;
}
/* registration slections */

.registration-selection {background-color: #f7c44f;}

.registration-selection h2,
.registration-selection h3,
.registration-selection h4 {font-family: 'Open Sans', sans-serif; font-weight:800; font-size: 1.8rem;}

.registration-selection h2 {color: #122a67;}
.registration-selection h3 {}
.registration-selection h4 {color:#122a67; padding: 25px 0 5px 0;}

.registration-selection p {margin:0; padding: 0;}

.registration-selection ol,
#register_member_form .registration-selection ol {padding: 0; margin: 0;}

.registration-selection ol li,
#register_member_form .registration-selection ol li {
		border-top: solid 1px #fff; margin: 0; padding:10px 0;
		display: flex; justify-content: flex-start; align-items: center;
		font-family: 'Open Sans', sans-serif; font-weight:800; font-size: 1.8rem;
}

.registration-selection input {}
.registration-selection input[type=checkbox] {
	outline: 0 !important;
	  width: 0;
  }

.registration-selection input[type=checkbox] + .checkbox-graphic {
	background: #fff;	border: none;
	height: 18px; width: 18px;
	display:inline-block;
	padding: 0px;
	margin-right: 1em;

	margin-top: 0;
	border: solid 3px #122a67;
  }

.registration-selection input[type=checkbox]:checked + .checkbox-graphic {
		background:url(/images/interface/checkbox-checked.png);
		background-repeat: no-repeat;
	 	border:none;
		height: 18px; width: 18px;
		padding: 0;
		background-size: contain;
		border: solid 3px #122a67;
  }
.registration-selection input[type=checkbox]:focus + .checkbox-graphic {
	border-color: #863d7e;
}

.registration-selection label {margin-right: 10px; font-weight:800; font-size:1.6rem;}

.checkbox-label,
#register_member_form p.checkbox-label {text-transform: uppercase; padding:0; margin:0;}

#register_member_form .r-s-content p {margin: 0 0 18px 0px;}

.r-s-header h2 {text-transform: uppercase;}

.r-s-header {padding:20px 20px 10px 20px; background-color: #f7c44f;}
.r-s-header p {color:#122a67; margin: 0; padding: 0;}
.r-s-content {padding:20px; background-color: #863d7e;}

.r-s-header ul {
	margin-left: 20px;
	margin-top:1em;
	margin-bottom:1em;
}
#register_member_form .r-s-header li {
	color: #122a67;
    font-weight: 800;
	margin:0;
}
.r-s-content ul {
	margin-left: 20px;
	margin-top:1em;
	margin-bottom:1em;
}
#register_member_form .r-s-content li {
	color: #fff;
    font-weight: 800;
	margin:0;
}
.r-s-content h2. .r-s-content h3 {color:#fff;}
.r-s-content p {color: #fff;}

.r-s-content li span {color: #fff;}
.r-s-content label {display:flex;}
.r-s-content label span {}
.r-s-content label p {}


.submit-wrap {text-align: center; background-color: #fff; padding:20px;}
.submit-wrap input.btn-access {
	margin:0 auto;
	background-color: #b3d059; padding-left:50px; padding-right: 50px;
}

/*------- course choice form -------*/

#courses {}

#courses select {
	float: left;
	display: inline-block;
	margin: 0 8px 0 0;
	padding: 12px 30px 12px 12px;	
	border: none;
}

#courses input.btn {}

/*------- question form -------*/

#question {margin-bottom: 36px;}

#question ol {
	list-style: none;
	margin-bottom: 20px;
}

#question li {
	border-bottom: 1px solid #8696bf;
	padding: 15px 110px 15px 0;
	position: relative;
}

#question li:first-child {border-top: 1px dotted #4d3b13;}
.review-question {border-bottom: solid 1px #ffc600; padding-bottom: 10px;}

.review-question h2 {font-size:2rem;}

#question.review-question li {border:none;}

.answer {
	font-size: 1.4rem;
	background-repeat: no-repeat;
	background-position: right center;
	display: block;
	font-weight: bold;
	padding: 8px 0 8px 10px;
	position: absolute;
	right: 0;
	top: 0;
	width: 100px;
}

.answer.correct {
	background-image: url("/images/interface/correct.png");
}

.answer.incorrect {
	background-image: url("/images/interface/incorrect.png");
}

li.incorrect label {
	text-decoration:line-through;
	color:#888;
}

li.correct label {
	font-weight:bold;
	
}

#max-score.alert {background-color:#ffc600; padding: 0 10px;}

/** draggable questions -- **/


/* dragula-specific example page styles */
.wrapper {}

.container {background-color:#f7f7f7; width: 50%;}
.container:nth-child(odd) {}

.questions-article h1 {font-size:2.3rem;}
.questions-article-intro {margin:20px 0;}
.questions-article-intro h2 {}


/*
* note that styling gu-mirror directly is a bad practice because it's too generic.
* you're better off giving the draggable elements a unique class and styling that directly!
*/
.container > div,
.gu-mirror {
	margin: 3%;
	padding: 0;
	background-color: rgba(0, 0, 0, 0.2);
	transition: opacity 0.4s ease-in-out;
}

.container > div .custom-drag,
.custom-drag {}

.container > div.d-d-options.gu-transit {padding:0; margin:0;}

.container > div {
	cursor: move;
	cursor: grab;
	cursor: -moz-grab;
	cursor: -webkit-grab;
}

.gu-mirror {
	cursor: grabbing;
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
}

.container .ex-moved {background-color: #e74c3c;}
.container.ex-over {background-color: rgba(255, 255, 255, 0.3);}

#left-lovehandles > div,
#right-lovehandles > div {cursor: initial;}

.handle {
	padding: 0 5px;
	margin-right: 5px;
	background-color:red;
	cursor: move;
}

.image-thing {
	margin: 20px 0;
	display: block;
	text-align: center;
}
.slack-join {
	position: absolute;
	font-weight: normal;
	font-size: 14px;
	right: 10px;
	top: 50%;
	margin-top: -8px;
	line-height: 16px;
}

/* Carbon */

#carbonads {
	position: absolute;
	display: block;
	overflow: hidden;
	margin-left: -180px;
	padding: 1em;
	max-width: calc(130px + 2em);
	background-color: #aa5579;
	text-align: center;
	font-size: 12px;
	font-family: 'Open Sans', sans-serif;
	line-height: 1.5;
}

#carbonads a {
	color: inherit;
	text-decoration: none;
	font-weight: 400;
	transition: color .2s ease-in-out;
}

#carbonads a:hover {color: #221c3b;}

#carbonads span {display: block;overflow: hidden;}

.carbon-img {display: block;margin: 0 auto 1em;}

.carbon-text {display: block;margin-bottom: 1em;}

.carbon-poweredby {
	display: block;
	text-transform: uppercase;
	letter-spacing: 1px;
font-size: 9px;
}

@media only screen and (min-width: 320px) and (max-width: 960px) {
#carbonads {
	position: relative;
	float: none;
	margin: 0 auto -2em;
	max-width: 330px;
}
#carbonads span {
	position: relative;
}
#carbonads > span {
	max-width: none;
}
.carbon-img {
	float: left;
	margin: 0 1em 0 0;
}
.carbon-text {
	float: left;
	margin-bottom: 0;
	max-width: calc(100% - 130px - 1em);
	text-align: left;
}
.carbon-poweredby {
	position: absolute;
	right: 0;
	bottom: 0;
	display: block;
}
}


.draggable { width: 100px; padding: 0px; float: left; margin: 10px 10px 10px 0; background: red; color: #fff; cursor: move;}
.draggable p {margin: 2px 0}
.droppable { width: auto; padding: 5px 10px 5px 5px; float: right; margin: 10px; border: 1px solid #ddd;}
.droppable p {float: right; width: 50px; height: 30px; padding: 5px 5px 0 0; text-align: center; margin: 0;}
.droparea {float: left; border: 1px dashed red;}

.container {clear: both; }

/** custom draggable styles **/

.drag-drop-wrapper {margin:5px 0 20px 0;}

.dd-annotation-head {
	border-bottom: solid 1px #c3c3c3;
    border-top: solid 1px #c3c3c3;    
	}
	
.dd-annotation-head-01 {}
.dd-annotation-head-02 {}

.dd-annotation-head p,
.dd-annotation-head label.d-d-answer {padding:10px 0; margin:0; line-height:normal;}

.dd-annotation-head-02 p,
.dd-annotation-head-02 label.d-d-answer {padding-left:10px; margin-left:1%; border-left: solid 1px #c3c3c3;}

.d-d-container {}

.droparea.d-d-container {border-color:#c3c3c3; margin: 0 1%; min-height:96.65%; width:98%;}
.droparea.d-d-container {border-color:#c3c3c3; margin: 0 1%; min-height:100%; width:98%;}

.droparea.d-d-container .d-d-c-01 {}
.droparea.d-d-container .d-d-c-02 {}
.droparea.d-d-container.d-d-c-02.small-area {}

.dd-questions-wrap {}

.dd-questions-names-wrap {display:flex; align-items:center;     padding: 10px 0 3px 0;}
.dd-questions-names-wrap .container-inner {width:30%; margin:0 1%;}
.dd-questions-names-wrap .container-inner h3,
.dd-questions-names-wrap .container-inner h3 > p {text-align:center; margin:0; padding:0; font-size:2rem; line-height:normal;}

@media screen and (max-width:1023px) {
	
.dd-questions-names-wrap .container-inner h3,
.dd-questions-names-wrap .container-inner h3 > p {font-size:1.6rem;}
	
	}

.dd-q-w-left {}
.dd-questions-wrap.dd-q-w-left .container {width:100%;}
.dd-questions-wrap.dd-q-w-left .container > div.d-d-options {}

.dd-q-w-right {}
.dd-questions-wrap.dd-q-w-right {}
.dd-questions-wrap.dd-q-w-right .droparea {}
.dd-questions-wrap.dd-q-w-right .droparea.d-d-container {clear:none; float:left; width:30%; min-height:100%;}

.dd-questions-wrap.dd-q-w-right .container > div {}
.dd-questions-wrap.dd-q-w-right .container > div.d-d-options {}

.dd-questions-wrap.dd-q-w-right .container-outer {height:100%;}
.dd-questions-wrap.dd-q-w-right .container-inner {clear:none; float:left; width:30%; margin:0 1%; }

.dd-questions-wrap.dd-q-w-right .container-inner h3 { padding:8px 0;}

.dd-questions-wrap.dd-q-w-right .container > div.container-inner h3 {
	color: #fff; font-size: 1.8rem; font-style: normal;
    line-height: normal;
    margin:0; padding:0;
}

.dd-questions-wrap.dd-q-w-right .container > div.container-inner h3 > p {margin:0; padding:0; line-height: normal; color:#fff;} 

.container > div.d-d-options {
	background-color: #fff;
	color:#0e205c;
	display: flex;
    align-items: center;
    justify-content: flex-start;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;	
}

.container > div.d-d-options p {margin:0; font-weight:700;}

.container > div.d-d-options.incorrect {background-color: #ee2d39;}
.container > div.d-d-options.incorrect p {color:#ffffff;}

.container > div.d-d-options.correct {background-color: #2f9062;}
.container > div.d-d-options.correct p {color:#ffffff;}

.container > div.d-d-options.incorrect p.d-d-text,
.container > div.d-d-options.correct p.d-d-text {color: #fff;}

.d-d-options input.d-d-question-option {position:absolute; left:-9999px;}

.d-d-question-option {}

label.d-d-answer {
	color:#122a67; font-weight: bold; margin:0 1%; padding:0;
	display:block; width:100%; /*text-align:center;*/
	}

.d-d-placeholder-text,
.container > div.d-d-placeholder-text {background-color: transparent; display: none;}

.d-d-text {
	margin:0; padding:15px; line-height: 100%; 
	font-weight: normal; 
}

.d-d-text:last-child {/*padding:0;*/}

input.d-d-question-option {display: block; margin-right:6px;}

.d-d-placeholder-text em {display:none}

/* ----- end of quiz : survey responses ----- */

.end-survey-content {max-width:960px;  margin: 0 auto;}

.end-survey-form {background-color: #f4f4f4; padding:30px;}

.end-survey-title {
	color:#122a67;
    font-family: 'Open Sans', sans-serif;
    font-size: 3rem;
    line-height: 100%;
    margin: 40px 0;
}

.end-survey-questions { margin-bottom: 1em;}
.end-survey-question {list-style: none; overflow: hidden;padding: 0.5em 0;}
.end-survey-question label {}
.end-survey-question p {float: left;  width: 80%; padding-right: 1em;  box-sizing: border-box; }
.end-survey-question select {width: 20%; }
.end-survey-submit {margin-bottom: 2em;}

.end-survey-questions.q2 {}

.end-survey-question.q2 {}
.end-survey-question.q2 label {}
.end-survey-question.q2 p {width: 60%;}

.end-survey-other-option, 
.end-survey-question.q2 select {width: 40%; box-sizing: border-box;}
 
.end-survey-feedback {
	height:80px;
	margin:1em 0;
	width: 97%;
	padding:1%;
	z-index: auto;
	position: relative;
	line-height: normal; 
	font-size: 2rem;
	transition: none; 
	background-color:#ffffff;
}

p.survey-checkbox-question {display:block;}

.survey-checkbox-wrapper {text-align:right;}
.survey-checkbox-list {text-align: right; display: block; margin:1em 0 2em;}
.survey-checkbox-list li {text-align: left; list-style-type: none; display:block; padding: 0 0 10px 0;}


.survey-checkbox-list li input[type='checkbox'] {display: inline-block; margin-right:8px;} 

.end-survey-submit-wrap {display: flex; width:100%; justify-content: flex-end;}
submit.end-survey-submit {}

/*.survey-checkbox-list li input[type=checkbox] {}
	

.survey-checkbox-list li input[type=checkbox] + label {							
							padding-left:36px;
							height:25px; 
							display:inline-block;
							line-height:25px;
							background-repeat:no-repeat;
							background-position: 0 0;
							font-size:1.6rem;
							vertical-align:middle;
							cursor:pointer;

						}

.survey-checkbox-list li input[type=checkbox]:checked + label {
							background-position: 0 -25px;
						}

.survey-checkbox-list li label {
							background-image:url(/images/interface/survey-checkbox.png);
							-webkit-touch-callout: none;
							-webkit-user-select: none;
							-khtml-user-select: none;
							-moz-user-select: none;
							-ms-user-select: none;
							user-select: none;
						}
*/

/* COURSE : Social Sharing **/

.social-buttons {margin: 0 20px 0 0; display: inline-block; float: left;}
.course-buttons a:link, .course-buttons a:visited {color: #fff;}

p.social-title {font-weight: bold; padding:3px; margin: 0; line-height: 100%; font-size:1.3rem;}

.fa {
    padding: 8px;
    font-size: 2.2rem;
    min-width: 35px;
    text-align: center;
    text-decoration: none;
    margin: 0px 2px;
	/* border-radius: 50%; */
}

.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}

.fa-instagram {
  background: #125688;
  color: white;
}


/** CK EDITOR CUSTOM STYLES > FRONT END **/

.ckeditor {max-width:513px; width:100%;  padding:0; margin:0 0 25px 0;}


.ckeditor > div {}
.ckeditor iframe {width:100%!important;}

@media screen and (min-width:1024px) {
	.ckeditor iframe {max-width: 513px;}
}

.m-s-fullscreen-wrap .video-wrap {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top:0;
	height: 0;
	overflow:hidden;
}
.m-s-fullscreen-wrap .video-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%!important;
	height: 100%!important;
}

.m-s-fullscreen-wrap .ckeditor {max-width:100%; width:100%;  padding:0; margin:0 0 25px 0;}
.m-s-fullscreen-wrap .ckeditor iframe {max-width:100%!important;}


.ckeditor h3,
.ckeditor p,
.ckeditor ul,
.ckeditor ol,
.ckeditor li {}

.ckeditor ol,
.ckeditor ul {margin:10px 0;}

.ckeditor li {padding:0 0 5px 3px; margin: 0 0 0 18px;}

.ckeditor h3 {padding:3px 0;}
.ckeditor p {padding:3px 0;}

.ckeditor img {display: block;}
.ckeditor img.cke-image {width:100%!important; height:auto!important;}

.ckeditor.cke-inner {}
.ckeditor.cke-inner h3 {}
.ckeditor.cke-inner p {}

.ckeditor .cke-caption {padding:6% 5%; background-color:#b3d059; width:90%;}
.ckeditor .cke-caption h3 {color: #122a67;}
.ckeditor .cke-caption p {color: #fff;}

.ckeditor.editor-video-template > div {margin-bottom:-3px;}


/** MEDIA QUERIES **/

@media screen and (min-width:80rem) {
	
	.m-s-2col-wrap {}
}

@media screen and (max-width: 79.938em) { /* = 1279px .pure-u-x-l- * */	
	
	.partner-logos {}
	.sitenav {}	
	
	.hero-home,
	.hero-page.hero-background {min-height: 450px; max-height:450px;}
	
	#courses {padding-top: 0;}	
	.nav-02 {}
	
	
}

@media screen and (min-width: 64em) { /* >= 1024px */

	.breadcrumb-sectionav > select {margin-left: auto;}
	
	.login .l-content.main {margin-bottom: 120px;}	
	.login .footer-wrap {width: 96%; z-index: 999;}
}

@media screen and (max-width: 1023px) { /* = 1023px .pure-u-lg-* */	

	.m-s-2col-content.r-hand {}
	.m-s-2col-content.l-hand {padding:0 2rem 0 0;}

	.ckeditor {max-width:none;}

	.mobile-menu-icon {display:block;}
	.header-menu-inner {}	
	
	
	.l-branding {
		padding: 5% 30px; min-height: 100px;
		-webkit-justify-content:flex-start;
		justify-content:flex-start;
	}
	
	
	
	.l-topstrip.desktop {display: none;}
	
	.l-topstrip.mobile {
		padding:10px;
		position:relative; 
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content:center;
		justify-content:center;
		background-color: #cccccc;
	}
	
	.l-topstrip.mobile .toplinks,
	.l-topstrip.mobile .toplinks li {
		display: -webkit-inline-flex;
		display: -ms-inline-flexbox;
		display: inline-flex;
}
	
	.l-topstrip.mobile .toplinks li.item-feedback {display: none;}
	
	.toplinks a {font-size: 1.6rem;}
	
	.l-topstrip.mobile .toplinks .item-register a {margin-right:0;}
	
	.l-navigation.desktop {background-color:#ffffff; padding: 0px; width: inherit;}
	
	.sitenav {display: none;}
	#courses {display: none;}
	
	
	
	/* mobile menu */
	.toggle-tab {		
		position: absolute;
		right:0;
		width: 100px;
		height: 100px;
		background: #122a67;
	}
	
	.toggle-tab .menu-icon {
		width: 3.5rem;
		height: 1.5rem;
		left: 50%;
		top: 50%;
		position: relative;
		-ms-transform: rotate(0deg) translate(-50%,-50%);
		transform: rotate(0deg) translate(-50%,-50%);
		transition: .5s ease-in-out;
		cursor: pointer;
	}


	.toggle-tab .menu-icon span:nth-child(1) {
		top: 2px;
		-ms-transform-origin: left center;
		transform-origin: left center;
	}

	.toggle-tab .menu-icon span:nth-child(2) {
	top: 11px;
	-ms-transform-origin: left center;
	transform-origin: left center;
	transition-delay: .3s;
	}
	.toggle-tab .menu-icon span:nth-child(3) {
	top: 20px;
	-ms-transform-origin: left center;
	transform-origin: left center;
	}
	
	.toggle-tab .menu-icon span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #fff;
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: .25s ease-in-out;
	}
	
	a.login-link {display:block;}
	a.login-link.forgot {margin-right:0px; padding:0 0 10px 0; border-right:none;}
	
	
	.article {width:100%; margin-right:0; padding-right:0;}
	.article h1 {font-size: 2.7rem;}
	
	.hero-home,
	.hero-page.hero-background {min-height: 300px;}
	
	.hero-home {height:auto; overflow: visible;}	
	
	.home-wrap .hero-intro {padding: 0 20px 0 20px; margin: 0;}
	.home-wrap .hero-intro p {font-size:2rem;}	
	
	.featured-course {
		min-height:290px; max-width:355px; top:0px; right:0px; width:68%;
		display:block; position: relative; float: none; margin: 0 auto;
	}
	
	.footer-info {
		text-align: center;
		display: flex;
		justify-content: center;
	}
	
	.footer-nav {
		text-align: center;
		display: flex;
		-webkit-justify-content:center;			
		justify-content:center;
	}
	
}

@media screen and (max-width: 767px) { /* = 767px. pure-u-md-* */
	
	.header-wrap {background-color: #ffffff;}
	.home-wrap .hero-intro h1 {}
	
	.pink .header-wrap,
	.lime .header-wrap,
	.green .header-wrap,
	.aqua .header-wrap,
	.orange .header-wrap {background-color: #ffffff;}
	
	img.ttf-logo {height: 79px; width:150px;}
	
	.m-s-2col-content.l-hand {margin: 0;}	

	.sidebar h1 {font-size: 2.5rem;}
	.end-survey-content {margin:0 auto;}
	
	.end-survey-title,
	.end-survey-content h2 {font-size: 2rem; margin:10px 0;}
	
	.end-survey-question p,
	.end-survey-question.q2 p {float: none; width:100%;}
	
	.end-survey-other-option, 
	.end-survey-question select,
	.end-survey-question.q2 select {width: 100%; box-sizing: border-box; margin-bottom: 20px;}
	
	.modules > li {}
	
	.footer-info p {width: 100%; text-align: center;}

	
}

@media screen and (max-width: 567px) { /* = 567px. pure-u-sm-* */	

	.hero-home,
	.hero-page.hero-background {min-height: 200px;}	
	.home-wrap .hero-intro h1,
	.home-wrap .hero-intro p {text-align: center; width: 100%;}	
	.home-wrap .hero-intro h1 {text-align: left;}
	.home-wrap .hero-intro p {font-size:1.6rem;}
	
	/* .featured-course {min-height:345px;} */
	/*.featured-course {background: url(/images/interface/graph-paper-home-mobile.png) no-repeat 0 0;} */
	
	.module-steps li.module-steps-item {margin-right:5px;}
	
	.review-text {padding:10px;}
	
	.infobar .btn {
    margin-left:0;
    width: 86%;
    padding: 4% 10% 4% 4%;
	}
	
	.infobar  .review-button.r-b-start .btn {width:auto;}
	
	.end-survey-form {padding:10px}
}


/* Twitter widget styling */

.twitter {
	padding: 1px;
}

blockquote.twitter-tweet {}
blockquote.twitter-tweet p {}
blockquote.twitter-tweet a[href^="https://twitter.com"] {}

a.twitter-timeline {}

a.twitter-timeline:hover,
a.twitter-timeline:focus {}

/* Color Highlight for keyboard navigation */

a.twitter-timeline:focus {}

/** dropdown menu styling **/
ul.dropdown-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

ul.dropdown-list li.dropdown {
    float: left;
}

ul.dropdown-list li a, .dropbtn {
    display: inline-block;
    text-align: center;
    text-decoration: none;
}

ul.dropdown-list li a:hover, .dropdown:hover .dropbtn {}
ul.dropdown-list li.dropdown {display: inline-block; padding-bottom:75px;}

ul.dropdown-list li.dropdown .dropdown-content {
	margin:150px 0 0;
	visibility: hidden;
	opacity: 0;
	transition: visibility 0.5s 0.5s, opacity 0.5s linear;	
	transition: opacity 1s linear; position: absolute;  min-width: 100%;  z-index: 9999;
	background-color: #1a3781;
	top: 0px; left: 0px;
}

ul.dropdown-list li.dropdown .dropdown-content a {
    margin: 0;
    padding: 3px 0;	
    text-decoration: none;
    display: block;
    text-align: left;
	border-bottom: solid 1px #122a67;
}

ul.dropdown-list li.dropdown .dropdown-content a:hover {}
ul.dropdown-list li.dropdown:hover .dropdown-content {
	visibility: visible;
	opacity: 1;
	transition: opacity 0.5s linear;
}


.dropdown-content h3 {
	font-family: 'Open Sans', sans-serif;
	font-size: 2.2rem; font-weight: 300; color:#122a67; 
	 padding:13px 20px; background-color: #fff;
}
.dropdown-content h4 {
	font-size: 1.6rem;
    font-weight: 800;
    color: #1eb4a1;
    text-transform: uppercase;
    padding: 0 0 8px 0;
}

.dropdown-content .course-list-inner {padding:20px;}
	
.dropdown-content .course-list-inner li {
	list-style-type: none; font-family: 'Open Sans', sans-serif; font-size: 1.6rem; 
	font-weight: 300; padding:0px 0px; margin:0;
}

.dropdown-content .course-list-inner li a {font-size: 1.6rem; font-weight: 300; padding:0px; margin:0;}

/** // dropdown menu styling **/

/** hide WYSYWYG feature from FRONT END **/
.visible-in-cms-only {display: none;}

