/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */

@import url("style_dropdown.css");
@import url("style_footer.css");


  html, body, ul, li, h1, h2, h3, h4 { margin: 0px;
    padding: 0px;
    list-style-position: outside;
    }
    
  h1 { 
    font-size: 26px;
    color: rgb(63, 60, 45);
    font-variant: small-caps;
    font-family: Arial,Helvetica,sans-serif;
    }
    
  h1.style3 {
    font-variant: normal;
    font-family: verdana,arial,sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #5C7E29;
    margin-top: 16px;
    margin-bottom: 16px;
    }
    
  h2, h3 { font-family: Arial,Helvetica,sans-serif;
  }
  
  h2, h3, #content, #content-nowelcome {
    color: rgb(84, 78, 56);
    }
    
  h2 { font-size: 17px;
    }
    
  h3 { font-size: 13px;
    }
    
  h4 { font-size: 11px;
    font-weight: bold;
    }

  img { border: 0px none ;
    }

  a { text-decoration: underline;
    }

  .clear { clear: both;
    }

  a:hover { text-decoration: underline;
    }
    
  img.bordered { 
  border: 2px ridge /*#5a5644*/#9D956C;
    }
    
  a:hover img.bordered { 
  /*border-color: #000;*/
  border-color: #26241A;
    }

/*
  alt { font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    font-weight: normal;
    color: rgb(84, 78, 56);
    }
*/

  .left { float: left;
    padding-right: 6px;
    }

  .right { float: right;
    padding-left: 6px;
    }
    
  .center { text-align: center;
    }

  .more { text-align: right;
    padding-right: 0px;
    }

.bold { 
  font-weight: bold;
}
    
.italic {
	font-style: italic;
}

.small-caps {
	font-variant: small-caps;
}

.strikeout {
  text-decoration: line-through;
}

.center {
	text-align: center;
}

.relative {
  position: relative;
}

.center-x {  /* HORIZONTAL. COMBINE WITH UNIQUE CLASS FOR THE OBJECT, .center-x.thisobjectsclass, AND GIVE .center-x.thisobjectsclass MARGIN-LEFT = MINUS 1/2 THE OBJECT'S WIDTH. */
  position: relative;
  left: 50%;
}

.center-y {  /* VERTICAL. COMBINE WITH UNIQUE CLASS FOR THE OBJECT, .center-y.thisobjectsclass, AND GIVE .center-x.thisobjectsclass MARGIN-TOP = MINUS 1/2 THE OBJECT'S HEIGHT. */
  position: relative;
  top: 50%;
}

.justify {
  text-align: justify;
}

  body { 
    background-color: rgb(229, 220, 185); 
    text-align: center;
    font-family: verdana,arial,sans-serif;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    font-size: 11px;
    line-height: normal;
    }
 /*   
  body.modal {
    background-color: transparent;
    background-image: url(images/modal-green-tile.png); 
    }
*/

  #wrapper { margin: auto;
    text-align: left;
    width: 976px;
    position: relative;
    padding-top: 68px;
    }

  #body { background: transparent url(images/body-bg-pond-lake-colors.png) repeat-y scroll 0%;
    color: white;
    width: 100%;
    }

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

  #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.png) no-repeat scroll left top;
    /*position: absolute;
    top: 12px;
    left: 331px;*/
    float: right;
    clear: both;
    margin-top: 12px;
    margin-right: 19px;
    width: 624px;
    height: 11px;
    }

  #body-nowelcome { background: transparent url(images/body-bg-projectpage-pond-lake-colors.png) repeat-y scroll 0%;
    color: white;
    width: 100%;
    }

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

  #body-top-2-nowelcome { background: transparent url(images/body-top-2-projectpage-pond-lake-colors.png) no-repeat scroll left top;
   /* position: absolute;
    top: 12px;
    left: 13px; */
    float: right;
    margin-top: 12px;
    margin-right: 21px;
    width: 943px;
    height: 11px;
    }

/*
  #wrapper { position: relative;
    padding-top: 68px;
    }
*/

  #toplogo { margin-left: 20px; 
    width: 256px; 
    height: 64px;
    position: absolute;
    top: 2px;
    left: 2px;
}

  #nav-top { position: absolute;
    top: 43px;
    left: 336px;
    }

  #nav-top a { 
  /* background-image: url(images/menu.gif);*/
    /* width: 122px; */ 
    height: 19px;
    display: inline;
    float: left;
    font-family: Arial,Helvetica,sans-serif;
    /* font-size: 15px; */
    text-align: center;
    padding-top: 6px;
    text-decoration: none;
    color: rgb(242, 247, 248);
    font-weight: bolder;
    }

  #nav-top a:hover { color: rgb(207, 204, 191);
    }
 
#nav-top a.dir:hover {
	text-decoration: underline;
}


  #body-bot { padding-top: 12px;
    }

  #welcome { 
    position: relative;
    float: left;
    width: 321px;
    height: 100%;
    margin-left: 12px;
    margin-bottom:5px;
    background: url(images/bkgnd-green.png) repeat-y;
    padding-bottom: 10px;
     /*width: 314px;*/
    }

  #welcome a { color: rgb(242, 247, 248);
    }

  #welcome a:hover { color: rgb(207, 204, 191);
    }
    
  #welcome a.dashed {
  text-decoration: none;
  border-bottom: 1px dashed rgb(242, 247, 248);
  /* color: #006666; Oldengreen too confusing, per LP. Stick to default blue */
}

  #welcome a.dashed:hover { 
  border-bottom-color: rgb(207, 204, 191); 
}


  #welcome h2 { margin: 11px;
    text-align: center;
    color: rgb(206, 176, 133);
    font-size: 24px;
    }

  #welcome h2 a { color: rgb(206, 176, 133);
    text-decoration: none;
    }

	#welcome h3 { 
    color: #ceb085;
  }
  	
  #welcome p, ul { margin: 0px 19px;
    }

  #welcome ul, li {
    /*list-style-position:outside;*/
    margin-left: 15px;
  }
  
  #welcome .more { margin-top: 18px;
    margin-bottom: 10px;
    }
    

