html,body{font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 11px;text-align:center; text-align:left; color:black; text-align:justify; background-color:white;}
#header{height:109px;}
#header-logo{width:399px;height:39px;float:left;}
#header-slogan{width:114px;height:15px;margin-left:246px;float:left;}
#header-logo-intervention{margin-left:505px;}
#conteneur{width:960px;margin-left:auto;margin-right:auto;}
#conteneur-contenu{width:960px;padding-bottom:20px;}
#menu-nav{height:35px;width:960px;margin-bottom:10px;}

#gauche{float:left;width:200px; margin-bottom:10px;margin-left:16px;}
#contenu{float:left;width:519px;float:left;min-height:10px;border:1px solid #12b0e0; padding:0 10px 10px 10px; margin:0 10px 0 10px;}
#droite{float:left;width:184px;}

#pied{clear:both;text-align:center;}
#arbo{height:25px;}

#devis{width:213px; margin-top:10px; text-align:center;}
#photo{border:1px solid #12b0e0;width:212px; height:304px; margin-top:10px;}

#pd-gauche{width:790px;float:left;height:70px;text-align:left; padding-left:20px;}
#pd-droite{width:150px;float:left;height:70px;}

/* logos autres activités */
.activite{width:192px; margin-top:10px;}

/* MENU */

#menu, #menu ul /* Liste */	
{
	padding : 0; /* pas de marge int?rieure */
	margin : 0; /* ni ext?rieure */
	list-style : none; /* on supprime le style par d?fault de la liste */
	height : 35px;
	line-height : 35px; /* on défini une hauteur pour chaque élément */
	text-align : center; /* on centre le texte qui se trouve dans la liste */
	width:960px;
}

#menu{font-weight:bold;font-family :Arial;font-size:12px;}

#menu a /* Contenu des listes */
{
	display	: block; /* on change le type d'élément, les liens deviennent des balises de type block */
	padding	: 0; /* aucune marge intérieure */
	background:url("image/menu-off.jpg") repeat-x; /* couleur de fond */	
	color : white; /* couleur du texte */
	text-decoration : none; /* on supprime le style par défault des liens (la plupart du temps = souligné) */
	width : 239px; /* largeur */
}

#menu li /* Elements des listes */{float :left;/* pour ie qui ne reconnait pas "transparent" */border-right: 1px solid #fff;/* on met une bordure blanche ? droite de chaque élément */}

/* ie ne reconnaissant pas le sélecteur ">" */
html>body #menu li{border-right: 1px solid #5d5d5d; /* on met une bordure transparante droite de chaque élément */}

#menu li ul /* Sous-listes */
{ 
	position: absolute; /* Position absolu */
	width: 239px; /* Largeur des sous-listes */
	left: -999em; /* Hop, on envoi loin du champ de vision */
	line-height:20px;
}

#menu li ul ul 
{
	margin		: -22px 0 0 144px ; /* On décale les sous-sous-listes qu'elles ne soient pas au dessus des sous-listes */	
	/* pour ie qui ne reconnait pas "transparent" (comme précédement) */
	border-left	: 1px solid #fff ; /* Petite bordure ? gauche pour ne pas coller ... */	
}

/* ie ne reconnaissant pas le s?lecteur ">" ... je me répéte ;-) */
html>body #menu li ul ul{border-left:1px solid transparent ; /* on met une bordure transparante sur la gauche de chaque élément */}

#menu a:hover /* Lorsque la souris passe sur un des liens */	
{
	color: #353535; /* On passe le texte en noir ... */
	background:url("image/menu-on.jpg") repeat-x; /* ... et au contraire, le fond en blanc */
}

#menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un ?l?ment de liste */
{
	left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}

#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un ?l?ment de liste ET sous-sous-lites lorsque la souris passe sur un ?l?ment de sous-liste */
{
	left: auto; /* Repositionnement normal */
	min-height: 0; /* Corrige un bug */
}

#menu ul li a {background:#009cc9 none repeat scroll 0 0; text-align:left; padding-left:10px; width:229px;}
#menu ul li a:hover {background:#e0001b none repeat scroll 0 0; text-align:left; padding-left:10px; width:229px;}


/* CONTACT PAR TELEPHONE */
div#telephone-defilant {width:163px; font-size:20px; color:#009900; font-weight:bold; margin:67px 0 0 40px;}

