/* CSS Document */

body {
	margin: 0;
	padding: 0;
	background-image: url(../images/background.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-color: #f3f2e7;
	margin-top: 20px;
	behavior: url(includes/csshover.htc);
}

div#maincol ul { 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	left: -10px;
}
div#maincol ul li { 
	padding-bottom: 5px;
}

div#maincol li{ 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.content5, #content5 {
	padding: 5px;
}
.content10, #content10 {
	padding: 10px;
}
.content15, #content15 {
	padding: 14px;
}



#pagewrap {
	display: block;
	margin: 0;
	padding: 0;
	width: 975px;
}

/*--- START: LOGO / TOP MENU / HEADER AREA ---*/
div#logo_menu { 
	padding-left: 6px;

}


div#back { 
	background: url(../images/standard-back.gif);
	background-repeat: no-repeat;
	float: left;
	height: 47px;
	padding: 0;
	margin-top: 16px;
}


div#logo_menu a img{ 
	float: left;
	margin-right: 28px;
}
div#logo_menu div a{ 
	font: 23px Helvetica, Verdana, Arial, sans-serif;
	color: #fff;
	margin-top: 10px;
	padding: 10px 10px 10px 10px;
	text-align: center;
	text-decoration: none;
}
div#logo_menu div.bright_green{ 
	background: url(../images/bright_green_button_hover.gif);
	background-repeat: no-repeat;
	float: left;
	margin: 0 3px 0 0;
	padding: 10px 0 0 0;
	width: 180px;
	height: 37px;
	text-align: center;
	text-decoration: none;
}
div#logo_menu div.bright_green:hover{ 
	background: none;
}

div#logo_menu div.dark_green { 
	background: url(../images/dark_green_button_hover.gif);
	background-repeat: no-repeat;
	float: left;
	margin: 0 3px 0 3px;
	padding: 10px 0 0 0;
	width: 180px;
	height: 37px;
	text-align: center;
	text-decoration: none;
}
div#logo_menu div.dark_green:hover { 
	background: none;
}
div#logo_menu div.maroon { 
	background: url(../images/maroon_button_hover.gif);
	background-repeat: no-repeat;
	float: left;
	margin: 0 3px 0 3px;
	padding: 10px 0 0 0;
	width: 180px;
	height: 37px;
	text-align: center;
	text-decoration: none;
}
div#logo_menu div.maroon:hover { 
	background: none;
}
div#waukesha_info { 
	float: right;
	width: 165px;
	height: 306px;
	margin-top: 82px;
	background-color: #f2990c;	
}
div#waukesha_info h6 { 
	margin-top: 10px;
	line-height: 20px;
}
div#waukesha_info img{ 
	margin-top: -48px;
	margin-left: -14px;
	position: relative;
	z-index: 10;
}
div#photo_rotator { 
	text-align: left;
}
/* START: INTERIOR HEADER */
div#main_header { 
	margin-top: 2px;
}
div#main_header div#tall, div#main_header div#short { 
	float: right;
	background: #f2990c;
	text-align: left;
	color: #9e091c;
}
div#main_header div#tall {
	height: 226px;
	width: 958px;	
}
div#main_header div#tall img{ 
	position: relative;
	left: -17px;
}
div#main_header div#tall div#flash{
	position: relative;
	left: -17px;
}

div#main_header div#tall h1{ 
	float: right;
	width: 294px;
	font-size: 22px; 
	line-height: 24px;
	margin-right: 50px;
	margin-top: 20px;
	display: inline; /* Need this for IE */
}
div#main_header div#short { 
	height: 118px;
	width: 975px;
	margin-top: 17px;
}
div#main_header div#short img, div#main_header div#short div#flash{ 
	position: relative;
	top: -17px;
	float: left;
}

div#main_header div#short img.small{ 
	padding: 0;
	border-left: 8px solid #f2990c;
}

/* END: INTERIOR HEADER */
div#head_full { 
	background: #a4192b;
	width: 100%;
	height: 2px;	
	margin-top: 12px;

}
/*--- END: LOGO / TOP MENU / HEADER AREA ---*/


div#leftcol, div#maincol, div#homecol, div#rightcol { 
	float: left;
}
div#maincol, div#homecol, div#rightcol { 
	margin-left: 10px;
}

span.highlight { 
	background: #ffda0b;
}

div#maincol div#content15 div div#photo, div#maincol div#content15 div div#text { 
	float: left;
	padding: 10px;
}
div#maincol div#content15 div div#photo{
	width: 120px;
	text-align: center;
}

div#photo img{
	border: 3px solid #acba58;
}
div#photo.green, div#photo.dark_green, div#photo.maroon  { 
	float: right;
}

