/* Skip links accessibility 2.4.1 Bypass Blocks (A) */
.skip-links{
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}

.skip-links a{
	position: absolute;
	top:-3em;
	background-color: #000;
	color: #fff !important;
	padding: 0.75em 0.75em;
	text-decoration: none;
}

.skip-links a:focus{
	top:0;
}

#skip-top{
	
	background: none;
	color: #fff;
}
#skip-top:hover{
    color:#ffffff;
    background:#0000FF;
}

/**********************************************/



body {
	margin-top:0;
	padding-top:0;
	background:#fff;
	color: #000000;
	}

section{
	padding:50px 0;
    margin:40px 0 50px 0;
}


/*  PAGE LAYOUT ELEMENTS  */


a.foot:link {color:#ffffff}
a.foot:active {color:#0000FF}
a.foot:visited {color:#abd194}
a.foot:hover {color:#ffffff;background:#0000FF;}
#nextbutton {color:#ffffff;background:#ffffff;text-decoration:none}
#backbutton {color:#ffffff;background:#ffffff;text-decoration:none}
a.navbutton:hover {background:#000000;text-decoration:none}







/*  HYPERLINKS  */

a:link {color:#0000FF}
a:visited {color:#14325A}
a:active {color:#0000FF}
a:hover {color:#ffffff;background:#0000FF;text-decoration:underline}
.NextPreviousButtons:hover {
	background: none;
	
	
}

#button_next_previous{
	margin-bottom: 100px !important;
	text-align: center;
}

a:focus{
	outline: 3px solid #EA1A1A !important;
}

/*  TEXT   */

p, ol, ul, ._bodytext {font:0.95em/125% Verdana, Geneva, sans-serif;}
._passage {font:1.1em/150% Georgia, serif;}
.standard_feedback {display:inline;color:green;font-weight:bold;border:none}
.highlightyellow {background:#ffff00;}
.highlightgreen {background:#abd194;}
.highlightblue {background:#b3d9ff;}
.highlightpink {background:#ffcce8;}
.xsmall {font:0.7em/125% Verdana,sans-serif;}
.small {font:0.8em/125% Verdana,sans-serif;}
._caption {font:0.8em/125% Verdana,sans-serif; color: #000000}
.foot {font:0.7em/125% Verdana,sans-serif; color: #ffffff}
._keyword {color:#D74317; font-weight:bold}
.large {font:1.1em/150% Verdana, Geneva, sans-serif; }
.rohl {
    position: relative;
    display: inline-block;
}
.rohl:hover {background:#ffff00;}
.noteheader {
	font:0.95em/125% Verdana,sans-serif;
	font-weight: bold;
	text-align:left;
	color:#ffffff; 
	
}
.note {
	font:0.80em/125% Verdana,sans-serif;
	text-align:left;
	color:#000000; 

}






/*  HEADER AND SUBHEADERS  */
/*  background-color: white; removed from h1*/
h1 {
	
	font-family: Verdana, sans-serif;
	font-size: 1.5em;
	font-weight:bold;
	color: #000000;
	left: 200px;
   
}


.h1dk {
	
	font-family: Verdana, sans-serif;
	font-size: 1.5em;
	font-weight:bold;
	color: white;
	left: 200px;
   
}



.h1dk1 {
	
	font-family: Verdana, sans-serif;
	font-size: 1.5em;
	font-weight:bold;
	color: #000000;
	left: 200px;
    
}


.h1dk2 {
	
	font-family: Verdana, sans-serif;
	font-size: 1.5em;
	font-weight:bold;
	color: white;
	left: 200px;
	
    
}


.h1dk3 {
	
	font-family: Verdana, sans-serif;
	font-size: 1.5em;
	font-weight:bold;
	color: white;
	left: 200px;
		
    
}



h2 {
	margin-top:10px;
	font-family: Verdana, sans-serif;
	font-size: 1.2em;
	font-weight: bold;
	color:#557b5d
}

h3 {
	
	font: 1.05em/125% Verdana, Geneva, sans-serif;
	font-weight: bold;
	color:#593C8F;
	margin-top:25px;
	position:relative;
	
}

.copyright_header{
	
	margin-top: 50px !important;
}
/*
h3:after{
	display:block;
	height:2px;
	width:100%;
	content:" ";
	background-color: #458032;
	position:absolute;
	top:50%;
	z-index:1;
	
}

h3 span{
	background: #ffffff;
	position: relative;
	z-index: 5;
	padding: 0 20px;
	
}
*/
h4 {
	
	font: 1em/100% Verdana, Geneva, sans-serif;
	font-weight: bold;
	color:#000000;
	margin-top:20px
}






/*   BUTTONS (Interactive Activities)  */

.standard_button {
	height:30px;
	width:140px;
	background-color:#2679A5;
	color:#ffffff;
	font-weight:bold;
	margin-top:10px
}


/*   FEEDBACK (Interactive Activities)  */

.reveal_answer_div {
  display:none;
  font-family: Verdana, sans-serif;
  font-size: 0.95em;
  font-weight: bold;
  color: #593C8F
}



/*  PAGE LAYOUT ELEMENTS  */


#container {
	margin-left:auto;
	margin-right:auto;
	border: #000000; 
	border: 2px
}

#top {
	font:0.6em Verdana,sans-serif;
	padding:6px 10px 6px 10px;
	background:#07633;
	border-top-width: 5px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000000;
	border-bottom-color: #000000
    
}

#banner_gradient {
	background: #458032; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#458032, #2D671A); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#458032, #2D671A); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#458032, #2D671A); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#458032, #2D671A); /* Standard syntax */
	/*background-image: url(common/main_header.jpg);*/
	padding: 0px 0px 0px 10px;
	height: 70px;
	background-position: left;
	background-repeat: no-repeat;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px
}


#banner_gradient a {
	background:#458032;
	border-bottom-width:0px;
	border-top-width:0px
}
	
/*#banner1 {white-space:nowrap;padding-right:50px;}*/
#banner_gradient1 {
	white-space:nowrap;
	padding-right:50px;
	padding-top:15px;
	padding-left:47px
}

#banner_gradient2 {
	margin-left:600px;
	text-align:right
}




#banner {
	background-color:#593C8F;
	background-image: url(./common/main_header.jpg);
	padding:2px 0px 0px 10px;
	height: 90px;
	background-position: left;
	background-repeat: no-repeat;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

#bannerdk {
	background-color:#593C8F;
	background-image: url(./common/banner_header4.jpg);
	padding:0px 0px 0px 10px;
	height: 70px;
	background-position: left;
	background-repeat: no-repeat;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}


#bannerdk1 {
	background-color:#593C8F;
	background-image: url(./common/banner_header2.jpg);
	padding:0px 0px 0px 10px;
	height: 90px;
	background-position: left;
	background-repeat: no-repeat;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	
}


#bannerdk2 {
	background-color:#593C8F;
	background-image: linear-gradient(
      rgba(0, 0, 0, 0.30),
      rgba(0, 0, 0, 0.30)
    ), url(./common/header3.jpg);
	padding:2px 0px 0px 10px;
	height: 90px;
	background-position: left;
	background-repeat: no-repeat;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}


#bannerdk3 {
	background-color:#593C8F;
	background-image:linear-gradient(
      to left,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.75)
    ),url(./common/banner_header5.jpg);
	padding:0px 0px 0px 10px;
	height: 90px;
	background-position: left;
	background-repeat: no-repeat;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}



#banner a {
	background:#593C8F;
	border-bottom-width:0px;
	border-top-width:0px
}
	
/*#banner1 {white-space:nowrap;padding-right:50px;}*/
#banner1 {
	white-space:nowrap;
	padding-right: 8px;
	padding-top:1px;
	padding-left:8px;
    width: 280px;
}


#banner1dk {
	white-space:nowrap;
	padding-right: 8px;
	padding-top:1px;
	padding-left:8px;
	padding-bottom: 0px ;
   
	display: inline-block;
  	padding: 0.25rem;
	background: rgba(0, 0, 0, .50);
   	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}


#banner1dk1 {
	white-space:nowrap;
	padding-right: 8px;
	padding-top: 200px;
	padding-left:8px;
    
	background-color: white;
  	display: inline-block;
  	padding: 0.50rem;
	background: rgba(255, 255, 255, .90);
    color: black;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	
}

#banner1dk2 {
	white-space:nowrap;
	padding-right: 8px;
	padding-top:25px;
	padding-left:8px;
    width: 280px;	
   
}


