/* pages/banniere/css.css */
.banniere_fond {
  position:relative;
}

.test p:nth-child(3n+1){
  font-size:32px;
  font-weight:bold;
}

div.banniere>*{
	display:none;
}

div.banniere>*:nth-child(1) , div.banniere.banniere_js>*{
	display:block;
}

div.banniere.banniere_js{
  height:0;
  padding-bottom:50%;
}

div.banniere_js>a , div.banniere_js>div{
  position:absolute;
  display:block;
  width:100%;
  height:100%;
  top:0px;
  left:0px;
  z-index:2;
}

div.banniere_js>a.hide , div.banniere_js>div.hide{
  display:none;
}

html div[class*="banniere_multiple"]:not(.banniere_fond)>a , html  div[class*="banniere_multiple"]:not(.banniere_fond)>div{
  width:50%;
  right:auto;
  left:auto;
  bottom:auto;
}

div[class*="banniere_multiple"]:not(.banniere_fond)>a:nth-child(2n) , div[class*="banniere_multiple"]:not(.banniere_fond)>div:nth-child(2n){
  right:0px;
}

div.banniere.banniere_js picture{
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  width: 100%;
  height:100%;
}

div.banniere picture img{
  width:100%;
}

div.banniere .bloc_hauteur picture img{
  width:auto;
  max-width:1000000%;
	height:100%;
}

div.banniere>.image_centree>picture img , div.banniere>.image_bloquee_droite>picture img , div.banniere>.image_bloquee_gauche>picture img{
  position:absolute;
  top:50%;
  width:auto;
  max-width:10000%;
  height:100%;
}

div.banniere>a.image_centree>picture img{
  left:50%;
  -webkit-transform: translate(-50%,-50%);
  -khtml-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
}

div.banniere>.image_bloquee_droite>picture img{
  right:0px;
}

div.banniere>.image_bloquee_gauche>picture img{
  left:0px;
}

div.banniere_js>a:not(.paralaxe_inverse):not(.paralaxe):not(.image_centree):not(.bloc_hauteur)>picture img ,
div.banniere_js>div:not(.paralaxe_inverse):not(.paralaxe):not(.image_centree):not(.bloc_hauteur)>picture img{
  position:absolute;
  width:100%;
  top:0px;
  z-index:3;
}

div.banniere>.image_bloquee_droite>picture img{
  right:0%;
}

div.banniere>.image_bloquee_gauche>picture img{
  left:0%;
}

.banniere .description , .banniere .h1_gauche , .banniere .h1_droite{
  position:absolute;
  max-width:40%;
  height:auto;
  padding:15px;
  background:#fff;
  background:rgba(255,255,255,0.5);
  color:#000;
  z-index:4;
}

.banniere .description{
  right:auto;
  left:10%;
  top:10%;
}

.banniere.h1_droite{
  left:auto;
  right:10%;
  bottom:10%;
}

.banniere .h1_gauche{
  right:auto;
  left:10%;
  bottom:10%;
}

.banniere_precedent , .banniere_suivant{
  position:absolute;
  display:none;
  width:58px;
  height:58px;
  top:50%;
  top:calc( 50% - 29px );
  background:rgba(255,255,255,0.6) url(/pages/banniere/img/fleche.png) no-repeat center center;
  background-size:auto 50%;
  z-index:20;
  cursor:pointer;
  -webkit-opacity:0.5;
  -khtml-opacity:0.5;
  -moz-opacity:0.5;
  -ms-opacity:0.5;
  -o-opacity:0.5;
  opacity:0.5;
  filter:alpha(opacity=50);
  -webkit-transition:all 0.3s;
  -khtml-transition:all 0.3s;
  -moz-transition:all 0.3s;
  -ms-transition:all 0.3s;
  -o-transition:all 0.3s;
  transition:all 0.3s;
  -webkit-border-radius:100%;
  -khtml-border-radius:100%;
  -moz-border-radius:100%;
  -ms-border-radius:100%;
  -o-border-radius:100%;
  border-radius:100%;
}

