.ratio{
    margin-top: 33px;
    border-radius: 5px;
    max-height: 540px;
    margin-left: 10px;
}

.ratio-16\:9::before{
padding:0 !important;
height:700px !important;

}
.map-form{
margin: 10px !important;
}
.y-gap-20 > * {
padding-bottom: 9px !important;
}
.form-input textarea, .form-input input {
border: 1px solid var(--color-border);
border-radius: 4px;
padding: 0 15px;
padding-top: 25px;
min-height: 40px !important;
transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
width: 100%;
}
form {
border-radius: 5px !important;
}
.form-input label {
top: 20px !important;
}
/* .contact-container{
    margin-top: 239px!important;
} */



   
@media only screen and (max-width: 768px) {
    .ratio{
        margin: 1rem 0 0 0 ;
        border-radius: 5px;
        height: 30rem;
    } 
    .contact-details{
        margin:15px;
    }
    .contact-body{
        padding:0;

    }
    /* .contact-container{
        margin-top: 80px!important;
    } */
    .map-form{
        margin:0;
        }
        .map-form{
            padding-top: 5rem;
        }
       
        .contact-form {
            padding:0 !important;
            padding-right:0 !important; 
            text-align: center ! important;
        }
                                              
}
@media (max-width:)