/****************************************************************************************/
/*                                                                                      */
/*                         Stylesheet for Napa Rally 5000                               */
/*                                                                                      */
/*                   Sebastien Malherbe / contact: seb@7vision.com                      */
/*                                                                                      */
/****************************************************************************************/


/**** Css reset ****/
@import url("reset.css");
/*******************/
 
body {
	background: #000 url(../images/bg.jpg) repeat-x top left;
	color:#999;
	font-family: Arial, verdana, sans-serif;
	font-size:12px;
	margin: 0 auto;
	height: 100%;
	line-height: 15px;
}

.maskActive { /*** to fake the lightbox effect on the profile page... do not keep on final version ***/
	background: transparent url(../images/mask.png);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 999;
}

.backgroundIllustration {
	background: transparent url(../images/bg_city.jpg) no-repeat 50% 0px;
	min-height: 505px;
}

a:link,
a:visited,
a:active {
	color:#fff;
	text-decoration:none;
}

a:hover{
	color:#ffc423;
	text-decoration:underline;
}

img{
	border:0px;
}

ul {
	padding: 0;
	margin:0;
	list-style-type: none;
}

h1{
	font-size: 2.4em;
	font-weight: normal;
	line-height: 24px;
	padding: 0px;
	margin:0px 0px 4px 0px;
}

h2{
	font-size: 1.6em;
	font-weight: normal;
	text-transform: uppercase;
	padding: 0px;
	margin:0px;
}

h3{
	font-size: 1.5em;
	font-weight: bold;
	padding: 0px;
	margin:0px;
}

h4{
	font-size: 1.3em;
	font-weight: bold;
	padding: 0px;
	margin:0px;
}

/**************** Site's Content ************************/
/********************************************************/

.siteContainer {
	width: 970px;
	margin: 0px auto;
	position: relative;
}

/************* TOP HEADER + Login box + Profile *******************/

#topHeader {
	position: absolute;
	z-index: 1000;
	width: 100%;
	border-top: 3px solid black;
}

#topHeader #topHeaderContent {
	width: 980px;
	margin: 0px auto;
	position:relative;
}

a.lang {
	color: #cc7818;
	text-transform: uppercase;
	font-size: 0.9em;
	margin: 2px 6px;
	float: left;
}

#topHeader #loginBox {
	position:absolute;
	left:50%;
	top:0;
	margin-left:171px;
	
	width: 319px;
	float: right;
}

#topHeader #loginTools {
	background: #111;
	width: 304px;
	height: 15px;
	padding: 5px 5px 5px 10px;
}

#topHeader #loginZone{
	background: #000;
	width: 310px;
	/*height: 23px;*/
	background: transparent url(../images/bg_login_2.gif) no-repeat bottom left;
	padding: 1px 5px 5px 5px;
}

#topHeader #loginBox input.simpleInput {
	width: 120px;
	background: transparent url(../images/bg_login_input.gif) no-repeat 0 0;
	border: none;
	padding: 3px;
	margin-right: 7px;
	float: left;
}

/*** profile ***/

#topHeader #loginZone.profile{
	width: 307px;
	height: 100%;
	background: transparent url(../images/bg_profile.png) no-repeat bottom left;
	padding: 5px 6px 5px 6px;
	font-size: 0.9em
}

#topHeader #loginZone.profile .heading{
	background: transparent url(../images/mask2.png);
	padding: 5px;
	margin-bottom: 15px;
	color: #FFF;
	text-transform: uppercase;
}

#topHeader #loginZone.profile .heading h1{
	font-family: Times;
	font-weight: normal;
	font-size: 1.6em;
	color: #fbba00;
}

#topHeader #loginZone.profile table{
	width: 96%;
	margin: 0px auto;
	color: #fff;
}

#topHeader #loginZone.profile table thead{
	color: #fbba00;
	text-transform: uppercase;
}

#topHeader #loginZone.profile table thead th#description{
	width: 180px;
}

#topHeader #loginZone.profile table thead th span{ 
	/*** allow better alignment of the columns, not really clean method ***/
	margin-left: 22px;
}

#topHeader #loginZone.profile table tfoot tr{
	border-bottom: none;
}

#topHeader #loginZone.profile table tr{
	border-bottom: 1px solid #999;
}

#topHeader #loginZone.profile table tr th,
#topHeader #loginZone.profile table tr td{
	font-weight: lighter;
	padding: 5px 0;
	text-align: left;
	vertical-align: middle;
}

#topHeader #loginZone.profile table thead th#chances,
#topHeader #loginZone.profile table tbody td.chances{
	text-align: right;
}

#topHeader #loginZone.profile table tfoot th#total{
	text-align: right;
	padding-right: 15px;
	color: #fbba00;
}

