/* 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:#E1BC7F}
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:#82A638;}
.highlightblue {background:#597394;}
.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:#8d3066; 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:#2E4D74
}

h3 {
	
	font: 1.05em/125% Verdana, Geneva, sans-serif;
	font-weight: bold;
	color:#458032;
	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:#2E4D74;
	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: #458032
}



/*  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:#458032;
	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:#458032;
	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:#458032;
	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:#458032;
	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:#458032;
	background-image:linear-gradient(
      to left,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 0.75)
    ),url(./common/banner_header5.gif);
	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:#458032;
	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;	
}


#mainmenu {
	margin-top: 15px;
	float: left;
	width: 140px;
	font:bold 0.8em Verdana,sans-serif;
	background:#597394;
	border:1px solid #2E4D74;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px
}

#mainmenu ul {
	list-style:none;
	margin:0;
	padding:0
}

#mainmenu li {
	margin:3px 3px 3px 0;
	padding:3px 3px 3px 3px;
	color:#ffffff;
	text-decoration:none;
	width:120px
}

#mainmenu li a {
	display:block;
	padding:3px 0px 3px 3px;
	/*
	border:1px solid #3da0ff;
	background:#3da0ff;
	*/
	color:#ffffff;
	text-decoration:none;
	width:120px
}
  
#mainmenu li a:hover {
	/*background:#FFFF00;*/
	background:#8D3066;
	/*color:#000000;*/	
	color:#ffffff
}

#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: #bd6b9c;
background: -moz-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #bd6b9c), color-stop(5%, #c27ca5), color-stop(19%, #d49fbf), color-stop(26%, #d49fbf), color-stop(34%, #c27ca5), color-stop(41%, #ad5689), color-stop(57%, #8d3066), color-stop(66%, #7a2155), color-stop(80%, #610b3d), color-stop(97%, #47012a), color-stop(100%, #47012a));
background: -webkit-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: -o-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: -ms-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: linear-gradient(to bottom, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);

    border-right: 1px solid #bbb;
}





/* Objectives and Important Notes box */
#objective {
    background: #ecf2ea;
    border:solid 1px #458032;
    padding: 0.25em 1em 1em 1em;
    margin: 2.5em;
    border-radius: 1em;
}



#objectivebanner {
	background-color:#458032;
	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: #82A638;
    border:solid 3px #458032;
    padding: 0.25em 1em 1em 1em;
    margin: 2.5em;
    border-radius: 1em;
}




/* Accordions */

.accordiongradient {
   background: rgba(97,134,179,1);
background: -moz-linear-gradient(top, rgba(97,134,179,1) 0%, rgba(135,172,217,1) 22%, rgba(47,78,117,1) 55%, rgba(21,50,86,1) 84%, rgba(21,50,86,1) 98%, rgba(21,50,86,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(97,134,179,1)), color-stop(22%, rgba(135,172,217,1)), color-stop(55%, rgba(47,78,117,1)), color-stop(84%, rgba(21,50,86,1)), color-stop(98%, rgba(21,50,86,1)), color-stop(100%, rgba(21,50,86,1)));
background: -webkit-linear-gradient(top, rgba(97,134,179,1) 0%, rgba(135,172,217,1) 22%, rgba(47,78,117,1) 55%, rgba(21,50,86,1) 84%, rgba(21,50,86,1) 98%, rgba(21,50,86,1) 100%);
background: -o-linear-gradient(top, rgba(97,134,179,1) 0%, rgba(135,172,217,1) 22%, rgba(47,78,117,1) 55%, rgba(21,50,86,1) 84%, rgba(21,50,86,1) 98%, rgba(21,50,86,1) 100%);
background: -ms-linear-gradient(top, rgba(97,134,179,1) 0%, rgba(135,172,217,1) 22%, rgba(47,78,117,1) 55%, rgba(21,50,86,1) 84%, rgba(21,50,86,1) 98%, rgba(21,50,86,1) 100%);
background: linear-gradient(to bottom, rgba(97,134,179,1) 0%, rgba(135,172,217,1) 22%, rgba(47,78,117,1) 55%, rgba(21,50,86,1) 84%, rgba(21,50,86,1) 98%, rgba(21,50,86,1) 100%);
    color: #ffffff;
    cursor: pointecr;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font: bold 0.9em Verdana,sans-serif;
    transition: 0.4s;
    border-radius: 1em;
}


.accordiongradient.active {
background: #bd6b9c;
background: -moz-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, #bd6b9c), color-stop(5%, #c27ca5), color-stop(19%, #d49fbf), color-stop(26%, #d49fbf), color-stop(34%, #c27ca5), color-stop(41%, #ad5689), color-stop(57%, #8d3066), color-stop(66%, #7a2155), color-stop(80%, #610b3d), color-stop(97%, #47012a), color-stop(100%, #47012a));
background: -webkit-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: -o-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: -ms-linear-gradient(top, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
background: linear-gradient(to bottom, #bd6b9c 0%, #c27ca5 5%, #d49fbf 19%, #d49fbf 26%, #c27ca5 34%, #ad5689 41%, #8d3066 57%, #7a2155 66%, #610b3d 80%, #47012a 97%, #47012a 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bd6b9c', endColorstr='#47012a', GradientType=0 );
/*border-top-right-radius: 1em;
border-top-left-radius: 1em;
border-bottom-right-radius: 0em;
border-bottom-left-radius: 0em;*/
}


.accordiongradient:hover {
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;

}




.accordiongradient:after {
    content: '\002B';
    color: #ffffff;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

.accordiongradient.active:after {
     content: "\2212";
}


/*For non-gradient accordions*/
.accordion {
    background: #4E6A8F; /* For browsers that do not support gradients */
    color: #ffffff;
    cursor: pointecr;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font: bold 0.9em Verdana,sans-serif;
    transition: 0.4s;
    border-radius: 1em;
}

.accordion.active {
    background-color: #8d3066;
}

.accordion:hover {
        background-color: #b0b0b0;
        color: #000000;

}



.accordion:after {
    content: '\002B';
    color: #ffffff;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

.accordion.active:after {
    content: "\2212";
}

.panel {
    padding: 0 18px;
    background-color: #f2f2f2;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
	border-right:1px solid !important;
    border-left:1px solid !important;
    border-bottom: 1px solid !important;
    border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
    /*width: 94.5%;*/
	margin: 0px 15px 0px 15px;
	position: relative;
}







/*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:#0000FF;
	
}


.smtooltip .smtooltiptext {
     visibility: hidden;
     background-color: #8d3066;
     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;
}