﻿
:root, [data-bs-theme=light] {
    --bs-titular: #906F8D;
    --bs-conyuge: #34375A;
    --bs-dependiente: #F5CDC0;
    --bs-enfermedad: #d1b2d2;
    --bs-accidente: #b6ced4;
    --bs-maternidad: #ffc3bf;
    --bs-pagodirecto: #2d3436;
    --bs-reembolso: #fd7e14;
    --bs-programacion: #a29bfe;
    --bs-hombre: #69c;
    --bs-mujer: #ffb6c1;
}

/*input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}*/

.bg-titular {
    background-color: #906F8D !important
}
.bg-conyuge {
    background-color: #34375A !important
}
.bg-dependiente {
    background-color: #F5CDC0 !important
}


.bg-light-danios {
    background-color: #b368fe !important
}

.bg-danios {
    background-color: #390084 !important
}


.bg-light-autos {
    background-color: #74c6ee !important
}

.bg-autos {
    background-color: #005388 !important
}


.bg-light-beneficios {
    background-color: #00e877 !important
}

.bg-beneficios {
    background-color: #008b51 !important
}

.bg-light-onesta {
    background-color: #fe956b !important
}

.bg-onesta {
    background-color: #fe6241 !important
}

.bg-a1 {
    background-color: #c7f4fc !important
}

.text-a1 {
    color: #1cb9d5 !important
}

.bg-a2 {
    background-color: #fbd2f6 !important
}

.text-a2 {
    color: #900580 !important
}
.bg-a3 {
    background-color: #FFB6FA !important
}

.text-a3 {
    color: #FE3897 !important
}

.bg-a4 {
    background-color: #D4FFE6 !important
}

.text-a4 {
    color: #007437 !important
}

.bg-greyonesta {
    background-color: #f0f1f7 !important
}

.bg-blueonesta {
    background-color: #382d53 !important
}

.bg-greyblueonesta {
    background-color: #6f80b7 !important
}

.bg-darkonesta {
    background-color: #1c1731 !important
}

.text-blueonesta {
    color: #382d53 !important
}

.text-greyblueonesta {
    color: #6f80b7 !important
}


.min-h-165px {
    min-height: 165px !important
}

:-webkit-autofill {
    transition: background-color 50000s ease-in-out 0s;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-text-fill-color: #5e6278;
    font-size: 1.1rem;
    -webkit-box-shadow: 0 0 0px 1000px #000 inset;
    transition: background-color 5000s ease-in-out 0s;
}

.symbol.symbol-auto > img {
    width: 125px;
    height: 80px
}

.symbol.symbol-auto .symbol-label {
    width: 125px;
    height: 80px
}

.symbol.symbol-auto.symbol-fixed .symbol-label {
    width: 125px;
    height: 80px
}

.symbol.symbol-auto.symbol-fixed > img {
    width: 125px;
    height: 80px;
    max-width: none
}

.form-control.form-control-transparent {
    background-color: transparent;
    border-color: transparent;
    border-bottom: 0.17rem solid #B5B5C3;
    border-radius: 0;
}
.dropdown.show > .form-control.form-control-transparent, .form-control.form-control-transparent.active, .form-control.form-control-transparent.focus, .form-control.form-control-transparent:active, .form-control.form-control-transparent:focus {
    background-color: transparent;
    border-color: transparent;
    border-bottom: 0.17rem solid #B5B5C3;
    border-radius: 0;
}

.form-floating > label {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -2;
    height: 100%;
    padding: 1rem 1rem 1rem 1rem;
    overflow: hidden;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: 1px solid transparent;
    transform-origin: 0 0;
    background-color: transparent;
    transition: opacity .1s ease-in-out, transform .1s ease-in-out;
}

.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    color: rgba(var(--bs-body-color-rgb), .65);
    transform: scale(.65) translateY(-.6rem) translateX(.15rem);
}

.form-floating .form-select {
    padding-top: 1rem !important;
}

.form-select.form-select-transparent {
    background-color: transparent;
    border-color: transparent;
    color: #5e6278;
    border-bottom: 0.17rem solid #B5B5C3;
    border-radius: 0;
}

    .dropdown.show > .form-select.form-select-transparent, .form-select.form-select-transparent.active, .form-select.form-select-transparent.focus, .form-select.form-select-transparent:active, .form-select.form-select-transparent:focus {
        background-color: transparent;
        border-color: transparent !important;
        color: #a1a5b7;
        border-bottom: 0.17rem solid #B5B5C3 !important;
        border-radius: 0;
    }


.dropzone.dropzone-queue .dropzone-item {
    display: flex;
    align-items: center;
    margin-top: 0.75rem;
    border-radius: 0.65rem;
    padding: 0.3rem 1rem;
    background-color: var(--bs-gray-100);
}
/*input:-webkit-autofill ~ label {
    padding: 1rem 1rem;
    padding-top: 2rem;
    padding-left: 1.5rem;
    opacity: .65;
    font-size: 1.25rem !important;
    transform: scale(.65) translateY(-.5rem) translateX(.15rem)
} */
/*:not(:-webkit-autofill) {
    animation-name: onAutoFillCancel;
}*/

/*:-webkit-autofill,
:-webkit-autofill:hover,
:-webkit-autofill:focus {
}

    :-webkit-autofill,
    :-webkit-autofill:hover,
    :-webkit-autofill:focus > label {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        padding: 1rem 1rem;
        padding-top: 2rem;
        padding-left: 1.5rem;
        pointer-events: none;
        border: 1px solid transparent;
        transform-origin: 0 0;
        transition: opacity .1s ease-in-out,transform .1s ease-in-out
    }*/
.not-here {
    display:none ;
    /*color: var(--coloriconos)*/
}
.in-here {
    display:block;
}
.ninja {
    visibility:hidden;
}

.text-subrayado {
    text-decoration:underline !important;
}

.alineaderecha {
    text-align:right;
}

.alineaizquierda {
    text-align:right;
}

.alineacentro {
    text-align:center;
}