#topHeader #loginZone.profile table tfoot td#totalChances{
	font-size: 1.8em;
}

#topHeader #loginZone.profile table tbody td.chances{
	font-size: 1.3em;
	vertical-align: middle;
	font-weight: bold;
}

#topHeader #loginZone.profile table tbody td input.sameWidth{
	width: 72px;
}

#topHeader #loginZone.profile table tbody td.code input.code{
	width: 35px;
	float: left;
	padding: 0;
	margin-right: 6px;
}

#topHeader #loginZone.profile table small{
	font-size: smaller;
}

#topHeader #loginZone.profile #logged {
	margin: 15px 5px 010px;
}

#topHeader #loginZone.profile #logged p{
	text-transform: uppercase;
	font-size: 1.2em;
	margin: 2px 0 0 5px;
	float: left;
	color: #fff;
}

/******************** HEADER ****************************/

#header {
	z-index: 2;
	position: relative;
	height: 175px;
}

#logo {
	position: absolute;
	z-index: 3;
	top: 24px;
	left: 25px;
}

/******************** CONTENT ****************************/

#home #content {
	width: 975px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	overflow: visible;
}

#content {
	width: 975px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	overflow: hidden;
}

/******************** Sidebar *******************/

#sidebar {
	background: transparent url(../images/sidebar_header.png) no-repeat 0px 0px;
	width: 319px;
	position: absolute;
	height: 100%;
	z-index: 100;
	right: 1px;
}

#home #sidebar {
	margin-top: -580px;
	z-index: 8;
}

.sidebarContent {
	width: 299px;
	padding: 10px;
}

#facebookWidget {
	background: transparent url(../images/FB_widget_reflection.gif) no-repeat bottom left;
	width: 300px;
	padding-bottom: 40px;
}

#sidebar.hidden {
	top: 480px;
	right: 1px;
}

/****************** Main Content *****************/

#mainContent {
	width: 970px;
	font-size: 0.9em;
}

#page #mainContent {
	width: 970px;
	height:510px;
	font-size: 0.9em;
}

#home #mainContent {
	width: 970px;
	height:510px;
	font-size: 0.9em;
}

/******* Sections "1/3" specific home page **********/

.section {
	width: 170px;
	height: 345px;
	float: left;
	margin: 135px 30px 40px 0;
	position: relative;
	z-index:1;
}

#rallye.section {
	margin-right: 0px !important;
}

.section h1{
	background: transparent url(../images/bg_section_header.png) no-repeat 0 0;
	width: 164px;
	text-align: center;
	padding: 8px 0 17px 0;
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 1px 1px 1px #000;
	font-size: 1.6em;
	margin: 0 auto;
}

/*.section h1 span{
	background: transparent url(../images/triangle.gif) no-repeat 0 5px;
	padding-left: 9px;
}

.section h1:hover span{
	background: transparent url(../images/triangle_jaune.gif) no-repeat 0 5px;
}*/


.section h1 span span, #mainContent a span span{
	display:none;
}
/******* Index Tabs - FR **********/
.section h1 span#spanRallye{
	background: transparent url(../images/fr/rallye2.gif) no-repeat 50px 5px;
	width:164px;
	height:24px;
	display:block;
}

.section h1:hover span#spanRallye{
	background: transparent url(../images/fr/rallye_jaune2.gif) no-repeat 50px 5px;
	width:164px;
	height:24px;
	display:block;
}

.section h1 span#spanSupporters{
	background: transparent url(../images/fr/supporters2.gif) no-repeat 20px 5px;
	width:164px;
	height:24px;
	display:block;
}

.section h1:hover span#spanSupporters{
	background: transparent url(../images/fr/supporters_jaune2.gif) no-repeat 20px 5px;
	width:164px;
	height:24px;
	display:block;
}

/******* Index Tabs - EN **********/

.section h1 span#spanRally{
	background: transparent url(../images/en/rally2.gif) no-repeat 50px 5px;
	width:164px;
	height:24px;
	display:block;
}

.section h1:hover span#spanRally{
	background: transparent url(../images/en/rally_jaune2.gif) no-repeat 50px 5px;
	width:164px;
	height:24px;
	display:block;
}

.section h1 span#spanCrew{
	background: transparent url(../images/en/crew2.gif) no-repeat 15px 5px;
	width:164px;
	height:24px;
	display:block;
}

.section h1:hover span#spanCrew{
	background: transparent url(../images/en/crew_jaune2.gif) no-repeat 15px 5px;
	width:164px;
	height:24px;
	display:block;
}
/**********************************/



.section a.blueArrow{
	position:absolute;
	bottom: 1px;
	left: 5px;
}

.section h1 a{
	display:block;
}

