@charset "UTF-8";
/* CSS Document */



/* ::::: GENERAL STUFF :::::: */


#content
{
	font-weight:400;
	/* color:#333; */
	color: #000;
	min-height:512px;
	background-color:white;
	position:relative;
}

#content p
{
	line-height:1.6em;
	font-size:1.6em;
	font-weight:200;
}

#content p.smaller
{
	font-size:1.2em;
	line-height:1.2em;
}

#content li
{
	line-height:1.6em;
	padding:3px 8px 0px 1px;
	margin-left:6px;
}

#content ol li, #content ul li
{
	font-size:1.6em;
	line-height:1.5em;
	font-weight:300;
}

#content p b
{
	font-weight:900;	
}

#content h4
{
	font-size:3.0em;
	font-weight:600;	
}

#content h1
{
	font-size:2.50em;
	margin-top:0px;
	padding-top:30px;
	margin-bottom:30px;
}

#content h2
{
	font-size:2.0em;
	margin-top:0px;
	padding-top:15px;
	margin-bottom:15px;	
}

#content h3
{
	font-size:1.5em;	
}



#content .responsive-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
#content .responsive-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

#content .color-area
{
	padding:0px 0px;
}

#content .image-area
{
	padding:0px 0px;
}

#content .image-area img
{
	width:100%;
	
}

#content .image-area p
{
	width:96%;
	margin:0px auto;
}

.rounded
{
	border-radius:15px;
}

.rounded-top
{
	border-top-left-radius:15px;
	border-top-right-radius:15px;
}

.rounded-bottom
{
	border-bottom-left-radius:15px;
	border-bottom-right-radius:15px;
}


@media( max-width:767px ) {
	
	#content .color-area
	{
		padding:0px 2.25%;
		margin-left:-2.25%;
		margin-right:-2.25%;
		overflow:hidden;
		border-radius:0px;
	}
	
	#content .image-area
	{
		padding:0px 0%;
		margin-left:-2.25%;
		margin-right:-2.25%;
		overflow:hidden;
		border-radius:0px;
	}
	
}


#content div.horizontal-rule
{
	width:90%;
	max-width:800px;
	margin:0px auto;
	margin-top:8px;
	border-bottom:1px solid #7296b4;
}

@media (max-width: 767px) {
	#content p
	{
		font-size:1.4em;
	}
	
	#content h1
	{
		font-size:2.2em;
	}
	
	#content ol li, #content ul li
	{
		font-size:1.4em;
	}

}

a { color:inherit; text-decoration:underline;	 }

.large-size
{
	font-size:1.6em;
	font-weight:300;
}

.large-size b
{
	font-weight:900;	
}

.subtle-size,
p.subtle-size,
#content .subtle-size
{
	font-size:1.0em;
	font-weight:300;
}

.menu .large-size
{
	font-size:1.4em;
	font-weight:700;
}

.menu .subtle-size
{
	font-size:0.8em;
	font-weight:400;
}

.menu .normal-weight
{
	font-weight:normal;	
}

.subtle-weight
{
	font-weight:300;
}

.action-box
{
	display:block;
	background-color:red;
	margin:0px auto;
	text-align:center;
}

.center-align
{
	text-align:center;
}

.action-box-header
{
	color:white;
	font-weight:bold;
	font-size:1.8em;
	padding:20px 10px;
	text-align:center;
}

.action-box-body
{
	padding:20px 10px;
}

.action-btn
{
	display:table;
	margin:10px auto;
	font-size:1.8em;
	font-weight:bold;
	padding:10px 20px;	
	cursor:pointer;
}



.next-question-btn
{
	display:inline-block;
	font-size:1.2em;
}




.action-btn a
{
	color:inherit;
	text-decoration:none;	
}

.action-btn a:hover
{
	color:inherit;
	text-decoration:none;	
}



#content div.toc-container
{
	width:100%;
	max-width:960px;
	margin:0px auto;
}

#content table.table-of-contents
{
	width: 96%;
	margin:0px auto;
}

#content table.table-of-contents tr
{
	border-bottom:1px solid #ccc;	
}

#content table.table-of-contents td
{
	vertical-align:bottom;	
}

