/* STORMWATER STYLESHEET, place AFTER generic stylesheet. First page using it is http://www.ambroselandscapes.com/stormwater/projects/steep-slope-yard/index.php */


h1 { 
  color: rgb(51, 102, 255);
}

h2 {
  color: rgb(40, 34, 173);
    }
    
.style1 {
color: rgb(68, 122, 197);
font-weight: bold;
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
}

.style2 {
color: #597A23
}

.style3 p {
color: #333333
}

/*DUPLICATES style.css, TEST THEN REMOVE 
body { background: rgb(229, 220, 185);
}

#wrapper { width: 976px;
}

#body { 
background-image: url(images/body-bg-pond-lake-colors.png);
}

 #body-top { background: transparent url(images/body-top-pond-lake-colors.png) no-repeat scroll left top;
    }

  #body-bot { background: transparent url(images/body-bot-pond-lake-colors.png) no-repeat scroll left bottom;
      padding-bottom: 26px;

    }

  #body-top-2 { background: transparent url(images/body_top_2.gif) no-repeat scroll left top;
    }

  #body-nowelcome { background: transparent url(images/body_bg_nowelcome.gif) repeat-y scroll 0%;
    }

  #body-bot-nowelcome { background: transparent url(images/body_bot_nowelcome.gif) no-repeat scroll left bottom;
    }

  #body-top-2-nowelcome { background: transparent url(images/body_top_2_nowelcome.gif) no-repeat scroll left top;
}
*/
 
  #nav a { 
      color: rgb(242, 247, 248);
    }

  #nav a:hover { color: rgb(207, 204, 191);
    }

  /*
  #nav #current { color: #40b586;
    } 
  */
/*DUPLICATES style.css, TEST THEN REMOVE    
  ul.dropdown li,
	ul.dropdown li a {
	background-image: url(images/menu5.png);
}
    
  ul.dropdown ul {
	 background-color: rgb(89, 120, 166);
	 background: url(images/bkgnd-dropdown-blue.png) repeat-x;
}
 */   
  #nav li.current a.dir { color: #40b586;
}

  #nav ul li.current a { color: #40b586;
}

/*DUPLICATE OF style.css, TEST THEN REMOVE
  #sidenav {
  background-image: url(images/menu_side_blue6.png);
  width: 334px;
  height: 42px;
  position: static;
  margin-top: -2px;
  margin-bottom: 8px;
  margin-left: -12px;
  }
   */


#stormwater_home #welcome .feature,
#stormwater_home #welcome .f-right {
  font-weight: bold;
  position: relative;
  margin-top: 30px;
  clear: both;
}

#stormwater_home #welcome .feature {
  margin-left: 10px;
}

#stormwater_home #welcome .feature img {
  margin-right: 8px;
}

#stormwater_home #welcome .f-right {
  margin-right: 10px;
}

#stormwater_home #welcome .f-right img {
  margin-left: 8px;
}

#project_link01 {
  padding-top:18px;
}

#project_link02 {
  padding-top:8px;
}


  #content { 
    color: rgb(48, 93, 156);
}

  #content a { color: rgb(33, 64, 108);
    }

.pic-row {
	clear: both;
	text-align: center;
	margin-top: 8px;
	padding-top: 20px;
	}

  .pic-box { 
  margin-top: 8px; 
	text-align: justify;
	color: rgb(48, 93, 156);
	font-weight: bold;
	}
      
  .pic-box img { 
  margin-bottom: 5px;
	}
	
#stormwater_home .pic-box {
  font-size: 9px;
}

.pic-box.runoff_map {
	float: left;
	width: 225px;
	font-weight: normal;
	}

.pic-box.runoff_map img {
	width: 175px;
	height: 175px;
	margin: 0px 20px 8px ;
	border: thick double #22416d ;
	}
	
/* NEED TO RENAME THESE -- BROWSER INTERPRETING AS 0.4width, ETC. */

img.400width {
	width: 400px;
	height: 300px;
	} 

img.400height {
	width: 300px;
	height: 400px;
	} 

img.350width {
	width: 350px;
	height: 263px;
	} 

img.350height {
	width: 263px;
	height: 350px;
	} 

img.325width {
	width: 325px;
	height: 244px;
	} 

img.325height {
	width: 244px;
	height: 325px;
	} 

.pic-row img.325height {
	margin-left: 45px; 
	margin-right: 20px;
	}

.stormwater_orange {
  font-weight: bold;
  color: rgb(239, 66, 35);
}

.stormwater_blue {
  font-weight: bold;
  color: rgb(10, 152, 238);
}

div.stormwater_year_later {
  width: 750px;
  height: 50px;
  margin: auto;
  clear: both;
}

p.stormwater_year_later {
  border: thin dashed #40b586;
  background-color: #fef8e1;
  padding: 3px;
  width: 700px;
  margin: auto;
  font-weight: normal;
}

p.stormwater_year_later:hover {
  border: thick double #40b586;
  position: relative;
  top: -4px;
  font-weight: bold;
}

/* CSS TOOLTIP TECHNIQUE APPLIED TO IMAGE; ALLOWS TWO IMAGES IN THE SPACE OF ONE! */
.pic-box div.tooltip {
  position: relative;
}

div.tooltip .stormwater_year_later {
  display: none;
  }
 
div.tooltip:hover {
  background-color: rgb(224, 245, 254);
  }
/* The above hover change defeats the
  IE/Win display changing bug */
 
div.tooltip:hover img.stormwater_year_later {
  position: absolute;
  display: block;
  border: thick double #40b586;
  top: -0px;
  z-index: 99;
  }

div.tooltip:hover span.stormwater_year_later {
  position: absolute;
  display: block;
  border: thin solid #40b586;
  background-color: #fef8e1;
  padding: 3px;
  top: -24px;
  z-index: 99;
  font-size: 10px;
  font-style: italic;
  font-weight: bold;
}

div.tooltip:hover span.lower {
  z-index: 999;
  top: 260px; 
  width: 323px; 
  padding: 5px; 
}

div.tooltip:hover span.lower.portrait {
  top: 340px;
}

/* END CSS TOOLTIP */

table.title_dotted { 
	text-align: center; 
	width: 900px; 
	height: 50px; 
	table-layout: fixed; 
	border-top: thick dotted #305d9c ; 
	border-bottom: thin dotted #305d9c ;
	}

/* HOME PIX */

.asheville_central_sm {
	width: 275px; 
	height: 176px; 
}

.slope_diagram {
	width: 120px; 
	height: 110px;
}

.y07sm {
	width: 72px; 
	height: 96px;
}