/* ----------------
FILMS LISTE
-------------------*/
.block-film {
    width: 100%;
        display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    height: 100%;
}
.block-film h3 {
  color:#000;
  text-transform: uppercase;
}
.block-film h3:before {
    content: "";
    width: 40px;
    height: 3px;
    background: #ffd200;
    display: block;
    position: absolute;
    left: 0;
    top: -10px;
}
.block-film .btn-container {
  text-align:center;
  padding:0;
  width:100%;
 /* border-top:1px solid #dedede; */
  display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}
.lien-shop {
    padding: 15px 20px;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    font-size: 1.2rem;
    text-decoration: none !important;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    border-top: 1px solid #dedede;
    border-right: 1px solid #dedede;
    width: 33.33%;
    color: #000;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.lien-shop i {
    display: block;
    margin: auto;
    font-size: 2rem;
    color: #000;
}
.lien-shop:last-child,
.lien-shop:nth-child(3n) {
  border-right:none;
}
.lien-shop:hover {
  background-color:#fbcf1e;
  color:#000;
}
.block-film .bg-block-film {
    padding-bottom: 150%;
        -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    width: 100%;
    /* min-height: 100%; */
    position: relative;
    /* float: left; */
    background-size: cover;
    z-index: 2;
    display: block;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-position: center center;
}
.block-film .block-film-contenu {
    padding: 20px 20px 40px 20px;
}
.block-film .block-film-text {
    /* margin-left: 35%; */
    width: 100%;
    background: #fff;
    color: #888;
    vertical-align: center;
    z-index: 5;
}
.block-film .bg-opacity h3 {
  color:#fff;
  text-align: center;
  display:block;
  margin:auto;
  position: relative;
}
.block-film .bg-opacity {
    content: "";
    position: absolute;
    background: rgba(0,0,0,0.8);
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    vertical-align: middle;
    color: #fff;
    display: flex;
    text-align: center;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transform: scale(0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
}
.block-film:hover .bg-opacity {
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
}

.sublien-soundtracks-container,.elementor-element ul.sublien-soundtracks-container {
    list-style: none;
    margin: 0;
    position: absolute;
    padding: 0;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    width: 100%;
    opacity: 0;
    left: 0;
    font-size:0.9rem;
    top: 0;
}
.lien-soundtracks:hover .sublien-soundtracks-container{
  opacity:1;
}
.sublien-soundtracks-container a {
  padding:4px 10px;
  display:block;
  text-align:left;
  color:#000;
  background:#fbcf1e;
  border-bottom:1px solid rgba(0,0,0,0.1);
  text-decoration: none;
      transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}

.sublien-soundtracks-container a:hover {
  background:#edc31c;
}
.sublien-soundtracks-container li {list-style:none;}
.sublien-soundtracks-container li:last-child a {
  border-bottom:none;

}

.content-links-film-container {
    margin: 0 auto;
}
.flex-space-between {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.content-links-film-container .col {
    text-align: center;
    font-size: 1.2rem;
    color: #181818;
    display: block;
    min-width: 23%;
    margin: 10px;
    padding: 20px;
    background: #fff;
    /* float: none; */
    -webkit-box-shadow: 0 6px 50px rgb(57 138 172 / 10%), 0 3px 15px rgb(0 0 0 / 4%);
    box-shadow: 0 6px 50px rgb(57 138 172 / 10%), 0 3px 15px rgb(0 0 0 / 4%);
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
}
.content-links-film-container i {
    display: block;
    margin: 20px auto;
    font-size: 3rem;
    color:#000;
}

@media only screen and (max-width:1200px ) {
}
@media only screen and (max-width:992px ) {
}
@media only screen and (max-width:600px ) {
  .lien-shop {
    padding: 10px 5px;
  }
}
/*--------------------------------------------------------------
# SINGLE FILM
--------------------------------------------------------------*/



.infos-film {
      font-size: 1rem;
    line-height: 1.8rem;
    margin: 0 0;
    padding: 20px 0;
    border-bottom: 1px solid #f1f1f1;
}
.infos-film li {
    padding:0;
    display: block;
}
.card-stacked .infos-film li {
    display: inline-block;
}
.infos-film h3 {
    color:#000;
    font-size:1em;
}
.infos-film span {
  color:#181818;
}
.infos-film i {
    display: inline-block;
    vertical-align: middle;
    font-size: 30px;
    margin-right: 10px;
    color:#ffd200;
}

.card.horizontal .card-image{
  max-width:30%;
}
.card-button-container {
  padding:20px;
  text-align: right;
}

#synopsis {
      padding: 30px 0;
}
#synopsis > h2 {
    margin-top: 0;
    margin-bottom: 30px;
    color: var(--e-global-color-primary);
    font-weight: bold;
}
.category-product {
  margin-bottom:0;
}
.category-product + h3 {
  margin-top:0;
}

