@charset "utf-8";
@import url("./vak4pqo.css");

/*
Description: Saywhat
Author: Agustín Ullmer
Version: 1.3
License: Creative Commons "Some rights reserved"
License URI: http://creativecommons.org/licenses/by-nc-nd/3.0/deed.es_ES
*/
/* reset */
html, html a {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}

html, body {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'sofia-pro-soft', sans-serif;
    font-size: 1.125rem;
    color: #666666;
    letter-spacing: normal;
}

ul, ol, li {
    list-style: none;
    margin: 0;
    padding: 0;
}

img, a img {
    border: none;
}

hr {
    margin: 0;
    padding: 0;
}

strong {
    font-weight: 500;
}

.fa, .fas {
    vertical-align: text-bottom;
}

::selection {
    background: #D6D6D6;
}

::-moz-selection {
    background: #D6D6D6;
}

/* margin */
.mt-5, .my-5 {
    margin-top: 146px !important;
}

.mt-4, .my-4 {
    margin-top: 98px !important;
}

.mt-3, .my-3 {
    margin-top: 63px !important;
}

.mt-2, .my-2 {
    margin-top: 26px !important;
}

.mt-1, .my-1 {
    margin-top: 3px !important;
}

.mt-1real, .my-1real {
    margin-top: 15px !important;
}

.mb-5, .my-5 {
    margin-bottom: 146px !important;
}

.mb-4, .my-4 {
    margin-bottom: 98px !important;
}

.mb-3, .my-3 {
    margin-bottom: 63px !important;
}

.mb-2, .my-2 {
    margin-bottom: 26px !important;
}

.mb-1, .my-1 {
    margin-bottom: 3px !important;
}

.mb-1real, .my-1real {
    margin-bottom: 15px !important;
}

.pt-5, .py-5 {
    padding-top: 146px !important;
}

.pt-4, .py-4 {
    padding-top: 98px !important;
}

.pt-3, .py-3 {
    padding-top: 63px !important;
}

.pt-2, .py-2 {
    padding-top: 26px !important;
}

.pt-1, .py-1 {
    padding-top: 3px !important;
}

.pt-1real, .py-1real {
    margin-bottom: 15px !important;
}

.pb-5, .py-5 {
    padding-bottom: 146px !important;
}

.pb-4, .py-4 {
    padding-bottom: 98px !important;
}

.pb-3, .py-3 {
    padding-bottom: 63px !important;
}

.pb-2, .py-2 {
    padding-bottom: 26px !important;
}

.pb-1, .py-1 {
    padding-bottom: 3px !important;
}

.pb-1real, .py-1real {
    margin-bottom: 15px !important;
}

.mr-sm-2, .mx-sm-2 {
    margin-right: 0 !important;
}

/* colors */
.morado-bg {
    background: #2C2A66;
}

.morado-co {
    color: #2C2A66;
}

.morado-CNPJ{
    padding-top:15px;
}

.morado-bor {
    border-top-color: #2C2A66;
}

.amarillo-bg {
    background: #FBDB6E;
}

.amarillo-co {
    color: #FBDB6E;
}

.amarillo-bor {
    border-top-color: #FBDB6E;
}

.celeste-bg {
    background: #30AED5;
}

.celeste-co {
    color: #30AED5;
}

.celeste-bor {
    border-top-color: #30AED5;
}

.gris75-bg {
    background: #666666;
}

.gris75-co {
    color: #666666;
}

.gris75-bor {
    border-top-color: #666666;
}

.gris50-bg {
    background: #D6D6D6;
}

.gris50-co {
    color: #D6D6D6;
}

.gris50-bor {
    border-top-color: #D6D6D6;
}

.gris25-bg {
    background: #FAFAFA;
}

.gris25-co {
    color: #FAFAFA;
}

.gris25-bor {
    border-top-color: #FAFAFA;
}

.blanco-bg {
    background: white;
}

.blanco-co {
    color: white;
}

.blanco-bor {
    border-top-color: white;
}

/* hierarchy */
h2 {
    font-size: 3rem;
    font-weight: 300;
    color: #30AED5;
    letter-spacing: normal;
    line-height: 48px;
    padding: 0;
    margin: 0;
}

h3 {
    font-size: 1.5rem;
    font-weight: 500;
    color: #30AED5;
    letter-spacing: normal;
    line-height: 32px;
    padding: 0;
    margin: 0;
}

