﻿@import url("https://fonts.googleapis.com/css2?family=Arimo:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap");

:root {
    --dark-color: #374151;
    --dark-gray-color: #6b7280;
    --gray-color: #e5ebee;
    --yellow-color: #f59e0b;
    --red-color: #ef4444;
    --blue-color: #3b82f6;
    --dark-blue: #18478c;
    --badge-bg: #2a80f7;
    --viewport-sm: 640px;
    --viewport-md: 768px;
    --viewport-lg: 1024px;
    --viewport-xl: 1280px;
    --max-viewport-sm: 640px;
    --max-viewport-md: 768px;
    --max-viewport-lg: 1024px;
    --max-viewport-xl: 1280px;
    /* Colors */
    --white: #ffffff;
    --light-gray: #fafafa;
    --charcoal: #384047;
    --gray: #e8eeef;
    --blue-gray: #8a97a0;
    --green: #4bc970;
    --dark-green: #35a556;
    --blue: #55b6d0;
    --soycash-blue: #4a8af0;
    --soycash-gray-text: #6f6f6f;
    --soycash-green-badge: #37c75a;
    --soycash-gray-bold-text: #52575a;
    --soycash-gray-form-control: #495057;
}

html, body, form {
    height: 100%;
}

.sitio {
    margin-top: 45px;
}

body {
    font-family: "Roboto";
}

#sidenav {
    display: none;
}

    #sidenav > nav > ul {
        overflow-y: auto;
    }

    #sidenav.active {
        display: block;
    }

.inset-0 {
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
}

.inset-x-0 {
    left: 0px;
    right: 0px;
}

.inset-y-0 {
    top: 0px;
    bottom: 0px;
}

.top-0 {
    top: 0px;
}

.right-0 {
    right: 0px;
}

.bottom-0 {
    bottom: 0px;
}

.left-0 {
    left: 0px;
}

.h-100vh {
    height: 100vh;
}

.min-h-100vh {
    min-height: 100vh;
}

.w-4 {
    width: 1rem;
}

.h-4 {
    height: 1rem;
}

.w-5 {
    width: 1.25rem;
}

.h-5 {
    height: 1.25rem;
}

.w-6 {
    width: 1.5rem;
}

.h-6 {
    height: 1.5rem;
}

.w-8 {
    width: 2rem;
}

.h-8 {
    height: 2rem;
}

.w-64 {
    width: 16rem;
}

.h-16 {
    height: 4rem;
}

@media screen and (min-width: 768px) {
    .-mr-6 {
        margin-right: -1.5rem;
    }
}

@media screen and (min-width: 768px) {
    .-ml-6 {
        margin-left: -1.5rem;
    }
}

.p-64 {
    padding: 16rem;
}

.pt-64 {
    padding-top: 16rem;
}

.pr-64 {
    padding-right: 16rem;
}

.pb-64 {
    padding-bottom: 16rem;
}

.pl-64 {
    padding-left: 16rem;
}

.lg\:pl-64 {
    padding-left: 0 !important;
}

.border-2 {
    border-width: 2px;
}

.border-solid {
    border-style: solid;
}

.border-color {
    border-color: var(--gray-color);
}

.border-b-2 {
    border-bottom: 2px solid var(--gray-color);
}

.font-thin {
    font-weight: 100;
}

.font-extralight {
    font-weight: 200;
}

.font-light {
    font-weight: 300;
}

.font-normal {
    font-weight: 400;
}

.font-medium {
    font-weight: 500;
}

.font-semibold {
    font-weight: 600;
}

.font-bold {
    font-weight: 700;
}

.font-extrabold {
    font-weight: 800;
}

.font-black {
    font-weight: 900;
}

.text-xs {
    font-size: 0.75rem;
    line-height: 1rem;
}

.text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
}

.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
}

.text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
}

.text-5xl {
    font-size: 3rem;
    line-height: 1;
}

