/*
	Current version: 1.0
	
	www: hagasolskydd.se
	Author: Max Kårevall - max@atrox.se
	Notes: This file contains the rules of the basic structure and navigation of the site.
*/

body
{
	color: black;
	font: 76%/1.4 Arial, Helvetica, Sans-serif;
	margin: 0;
	padding: 0;
	
}
#startPage, #subPage
{text-align: center;}
#startPage
{
	background: #9fa1a4 url(../images/common/start-page-body-bg.gif) repeat-x;
}

#subPage, #articlePage
{
	background: #9fa1a4 url(../images/common/sub-page-body-bg.gif) repeat-x;
}

h1, h2, h3, h4, h5, h6
{text-transform: uppercase;font-weiht: bold;color: #2b2f33;}

h1
{
	font-size: 18px;
	margin: 0;
	padding:0;
	letter-spacing: -1px;
}
h2
{
	font-size: 14px;
	margin: 0;
	padding:0;
	letter-spacing: -1px;
}
h3, h4, h5, h6
{
	font-size: 12px;
	margin: 0;
	padding:0;
}

p
{
	font-size:13px;
	margin: 0;
	padding:0 0 15px 0;
	max-width: 450px;
}
a
{
	color: #164878;
}
a:hover
{
	color: black;
}
hr
{
	height: 1px;
	background: #9fa1a4;
	border: 0;
	display: block;
	float: none;
	clear: both;
	margin: 5px 0 20px 0;
	padding: 0;
}

img{border:0;}

#wrapper
{
	margin: 0 auto;
	text-align: left;
	width: 960px;
	overflow: hidden;
	
}
#header
{
	height: 97px;
	overflow: hidden;
}
	#logotype {background: url(../images/common/haga-solskydd.gif) no-repeat;display: inline;height: 58px;overflow: hidden;text-indent: -9999px;width: 216px;float: left;margin: 20px 0 0 40px;}
	#nav
	{
		float: left;
		margin: 55px 0 0 105px;
	}
		#nav ul
		{
			margin: 0;
			padding: 0;
		}
		#nav li
		{
			list-style: none;
			background: url(../images/common/nav-separator.gif) right no-repeat;
			padding: 0 10px;
			float: left;
			
		}
		#nav .menuItemFirst {display:none;}
		#nav .menuItemLast {background: none !important;}
		#nav a
		{
			font-size: 14px;
			text-transform: uppercase;
			font-weight: bold;
			color: #9fa1a4;
			text-decoration: none;
		}
		#nav a:hover{color:#bb7813;}
			#nav .topNavItemContentSelected a{color:#bb7813 !important;}
#content
{
	background: url(../images/common/content-bg.gif) repeat-y;
	overflow: hidden;
	float: left;
	clear: both;
}
	#main, #side
	{
	border-top: 30px solid white;
	border-bottom: 30px solid white;
	}
	#main, #subMain
	{
		width: 550px;
		padding: 10px 40px 0 40px;
		float: left;
		display: inline;
		overflow: hidden;
	}
		#westContent
		{
			width: 330px;
			float: left;
			display: inline;
		}
		#eastContent
		{
			width: 200px;
			padding: 0 0 0 20px;
			float: left;
			display: inline;
		}
			#eastContent img
			{
				display: block;
				margin: 0 0 15px 0;
			}
	#side, #subSide
	{
		width: 289px;
		float: left;
		display: inline;
		padding: 10px 20px 0 11px;
		margin-left: 10px;
		overflow: hidden;
	}
	#offert
	{
		width:289px;
		height:148px;
		float:left;
		background:#cb8927 url(../images/common/offert-bg.gif) no-repeat;
		color:#fff;
		position:relative;
	}
	
		#offert h2{color:#fff !important;margin:30px 20px 7px 20px;text-transform:none !important;font-size:16px !important;}
			#offert p{margin:0 20px;font-weight:bold;font-size:14px;}
			#offert .button{margin:0 !important;padding:0 !important;display:block;width:112px;height:28px;position:absolute;bottom:9px;right:9px;background:transparent;text-indent:-9999px;}
	
	#productPresentationLeft p, #productPresentationRight p, #productPresentationLeft h2, #productPresentationRight h2
	{
		padding: 0 10px;
	}
	#productPresentationLeft p, #productPresentationRight p
	{
		font-size: 11px;
	}
	#productPresentationLeft h2 a, #productPresentationRight h2 a
	{
		font-size: 14px;
		color: #b36b00;
		text-decoration: none;
	}
	#productPresentationLeft img, #productPresentationRight img
	{
		margin: 0 0 10px 0;
		display: block;
	}
	#productPresentationLeft
	{
		width: 265px;
		float: left;
		margin: 0 20px 0 0;
	}
	#productPresentationRight
	{
		width: 265px;
		float: left;
	}
#presentation {background: white;}
#presentation img
{display:block;}
#startPage #presentation
{
	height: 440px;
	border-top: 4px solid #2b2f33;
	background: #fff url(../images/common/loader.gif) center no-repeat;
}
#subPage #presentation
{
	height: 200px;
	border-top: 4px solid #2b2f33;
	background: #fff url(../images/common/loader.gif) center no-repeat;
}

#payoff
{
	height: 50px;
	background: #2b2f33;
	font-size: 30px;
	color: #9fa1a4;
	text-transform: uppercase;
	letter-spacing: -2px;
	font-weight: bold;
	padding: 9px 0 0 40px;
	width: 920px;
}
	#payoff a
	{
		color: white;
		text-decoration: none;
	}

#side h2
{
	font-size: 14px;
	color: #b36b00;
}

#footer
{
	float: none;
	clear: both;
	overflow: hidden;
	height: 78px;
	width: 880px;
	background: #929497;
	font-size: 11px;
	color: white;
	padding: 30px 40px 0 40px;
}
	#footer a
	{
		color: white;
		text-decoration: none;
	}
	#footer #credit
	{
		float: right;
	}
	
	
#subNavActive {display: none;}
#subNavContent ul
{
	margin:0 0 30px -10px;
	padding:0;
}
#subNavContent li a
{
	list-style: none;
	display: block;
	margin: 0 0 5px 0;
	padding: 0 0 2px 10px;
	background: url(../images/common/sub-nav-li.gif) left bottom no-repeat;
}
	#subNavContent li a
	{
		color: #2b2f33;
		text-decoration: none;
	}
	#subNavContent li a:hover, #subNavContent li a.leftMenuSelected {color: #bb7813;}
	
	#subNavContent li a.leftMenuSelected {font-weight:bold;}
	
	#subNavListLvl2
	{
		margin: 0 !important;
	}
	#subNavListLvl2 li
	{
		list-style: none;
		margin: 0 0 5px 0;
		padding: 0 0 0 10px;
		background: none;
	}
	
	
	/* CONTACT */

#contactEmail{
	width: 330px !important;
	padding: 0 !important;
	margin: 0 !important;
}
.leftLast{
	float: left;
}
#SendEmailForm{
	width: 330px;
}
#SendEmailForm label{
	display: block;
	float: none;
	clear: both;
}
#contactEmail ul{
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	width: 330px;
	list-style: none;
	list-style-type: none;
}
#contactEmail li{
	padding: 0 !important;
	border: 0 !important;
}
#contactEmail input{
	width: 140px;
	padding: 3px 0 0 4px;
	height: 19px;
	margin: 0 0 8px 0;
	border: 1px solid #e9e8e8;
}
#contactEmail #subject{
	width: 324px;
}
#contactEmail .left{
	clear: left;
	float: left;
	width: 165px;
}
#contactEmail .right{
	width: 144px;
	float: right;
}
#message{
	width: 324px;
	height: 80px; 
	padding: 2px 0 0 4px;
	margin: 0 0 8px 0 !important;
	border: 1px solid #e9e8e8;
	overflow: hidden;
}
.contactEmailSubmit{
	background:url(../images/common/button.gif) no-repeat right top;
	clear:both;
	color:white;
	float:right;
	font-size:11px;
	font-weight:bold;
	line-height:1.8;
	padding:3px 20px 7px 10px !important;
	text-decoration:none;
	height: 25px !important;
	width: 100px !important;
}
#cellPhone{
	border: 1px solid #003366;
	width: 168px;
}
#email{
	border: 1px solid #003366;
	width: 168px;
}

.msgError {
	color:red;
}

.msgLegend, .msgError, .msgWarning, .msgInfo {
	display:block;
	font-weight:bold;
}

.clearFix{height:0;font-size:0;clear:both;float:none;}