/** 4 Life - Marley **/

@import url(reset.css);
@import url(fonts.css);

body { background:#efefef; padding:none; margin:0; 	font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#6a6a6a; }

br.clear, br { clear:both; }

h2 { font-size:25px; color:#333; margin:3px 0; font-weight:none; }

h3 { font-size:14px; color:#fff; line-height:22px; padding:0 3px 0 3px; margin:10px 0 10px 0; }

h4 { font-size:14px; color:#efefef; margin:15px 0 15px 10px; font-weight:none; }

h5 { font-size:12px; color:#efefef; font-weight:none; }

strong { font-weight:bold; }

p a { color: #333; text-decoration: none; }
p a:hover { text-decoration: underline; }

a.pdf-link {
	display: block;
	line-height: 40px;
	padding: 3px;
	padding-left: 50px;
	background: url(../images/pdfbg.gif) no-repeat left center;
}

ul {
	list-style-type:none;
	padding-left:0;
	margin-left:0;
}

/** Holding page **/

#container_holding {
	width:100%;
	padding-top:30px;
}
#holding {
	width:400px;
	margin:0 auto;
}
#holding p {
	font-size:15px;
	color:#666;
	text-align:center;
	margin-top:15px;
}
#logo {
	width:181px;
	height:228px;
	margin:0 auto;
}

/** Navigation **/

.nav li a {	display: block; height: 20px; margin-left:-5px; }

.nav li.l1 a { background: url("../images/nav_home.jpg") no-repeat 20px -20px; }  
.nav li.l1 a:hover,
body.l1 .nav li.l1 a { background: url("../images/nav_home.jpg") no-repeat 20px 1px; }

.nav li.l2 a { background: url("../images/nav_about.jpg") no-repeat 20px -20px; }  
.nav li.l2 a:hover,
body.l2 .nav li.l2 a { background: url("../images/nav_about.jpg") no-repeat 20px 1px; }

.nav li.l3 a { background: url("../images/nav_benefits.jpg") no-repeat 20px -20px; }
.nav li.l3 a:hover,
body.l3 .nav li.l3 a { background: url("../images/nav_benefits.jpg") no-repeat 20px 1px; }

.nav li.l4 a { background: url("../images/nav_life4.jpg") no-repeat 20px -20px; }
.nav li.l4 a:hover,
body.l4 .nav li.l4 a { background: url("../images/nav_life4.jpg") no-repeat 20px 1px; }

.nav li.l5 a { background: url("../images/nav_installation.jpg") no-repeat 20px -20px; }
.nav li.l5 a:hover,
body.l5 .nav li.l5 a { background: url("../images/nav_installation.jpg") no-repeat 20px 1px; }

.nav li.l6 a { background: url("../images/nav_contact.jpg") no-repeat 20px -20px; }
.nav li.l6 a:hover,
body.l6 .nav li.l6 a { background: url("../images/nav_contact.jpg") no-repeat 20px 1px; }

.nav li.l7 a { background: url("../images/nav_sample.jpg") no-repeat 20px -20px;}
.nav li.l7 a:hover,
body.l7 .nav li.l7 a { background: url("../images/nav_sample.jpg") no-repeat 20px 1px; }

#calendar { padding-top: 25px; }

#deepflow	{ margin:65px 0 0 6px; }

#calendar img {
	display: block;
	margin: 0 auto;
}

/** Main site **/

.invisible {
	display:none;
}

#container {
	width:920px;
	margin:0 auto;
	padding:10px 0 0 10px;
	background-color: #bbb;
	border:1px solid #a6a6a6;
}

#left_col {
	width:145px;
	height:531px;
	background: url("../images/nav_bg.jpg") no-repeat top left;
	float:left;
	margin:5px 0 0 5px;
}
#left_col h1 {
	width:145px;
	height:174px;
	background: url("../images/nav_logo.jpg") no-repeat top left;
}
#left_col h1 span {
	display:none;
}
.p_small {
	font-size:11px;
	padding-left:5px;
	border-left:3px solid #999;
}
#install_back {
	width:670px;
	margin:10px 0 0 20px;
	border-top:1px dashed #999;
}


#right_col {
	width:740px;
	height:600px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col p {
	width:700px;
	margin:20px 0 0 10px;
	line-height:18px;
}
#right_col_home {
	width:740px;
	height:540px;
	margin:10px 5px 0 0;
	float:right;
	background: url("../images/image_home_gutter.jpg") no-repeat bottom;
}
#right_col_home p {
	width:600px;
	margin:20px 0 0 10px;
	line-height:18px;
}
#home_promotion_1 {
	width:163px;
	height:159px;
	float:left;
	margin:287px 0 0 0;
	padding-top:6px;
	background: url("../images/small_rounded.jpg") no-repeat left top;
}
#home_promotion_2 {
	width:163px;
	height:159px;
	float:left;
	margin:287px 0 0 18px;
	padding-top:6px;
	background: url("../images/small_rounded.jpg") no-repeat left top;
}
#home_promotion_1 p {
	margin:0 0 0 10px;
}
#home_promotion_1 ul {
	margin-left:8px;
}
#home_promotion_1 img {
	margin:5px 0 0 1px;
}
#home_promotion_2 img {
	margin-left:20px;
}
#home_promotion_1 li {
	float:left;
	margin:0 3px 2px 0;
}
h3.prom {
	font-size:12px; color:#fff; line-height:18px; margin:5px 0 5px 7px;	
}