.sectionContent {
	width: 165px;
	height: 200px;
	padding-top:105px;
	position: absolute;
	top:30px;
	left: 5px;
	font-size: 1.2em;
	line-height: 18px;
}

#rallye .sectionContent {
	background: transparent url(../images/bg_panneau.png) no-repeat 10px 0px;
}

#pilotes .sectionContent {
	background: transparent url(../images/bg_volant.png) no-repeat 10px 0px;
}

#supporters .sectionContent {
	background: transparent url(../images/bg_casquette2.png) no-repeat 10px 0px;
}

.sectionContent h2{
	font-family: Times;
	font-weight: normal;
	color: #f7bf3b;
	font-size: 1.2em;
	margin-bottom: 8px;
	text-transform: uppercase;
}

.sectionContent .price{
	margin-top: 15px;
}





/****** Section Open for Content page *************/

.openSection {
	width: 860px;
	height: 378px;
	padding: 50px;
	position: absolute;
	z-index:1;
	top: 38px;
	left: 5px;
	border-top:3px solid #000;
	background: transparent url(../images/bg_opensection_long.png) repeat-x bottom left;
}

.openSection.hidden{
	top: 515px;
	left: 5px;
}

#rallye.openSection {
	z-index: 3 !important;
	background: transparent url(../images/bg_opensection.png) repeat-x bottom left;
}

#pilotes.openSection {
	z-index: 2 !important;
	background: transparent url(../images/bg_opensection.png) repeat-x bottom left;
}

#supporters.openSection {
	z-index: 1 !important;
	background: transparent url(../images/bg_opensection.png) repeat-x bottom left;
}

.openSection h1{
	background: transparent url(../images/bg_onglet.png) no-repeat 0 0;
	width: 164px;
	position: absolute;
	top: -38px;
	left: 3px;
	text-align: center;
	padding: 8px 0 17px 0;
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 1px 1px 1px #000;
	font-size: 1.6em;
}

#pilotes.openSection h1{
	left: 230px;
}

#supporters.openSection h1 {
	left: 460px;
}

/*.openSection h1 span{
	background: transparent url(../images/triangle.gif) no-repeat 0 5px;
	padding-left: 9px;
}

.openSection h1:hover span{
	background: transparent url(../images/triangle_jaune.gif) no-repeat 0 5px;
}*/


/******* Index Tabs - FR **********/
.btn span#spanRallye{
	background: transparent url(../images/fr/rallye2.gif) no-repeat 50px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

.btn:hover span#spanRallye{
	background: transparent url(../images/fr/rallye_jaune2.gif) no-repeat 50px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

.btn span#spanSupporters{
	background: transparent url(../images/fr/supporters2.gif) no-repeat 20px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

.btn:hover span#spanSupporters{
	background: transparent url(../images/fr/supporters_jaune2.gif) no-repeat 20px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

#btn3 span#spanClassFr{
	background: transparent url(../images/p5/fr/tabs_txt-class-off.png) no-repeat 40px 10px;
	margin-top:-9px;
	width:134px;
	height:24px;
	display:block;
}

#btn3:hover span#spanClassFr{
	background: transparent url(../images/p5/fr/tabs_txt-class-on.png) no-repeat 40px 10px;
	margin-top:-9px;
	width:134px;
	height:24px;
	display:block;
}
#btn4 span#spanMapsFr{
	background: transparent url(../images/p5/fr/tabs_txt-maps2-off.png) no-repeat 30px 10px;
	margin-top:-9px;
	width:124px;
	height:24px;
	display:block;
}

#btn4:hover span#spanMapsFr{
	background: transparent url(../images/p5/fr/tabs_txt-maps2-on.png) no-repeat 30px 10px;
	margin-top:-9px;
	width:124px;
	height:24px;
	display:block;
}
/******* Index Tabs - EN **********/

.btn span#spanRally{
	background: transparent url(../images/en/rally2.gif) no-repeat 50px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

.btn:hover span#spanRally{
	background: transparent url(../images/en/rally_jaune2.gif) no-repeat 50px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

.btn span#spanCrew{
	background: transparent url(../images/en/crew2.gif) no-repeat 15px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

.btn:hover span#spanCrew{
	background: transparent url(../images/en/crew_jaune2.gif) no-repeat 15px 10px;
	margin-top:-9px;
	width:164px;
	height:24px;
	display:block;
}

#btn3 span#spanClassEn{
	background: transparent url(../images/p5/en/tabs_txt-class-off.png) no-repeat 40px 10px;
	margin-top:-12px;
	width:121px;
	height:27px;
	display:block;
}

