@charset "utf-8";
/* CSS Document */

#a-propos{
    color: #000;
    padding:30px 0;
    background: #f9f9f9;
}

#a-propos .container{
    padding: 0px 30px;
    position: relative;
    max-width: 970px;
    margin:0 auto;
    /* text-align: justify; */
}

#a-propos h1{
    font-family: 'poppins bold';
    text-transform: uppercase;
}

/* #a-propos .container div{
  margin: 25px 0;
  padding: 10px 25px;
  background: rgba(0,0,0,0.1);
} */

#a-propos .container .container-crew{
  display: flex;
  margin: 35px 0;
}
#a-propos .container .container-crew .photo{
  min-width: 150px;
  min-height: 100%;
  -webkit-box-shadow: inset 0px -50px 40px -11px #000000;
  box-shadow: inset 0px -50px 40px -11px #000000;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
}
#a-propos .container .container-crew .photo.samian{
  background-image: url(../images/samian_v.jpg);
  background-size: cover;
  background-position: center;
}
#a-propos .container .container-crew .photo.jf{
  background-image: url(../images/jf_v.jpg);
  background-size: cover;
  background-position: top;
}
#a-propos .container .container-crew .photo.randy{
  background-image: url(../images/randy_v.jpg);
  background-size: cover;
  background-position: center;
}
#a-propos .container .container-crew .photo.genevieve{
  background-image: url(../images/gen_v.jpg);
  background-size: cover;
  background-position: center;
}
#a-propos .container .container-crew .photo.jason{
  background-image: url(../images/jason_v.jpg);
  background-size: cover;
  background-position: center;
}

#a-propos .container .container-crew .description-crew{
  /* margin: 25px 0; */
  padding: 20px;
  background: rgba(0,0,0,0.1);
}
#a-propos .container .container-crew .description-crew p:last-child{
  margin-bottom: 0;
}

#a-propos .container div h2{
    margin:0;
    color: #333;
}
#a-propos .container div h4{
    margin:0;
    color:#af0606;
    line-height: 1;
}


.credits-container{
  margin: 75px 0;
}
.credits-container p{
  font-size: 10px;
}
.credits{
  -webkit-column-count: 5;
  -moz-column-count: 5;
  column-count: 5;
  -webkit-column-gap: 2em;
  -moz-column-gap: 2em;
  column-gap: 2em;
  -webkit-column-rule: 1px dotted #ddd;
  -moz-column-rule: 1px dotted #ddd;
  column-rule: 1px dotted #ddd;
}
.credits p:first-child{
  margin-top: 0;
}


#producteurs{
    color: #FFF;
    padding:30px 0;
/*    background: #000;*/
  	background-image: url("../images/texture-bg.jpg");
  	background-size: cover;
    box-shadow: 0px 0px 150px 104px rgba(0,0,0,0.55) inset;
    -webkit-box-shadow: 0px 0px 150px 104px rgba(0,0,0,0.55) inset;
    -moz-box-shadow: 0px 0px 150px 104px rgba(0,0,0,0.55) inset;
}

#producteurs h1{
    font-family: 'poppins bold';
    text-transform: uppercase;
}

#producteurs .container{
    padding: 0px 30px;
    position: relative;
    max-width: 770px;
    margin:0 auto;
}

#producteurs .container .producteur{
    /* border-bottom: 1px solid #353534; */
    padding-bottom: 20px;
    padding-top:20px;
    margin-bottom: 20px;
    text-align: center;
}
#producteurs .container h1{
  text-align: left;
}

#producteurs .container img{
    max-width:255px;
    margin-bottom: 10px;
}

#producteurs .texte-producteur{
    font-size: 15px;
    /* -webkit-columns: 300px 2;
    -moz-columns: 300px 2;
    columns: 300px 2;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px; */
    padding:0;
    text-align: left;
}
#producteurs .texte-producteur h2{
  margin: 25px 0 0 0;
}
#producteurs .producteur a.nish-website{
    color:#1e8dd1;
    border: 2px solid #1e8dd1;
    border-radius: 25px;
    text-decoration: none;
    padding:0.05em 0.55em;
    font-family: 'poppins semibold';
}
#producteurs .producteur a.nish-website:hover{
  color:#51aee7;
  border: 2px solid #51aee7;
}
#producteurs .texte-producteur p{
  margin: 0;
}

.nish-social{
  margin-top:15px;
}
.nish-social img{
  width: 35px;
  margin: 0 3px;
}




@media screen and (max-width: 900px) {
    #a-propos h1{
        text-align: center;
        font-size: 1.602rem;
    }
    #a-propos h2{
        font-size: 1.2rem;
    }
    #a-propos .container{
        padding:0 20px;
    }
    .texte-scenarisation{
        display: block;
        text-align: center;
    }
    .texte-scenarisation .image-scenariste {
        margin: 0 auto;
    }

    .credits{
      -webkit-column-count: 4;
      -moz-column-count: 4;
      column-count: 4;
    }
    
    #producteurs .texte-producteur{
        -webkit-columns: 300px 1;
        -moz-columns: 300px 1;
        columns: 300px 1;
    }
    #producteurs h1{
        font-size: 1.4rem;
    }
    #producteurs .texte-producteur h2{
        font-size: 1.2rem;
    }

    #a-propos .container .container-crew{
      display: block;
    }
    #a-propos .container .container-crew .photo{
      min-height: 150px;
      -webkit-box-shadow: none;
      box-shadow: non;
      border-top-left-radius: 7px;
      border-top-right-radius: 7px;
      border-bottom-left-radius: 0px;
    }
    #a-propos .container .container-crew .photo.samian{
      background-image: url(../images/samian_h.jpg);
    }
    #a-propos .container .container-crew .photo.jf{
      background-image: url(../images/jf_h.jpg);
      background-position: center;
    }
    #a-propos .container .container-crew .photo.randy{
      background-image: url(../images/randy_h.jpg);
    }
    #a-propos .container .container-crew .photo.genevieve{
      background-image: url(../images/gen_h.jpg);
    }
    #a-propos .container .container-crew .photo.jason{
      background-image: url(../images/jason_h.jpg);
    }
    #a-propos .container .container-crew .description-crew{
      padding: 15px;
    }
}

@media screen and (max-width: 700px) {
  .credits{
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
  }
} 

@media screen and (max-width: 500px) {
  .credits{
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
} 

@media screen and (max-width: 400px) {
  .credits{
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    text-align: center;
  }
}