.text-6xl {
    font-size: 3.75rem;
    line-height: 1;
}

.text-7xl {
    font-size: 4.5rem;
    line-height: 1;
}

.text-8xl {
    font-size: 6rem;
    line-height: 1;
}

.text-9xl {
    font-size: 8rem;
    line-height: 1;
}

ul {
    list-style: none;
    padding: 0;
}

.text-new-dark {
    color: var(--dark-color);
}

.bg-new-dark {
    background-color: var(--dark-color);
}

.text-new-dark-gray {
    color: var(--dark-gray-color);
}

.bg-new-dark-gray {
    background-color: var(--dark-gray-color);
}

.text-new-gray {
    color: var(--gray-color);
}

.bg-new-gray {
    background-color: var(--gray-color);
}

.text-new-yellow {
    color: var(--yellow-color);
}

.bg-new-yellow {
    background-color: var(--yellow-color);
}

.text-new-red {
    color: var(--red-color);
}

.bg-new-red {
    background-color: var(--red-color);
}

.text-new-blue {
    color: var(--blue-color);
}

.bg-new-blue {
    background-color: var(--blue-color);
}

.text-new-dark-blue {
    color: var(--dark-blue);
}

.bg-new-dark-blue {
    background-color: var(--dark-blue);
}

.bg-badge {
    background-color: var(--badge-bg);
}

.shadow-xs {
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.025) !important;
}

.shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

.shadow {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}

.shadow-md {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}

.shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

.shadow-xl {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
}

.shadow-2xl {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
}

.shadow-inner {
    box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06) !important;
}

.shadow-outline {
    box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5) !important;
}

.shadow-none {
    box-shadow: none !important;
}

.z-0 {
    z-index: 0;
}

.z-1000 {
    z-index: 1000;
}

.z-2000 {
    z-index: 2000;
}

.z-3000 {
    z-index: 3000;
}

.z-4000 {
    z-index: 4000;
}

.z-5000 {
    z-index: 5000;
}

.auth {
    /*background-image: url("../Images/background.png");*/
    background-size: cover;
    background-repeat: no-repeat;
}

.icon-warning {
    width: 1rem;
    height: auto;
}

.icon {
    width: 1.5rem;
    height: 1.5rem;
}

.link {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 0.2rem;
    color: white;
    text-decoration: none;
}

    .link.dropdown::after {
        content: "";
        display: inline-block;
        margin-left: auto;
        border-top: 0.3rem solid;
        border-right: 0.3rem solid transparent;
        border-bottom: 0;
        border-left: 0.3rem solid transparent;
        vertical-align: 0.255rem;
    }

    .link.dropdown:hover::after {
        color: white;
    }

    .link:hover,
    .link-dropdown-menu > li > a:hover {
        background-color: #163e78;
        text-decoration: none;
    }

    .link > img,
    .link-dropdown-menu > li > a > img {
        width: 1rem;
        height: 1rem;
        margin-right: 0.5rem;
        filter: invert(1);
    }

    .link > span {
        font-weight: 500;
        color: white;
    }

.link-dropdown-menu > li > a {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.5rem 0.5rem 2.125rem;
    font-weight: 500;
    font-size: 0.8324rem;
    color: white;
    text-decoration: none;
}

@media screen and (min-width: 992px) {
    .lg\:pl-64 {
        padding-left: 16rem !important;
    }
}

.bg-gray-100 {
    background-color: #f5f5f5;
}

.bg-gray-200 {
    background-color: #eeeeee;
}

.bg-gray-300 {
    background-color: #e0e0e0;
}

.bg-gray-400 {
    background-color: #bdbdbd;
}

.bg-gray-500 {
    background-color: #9e9e9e;
}

.bg-gray-600 {
    background-color: #757575;
}

.bg-gray-700 {
    background-color: #616161;
}

.bg-gray-800 {
    background-color: #424242;
}

.bg-gray-900 {
    background-color: #212121;
}

