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


body {
	background: url(images/bg.jpg) top center #0d679b no-repeat;
	
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	color: #000;
	font-weight: 300;
}
.bg2 {
	background: url(images/bg2.jpg) top center no-repeat #e6e6e6;

}
.zone-actu { height:445px; background:url(images/bg-fond-zone.jpg) top center no-repeat}
.left {float:left;}
.right{
	float: right !important;
}
 #logo {
	margin: 0 auto;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 194px;
	z-index: 9999;
	text-align: center;
}

.grande-image {
	margin-right: 1%;
	width: 50%;
	text-align: left;
	font-family: 'Hammersmith One', sans-serif;
	font-weight: 300;
	font-size: 16px;
	color: #FFFFFF;
	padding: 1%;
	line-height: 20px;
}
.h3 {
	font-family: 'Lato', sans-serif;
	border: solid 3px #666;
	padding: 10px;
	font-size: 15px;
	background: #000;
}

.col-20 {
	width: 31%;
	margin: 1%;
}


.col-30 {
	width: 34%;
	margin: 0.8%;
}

.col-40 {
	width: 42%;
	margin: 1%;
}

.col-60 {
	width: 62%;
	margin: 0.8%;
}
.col-60 img{
	max-width:100%;
	width:auto;
	height:auto;
}




 h1{
	font-size: 32px;
	color: #000;
	margin: 0;
	padding: 0;
	font-family: 'Vollkorn', serif;
	font-weight: lighter;
}
 h1 span{
	font-size: 18px;
	color: #000;
	font-family: 'Vollkorn', serif;
	font-weight: lighter;
}

 h2{
	font-size: 18px;
	color: #000;
	margin: 0;
	padding: 0;
	font-family: 'Vollkorn', serif;
	font-weight: lighter;
	padding: 5px;
	background-color: #FCD554;
}
.separation-h {
	border-bottom: solid 5px #fdd653;
	margin-top: 10px;
}
.footer {
	width: 100%;
	text-align: center;
	height: 150px;
	color: #000;
	line-height: 20px;
	margin-top: 1%;
	background: #fff !important;
}

#conteneur-principal {
	width: 1100px;
	margin: 0 auto;
	height: auto;
}
#conteneur-contenu {
	width: 1100px;
	margin: 0 auto;
	height: 850px;
	background: #fff;
}
#conteneur-slider {
	width: 100%;
	margin: 0 auto;
	background: #000000;
}
.col-100 {
	width: 100%;
	float: left;
}
.header {
	width: 100%;
	height: 193px;
	background:url(images/bg-header.jpg) top center no-repeat;
}
.margin-top {
	margin-top: 1%;
	float: left;
}

.vignettes {
	margin-right: 1%;
	width: 30%;
	text-align: left;
	font-size: 15px;
	color: #000000;
	padding: 1%;
	margin-top: 1%;
	background: #f7f7f7;
	font-family: 'Lato', sans-serif;
}

.vignette-sans-bg {background:none !important;	margin-right: 1%;
	width: 30%;
	text-align: left;
	font-size: 15px;
	color: #000000;
	padding: 1%;
	margin-top: 1%;
	font-family: 'Lato', sans-serif; }


.vignettes img{
	max-width: 100%;
	height: auto;
	width: auto;
	margin-bottom: 10px;
}

.img {
		width: 100%;

}
.img img{
	max-width: 100%;
	height: auto;
	width: auto;
}



.logo {
	float: left;
}
.slogan-droite{
	float: left;
}
.slogan-gauche{
	float: left;
	margin-right: 17%;
}
.texte-slogan {
	text-transform: uppercase;
	letter-spacing: 5px;
	color: #FFF;
	font-family: 'Lato', sans-serif;
	font-size: 18px;
	margin-top: 10px;
	margin-left: 20px;
	font-weight: 300;
}


