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

body {
	text-align: center; /* centrage pour IE */
	font-family: arial, geneva, sans-serif;
	font-size: 76%;
	color: #303030;
	line-height: 1.15em;
	font-weight: normal;
	background: #efefef url(../images/bg.gif) repeat-x top left;
	}
	
	body.sections {background: url(../images/bgSections.gif) repeat-x top left;}
	body.sections #container {background: none; height: auto;}
	
	
.center {text-align: center;}
.right {float: right;}
.noshow {display: none;}
	
/* ---[ Mise en page/Structure des pages ]--------------------- */

#container {
	clear: left;
	margin: 0 auto; 
	width: 1070px;
	height: 566px;
	text-align: left;
	background: url(../images/bgContentHome.gif) no-repeat 0 0;
	}
	
/* ---[ Éléments communs ]--------------------- */

#header {
	clear: left;
	margin: 0 auto; 
	width: 978px;
	height: 74px;
	background: url(../images/bgHeader.gif) no-repeat top left;
	padding: 0 31px;
	}	
	
	#logo {
		float: left;
		display: inline;
		width: 456px;
		margin: 14px 0 0 0;
		}
	
	ul#topNav {
		float: right;
		display: inline;
		width: 290px;
		height: 20px;
		margin: 35px 0 0 0;
		}
		
		ul#topNav.en {width: 240px;}
		
		ul#topNav li {
			display: inline;
			font-size: 90%;
			text-transform: uppercase;
			}
			
			/*fr*/
			li#bt_about {width: 55px; padding: 0 15px 0 0; background: url(../images/sep.gif) no-repeat top right;}
			li#bt_contact {width: 70px; padding: 0 15px; background: url(../images/sep.gif) no-repeat top right; }
			li#bt_francais {width: 55px; padding: 0 0 0 15px;}
			/*en*/
			li#bt_aPropos {width: 115px; padding: 0 15px 0 0; background: url(../images/sep.gif) no-repeat top right;}
			li#bt_joindre {width: 70px; padding: 0 15px; background: url(../images/sep.gif) no-repeat top right; }
			li#bt_english {width: 50px; padding: 0 0 0 15px;}
	
#footer {
	clear: both;
	margin: 0 auto; 
	width: 1070px;
	height: 61px;
	text-align: center;
	color: #919191;
	background: url(../images/bgFooter.gif) no-repeat top left;
	padding: 8px 0 0 0;
	}	

	
/* ---[ Navig principale ]--------------------- */

ul#nav {/*Accueil*/
	clear: both;
	float: left;
	width: 1010px;
	height: 60px;
	margin: 10px 0 0 35px;
	background: url(../images/bgNav.gif) no-repeat top left;
	position:relative; z-index: 9999; /*because IE6 is useless crap*/
	}	
	
	#navPhotos {
		clear: both;
		float: left;
		width: 1010px;
		height: 350px;
		margin: 0 0 0 35px;
		background: url(../images/bgNavPhotos.gif) no-repeat top left;
		}
		
	#navSectionsPhotos {
		clear: both;
		float: left;
		width: 1010px;
		height: 80px;
		margin: 0 0 0 35px;
		background: url(../images/bgNavSectionsPhotos.gif) no-repeat top left;
		}	
		
		#navPhotos img, #navSectionsPhotos img {display: inline;}
	
	ul#nav li {
		float: left;
		display: inline;
		list-style: none;
		position: relative;
		width: 153px; 
		height: 42px;
		padding: 18px 0 0 12px;
		font-weight: bold;
		text-transform: uppercase;
		font-size: 14px;
		margin: 0 2px 0 0;
		}	
		
		ul#nav li.multilignes { 
		height: 50px;
		padding: 10px 0 0 12px;
		}
		
		ul#nav li a {text-decoration: none; color: #b00000;}
		
		ul#nav li a:hover, /* highlight le texte*/
		ul#nav li:hover a /*important, highlight tout le bouton, pas juste le texte dessus*/
		{color: #fff;}  
		
	ul#nav li:hover {background: url(../images/bg_btNavOn.gif) no-repeat top left;}
	
		
			/*highlight boutons des pages de section - le background*/
			body#labels li#sectionLabels, 
			body#nameplates li#sectionNameplates, 
			body#overlays li#sectionOverlays, 
			body#switches li#sectionSwitches, 
			body#vehicle li#sectionVehicle, 
			body#promoComm li#sectionPromoComm {background: url(../images/bg_btNavOn.gif) no-repeat top left;}
			
			/*highlight boutons de section - le texte*/
			body#labels li#sectionLabels a:link, body#labels li#sectionLabels a:visited,
			body#nameplates li#sectionNameplates a:link, body#nameplates li#sectionNameplates a:visited,
			body#overlays li#sectionOverlays a:link, body#overlays li#sectionOverlays a:visited,
			body#switches li#sectionSwitches a:link, body#switches li#sectionSwitches a:visited,
			body#vehicle li#sectionVehicle a:link, body#vehicle li#sectionVehicle a:visited,
			body#promoComm li#sectionPromoComm a:link, body#promoComm li#sectionPromoComm a:visited {color: #fff;}
			 	
		
ul#nav ul:after /*From IE 7 lack of compliance*/{
	clear: both;
	display: block;
	font: 1px/0px serif;
	content: ".";
	height: 0;
	visibility: hidden;
	}

