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

/* PAGE STRUCTURE */
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
background-image:url(images/natfl029.jpg);
margin:0 auto;
padding:0;
color:#000;
}

#container {	/* Block to hold all other blocks (columns, and rows). */
width:800px;  /* Total width is 920 = 900px + 10px left/right padding of elements inside the page div */
margin:0 auto; 
padding:30px;
background-image:url(images/logoY-250.jpg);
background-repeat:no-repeat;
background-position: left top;
background-color:#ffffcc;


box-shadow: 0px 0px 10px 10px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 10px 10px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 0px 10px 10px rgba(0, 0, 0, 0.5);
border:5px solid #ff9900;
border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
/*puts a drop shadow around container*/
}

#header  {    			
padding:0 30px 0 0;
color:#000;
}


#content { 
min-height:350px; 
margin-left:210px; 
margin-top:50px;
padding-left:20px; 
padding-right:20px; 


}
#instructions {
float:right;
width:125px;
padding:10px;
margin:130px  0px 0 10px ;
background-color:#ffffff;
background-image:none;
border:3px solid #ff9900;
border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
/*--transform: rotate(3deg);
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);*/
box-shadow: 3px 5px 15px #003300;
	-moz-box-shadow: 3px 5px 15px #003300;
	-webkit-box-shadow: 3px 5px 15px #003300;
}

#instructions p {
	color:#993300;
	font-size: 11px;
	font-family: "Trebuchet MS", "Arial", "sans serif";}

#nav {
float:left; 
width:150px; 
padding:5px; 
min-height: 350px;
margin-top:150px;

}
#footer {

	clear: both;}


ul.horizontal {
list-style-type:none;   
list-style:none;               /* for IE */
text-align:right;                 /* Set the menu left, right, or center within its block. */
}
ul.horizontal li {
display:inline; 			/* Display each item side by side rather than vertically. */
font-size:12px;
padding:10px;        /* Add breathing space beside each item. */
}
ul.horizontal li a {
text-decoration:none;		/* This is already turned off in the first line for the entire document. */
padding:5px;        /* Add breathing space beside each item. */
font-weight:bold;
}
ul.horizontal li a:hover {

color:#ff9900;
padding:5px;        /* Add breathing space beside each item. */
}


/*      V MENUS */
ul.vertical {
list-style-type:none;           /* Turn off bullets */
list-style:none;                    /* Turn off bullets for IE*/
}
ul.vertical li {
font-size:13px;
line-height:23px;
padding-bottom:10px;
}
ul.vertical li a {
display:block;                     /* Allows link to extend beyond the word in the li; visible when hovering. */
text-decoration:none;/* This is already turned off in the first line for the entire document. */
font-weight:bold;
padding:0px 4px;             /* Use same spacing here as for the hover to keep links from jumping during hover. */
}
ul.vertical li a:hover {
color:#ff9900;
padding:0px 4px;             /* Use same spacing here as for the hover to keep links from jumping during hover. */
}

/* TEXT STYLES */
h1 {	color: #993300;
	font-size: 20px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	font-weight : bold;}

h2 {	color: #006600;
	font-size: 18px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	font-weight : bold;}

h3 {	color: #009900;
	font-size: 18px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	font-weight : bold;}

h4 {	color: #cc3300;
	font-size: 16px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	font-weight : bold;}

h5 {	color:#003300;
	font-size: 16px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	line-height: 12px;
	font-weight: bold
	}

h6 {	color: #cc3300;
font-weight:lighter;
	line-height:8px;
	font-size: 10px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	}
link {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:13px; font-weight:bold;
}

A:link {
text-decoration : none;
color:#006600;
font-weight:bold;
}

A:visited {
color:#006600;
text-decoration : none;

}
A:active {
color:#009900;
text-decoration : none;
font-weight : bold;
}
A:hover {
color:#ff9900;
text-decoration : none;
font-weight : bold;
}


p {	color: #663300;
	font-size: 13px;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	
	margin-right : 10px;}

ol { font-family: "Trebuchet MS", "Arial", "sans serif";
	font-size: 13px;
	color: #663300;}

ul {font-family: "Trebuchet MS", "Arial",  "sans serif";
	font-size: 13px;
	color: #663300;}

li {font-family: "Trebuchet MS", "Arial", "sans serif";
	font-size: 13px;
	color: #663300;
	}

dl {font-family: "Trebuchet MS", "Arial", "sans serif";}

dt {color: #993300;
	font-family: "Trebuchet MS", "Arial", "sans serif";
	font-size: 16px;
	text-decoration: none;
	font-weight: bold;
 	margin: 5px 0px  0px 8px;}

dd {font-family: "Trebuchet MS", "Arial", "sans serif";
	font-size: 12px;}

.highlight { font-family:Georgia, "Times New Roman", Times, serif; font-style: italic; font-size:16px; color:#cc3300; font-weight:bold;}
.col { font-family:Georgia, "Times New Roman", Times, serif; font-size:16px; color:#339900; font-weight:bold;}
.headcol { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif, Times, serif; font-size:20px; color:#339900; font-weight:bold;}

.floatright {  float: right; margin-left: 10px;}

.floatleft {  float: left; margin-right: 10px;}



HR  { height: 2px ; color: #0000CC}



/* extras */
blockquote {}
dialog {}
dfn {}
pre {}
code {}
samp {}
cite {}


/* TABLES */
datagrid {}
table {}
caption {}
thead {}
tbody {}
tfooter {}
tr {}
th {}
td {}

/* FORMS */
form {font-family:Verdana, Geneva, sans-serif; font-size: 11px;}
fieldset { border:0;}
legend {} /*  The annotation for images, code, and fieldsets */
label {}
input {}
textarea {}
menu {}
select {}
optgroup  {}
option {}
output {}
keygen {}
button {}
#wrapper {margin:0;}
#msg { display: none; position: absolute; z-index: 200; background: url(images/msg_arrow.gif) left center no-repeat; padding-left: 7px; }
#msgcontent { display: block; background: #ffff33; border-left: 0; border-right: 2px solid #ff9900;  border-top: 2px solid #ff9900; border-bottom: 2px solid #ff9900; padding: 5px; min-width: 150px; max-width: 250px; }

.example {font-size:9px; color:#cc3300; padding:0; margin-left:25px;}

.alert {color:#F00; font-size:large; line-height:5px;}

.example0 {font-size:10px; color:#663300; margin:0; padding:0; }

/*   IMAGES */
figure {} /* Block for annotating images and code */
legend {} /*  The annotation for images, code, and fieldsets */
map {}
area {}
#content img { 
	box-shadow:3px 5px 15px #999;
	-moz-box-shadow: 3px 5px 15px #999;
	-webkit-box-shadow: 3px 5px 15px #999;
	border:4px solid #ff9900;
	margin:10px;
}
onMouseOver  {font-family:Arial, Helvetica, sans-serif; font-size:9px; z-index:1; background-color:#FF0; color:#000000; width:60px;
}



.boxshadow {box-shadow: 0 5px 5px -3px black;}
	


/* MEDIA and misc  */
object {}
param {}
source {}
embed {} /* Use to be deprecated but appears to be back as per http://w3schools.com. */
audio {}
video {}
canvas {}
iframe {}
meter {}
progress {}
base {}