div#contact {border:1px solid #e0001b; background:url("image/serrurier-lille-telephone.jpg") no-repeat; width:211px; height:187px;}
div#formulaire-rappel {margin-top:64px; padding-left:5px;}
*+ html .input-telephone{padding:0;height:23px;}
.button-rappel {border:none;background: url('/image/rappelez-moi-off.jpg') no-repeat;width:98px;height:21px; cursor:pointer; margin-left:7px;}
.button-rappel:hover{border:none;background: url('/image/rappelez-moi-on.jpg') no-repeat;width:98px;height:21px; cursor:pointer; margin-left:7px;}
.input-telephone {width:92px;height:13px;line-height:15px;font-size:10px;vertical-align:top;color:#e0001b;font-weight:bold;}

/* partie droite */
#temoignages{border:1px solid #e0001b;width:192px;background: url('/image/serrurier-lille-temoignages.jpg') no-repeat;padding:50px 10px 10px 10px;}
#agree{border:1px solid #e0001b;width:192px;background: url('/image/serrure-norme-a2p.jpg') no-repeat;padding:50px 10px 10px 10px; margin-top:10px; text-align:center;}
#cadrevcard{border:1px solid #e0001b;width:192px;padding:10px 10px 10px 10px; margin-top:10px; text-align:center;}
#google-earth{padding-top:20px;}
#tarifs{width:213px; height:41px; margin-top:10px;}

/* mise en page */
h1{color:#e0001b; font-size:13px;font-weight:bold;background:url("image/puce-hn.jpg") no-repeat 0%; padding-left:21px; margin:0; margin-bottom:10px;}
h2{color:#12b0e0; font-size:11px}
hr {border: none 0;border-top: 1px dashed #12b0e0;width:960px;height:3px;margin-top:15px;margin-bottom:8px;}
.temoignages-hr {border: none 0;border-top: 1px dashed #12b0e0;width:300px;height:3px;margin-top:15px;margin-bottom:8px;}
img{border:0px;}
.italic{font-style:italic;}
.centre{text-align:center;}
.gras{font-weight:bold;}
.supeva-texte{color:#2a2a2a;font-size:7px; font-weight:bold;}
.tab-produits{text-align:center; width:100%;}
.bloc-gris{background-color:#D1D1D1;}
textarea{font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 11px;}
.font10{font-size:10px;}

fieldset{
	margin:0 0;
    margin-bottom:20px;
	border:1px solid #860203;
}

legend{
	padding:0 .5em;
	color:#4e4e4e;
	background:transparent;
	font-size:12px;
	font-weight:bold;
}

.input-petit{width:170px; font-size:11px;}
.input-password{width:20px; font-size:11px;}
.input-petit2{width:122px; font-size:11px;}
.input-telephone2, .select-situation{width:110px; font-size:11px;}
.select-expertise{width:130px; font-size:11px;}
.select-intervention{width:135px; font-size:11px;}
.rouge9ita{color:#eb2728;font-size:9px;font-style:italic;}
.c1{color:#12b0e0;}
.c2{color:#e0001b;}
.mc-1{color:#eaeaea;}
.temoignages{ font-style:italic; text-align:left;}

.table-liens-internes{width:100%; border:1px dashed #a4a4a4; vertical-align:text-top;}
.table-tr-liens-internes{vertical-align:text-top;}

ul.liste{list-style-image: url(image/puce-rouge.gif);}
ul.liste li{padding-bottom:10px;}

ul.liste2{ list-style-type:circle;list-style-image:none;}
ul.liste2 li{padding-bottom:10px;}

/* COULEURS DES LIENS */
a.arbo:link, a.arbo:visited, a.arbo:active{color:#12b0e0;text-decoration:none;}
a.arbo:hover{color:#e0001b; text-decoration:underline;}

a:link, a:visited, a:active{color:#e0001b;text-decoration:none;}
a:hover{color:#12b0e0; text-decoration:underline;}

a.slogan:link, a.slogan:visited, a.slogan:active, a.slogan:hover{color:#12b0e0;text-decoration:none;}

a.supeva:link, a.supeva:visited, a.supeva:active, a.supeva:hover{color:#142749;text-decoration:none;font-size:7px; font-weight:bold;}

a.pied:link, a.pied:visited, a.pied:active{color:#ef5d08;text-decoration:none;}
a.pied:hover{color:#888888; text-decoration:underline;}

/* Pied de page en ligne*/
ul#menu_horizontal li {list-style-type :none;display :inline;padding :0 0.3em;}
.adresse{padding-left:40px; padding-bottom:10px; width:700px; margin-left:auto; margin-right:auto;}

/* agrandissement des photos */
/* jQuery lightBox plugin - Gallery style */
#gallery {padding:0; margin:0;width: 520px;list-style: none;}

.tab-gallery{text-align:center; width:520px;}
.tab-gallery-color{background-color:#dedcdc; height:100px;}

/****************************/
/*****	tableau titre	*****/
/****************************/

#tab-titre{margin:10px 0px;}
.padding0{padding:0px;}
.td-center{background:url('image/arrondi-center.jpg') repeat-x; padding:4px 10px; text-align:center; font-size:13px; color:white;}
.td-center-pad0{background:url('image/arrondi-center2.jpg') repeat-x; padding:4px 0px; text-align:center; font-size:13px; color:white;}

/* tableau avec informations */
.tab-info{text-align:center;}
.tab-info-titre{background-color:#e0001a;font-weight:bold; color:white; text-align:center; font-size:12px;}
.tab-info-titre-2{background-color:#bababa;font-weight:bold; color:white; text-align:center; font-size:12px;}
.tab-info-sstitre{background-color:#b4b4aa;font-weight:bold;text-align:left;}
.tab-info-sstitreprinc{background-color:#12b0e0;font-weight:bold; color:white;text-align:center;}
.tab-border-color{border : 1px solid #860203;}
.tab-border-color-2{border : 1px solid #9a9a9a; height:30px;}
.tab-border-color-center{border : 1px solid #860203; text-align:center;}