.bloc-texte {
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #fff;
	font-weight: 400;
	float: left;
	margin-top: 20px;
	width: 500px;
	}
	
	.bloc-bordure {
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #fff;
	font-weight: 400;
	float: left;
	margin-top: 30px;
	width: 400px;
	border: solid 3px #d27736;
	margin-left: 45px;
	background: url(images/coin.jpg) top right no-repeat;
	margin-bottom: 50px;
	}
	.accroches {
	background: #fff;
}
	
	.accroches div{
	height: 200px;
	float: left;
}
	.accroches img{
	padding-left: 11px;
}
.texte-accroches {
	color: #FFF;
	padding-top: 10px;
	width: 100%;
	margin: 0 auto !important;
	height: 20px !important;
	text-align:center
}
		
	.texte-accroches a{
	color: #FFF;
	text-decoration: none;
}	
		.texte-accroches a:hover{color:#ccc; }	
		
.jaune {color:#d27736}

#apDiv2 {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 150;
	z-index: 100;
}

#apDiv1 {
	position: absolute;
	left: 0;
	top: 161px;
	width: 100%;
	height: 208px;
	z-index: 1000;
	text-align: center;
}

a img {
	border:0;
	outline:none;}




.navig-bas {
	color: #000;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	margin-top: 10px;
	margin-bottom: 8px;
}
		.navig-bas a{
	color: #000;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	padding-left: 10px;
	padding-right: 10px;
	border-left: 1px;
	border: solid 1px;
}
			.navig-bas a:hover{
	color: #1D5696;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
}


.footer h1{
	font-size: 20px;
	color: #000;
	margin: 0;
	padding: 0;
font-family: 'Vollkorn', serif;
	font-weight: lighter;
}

.bouton_actu {background:black; text-align:center; padding:5px; width:150px;color: white;
    font-size: 11px;
    padding: 5px;
    text-align: center;
    text-decoration: none;
    width: 150px; }

