/* PENSE BËTE */
/* background : rgba(r,g,b,[de 0 à 1 format 0.5 pour opacité 50%]) */
/* background:rgb(83, 55, 20) ;background:rgba(83, 55, 20, 1) ; => doubler la déclaration pour les vieux IE */
/* FRÉQUENT */
@import url(http://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic);
/* taille d'écriture ->box -> Dim de l'actu ->Taille et padding des titres */
body{font-size : 14px ; font-family: 'Roboto', 'Verdana','sans-serif';}
/* Image et couleur de fond */
#site{}  /* Englobe tous le site */
.page {background : transparent ;} /* Formate la page dans les blocs 100% */
#headers,#headerBan,#headerNav,#headerSlide{clear:both;}
#headers{background:transparent;}
	#headerBan{background:transparent;} /* Englobe #banner */
		#banner {background : transparent ;}
		#banner h1 {text-align:left;}
	#headerNav{background:transparent;} /* Englobe #navigationH */
	#headerSlide{background:transparent;} /* Englobe #bandeau_anim et #bandeau_fixe */
	/*#headerSlide .page{width:100%;} Pour avoir un slide à 100% du site */
	
#containers{background:transparent;} /* Englobe #container, #containDeco, #contain, #leftbar */
	#container {background : #fff;padding-top:10px;}
		#containDeco {background : transparent;} /* zone qui couvre exactement #container, permet d'ajouter un élément non-duplicable sur container si page doit être transparent sinon, sert à rien */
			#contain{}
			#leftbar{background : transparent ;}
			
#footers{background:transparent;} /* Englobe #footer et #footerContent */
	#footer{}
		#footer #footerContent{background : transparent;} /* Zone de contenu au dessus de bottom.ext et au dessous de #container [Possibilité d'avoir la boite coordonnées] sinon, sert à rien */
		
#signatures {background : transparent ;font-size:0.8em;} /* Englobe #navigationH */
body{background : #fff url(../../images/body.jpg) repeat-x scroll center 0px ;}
.poweredby{color:#000;display:inline-block;margin:auto ;} /* Couleur des liens des plugins */

/* Couleur de texte */
#signature .BottomFontText,#signature .BottomFontText a, .signature * {color: #000 ;}
#contain, .galerie, .BodyFontText{color: #333;}
#contain a{color:#31b7bc; font-weight:bold;}
h1,h2,h3,h4,h5,h6,.BodyFontSubTitle, .BodyFontTitle, legend{line-height:1.2em;color : #000 ;}
h1,h2,h3,h4,h5,h6,.BodyFontSubTitle, .BodyFontTitle {padding:5px 0px ;}

/* Formulaire */
.button , .box .button {color: #fff;	background: #31b7bc; font-weight : bold ; padding : 2px 3px ;}

/* box */
#leftbar .widget{
	background : #33bec3 ;
	border-radius : 5px ;
	margin-bottom : 8px ; 
}
.box {background : transparent ;} /* Agir sur tout les éléments "box" */
.box *, .box{color:#fff; } /* Couleur d'écriture de tout les éléments "box" */
.box.box_top{height : 30px ;background : transparent;vertical-align:top;} /* Régis tout les haut de boite */
.box.box_top h2, .box h2{padding :6px 0 0 5px ; color : #fff ;background : transparent;border-width:0px;text-transform:uppercase;font-size:1.1em;} /* Régis tout les haut de boite */
.box.box_bottom{height : 10px ;background : transparent;} /* Régis tout les bas de boite */


/* NAVIGATION HORIZONTALE
	.box#navigationH : Régis le tableau de navigation
	.box#navigationH .box.nav_top : Régis le bas de la navigation
	.box#navigationH .box.nav_bottom : Régis le bas de la navigation
	.box#navigationH td : Régis chaque ligne de la navigation
*/
.box#navigationH{background:#31b7bc;height :23px;position:relative;padding:5px 11px 5px ;text-align:center;border-radius:5px 5px 0 0 ;}
.box#navigationH ul.ul_nav.navigation1{display:inline-block;}
.box#navigationH .nav_top{/*height : 20px ;background : transparent url(../../images/nav_top.png) no-repeat bottom left ;*/}
.box#navigationH .nav_bottom{/*height : 20px ;	background : transparent url(../../images/nav_bottom.png) no-repeat top left ;*/}
.box#navigationH li{ 
	background : transparent ;
	padding : 0px ;
	height : auto;
	display : inline-block ;
}
.box#navigationH td img{display: inline; padding-right: 3px;}

/* NAVIGATION VERTICALE 
	.box#navigation : Régis le tableau de navigation
	.box.nav_top : Régis le bas de la navigation
	.box.nav_bottom : Régis le bas de la navigation
	.box#navigation td : Régis chaque ligne de la navigation
*/
.box#navigation{background:transparent url(../../images/nav.png) repeat-y top left ;}
.box.nav_top{height : 15px ;background : transparent url(../../images/nav_top.png) no-repeat bottom left ;}
.box.nav_bottom{height : 20px ;	background : transparent url(../../images/nav_bottom.png) no-repeat top left ;}
.box#navigation li{
	background : transparent ;
	vertical-align : top ;
	padding-top : 5px ;
}
.box#navigation td img{display: inline; padding-right: 3px;}

.box#navigation li.level1{
	background : transparent url(../../images/nav_separe.png) bottom center no-repeat ;
	padding-bottom : 3px ;
}


/* Liens du menu */
.MenuHyperlink, .MenuHyperlinkSelected {
	color: #fff;
	font-weight: bold;
	padding : 0 12px ;
	background:transparent url(../../images/nav_puce.png) left center no-repeat;
}
.MenuHyperlink:hover{text-decoration : underline !important;}
.MenuHyperlinkSelected{
	color: #000;
	text-decoration : underline;
}
.navigation2 .MenuHyperlink, .navigation2 .MenuHyperlinkSelected {
	background-image : none ;
	padding : 2px 0px 2px 7px ;
}

/* Si utilisé dans deco de parametres.php */
#facebook{padding:5px;}
	#facebook a,#facebook a:hover{
		color : #333;
		text-decoration : none;
	}
	#facebook a img{
		vertical-align : middle ;
	}
	


	/* MULTI LANG */
	#drapeau {
		position : absolute ;
		right : 20px ;
		top : 40px ;
	}
	#drapeau img.activeLang{
		border-color : #f00 ;
	}

	/* Permet de travailler spécifiquement sur la boite concernée */
	div.coordonnees .box#Coordonnee h3{display : none;}
	div.coordonnees .box#Coordonnee_mobile h3{display : none;}
	div.coordonnees .box.box_top{ }
	div.coordonnees .box.box_bottom{}
	#banner .coordonnees{top : 35px ;right : 20px ;position : absolute;} /* Placement de Coordonnées si == top */
	#footer .coordonnees{top : 0px ;right : auto ;position : relatif;width:100%;text-align:center;} /* Placement de Coordonnées si == bottom */
	#footer div.coordonnees .box{background : transparent;color:#fff;}
	#footer div.coordonnees  h2{display:inline;color:#fff;}
	
	div.actualites .box#actu{}
	div.actualites .box.box_top{} 
	div.actualites .box.box_bottom{}
	.headline a.savoir_plus {
		padding-left : 15px ;
		background : transparent url(../../images/savoir_plus.png) left center no-repeat ;
		float:right;
		margin-right:5px;
	}

	#banner .newsletter{
		top : 0px ;
		right : 0px ;
		position : absolute;
		max-width: 210px;
		background : #c3e4e6 ;
		border-radius : 0 0 5px 5px ;
	}
	div.newsletter #Newsletter{}
	div.newsletter #Newsletter_mobile{}
	div.newsletter #Newsletter .news_label{color:#000!important;display:inline-block!important;float:none;padding-top:15px;}
	div.newsletter #Newsletter .news_submit{color:#000!important;position:relative;top:0px;}
	div.newsletter #Newsletter input[type="email"]{color:#000!important; width:170px;}

