.mixed{
    display: none;
}
.full{
    display: inline-block;
}
/*///////////////////HEADER//////////////////////////*/
#header_ecran{
  padding:0 80px;
  max-width: 1680px;
  width:100%;
  margin: 0 auto;
  height: 260px;
  position: relative;
}
#nav_ecran{
  position: absolute;
  bottom:60px;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 10000;
}
#navigation{
  display: inline-block;
}
#navigation li{
  float:left;
  position:relative;
}
#navigation li.hover_a:after{
  content: "";
  width:10px;
  height: 15px;
  background:url(../images/plus.png) no-repeat left top;
  position: absolute;
  right:-10px;
  top:12px;
  padding-right: 10px;
  background-size:10px auto;
}
#navigation li a{
  display: inline-block;
  font-size:2em;
  color:#000;
  padding:0 10px;
  font-weight: normal;
  transition: all 0.5s ease 0s;
  padding-bottom:5px;
  background: url(../images/hover.png) no-repeat left bottom;
  background-size: 0 4px;
  margin:0 5px;
  text-align: left;
}
#navigation li a:hover,#navigation li.active a,#navigation li a:focus{
  background-size: 100% 4px;
}

.wnav{
  display: none;
  transition: all 0.5s ease 0s;
  position: absolute;
  left:5px;
  top:100%;
  opacity: 0;
  display: flex!important;
  flex-direction: column!important;
  min-width: 100%;
}
#navigation .hover_a:hover .wnav{
  display: inline-block!important;
  opacity: 1;
  box-shadow: 5px 10px 2px rgba(0,0,0,0.4);
  padding:0;
}

#navigation .wnav li {
  float: none;
  clear: both;
  background: #fff;
  text-align: left;
  width: 100%;
  min-width: 200px;
}
#navigation .wnav li a{
  color:#449ec7;
  font-size:1.6em;
  transition: all 0.5s ease 0s;
  padding:5px 10px!important;
  margin:0!important;
  white-space:nowrap;
  width:100%;
  background: none;
}
#navigation .wnav li a:hover,#navigation .wnav li a:hover{
  background: #449ec7;
  color:#fff;
}



/******************************/
#logo{
  margin-top:30px;
  max-width: 40%;
  display: block;
  transition: all 0.5s ease 0s;
  float: left;
}
#logo:hover{
  transform: scale(110%);
}
#logo img{
  width:100%;
  height: auto;
  max-width: 500px;
}
#header{
  width:100%;
  position: relative;
}
#recherche{
  float:left;
  display: inline-block;
  margin-left:5%;
  margin-top:70px;
  width:40%;
}



#main{
		padding:0 60px;
  max-width: 1680px;
  padding-top:100px;
}
#une{
  max-width: 1000px;
  margin:0 auto;
  min-height: 200px;
  margin-bottom:100px;
}
#une h2{
  font-size:4em;
  font-weight: bold;
  color:#000;
  text-align: center;
  line-height: 1em;
}
.col23{
  width:67%;
  min-height: 100px;
  float: left;
  margin-right: 4%;
}
.col13{
  width:29%;
  min-height: 100px;
  float: left;
}
.news{
  width:31%;
  min-height: 450px;
  float: left;
  margin-right:3.5%;
  margin-bottom:40px;
}
.news:nth-child(3n)
{
  margin-right: 0;
}
.news h2{
 min-height: 60px;
 margin-bottom:0;
}
#autres_news h3{
  font-size:4em;
}


.wrapper_img_news2{
  display: inline-block;
  float: left;
  width:20%;
  margin-bottom:0;
}
.news_droite{
  float: left;
  width:76%;
  margin-left:4%;
}




/*******************************CONTACT*************************/
.col12b{
   width:calc( 50% - 15px);
   margin-right:15px;
   float: left;
   position: relative;
   margin-bottom:0;
}
.col12b:nth-child(2){
   width:calc( 50% - 15px);
   margin-left:15px;
   float: left;
   margin-right: 0;  
}
#contact{
    max-width: 960px;
    margin:0 auto;
}
/*****************************FIN*CONTACT************************/

/******footer*/
#footer{
  padding:0 60px;
 /* max-width: 1680px;*/
  padding-top:30px;
  padding-bottom:60px;
  margin-top:200px;
}
#logo_footer{
  display: inline-block;
  width:18%;
  max-width: 250px;
  height: auto;
  margin-left:0;
  float:left;
  margin-right:10%;
}
#logo_footer img{
  width: 100%;
  height: auto;
}
#footer ul li{
  margin-bottom:10px;
}
#footer ul li a {
 font-size:1.8em;
 font-weight: 300;
 color:#fff;
}
#footer ul li a:hover{
  text-decoration: underline;
}
.col_footer{
  width:18%;
  margin-right:5%;
  float:left;
  text-align: left!important;
}
#footer h3{
  color:#fff;
  font-weight: normal;
  font-size: 1.8em;
  position: absolute;
  bottom:10px;
  left:60px;
}
#rs_footer{
  position: absolute;
  right: 60px;
  bottom:10px;
} 


/**********************************BLOG************************************/
#ariane{
  padding:0 60px;
  max-width: 1680px;
}
#autres_article_meme_periode .news{
 width: 23%;
 min-height: 450px;
 float: left;
 margin-right: 2%;
 margin-bottom: 40px;
}

#autres_article_meme_periode .news:nth-child(3n)
{
  margin-right: 2%;
}
#autres_article_meme_periode .news:nth-child(4n)
{
  margin-right: 0;
}
/**************************************************************************/