#btn3:hover span#spanClassEn{
	background: transparent url(../images/p5/en/tabs_txt-class-on.png) no-repeat 40px 10px;
	margin-top:-12px;
	width:121px;
	height:27px;
	display:block;
}
#btn4 span#spanMapsEn{
	background: transparent url(../images/p5/en/tabs_txt-maps-off.png) no-repeat 40px 10px;
	margin-top:-12px;
	width:121px;
	height:27px;
	display:block;
}

#btn4:hover span#spanMapsEn{
	background: transparent url(../images/p5/en/tabs_txt-maps-on.png) no-repeat 40px 10px;
	margin-top:-12px;
	width:121px;
	height:27px;
	display:block;
}
/**********************************/


.openSection .sign{
	background: transparent url(../images/big_sign.png) no-repeat 0 0px;
	height: 465px;
	width: 316px;
	position: absolute;
	top: -42px;
	right: -8px;
	z-index: 2;
}

.openSection .volant{
	background: transparent url(../images/big_volant.png) no-repeat 0 0px;
	height: 465px;
	width: 316px;
	position: absolute;
	top: -42px;
	right: 0px;
	z-index: 2;
}

.openSection .hat{
	background: transparent url(../images/big_hat.png) no-repeat 0 0px;
	height: 247px;
	width: 280px;
	position: absolute;
	top: -42px;
	right: 0px;
	z-index: 2;
}

.subCont h2,
.openSection h2{
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #2865a2;
	font-size: 4.2em;
	line-height: 50px;
}

.subCont .openSectionContent,
.openSection .openSectionContent {
	width: 855px;
	height: 240px;
	margin-top: 15px;
	background: transparent url(../images/opensection_separator.png) no-repeat 230px 0px;
	position: relative;
	z-index: 10;
}

.subCont .openSectionContent .oscLeft,
.openSection .openSectionContent .oscLeft {
	width: 230px;
	float: left;
	color: #893d08;
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	font-size: 2em;
	line-height: 23px;
	padding-top: 30px;
}

#cont2 .openSectionContent .oscLeft,
#pilotes.openSection .openSectionContent .oscLeft{
	padding-top: 10px;
}

#cont3 .openSectionContent .oscLeft,
#supporters.openSection .openSectionContent .oscLeft {
	padding-top: 4px;
}

.subCont .openSectionContent .oscRight,
.openSection .openSectionContent .oscRight {
	width: 350px;
	float: left;
	margin-left: 30px;
	padding-top: 30px;
	font-size: 1.4em;
	line-height: 17px;
	color: #333;
	position: relative;
}

#cont3 .openSectionContent .oscRight,
#supporters.openSection .openSectionContent .oscRight {
	padding-top: 10px;
}

.subCont .openSectionContent .oscRight p,
.openSection .openSectionContent .oscRight p{
	margin-top: 30px;
}

.subCont .openSectionContent .oscRight p span,
.openSection .openSectionContent .oscRight p span{
	font-size: 1.2em;
	font-weight: bold;
}

.subCont .openSectionContent .oscRight p span.alignText,
.openSection .openSectionContent .oscRight p span.alignText{
	margin-left: 73px;
}

.subCont .openSectionContent .oscRight a,
.openSection .openSectionContent .oscRight a{
	color: #2865a2;
	text-decoration: underline;
}

.subCont .openSectionContent ul,
.openSection .openSectionContent ul {
	width: 300px;
	margin-top: 20px;
}

.subCont .openSectionContent ul li,
.openSection .openSectionContent ul li{
	padding-left: 20px;
	background: transparent url(../images/puce_bluearrow.png) no-repeat 0 3px;
	margin: 10px 0;
}

ul.arrowList li{
	padding-left: 20px;
	background: transparent url(../images/puce_bluearrow.png) no-repeat 0 6px;
	margin: 10px 0;
}

.subCont .openSectionContent ul li h3,
.openSection .openSectionContent ul li h3{
	font-size: 1.3em;
}

ul.arrowList li h3{
	font-size: 1.8em !important;
}

.subCont .openSectionContent .inscription,
.openSection .openSectionContent .inscription{
	float: right;
	margin-top: 120px;
	margin-left: 0px;
}

/* New Definitions - Jose - Begin */
.btnInscription{
	float: right;
	margin-top: -110px;
	margin-right: -255px;
}

.oscRight .error label, 
.oscRight .error span { color: #C00;}

.oscRight label.regularLabel { 
	margin-right: 0; 
	padding-right: 0; 
	width: auto;
	display: inline;
	float: none;
	position:relative; 
	font-size:0.8em;
}
/* New Definitions - Jose - End*/


.nascarLogo {
	position: absolute;
	top: 130px;
	right: 15px;
	width: 65px;
	height: 70px;
}

/******************** Standard Form *********************/

#form.openSection{
	position: relative;
	color: #333;
	background-position: bottom;
	height: 100%;
	padding-bottom: 50px;
	margin-bottom: 38px;
}

