/* @override http://0.0.0.0:4000/css/screen.css */

/**
 *		css/screen
 *		------------------------------------------------------------------------
 *		Last Modif.: 2008-09-19
 *		------------------------------------------------------------------------
 *		(c) Copyright 2008 Sofa Design, for Icare. 
 *		All rights reserved.
 *		------------------------------------------------------------------------  
 */

/* ---------------------------------------------------------------- */

/* @group =RESET */
/**
 * meyer's RESET 
 * http://meyerweb.com/eric/tools/css/reset/index.html 
 *
 * v1.0 | 20080212
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/**
 * SD additionnal resets
 */
 
a img { border: none; }
address { font-style: normal;}
/* @end */

/* ---------------------------------------------------------------- */

/* @group =DEBUG */
/*div {
	opacity: 0.9999;
	}
html {
	background-color: yellowgreen;
	}
	body{
		background: #aea085 url(grid.png) repeat;
		}
		#header {
			background-color: red;
			}
		#headerPopup {
			background-color: red;
			}
		#content {
			background-color: yellow;
			}
			#breadcrumbs {
				background-color: pink;
				}*/
		/*#footer {
			background-color: cyan;
			}
			#footer dd {
				background-color: burlywood;
				}*/


/* @end */

/* ---------------------------------------------------------------- */

/* @group =LAYOUT */

/*
Based on a center grid:

12 columns 54px + 10px gutter = 758px


*/

html {
	text-align:center;
	}
	body {
		width: 758px;
		margin: 0 auto;
		text-align: left;
		}
		#header {
			width: 758px;
			height: 171px;
			}
		#headerPopup {
			width: 758px;
			height: 171px;
			}
		#content {
			margin-left: 182px;
			min-height: 545px;
			}


/* @end */

/* ---------------------------------------------------------------- */

/* @group =TYPOGRAPHY */

/* Default font settings. 
   The font-size percentage is of 16px. (0.75 * 16px = 12px) */
body  { 
  font: 75%/1.5 Verdana, "Helvetica Neue", Helvetica, Geneva, Arial, sans-serif;
  color: #4c4c4c;
}
sup { vertical-align:super; line-height:0; }
sub { vertical-align:sub; line-height:0; }

/* we use Trebuchet MS for titles */
h1, h2, h3, h4, h5, h6, #breadcrumbs {
	font-family: 'Trebuchet MS', Helvetica, sans-serif;
	}
	
/*
	300%  <-> 36px   (12px * 3)
	200%  <-> 24px   (12px * 2)
	150%  <-> 18px   (12px * 1.5)
	120%  <-> 14.4px (12px * 1.2)
	91.6% <-> 11px   (12px * 0.916)
*/
h1, h2, h3, h4 {
	font-size: 120%;
	text-transform: uppercase;
	}
a, a:link, a:hover, a:visited {
	color: #4c4c4c;
	}
a:hover {text-decoration: none;}

#footer {
	font-size: 91.6%;
	}

/* @end */

/* ---------------------------------------------------------------- */

/* @group =MAIN */
/*
	COLORS
	------
	
	dark:         #aea085 (bg page after gradient...)
	dark mastic:  #d6d2c1 (footer, over black)
	mastic:       #e8e3d1 (bg center)
	light mastic: #f1ecdf (boxes on white)
	ZeBlue:       #45a0b5
	LightBlue:    #eff9f9
	orange:       #f4a236
	green:        #7cbd30
	Kaki:         #a1a553
	grey:         #4c4c4c (for text)
	alt grey:     #808080 (for disabled inputs)
	middle grey   #afafaf (buttons brorder)
	light grey:   #f2f2f2 (used in buttons)
*/
em.required {
	color: #f4a236;
	font-style: italic;
	}


/* 
 * BUTTONS_________________________________________ 
 * 
 */

.buttons a, .buttons button, .buttons div{
    display:block;
    float:right;
    margin:0 7px 0 0;
    background-color:#f2f2f2;
    border:2px solid #afafaf;
    border-top:2px solid #ddd;
    border-left:2px solid #ddd;
    text-decoration:none;
    font-family: Verdana, "Helvetica Neue", Helvetica, Geneva, Arial, sans-serif;
	font-size: 10px;
    font-weight:bold;
    color:#4c4c4c;
    cursor:pointer;
    padding:4px 10px 3px 7px;
}
.buttons button, .buttons div{
    width:auto;
    overflow:visible;
    padding:4px 10px 3px 7px;  /*IE6*/ 
}
.buttons button[type], .buttons div[type]{
    padding:5px 10px 5px 7px;  /*Firefox*/ 
}
.buttons button.disabled {
	opacity: 0.5;
	cursor: default;
	disabled: disabled;
	}