h4 {
    font-size: 1.125rem;
    font-weight: 500;
    color: white;
    letter-spacing: normal;
    line-height: 27px;
    padding: 0;
    margin: 0;
}

h6 {
    font-size: 0.75rem;
    font-weight: 300;
    color: white;
    letter-spacing: normal;
    line-height: 16px;
    padding: 0;
    margin: 0;
}

p {
    font-size: 1.125rem;
    font-weight: 300;
    color: #666666;
    letter-spacing: normal;
    line-height: 24px;
    padding: 0;
    margin: 0;
}

/* Divisor */
hr {
    width: 70px;
    border-top: 3px solid;
    border-radius: 1.5px;
}

/* nav & buttons */
.navbar {
    padding: .5rem 0rem;
    height: 184px;
}

.navbar-brand {
    position: absolute;
    width: 10%;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    color: #30AED5;
}

.nav-link {
    padding: 0.6rem 1rem 0.625rem 0.9375rem;
    transition: color .3s ease-in-out;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: #30aed5;
}

.nav-link-repartidor {
    border-radius: 8px;
    border: solid 1px #30AED5;
    font-size: 1.125rem;
    font-weight: 500;
    letter-spacing: normal;
    line-height: 24px;
    margin-left: 0.9375rem;
}

.navbar-light .navbar-nav .nav-link-repartidor:focus {
    color: white;
    background-color: #30AED5;
    border-color: #30AED5;
}

.navbar-light .navbar-nav .nav-link-repartidor:hover {
    color: white;
}

.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
    color: #30aed5;
}

.btn-outline-primary:hover {
    color: white;
    background-color: #30AED5;
    border-color: #30AED5;
}

.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle {
    color: white;
    background-color: #30AED5;
    border-color: #30AED5;
}

.blog .navbar-light .navbar-nav .nav-link:focus, .blog .navbar-light .navbar-nav .nav-link:hover {
    color: #2686A3;
}

.blog .navbar-light .navbar-nav .active > .nav-link, .blog .navbar-light .navbar-nav .nav-link.active, .blog .navbar-light .navbar-nav .nav-link.show, .blog .navbar-light .navbar-nav .show > .nav-link {
    color: #2C2A66;
}

.blog .btn-outline-primary:hover {
    color: white !important;
    background-color: #30AED5;
    border-color: #30AED5;
}

.blog .btn-outline-primary:not(:disabled):not(.disabled).active, .blog .btn-outline-primary:not(:disabled):not(.disabled):active, .blog .show > .btn-outline-primary.dropdown-toggle {
    color: #30AED5;
    background-color: white;
    border-color: white;
}

.btn {
    transition: color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out;
}

.btn-group-lg > .btn, .btn-lg {
    height: 60px;
    padding: 0.6rem 1rem 1.125rem 1rem;
    font-size: 1.15rem;
    line-height: 1.5;
    border-radius: 8px;
}

.btn-primary {
    border-radius: 8px;
    background-color: #2C2A66;
    border-color: #2C2A66;
}

    .btn-primary:hover {
        background-color: #161533;
        border-color: #161533;
    }

    .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
        background-color: #161533;
        border-color: #161533;
    }

.botonUsuario:hover {
    background-color: #FBDB6E;
    border-color: black;
    color: black;
}

.btn-secondary {
    background-color: #30AED5;
    border-color: #30AED5;
}

    .btn-secondary:hover {
        background-color: #2686A3;
        border-color: #2686A3;
    }

    .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show > .btn-secondary.dropdown-toggle {
        background-color: #2686A3;
        border-color: #2686A3;
    }

/* animation */
.container-illustration {
    z-index: -1;
    margin-top: 200px;
    margin-bottom: -200px;
    -webkit-transform: translateY(-200px);
    -ms-transform: translateY(-200px);
    transform: translateY(-200px);
    position: relative;
    overflow: hidden;
    height: 350px;
}

.illustration {
    position: absolute;
    top: 0;
    right: -2508px;
    bottom: 0;
    left: 0;
    background: url('../assets/svg/illustration.svg');
    background-position: 0 0;
    background-repeat: repeat-x;
    background-size: auto 350px;
    -webkit-animation: moveGraphic 12s linear infinite;
    animation: moveGraphic 12s linear infinite;
}