#form.openSection .step{
	position: absolute;
	top: -38px;
	right: 0px;
	background: url(../images/mask.png);
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 8px;
	font-size: 2em;
	color: #FFF;
}

#form.openSection .step ul li{
	float: left;
	padding: 0 5px;
	border-right:1px solid #fff;
	color: #333;
}

#form.openSection .step ul li.active {
	color: #fbba00;
	background: transparent url(../images/triangle_jaune.gif) no-repeat 4px 4px;
	padding-left: 10px;
}

#form.openSection .step ul li.last {
	border: none;
}

#form.openSection h3{
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #2865a2;
	font-size: 2.3em;
	line-height: 25px;
}

#form.openSection ul li h3{
	color: #333;
	font-family: arial, verdana, sans-serif;
	font-weight: bold;
	font-size: 1.7em !important;
}

#form.openSection p{
	font-size: 1.2em;
	margin: 5px 0;
}

.legend { 
	position: absolute;
	top:55px;
	color: #333;
	right: 55px;
}

.legend em { color: #C00; font-style: normal; }

div.errors { 
	margin: 10px 0 10px 0; 
	padding: 5px 10px; 
	border: #FC6 1px solid; 
	background-color: #FFC;
	color: #333;
}

div.errors p { margin:5px  0; }

div.errors p em { 
	color: #C00; 
	font-style: normal; 
	font-weight: bold;
}

.formContainer form { margin-top: 20px; }

.formContainer form a, .confirmationCont a{ 
	color: #2865a2; 
	text-decoration: underline;
}

.formContainer form p { margin: 0;}

.formContainer form p.note { 
	margin-left: 130px !important; 
	width: 500px;
	font-size: 0.9em !important; 
	color: #333;
}

.formContainer form fieldset { 
	margin: 20px 0 0 0; 
	padding: 10px; 
	border-top: 1px solid #666; 
	float: left;
	width:840px;
}

.formContainer form legend { 
	font-weight: bold; 
	color: #666; 
	padding: 0 5px;  
	font-size: 1.5em; 
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #2865a2;
}

.formContainer form fieldset div { 
	padding: 0.25em 0;
	width:410px;
	float:left; 
}

.formContainer form fieldset p { 
	margin: 10px 0 !important; 
	color: #072b4d;
}

.formContainer label, 
.formContainer span.label { 
	margin-right: 10px; 
	margin-top: 3px; 
	padding-right: 10px; 
	width: 130px; 
	display: block; 
	float: left; 
	text-align: left; 
	position: relative;
}

.formContainer label.regularLabel { 
	margin-right: 0; 
	padding-right: 0; 
	width: auto;
	display: inline;
	float: none;
	position:relative; 
}

.formContainer .error label, 
.formContainer .error span { color: #C00;}

.formContainer label em, 
.formContainer span.label em { 
	position: absolute; 
	left: -5px; 
	font-size: 120%; 
	font-style: normal; 
	color: #C00;
}

.formContainer input { 
	border: 1px solid #333; 
	padding: 4px;
}

.formContainer input.regularField { 
	width:226px;
}

.formContainer input.date2Field { 
	width:50px;
}

.formContainer input.date4Field { 
	width:100px;
}

.formContainer input.zipField { 
	width:106px;
}

.formContainer .textareaField { 
	width:800px;
	height:100px;
}

input[type="checkbox"], input[type="radio"]{
   background: transparent;
   border: 0;
}

.formContainer .error input { 
	border-color: #C00; 
	background-color: #FEF;
}

.formContainer input:focus,
.formContainer .error input:focus, 
.formContainer textarea:focus {	
	background-color: #ecf5ff; 
	border-color: #7bb0ec;
}

.formContainer div.controlset label, 
.formContainer div.controlset input { 
	display: inline; 
	float: none;
}

.formContainer div.controlset div { 
	margin-left: 0px;
}

.formContainer div.buttonrow { 
	margin-left:0px; 
	background: #ccc; 
	padding: 10px;
}

.formContainer div.intoform { 
	margin-left: 140px; 
	margin-top: -10px;
}

.formContainer hr { 
	border:0;
	color: #a9a9a9;
	background-color: #a9a9a9;
	height: 1px;
	clear:both;
}


/******************** PROMO *****************************/

#promo {
	background: transparent url(../images/bg_promo.gif) no-repeat 50% 0;
	width: 100%;
}

#promoContent {
	width: 960px;
	margin: 0px auto;
}

#promoContent h1{
	background: transparent url(../images/bg_onglet_promo.png) no-repeat 0 0;
	width: 118px;
	text-align: center;
	padding: 4px 0 4px 0;
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 1px 1px 1px #000;
	font-size: 1.1em;
}

