@charset "ISO-8859-1";

/*
+ removed old glossary styling, revised styling for remember, boaters tip and info boxes (SS) 11-18-09
+ added new tooltip styling with rounded corners (SS) 11-09-2009
+ added container_media for video content (SS) 11-06-09
+ added tooltip class (SS) 10-30-09*/

body {
	background-image: url(/images/pg_elmnts/back.jpg);
	background-repeat: repeat;
	width: 676px;
	margin: auto;}

.flash {
	margin-bottom: 10px;
	width: 654px;
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	color: #000000;
	border: 1px solid #000000;
	background-color: #FFFF99;
	padding: 10px;
	text-align: center;
	vertical-align: top;
}

#navbar {
	margin-bottom: 10px;
	width: 676px;}	
	
	
/* font-family and size were added to be part of the following class  - ss*/
	
a.navbtn:link,a.navbtn:visited,a.navbtn:hover,a.navbtn:active {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 11px;
	color: #000000;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;}

#reg td {
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 12px;
	color: #000000}

#reg p {
	font-size: 12px;
}

#reg label {
	float: left;
	width: 25%;
	text-align: right;
	font-weight: bold;
	margin-right: 10px;
}

.outline {
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 14px;
	margin: 0px 0 0 10px;
	color: #000000;
}

.err {
	color: #FF0000;
	margin-top: 2px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	font-size: 11px;
}

.button_01    {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 11px;
	color: #000000;
	background-image: url(/images/pg_elmnts/nav_back_01.gif);
	background-repeat: repeat-x;
	text-align: center;
	height: 27px;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
	vertical-align: middle;}
	
.button_02    {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 11px;
	color: #000000;
	background-image: url(/images/pg_elmnts/nav_back_02.gif);
	background-repeat: repeat-x;
	text-align: center;
	height: 27px;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
	vertical-align: middle;}

.login_logout    {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	height: 27px;
	margin: 0px;
	padding: 0px;
	vertical-align: middle;}
	
.student    {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
/*	background-color: #FFFFFF; */
	color: #CC0000;
	text-align: center;
	height: 27px;
	margin: 0px;
	padding: 0px;
	vertical-align: middle;}

.logout_msg    {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	color: #000;
	text-align: center;
	height: 27px;
	margin: 0px;
	padding: 5px;
	vertical-align: middle;
	border: solid 1px black;
	background-color: white;
}
		
.logout_name    {
	font-family: "Helvetica Neue", Arial, sans-serif;
	background-color: black;
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
	text-align: center;
	height: 27px;
	margin: 0px;
	padding: 5px;
	vertical-align: middle;
	border: solid 1px black;
}
		
#left_col {
	margin-bottom: 10px;
	float: left;
	margin-right: 14px;
	width: 400px;}

#right_col {
	margin-bottom: 10px;
	float: left;
	width: 262px;}
	
	
#top_row {
	margin-bottom: 10px;
	width: 676px;
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	background-color: #FFFFFF;
	color: #000000;
	text-align: center;
	vertical-align: middle;
	
}
	
#bottom_row {
	margin-bottom: 10px;
	width: 676px;
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 10px;
	color: #000000;}
	

.box {
	border: 1px solid #000000;
	background-color: #FFFFFF;
	padding: 10px;
	text-align: left;
	vertical-align: top;
	min-height: 200px;
	height: auto !important;
	height: 200px;
}

.homebox {
	border: 1px solid #000000;
	background-color: #FFFFFF;
	padding: 10px;
	text-align: left;
	vertical-align: top;
	min-height: 600px;
	height: auto !important;
	height: 600px;
}
	

.box a:link, a:visited, a:active {
	color: #cc0000;
	text-decoration: none;
}


.homebox a:link,a:visited,a:hover,a:active {
	color: #CC0000;
	text-decoration: none;
}

.box td {
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 12px;
	color: #000000}

.flash a:link,a:visited,a:hover,a:active {
	color: #CC0000;
	text-decoration: none;
}

.section_index {
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 14px;
	color: #000000;
	margin-left: 20px;
}

.incomplete {
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 14px;
	color: #646464;
}

#prev_text {
	float: left;
	font-size: 12px;
	margin-left: 25px;
	border: 1px solid black;
	background-color: black;
	color: white;
	font-weight: bold;
	padding: 7px;
	margin-top: 10px;
	text-align: left;
}

#next_text {
	float: right;
	font-size: 12px;
	margin-right: 25px;
	border: 1px solid black;
	background-color: black;
	color: white;
	font-weight: bold;
	padding: 7px;
	margin-top: 10px;
	text-align: right;
}

