body{ background:url(../images/bg.jpg) repeat-x #0b539f;}
h1, h2, h3, h4, p{ font-family:'calibri'; margin:0; padding:0;}
ul, li{ font-family:'calibri';}
p{ text-align:justify; line-height:25px; font-size:13pt;}
a{ font-family:'calibri';}
h1{ margin:5px 0 0 10px; text-shadow:1px 1px 1px #333;}
h2{ text-shadow:1px 1px 1px #333;}
strong{text-shadow:1px 1px 0px #333;}

/*** main css ***/
#content{ width:1000px; height:auto; float:left; position:relative;}
#wrapper{ width:1000px; height:1780px; margin:0 auto; display:block; position:relative; background:url(../images/bg.png) repeat; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.5);}
#main-wrapper{ width:1000px; height:auto; margin:0 auto; display:block; position:relative;}
.bg-content{ width:723px; height:auto; background:url(../images/bg-texte.jpg); float:right; border:thin #000 solid; border-top:none; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 0 0;}
.sidebar{ width:265px; height:auto; float:left;}

/*** section head ***/
.head{ width:1000px; height:225px; margin:10px auto; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); background:url(../images/bg-head.jpg); position:relative;}
ul.titre{ position:absolute; top:85px; left:-20px; color:#FFF; list-style:none;}
ul.titre li{ font-size:28pt;}

img.ultramar{ position:absolute; top:15px; left:10px;}
img.logo{ position:absolute; top:25px; left:115px;}
img.pneus{ position:absolute; bottom:0px; right:175px;}

.partage{ position:absolute; bottom:25px; right:10px; width:auto;}
.partage p{ color:#FFF; float:left; font-size:14pt; margin:3px 5px 0 0;}
.share{ float:right;}

/*** navigation ***/
.navigation{ width:auto; height:auto; background:#f9b52d; position:relative; float:right; clear:right; margin:200px -10px 0 0; 
box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); border:thin #000 solid; border-radius:8px;}

.navigation ul{ list-style:none; margin:0; padding:0; width:auto;}
.navigation li{ display:inline;}
.navigation a{ text-decoration:none; padding:15px 0 0 0; width:116px; color:#000; float:left; text-align:center; border-left:1px solid #000; height:35px; font-family:'calibri'; font-size:14pt; text-shadow:1px 1px 1px #000;}
.navigation a:hover{ background:url(../images/bg-nav.jpg); color:#fff; border-left:1px solid #000; font-weight:bold;}
.navigation a.active{ background:url(../images/bg-nav.jpg); color:#fff; border-left:1px solid #000; font-weight:bold;}

a.nav-contact:hover{ background:url(../images/bg-nav.jpg); color:#fff; border-left:1px solid #000; font-weight:bold; border-radius:0px 5px 5px 0px;}
a.active-accueil{ background:url(../images/bg-nav.jpg); color:#fff; border-left:1px solid #000; font-weight:bold; border-radius:5px 0px 0px 5px ;}
a.nav-accueil:hover{ background:url(../images/bg-nav.jpg); color:#fff; border-left:1px solid #000; font-weight:bold; border-radius:5px 0px 0px 5px ;}
a.active-contact{ background:url(../images/bg-nav.jpg); color:#fff; border-left:1px solid #000; font-weight:bold; border-radius:0px 5px 5px 0px;}

/*** début de sidebar ***/
.sidebox1{ width:265px; height:auto; float:left; background:url(../images/bg-sidebar-promo.jpg); border:thin #000 solid; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 10px 0; padding-bottom:20px;}
.sidebox1 h2{ color:#f9b52d; text-shadow:2px 2px 2px #000; margin:50px 0 0 10px; border-bottom:thin #f9b52d dotted; width:245px;}

.sidebox2{ width:265px; height:auto; float:left; clear:left; background:url(../images/bg-sidebar-services.jpg); border:thin #000 solid; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 0 0; padding-bottom:15px;}
.sidebox2 h2{ color:#000; text-shadow:1px 1px 1px #333; margin:10px 0 0 10px; width:245px; border-bottom:thin #000 dotted;}
.sidebox2 ul{ margin:15px 20px 0 30px; padding:0;}
.sidebox2 li{ line-height:28px; font-size:13pt; text-shadow:1px 1px 0px #333;}
.sidebox2 li:hover{ font-weight:bold; cursor:default;}
.sidebox2 a{ color:#000; text-decoration:none;}
.sidebox2 a:hover{ font-weight:bold;}

.voyants{width:150px; height:38px; display:block; background:url('../images/voyants-lumineux.png') bottom; margin:20px 0 15px 52px;}
.voyants:hover{ background-position:0 0;}
img.carte{ margin:10px 0 0 10px; border:thin #000 solid;}
img.caa{ margin:35px 0 0 10px;}
img.promo-service-pneus{ float:left; margin:10px 0 10px 80px; border:thin #000 solid;}
img.propro{ float:left; margin:10px 0 10px 145px; border:thin #000 solid;}

/*** début de texte ***/
.texte1{ width:723px; height:auto; float:left; margin:10px 0 10px 0;}
.texte1 h1{ width:700px; border-bottom:dotted #000 thin; margin:5px 0 15px 10px;}
.texte1 h2{ width:700px; border-bottom:dotted #000 thin; margin:5px 0 15px 10px;}
.texte1 p{ width:425px; height:auto; margin:10px 0 5px 15px; line-height:25px;}
.texte1 a{ color:#000; text-decoration:none; text-shadow:1px 1px 0px #000;}

.promo-pneus{width:500px; height:211px; display:block; background:url('../images/affiche.jpg') bottom; float:left; margin:0 0 5px 100px; border:thin #333 solid;}
.promo-pneus:hover{ background-position:0 0;}
img.mecanique{ float:right; margin:3px 25px 0 0; border:thin #000 solid;}
img.mecanique3{ float:right; margin:3px 15px 0 0; border:thin #000 solid;}
img.marque{ float:left; margin:0px 0 0 10px; border:none;}

/*** début de texte ***/
.texte2{ width:723px; height:auto; float:left; margin:10px 0 10px 0;}
.texte2 h2{ width:700px; border-bottom:dotted #000 thin; margin:5px 0 15px 10px;}
.texte2 p{ width:425px; height:auto; margin:10px 20px 5px 15px; line-height:25px; float:right;}
.texte2 a{ color:#000; text-decoration:none; text-shadow:1px 1px 0px #000;}
img.mecanique2{ float:left; margin:3px 0 0 25px; border:thin #000 solid;}

/*** début de footer ***/
.footer{ width:1000px; height:205px; background:#000; float:left; margin:10px 0 10px 0; webkit-box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); moz-box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3);}

.adresse-foot{ width:270px; height:125px; margin:0; float:left;}
.adresse-foot ul{ margin:15px 0 0 0; list-style:none; border-right:thin #CCC solid;} 
.adresse-foot li{ line-height:24px; font-size:13pt; color:#ccc;}

.adresse-left{ width:auto; height:50px; float:right; margin-right:65px;}
.adresse-left ul{    
	list-style: none;
    clear: left;
    margin: 25px 0 0 0;}
.adresse-left li{ float:left; font-size:12px; margin:0 47px 0 0px; color:#ccc}

.nav{ margin:25px 0 0 15px; font-family:'calibri';}
.nav a{ color:#FFF; margin:15px 7px 0 0px; font-size:12pt; text-decoration:none; border-right:thin #FFF solid; padding-right:10px;}
.nav a:hover{ text-decoration:underline;}
.nav ul{ float:left; margin:10px 0 0 115px;}
.nav li{ float:left; list-style:none;}

/*********************************************** Page produits *************************************************************/
#wrapper-produits{ width:1000px; height:2050px; margin:0 auto; display:block; position:relative; background:url(../images/bg.png) repeat; 
box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.5);}
#wrapper-flotte{ width:1000px; height:920px; margin:0 auto; display:block; position:relative; background:url(../images/bg.png) repeat; 
box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.5);}
.produits{ width:1000px; height:auto; background:url(../images/bg-produits.jpg); float:left; border:thin #000 solid; border-top:none; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 0 0; padding-bottom:20px; position:relative;}
.produits h1{ width:980px; border-bottom:dotted #000 thin; margin-bottom:10px;}
.produits p{ width:538px; height:auto; margin:10px 0 5px 15px;}

.section-produit{ width:980px; height:auto; float:left;}
.produits h2{ width:980px; border-bottom:dotted #000 thin; margin:15px 0 15px 10px; float:left;}
.section-produit p{ width:675px; height:auto; margin:10px 0 5px 15px;}
.section-produit li{ font-size:13pt;}
 
.promo-pneus2{width:500px; height:211px; display:block; background:url('../images/affiche.jpg') bottom; float:left; margin:0 0 5px 225px; border:thin #333 solid;}
.promo-pneus2:hover{ background-position:0 0;}

img.piece22{ float:right; margin:10px 10px 0 0;}
img.piece{ float:right; margin:10px 10px 0 0; border:thin #000 solid;}
img.tire{ float:right; margin:0px 10px 0 0; border:none;}
img.marque2{ float:left; margin:10px 0 0 35px;}
img.service3{ float:right; margin:10px 10px 0 0;  border:thin #000 solid;}

/*********************************************** Page services *************************************************************/
#wrapper-services{ width:1000px; height:2360px; margin:0 auto; display:block; position:relative; background:url(../images/bg.png) repeat; 
box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.5);}
.services{ width:1000px; height:auto; background:url(../images/bg-produits.jpg); float:left; border:thin #000 solid; border-top:none; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 0 0; padding-bottom:20px; position:relative;}
.services h1{ width:980px; border-bottom:dotted #000 thin; margin-bottom:20px;}
.services p{ width:538px; height:auto; margin:10px 0 5px 15px;}

.section-services{ width:980px; height:auto; float:left;  position:relative;}
.section-services h2{ width:980px; border-bottom:dotted #000 thin; margin:25px 0 15px 10px; color:#000;}
.section-services p{ width:675px; height:auto; margin:15px 0 5px 15px;}

img.serv{float:right; margin:0px 10px 0 0px; border:thin #000 solid;}
img.aqua{ float:left; margin:10px 0 0 180px;}

.voyants2{width:150px; height:38px; display:block; background:url('../images/voyants-lumineux.png') bottom; float:right; margin:-30px 350px 0 0;}
.voyants2:hover{ background-position:0 0;}

/*********************************************** Page promotion *************************************************************/
#wrapper-promo{ width:1000px; height:775px; margin:0 auto; display:block; position:relative; background:url(../images/bg.png) repeat; 
box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.5);}
.promo{ width:1000px; height:auto; background:url(../images/bg-produits.jpg); float:left; border:thin #000 solid; border-top:none; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 0 0; padding-bottom:20px; position:relative;}
.promo h1{ width:980px; border-bottom:dotted #000 thin; margin-bottom:20px;}
.promo p{ width:538px; height:auto; margin:10px 0 5px 15px;}

.section-promo{ width:980px; height:auto; float:left;}
.section-promo h2{ width:980px; border-bottom:dotted #000 thin; margin:10px 0 10px 10px; float:left;}
.section-promo p{ width:600px; height:auto; margin:10px 0 5px 15px; float:left;}

.promo-pneus2{width:500px; height:211px; display:block; background:url('../images/affiche.jpg') bottom; float:left; margin:4px 0 5px 238px; border:thin #333 solid;}
.promo-pneus2:hover{ background-position:0 0;}

img.tsunami{ float:left; margin:20px 0 0 290px; border:thin #000 solid;}

/*********************************************** Page contact *************************************************************/
#wrapper-contact{ width:1000px; height:925px; margin:0 auto; display:block; position:relative; background:url(../images/bg.png) repeat; 
box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.5);}
.contact{ width:1000px; height:auto; background:url(../images/bg-produits.jpg); float:left; border:thin #000 solid; border-top:none; box-shadow: 0px 0px 10px 5px rgba(1, 1, 1, 0.3); margin:10px 0 0 0; padding-bottom:20px; position:relative;}
.contact h1{ width:980px; border-bottom:dotted #000 thin; margin-bottom:20px;}
.contact p{ width:538px; height:auto; margin:10px 0 5px 15px;}
.contact h2{ width:300px; border-bottom:dotted #000 thin; margin:5px 0 10px 10px;}
.contact ul{ list-style:none; margin:0 0 20px 20px; border-bottom:thin #000 solid; width:245px; padding:0 0 30px 0;}
.contact li{ font-family:'calibri'; font-size:18pt; line-height:35px; font-weight:bold; text-shadow:1px 1px 0px #333;}

.map{ width:650px; height:445px; float:right; clear:right; margin:0 15px 0 0; border:thin #000 solid;}
img.map{ margin:0 0 0 10px; border:thin #000 solid;}
img.carte2{ float:left; margin:5px 0 0 0; border:thin #000 solid;}
a.talium {
	font-family: 'calibri';
	color:white;
}