h1 {
    font-size: 3rem;
    font-weight: 300;
    color: #30AED5;
    letter-spacing: normal;
    line-height: 48px;
    padding: 0;
    margin: 0;
}

@-webkit-keyframes moveGraphic {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(-2508px);
        transform: translateX(-2508px);
    }
}

@keyframes moveGraphic {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(-2508px);
        transform: translateX(-2508px);
    }
}

.cloud1 {
    width: auto;
    position: relative;
    top: 15px;
    left: -35%;
    -webkit-animation: moveCloud1 20s linear alternate infinite;
    animation: moveCloud1 20s linear alternate infinite;
}

@-webkit-keyframes moveCloud1 {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(-140px);
        transform: translateX(-140px);
    }
}

@keyframes moveCloud1 {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(-140px);
        transform: translateX(-140px);
    }
}

.cloud2 {
    width: auto;
    position: relative;
    top: 115px;
    right: 185%;
    -webkit-animation: moveCloud2 60s linear alternate infinite;
    animation: moveCloud2 40s linear alternate infinite;
}

@-webkit-keyframes moveCloud2 {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(200px);
        transform: translateX(200px);
    }
}

@keyframes moveCloud2 {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(200px);
        transform: translateX(200px);
    }
}

.moto {
    position: absolute;
    left: 18%;
    /*    bottom: -2%;*/
    -webkit-animation: moveMoto 20s linear alternate infinite;
    animation: moveMoto .1s linear alternate infinite;
}

@-webkit-keyframes moveMoto {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    to {
        -webkit-transform: translateX(140px);
        transform: translateX(140px);
        -webkit-transform: translateY(-1px);
        transform: translateY(-1px);
    }
}

@keyframes moveMoto {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    to {
        -webkit-transform: translateX(140px);
        transform: translateX(140px);
        -webkit-transform: translateY(-1px);
        transform: translateY(-1px);
    }
}

#moveVelocity1 {
    -webkit-animation: moveVelocity 20s linear alternate infinite;
    animation: moveVelocity .1s linear alternate infinite;
}

#moveVelocity2 {
    -webkit-animation: moveVelocity 20s linear alternate infinite;
    animation: moveVelocity .1s linear alternate-reverse infinite;
}

@-webkit-keyframes moveVelocity {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(2px);
        transform: translateX(2px);
    }
}

@keyframes moveVelocity {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    to {
        -webkit-transform: translateX(2px);
        transform: translateX(2px);
    }
}

/* image */
.image-repartidor {
    background: url('../assets/image/repartidor.png');
    background-image: -webkit-image-set(url('../assets/image/repartidor.png') 1x, url('../assets/image/repartidor@2x.png') 2x);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: auto;
}

.image-costos {
    background: url('../assets/image/costos.png');
    background-image: -webkit-image-set(url('../assets/image/costos.png') 1x, url('../assets/image/costos@2x.png') 2x);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: auto;
}

.image-ganancias {
    background: url('../assets/image/ganancias.png');
    background-image: -webkit-image-set(url('../assets/image/ganancias.png') 1x, url('../assets/image/ganancias@2x.png') 2x);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: auto;
}

.imagen-testimonio {
    object-fit: cover;
    width: 100%;
    height: 200px;
}

.amarillo-bg .svg {
    background: url('../assets/svg/ciudades.svg');
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: auto;
}

.morado-bg .svg {
    background: url('../assets/svg/restaurante.svg');
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
}

.celeste-bg .svg {
    background: url('../assets/svg/repartidor.svg');
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: auto;
}

.repartidor-bg {
    background: url(../assets/image/repartidor.png);
    background-image: -webkit-image-set(url(../assets/image/repartidor.png) 1x, url(../assets/image/repartidor@2x.png) 2x);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: auto;
    background-color: #30aed5;
}

    .repartidor-bg h2 {
        color: white;
    }

    .repartidor-bg p {
        color: white;
    }

    .repartidor-bg h3 {
        color: white;
    }

.sociorepartidor-bg {
    background: url(/Content/publica3/assets/image/repartidores.png);
    background-image: -webkit-image-set(url(/Content/publica3/assets/image/repartidores.png) 1x, url(/Content/publica3/assets/image/repartidores@2x.png) 2x);
    background-position: right;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #FBDB6E;
}