/* ALTERNATE THESE SIDEBAR FEATURES PER projects.php. FIRST IS div class=feature, SECOND IS div class=feature f-right, THIRD IS div class=feature AGAIN. CAPTIONS WILL NEED INDIVIDUAL VERTICAL ALIGNMENT. */

  #welcome .feature {
	width: 305px;
	padding-left: 5px;
	margin-right: 6px;
	margin-top: 50px;
	margin-bottom: 15px;
	text-align: left;
	} 

  #welcome .feature p {
	margin-top: 5px;
	}
	
  #welcome .feature img, 
  #welcome .feature div#simplegallery1 {
	float: left; 
	margin-right: 6px;
	margin-bottom: 20px;
	}
 
  #welcome .feature div#simplegallery1 img {
	margin-right: 0px;
}
  #welcome .f-right {
	text-align: right;
	margin-top: 50px;
	} 

  #welcome .f-right img,
  #welcome .f-right div#simplegallery1 {
	float: right; 
	margin-left: 6px;
	}

  #welcome .f-right div#simplegallery1 img {
	float: none; 
	margin-left: 0px;
}

  #welcome .testimonial_block h2 {
	font-style: italic;
	margin-top: 0px;
	}

  #welcome .testimonial_block {
	text-align: center;
	font-style: italic;
	font-size: 14px;
	margin-bottom: 5px;
	}
	
	#welcome .testimonial_block ul {
  text-align: left;
  }
	
	#welcome .testimonial_block p {
	margin-bottom: 5px;
	}
	
	#welcome .testimonial_block li {
	margin-bottom: 10px;
	}
	
	#in-the-news #welcome .testimonial_block li span {
	font-size: 80%;
	margin-left: 14px;
	}

  #welcome .blurb_yellow {
	font-style: italic; 
	text-align: center; 
	font-size: 14px;
	color: rgb(255, 204, 102);
	}

/** BUTTONS **/

#welcome div.buttons {
  position: relative;
  height: 33px;
  width: 300px;
  margin-left: 8px;
  margin-bottom: -15px;
}

#home #welcome div.buttons.buttondisplay {
  margin-bottom: 15px;
}

#content div.buttons.right {
  position: absolute;
  height: 40px;
  width: 300px;
  margin-bottom: 0px;
  top: 105px;
  left: 315px;
}


	
#welcome a.get-started, #welcome a.news-rates, #welcome a.in-the-news, #content a.in-the-news, button.send, button.get-started {
    margin: 20px auto 10px;
    display: block;
    /*color: #dcd57a;*/
  	color: rgb(240, 238, 72);
    text-align: center;
    font-style: italic;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: bold;
  }
  
#welcome a.get-started, button.get-started {
    background: url(images/start-button_sprite.png) no-repeat 0 108%;
    width: 159px;
    height: 50px;
    line-height: 42px;
    font-size: 21px;
}

button.get-started, button.send {
    margin: auto;
    border: none;
    padding-bottom: 4px;
    padding-right: 13px;
}

button.send { /* SAME AS PURPLE GET-STARTED BUTTON BUT SMALLER */
    background: url(images/send-button_sprite.png) no-repeat 0 100%;
    width: 105px;
    height: 30px;
    font-size: 14px;
 }
 

  #welcome a.get-started:hover, button.send:hover, button.get-started:hover {
    color: #7ac445;
  }
  
a.get-started-text {
  color: #8f45c4; /* SAME PURPLE AS GET-STARTED BUTTON */
}
  
#welcome a.news-rates:hover {
    color: #85d65d;
}
    
  #welcome a.get-started:active, button.send:active {
    background-position: 0 -12%;
    color: #7ac445;
  }
  
#welcome a.news-rates {
    position: absolute;
    background: url(images/news-rates-button_sprite.png) no-repeat 0 93%;
    width: 59px;
    height: 33px;  /* <<< MAKE LARGER HEIGHT SO SHADOW SHOWS FULLY, THEN ADJUST BACKGROUND TOP %  */
    line-height: 28px;
    font-size: 14px;
    top: -12px;
}
#welcome a.news-rates.right {
  right: 0%;
}
#welcome a.news-rates.rates {
  text-indent: -8px;
  letter-spacing: -0.05em;
}
#welcome a.news-rates:active {
  background-position: 0 0;
}


/*
a.in-the-news {
    background: url(images/in-the-news-button_sprite.png) no-repeat 0 100%;
    width: 156px;
    height: 33px;
    line-height: 25px;
    font-size: 14px;
    color: #c58f44;
}
a.in-the-news:active {
  background-position: 0 0;
}
*/
a.in-the-news {
    background: url(images/animate-in-the-news_lens-flare2.gif) no-repeat 0 20%;
    width: 156px;
    height: 33px;
    line-height: 25px;
    font-size: 14px;
    position: relative;
}