.alineaenmedio {
    vertical-align:middle;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

.d-enlinea {
    display:inline;
}

/*.select2-container .select2-selection--single {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    height: 48px;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-select: none;
}*/

.m-0 {
    margin: 0 !important;
}

.mt-0,
.my-0 {
    margin-top: 0 !important;
}

.mr-0,
.mx-0 {
    margin-right: 0 !important;
}

.mb-0,
.my-0 {
    margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
    margin-left: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.mt-1,
.my-1 {
    margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
    margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
    margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
    margin-left: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.mt-2,
.my-2 {
    margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
    margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
    margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
    margin-left: 0.5rem !important;
}

.m-3 {
    margin: 0.75rem !important;
}

.mt-3,
.my-3 {
    margin-top: 0.75rem !important;
}

.mr-3,
.mx-3 {
    margin-right: 0.75rem !important;
}

.mb-3,
.my-3 {
    margin-bottom: 0.75rem !important;
}

.ml-3,
.mx-3 {
    margin-left: 0.75rem !important;
}

.m-4 {
    margin: 1rem !important;
}

.mt-4,
.my-4 {
    margin-top: 1rem !important;
}

.mr-4,
.mx-4 {
    margin-right: 1rem !important;
}

.mb-4,
.my-4 {
    margin-bottom: 1rem !important;
}

.ml-4,
.mx-4 {
    margin-left: 1rem !important;
}

.m-5 {
    margin: 1.25rem !important;
}

.mt-5,
.my-5 {
    margin-top: 1.25rem !important;
}

.mr-5,
.mx-5 {
    margin-right: 1.25rem !important;
}

.mb-5,
.my-5 {
    margin-bottom: 1.25rem !important;
}

.ml-5,
.mx-5 {
    margin-left: 1.25rem !important;
}

.m-6 {
    margin: 1.5rem !important;
}

.mt-6,
.my-6 {
    margin-top: 1.5rem !important;
}

.mr-6,
.mx-6 {
    margin-right: 1.5rem !important;
}

.mb-6,
.my-6 {
    margin-bottom: 1.5rem !important;
}

.ml-6,
.mx-6 {
    margin-left: 1.5rem !important;
}

.m-7 {
    margin: 1.75rem !important;
}

.mt-7,
.my-7 {
    margin-top: 1.75rem !important;
}

.mr-7,
.mx-7 {
    margin-right: 1.75rem !important;
}

.mb-7,
.my-7 {
    margin-bottom: 1.75rem !important;
}

.ml-7,
.mx-7 {
    margin-left: 1.75rem !important;
}

.m-8 {
    margin: 2rem !important;
}

.mt-8,
.my-8 {
    margin-top: 2rem !important;
}

.mr-8,
.mx-8 {
    margin-right: 2rem !important;
}

.mb-8,
.my-8 {
    margin-bottom: 2rem !important;
}

.ml-8,
.mx-8 {
    margin-left: 2rem !important;
}

.m-9 {
    margin: 2.25rem !important;
}

.mt-9,
.my-9 {
    margin-top: 2.25rem !important;
}

.mr-9,
.mx-9 {
    margin-right: 2.25rem !important;
}

.mb-9,
.my-9 {
    margin-bottom: 2.25rem !important;
}

.ml-9,
.mx-9 {
    margin-left: 2.25rem !important;
}

.m-10 {
    margin: 2.5rem !important;
}

.mt-10,
.my-10 {
    margin-top: 2.5rem !important;
}

.mr-10,
.mx-10 {
    margin-right: 2.5rem !important;
}

.mb-10,
.my-10 {
    margin-bottom: 2.5rem !important;
}

.ml-10,
.mx-10 {
    margin-left: 2.5rem !important;
}

.m-11 {
    margin: 2.75rem !important;
}

.mt-11,
.my-11 {
    margin-top: 2.75rem !important;
}

.mr-11,
.mx-11 {
    margin-right: 2.75rem !important;
}

.mb-11,
.my-11 {
    margin-bottom: 2.75rem !important;
}

.ml-11,
.mx-11 {
    margin-left: 2.75rem !important;
}

.m-12 {
    margin: 3rem !important;
}

.mt-12,
.my-12 {
    margin-top: 3rem !important;
}

.mr-12,
.mx-12 {
    margin-right: 3rem !important;
}

.mb-12,
.my-12 {
    margin-bottom: 3rem !important;
}

.ml-12,
.mx-12 {
    margin-left: 3rem !important;
}

.m-13 {
    margin: 3.25rem !important;
}

.mt-13,
.my-13 {
    margin-top: 3.25rem !important;
}

.mr-13,
.mx-13 {
    margin-right: 3.25rem !important;
}

.mb-13,
.my-13 {
    margin-bottom: 3.25rem !important;
}

.ml-13,
.mx-13 {
    margin-left: 3.25rem !important;
}

.m-14 {
    margin: 3.5rem !important;
}

.mt-14,
.my-14 {
    margin-top: 3.5rem !important;
}

.mr-14,
.mx-14 {
    margin-right: 3.5rem !important;
}

.mb-14,
.my-14 {
    margin-bottom: 3.5rem !important;
}

.ml-14,
.mx-14 {
    margin-left: 3.5rem !important;
}

.m-15 {
    margin: 3.75rem !important;
}

.mt-15,
.my-15 {
    margin-top: 3.75rem !important;
}

.mr-15,
.mx-15 {
    margin-right: 3.75rem !important;
}

.mb-15,
.my-15 {
    margin-bottom: 3.75rem !important;
}

.ml-15,
.mx-15 {
    margin-left: 3.75rem !important;
}

.m-16 {
    margin: 4rem !important;
}

.mt-16,
.my-16 {
    margin-top: 4rem !important;
}

.mr-16,
.mx-16 {
    margin-right: 4rem !important;
}

.mb-16,
.my-16 {
    margin-bottom: 4rem !important;
}

.ml-16,
.mx-16 {
    margin-left: 4rem !important;
}

.m-17 {
    margin: 4.25rem !important;
}

.mt-17,
.my-17 {
    margin-top: 4.25rem !important;
}

.mr-17,
.mx-17 {
    margin-right: 4.25rem !important;
}

.mb-17,
.my-17 {
    margin-bottom: 4.25rem !important;
}

.ml-17,
.mx-17 {
    margin-left: 4.25rem !important;
}

.m-18 {
    margin: 4.5rem !important;
}

.mt-18,
.my-18 {
    margin-top: 4.5rem !important;
}

.mr-18,
.mx-18 {
    margin-right: 4.5rem !important;
}

.mb-18,
.my-18 {
    margin-bottom: 4.5rem !important;
}

.ml-18,
.mx-18 {
    margin-left: 4.5rem !important;
}

.m-19 {
    margin: 4.75rem !important;
}

.mt-19,
.my-19 {
    margin-top: 4.75rem !important;
}

.mr-19,
.mx-19 {
    margin-right: 4.75rem !important;
}

.mb-19,
.my-19 {
    margin-bottom: 4.75rem !important;
}

.ml-19,
.mx-19 {
    margin-left: 4.75rem !important;
}

.m-20 {
    margin: 5rem !important;
}

.mt-20,
.my-20 {
    margin-top: 5rem !important;
}

.mr-20,
.mx-20 {
    margin-right: 5rem !important;
}

.mb-20,
.my-20 {
    margin-bottom: 5rem !important;
}

.ml-20,
.mx-20 {
    margin-left: 5rem !important;
}

.m-21 {
    margin: 5.25rem !important;
}

.mt-21,
.my-21 {
    margin-top: 5.25rem !important;
}

.mr-21,
.mx-21 {
    margin-right: 5.25rem !important;
}

.mb-21,
.my-21 {
    margin-bottom: 5.25rem !important;
}

.ml-21,
.mx-21 {
    margin-left: 5.25rem !important;
}

.m-22 {
    margin: 5.5rem !important;
}

.mt-22,
.my-22 {
    margin-top: 5.5rem !important;
}

.mr-22,
.mx-22 {
    margin-right: 5.5rem !important;
}

.mb-22,
.my-22 {
    margin-bottom: 5.5rem !important;
}

.ml-22,
.mx-22 {
    margin-left: 5.5rem !important;
}

.m-23 {
    margin: 5.75rem !important;
}

.mt-23,
.my-23 {
    margin-top: 5.75rem !important;
}

.mr-23,
.mx-23 {
    margin-right: 5.75rem !important;
}

.mb-23,
.my-23 {
    margin-bottom: 5.75rem !important;
}

.ml-23,
.mx-23 {
    margin-left: 5.75rem !important;
}

.m-24 {
    margin: 6rem !important;
}

.mt-24,
.my-24 {
    margin-top: 6rem !important;
}

.mr-24,
.mx-24 {
    margin-right: 6rem !important;
}

.mb-24,
.my-24 {
    margin-bottom: 6rem !important;
}

.ml-24,
.mx-24 {
    margin-left: 6rem !important;
}

.m-25 {
    margin: 6.25rem !important;
}

.mt-25,
.my-25 {
    margin-top: 6.25rem !important;
}

.mr-25,
.mx-25 {
    margin-right: 6.25rem !important;
}

.mb-25,
.my-25 {
    margin-bottom: 6.25rem !important;
}

.ml-25,
.mx-25 {
    margin-left: 6.25rem !important;
}

.m-26 {
    margin: 6.5rem !important;
}

.mt-26,
.my-26 {
    margin-top: 6.5rem !important;
}

.mr-26,
.mx-26 {
    margin-right: 6.5rem !important;
}

.mb-26,
.my-26 {
    margin-bottom: 6.5rem !important;
}

.ml-26,
.mx-26 {
    margin-left: 6.5rem !important;
}

.m-27 {
    margin: 6.75rem !important;
}

.mt-27,
.my-27 {
    margin-top: 6.75rem !important;
}

.mr-27,
.mx-27 {
    margin-right: 6.75rem !important;
}

.mb-27,
.my-27 {
    margin-bottom: 6.75rem !important;
}

.ml-27,
.mx-27 {
    margin-left: 6.75rem !important;
}

.m-28 {
    margin: 7rem !important;
}

.mt-28,
.my-28 {
    margin-top: 7rem !important;
}

.mr-28,
.mx-28 {
    margin-right: 7rem !important;
}

.mb-28,
.my-28 {
    margin-bottom: 7rem !important;
}

.ml-28,
.mx-28 {
    margin-left: 7rem !important;
}

.m-29 {
    margin: 7.25rem !important;
}

.mt-29,
.my-29 {
    margin-top: 7.25rem !important;
}

.mr-29,
.mx-29 {
    margin-right: 7.25rem !important;
}

.mb-29,
.my-29 {
    margin-bottom: 7.25rem !important;
}

.ml-29,
.mx-29 {
    margin-left: 7.25rem !important;
}

.m-30 {
    margin: 7.5rem !important;
}

.mt-30,
.my-30 {
    margin-top: 7.5rem !important;
}

.mr-30,
.mx-30 {
    margin-right: 7.5rem !important;
}

.mb-30,
.my-30 {
    margin-bottom: 7.5rem !important;
}

.ml-30,
.mx-30 {
    margin-left: 7.5rem !important;
}

.m-31 {
    margin: 7.75rem !important;
}

.mt-31,
.my-31 {
    margin-top: 7.75rem !important;
}

.mr-31,
.mx-31 {
    margin-right: 7.75rem !important;
}

.mb-31,
.my-31 {
    margin-bottom: 7.75rem !important;
}

.ml-31,
.mx-31 {
    margin-left: 7.75rem !important;
}

.m-32 {
    margin: 8rem !important;
}

.mt-32,
.my-32 {
    margin-top: 8rem !important;
}

.mr-32,
.mx-32 {
    margin-right: 8rem !important;
}

.mb-32,
.my-32 {
    margin-bottom: 8rem !important;
}

.ml-32,
.mx-32 {
    margin-left: 8rem !important;
}

.m-33 {
    margin: 8.25rem !important;
}

.mt-33,
.my-33 {
    margin-top: 8.25rem !important;
}

.mr-33,
.mx-33 {
    margin-right: 8.25rem !important;
}

.mb-33,
.my-33 {
    margin-bottom: 8.25rem !important;
}

.ml-33,
.mx-33 {
    margin-left: 8.25rem !important;
}

.m-34 {
    margin: 8.5rem !important;
}

.mt-34,
.my-34 {
    margin-top: 8.5rem !important;
}

.mr-34,
.mx-34 {
    margin-right: 8.5rem !important;
}

.mb-34,
.my-34 {
    margin-bottom: 8.5rem !important;
}

.ml-34,
.mx-34 {
    margin-left: 8.5rem !important;
}

.m-35 {
    margin: 8.75rem !important;
}

.mt-35,
.my-35 {
    margin-top: 8.75rem !important;
}

.mr-35,
.mx-35 {
    margin-right: 8.75rem !important;
}

.mb-35,
.my-35 {
    margin-bottom: 8.75rem !important;
}

.ml-35,
.mx-35 {
    margin-left: 8.75rem !important;
}

.m-36 {
    margin: 9rem !important;
}

.mt-36,
.my-36 {
    margin-top: 9rem !important;
}

.mr-36,
.mx-36 {
    margin-right: 9rem !important;
}

.mb-36,
.my-36 {
    margin-bottom: 9rem !important;
}

.ml-36,
.mx-36 {
    margin-left: 9rem !important;
}

.m-37 {
    margin: 9.25rem !important;
}

.mt-37,
.my-37 {
    margin-top: 9.25rem !important;
}

.mr-37,
.mx-37 {
    margin-right: 9.25rem !important;
}

.mb-37,
.my-37 {
    margin-bottom: 9.25rem !important;
}

.ml-37,
.mx-37 {
    margin-left: 9.25rem !important;
}

.m-48 {
    margin: 9.5rem !important;
}

.mt-48,
.my-48 {
    margin-top: 9.5rem !important;
}

.mr-48,
.mx-48 {
    margin-right: 9.5rem !important;
}

.mb-48,
.my-48 {
    margin-bottom: 9.5rem !important;
}

.ml-48,
.mx-48 {
    margin-left: 9.5rem !important;
}

.m-39 {
    margin: 9.75rem !important;
}

.mt-39,
.my-39 {
    margin-top: 9.75rem !important;
}

.mr-39,
.mx-39 {
    margin-right: 9.75rem !important;
}

.mb-39,
.my-39 {
    margin-bottom: 9.75rem !important;
}

.ml-39,
.mx-39 {
    margin-left: 9.75rem !important;
}

.m-40 {
    margin: 10rem !important;
}

.mt-40,
.my-40 {
    margin-top: 10rem !important;
}

.mr-40,
.mx-40 {
    margin-right: 10rem !important;
}

.mb-40,
.my-40 {
    margin-bottom: 10rem !important;
}

.ml-40,
.mx-40 {
    margin-left: 10rem !important;
}

.p-0 {
    padding: 0 !important;
}

.pt-0,
.py-0 {
    padding-top: 0 !important;
}

.pr-0,
.px-0 {
    padding-right: 0 !important;
}

.pb-0,
.py-0 {
    padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
    padding-left: 0 !important;
}

.p-1 {
    padding: 0.25rem !important;
}

.pt-1,
.py-1 {
    padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
    padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
    padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
    padding-left: 0.25rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.pt-2,
.py-2 {
    padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
    padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
    padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
    padding-left: 0.5rem !important;
}

.p-3 {
    padding: 0.75rem !important;
}

.pt-3,
.py-3 {
    padding-top: 0.75rem !important;
}

.pr-3,
.px-3 {
    padding-right: 0.75rem !important;
}

.pb-3,
.py-3 {
    padding-bottom: 0.75rem !important;
}

.pl-3,
.px-3 {
    padding-left: 0.75rem !important;
}

.p-4 {
    padding: 1rem !important;
}

.pt-4,
.py-4 {
    padding-top: 1rem !important;
}

.pr-4,
.px-4 {
    padding-right: 1rem !important;
}

.pb-4,
.py-4 {
    padding-bottom: 1rem !important;
}

.pl-4,
.px-4 {
    padding-left: 1rem !important;
}

.p-5 {
    padding: 1.25rem !important;
}

.pt-5,
.py-5 {
    padding-top: 1.25rem !important;
}

.pr-5,
.px-5 {
    padding-right: 1.25rem !important;
}

.pb-5,
.py-5 {
    padding-bottom: 1.25rem !important;
}

.pl-5,
.px-5 {
    padding-left: 1.25rem !important;
}

.p-6 {
    padding: 1.5rem !important;
}

.pt-6,
.py-6 {
    padding-top: 1.5rem !important;
}

.pr-6,
.px-6 {
    padding-right: 1.5rem !important;
}

.pb-6,
.py-6 {
    padding-bottom: 1.5rem !important;
}

.pl-6,
.px-6 {
    padding-left: 1.5rem !important;
}

.p-7 {
    padding: 1.75rem !important;
}

.pt-7,
.py-7 {
    padding-top: 1.75rem !important;
}

.pr-7,
.px-7 {
    padding-right: 1.75rem !important;
}

.pb-7,
.py-7 {
    padding-bottom: 1.75rem !important;
}

.pl-7,
.px-7 {
    padding-left: 1.75rem !important;
}

.p-8 {
    padding: 2rem !important;
}

.pt-8,
.py-8 {
    padding-top: 2rem !important;
}

.pr-8,
.px-8 {
    padding-right: 2rem !important;
}

.pb-8,
.py-8 {
    padding-bottom: 2rem !important;
}

.pl-8,
.px-8 {
    padding-left: 2rem !important;
}

.p-9 {
    padding: 2.25rem !important;
}

.pt-9,
.py-9 {
    padding-top: 2.25rem !important;
}

.pr-9,
.px-9 {
    padding-right: 2.25rem !important;
}

.pb-9,
.py-9 {
    padding-bottom: 2.25rem !important;
}

.pl-9,
.px-9 {
    padding-left: 2.25rem !important;
}

.p-10 {
    padding: 2.5rem !important;
}

.pt-10,
.py-10 {
    padding-top: 2.5rem !important;
}

.pr-10,
.px-10 {
    padding-right: 2.5rem !important;
}

.pb-10,
.py-10 {
    padding-bottom: 2.5rem !important;
}

.pl-10,
.px-10 {
    padding-left: 2.5rem !important;
}

.p-11 {
    padding: 2.75rem !important;
}

.pt-11,
.py-11 {
    padding-top: 2.75rem !important;
}

.pr-11,
.px-11 {
    padding-right: 2.75rem !important;
}

.pb-11,
.py-11 {
    padding-bottom: 2.75rem !important;
}

.pl-11,
.px-11 {
    padding-left: 2.75rem !important;
}

.p-12 {
    padding: 3rem !important;
}

.pt-12,
.py-12 {
    padding-top: 3rem !important;
}

.pr-12,
.px-12 {
    padding-right: 3rem !important;
}

.pb-12,
.py-12 {
    padding-bottom: 3rem !important;
}

.pl-12,
.px-12 {
    padding-left: 3rem !important;
}

.p-13 {
    padding: 3.25rem !important;
}

.pt-13,
.py-13 {
    padding-top: 3.25rem !important;
}

.pr-13,
.px-13 {
    padding-right: 3.25rem !important;
}

.pb-13,
.py-13 {
    padding-bottom: 3.25rem !important;
}

.pl-13,
.px-13 {
    padding-left: 3.25rem !important;
}

.p-14 {
    padding: 3.5rem !important;
}

.pt-14,
.py-14 {
    padding-top: 3.5rem !important;
}

.pr-14,
.px-14 {
    padding-right: 3.5rem !important;
}

.pb-14,
.py-14 {
    padding-bottom: 3.5rem !important;
}

.pl-14,
.px-14 {
    padding-left: 3.5rem !important;
}

.p-15 {
    padding: 3.75rem !important;
}

.pt-15,
.py-15 {
    padding-top: 3.75rem !important;
}

.pr-15,
.px-15 {
    padding-right: 3.75rem !important;
}

.pb-15,
.py-15 {
    padding-bottom: 3.75rem !important;
}

.pl-15,
.px-15 {
    padding-left: 3.75rem !important;
}

.p-16 {
    padding: 4rem !important;
}

.pt-16,
.py-16 {
    padding-top: 4rem !important;
}

.pr-16,
.px-16 {
    padding-right: 4rem !important;
}

.pb-16,
.py-16 {
    padding-bottom: 4rem !important;
}

.pl-16,
.px-16 {
    padding-left: 4rem !important;
}

.p-17 {
    padding: 4.25rem !important;
}

.pt-17,
.py-17 {
    padding-top: 4.25rem !important;
}

.pr-17,
.px-17 {
    padding-right: 4.25rem !important;
}

.pb-17,
.py-17 {
    padding-bottom: 4.25rem !important;
}

.pl-17,
.px-17 {
    padding-left: 4.25rem !important;
}

.p-18 {
    padding: 4.5rem !important;
}

.pt-18,
.py-18 {
    padding-top: 4.5rem !important;
}

.pr-18,
.px-18 {
    padding-right: 4.5rem !important;
}

.pb-18,
.py-18 {
    padding-bottom: 4.5rem !important;
}

.pl-18,
.px-18 {
    padding-left: 4.5rem !important;
}

.p-19 {
    padding: 4.75rem !important;
}

.pt-19,
.py-19 {
    padding-top: 4.75rem !important;
}

.pr-19,
.px-19 {
    padding-right: 4.75rem !important;
}

.pb-19,
.py-19 {
    padding-bottom: 4.75rem !important;
}

.pl-19,
.px-19 {
    padding-left: 4.75rem !important;
}

.p-20 {
    padding: 5rem !important;
}

.pt-20,
.py-20 {
    padding-top: 5rem !important;
}

.pr-20,
.px-20 {
    padding-right: 5rem !important;
}

.pb-20,
.py-20 {
    padding-bottom: 5rem !important;
}

.pl-20,
.px-20 {
    padding-left: 5rem !important;
}

.p-21 {
    padding: 5.25rem !important;
}

.pt-21,
.py-21 {
    padding-top: 5.25rem !important;
}

.pr-21,
.px-21 {
    padding-right: 5.25rem !important;
}

.pb-21,
.py-21 {
    padding-bottom: 5.25rem !important;
}

.pl-21,
.px-21 {
    padding-left: 5.25rem !important;
}

.p-22 {
    padding: 5.5rem !important;
}

.pt-22,
.py-22 {
    padding-top: 5.5rem !important;
}

.pr-22,
.px-22 {
    padding-right: 5.5rem !important;
}

.pb-22,
.py-22 {
    padding-bottom: 5.5rem !important;
}

.pl-22,
.px-22 {
    padding-left: 5.5rem !important;
}

.p-23 {
    padding: 5.75rem !important;
}

.pt-23,
.py-23 {
    padding-top: 5.75rem !important;
}

.pr-23,
.px-23 {
    padding-right: 5.75rem !important;
}

.pb-23,
.py-23 {
    padding-bottom: 5.75rem !important;
}

.pl-23,
.px-23 {
    padding-left: 5.75rem !important;
}

.p-24 {
    padding: 6rem !important;
}

.pt-24,
.py-24 {
    padding-top: 6rem !important;
}

.pr-24,
.px-24 {
    padding-right: 6rem !important;
}

.pb-24,
.py-24 {
    padding-bottom: 6rem !important;
}

.pl-24,
.px-24 {
    padding-left: 6rem !important;
}

.p-25 {
    padding: 6.25rem !important;
}

.pt-25,
.py-25 {
    padding-top: 6.25rem !important;
}

.pr-25,
.px-25 {
    padding-right: 6.25rem !important;
}

.pb-25,
.py-25 {
    padding-bottom: 6.25rem !important;
}

.pl-25,
.px-25 {
    padding-left: 6.25rem !important;
}

.p-26 {
    padding: 6.5rem !important;
}

.pt-26,
.py-26 {
    padding-top: 6.5rem !important;
}

.pr-26,
.px-26 {
    padding-right: 6.5rem !important;
}

.pb-26,
.py-26 {
    padding-bottom: 6.5rem !important;
}

.pl-26,
.px-26 {
    padding-left: 6.5rem !important;
}

.p-27 {
    padding: 6.75rem !important;
}

.pt-27,
.py-27 {
    padding-top: 6.75rem !important;
}

.pr-27,
.px-27 {
    padding-right: 6.75rem !important;
}

.pb-27,
.py-27 {
    padding-bottom: 6.75rem !important;
}

.pl-27,
.px-27 {
    padding-left: 6.75rem !important;
}

.p-28 {
    padding: 7rem !important;
}

.pt-28,
.py-28 {
    padding-top: 7rem !important;
}

.pr-28,
.px-28 {
    padding-right: 7rem !important;
}

.pb-28,
.py-28 {
    padding-bottom: 7rem !important;
}

.pl-28,
.px-28 {
    padding-left: 7rem !important;
}

.p-29 {
    padding: 7.25rem !important;
}

.pt-29,
.py-29 {
    padding-top: 7.25rem !important;
}

.pr-29,
.px-29 {
    padding-right: 7.25rem !important;
}

.pb-29,
.py-29 {
    padding-bottom: 7.25rem !important;
}

.pl-29,
.px-29 {
    padding-left: 7.25rem !important;
}

.p-30 {
    padding: 7.5rem !important;
}

.pt-30,
.py-30 {
    padding-top: 7.5rem !important;
}

.pr-30,
.px-30 {
    padding-right: 7.5rem !important;
}

.pb-30,
.py-30 {
    padding-bottom: 7.5rem !important;
}

.pl-30,
.px-30 {
    padding-left: 7.5rem !important;
}

.p-31 {
    padding: 7.75rem !important;
}

.pt-31,
.py-31 {
    padding-top: 7.75rem !important;
}

.pr-31,
.px-31 {
    padding-right: 7.75rem !important;
}

.pb-31,
.py-31 {
    padding-bottom: 7.75rem !important;
}

.pl-31,
.px-31 {
    padding-left: 7.75rem !important;
}

.p-32 {
    padding: 8rem !important;
}

.pt-32,
.py-32 {
    padding-top: 8rem !important;
}

.pr-32,
.px-32 {
    padding-right: 8rem !important;
}

.pb-32,
.py-32 {
    padding-bottom: 8rem !important;
}

.pl-32,
.px-32 {
    padding-left: 8rem !important;
}

.p-33 {
    padding: 8.25rem !important;
}

.pt-33,
.py-33 {
    padding-top: 8.25rem !important;
}

.pr-33,
.px-33 {
    padding-right: 8.25rem !important;
}

.pb-33,
.py-33 {
    padding-bottom: 8.25rem !important;
}

.pl-33,
.px-33 {
    padding-left: 8.25rem !important;
}

.p-34 {
    padding: 8.5rem !important;
}

.pt-34,
.py-34 {
    padding-top: 8.5rem !important;
}

.pr-34,
.px-34 {
    padding-right: 8.5rem !important;
}

.pb-34,
.py-34 {
    padding-bottom: 8.5rem !important;
}

.pl-34,
.px-34 {
    padding-left: 8.5rem !important;
}

.p-35 {
    padding: 8.75rem !important;
}

.pt-35,
.py-35 {
    padding-top: 8.75rem !important;
}

.pr-35,
.px-35 {
    padding-right: 8.75rem !important;
}

.pb-35,
.py-35 {
    padding-bottom: 8.75rem !important;
}

.pl-35,
.px-35 {
    padding-left: 8.75rem !important;
}

.p-36 {
    padding: 9rem !important;
}

.pt-36,
.py-36 {
    padding-top: 9rem !important;
}

.pr-36,
.px-36 {
    padding-right: 9rem !important;
}

.pb-36,
.py-36 {
    padding-bottom: 9rem !important;
}

.pl-36,
.px-36 {
    padding-left: 9rem !important;
}

.p-37 {
    padding: 9.25rem !important;
}

.pt-37,
.py-37 {
    padding-top: 9.25rem !important;
}

.pr-37,
.px-37 {
    padding-right: 9.25rem !important;
}

.pb-37,
.py-37 {
    padding-bottom: 9.25rem !important;
}

.pl-37,
.px-37 {
    padding-left: 9.25rem !important;
}

.p-48 {
    padding: 9.5rem !important;
}

.pt-48,
.py-48 {
    padding-top: 9.5rem !important;
}

.pr-48,
.px-48 {
    padding-right: 9.5rem !important;
}

.pb-48,
.py-48 {
    padding-bottom: 9.5rem !important;
}

.pl-48,
.px-48 {
    padding-left: 9.5rem !important;
}

.p-39 {
    padding: 9.75rem !important;
}

.pt-39,
.py-39 {
    padding-top: 9.75rem !important;
}

.pr-39,
.px-39 {
    padding-right: 9.75rem !important;
}

.pb-39,
.py-39 {
    padding-bottom: 9.75rem !important;
}

.pl-39,
.px-39 {
    padding-left: 9.75rem !important;
}

.p-40 {
    padding: 10rem !important;
}

.pt-40,
.py-40 {
    padding-top: 10rem !important;
}

.pr-40,
.px-40 {
    padding-right: 10rem !important;
}

.pb-40,
.py-40 {
    padding-bottom: 10rem !important;
}

.pl-40,
.px-40 {
    padding-left: 10rem !important;
}



/*!
 * three-dots - v0.3.2
 * CSS loading animations made with single element
 * https://nzbin.github.io/three-dots/
 *
 * Copyright (c) 2018 nzbin
 * Released under MIT License
 */
@charset "UTF-8";
/**
 * ==============================================
 * Dot Elastic
 * ==============================================
 */
.dot-elastic {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    animation: dot-elastic 1s infinite linear;
}

    .dot-elastic::before, .dot-elastic::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-elastic::before {
        left: -15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-elastic-before 1s infinite linear;
    }

    .dot-elastic::after {
        left: 15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-elastic-after 1s infinite linear;
    }

@keyframes dot-elastic-before {
    0% {
        transform: scale(1, 1);
    }

    25% {
        transform: scale(1, 1.5);
    }

    50% {
        transform: scale(1, 0.67);
    }

    75% {
        transform: scale(1, 1);
    }

    100% {
        transform: scale(1, 1);
    }
}

@keyframes dot-elastic {
    0% {
        transform: scale(1, 1);
    }

    25% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(1, 1.5);
    }

    75% {
        transform: scale(1, 1);
    }

    100% {
        transform: scale(1, 1);
    }
}

@keyframes dot-elastic-after {
    0% {
        transform: scale(1, 1);
    }

    25% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(1, 0.67);
    }

    75% {
        transform: scale(1, 1.5);
    }

    100% {
        transform: scale(1, 1);
    }
}
/**
 * ==============================================
 * Dot Pulse
 * ==============================================
 */
.dot-pulse {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9999px 0 0 -5px;
    animation: dot-pulse 1.5s infinite linear;
    animation-delay: 0.25s;
}

    .dot-pulse::before, .dot-pulse::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
    }

    .dot-pulse::before {
        box-shadow: 9984px 0 0 -5px;
        animation: dot-pulse-before 1.5s infinite linear;
        animation-delay: 0s;
    }

    .dot-pulse::after {
        box-shadow: 10014px 0 0 -5px;
        animation: dot-pulse-after 1.5s infinite linear;
        animation-delay: 0.5s;
    }

@keyframes dot-pulse-before {
    0% {
        box-shadow: 9984px 0 0 -5px;
    }

    30% {
        box-shadow: 9984px 0 0 2px;
    }

    60%, 100% {
        box-shadow: 9984px 0 0 -5px;
    }
}

@keyframes dot-pulse {
    0% {
        box-shadow: 9999px 0 0 -5px;
    }

    30% {
        box-shadow: 9999px 0 0 2px;
    }

    60%, 100% {
        box-shadow: 9999px 0 0 -5px;
    }
}

@keyframes dot-pulse-after {
    0% {
        box-shadow: 10014px 0 0 -5px;
    }

    30% {
        box-shadow: 10014px 0 0 2px;
    }

    60%, 100% {
        box-shadow: 10014px 0 0 -5px;
    }
}
/**
 * ==============================================
 * Dot Flashing
 * ==============================================
 */
.dot-flashing {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    animation: dot-flashing 1s infinite linear alternate;
    animation-delay: 0.5s;
}

    .dot-flashing::before, .dot-flashing::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-flashing::before {
        left: -15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-flashing 1s infinite alternate;
        animation-delay: 0s;
    }

    .dot-flashing::after {
        left: 15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-flashing 1s infinite alternate;
        animation-delay: 1s;
    }

@keyframes dot-flashing {
    0% {
        background-color: #9880ff;
    }

    50%, 100% {
        background-color: rgba(152, 128, 255, 0.2);
    }
}
/**
 * ==============================================
 * Dot Collision
 * ==============================================
 */
.dot-collision {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
}

    .dot-collision::before, .dot-collision::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-collision::before {
        left: -10px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-collision-before 2s infinite ease-in;
    }

    .dot-collision::after {
        left: 10px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-collision-after 2s infinite ease-in;
        animation-delay: 1s;
    }

@keyframes dot-collision-before {
    0%, 50%, 75%, 100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-15px);
    }
}