#banner1dk3 {
	white-space:nowrap;
	padding-right: 8px;
	padding-top:25px;
	padding-left:8px;
    width: 280px;	
   
}


#banner2 {
	margin-left:600px;
	text-align:right
}

/*#content {clear:both;padding:10px}*/
#content {
	clear:both;
	padding:0px;
	margin-bottom: 30px;	
}



#maincontent {
	margin-left:3%;
	margin-right:5%;
	/*This fixes the problem with the menu not being even with the Lesson header.*/
	border:1px solid #ffffff;
}

#maincontent p {
	margin-bottom: 15px;
	margin-top:15px;
	padding-bottom:0px;
	padding-top:0px
} 

#maincontent H2 {
	margin-bottom: 10px;
	margin-top:10px;
	padding-bottom:0px;
	padding-top:0px
}

#maincontent H3 {
	margin-bottom: 10px;
	margin-top:10px;
	padding-bottom:0px;
	padding-top:0px
}

#footer {
	background: #303030;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	height: 80px;

}


/* Add a black background color to the top navigation */
#topnav {
background: #707070;
background: -moz-linear-gradient(top, #707070 0%, #707070 1%, #808080 6%, #909090 15%, #909090 21%, #909090 26%, #707070 36%, #505050 50%, #303030 74%, #303030 88%, #303030 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #707070), color-stop(1%, #707070), color-stop(6%, #808080), color-stop(15%, #909090), color-stop(21%, #909090), color-stop(26%, #909090), color-stop(36%, #707070), color-stop(50%, #505050), color-stop(74%, #303030), color-stop(88%, #303030), color-stop(100%, #303030));
background: -webkit-linear-gradient(top, #707070 0%, #707070 1%, #808080 6%, #909090 15%, #909090 21%, #909090 26%, #707070 36%, #505050 50%, #303030 74%, #303030 88%, #303030 100%);
background: -o-linear-gradient(top, #707070 0%, #707070 1%, #808080 6%, #909090 15%, #909090 21%, #909090 26%, #707070 36%, #505050 50%, #303030 74%, #303030 88%, #303030 100%);
background: -ms-linear-gradient(top, #707070 0%, #707070 1%, #808080 6%, #909090 15%, #909090 21%, #909090 26%, #707070 36%, #505050 50%, #303030 74%, #303030 88%, #303030 100%);
background: linear-gradient(to bottom, #707070 0%, #707070 1%, #808080 6%, #909090 15%, #909090 21%, #909090 26%, #707070 36%, #505050 50%, #303030 74%, #303030 88%, #303030 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#707070', endColorstr='#303030', GradientType=0 );



    overflow: hidden;
    -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

/* Style the links inside the navigation bar */
#topnav a {
    float: left;
    display: block;
    color: #ffffff;
    text-align: center;
    padding: 14px 16px; 
    text-decoration: none;
    font-size: 17px;
    font:bold 1em Verdana,sans-serif;
    border-right: 1px solid #bbb;
}

/* To remove the bullets from the Topnav list */
#topnav ul {
    list-style-type: none;
    margin: 1px; 
    padding:0px;
    
    
}

#topnav ul li{
 
}

/* Topnav Hover */
#topnav a:hover {
background: #b0b0b0;
background: -moz-linear-gradient(top, #b0b0b0 0%, #b0b0b0 1%, #d0d0d0 9%, #f0f0f0 18%, #f0f0f0 26%, #d0d0d0 38%, #b0b0b0 52%, #808080 81%, #606060 95%, #606060 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #b0b0b0), color-stop(1%, #b0b0b0), color-stop(9%, #d0d0d0), color-stop(18%, #f0f0f0), color-stop(26%, #f0f0f0), color-stop(38%, #d0d0d0), color-stop(52%, #b0b0b0), color-stop(81%, #808080), color-stop(95%, #606060), color-stop(100%, #606060));
background: -webkit-linear-gradient(top, #b0b0b0 0%, #b0b0b0 1%, #d0d0d0 9%, #f0f0f0 18%, #f0f0f0 26%, #d0d0d0 38%, #b0b0b0 52%, #808080 81%, #606060 95%, #606060 100%);
background: -o-linear-gradient(top, #b0b0b0 0%, #b0b0b0 1%, #d0d0d0 9%, #f0f0f0 18%, #f0f0f0 26%, #d0d0d0 38%, #b0b0b0 52%, #808080 81%, #606060 95%, #606060 100%);
background: -ms-linear-gradient(top, #b0b0b0 0%, #b0b0b0 1%, #d0d0d0 9%, #f0f0f0 18%, #f0f0f0 26%, #d0d0d0 38%, #b0b0b0 52%, #808080 81%, #606060 95%, #606060 100%);
background: linear-gradient(to bottom, #b0b0b0 0%, #b0b0b0 1%, #d0d0d0 9%, #f0f0f0 18%, #f0f0f0 26%, #d0d0d0 38%, #b0b0b0 52%, #808080 81%, #606060 95%, #606060 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b0b0b0', endColorstr='#606060', GradientType=0 );
    color: black;
}

/* Topnav active/current link */
.active_topnav {
    float: left;
    display: block;
    color: #ffffff;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
    font: bold 1em Verdana,sans-serif;
	
background: #db6848;
background: -moz-linear-gradient(top, #db6848 0%, #e38e76 14%, #de937e 23%, #d96443 34%, #d95736 44%, #d74317 57%, #c73108 68%, #942003 85%, #801f07 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #db6848), color-stop(14%, #e38e76), color-stop(23%, #de937e), color-stop(34%, #d96443), color-stop(44%, #d95736), color-stop(57%, #d74317), color-stop(68%, #c73108), color-stop(85%, #942003), color-stop(100%, #801f07));
background: -webkit-linear-gradient(top, #db6848 0%, #e38e76 14%, #de937e 23%, #d96443 34%, #d95736 44%, #d74317 57%, #c73108 68%, #942003 85%, #801f07 100%);
background: -o-linear-gradient(top, #db6848 0%, #e38e76 14%, #de937e 23%, #d96443 34%, #d95736 44%, #d74317 57%, #c73108 68%, #942003 85%, #801f07 100%);
background: -ms-linear-gradient(top, #db6848 0%, #e38e76 14%, #de937e 23%, #d96443 34%, #d95736 44%, #d74317 57%, #c73108 68%, #942003 85%, #801f07 100%);
background: linear-gradient(to bottom, #db6848 0%, #e38e76 14%, #de937e 23%, #d96443 34%, #d95736 44%, #d74317 57%, #c73108 68%, #942003 85%, #801f07 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#db6848', endColorstr='#801f07', GradientType=0 );
	
    border-right: 1px solid #bbb;
}





/* Objectives and Important Notes box */
#objective {
    background: #ccd7ce;
    border:solid 1px #557b5d;
    padding: 0.25em 1em 1em 1em;
    margin: 2.5em;
    border-radius: 1em;
}



#objectivebanner {
	background-color:#557b5d;
	padding:10px 0px 10px 10px;
	background-position: left;
	background-repeat: no-repeat;
    height: auto;
    margin: -0.25em -1em 1em -1em;
    border-top-left-radius: 1em;
    border-top-right-radius: 1em;

}




hr { 
    display: block;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
} 


#note {
    background: #ccd7ce;
    border:solid 3px #557b5d;
    padding: 0.25em 1em 1em 1em;
    margin: 2.5em;
    border-radius: 1em;
}





/*Studymate*/
#smfc{
	position:static;
	overflow:hidden;
	height:375px;
	width: 500px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smfc object{
	width:780px;
	height:560px;
	float:left;
	margin:-40px 0px 0px -16px;
	border:0px;
	padding:0px 0px 0px 0px
}

#smsva{
	height:390px;
	width:560px;
	overflow:hidden;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smsva object{
	margin: -70px  0 0 -16px;
	border:0px
}

#smquiz{
	position:static;
	overflow:hidden;
	height:455px;
	width:610px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smquiz object{
	width:780px;
	height:560px;
	float:left;
	margin:-65px 0px 0px -16px;
	border:0px;
	padding:0px 0px 0px 0px
}

#smcw{
	height:510px;
	width:560px;
	overflow:hidden;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smcw object{
	margin: -40px  0 0 -16px;
	border:0px
}

#smfib{
	height:420px;
	width:560px;
	overflow:hidden;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smfib object{
	margin: -40px  0 0 -16px;
	border:0px;
}

#smpick{
	position:static;
	overflow:hidden;
	height:520px;
	width:640px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smpick object{
	width:780px;
	height:560px;
	float:left;
	margin:0px 0px 0px -5px;
	border:0px;
	padding:0px 0px 0px 0px
}

/* Style for Glossary */
#smgl{
	position:static;
	overflow:hidden;
	height:425px;
	width:600px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smgl object{
	width:780px;
	height:560px;
	float:left;
	margin:-37px 0px 0px -16px;
	border:0px;
	padding:0px 0px 0px 0px
}

/* Style for Matching */
#smmatch{
	position:static;
	overflow:hidden;
	height:465px;
	width:620px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smmatch object{
	width:780px;
	height:560px;
	float:left;
	margin:-37px 0px 0px -16px;
	border:0px;
	padding:0px 0px 0px 0px
}

/* Style for Challenge */

#smchallenge{
	position:static;
	overflow:hidden;
	height:600px;
	width:640px;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px
}

#smchallenge object{
	width:780px;
	height:580px;
	float:left;
	margin:-10px 0px 0px -5px;
	border:0px;
	padding:0px 0px 0px 0px
}

/* Style for New Tooltip*/

.smtooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted;
	color:#171738;
	
}

.smtooltip .smtooltiptext {
     visibility: hidden;
     background-color: #171738;
     color: #ffffff;
     text-align: left;
     border-radius: 6px;
     padding: 8px 8px;

/* Position the tooltip */
     position: absolute;
     z-index: 1;
}



.smtooltip:hover .smtooltiptext {
    visibility: visible;
}



@media screen and (max-width: 872px) {
	.tooltip .tooltiptext{
		position: absolute;
		right: 20px;
		top: 30px;
		
	}
}
@media screen and (max-width: 500px) {
	.tooltip .tooltiptext{
		position: absolute;
		right: 10px;
		top: 50px;
		
	}
}

iframe{
    box-sizing:content-box;
} 


.textarea{
	width: 100%;
}
