.container-vourcher-purchase-status {
    background-color: #fff
}

.icon-date {
    position: absolute;
    top: 17px;
    left: 10px;
    cursor: pointer;
    font-size: 18px
}

.labelFormatDate {
    margin-bottom: -50px !important;
    padding-left: 35px;
    padding-top: 22px;
    position: absolute;
    text-align: left;
    font: medium 12px / 67px Montserrat;
    letter-spacing: 0;
    color: var(--primary-color);
    opacity: 1
}

#input-end-date, #input-start-date {
    background-color: transparent !important;
    padding-left: 45px !important;
    text-align: left;
    cursor: pointer;
    padding-top: 6px;
    color: transparent !important;
    border-radius: 5px;
    opacity: 1;
    width: 100%
}

input:not(input.startDate):not(input.icon-date):not(input[type=checkbox]) {
    padding: 20px !important
}

form input:not(input[type=radio]):not(input[type=checkbox]), input:not(input[type=radio]):not(input[type=checkbox]) {
    background: var(--color-1);
    height: 55px;
    padding: 5px 10px;
    font-size: 16px;
    border: solid 0 var(--color-0);
    border-radius: 5px;
    color: var(--primary-color)
}

table {
    font-size: 12px;
    border: none !important;
    color: var(--color-0) !important
}

    table > tbody {
        text-align: center;
        font-family: var(--primary-font)
    }

.tr-head th {
    background-color: var(--secundary-color);
    color: #fff;
    font-family: var(--secundary-font);
    height: 18px;
    border-width: thin !important;
    border-collapse: separate;
    border-color: var(--color-1)
}

.container-controls {
    min-height: 405px;
    padding: 0
}

.endDate, .startDate {
    padding-right: 5px
}

.btn-voucher-purchase, .endDate {
    padding-left: 5px
}

.btn-view-report {
    font-family: var(--tertiary-font);
    font-size: 16px
}

.table.dataTable {
    border-collapse: collapse !important;
    border-spacing: 0
}

.table-bordered > :not(caption) > * > * {
    border: 1px solid #dee2e6
}

.dataTables_wrapper .dataTables_length {
    margin-bottom: 10px;
    margin-top: -28px
}

.tbf {
    background-color: #eee9d2
}

.container {
    margin-left: auto;
    margin-right: auto
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: .5em .3em
}

@media (max-width:479.98px) {
    .pl-sm-0, .pr-sm-0 {
        padding: 0 !important
    }
}

@media (max-width:575.98px) {
    .act-date {
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .banner-body {
        font-size: 30px
    }

    .pl-sm-0, .pr-sm-0 {
        padding: 0 !important
    }

    .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_length {
        float: none;
        text-align: left !important
    }
}

@media (min-width:576px) and (max-width:767.98px) {
    .banner-body {
        font-size: 40px
    }

    .pl-lg-5, .pr-lg-5 {
        padding: 5px !important
    }

    .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_length {
        float: none;
        text-align: left !important
    }
}

@media (min-width:768px) and (max-width:991.98px) {
    .banner-body {
        font-size: 50px
    }

    .pr-lg-5 {
        padding-right: 5px
    }

    .pl-lg-5 {
        padding-left: 5px
    }
}

@media (min-width:992px) and (max-width:1199.98px) {
    .container-banner .banner-body {
        font-size: 65px !important
    }

    .act-date {
        min-width: 197px
    }
}

@media (min-width:1200px) and (max-width:1399.98px) {
    .container-banner .banner-body {
        font-size: 65px !important;
        line-height: unset
    }

    .act-date {
        min-width: 197px
    }
}

@media (min-width:1400px) {
    .container-banner .banner-body {
        font-size: 65px !important
    }

    .act-date {
        min-width: 197px
    }
}