/* CORE STRUCTURE */

*{margin: 0; padding: 0; line-height: 1.2;}

#content_main { 
width: auto;
padding: 6px;
}

body {
background-color:#ffffff;
color: #000000;
text-align: center;
background-image:url(../backgrd.jpg);
background-position:top;
background-attachment:fixed;
background-repeat:repeat-x;
font-family: verdana, arial, sans-serif; 
width: 100%;
font-size: 100%;;
}


#container {
width: 900px;
margin-left:auto;
margin-right:auto;
text-align: left;
background-color:#ffffff;
}

#content {position:relative; 
width: 650px;
float: left;
margin-right: 15px;

}

#right_bar {width:200px;
float: right;
text-align:right;
padding:0;
margin:0;
}


#logo {
background-image:url(../pix/logo_200.gif);
background-repeat:no-repeat;
margin:  0;
padding: 0;
}

#logo_print {
display:none;
}


/* MAIN CONTENT */

/* general links */

a:link {
color: #336699;
text-decoration:underline;
padding: 0;
margin: 0;
}

a:visited {
color: #333333;
text-decoration:underline;
padding: 0;
margin: 0;
}

a:hover{
color: #cc0000;
text-decoration: underline;
background-color: #ccd9e5;
padding: 0;
margin: 0;
}

a:active{
color:  #cc0000;
text-decoration: underline;
background-color: #ccd9e5;
font-weight: normal;
padding: 0;
margin: 0;
}

/* MAIN CONTENT TEXT */

.noshow {
display:none;
}

.red {
color: #cc0000;
}

.green {
color: #00af9c;
font-size: 140%;
}

.purple {
color: #691f7e;
}

.purple_large {
color: #691f7e;
font-size: 140%;
}

.orange {
color: #f5822b;
}

.blue {
color: #336699;
}

.highlight {
background-color: #ffffcc;
padding: 2px 0 2px 0;
margin: 0;
}

#clearfloats {clear:both;}

.hangingindent {float:left;
margin-right: 8px;}

p {
float: left;
width: 85%;
font-size: 1.2em;
padding: 0 0 1.8em 2em; 
letter-spacing:normal;
line-height: 1.4em;
}

h1.header {
margin: 15px 0 0 0;
clear: left;
}

h2 {
float: left;
font-size: 1.2em;
padding: 0 0 0 2em; 
letter-spacing:normal;
line-height: 1.4em;
color: #691f7e;
}

.footer a:hover { 
color: #ffffff;
text-decoration: underline;
background-color: #ccd9e5;
padding: 0;
margin: 0;
}

img {
padding: 0 0 0 6px;
margin: 0;
}

img.none {
padding: 0;
margin:0;
}

img.logos {
padding: 0;
margin: 2em 0 1em 0;
}


ul {
list-style-type: circle;
font-size: 1em;
padding: 0 0 0em 2.5em; 
letter-spacing:normal;
line-height: 1em;
}

li {
letter-spacing:normal;
line-height: 1.8em;
}

ul.device {
list-style-type: none;
margin: 0 0 0 0;
float: left;
width: 85%;
font-size: 1.2em;
padding: 0 0 1.8em 2em; 
letter-spacing:normal;
line-height: 1.4em;
}

li.pink {
background-image: url(../pix/device_pink_25.gif); 
background-repeat: no-repeat;
background-position: 0 50%;
margin: 0 0 0 0;
padding: .6em 0 .6em 3em;
color:#000000;
letter-spacing:normal;
line-height: 1.4em;
}

li.blue {
background-image: url(../pix/device_blue_pale_15.gif); 
background-repeat: no-repeat;
background-position: 0 50%;
margin: 0 0 0 0;
padding: .6em 0 .6em 2.2em;
color:#000000;
letter-spacing:normal;
line-height: 1.4em;
}

/* different vertical spacing */
li.blue2 {
background-image: url(../pix/device_blue_pale_15.gif); 
background-repeat: no-repeat;
background-position: 0 11px;
margin: 0 0 0 0;
padding: .6em 0 .6em 2.2em;
color:#000000;
letter-spacing:normal;
line-height: 1.4em;
}

.q {
float: left;
font-size: 1.6em;
padding: 0 0 0 1em; 
color: #691f7e;
font-weight: bold;
clear:both;
}

.a {
float: left;
font-size: 1.6em;
padding: 0 0 1.8em 1em; 
color: #336699;
font-weight: bold;
clear:both;
}

/* MAIN CONTENT  QUIZ*/
.number {
float: left;
font-size: 1.6em;
padding: 0 0 1.8em 1em; 
color: #7094b7;
font-weight: bold;
}

.question {
float: left;
width: 65%;
font-size: 1.2em;
padding: 0 0 1.8em 1em; 
letter-spacing:normal
}

#answer{
float: right;
text-align:right;
width: 25%;
}

#answer a:hover.quiztrue, a:link.quiztrue, a:visited.quiztrue {
float: right;
display: block;
color: #69177e;
font-size: 1.2em;
font-weight: bold;
text-align:center;
text-decoration:none;
margin: 0px;
}

