* 						{
	font-family: Calibri, Arial, sans-serif;

	}


/* 
------------------------------------------------------
Close Course 
------------------------------------------------------
*/
#close {
	position:relative;
	top:10px;
	right:10px;
	float:right;
	right:10px;
	width:20px;
	height:20px;
	background-color:#003965;
	border:solid white 2px;
	border-radius:100px;
	box-shadow: 0 2px 1px 0 #006;
	font-weight:bold;
	text-align:center;
	line-height:1em;
	color:white;
	cursor:pointer;
}

#close:hover {
	position:relative;
	top:12px;
	right:10px;
	float:right;
	right:10px;
	width:20px;
	height:20px;
	background-color:#003965;
	border:solid white 2px;
	border-radius:100px;
	box-shadow: 0 0;
	font-weight:bold;
	text-align:center;
	line-height:1em;
	color:white;
	cursor:pointer;
}

/* 
------------------------------------------------------
*/

/* 
------------------------------------------------------
Video Card CSS 
------------------------------------------------------
*/

.card {
	width:440px;
	border: medium solid #000000;
	float:left;
	margin:1em 1em 1em 0;
	background-color: #E5E5E5;
	-webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.40);
	box-shadow: 2px 2px 4px rgba(0,0,0,0.40);
}

.card:nth-of-type(2n+3) {

	clear:left;

}



.card h2 {
	font-family: Calibri;
	font-size: 1.2em;
	font-weight: bold;
	color: #000000;
	text-align: center;
	margin: .2em .2em;
}

.firstCard {
	margin-left:1em;
}

.noClear{
	clear:none !important;
	margin-left:0 !important;
}


.transcript {
	max-width: 100%;
	display: inline-block;
	position:relative;
	top:-.1em;
}

.transcript a {
	background: white;
	color:rgba(2, 56, 102, 1);
    padding: .7em .5em;
    font-weight: bold;
    border-bottom: 6px solid #003965;
    border-radius: 8px;
	
}

.transcript a:hover {
	
  
    border: none;
    position: relative;
    top: .35em;
	
}

/*
------------------------------------------------------
Welcome Buttons 
------------------------------------------------------
*/

#welcome p {
	position:relative;
	top:-.4em;
	font-size:1.4em;
	font-weight:bold;
}

#welcome p::before {
	content:" -   -   - ";
}

#welcome p::after {
	content:" -   -   - ";
}


#welcome p {
	position:relative;
	top:-.4em;
	font-size:1.5em;
	font-weight:bold;
}

#welcome a {
    color: white;
	font-size:1em;
	font-weight:bold;
    background: #003965;
    padding: 1em;
    border-radius: 8px;
    border-bottom: 6px solid #0d7dbd;
    margin-top: 1em;
}

#welcome a:hover {
    background: #44aa11;
    border: none;
    position: relative !important;
    top: 1.8em !important;
}

/* ------------------------------------------------------ 
2 Columns
------------------------------------------------------  */

.column {	
	float:left;
}

.left {
	width:50%;
}
.right {
	width:50%
}

/* ------------------------------------------------------ 
Images
------------------------------------------------------  */
.graphic {
	
	width:100%;
	min-width:500px;
	max-width:600px;

}

.stepGraphic {
	margin-top:2em;
	

}


/* ------------------------------------------------- */
.iconBar {

	width:100%;
	height:7em;
	
}

.icon {
	height: 120px;
}



.feedback				{border:2px solid #003865;
						border-radius:15px;
						background-color:#D8EBD7;
						padding:12px;
						box-shadow: 8px 8px 8px #bfbfbf;
						margin-top:1em;
						max-width:100%;
						}
						
.checkmark				{font-size:160%;
						color:#0D5257;
						font-weight:bolder;
						}

.floatright				{float:right;
						}

.flowchart				{box-shadow: 8px 8px 8px #bfbfbf;
						max-width:95%;
						margin-left: 1em;
						margin-bottom: 30px;
						padding: 0px;
						border:2px solid #003865;
						}

.icons					{box-shadow: 8px 8px 8px #bfbfbf;
						padding: 0px;
						}
						
.videoborder			{box-shadow: 8px 8px 8px #bfbfbf;
						border:2px solid #bfbfbf;
						height: 360px;
						width: 640px;
						margin-bottom: 40px;
						padding: 0px;
						}

.video					{

	padding: 0px;
	margin-bottom: 60px;
	-webkit-box-shadow: 0px 0px;
	box-shadow: 0px 0px;
	height: 240px;
	width: 400px;
						}

.bottom					{margin-bottom:20px;
						clear:both;
						}

.bullets				{
						list-style-type: none;
					
						}
						
