/* ## HEADER ############################################################# */
  .sectionHeader {
      display: flex;
      justify-content: flex-start;
      background-color: #FFF;
      padding: 1em 0 1em 1em;
      margin: 0 auto 1.5em auto;
    }
      .sectionHeader:before {
        display: block;
        content:"";
        flex-basis:47.75%;
        border-radius: var(--radius);
        align-items: stretch;
        background-image: url(../images/deco/bg-header_3.jpg) ;
        background-size:cover;
        background-repeat:no-repeat;
        background-position: center;
      }
      .sectionHeader-main{
        flex-basis:52%;
        padding-left:2.5%;
      }
        .sectionHeader-title {
          font-family: var(--font-title);
          font-size: 1em;
          font-weight: 700;
          text-transform: uppercase;
          line-height: 1;
          margin:0 auto;
        }
          .sectionHeader-title-label {
            display: block;
            color: var(--dark);
            font-size: 1.95em;/* 39px */
            line-height: 1.1;
          }
  .sectionHeader-subtitle {
    margin:1em auto 0 auto;
  }
    .sectionHeader-subtitle p {
      font-size: 1em;
    }

/* ## MAIN # Commons ##################################################### */

/* ## Blocks & Slider ## */
/* = fleches du slider */
.slick-prev:before,
.slick-next:before{
    border-color:#FFF;
}
/* = pager du slider */
.slick-dots li button{
    background-color: #DDD;
}
.slick-dots li.slick-active button{
    background-color:  var(--bleu);
}
/* = Commons */
.sliderBase{
	/*display:flex;
	justify-content: flex-start;
	align-items: stretch;*/
	/*margin:-1.2em -1.2em 0 0;*/
	margin:1em 0 0 0;
}
	.sliderBase--noSlider .slick-track{
		margin-left:0;
	}
	.sliderBase--noSlider .slick-dots{
		display:none;
	}


/* ## Intro */
.blkIntro{
  margin:0;
}
  .blkIntro-title{
    color:var(--dark);
    font-size:0.95em;
    line-height:1.2;
    font-weight: 700;
    margin:0;
  }
  .blkIntro-main{
    font-size: var(--font-size-text);
    padding:0;
    margin:1em 0 0 0;
  }
/* ## Nav */


/* ## Ambassadeur */
.blkAmbassadeur{
  display: flex;
  flex-direction: row-reverse;
  align-items:flex-start;
  justify-content: flex-start;
}
  .blkAmbassadeur-main{
    flex-basis:68.5% ;
    padding-right:4%;
  }
    .blkAmbassadeur p{      
      max-width: 620px;
    }
  .blkAmbassadeur-visuel{
    flex-basis:31.5%;
  }
.blkAmbassadeur-banner{
  clear: both;
  display: block;
  margin:1.25em auto 0 auto;
  border: 1px solid var(--midgrey);
}

/* ## WWEBSERIe */
.webserie-intro{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin:0 0 1.5em 0;
}
  .webserie-intro-visuel{
    width: 31.6%;
    border-radius: var(--radius);
  }
  .webserie-intro-visuel--desk{
    display: block;
  }
  .webserie-intro-visuel--mob{
    display: none;
  }
  .webserie-intro-txt{
    width: 68.4%;
    padding:0 2.5%;
  }
    .webserie-intro-txt p{
      margin:1em 0 0 0;
    }
    .webserie-intro-txt p:first-child{
      margin:0
    }
  .webserie-episodes{
    margin:0 0 4em 0;
  }
    .webserie-episodes img {
      border-radius: var(--radius);
    }

/* ## Présentation des Services */
.olympicServices {
  list-style-type: none;
  padding: 0;
  margin: 0 auto;
}
  .serviceFeat {
    display: block;
    padding:0;
    margin: 2.5em 0 0 0;
    position: relative;
  }
  .decoL.serviceFeat{
    padding-left: 46%;
  }
  .decoR.serviceFeat{
    padding-right: 46%;
  }
  .serviceFeat:first-child{
    margin-top: 0;
  }
    .serviceFeat-top,
    .serviceFeat-main{
      width:auto;
    }
    .decoL .serviceFeat-top,
    .decoL .serviceFeat-main {
      text-align: left;
    }
    .decoR .serviceFeat-top,
    .decoR .serviceFeat-main {
      text-align: right;
    }
      .serviceFeat-deco{
        position:absolute;
        top:0;
        bottom:0;
        width:42.6%;
        border-radius: var(--radius);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
      }
      .decoL .serviceFeat-deco{
        left:0;
      }
      .decoR .serviceFeat-deco{
        right:0;
      }
  
      .serviceFeat-pictos {
        display: block;
        background-color: #FFF;
        margin-bottom:0.5em;
      }
      .decoL .serviceFeat-pictos {
        text-align: left;
        padding-right:1em;
      }
      .decoR .serviceFeat-pictos {
        text-align: right;
        padding-left:1em;
      }
        .serviceFeat-pictos-icon {
          display: inline-block;
          background-color: #FFF;
          height: 3em;
        }
        .serviceFeat-pictos-icon + .serviceFeat-pictos-icon {
          margin-left:1em;
        }    
      .serviceFeat-title {
        color: var(--dark);
        font-size:0.95em;
        line-height: 1.2;
        margin:0;
      }
        .decoL .serviceFeat-title {
          margin-left: 0;
          margin-right: auto;
        }
        .decoR .serviceFeat-title {
          margin-left: auto;
          margin-right: 0;
        }
    .serviceFeat-main{
      margin-top:var(--font-size-text);
    }        
      .serviceFeat-desc {
        color:var(--midgrey);
        margin:0;
      }
      .serviceFeat-push{
        margin-top: 1em;
      }