#answer a:hover.quizfalse, a:link.quizfalse, a:visited.quizfalse{
float: right;
display: block;
color:#336699;
font-size: 1.2em;
font-weight: bold;
text-align: center;
text-decoration:none;
margin: 0px;
}

#answer a:hover.quiztrue, #answer a:hover.quizfalse {
float: right;
display: block;
color: #cc0000;
font-size: 1.2em;
font-weight: bold;
text-align:center;
text-decoration:none;
margin: 0px;
}

#answer a:active.quiztrue, #answer a:active.quizfalse {
float: right;
display: block;
color: #cc0000;
font-size: 1.2em;
font-weight: bold;
text-align:center;
text-decoration:none;
margin: 0px;
}


/* ANSWER PAGE */
#content_answer {
background-color:#FFFFFF;
text-align:left; 
width: 100%;
padding: 0px;
margin: 0px;
background-image: url(../pix/bkg_green_device.gif);  
background-repeat: no-repeat;
background-position:right top; 
}

p.answer{
float: left;
width: 500px;
font-size: 1.2em;
padding: 0 0 1.8em 2em; 
letter-spacing:normal;
line-height: 1.4em;
clear:left;
}

#stripe_answer {
background-image:url(../pix/stripe.jpg);
background-color: #ccd9e5;
height: 28px;
margin: 0 ;
background-position: top right;
background-repeat: repeat-y;
}

#footer_answer {
width: 100%;
clear: both; 
left: 0;
}


/* FOOTER */
#footer {width: 100%;
background-color:#FFFFFF;
clear: both; 
}

#footer_left {width: 650px;
float: left; 
background-color:#FFFFFF;
}

#footer_right {
width: 250px;
float: right;
background-color:#ffffff;
text-align: right;
margin-top: 0px;
}

#footer_text  {
margin-top:0em;
background-color:#ffffff;
color: #336699;
text-align: right;
font-family: verdana, arial, sans-serif; 
font-size: 100%;
clear:both}
/* end of footer */





/* NAVIGATION */

/* right hand navigation */
.perf{
border-right:solid 25px #00af9c;
}

.pract {
border-right:solid 25px #691f7e;
}

.teach{
border-right:solid 25px #ffcc00;
}

.supp{
border-right:solid 25px #f5822b;
}
.bapam{
border-right:solid 25px #336699;
}


.home{
border-right:solid 25px #ee519e;
}

#nav {
font-weight: normal;
text-align: left; 
padding:0;
margin:0;
background-color: #ffffff;
width: 100%;
}

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

#nav li a {
display:block;
font-size: 1.2em;
color:#336699;
margin-bottom: 2em;  
margin-top: 1em; 
padding: 6px;
letter-spacing: normal;
text-decoration: none;
background-color: #ccd9e5;
}

.nav_block {
display:block;
font-size: 1.2em;
color:#336699;
margin-bottom: 1em;  
margin-top: 1em; 
padding: 6px 0px 6px 6px;
letter-spacing: normal;
text-decoration: none;
background-color: #ccd9e5;
width: 98%;
float: left;
text-align: left;
}

#nav li a:link {
display:block;
font-size: 1.2em;
color:#336699;
margin-bottom: 2em;  
margin-top: 0.3em;
padding: 6px;
letter-spacing: normal;
text-decoration: none;
background-color: #ccd9e5;
}

#nav li a:visited {
display:block;
font-size: 1.2em;
color:#336699;
margin-bottom:2em;  
margin-top: 0.3em;
padding: 6px;
letter-spacing:.05em;
text-decoration: none;
background-color: #ccd9e5;
}

#nav li a:hover {
display:block;
font-size: 1.2em;
font-weight: bold;
color:#ffffff;
margin-bottom: 2em;  
margin-top: 0.3em;
padding: 6px;
letter-spacing: normal;
text-decoration: none;
background-color: #336699;
}

#nav li a:active {
display:block;
font-size: 1.2em;
font-weight: bold;
color:#ffffff;
margin-bottom: 2em;  
margin-top: 0.3em;
padding: 6px;
letter-spacing: normal;
text-decoration: none;
background-color: #336699;
}

/*selected*/

#nav li a.selected {
	display:block;
	font-size: 1.2em;
	font-weight:bold;
	margin-bottom: 0.1em;
	margin-top: 0.3em;
	padding: 6px;
	letter-spacing:0.05em;
	text-decoration: none;
	background-color: #336699;
	color: #ffffff;
}

/* sub menu sytle */
#nav ul ul {
margin: 0; 
font-size: 1em;
text-decoration: none;
text-align: right;
padding:  0;
background-color: #ffffff;
border: 0;
letter-spacing: normal;
}

#nav ul ul li {
margin: 0; 
text-align: left;
padding: 0.1em 0 0.1em 0;
background-color: #ffffff;
border: 0;
font-size: 1em;
letter-spacing: normal;
}

