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

/* CSS Reset */
*{margin:0; padding:0;}
header, footer, aside, nav, article {
display:block;
}
input, select, textarea{
color:#333333;
font-size:13px;
font-family:Helvetica, Arial,  sans-serif;
padding:3px;
width:100%;
}
table, tr, td { margin:0;padding:2px; border:0;}
img{
border:none;
max-width:100%;
height:auto;
}
/*end reset*/
html {
margin:0;
padding:0;
color:#FFF;
}
body {
font-size:0.9em;
 font-family: "Century";
background-color:#e4e6e6;
}
strong{font-family: "CenturyBold"; font-weight:normal;}
a:link , a:visited, a:active{
	font-family: "CenturyBold";
	color: #FFF;
	text-decoration: none;
}
a:hover {color: #FFF;}

@font-face {
    font-family: "Century";
    src: url('../fonts/GOTHIC.TTF');
}
@font-face {
    font-family: "CenturyBold";
    src: url('../fonts/GOTHICB.TTF');
}

h1{ font-family: "CenturyBold", Helvetica, Arial, sans-serif; color: #FFF; font-size:20px;font-weight:normal;}
h2{ font-family: "CenturyBold", Helvetica, Arial, sans-serif;  color: #FFF; font-size:16px;font-weight:normal;}
h3{font-family: "Century", Helvetica, Arial, sans-serif;  color: #FFF; font-size:14px;font-weight:normal;}
.reseaux{position:absolute; z-index:100; margin:-55px 0 0 0;}
.trait{
width:100%;
margin:	2px 0;
border-bottom:1px solid #6e6e6e;
}
.titres_glob{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#CCC; 
font-size:22px;
text-align:center;
line-height:40px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
}
.titres{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#f59226; 
font-size:18px;
}
.titres_rub{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#CCC; 
font-size:20px;
line-height:30px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
margin:0 0 5px 0;
}
.titres_rub2{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#CCC; 
font-size:18px;
line-height:30px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
margin:0 0 5px 0;
}
.titres_rub3{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#CCC; 
font-size:22px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
margin: 10px 0;
}
.titres_rub4{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#FFF; 
font-size:18px;
line-height:25px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
margin:0 0 5px 0;
}
.titres_blanc{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#FFF; 
font-size:18px;
}

.tabplan td{padding:1%; border:none;}
.petit{
font-size:11px;
}

a.bout_j , a.bout_j:link, a.bout_j:visited, a.bout_j:hover, a.bout_j:active{
font-family: "Century", Helvetica, Arial, sans-serif; 
font-size:14px;
background-color:#f59226;
color:#FFFFFF;
padding:3px;
border: none;
font-weight:bold;
}

a.foot , a.foot:link, a.foot:visited, a.foot:hover, a.foot:active{
font-family: "Century", Helvetica, Arial, sans-serif; 
font-size:12px;
color:#CCC;
font-weight:bold;
}
.boutons{
font-family: "Century", Helvetica, Arial, sans-serif; 
font-size:16px;
background-color:#f59226;
color:#FFFFFF;
padding:5px;
border: none;
font-weight:bold;
-moz-border-radius:5px; -webkit-border-radius: 5px; border-radius: 5px;
}
.boutons2{
font-family: "Century", Helvetica, Arial, sans-serif; 
font-size:14px;
background-color:#F4640E;
color:#FFFFFF;
padding:5px;
margin:6px;
border: none;
font-weight:bold;
}

.fond_transp{ width:100%; padding:0;float:left;}
.demi{ width:50%; float:left;}
.tiers{ width:28%;padding:2% 2% 2% 0;float:left;}
.troisquart{ width:68%;padding:2% 0 2% 2%;float:right;}
.trio{ width:33%;float:left; text-align:center;}
.gris{ width:96%; padding:2%;float:left; text-align:justify; background-color:#89898a; -moz-border-radius:5px; -webkit-border-radius: 5px; border-radius: 5px;}

a.lienblanc , a.lienblanc:link, a.lienblanc:visited, a.lienblanc:hover, a.lienblanc:active{
color:#FFFFFF; 
}

/* header */
#header{
margin:0;
padding:0;
width:100%;
text-align:center;
}

/* menu */
.container {
    width: 100%;
    margin:0 auto;
	text-align:center;
	float:left;
	background-color:#FFF;
}
.toggleMenu {
    display:  none;
    padding: 2%;
	width:96%;
	text-align:center;
    color: #000;
	font-size:14px;
	font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
	background-color:#FFF;
}
.nav {
    list-style: none;
     *zoom: 1;
	 margin:0 auto;
	 padding:0;
	 max-width:1000px;
	 text-align:center;
}
.nav:before,
.nav:after {
    content: " "; 
    display: table;

}

.nav ul {
    list-style: none;
    width: 10em;
	margin:0 auto;
	text-align:center;
}
.nav a {
    padding: 15px;
	text-align:center;
	margin:0 auto;
    color:#FFF;
}
.nav a.actif {
	color: #000;
	border-bottom:3px solid #f59226; 
}
.nav li {
   
	margin:0 auto;
}
.nav > li {
	display: inline-block;
	margin:0 auto;

}
.nav > li > .parent {
text-align:center;
}
.nav > li > a {
    display: block;
	font-family: "CenturyBold", Helvetica, Arial, sans-serif;
    color: #000;
	text-decoration: none;
	font-size:14px;
}
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
	left: 50%;    
	width: 10em;
	margin-left: -5em; 
	font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
	
}
.nav li li.hover ul {
    top: 0;
	text-align:center;
	font-family: "CenturyBold", Helvetica, Arial, sans-serif;
	margin:0 auto;
	
}
.nav li li a {
	font-size:14px;
    display: block;
    position: relative;
    z-index:100;
    border-top: 1px solid #f59226;
	color:#000;
	text-align:center;
	margin:0 auto;
}
.nav li li li a {
    z-index:200;
    border-top: 1px solid #f59226;
}


/* FIN DE NAVIGATION */

/*corps*/
#main{
margin:0 auto;
padding:0;
width:100%;
}
#maincont{
margin:0 auto;
padding:0;
width:100%;
max-width:1000px;
}
#gauche{
float:left;
width:30%;
padding:2%;
margin:5px 0;
background-color:#f3f3f4;
border:1px solid #999999;
}
#droite{
float:right;
width:60%;
padding:2%;
margin:5px 0;
background-color:#f3f3f4;
border:1px solid #999999;
}