.border-gray-100 {
    border-color: #f5f5f5 !important;
}

.border-gray-200 {
    border-color: #eeeeee !important;
}

.border-gray-300 {
    border-color: #e0e0e0 !important;
}

.border-gray-400 {
    border-color: #bdbdbd !important;
}

.border-gray-500 {
    border-color: #9e9e9e !important;
}

.border-gray-600 {
    border-color: #757575 !important;
}

.border-gray-700 {
    border-color: #616161 !important;
}

.border-gray-800 {
    border-color: #424242 !important;
}

.border-gray-900 {
    border-color: #212121 !important;
}

.bg-gray-soycash {
    background-color: #f0f3f4;
}

.bg-blue-gray-paycips {
    background-color: var(--blue-gray);
}

.bg-blue-soycash {
    background-color: var(--soycash-blue);
}

.color-gray-border-soycash {
    border: 1px solid #ebebeb;
}

.border-radius-2 {
    border-radius: 2px;
}

.text-soycash-blue {
    color: var(--soycash-blue);
}

.text-soycash-blue--border {
    border-color: var(--soycash-blue) !important;
}

.text-soycash-gray {
    color: var(--soycash-gray-text);
}

.text-soycash-bold-gray {
    color: var(--soycash-gray-bold-text);
}

.text-soycash-gray-form-control {
    color: var(--soycash-gray-form-control);
}

.font-weight-bold-500 {
    font-weight: 500 !important;
}

.text-decoration-underline {
    text-decoration: underline !important;
}

.badge-green {
    display: inline-block;
    max-width: 102px;
    width: 100%;
    padding: 0.234em 1.45em;
    border-radius: 3em;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    color: white;
    background-color: var(--soycash-green-badge);
}

.badge-red {
    display: inline-block;
    max-width: 101px;
    width: 100%;
    padding: 0.234em 1.45em;
    border-radius: 3em;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    color: white;
    background-color: #dc3545;
}

.badge-gray {
    display: inline-block;
    max-width: 101px;
    width: 100%;
    padding: 0.234em 1.45em;
    border-radius: 3em;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    color: white;
    background-color: #6d787d;
}

.dot-green > span {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 5px;
    border-radius: 9999px;
    background-color: var(--soycash-green-badge);
}

button.text-soycash-blue:hover,
input.text-soycash-blue:hover,
a.text-soycash-blue:hover {
    color: #1b6cec;
    transition: all 0.3s ease;
}

@media screen and (min-width: 1268px) {
    .d-inline-block--1268 {
        display: block;
    }
}

@media screen and (min-width: 1339px) {
    .d-inline-block--1268 {
        display: inline-block;
    }
}

@media screen and (min-width: 768px) {
    .liquidation__text {
        padding: 1.5rem 1rem 1.45rem;
        border-bottom: 4px solid #4a8af2;
    }
}

.liquidation__anchor {
    text-decoration: none;
    font-size: 0.8rem;
}

    .liquidation__anchor:hover {
        text-decoration: none;
        color: #1b6cec;
        transition: all 0.3s ease;
    }

@media screen and (min-width: 576px) {
    .liquidation__anchor {
        font-size: 1rem;
    }
}

.liquidation__selectWrapper {
    position: relative;
}

    .liquidation__selectWrapper::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        display: inline-block;
        padding-left: 2.25em;
        background-image: url("../Images/icon-calendar.svg");
        background-repeat: no-repeat;
        background-position: left 0.65em top 50%;
        background-size: 1.25em;
    }

.liquidation__select {
    height: 38px;
    padding: 0 1.5em 0 2.45em;
    border: 1px solid #ebebeb;
    border-radius: 2px 0 0 2px;
    line-height: 2.45;
    font-weight: 300;
    font-size: 0.95rem;
    font-family: "Roboto", sans-serif;
    color: #57656d;
    background-image: url("../Images/icon-sort-down-solid.svg");
    background-repeat: no-repeat;
    background-position: right 0.65em top 40%;
    background-size: 0.65em;
    appearance: none;
}

    .liquidation__select option {
        font-weight: 300;
        font-size: 0.95rem;
        font-family: "Roboto", sans-serif;
        color: #57656d;
    }

