/*  http://blog.html.it/layoutgala/LayoutGala39.html  */

* {margin: 0; padding: 0;}

html,body{margin:10px; margin-bottom:12px; padding:0}

body{
   font: 14px/20px verdana, Tahoma, helvetica, sans-serif;	
   font-weight: normal;
   line-height: 130%;
   text-align:center; 
   background: #4c6681; 
   
   }

div#header{position:relative; background:#f0f0f0}

div#container{
   width:750px;
   margin:0 auto;
   text-align:left; 
   background:#edf2f2;
   padding: 0px;
   border-style: solid;
   border-color: black;
   border-width: 1px;
   
   margin-bottom:25px;
   
   /* shadow box does not work in IE 8   */    
   /* box-shadow:10px 10px 20px #696969;
    -webkit-box-shadow:10px 10px 20px #696969;
    -moz-box-shadow: 10px 10px 20px #696969;  */
   

   /*  following keeps email address and counter at bottom from spilling past the content box
   /*  http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats/        */
   overflow:auto;  
}

div#content {background:#edf2f2}

div#content p {
   padding-left: 15px;
   margin-top: 0px;             /* Oct 2007, was 6  */
   text-align:left;
        }

p.boldbluetext {
   font-weight: bold;
   color: #000080;
   }		
		
span.colortext
   {
   color: green;
   }		
		
		
span.boldtext
   {
   font-weight: bold;
   }			
		
span.boldgreentext
   {
   color:green;
   font-weight: bold;
   }
   
span.smallyellowbackground 
   {
   font-size: 90%;
   color: black; 
   background-color: #FFFFE0;
   }   
   					
		
/* 		
headings-- font: Technical, size: 8, nobold, anti-alias: sharp, stroke width: 0, leading: 0, kerning: 40, 
drop shadow-- 2, 2, 80, 5.00, dark gray
background: #edf2f2; foreground: #1e90ff
merge all layers, no compression on saving the jpg
*/		

img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto }
	
img.buoy  {
  margin-top: 10px;
  margin-bottom: 3px;
  
}  

img.heading  {
  margin-top: 7px;
  margin-bottom: 0px;
  margin-left: 9px;
  
  
}  

/*  http://www.tizag.com/cssT/float.php  */
img.icon  {
   float:left;
   margin: 6px;
   border: 1px solid black;
 
}


