/*=====================================================================
 *
 * Filename: Layout.css
 * Website: www.example.com
 * Author: Roy Quilor
 * Date Created: 00/00/2008
 * Media: Screen
 *
 * Description
 * -----------
 * The grid is created here.
 *
 *=====================================================================*/


/* === header === */


#wrapper {
	text-align: center;
}

#container {
	margin: 0 auto;
	width: 920px;
	margin-bottom: 3em;
}

#phone {	
	padding:21px 13px 13px 17px;
	height: 27px;
	font-size: 26px;
	text-align: right;	
	color: #007229;
}
#phone span.sm{font-size:14px;}


#header {	
	height: 70px;	
}

#content {
	width: 920px;
	margin: 0 0 3em 0;	
	min-height: 600px;
	background: #FFF url('../images/bg.jpg') no-repeat;	
}

#homePage #content {
	min-height: 680px;	
	background: #FFF url('../images/home-bg.jpg') no-repeat;	
}

#aboutPage #content {	
	background: #FFF url('../images/about-bg.jpg') no-repeat;	
}

#whyPage #content {	
	background: #FFF url('../images/why-bg.jpg') no-repeat;	
}

#whyPage #columnLeft li {
		margin: 10px 0 10px 0;
}

#whyPage #columnLeft ul {
		float: left;
}



.textWrap {width: 420px;}




/* === navigation === */

#mainNavigation {
  background-image: url('../images/cosyhomes-windows.gif');
  height: 54px;
  width: 920px;
}

#mainNavigation ul {	
	
	list-style: none;
	margin: 0 0 0 220px;	
	padding: 0 0 0 0;
	border: none;
	font-size: 1.1em;
	font-weight: normal;
	

}
#mainNavigation li {	
		margin: 0px;
		display: inline;
		padding: 0 9px 0 9px;
		
}

#mainNavigation li a {
		position: relative;
		margin: 0px;
		padding: 0px;
		text-decoration: none;
		color: #007229;	
		font-size: 1em;
		font-weight: bold;
		text-transform: uppercase;
		top: -20px;
}

#mainNavigation li a:hover {
		text-decoration: underline;
		color: #92a66c;
}
#mainNavigation li a.selected {
		color: #92a66c;
		text-decoration: none;
}

/* === navigation - NEW === */

#mainNavigation2 {
  background-image: url('../images/cosyhomes-windows.gif');
  height: 54px;
  width: 920px;
}

#mainNavigation2 ul {	
	
	list-style: none;
	margin: 0 0 0 250px;	
	padding: 0 0 0 0;
	border: none;
	font-size: 1.1em;
	font-weight: normal;
}

#mainNavigation2 li {	
		margin: 0px;
		display: inline;
		padding: 0 5px 0 5px;	
}

#mainNavigation2 li a {
		position: relative;
		margin: 0px;
		padding: 0px;
		text-decoration: none;
		color: #007229;	
		font-size: 1em;
		font-weight: bold;
		text-transform: uppercase;
		top: -20px;
}

#mainNavigation2 li a:hover {
		text-decoration: underline;
		color: #92a66c;
}
#mainNavigation2 li a.selected {
		color: #92a66c;
		text-decoration: none;
}



/* === horizontal === */

#columnLeft {
	float: left;
	width: 260px;	
/*	font-size: 1.1em;	*/
	padding: 81px 0 0 0;
	margin: 0 0 0 0;
	text-align: right;	
}

#columnRight {
	float: left;
	width: 560px;
	margin: 0 0 0 30px;
	padding: 50px 0 0 0;
	text-align: left;
}




/* === Sub Navigation === */

ul#subNavigation{
	position:relative;
	margin: 0;
	padding: 0 0 0 0;
	border: none;
	font-size: 1.1em;
	float: right;
}

ul#subNavigation li {
		margin: 0 0 0 0;
		
	}
ul#subNavigation li a {	
		padding: 3px 3px 3px 0.5em;
		text-decoration: none;
		color: #92a66c;
		font-weight: bold;		
	}
ul#subNavigation li a:hover {	
		text-decoration: underline;
		color: #007229;
	}
ul#subNavigation li a.selected {	
		color: #007229;
		text-decoration: none;
	}




#homePage #columnLeft { width: 310px; }
#homePage #columnRight { width: 500px;	}
#homePage .textWrap p { padding: 0 0 20px 80px;}
#homePage .textWrap{width: 500px;}

#aboutPage #columnLeft { width: 310px; }
#aboutPage #columnRight { width: 500px;	}
#aboutPage .textWrap p { padding: 0 0 20px 80px;}
#aboutPage .textWrap{width: 500px;}

#contactPage #columnLeft { width: 475px; padding: 20px 0 0 0;}
#contactPage #columnRight { width: 320px; padding: 50px 0 0 0;}
#contactPage .textWrap p {padding: 0 0 20px 80px;}
#contactPage .textWrap{width: 280px;}

#whyPage #columnLeft { width: 680px; padding: 60px 0 0 60px; text-align: left;}
#whyPage #columnLeft ul{ padding: 0 0 0 50px; }
#whyPage strong { font-weight: bold; }
#whyPage li { list-style-type: disc; }

#installations #columnRight { width: 580px; }
#installations .textWrap { width: 250px; }
#installations strong { font-weight: bold; }
#installations #columnLeft { width: 260px; }


.leftContent {
	float: left;
	width: 280px;			
	margin: 0 0 0 0;
	text-align: left;	
	color: #ccc;
}

.rightContent {
	float: left;
	width: 100px;	
	padding: 0px;
	margin: 0 0 0 0;
	text-align: left;	
	color: #ccc;
}

.Clear{clear:both;}

/* === footer === */

#footer {
	margin-top:40px;
/*	background-color:#3399FF; */
	clear: both;
	height: 40px;
	font-size: 80%;
	padding: 0 0 0 20px;

}

#footer a {font-weight:normal; text-decoration: none; color: #58594c;}
#footer a:hover {text-decoration: underline; color: #000;}

/* === Accessibility === */

.offleft {
position: absolute;
margin-left: -9000px;
}