ul.bullets li:before{
margin-left:-2.4em; 
font-family:Wingdings;
content:"n ";
color: rgba(88,168,30,1.00);}
				
#topbanner				{width:100%;
						height:140px;
						background-image:url(../images/banner.png);
						background-repeat:no-repeat;
						background-color:#f6fafd;
						margin:0px;
						padding:0px;
						}
body					{
	max-width: 1000px;
	height: 100%;
	margin: 0 auto;
	padding: 0px;


						}	

						
#userpreferences		{
						font-size: 1.1em;
						display: block;
						margin: .4em 15px;
						float: left;
						}

#modulebar				{
						box-sizing:border-box;
						width: 100%;
						position: relative;
						

						}

.module					{
						box-sizing:border-box;
						height:3em;
						width: 10%;
						background-color:#030303;
						border-top: 2px solid white;
						border-right: 2px solid white;
						text-align:center;
						float:left;
						overflow: hidden;
						/*Vertical Align*/
						display: flex;
						align-items: center;
						justify-content: center;
						}

.module:hover 			{
						cursor:pointer;
						box-shadow: inset 0 -.3em 0 0 rgba(255, 2255, 255, 1);

						}
	
.moduleCurrent			{
						box-sizing:border-box;
						height:3em;
						width: 10%;
						background-color:#fff;
						border-top: 2px solid white;
						border-right: 2px solid white;
						box-shadow: inset 0 -.3em 0 0 rgba(255, 2255, 255, 1);
						text-align:center;
						float:left;
						overflow: hidden;
						

            			/*Vertical Align*/
						display: flex;
						align-items: center;
						justify-content: center;
						}

.moduleCurrent a		{
						color:black;
						}

.moduleCurrent:hover 	{
						cursor:pointer;
						box-shadow: inset 0 -.3em 0 0 rgba(255, 2255, 255, 1);
						}

.lastmodule				{
						box-sizing:border-box;
						height:3em;
						width: 10%;
						background-color:#030303;
						border-top: 2px solid white;
		
						text-align:center;
						float:left;
						overflow: hidden;

            			/*Vertical Align*/
						display: flex;
						align-items: center;
						justify-content: center;
						}

.lastmodule:hover		{
						cursor:pointer;
						box-shadow: inset 0 -.3em 0 0 rgba(255, 2255, 255, 1);
						}						
						
.lastmoduleCurrent		{box-sizing:border-box;
						height:3em;
						width: 10%;
						background-color:#fff;
						text-align:center;
						float:left;
            			overflow: hidden;
						border-top: 2px solid white;
						display: flex;
						align-items: center;
						justify-content: center;
						}

#topnavDead 			{color: #ffffff;
						text-decoration:none;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						line-height:2em;
						text-align:center;
						}

a 						{
						font-size: .9em;
						font-family: Calibri, Arial, sans-serif;
						font-weight: normal;
						color:#fff;
						line-height:1em;
						text-align:center;
						text-decoration:none;
						}

a.hyperlink { 
			font-size:1.1em;
			font-weight:bold;
			color:blue !important ;
			text-decoration:underline;
	
}

td a {
	font-size:1em;
			font-weight:normal;
			color:blue !important ;
			text-decoration:underline;
	
}

td li {position:relative;
		left:-1.2em;
	
}

.topnav>a, .topnavCurrent>a			{
						color: #fff;
						padding: 0 .5em;
						}


.preferences			{
						color: #003865;
						font-size: .8em;
						font-weight:bold;
						}


a.preferences:hover		{color: blue;
						text-decoration:underline;
						
						}						

a.botnav:link			{color: #fff !important;
						}

a.botnav:hover			{
						text-decoration:underline;

						}
			
a.copyright:link		{color: #ffffff;
						 font-weight: bold;
						 }



a.copyright:hover		{color: #000000;
						 }						