#welcome a.in-the-news {
	color: rgb(255, 204, 102);
}
#content a.in-the-news {
	color: rgb(255, 204, 102);
	margin-bottom: 0px;
}
#welcome a.in-the-news:hover {
  color: rgb(235, 156, 0);
}

a.in-the-news.animated img.animate-in-the-news {
  width: 156px;
  height: 33px;
  margin-top: 0px;
  margin-left: 0px;
}
a.in-the-news.animated img.animate-in-the-news.link {
  visibility: visible;
}
a.in-the-news.animated:active img.animate-in-the-news.link {
  visibility: hidden;
}
a.in-the-news.animated img.animate-in-the-news.active {
  visibility: hidden;
  position: absolute;
  left: 0;
}
a.in-the-news.animated:active img.animate-in-the-news.active {
  visibility: visible;
}
a.in-the-news.animated span {
  z-index: 999;
  clear: none;
  position: absolute;
  left: 23px;
  top: 0px;
}
/*
a.in-the-news.animated img.animate-in-the-news {
  width: 153px;
  height: 27px;
  margin-top: 0px;
  margin-left: 0px;
}

a.in-the-news.animated:active img.animate-in-the-news {
  visibility: hidden;
}
*/

  #sidenav { 
  background-image: url(images/menu-side.png);
  width: 334px;
  height: 42px;
  position: static;
  margin-top: -2px;
  margin-bottom: 8px;
  margin-left: -12px;
  text-align: center;
/* background-image: url(images/menu_side3.gif);
  Should be 314px or 100%, but some glitch makes it lose 1px on first one side, then other when zoom is changed in Firefox and Chrome, though not IE. Hacked by expanding bg image 2px and shifting 1px left to ensure overlap on both sides. 
    width: 316px;
    height: 38px;
    position: relative;
    top: -2px;
    margin-left: -1px;
    margin-top: 0px;
    margin-bottom: 8px;*/
    }

  #sidenav div.left_tab, #sidenav div.right_tab {
    width: 140px;
    text-align: center;
    margin-top: 13px;
  }
  
  #sidenav div.left_tab {
    margin-left: 25px;
    float: left;
  }
  
  #sidenav div.right_tab {
    margin-right: 20px;
    float: right;
  }
  
  #sidenav a { 
    display: inline;
    /*float: left;*/
    font-family: Arial,Helvetica,sans-serif;
    font-size: 15px;
    text-align: center;
   /* margin-left: 67px;
    margin-left: 2.9em;
    margin-right: 1.8em;*/
    text-decoration: none;
    font-weight: bolder;
    }

  #current {
    color: rgb(136, 191, 64);
   }

  #sidenav #current { color: rgb(136, 191, 64);
    }

  #sidenav a:hover { text-decoration: underline;
    }
    
  
 #content { 
    position: relative;
    float: right;
    width: 578px;
    padding-right: 34px;
    padding-top: 23px;
    /*color: rgb(104, 100, 84);*/
    }

  #content .left { margin-right: 10px;
    }

  #content a, #content-nowelcome a { 
	color: rgb(90, 86, 68);
    }

  #content a:hover, #content-nowelcome a:hover { color: rgb(38, 36, 26);
    }
    
  #content a.dashed {
  text-decoration: none;
  border-bottom: 1px dashed rgb(90, 86, 68);
}

  #content a.dashed:hover { 
  border-bottom-color: rgb(38, 36, 26); 
}


  #content-nowelcome { float: right;
    width: 910px;
    padding-right: 34px;
    padding-top: 23px;
    /*color: rgb(104, 100, 84);*/
    }
    
  #content-nowelcome h1 {
    position: static;
    margin-top: 18px;
    font-variant: normal;
 }

  #content-nowelcome .left { margin-right: 10px;
    }



/*** SOCIAL MEDIA ***/
/* AddToAny widget. On content pages, placed at right of top heading. On welcome pages, at bottom of welcome sidebar, seemingly below the green.  */
.a2a_dd {
  clear: both;
}

#content .a2a_dd, #content-nowelcome .a2a_dd {
  width: 171px;
  float: right;
  margin-top: -33px;
}

#welcome .a2a_dd {
  display: block;
  width: 321px;
  background: url(images/body-bg-pond-lake-colors-welcome-section2.png) repeat-y ;
  padding-top: 10px;
  padding-left: 72px;
  margin-bottom: -10px;
}

/*** AddThis widget ***/

.center-x.addthis_toolbox {
  width: 300px;
  margin: 15px auto 15px -154px;
}

#hominy-valley_home .heading_wrapper {  /* VERTICAL CENTERING OF H1. WRAPPER, DEFINE HEIGHT; LINE-HEIGHT = HEIGHT. H1, DISPLAY INLINE. ONLY WORKS IF H1 IS SINGLE LINE OF TEXT.  */
  height: 22px;
  /*line-height: 22px;*/
}

#hominy-valley_home .heading_wrapper h1 {
  display: inline;
}

#hominy-valley_home .addthis_wrapper {
  width: 300px;
  float: right;
  height: 22px;
  margin-right: 154px;
}

#hominy-valley_home .center-x.addthis_toolbox {
  height: 22px; 
  margin: 0px;
}  

.addthis_toolbox.addthis_pill_combo a {
    float: left;
}
.addthis_toolbox.addthis_pill_combo a.addthis_button_tweet,
.addthis_toolbox.addthis_pill_combo a.addthis_counter {
    margin-top: -2px;
}
.addthis_button_compact .at15t_compact {
    margin-right: 4px;
    float: left;
}

