@media only screen and (max-width: 1200px){
    h2{
        font-size: clamp(2.5em, 2vw, 3.5em);
    }
    h3{
        font-size: clamp(1.8em, 2vw, 3.5em);
    }
}

@media only screen and (max-width: 991px){
    .form-box{
        flex-direction: column-reverse;
    }
}

@media only screen and (max-width: 768px){
    .content {
        padding: 15px 0;
    }
    .content .container {
        max-width: calc(100% - 140px);
        padding: 3em 50px;
    }
}

@media only screen and (max-width: 576px){
    .content {
        padding: 15px 0px 0px;
    }
    .content .container {
        max-width: calc(100% - 25px);
        padding: 2em 20px;
    }
    .btn, .form-control{
        height: 40px;
        border-radius: 20px;
    }
    .dot{
        width: 80%;
    }
    .header .logo {
        max-width: 200px;
    }
    .footer{
        padding: 1.5em 10px;
    }
}

@media only screen and (max-width: 400px){
    .dot{
        width: 110%;
    }
}