/* CSS Document */

body { font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:24px; background-image:url(images/homebg.jpg); background-repeat:repeat-x; background-color:#727f6d; padding:0px; margin:0px;}

#container {width:974px; margin:0px auto;}

#header_top {width:974px; height:27px; background-image:url(images/home_topheader.jpg);}
#header_menu {width:954px; height:27px; text-align:right; margin-right:30px; color:#FFFFFF; font-size:14px; padding-top:1px;}
#header_menu a {text-decoration:none; color:#FFFFFF;}
#header_menu a:hover {text-decoration:underline; color:#FFFFFF;}

#header_left {width:293px; height:139px; float:left; background-image:url(images/home_logo.jpg);}
#logo {float:right; margin-top:20px;}

#header_right {width:681px; height:139px; float:right; background-image:url(images/headerbg.jpg);}
#headertext_left {width:440px; float:left; color:#980497; font-style:italic; text-align:center; margin:10px 0px 0px 20px; line-height:20px;}
#headertext_right {width:180px; float:right; color:#980497; margin-top:30px; line-height:20px;}
#navigation {width:617px; height:41px; margin:98px 0px 0px 64px;}
#aboutus {width:98px; height:41px; float:left; background-image:url(images/aboutus.jpg);}
#aboutus:hover {cursor:pointer; background-image:url(images/aboutus_hover.jpg);}
#aboutus_active {width:98px; height:41px; float:left; background-image:url(images/aboutus_active.jpg);}
#services {width:90px; height:41px; float:left; background-image:url(images/services.jpg);}
#services:hover {cursor:pointer; background-image:url(images/services_hover.jpg);}
#services_active {width:90px; height:41px; float:left; background-image:url(images/services_active.jpg);}
#greenroof {width:167px; height:41px; float:left; background-image:url(images/greenroof.jpg);}
#greenroof:hover {cursor:pointer; background-image:url(images/greenroof_hover.jpg);}
#greenroof_active {width:167px; height:41px; float:left; background-image:url(images/greenroof_active.jpg);}
#projects {width:87px; height:41px; float:left; background-image:url(images/projects.jpg);}
#projects:hover {cursor:pointer; background-image:url(images/projects_hover.jpg);}
#projects_active {width:87px; height:41px; float:left; background-image:url(images/projects_active.jpg);}
#features {width:175px; height:41px; float:left; background-image:url(images/features.jpg);}
#features:hover {cursor:pointer; background-image:url(images/features_hover.jpg);}
#features_active {width:175px; height:41px; float:left; background-image:url(images/features_active.jpg);}
.button a {display:block; height:100%; width:100%;}

#header {float:left; width:974px; height:94px; background-image:url(images/home_header.jpg);}

#home_midphotos {float:left; width:974px; height:248px;}
#home_interiors {float:left; height:248px;}
#home_holiday {float:left; height:248px;}
#home_exteriors {float:left; height:248px;}
#home_midtext {float:left; width:201px; height:256px; padding:10px 15px 20px 11px; background-image:url(images/rightboxbg.jpg); color:#FFFFFF;}

#home_lowercontent {width:974px; float:left;}
#lower_head {width:974px; height:92px;; float:left; background-image:url(images/maincontentbg.jpg);}
#lowertext {color:#040404; margin:40px 0px 0px 90px; width:400px;}
#lower_spacer {width:80px; height:190px; float:left; background-image:url(images/home_21.jpg);}
#roofgallery {width:195px; height:190px; float:left;}
#timelapse {width:204px; height:190px; float:left;}
#lowercontent {width:495px; height:190px; float:left; background-image:url(images/maincontentbg-18.jpg)}
#greenroof-videos {
	width:600px;
	height:260px;
	background-color: #a7c078;
	padding-top:10px;
	margin: 0 0 0 100px;
}
#greenroof-videos_sub {
	width:400px;
	height:300px;
	background-color: #a7c078;
	padding-top:30px;
	margin: 0 0 0 200px;
}

#footer {width:974px; height:59px; float:left; background-image:url(images/footerbg.jpg);}

#sub_header {
	width:883px;
	height:69px;
	margin-left:34px;
	float:left;
	background-image:url(images/sub_header.jpg);
}
.subheader {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight:normal;
	color: #FFFFFF;
	padding: 40px 0 0 57px;
}
#sub_menu {width:940px; height:28px; float:left; margin-left:34px; background-color:#7dab40;}
#sub_menu .first {margin-left:30px;}
#sub_menu .last {border-right:none;}
.sub_button {float:left; padding:2px 20px; border-right:1px solid #FFFFFF; color:#FFFFFF;}
.sub_button a {color:#FFFFFF; text-decoration:none;}
.sub_button a:hover {color:#FFFFFF; text-decoration:underline;}
#sub_content {padding:10px 50px 50px 50px; width: 850px; float:left; margin-left:34px; background-image:url(images/sub_content.jpg); background-repeat:repeat-y;}
#sub_content h1 {color:#980497;padding-top:10px;font-size:26px;}
#sub_photo {width:330px; float:right; margin:35px 35px 20px 40px;}
#caption {color:#980497; font-size:11px; font-style:italic; line-height:16px; text-align:center; margin:5px;}
.wide-rt-margin {margin-right:175px;}
.gallery_menu {
	text-align:center;
	font-size:14px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	padding-bottom: 10px;
}
.gallery_menu_live {
	text-align:center;
	font-size:14px;
	color:#990000;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	padding-bottom: 10px;
}
.purple_bio-names {
	color:#980497;
	font-size:14px;
}
.paragraph_bio-names {
	margin-bottom: 5px;
}
#sub_content a:link { 
	color: ##980497;
	text-decoration: underline;
}
#sub_content a:visited { 
	color: ##980497;
	text-decoration: underline;
}
#sub_content a:hover {
	color: #58569F;
	text-decoration: underline;
}

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px solid gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}