/* ============================= SECTION FIRST ============================= */


.section-first {
    display: flex;
    flex-direction: column;
    height: 100vh;
    width: 100%;
    background: black;
}
.section-first .img-relative {
    display: flex;
    width: 100%;
    height: 100%;
    position: relative;
    background: black;
    opacity: 0.7;
}
.section-first .img-relative img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    position: absolute;
    z-index: 0;
    opacity: 1;
}

.section-first .content-details{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2vw 0vw 2vw 0vw;
}

.section-first .content-details span{
    font-size: 14px;
}

.section-first .content-details title {
    font-size: 3.5vw;
    font-weight: 500;
    text-align: center;
    color: white;
    display: flex;
    flex-direction: column;
    width: 80%;
    justify-content: center;
    align-items: center;
    z-index: 2;
    /*position: absolute;
    top: 15.542vw;*/
}

.section-first .content-details .content_category {
    margin: 1em;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.section-first .content-details .content_category h1{
    font-size: 14px;
    font-weight: 400;
    background-color: #DF951F;
    padding: 0.6613vw;
    border-radius: 0.6613vw;
}

.section-first .content-details .content_category .heure_texte{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: .5em;
}


/* ============================= SECTION SECOND ============================= */

.section-second{
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 2vw 50px 6vw 50px;
    gap: 4vw;
}

body section.section-second div.section-second-text.col-lg-9
p:nth-child(1) a strong,
body section.section-second div.section-second-text.col-lg-9
p:nth-child(1) a {
    font-size: 14px;
}

body section.section-second div.section-second-text.col-lg-9
p:nth-child(1) a strong,
body section.section-second div.section-second-text.col-lg-9
p:nth-child(1) a {
    font-size: 14px;
}

.section-second-text p, blockquote {
    font-size: 14px;
    justify-content: center;
    text-align: justify;
}

.section-second-text p strong{
    font-size: 15px;
    justify-content: center;
    text-align: justify;
}

.sharing_action{
    display: flex;
    flex-direction: column;
    align-self: start;
    gap: 1vw;
}

.sharing_action span{
    font-size: 15px;
    font-weight: 700;
}

.sharing_action .list-social{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1vw;
}

.sharing_action .list-social a{
    text-decoration: none;
    width: 40px;
    transition: all .5s ease-in-out;
}

.sharing_action .list-social img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .5s ease-in-out;
}


.sharing_action .list-social a img:hover,
.sharing_action .list-social a img:focus{
    filter: invert(14%) sepia(100%) saturate(700%) hue-rotate(190deg);
    transition: all .5s ease-in-out;
}

@media only screen  and (max-width: 850px) {
    /* ============================= SECTION FIRST ============================= */
        
        
    
  
h1, h1 strong {
    font-size: 6vw;
  }
  h2, h2 strong {
    font-size: 5vw;
  }
  h3, h3 strong {
    font-size: 5.5vw;
  }
  h4, h4 strong {
    font-size: 5vw;
  }
  h5, h5 strong {
    font-size: 4.75vw;
  }
  h6, h6 strong {
    font-size: 4.5vw;
  }
  p, a, a strong, span, li, li strong, ul, ul strong {
    font-size: 14px;
  }

    .section-first {
      height: 60vh;
      margin-bottom: 20px;
    }
    
    .section-first .content-details {
      position: absolute;
      top: 25vh;
      width: 100%;
    }

   .content_category h1{
        font-size: 14px !important;
        padding: 7px 15px 7px 15px !important;
        border-radius: 10px !important;
    }

    .section-first .content-details span{
        font-size: 13px;
    }
    
    /* ============================= SECTION SECOND ============================= */
    .section-second-text p, blockquote {
        font-size: 14px;
        line-height: 20px;
    }

    .sharing_action span{
        font-size: 15px;
        font-weight: 700;
    }

    .sharing_action .list-social a{
        text-decoration: none;
        width: 40px;
        transition: all .5s ease-in-out;
    }
    
}

@media only screen  and (max-width: 700px) {
    .section-second{
        display: flex;
        flex-direction: column;
    }
}
@media only screen  and (max-width: 500px) {
    /* ============================= SECTION FIRST ============================= */
    
    .section-first {
      height: 40vh;
    }
    
    .section-first .content-details {
      position: absolute;
      top: 15vh;
    }

    .section-first .content-details title {
        font-size: 17px;
    }
    
    /* ============================= SECTION SECOND ============================= */

    .section-second{
        display: flex;
        flex-direction: column;
    }
    .section-second-text p ,
    .section-second-text p a {
        font-size: 14px;
        line-height: 20px;
    }

    .sharing_action span{
        font-size: 15px;
        font-weight: 700;
    }

    .sharing_action .list-social a{
        width: 40px;
        height: 40px;
    }


    
}