@media(max-width:1200px){
    .about-img img {
        max-width: 28rem;
    } 
    .hero-img img {
        padding:0;
    }
}


@media(max-width:992px){
    
    .btn-custom-1 {
        padding: 15px 20px;
    }
    .btn-custom-2 {
        padding: 15px 20px;
    }
    h2 {
        padding: 10px 0;
        font-size: 28px;
    }
    /* hero section  */
    .hero-inner {
        padding: 4rem 0;
    }
    h1{
        font-size: 30px;
    }

    h1 span{
        font-size: 30px;
    }
    strong {
        font-size: 22px;
    }
    /* Resume======= */
    .resume-section h3 {
        padding: 20px 0;
    }
    .resume-section {
        padding: 70px 0 50px;
    }
    /* about section ========= */
    .about-me {
        padding: 60px 0;
    }
    .about-img img {
        max-width: 20rem;
    }
    .about-img {
        padding: 40px 0;
    }
    .inner-about {
        padding: 30px 0;
    }
    /* service section ========== */
    .service-section {
        padding: 60px 0;
    }
    .service-inner {
        padding: 30px;
    }

    /* Portfolio========== */
    .Portfolio {
        padding: 60px 0;
    }
    /* contact-section=========== */
    .contact-section {
        padding: 60px 0;
    }


}



@media(max-width:768px){

    /* hero section ======= */
    strong {
        font-size: 20px;
    }

    h1 {
        font-size: 22px;
        padding: 10px 0;
    }
    h1 span {
        font-size: 22px;
    }

    /* resume-section======== */
    .resume-section {
        padding: 50px 0;
    }
    .resume-section h3 {
        padding: 20px 0;
        text-align: center;
    }

    /* contact section =========== */
    form {
        max-width: 100%;
    }
    .form-coustom {
        padding: 30px;
    }



}


@media(max-width:576px){
    .btn-custom-2{
        display: inline-block;
        margin-top: 30px;
    }
    .nav-section .container {
        text-align: center;
        padding: 0 12px;
    }
    .container{
        text-align: center;
        padding: 20px ;
    }
    /* hero section ============ */

    .hero-section .icons {
        justify-content: center;
    }
    strong {
        font-size: 28px;
    }
    .hero-inner {
        padding: 4rem 0;
    }
    .hero-img img {
        padding-bottom: 20px;
    }

    /* resume-section======= */
    .resume-section h3 {
        padding: 20px 0;
        text-align: center;
    }

    /* about========= */
    .about-me {
        padding: 20px 0;
    }
    .about-img img {
        max-width: 18rem;
    }
    .service-section {
        padding: 20px 0;
    }
    .Portfolio {
        padding: 20px 0;
    }
    .contact-section {
        padding: 20px 0;
    }

}