.banner {
  width: 540px;
  height: 90px;
  text-align: center;
}

.beshrink {
  font-size: 80%;
}

.embiggen {
  font-size: 120%;
}

.redtest {
  background: red;
}

  
  #intro { margin: 12px;
    }

  .project_description { font-weight: bold;
    }

  .fineline { border-bottom: 1px solid rgb(211, 202, 169);
    margin-bottom: 12px;
    }

  .fineline-flat { border-bottom: 1px solid rgb(211, 202, 169);
    margin-top: 10px;
   }

  .fineborder { border: 1px solid rgb(211, 202, 169);
    padding: 2px;
    width: 186px;
    margin-bottom: 12px;
    }

  .bar-lit { background: transparent url(images/bar_lit.gif) no-repeat scroll 0px 4px;
    padding-left: 6px;
    }

  .bar-drk { background: transparent url(images/bar_drk.gif) no-repeat scroll 0px 4px;
    padding-left: 6px;
    }

  #picbar { margin: 2px 0pt 19px;
    background: rgb(163, 161, 137) none repeat scroll 0%;
    width: 415px;
    }

  #arr-left, #arr-right { float: left;
    width: 15px;
    }


/** POP-UP WINDOW **/

.popup {   /* THESE ARE A LITTLE DARKER THAN #content DEFAULT, SO POPUP WILL "POP OUT". ADJUSTED BY -6% ON B IN H-S-B COLOR MODEL. */ 
  color: #5a5749;
}

.popup a { 
	color: #4b4839;
}

.popup a:hover { 
  color: #171610;
}

/* POPUP CLOSE BUTTON FORMAT: <a class="popup-close right" href="javascript:window.close()">Close this window</a>
 */
a.popup-close {
  display: block;
  font-size: 9px;
  font-weight: bold;
  font-style: italic;
  height: 16px;
  width: 40px;
  text-align: left;
  background: url(images/popup-close-button.png) no-repeat ;
  padding-left: 20px;
  margin-bottom: 5px;
}



#home #content .box {
  position: relative; 
  top: 3px;
  margin-bottom: 10px;
}

#home #content .habitat {
  width: 125px; 
  height: 145px;
}

#home #content .stormwater {
  width: 91px; 
  height: 168px;
}

#home #content .stonework {
  width: 100px;
  height: 95px;
}

#home #content .streamrepair {
  width: 157px;
  height: 110px;
}

#badge_box {
  width: 100%;
  height: 180px;
  text-align: center;
  margin-top: 30px;
}

#badge_box .left {
  width: 110px;
}

#badge_box .middle {
  float: left;
  width: 370px;
}

#badge_box .middle p {
  text-align: justify;
  clear: both;
}

#badge_box .right {
  width: 70px;
}

#badge_box img {
  border: none;
  margin-bottom: 8px;
}

#badge_box .landscape_contractor_seal_sm {
  width: 86px; 
  height: 85px;
} 

#badge_box .upslogo {
  width: 64px; 
  height: 80px;
}

#badge_box .asheville-chamber {
  width: 85px; 
  height: 33px;
  float: left;
  margin-left: 10px;
  margin-top: 5px;
}

#badge_box .ncnla_logo_med {
  width: 100px; 
  height: 39px;
  float: left;
  margin: 5px 30px auto;
}

#badge_box .planetlogo_sm {
  width: 104px; 
  height: 25px;
  float: right;
  margin-right: 10px;
  margin-top: 10px;
}

#badge_box .rain-garden-certified-logo {
  width: 55px; 
  height: 92px;
}

#badge_box .eco_logo {
  width: 69px; 
  height: 80px;
  margin-top: 0px;
}

#home .paypal {
  width: 100%;
  margin-bottom: 5px;
}

#home .paypal img {
  width: 174px;
  height: 50px;
}

#rates .paypal {
  height: 47px;
  margin: 10px 0 ;
}

.pay-now-button {
  width: 108px; 
  height: 47px;
}

  .picbox { border: 1px solid rgb(139, 132, 106);
    margin: 5px 0px 5px 4px;
    padding: 2px;
    float: left;
    width: 117px;
    }

  #picbar img { display: block;
    }

  #arr-right { margin-left: 4px;
    }

  #planer { border-right: 1px solid rgb(211, 202, 169);
    float: left;
    width: 186px;
    padding-right: 20px;
    padding-top: 5px;
    }

  #stories { float: right;
    width: 195px;
    padding-top: 5px;
    }

  #planer p, #stories p { margin: 4px 0px;
    }

  #planer .more, #stories .more { margin: 12px 0px;
    }

  .clear-flat { margin-bottom: 4px;
    }

/* FOOTER STYLES MOVED TO SEPARATE STYLESHEET TO ENSURE UNIFORMITY ACROSS SITE */


  .style4 { font-weight: bold;
    font-size: 16px;
    color: #5C7E29;
    }

  .style4 a:hover { color: rgb(104, 100, 84);
    text-decoration: underline;
    }

  .formfield { /*border-color: rgb(90, 86, 68);
    background-color: #e6efde;*/
    border: 2px inset rgb(90, 86, 68);
    background-color: #e6efde;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    margin-top: 4px;
    }
    
   .budgetline {
border-color: rgb(90, 86, 68);
background-color: #e6efde;
width: 60px;
}

    
  #getting_started input:focus,
  #getting_started select:focus,
  #getting_started textarea:focus {
    background-color: #f8f8f8;
    }
    