@keyframes dot-collision-after {
    0%, 50%, 75%, 100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(15px);
    }
}
/**
 * ==============================================
 * Dot Revolution
 * ==============================================
 */
.dot-revolution {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
}

    .dot-revolution::before, .dot-revolution::after {
        content: "";
        display: inline-block;
        position: absolute;
    }

    .dot-revolution::before {
        left: 0;
        top: -15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        transform-origin: 5px 20px;
        animation: dot-revolution 1.4s linear infinite;
    }

    .dot-revolution::after {
        left: 0;
        top: -30px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        transform-origin: 5px 35px;
        animation: dot-revolution 1s linear infinite;
    }

@keyframes dot-revolution {
    0% {
        transform: rotateZ(0deg) translate3d(0, 0, 0);
    }

    100% {
        transform: rotateZ(360deg) translate3d(0, 0, 0);
    }
}
/**
 * ==============================================
 * Dot Carousel
 * ==============================================
 */
.dot-carousel {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    animation: dot-carousel 1.5s infinite linear;
}

@keyframes dot-carousel {
    0% {
        box-shadow: 9984px 0 0 -1px #9880ff, 9999px 0 0 1px #9880ff, 10014px 0 0 -1px #9880ff;
    }

    50% {
        box-shadow: 10014px 0 0 -1px #9880ff, 9984px 0 0 -1px #9880ff, 9999px 0 0 1px #9880ff;
    }

    100% {
        box-shadow: 9999px 0 0 1px #9880ff, 10014px 0 0 -1px #9880ff, 9984px 0 0 -1px #9880ff;
    }
}
/**
 * ==============================================
 * Dot Typing
 * ==============================================
 */
