@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------------*/
/*                couleurs utilisées                */
/*--------------------------------------------------*/

/*--- Bleu= #2B9AD2 --- Bleu clair="#80B8E8 --- Rouge=#C10029 --- Gris moyen= #CCCCCC --- Gris clair=#E6E6E6 ---*/


/*--------------------------------------------------------------*/
/*                  balises communes                */
/*------------------------------------------------------------*/

body {font-family: Arial, Helvetica, sans-serif; font-size: 13px; margin: 0px;}

a {text-decoration: none;}

img {text-decoration: none; border-style: none;}


/*--------------------------------------------------------------*/
/*                éléments positionnés              */
/*------------------------------------------------------------*/

#global {position: relative; margin: 0 auto; width: 1024px; background-image: url(images/niv3.png); background-repeat: repeat-y; display: table; /* pour diviser en colonnes de hauteur égale*/ background-color: #FFF;}

#banniere {position: relative; width: 1024px; height: 120px; background-image: url(images/bannierefond.png); background-repeat: repeat-x;}

#intro  {position: absolute; right: 42px; top: 49px; height: 20px;}
#intro a {color: #000000;}
#intro a:hover {color: #666666;}

#plan {position: relative; top: -10px;float: left; width: 235px; background-image: url(images/planfond.png); background-repeat: repeat-y; color: #666666;}

#contenu {float: left; width:700px; margin: 25px 0 0 47px}

#chapo {width:700px; border-bottom: thin solid #F2F2F2;}

#ancre { width:700px; }

#pied {float: left; margin-top: 0px; width: 1024px; height: 85px; background-image: url(images/pied.png); background-repeat: no-repeat; text-align: center; color: #FFF;}
#pied p {padding-top: 50px; font-size: 10px;}
#pied a {color: #FFF; text-decoration: underline;}

/*-------------------------------------------------------------*/
/*              classes du plan (#plan)             */
/*------------------------------------------------------------*/

	/*-- positionnement --*/
.niv1 {display:block; width:225px; height: 24px; left: 0px; padding: 5px 0 0 10px; background-repeat: repeat-x; color: #FFFFFF; font-size: 16px; font-weight: bold;}
.niv2, .niv2fixe {display:block; height: 24px; padding: 3px 0 0 25px; background-image: url(images/niv2.png); background-repeat: no-repeat; font-size: 14px;}
.niv3, .niv3fixe {display:block; height: 22px; padding: 4px 0 0 28px; margin-bottom: 3px; background-image: url(images/niv3.png); background-repeat: no-repeat;font-size: 12px;}

	/*-- liens --*/
a.niv2, a.niv3 {color: #666666; display:block; width:210px;}

	/*-- liens survolés et liens sélectionnés --*/
#prod .niv1 {background-image: url(images/niv1produits.png);}
#prod .niv2fixe, #prod a:hover.niv2 {background-image: url(images/niv2hoverproduits.png); color: #C10029; font-style: italic; font-weight: bold;}
#prod .niv3fixe, #prod a:hover.niv3 {background-image: url(images/niv3hoverproduits.png); color: #C10029; font-style: italic; font-weight: bold;}

#sec .niv1 {background-image: url(images/niv1secteurs.png);}
#sec .niv2fixe, #sec a:hover.niv2 {background-image: url(images/niv2hoversecteurs.png); background-repeat: no-repeat; color: #2B9AD2; font-style: italic; font-weight: bold;}
#sec .niv3fixe, #sec a:hover.niv3 {background-image: url(images/niv3hoversecteurs.png); background-repeat: no-repeat; color: #2B9AD2; font-style: italic; font-weight: bold;}

#fich a {color: #FFFFFF; display:block; width:225px; background-image: url(images/niv1.png);}
#fich a:hover {color: #666666}

/*------------------------------------------------------------------*/
/*           classes du contenu (#contenu)          */
/*-----------------------------------------------------------------*/

.filariane {color:#666666;}

#contenu h1 {width: 700px; margin: 10px 0 10px 0; font-size: 21px; color: #FFFFFF; text-indent: 10px;}
#contenu h2 {width: 700px; margin: 25px 0 10px 0; font-size: 15px;}
#contenu a {color: #666; text-decoration: underline;}
#contenu a:hover {color: #000; text-decoration: none;}

/*---------- le titre de page ----------*/
.int, .fich {background: url(images/h1.png) repeat-x;}
.prod {background: url(images/h1prod.png) repeat-x;}
.sec {background: url(images/h1sec.png) repeat-x;}

/*----------- la page accueil (index) -----------*/
#contenu .newsh1 { width: 100px; margin: 10px 0 10px 0; font-size: 21px; color: #FFFFFF; text-indent: 10px; background-color:#CCCCCC; }
#contenu .news h2 {width: 696px; height: 20px; margin: 0 0 25px 0; padding-top: 5px; text-align: left; text-indent: 10px; font-size: 15px; background-image:url(images/newsh2.png);}
#contenu .news h3 {text-align: left; margin-left: 35px; font-size: 20px; font-weight: bold;}
#contenu .news h4 { text-align: center; font-size: 20px; font-weight: bold; } /* =h3 mais centrer */

.news {display: block; width:696px; margin: 10px 30px 30px 0; padding-bottom: 10px; border: 2px solid #CCCCCC; text-align:center;}/* display : comportement du bloc ; margin : distance par rapport aux éléments précédents ; text-align : alignement des images */
.news p {padding: 0 35px 0 35px; text-align: justify;}
.news img {margin: 5px 0 5px 0px; float:inherit;}/* espacer les images */

.download { display:block; margin: 0 230px 10px; height: 24px; }
.download  a {width:24px; height:24px; float:right; background: url(images/pdf.png);}
.download  a:hover {background-image:url(images/down.png);}
.download  p { padding-top: 7px; /*width: 520px;*/}
.download  p a {background-image: none; float: none;}
.download p a:hover {background-image: none}

/*---------- dans les pages d'intro (Qui sommes-nous, Nos services) ----------*/
.article .intro {display: block; width: 700px; text-align: justify; margin-top:10px;}

/*---------- les articles dans produit et secteurs d'activité ----------*/
.article {position: relative; width:700px; margin: 10px 30px 30px 0; padding-bottom: 10px; border-bottom: thin solid #F2F2F2;}
.article p {display: block; width: 450px; text-align: justify;}
.article img {margin: 5px 0 5px 0; padding: 0px;}
.article .feragauche {text-align: left;}/* corriger la justification sur les lignes de description */

.marques {position: absolute; top: 42px; left: 488px; width: 210px; background-image: url(images/marques.png); background-repeat: no-repeat; background-position: top; border: thin solid #E6E6E6; padding: 25px 0 30px 0;}
.marques img {margin: 30px 31px 0 31px;}

/*---------- fiche technique ----------*/
.article h3 {margin: 25 0 0 50px;}
.doc { display:block; margin: 0 50px 10px 100px; height: 24px;}
#contenu .doc a {text-decoration: none; color:#000;}
#contenu .doc a:hover {color: #666;}
.doc a {width:24px; height:24px; float:right; background: url(images/pdf.png);}
.doc a:hover {background-image:url(images/down.png);}
.doc p { padding-top: 7px; width: 520px; border-bottom: thin dotted #CCCCCC;}
.doc p a {background-image: none; float: none;}
.doc p a:hover {background-image: none}