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

/*color scheme1
	dull turq; 		#222d2d
	high/low-light:	#1c2424
	chartreuse:		#99FF33
	light gray: 	#999
	white:			#e0ffed */
	
/* color scheme2	
	dull turq:		#192526
	high/low-light:	#1c2424
	chartreuse		#95ab26
	gray-green		#9bab84
	lt gray-green	#e2f0d6
	nearly white	#f6ffe0 */

html,body {
    margin:0;
    padding:0;
	height: 100%;
    }
body {
	color: #172F00;
	background: #EEEEEE;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-style: normal;
	line-height: 130%;
	font-weight: normal;
	font-variant: normal;
	}
a { 
	font-weight: bold;
	}
a img { 
	border: 0;
	}
a:link {
	color: #993366;
	}
a:visited {
	color: #660066;
	}
a:hover {
	color: #DF1C96;
	}
a:active {
	color: #FF33FF;
	}
h1 {
	font-size: 160%;
	font-weight: lighter;
	text-align: left;
	vertical-align: top;
	color: #336600;
	margin: 0 0 1em 0;
	padding: 0 0 1em 0;
	border-bottom-width: thin;
	border-bottom-style: groove;
	border-bottom-color: #3E666A;
	}
h2 {
	margin: 0;
	padding: 0;
	color: #7f9f4d;
	}
h3 {
	margin-left: 11.5em;
	}
h4	{
	font-size: 120%;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: .3em;
	margin: 0;
	padding: 0 0 .6em 0.1em;
	color: #336600;
	}
h5	{
	font-size: 90%;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: .2em;
	margin: 0;
	padding: 0 0 .6em 0.1em;
	color: #336600;
	}
#container {
	min-height: 100%;
	width: 1000px;
	margin: 0 auto;
	padding: 1em 2em;
	background: #EEEEEE;
/*	background: #F8F9DB; */
	}
/* for IE6, which doesn't support min-height: */
* html #container {
	height: 100%;
	}
#container img {
	float: right;
	padding: 0;
	margin: 0;
	}
#navwrap {
	float: left;
	width: 20em;
	padding: 0;
	}
#navlinks {
	margin: 0 0 .5em 0;
	padding: 0.25em 2em;
	background-color: #7f9f4d;
	border-top-width: 2px;
	border-bottom-width: 2px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000033;
	border-bottom-color: #000;
    }
#navlinks li {
	display: inline;
	margin-right: 0.25em;
	padding-right: 0.5em;
	padding-left: 0.25em;
	font: 1em Georgia, "Times New Roman", Times, serif;
	border-right: 1px solid #666;
	}
#navlinks li a, #navlinks li {
	font-weight: bold;
	text-decoration: none;
	}
#navlinks li.first {
	font-weight: bold;
	border-left: 1px solid #666;
	margin-left: 0;
	padding: 0 0.5em 0 0;
	}
#navlinks li.last {
	font-weight: bold;
	border-right: 1px solid #666;
	margin-right: 0;
	padding: 0 0.5em 0;
    }
.clearboth {
	clear: both;
	}
.navmain {
	padding: 0;
	margin: 0;
	}
.navmain li {
	padding: .2em 0 .2em 1.8em;
	list-style: none;
	background-image: url(../Copy%20of%20exercise6/images/imgbullet1.png);
	background-repeat: no-repeat;
	background-position: left center;
	}
.navmain li a {
	display: block;
	text-decoration: none;
	border-top: thin dotted #F8F9DB;
	border-bottom: thin dotted #F8F9DB;
	}
.navmain li a:hover {
	display: block;
	background-color: #f2f5c1;
	margin-right: 2em;
	border-top-width: thin;
	border-bottom-width: thin;
	border-top-style: dotted;
	border-bottom-style: dotted;
	border-top-color: #E7EBD3;
	border-bottom-color: #E7EBD3;
	}
#main {
	width: 40em;
	line-height: 1.4;
	float: right;
	background: #F8F9DB;
	}
.css-shadow {
	float: left;
	background-repeat: no-repeat;
	background-position: right bottom;
	/*for compliant browsers: */
	background-image: url(../Copy%20of%20exercise6/images/empty-shadow.png) !important;
	/*for non-compliant browsers: */
	background: url(../Copy%20of%20exercise6/images/drop-shadow.gif) no-repeat bottom right;
	margin: 5px 0 0 5px !important;
	/*to account for IE box model issues (not sure I got the math right here): */
	margin: 5px 0 0 2px;
	padding: 1em;
	}
.css-shadow img {
	display: block;
	position: relative;
	background-color: #f2f2f2;
	border: 1px solid #a9a9a9;	
	margin: -5px 5px 5px -5px;
	/*to provide frame mat around the image: */
	padding: 4px;
	}
#pics div {
	background: #E1E2E0;
	padding: 1em;
	}
#main ul li {
	margin: 0 0 0 -1.4em;
	padding: 0 0 .3em 0;
	list-style-position: outside;
	list-style-image: url(../Copy%20of%20exercise6/images/imgbullet2.png);
	}
#main ol li {
	margin: 0 0 0 -1.4em;
	padding: 0 0 .3em 0;
	}
#protoform form {
	background: #ddd;
	border: thin solid #fff;
	padding: 10px;
	}
img#float-left {
	float: left;
	}
.indexlink {
	display: block;
	height: 100%;
	}
#upload {
	width: 300px;
	height: 250px;
	margin: 25px 0;
	padding: 30px 20px;
	float: left;
	background: #E6E6E6;
	font-size: 90%;
	line-height: 140%;
	}
#imageplace {
	width: 200px;
	height: 205px;
	margin: 25px 25px;
	padding: 30px 30px 75px 30px;
	float: left;
	background-color: #CCCCCC;
	}
#imageplace span {
	display: block;
	width: 150px;
	height: 150px;
	padding: 0;
	background-image: url(images/placeholder.gif);
	vertical-align: middle;
	margin-top: 25px;
	margin-left: 25px;
	background-repeat: no-repeat;
	background-position: center center;
	}
#imageplace img {
	float: left;
	}
#colors {
	width: 300px;
	height: 250px;
	float: right;
	background: #DADADA;
	margin: 25px 0;
	padding: 30px 25px;
	}
#colorswrap {
	}
.colorshow {
	width: 50px;
	float: left;
	}
.colorinstance {
	float: left;
	}
.colorgraph {
	float: left;
	font-size: 75%;
	display: block;
	width: 30px;
	vertical-align: bottom;
	}
p#warning {
	color: #CC0000;
	font-weight: bold;
	font-style: italic;
	}
#upload li {
	margin:10px;
	list-style: none;
	}