.dot-typing {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    animation: dot-typing 1.5s infinite linear;
}

@keyframes dot-typing {
    0% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    16.667% {
        box-shadow: 9984px -10px 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    33.333% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    50% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px -10px 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    66.667% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    83.333% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px -10px 0 0 #9880ff;
    }

    100% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }
}
/**
 * ==============================================
 * Dot Windmill
 * ==============================================
 */
.dot-windmill {
    position: relative;
    top: -10px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    transform-origin: 5px 15px;
    animation: dot-windmill 2s infinite linear;
}

    .dot-windmill::before, .dot-windmill::after {
        content: "";
        display: inline-block;
        position: absolute;
    }

    .dot-windmill::before {
        left: -8.66254px;
        top: 15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
    }

    .dot-windmill::after {
        left: 8.66254px;
        top: 15px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
    }

@keyframes dot-windmill {
    0% {
        transform: rotateZ(0deg) translate3d(0, 0, 0);
    }

    100% {
        transform: rotateZ(720deg) translate3d(0, 0, 0);
    }
}
/**
 * ==============================================
 * Dot Bricks
 * ==============================================
 */
.dot-bricks {
    position: relative;
    top: 8px;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9991px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff, 10007px 0 0 0 #9880ff;
    animation: dot-bricks 2s infinite ease;
}