/*#promoContent h1 span{
	background: transparent url(../images/triangle.gif) no-repeat 0 2px;
	padding-left: 9px;
}*/

#promoContent h1 #spanPromotion, #promoTabs #spanPromotion{
	background: transparent url(../images/promos/promotions.gif) no-repeat 10px 6px;
	padding-left: 9px;
	width:118px;
	height:24px;
	display:block;
}

div.scrollable { 
	position:relative; 
	overflow:hidden; 
	width: 650px; 
	height:137px; 
} 

div.scrollable div.items { 
	width:20000em; 
	position:absolute; 
} 

a.disabled {
	visibility:hidden !important;		
}
/*  
div.scrollable div.items div { 
	float:left;
} 
 
div.items div.active {  
    background-color:#333; 
}
*/ 

/***** Store Locator *****/
#storePic {
	background: transparent no-repeat 0 0;
	width: 300px;
	height: 137px;
	float: right;
	margin-top: -17px;
	padding-bottom: 25px;
	position: relative;
	z-index: 1;
}

#storeLocator {
	
	width: 300px;
	height: 137px;
	float: right;
	/*margin-top: -17px;*/
	padding-bottom: 25px;
	position: relative;
	z-index: 1;
	padding-top:5px;
}

#storeLocator form{
	position: absolute;
	bottom: 33px;
	width: 295px;
	text-align:left;
}

#storeLocator form input.postalCode{
	width: 77px;
	background: transparent url(../images/bg_storelocator_input.gif) no-repeat 0 0;
	border: none;
	margin-top: 1px;
	padding: 3px;
	/*float: right;*/
}

#storeLocator form input#CP1, #storeLocator form input#CP2{
	width: 34px;
	background: transparent url(../images/bg_storelocator_miniinput.gif) no-repeat 0 0;
	border: none;
	margin-top: 1px;
	padding: 3px;
	float: left;
}

#storeLocator form label{
	/*margin: 4px 7px 0 10px;
	background: transparent url(../images/triangle_gris.gif) no-repeat 0 4px;
	font-family: Times;
	padding-left: 8px;
	font-weight: normal;
	text-transform: uppercase;
	color: #ccc;
	font-size: 1em;
	float: left;*/
}

/*** Specific footer ****/

#footerRight #storeLocator {
	background: transparent url(../images/bg_storelocator_simple.gif) no-repeat 0 0;
	width: 300px;
	height: 38px;
	float: right;
	margin-top: 5px;
	padding-bottom: 25px;
	position: relative;
	z-index: 1;
}

/********************* Promo Slider *********************/

#promoSlider {
	width: 655px;
	float: left;
	position: relative;
	margin-top: 10px;
	z-index: 10;
}

a.sliderPrev {
	position:absolute;
	top: 20px;
	left: -30px;
}

a.sliderNext {
	position:absolute;
	top: 20px;
	right: -20px;
}

#promoSlider .productBloc {
	width: 208px;
	height: 115px;
	float: left;
	margin-right: 10px;
	color: #fff;
}

#promoSlider .productBloc a.thumbnail,#promoSlider .productBloc span.thumbnail{
	width: 74px;
	height: 74px;
	float: left;
	background: transparent url(../images/bg_promo_product.gif) no-repeat 0 0px;
	padding: 7px 7px 25px 7px;
}

#promoSlider .productBloc a.thumbnail img,#promoSlider .productBloc span.thumbnail img{
	border: 3px solid #FFF;
}

#promoSlider .productBloc a.thumbnail img:hover{
	border: 3px solid #fabb00;
}

#promoSlider .productBloc h3 {
	padding: 4px 0;
}

#promoSlider .productBloc h3 a, #promoSlider .productBloc h3 span{
	font-family: Times;
	font-weight: normal;
	font-size: 0.9em !important;
	color: #999;
	text-transform: uppercase;
}

#promoSlider .productBloc h3 a:hover{
	color: #fabb00;
	text-decoration: none;
}

#promoSlider .productBloc p{
	font-size: 0.9em;
}

#promoSlider .productBloc .ref{
	font-size: 0.8em;
	padding: 4px 0;
	color: #666;
}

#promoSlider .productBloc .price{
	font-size: 1.3em;
	color: #fff;
	text-shadow: 1px 1px 1px #000;
	padding: 5px;
	background: #222;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	float: left;
}


/******************** FOOTER ****************************/

#footer {
	background: #000 url(../images/bg_carbon2.gif) repeat-x 0 0px;
	height: 300px;
}

#footerContent {
	background: transparent url(../images/bg_footercontent.png) repeat-x 0 0px;
	margin: 0px auto;
	width: 1000px;
	height: inherit 
}