@media screen and (min-width: 1200px) {
    .liquidation__select {
        width: 172.3px;
        border-top: 1px solid #ebebeb;
        border-right: 0;
        border-bottom: 1px solid #ebebeb;
        border-left: 1px solid #ebebeb;
    }
}

.liquidation__dateInitial, .liquidation__dateFinal {
    height: 38px;
    border: 1px solid #ebebeb;
    font-weight: 500;
}

@media screen and (min-width: 1200px) {
    .liquidation__dateInitial, .liquidation__dateFinal {
        border-top: 1px solid #ebebeb;
        border-bottom: 1px solid #ebebeb;
        border-radius: 0 !important;
    }
}

.liquidation__dateInitial {
    border-radius: 2px 2px 0 0 !important;
}

@media screen and (min-width: 1200px) {
    .liquidation__dateInitial {
        width: 115px;
        padding-right: 0;
        padding-left: 0;
        border-right: 0;
        border-left: 1px solid #ebebeb;
        border-radius: 0 !important;
    }
}

.liquidation__to {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 38px;
    border-right: 1px solid #ebebeb;
    border-left: 1px solid #ebebeb;
    font-weight: 300;
}

@media screen and (min-width: 1200px) {
    .liquidation__to {
        border-top: 1px solid #ebebeb;
        border-right: 0;
        border-bottom: 1px solid #ebebeb;
        border-left: 0;
    }
}

.liquidation__dateFinal {
    border-radius: 0 0 2px 2px !important;
}

@media screen and (min-width: 1200px) {
    .liquidation__dateFinal {
        width: 115px;
        padding-right: 0;
        padding-left: 0;
        border-right: 1px solid #ebebeb;
        border-left: 0;
        border-radius: 0 2px 2px 0 !important;
    }
}

.liquidation__money {
    margin-top: 2em;
    margin-right: 0;
    margin-bottom: 2em;
}

@media screen and (min-width: 768px) {
    .liquidation__money {
        margin-top: 0;
        margin-right: 2em;
        margin-bottom: 0;
    }
}

.liquidation__number {
    font-weight: 300;
    font-size: 1.5em;
}

    .liquidation__number .liquidation__tinyZero {
        margin-left: -0.3125rem;
        font-size: 0.6em;
    }

.liquidation__number--small {
    font-weight: 300;
    font-size: 1em;
}

    .liquidation__number--small .liquidation__tinyZero--small {
        margin-left: -0.2rem;
        font-size: 0.8em;
    }

.liquidation__showLiquidation {
    font-weight: 300;
    font-size: 1em;
}

.liquidation__pagination {
    font-size: 0.8em;
}

.liquidation__info br {
    display: none;
}

@media screen and (min-width: 992px) {
    .liquidation__info br {
        display: block;
    }
}

.liquidation .card {
    border-color: #e2e8ea;
}

.liquidation .card-header {
    padding: 0 1.5rem;
    border-color: #e2e8ea;
}

@media screen and (min-width: 576px) {
    .liquidation .card-header {
        padding: 0 2.5rem;
    }
}

.liquidation .card-body {
    padding: 1.5rem;
    border-top: 1px solid #e2e8ea;
}

@media screen and (min-width: 576px) {
    .liquidation .card-body {
        padding: 1.5rem 2.5rem;
    }
}

@media screen and (min-width: 768px) {
    .liquidation .card-list-group-800px {
        max-width: 800px;
        margin: 0 auto;
    }
}

@media screen and (min-width: 768px) {
    .liquidation .card-list-group-1200px {
        max-width: 1200px;
        margin: 0 auto;
    }
}

