:root {
    --bg-blue: #2d6df6;
    --bg-blue2: #0033a0;
    --bg-gray: #3c3c3e;
    --bg-yellow: #e3e829;
    --text: #53565a;
}

@font-face {
    font-family: "surasans";
    src:
        url("../fonts/surasans-regular.woff2") format("woff2"),
        url("../fonts/surasans-regular.woff") format("woff"),
        url("../fonts/surasans-regular.ttf") format("ttf");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "surasans";
    src:
        url("../fonts/surasans-seminegrita.woff2") format("woff2"),
        url("../fonts/surasans-seminegrita.woff") format("woff"),
        url("../fonts/surasans-seminegrita.ttf") format("ttf");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "surasans";
    src:
        url("../fonts/surasans-negrita.woff2") format("woff2"),
        url("../fonts/surasans-negrita.woff") format("woff"),
        url("../fonts/surasans-negrita.ttf") format("ttf");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

.points img {
    width: 49px;
    height: 49px;
}

div.col-12 > div.d-flex > div.flex-shrink-0 > img.img-fluid {
    width: 20px;
    height: 15px;
}

.col-11.offset-0.col-md-6.order-sm-1.order-lg-2 img {
    width: 636px;
    height: 365px;
}

.bg-gray {
    background: var(--bg-gray);
}

.bg-blue {
    background: var(--bg-blue);
}

.bg-black {
    background: var(--text);
}

body {
    color: var(--text);
    font-family: "surasans", sans-serif;
    max-width: 100%;
    overflow-x: hidden !important;
    background-color: white;
}

b {
    font-family: "surasans", sans-serif;
    font-weight: bold;
}

.form-control:focus-visible {
    text-shadow: none !important;
}

#overlay {
    display: none;
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #383838 repeat;
    z-index: 500;
}

#forms {
    z-index: 999;
    position: relative;
}

.small,
small {
    font-size: 0.575em;
}

.bottomRow {
    min-height: 2rem;
    background-color: var(--bg-blue);
    position: sticky;
    bottom: 0;
    z-index: 999;
    display: none;
}

.bottomRowIdx {
    min-height: 2rem;
    background-color: #0b1129;
    position: sticky;
    bottom: 0;
    z-index: 999;
    display: none;
}

.bottomfixed {
    min-height: 2rem;
    background-color: #0b1129;
    /* position: sticky; */
    bottom: 0;
    z-index: 999;
    display: none;
}

.btn-full {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    background: #0b1129;
    z-index: 999;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "surasans", sans-serif;
    font-weight: 700;
}

h3 span,
h4 span,
h5 span {
    color: var(--bg-yellow);
}

h1 {
    text-align: left;
    color: white;
    font-size: 1.8rem;
}

.main-image2 h1 {
    font-size: 1.2rem;
}
.main-image2 h3 {
    font-size: 0.9rem;
}
.main-image3 h3 {
    font-size: 0.9rem;
}
.main-image2 .yellow-form p {
    font-size: 1.1rem;
}

h1 span {
    color: var(--bg-yellow);
}

.descriptor {
    width: 100%;
    height: 100%;
    position: relative;
    top: 3rem;
}

.descriptor h2 {
    width: 60%;
    height: 95px;
    left: 49px;
    top: 4rem;
    position: absolute;
    color: #2d6df6;
    font-size: 18.5px;
    font-family: surasans, sans-serif;
    font-weight: 700;
    word-wrap: break-word;
}

.descriptor p {
    color: white;
    font-size: 1.5rem;
}