#nav ul ul li a:link {
color:#336699;
margin: 0px;
padding: 0.1em 0 0.1em 0;
background-color: #ffffff;
border: 0;
font-size: 1em;
letter-spacing: normal;
}

#nav ul ul li a:visited {
color:#336699;
margin: 0px;
padding: 0.1em 0 0.1em 0;
background-color: #ffffff;
border: 0;
font-size: 1em;
letter-spacing: normal;
}

#nav ul ul li a:hover{
color:#cc0000;
margin:0;
padding: 0.1em 0 0.1em 0;
background-color: #eaeff5;
border: 0;
font-size: 1em;
letter-spacing: normal;
}

#nav ul ul li a.selected{
color:#cc0000;
margin:0;
padding: 0.1em 0 0.1em 0;
background-color: #ffffff;
font-weight: normal;
font-size: 1em;
border: 0;
letter-spacing: normal;
}
/* end of right hand navigation */
/* navigation 2 */
.nav_2 {
font-size: 1em;
color: #336699;
text-decoration:none;
font-weight: bold;
margin: 0;
width: auto;
border: 0;
}

.nav_2 a:link {
color: #336699;
text-decoration:none;
font-weight: bold;
padding: 3px;
}

.nav_2 a:visited {
color: #336699;
text-decoration:none;
font-weight: bold;
padding: 3px;
}

.nav_2 a:hover{
color: #cc0000;
text-decoration: none;
background-color: #ccd9e5;
font-weight: bold;
padding: 3px;
}

.nav_2 a:active{
color: #cc0000;
text-decoration: none;
background-color: #ccd9e5;
font-weight: bold;
padding: 3px;
}

.nav_2 a.selected{
color: #cc0000;
text-decoration: none;
background-color: #ffffff;
font-weight: bold;
}

#nav_2_left {
display:none; 
}

/*#nav_2_left {
text-align: left;
float: left;
margin-left: 6px;
}*/

#nav_2_right {
text-align: right;
float: right;
}

#nav_2_right a:link{
color: #336699;
text-decoration: none;
font-weight: normal;
}

#nav_2_right a:visited{
color: #336699;
text-decoration: none;
font-weight: normal;
}

#nav_2_right a:hover{
color: #cc0000;
text-decoration: none;
background-color: #ccd9e5;
font-weight: normal;
}

#nav_2_right a:active{
color: #cc0000;
text-decoration: none;
background-color: #ccd9e5;
font-weight: bold;
}

#nav_2_right a.selected{
color: #cc0000;
text-decoration: none;
background-color: #ffffff;
font-weight: bold;
}


/* content panel within content div */
#top {
width: 100%;
margin: 18px 0px 0px 0px;
padding: 0px;
}

#photos {
margin: 0;
padding: 0;
text-align:right;
}

.stripe {
display:block;
	background-image:url(../pix/stripe.jpg);
	background-color: #ccd9e5;
	height: 25px;
	margin:4px 0 4px 0;
	background-position: top right;
	background-repeat: repeat-y;
}


/* POP UP IMAGES */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #eaeff5;
padding: 10px;
left: -1000px;
border: 1px solid #00af9c;
visibility: hidden;
color: black;
text-decoration: none;
text-align: left;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding-bottom: 4px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
position:fixed; /*  <--added for Firefox/Mozilla*/
visibility: visible;
top: 86px;
left: 0px; /*position where enlarged image should offset horizontally */
width: 260px;
height: 500px;
text-decoration:none;
}


/* END OF POP UP IMAGES */


/*START of yellow / blue rollover boxes on home page EDITED FOR LARGER*/


td.nav:hover {

background-image:none;
background-repeat:no-repeat;

text-decoration:none;}



td.nav {


background-image:none;

background-repeat:no-repeat;

text-decoration:none;}



.itemheader {

display: block;

text-align: left;

width: 325px;

height: 55px;

color: #336699;

font-family: verdana, arial, sans-serif; 

font-weight: bold;

font-size: 1.4em;

padding: 0px 0 0px 0;

margin:  0 0px  0 0;

text-decoration:none;

/*border: solid 1px;*/

}






.itemheader a:link {

display: block;

color: #336699;

border-bottom: solid 1px #7094b7;

text-decoration:none;

}





.itemheader a:visited {

display: block;

color: #336699;

border-bottom: solid 1px #7094b7;

text-decoration:none;

}



.itemheader a:hover{

display: block;

color: #ffffff;

border-bottom: solid 1px #ffffff;

text-decoration:none;

background-color: #336699;

padding:  0px;

margin:0;





}



.itemheader a:active{

display: block;

color: #ffffff;

border-bottom: solid 1px #ffffff;

text-decoration:none;

background-color: #336699;

}









.itemtext {

height: 100px;

display: block;

text-align: left;

color: #333333;

font-family: verdana, arial, sans-serif; 

font-size: 1.1em;

line-height:1.1;

padding: 0px 0px 0px 0px;

margin: 4px 12px 0px 8px;

text-decoration:none;



}


/*end of yellow / blue rollover boxes on home page*/