div.boite_separer{height : 15px ;background : transparent url(../../images/separe.jpg) no-repeat top left ;}/* Permet de mettre en style la séparation entre les boites */


fieldset{
	width : 90%;
	margin : auto ;
}

legend{}

h1 {	font-size:1.25em;}
#contain h2,#contain .BodyFontTitle {
	font-size:1.3em;
	padding-left:0px;
	background:transparent;
	margin-bottom:10px;
	border-bottom : 1px solid #31b7bc ;
	font-weight : 400px ;
}
#contain span.BodyFontTitle {border-width : 0px ;}
h3, .BodyFontSubTitle {font-size:1.15em;padding-left:25px;}
h4 {font-size:1.10em;padding-left:25px;}
h5 {font-size:1.05em;padding-left:30px;}
h6 {font-size:1em;text-indent:35px;}


.ul_nav_sitemap li a{ /* Puce pour les liens de la page sitemap */
	background : transparent ;
	padding-left : 3px ;
}
.ul_nav_sitemap{
	list-style : square ;
}


/* Actualité */
#actu{height: 200px;}
	 #scrollup {
	   position: relative;
	   border: 0px solid #000;
	   height: 200px;
	   width: 100% ;
	 }
	 .headline {
	   height: 200px;
	   overflow-y:hidden;
	 }
	 
	 #actu .bx-wrapper .bx-viewport{
		background : transparent ;
	 }
	 .headline img, .eventline img{
		float : left ;
		padding-right: 5px ;
		max-width : 50px ;
		max-height : 50px ;
	 }
	 .headline strong,.eventline strong{
		padding-left : 0px ;
		background : transparent ;
		clear : both ;
		display:block;
	 }
	 