#middle_text {
	float: right;
	font-size: 12px;
	margin-right: 10px;
	border: 1px solid black;
	background-color: black;
	color: white;
	font-weight: bold;
	padding: 7px;
	margin-top: 10px;
	text-align: middle;
}
#score {
	margin-top: 20px;
	margin-bottom: 20px;
}

.hand {
	cursor: hand;
}

.pass {
	font-size: 18px;
	margin-right: 0px;
	border: 1px solid green;
	background-color: white;
	font-weight: bold;
	padding: 7px;
}

.fail {
	font-size: 18px;
	margin-right: 0px;
	border: 1px solid red;
	background-color: white;
	font-weight: bold;
	padding: 7px;
}

.pass_score_text {
	font-size: 18px;
	margin-left: 0px;
	border: 1px solid green;
	background-color: green;
	font-weight: bold;
	color: white;
	padding: 7px;
}

.fail_score_text {
	font-size: 18px;
	margin-left: 0px;
	border: 1px solid red;
	background-color: red;
	font-weight: bold;
	padding: 7px;
	color: white;
}

#timer_bar {
	float: right;
	font-size: 12px;
	margin-right: 25px;
	border: 1px solid black;
	padding: 7px 0 7px 7px;
	margin-top: 10px;
}

#timer {
	background-color: black;
	color: white;
	font-weight: bold;
	padding: 7px;
	margin-left: 10px;
}

/* is this class necessary? */

.flashcontent {
	margin-bottom: 0;
	padding: 0;
}
/* end (ss)*/

