html {
	margin: 0;
	padding: 0;
	border: none;
}

body {
	color: #066;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height:1em;
	text-align: center;
	background-color: #f5f5dc;
	border: none;
	padding: 0;
	margin: 0;
}

form {
	background-color: #f5f5dc;
	padding: 0;
	margin: 0;
}

table, col, colgroup, tbody, tr, td {
	color:#066;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	padding: 0;
	margin: 0 auto;
}

textarea, input, select, button {
	color:#000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

option {
	color:#000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: auto;
	height: auto;
}

i, em {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style: italic
}

a:link {
	color: #066;
	outline-style: none
}

a:visited {
	color: #366;
	outline-style: none
}

a:hover {
	color: #693;
	outline-style: none
}

a:active {
	color: #066;
	outline-style: none
}

a:link img, a:visited img, a:hover img, a:active img { border: none; }

.heading {
	text-align:center;
	font-weight:bold;
	font-size: 1.125em;  /*about 18px */
	white-space:nowrap;
}

.errmsg {
	font-weight:bold; /* error message */
	color: #a30000;
}

.wrnmsg {
	font-weight:bold; /* warning message */
	color:#F90
}

.bold { font-weight: bold; }

.regweight { font-weight:normal; }

.accenttext { color: #000; }

.accentcell { background-color: #FFF; }

.accentfrog {
	color:#FFF;
	background-color: #066;
	font-weight: bold;
	padding: .125em .25em; /* about 2px and 4 px */
	font-size: 0.813em; /*about 13px */
}

.accentcounty {
	color:#FFF;
	background-color: #066;
}

.accentroute { background-color:#BEBE95; /* 1st step of 4 between #F5F5DC & #999966 */ }

.accentlocobs { background-color:#E3E3C4; /* 4th step of 3 between #F5F5DC & #999966 */ }

.accentobservation { background-color:#FFF; }

td.accentobservation { padding-left: .125em; /* about 2px */ }

.forminputvalid { /* avoild spam from forms */
	visibility:hidden;
	display:none;
}

.frmlbl {
	text-align: right;
	font-weight:bold;
	font-size: 0.813em; /*about 13px */
	padding-right: .125em; /* about 2px */
	padding-left: .125em;
}

.frmlblleft {
	font-weight:bold;
	font-size: 0.813em; /*about 13px */
	padding-left: .125em; /* about 2px */
	padding-right: 0;
}

.frmbtn {
	text-align: center;
	color:#000;
	width: auto; /* Would like to use min-width, but it does not work in IE7 and earlier IE versions */
	overflow: visible;
}

.frmbtn:hover { color:#066; }

.extrapaddingleft { padding-left: 1em; /* about 16px */ }

.extrapaddingright { padding-right: 1em; /* about 16px */ }

.lastupdate {
	margin: .125em .125em .125em auto;
	text-align:right;
}

.checkboxstyle { margin-left: 1em; /* about 16px */ }

tr.extramargintop td { border-top :#f5f5dc solid .125em; }

.center { text-align:center; }

.right { text-align:right; }

.left { text-align:left; }

.smaller { font-size: 0.813em; /*about 13px */ }

.smallest { font-size: 0.625em; /*about 10px */ }

.top { vertical-align: top; }

.middle { vertical-align: middle; }

.bottom { vertical-align: bottom; }

.fullwidth { width: 100%; }

.widthindented { width: 98%; }

.widthfrog { width: 35%; }

.widthmonlistnarrow { width: 20%; }

.formfirstcolwidth { min-width: 8em; /* This should be about the same size as the form button width */ }

.textwrapoff { white-space:nowrap; }

/* This applies to the Login table */
table.login { width: 20em; }

/* This applies to the Monitor Activity table */
table.monitoractivity {
	width: auto;
	text-align:center;
}

.monitoractivity td {
	padding: .125em .25em;
	border-collapse:collapse;
	background-color:#E3E3C4;
	font-size: 0.938em; /* about 15px */
	text-align:left;
}

.monitoractivity td.accentobservation { background-color: #FFF; }

/* This applies to the various database list tables */
table.databasedump { width: 100%; }

.databasedump td {
	padding: .125em .25em; /* about 2px and 4pxc */
	border-collapse:collapse;
	background-color:#E3E3C4;
	font-size: 0.813em; /*about 13px */
}

.databasedump td.accentcell { background-color: #FFF; }

/* This applies to the various database list tables */
table.admintool { width: auto; }

.admintool td {
	padding: .125em .25em; /* about 2px and 4px */
	border-collapse:collapse;
	background-color:#E3E3C4;
	font-size: 0.813em; /*about 13px */
}

/* This applies to the Download Data Report form */
table.reportform { margin: .5em auto auto auto; }

.reportform td {
	padding: .25em 1em .25em 1em;
	vertical-align:baseline;
}

.reportform .top { vertical-align:top; }

/* This applies to the Monitor List table */
table.monitorlist { width: 100%; }

.monitorlist td {
	padding: 0 .125em 0.063em .125em; /* about 0, 2px, 1px, 2px */
	border-collapse:collapse;
	background-color:#E3E3C4;
	font-size: 0.813em; /*about 13px */
}

.monitorlist a { font-weight:bold; }

td.buttonform { /* this is to get around the problem of Internet Explorer not being able to handle min-width on the form buttons */ /* width: 8em;   /*The width of 8em is to fix problems in IE */
	width: auto;
	min-width: 8em;
	overflow: auto;
}

.buttonformextra { /* this is for the checkboxes on the admin tool form */
	width: auto;
	min-width: 8em;
	overflow: visible;
	padding-left:1.75em;
}

/* This applies to the forms/tables that just have a button on the right and a help messsage next it. */
table.extrabuttonsright { margin: 0 0 auto auto; }

/*  This applies to the forms/tables that just have a button on the left and a help messsage next it. */
table.extrabuttonsleft { margin: .125em auto auto 0; }

/* This applies to the Monitor, Location, Route Display/Edit form */
table.displayform { margin: 0 auto auto 0; }

.displayform td {
	padding-top: .125em;
	padding-bottom: 0;
	vertical-align:baseline;
}

.displayform .top { vertical-align:top; }

/* This applies to the Locatio List table in both Locations and Observations */
table.locationlist { width: 100%; }

.locationlist td {
	padding: 0 .125em 0.063em .125em; /* about 0, 2px, 1px, 2px */
	margin: auto;
	border: none;
	border-collapse:collapse;
	text-align: left;
	font-size: 0.813em; /*about 13px */
	font-weight:bold;
}

td.accentroute { padding-left: .5em; /* about 8px */ }

td.accentlocobs { padding-left: .875em; /* about 14px */ }

.helpmsg {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-size: 0.813em;
	font-weight:bold;
}

.olalpha { list-style-type:lower-alpha }

.olroman { list-style-type:lower-roman; }

#container {
	width: 100%;
	margin: 0 auto auto 0;
	padding: 0;
	border: none;
	text-align: left;
}

#navbar {
	margin: 0 auto auto 0;
	min-width:50em;
	text-align: center;
}

#navbar a:link {
	color:#FFF;
	font-weight:normal;
	letter-spacing:normal;
}

#navbar a:visited {
	color: #FFF;
	font-weight:normal;
	letter-spacing:normal;
}

#navbar a:hover {
	color: #E3E3C4; /* 4th step of 3 between #F5F5DC & #999966 */
	font-weight:normal;
	letter-spacing:normal;
}

#navbar a:active {
	color: #FFF;
	font-weight:normal;
	letter-spacing:normal;
}

#navbar table {
	width: 100%;
	background-color:#033;
	border-collapse:collapse;
}

#navbar td {
	background-color:#066;
	border: thin solid #000;
	text-align: center;
	padding: .125em 0 .375em 0;
	font-size: 0.813em; /*about 13px */
	vertical-align:middle;
	color:#FCDA49;
	color: #aaaa83;
	font-weight: bold;
	letter-spacing: .125em;
}

iframe {
	border:none;
	margin: 0 auto auto 0;
	padding: 0;
}

#iframebanner {
	position: relative;
	top: 0;
	left:0;
	right:0;
	bottom:0;
	border:none;
	width: auto;
	height: 7.75em; /* height of banner image and navbar */
	min-width: 51em;
	overflow:visible;
}

#iframebanner iframe {
	position: absolute;
	top: 0;
	left:0;
	bottom: auto;
	right:auto;
	height: 7.75em; /* height of banner image and navbar */
	width: 100%;
	overflow:visible;
}