#content table.table-of-contents p
{
	padding-top:8px;
	padding-right:4px;
	margin-left:4px;
	min-width:50px;
}

#content table.table-of-contents p:hover
{
	
	  color:#1886bd;
       transition: 0.15s;
       -webkit-backface-visibility: hidden;
}

#content table.table-of-contents tr.clickable td p
{
	margin-left:0px;	
}

.clickable
{
	cursor:pointer;	
}

#content .btn
{
	 border-radius:0px;	
}

.left-column img
{
	width:100%;
	max-width:480px;
}

.right-column img
{
	width:100%;
	max-width:480px;	
}

#content .left-column.top-align, 
#content .right-column.top-align
{
	vertical-align:top;	
}

#content .left-column.middle-align, 
#content .right-column.middle-align
{
	vertical-align:middle;	
}

#content .left-column.bottom-align, 
#content  .right-column.bottom-align
{
	vertical-align:bottom;	
}

#content .left-small-column.middle-align, 
#content .right-small-column.middle-align,
#content .left-large-column.middle-align, 
#content .right-large-column.middle-align
{
	vertical-align:middle;	
}

@media (max-width: 767px) {
	
	.left-column img
	{
		width:100%;
		max-width:100%;
	}
	
	.right-column img
	{
		width:100%;
		max-width:100%;
	}
	
}

/* :::::: TABLE OF CONTENTS :::::: */
#content .table-of-contents
{
	padding:5px 10px 15px 10px;
}

#content .table-of-contents .two-column
{

}

#content .table-of-contents .two-column .left-column,
#content .table-of-contents .two-column .right-column
{
	padding:0 0;
}

#content .table-of-contents p
{
	font-size:1.4em;
	padding:10px 10px;
	margin:0px 5px 0px 5px;
}

/* :::::: AUDIO PLAYER :::::: */
#content .audio-player
{
	width:auto;
	position:absolute;
	top:0px;
	left:0px;
	border-top:1px solid white;
	border-bottom-right-radius: 14px;
	border-bottom-left-radius: 14px;
}

#content .audio-player p, #content .audio-player a
{
	font-size:1.0em;
	margin:0 0;
	padding:5px 10px;
    text-decoration: none;
    font-weight: 200;
    display: inline-block;
    cursor: pointer;
}

#content .audio-player a:hover {
    color: #FFF;
}


/* ::::::: COLLAPSE :::::: */

#content .collapse-container
{
	
}

#content .collapse-header
{
	cursor:pointer;
}

#content .collapse-header p,
#content .collapse-header h2
{
	margin:0px 2%;
	padding:10px 0px;
}

#content .collapse-header .collapse-glyph
{
	float:right;
	font-size:1.4em;
	margin-right:2%;
	margin-top:20px;
}

#content .collapse-content
{
	width:100%;
	margin:10px 2%;
}

#content .collapse-content div p:last-of-type
{

	margin-bottom:0px;
	
}

#content .collapse-content div h2
{
	padding-top:5px;
}

#content .collapse-content.no-indent
{
	margin:0px 0px;
}

#content .collapse-content.no-indent div
{
	padding:10px 2%;
}



/* ::::::: CALLOUTS :::::: */

#content .callout
{
	border-left:3px solid #208ec4;
	padding-left:15px;
	
}

#content .callout p
{
	font-size:2.1em;
	letter-spacing:2px;
	font-weight:700;
	font-family:'tk-adobe-garamond-pro';
	color:#208ec4;
	line-height:1.2em;
	padding:15px 0px;
}

#content .callout.smaller p
{
	font-size:1.8em;
}

@media( max-width:767px )
{
	#content .callout
	{
		padding-left:10px;
	}
	
	#content .callout p
	{
		font-size:1.6em;
		padding:10px 0px;
	}
	
	#content .callout.smaller p
	{
		font-size:1.4em;
	}

}


.image-with-caption
{
	width:100%;
}

#content .image-with-caption img
{
	width:100%;
	max-width:100%;
}

#content .image-with-caption p
{
	padding:0px 10px;
}

/*::::: KNOWLEDGE CHECK ::::::*/

#content .kc-container
{
	width:100%;
	max-width:767px;
	margin:0px auto;
}

