/*
	Filename         :	main.css
	Created by		 :	Andrew Harris	[ http://www.andrewharris.tv ]
	Last updated by  :	Andrew Harris   [ andrew@andrewharris.tv     ]
	Last Updated     :	20 September  2009
	Comments         :	Global screen style sheet for http://www.onenestsa.co.za
*/


/******************************************************************************/
/* 						Cleaning up default styles 							  */
/******************************************************************************/

img, a, li, input { behavior: url(scripts/iepngfix.htc) }

a:focus	{border:none; outline:none;}

*	{padding:0; margin:0; border:0;}


/******************************************************************************/
/* 								Container									  */
/******************************************************************************/


html, body 			{height: 100%;}
* html #container 	{height: 100%;}
#container 			{min-height:100%; background-color: #ffffff; width: 960px; margin: 0 auto;}


/******************************************************************************/
/* 								General styles   							  */
/******************************************************************************/

.tenSpace		{width:100%; height:10px; clear:both; float:none;}
.twentySpace	{width:100%; height:20px; clear:both; float:none;}
.fatSpace		{width:100%; height:450px; clear:both; float:none;}


.filler		{width:100%; height:300px; clear:both; float:none;}


/******************************************************************************/
/* 								Font styles									  */
/******************************************************************************/


body 		{font-family: arial, helvetica, sans-serif; font-size: 75%; color:rgb(51,47,12);}

h1 			{font-size: 2.0em; padding:0; font-weight:normal; color:rgb(57,126,34);}
.hero h1	{padding:15px 15px 10px 30px;}
h1.pad		{padding:0 0 10px 0;}
h1.small	{font-size:20px; line-height:1.4em;}
h2			{font-size: 1.4em; padding:0; font-weight:normal; line-height:1.4em;}

h3					{font-size: 1.2em; padding:0; font-weight:normal; line-height:1.4em;}
.hero h3	{padding:0px 15px 10px 30px;}


h2.subs	{ padding: 20px 0 0 10px !important; margin:0; color:rgb(57,126,34); display:block; clear:both;}

#productsCar h1, #productsCar h3, #medPolicy h1, #medPolicy h3, #claims h1, #claims h3 	{padding:0 0 0 8px;}

li.stepText	{font-weight:bold;}

