/*##################################################################################################
################################             MEDIA QUERIES   MAX 768    ############################
###################################################################################################*/

@media(max-width: 768px)
{
    header{
        gap: 1rem;
        padding: 1rem 1rem;
    }

    header .logo{
        font-size: 1rem;
    }

    header .visit-btn{
        display: none;
    }

    .about-container{
        flex-direction: column;
    }

    .input-box input{
        padding: 1rem 2rem;
        font-size: 1.8rem;
    }

    .input input::placeholder{
        font-size: 1.5rem;
    }

    .input-box i{
        display: none;
    }

    .grid{
        grid-template-columns: repeat(1,1fr);
    }

    .experience-info img{
        width: 70vw;
    }
}

.qualifications{
    flex-direction: row;
}