.liquidation .list-group-header {
    padding: 0.75rem 1.25rem;
    background-color: #f5f6f6;
}

.liquidation .list-group-item {
    border-color: #e2e8ea;
}

.liquidation .table > thead {
    color: white;
    background-color: var(--dark-blue);
}

.liquidation .table th,
.liquidation .table td {
    vertical-align: middle;
}

.liquidation .table td {
    font-weight: 500;
    color: var(--soycash-gray-text);
}

.tab-content > .tab-pane .form-group > label {
    color: #494949;
}

.transaction ul.nav.nav-tabs {
    display: flex;
    align-items: center;
    height: 75px;
}

    .transaction ul.nav.nav-tabs .nav-item {
        height: 100%;
        margin-bottom: 0;
    }

    .transaction ul.nav.nav-tabs li.nav-item + li.nav-item {
        display: flex;
        align-items: center;
        margin-left: 1rem;
    }

@media screen and (min-width: 576px) {
    .transaction ul.nav.nav-tabs li.nav-item + li.nav-item {
        margin-left: 2rem;
    }
}

.transaction ul.nav.nav-tabs .nav-link {
    display: flex;
    align-items: center;
    height: 100%;
    margin-bottom: 0;
    padding: 0;
    background-color: unset;
    border-color: unset;
    color: #494949;
    border: 0;
    border-radius: 0;
    font-weight: 500;
    font-size: 0.8rem;
}

    .transaction ul.nav.nav-tabs .nav-link.active {
        color: #4a8af2;
    }

@media screen and (min-width: 576px) {
    .transaction ul.nav.nav-tabs .nav-link.active {
        border: 0;
        border-radius: 0;
        border-bottom: 4px solid #4a8af2;
    }

        .transaction ul.nav.nav-tabs .nav-link.active:hover {
            border-bottom: 4px solid #4a8af2;
        }
}

.transaction ul.nav.nav-tabs .nav-link:hover {
    border-color: transparent;
}

@media screen and (min-width: 576px) {
    .transaction ul.nav.nav-tabs .nav-link {
        border-bottom: 4px solid transparent;
        font-size: 1rem;
    }
}

@media screen and (min-width: 576px) {
    .transaction ul.nav.nav-tabs {
        display: flex;
        justify-content: unset;
    }
}

.transaction .liquidation__select {
    border: 1px solid #ebebeb;
}

@media screen and (min-width: 768px) {
    .transaction .liquidation__select {
        border-right: 0;
    }
}

.transaction .liquidation__dateInitial--768,
.transaction .liquidation__dateFinal--768 {
    height: 38px;
    border: 1px solid #ebebeb;
    font-weight: 500;
}

@media screen and (min-width: 768px) {
    .transaction .liquidation__dateInitial--768,
    .transaction .liquidation__dateFinal--768 {
        border-top: 1px solid #ebebeb;
        border-bottom: 1px solid #ebebeb;
        border-radius: 0 !important;
    }
}

.transaction .liquidation__dateInitial--768 {
    border-radius: 2px 2px 0 0 !important;
}

@media screen and (min-width: 768px) {
    .transaction .liquidation__dateInitial--768 {
        width: 115px;
        padding-right: 0;
        padding-left: 0;
        border-right: 0;
        border-left: 1px solid #ebebeb;
        border-radius: 0 !important;
    }
}

.transaction .liquidation__to--768 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 38px;
    border-right: 1px solid #ebebeb;
    border-left: 1px solid #ebebeb;
    font-weight: 300;
}

@media screen and (min-width: 768px) {
    .transaction .liquidation__to--768 {
        border-top: 1px solid #ebebeb;
        border-right: 0;
        border-bottom: 1px solid #ebebeb;
        border-left: 0;
    }
}

.transaction .liquidation__dateFinal--768 {
    border-radius: 0 0 2px 2px !important;
}

