@media screen and (max-width:1200px){
    .container{
        width:100%;
        margin: auto;
        padding:0px 15px;
    }
    .desktop-nav .fa-bars{
        display:block;
        font-size:30px;
    }
    .nav-menu .fa-x{
        display:flex;
        position: absolute;
        top:30px;
        right:50px;
    }
    .desktop-nav .nav-menu{
       position:fixed;
       top:0;
       right:-100%;
       width:40%;
       height:100vh;
       background-color:white;
       flex-direction: column;
       z-index:10;
       transition: all ease 0.5s;
    }
    .nav-menu.active{
        right:0;
    }
    .about-container{
        width:100vw;
        flex-wrap: wrap;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: center;
        margin:15% 0px;
        padding: 0;
        
    }
    .about-me{
        text-align: center;
    }   
     .about-image img{
        width:50vw;
        margin-bottom:5%;
    }
    .personal-info h1{
        text-align: center;
    }
    .personal-table{
       justify-content: center;
    }
    .education-list-container .left-container{
        margin-left:8px;
    }
    .certificate .certificate-item{
        width:40%;
    }
    .certificate .container {
        margin-bottom: 8%;
    }
    .skill .container h1 {
        margin-bottom: 10%;
    }
    .project-items{
        grid-template-columns: auto;
        row-gap:50px;
    }
    .project .container{
        margin-top:10%;
        margin-bottom:10%;
    }
    .project .container h1{
        margin-top:15%;
        margin-bottom:10%;
    }
    .project .box img {
           width:600px;
    }
    .contact-box img{
       width:35vw;
    }
}

@media screen and (max-width:850px) {
    .container{
       width:100%;
       padding: 0px 20px;
       margin:auto;
       
   }
   .profile-image img{
    width:275px;
    height:275px;
   }
   .profile{
    flex-direction: column;
    justify-content: center;
    row-gap:20px;
    margin: auto;
    margin-top:5%;
   }
   .education-list{
    width:70%;
   }
   .education-list-container::after{
    left:5%;
   }
   .education-list-container .education-list::before{
    left:-11%
   }
   .education-list-container .left-container{
    border-radius:0px 25px 25px 0px;
    position: relative;
    left:7%;
    margin-left:40px;
    }
   .education-list-container .right-container{
    left:7%;
    border-radius: 0px 25px 25px 0px;
   }
   .certificate .certificate-item{
    width:50%;
   }
   .contact-list{
    flex-direction: column;
   }
   }

@media screen and (max-width:700px) {
    .container{
            width:100%;
            padding: 0px 20px;
            margin:auto
    }
    .personal-table{
        margin-left:20%;
        width:70%;
        gap:0;
        flex-direction: column;
        align-items:flex-start;
        justify-content:center;
    }
    .education-list-container::after{
        left:6%;
    }
   
    .education-list{
        width:80%;
       }
    .certificate .certificate-item{
        width:70%;
       }
       .education-list-container .education-list::before {
        left:-10%;
    }
}

@media screen and (max-width:500px) {
    .container{
        width:100%;
        padding:0px 15px;
        margin:auto;
    }
    .desktop-nav .nav-menu{
        width:75%;
    }
    .about-image img {
        width: 75vw;
        margin-bottom:5%;
    }
    .profile-content .role {
        font-size: 26px;
    }
    .fa-brands{
        display:block;
        margin-bottom:10%;
    }
 .project .box img {
        width:350px;
 }

 .contact-box{
    flex-direction: column;
    min-height:100vh;
    margin-bottom:4%;

 }
 .remove{
    display:none;
}
.skill-items{
    grid-template-columns:auto;
}
.fa-angles-right,.fa-angles-right:before {
    display: none;
}
.personal-table {
    width:100vw;
    justify-content:center;
    align-items:center;
}
.personal-table table tr {
    width:100vw;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom:15px;
}
td{
    margin-bottom:6px;
    margin-left:-50px;
}
td .fa-angles-down{
    display:block;
    color:var(--violet);
}

 .certificate .certificate-item{
    width:90%;
    padding:10px 12px;
   }
   .personal-table{
    justify-content: flex-start;
    align-items: flex-start;
    margin-left:2%;
   }
   .skill-list .skill-name{
    font-size:20px;
   }
   .education-list {
    width: 90%;
}
   .education-list-items .left-container{
    left:6%;
    margin-left:20px;
}
.education-list-items .right-container{
    left: 6%;
    margin-left: 20px;
}
 .education-list-container::after{
 left:2%;
}
.education-list-container h1 {
    font-size:22px;
}
.education-list > :nth-child(2) {
    font-size:20px;
}
.education-list > :nth-child(3) {
    font-size:16px;
}
.contact-list {
    gap:10px;
}
.contact-item-list p{
  font-size:16px;
}
.certificate .container {
    min-height: 80vh;
}
.container-footer p{
font-size:14px;
}
.contact-box img {
    width:50vw;
}
.certificate .certificate-item{
    margin-top:11%;
}
.project .container {
    min-height: 93vh;
}

}

@media screen and (max-width:400px){
  
    .container{
        width:100vw;
        padding:0px 5px;
        margin:auto;
    }
    .profile-image img {
        width: 200px;
        height: 200px;
    }
    .profile-content .role {
        font-size:20px;
    }
    .profile-content .name {
        font-size:35px;
    }
    .profile-button-container button {
        padding:15px 10px;
        margin: 5px;
        width: 42%;
        font-size:15px;
    }
    .education-list{
        width:85%;
        padding:10px 10px;
    }
    .education-list-items .left-container{
        left:7%;
    }
    .education-list-items .right-container{
        left:7%;
    }
     .education-list-container::after{
     left:4%;
    }
    .certificate-item h2{
     font-size:20px;
    }
    .about{
        width:100%;
    }
    .about-me .about-title {
        font-size:40px;
    }
    .about-me > :nth-child(2) {
        font-size:16px;
    }
    .certificate .certificate-item{
        width:90%;
    }
    .project .box img {
        width:300px;
    }
    .container-footer p {
        font-size: 12px;
    }
.education-list-container > p, h2, h1 {
    margin-bottom: 10px;
}
.education-list > :nth-child(2) {
    font-size:16px;
    font-weight: 800;
}
.education-list > :nth-child(3) {
    font-size: 14px;
    line-height:21px;
}
.overlay h3 {
    font-size: 26px;
}
.whatsapp{
    display:none;
}
}
@media  screen and (max-width:350px) {
    .education-list-container .education-list::before {
        left: -13%;
    }
    .about-title,.education-title,.certificate-name,.skill-title,.project-name,.contact-name{
        font-size:30px !important;
    }
    .about-me > :nth-child(2) {
        font-size: 15px;
    }
    .about-me > :nth-child(3) {
        font-size: 15px;
    }
    .personal-info-table1 td{
        padding-left:0;
    }
    .email{
        display: inline-block;
        margin-left:-20px;
    }
    .skill-items{
        grid-template-columns: auto;
    }
    .education-list-items .left-container{
        left:8%;
    }
    .education-list-items .right-container{
        left:8%;
    }
     .education-list-container::after{
     left:3%;
    }
}