/* footer */
#footer{
float:left;
margin:20px auto 0 auto;
padding:0;
width:100%;
color:#f59226;
}
#footer #cont{
margin:0 auto  20px auto;
padding:5px 0;
width:96%;
max-width:1000px;
color:#f59226;
}
#footer #cont .infos{
width:23%;
float:left;
margin:1%;
}
/* slider video */

* {box-sizing: border-box}
.mySlides {display: none}

/* Next & previous buttons */
.previous, .suiv {
  cursor: pointer;
  width: auto;
  padding: 16px;
  color: white;
  margin:auto 0;
  font-weight: bold;
  font-size: 24px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  position:absolute;
}

/* Position the "next button" to the right */
.suiv {
 right: 0;
  border-radius: 3px 0 0 3px;
}
.previous {
left: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.previous:hover, .suiv:hover {
  background-color: rgba(0,0,0,0.8);
}


/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 2s;
  animation-name: fade;
  animation-duration: 2s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .previous, .suiv,.text {font-size: 11px}
}


/*Responsive Styles*/


@media screen and (max-width : 768px){
#main{
float:left;
margin:0 auto;
padding:0;
width:100%;
}	
.encart_main{
float:left;width:100%; position:relative;
}
.encart_cont{
float:left;width:100%; 
}
.encart_infos{
float:left; width:90%; margin:0 auto; padding:5%; background:url(../images/bleutransp.png) top left repeat; color:#FFFFFF; margin:0;
}

#droite{
float:left;
width:100%;
margin:1%;
}
#gauche{
float:left;
width:100%;
margin:1%;
}
.demi{ width:100%;float:left;}



h1{color: #FFF; font-size:18px;}
h2{color: #FFF; font-size:16px;}

/*menu*/

.active {
   display: block;

    }
	.nav a.actif {
	color: #f59226;
	border-bottom:none; 
}
	.nav {
	 float: none;
}
    .nav > li {
		display:block;
        float: none;
		text-align:center;
		font-size:14px;
    }

	 .nav > li a {
		font-size:14px;
		line-height:20px;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
    .nav li  .parent {
        background-image: url("../images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .nav ul {
        display: block;
        width: 100%;
		
    }
	.nav li li a {
	font-size:14px;
	line-height:20px;
    display: block;
	color:#FFF;
    position: relative;
    z-index:100;
	text-align:center;
}
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
		width:100%;
		margin: auto;  
    }
#footer #cont .infos{
width:100%;
float:left;
border-bottom: #FFF solid 1px;
}

}
@media screen and (max-width : 650px){
	
h1{color: #FFF; font-size:14px;}
h2{color: #FFF; font-size:12px;}
.demi{ width:100%;float:left;}
.tiers{ width:100%;float:left;padding:0; text-align:center;}
.troisquart{ width:100%;float:left;padding:0;}
.trio{ width:98%;padding:2%;float:left; text-align:center;}
.reseaux{position: inherit; float:left; margin:0; text-align:center;}

}
@media screen and (max-width : 414px){
	
h1{color: #FFF; font-size:14px;}
h2{color: #FFF; font-size:12px;}
.demi{ width:100%;float:left;}
.tiers{ width:100%;float:left;padding:0; text-align:center;}
.troisquart{ width:100%;float:left;padding:0;}
.trio{ width:98%;padding:2%;float:left; text-align:center;}
.reseaux{position: inherit; float:left; margin:0; text-align:center;}
#droite{
float:left;
width:100%;
margin:1%;
}
#gauche{
float:left;
width:100%;
margin:1%;
}
.tabplan td{padding:2px; border:none; font-size:11px;}
	
.titres{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#f59226; 
font-size:14px;
}
.titres_rub{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#CCC; 
font-size:18px;
line-height:24px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
margin:0 0 5px 0;
}
.titres_rub2{
font-family: "CenturyBold", Helvetica, Arial, sans-serif; 
color:#CCC; 
font-size:14px;
line-height:30px;
border-bottom:1px solid #CCC;
border-top:1px solid #CCC;
margin:0 0 5px 0;
}
}