* html #footerContent {
	background: transparent url(../images/bg_footercontent.gif) repeat-x 0 0px;
}

#footerLeft {
	width: 630px;
	float: left; 
	margin: 20px 0 0 40px;
}

#flashDisplay {
	width: 485px;
	line-height: 22px;
	vertical-align: middle;
	background: transparent url(../images/bg_footer_display.gif) no-repeat 0 0px;
	margin-bottom: 40px;
} 

#footerRight {
	width: 290px;
	float: right; 
	margin: 15px 20px 0 5px;
}

#footerRight h2, #partners h2 {
	padding: 4px 0 10px 0;
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #ccc;
	text-shadow: 1px 1px 1px #000;
	font-size: 1em;
	margin-top: 6px;
	/*padding-left: 8px;*/
	/*background: transparent url(../images/triangle_gris.gif) no-repeat 0 7px;*/
	float: left;
}

#partners img {
	/*display:block;
	float:left;*/
	border:none;
	margin-right:10px;
}

#partners a:hrev {
	text-decoration:none;
	border:none;
}

#social {
	background: transparent url(../images/bg_social.png) no-repeat 0 0;
	padding: 4px 7px;
	margin: 0 5px;
	float: left;
}

#social a{
	margin-right: 4px;
}

#partners {
	background: transparent url(../images/bg_hl.gif) repeat-x 0 0;
	padding: 15px;
	height: 100px;
	margin: 30px 20px;
}

#legal {
	padding: 15px;
	margin: 10px 20px 20px 5px;
}

#legal ul li{
	float: left;
	padding: 0 20px;
	border-right: 1px solid #666;
}

#legal ul li.last{
	border-right: none;
}

#legal ul li a{
	color: #666;
	font-size: 0.9em;
	text-decoration: underline;
}

#legal ul li a:hover{
	color: #fff;
}

/******************** Usefull ****************************/

.clearBoth {
	clear: both;
	margin-top: 5px;
}

.blueArrow {
	background: transparent url(../images/bg_blue_arrow.gif) no-repeat 0 0px;
	line-height: 17px;
	width: 95px;
	overflow: hidden;
	vertical-align: middle;
	color: #fff;
	text-transform: uppercase;
	font-size: 0.9em;
	padding-left:3px;
}

.positionLeft {
	float: left;
}

.positionRight {
	float: right;
}

.yellow {
	color: #fbba00;
}

/******* button on an input *********/

div.buttonBlue {
    background: transparent url(../images/button_blue_right.png) no-repeat top right;
    color: #fff;
    display: block;
    height: 22px;
    margin-right: 4px;
    padding-right: 4px; /* sliding doors padding */
    text-decoration: none;
    cursor: pointer;
 }

div.buttonBlue input {
    background: transparent url(../images/button_blue_left.png) no-repeat;
    display: block;
    height: 22px;
   	padding: 3px 0px 4px 4px;
    cursor: pointer;
    border: none;
    color: #FFF;
    text-transform: uppercase;
    font-size: 0.9em;
    font-family: arial, Sans-serif;
}

div.buttonBlue:hover,
div.buttonBlue.Up:hover,
div.buttonBlue.Down:hover {
    background-position: bottom right;
    text-decoration: none;
    outline: none; /* hide dotted outline in Firefox */
}

div.buttonBlue:hover input {
    background-position: bottom left;
    color: #000;
}

/**** Specific Up and Down Arrows Buttons ****/

div.buttonBlue.Up {
    background: transparent url(../images/button_blueArrowUp_right.png) no-repeat top right;
    margin-right: 0px;
    padding-right: 23px; /* sliding doors padding */
}
 
div.buttonBlue.Down {
    background: transparent url(../images/button_blueArrowDown_right.png) no-repeat top right;
    margin-right: 0px;
    padding-right: 23px; /* sliding doors padding */
 }

/**** small button ****/

div.buttonSmallBlue {
    background: transparent url(../images/button_smallblue_right.png) no-repeat top right;
    color: #fff;
    display: block;
    height: 19px;
    margin-right: 4px;
    padding-right: 4px; /* sliding doors padding */
    text-decoration: none;
    cursor: pointer;
 }

div.buttonSmallBlue input {
    background: transparent url(../images/button_smallblue_left.png) no-repeat;
    display: block;
    height: 19px;
   	padding: 3px 0px 4px 4px;
    cursor: pointer;
    border: none;
    color: #FFF;
    text-transform: uppercase;
    font-size: 0.8em;
    font-family: arial, Sans-serif;
}

div.buttonSmallBlue:hover {
    background-position: bottom right;
    text-decoration: none;
    outline: none; /* hide dotted outline in Firefox */
}

div.buttonSmallBlue:hover input {
    background-position: bottom left;
    color: #000;
}



#iframeWrap { 
	margin:0;
	/*padding:20px;*/
	height:100%;
	background:#FFF;
}



/* -------------------------------------------------------- OLD */
.formStep3 {
	position: absolute;
	left: 50px;
	top: 150px;
	width:820px;
}

.formStep3Next {
	visibility:hidden; 
	width:150px; 
	left:155px; 
	position:absolute; 
	top:160px;
}

.formStep3Last {
	visibility:hidden; 
	width:150px; 
	left:0px; 
	position:absolute; 
	top:160px;
}


/* -------------------------------------------------------- NEW */

.cont, .btn { position:absolute; bottom:0; }
.subCont { position:relative; padding:50px; }

#cont2 .pic{
	background: transparent url(../images/big_sign.png) no-repeat 0 0px;
	height: 465px;
	width: 316px;
	position: absolute;
	top: -42px;
	right: -8px;
	z-index: 2;
}

#cont3 .pic{
	background: transparent url(../images/big_volant.png) no-repeat 0 0px;
	height: 465px;
	width: 316px;
	position: absolute;
	top: -52px;
	right: 20px;
	z-index: 2;
}

#cont1 .pic{
	background: transparent url(../images/big_hat.png) no-repeat 0 0px;
	height: 247px;
	width: 280px;
	position: absolute;
	top: -52px;
	right: 20px;
	z-index: 2;
}
	
.cont {
	width: 960px;
	height: 468px;
	padding: 0px;
	position: absolute;
	z-index:1;
	left: 5px;
	border-top:3px solid #000;
	background: transparent url(../images/bg_opensection_long.png) repeat-x bottom left;
}
#cont1 { }
#cont2 { }
#cont3 { }
	
.btn {
	position:absolute; display:block;
	bottom:0px;
	z-index:10;
	background: transparent url(../images/bg_onglet.png) no-repeat 0 0;
	width: 164px;
	left: 5px;
	text-align: center;
	padding: 12px 0 13px 0;
	font-family: Times;
	font-weight: normal;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 1px 1px 1px #000;
	font-size: 1.6em;
	margin:0 0 -2px 0;

}

/*.btn span{
	background: transparent url(../images/triangle.gif) no-repeat 0 5px;
	padding-left: 9px;
}

.btn:hover span{
	background: transparent url(../images/triangle_jaune.gif) no-repeat 0 5px;
}*/

#btn2 { left:230px; }
#btn3 { left:460px; }
#btn4 { left:690px; }

#btnFacebook {
	position:absolute;
	display:block;
	margin:0 0 -4px 0;
	padding: 10px 10px 0 10px;
	width: 300px;
	bottom:0px;
	left:655px;
	z-index:1000;
	background: transparent url(../images/sidebar_header.png) no-repeat 0px 0px;
	cursor:pointer;	
}
#facebookDiv { 
	position:absolute;
	display:block;
	margin:0;
	padding:0px 10px;
	width:297px;
	height:480px;
	bottom:0px;
	left:656px;
	/*background: transparent url(../images/FB_widget_reflection.gif) no-repeat bottom left;*/
	background:#000;
	z-index:105;
}


#txt1 { background: url(../images/fr/txt_bottom_1.png) no-repeat center center; display:block; width:112px; height:13px; }
#txt1en { background: url(../images/en/txt_bottom_1.png) no-repeat center center; display:block; width:112px; height:13px; }
#txt1 span, #txt1en span { display:none; font-size:8px; line-height:8px; }

#txt2 { background: url(../images/fr/txt_bottom_2_off.png) no-repeat center center; display:block; width:141px; height:15px; }
#txt2:hover { background-image: url(../images/fr/txt_bottom_2_on.png); }
#txt2en { background: url(../images/en/txt_bottom_2_off.png) no-repeat center center; display:block; width:141px; height:15px; }
#txt2en:hover { background-image: url(../images/en/txt_bottom_2_on.png); }
#txt2 span, #txt2en span { display:none; font-size:8px; line-height:8px; }

#txt4 { background: url(../images/fr/txt_bottom_4_off.png) no-repeat center center; display:block; width:102px; height:13px; }
#txt4:hover { background-image: url(../images/fr/txt_bottom_4_on.png); }
#txt4en { background: url(../images/en/txt_bottom_4_off.png) no-repeat center center; display:block; width:102px; height:13px; }
#txt4en:hover { background-image: url(../images/en/txt_bottom_4_on.png); }
#txt4 span, #txt4en span { display:none; font-size:8px; line-height:8px; }

.inputfile { margin:auto; padding:inherit; width:auto; height:auto; display:inline; border:inherit; position:relative; float:inherit; }