.buttons button.enabled {
	opacity: 1;
	}
*:first-child+html button[type]{
    padding:4px 10px 3px 7px;  /*IE7*/ 
}
.buttons button img, .buttons a img, .buttons div img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}

/* 
 * HTML_________________________________________ 
 * 
 */
html {
	background: #aea085 url(bg_html.png) repeat-x;
	}
	body {
		background: #e8e3d1 url(bg_body.png) no-repeat 0 0;
		}
		#header {
			background: transparent url(bg_header.jpg) no-repeat 0 0;
			text-indent: -9999px;
			}
		#headerPopup {
			background: transparent url(bg_header_popup.png) no-repeat 0 0;
			text-indent: -9999px;
			}
		#footer{}
			#footer div {
				padding-right: 48px;
				padding-top: 1ex;
				background-color: black;
				text-align:right;
				height: 22px ;
				margin-bottom: 20px;
				color: #d6d2c1;
				}
				#footer div a {
					color: #d6d2c1;
					}
				#footer div address {
					display:inline;
					}
			#footer dl {
				background-color: #e8e3d1;
				margin: 20px 0;
				margin-right: 48px;
				overflow: hidden; /*clearing */
				
				}
				#footer dt {
					width: 182px;
					float: left;
					}
					#footer dt img {
						margin: 0 32px 0 39px;
						}
				#footer dd {
					text-align: center; 
					}
		#content {
			
			}
			/* 
			 * BREADCRUMBS_________________________________________ 
			 * 
			 */
			#breadcrumbs {
				width: 525px;
				height: 54px;
				margin-top: 20px;
				background: transparent url(breadcrumbs.png) no-repeat 0 0;
				font-weight: bold;
				}
			/* using ol to avoid the IE6 ID-class bug:
	   		   http://paulirish.com/2008/the-two-css-selector-bugs-in-ie6/ */

			#content ol.first {
				background-position: 0 0;
				}
			#content ol.second {
				background-position: 0 -54px;
				}
			#content ol.third {
				background-position: 0 -108px;
				}
				#breadcrumbs li {
					display:block;
					height: 54px;
					float: left;
					color:  #b2b2b2;
					line-height: 1.4;
					}
					#breadcrumbs li span {
						display: block;
						margin-top: 12px;
						}
					#breadcrumbs .sep {
						display: block;
						text-indent: -9999px;
						}
				#breadcrumbs li.one {
					width: 105px; /* 525/3 - padding-left - padding-right*/
					padding-left: 40px;
					padding-right: 30px;
					}
				#breadcrumbs li.two {
					width: 75px; /* 525/3 - padding-left - padding right */
					padding-left: 60px;
					padding-right: 40px;
					}
				#breadcrumbs li.three {
					width:100px; /* 525/3 - padding-left - padding right */
					padding-left: 70px;
					padding-right: 5px;
					}
				#breadcrumbs.first .one,
				#breadcrumbs.second .one,
				#breadcrumbs.second .two,
				#breadcrumbs.third .one,
				#breadcrumbs.third .two,
				#breadcrumbs.third .three {
					color: white;
					}
				
				/* 
				 * MESSAGE box_________________________________________ 
				 * 
				 */	
				#message {
					position:relative;
					min-height: 75px; /*for pictos */
					width: 490px; /*530 - 2*20px */
					background: #45a0b5 url(bg_message.png) no-repeat -530px bottom;
					margin-top: 20px;
					padding: 20px;
					color: white;
					font-weight: bold;
					}
					#message .first {
						background: #45a0b5 url(bg_message.png) no-repeat 0 0;
						margin: -20px -20px 12px -20px;
						padding: 20px 110px 0px 20px;
						}
					#message p {
						margin-bottom: 12px;
						padding-right: 110px;
						}
					#message img.picto {
						position: absolute;
						top: 20px;
						right: 30px;
						}
					#message dl {
						width: 300px;
						background-color: #eff9f9;
						color: #4c4c4c;
						overflow:hidden;
						padding: 5px 10px;
						margin: 10px 0;
						padding-right: 60px;
						}
					#message dt {
						float: left;
						width:  182px;
						}
					#message .flagbox {
						width: 398px; /* 516px - padding-left */
						min-height: 200px;
						background: transparent url(flagbox.png) no-repeat 0 0;
						color: #4c4c4c;
						padding: 20px 0 0 118px;
						text-align: center;
						margin: 24px 0 12px -31px;					
						}
					#message .flagbox p {
						margin-top: 10px;
						margin-right: 54px;
						padding-right: 20px;
						}
					#message .flagbox .last {
						display:block;
						min-height: 28px;
						margin: 0 -118px;
						background: transparent url(flagbox.png) no-repeat bottom left;
						}
					#message p.infos a {
						font-size: 91.6%;
						color: #f4a236;
						padding: 5px 28px 5px 28px;
						background: transparent url(ico_i.png) no-repeat 0 0;
						}
				
				/*
				 * PAIEMENT____________________________________
				 *
				 */
				#paiement input {
					width: 50px;
				}
				#paiement div {
					text-align: left;
				}
				
				/* 
				 * BOX_________________________________________ 
				 * 
				 */			
				.box {
					position: relative;
					width: 504px; /* 530 - 26 */ 
					background: #fff url(bg_box.png) no-repeat -530px bottom;
					padding: 0 0 24px 26px;
					margin-top: 20px;
					}
					.box h1 {
						margin-left: -26px;
						padding-left: 26px;
						background: #fff url(bg_box.png) no-repeat 0 0;
						height: 40px;
						color: white;
						line-height: 4;
						}
					.box h2 {
						margin: 24px 0 12px -26px;
						padding-left: 26px;
						color: #45a0b5;
						background: transparent url(bg_.box_h2.png) no-repeat 0 0;
					
						}
					.box p {
						margin-right: 24px;
						}
					.price {
						position: absolute;
						top: 175px;
						left: 10px;
						width: 160px;
						height: 82px;
						padding-right: 20px;
						background: transparent url(box_price.png) no-repeat 0 0;
						color:white;
						font-weight: bold;
						text-align: center;
						}
					.price.two {
						right: 0px;
						}
						.price dt {
							margin-top: 25px;
							}
						.price dd {
							margin-top: 5px;
							}
							.price dd #price {
								font-size: 150%;
								}
					/* 
					 * FORM_________________________________________ 
					 * 
					 */
					form li {
						overflow: hidden; /* clearing */
						margin-bottom:10px;
						margin-left: -20px;
					}
					label, p.legend {
						display: block;
						width: 122px; /* 2cols + 2 gutters - 26px -(form li margin-left)*/
						float:left;
						text-align:right;
						margin-right: 10px;
						padding-top: 3px;
						line-height: 1.2;
					
						}
					input, textarea {
						width: 246px;/*4cols + 3 gutters */
						padding: 2px;
						}
					input:focus, input:hover {
						background-color: #eff9f9;	
						}
					input.error {
						border: 2px solid red;	
						}
					.help, li .help, p.info, label.error, ul.error label {
						display: block;
						float: none;
						text-align: left;
						padding-top: 0;
						line-height: 1.4;
						color: #a1a553;
						font-style: italic;
						font-size: 91.6%;
						margin-left: 132px; /* label width + 10*/
						width: 320px;/*5cols + 5 gutters*/
						}
					p.info {
						color: #f4a236;
						font-weight: bold;
					}
					ul.error label, ul.error li, ul.error p {
						padding-left: 18px;
						padding-right: 18px;
						margin-left: -10px;
						width: 450px;
						left: 0px;
						overflow:hidden;
						vertical-align: baseline;
					}
					.help {
						margin-left: 0;
						}
					p.info, p.info2 {
						padding-left: 40px;
						margin-left: 92px; /* label width + 10 - padding-left*/
						margin-top: 1em;
						background: transparent url(ico_warning.png) no-repeat 0 10px;
						}
					p.info2 {
						min-height: 1.6em;
						background: transparent url(ico_i_small.png) no-repeat 12px 0;
						}
						p.info2 a.help {
							margin-left:0;
							}
					label.error, ul.error label {
						color: red;
						}
					a.help, a.help:hover, a.help:visited {
						color: #f4a236;
						font-style: normal;
						font-weight: bold;
						margin-bottom: 10px;
						}
					#new_email_fields {
						overflow: hidden;
						margin-left: 10px;
						width: 408px;
						background-color: #f1ecdf;
						padding: 10px 10px 0 10px;
						}
					/* for radio buttons fieldsets */
					li fieldset input, li fieldset label {
						display: inline;
						float: none;
						width: auto;
						vertical-align: middle;
						}
					li.disabled > input {
						color: #808080;
						-moz-user-input: disabled;
	  					-moz-user-focus: ignore;
	  					border: 2px solid #f2f2f2;
	  					background-color: white;
						}
						li.disabled > input:hover {
							background-color: white;
							}
						li.disabled > input[disabled] {
							/*color: #808080;*/
							color: rgba(050,050,050,.6); /* Firefox... */
							-webkit-text-fill-color: rgba(50, 50, 50, 0.6);
							}
					
					li.enabled > input {
						color: #808080;
						-moz-user-input: enabled;
	  					-moz-user-focus: ignore;
	  					border: 2px solid #f2f2f2;
	  					background-color: white;
						}
						li.enabled > input:hover {
							background-color: white;
							}
						li.enabled > input[enabled] {
							/*color: #808080;*/
							color: rgba(050,050,050,.6); /* Firefox... */
							-webkit-text-fill-color: rgba(50, 50, 50, 0.6);
							}
							
					/* 
					 * BUTTONS_________________________________________ 
					 * 
					 */
					.buttons {
						width: 384px; /* 6cols + 6 gutters */
						margin-top:24px;
						margin-left: 38px; /* 1col + 1 gutter - 26 */
						}
						.buttons li p {
							width: 266px; /* 4cols + 5 gutters */
							float:left;
							color: #a1a553;
							font-size: 91.6%;
							font-style: italic;
							line-height: 1.3;
							margin: -3px 0 2px 0px;
							}
					#message.error {}
					
					#message.error .buttons {
						margin: 0;
						width: auto;
					}
					
					#message.error .buttons a, #message.error .buttons button {
						/*width: auto;*/
						float:none;
						width: 85px;
						margin: 20px auto 10px auto;
					}
					
					/* 
					 * PREVIEW_________________________________________ 
					 * 
					 */
					.preview #important {
						margin: 10px 0 20px 28px;
						overflow:hidden; /* clearing */
						}
						#important img {
							float: left;
							margin-right: 40px;
							}
						#important dl {
							width: 339px;
							height: 73px;
							margin-top:10px;
							background: #7cbd30 url(box_green.png) no-repeat 0 0;
							font-weight: bold;
							}
							#important dt, #important dd {
								width: auto;
								color:white;
								margin: 5px 10px;
								text-align:left;
								}
							#important dt {
								text-transform: uppercase;
								margin-top: 10px;
								}
					.preview dl {
						overflow: hidden; /* clearing */
						margin-bottom:10px;
						margin-left: -20px;
						/*width: 524px;*/ /* box inside width - (margin-left) */
						}
						.preview dt {
							display: block;
							width: 122px; /* 2cols + 2 gutters - 26px -(preview dl margin-left)*/
							float:left;
							text-align:right;
							margin-right: 10px;
							padding-top: 3px;
							line-height: 1.2;
							color: #45a0b5;
							}
						.preview dd {
							width: 348px; /* .preview dl width - dt width - 1 col*/
							padding: 2px;
							font-weight: bold;
							margin-left: 132px;
							}
						.preview dd.clear { /* clearing */
							clear: both;
							visibility:hidden;
							width: 100%;
							height: 0;
							margin: 0;
							padding: 0;
							border: 0;
							}
					#infos_juridiques .section {
						padding: 10px 0 10px 0;
						width: 400px;
						-moz-border-radius: 10px;
						-webkit-border-radius: 10px;
						background: #eff9f9;
						font-size: 91.6%;
						margin-left: 64px; /* 1col + 1 gutter */
						}
						#infos_juridiques .section p, #infos_juridiques .section h3 {
							padding:0;
							margin: 8px 20px;
							}
					#print {
						margin-top:20px;
						text-align: center;
					}
					form#confirmation {
						margin-left: -26px; /* remove box padding */
						}
						#confirmation fieldset, #confirmation .buttons {
							width: 400px;
							margin-left: 64px; /* 1col + 1 gutter */
							}
						#confirmation fieldset {
							padding: 20px 0 10px 0;
							/*height: 100px;*/
							/*background: transparent url(bg_confirmation.png) no-repeat 0 0;*/
							-moz-border-radius: 10px;
							-webkit-border-radius: 10px;
							background-color: #eff9f9;
							font-size: 91.6%;
							}
							#confirmation fieldset p, #confirmation fieldset h3 {
								margin-left: 20px;
								}
							#confirmation fieldset p {
								overflow: hidden;
								margin: 8px 20px;
								}
							#confirmation .links {
								position: relative;
								top:  -15px;
								margin: 0 1em 0 20px;
								padding-top: 15px;
								padding-left: 30px;
								background: transparent url(ico_doc.png) no-repeat 0 1px;
								}
							#confirmation h3 {
								font-family: Verdana, "Helvetica Neue", Helvetica, Geneva, Arial, sans-serif;
								font-size: 100%;
								text-transform: none;
								padding-left: 30px;
								}
							#confirmation label, #confirmation input{
								float: none;
								margin: 0;
								padding: 0;
								width: auto;
								text-align: left;
								}
							#confirmation input {
								float: left;
								}
							#confirmation label {
								margin-left: 30px; /* #confirmation .links padding-left */
								}
							#confirmation li {
								margin-left: 0;
								}
								
							#paiement fieldset {
								margin-left: 20px;
								padding-left: 30px;
								}
				