/*  a         { text-decoration: none}   */
a:link    {color: #000080; text-decoration: none } 
a:visited {color: #000080; text-decoration: none } 
a:hover   {color: black; background-color: #d2f2e7; }       /*  #d2f2e7;   */

/* setting up multiple schemes for links...   http://www.yourhtmlsource.com/stylesheets/csslinks.html  */		  
a.ulblue:link {color: blue; text-decoration: underline }	  
a.ulblue:visited {color: blue; text-decoration: underline }		  
a.ulblue:hover   {color: black; background-color: #d2f2e7;  }

a.newday:link {color: #9400D3; text-decoration: none } 	  /* used in Scripps links to show new day eg 18, 42 */	  
a.newday:visited {color: #9400D3; text-decoration: none }		  
a.newday:hover   {color: black; background-color: #d2f2e7;  }

a.newaft:link {color: #228B22; text-decoration: none } 	  /* used in Scripps links to show new aft eg 30, 54 */	  
a.newaft:visited {color: #228B22; text-decoration: none }		  
a.newaft:hover   {color: black; background-color: #d2f2e7;  }

a.mail:link {color: #778899; text-decoration: none } 	    
a.mail:visited {color: #778899; text-decoration: none }		  
a.mail:hover   {color: black; background-color:#d2f2e7;  }

a.note:link {color: blue; text-decoration: none } 	    
a.note:visited {color: blue; text-decoration: none }		  
a.note:hover   {color: black; background-color:#d2f2e7;  }

a.gray:link {color: #d0d0cc; text-decoration: none } 	    
a.gray:visited {color: #d0d0cc; text-decoration: none }		  
a.gray:hover   {color: gray; text-decoration: none; background-color:#edf2f2;  }

a.brite:link {color: black; background-color: yellow; }	  
a.brite:visited {color: black; background-color: yellow; }		  
a.brite:hover   {color: black; background-color:#d2f2e7;  }

a.mail2:link {color: blue; text-decoration: underline}	  
a.mail2:visited {color: blue; text-decoration: underline}		  
a.mail2:hover   {color: black; background-color:#d2f2e7;  }

a.right_align                /* right align a link -- home (text) */
{position:absolute;left:90% }		  
a.right_align:link {color: blue; text-decoration: underline}	  
a.right_align:visited {color: blue; text-decoration: underline}		  
a.right_align:hover   {color: black; background-color:#d2f2e7;  }

/* http://www.cssplay.co.uk/menu/tooltips.html  and  http://fijiwebdesign.com/content/view/82/77/ */	
/* eg -- leave the <b> and <em>
<a class="tooltip" href="http://www.ibiblio.org/wm/paint/auth/courbet/">Courbet<b><em></em>The painter Courbet started and dominated the French movement toward realism.</b></a>	*/
a.tooltip {color:#c00;}
a.tooltip b {display:none;}
a.tooltip:link {color:green; border-bottom: 1px dashed #008080; text-decoration: none; }
a.tooltip:visited {color:green; border-bottom: 1px dashed #008080; text-decoration: none; }
a.tooltip:hover {border:0; position:relative; z-index:500; text-decoration:none; color:black; background-color: 	#d2f2e7;}
a.tooltip:hover b {display:block; position:absolute; top:20px; left:-25px; padding:5px; font-weight:normal; color:#000; border:1px solid #888; background:#ffc; width:150px;}
a.tooltip:hover b em {position:absolute; left:20px; top:-6px; width:11px; height:6px; background:transparent url(tooltip4.gif) 0 0; display:block; font-size:1px;}

		   
/* h4 is the first heading, h3 is all the rest */
#content h4 { 
	margin-top: 0px;
	font-weight: 400;
    font-size: 110%;
	line-height: 100%;
    font-variant: small-caps;
	color: blue;
	margin-bottom: 6px;
    padding-top: 10px;
	padding-left: 15px;
    }		

#content h3 {                     /*  used in SAVE JR page  */
    margin-top: 15px;
	font-weight:400;
    font-size:120%;
	line-height: 100%;
    font-variant: small-caps;
	color: #1E90FF;
	margin-bottom: 6px;
	padding-left: 15px;
    }		
	
img.shift_down        /* shift an img down by x pix; used with new.gif */
   {                     /* <IMG class="shift_down" SRC="new.gif" WIDTH=39 HEIGHT=16 alt=""> */
   position: relative;
   top: 4px;
   }
	
img.shift_down_more        /* shift an img down by x pix; used with new.gif */
   {                     /* <IMG class="shift_down" SRC="new.gif" WIDTH=39 HEIGHT=16 alt=""> */
   position: relative;
   top: 10px;
   }	
	
	
span.smalltext
   {
   font-size: 90%;
   color: black; 
   }
   
span.smallgray 
   {
   font-size: 90%;
   /* color was #708090; which a darker gray and then #a9a9a9; Oct2007 was #d0d0cc; */
   color: #a9a9a9;
   }
   
span.smallemailaddress 
   {
    float:left;
	background:#edf2f2;
    font-size: 90%;
    /* color doesn't work here; it defaults to the link color */
  
   }   
   
span.counter
   {
   float:right; 
   padding-right: 15px;
   font-size: 90%;
   color: #778899;
   }      
   
   
span.graytext 
   {
   
   color: black; 
   }
   
span.new
   {
   font-size: 90%;
   color: #FF00FF; 
   background-color: #edf2f2;
   }
   
.form
{ 
margin-left: 0em; 
margin-top: 5px;
padding-top: 0px;
display: inline;
}

.submit-button 
{ 
margin-left: 0em; 
margin-top: 4px;
padding-top: 0px;
display: inline;

 
}

.dropdown
{ 
margin-left: 15px; 
margin-top: 4px;
padding-top: 0px;
display: inline;

}   


/* source --> http://css.maxdesign.com.au/listamatic/vertical05.htm   */
#navlist
{
margin-left: 20px;
padding-left: 0;
list-style: none;
}

#navlist li
{
padding-left: 12px;
background-image: url(dot4.gif);
background-repeat: no-repeat;
background-position: 0 .5em;
}