/* NAVIGATION HORIZONTALE */
#navigationH .navigation1 li ul{
	background : #31b7bc ;
	z-index : 99999 ;
} 
#navigationH .navigation1 li.level1 ul.navigation2{
	margin-left : -10px ;
}
.box#navigationH li.level1{
	text-align : left ;
	padding-right : 10px ;
	padding-left : 10px ;
}
 .box#navigationH li.level1 +li.level1{
	padding-left : 9px ;
	/* border-left : 1px solid #fff ; */
	background : transparent url(../../images/nav_separe.png) left top no-repeat ;
	padding-right : 10px ;
}

#navigationH ul.navigation1 li.level1  a.alevel1{
	padding-bottom : 3px ;
}

#navigationH .navigation1 li ul a:hover /* Lorsque la souris passe sur un des liens */    
{
		color: #000; /* On passe le texte en noir... */
		background: #fff; /* ... et au contraire, le fond en blanc */
		text-decoration : underline ;
}
#navigationH .navigation1 li ul /* Sous-listes */
{ 
		-moz-box-shadow: 3px 3px 3px #333; 
		-webkit-box-shadow: 3px 3px 3px #333; 
		box-shadow: 3px 3px 3px #333; 
}

/* Partenaire */
.url_partenaire_url{
	float : left ;
	width : 200px ;
	height : 120px ;
	overflow : hidden ;
	text-align : center  ;
	padding : 10px ;
}

/* Pop Up viticole */
.popupViticole{
	padding : 20px 10px;
	color : #fff ;
	font-size : 1.4em;
}
	.popupViticole strong{
		padding : 0 0 5px 0 ;
		display : inline-block;
	}

/* RESPONSIVE MOBILE*/

@media (max-width: 693px) {
	/* .poweredby{color:#000;display:block;margin:auto ;}
	#signature .BottomFontText,#signature .BottomFontText a, .signature * {color: #000 ;}
	#contain, .galerie, .BodyFontText{color: #000;}
	#contain a{color:#f00; font-weight:bold;}
	h1,h2,h3,h4,h5,h6,.BodyFontSubTitle, .BodyFontTitle, legend{color : #000 ;}
	h1,h2,h3,h4,h5,h6,.BodyFontSubTitle, .BodyFontTitle {padding:5px 0px ;} */
	#drapeau {
		position : relative !important;
	}
	#drapeau img {
		display : inline-block !important;
	}
	body #footer img.mobile_only{
		display:block !important;
	}
	.page{
		background : #fff !important;
	}
	#footer{
		background : #31b7bc ;
		border-radius : 10px 10px 0 0 ;
	}
}
@media (max-width: 970px) {
	body{
		background-position : center 57px; 
	}
	#footer img.mobile_only{
		display:none !important;
	}
}