a.syllabus:link			{color: #333366; text-decoration: none;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						 }

a.syllabus:visited		{color: #333366; text-decoration: none;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						 }

a.syllabus:hover		{color: #8D3F2B; text-decoration: underline;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						 }

a.navigation:link		{color: #8D3F2B; text-decoration: none;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						 }

a.navigation:visited	{color: #8D3F2B; text-decoration: none;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						 }

a.navigation:hover		{color: #333366; text-decoration: underline;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						 }


a.syllabuslink:link		{color: #003697;
						text-decoration:none;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 110%;
						font-weight:normal;
						}

a.syllabuslink:visited	{color: #003865;
						text-decoration:none;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 110%;
						font-weight:normal;
						}

a.syllabuslink:hover	{color: #8D3F2B;
						text-decoration:underline;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 110%;
						font-weight:normal;
						}


#navigationbar			{height:1.75em;
						background-color:#000000;
						border-bottom:1px solid #ffffff;
						clear:both;
						}
						
.syllabus				{height:1.75em;
						width:33%;
						background-color:#000000;
						text-align:center;
						border-right:1px dotted #ffffff;
						float:left;
						line-height:1.75em;
						}
						
.return					{height:1.75em;
						width:100%;
						background-color:#000000;
						text-align:center;
						float:left;
						line-height:1.75em;
						}

.pagenumber				{height:1.75em;
						width:33%;
						background-color:#000000;
						text-align:center;
						border-right:1px dotted #ffffff;
						float:left;
						line-height:1.75em;
						}

.exit					{height:1.75em;
						width:25%;
						background-color:#000000;
						text-align:center;
						border-right:1px dotted #ffffff;
						float:left;
						line-height:1.75em;
						}
						
.navbuttons				{height:1.75em;
						width:33%;
						background-color:#000000;
						text-align:center;
						float:left;
						line-height:1.75em;
						}
						
.botnav					{color: #ffffff;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						}


.botnavDisabled			{color: #666666;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
  
            /* SL 2017-08-31 */
            cursor: default;
						}
						
#maincontent			{
	background-color: #fdfdfd;
	width: 100%;
	}

.content {
	margin-left:1em;
	background-color:#030303;
	
}

		
#footer					{
						width:100%;
						height:4em;
						background-color:#fafcfd;
						background-image:url(../images/footer.jpg);
						background-repeat:no-repeat;
						padding:0px;
						clear:both;
						}

#copyrightcontainer		{position:absolute;
						
						}

#caption200				{float:right;
						width:200px;
						margin: 10px 10px 10px 10px;
						color: #003865;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						text-align:left;
						}
				
#caption250				{float:right;
						width:250px;
						margin: 10px 10px 10px 10px;
						color: #003865;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						text-align:left;
						}
						
#caption300				{float:right;
						width:300px;
						margin: 10px 10px 10px 10px;
						color: #003865;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						text-align:left;
						}
						
#caption350				{float:right;
						width:350px;
						margin: 10px 10px 10px 10px;
						color: #003865;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						text-align:left;
						}

#caption400				{
						width:400px;
						margin: 1em 1em 10px 0;
						color: #003399;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						text-align:left;
						
						
						}
		
#caption500				{float:right;
						width:500px;
						margin: 10px 10px 10px 10px;
						color: #003399;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 90%;
						font-weight:bold;
						text-align:left;
						}
		
.captionRight {
	margin: 1.4em 1em 1em 1em !important;
	clear:both;
}

.date					{color: #ffffff;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: bold;
						}
						
.copyright				{padding-top: 20px;
						}

						 
.mainbody				{
						 color: #fff;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 110%;
						}
						
/* CSS Utilities */

.clearRight 			{
						clear:right;
						}

.clearBoth 				{
						clear:both;

}

.center {
	text-align:center;
}

.noTopMargin {
		margin-top:0;
}

.moveUp {
	position:relative;
	top:-1em;
}


/* 2017-09-26, SRL: Add styling for easier selection of choices */
span[name*="choice"] > label {
  line-height: 1.8;
  padding-right: 12px;
}
span[name*="choice"] {
  /*border-radius: 6px;*/
  padding: 4px 0 4px 4px;
}
span[name*="choice"]:hover {
  background-color: rgba(255,255,255,0.8);
}

.box					{border:2px solid #003865;
						background-color: #cbe2f3;
						margin:0px;
						padding:8px;
						}

.quizboxodd				{border:2px solid #003865;
						border-radius:15px;
						background-color: #cbe2f3;
						margin-bottom:20px;
						padding:12px;
						box-shadow: 8px 8px 8px #bfbfbf;
						}

.quizboxeven			{border:2px solid #003865;
						border-radius:15px;
						background-color: #fbedd0;
						margin-bottom:20px;
						padding:12px;
						box-shadow: 8px 8px 8px #bfbfbf;
						}

.boxeven				{border:2px solid #003865;
						border-top:none;
						background-color: #fbedd0;
						margin:0px;
						padding:8px;
						}

.boxodd					{border:2px solid #003865;
						border-top:none;
						background-color: #cbe2f3;
						margin:0px;
						padding:8px;
						}

.chartheader			{color: #ffffff;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 120%;
						 font-weight: bold;
						}

.divider				{color: #ffffff;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 90%;
						 font-weight: normal;
						}
						

			 
h1						{color: #003865;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 200%;
						 font-weight: bold;
						 }

h2						{
						 color: #003865;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 140%;
						 font-weight: bold;

						 }
						 
h2.noMargin				{
						margin-top:0;
						margin-bottom:0;
						}

h3						{
						position:relative;
						color: #003865;
						
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 140%;
						 font-weight: bold;

						 }