#iframeleft {
	position: absolute;
	top: 0;
	left:0;
	bottom: 7.75em; /* same as navbar height */
	right:auto;
	height: auto;
	width: 16.125em; /* .125em more than width of left iframe */
	overflow:visible;
}

#iframeleft iframe {
	position: absolute;
	top: 0;
	left:0;
	bottom: auto;
	right:auto;
	border-right: thin solid #BEBE95;
	height: 100%;
	width: 16em; /* width of left iframe */
	overflow:auto;
}

#iframeright {
	position: absolute;
	top: 0;
	left:16.25em; /*.25em more the width of left iframe */
	bottom: 7.75em; /* same as navbar height */
	right:0;
	height: auto;
	width: auto;
	overflow:visible;
}

#iframeright iframe {
	position: absolute;
	top: 0;
	left:0;
	bottom: auto;
	right:0;
	height: 100%;
	width: 100%;
	overflow:auto;
}

#iframelower {
	position: relative;
	top: 0;
	left:0;
	right:0;
	bottom:0;
	border:none;
	width: auto;
	height:100%;
	min-height:100%;
	overflow:hidden;
} /* Must specifiy min-height of 100% */

#noiframelower { 
	position: fixed;
	top: 7.75em;
	left:0;
	right:0;
	bottom:0;
	height: auto; 
	overflow:auto;
	width: auto;
	
	
}