p 			{padding:0 0 10px 0; line-height:1.4em;}
p.first		{padding:10px 0 10px 0;}
.small p, .footer li, .clientName	{font-size:12px;}
p.smaller	{padding:15px 0 10px 0; font-size:11px;}
p.grey 		{color:#999;}
p.line		{padding:0 0 15px 0; border-bottom:1px solid #e2e2e2;}

.red	{color:#900; font-size:12px;}
.arrow	{color:#900; font-size:12px;}


.white p, a.white, .footer li, .footer li a	{color:#FFF;}

li			{line-height:20px;}
.footer li	{line-height:18px;}

a			{color:rgb(57,126,12); text-decoration:none;}
a:hover		{text-decoration:underline;}

a.big		{font-size:16px; font-weight:bold;}

/******************************************************************************/
/* 								Header   									  */
/******************************************************************************/


#logo			{position:absolute; z-index:999; margin:10px 0 0 30px;}
#fBook			{position:absolute; z-index:9999; margin:12px 0 0 180px;}
#headContact	{position:absolute; z-index:999; margin:40px 0 0 635px; width:300px; text-align:right;}


/******************************************************************************/
/* 					Top Banner section - Site wide 			 				  */
/******************************************************************************/


.banner		{width:640px; height:218px; float:left;}

.post-note		{width:320px; height:218px; float:right; background:url(../img/gen/post-it.jpg) no-repeat 0px 0px;}
.post-note ul	{width:280px; height:100px; padding:85px 0 0 25px;}
.post-note li   {background:url(../img/gen/tick.png) no-repeat 0px 0px; padding-left:28px; line-height:15px; margin:0; height:22px; list-style:none; padding-bottom:15px;}


.post-note-big		{width:320px; height:312px; float:right; background:url(../img/gen/post-it_big.jpg) no-repeat 0px 0px;}
.post-note-big ul	{width:280px; height:100px; padding:85px 0 0 25px;}
.post-note-big li   {background:url(../img/gen/tick.png) no-repeat 0px 0px; padding-left:28px; line-height:15px; margin:0; height:22px; list-style:none; padding-bottom:15px;}




/*
.post-note	{width:320px; height:218px; float:right;}
.post-it ul	{width:280px; height:100px; z-index:999; position: absolute; margin:80px 0 0 665px; clear: both;}
.post-it li { background:url(../img/gen/tick.png) no-repeat 0px 0px; padding-left:28px; line-height:15px; margin:0; height:22px; list-style:none; padding-bottom:15px;}


.post-note-big	{width:320px; height:312px; float:right;}
*/



.banner-left		{width:310px; height:218px; float:left; background:url(../img/gen/hero_bg.jpg) no-repeat 0 0;}
.banner-right		{width:330px; height:218px; float:left;}




/******************************************************************************/
/* 					Main Navigation - Site wide 			 	   			  */
/******************************************************************************/


#mainNav a	{text-decoration:none;}

#mainNav	{width:740px; position:absolute; z-index:999; margin:41px 0 0 90px;}

#mainNav ul	{display:block; height:30px;}
#mainNav li {list-style:none; float:left; line-height:14px; margin-right:2px;}
			

#mainNav a	{color:#fff; background-color:rgb(95,138,35); padding: 7px 10px 8px 10px; display:block;
			-moz-border-radius-topleft:5px; -webkit-border-top-left-radius:5px;
			-moz-border-radius-topright:5px; -webkit-border-top-right-radius:5px;
			border: 1px solid rgb(95,138,35);
			}
			
#mainNav a:hover	{text-decoration:underline;}

#mainNav #currentpage a	{color:rgb(51,47,12); background-color:#FFF; padding: 7px 10px 10px 10px;
			border-top:1px solid #fff; border-left:1px solid #fff; border-right:1px solid #fff; border-bottom:2px solid #fff;
			}

/* Footer section */

.footer #currentpage a	{text-decoration:underline;}


/******************************************************************************/
/* 					Home Page - Product list	 			 	   			  */
/******************************************************************************/


ul.products 	{width:240px; height:220px; display:block; float:left; border-bottom:1px solid #CCC;}
.products li	{list-style:none; padding-left:20px;}
li.sub 			{padding:10px 0 10px 20px;}

a.more 		{background:url(../img/gen/more_button.png) no-repeat; width:120px; height:29px; display:block;
			margin-top:20px;}
a.more:hover	{text-decoration:none;}


/* Feedback section */

.feedBackwrapper	{height:160px;}


a.clientList 		{background:url(../img/index/some_clients_arrow.png) no-repeat; width:154px; height:29px; display:block; margin-top:0px;}
a.clientList:hover	{text-decoration:none;}

.fbBadge		{width:125px; height:160px; padding-left:30px; float:left; padding-top:10px;}
.clientQuotes	{width:456px; height:180px; padding:15px 0 0 20px; float:left; font-style:italic;}
.clientName		{font-style:normal; color:#666;}


ul.proud 	{width:250px; height:111px; display:block; float:left; padding:0px 0 0 70px;}
.proud li	{list-style:none; padding:0; display:inline; float:left;}

a.cms 			{background:url(../img/index/cms.jpg) no-repeat; width:186px; height:55px; display:block; margin-top:20px;}
a.cms:hover		{background-image:url(../img/index/cms_o.jpg); text-decoration:none;}

a.fsb 			{background:url(../img/index/fsb.jpg) no-repeat; width:47px; height:55px; display:block; margin-top:20px;}
a.fsb:hover		{background-image:url(../img/index/fsb_o.jpg); text-decoration:none;}

a.roadEye		{background:url(../img/index/roadEye_logo_off.jpg) no-repeat; width:220px; height:56px; display:block; margin-top:10px; margin-left:10px;}
a.roadEye:hover	{background:url(../img/index/roadEye_logo_on.jpg) no-repeat; width:220px; height:56px; display:block; margin-top:10px; text-decoration:none;}


/* Footer section */

.footer	{background:url(../img/gen/footer.jpg) no-repeat 0 0; width:960px; height:120px; float:none; clear:both;}
.footer li	{list-style:none; padding-left:30px;}

.footer ul.left		{padding-top:20px; float:left; width:200px;}
.footer ul.right	{padding-top:20px; float:left; width:200px;}

.footer	p	{clear:both; float:none; width:100%; padding:20px 0 0 30px;}




/* business + personal + motor COMMON styling section */


.getQuote	{margin: 13px 0 0 27px; width:256px; height:38px;}


ul.stepsWrapper		{width:640px; float:left; padding-top:14px;}
.stepsWrapper li	{width:640px; list-style:none;}

ul.steps	 	{width:640px; height:37px; display:block; padding-bottom:5px;}
.steps li		{list-style:none; display:inline; float:left;}
.steps li.one	{background:url(../img/gen/one.png) no-repeat 0 0; width:37px; height:37px; float:left; margin-left:25px;}
.steps li.two	{background:url(../img/gen/two.png) no-repeat 0 0; width:37px; height:37px; float:left; margin-left:25px;}


li.stepText 	{padding:5px 0px 0px 10px; float:left; display:block; width:435px;} 

a.get 			{background:url(../img/gen/download_form.png) no-repeat; width:126px; height:29px; display:block; float:right;}
a.get:hover		{text-decoration:none;}

a.send	 		{background:url(../img/gen/send_form.png) no-repeat; width:126px; height:29px; display:block; float:right;}
a.send:hover	{text-decoration:none;}

.steps li.button	{width:126px; height:37px; padding-right:7px;}




div#claims			 {padding:15px 0 0 15px; background-color: #FFF; width:941px; min-height:650px; clear:both; margin:15px 0 30px 0; border:1px solid rgb(215,215,215);
						background:url(../img/gen/bg_grad.jpg) repeat-x 0px 300px;
						-moz-border-radius:10px; -webkit-border-radius:10px;
						-moz-box-shadow:1px 1px 5px #ccc; -webkit-box-shadow:1px 1px 5px #ccc;}

ul.claims			{width:910px; height:auto; display:block; float:left; padding:20px 0px 20px 10px; border-bottom:1px solid #e2e2e2; clear:both;}
ul.claims li			{list-style:none; float:left;}
ul.claims li	ul li	{list-style:none; float:none; width:350px;}
ul.claims li	ul.listLeft		{list-style:none;}
ul.claims li	ul.listRight	{list-style:none;}

.claims li.logo		{width:270px; padding:0; vertical-align:top;}










/* Motor section */



div#productsCar			 {padding:15px 0 0 15px; background-color: #FFF; width:941px; height:320px; clear:both; margin:15px 0 30px 0; border:1px solid rgb(215,215,215);
						background:url(../img/gen/bg_grad.jpg) repeat-x 0px 120px;
						-moz-border-radius:10px; -webkit-border-radius:10px;
						-moz-box-shadow:1px 1px 5px #ccc; -webkit-box-shadow:1px 1px 5px #ccc;}

ul.productsCar 			 {width:220px; height:auto; display:block; float:left; padding:20px 6px 0px 6px;}
.productsCar li			 {list-style:none;}
.productsCar li.hero	 {padding:0;}
.productsCar li.text	 {font-size:100%; line-height:1.3em; vertical-align:top; display:block; height:70px; width:210px; padding:5px 5px 0 5px;}


.productsCar li a.getCar {margin:0 0 0 5px; padding:0;}
.productsCar li a.policy {margin:0px 0 0 15px !important; display:block;}

a.getCar				 {background:url(../img/gen/download_form.png) no-repeat; width:126px; height:29px; display:block;}
a.getCar:hover			 {text-decoration:none;}

li.noButton	{width:126px; height:29px; display:block;}


/* Medical section */



div#medPolicy			 {padding:15px 0 0 15px; background-color: #FFF; width:941px; height:820px; clear:both; margin:15px 0 30px 0; border:1px solid rgb(215,215,215);
						background:url(../img/gen/bg_grad.jpg) repeat-x 0px 470px;
						-moz-border-radius:10px; -webkit-border-radius:10px;
						-moz-box-shadow:1px 1px 5px #ccc; -webkit-box-shadow:1px 1px 5px #ccc;}

ul.medPolicy			{width:910px; height:auto; display:block; float:left; padding:30px 0px 20px 10px; border-bottom:1px solid #e2e2e2; clear:both;}
ul.medPolicy li			{list-style:none; float:left;}
ul.medPolicy li	ul li	{list-style:none; float:none;}
ul.medPolicy li	ul.listLeft		{list-style:none; width:280px;}
ul.medPolicy li	ul.listRight	{list-style:none; width:360px;}

.medPolicy li.logo		{width:270px; padding:0; vertical-align:top;}



/* Contact Us section */


div#contactUs			{padding:15px 20px 20px 20px; background-color: #FFF; width:580px; height:520px; float:left; margin:0 10px 30px 10px; border:1px solid rgb(215,215,215); display:block;
						background:url(../img/gen/bg_grad.jpg) repeat-x 0px 190px;
						-moz-border-radius:10px; -webkit-border-radius:10px;
						-moz-box-shadow:1px 1px 5px #ccc; -webkit-box-shadow:1px 1px 5px #ccc;}
						

.formWrapper			{margin:10px 0px 0px 0px; padding:0px; width:560px; vertical-align:top; border:none;}
.formText				{width:110px; float:left; vertical-align:top; padding: 0px 10px 2px 0px; line-height:25px; margin:0px; font-size:13px; text-align:left;}
.formField				{width:380px; float:left; vertical-align:top; padding: 2px 0px 2px 0px; margin:0px 10px 5px 0px;}
.query 					{width:400px; height:100px; margin:0px 0px 0px 0px; }
.formButtonSend			{border:none; width:106px; height:29px; background:url(../img/contact/send.png) no-repeat 0 0; padding:0px; cursor:pointer; margin:10px 0px 0 0;}
.formButtonReset		{border:none; width:106px; height:29px; background:url(../img/contact/reset.png) no-repeat 0 0; padding:0px; cursor:pointer; margin:10px 10px 0 0;}

input.contact, input.required, input.email, textarea, input.captcha {
	font-size: 11px; font-family:'Lucida Grande', Geneva, Arial, Verdana, sans-serif; color: #171717; background-color: #f9f9f9; border: 1px solid #D8D8D8;
	padding:3px; text-align:left; line-height:11px;}

form input.error {background-color:#faacac; font-size: 11px; font-family:'Lucida Grande', Geneva, Arial, Verdana, sans-serif; color: #171717; border: 1px solid #D8D8D8; padding:3px; text-align:left; line-height:11px;}

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


div#contactDetails		{padding:15px 20px 20px 20px; background-color: #FFF; width:255px; height:320px; float:right; margin:0 10px 0 0; border:1px solid rgb(215,215,215); display:block;
						background:url(../img/gen/bg_grad.jpg) repeat-x 0px 40px;
						-moz-border-radius:10px; -webkit-border-radius:10px;
						-moz-box-shadow:1px 1px 5px #ccc; -webkit-box-shadow:1px 1px 5px #ccc;}



/* Client Page section */


div#clientLogo	{width:100%; padding-top:20px;}	

#clientLogo li		{list-style:none; padding:10px 10px 10px 0px; float:left;}
.clientListQuotes	{padding:5px 0 0 0px; font-style:italic; clear:both;}

/* Footer Pages section */


div#col			{width:600px; padding:20px 10px 20px 30px; float:left;} 
div#colRight	{width:320px; height:100%; float:right;}