
*{box-sizing: border-box;}

header, nav, main, footer {display: block;}

body{
background-color: #5280c5;
color: #003366;
font-family: Veranda, Arial, serif;
background-image: url(gradientblue.jpg);
}

header{

}

table{
margin: 1em;
border: 2px solid #000066;
border-collapse: collapse;
}

td{
padding: .5em;	
border: 1px solid #000066;
}

th{
padding: .5em;	
border: 1px solid #000066;
}

label{
	float: left;
	display: block;
	text-align: right;
	width: 8em;
	padding-right: 1em;
}

input{
	display: block;
	margin-bottom: 1em;
}

textarea{
	display: block;
	margin-bottom: 1em;
}

h1{
background-color: #000066;	
background-image: url(bigfish.gif);
background-position: center;
background-repeat: no-repeat;
color: #F0F0F0;
text-align: center;
line-height: 250%;
font-size: 3em;
padding: .2em .2em .2em .2em;
text-shadow: 2px 2px 2px #cccccc;
margin-bottom: 0;
}

main{
padding-left: 2em;	
padding-right: 2em;
margin-left: 180px;
background-color: #ffffff;
border: 1px solid #aec3e3;
}

nav{
font-weight: bold;
float: left;
width: 180px;
padding: 5px;
}

nav ul{list-style-type: none;}

nav a{text-decoration: none;}

nav a:link{color: #000066;}

nav a:visited{color: #5280c5;}

nav a:hover{color: #3262a3;}

img{
border: none;	
}

dt{
color: #5280C5;
font-size: 1.1em;
font-family: Gerogia, "Times New Roman", serif;	
}

footer{
font-size: .70em;
font-style: italic;
text-align: center;
background-color: #AEC3E3;
padding: 1em 1em 1em 1em;
margin-left: 180px;
}

.category{
font-weight: bold;
color: #5380C5;
font-family: Gerogia, "Times New Roman", serif;
text-shadow: 1px 1px 1px #667;
}

#wrapper{
margin-left: auto; 
margin-right: auto; 
width: 80%;
background-color: #F0F0F0;
min-width: 700px;
}

#mySubmit{
	margin-left: 9.5em;
}

#mobile{display: none;}
#desktop{display: inline;}

@media only screen and (max-width: 1024px){
	body{margin: 0; padding: 0; background-color: white; background-image: none;}
	#wrapper{width: auto; min-width: 0; margin: 0}
	h1{margin: 0; font-size: 1.8em; line-height: 200%;}
	nav{float: none; padding: 0; width: auto;}
	nav li{display: inline-block;}
	nav a{padding: 1em; font-size: 1.2em;}
	nav ul{text-align: center; padding: 0; margin: 0;}
	main{font-size: 90%; margin: 0; padding-left: 2em;}
	footer{margin: 0;}
}

@media only screen and (max-width: 768px){
	header{background-image: url(lilfish.gif);}
	h1{font-size: 1.5em; line-height:120%;}
	nav a{display: block; padding: .2em; font-size: 1em; border-bottom: 1px solid #330000;}
	nav li{display: block;}
	nav ul{text-align: left;}
	main{padding-left: 1em;}
	.category{text-shadow: none;}
	#mobile{display: inline;}
	#desktop{display: none;}
}