.line .descriptor .blue-form {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="190" height="110" viewBox="0 0 190 110" fill="none"><path d="M4.05363 29.4097C11.119 15.6597 28.8778 6.30207 58.2848 2.48263C82.727 -0.763902 107.36 -0.763902 131.802 2.48263C157.772 5.53818 175.531 13.368 184.315 25.3993C188.325 31.1285 190.235 37.0486 190.235 43.1597C190.426 56.1458 184.124 67.7951 174.767 73.1423C174.767 73.1423 174.194 73.3333 173.621 73.7153C167.893 76.7708 164.838 83.4548 166.174 89.7569L169.039 103.507C170.184 108.663 164.265 112.101 160.255 108.854L138.104 90.9028C135.049 88.4201 131.23 87.2743 127.219 87.6562C116.908 88.8021 105.833 89.184 94.5662 89.184C90.9381 89.184 86.5461 89.184 81.9632 88.993C40.526 87.8472 12.8376 77.5347 3.86267 60.1562C-1.29311 50.0347 -1.29311 39.5312 3.86267 29.4097" fill="%232D6DF6"/></svg>');
    height: 130px;
}
.line .descriptor .blue-form.invert {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="190" height="110" viewBox="0 0 190 110" fill="none"><path d="M186.181 29.4097C179.116 15.6597 161.357 6.30207 131.95 2.48263C107.508 -0.763902 82.8745 -0.763902 58.4322 2.48263C32.4624 5.53818 14.7036 13.368 5.91967 25.3993C1.90962 31.1285 7.28429e-05 37.0486 7.28429e-05 43.1597C-0.190882 56.1458 6.11063 67.7951 15.4674 73.1423C15.4674 73.1423 16.0403 73.3333 16.6131 73.7153C22.3418 76.7708 25.3971 83.4548 24.0604 89.7569L21.1961 103.507C20.0503 108.663 25.9699 112.101 29.98 108.854L52.1307 90.9028C55.186 88.4201 59.0051 87.2743 63.0152 87.6562C73.3267 88.8021 84.4021 89.184 95.6684 89.184C99.2966 89.184 103.689 89.184 108.271 88.993C149.709 87.8472 177.397 77.5347 186.372 60.1562C191.528 50.0347 191.528 39.5312 186.372 29.4097" fill="%232D6DF6"/></svg>');
    height: 130px;
}

.line .descriptor h2 {
    height: 95px;
    left: 0;
    top: 2.3rem;
    position: absolute;
    color: white;
    font-size: 18.5px;
    font-family: surasans, sans-serif;
    font-weight: 700;
    word-wrap: break-word;
    width: 47%;
}
.line .descriptor {
    top: 0;
}

.line .descriptor {
    top: 0;
}

h2 {
    color: white;
}

h2 span {
    color: var(--bg-yellow);
}

/* h2 span:nth-child(2) {
    color: white;
} */

h4 {
    font-weight: 700;
    color: var(--bg-blue);
    font-size: 1.8rem;
}

h5 {
    font-size: 1.2rem;
}

h6 {
    font-size: 1.6rem;
    color: var(--bg-blue2);
    font-weight: 400;
}

h6 span {
    font-weight: 700;
}

/* ul { */
/* list-style: none; */
/* Remove default bullets */
/* padding-left: 0rem; */
/* color: var(--bg-red); */
/* } */

ul li::marker {
    color: var(--bg-red);
}

ul li span {
    padding: 0;
    margin: 13px 0;
    font-size: 0.7rem;
    font-weight: normal;
    color: var(--text);
}

/* navbar */

/* nav {
    background: #fff;
    z-index: 999;
} */

a.navbar-brand {
    display: contents;
}

.navbar-toggler {
    border-color: var(--main-color);
    background: var(--main-color);
}

.logo {
    width: 185.36px;
    height: 64.33px;
}

.navbar-dark .navbar-nav .nav-link {
    font-weight: 700;
    color: white;
    font-size: 1.2rem;
    text-align: center;
    border-bottom: 1px #fff solid;
}

.navbar-dark .navbar-nav .nav-link:hover {
    font-weight: 500;
    /* color: var(--accent-color); */
    font-size: 1.2rem;
}

.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .show > .nav-link {
    color: var(--bg-yellow);
    border-bottom: none;
}

/* navbar */

/* main >>>>>>>>>>>> */