/* ONLY USED IN response_page.php */
  span.tooltip { font-weight: bold; 
    font-style: italic;
    }
  span.tooltip:hover { color: rgb(84, 78, 56);
    }

/* INFO BOXES IN CONTENT AREA. colorbox color IS BETTER METHOD. */
  .bluebox { border: ridge rgb(179, 170, 135);
    background-color: rgb(204, 244, 255);
	padding-right: 6px;
	padding-left: 6px;
    }
    
.colorbox { border: 2px ridge;
	padding: 6px;
	display: inline-block;
}
.colorbox {
	display: inline;
	/* HACK FOR STUPID BROWSERS -- I.E., IE */
}
html>body .colorbox {
	display: inline-block;
}
.colorbox.green { border-color: rgb(92, 126, 41); /* H2 AND style3 COLOR */
  background-color: rgb(231, 254, 225); /* RELATED TO LIGHT BLUE PAGE BACKGROUND */
}
.colorbox.tan { 
  border-color: rgb(92, 126, 41); /* H2 AND style3 COLOR */
}
.tan {
  background-color: rgb(254, 248, 225); /* RELATED TO LIGHT BLUE PAGE BACKGROUND */
}

.sidebarbox { border: ridge rgb(229, 220, 185);
background-color: rgb(204, 244, 255);
color: rgb(104, 100, 84);
text-align: left;
font-style: italic;
width: 260px; margin: 40px auto 4px auto;
padding: 5px;
}

.sidebarbox a { color: rgb(90, 86, 68);
}

.sidebarbox a:hover { color: rgb(38, 36, 26);
}



/*** CSS TOOLTIP ***/
/** Specify span position and size separately. Span is just after closing \a, so a sibling. If a dummy link, using "#", for sake of tooltip only, add class "dashed" to a href for dashed underline. **/

a.tooltip {
  position: relative;
}

a.tooltip span {
  display: none;
  }
 
a.tooltip:hover {
  background-color: transparent;
  border-bottom: 0px;
  }
/* The above hover change defeats the
  IE/Win display changing bug */
 
a.tooltip:hover span {
  position: absolute;
  display: block;
  background-color: #fef8e1;
  /*background: rgb(224, 245, 254);*/
  border: 1px solid #5978a6;
	padding: 4px;
	font-size: 11px;
	font-style: normal;
	color: #226d28;
	text-align: justify;
	z-index: 999;
  }

#winter_flowers a.tooltip span {
  width: 160px;
  top: 25px;
}

#winter_flowers a.tooltip span.pansies {
  left: -54px;
}

#winter_flowers a.tooltip span.cyclamen {
  left: -105px;
}
#winter_flowers a.tooltip span.cabbage {
  left: -18px;
}
#winter_flowers a.tooltip span.hellebores {
  left: -23px;
}

/* TITLETIP imitates generic browser title tag but allows positioning. Same logic as tooltip class, but name changed to avoid confusion. Only using in nav-top so far. Note the use of plus selector, which IE8 will not recognize. */

a.titletip, #nav-top a.dir {
  position: relative;
}

a.titletip+span, #nav-top a.dir+span, #footer a.dir+span {
  display: none;
}
/* Above: Hide in footer. */
 
a.titletip:hover, #nav-top a.dir:hover {
  background-color: transparent;
  border-bottom: 0px;
}
/* The above hover change defeats the
  IE/Win display changing bug */
 
a.titletip:hover+span, #nav-top a.dir:hover+span {
  position: absolute;
  display: block;
  height: 22px;
  background-color: transparent;
	padding-left: 4px;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
  font-family: tahoma,arial narrow,sans-serif;
  text-decoration: none;
	color: black;
	text-align: left;
	z-index: 999;
}


#nav-top a.dir:hover+span { /* POSITION ABOVE TABS */
  top: -25px;
  left: 40px;
  background: no-repeat 0px 1px ;
}

#nav-top a.dir:hover+span.home {
  background-image: url(images/titletips/home.png);
  width: 218px;
}

#nav-top a.dir:hover+span.services {
  left: 152px;
}

#nav-top a.dir:hover+span.projects {
  left: 274px;
}

#nav-top a.dir:hover+span.services, #nav-top a.dir:hover+span.projects {
  background-image: url(images/titletips/services.png);
  width: 229px;
}

#nav-top a.dir:hover+span.about_us {
  background-image: url(images/titletips/about_us.png);
  width: 235px;
  left: 396px;
}

#nav-top a.dir:hover+span.contact_us {
  background-image: url(images/titletips/contact_us.png);
  width: 244px;
  left: 488px;
}


/*   */

div.divider_rule {
  margin: 15px 7% ;
  height: 1px;
  border-top: 1px solid #22416d;
}
 
.divider_flower { background: url(images/decorative/divider-flower.gif) repeat-x;
  height: 8px;
  width: 48px;
  margin: 0.8em auto;
 }

input.my-url { display: none;
  }

tbody h2 {
   font-size: 20px;
  }

/* INLINE CAPTION ARROWS, USING images\arrow_up11px.gif, arrow_down11px.gif, arrow_left11px3.gif, arrow_right11px3.gif. USE left AND right CLASS WITH arrowup AND arrowdown, BUT GENERIC left, right CLASS PROPERTIES CANCELLED HERE. */
.arrowup, .arrowright, .arrowdown, .arrowleft {
  position: relative;
}

