 * { box-sizing: border-box; }
header, nav, main, footer { display: block; }
body { background-color: #3F2860;
      color: #3F2860;
	  font-family: Verdana, Arial, sans-serif;
}
header { background-color: #9BC1C2;
       background-image: url(lilyheader.jpg);
	   background-position: right;
	   background-repeat: no-repeat;
	   height: 150px;
}
h1 { padding-top: 50px;
    padding-left: 2em;
}
nav { font-weight: bold; 
	 padding: 1em;
	 float: left;
	 width: 160px;
}
nav a { text-decoration: none; 
       display: block;
	   text-align: center;
	   font-weight: bold;
	   border: 3px #CCCCCC outset;
	   padding: 1em;
	   margin-bottom: 1em;
}
nav a:link { color: #3F2860; }
nav a:visited { color: #497777; }
nav a:hover { color: #A26100; 
             border: 3px #333333 inset; }
nav ul { list-style-type: none; 
       padding-left: 0;
}
.studio { font-style: italic; 
}
footer { background-color: #9BC1C2;
       font-size: small;
	   font-style: italic;
	   text-align: center;
	   padding: 1em;
}
main { padding-left: 2em;
      padding-right: 2em;
	  display: block;
	  margin-left: 170px;
	  padding-top: 1em;
}
.floatleft { float: left;
             margin-right: 4em; 
}
.clear { clear: both; }
#wrapper { width: 80%;
           margin-left: auto;
		   margin-right: auto;
		   background-color: #F5F5F5;
		   min-width: 1200px;
		   max-width: 1480px;
}
#mobile { display: none; }
#desktop { display: inline; } 
@media only screen and (max-width: 1024px) {
	body { margin: 0;
	      padding: 0; }
	#wrapper { width: 100%;
	           min-width: 0; 
			   margin: 0;
			   padding: 0; }
	header { padding-top: 1px; }
	h1 { padding-top: 1em; }
	nav { float: none; 
	     width: auto;
		 padding-left: 2em; }
	nav a { padding: 0.2em;
	      margin-left: 0.3em;
		  float: left;
		  width: 23%; }
	main { padding: 2.5em 1em;
		  margin: 0;
		  font-size: 90%;
		  clear: both; }
	#hero img { width: 100%;
		       height: auto; }
	h2,p, h3, dl { padding-left: 2em;
	              padding-right: 2em; }
	main ul { margin-left: 2em; }
	.floatleft { margin-left: 2em;
	            margin-bottom: 1em; }
	.clear { padding-left: 2em; }
}
@media only all and (max-width: 768px) {
	h1 { font-size: 2em;
	     padding-top: 0.25em;
		 padding-left: 1.5em;
		 width: 85%;
		 text-align: center; }
	nav a { padding: 0.5em;
	      width: 45%;
		  float: left;
		  min-width: 6em;
		  margin-left: 0.5em; }
	main { padding-top: 0; }
	.floatleft { float: none; display: none; }
	#hero { display: none; }
	footer { padding: 0.5em;
	       margin: 0; }
	#mobile { display: inline; }
    #desktop { display: none; }	   
}
table   {width:60%;
     border:1px solid #3F2860;
	 border-collapse:collapse;
	 margin-bottom:1em;
	 }
td,th {padding:5px;
     border:1px solid #3F2860;	
     } 
tr:nth-of-type(even)  {background-color:#9BC1C2;}
caption{margin:1em;
      font-weight: bold;
	  font-size:120%;
	  }
label   {float:left; 
     display:block;
     font-weight:bold;
     width:10em;
     padding-right:1em;
     text-align:right;
	 
	 }
  
input,textarea {display:block;
           margin-bottom:2em;
           }
#mySubmit{margin-left:12em;}
form{padding:3em;}
 
	  section {
          background-color: #C8DDDE;
          width: 90%;
          padding: 1em;
          margin-left: 0;
          margin-right: 0;
          margin-bottom: 1em;
          margin-top: 1em;
}
section form {
               padding: 0;