.form-floating > label {
    color: var(--text);
}

label small {
    color: white;
}
label small a {
    color: white;
    text-decoration: underline;
}
.legales {
    color: var(--bg-blue);
    text-decoration: none;
    text-align: center;
    color: #888b8d;
}

.legales a {
    color: var(--bg-blue);
    text-decoration: none;
    text-align: center;
    color: #888b8d;
}

.success {
    margin: auto;
    width: 90%;
    padding: 1rem;
    border-radius: 26px;
    background: var(--sec-color);
    box-shadow: 10px 13px 16px rgba(0, 0, 0, 0.21);
    color: white;
}

form,
.success {
    margin: auto;
    width: 100%;
    padding: 1rem;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0px 13px 17px rgba(0, 0, 0, 0.16);
    color: var(--bg-gray);
}

.success img {
    background: var(--bg-blue);
    border-radius: 50%;
}

.success img.mx-1 {
    background: transparent;
    border-radius: 0;
}

.form-control,
.input-group select.form-select {
    border-radius: 4rem;
}

form .form-title {
    font-size: 1.5rem;
    color: var(--bg-yellow);
    font-weight: 700;
    padding: 1rem;
    margin: 0.6rem 0;
}

.form-floating {
    color: #414042;
}

.navbar-nav .nav-item.btn .nav-link,
.btn.btn-form,
.btn-footer {
    border-radius: 3rem;
    background: var(--bg-yellow);
    color: black;
    font-size: 1.3rem;
    padding: 0.5rem 2rem;
    font-weight: 600;
}

.success .btn.btn-form {
    font-size: 1rem;
}

.btn-collapse.collapsed {
    background: white;
    border-radius: 0;
    border-bottom: solid 2px #cecece;
    padding: 0.5rem;
    color: var(--text);
    min-height: 7.5rem;
    font-size: 0.7rem;
    display: flex;
    align-content: center;
    justify-content: space-around;
    align-items: center;
}

.btn-collapse {
    background: var(--bg-red);
    border-radius: 0;
    border-bottom: 2px #cecece;
    padding: 0.5rem;
    color: white;
    /* min-height: 7.5rem; */
    font-size: 0.7rem;
    display: flex;
    align-content: center;
    justify-content: space-around;
    align-items: center;
    max-height: 5.5rem;
}

/* nav {
    background-color: var(--bg-blue);
} */

.main-image,
.main-image2,
.main-image3 {
    background-color: var(--bg-blue);
    padding: 4rem 0;
}

.main-image2 p,
.main-image3 p {
    font-size: 0.9rem;
    color: white;
}

.main-image2 .success p,
.main-image3 .success p {
    font-size: inherit;
    color: inherit;
}

.bullets p {
    color: white;
}

.top-img {
    position: relative;
    max-width: 70%;
    height: auto;
    /* pointer-events: none; */
}

.blue-form {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="330" height="192" viewBox="0 0 330 192" fill="none"><path d="M41.1864 16.6662C46.4407 14.4554 52.0339 12.2446 57.6271 11.0542C122.881 -3.57115 188.475 -2.21065 254.237 6.80264C265.424 8.3332 276.441 11.5644 287.119 15.8159C317.458 27.8903 330.17 47.2774 330.17 81.6299C330.17 105.949 323.729 123.125 308.983 135.029C300.847 141.662 297.288 152.376 299.322 162.75L303.051 180.436C304.915 189.279 294.746 195.571 287.627 189.789L257.627 165.3C251.695 160.369 243.898 158.328 236.271 159.178C212.712 162.069 188.814 162.069 164.915 162.409C158.305 162.409 151.695 162.579 144.915 162.409C109.831 161.219 74.9153 160.029 41.5254 146.594C12.7119 135.029 0 115.642 0 84.3509C0 47.9576 11.017 29.5909 41.1864 16.6662Z" fill="%23E3E829" /></svg>');
    background-repeat: no-repeat;
    width: 330.17px;
    height: 191.99px;
}

