@charset "UTF-8";
/* CSS Document */

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

html, body {
	height:100%;
}

body {
	font-family: "Myriad Pro", Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	position: relative;
}


/*defining a height does not let your webpages naturally expand - DONT DO IT*/

#wrapper {
	width: 824px;
	margin: 0px auto; /*this the property that allows the page to be centered when viewed on web*/
}

p {
	padding-bottom: 15px;
}

h1 {
	font-size: 14px;
	padding-bottom: 15px;
}

h2 {
	font-size: 14px;
	padding-bottom: 30px;
	text-align: center;
	font-family: "Myriad Pro", Verdana, Arial, Helvetica, sans-serif;
	width: 450px;
	padding-left: 190px;
	padding-top: 30px;
}


#content ul {
	/*list-style: none;*/
	margin-left:10px;
}


#content {
	background-color: #a9cbcc;/*old color #9AC29A*/
	width:824px;
	padding-top:30px;
	line-height: 1.5em;	
}

#mod3image{
	margin-right: auto;
	margin-left: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	width: 658px;
}



#bodytext2 {
	margin-right: 32px;
	margin-left: 40px;	
	
}

/*title for quiz*/

p#title {
	font-size: 20px;
	text-align: center;
	margin-top: 30px;
	padding-top: 40px;
	font-weight: 300;
}

/*css identifying which module you are on*/

p#module {
	float: right;
	text-align: right;
	padding-top: 7px;
	padding-right: 63px;
	padding-bottom: 7px;
	padding-left: 7px;
	font-weight: bold;
}
p#quizlink {

}

p#quizlink a:link {
	color:#000000;
	
}

p#quizlink a:active{
	color:#000000;
	
}

p#quizlink a:visited{
	color:#000000;
	
}

p#quizlink a:hover{
	color:#666666;
	
}


p#next {
	float: right;
	text-align: right;
	padding-top: 7px;
	padding-right: 57px;
	padding-bottom: 7px;
	padding-left: 7px;
	font-size: 14px;
	text-decoration: underline;
	clear: both;
}	

p#next a:link {
	color:#000000;
	
}

p#next a:active{
	color:#000000;
	
}

p#next a:visited{
	color:#000000;
	
}

p#next a:hover{
	color:#666666;
	
}


#topnav {
	padding:8px 0px 5px 30px;
	text-decoration: none;      /*does this make the line on the link go away?-------no*/
	color:#000000;
}	

#topnav a:link {
	color:#000000;
	text-decoration: none;
}

#topnav a:active{
	color:#000000;
	text-decoration: none;
}

#topnav a:visited{
	color:#000000;
	text-decoration: none;
}

#topnav a:hover{
	color:#666666;
	text-decoration: none;
}

/* Topnav List Items
===============================================*/

#topnav li{
	display: inline; /*this is creating the vertical lines inbetween the navigation*/
	padding-right: 4px;   /*this gives space between the lines and words*/
	padding-left: 6px;	  /*this gives space between the lines and words*/
	border-right-width: .10em;
	border-right-style: solid;
	border-right-color: #999999;	
}

#topnav li.last{
	border-right:none;
	padding-right: 2px;
	
}	


#topnav li.lastsitemap{
	border-right:none;
	padding-right: 2px;
	font-weight: bold;
	
}	



ul#topnav li.selected-link{
	font-weight: bold;
}
/*site map css==============================================*/

ul#sitemap{
	font-size: 14px;
	line-height: 1.8em;
	text-decoration: underline;
	list-style-image: none;
	list-style-type: none;	
}

ul#sitemap a:link {
	color:#000000;
	text-decoration: none;
}

ul#sitemap a:active{
	color:#000000;
	text-decoration: none;
}

ul#sitemap a:visited{
	color:#000000;
	text-decoration: none;
}

ul#sitemap a:hover{
	color:#666666;
	text-decoration: none;
}	

/*By default, bullets are outside the <li> (to the left). In FF, the <li>s are moved to the right to display the bullets by a default left padding on the <ul>, whereas in IE the indent is done with margin on the <ul>, meaning the bullets are still to the left of the <ul> itself. Once you set a width to the <ul>, IE won't display any of the content that falls outside the <ul> - the bullets. To get consistancy with lists, you have to take control of both the margins and padding of the <ul> and adopt a common methiod of left padding to display the bullets : (see below, I can now use bullets in IE)
*/

ul#lists{
	width:376px;
	margin: 0;
	padding: 0 0 0 1.75em;
}





#module_id {
	margin: 0px;
	float: right;
	padding-top: 0px;
	padding-left: 0px;
	clear: both;
	padding-right: 0px;
	padding-bottom: 0px;
}


#mainimage {
	float:left;
	padding-bottom:20px;
	
}

#mainimage2 {
	float:left;
	padding-bottom:10px;
	
}

/*this is video/vine image*/

#mod2_image{
	float:left;
	padding-right: 40px;
}

	

/*this is a test for formatting 2nd paragraph

#2ndparagraph {
	float: right;
	width: 335px;
}*/

/*module featured on landing page links====================================================*/

#image-links {
	clear: both;
	margin-left: 45px;
	width: 824px;
}