/* Medium size rounded rectangle */

#medium_round {
	width:202px;
	height:237px;
	background:url("../images/home_round_section.jpg") no-repeat;
	float:right;
	display:inline;
	margin: 212px 20px 0 0;
}
#medium_round ul {
	margin-top:25px;
	padding:18px;
}
#medium_round li {
	list-style:disc;
	margin-top:2px;
	margin-left:10px;
	line-height:16px;
	font-size:11px;
}
#medium_round img {
	margin-top:3px;
}

#right_col_terms {
	width:740px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col_terms p {
	margin:10px 15px 0 10px;
	line-height:18px;
}

#right_col_about {
	width:740px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col_about p {
	margin:10px 0 0 10px;
	line-height:18px;
}
#right_col_about ul {
	margin:10px 0 20px 20px;
	line-height:25px;
}
#right_col_about li {
	list-style:disc;
	margin-left:10px;
	line-height:18px;
}
#right_col_about img {
	border:2px solid white;
	float:right;
	margin:-20px 10px 0 10px;
}
#right_col_about object {
	margin-left:80px;
}
#about_video img {
	border:2px solid white;
	float:left;
	margin:10px 0 0 10px;
}
#about_video_right {
	border:2px solid white;
	float:right;
}
#about_video p {
	float:left;
	width:250px;
	text-align:left;
	color:#6a6a6a;
	font-weight:bold;
	font-size: 0.9em;
}
#about_video {
	width:720px;
	height:174px;
	margin:10px 0 0 5px;
	background:#cac9c9;
	border-top:1px dashed #999;
	border-bottom:1px dashed #999;
}



#right_col_benefits {
	width:740px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col_benefits p {
	margin:10px 0 0 10px;
	line-height:18px;
}
#right_col_benefits ul {
	margin-top:-10px;
	padding:20px;
}
#right_col_benefits li {
	list-style:disc;
	margin-left:10px;
	line-height:10px;
}
#right_col_benefits a {
	text-decoration:none;
	color:#666;
}
#right_col_benefits a:hover {
	text-decoration:underline;
	color:#666;
}


#benefits_compare {
	width:675px;
	margin:0 0 0 10px;
	padding: 15px 18px;
	background:#cac9c9;
	border-top:1px dashed #999;
	border-bottom:1px dashed #999;
}
#benefits_compare img {
	border:2px solid white;
}
#benefits_compare a {
	width: 360px;
}
#comp1 {
	width:310px;
	float:left;
	margin:0 40px 0 3px;
}
#comp1 p {
	margin:5px 0;
	text-align:center;
}
#comp2 p {
	margin:5px 0;
	text-align:center;
}


#benefits_compare a img { border:2px solid white; display: block; margin: 0 auto; }
#benefits_compare a:hover img { border-color: #666; }

.range_box {
	width:720px;
	height:170px;
	margin:30px 0 0 5px;
	background:#cac9c9;
	border-top:1px dashed #999;
	border-bottom:1px dashed #999;
}
.range_box img {
	margin:10px;
	float:left;
	
}
.range_img {
	border:2px solid white;
}
.range_box p img {
	margin:-10px 0 0 -5px;
}

#right_col_range {
	width:740px;
	height:920px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col_range p {
	margin:10px 0 0 10px;
	line-height:18px;
}


#right_col_sample {
	width:740px;
	height:640px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col_sample p {
	width:720px;
	margin:10px 0 0 10px;
	line-height:18px;
}
#right_col_sample ul {
	margin-top:-10px;
	padding:20px;
}
#right_col_sample li {
	list-style:disc;
	margin-left:10px;
	line-height:10px;
}

#right_col_installation {
	width:740px;
	height:540px;
	margin:0px 5px 0 0;
	padding: 0 10px;
	float:right;
}
#right_col_installation_s {
	width:740px;
	margin:0px 5px 0 0;
	padding: 0 10px;
	float:right;
}
#right_col_installation_s p,
#right_col_installation p {
	margin:10px 0 0 15px;
	line-height:18px;
}
#right_col_installation ul {
	margin-top:-10px;
	padding:20px;
}
#right_col_installation li {
	list-style:disc;
	margin-left:10px;
	line-height:10px;
}
#jstabs h5 { 
	line-height:150%; 
	color:#666; 
	text-decoration:none; 
	font-weight:bold; 
	background:#cac9c9; 
	border-bottom:1px dashed #999;
	border-top:1px dashed #999; 
}
#jstabs h5 a, h5 { 
	line-height:150%;
	color:#666; 
	text-decoration:none; 
	font-weight:bold; 
	padding:5px; 
	display:block;
}
#jstabs h5 a:hover { 
	color:#333; 
}
.install_steps {
	width:315px;
	margin:10px 10px 5px 20px;
	float:left;
}
#dp1 { border-bottom:#999; }