div#photo.green img{
	border: 3px solid #acba58;
}
div#photo.dark_green img{
	border: 3px solid #2d7e6f;
}
div#photo.maroon img{
	border: 3px solid #672831;
}

div#photo.light_mar img{ 
	border: 3px solid #b72635;
}


#small_map { 
	width: 430px; 
	height: 350px; 
}



div#small_map.green{
	border: 3px solid #acba58;
}
div#small_map.dark_green{
	border: 3px solid #2d7e6f;
}
div#small_map.maroon{
	border: 3px solid #672831;
}


div#photo.community img{
	width: 100px;
}

h4.city { 
	text-align: center;
	font-size: 14px;
}



/*=== FONT MODIFICATIONS ===*/

div#maincol div#content15 div div#text {
	width: 300px;
}
div#maincol div#content15 div div#text.full {
	width: 450px;
}
div#maincol div#content15 div div#text h1 { 
	color: #429688;
}
div#maincol div#content15 h2.category { 
	color: #429688;
	font-style: italic;
}
div#maincol div#content15 h2.category a{ 
	color: #429688;
	font-style: italic;
	text-decoration: none;
}
div#maincol div#content15 h2.category a:visited{ 
	color: #429688;
	font-style: italic;
	text-decoration: none;
}

div#maincol div#content15 div div h3 { 
	color: #429688;
}
div#maincol div#content15 div div h5  a{ 
	color: #429688;
}
div#maincol div#content15 h6.category  a{ 
	color: #429688;
}
div#maincol div#content15 h6.category { 
	font-size: 10px;
}


div#maincol div#content15 div h5 { 
	margin: 3px;
}
div#maincol div#content15 div h5 a{ 
	color: #429688;
}


div.suggest_link_over { 
	background-color: #ccc;
}

/*--- START: LEFT COLUMN --*/
div#leftcol { 
	min-height: 200px;
	width: 182px;
	padding: 8px;
	text-align: left;
	color: #fff;
}
div#leftcol h1{ 
	padding-left: 6px;
}
div#leftcol h4{ 
	padding-left: 15px;
}
div#leftcol ul { 
	margin: 0;
	padding: 0;
}
div#leftcol ul li {
	list-style-type: none;
	text-align: left;
	margin-bottom: 3px;
}
div#leftcol ul li a{ 
	background-image: url(../images/button.gif);
	background-repeat: no-repeat;
	background-color: #70a46c;
	width: 158px;
	padding: 4px 12px;
	font: 14px Helvetica, Arial, sans-serif;
	color: #fff;
	text-decoration: none;
	display: block; /* We need this so the anchor fills the entire space */
}
div#leftcol ul li a:hover, div#leftcol ul li a.active{ 
	background-color: #358f7f;
}
div#leftcol ul li a.sub_pages { 
	margin: 0;
	padding: 0 12px;
	background: none;
}
div#leftcol ul li:hover a.sub_pages { 
	background: none;
	color: #672831;
}
/*--- END: LEFT COLUMN --*/


/*--- START: MAIN COLUMN ---*/
div#container_mid div#maincol { 
	width: 509px;
	
	background-repeat: repeat-y;
	text-align: left;	
}
div#maincol div#content15, div#homecol div#content15 { 
	padding-top: 0;
}
div#container_mid.homepage div#maincol { 
	width: 592px;
	/*background: #fff;
	background-image:url(../images/break.gif); */
	margin-left: 10px;
}
div#container_mid.homepage div#maincol div#main {
	width: 364px;
}
div#container_mid.homepage div#maincol div#right{
	margin-left: 8px;
	width: 220px; 
}
div#container_mid.homepage div#maincol div#main, div#maincol div#right{ 
	float: left;
}
div#maincol h6 a { 
	font: 10px Helvetica, Arial, sans-serif;
}
div#homecol { 
	width: 217px;
	background: #fff;
}
/*--- END: MAIN COLUMN ---*/


/*--- START: RIGHT COLUMN ---*/
div#container_mid div#rightcol {
	width: 247px;
	background-color: #dfe1db;
}
div#container_mid.homepage div#rightcol {
	width: 164px;
}
div#container_mid div#rightcol h3{
	margin-top: 7px;
}
div#container_mid div#rightcol div.maroon{
	background: #4f1b25;
}
div#container_mid div#rightcol div.maroon p{
	color: #fff;
}
div#container_mid div#rightcol div.dark_green{
	background: #366f5a;
}
div#container_mid div#rightcol div.dark_green p{
	color: #fff;
}