.featuredBlk{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border-radius: var(--radius);
  background-color:#F5F5F5 ;
  padding:1.2em 1.5em;
  margin:2em 0 0 0;
} 
  .featuredBlk img{
    width:4.6em;
    margin:0 1.35em 0 0;
  }
  .featuredBlk p{
    color:var(--dark)
  }


/* ## fonctionnement plié-deplié ## */
.js-publiAccordionLight-toggle,
.js-publiAccordionLight2-toggle {
  cursor: pointer;
}
.js-publiAccordionLight-content,
.js-publiAccordionLight2-content {
  display: none;
}
.js-publiAccordionLight-content.js-publiAccordionLight-content--default,
.js-publiAccordionLight2-content.js-publiAccordionLight2-content--default {
  display: block;
}

/* ############################################################################################ */
/* ==== RESPONSIVE behaviour ================================================================== */
/* ############################################################################################ */

  @media (max-width: 767px) {
    .sectionHeader {
      display: block;
      padding:1em;
    }
      .sectionHeader:before {
        width:100%;
        height:0;
        padding-top:58%;
        margin-bottom:1em;
      }
      .sectionHeader-main{
        padding-left:0;
        text-align: center;
      }

  /* ## MAIN ############################################# */
  /* ## */
  .anchorList-item {
    font-size: 0.8em;
  }
  /* ## */
  .blkAmbassadeur{
    display: block;
  }
    .blkAmbassadeur-main{
      padding-right:0;
    }
    .blkAmbassadeur-visuel{
      aspect-ratio: 599/226;
      margin-bottom:1em;
    }
  /* ## */  
  .webserie-intro{
    align-items: flex-start;
  }

  /* ## */
  .serviceFeat {
    display: block;
    max-width:480px;
    padding:0;
    margin-left:auto;
    margin-right:auto;
  }
  .decoL.serviceFeat,
  .decoR.serviceFeat{
    padding:0;
  }
    .decoR .serviceFeat-top,
    .decoR .serviceFeat-main {
      text-align: left;
    }
    .serviceFeat-top{
      display:flex;
      align-items: flex-end;
      margin-bottom:1em;
    }
      .serviceFeat-deco{
        position:static;
        width:40%;
        aspect-ratio: 4/3;
      }

      .serviceFeat-head{
        flex-basis: 60%;
        padding-left:4%;
      }
      .decoR .serviceFeat-pictos {
        text-align: left;
        padding-right:1em;
        padding-left:0;
      }
    .serviceFeat-push .btn{
      display: block;
    }

}

@media (max-width: 480px) {
  /* ================================================================ */
  .sectionHeader-title-label {
    font-size: 1.5em;
  }
  /* ## */
  .anchorList{
    flex-wrap: wrap;
  }
  .anchorList-item:nth-child(2):after{
    display:none;
  }
  /* ## */
  .webserie-intro{
    display: block;
  }
    .webserie-intro-visuel--desk{
      display: none;
    }
    .webserie-intro-visuel--mob{
      display: block;
    }
    .webserie-intro-visuel{
      width: auto;
      margin:0 0 1em 0
    }
    .webserie-intro-txt{
      width: auto;
      padding:0;
    }
    /**/
    .serviceFeat-pictos-icon {
      height: 2.5em;
    }
    /**/

    .featuredBlk{
      display: block;
      text-align: center;
    } 
      .featuredBlk img{
        display: block;
        width:3em;
        margin:0 auto 1em auto;
      }
  /* ## */
	.sliderBase{
		flex-wrap:nowrap;
		width:100vw;
	}
		.sliderBase .slick-list{
			width:100vw;		
			padding-top:2px !important;
			padding-bottom:6px !important;
			margin-right:0;
			margin-left:0;
		}
			.sliderBase .slick-track{ /* si slidesToShow: x.4 => position de depart decalee */
				left:1em;
			}
				.sliderBase .slick-track > div:last-child,
				.sliderBase .slick-track > li:last-child{
					margin-right:2em ; /* permet de laisser un espace à droite apres la derniere slide */
				}
  /**/
  .ftlHTML .btn {
    line-height: 1.2;
    white-space: unset;
  }
}