a.timer:link,a.timer:visited,a.timer:hover,a.timer:active {
	background-color: black;
	color: white;
	font-weight: bold;
	padding: 7px;
	margin-left: 10px;
	text-decoration: none;
}

	
h1 {  
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 18px; 
	font-weight: bold; 
	color: #000000}

h2 { 
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 16px; 
	font-weight: bold; 
	color: #000000}

h3,legend {  
	font-family: "Helvetica Neue", Arial, sans-serif; 
	font-size: 14px; 
	font-weight: bold; 
	color: #006699}

h4 {  
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 14px; 
	font-weight: bold; 
	color: #000000}

p {  
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 14px;
	line-height: 20px;
	color: #000000}
	
/*could get rid of this now since we have a .center class */

p.center  {
    text-align:center;}
	
p.caption  {	
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 12px;
	line-height: 16px;
	color: #000000;
	text-align:center
	}	

ol {  
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 14px; 
	color: #000000;
	}

ul{  
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 14px; 
	color: #000000;
	}

li {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	margin-bottom: 5px;
	}

li.bulletOne {list-style:none; display:block; background: url(/images/pg_elmnts/mgd_boat_sprites.png) -238px 0px no-repeat; height: 20px;  padding-left: 25px; padding-right: 35px; padding-top: 5px; margin-bottom: 80px;}

li.bulletTwo {list-style:none; display:block; background: url(/images/pg_elmnts/mgd_boat_sprites.png) -238px -26px no-repeat; height: 20px;  padding-left: 25px; padding-right: 35px; padding-top: 5px; margin-bottom: 80px;}

li.bulletThree {list-style:none; display:block; background: url(/images/pg_elmnts/mgd_boat_sprites.png) -238px -51px no-repeat; height: 20px;  padding-left: 25px; padding-right: 35px; padding-top: 5px; margin-bottom: 95px;}


fieldset {
	border: 1px solid #d2d2d2;
	margin-bottom: 10px;
	padding: 0 20px 10px 20px;
}

/* main container that spans full width of content area*/

.container{
	float: none;
	position: static;
	width:644px;
	margin-bottom: 10px;
	padding: 0px 5px 0px 5px;
	clear: both;
}

/* used with container_right to span full width of content area*/

.container_left_379 {
	float: left;
	width: 359px;
	padding: 0px 0px 0px 5px;
	vertical-align: top;
}

.container_right {
	float: right;
	width: 260px;
	padding: 5px;
	margin-right: 5px;
	margin-left: 5px;
}


/* containers that rest side by side, each half the width of the content area */

.container_half_left {
	float: left;
	width: 300px;
	margin-left: 0px;
	padding: 10px;
}

.container_half_right {
	float: right;
	width: 300px;
	margin-right: 0px;
	padding: 10px;
}

/* used with container_left to span full width of content area*/

.container_right_379{
	float: right;
	width: 359px;
	padding: 0px 5px 0px 0px;
	vertical-align: top;
}

.container_left {
	float: left;
	width:260px;
	padding: 5px;
	margin-right: 5px;
	margin-left: 5px;
}

/* container for three small graphics in a row, each within containter_160, and using dotted vert lines to separate images vs. using a table */

.container_thirds{
	width:560px;
	margin-left: 50px;
	margin-top: 5px;
	margin-bottom: 5px;
	clear: both;
}

/* container for small graphics 160px wide or less */

.container_160 {
	float: left;
	width:160px;
	padding: 0px;
	text-align: center;
	margin-left: 10px;
	margin-right:10px;

}

/* container for video with text centered */

.container_media{
	width:560px;
	text-align: center;
	margin-left: 50px;
	margin-top: 5px;
	margin-bottom: 5px;
	clear: both;
}


/* container for glossary items and for wide Remember box */

.container_wide_glossary{
	width:592px;
	margin-left: 31px;
	margin-top: 5px;
	margin-bottom: 5px;
	clear: both;
}

/* dotted vertical and horizontal lines used as separators*/

.dotted_line_vert  {
	width:2px;
	height: 100%;
	border-right: #006699 2px dotted;
	padding: 0px;
	float: left;
}

.dotted_line_horz {
	height:2px;
	border-top: #006699 2px dotted;
	margin-top: 15px;
	margin-bottom: 5px;
	width: 100%;
	float: left;
}

/* h1 */

.chapter_heads {  
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 18px;
	margin-top: 0px;
	margin-bottom: 10px; 
	font-weight: bold; 
	color: #006699}

/* h2 */

.heading { 
	font-family: Verdana, Helvetica, sans-serif; 
	font-size: 16px; 
	font-weight: bold; 
	margin-top: 10px;
	margin-bottom: 10px; 
	color: #cc0000}

/* title bar with border line above */

.subhead_1 {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14px;
	color: #ffffff;
	font-weight: bold;
	background: #006699 url(/images/pg_elmnts/two_bar_tiling.gif) top left;
	vertical-align: baseline;
	height: 22px;
	margin-bottom: 10px;
	margin-top: 0px;
	padding: 8px 5px 3px 5px;
	clear: both;
}
	
	/* image placement and spacing*/

img.right  {
	float: right;
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;	
	border: 0px;
	
}
	
img.left  {
	float: left;
	margin-left: 10px;
	margin-right: 10px;	
	margin-top: 5px;
	margin-bottom: 5px;
	border: 0px;	
}
	

/* table styling*/


table.table_text td[scope="row"]{
	font-weight: bold;
	}
	
table.table_text td{
	border: 1px solid #006699;
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	padding: 8px;
	}


table.table_text th {
	font-weight: bold;
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	color: #ffffff;
	text-align: center;
	background-color: #006699;
	padding: 8px;
	}

.center {
	text-align: center;
	}
	
/*---------- bubble tooltip -----------*/

a.tt{
    position:relative;
    z-index:24;
    color:#cc0000;
	font-weight:normal;
    text-decoration:none;
}

a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/

a.tt:hover{ z-index:25; color: #cc0000;}

a.tt:hover span.tooltip{
    display:block;
    position:absolute;
	font-size: 12px;
	line-height: 14px;
    bottom: 15px; right: -40px;
	padding: 15px 0 0 0;
	width:230px;
	color: #006699;
    text-align: center;
}

a.tt:hover span.top{
	display: block;
	padding: 0 5px;
    background-image: url(/images/pg_elmnts/mgd_boat_sprites.png);
	height: 10px;
	background-position:  -2px -3px;
}

a.tt:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 0 8px 5px 8px;
	background-color:#e1f0fc;
	border-right: 1px solid #006699;
	border-left: 1px solid #006699; 
}

a.tt:hover span.bottom{
	display: block;
	padding: 0 5px;
  	background-image: url(/images/pg_elmnts/mgd_boat_sprites.png);
	height: 26px;
	background-position: -2px -20px;
}

	
/* Boaters Tip half page 260px wide - use with container_left or container_right*/

	
.box_wide_top  {
	background-color: #fff;
	margin-top: 5px;
	margin-bottom: 5px;
	height: auto;
	min-height: 20px;
	padding: 10px;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	border: #006699 solid 1px;
	-moz-border-radius-bottomright: 1em; 
	-moz-border-radius-bottomleft: 1em;
	-webkit-border-bottom-right-radius: 18px; 
	-webkit-border-bottom-left-radius: 18px;
	-moz-border-radius-topright:1em; 
	-moz-border-radius-topleft: 1em;
	-webkit-border-top-right-radius: 18px; 
	-webkit-border-top-left-radius: 18px;
	}
	

.boaters_tip {
	display: block;
	background-image: url(/images/pg_elmnts/mgd_boat_sprites.png);
	background-position:0px -65px;
	height: 70px;
	width: 235px;
	}
	
		
.boaters_tip_box {
	background-color: #fff;
	margin-top: 5px;
	margin-bottom: 5px;
	height: auto;
	min-height: 20px;
	padding: 0px 10px 10px 10px;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-align: left;
	border: #006699 solid 1px;
	-moz-border-radius-bottomright: 1em; 
	-moz-border-radius-bottomleft: 1em;
	-webkit-border-bottom-right-radius: 18px; 
	-webkit-border-bottom-left-radius: 18px;
	-moz-border-radius-topright:1em; 
	-moz-border-radius-topleft: 1em;
	-webkit-border-top-right-radius: 18px; 
	-webkit-border-top-left-radius: 18px;
	}


/* wide Remember box - use with container_wide_glossary*/	

.remember {
	display: block;
	background-image: url(/images/pg_elmnts/mgd_boat_sprites.png);
	width: 140px;
	background-position:0px -47px;
	height: 20px;
	}
	
.remember_box{
	background-color: #fff;
	margin-top: 5px;
	margin-bottom: 5px;
	height: auto;
	min-height: 10px;
	padding: 5px 10px 10px 10px;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-align: left;
	border: #006699 solid 1px;
	-moz-border-radius-bottomright: 1em; 
	-moz-border-radius-bottomleft: 1em;
	-webkit-border-bottom-right-radius: 18px; 
	-webkit-border-bottom-left-radius: 18px;
	-moz-border-radius-topright:1em; 
	-moz-border-radius-topleft: 1em;
	-webkit-border-top-right-radius: 18px; 
	-webkit-border-top-left-radius: 18px;
	}

/*added for styling of quotes instead of using glossary boxes*/

div.quote blockquote
{
	margin: -20px 0 0px 0;
	padding: 0px 20px 0px 20px;
	position: relative;
	z-index: 1;
}

div.quote blockquote p
{
	font-size: 15px;
	font-style: italic;
	font-family: georgia, 'times new roman', serif;
	color: #666;
	line-height: 1.75;
	margin: 0px 10px 0px 10px; 
	padding: 0;
}
 

.quote_l
{	
	position: relative;
	background: url("/css/i/quote_left.jpg");
	background-repeat: no-repeat;
	background-position: top left;
	display: block;
	height: 55px;
	width: 33%;
	left: -10px;
	top: 30px;
	z-index: -4;

}


.quote_r
{
	position: relative;
	background: url("/css/i/quote_right.jpg");	
	background-position: bottom right;
	background-repeat: no-repeat;
	display: block;
	height: 55px;
	bottom: 45px;
	right: auto;
	width: 33%;
	float: right;
	z-index: -4;
}
	
	
/* @group callouts and sidebars */

/* These styles are adapted from the ePub look/feel */

.callout {
	border-top: 0.08333em solid #FFCC69;
	margin: -0.42em 0 1em 0;
	padding: 0.667em 1em 0.8em 1em;
	background-color: #FEFFB6;
	-moz-box-shadow: 6px 6px 3px #aaa;
	-webkit-box-shadow: 6px 6px 3px #aaa;
	box-shadow: 6px 6px 3px #aaa;
	
}

.callout h4 {
	color: #111;
	font-weight: bold;
	margin-top: 0.2em;
	margin-bottom: 0;
}

.callout p {
	margin-top: 0;
	margin-bottom: 0;
}



.callout.right {
	float: right;
	margin-left: 1.5em;
	width: 25%;
}

.callout.quarter {
	width: 25%;
}

.visual_break {
	border-top: 0.08333em solid #ccc;
	margin-top: 2.25em;
	padding-top: 0.667em;
	margin-left: 0;
}

div.illustration p.caption, div.container p.caption {
	margin: -1.0em auto 0 auto;
	clear: both;
	text-align: center;
	font-size: 12px;
	line-height: 1.5;
	font-style: italic;
	color: #555;
	padding-top: 0;
	width: 60%;
	
	
}

/* @end */

/* Misc fixes to legacy styles to account for transition period while we "clean" code chunks */

div.container tr th {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 12px;
}

div.container tr td {font-size: 13px;}