.blog-header {
    background: url('../assets/svg/blog-header.svg');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: auto;
}

/* slide */
.carousel-fade .carousel-item {
    transition-duration: 1.2s;
}

.carousel-indicators {
    bottom: 0;
}

    .carousel-indicators li {
        width: 12px;
        height: 12px;
        border-radius: 6px;
        background-color: #D6D6D6;
    }

    .carousel-indicators .active {
        background-color: #30AED5;
    }

/* footer */
.footer-link {
    color: white;
    padding: 0.375rem 0.9375rem 0.625rem 0;
    transition: color .3s ease-in-out;
}

    .footer-link:hover {
        color: #2C2A66;
        text-decoration: none;
    }

.footer-fix-1 {
    padding-top: 12px;
}

.social-link {
    color: white;
    padding: 0.375rem 0 0.625rem 0.9375rem;
    transition: color .3s ease-in-out;
}

    .social-link:hover {
        color: #2C2A66;
        text-decoration: none;
    }

.underline {
    text-decoration: underline;
}

.footer-hr {
    border-top: 1px solid white;
    width: 100%;
    border-radius: 0;
}

.stepwizard-step p {
    margin-top: 10px;
    font-weight: 500;
    color: white;
}

.stepwizard-row {
    display: table-row;
}

.stepwizard {
    display: table;
    width: 100%;
    position: relative;
}

.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: "";
    width: 100%;
    height: 3px;
    border-radius: 1.5px;
    background-color: white;
}

.stepwizard-step {
    display: table-cell;
    text-align: center;
    position: relative;
}

.btn-circle {
    width: 30px;
    height: 30px;
    color: #30AED5;
    text-align: center;
    padding: 1px 0;
    font-size: 1.125rem;
    border-radius: 15px;
}

/* Simulador */
.simulador {
    background: rgba(255,255,255,0.10);
    border-radius: 8px;
}

    .simulador form {
        border-top: 1px solid white;
        border-bottom: 1px solid white;
    }

    .simulador .col-form-label {
        font-size: 0.75rem;
        font-weight: 300;
        color: white;
    }

    .simulador .form-control {
        background: white;
        border: none;
        border-radius: 8px;
        color: #2C2A66;
        font-size: 0.875rem;
        font-weight: 500;
        height: auto;
    }

    .simulador .ganancias {
        border-left: 1px solid white;
        background-color: white;
        padding: 26px 0;
        border-top-right-radius: 8px;
        border-bottom-right-radius: 8px;
    }

    .simulador .form-group {
        margin-bottom: 0;
        padding: 0 15px;
    }

    .simulador .nav-link {
        padding: 0.15rem 0 0.5rem 0;
    }

    .simulador .nav-pills .nav-link {
        font-size: 1.875rem;
        text-align: center;
        color: white;
        border-right: 1px solid white;
        transition: all .3s ease-in-out;
    }

        .simulador .nav-pills .nav-link:first-child {
            border-radius: 0;
            border-top-left-radius: 8px;
            border-right: 1px solid white;
            border-top: 1px solid white;
            border-left: 1px solid white;
        }

        .simulador .nav-pills .nav-link:last-child {
            border-radius: 0;
            border-bottom-left-radius: 8px;
            border-bottom: 1px solid white;
            border-left: 1px solid white;
        }

        .simulador .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
            background-color: white;
            color: #2C2A66;
        }

/* Cotizador */
.cotizador {
    background: rgba(255,255,255,0.10);
    border-radius: 8px;
}

    .cotizador form {
        border-top: 1px solid white;
        border-bottom: 1px solid white;
    }

    .cotizador .col-form-label {
        font-size: 0.75rem;
        font-weight: 300;
        color: white;
    }

    .cotizador .form-control {
        background: white;
        border: none;
        border-radius: 8px;
        color: #2C2A66;
        font-size: 0.875rem;
        font-weight: 500;
        height: auto;
    }

    .cotizador .ganancias {
        border-left: 1px solid white;
        background-color: white;
        padding: 74px 0;
        border-top-right-radius: 8px;
        border-bottom-right-radius: 8px;
    }

    .cotizador .form-group {
        margin-bottom: 0;
        padding: 0 15px;
    }

    .cotizador .nav-link {
        padding: 1.65rem 0 2rem 0;
    }

    .cotizador .nav-pills .nav-link {
        font-size: 1.875rem;
        text-align: center;
        color: white;
        border-right: 1px solid white;
        transition: all .3s ease-in-out;
    }

        .cotizador .nav-pills .nav-link:first-child {
            border-radius: 0;
            border-top-left-radius: 8px;
            border-right: 1px solid white;
            border-top: 1px solid white;
            border-left: 1px solid white;
        }

        .cotizador .nav-pills .nav-link:last-child {
            border-radius: 0;
            border-bottom-left-radius: 8px;
            border-bottom: 1px solid white;
            border-left: 1px solid white;
        }

        .cotizador .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
            background-color: white;
            color: #2C2A66;
        }

