/* PARTIE METIERS */
/* PAGE STRATEGIE MARKETING */
/* ELEMENTS PAGE INDEX */
section {
    width: 100%;
    height: calc(66vh - 60px);
    margin-top: 60px;
    
    background-color: #f1f1f1;
    background-repeat: no-repeat;
    background-position: left center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.metier1{
    background-image: url(../img/metiers/ampoule-strategie-940px.jpg);
}
.metier2 {
    background-image: url(../img/metiers/ampoule-oeuf-940px.jpg);
}
.metier3{
    background-image: url(../img/metiers/ampoule-solutions-940pxc.jpg);
}
.metiers{
    min-height: 40vh;
}
/*.print {
    background-image: url(../img/print/print-940px.jpg);
}*/
/*.mailing {
    background-image: url(../img/mailing/mailing-940px.jpg);
}*/
.presse, .brochure, .mailing, .print {
    background-image: url(../img/presse/presse-940px.jpg);
}
.campagne_pub {
    background-image: url(../img/campagne_pub/campagne_pub-940px.jpg);
}
._3d {
    background-image: url(../img/3d/3d-940px.jpg);
}
.web {
    background-image: url(../img/web/web-940px.jpg);
}
.illustration {
    background-image: url(../img/illustration/illustration-940px.jpg);
}
.logo {
    background-image: url(../img/logo/logo-940px.jpg);
}

section .section-metiers{
    width: 34%;
    text-align: center;
    position: relative;
    left: 20vh;
}
section .section-metiers img {
    width: 140px;

}
section .section-metiers h1{
    font-size: 60px;    
    line-height: 68px;
    font-weight: 100;
}
section .section-metiers p{
    font-size: 25px;
    line-height: 30px;
    font-weight: 100;
}
.text-metiers{
    padding: 30px 60px;
}
.text-metiers h2{
    font-size: 24px;
    line-height: 30px;
    font-weight: 400;
    color:#3a3737;
    
} 
.text-metiers p {
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color:#3a3737;
}

.active_vignette {
    opacity: 0.5;
    cursor: none;
}
.active_vignette h3 {
    opacity: 0.5;
    cursor: none;
}

/* MOBILE VERSION */

@media only screen and (max-width:600px) {
 
    .wrapper-main{
         width: calc(100% - 20px);
     }
/* HEADER 3 METIERS */
section {
    background-repeat: no-repeat;
    background-position: center;
    align-items: flex-end;
    width: 100%;
    height: calc(100vh - 40px);
    margin-top: 40px;
    background-size: cover;
    display: flex;
    justify-content: center;
}
.metier1{
    background-image: url(../img/metiers/metier-strategie-mobversion.jpg) !important;
}
.metier2{
    background-image: url(../img/metiers/metier-design-mobversion.jpg) !important;
}
.metier3{
    background-image: url(../img/metiers/metier-solutions-mobversion.jpg) !important;
}
section .section-metiers {
    width: 100%;
    left: 0;
}
.section-metiers {
    text-align: center;
    width: 90%;
    position: relative;
    left: 0vh;
}
section .section-metiers h1 {
    color: #f7f7f7;;
    font-size: 2.7rem;
    line-height: 3.6rem;
    font-weight: 100;
    
}
section .section-metiers p{
    width: 100%;
    color:#3a3737;
    padding: 0 20px 60px;
    font-size: 1.2rem;
    line-height: 1.3rem;
    font-weight: 100;
    margin-top: 4vh;
}
.text-metiers {
    padding: 30px 10px;
  }
  .text-metiers p{
    text-align: justify;
  }

}