@keyframes dot-bricks {
    0% {
        box-shadow: 9991px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff, 10007px 0 0 0 #9880ff;
    }

    8.333% {
        box-shadow: 10007px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff, 10007px 0 0 0 #9880ff;
    }

    16.667% {
        box-shadow: 10007px -16px 0 0 #9880ff, 9991px -16px 0 0 #9880ff, 10007px 0 0 0 #9880ff;
    }

    25% {
        box-shadow: 10007px -16px 0 0 #9880ff, 9991px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff;
    }

    33.333% {
        box-shadow: 10007px 0 0 0 #9880ff, 9991px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff;
    }

    41.667% {
        box-shadow: 10007px 0 0 0 #9880ff, 10007px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff;
    }

    50% {
        box-shadow: 10007px 0 0 0 #9880ff, 10007px -16px 0 0 #9880ff, 9991px -16px 0 0 #9880ff;
    }

    58.333% {
        box-shadow: 9991px 0 0 0 #9880ff, 10007px -16px 0 0 #9880ff, 9991px -16px 0 0 #9880ff;
    }

    66.666% {
        box-shadow: 9991px 0 0 0 #9880ff, 10007px 0 0 0 #9880ff, 9991px -16px 0 0 #9880ff;
    }

    75% {
        box-shadow: 9991px 0 0 0 #9880ff, 10007px 0 0 0 #9880ff, 10007px -16px 0 0 #9880ff;
    }

    83.333% {
        box-shadow: 9991px -16px 0 0 #9880ff, 10007px 0 0 0 #9880ff, 10007px -16px 0 0 #9880ff;
    }

    91.667% {
        box-shadow: 9991px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff, 10007px -16px 0 0 #9880ff;
    }

    100% {
        box-shadow: 9991px -16px 0 0 #9880ff, 9991px 0 0 0 #9880ff, 10007px 0 0 0 #9880ff;
    }
}
/**
 * ==============================================
 * Dot Floating
 * ==============================================
 */