.banniere_precedent{left:2%;}
.banniere_suivant{
  right:2%;
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.banniere_fleche_exterieur .banniere_precedent{left:-2ex;}
.banniere_fleche_exterieur .banniere_suivant{right:-2ex;}
.banniere_fleche  .banniere_precedent , .banniere_fleche  .banniere_suivant{display:block;}

div.banniere_fond:hover .banniere_precedent , div.banniere_fond:hover .banniere_suivant{
  -webkit-opacity:1;
  -khtml-opacity:1;
  -moz-opacity:1;
  -ms-opacity:1;
  -o-opacity:1;
  opacity:1;
  filter:alpha(opacity=100);
}

ul.banniere li{
  vertical-align:top;
}

ul.banniere a{
	float:left;
}

ul.banniere img{
	float:left;
	display:block;
	width:100%;
}

.banniere_point{
  position:absolute;
  bottom:5px;
  right:5px;
  z-index:4;
}

.banniere_point p{
  float:left;
  display:block;
  width:18px;
  height:18px;
  margin-left:5px;
  cursor:pointer;
  background:#000;
  -webkit-opacity:0.5;
  -khtml-opacity:0.5;
  -moz-opacity:0.5;
  -ms-opacity:0.5;
  -o-opacity:0.5;
  opacity:0.5;
  filter:alpha(opacity=50);
  -webkit-transition:all 0.3s;
  -khtml-transition:all 0.3s;
  -moz-transition:all 0.3s;
  -ms-transition:all 0.3s;
  -o-transition:all 0.3s;
  transition:all 0.3s;
 -webkit-border-radius:100%;
 -khtml-border-radius:100%;
 -moz-border-radius:100%;
 -ms-border-radius:100%;
 -o-border-radius:100%;
 border-radius:100%;
 border:1px solid #fff;
}

.banniere_point p:hover , .banniere_point p.actif{
  -webkit-opacity:1;
  -khtml-opacity:1;
  -moz-opacity:1;
  -ms-opacity:1;
  -o-opacity:1;
  opacity:1;
  filter:alpha(opacity=100);
}

.conteneur_triple_ecran_droit , .conteneur_triple_ecran_gauche{
  position:absolute;
  top:0;
  margin-top:80px;
	width:75%;
	max-width:1000px;
}

.conteneur_triple_ecran_gauche{
  right:calc( ( 100% - 1200px ) / 2 + 1200px );
}

.conteneur_triple_ecran_droit{
  left:calc( ( 100% - 1200px ) / 2 + 1200px );
}


div.banniere>a>div{
  position:absolute;
  z-index:5;
}

div.banniere>a>div img{
  width:auto;
}

.banniere_paralaxe img{
  float:left;
  display:block;
  width:100%;
}

.banniere_pagination{
  position:absolute;
  bottom:1.5em;
  left:0;
  right:0;
  width:100%;
  z-index:6;
  text-align:center;
}

.banniere_pagination>div{
  display:inline-block;
  padding:7px 3ex;
  background:#fff;
  background:rgba(255,255,255,0.5);
  color:#fff;
  font-size:1.2em;
  line-height:1.2em;
  -webkit-text-shadow:1px 1px 3px #000;
  -khtml-text-shadow:1px 1px 3px #000;
  -moz-text-shadow:1px 1px 3px #000;
  -ms-text-shadow:1px 1px 3px #000;
  -o-text-shadow:1px 1px 3px #000;
  text-shadow:1px 1px 3px #000;
}

.banniere_taille_ecran.banniere {
  position:relative;
}

.banniere_taille_ecran img{
  object-fit: cover;
  width:auto;
  height:100%;
}

.banniere_admin{
	position:absolute;
	top:0px;
	left:0px;
	background:#fff;
	padding:10px;
	z-index:50;
}

@media screen and (max-width:1333.33333333px) {
    
  .conteneur_triple_ecran_gauche , .conteneur_triple_ecran_droit{
    display:none;
  }
  
}

@media screen and (max-width:1000px) {
  
  .banniere_precedent , .banniere_suivant{
    width:30px;
    height:30px;
  }

  div.banniere *{
    font-size:20px!IMPORTANT;
    line-height:1.2em!IMPORTANT;
  }
  
  div.banniere header h1{
    font-size:22px!IMPORTANT;
    line-height:1.2em!IMPORTANT;
  }
  
}

@media screen and (max-width:700px) {
  
  div.banniere>a:not(.image_centree)>picture img{
    top:0%!IMPORTANT;
    -webkit-transform:none!IMPORTANT;
    -khtml-transform:none!IMPORTANT;
    -moz-transform:none!IMPORTANT;
    -ms-transform:none!IMPORTANT;
    -o-transform:none!IMPORTANT;
    transform:none!IMPORTANT;
  }
  
  div.banniere>a:not(.image_bloquee_droite):not(.image_centree)>picture img{
    left:0%!IMPORTANT;
  }
  
  .banniere_fond.banniere_taille_ecran div.banniere{
    height:400px!IMPORTANT;
    padding-bottom:0px!IMPORTANT;
  }
  
  .banniere_fond.banniere_taille_ecran div.banniere a img{
    width:auto;
    max-width:10000%;
    height:100%;
  } 
  
  .banniere_precedent , .banniere_suivant{
    font-size:1em;
    line-height:0.6em;
  }
  
  .banniere_point p{
    display:none;
  }

  html body .banniere .description , html body .banniere .banniere_h1_description{
    top:auto;
    bottom:20px;
    right:auto;
    left:50%;
    width:80%;
    max-width:80%;
    -webkit-transform:translate(-50%,0);
    -khtml-transform:translate(-50%,0);
    -moz-transform:translate(-50%,0);
    -ms-transform:translate(-50%,0);
    -o-transform:translate(-50%,0);
    transform:translate(-50%,0);
  }
  
}