*{
   margin:0px;
   padding:0px;
}

body{
background:gray;
}

h2{
	color:blue;
	
}

img{
	max-width:98%;
	
}

hr{
    border: 0;
    height: 1px;
    background: #333;
    background-image: linear-gradient(to right, #ccc, #333, #ccc);
}

ul{
list-style:none;
}
a{
text-decoration:none;
}

a:link, a:visited {
    color: blue;
}

p{max-width:98%;}

p{
	margin-bottom:11px;
	
}



.horizontaldivswitch{


   display:-webkit-box;
   display:-moz-box;
   display: box;
   -webkit-box-orient: horizontal;
   -webkit-box-flex: 1;
   -moz-box-orient:horizontal;
   -moz-box-flex: 1;   
   padding-top: 20px;
     display: -ms-flexbox;
  -ms-flex-direction: row;



}

.onethird{
width:30%;
margin-bottom:20px;
margin-right:1%;
}



.blueback{
background:rgb(50,50,220);
padding: 3px;

color:white;
width:100%;

}

.morecontent p{
margin-bottom: 10px;
}

.morecontent h1{
color:blue;
}

.morecontent blockquote{
margin-left:25px;
}

.full{
background:blue;
color:white;
padding: 3px;
margin:6px;
}

.date{

color: red;
width:100px;
margin-left:50px;


}

#feather{
	width:150px;
	border:3px solid blue;
	
}


.ia {width:150px;border:2px #23238E solid;float:right;margin:0 0 10px 15px;padding:0;}
.ia h3 {text-align:center;color:white;background-color:#23238E;margin:0;font-size:10pt;font-weight:bold;padding-bottom:3px;}
.ia ul {padding:5px;margin:0 0 0 14px;}
.ia ul li {padding-bottom:3px;}
.ia a:hover {color:black;}



.l{
	font-weight:bold;
	
}


.signer h1 {font:bold 14pt arial,sans-serif;color:#213994;margin:0;}
.signer p.date {font:italic 10pt arial,sans-serif;margin:0;}
.signer p.what  {font:10pt arial,sans-serif;margin:0 0 15px;}
.sources {font:8pt arial,sans-serif;clear:both;border-top:1px gray solid;padding-top:4px;}
table.signerinfo {font:10pt arial,sans-serif;margin-bottom:15px;}
table.signerinfo td {vertical-align:top;}
table.signerinfo td.l {text-align:right;font-weight:bold;padding-right: 10px;}

.picl .credit, .picr .credit, .picc .credit {font:italic 7pt arial,sans-serif;text-align:right;margin-bottom:10px;margin-right:9px;}



.lessonplan .bbt {border-collapse:collapse;font:11pt/15pt arial,sans-serif;}
.lessonplan .bbt th {border:1px black solid;background-color:#eee;font-weight:bold;text-align:center;vertical-align: top;}
.lessonplan .bbt td {border:1px black solid;padding:2px 4px;vertical-align: top;}
.lessonplan .bbt td.r1 {padding:2px 4px;text-align:left;}
.lessonplan .bbt td.r2 {padding:2px 4px;text-align:left;}

.keyq {max-width:440px;clear:both; background: #1265AE; padding:40px 40px 10px 70px; color: white; font: bold 11pt arial,sans-serif; margin-bottom:20px; }

.keyq ol{
	margin-top:20px;
	
}

.lessonplan .keyq.bottom {margin-top:30px;}
.lessonplan .keyq li {padding-top:6px; padding-bottom:6px;margin-left:40px;}


.lessonplan .littledoit {clear:both; padding:50px 10px 10px; background: white url(../lessonplan/images/youdoit.gif) no-repeat; margin:10px 0; color: black; font: bold 14pt arial,sans-serif; text-align:left; position: relative;}
.lessonplan .littledoit .ld2  {font: bold 12pt arial,sans-serif;}
.lessonplan .littledoit .doitshow {border:1px black solid; padding:5px; background: white; font: 11pt georgia, serif;}

.littledoit p{
	
	max-width:470px;
	margin-top:40px;
}

.ya{
	
	display:none;
}


.keyqimage{

max-width:260px;
}

.event{
width:70%;

}

.lessonplan h1{
	
	color:blue;
}
 .projectbox {clear:both; max-width:500px;padding:90px 10px 10px; background: #8FEDF8; margin:10px 0 30px; color: black; text-align:left; position: relative;margin-top:-25px;}

.projectbox ul{
	list-style-type:disc;
	margin-left:22px;
	
}

.projectbox ol{

	margin-left:22px;
	
}

.challenge{
	margin-top:-60px;
	
}

.lessonplan .intelligence {font:bold 9pt arial,sans-serif; position: absolute; top:47px; left:300px; color:white;}


.bannerwide{
	
	width:595px; 
	margin:0 auto;
}


.statetable{
	
	width: 140px;
	min-width: 140px;

	
}


.doi160{
	display:none;
	
}




/*  the above is a section inviting visitors to take a survey, but the survey appears to be defunct so I am hiding it. 
I actually removed it from many of the pages but it's easier to just hide the rest and remove them as we come across them

 */

 img{max-width:100%!important}
 
 
#big_wrap{
width:100%;
margin:0 auto;
max-width:1150px;
background:white;
border:2px solid black;
}

#leftside{
width:130px;
min-width:130px;
background:rgb(10,25,170);
padding:5px;
}

#main_content{
background:white;
width:calc(100%-310px);
margin:10px;

width:100%;
font-size:1.2em;
}

#rightside{
background:white;
width:180px;
min-width:180px;
}


#leftnav li a{

color:inherit;
color:white;

}

#leftnav li a:hover{
color:red;
}

