
/******************************************** DIAPORAMA **************************************/

.home-btn {
  margin-bottom:-.5em;
  margin-right:7%;
  z-index: 30;
}
.une-suivante {
  display: inline-block;
  background-color: #ccc;
  color: #222;
  padding-left:.5em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
  border-radius: 2px 0 0 2px;
  border-left: #bbb solid 1px;
  border-bottom: #bbb solid 1px;
  position: relative;
}
.une-suivante:after {
  display: inline-block;
  content: ' ';
  height: 0;
  /*border: 1px solid #ccc;*/
  border-left: 1em solid #ccc;
  border-top: 1em solid transparent;
  border-right: 1em solid transparent;
  border-bottom: 1em solid transparent;
  position: absolute;
  right: -2em;
  top: 0;
}

/*.home-btn-fleche {
  display:inline-block;
  vertical-align: middle;
  width:0px;
  border:1em solid transparent;
  border-left:1em solid #ccc;
}*/
#unes {
  overflow:hidden;width:100%;
  position:relative;
  border-radius:initial;
  margin-bottom:2em;
}

#unes .thumbnails { display:none;}
.une {
  overflow-x:hidden;
  position:relative;
  display:none;
}
/*.une {display:none;}
.une:first-child {display:block;}*/
.une .fond {
  position:absolute;
  height:100%;
  width:100%;
  background-size:cover;
  background-image: url('/2016/design/unes/brics.png');
  background-position:center;
}
.une .reprise-surtitre {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.4em 1.3em;
  border-radius: 0 0 4px 0;
  opacity: 0.9;
}

.une .wrapper {
  width:90%;
  margin-left:5%;
  padding:1.7em 0;
  position: relative;
}
.une > .flex {
  position: relative;
  z-index: 10;

  -webkit-box-align: stretch;

  -webkit-align-items: stretch;

      -ms-flex-align: stretch;

              -ms-grid-row-align: stretch;

          align-items: stretch;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  /*-webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;*/
}
.une h2 {
  margin-bottom: 0.6em;
  font-family: MuseoSlab-900; font-weight: normal;
}
.une h2.taille-gros, .une h2.taille-gros.serif {
  line-height: 1;
}

.une .intro, .article-droite .droite {
  padding: 1.7em 1.2em;
}
.une .intro {text-align: left;}
.une .intro p:last-child {margin-bottom: 0;}

@media screen and (min-width:768px){
  #unes {
    padding-bottom: 160px;
  }
  .une .wrapper {
    height: 23rem;
  }
  
  .home-btn, .une-suivante {display:none;}
}

@media screen and (min-width:900px){
  .une .wrapper {
    height: 30rem;
  }
}
@media screen and (min-width:1200px){
  #unes {
    border-radius: 4px;
  }
  .une .reprise-surtitre {
    border-radius: 4px 0 4px 0;
  }
}
/************************************* BANDEAU APERCUS *********************************************/
  
@media screen and (min-width:768px){
  
  .fadeLeft, .fadeRight, .fadeTop, .fadeBottom {
    position:relative;
  }
  
  #unes .thumbnails {
    display:block;
    position:absolute;
    bottom:0;
    height:8.7em;
    overflow:hidden;
    padding-left:2.5em;
    width:100%;
    z-index:10;
  }
  
  #unes .thumbnails .flex {
    position:relative;
    left:0;
    -webkit-transition:left 0.4s ease-out !important;
    transition:left 0.4s ease-out !important;
    
  }
  
  #unes .prev, #unes .next {
    position:absolute;
    background-color:#000;
    display:block;
    height:8.7em;
    width:2.5em;
    font-size:1em;
    -webkit-transition:-webkit-filter 0.2s;
    transition:-webkit-filter 0.2s;
    transition:filter 0.2s;
    transition:filter 0.2s, -webkit-filter 0.2s;
    background-repeat:no-repeat;
    background-position:center;
    background-size:50% auto;
    z-index:20;
    -webkit-filter:brightness(20%);
            filter:brightness(20%);
  }
  #unes .prev {
    left:0;
    background-image:url("/2016/design/fleche-g.svg");
  }
  #unes .next {
   right:0;
    background-image:url("/2016/design/fleche-d.svg");
  }
  #unes .prev.active, #unes .next.active {
    -webkit-filter:brightness(150%);
            filter:brightness(150%);
  }
  #unes .prev.active:hover, #unes .next.active:hover {
    -webkit-filter:brightness(300%);
            filter:brightness(300%);
  }
  
  
  #unes .thumbnail {
    background:none;
  }
  
  #unes .thumbnails > .flex {
    width:200%;
  }
  
  #unes .thumbnail {
    width:12.2em;
    height:8.7em;
    position:relative;
    padding:0.9em 0.5em 0.5em 0.5em;
    text-align:center;
  }
  
  /*.thumbnails .surtitre {
    position:relative;
    z-index:10;
    display:inline-block;
    border-radius:0.3em;
    padding:0.2em 0.8em;
    top:-0.7em;
    opacity:0.5;
    transition: 0.2s all ease-in-out;
  }*/
  .thumbnails .surtitre {
    position: absolute;
    z-index: 10;
    /*border-radius: 0.3em;*/
    padding: 0.2em 0.8em;
    bottom: 0.3em;
    opacity: 0.5;
    transition: 0.2s all ease-in-out;
    left: 0.5em;
    right: 0.5em;
    margin-bottom: 0;
  }
  .thumbnail.active .surtitre, .thumbnail:hover .surtitre {opacity:1;}
  