.teaser-container {
  margin-bottom:50px;
}
.content-links-film-container {
  margin:40px auto;

}
.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    width: 100%;
            -webkit-box-shadow: 0px 30px 68px 4px rgba(0,0,0,0.5);
    box-shadow:0px 30px 68px 4px rgba(0,0,0,0.5);
}
  .embed-container iframe,
  .embed-container object,
  .embed-container embed { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

  }
.content-links-film-container .col {
    text-align: center;
    font-size: 1.2rem;
    color: #181818;
    display: block;
    min-width: 23%;
    padding: 20px;
    /* float: none; */
    -webkit-box-shadow: 0 6px 50px rgba(57,138,172,.09999999999999998), 0 3px 15px rgba(0,0,0,.04);
    box-shadow: 0 6px 50px rgba(57,138,172,.09999999999999998), 0 3px 15px rgba(0,0,0,.04);
          transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
}
.content-links-film-container .col:hover {
   -webkit-box-shadow: 0 6px 10px rgba(57,138,172,.05), 0 3px 15px rgba(0,0,0,.01);
    box-shadow: 0 6px 10px rgba(57,138,172,.05), 0 3px 15px rgba(0,0,0,.01);
}
.content-links-film-container i {
  display:block;
  margin:20px auto;
  font-size:3rem;
}
.logo-film + #title-film {opacity:0;}

body.noir {
    background: #181818;
}


body.noir .content-links-film-container .col {
  color:#fff;
  background:#181818;
      -webkit-box-shadow: 0 6px 50px rgba(0,0,0,.09999999999999998), 0 3px 15px rgba(0,0,0,.04);
    box-shadow: 0 6px 50px rgba(0,0,0,.09999999999999998), 0 3px 15px rgba(0,0,0,.04);
}



body.noir .content-links-film-container i {
    color:#fff;
}

body.noir .content-links-film-container .col:hover {
  color:#fff;
  -webkit-box-shadow: 0 6px 10px rgba(0,0,0,.05), 0 3px 15px rgba(0,0,0,.01);
  box-shadow: 0 6px 10px rgba(0,0,0,.05), 0 3px 15px rgba(0,0,0,.01);

}
.header-nuages:after{
    content:"";
    position:absolute;
    width:300%;
    height:70%;
    left:0;
    top:auto;
    bottom:-1px;
    opacity:1;
    z-index:1;
    background-color:transparent;
    background-image:url(../images/nuages-blancs.png);
    background-position:top center;
    background-size: cover;
    background-repeat:no-repeat;
            animation: animationFrames linear 140s;
  -webkit-animation: animationFrames linear 140s;
  -moz-animation: animationFrames linear 140s;
  -o-animation: animationFrames linear 140s;
  -ms-animation: animationFrames linear 140s;
    animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  z-index:1;
}

.noir .header-nuages:after{
  background-image:url(../images/nuages-noirs.png);
}
.single-film.noir .elementor-widget-heading .elementor-heading-title {color:#fff;}
.header-nuages:before {
    content:"";
    z-index:1;
  position:absolute;
  left:0;
  top:auto;
  bottom:-1px;
  width:100%;
  height:20%;
  background: transparent; /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.noir .header-nuages:before {
    content:"";
  background: transparent; /* Old browsers */
background: -moz-linear-gradient(top, rgba(24,24,24,0) 0%, rgba(24,24,24,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(24,24,24,0) 0%,rgba(24,24,24,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(24,24,24,0) 0%,rgba(24,24,24,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

@keyframes animationFrames{
  0% {
    transform:  translate(0%) ;
  }
  50% {
    transform:  translate(-70%) ;
  }
  100% {
    transform:  translate(0%) ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    -moz-transform:  translate(0%) ;
  }
  50% {
    -moz-transform:  translate(-70%) ;
  }
  100% {
    -moz-transform:  translate(0%) ;
  }
}

@-webkit-keyframes animationFrames {
   0% {
    -webkit-transform:  translate(0%) ;
  }
  50% {
    -webkit-transform:  translate(-70%) ;
  }
  100% {
    -webkit-transform:  translate(0%) ;
  }
}

@-o-keyframes animationFrames {
   0% {
    -o-transform:  translate(0%) ;
  }
  50% {
    -o-transform:  translate(-70%) ;
  }
  100% {
    -o-transform:  translate(0%) ;
  }
}

@-ms-keyframes animationFrames {
   0% {
    -ms-transform:  translate(0%) ;
  }
  50% {
    -ms-transform:  translate(-70%) ;
  }
  100% {
    -ms-transform:  translate(0%) ;
  }
}


@media only screen and (max-width:1200px ) {
}
@media only screen and (max-width:992px ) {
  .nuages {
    height: 50%;
  }

  .teaser-container {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width:600px ) {
  .title-page-container .center-align > :first-child {
    margin-top:0;
  }
  .opacity-degrade-bottom {
    height:20%;
  }


  .parachut {
      background-position-x: 600px;
  }
    .title-page-container .logo-film {
      max-width: 70%;
  }
}

@media only screen and (max-width:600px ) {
  .teaser-container {
      margin-bottom: 20px;
  }

}