#ig01 #content h1.banner {
	margin-left:-50px;
	margin-top: 25px;
	}

#ig01 #content #widgets {
	margin: 50px -25;
	height: 100px;
	overflow: hidden; /* clearing */
	}

#ig01 #content #widgets dd {
	line-height: 1.4;
	font-weight: bold;
	overflow: hidden;
	padding-top: 10px;
	}

#ig01 #content #widgets #widget-mobicar {
	width: 256px;
	float: left;
	}

#ig01 #content #widgets #widget-mobicar dt {
	background:transparent url(bg_mobicar-1-mois.png) no-repeat;
	text-indent:-9999px;
	margin-left: 24px;
	width: 210px;
	height: 30px;
	}
#ig01 #content #widgets #widget-mobicar dd {
	background:transparent url(bg_widget_mobicar.png) no-repeat;
	width: 256px;
	height: 69px;
	}

#ig01 #content #widgets #widget-mobicar dd span {
	display: block;
	margin-left: 10px;
	width: 15px;
	height: 4em;
	float: left;
	color: #fff;
	}
#ig01 #content #widgets #widget-conforcar {
	width: 268px;
	margin-left: 306px;
	}

#ig01 #content #widgets #widget-conforcar dt {
	background:transparent url(bg_conforcar-1-mois.png) no-repeat;
	text-indent:-9999px;
	margin-left: 12px;
	width: 244px;
	height: 30px;
	}