ul#nav ul.subnav { /*sous-menu*/
	width: 165px;
	height: auto;
	list-style: none;
	display: none;
	position: absolute;
	top: 60px;
	left: 0;
	background: transparent url(../images/bg_subNavLast.png) no-repeat bottom left;
	padding-bottom: 5px;
	}		
	
ul#nav ul.subnav li {
	width: 130px;
	height: 27px; 
	float: left; /*For IE 7 lack of compliance*/
	display: block !important;
	display: inline; /*For IE*/
	text-transform: none;
	font-weight: normal;
	font-size: 80%;
	padding: 13px 15px 0 20px;
	background: url(../images/bg_btSubNav.gif) no-repeat 0 0; 
	}	

ul#nav ul.subnav li a {
	color: #b00000; 
	text-decoration: underline;
	}	
	
	ul#nav ul.subnav li:hover, ul#nav ul.subnav li:active {background: url(../images/bg_btSubNav.gif) no-repeat 0 -40px;}	
	
	ul#nav ul.subnav li.long {height: 34px; padding: 6px 15px 0 20px;} /* ajouter cette class quand le titre du bouton fait 2 lignes*/
	
	
ul#nav ul.subnav li.first {background: url(../images/bg_btSubNav1.gif) no-repeat 0 0;}	
	ul#nav ul.subnav li.first:hover, ul#nav ul.subnav li.first:active {background: url(../images/bg_btSubNav1.gif) no-repeat 0 -40px;}

	ul#nav ul.subnav li.firstlong {height: 34px; padding: 6px 15px 0 20px;} /* ajouter cette class quand le titre du bouton fait 2 lignes*/
	
	
ul#nav ul.subnav li.firstlong {background: url(../images/bg_btSubNav1.gif) no-repeat 0 0;}	
	ul#nav ul.subnav li.firstlong:hover, ul#nav ul.subnav li.firstlong:active {background: url(../images/bg_btSubNav1.gif) no-repeat 0 -40px;}
	
/*Hyperliens 2e niv*/
ul#nav li:hover li a,  /*hyperlien boutons 2e niv couleur du lien*/
ul#nav li.iehover li a {float: none;}

/*Hyperliens 2e niv - rollover */
ul#nav li:hover li a:hover, 
ul#nav li:hover li:hover a,
ul#nav li.iehover li a:hover,
ul#nav li.iehover li.iehover a {color: #303030; }

ul#nav li:hover ul ul,/* Pas touche! - Doit être placé avant display:block - pour Gecko */
ul#nav li.iehover ul ul {display: none;}

ul#nav li:hover ul,
ul#nav ul li:hover ul,
ul#nav li.iehover ul,
ul#nav ul li.iehover ul {display: block;}


	
			
/* ---[ Contenu ]--------------------- */	

/* Page d'accueil */		
		
#approvedBy {
	clear: left;
	float: left;
	width: 498px;
	height: 100px;
	margin: 14px 130px 0px 108px;
	text-align: center;
	}	

#division {
	float: left;
	width: 182px;
	height: 123px;
	margin: 14px 0 0px 0;
	text-align: center;
	}
	
/* Pages de section */