.blue-form p {
    color: white;
    font-size: 1.4rem;
}

/* .yellow-form:after {
    content: "";
    position: absolute;
    left: -10%;
    width: 100%;
    height: 175px;
    border-radius: 0px 107.5px 107.5px 0px;
    background: transparent;
    border: 6px solid var(--bg-yellow);
} */

.main-image3 .yellow-form h2 {
    color: white;
}

.yellow-form h2 {
    margin-top: 2rem;
    color: var(--bg-yellow);
}

.yellow-form p {
    color: white;
    font-size: 1.3rem;
}

form {
    background-color: var(--bg-blue2);
}

/* .collapsing {
    transition: none !important;
} */

.bullets-section p {
    color: var(--bg-blue2);
    font-size: 1.2rem;
    font-weight: 400;
}

.bullets-section p span {
    font-weight: 700;
}
/* 
.bullets-section-bg {
    background-image: url(../img/bg-points-blue.webp);
    background-repeat: no-repeat;
    background-size: cover;
} */

.bullets-section-bg .points {
    text-align: left;
    display: flex;
    align-items: center;
    font-size: 1.1rem;
    margin-bottom: 2rem;
    font-weight: 400;
    color: var(--bg-blue2);
}

.bullets-section-bg .points img {
    margin-right: 1.5rem;
}

.bullets-section-bg .points p {
    margin-bottom: 0;
}

.multi h5 {
    font-size: 2rem;
}

.multi h5 span {
    font-weight: 500;
    color: var(--bg-blue2);
}

.multi .h-cards {
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: var(--bg-blue);
    padding: 1.5rem 1.875rem;
    border-radius: 5px;
    box-shadow: 0px 0px 36px rgba(0, 0, 0, 0.16);
}

.multi .h-cards p {
    color: white;
    margin-bottom: 0;
    margin-left: 2.6rem;
    font-size: 0.8rem;
    /* padding: 1rem; */
}

.multi .h-cards img {
    width: 20%;
    max-width: 100%;
    border-radius: inherit;
}

.multi .row:nth-child(2) {
    justify-content: space-around;
    align-items: center;
}

/* .funciona {
    background: #0033a005;
} */

.funciona h5 {
    color: var(--bg-blue);
    font-size: 2rem;
    font-weight: 600;
}

.funciona p {
    font-weight: 600;
    color: #53565a;
    font-size: 1.3rem;
}

.funciona .line {
    background-image: linear-gradient(#0033a0, #0033a0);
    background-size: 30% 4px;
    background-repeat: no-repeat;
    background-position: center 25%;
}

.funciona .card {
    border-radius: 5px;
    background: #fff;
    box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.16);
    border: none;
    padding: 3rem;
}

.funciona .card p {
    color: var(--bg-blue);
    font-weight: 700;
    font-size: 1.3rem;
}

.funciona .card .flex-grow-1 p.text-start {
    color: var(--bg-blue2);
    font-size: 1.1rem;
    font-weight: 400;
}
.funciona .card .flex-grow-1 p.text-start.text-decoration-line-through {
    color: #888b8d;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-bg-type: #f7f8f9;
    color: #53565a;
}

tbody th {
    font-size: 1rem;
    font-weight: 400;
    text-align: center;
}

.table > :not(caption) > * > * {
    padding: 1rem 0.5rem;
    text-align: center;
    font-size: 0.8rem;
    vertical-align: middle;
}

.table thead tr {
    --bs-table-color: #212529;
}

.como {
    /* background-image: url(../img/bg-points-white.png); */
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #00aec7;
}

/* .como .yellow-form:after {
    content: "";
    position: absolute;
    left: -10%;
    width: 100%;
    height: 175px;
    border-radius: 0px 107.5px 107.5px 0px;
    background: transparent;
    border: 6px solid var(--bg-yellow);
} */

.como .yellow-form img {
    position: relative;
    z-index: 9;
}

