@charset "utf-8";
body {
	background: #3A2D30; /* text-align: center; this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	font: 80% Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
}

a:link, a:visited{ color: #005FA9; text-decoration: none; }

a:hover{ text-decoration: underline; }

a.glink, a.glink:visited{
	color: #FFFFFF;
	font-size: small;
	font-weight: bold;
	margin: 0px;
	padding: 3px 5px 35px 5px;
}

a.glink:hover{ color: #CCC0D8; text-decoration: none; }

a.button {
	background: transparent url('../images/bg_button_a.png') no-repeat scroll top right;
	color: #000;
	display: block;
	float: left;
	font: normal 12px arial, sans-serif;
	height: 22px;
	margin-right: 6px;
	padding-right: 18px; /* sliding doors padding */
	text-decoration: none;
}

a.button span {
	background: transparent url('../images/bg_button_span.png') no-repeat;
	display: block;
	line-height: 12px;
	padding: 5px 0 5px 18px;
}

a.button:hover {
	background-position: bottom right;
	color: #000;
	/* outline: none; hide dotted outline in Firefox */
}

a.button:hover span {
	background-position: bottom left;
	padding: 5px 0 5px 18px; /* push text down 1px */
}

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

body * { font-size: 100%; }

div.clearfloat { clear: both; font-size: 0; height: 0; line-height: 0px; }

fieldset {
	background-color: #F8F8F8;
	border: 1px solid #F8F8F8;
	color: black;
	font-size: 90%;
	padding: 0px 10px 10px 10px;
}

h1 { font-size: medium; font-weight: bold; }

h2 { font-size: 12px; font-weight: bold; padding-left: 10px; }

h3, h4, h5, h6 { font-weight: normal; }

li.clearfloat { clear: both; }

ul.symbollist {
	display: inline;
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.abswrap { position: relative; width: 100%; }

.centertext {
	text-align: center;
}

.clear {
	overflow: hidden; /* generic container (i.e. div) for floating buttons */
	width: 100%;
}

.legendtext{
	background-color: #F8F8F8;
	color: black;
	font-weight: bold;
	font-size: 100%;
	padding: 12px 5px 5px 5px;
}

.rowwrap { width: 100%; }

#about {
	background: #f8f8f8;
	display: inline;
	float: left;
	height: 23px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px; /*	background-image: url(800x800/watergardens_1/images/about.png);
*/
	overflow: hidden;
	width: 460px;
}

#advert {
	display: inline;
	float: left;
	height: 78px;
	margin-bottom: 0;
	margin-left: 17px;
	margin-top: 15px;
	overflow: visible;
	width: 120px;
}

#advert img{ display: block; }

#breadcrumb{
	background-color: #F8F8F8;
	color: #708090;
	font: x-small Arial, Helvetica, sans-serif;
	margin-left: 220px;
	margin-right: 50px;
	margin-top: 15px;
}

#breadcrumb a { color: #708090; text-decoration: none; }

#breadcrumb a:hover { color: #005FA9; text-decoration: underline; }

#colwrap1 {
	float: left;
	margin-left: 0px;
	margin-top: 0px;
	width: 154px;
}

#colwrap2 {
	float: left;
	margin-left: 0px;
	margin-top: 0px;
	width: 582px;
}

#colwrap4 {
	float: left;
	margin-left: 0px;
	margin-top: 0px;
	width: 460px;
}

#edgescenter {
	background-image: url(800x800/watergardens_1/images/edgescenter.png);
	display: inline;
	float: left;
	height: 657px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 28px;
}

#edgesleft {
	background-image: url(800x800/watergardens_1/images/edgesleft.png);
	display: inline;
	float: left;
	height: 657px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 15px;
}

#edgesright {
	background-image: url(800x800/watergardens_1/images/edgesright.png);
	display: inline;
	float: left;
	height: 657px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 21px;
}

#globallink a { color: white; text-decoration: none; }

#globallink a:hover { color: white; text-decoration: underline; }

#globallink p {
	color: white;
	float: right;
	font-size: small;
	padding-right: 10px;
}



#logobanner {
	background-image: url(800x800/watergardens_1/images/logobanner.png);
	display: inline;
	float: left;
	height: 111px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 800px;
}

#main { 
	margin: 0 auto; 
	width: 800px; }

#main p.lastnode { margin-bottom: 0; }

#navad {
	background-color: #455F52;
	display: inline;
	float: left;
	height: 95px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 154px;
}

#navbottom {
	background-image: url(800x800/watergardens_1/images/navbottom.png);
	display: inline;
	float: left;
	height: 191px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 154px;
}

#navcenter {
	background-color: #455F52;
	display: inline;
	float: left;
	height: 371px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 154px;
}

#photoright {
/*	background-image: url(800x800/watergardens_1/images/photoright.png);
*/	
	background-color: #F8F8F8;
	display: inline;
	float: left;
	height: 506px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 122px;
}

#relatedlinks {
	padding: 10px 0px 10px 10px;
}

#relatedlinks a { 
	display: block;
	font-size: 75%;
	font-weight: bold;
}

#relatedlinks h3{ padding: 10px 0px 0px 0px; }

#rightlinks {
	background: #f8f8f8; /* the background color will be displayed for the length of the content in the column, but no further */
	float: right;
	font-size: 90%;
	/*min-width: 120px;*/
	padding: 0px 0px 0px 0px; /* top and bottom padding create visual space within this div */
	width: 120px; /* since this element is floated, a width must be given */
}

#screenbottom {
	background-image: url(800x800/watergardens_1/images/screenbottom.png);
	display: inline;
	float: left;
	height: 151px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 582px;
}

/*#screentitle {
	margin-left: 0px;
	margin-top: 0px;
	background-image: url(images/screentitle.png);
	overflow: hidden;
	display: inline;
	float: left;
	height: 37px;
	margin-bottom: 0;
	width: 460px;
}*/
#screencenter {
	background-image: url(800x800/watergardens_1/images/screencenter.png);
	display: inline;
	float: left;
	height: 483px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 460px;
}

#screenstop {
	background-image: url(800x800/watergardens_1/images/screenstop.png);
	display: inline;
	float: left;
	height: 32px;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
	overflow: hidden;
	width: 800px;
}

#sectionlinks a:link, #sectionlinks a:visited {
	background-color: #708878;
	background-image: url(../images/buttonBlank.png);
	color: white;
	display: block;
	font-weight: bold;
	height: 19px;
	padding: 3px 0px 3px 10px;
	text-decoration: none;
}

#sectionlinks a:hover {
	background-color: #44486B;
	background-image: url(../images/buttonBlankHover.png);
	display: block;
	font-weight: bold;
	padding: 3px 0px 3px 10px;
	text-decoration: underline;
}

/* Tips for sidebar1:
1. Be aware that if you set a font-size value on this div, the overall width of the div will be adjusted accordingly.
2. Since we are working in ems, it's best not to use padding on the sidebar itself. It will be added to the width for standards compliant browsers creating an unknown actual width. 
3. Space between the side of the div and the elements within it can be created by placing a left and right margin on those elements as seen in the ".thrColElsHdr #sidebar1 p" rule.
*/
#sidebar {
	background: white; /* the background color will be displayed for the length of the content in the column, but no further */
	float: left;
	font-size: small;
	margin-left: 0px;
	margin-top: 0px;
	padding-left: 0px;
	width: 154px; /* since this element is floated, a width must be given */
}

#siteinfo p {
	background-color: #f8f8f8;
	color: #708090;
	font-size: small;
	font-weight: normal;
	padding: 15px 0px 0px 0px;
	text-align: right;
}