/*  #unes .thumbnail img {
    width:calc(100% - 0.8em);
    height:calc(100% - 1.4em);
    position:absolute;
    top:0.9em;
    left:0.4em;
  }*/

  #unes .thumbnail .image {
    display: block;
    position: absolute;
    top: 0.5em;
    left: 0.5em;
    right: 0.5em;
    bottom: 1.5em;
    text-align: center;
    background-size: cover;
  }

  #unes .thumbnail .titre {
    position: relative;
    text-align: center;
  }

  #unes .thumbnail .cache {
    display:block;
    position:absolute;
    /*width:calc(100% - 0.8em);
    height:calc(100% - 1.4em);*/
    top: 0.5em;
    left: 0.5em;
    right: 0.5em;
    bottom: 1.5em;
    background:rgba(0,0,0,0.5);
    z-index:8;
  }
  
  #unes .thumbnail:hover .cache, #unes .thumbnail.active .cache {
    opacity:0;
  }
}


/************************************* BASE + BRICS *******************************/

.article-droite .gauche {
  text-align:center;
}
/*.article-droite .gauche .intro,*/ .article-droite .gauche h2 {
  text-align:left;
}

.une .btn {/*padding:0.4em 1.3em;*/
  position:relative;
  top:-0.7em;
  display: inline-block;
}

.article-droite .droite h3 {
  text-align:center;
}

.article-droite .droite .taille-moyen {
  margin-bottom:0.5em;
}

.article-droite .droite img {
  margin-top:0.5em;
  height:auto;
  width:100%;
}

.une .next {
  position:relative;top:0.5em;
}
.titre {text-align: left; margin-bottom: 0.5em;}

@media screen and (max-width:767px){
  .une .droite {
    margin-top: 2em;
  }
}

@media screen and (min-width:768px){
  #unes, .une {
    height:33em;
  }
  .une .flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
                -ms-grid-row-align: center;
            align-items: center;
  }
  
  /*.article-droite .flex-sb {
    padding-top:4em;
  }*/
  .article-droite .gauche {
    width:58%;
    /*max-width:31em;*/
    padding-top:0em;
    
  }
  .article-droite .droite {
    width:35%;
    /*max-width:18em;*/
  }
  .article-droite .droite .taille-moyen {
   margin-bottom:1.2em;
  }
  

}

/************************************* KRACH + NS *******************************/


.une.krach .gauche {
  text-align: center;
}
.une.krach .btn {
  display: inline-block;
}
/*.une.krach .intro {
  text-align: left;
}*/
.une .intro ul{
  padding-left: 1.2em;
}
.une .intro ul li{
  list-style: disc;
  margin-bottom:0.5em;
}
.une.krach .droite img {
  height: 200px;
}

.une.ns .droite .contenu {
  text-align:center;
}
.une.ns .droite img {height:350px;}
 .une.krach .droite, .une.ns .droite {
   position:relative;
   z-index:5;
   -webkit-align-self: stretch;
       -ms-flex-item-align: stretch;
           align-self: stretch;
 }
 
 .une.krach .contenu, .une.ns .contenu {
   -webkit-align-self: stretch;
       -ms-flex-item-align: stretch;
           align-self: stretch;
   -webkit-box-align: center;
   -webkit-align-items: center;
       -ms-flex-align: center;
               -ms-grid-row-align: center;
           align-items: center;
 }


.une.krach .blur {display:none;}