#sectionId2lignes {
	clear: both;
	margin: 0 auto; 
	width: 964px;
	height: 58px;
	background: url(../images/bgSectionId.gif) no-repeat top left;
	padding: 0 39px 0 37px;
	text-align: left;
	}
	
#sectionId2lignes h1 {
		width: 330px;
		float: left;
		display: inline;
		font-weight: bold;
		text-transform: uppercase;
		font-size: 120%;
		color: #b00000;
		margin-top: 18px;
		}

#sectionId {
	clear: both;
	margin: 0 auto; 
	width: 964px;
	height: 58px;
	background: url(../images/bgSectionId.gif) no-repeat top left;
	padding: 0 39px 0 37px;
	text-align: left;
	}	
	
	#coords {
		float: right;
		display: inline;
		text-align: right;
		width: 630px;
		margin-top: 22px;
		font-size: 90%;
		}	
		
		#coords.en {width: 640px;}
		
#content { /*utiliser pour la page contact*/
	clear: both;
	margin: 0 auto;
	width: 1000px;
	height: auto;
	padding: 10px 20px 15px 20px;
	text-align: left;
	}
	
div.rowLight {  
	clear: both;
	width: 100%; /*cause un scroll horiz*/
	height: auto;
	background: #f2f2f2;
	}

div.rowDark {
	clear: both;
	width: 100%;
	height: auto;
	background: #e6e6e6;
	}

div.centeredBox {margin: 0 auto; width: 1000px;}		
	
div.thumb {
	float: left;
	display: inline;
	width: 192px;
	height: 130px;
	background: transparent url(../images/thumbFrame.png) no-repeat 0 0; 
	margin: 5px 15px 3px 20px;
	padding: 3px 4px 3px 0;
	}
		
div.texte {
	float: left;
	display: inline;
	width: 746px;
	height: auto;
	margin: 5px 0 0 0;
	padding-bottom: 5px;
	text-align: left;
	}	

div.texteLarge {
	float: left;
	display: inline;
	width: 956px;
	height: auto;
	margin: 15px 0 15px 20px;
	padding-bottom: 5px;
	text-align: left;
	}		

#container3 {
	clear: both;
	width: 100%;
	height: 69px;
	background: url(../images/bgContainerFooter.gif) repeat-x top left; 
	}
		
/* ---[ Hyperliens ]------------------------------- */

a:focus, li:focus {outline: none;} /* remove annoying dotted box in Firefox */

a:link, a:visited {
	color: #b00000;
	text-decoration: underline;
	font-size: 100%;
	}

a:hover, a:active {
	color: #303030;
	text-decoration: underline;
	font-size: 100%;
	}	


ul#topNav li a:link, ul#topNav li a:visited {font-size: 90%; text-decoration: underline; color: #b00000;}
ul#topNav li a:hover, ul#topNav li a:active {font-size: 90%; text-decoration: underline; color: #303030;}

#footer a:link, #footer a:visited, #footer a:active {color: #919191;}
#footer a:hover{color: #B00000;}

		 				
/* ---[ Format du texte ]--------------------- */

p {
	font-size: 95%;
	padding: 3px 0 8px 0;
	line-height: 1.50em;
	}


#sectionId h1 {
		width: 330px;
		float: left;
		display: inline;
		font-weight: bold;
		text-transform: uppercase;
		font-size: 120%;
		color: #b00000;
		margin-top: 24px;
		}
			
h2 {
	color: #b00000;
	font-size: 110%;
	padding: 3px 0;
	line-height: 1.50em;
	}	
	
div.texteLarge ul, div.texte ul, #content ul {margin: 0 0 10px 15px;}	
	div.texteLarge ul li, div.texte ul li, #content ul li {list-style-type: square; line-height: 1.50em; margin: 0 0 0 15px;}
	
/* ---[ Éléments de décor et gugusses ]--------------------- */

.hr {
	clear: both;
	width: 100%;
	height: 3px;
	background: transparent url(../images/hrPoint.gif) repeat-x top center;
	margin: 0 auto;
	}
	
hr {display: none;}	


/* ---[ Tables ]--------------------- */

table {width: 650px; margin: 15px 0; border-collapse: collapse; border: 1px #ccc solid; font-size:85%;}
table td {vertical-align: top; padding: 10px; border: 1px #ccc solid;}
table th {text-align: center; padding: 10px; border: 1px #ccc solid;}

/* ---[ Hacks ]--------------------- */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */