* { margin:0; padding:0; font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif;  }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/************************    FONT DEF    ************************/
@font-face {
    font-family: 'OpenSansLight';
    src: url('font/OpenSans-Light-webfont.eot');
    src: url('font/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/OpenSans-Light-webfont.woff') format('woff'),
         url('font/OpenSans-Light-webfont.ttf') format('truetype'),
         url('font/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSansRegular';
    src: url('font/OpenSans-Regular-webfont.eot');
    src: url('font/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/OpenSans-Regular-webfont.woff') format('woff'),
         url('font/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('font/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSansSemibold';
    src: url('OpenSans-Semibold-webfont.eot');
    src: url('OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Semibold-webfont.woff') format('woff'),
         url('OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSansBold';
    src: url('font/OpenSans-Bold-webfont.eot');
    src: url('font/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/OpenSans-Bold-webfont.woff') format('woff'),
         url('font/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('font/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSansExtrabold';
    src: url('font/OpenSans-ExtraBold-webfont.eot');
    src: url('font/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/OpenSans-ExtraBold-webfont.woff') format('woff'),
         url('font/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
         url('font/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
    font-weight: normal;
    font-style: normal;
}



body { background:#fff; height:100%; }
img{ border:none; }

	
	p{	color:#777;
    font-size: 11px; 
	font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; 
	line-height: 19px;
	
}	
p a{ color:#eee; font-weight:bold; }



h1{ color:#F30;	line-height:200%; letter-spacing: 1px; font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; font-size: 12px; text-transform: uppercase; font-weight: lighter;}
h2{ color:#fff;	line-height:200%; letter-spacing: 1px; font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; font-size: 12px; text-transform: uppercase; font-weight: lighter;}

h3{ padding:30px 30px 20px 30px; }
h4{ color:#333;	line-height:200%; letter-spacing: 1px; font-family: 'OpenSansRegular', Arial, Helvetica, sans-serif; font-size: 72px; text-transform: uppercase; font-weight: lighter;}
alink{ color:#000;}
link{ color:#000;}
vlink{ color:#000;}
	
#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}
#supersized { position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
#supersized img{ width:auto; height:auto; position:relative; outline:none; border:none; }
#supersized a { z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; display:block; }
#supersized a.image-loading { background:#111 url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }

/* Division contenant tous les éléments visuels */
#content{
	text-align:left;
	position: absolute;
	visibility: visible;
	height: 100%;
	width: 100%;
	top: 0px;
	left: 0px;
	
}  
/* position du logo */	
#logo{
	position: absolute;
	visibility: visible;
	left: 30px;
	top: 220px;
	z-index: 3001;
}	

#logotype{ position: absolute; visibility: visible; left: 30%; top: 80px;; z-index: 31; }	

#zone{
		 font-family: 'OpenSansRegular', Arial, Helvetica, sans-s
		right: 10px;
		z-index: 30;
		padding: 6px 0px 20px 20px;	   
	}
	


#zoneHaut{
	background:#fff;
	background:url('img/');
	text-align:left;
	position: absolute;
	visibility: visible;
	width: 450px;
	height: 100px;
	top: 230px;
	left:30%;
	z-index: 31;
	padding: 10px 20px 20px 10px;
}

#zoneBas{
	text-align:left;
	position: absolute;
	visibility: visible;
	width: 380px;
	height:auto;
	top: 323px;
	left:30%;
	z-index: 30;
	padding: 0px 0px 0px 10px;
	background-image:url(images/fondRouge.png)
}

/* Division du bas gris foncé  */
#bas{
	text-align:left;
	margin-top: 0px;
	margin-right: auto;
	margin-top: 0px;
	margin-left: auto;
	position: absolute;
	visibility: visible;
	height: 300px;
	width: 2000px;
	top: 0px;
	z-index: inherit;
	background:#FFF;

}	

/* Division commanditaires  */
#commanditaires{
	
    text-align:left;
	margin-top: 0px;
	margin-right: auto;
	margin-top: 0px;
	margin-left: auto;
	position: absolute;
	visibility: visible;
	height: 60px;
	width:400px;
    left: 70%;
    top: 10px;
	z-index: 2000;
	


}	

/* Réseaux sociaux  */
#sociaux{
    text-align:left;
	position: absolute;
	visibility: visible;
	left: 110px;
	top: 250px;
	z-index: 100;


}	


/* Division contenant toute la navigation */
#navigation{
	background-image: url(images/fondBlanc.png);
	text-align:left;
	position: absolute;
	visibility: visible;
	overflow: hidden;
	height: 22px;
	width: 2000px;
	min-width:970px;
	top: 300px;
	left:0px;
	border-bottom-width: 1px;
	border-top-width: 1px;
	border-top-style: dashed;
	border-bottom-style: solid;
	border-bottom-color: #ff3300;
	border-top-color: #666;
	z-index: 1001;

}	


/* Boutons individuels de la barre de navigation */   
a.langue:link { color:#ff3300; text-decoration:none; }

a:link { color:#ff3300; text-decoration:none; }

#navigation .bouton{

	text-align:left;
	position: relative;
	visibility: visible;
	width:125px;
	height: 18px;
	top: 0px;
	font-family: 'OpenSansLight', Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	clear: none;
	float: left;
	letter-spacing: .1em;
	border-right-width: 1px;
	border-right-style: dashed;
	border-right-color: #666;
	text-decoration: none;
	padding-top: 3px;
	padding-right: 5px;
	padding-left: 7px;
	text-transform: uppercase;
	font-weight: bolder;
}

/* Boutons individuels de la barre de navigation en MouseOver */ 

#navigation a.bouton:hover	{
	color: #fff;
	background-image: url(images/fondRouge.png);
	width:126px;
	height: 20px;
	border: 0px;
}	
/* Boutons actif de la barre de navigation Indique la page où ont est */	
#navigation .boutonOn{
	text-align:left;
	position: relative;
	visibility: visible;
	width:126px;
	height: 18px;
	top: 0px;
	font-family: 'OpenSansLight', Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #ff3300;
	clear: none;
	float: left;
	letter-spacing: .10em;
	border-right-width: 1px;
	border-right-style: dashed;
	border-right-color: #666;
	text-decoration: none;
	padding-top: 3px;
	padding-right: 5px;
	padding-left: 7px;
	text-transform: uppercase;
    font-weight: bolder;
}