#content .kc-btn-container
{
	width:100%;
	max-width:540px;
	margin:0px auto;
}

#content .kc-btn
{
	width:100%;
	background-color:white;
	/* color:#222; */
	color: #000;
	text-align:center;
	padding:20px 10px;
	margin:15px 0px;
	cursor:pointer;
    font-family: Lato, sans-serif;
    font-size: 20px;
    border: none;
}

#content .kc-btn span
{
	font-size:1.8em;
	font-weight:bold;
}

@media ( max-width:767px )
{
	
	#content .kc-btn-container
	{
		padding:0px 2.25%;
		margin-left:-2.25%;
		margin-right:-2.25%;
		overflow:hidden;
	}
	
	#content .kc-btn
	{
		width:96%;
		background-color:white;
		/* color:#222; */
		color: #000;
		text-align:center;
		padding:20px 2%;
		margin:15px 0px;
	}
}

/*
#content .callout-box
{
	font-weight:600;
	font-size:17px;
	border:none;	
	border-left:3px solid #7296b4;
	background-color:white;
	width:75%;
	margin-left:20px;
	margin-top:0px;
	padding-top:0px;
}

#content .callout-box.inset
{
	display:block;
	float:right;
	width:40%;
	max-width:40%;
	margin:5px 15px 5px 5px;
	border-bottom:3px solid #7296b4;
	border-left:3px solid #7296b4;
	margin-left:10px;
	margin-bottom:10px;
}

#content .callout-box.inset p
{
	font-size:1.0em;	
	
}

.callout-box p
{
	font-size:1.0em;
	margin-left:10px;	
}

*/

#content img.fill
{
	width:100%;
}

@media (max-width: 767px) {
	
	#content .callout-box
	{
		width:90%;
		margin:0px auto;
	}
}

.blue-sat-dark-border
{
	border:4px solid #1886bd;
}

.blue-sat-border
{
	border:4px solid #208ec4;
}

/* ::::::: COLORS ::::::: */

.white-color {			color:#fff; }
.gray-color { 			color:#666; }
.gray-lite-color { 		color:#cacbcb; }
.gray-lite-lite-color { 	color:#dddddd; }
.gray-dark-color {		color:#9a9b9b; }
.black-color { 			/* color:#222; */ color: #000; }
.red-color {				color:#ff0000; }

.blue-sat-lite-color {		color:#208ec4; }
.blue-sat-dark-color { 		color:#1886bd; }
.blue-dark-color { 			color:#215e8b; }

.white-bg, .btn.white-bg:hover, .btn.white-bg:focus {								background-color:#ffffff; 	}
.gray-bg, .btn.gray-bg:hover, .btn.gray-bg:focus {									background-color:#666666; 	}
.gray-lite-bg, .btn.gray-lite-bg:hover, .btn.gray-lite-bg:focus {					background-color:#cacbcb; 	}
.gray-dark-bg, .btn.gray-dark-bg:hover, .btn.gray-dark-bg:focus {					background-color:#9a9b9b; 	}
.gray-lite-lite-bg, .btn.gray-lite-lite-bg:hover, .btn.gray-lite-lite-bg:focus {	background-color:#dddddd; 	}
.black-bg, .btn.black-bg:hover, .btn.black-bg:focus {								background-color:#222222; 	}

.blue-sat-bg, .btn.blue-sat-bg:hover, .btn.blue-sat-bg:focus {						background-color:#208ec4; 	}
.blue-desat-bg, .btn.blue-desat-bg:hover, .btn.blue-desat-bg:focus {				background-color:#5c859e; 	}
.blue-gray-lite-bg, .btn.blue-gray-lite-bg:hover, .btn.blue-gray-lite-bg:focus { 	background-color:#9ac1d8; 	}
.blue-gray-dark-bg, .btn.blue-gray-dark-bg:hover, .btn.blue-gray-dark-bg:focus { 	background-color:#6796b3; 	}

.green-lite-bg, .btn.green-lite-bg:hover, .btn.green-lite-bg:focus { 				background-color:#66e53d; 	}
.green-dark-bg, .btn.green-dark-bg:hover, .btn.green-dark-bg:focus { 				background-color:#419227; 	}