.dot-floating {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    animation: dot-floating 3s infinite cubic-bezier(0.15, 0.6, 0.9, 0.1);
}

    .dot-floating::before, .dot-floating::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-floating::before {
        left: -12px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-floating-before 3s infinite ease-in-out;
    }

    .dot-floating::after {
        left: -24px;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-floating-after 3s infinite cubic-bezier(0.4, 0, 1, 1);
    }

@keyframes dot-floating {
    0% {
        left: calc(-50% - 5px);
    }

    75% {
        left: calc(50% + 105px);
    }

    100% {
        left: calc(50% + 105px);
    }
}

@keyframes dot-floating-before {
    0% {
        left: -50px;
    }

    50% {
        left: -12px;
    }

    75% {
        left: -50px;
    }

    100% {
        left: -50px;
    }
}

@keyframes dot-floating-after {
    0% {
        left: -100px;
    }

    50% {
        left: -24px;
    }

    75% {
        left: -100px;
    }

    100% {
        left: -100px;
    }
}
/**
 * ==============================================
 * Dot Fire
 * ==============================================
 */
.dot-fire {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9999px 22.5px 0 -5px #9880ff;
    animation: dot-fire 1.5s infinite linear;
    animation-delay: -0.85s;
}

    .dot-fire::before, .dot-fire::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
    }

    .dot-fire::before {
        box-shadow: 9999px 22.5px 0 -5px #9880ff;
        animation: dot-fire 1.5s infinite linear;
        animation-delay: -1.85s;
    }

    .dot-fire::after {
        box-shadow: 9999px 22.5px 0 -5px #9880ff;
        animation: dot-fire 1.5s infinite linear;
        animation-delay: -2.85s;
    }

@keyframes dot-fire {
    1% {
        box-shadow: 9999px 22.5px 0 -5px #9880ff;
    }

    50% {
        box-shadow: 9999px -5.625px 0 2px #9880ff;
    }

    100% {
        box-shadow: 9999px -22.5px 0 -5px #9880ff;
    }
}
/**
 * ==============================================
 * Dot Spin
 * ==============================================
 */