#image-links img {
	margin-right: 10px;
}

/*above are module links====================================================*/


/*thumbnails on how page*/

#topthumb {
	padding-left: 50px;
	padding-right: 20px;
	padding-top: 10px;
}


#bottomthumb {
	padding-left: 50px;
	padding-right: 20px;
	padding-top: 10px;
}

/*this is for pages with all text*/

#alltext {
	margin-right: 40px;
	margin-left: 40px;
	
}	


#footer_image{
	float:right;
}

/*always put your footer div outside of your content div so it has the flexibility to be pushed down*/

#footer {
	font-size: 10px;
	text-align: center;
	clear: both;
	padding-bottom: 8px;
	background-color: #a9cbcc;
	padding-top: 12px;
}


.quizbackgrd {
	background-image:url(images/knowledge_bkgrd.jpg);
	background-repeat: no-repeat;
	height: 338px;
	clear: both;
	background-position: center;	
}

	

.quiz {
	font-size: 15px;
	text-align: center;
	margin-top: 35px;
	width: 448px;
	margin-left: 180px;
}

.quizanswer {
	font-size:15px;
	margin-top:25px;
	text-align: justify;
	margin-bottom: 50px;
	width: 448px;
	margin-left: 180px;
}	


.quiz_tf {
	font-size:15px;
	margin-top:25px;
	text-align: center;
	margin-bottom: 50px;
	
}	


.quiz_tf a:link {
	color:#000000;
	text-decoration: none;
}

.quiz_tf a:active{
	color:#000000;
	text-decoration: none;
}

.quiz_tf a:visited{
	color:#000000;
	text-decoration: none;
}

.quiz_tf a:hover{
	color:#666666;
	text-decoration: none;
}	



.left-column {
	width:376px;
	float:left;
	margin-left:40px;
	font-size: 16px;
	font-size: 16px;
	margin-left: 40px;
	font-size: 12px;
	color: #000000;
}



.left-column2 {
	width:500px;
	float:left;
	margin-left:40px;
}


.right-column
{
	width:366px;
	float:left;
	margin-left:10px;
}

.right-column_sl
{
	width:350px;
	float:left;
	margin-right:32px;
	margin-left: 10px;
}
	

.fullpage{
	margin-left: 40px;
	margin-right: 32px;
}

.stray {
	margin-left: 376px;
	margin-top: -12px;
	clear: both;
}




/*this is used to clear the floats on the left and right columns so that the background and footer views properly*/
.clear
{
	clear:both;	

}


.mod3image{
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	
}


.thumbset
{
	margin-top: 7px;/*centers div box*/
	margin-right: auto;/*centers div box*/
	margin-bottom: 0;/*centers div box*/
	margin-left: auto;
	width: 317px;
	clear: right;
}

.thumb
{
	width:145px;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	clear: right;
	height: 123px;
	float: left;
}
/*++++++++++++++++++++++++++++++++++++++++++for pna page*/
.pnathumb
{
	width:155px;
	height:200px;
	float:left;
	margin-top: 10px;
	margin-right: 20px;
	margin-bottom: 30px;
	margin-left: 20px;
}

.pnathumbset
{
	margin-top: 20px;/*centers div box*/
	margin-right: auto;/*centers div box*/
	margin-bottom: 20px;/*centers div box*/
	margin-left: auto;
	width: 600px;
	height: 210px;
}

.caption

{
	font-weight: bold;
	font-size: 11px;
}




.caption a:link {
	color:#000000;
	text-decoration: none;
}

.caption a:active{
	color:#000000;
	text-decoration: none;
}

.caption a:visited{
	color:#000000;
	text-decoration: none;
}

.caption a:hover{
	color:#666666;
	text-decoration: none;
}

img /*if you add a link or <a> element to an image it automatically adds a border and you must use this css property to clear border*/ 
{
border:none


}

.researchlink {
	font-weight: bold;
	text-decoration: underline;
	text-align: center;
	margin-right: 30px;
}

.researchlink a:link {
	color:#000000;
	text-decoration: underline;
}

.researchlink a:active{
	color:#000000;
	text-decoration: underline;
}

.researchlink a:visited{
	color:#000000;
	text-decoration: underline;
}

.researchlink a:hover{
	color:#666666;
	text-decoration: underline;
}

.researchsupports{
	clear: both;
	margin-right: 0px;
	margin-left: 40px;
	width: 752px;
}

/*this is for the small footnote nummbers*/

.footnoteslink a:link {
	color:#000000;
	text-decoration: none;
}

.footnoteslink a:active{
	color:#000000;
	text-decoration: none;
}

.footnoteslink a:visited{
	color:#000000;
	text-decoration: none;
}

.footnoteslink a:hover{
	color:#666666;
	text-decoration: none;
}



/*this stylizes the links on the references page*/

.references a:link { 
	color:#000000;
	text-decoration: underline;
}

.references a:active{
	color:#000000;
	text-decoration: underline;
}

.references a:visited{
	color:#000000;
	text-decoration: underline;
}

.references a:hover{
	color:#666666;
	text-decoration: underline;
}