div#container_mid div#rightcol div.green{
	background: #9cae41;
}
div#container_mid div#rightcol div.maroon, div#container_mid div#rightcol div.green, div#container_mid div#rightcol div.dark_green{
	text-align: left;
	padding: 7px 14px;
	margin-bottom: 7px;
}
div#container_mid div#rightcol div.green img, div#container_mid div#rightcol div.maroon img,  div#container_mid div#rightcol div.dark_green img{ 
	border: 3px solid #fff;
}
div#currentweather h1{ 
	font: 29px Verdana, Arial, Helvetica, sans-serif;
}
div#currentweather h6{ 
	color: #666;
}
div#currentweather img {
	border: 1px solid #666; margin-top: 10px;
}
div#currentweather div h6{ 
	font-size: 10px;
	line-height: 14px;
}
/*--- END: RIGHT COLUMN ---*/


/*--- START: MIDDLE CONTAINER ---*/
div#container_mid { 
	margin-top: 12px;
	background: url(../images/menus.gif) top;
	background-repeat: repeat-y;
}
*html div#container_mid { 
	margin: 12px 0 0 0;
}
div#container_mid.homepage { 
	background: url(../images/menus-home.gif) top;
	background-repeat: repeat-y;
}
/*--- END: MIDDLE CONTAINER ---*/


/*--- START: BOTTOM CONTAINER ---*/
div#container_bot { 
	margin-top: 6px;
	padding-top: 26px;
	height: 154px;
	background-color: #2d7d6f;
	background-image: url(../images/waukesha-county-botright.gif);
	background-position: bottom right;
	background-repeat: no-repeat;
}
div#container_bot div#float_left h3, div#container_bot div#float_left h3 a{ 
	color: #acba58;
	font-weight: bold;
}
div#container_bot div#float_left h3 a{ 
	text-decoration: none;
}
div#container_bot div#float_right h6 a{ 
	color: #71beb0;
}
div#container_bot div#float_right h6, div#container_bot div#float_left h6 { 
	font: 11px Arial, Helvetica, sans-serif;
}
div#container_bot div#float_left h6 { 
	color: #fff;
	line-height: 16px;
	padding-left: 1px;
}
div#container_bot h6 a{ 
	color: #fff;
	text-decoration: none;
}
div#container_bot h6 a:hover{ 
	text-decoration: underline;
}
div#container_bot div#float_left{ 
	padding-left: 40px;
	text-align: left;
}
div#container_bot div#float_right{ 
	padding-right: 40px;
	text-align: left;
}
div#container_bot div#float_right h6{ 
	color: #71beb0;
}
/*--- END: BOTTOM CONTAINER ---*/

div#main_content { 
	float: left;
	background: url(../images/break.gif);
	background-repeat: repeat-y;
}

/*--- START: ROUNDED CORNERS ---*/
div.round_top_new, div.round_top_new div, div.round_bottom_new, div.round_bottom_new div { 
	width: 100%;
	height: 21px;
}

	/*-- START: HOME PAGE MOD --*/
	div#main div.round_top_new, div#main div.round_top_new div, div#main div.round_bottom_new, div#main div.round_bottom_new div {
		width: 364px;
	}
	div#right div.round_top_new, div#right div.round_top_new div, div#right div.round_bottom_new, div#right div.round_bottom_new div {
		width: 220px;
	}
	div#full div.round_top_new, div#full div.round_top_new div, div#full div.round_bottom_new, div#full div.round_bottom_new div {
		width: 592px;
	}
	/*-- END: HOME PAGE --*/
	
div.round_top_new div div, div.round_bottom_new div div{ 
	width: 470px;
	margin-left: 20px;
	height:21px;
	background: #fff;
}

	/*-- START: HOME PAGE MOD --*/
	div#main div.round_top_new div div, div#main div.round_bottom_new div div{ 
		width: 324px;
	}
	div#right div.round_top_new div div, div#right div.round_bottom_new div div{ 
		width: 180px;
	}
	div#full div.round_top_new div div, div#full div.round_bottom_new div div{ 
		width: 552px;
	}
	/*-- END: HOME PAGE MOD --*/
	
div.round_top_new {
	background-image: url(../images/inverted-top-right.gif);
	background-position: top right;
	background-repeat: no-repeat;
}
div.round_top_new div{ 
	background-image: url(../images/inverted-top-left.gif);
	background-position: top left;
	background-repeat: no-repeat;
}

div.round_bottom_new {
	background-image: url(../images/inverted-bottom-right.gif);
	background-position: bottom right;
	background-repeat: no-repeat;
}
div.round_bottom_new div{
	background-image: url(../images/inverted-bottom-left.gif);
	background-position: bottom left;
	background-repeat: no-repeat;
}
/*--- END: ROUNDED CORNERS ---*/

