@media screen and (max-width: 600px) {
    .front_page {
        height: 60vh !important;
    }

    .front_page_container div {
        width: 100% !important;
        text-align: center;
        display: flex;
        align-items: center;
        flex-direction: column;
    }

    .welcome {
        margin: 60px 0 !important;
    }

    .welcome p {
        width: 90% !important;
        font-size: 16px !important;
    }

    .benefits .container {
        padding: 0 2rem !important;
    }

    .benefits .row {
        flex-direction: column;
    }

    .benefits .card_2 {
        margin: 20px 0;
    }

    .benefits .column {
        width: 100% !important;
        height: 15rem !important;
    }

    .mission_vision .container {
        width: 90%;
    }

    .card_5 {
        margin-bottom: 20px;
    }

    .mission_vision .col-md-5 {
        height: 23rem !important;
    }

    .mission_vision {
        margin-bottom: 100px !important;
    }

    .request_drive {
        height: 230px !important;
    }

    .request_drive .container-fluid div {
        flex-direction: column !important;
        align-items: center;
        text-align: center;
    }

    .request_drive h3 {
        margin-bottom: 25px;
    }

    .contact .col-md-7, .contact .col-md-5 {
        padding: 10px !important;
    }

    .city_img {
        height: 200px !important;
    }

    .mapouter {
        width: 100% !important;
    }

    .gmap_canvas {
        width: 100% !important;
    }
}

body {
    overflow-x: hidden;
}

.front_page {
    width: 100%;
    height: 550px;
    background-image: url(https://previews.123rf.com/images/azatvaleev/azatvaleev2002/azatvaleev200200008/139332398-concepto-de-aplicaci%C3%B3n-de-servicio-de-pedido-de-taxis-tel%C3%A9fono-inteligente-de-mano-con-direcci%C3%B3n-de.jpg);
    background-size: cover;
    background-position-y: center;
}

.front_page_container {
    background-color: rgba(0, 0, 0, 0.7);
    height: 100%;
    color: white;
}

.front_page_container div {
    width: 70%;
}

.title {
    font-size: 50px;
}

.welcome {
    margin: 80px 0;
}

.welcome p {
    width: 60%;
    font-size: 18px;
}

.request_service_btn {
    width: 300px;
    height: 50px;
    font-size: 18px;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid white;
}

.request_service_btn_2 {
    border: 1px solid black;
}

.request_service_btn_3 {
    background: #c8b501;
    font-weight: 500;
    border: none !important;
}

.benefits .column {
    width: 30%;
    height: 28rem;
    padding: 0;
}

.card_1 {
    background-image: url(https://www.tax-individual.com.co/wp-content/uploads/2019/10/liderazgo.jpg);
}

.card_2 {
    background-image: url(https://previews.123rf.com/images/dolgachov/dolgachov1309/dolgachov130901408/22380920-transportation-and-vehicle-concept-businessman-or-taxi-driver-driving-a-car.jpg);
}

.card_3 {
    background-image: url(https://i0.wp.com/www.elmercurio.com.ec/wp-content/uploads/2020/08/1-3A-4-coles-xca-1.jpg?fit=1024%2C683&ssl=1);
}

.card_5 {
    background-image: url(https://images.assetsdelivery.com/compings_v2/levstudio/levstudio2103/levstudio210300079.jpg);
}

.card_6 {
    background-image: url(https://img.freepik.com/fotos-premium/chica-asomandose-ventana-taxi-barcelona-mujer-sonriente-mirando-ciudad-emocion-caucasica-boina-cuero-pelo-largo-recto-chaqueta-rosa-palido_873789-12.jpg);
}

.column {
    background-size: cover;
    background-position: center;
}

.column div {
    background-color: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    color: white;
    padding: 35px;
}

.mission_vision {
    margin-bottom: 130px;
}

.mission_vision .col-md-5 {
    height: 25rem;
}

.request_drive {
    height: 180px;
    background-image: url(https://images.pexels.com/photos/63324/california-road-highway-mountains-63324.jpeg?cs=srgb&dl=pexels-pixabay-63324.jpg&fm=jpg);
    background-size: cover;
    background-position: bottom;
}

.request_drive .container-fluid {
    background: rgba(0, 0, 0, 0.5);
}

.request_drive .container-fluid div {
    width: 80%;
}

.contact {
    padding-bottom: 50px;
}

.locate_btn {
    padding: 15px 13px;
}

.city_img {
    height: 250px;
}

.mapouter {
    width: 99%;
    height: 100%;
    text-align: right;
    position: relative;
}

.gmap_canvas {
    width: 99%;
    height: 100%;
    background: none !important;
    overflow: hidden;
}