.arrowup, .arrowdown {
  top: 5px;
}

.arrowright, .arrowleft {
  top: 1px;
}

.arrowright, .arrowup.right, .arrowdown.right {
  margin-left: 4px;
}

.arrowleft, .arrowup.left, .arrowdown.left {
  margin-right: 4px;
}

 .arrowup.right, .arrowdown.right, .arrowup.left, .arrowdown.left {
  padding: 0px;
  float: none;
}

/*
.arrowleft {
   position: relative;
   top: 1px;
   margin-right: 4px;
  }

.arrowright {
   position: relative;
   top: 1px;
   margin-left: 4px;
  }

.arrowdown {
   position: relative;
   top: 6px;
   margin-left: 4px;
  }
*/

.treebullet {
float: left; 
margin-top: 2px;
}

.treebutton {
  background: url(images/tree_button3.gif) no-repeat center;
  height: 70px;
}

#home .treebutton { 
  height: 65px;
} 

caption {
 caption-side: bottom;
}

.caption, .viewlarger {
  font-size: 80%;
  font-style: italic;
}

.viewlarger {
  width: 52px;
  float: right;
}

div.caption.welcome-pic {
  width: 314px;
  background: url(images/bkgnd-dark-blue.png) repeat-y;
  margin-bottom: 2px;
}
div.caption.welcome-pic img {
  border-bottom: 1px outset rgb(50, 86, 68) ;
}
div.caption.welcome-pic p {
  position: relative;
  padding: 3px 5px 7px;
  width: 80%;
  left: 10px;
}
#home #content .caption {
font-size: 10px;
font-weight: bold;
}

.testimonial {
border: thin groove rgb(104, 100, 84);
padding: 0px;
margin-bottom: 10px;
}

.testimonial p {
border: thin ridge white;
margin: 0px;
padding: 10px;
}

.testimonial img.testimonial {
border: medium ridge rgb(139, 102, 106); 
}

.photo_tables {
text-align: center;
}
.photo_tables table {
margin-left: auto;
margin-right: auto; 
margin-bottom: 25px;
text-align: center; }

.table-1 {
width: 430px;
}

.table-2 {
width: 900px;
}

.table-3 {
width: 912px;
}


#hominy-valley_home .section {
  width: 300px;
  padding-top: 5px;
  padding-bottom: 10px;
  border-top: 1px solid rgb(84, 78, 56);
  margin-top: 10px;
}

#hominy-valley_home .colorbox.green.introtext {
  width: 300px;
  position: absolute;
  right: 100px;
  top: 135px;
}


/* "ONE YEAR LATER" PHOTO THUMBNAILS UNDER EACH HOMINY VALLEY "AFTER" PHOTO. NOTE THAT THIS CSS CONTAINS STANDARD BUT HARD-T0-FIND-DOCUMENTED CENTERING TRICKS -- MARGIN L/R: AUTO FOR HORIZONTAL CENTERING OF DIV, LINE-HEIGHT = HEIGHT FOR VERTICAL CENTERING OF SINGLE LINE OF TEXT. */

.year_later {
position: relative;
width: 700px;
height: 73px;
line-height: 73px;
margin: -20px auto 30px;
}
.year_later img {
width: 98px;
height: 73px;
float: left;
margin-left: 6px;
}
.year_later .boxleft {
float: left;
width: 200px;
height: 73px;
}
.year_later .boxright {
float: right;
width: 200px;
height: 73px;
}
.caption_raise {
vertical-align: top;
}

.gotonextpage {
margin-left: auto;
margin-right: auto;
font-weight: bold;
font-size: 16px;
color: #5C7E29;
height: 90px;
line-height: 90px;
}

.gotonextpage img {
padding-right: 6px; 
float: left;
}

.nav li.current a.dir, 
.nav ul li.current a { /*color: #40b586 !important;*/
color: rgb(136, 191, 64) !important;
}

ul.pipe-menu li {
  display: inline;
	 border-left: 1px solid rgb(78, 74, 58);
	 width: auto;
	 padding-left: 15px;
	 padding-right: 0px;
	 padding-bottom: 2px;
	 height: 15px;
}
	
ul.pipe-menu li:first-child,
ul.pipe-menu li:first-child a {
	 border-left: none;
	 padding-left: 0px;

}


.article {
  padding: 5px;
  margin-bottom: 20px;
  border: thin groove rgb(104, 100, 84);
  background-color: rgb(242, 247, 248);
  width: 578px;
  margin-left: -5px;
}

.article h3 {
  margin-top: 5px;
}

.article .section { 
  clear: both;
  margin-top: 10px;
}

#in-the-news .article#hominy-valley-2010 .section h3 {
  margin-bottom: 10px;
}
#in-the-news .article#hominy-valley-2010 .section.act-photo-gallery {
  position: relative;
  top: 20px;
  height: 200px;
}

#stonework .stone_header { 
  background: url(images/decorative/snowstone-fading-background.png) no-repeat;
	width: 908px;
	height: 148px;
	padding: 20px 0px 0px;
	margin-bottom: 0px;
	text-align: center;
}

#stonework.page .subwrapper {
  width: 100%;
  height: 230px;
  position: relative;
}

#stonework.page.nogallery .subwrapper {
  height: 96px;
}

#stonework.page .addthis_toolbox { /* STYLES socialmedia_vertical.php */
  width: 140px;
  height: 96px;
  margin: 25px 30px 0 0; /* SAME margin-top AS .stone_header */
  position: absolute;
  top: 0px;
  right: 0px;
}