@media screen and (min-width: 768px) {
    .transaction .liquidation__dateFinal--768 {
        width: 115px;
        padding-right: 0;
        padding-left: 0;
        border-right: 1px solid #ebebeb;
        border-left: 0;
        border-radius: 0 2px 2px 0 !important;
    }
}

.responsive-table {
    transition: all 0.3s ease;
}

table.table thead > tr {
    border-bottom: 0;
}

    table.table thead > tr > th {
        border-top: 0;
        border-bottom: 1px solid white;
    }

table.table tbody > tr {
    border-bottom: 0;
}

    table.table tbody > tr > td {
        border-top: 0;
    }

    table.table tbody > tr:last-child {
        border-bottom: none;
    }

table.table.table-verificacion-transf td,
table.table.table-verificacion-transf th {
    padding: 0.25rem;
}

table.table.table-verificacion-transf td {
    padding-left: 0.6rem;
}

table.table.table-verificacion-transf tbody tr {
    background-color: #eff5ff;
}

    table.table.table-verificacion-transf tbody tr:nth-of-type(2n + 1) {
        background-color: #dce8ff;
    }

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid var(--dark-blue);
}

.table th,
.table td {
    padding: 0.75rem;
    vertical-align: top;
    border-top: 1px solid white;
}

#tab-options {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1.5rem 0 1.5rem;
}

@media screen and (min-width: 576px) {
    #tab-options {
        padding: 0 2.5rem 0 2.5rem;
    }
}

#search-menu,
#download-menu,
#print-menu {
    width: 100%;
}

.cursor-default {
    cursor: default;
}

.container-72rem {
    max-width: 72rem;
    margin-right: auto;
    margin-left: auto;
    padding-right: 1rem;
    padding-left: 1rem;
}

@media screen and (min-width: 576px) {
    .container-72rem {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
    }
}