div.white { 
	background: #fff;
}

hr { 
	height: 2px;
	width: 100%;
	border: 0;
	background: #e0e2dc;
	color: #e0e2dc;
	margin: 0;
}


div#footer {
	padding: 5px;
	color: #999;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}
div#footer a {
	color: #999;
	text-decoration: none;
}
div#footer a:hover {
	color: #999;
	text-decoration: underline;
}
div#copyright {
	float: left;
	width: 350px;
	text-align: left;
	margin-left: 25px;
}
div#credits {
	float: left;
	width: 350px;
	text-align: left;
}
#menu {
	display: block;
}

/* ------------------------------ ADMIN TOOL TIPS --------------------------------- */

span.attraction {
	font: 10px Arial, Helvetica, sans-serif;
	padding: 0;
}

span.attraction span {
	display:none;
	position:absolute;
	background-color:#CCC;
	border: 1px solid #666;
	padding: 3px;
}

span.attraction:hover span {
	display:block;
}


/* ------------------------------ DROPDOWN MENU ------------------------------------------ */
body div#main_menu ul li ul, body div#main_menu ul li ul li ul {
	display: none;
	float: right;
	}
div#main_menu {
	float: left;
	text-align: left;
	font-size: 13px;
	line-height: 13px;
	font-weight: bold;
	text-transform: capitalize;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0 0 0 16px;
	padding: 0;
	border: 0;
	z-index: 50;
	position: relative;
}
div#main_menu ul {
	width: 860px;
	margin: 0;
	padding: 0;
}
div#main_menu li {
	float: left;
	width: auto;
	position: relative;
	left: 0px;
	list-style-type: none;
}
div#main_menu a {
	display: block;
	text-decoration: none;
	margin: 0;
}
div#main_menu ul li ul:hover, div#main_menu ul li:hover ul {
	display: block;
}
div#main_menu ul li ul li:hover ul {
	display: block;
	left: 120px;
}
div#main_menu ul li a {
	padding: 18px 11px;
	color:#FFFFFF;
}
div#main_menu ul li a:hover {
	color: #272262;
}
div#main_menu ul li ul li a:hover {
	color: #FFF;
	background-color: #44569a;
}
div#main_menu ul li ul {
	margin: 0px;
	position: absolute;
	width: 145px;
	z-index: 25;
	border: 2px solid #FFF;
	}
div#main_menu ul li ul li {
	width: 145px;
	padding: 0px;
	color: #D14F1E;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0;
	}
div#main_menu ul li ul li a{
	width: 121px;
	background-color: #272262;
	border-top: 0;
	padding: 6px 12px;
	color: #FFF;
	margin: 0px;
	}
div#main_menu ul li ul li:first-child {
	border-top: 0;
	}

div#main_menu ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* second level popouts start here*/
div#main_menu ul li ul li:hover ul li ul {visibility:hidden;}
div#main_menu ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* third level popouts start here*/
div#main_menu ul li ul li ul li:hover ul li ul {visibility:hidden;}
div#main_menu ul li ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */
	
/* pop-out starts here */
div#main_menu ul li ul li ul  {
	visibility:hidden; /* same effect as display:none in this situation */
	top:-1px;
	left:10em;
	}

/* THE HACK ZONE - */
* html div#main_menu ul {
	float:left; /* makes the ul wrap the li's */
	margin-left:0px; /* IE doubles the given value above - why? */
	}

/* add a top line to drops and pops in IE browsers - can't read :first-child */
* html  div#main_menu ul li ul {
	border-top:1px solid #692E02;
	border-left:0px; /* stops the drop inheriting the ul border */
	}
/* the Tantek hack to feed IE Win 5.5-5.0 a lower value to get the pop-out to touch the drop-down */
* html  div#main_menu ul li ul li ul { 
  left:0; 
  voice-family: "\"}\""; 
  voice-family:inherit;
  left:0em;
  } 
/* and the "be nice to Opera" rule */
html>body div#main_menu ul li ul li ul {
  left:0em;
} 

/* an Opera-only hack to fix a redraw problem by invisibly extending the ul */
	@media all and (min-width: 0px){
   body div#main_menu ul li ul {padding-bottom:100px;}
   body div#main_menu ul li ul li ul {padding-bottom:22px;}
   body div#main_menu ul li ul li ul li ul li:hover {visibility:visible;} /* same effect as display:block in this situation */
   }

/* END OF HACK ZONE */

/* FLOATERS */

.float_left, #float_left {
	float: left;
}
.float_right, #float_right {
	float: right;
}

/* CLEARFIX */

.clear, #clear {
	clear: both;
}