#noiframelower #content {
 	height: auto; 
	width: auto;
	overflow:auto;
	margin: 0 0 1em 1em;
	padding: 0 1em 0 0;
	color: #000;
}

#noiframelower #content h1 {
	font-size: 1.5em;
	line-height: 1.0;
	color: #999966;
}
#noiframelower #content h2 {
	font-size: 1.25em;
	color:#73734D; /* Blend between black and #999966; */
}
#noiframelower #content h3 {
	font-size: 1em;
	text-transform: uppercase;
	text-decoration: underline;
}

 @media screen {

#header {
	min-width:50em;
	text-align: left;
	background-color: #7d9c43;
	background-color: #699;
	padding: 0;
	margin: 0;
}

#header img {
	text-decoration: none;
	vertical-align:top;
	height: 4.5em;
	width: auto;
}

#header a {
	color: #FFF;
	text-decoration: none;
}

#header table {
	margin: 0 auto;
	padding: 0;
	border-collapse:collapse;
	width: 100%;
}

#header td {
	margin: 0;
	padding: 0;
	border-collapse:collapse;
	vertical-align:top;
}

#header p {
	margin: .5em 1em auto auto;
	font-size: 0.813em; /* about 13px */
	color:#E3E3C4; /* 4th step of 3 between #F5F5DC & #999966 */
	color:#033; /* same as navbar background */
	color:#066; /* same as links and text font */
	color:#F5F5DC; /* same as the background */
}

#content {
	width: auto;
	min-height: 9em;
	margin: .625em; /* about 10px */
	font-size: 0.875em; /* about 14px */
	text-align: left;
}

#content .frmbtn {
	font-size: .813em;
	letter-spacing: .063px;
}

#content input, #content textarea, #content button { font-size: 0.938em; /* About 15px. Bump these up to since they are nested in tables */ }

#content select, #content option { /* leave option (pulldown choices) alone */ }

#contentleft {
	width: auto;
	margin: .125em;
	font-size: 0.875em; /* about 14px */
	text-align: left;
}

#contentright {
	width: auto;
	margin: .125em;
	font-size: 0.875em; /* about 14px */
	text-align: left;
}

#contentright .frmbtn {
	font-size: .813em;
	letter-spacing: .063px;
}

#contentright input, #contentright textarea, #contentright button { font-size: 0.938em; /* About 15px. Bump these up to since they are nested in tables */ }

#contentright select, option { /* leave option (pulldown choices) alone */ }

@media print {
#header {
display: none;
}
#content {
 width: auto;
 margin: .625em .625em .625em .625em; /* about 10px */
}
#contentleft {
 width: auto;
 margin: .125em;
}
#contentright {
 width: auto;
 margin: .125em;
}