.header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    border-bottom-width: 3px;
    border-bottom-style: solid;
    border-color: #e5e7eb;
    background-color: white;
    z-index: 50;
}

    .header .header-nav {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

.carrousel {
    position: relative;
}

    .carrousel .carrousel-content {
        position: absolute;
        /*bottom: 2rem;*/
        display: none;
        max-width: 50rem;
        margin-top: 15rem;
        padding-left: 5rem;
    }

        .carrousel .carrousel-content > h2 {
            font-weight: 500;
            font-size: 2.5rem;
            line-height: 3.5rem;
            color: white;
        }

        .carrousel .carrousel-content > p {
            margin-top: 2rem;
            font-size: 2rem;
            /*line-height: 1.75rem;*/
            color: white;
        }

        .carrousel .carrousel-content > a {
            display: inline-block;
            max-width: 20rem;
            border-radius: 0.25rem;
            margin-top: 1.25rem;
            padding-top: 0.75rem;
            padding-right: 3rem;
            padding-bottom: 0.75rem;
            padding-left: 3rem;
            font-size: 0.875rem;
            line-height: 1.25rem;
            text-align: center;
            color: var(--dark-blue);
            background-color: white;
        }

@media screen and (min-width: 1200px) {
    .carrousel .carrousel-content {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
    }
}

.carrousel .carrousel-img {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}

.oferta {
    padding-top: 2.5rem;
    text-align: center;
}

    .oferta .oferta-title {
        font-size: 2.25rem;
        line-height: 2.5rem;
    }

.button {
    color: white;
    background-color: var(--dark-blue);
}

.btnBlueSoyCash {
    color: white;
    background-color: #18478c;
}

    .btnBlueSoyCash:hover {
        color: white;
        background-color: #18478c;
    }

.img-viewport {
    width: 100vw;
    height: 75vh;
    object-fit: cover;
}

.box {
    max-width: 72rem;
    height: 100%;
    padding: 1rem;
}

@media screen and (min-width: 576px) {
    .box {
        padding: 2.5rem;
    }
}

.box .box-link {
    display: flex;
    flex-direction: column;
    padding-top: 2.5rem;
    padding-bottom: 1.75rem;
    padding-right: 1.75rem;
    padding-left: 1.75rem;
    border-top: 1px solid #e5e7eb;
    text-decoration: none;
}

    .box .box-link:nth-child(2n + 1) {
        border-right: 1px solid #e5e7eb;
        border-left: 1px solid #e5e7eb;
    }

    .box .box-link:nth-child(4n + 4) {
        border-right: 1px solid #e5e7eb;
    }

    .box .box-link:nth-child(1n + 5) {
        border-bottom: 1px solid #e5e7eb;
    }

    .box .box-link:hover {
        background-color: #e5e7eb;
    }

    .box .box-link > h1,
    .box .box-link h2,
    .box .box-link h3,
    .box .box-link h4,
    .box .box-link h5,
    .box .box-link h6 {
        font-weight: 500;
        font-size: 16px;
    }

    .box .box-link > p,
    .box .box-link span {
        margin: 0;
        font-size: 0.875rem;
        line-height: 1.25rem;
        color: var(--dark-color);
    }

    .box .box-link > img {
        width: 3.5rem;
        height: 3.5rem;
        padding: 0.125rem;
        margin-bottom: 0.5rem;
        margin-left: -0.375rem;
    }

.terminal {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    background-color: #f3f4f6;
}

    .terminal .terminal-box {
        padding: 4rem;
        border: 2px solid #f3f4f6;
        text-align: center;
        background-color: white;
        overflow: hidden;
    }

        .terminal .terminal-box > h1 {
            margin-bottom: 0;
            font-weight: 500;
            font-size: 1.875rem;
            line-height: 2.25rem;
        }

        .terminal .terminal-box > p {
            margin-top: 0.5rem;
            padding-bottom: 0.75rem;
        }

        .terminal .terminal-box > img {
            max-width: 80%;
            height: auto;
            margin: 0 auto;
        }

    .terminal .terminal-badge {
        padding-bottom: 0.5rem;
        padding-top: 0.5rem;
        padding-left: 1rem;
        padding-right: 1rem;
        border-radius: 9999px;
        font-size: 0.875rem;
        line-height: 1.25rem;
        color: white;
        background-color: var(--dark-color);
    }

.costos {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    background-color: var(--dark-blue);
}

    .costos .costos-card {
        padding-top: 2.5rem;
        padding-right: 1.75rem;
        padding-bottom: 1.75rem;
        padding-left: 1.75rem;
    }

.cargos {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    background-color: #f3f4f6;
}

    .cargos img {
        max-width: 100%;
        height: auto;
        object-fit: cover;
    }

.registrate {
    background-color: var(--dark-blue);
}

@media screen and (min-width: 576px) {
    .registrate {
        padding-top: 3.5rem;
        padding-right: 2.5rem;
        padding-bottom: 3.5rem;
        padding-left: 2.5rem;
    }
}

.tiendas {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

    .tiendas img {
        width: 3rem;
        height: 3rem;
    }

.transferencias {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    background-color: #f3f4f6;
}

    .transferencias img {
        max-width: 100%;
        height: auto;
        object-fit: cover;
    }

.enlaces {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

    .enlaces .enlaces-box {
        border: 1px solid #d1d5db;
    }

        .enlaces .enlaces-box:nth-child(2n + 2) {
            border-top: 0;
            border-bottom: 0;
        }

    .enlaces img {
        width: 4rem;
        height: 4rem;
        object-fit: contain;
    }

.codi {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

    .codi .codi-banner {
        max-width: 100%;
        height: auto;
        object-fit: cover;
    }

    .codi .codi-signal,
    .codi .codi-icon,
    .codi .codi-contact {
        height: 7rem;
        width: auto;
        object-fit: contain;
    }

    .codi .codi-icon,
    .codi .codi-contact {
        height: 5rem;
    }

    .codi .codi-contact {
        width: 5rem;
        height: 5rem;
    }

.banner .banner-heading {
    position: absolute;
    top: 4rem;
    display: none;
    max-width: 24rem;
    padding-left: 3.5rem;
    padding-top: 2.25rem;
}

.banner > img {
    margin-top: 4rem;
    max-width: 100%;
    height: auto;
}

@media screen and (min-width: 768px) {
    .banner > img {
        margin-top: 0;
    }
}

.pagos > div > p {
    max-width: 56ch;
    margin: 0 auto;
}

.terminales {
    background: linear-gradient(white, #f9fafb);
}

    .terminales .terminales-device {
        max-width: 100%;
        height: auto;
    }

    .terminales .terminales-info {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        height: 100%;
        padding-bottom: 3rem;
        padding-top: 3rem;
        text-align: center;
        color: #111827;
    }

        .terminales .terminales-info a {
            display: inline-flex;
            justify-content: center;
            align-items: center;
            color: var(--dark-blue);
        }

@media screen and (min-width: 768px) {
    .terminales .terminales-info {
        left: -7rem;
    }
}

.terminales .terminales-entrega,
.terminales .terminales-devolucion {
    width: 2.5rem;
    height: 2.5rem;
}

.reportes-seguridad-transacciones img {
    max-width: 100%;
    height: auto;
}

.aceptar-pagos {
    background-color: #f3f4f6;
}

    .aceptar-pagos .aceptar-pagos-box {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 100%;
        padding: 5.5rem;
        border-top-left-radius: 0.25rem;
        border-bottom-left-radius: 0.25rem;
        text-align: center;
        background-color: white;
    }

    .aceptar-pagos .aceptar-pagos-badge {
        display: inline-block;
        padding-top: 0.5rem;
        padding-right: 1rem;
        padding-left: 1rem;
        padding-bottom: 0.5rem;
        border-radius: 9999px;
        font-size: 0.875rem;
        line-height: 1.25rem;
        color: white;
        background-color: var(--dark-color);
    }

    .aceptar-pagos img {
        max-width: 100%;
        height: auto;
    }

@media screen and (min-width: 576px) {
    .software {
        padding-top: 6rem !important;
        padding-left: 2.5rem !important;
        padding-bottom: 10rem !important;
        padding-right: 2.5rem !important;
    }
}

.software img {
    width: 2rem;
    height: 2rem;
    margin-right: auto;
    margin-left: auto;
}

/*.row {
  margin-bottom: 1.875rem; }*/

.liquidation__number {
    padding: 0.75rem 1.25rem;
    border: 1px solid #e2e8ea;
}

.card-header > p > span {
    color: #494949;
}

.table-vertical tr {
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid #e2e8ea;
}

    .table-vertical tr:last-child {
        border-bottom: 0;
    }

    .table-vertical tr > th {
        padding: 0.75rem 1.25rem;
        font-weight: 300;
    }

        .table-vertical tr > th[colspan="2"] {
            font-weight: 500;
            text-align: center;
        }

    .table-vertical tr > td {
        padding: 0.75rem 1.25rem;
        font-weight: 500;
        text-align: right;
    }

.table-vertical.equal-width tr > th {
    max-width: 50%;
    width: 100%;
}

.table-vertical.equal-width tr > td {
    max-width: 50%;
    width: 100%;
}

.table-normal thead > tr {
    border-bottom: 1px solid #e2e8ea;
}

    .table-normal thead > tr > th {
        padding: 0.75rem 1.25rem;
    }

        .table-normal thead > tr > th:not(:last-child) {
            border-right: 1px solid #e2e8ea;
        }

.table-normal tbody > tr > td {
    padding: 0.75rem 1.25rem;
}

    .table-normal tbody > tr > td:not(:last-child) {
        border-right: 1px solid #e2e8ea;
    }

.table-normal tbody > tr:not(:last-child) {
    border: 1px solid #e2e8ea;
}


.formSoyCash {
    font-size: 1.5rem;
    border: 2px solid #4a8af0;
    border-radius: 4px;
}