h4						{color: #333366;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 110%;
						 font-weight: bold;
						 }
						 

						 
li						{
						padding-bottom: 8px;
						}

.imgborder				{border: 1px solid #333366;
						margin-left:8px;
						margin-top:8px;
						margin-bottom:8px;
						}
						


.charttitle				{color: #FFFFFF;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 120%;
						 font-weight: bold;
						 }
						 
.chartborder			{border-width: 0 0 2px 2px;
						border-style:solid;
						border-color:#003865;
						}
						
.cellborder				{border-width: 2px 2px 0 0;
						border-style:solid;
						border-color:#003865;
						}
						
.rowcolor1				{background-color:#fbedd0;
						}
						
.rowcolor2				{background-color:#cbe2f3;
						}
						
.rowcolor3				{background-color:#003865;
						}
		
.rowcolor4				{background-color:#336699;
						}
						
#photo					{float:right;
						width:300px;
						margin: 10px 10px 10px 10px;
						border: 1px solid #333366;
						color: #333366;
						font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						font-size: 80%;
						font-weight:bold;
						text-align:center;
						}
						
#syllabusMenu {
	height: 100%;
}

#syllabusCol1 {
	margin: 0;
	width: 32.5%;
	float: left;
	background: #fff;
  margin-bottom: 2em;
}

#syllabusCol2 {
	margin: 0 0 0 10px;
	width: 32.5%;
	float: left;
	background: #fff;
  margin-bottom: 2em;
}

#syllabusCol3 {
	margin: 0 0 0 10px;
	width: 32.5%;
	float: left;
	background: #fff;
  margin-bottom: 2em;
}

#topicLink {
	margin-left:22px;
}

#syllabuslinkDead		{color: #000000;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 110%;
						}
						
/* SL 2017-08-31 */

#prevNext				{
						float:right;
						position: relative;
						top: -3.25em;
						right: .7em;
						height: 3em;
						}

.prevNext:link			{
						position:relative;
						top:1.2em;
						color: #ffffff;
						font-size: 1em;
						font-weight:bold;

						/* SL 2017-08-31 */
						background-color: #003965;
						border-left: solid 2px white;
						border-right: solid 2px white;
						text-align: center;
						padding: .80em 3em;
						width: 500px;
						margin-left: 1em;
						}


.prevNext:hover			{
            			background-color: #77bf43;
      					color: #ffffff;
						box-shadow: inset 0 -.3em 0 0 rgba(254, 203, 70, 1);
}
.prevNextDisabled			{
            position:relative;
			top:1.2em;
            color: #eeeeee;
            font-size: 1em;
            font-weight:bold;
            background-color: #9e9d98;
            border-left: solid 2px white;
            border-right: solid 2px white;
            text-align: center;
            padding: .80em 2.1em;
			width: 500px;
			margin-left: 1em;
	
      		}

.divider2				{color: #003865;
						 font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						 font-size: 100%;
						 font-weight: bold;
						 display:none;
						}
						

						
#container				{
						width:100%;
						background-color:#ffffff;
						}

#maintitle				{
						clear:both;
						}

#maintitle h1 {
						color: white;
						background: #013965;
						text-align: left;
						height: 1.6em;
						line-height:1.5em;
						display: flex;
						align-items: center;
						padding-left: .6em;
						margin-bottom: 0;
}

						
						
#welcome				{font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
						width:100%;
						margin:0px 0px 0px 0px;
						padding:10px 10px 10px 10px;
						background-color:#ffffff;
						}
						
#filler					{height:50px;
						background-color:#cccccc;
						width:100%;
						}
						
						
/* 
------------------------------------------------------
Grid
------------------------------------------------------
*/					

/*  SECTIONS  */
.section {
	position:relative;
	top:-2em;
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF SIX  */
.span_6_of_6 {
	width: 100%;
}

.span_5_of_6 {
  	width: 83.06%;
}

.span_4_of_6 {
  	width: 66.13%;
}

.span_3_of_6 {
  	width: 49.2%;
}

.span_2_of_6 {
  	width: 32.26%;
}

.span_1_of_6 {
  	width: 15.33%;
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
	.col {  margin: 1% 0 1% 0%; }
	.span_1_of_6, .span_2_of_6, .span_3_of_6, .span_4_of_6, .span_5_of_6, .span_6_of_6 { width: 100%; }
}


/* 
------------------------------------------------------
Large Screen
------------------------------------------------------
*/
@media screen and (min-width: 1025px) {
#pageWrapper {
	
	border:  4px solid rgba(0,0,0,1.00);
    padding-right: 0px;
	}
}


/* 
------------------------------------------------------
Mobile
------------------------------------------------------
*/

@media screen and (max-width: 600px) {
    .column {
        width: 100%;
    }
}