#menu{display:none;
text-align:center;


}

#mobilenav{
border:3px solid red;

background:blue;
font-size:22px;
color:white;

}

#mobilenav a{
color:white;
}



#mobilenav li{
padding-left:7px;
}
#mobnavlist .selectedm{
color:red;
}
#mobnavlist li a:hover{color:red;}

.hfb{

   display:-webkit-box;
   display:-moz-box;
   display: box;
   -webkit-box-orient:horizontal;
   -webkit-box-flex: 1;
   -moz-box-orient:horizontal;
   -moz-box-flex: 1;   
        display: flex;
		flex-direction:row;

}


.


table {font:10pt arial,sans-serif;}
table td {vertical-align:top;}
table.info {margin-bottom:5px;}
table.info td {font:bold 10pt arial,sans-serif;text-align:right;}
table.info td.j {font:10pt arial,sans-serif;padding-left:10px;text-align:left;}
table.info2 {font:10pt arial,sans-serif;margin-bottom:5px;}
table.info2 td {vertical-align:top;font:bold 10pt arial,sans-serif;text-align:left;padding-bottom:10px;}
table.info2 td.j {font:10pt arial,sans-serif;padding-left:20px;text-align:left;}



.backnext {font:bold 7pt verdana,sans-serif; max-width:400px; text-align: center; margin-bottom:12px; color: black;}
.backnext a {text-decoration: none; border: 1px gray solid; padding:4px; color: white; background: #C3944C; border:1px black solid;}
.backnext a:hover {background: #0C1319; border-color:#C3944C; }



.toc {text-align:center;font:bold 8pt verdana,sans-serif;min-width:250px; max-width:350px; margin:20px;}
.toc .hotlesson {color: white; text-decoration: none; background: #AA4418; margin:1px 0px 1px 10px; border:1px black solid; padding:3px 3px; text-align:center;font:bold 7pt verdana,sans-serif;}
.toc a.lesson {color: white; text-decoration: none; background: #115876; display:block; margin:1px 0px 1px  10px; border:1px black solid; padding:3px 3px; font:bold 7pt verdana,sans-serif;}
 .toc a.lesson:hover {border-color: white;font:bold 7pt verdana,sans-serif; background:#20A6DF}

.toc div.lessontitle {background:#AA4418;  padding:5px; color:white; border:1px black solid; margin-top:1px;}
 .toc a.lessontitle {display:block; text-align:center; border:1px black solid; padding:5px; text-decoration:none; color:white; background:#1C8098; margin-top:1px;}
 .toc a.lessontitle:hover {border-color:white;background:#20A6DF;} 
.toc a.projecttitle {display:block; text-align:center; border:1px black solid; padding:5px; text-decoration:none; color:white; background:#4B4410; margin-top:1px;}
.toc a.projecttitle:hover {border-color:white;background:#20A6DF;} 
.toc div.projecttitle {text-align:center; border:1px black solid; padding:5px; color:white; background:#AA4418; margin-top:1px;}




.picl{
float:left;
margin-right:10px;
	font-size:.8em;
	text-align:center;
}
.picr{
float:right;
margin-left:9px;
	font-size:.8em;
	text-align:center;
}



.hordot li{
	
	display: inline;

}


.prevnext{
	
width:100%;
font:bold 8.5pt arial,sans-serif;
border-top:1px black solid;
border-bottom:1px solid black;
padding-top:15px;
padding-bottom:15px;
margin-bottom:5px;
}

.selected{color:red;
}



.center{
margin:0 auto;
text-align:center;
}

.small{
font-size:11px;
}


.storeihabutton{
background:rgb(186,50,50);
padding:15px;
padding-top:0px;
text-align:center;
height:190px;
margin-bottom:15px;
margin-bottom:15px;
}


.storeihabutton h1{
	
	margin:1px;
}


.content{
padding:5px;
}

.interads{display:none}

.advert{
height:600px;
margin-bottom:7px;

}

.signerheaderdiv h2{
	color:blue;
max-width:90%;
	
	
	
	
}

.signerheaderdiv h4{
	max-width:70%;

}

.showmed{
display:none;
}

.selectedm{
color:red;
}

.comment{
	
	margin:10px 0;
}

.chead{
	
	background:blue;
	color:white;
	padding: 3px;
	text-align:center;
}

.cbody{
	
	background:#EDF1FC;
	border:1px solid blue;
	margin-bottom:8px;
	padding:5px;
}
.caption{
	font-size:.8em;
	text-align:center;
	
}
#maincontent p{
margin-bottom:10px;
}

#wheninthecourse{
    font-family: "Times New Roman", Times, serif;
	margin-bottom:10px;
}

.comment2 {border:2px #3D64CB solid;margin:10px 0;background-color:#EDF1FC;padding:4px 10px;font:7.5pt verdana,sans-serif;}


.pageeffect{
	padding:8px;
	width:348px;
	background:url(../images/tornpaper/pageyellow.gif);
	margin-bottom:-4px;
	border-right:2px solid rgb(200,200,200);
	border-left:1px solid rgb(230,230,230);
}

.paperdiv{
	
	width:357px;
	margin:0 auto;
}

/*********page-specific styleing*******************/

.ds li{padding-top:5px;padding-bottom:5px;margin-left:40px;}

.lessonindex{
	
	border: 1px solid black;
	padding:5px;
	
}

.titl{
	
	text-align:center;
	margin-bottom:11px;
}
.timeline th{
background-color:blue;
color:white;
text-align:left;
margin-top:50px;
}
.decl {
max-width:750px; 
margin-top:8px;
padding:7px 15px; 
border:2px black solid;
 background-color:#cdcdcd;
 font:20pt times,serif;
text-align:left;}




.decl p{
margin-bottom:10px;
}

#decheader{
color:red;
font-size:25px;
font-weight:bold;

}

.hidetiny{
	display:none;
	
}

.show550{
			display:none
	
}

.quart{
	width:25%;
	
}

/*********social media********/


#socialmed{
	
	max-width:100%
}

#twitterdiv{margin-right:80px;margin-left:50px}

#fbdiv{max-width:300px; color:white; padding:14px;}

#gplusdiv{}





/************/

#footer{
	background:rgb(210,210,222);
	color:black;
	padding:10px;
	max-width:100%;
	padding-bottom:90px;

	
}






/*********page-specific styling*******************/

@media only screen and (max-width:1100px) {

	.quickflip{
	-webkit-box-orient:vertical;

   -moz-box-orient:vertical;

		flex-direction:column;
		
	}

	
	#feather{margin:0 auto;}
	
	
	
	}

	
@media only screen and (orientation:portrait){
	
	.hideportrait{
		
		display:none;
	}
	
		.showportrait{
		
		display:block;
	}
}
		
@media only screen and (orientation:landscape){
	

		.hidelandscape{
		
		display:none;
	}
	
		.showlandscape{
		
		display:block;
	}
	
}		

	
@media only screen and (max-width:550px) {

.lessonplan .keyq li {margin-left:0px;}
	
	.hide550{
		
		display:none
	}
	
	.show550{
		
		display:block;
	}	
	
	
	
	}
	
	



@media only screen and (max-width:950px) {
.hidemed{
display:none;
}

.showmed{
display:block;
}



}

@media only screen and (max-width:800px) {
	
	


	
	
	.keyq{
		

	}
	
	
	.keyqsmall{
		display: block;
		
	}
.date{
		
margin-left:0px;	
		
}


.horizontaldivswitch{

   display:-webkit-box;
   display:-moz-box;
   display: box;
   -webkit-box-orient:vertical;
   -webkit-box-flex: 1;
   -moz-box-orient:vertical;
   -moz-box-flex: 1;   
        display: flex;
		flex-direction:column;


}

.onethird{
width:100%;
}

#menu{
display:inline;

}


.interads{
display:block;


margin:0 auto;

text-align:center;
margin-bottom:10px;
margin-top:10px;


}

#big_wrap{width:100%}



#leftside{
display:none;
}
#rightside{
display:none;
}




.hidesmall{display:none}
.showsmall{display:block}
}

@media only screen and (max-width:500px) {

.imagesmall{
	
	width:100%;
}
	
}
@media only screen and (max-width:767px) {
	
	.responsive{width:100%!important;}
	
	
		.flip{

   -webkit-box-orient:vertical;
   -webkit-box-flex: 1;
   -moz-box-orient:vertical;
   -moz-box-flex: 1;   
        display: flex;
		flex-direction:column;


		
		
	}
	
	
}



@media only screen and (min-width:768px){
	
	footer{min-height:300px;}
}


@media only screen and (min-width:801px) {

#mobilenav{
display:none;
}

.showsmall{display:none}
.hidesmall{display:block}

}