#stonework.page .addthis_toolbox a {
  margin-bottom: 10px;
}

#stonework.page.nogallery .addthis_toolbox {
  margin-top: 0px;
}

#stonework.page .stone_header { 
  background: url(images/decorative/snowstone-fading-background_sm2.png) no-repeat;
	width: 180px;
	height: 212px;
	padding: 8px;
	margin-top: 25px;
	margin-bottom: -10px;
}

/** REMOVE nogallery FROM BODY CLASS IF YOU INSTALL GALLERY IN fire OR water PAGE. THIS GIVES HORIZONTAL LINKS ON TOP OF PAGE. **/
#stonework.page.nogallery .stone_header { 
  background: url(images/decorative/snowstone-fading-background_nogallery.png) no-repeat;
	width: 485px;
	height: 80px;
	margin-top: 20px;
}

#stonework .stone_header p {
	font-weight: bold;
	color: rgb(18, 0, 0);
}

#stonework .links-wrapper {
  text-align: left;
  margin-left: 25px;
}

#stonework.page .links-wrapper {
  margin-left: 0px;
}

#stonework .stone_header .link {
  width: 200px;
  float: left;
  margin-right: 20px;
}

#stonework.page .stone_header .link {
  width: 150px;
  float: left;
  clear: left;
}

#stonework.page.nogallery .stone_header .link {
  clear: none;
  margin-right: 5px;
}

#stonework.page .stone_header .link.current {
  display: none;
}

#stonework .stone_header .thumbnail, #stonework .stone_header div.thumbnail {
  width: 100px;
  height: 75px;
  border: 2px outset rgb(156, 111, 48);
}

#stonework.page .stone_header .thumbnail, #stonework.page .stone_header div.thumbnail {
  width: 50px;
  height: 38px;
}

#stonework .stone_header a div.thumbnail {
  width: 100px;
}

/** STONEWORK HOVER SPRITES, FULL SIZE **/

#stonework .stone_header .fireplaces a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-fireplaces-by-ambrose-landscapes_sprite.jpg) no-repeat 0 0;
}

#stonework .stone_header .fireplaces a:hover div.thumbnail {
  background-position: -100px 0;
}

#stonework .stone_header .walls a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-walls-by-ambrose-landscapes_sprite.jpg) no-repeat 0 0;
}

#stonework .stone_header .walls a:hover div.thumbnail {
  background-position: -100px 0;
}

#stonework .stone_header .channels a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-channels-by-ambrose-landscapes_sprite.jpg) no-repeat 0 0;
}

#stonework .stone_header .channels a:hover div.thumbnail {
  background-position: -100px 0;
}

#stonework .stone_header .patios a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-patios-by-ambrose-landscapes_sprite.jpg) no-repeat 0 0;
}

#stonework .stone_header .patios a:hover div.thumbnail {
  background-position: -100px 0;
}

/** STONEWORK HOVER SPRITES, SMALL **/

#stonework.page .stone_header .fireplaces a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-fireplaces-by-ambrose-landscapes_sprite_sm.jpg) no-repeat 0 0;
}

#stonework.page .stone_header .walls a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-walls-by-ambrose-landscapes_sprite_sm.jpg) no-repeat 0 0;
}

#stonework.page .stone_header .channels a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-channels-by-ambrose-landscapes_sprite_sm.jpg) no-repeat 0 0;
}

#stonework.page .stone_header .patios a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-patios-by-ambrose-landscapes_sprite_sm.jpg) no-repeat 0 0;
}

#stonework.page .stone_header .fireplaces a:hover div.thumbnail, #stonework.page .stone_header .walls a:hover div.thumbnail, #stonework.page .stone_header .channels a:hover div.thumbnail, #stonework.page .stone_header .patios a:hover div.thumbnail {
  background-position: -50px 0;
}


/*
#stonework .stone_header .patios a div.thumbnail {
  /*background: url(projects/stonework_samples/images/thumbnails/stone-patios-tables-and-chairs-by-ambrose-landscapes.jpg);
  }
  
  #stonework .stone_header .patios a:hover div.thumbnail {
  /*background: url(projects/stonework_samples/images/thumbnails/stone-patios-firepits-by-ambrose-landscapes.jpg);
  }
  
#stonework .stone_header .walls a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-walls-retaining-walls-by-ambrose-landscapes.jpg);
}

#stonework .stone_header .walls a:hover div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-walls-stone-pillars-by-ambrose-landscapes.jpg);
}

#stonework .stone_header .channels a div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-water-channels-drains-by-ambrose-landscapes.jpg);
}

#stonework .stone_header .channels a:hover div.thumbnail {
  background: url(projects/stonework_samples/images/thumbnails/stone-water-channels-waterfalls-by-ambrose-landscapes.jpg);
}
*/

#stonework .stone_header .link h2 {
  font-size: 14px;
  font-weight: bold;
  color: rgb(18, 0, 0);
  margin-top: 5px;
}

#stonework.page .stone_header .link h2 {
  font-size: 10px;
  margin-top: 2px;
}

#stonework .home-text {
  font-weight: bold;
}

#stonework .home-text ul {
/*  display: inline;*/
  margin-left: 200px;
}

/*#stonework .links {
  height: 75px;
  width: 700px;
  margin: 0 auto;
  background-image: url(images/decorative/fieldstones-background3.png) ;
}

#stonework .links a {
  margin-right: 30px;
  line-height: 50px;
}
*/

