/*************************************************
	Elements communs
	
	Ctrl+F couleur par défaut: 
	#225ea7;
	
*************************************************/

/* Support du PNG par ie6 */
img, a, p, table { behavior: url(http://www.transgrues.com/styles/iepngfix.htc) }
hr { clear:both;visibility:hidden;margin:0;padding:0;height:0; }
body, html{height:100%;width:100%;}
body {
	margin:0;
	padding:0;
	background: url(../img/fond.jpg) repeat-x 50% 0 #cc3009;
	color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
}
/************************************************
				MISE EN FORME TEXTE
************************************************/
.texte_mis_en_evidence {color:#666666;}
.texte_mis_en_evidence a {color:#666666;}
.texte_mis_en_evidence a:hover {color:#666666;}

a {	font-weight:bold; color:#cc3009;}
a:hover { text-decoration:none; color:#008ee0;}

/* H1 dans template.css car positionnement adapté au template */
h2 {
	font-size:18px;
	font-weight:bold;
	color:#fff;
	margin:0 0px 0 0;
	padding:3px 0;
}

h3 {
	font-size:14px;
	font-weight:normal;
	margin:0 0px 0 0;
	padding:5px 0;
}

h3, h4 { color:#fff; }

h4 {
	font-size:12px;
	font-weight:normal;
}



h5 {
	font-size:14px;
	text-decoration:underline;
	font-weight:bold;
	margin:0 0px 0 0;
	padding:5px 0;
}

h6 {
	font-size:20px;
	font-weight:bold;
	color:#fff;
	margin:0 0px 0 0;
	padding:3px 0;
}
/************************************************************
						FORMULAIRES / CSS PAGE CONTACT
************************************************************/

/* block formulaire de contact*/
.colonne_formulaire_contact_left{float:left; width:60%;}
.colonne_formulaire_contact_right{float:left; width:35%; padding:0 0 0 20px;}
.titre_contact{text-transform:uppercase; font-weight:normal; padding:3px 0; margin:10px 0; border-bottom:1px dotted;} 


/* FORMULAIRE: page contact et demande de devis  */
.contact_form {
	-webkit-border-radius: 3px;
	border-radius: 3px; 
	border-top: 1px solid #d9d9d9;
	border-left: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	background-color: #FFF;
	font-size:14px;
	color:#999;
	width:94%;
	padding-left:30px;
	min-height:30px;
	line-height:30px;
	margin-bottom:10px;
	background-repeat:no-repeat;
	background-position:5px center;
	font-family:Arial, Helvetica, sans-serif;
}
.contact_form:hover, .contact_form:focus{
	border: 1px solid #225ea7;
	color:#225ea7;
	/* Ombrage externe */
	-webkit-box-shadow: 0px 0px 8px #225ea7;
	-moz-box-shadow: 0px 0px 8px #225ea7;
	box-shadow: 0px 0px 8px #225ea7;
}
label { display:none; }

.form_error {
	-webkit-border-radius: 3px;
	border-radius: 3px; 
	border-top: 1px solid #d9d9d9;
	border-left: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	background:none;
	font-size:14px;
	color:#999;
	width:94%;
	padding-left:30px;
	min-height:30px;
	margin-bottom:10px;
	background-repeat:no-repeat;
	background-position:5px center;
	-webkit-box-shadow: 0px 0px 8px red;
	-moz-box-shadow: 0px 0px 8px red;
	box-shadow: 0px 0px 8px red;
	font-family:Arial, Helvetica, sans-serif;
}

.form_error:hover, .form_error:focus{
	border: 1px solid red;
	color:#225ea7;
	/* Ombrage externe */
	-webkit-box-shadow: 0px 0px 8px red;
	-moz-box-shadow: 0px 0px 8px red;
	box-shadow: 0px 0px 8px red;
}


textarea.contact_form, textarea.form_error {line-height:18px;padding-top:10px;padding-left:30px; background-color:#FFF;}

.select_box{ padding-left:0px; width:100%;font-size:14px;}
.select_form{ 
	width:100%;
	background:none;
	min-height:20px;
	margin:5px 0;
	color:#999;
	border:none;
	text-align:left; 
	vertical-align:middle;
}

.champs_calendrier{}
.champs_calendrier img{ vertical-align:middle;}


/* FIN FORMULAIRE: page contact et demande de devis */

.tableau_attacher_fichier{ margin-top:20px; height:25px }
.champs_obligatoires{text-align:right; margin-top:30px; height:20px/*;font-weight:bold; font-style:italic*/}
.capcha{ width:100%;}
.capcha img{ vertical-align:middle;}
.form_capcha{padding-left:0; text-align:center; width:40%;}

/* PICTO DES FORMULAIRE */
.picto_vide{padding:1px 0 1px 10px; width:98%;}

.picto_prenom{background-image:url(../img/picto_prenom.png); }
.picto_prenom:hover{background-image:url(../img/picto_prenom_hover.png);}

.picto_mail{background-image:url(../img/picto_mail.png);}
.picto_mail:hover{background-image:url(../img/picto_mail_hover.png);}

.picto_tel{background-image:url(../img/picto_tel.png);}
.picto_tel:hover{background-image:url(../img/picto_tel_hover.png);}

.picto_adresse{ background-image:url(../img/picto_adresse.png);}
.picto_adresse:hover{background-image:url(../img/picto_adresse_hover.png);}

#ville{ width:60%; float:left;}
.picto_ville{background-image:url(../img/picto_ville.png);}
.picto_ville:hover{background-image:url(../img/picto_ville_hover.png);}

#cp{width:30%; float:right; margin-right:4%}
.picto_cp{background-image:url(../img/picto_cp.png);}
.picto_cp:hover{background-image:url(../img/picto_cp_hover.png);}

.picto_pen{background:url(../img/picto_pen.png) no-repeat 5px 5px;}
.picto_pen:hover{background-image:url(../img/picto_pen_hover.png);}

.picto_piece_jointe{background-image:url(../img/piece_jointe.png); }
.picto_piece_jointe:hover{background-image:url(../img/piece_jointe_hover.png);}

.picto_demande{background-image:url(../img/picto_demande.png);}
.picto_demande:hover{background-image:url(../img/picto_demande_hover.png);}

.picto_note{background-image:url(../img/picto_note.png);}
.picto_note:hover{background-image:url(../img/picto_note_hover.png);}

/* BOX GOOGLE MAP */
.block_plan_coordonnees{
	width:100%;
	background:#FFFFFF;
	display:inline-table;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ababab;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0px 2px 3px 1px rgba(0,0,0,.2);
	box-shadow: 0px 2px 3px 1px rgba(0,0,0,.2);
}
#map {color:#000; margin:5px; min-height:200px;/*Augmenter la taille de carte si besoin*/}

/* INFOS CLIENT */
.enseigne{ color:#fff; margin-bottom:10px;font-size:17px;}
.info_coordonnees_client{ margin-top:10px; font-size:15px;}
.box_horaires{text-transform:uppercase;padding:3px 0; margin:10px 0; border-top:1px dotted #999;border-bottom:1px dotted #999;}

.facebook_like{}
.facebook_like a{text-decoration:none; font-weight:normal;color:#225ea7;}
.facebook_like a:hover{text-decoration:underline;}

.twitter_like{}
.twitter_like a{ text-decoration:none; font-weight:normal;color:#225ea7;}
.twitter_like a:hover{text-decoration:underline;}

/************************************************
				FORMULAIRE (utilise pour le moment en dehors des pages devis et contact )
************************************************/

.formulaire {
	-webkit-border-radius: 3px;
	border-radius: 3px; 
	border-top: 1px solid #d9d9d9;
	border-left: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	background:none;
	font-size:14px;
	color:#999;
	/*padding:8px 0;*/
	min-height:30px;
}
.formulaire:hover, .formulaire:focus{
	border: 1px solid #225ea7;
	background:none;
	color:#225ea7;
	/* Ombrage externe */
	-webkit-box-shadow: 0px 0px 8px #225ea7;
	-moz-box-shadow: 0px 0px 8px #225ea7;
	box-shadow: 0px 0px 8px #225ea7;
}

fieldset{border:solid 1px #666;padding:10px;}
legend{color:#666;font-size:24px;font-weight:normal;}

/************************************************
				GESTION DU BOUTON ENVOYER
************************************************/

/* Personnalisation des boutons: envoyer  */
input[type="submit"], input[type="button"]{
	background:#cc3009;
	color:#FFFFFF;
	padding:7px 25px;
	font-size:14px; text-transform:uppercase;
	/* Coins arrondis */
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border: 1px solid #cc3009;
	/* Ombrage externe */
	-webkit-box-shadow: inset 0px 0px 5px rgba(255,255,255,.3);
	-moz-box-shadow:inset 0px 0px 5px rgba(255,255,255,.3);
	box-shadow:inset 0px 0px 5px rgba(255,255,255,.3);
	/* Ombrage texte */
	-webkit-text-shadow:0px -1px 0 rgba(0,0,0,.2);
	-moz-text-shadow:0px -1px 0 rgba(0,0,0,.2);
	text-shadow:0px -1px 0 rgba(0,0,0,.2);
	cursor:pointer;
}

input[type="submit"]:hover, input[type="button"]:hover{ 
	background:#9f2405;
	/* Ombrage externe */
	-webkit-box-shadow: inset 0px 0px 5px rgba(0,0,0,.3);
	-moz-box-shadow:inset 0px 0px 5px rgba(0,0,0,.3);
	box-shadow:inset 0px 0px 5px rgba(0,0,0,.3);
}

/************************************************
				BLOCS PAGE DEMANDE DE DEVIS
************************************************/
.block_devis{width:100%}
.block_devis_gauche{float:left; width:48%; margin-right:4%;}
.block_devis_droite{float:right; width:48%;}

/************************************************
				IMAGES
************************************************/

img{border:none}
.border {margin:2px;border:1px solid #666666;}

.opacite {/* Opacite pour la zone de contenu_modifiable */
	padding: 4px 5px;
	background:#FFFFFF;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	/* Changer la couleur de bordure */
		border-top: 1px solid #d9d9d9;
		border-bottom: 1px solid #999;
		border-left: 1px solid #d9d9d9;
		border-right: 1px solid #d9d9d9;
	/* Ombre sur img */
		/*-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
		box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);*/
}
a img.opacite {filter:alpha(opacity=100);-moz-opacity: 1;opacity: 1;}
a:hover img.opacite {filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}

.opacite2 {/* Opacite pour pour les modules */
	padding: 4px 5px; margin:2px;
	background:#FFFFFF;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border-top: 1px solid #d9d9d9;
	border-bottom: 1px solid #999;
	border-left: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	/*-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);*/
}
a img.opacite2 {filter:alpha(opacity=100);-moz-opacity: 1;opacity: 1;}
a:hover img.opacite2 {filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}

.opacite3 {}/* Opacité sans bordure */
a img.opacite3 {filter:alpha(opacity=100);-moz-opacity: 1;opacity: 1;}
a:hover img.opacite3 {filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;}

/***********************************************
				STYLES MISES EN FORME
***********************************************/
div#conteneur {
	margin:auto;
	
	width:980px;
	background: url(../img/haut.jpg) repeat-y;
	position:relative;/**/
}

/************************************************
				ENTETE
************************************************/
div#entete {
	/*height:309px;*/
	height:163px;
	margin:0;padding:0;
}

/************************************************
				LANGUE
************************************************/
#lang{position:absolute;color:#FFF;top:410px;padding-left:80px;}
#lang a{color:#FFF;}
a img.langue { cursor:pointer; filter:alpha(opacity=100);-moz-opacity: 1;opacity: 1;margin:1px; padding:1px}
a:hover img.langue {filter:alpha(opacity=60);-moz-opacity: 0.6;opacity: 0.6;margin:1px; }

/************************************************
			RAPPEL + Newsletter
************************************************/
.newsletter{
	position:absolute;top:184px;left:25px;
	text-align:left;
	background:url(../img/rollhover_opa_f.png);
}

.rappel {position:absolute;left:756px;top:189px}

/***********************************************************
				CORPS
***********************************************************/
div#corps {/*background: url('http://www.transgrues.com/img/bas.jpg') no-repeat 0 bottom;*/}

div#contenu {
	/*
	
	min-height:350px;
	background:url('../img/haut.jpg') no-repeat;*/
	text-align:left;
	margin: 0;padding: 0 0 0 230px;
    color:#FFF;
}

html>body #contenu {
	height:auto;
	min-height:350px;
}

/* div#contenu_modifiable dans template.css pour gérer le padding */

div#contenu p {margin:0;padding:0;}
div#contenu_modifiable ul.puce {
	list-style-type:none;
	margin:5px 0 5px 0;
	padding:0 0 0 0px;
}
div#contenu_modifiable ul.puce li {
	background:url(../img/puce.jpg) no-repeat left 5px;
	margin-left:0px;
	padding:2px 0 2px 15px;
}
.colonnes_2,.colonnes_3, .colonnes_4 {float: left;}
.colonnes_2  { width:50%;position: relative;}
.colonnes_3  { width:33%;position: relative;}
.colonnes_4  { width:25%;position: relative;}
.texte {
	border:1px solid #ccc; padding:5px; margin:5px 10px;
	-webkit-box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.5), 0px 0px 15px rgba(255, 255, 255, 0.5) inset;
	-moz-box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.5), 0px 0px 15px rgba(255, 255, 255, 0.5) inset;
	box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.5), 0px 0px 15px rgba(255, 255, 255, 0.5) inset;
}

/****************************************************
				ADRESSE
****************************************************/
/* correspond à l'enseigne dans l'adresse et dans la page contact */
/*.org{						
	color:#666666;
	font-size:18px;
	font-weight:normal;
}
*/



/****************************************************
				FOOTER
****************************************************/

#footer {
	background-color:#008fdd;
	margin:0px auto;
	height:180px;
	width:960px;
	font-size:10px;
	color:#fff;
}
#footer a{color:#fff; text-decoration:none;line-height:14px;}
#footer a:hover{color:#225ea7;}
.tab_footer{ }
.tab_footer tr td{padding:20px 15px 0 15px;}
.tab_footer tr td table tr td{padding: 0 0 0; margin:0;}
.tab_footer ul{padding:0; margin:0;}
.tab_footer ul li{padding:0; margin:0; line-height:14px;}
.colonnes_footer{padding-left:15px; padding-right:15px; border-left:dotted 1px #fff; color:#fff}
.colonnes_footer1{color:#FFF;padding-right:15px; width:230px;}
.colonnes_footer4{ color:#FFF; padding-left:15px; border-left:dotted 1px #fff;}
.footer_adresse{font-weight:400; line-height:25px; color:#fff; font-size:12px; text-transform:none;}
.footer_enseigne{color:#fff;}
.footer_tel{font-weight:700; font-size:13px; line-height:25px; color:#fff; }
.footer_menu {
	list-style-type:none;
	padding-top:0;
	margin-top:0;
}
.footer_menu a{text-decoration:none; }			
.logos_followus { text-align:left; margin-top:10px;}
.logos_followus img { margin: 0 0 7px 0; }
#btn_up{
	position: fixed;
	bottom: 15px;
	right: 25px;
	cursor: pointer;
	display:none;
}
.signature {
	padding-top:10px;
	text-align:center;
	margin-right:14px;
}


/************************************************
					 INFOS FIXES
************************************************/
.code_incorrect {font-weight:bold;color:#FF0000;}

.ligne_pointille_vertical {border-left:1px solid #ccc;}
.ligne_pointille_horizontal {border-bottom:1px solid #ccc;}



  /************************************************
          COOKIES POPUP
************************************************/

#cookie-alert-container {
  position:fixed;
  z-index: 1337;
  width:100%;
  text-align:center;
  background:#ffebcc;
  color:#856d47;
  border-bottom: 1px solid #dbcfbd;
  margin:0;
  padding:10px;
    top:0;
}

#cookie-alert-container a#accept-cookies {

  font-weight:600;
  cursor:pointer;
  margin-left:12px;
  padding:.25em .5em;
  background:#fff7eb;
  text-decoration:none;
  border:1px solid #cfbfa5;
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius:4px;
  display:inline-block;
}
#cookie-alert-container a#accept-cookies:hover {
  background:#fffdfa;
}

#cookie-alert-container a {
  
  font-weight:600;
  color:#856d47;
  border-bottom:1px solid #c1ac8b;
  text-decoration: none;
}