.dot-spin {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: transparent;
    color: transparent;
    box-shadow: 0 -18px 0 0 #9880ff, 12.727926px -12.727926px 0 0 #9880ff, 18px 0 0 0 #9880ff, 12.727926px 12.727926px 0 0 rgba(152, 128, 255, 0), 0 18px 0 0 rgba(152, 128, 255, 0), -12.727926px 12.727926px 0 0 rgba(152, 128, 255, 0), -18px 0 0 0 rgba(152, 128, 255, 0), -12.727926px -12.727926px 0 0 rgba(152, 128, 255, 0);
    animation: dot-spin 1.5s infinite linear;
}

@keyframes dot-spin {
    0%, 100% {
        box-shadow: 0 -18px 0 0 #9880ff, 12.727926px -12.727926px 0 0 #9880ff, 18px 0 0 0 #9880ff, 12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), 0 18px 0 -5px rgba(152, 128, 255, 0), -12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), -18px 0 0 -5px rgba(152, 128, 255, 0), -12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0);
    }

    12.5% {
        box-shadow: 0 -18px 0 -5px rgba(152, 128, 255, 0), 12.727926px -12.727926px 0 0 #9880ff, 18px 0 0 0 #9880ff, 12.727926px 12.727926px 0 0 #9880ff, 0 18px 0 -5px rgba(152, 128, 255, 0), -12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), -18px 0 0 -5px rgba(152, 128, 255, 0), -12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0);
    }

    25% {
        box-shadow: 0 -18px 0 -5px rgba(152, 128, 255, 0), 12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0), 18px 0 0 0 #9880ff, 12.727926px 12.727926px 0 0 #9880ff, 0 18px 0 0 #9880ff, -12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), -18px 0 0 -5px rgba(152, 128, 255, 0), -12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0);
    }

    37.5% {
        box-shadow: 0 -18px 0 -5px rgba(152, 128, 255, 0), 12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0), 18px 0 0 -5px rgba(152, 128, 255, 0), 12.727926px 12.727926px 0 0 #9880ff, 0 18px 0 0 #9880ff, -12.727926px 12.727926px 0 0 #9880ff, -18px 0 0 -5px rgba(152, 128, 255, 0), -12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0);
    }

    50% {
        box-shadow: 0 -18px 0 -5px rgba(152, 128, 255, 0), 12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0), 18px 0 0 -5px rgba(152, 128, 255, 0), 12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), 0 18px 0 0 #9880ff, -12.727926px 12.727926px 0 0 #9880ff, -18px 0 0 0 #9880ff, -12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0);
    }

    62.5% {
        box-shadow: 0 -18px 0 -5px rgba(152, 128, 255, 0), 12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0), 18px 0 0 -5px rgba(152, 128, 255, 0), 12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), 0 18px 0 -5px rgba(152, 128, 255, 0), -12.727926px 12.727926px 0 0 #9880ff, -18px 0 0 0 #9880ff, -12.727926px -12.727926px 0 0 #9880ff;
    }

    75% {
        box-shadow: 0 -18px 0 0 #9880ff, 12.727926px -12.727926px 0 -5px rgba(152, 128, 255, 0), 18px 0 0 -5px rgba(152, 128, 255, 0), 12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), 0 18px 0 -5px rgba(152, 128, 255, 0), -12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), -18px 0 0 0 #9880ff, -12.727926px -12.727926px 0 0 #9880ff;
    }

    87.5% {
        box-shadow: 0 -18px 0 0 #9880ff, 12.727926px -12.727926px 0 0 #9880ff, 18px 0 0 -5px rgba(152, 128, 255, 0), 12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), 0 18px 0 -5px rgba(152, 128, 255, 0), -12.727926px 12.727926px 0 -5px rgba(152, 128, 255, 0), -18px 0 0 -5px rgba(152, 128, 255, 0), -12.727926px -12.727926px 0 0 #9880ff;
    }
}
/**
 * ==============================================
 * Dot Falling
 * ==============================================
 */
.dot-falling {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9999px 0 0 0 #9880ff;
    animation: dot-falling 1s infinite linear;
    animation-delay: 0.1s;
}

    .dot-falling::before, .dot-falling::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-falling::before {
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-falling-before 1s infinite linear;
        animation-delay: 0s;
    }

    .dot-falling::after {
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-falling-after 1s infinite linear;
        animation-delay: 0.2s;
    }

@keyframes dot-falling {
    0% {
        box-shadow: 9999px -15px 0 0 rgba(152, 128, 255, 0);
    }

    25%, 50%, 75% {
        box-shadow: 9999px 0 0 0 #9880ff;
    }

    100% {
        box-shadow: 9999px 15px 0 0 rgba(152, 128, 255, 0);
    }
}

@keyframes dot-falling-before {
    0% {
        box-shadow: 9984px -15px 0 0 rgba(152, 128, 255, 0);
    }

    25%, 50%, 75% {
        box-shadow: 9984px 0 0 0 #9880ff;
    }

    100% {
        box-shadow: 9984px 15px 0 0 rgba(152, 128, 255, 0);
    }
}

@keyframes dot-falling-after {
    0% {
        box-shadow: 10014px -15px 0 0 rgba(152, 128, 255, 0);
    }

    25%, 50%, 75% {
        box-shadow: 10014px 0 0 0 #9880ff;
    }

    100% {
        box-shadow: 10014px 15px 0 0 rgba(152, 128, 255, 0);
    }
}
/**
 * ==============================================
 * Dot Stretching
 * ==============================================
 */
.dot-stretching {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    transform: scale(1.25, 1.25);
    animation: dot-stretching 2s infinite ease-in;
}

    .dot-stretching::before, .dot-stretching::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-stretching::before {
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-stretching-before 2s infinite ease-in;
    }

    .dot-stretching::after {
        width: 10px;
        height: 10px;
        border-radius: 5px;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-stretching-after 2s infinite ease-in;
    }

@keyframes dot-stretching {
    0% {
        transform: scale(1.25, 1.25);
    }

    50%, 60% {
        transform: scale(0.8, 0.8);
    }

    100% {
        transform: scale(1.25, 1.25);
    }
}

@keyframes dot-stretching-before {
    0% {
        transform: translate(0) scale(0.7, 0.7);
    }

    50%, 60% {
        transform: translate(-20px) scale(1, 1);
    }

    100% {
        transform: translate(0) scale(0.7, 0.7);
    }
}

@keyframes dot-stretching-after {
    0% {
        transform: translate(0) scale(0.7, 0.7);
    }

    50%, 60% {
        transform: translate(20px) scale(1, 1);
    }

    100% {
        transform: translate(0) scale(0.7, 0.7);
    }
}
/**
 * ==============================================
 * Experimental: Gooey Effect
 * Dot Gathering
 * ==============================================
 */
.dot-gathering {
    position: relative;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: hsl(0deg, 100%, 0%);
    color: transparent;
    margin: -1px 0;
    filter: blur(2px);
}

    .dot-gathering::before, .dot-gathering::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        left: -50px;
        width: 12px;
        height: 12px;
        border-radius: 6px;
        background-color: hsl(0deg, 100%, 0%);
        color: transparent;
        opacity: 0;
        filter: blur(2px);
        animation: dot-gathering 2s infinite ease-in;
    }

    .dot-gathering::after {
        animation-delay: 0.5s;
    }

@keyframes dot-gathering {
    0% {
        opacity: 0;
        transform: translateX(0);
    }

    35%, 60% {
        opacity: 1;
        transform: translateX(50px);
    }

    100% {
        opacity: 0;
        transform: translateX(100px);
    }
}
/**
 * ==============================================
 * Experimental: Gooey Effect
 * Dot Hourglass
 * ==============================================
 */