#stonework h2 {
  margin-bottom: 5px;
}

#stonework h4 {
  margin-bottom: 5px;
}

/*#stonework .caption h4, #stonework caption h4, #stonework p h4 {
  display: inline;
}
*/
#stonework div.stonework-section {
  padding-top: 10px;
  clear: both;
  /*border-top: 1px solid gray;*/
}

#stonework .stonework-sub-section {
  width: 910px;
  margin-bottom: 20px;
  clear: both;
  position: relative;
  border-top: 1px solid gray;
  padding-top: 10px;
}

#stonework .caption.left {
  text-align: right;
}

#stonework .caption.right {
  text-align: left;
}

#stonework .caption span, #stonework caption span {
  font-weight: bold;
}

#stone-pillar-monument-plaque p {
  font-style: italic;
}

#stone-outdoor-fireplace-beehive {
  height: 400px;
}

#stone-outdoor-fireplace-beehive .side, #stone-outdoor-fireplace-beehive .middle {
  width: 275px; 
}

#stone-outdoor-fireplace-beehive .side.leftside {
  float: left;
  clear: left;
}

#stone-outdoor-fireplace-beehive .middle {
  float: left;
  width: 275px; 
  margin-left: 42px;
  margin-top: -25px;
}

#stone-outdoor-fireplace-beehive .side.rightside {
  float: right;
}

#stone-outdoor-fireplace-beehive .side div.center-x {
  width: 183px; 
  margin-left: -91px; 
  margin-bottom: 5px; 
}

/*
#hominy-valley-2010-popup div.popup {
  position: absolute;
  left: 163px;
  top: 223px;
}
*/
body#hominy-valley-2010.popup {
  width: 366px;
}
body#hominy-valley-2010.popup div.article {
  width: 100%;
  height: 100%;
  text-align: left;
  padding: 10px;
}

/*** SIMPLEGALLERY PHOTO CAROUSEL  ***/

#stonework.page .simplegallery-wrapper {
  position: absolute;
  left: 263px;
  top: -65px;
}

#simplegallery1 { 
position: relative; /*keep this intact*/
visibility: hidden; /*keep this intact*/
  border: 5px outset rgb(156, 111, 48);
/*border: 5px outset rgb(18, 0, 0);*/
}

#welcome .feature #simplegallery1 { 
  border: 0px;
}

#simplegallery1 .gallerydesctext { 
text-align: center;
padding: 2px 5px;
font-weight: bold;
}

#stonework.page #simplegallery1 {
  height: 281px;
}

#stonework.stone-home .simplegallery-wrapper {
  width: 160px;
  height: 210px;
  float: left;
  margin: 0px 10px 15px 0px ;
}

#stonework.page #stone-waterfall-pond .simplegallery-wrapper {
  clear: right; 
  position: static;
  width: 333px; 
  height: 280px;
  margin-top: 50px;
}
  
#stonework.page #stone-waterfall-pond #simplegallery1 {
  border: none;
}

#stonework.page #stone-waterfall-drain .imagediv333 {
  margin-top: 15px;
}

#hominy-valley_home #simplegallery1 {
  border: 1px solid rgb(84, 78, 56);
  width: 400px;
  height: 300px;
  margin-bottom: 10px;
}

#contactform {
  width: 400px;
  float: right;
  margin-top: 15px;
}

#contact-us .phone {
  margin-top: 15px;
}

#webmaster {
  margin-top: 113px;
  font-weight: normal;
}

/* GENERIC PHOTO LAYOUTS IN PROJECT PAGE, EFFECTIVE WIDTH 900PX. SEE STONEWORK PAGE. */

div.imagediv535 { /* FOR IMG 535 x 401 AND SPACE FOR ONE-LINE CAPTION */
  width: 535px;
  height: 421px;
}

div.imagediv333 { /* FOR IMG 333 x 250 AND SPACE FOR ONE-LINE CAPTION */
  width: 333px;
  height: 290px;
}

.two-landscapes-symmetrical_caption-center {
  width: 900px;
  height: 263px;
  clear: both;
}

.two-landscapes-symmetrical_caption-center div {
  height: 100%;
}

.two-landscapes-symmetrical_caption-center div.left, .two-landscapes-symmetrical_caption-center div.right {
  width: 350px;
}
#stone-table-chairs.two-landscapes-symmetrical_caption-center div.left, #stone-table-chairs.two-landscapes-symmetrical_caption-center div.right {
  width: 400px;
  height: 300px;
  margin-bottom: 20px;
}

.two-landscapes-symmetrical_caption-center div.caption {
  width: 170px;
  float: left;
  text-align: justify;
  padding-right: 5px;
}
#stone-table-chairs.two-landscapes-symmetrical_caption-center div.caption {
  width: 70px;
  word-spacing: -.3em;
}

.two-landscapes-symmetrical_no-caption {
  width: 100%;
  height: 358px;
  clear: none;
}

.two-landscapes-symmetrical_no-caption .left, .two-landscapes-symmetrical_no-caption .right {
  width: 450px;
  margin-left: 0px;
  margin-right: 0px;
  padding: 0px;
}

.two-landscapes-symmetrical_no-caption {
  margin: 0px;
  padding: 0px;
}

.three-landscapes-asymmetrical .left, .three-landscapes-asymmetrical .right {
  margin: 0px;
  padding: 0px;
}

/* "style3" in some files (home page) conflicts with "style3" in others (project template). Need to give 2 different names and move off pages into here? */