#ig01 #content #widgets #widget-conforcar dd span {
	display: block;
	margin-left: 10px;
	width: 15px;
	height: 4em;
	float: left;
	color: #fff;
	}

#ig01 #content #widgets #widget-conforcar dd {
	background:transparent url(bg_widget_conforcar.png) no-repeat;
	width: 268px;
	height: 65px;
	}
	
#ig01 #content #features {
	width: 576px;
	border-collapse:collapse;
	background: transparent url(bg_table_thead.png) no-repeat 0 0;
	margin-bottom: 20px;
	margin-left: -25px;
	}
#ig01 #content #features tfoot th {
	border: 0;
	background: transparent url(bg_table_tfoot.png) no-repeat 0 0;
	}

#ig01 #content #features tfoot th.col2 {
	border: 0;
	background: transparent url(bg_table_tfoot.png) no-repeat top right;
	}
	
#ig01 #content #features tbody {
	border: 1px solid #c0d2d2;
	}

#ig01 #content #features thead tr {
	/*border-right: 1px solid #fff;*/
	}

#ig01 #content #features thead tr.second {
	border-left: 1px solid #c0d2d2;
	border-right: 1px solid #c0d2d2;
	}

#ig01 #content #features th,
#ig01 #content #features td {
	text-align: center;
	border-bottom: 1px solid #5d8585;
	font-weight: bold;
	font-size: 10px;
	}
#ig01 #content #features .col2 {
	border-left: 1px solid #5d8585;
	}
#ig01 #content #features tr.first th {
	overflow:hidden;
	line-height: 25px;
	font-weight: bold;
	text-transform: uppercase;
	color: #fff;
	}

#ig01 #content #features th.mobicar {
	background: #aed6d6 url(txt_mobicar.png) no-repeat 0 0;
	text-indent: -9999px;
	width: 77px;
	line-height: 25px;
	}
#ig01 #content #features th.conforcar {
	background: #f1b898 url(txt_conforcar.png) no-repeat 0 0;
	text-indent: -9999px;
	width: 80px;
	line-height: 25px;
	}

#ig01 #content #features td.m {
	font-size: 120%;
	line-height: 1.1;
	background-color: #daebeb;
	}
#ig01 #content #features td.c {
	font-size: 120%;
	line-height: 1.1;
	background-color: #fbebe3;
	}
#ig01 #footer {
	margin-left: 130px;
	margin-top: 10px;
	font-style: italic;
	}
/* @end */

/* ---------------------------------------------------------------- */