.install_steps p { 
	width: auto!important; 
	font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;
}

#jstabs img {
	border:2px solid white;
}
#pdf img {
	float:left;
	smargin:-10px 10px 10px 10px;
}
#pdf p {
	margin-top:30px;
}
.installation_menu {
	width:660px;
	font-size:11px;
	color:#6a6a6a;
	text-align:center;
	padding:5px;
}
.installation_menu a {
	text-decoration:none;
	color:#6a6a6a;
}
.installation_menu a:hover {
	text-decoration:none;
	border-bottom:1px dashed #999;
	color:#333;
}
#install_current {
	color:#efefef;
	font-weight:bold;
}



#right_col_contact {
	width:740px;
	height:540px;
	margin:10px 5px 0 0;
	float:right;
}
#right_col_contact p {
	margin:10px 0 0 10px;
	line-height:18px;
}
#right_col_contact ul {
	margin-top:-10px;
	padding:20px;
}
#right_col_contact li {
	list-style:disc;
	margin-left:10px;
	line-height:10px;
}



/** About sub area **/

.about_sub {
	width:246px;
	height:211px;
	background:url("../images/about_rounded_section.gif") no-repeat;
	float:right;
	display:inline;
	margin:15px 10px 0 0;
}
.about_sub ul {
	margin-top:25px;
	padding:18px;
}
.about_sub li {
	list-style:none;
	line-height:28px;
	padding-left:5px;
}
#about_current {
	background:#ccc;
}
.about_sub a {
	text-decoration:none;
	color:#6a6a6a;
}
.about_sub a:hover {
	text-decoration:none;
	color:#6a6a6a;
	border-bottom:1px #999 dashed;
}


/** Footer **/

#footer {
	width:933px;
	height:45px;
	padding-top:10px;
	padding-bottom:10px;
	margin:0 auto;
	background-color:#fff;
}
#footer p {
	font-size:16px;
	float:left;
	display:inline;
	margin:12px 0 0 15px;
}
#footer img {
	float:right;
	margin:0 10px 0 0;
}

#footer_terms {
	width:910px;
	margin:10px auto;
}
#left_terms {
	font-size:11px;
	float:left;
	display:inline;
}
#right_terms {
	font-size:11px;
	float:right;
}
#footer_terms a { text-decoration:none;	color:#6a6a6a; }
#footer_terms a:hover { border-bottom:1px #999 dashed; color:#999;}

/** Light box styles **/

#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 5px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageData #imageDetails{ 
	float: left;
	text-align: left; 
	width: 70%;
}
#bottomNavLinks { 
	clear: both;
	width: 50%;
	height: 22px;
	margin: 0 auto;
}
#bottomNavLinks a{ outline: none;}
#bottomNav { width: 66px; float: right; }


#botPrevLink, #botNextLink { 
	display:block;
	width: 50px; 
	height: 22px; 
}
#botPrevLink { background: url(../images/botPrev.jpg) no-repeat top left; 	float: left; } 
#botNextLink { background: url(../images/botNext.jpg) no-repeat top left; 	float: right; }

#imageDataContainer{
	font: 10px;
	background-color: #fff;
	color: #433720;
	margin: 0 auto;
	line-height: 1.4em;

}

#imageData{
	padding:0 7px;
}
		
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; padding-bottom: 1.0em; }			
#imageData #bottomNavClose{ 
	width: 66px; 
	height: 22px; 
	background: url(../images/closelabel.gif) no-repeat top left; 
	float: right;  
	padding-bottom: 0.7em; 
}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	

	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	

img.cm_float {
	float: right;
	margin: 0 15px;
	border: 2px solid #fff;
}

/** Sample Request **/

form {
	margin: 30px 10px;
	width: 500px;
}

form label {
	display: block;
	margin: 10px 0;
}

form label span {
	display: block;
	float: left;
	width: 105px;
	margin-right: 10px;
	text-align: left;
}

.checkbox_text 	{ width:200px; }

.checkbox	{ width:20px; float:left; }

form label input,
form label textarea { width: 220px; }

form .but-left {
	width: auto;
	float: left;
}

#flash-inline {
	width: 510px;
	margin: 25px auto;
}

#flash-inline p {
	font-weight: bold;
	margin: 5px 0;
}