.bouton_actu a{color:#FC0; text-decoration:none}



.texte-normal {
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	color: #000;
	line-height: 18px;
	}
	
.texte-un-peu-plus-gros {
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	color: #000;
	font-weight: 400;
	}
	.texte-un-peu-plus-gros-ropuge {
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	color: #ff0000;
	font-weight: 700;
	}
.remplissage-autour {padding:10px;}



.bouton {
	width: 200px;
	background-color: #000;
	color: #FFF;
	text-align: center;
	float: left;
	font-weight: normal;
	font-family: 'Hammersmith One', sans-serif;
	line-height: 10px;
	font-size: 16px;
	border-left: solid 5px #999;
	margin-left: 20px;
	margin-top: 10px;
	}
	
.bouton a{

	color:#FFF;
	text-decoration:none;
	
	}
	
	.img-roll {
	-moz-opacity:1;
-khtml-opacity:1;
-ms-filter:"alpha(opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter:alpha(opacity=100);
opacity:1;
zoom: 1;/* HACK POUR IE */

}
.img-roll a{
	-moz-opacity:1;
-khtml-opacity:1;
-ms-filter:"alpha(opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter:alpha(opacity=100);
opacity:1;
zoom: 1;/* HACK POUR IE */
}
.img-roll a:hover{
-moz-opacity:0.88;
-khtml-opacity:0.88;
-ms-filter:"alpha(opacity=88)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=88);
filter:alpha(opacity=88);
opacity:0.88;
zoom: 1;/* HACK POUR IE */
}

.pointilles {border-top: dashed 1px #000000;}
.pointilles-v {border-right: dashed 1px #ccc;}
.bordure {
	border: solid 5px #d8d8d8;
}
.blanc {color:#FFF}

.creavt {
	font-size: 11px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #000;
	text-decoration: none;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	bottom: 0px;
	background-color: #FFF;
}

.creavt a{
	font-size: 11px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #000;
	text-decoration: none;
}
.creavt a:hover{
	font-size: 11px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #999;
	text-decoration: none;
}
.creavt img{
	border: double 3px #000;
	width:auto !important;
}
.bordure-image {border:solid 3px #fff;}
.marge {padding:5px;}
.marge_g {padding:10px;}
.txt-normal { font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000}

.liens {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color:#06F;
}
.liens a{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color:#06F;
}

.navig {
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #FFFFFF;
	line-height: 20px;
	font-weight: 300;
	width: 100%;
	height: 32px;
	padding-top: 10px;
	text-align: center;
	text-transform: uppercase;
	padding-right: 2%;
}


.navig a{
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #FFFFFF;
	text-decoration: none;
	font-weight: 300;
	padding-right: 18px;
	padding-left: 18px;
}

.navig a:hover{
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #FF0;
	text-decoration: none;
}

.actualites {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-weight: bold;
	color: #168DD7;
	text-decoration: none;
}

.marges-haut {padding-top:10px;}
.lettrage-petit {
	letter-spacing: -1px;
}




h3 {
	font-size: 18px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #000;
	font-weight: 200;
	margin: 0;
}


.bordure-tableau {
	border: solid 1px #ccc;
}
.hauteur-ligne {
	line-height:25px;}.titre {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	text-transform: none;
}
.descriptif {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	font-weight: normal;
	color: #333333;
	text-decoration: none;
}
.titrenews {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-weight: bold;
	color: #168DD7;
	text-decoration: none;
}
.txtrose {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	font-weight: bold;
	color: #168DD7;
	text-decoration: none;
}
.lien {
	color: #000000;
}
 .navig select {
      display: none;
   }

@media only screen and (max-width: 1100px) {
	

	
	body {
	background: url(images/bg.jpg) top center no-repeat #080a0d;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #000;
	font-weight: 300;
}

#conteneur-principal {width:95%; margin:0 auto;}
#conteneur-contenu {
	width: 95%;
	margin: 0 auto;
	margin-bottom: 50px;
	height: auto;
}
#conteneur-slider {width:95%; margin:0 auto;}
.logo {
	float: left;
	margin-right: 3%;
	width:61%;
	text-align:center;
}
.logo img{width:80%;
height:auto;
}
.slogan-droite{
	float: left;
}
.slogan-gauche{
	float: left;
	margin-right: 2%;
}

.slogan-droite img{
	width:110px;
	height:auto
}
.slogan-gauche img{
		width:110px;
	height:auto
}

	.accroches img{
		width:100%;
		height:auto;
		margin-top:20px;
	}
		
	.navig { float:none;}
	.navig {
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	line-height: 20px;
	font-weight: 300;
	width: 100%;
	margin-top: 10px;
	padding-left: 3px;
	height: 32px;
	padding-top: 15px;
}


.navig a{
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: none;
	font-weight: 300;
	border-left: solid 1px #999;
	padding-right: 1%;
	padding-left: 1%;
}

.navig a:hover{
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	color: #999999;
	text-decoration: none;
}
 .menu select {
      display: none;
   }
	
		
		
		.navig-bas {display:none;}
		
		.accroches {padding-top:20px;}
	
	.accroches div{
	height: 200px;
	float: left;
	width:25%;
}
	.accroches img{

	padding-left: 5px;
	
}
.texte-accroches {
	color: #000;
	padding-top: 10px;
	width: 100% !important;
	margin: 0 auto !important;
	height: 20px !important;
	text-align:center
}
.responsive {padding-top:180px;}
	
	
	}
	
	
	@media only screen and (max-width: 800px) {
			
						
			 #logo {
	display:none;
}
	
.header {
	
	background:none;
}
	
	body {
	background: url(images/bg.jpg) top center no-repeat #fff;	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	color: #000;
	font-weight: 300;
}

.vignette-sans-bg {background:none !important;
	width: 100%;
	text-align: center;
	font-size: 15px;
	color: #000000;
	padding: 1%;
	margin-top: 1%;
	font-family: 'Lato', sans-serif; }

.vignette-sans-bg img{background:none !important;
	width: 80%;
	height:auto;
	 }

.no-responsive img{width:auto !important;}
.main-slider {margin-top:120px;}

#conteneur-principal {width:95%; margin:0 auto;}
#conteneur-contenu {
	width: 95%;
	margin: 0 auto;
	margin-bottom: 50px;
	height: auto;
}
#conteneur-slider {width:95%; margin:0 auto;}
.logo {
	float: left;
	margin-right: 3%;
	width:60%;
	text-align:center;
	min-width:310px;
}
.logo img{width:100%;
min-width:310px;
height:auto;
}
.slogan-droite{
	float: left;
}
.slogan-gauche{
	float: left;
	margin-right: 2%;
}

.slogan-droite img{
	width:70px;
	height:auto
}
.slogan-gauche img{
		width:70px;
	height:auto
}

	.accroches img{
		width:100%;
		height:auto;
		margin-top:20px;
	}
		.navig select {display:block; height:30px; width:100%; font-size:16px; color:#fff; background:#333; font-family: 'lato', sans serif; line-height:30px; border:solid 3px #fff; background:url(images/bgselect.jpg)  98% 0 #09C;}
		
	.navig { float:none;}
	.navig {
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	line-height: 20px;
	font-weight: 300;
	width: 100%;
	margin-top: 10px;
	padding-left: 3px;
	height: 32px;
	padding-top: 15px;
}


.navig a{
	display:none;
}

.navig a:hover{
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	color: #999999;
	text-decoration: none;
}
	
		
		
		.navig-bas {display:none;}
		
		.accroches {padding-top:20px;}
	
	.accroches div {
	height: auto;
	float: left;
	width:95%;
	
	
}
	.accroches img{

	padding-left: 5px;
	
}
.texte-accroches {
	color: #000;
	background:#333;
	padding-top: 10px;
	width: 100% !important;
	margin: 0 auto !important;
	height: 30px !important;
	text-align:center;
	font-size:20px;
	padding-left:5px;
}
.texte-accroches a{
	color: #000 !important;
	text-decoration:none;
}
.responsive {
background:#000;
text-align:center;
height:50px !important;
width:100%;
padding-top:50px;
float:left;
}
.responsive h1{display:none}

.backtopbutton {color:#ccc; font-family:Arial, Helvetica, sans-serif; font-size:10px; display:none !important}



	
	
	}
	@media only screen and (max-width: 500px) {
		
	
	 #logo {
	display:none;
}
.header {
	
	background:none;
}

.vignette-sans-bg {background:none !important;
	width: 100%;
	text-align: center;
	font-size: 15px;
	color: #000000;
	padding: 1%;
	margin-top: 1%;
	font-family: 'Lato', sans-serif; }

.vignette-sans-bg img{background:none !important;
	width: 80%;
	height:auto;
	 }
	
		.slogan-droite {display:none;}
		
		.vignettes {
	margin-right: 1%;
	
	width: 100% !important;
	text-align: left;
	font-family: 'Hammersmith One', sans-serif;
	font-weight: 300;
	font-size: 16px;
	color: #000;
padding: 1%;
	line-height: 20px;
}

.vignettes img {width:100%;
height:auto;


		
		}
		.col-20 {
	width: 100%;
	margin: 1%;
}
		
		.col-60 {
	width: 100%;
	margin: 1%;
}

	.col-60 img{
	max-width: 100%;
	margin: 1%;
}

.col-30 {
	width: 100%;
	margin: 1%;
}

.col-40 {
	width: 100%;
	margin: 1%;
}

.col-100 img{
	width: 100%;
	float: left;
	width:100%;
height:auto;
}
.no-responsive {display:block}
.no-responsive img{width:auto !important; float:none}
	}