/*
================= Homepage CSS for Esure 01 04 08 ==========================
*/
/*these are Stellent fixes - DO NOT REMOVE - ============================================*/
/* This style is in here to stop the text shrinking in the contribution form editor*/
p  {margin:0; padding:0 0 10px 0; font-size: 14px; color: #444;}
li {font-size: 14px;}
/*nested generic list fix*/
#container .generic_list ul ul,
#container ol ol  
{padding: 0 0 0 1.5em;}

#container .generic_list ul ul li,
#container ol ol li, 
#container ul ol li 
{font-size: 1em;}

/* Style to fix problems when usin the site studio site manager fragment - fixes the navigation items */
#ssm_body_left {text-align: left;}

.clearfix 	{clear:both;}

/* General page styles*/

body 					{text-align: center; /*for ie */ margin:0; padding:0; font:100% Verdana, Arial, Helvetica, sans-serif; background: #F2F2F2 url(esure_home_page_background.jpg) no-repeat center top; color: #333}
h1   					{font-size:0.9em;color:#F90;}
h2   					{margin:0; padding:0 0 8px 0; font-size:0.7em; color:#F90;}
h3, #container p.h3   	{margin:0; padding:0 0 5px 0; font-size:0.65em; font-weight: bold; color:#F90;}
h4, #container p.h4   	{margin:0; padding:0 0 5px 0; font-size:0.60em; color:#F90;}
h5, #container p.h5   	{margin:0; padding:0 0 5px 0; font-size:0.60em; color:#F90;}
h6, #container p.h6   	{margin:0; padding:0 0 5px 0; font-size:0.60em; color:#F90;}
ul  					{padding: 0 0 10px 0;}
img  					{border: 0}

#container .box p,#container .box li,#container  .linkbox p,#container  .linkbox li{font-size:0.7em; line-height:1.2em;}




.box { border: 1px solid #FF9900; border-bottom:none; border-right: none; float: left; width: 12.55em;padding: 0.5em; margin:0pt 0.5em 1em; height:11em; position:relative; display:inline;}

#container .box p 				{padding-bottom:3px;}
#container .box p.action 		{padding-right: 77px; padding-bottom:15px;}
#container .box h2 				{color:#017BBE; font-size:1.1em; padding-bottom:0}
#container .box h2 a 			{color:#017BBE; text-decoration:none; font-weight:bold;}
#container .box .action a		{background: transparent url(esure_action_small.gif) no-repeat right bottom; font-weight:bold; font-size:1em; color:#FFFFFF; padding:3px 11px 5px 3px; text-decoration:none;}
#container .box .action a:hover 		{background: transparent url(esure_action_small_hover.gif) no-repeat right bottom; color:#FFFFFF;}
#container .box .action_links 			{position:absolute; bottom: 0px; left: 5px;}
#container .box .action_links p.action	{width: 180px; line-height:15px; padding-bottom:12px;}

#main {clear:left; padding: 0 0.5em; width:58.5em} 

#car 		{background: transparent url(esure_hp_box_car.jpg) no-repeat bottom right;}
#home 		{background: transparent url(esure_hp_box_home.jpg) no-repeat bottom right;}
#pet 		{background: transparent url(esure_hp_box_pet.jpg) no-repeat bottom right;}
#travel		{background: transparent url(esure_hp_box_travel.jpg) no-repeat bottom right;}
#loan 		{background: transparent url(esure_hp_box_loan.jpg) no-repeat bottom right;}
#motorbike 	{background: transparent url(esure_hp_box_motorbike.jpg) no-repeat bottom right;}
#van 		{background: transparent url(esure_hp_box_van.jpg) no-repeat bottom right;}


/*=======================================================================================

blue man section added 08/06/2011

=======================================================================================*/
/*car hire*/
#chc	{background: url(esure_ch_box_bg.png) no-repeat bottom right}

/*persional injury*/
#pib	{background: transparent url(esure_pi_box_bg.png) no-repeat bottom right;}

/*breakdown cover*/
#bc 	{background: transparent url(esure_bc_box_bg.png) no-repeat bottom right;}

/*legal protection*/
#lp 	{background: transparent url(eusre_lp_box_bg.png) no-repeat bottom right;}


/*this is the css if the buttons say find out more*/
#container #chc.box .action a,
#container #pib.box .action a, 
#container #bc.box .action a,
#container #lp.box .action a 
{display: block; text-indent: -999em; width: 115px; height: 39px; background-repeat: no-repeat; background-position: left top}

#container #chc.box .action a:hover,
#container #pib.box .action a:hover, 
#container #bc.box .action a:hover,
#container #lp.box .action a:hover
{background-position: -140px top}

#container #chc.box .action a 	{background-image: url(esure_ch_quote_btn_fom.png);}
#container #pib.box .action a	{background-image: url(esure_pi_quote_btn_fom.png);}
#container #bc.box .action a	{background-image: url(esure_bd_quote_btn_fom.png);}
#container #lp.box .action a	{background-image: url(esure_lp_quote_btn_fom.png);}

/*this controls the width of the paragraphs inside the bottom boxes*/
#container #chc.box p,
#container #pib.box p,
#container #bc.box p,
#container #lp.box p
{width: 60%}

/*=======================================================================================

blue man section ENDS

=======================================================================================*/

#container .box.big 	{margin:0 0.5em 1em; width:33em; height: 14em; float:left; position:relative; display:inline;}
#container .box.big p, 
#container .box.big ul, 
#container .box.big ol
{padding-right:340px; padding-bottom:5px}

#container .box.med 	{margin:0 0.5em 1em; width:21.37em; height: 14em; float:left; position:relative; display:inline;}
#container .box.med p, 
#container .box.med ul, 
#container .box.med ol
{padding-right:155px; padding-bottom:5px}

#home.box.med 		{background: transparent url(esure_hp_box_home_med.jpg) no-repeat bottom right;}
#car.box.big 		{background: transparent url(esure_hp_box_car_big.jpg) no-repeat bottom right;}
#home.box.big 		{background: transparent url(esure_hp_box_home_big.jpg) no-repeat bottom right;}
#pet.box.big 		{background: transparent url(esure_hp_box_pet_big.jpg) no-repeat bottom right;}
#travel.box.big 	{background: transparent url(esure_hp_box_travel_big.jpg) no-repeat bottom right;}
#loan.box.big 		{background: transparent url(esure_hp_box_loan_big.jpg) no-repeat bottom right;}
#van.box.big 		{background: transparent url(esure_hp_box_van_big.jpg) no-repeat bottom right;}
#motorbike.box.big 	{background: transparent url(esure_hp_box_motorbike_big.jpg) no-repeat bottom right;}

#container .box.big h2, 
#container .box.med h2 
{font-size:1.5em;}

#container .box.big .action_links, 
#container .box.med .action_links
{padding: 10px 0 14px 0; height:20px; bottom:10px; left:10px; position:absolute;}

#container .box.big p.action,
#container .box.med p.action 
{display:inline; padding:0;}

#container .box.big .action a, 
#container .box.med .action a
{background: transparent url(esure_action.gif) no-repeat bottom right; font-size:2em; color:#FFFFFF; padding: 6px 35px 14px 10px; margin-right:10px;}

#container .box.big .action a:hover, 
#container .box.med .action a:hover 
{background: transparent url(esure_action_hover.gif) no-repeat bottom right; text-decoration:none; font-weight:bold; color:#FFFFFF}	

#links_content 		{clear:left; padding:0 0 1em}
#links.linkbox.big	{width: auto; margin-top:0}

#links_content h1, 
#links_content h2 
{font-size:0.9em; margin: 0 0 0.5em 0; color:#017BBE; padding:0}

#links_content ul {margin:0; list-style:none;}
#links_content li {padding: 0 0 0 10px; background: transparent url(esure_bullet.gif) no-repeat left center; line-height:1.6em;}

.linkbox {float:left;padding:0 1em; height: 7.5em; margin-bottom: 1em;}

#news, 
#links, 
#been_before 
{border-right: 1px solid #FFCC7F;}

/* footer style */
#footer 			{background: #F57421 url(esure_footer_bar.jpg) bottom right no-repeat;  height: 60px; clear:both}

#no_script			{left:12px; margin:10px 0; position:relative; top:10px; text-align:left; float:none; width:100%}
#no_script p 		{font-weight: 700; width:55em; text-align:left; margin:auto}
#no_script p + p 	{font-weight: 400}


/*===================================================

new box for the top of esure home added 04/11/2010

======================================================*/
#ad-box		{width: 56.3em; height: 14.5em; border: 1px solid #f90; border-right: none; border-bottom: none; padding: 0.5em; float: left; margin: 0 0 1em 0.5em; display: inline; background: url(esure_ad_box_background.png) no-repeat right bottom}


/*the additonal div.ad-left& right are in to fix an ie 6 specisifity issue - do not remove*/
/*sets the image to the right and sets the text to the left - if text needed*/


#ad-box.ad-left h2		{background: none; font-size: 1.5em; color: #017BBE; text-align: left}
#ad-box.ad-left p		{width: 50%; font-size: 0.75em; text-align: left}

/*sets the image to the left and sets the text to the right - if text needed*/


#ad-box.ad-right h2		{background: none; font-size: 1.5em; color: #017BBE; text-align: right}
#ad-box.ad-right p		{width: 50%; font-size: 0.75em; text-align: right; float: right}

/*for the buy button*/
#ad-box.ad-left p.action,
#ad-box.ad-right p.action
{width: 183px; clear: both}

#pib .upsell {
    background-image: url("home_pib_banner_es.png");
    bottom: -15px;
	display: block;
    height: 108px;
    position: absolute;
    right: -35px;
    text-indent: -9999px;
    width: 107px;
    background-repeat: no-repeat;
}