@media screen and (max-width: 1024px) {
    #s_contact {
        flex-direction: column;
    }   
}
@media screen and (max-width: 768px) {
 .container_bento {
     display: flex;
     flex-wrap: wrap;
     margin-bottom: 50px;
 }
 .container_bento .bento_6, .bento_5 {
     display: none;
 }
 #certif_figure {
     display: none;
  }   
  #s_homepage .box_img_profile {
     width: 300px;
 }
 .container_compet {
     display: flex;
     flex-direction: column;
 }
 .box_nav_link{
     display: none;
 }
 .main_nav_hamb {
     display: block;
 }
 .title_special {
     font-size: 5rem;
 }
 section {
     padding: 50px;
  }  
  #main_footer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }
  #main_footer ul {
    margin-bottom: 50px;
  }
  #s_about .text {
    max-height: 250px;
    overflow-y: scroll;
  }
}



@media screen and (max-width: 475px) {
    .item_contact a{
        font-size: 1.1rem;

    }
    .list_contact {
        max-width: 100%;
    }
}

@media screen and (max-width: 428px) {
    #key_figure {
       display: none;
    }   
    #s_about {
        flex-direction: column;
     }   
     #s_about * {
         max-width: 100%;
         min-width: 100%;
     }
     #s_homepage .box_img_profile {
        width: 250px;
    }
    #s_homepage {
        border-radius: 0px;
        height: 50px;
        overflow: hidden;
    }
    #s_homepage .title_special {
        top: 50%;
    }
    #s_compet {
        border-radius: 0;
     }   
     .box_exp {
        min-width: 300px;
        height: 300px;
     }   
     .box_exp img {
        display: none;
     }
     #s_contact {
        border-radius: 0;
     }   
     .item_contact div {
        height: 35px;
        width: 35px;
        font-size: 30px;
     }   
     .title {
        font-size: var(--fs-h2);
     }   
     .title_special {
        font-size: 4rem;
        letter-spacing: 20px;
    }
    section {
        padding: 50px 15px;
     }   
     #side_nav {
        display: none;
     }   
   }
  @media screen and (max-width: 375px) {
    .title {
       font-size: var(--fs-h3);
    }   
   }

@media screen and (max-width: 320px) {
    .item_contact div {
        display: none;
    }
    .item_contact {
        margin-bottom: 25px;
    }
}