/* blog */
.card {
    border: none;
    border-radius: 8px;
}

.card-img-top {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.badge {
    font-size: 0.75rem;
    font-weight: 500;
    padding: .3em .8em;
    line-height: normal;
    border-radius: 8px;
}

.badge-primary {
    color: #2C2A66;
    background-color: #D6D6D6;
    padding: 0.3125rem 0.625rem;
    transition: color .3s ease-in-out,background-color .3s ease-in-out;
}

    .badge-primary[href]:focus, .badge-primary[href]:hover {
        color: white;
        background-color: #666666;
        transition: color .3s ease-in-out,background-color .3s ease-in-out;
    }

.page-link {
    color: #30AED5;
    line-height: normal;
    border: 1px solid #D6D6D6;
}

    .page-link:hover {
        background-color: white;
        border: 1px solid #30AED5;
        color: #30AED5;
    }

.page-numbers:hover {
    text-decoration: none !important;
}

.page-item.disabled .page-link {
    color: #666666;
    border: 1px solid #D6D6D6;
}

.page-item:first-child .page-link {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.page-item:last-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.page-item.active .page-link {
    background-color: #30AED5;
    border: 1px solid #D6D6D6;
}

.current .page-link {
    background-color: #30AED5;
    border: 1px solid #30AED5;
    color: white;
}

.next.page-numbers.page-link {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.prev.page-numbers.page-link {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.next.page-numbers.page-link, .prev.page-numbers.page-link {
    line-height: 19px;
}

.badge-primary.active {
    color: #D6D6D6;
    background-color: #2C2A66;
}

/* Ayuda */
.accordion .card {
    background-color: transparent;
}

.accordion .card-header {
    padding: 0;
    background-color: transparent;
    border-bottom: none;
}

.accordion .btn {
    padding: 0;
    font-size: 1.125rem;
    font-weight: 500;
    color: #30AED5;
}

    .accordion .btn:hover {
        text-decoration: none;
    }

.ayuda {
    border-left: 1px solid #D6D6D6;
    height: 100%;
    width: 1px;
    border-radius: 0;
    border-top: none;
}

.form-blog {
    background: rgba(255,255,255,0.10);
    border: 4px solid black;
    border-radius: 8px;
    padding: 15px;
    margin-top: 2em;
}

    .form-blog .form-control {
        font-size: 1.125rem;
    }

        .form-blog .form-control:focus {
            color: #2C2A66;
        }

    .form-blog ::placeholder {
        color: #2C2A66;
    }

    .form-blog ::-webkit-input-placeholder {
        color: #2C2A66;
    }

    .form-blog ::-moz-placeholder {
        color: #2C2A66;
    }

    .form-blog ::-ms-input-placeholder {
        color: #2C2A66;
    }

    .form-blog input {
        background: white;
        border: none;
        border-radius: 8px;
        color: #2C2A66;
        font-weight: 300;
        height: 40px;
    }

    .form-blog select {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        background: white;
        border: none;
        border-radius: 8px;
        color: #2C2A66;
        font-weight: 300;
        height: 40px;
        background-image: url('../assets/svg/caret-down.svg');
        background-position: center right .75rem;
        background-repeat: no-repeat;
        background-size: auto;
    }

select.form-control:not([size]):not([multiple]) {
    height: 40px;
}

.form-blog textarea {
    background: white;
    border: none;
    border-radius: 8px;
    color: #2C2A66;
    font-weight: 300;
    resize: none;
}

img.imagenBanner {
    width: 100%;
    height: 200px;
    object-fit: contain;
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    body, p {
        font-size: 1rem;
    }

    h2 {
        font-size: 2.5rem;
    }

    h3 {
        font-size: 1.25rem;
    }

    h6 {
        font-size: 0.75rem;
    }

    .navbar {
        z-index: 1;
    }

    .navbar-brand {
        width: 30%;
    }

    .icon-bar {
        width: 30px;
        height: 3px;
        background-color: #30AED5;
        display: block;
        margin-bottom: 5px;
        border-radius: 1.5px;
        transition: transform .3s ease-in-out;
    }

        .icon-bar:last-child {
            margin-bottom: 0px;
        }

    .repartidor .icon-bar {
        background-color: #2C2A66;
    }

    .navbar-toggler {
        border: none;
        background: transparent !important;
        padding: 0;
        margin: 0;
        border-radius: 0;
    }

        .navbar-toggler .top-bar {
            transform: rotate(45deg);
            transform-origin: 10% 10%;
        }

        .navbar-toggler .middle-bar {
            opacity: 0;
        }

        .navbar-toggler .bottom-bar {
            transform: rotate(-45deg);
            transform-origin: 10% 90%;
        }

        .navbar-toggler.collapsed .top-bar {
            transform: rotate(0);
        }

        .navbar-toggler.collapsed .middle-bar {
            opacity: 1;
        }

        .navbar-toggler.collapsed .bottom-bar {
            transform: rotate(0);
        }

    .navbar-collapse {
        position: fixed;
        background: #FBDB6E;
        padding: 50% 15%;
        text-align: center;
        width: 100%;
        margin: 0;
        top: 0;
        left: 0;
        height: 100%;
        z-index: -1;
    }

    .cloud1 {
        width: auto;
        top: -10px;
        left: 50%;
    }

    .cloud2 {
        width: auto;
        top: 0px;
        left: 10%;
    }

    .image-ganancias, .image-costos, .image-repartidor {
        background-size: 100%;
        background-position: bottom center;
    }

    .svg-ciudades, .svg-restaurante, .svg-repartidor {
        background: none;
    }

    .cotizador .nav-link {
        padding: 2.79rem 0 3rem 0;
    }

    .simulador .nav-link {
        padding: 0.73rem 0 1rem 0;
    }

    .accordion .btn {
        white-space: normal;
        text-align: left;
    }

    .ayuda {
        border-top: 1px solid #D6D6D6;
        width: 100%;
        border-radius: 0;
        border-left: none;
    }

    .sm-mt-5 {
        margin-top: 146px !important;
    }

    .sm-mt-4 {
        margin-top: 98px !important;
    }

    .sm-mt-3 {
        margin-top: 63px !important;
    }

    .sm-mt-2 {
        margin-top: 26px !important;
    }

    .sm-mt-1 {
        margin-top: 3px !important;
    }

    .sm-text-center {
        text-align: center !important;
    }

    .footer-fix-1 {
        padding-top: 0;
        text-align: center !important;
    }

    .fix-mt1 {
        margin-top: 30px;
    }

    .fix-mt2 {
        margin-top: 0px !important;
    }

    .fix-mb1 {
        margin-bottom: 30px;
    }
}

/*  Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
    body, p {
        font-size: 1rem;
    }

    h2 {
        font-size: 2.5rem;
    }

    h3 {
        font-size: 1.25rem;
    }

    h6 {
        font-size: 0.75rem;
    }

    .navbar {
        z-index: 1;
    }

    .navbar-brand {
        width: 30%;
    }

    .icon-bar {
        width: 30px;
        height: 3px;
        background-color: #30AED5;
        display: block;
        margin-bottom: 5px;
        border-radius: 1.5px;
        transition: transform .3s ease-in-out;
    }

        .icon-bar:last-child {
            margin-bottom: 0px;
        }

    .repartidor .icon-bar {
        background-color: #2C2A66;
    }

    .navbar-toggler {
        border: none;
        background: transparent !important;
        padding: 0;
        margin: 0;
        border-radius: 0;
        top: 0;
        left: 110px;
    }

    .collapsed {
        position: initial !important;
    }

    .navbar-toggler {
        position: absolute;
        border: none;
        background: transparent !important;
        padding: 0;
        margin: 0;
        border-radius: 0;
        top: 0;
        left: 110px;
    }

        .navbar-toggler .top-bar {
            transform: rotate(45deg);
            transform-origin: 10% 10%;
        }

        .navbar-toggler .middle-bar {
            opacity: 0;
        }

        .navbar-toggler .bottom-bar {
            transform: rotate(-45deg);
            transform-origin: 10% 90%;
        }

        .navbar-toggler.collapsed .top-bar {
            transform: rotate(0);
        }

        .navbar-toggler.collapsed .middle-bar {
            opacity: 1;
        }

        .navbar-toggler.collapsed .bottom-bar {
            transform: rotate(0);
        }

    .navbar-collapse {
        position: absolute;
        background: #FBDB6E;
        padding: 10% 0% 100%;
        text-align: center;
        width: 50%;
        margin: 0px;
        top: -30px;
        left: -110px;
        z-index: -1;
        overflow-x: hidden;
    }

    .cloud1 {
        width: auto;
        top: -10px;
        left: 70%;
    }

    .cloud2 {
        width: auto;
        top: -20px;
        left: 550%;
    }

    .moto {
        top: 912px;
        left: 25%;
    }

    .image-ganancias, .image-costos, .image-repartidor {
        background-size: 100%;
        background-position: bottom center;
    }

    .svg-ciudades, .svg-restaurante, .svg-repartidor {
        background-size: 100%;
        background-position: bottom center;
    }

    .sm-mt-5 {
        margin-top: 146px !important;
    }

    .sm-mt-4 {
        margin-top: 98px !important;
    }

    .sm-mt-3 {
        margin-top: 63px !important;
    }

    .sm-mt-2 {
        margin-top: 26px !important;
    }

    .sm-mt-1 {
        margin-top: 3px !important;
    }

    .sm-text-center {
        text-align: center !important;
    }

    .footer-fix-1 {
        padding-top: 0;
        text-align: center !important;
    }

    .fix-mt1 {
        margin-top: 30px;
    }

    .fix-mt2 {
        margin-top: 0px !important;
    }

    .fix-mb1 {
        margin-bottom: 30px;
    }
}

/*  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .navbar {
        z-index: 1;
    }

    .navbar-brand {
        width: 30%;
    }

    .icon-bar {
        width: 30px;
        height: 3px;
        background-color: #30AED5;
        display: block;
        margin-bottom: 5px;
        border-radius: 1.5px;
        transition: transform .3s ease-in-out;
    }

        .icon-bar:last-child {
            margin-bottom: 0px;
        }

    .repartidor .icon-bar {
        background-color: #2C2A66;
    }

    .navbar-toggler {
        border: none;
        background: transparent !important;
        padding: 0;
        margin: 0;
        border-radius: 0;
        top: 0;
        left: 110px;
    }

    .collapsed {
        position: initial !important;
    }

    .navbar-toggler {
        position: absolute;
        border: none;
        background: transparent !important;
        padding: 0;
        margin: 0;
        border-radius: 0;
        top: 0;
        left: 110px;
    }

        .navbar-toggler .top-bar {
            transform: rotate(45deg);
            transform-origin: 10% 10%;
        }

        .navbar-toggler .middle-bar {
            opacity: 0;
        }

        .navbar-toggler .bottom-bar {
            transform: rotate(-45deg);
            transform-origin: 10% 90%;
        }

        .navbar-toggler.collapsed .top-bar {
            transform: rotate(0);
        }

        .navbar-toggler.collapsed .middle-bar {
            opacity: 1;
        }

        .navbar-toggler.collapsed .bottom-bar {
            transform: rotate(0);
        }

    .navbar-collapse {
        position: absolute;
        background: #FBDB6E;
        padding: 10% 0% 100%;
        text-align: center;
        width: 50%;
        margin: 0px;
        top: -30px;
        left: -110px;
        z-index: -1;
        overflow-x: hidden;
    }

    .cloud1 {
        width: auto;
        top: -10px;
        left: 50%;
    }

    .cloud2 {
        width: auto;
        top: 10px;
        left: 550%;
    }

    .moto {
        top: 914px;
        left: 20%;
    }

    .ayuda {
        border-top: 1px solid #D6D6D6;
        width: 100%;
        border-radius: 0;
        border-left: none;
    }

    .image-repartidor, .image-costos, .image-ganancias {
        background-size: 80%;
        background-position: bottom right;
    }

    .svg-ciudades, .svg-restaurante, .svg-repartidor {
        background-size: 70%;
    }

    .fixmd-mt1 {
        margin-top: 30px;
    }
}