.como .yellow-form p {
    font-size: 1.1rem;
    color: white;
}

.col-11.offset-0.col-md-6.order-sm-1.order-lg-2 img {
    width: 100%;
    height: auto;
}
td img.img-fluid {
    width: 1.3rem;
    height: 1.3rem;
}

@media (min-width: 600px) {
    .main-image3 h3 {
        font-size: 1rem;
    }
    .main-image3 .descriptor p {
        font-size: 1.3rem;
    }
    .main-image3 .descriptor h2 {
        font-size: 1.8rem;
        top: 2.7rem;
        width: 65.7%;
    }
    .funciona .line {
        background-image: linear-gradient(#0033a0, #0033a0);
        background-size: 11% 4px;
        background-repeat: no-repeat;
        background-position: center 30%;
    }
    .line .descriptor h2 {
        left: 2rem;
    }
    .descriptor {
        top: 0;
    }
    .descriptor h2 {
        font-size: 1.5rem;
        top: 3.5rem;
        width: 66%;
    }
    .col-11.offset-0.col-md-6.order-sm-1.order-lg-2 img {
        width: 100%;
        height: auto;
    }

    .table-striped > tbody > tr:nth-of-type(odd) > * {
        --bs-table-bg-type: #f7f8f9;
        color: #53565a;
    }

    tbody th {
        font-size: 1rem;
        font-weight: 400;
        text-align: center;
    }

    .table > :not(caption) > * > * {
        padding: 1rem 0.5rem;
        text-align: center;
        font-size: 1.3rem;
        vertical-align: middle;
    }

    .table thead tr {
        --bs-table-color: #212529;
    }

    .yellow-form h2 {
        font-size: 20px;
        width: 200px;
    }

    .yellow-form p {
        font-size: 1.2rem;
        width: 290px;
    }

    .como .yellow-form p {
        font-size: 1.6rem;
    }

    .top-img {
        bottom: -1rem;
        max-width: 280%;
        right: 112%;
    }

    .main-image2 .top-img {
        /* bottom: 0; */
        max-width: 110%;
        right: -8%;
        z-index: 9;
    }

    h1 {
        font-size: 1.7rem;
    }

    .main-image2 h1 {
        font-size: 1.8rem;
    }
    .main-image2 h3 {
        font-size: 0.9rem;
    }

    h1 {
        font-size: 2.1rem;
    }

    .blue-form h2 {
        font-size: 1.5rem;
    }

    .blue-form p {
        color: white;
        font-size: 1rem;
    }

    .navbar-nav .nav-item.btn .nav-link,
    .btn.btn-form,
    .btn-footer {
        font-size: 1.1rem;
    }

    .multi .h-cards img {
        width: -webkit-fill-available;
        max-width: 100%;
    }

    .funciona .card {
        padding: 2rem;
    }

    .main-image2 p {
        font-size: 18px;
    }

    .logo {
        width: 70%;
    }

    .navbar-dark .navbar-nav .nav-link {
        font-size: 1.2rem;
    }
    h3 {
        font-size: 1.4rem;
    }
    .main-image,
    .main-image2,
    .main-image3 {
        padding: 2rem 0;
    }
}

@media (min-width: 992px) {
    .como h4 {
        font-size: 2.3rem;
    }
    .main-image3 h3 {
        font-size: 1.8rem;
    }
    .funciona .line {
        background-image: linear-gradient(#0033a0, #0033a0);
        background-size: 30% 4px;
        background-repeat: no-repeat;
        background-position: center 25%;
    }
    .line .descriptor h2 {
        left: 0;
    }
    .main-image2 h3 {
        font-size: 1.8rem;
    }
    .multi .h-cards p {
        font-size: 1rem;
    }
    h3 {
        font-size: 1.75rem;
    }
    .descriptor {
        top: 3rem;
    }
    .descriptor h2 {
        width: 50%;
    }
    .main-image3 .descriptor h2 {
        width: 57%;
        top: 3.3rem;
        left: 31.7px;
    }
    .yellow-form h2 {
        font-size: 2rem;
        width: auto;
    }

    table {
        border-radius: 5px;
        background: #fff;
        box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.16);
    }

    .table-striped > tbody > tr:nth-of-type(odd) > * {
        --bs-table-bg-type: #f7f8f9;
        color: black;
        text-align: left;
        padding: 0.7rem 1.2rem;
        font-size: 1rem;
    }
    .table-striped > tbody > tr > th {
        padding: 0.7rem 1.2rem;
    }
    .table-striped > tbody > tr > td {
        padding: 0;
    }

    tbody th {
        font-size: 1rem;
        font-weight: 700;
        text-align: center;
    }

    .table > :not(caption) > * > * {
        padding: 1rem 3rem;
        text-align: left;
        font-size: 1rem;
        vertical-align: middle;
        color: black;
    }

    .table thead tr {
        --bs-table-color: #212529;
    }
    td img.img-fluid {
        width: 1.625rem;
        height: 1.625rem;
    }
    .table thead tr th {
        font-weight: bold;
    }

    .table-responsive {
        border: solid 1px #cbd5e1;
        border-radius: 0.5rem;
    }

    .table {
        margin-bottom: 0;
    }

    .navbar-dark .navbar-nav .nav-link {
        font-size: 1.2rem;
    }

    .main-image3 h1 {
        font-size: 2.7rem;
    }

    .main-image2 p {
        font-size: 1.7rem;
    }

    .funciona .card {
        padding: 3rem;
    }

    .yellow-form p {
        font-size: 1.2rem;
        width: 100%;
    }

    .main-image3 .yellow-form p {
        width: 90%;
    }

    .yellow-form:after {
        width: 50%;
    }

    .main-image3 .yellow-form:after {
        width: 55%;
    }

    .multi .h-cards img {
        width: 15%;
    }

    .navbar-nav .nav-item.btn .nav-link,
    .btn.btn-form,
    .btn-footer {
        font-size: 1.3rem;
    }

    .blue-form h2 {
        font-size: 2rem;
    }

    .blue-form p {
        font-size: 1.4rem;
    }

    h1 {
        font-size: 2.5rem;
    }

    .top-img {
        bottom: -50px;
        max-width: 300%;
        right: 170px;
        z-index: 999;
    }

    .main-image2 .top-img {
        max-width: 233%;
        right: 14%;
    }

    .main-image3 .top-img {
        max-width: 300%;
        right: 62%;
        bottom: 0;
    }

    .logo {
        width: 139.36px;
        height: 64.33px;
    }

    /* .yellow-form:after {
        height: 170px;
    } */

    .main-image2 h1 {
        font-size: 2.4rem;
    }
}

@media (min-width: 1440px) {
    .col-11.offset-0.col-md-6.order-sm-1.order-lg-2 img {
        width: 34.5625rem;
        height: 25.9375rem;
    }

    .main-image2 .top-img {
        max-width: 250.8%;
        right: 5%;
        top: -40px;
    }

    .main-image3 h1 {
        font-size: 3.4rem;
    }

    .main-image2 h1 {
        font-size: 3rem;
    }

    h1 {
        font-size: 2.8rem;
    }

    .main-image2 p {
        font-size: 2rem;
    }

    .yellow-form p {
        font-size: 1.5rem;
    }
    .main-image2 .yellow-form p {
        font-size: 1.7rem;
    }
    .main-image3 .descriptor p {
        font-size: 1.7rem;
    }
}

@media (min-width: 1920px) {
    /* .yellow-form:after {
        width: 54%;
    }

    .como .yellow-form:after {
        width: 90%;
    } */
}

@media (min-width: 2300px) {
    /* .yellow-form:after {
        width: 58%;
    }

    .como .yellow-form:after {
        width: 80%;
    } */
}

.nav-item {
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}