.dot-hourglass {
    position: relative;
    top: -15px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: hsl(0deg, 100%, 0%);
    color: transparent;
    margin: -1px 0;
    filter: blur(2px);
    transform-origin: 5px 20px;
    animation: dot-hourglass 2.4s infinite ease-in-out;
    animation-delay: 0.6s;
}

    .dot-hourglass::before, .dot-hourglass::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        width: 12px;
        height: 12px;
        border-radius: 6px;
        background-color: hsl(0deg, 100%, 0%);
        color: transparent;
        filter: blur(2px);
    }

    .dot-hourglass::before {
        top: 30px;
    }

    .dot-hourglass::after {
        animation: dot-hourglass-after 2.4s infinite cubic-bezier(0.65, 0.05, 0.36, 1);
    }

@keyframes dot-hourglass {
    0% {
        transform: rotateZ(0deg);
    }

    25% {
        transform: rotateZ(180deg);
    }

    50% {
        transform: rotateZ(180deg);
    }

    75% {
        transform: rotateZ(360deg);
    }

    100% {
        transform: rotateZ(360deg);
    }
}

@keyframes dot-hourglass-after {
    0% {
        transform: translateY(0);
    }

    25% {
        transform: translateY(30px);
    }

    50% {
        transform: translateY(30px);
    }

    75% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(0);
    }
}
/**
 * ==============================================
 * Experimental: Gooey Effect
 * Dot Overtaking
 * ==============================================
 */
.dot-overtaking {
    position: relative;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: transparent;
    color: hsl(0deg, 100%, 0%);
    margin: -1px 0;
    box-shadow: 0 -20px 0 0;
    filter: blur(2px);
    animation: dot-overtaking 2s infinite cubic-bezier(0.2, 0.6, 0.8, 0.2);
}

    .dot-overtaking::before, .dot-overtaking::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        width: 12px;
        height: 12px;
        border-radius: 6px;
        background-color: transparent;
        color: hsl(0deg, 100%, 0%);
        box-shadow: 0 -20px 0 0;
        filter: blur(2px);
    }

    .dot-overtaking::before {
        animation: dot-overtaking 2s infinite cubic-bezier(0.2, 0.6, 0.8, 0.2);
        animation-delay: 0.3s;
    }

    .dot-overtaking::after {
        animation: dot-overtaking 1.5s infinite cubic-bezier(0.2, 0.6, 0.8, 0.2);
        animation-delay: 0.6s;
    }

@keyframes dot-overtaking {
    0% {
        transform: rotateZ(0deg);
    }

    100% {
        transform: rotateZ(360deg);
    }
}
/**
 * ==============================================
 * Experimental: Gooey Effect
 * Dot Shuttle
 * ==============================================
 */
.dot-shuttle {
    position: relative;
    left: -15px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: hsl(0deg, 100%, 0%);
    color: transparent;
    margin: -1px 0;
    filter: blur(2px);
}

    .dot-shuttle::before, .dot-shuttle::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        width: 12px;
        height: 12px;
        border-radius: 6px;
        background-color: hsl(0deg, 100%, 0%);
        color: transparent;
        filter: blur(2px);
    }

    .dot-shuttle::before {
        left: 15px;
        animation: dot-shuttle 2s infinite ease-out;
    }

    .dot-shuttle::after {
        left: 30px;
    }

@keyframes dot-shuttle {
    0%, 50%, 100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-45px);
    }

    75% {
        transform: translateX(45px);
    }
}
/**
 * ==============================================
 * Experimental: Emoji
 * Dot Bouncing
 * ==============================================
 */
.dot-bouncing {
    position: relative;
    height: 10px;
    font-size: 10px;
}

    .dot-bouncing::before {
        content: "⚽🏀🏐";
        display: inline-block;
        position: relative;
        animation: dot-bouncing 1s infinite;
    }

@keyframes dot-bouncing {
    0% {
        top: -20px;
        animation-timing-function: ease-in;
    }

    34% {
        transform: scale(1, 1);
    }

    35% {
        top: 20px;
        animation-timing-function: ease-out;
        transform: scale(1.5, 0.5);
    }

    45% {
        transform: scale(1, 1);
    }

    90% {
        top: -20px;
    }

    100% {
        top: -20px;
    }
}
/**
 * ==============================================
 * Experimental: Emoji
 * Dot Rolling
 * ==============================================
 */
.dot-rolling {
    position: relative;
    height: 10px;
    font-size: 10px;
}

    .dot-rolling::before {
        content: "⚽";
        display: inline-block;
        position: relative;
        transform: translateX(-25px);
        animation: dot-rolling 3s infinite;
    }

@keyframes dot-rolling {
    0% {
        content: "⚽";
        transform: translateX(-25px) rotateZ(0deg);
    }

    16.667% {
        content: "⚽";
        transform: translateX(25px) rotateZ(720deg);
    }

    33.333% {
        content: "⚽";
        transform: translateX(-25px) rotateZ(0deg);
    }

    34.333% {
        content: "🏀";
        transform: translateX(-25px) rotateZ(0deg);
    }

    50% {
        content: "🏀";
        transform: translateX(25px) rotateZ(720deg);
    }

    66.667% {
        content: "🏀";
        transform: translateX(-25px) rotateZ(0deg);
    }

    67.667% {
        content: "🏐";
        transform: translateX(-25px) rotateZ(0deg);
    }

    83.333% {
        content: "🏐";
        transform: translateX(25px) rotateZ(720deg);
    }

    100% {
        content: "🏐";
        transform: translateX(-25px) rotateZ(0deg);
    }
}

/*# sourceMappingURL=three-dots.css.map */




.widget {
    position: relative;
    padding: 20px;
    border-radius: 8px;
    border: none;
    background: #fff;
    -webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
    -moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
    box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
}

    .widget .widget-heading {
        margin-bottom: 15px;
    }

    .widget h5 {
        font-weight: 700;
        font-size: 19px;
        letter-spacing: 0px;
        margin-bottom: 0;
        color: #515365;
    }

    .widget .widget-content {
        flex-direction: column;
        display: flex;
        justify-content: space-between;
        height: 100%;
    }

    .widget .dropdown-toggle {
        position: relative;
        padding: 9px 15px 10px 15px;
        border: 1px solid #d3d3d3;
        border-radius: 8px;
        transform: none;
        font-size: 13px;
        line-height: 17px;
        background-color: #fff;
        letter-spacing: normal;
        min-width: 115px;
        text-align: inherit;
        color: #1b2e4b;
        box-shadow: none;
        max-height: 35px;
    }

    .widget .dropdown-menu a {
        padding: 8px 15px;
        font-size: 13px;
        font-weight: 500;
        color: #3b3f5c;
    }


/* WALLET BALANCE  */


.wallet-auto-container {
    height: 270px;
    overflow: hidden;
}

.wallet-auto select {
    width: 130px;
    font-size: 12px !important;
    background-color: white;
    border: 1px solid #e0e0e0;
}

.wallet-balance-container {
    height: 270px;
    overflow: hidden;
}

.wallet-balance select {
    width: 130px;
    font-size: 12px !important;
    background-color: white;
    border: 1px solid #e0e0e0;
}

.layout-top-spacing {
    margin-top: 20px;
}

.layout-spacing {
    padding-bottom: 40px;
}

.layout-px-spacing {
    padding: 0 20px 0 18px !important;
    min-height: calc(100vh - 170px) !important;
}

/* 3 PRODUCT STARTS */
.widget .card-img.overlap {
    margin-top: -60px;
}
.widget .card-img.overlap2 {
    margin-top: -80px;
}

.widget-three {
    position: relative;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    height: 100%;
    box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.09019607843137255), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
}