@media screen and (max-width:767px){
  .une.krach .contenu {
    background: none;
  }
}
@media screen and (min-width:768px){
  .une.krach .fond {
    background-position:center top;
    background-size:100% auto !important;
  }
  .une.krach .droite > div {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
  }
  .article-droite.krach .wrapper {
    padding-top: 0;
    padding-bottom: 0;
  }
  /*.article-droite.krach .flex-sb {
    padding-top:2.3em;
  }*/
  .une.krach .droite h3, .une.ns .droite h3 {
    margin-top: 0;
    margin-bottom:0;
  }
  .une.krach .blur {
    display:block;
      background-size:319% auto;
      background-position: right 7.5% top 0%;
      -webkit-filter:blur(10px);
              filter:blur(10px);
  }
}

.une.article-droite.ns .contenu {background:none;}

/*@media screen and (min-width:900px){
  .une.krach .droite h3 {
    margin-top: 2em;
  }
}*/

/*********************************** UNE VIDEO *******************************/

.une.video .gauche {
  width: 100%;
}
.une.video .droite {
  text-align: center;
}
/*.une.video .droite .intro {
  text-align: left;
}*/

@media screen and (min-width:768px){
  .une.video .gauche {
    width: 46%;
    /*max-width:31em;*/
  }
  .une.video .droite {
    width:46%;
    /*max-width:18em;*/
    margin-bottom: -1.1em;
  }



}

/********************************* UNE CHEMI 2017 ***************************/

.une.chemi2017 .cheminade {
  font-size: 30px;
  font-family: MuseoSans-900, "Trebuchet MS", sans-serif;
  font-weight: normal;
  text-transform: uppercase;
}
.une.chemi2017 img {
  width:8em;
  margin: 0 1.3em 0 0;
  height:auto;
}
.une.chemi2017 .droite > div, .une.chemi2017 .droite > div a {
  width:100%;
  text-align:center;
}
.une.chemi2017 .droite > div:first-child {
  margin-bottom: 1.5em;
}
.une.chemi2017 .droite > div:last-child {
  margin-top: 1.5em;
}
.une.chemi2017 .droite a {
  top:0;
}
.une.chemi2017 h2 {
  position: relative;
}
.une.chemi2017 h2 span {
  text-transform: none;
  line-height: 1em;
  display: block;
}
.une.chemi2017 .surtitre, .une.chemi2017 h3 {
  margin-bottom: 1em;
}
.une.chemi2017 .article.flex {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
              -ms-grid-row-align: flex-start;
          align-items: flex-start;
  /*-webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;*/
  /*height: 8em;*/
}

.une.chemi2017 .ellipsis {
  width:calc(100% - 10em);
  overflow:visible;
  height:8em;
}

.une.chemi2017 .wrapper.flex > .flex {

  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
/*.une.chemi2017 .dot {
  height: 5em;
}
*/
@media screen and (max-width:767px){
  .une.chemi2017 .droite {
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
                -ms-grid-row-align: center;
            align-items: center;
  }
}

@media screen and (min-width:375px){
  .une.chemi2017 .cheminade {
    font-size: 38px;
  }
}

@media screen and (min-width:500px){
  .une.chemi2017 .cheminade {
    font-size: 45px;
  }
}

@media screen and (min-width:768px){
  .une.chemi2017 .cheminade {
    font-size: 40px;
  }
  .une.chemi2017 .gauche {
    margin-right: 2em;
    width: 63%;
  }
  .une.chemi2017 .droite {
    width: 32%;
  }
  .une.chemi2017 .wrapper > div {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
                -ms-grid-row-align: flex-end;
            align-items: flex-end;
  }
  .une.chemi2017 .wrapper.flex > .flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}

@media screen and (min-width:900px){
  .une.chemi2017 .cheminade {
    font-size: 45px;
  }
}


/********************************* UNE ASAP ***************************/

.une.asap .wrapper > .flex, .une.asap .gauche.flex {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.une.asap h3 {
  margin-bottom: .5em;
  font-size: 1.111em;
}
.une.asap a.article:last-child {
    margin-top: .75em;
  }

.une.asap a.article img {height:auto;width:100%;}

@media screen and (min-width:500px){
  .une.asap .gauche.flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    align-items : stretch;
    -webkit-box-align : stretch;
    -ms-flex-align : stretch;
     -ms-grid-row-align : stretch;
  }
  .une.asap a.article:first-child {
    margin-right: .75em;
  }
  .une.asap a.article:last-child {
    margin-left: .75em;
    margin-top: 0;
  }

}

@media screen and (min-width:768px){
  .une.asap .wrapper > .flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .une.asap .gauche {
    width:62%;
    /*padding-top:0em;*/
    
  }
  .une.asap .droite {
    width:35%;
    text-align: center;
  }
  
  .une.asap .article {}
}
@media screen and (min-width:1200px){
  .une.asap .gauche {
    width:65%;
  }
  .une.asap .droite {
    width:30%;
    text-align: center;
  }
}