/****************************** TEXTS ******************************/
@font-face {
    font-family: "Montserrat-Regular";
    src: url("../font/Montserrat-Regular.ttf") format("truetype");
}
@font-face {
    font-family: "Montserrat-Medium";
    src: url("../font/Montserrat-Medium.ttf") format("truetype");
}
@font-face {
    font-family: "Montserrat-Italic";
    src: url("../font/Montserrat-Italic.ttf") format("truetype");
}
@font-face {
    font-family: "Montserrat-SemiBold";
    src: url("../font/Montserrat-SemiBold.ttf") format("truetype");
}
@font-face {
    font-family: "Montserrat-Bold";
    src: url("../font/Montserrat-Bold.ttf") format("truetype");
}
::-webkit-scrollbar {
    background: #ccc;
    width: 10px
}
::-webkit-scrollbar-corner {
    background: 0 0
}
::-webkit-scrollbar-thumb {
    background: #333;
    width: 5px;
    border: 1px solid #ccc;
    border-radius: 50px
}
    ::-webkit-scrollbar-thumb:hover {
        background: #333;
        cursor: grab
    }
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgb(0,0,0,.5)
}
::selection {
    background: #000;
    color: #fff;
}
:hover {
    transition: .5s
}
html, body {
    width: 100%;
    padding: 0 !important;
    font-family: "Montserrat-Bold";
    font-size: 1rem;
    overflow-x: hidden !important;
}
    body {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    } 
        body.modal-open {
            padding-right: 0;
        }
p {
    margin: 0 auto;
    font-size: 100%;
}
    p + p {
        margin-top: .5rem;
    }
a {
    width: fit-content;
    display: inline-block;
    font-family: "Montserrat-Bold";
    font-size: 100%;
    text-decoration: none;
    color: #A0A0A0;
}
    a:hover {
        text-decoration: underline;
        color: #000;
        cursor: pointer;
    }
.pointer {
    cursor: pointer;
}
.regular {
    font-family: "Montserrat-Regular";
}
.italic {
    font-family: "Montserrat-Italic";
}
.medium {
    font-family: "Montserrat-Medium";
}
.semibold {
    font-family: "Montserrat-SemiBold";
}
.bold {
    font-family: "Montserrat-Bold";
}
*.underline {
    text-decoration: underline !important;
}
*.uppercase {
    text-transform: uppercase;
}
ul.circle {
    list-style-type: circle;
}
ul.square {
    list-style-type: square;
}
ol.roman {
    list-style-type: upper-roman;
}
ol.roman-lower {
    list-style-type: lower-roman;
}
ol.alpha {
    list-style-type: upper-alpha;
}
ol.alpha-lower {
    list-style-type: lower-alpha;
}
/****************************** TITLES & TEXT ******************************/
h1, h2, h3, h4, h5, h6 {
    position: relative;
    font-family: "Montserrat-Bold";
}
    h1{
        font-size: 200%;
    }
    h2 {
        font-size: 175%;
    }
    h3 {
        font-size: 150%;
    }
    h4 {
        font-size: 125%;
    }
    h5 {
        font-size: 100%;
    }
h6,
small, .small {
    font-size: 75% !important;
}
.small-medium {
    font-size: 85% !important;
}
.smaller {
    font-size: 65% !important;
}
.biggest {
    font-size: 350% !important;
}
sup,sub,.smallest {
    font-size: 50% !important;
}
sup {
    top: .5rem;    
    vertical-align: top;
}
sub {
    bottom: .5rem;
    vertical-align: bottom;
}
.letter-spacing {
    letter-spacing: 1px;
}
.letter-spacing-less {
    letter-spacing: -1px;
}
/****************************** CONTAINERS ******************************/
.container-fluid, .navbar, .navbar-brand {
    padding: 0;
} 
.container {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    padding: 3rem 10%;
    margin: 0;
}
#containerBody {
    min-height: calc(1 * 94.45vh);
    padding-top: 65px;
    padding-bottom: 3rem;
}
.row {
    margin: 0;
    padding: 0;
}
.responsive,
.responsive-min {
    max-width: 100%;
    max-height: 1600px;
    overflow: auto;
}
.responsive-min {
    max-height: 400px;
}
.responsive-x {
    max-width: 100%;
    height: fit-content !important;
    overflow-x: auto;
}
.responsive-y {
    max-height: 500px;
    overflow-y: auto;
} 
.clearfix {
    height: 2rem;
}
table {
    width: 100% !important;
}
    table th,
    table td {
        width: auto !important;
        text-align: center;
    }
    table th {
        padding: .75rem .5rem !important;
    }
    table thead,
    table tfoot {
        position: sticky;
        z-index: 2;
    }
    table thead {        
        top: 0;
    }
    table tfoot {
        bottom: -2px;
    }
.spinner {
    background: rgb(0,0,0,.5);
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 100000;
}
.spinner img {
    width: 300px;
    height: 200px;
    margin: 0 auto; 
    border-radius: .5rem;
}
    .spinner span {
        position: absolute;
        transform: translate(0,320%);
    }
*.border {
    border-width: 2px !important;
}
.img-overflow {
    height: 20rem;
    position: relative;
    overflow: hidden;
}
    .img-overflow img {
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(0,-45%);
    }
/****************************** BACKGROUNDS & COLORS ******************************/
:root, [data-bs-theme=light] {
    --bs-dark: #000000;
    --bs-dark-rgb: 0, 0, 0;
    --textColor2: #9966ff;
    --textColor3: #5b9bd5;
}
.icon-white {
    filter: invert(1);
}
/****************************** FORMS & BUTTONS ******************************/
form label {
    margin-bottom: .25rem;
}
form.row {
    justify-content: center;
    align-items: center;
}
img.form-icon-title {
    height: 1.25rem;
    vertical-align: baseline;
}
a.form-icon-title {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(150%, 10%);
    font-size: 75%;
}
input:focus,
button:focus,
select:focus,
textarea:focus {
    outline: 0;
    border-color: #A0A0A0;
    box-shadow: none !important;
}
input,
button,
select,
textarea {
    width: 100%;
    margin-bottom: .5rem;
    padding: .5rem !important;
    font-size: 1rem !important;
    border-style: solid !important;
    border-width: 2px !important;
    border-radius: .5rem !important;
    color: initial;
}
select,
.dropdown input,
.ms-parent button,
.ms-search input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: white;
    background-repeat: no-repeat;
    background-position: center right .5rem;
    background-size: .75rem !important;
    padding-right: 1rem;
    cursor: pointer;
}
.dropdown input {
    position: sticky;
    border-width: 2px;
    z-index: 4;
}
.dropdown-menu,
.dropdown-menu[data-bs-popper],
.dropdown-menu.show {
    width: 100%;
    max-height: 250px;
    margin-top: -1rem !important;
    padding-top: 1rem !important;
    inset: 0 auto auto 0 !important;
    top: auto !important;
    transform: translate(0, 0) !important;
    border-radius: 0 0 .5rem .5rem !important;
    z-index: 3;
    overflow-x: hidden;
    overflow-y: auto;
}
    input::placeholder,
    textarea::placeholder {
        color: #A0A0A0 !important;
    }
#userLogInCustomer .dropdown-menu {
    top: 100% !important;
    margin-top: .25rem !important;
    padding-top: .5rem !important;
}
select {
    color: #A0A0A0;
}
    select:valid {
        color: #000000;
    }
    select option {
        padding: .25rem .5rem;
        text-align: center;
    }
    #reportings select option {
        text-align: left;
    }
input[type="radio"], input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: auto;
    padding: .35rem !important;
    margin: 0 .1rem 0 0;
    vertical-align: middle;
    border-color: #A0A0A0;
    border-radius: .2rem;
    color: #A0A0A0;
    cursor: pointer;
}
    input[type="radio"] {
        border-radius: 100%;
    }   
    input[type="radio"]:checked, input[type="checkbox"]:checked {
        background: #5b9bd5;
        border-color: #000;
        color: #000;
    }
input[type="button"], input[type="submit"], input[type="reset"], .btn, button {
    cursor: pointer;
}
    input[type="button"]:disabled, input[type="submit"]:disabled, input[type="reset"]:disabled,
    input[type="button"].disabled, input[type="submit"].disabled, input[type="reset"].disabled,
    .btn:disabled, .btn.disabled, a.btn:disabled, a.btn[disabled], a.btn.disabled,
    button:disabled, button.disabled, .enable-button:disabled,
    .disabled, :disabled, [disabled] {
        background: #A0A0A0 !important;
        border-color: #A0A0A0 !important;
        color: white !important;
        opacity: 1 !important;
        cursor:no-drop;
    }
.btn {
    border-width: 2px !important;
}
    .btn, .btn:hover:not(*.btn.btn-outline-dark) {
        text-shadow: 1px 1px 5px #000;
        color: #fff !important;
    }
        .btn.btn-outline-dark {
            background: none !important;
            text-shadow: none;
            color: #000 !important;
        }
    .btn:hover {
        opacity: .9;
    }
a.btn {
    text-decoration: none !important;
}
textarea {
    height: 5rem;
    line-height: initial;
    resize: none;
}
.box-form {
    background-position: center right;
    width: 100%;
    padding: .5rem 0 .25rem 0;
    border-radius: 0;
    border: 0;
    border-bottom: solid 1px #A0A0A0;
}
select.box-form{
    padding-right: 1rem;
}
.box-table {
    width: 100%;
    padding: .5rem;
    border-radius: .5rem;
    border: solid 2px #A0A0A0;
}
.input-group, .input-group input,
.input-group-icon {
    position: relative;
}
    .input-group-icon svg {
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(-50%, 70%);
        text-shadow: 1px 1px 5px #000;
        color: #fff !important;
    }
.btn-float {
    background: #fff;
    width: auto;
    max-height: 40px;
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    border: 0 !important;
    border-top-right-radius: auto;
    border-bottom-right-radius: auto;
    border-top-left-radius: auto;
    border-bottom-left-radius: auto;
    border-radius: 0 .5rem .5rem 0 !important;
    z-index: 5;
}
.btn-close {
    width: 2rem;
    height: 2rem;
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(1rem, -1rem);
    border-radius: 100%;
    opacity: 1;
}
.btn-close:hover {    
    opacity: .75;
}
::placeholder {
    color: #A0A0A0 !important;
}
.placeholder {
    background: none !important;
    cursor: pointer;
}
.ms-parent {
    width: 100% !important;
}
.ms-drop {
    top: 0 !important;
    border: 0 !important;
    border-radius: .5rem !important;
}
    .ms-drop ul {
        text-align: left !important;
    }
.ms-search {
    padding: 0 !important;
    border-radius: .5rem !important;
}
    .ms-search input,
    button.ms-choice {
        height: auto !important;
        margin-bottom: .5rem !important;
        padding: .5rem !important;
        position: relative !important;
        font-family: "Montserrat-Medium" !important;
        font-size: 100% !important;
        line-height: 1.5 !important;
        border-style: solid !important;
        border-width: 2px !important;
        border-radius: .5rem !important;
        border-color: #A0A0A0 !important;
        color: initial;
    }
.ms-choice > span {
    height: auto !important;
    padding: 0 !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
}
.ms-choice > div.icon-caret{
    display: none;
}
.btn-collapse {
    background: none !important;
    width: fit-content;
    margin-bottom: 0;
    padding: 0;
    display: inline-block;
    border: 0 !important;
    color: #000 !important;
}
    .btn-collapse:hover {
        opacity: .75;
    }
/****************************** SECTION MENU ******************************/
#header, #headerLogIn {
    background: #fff;
    height: 64px;
    padding: .5rem;
    z-index: 10;
    box-shadow: 1px 1px 10px rgba(211, 211, 211);
}
    #header a,
    #stuffed {
        width: 4rem !important;
    }
    #header img {
        height: 3rem;
    }
    #header #goBack {
        display: none;
        color: #000;
    }
        #header #goBack:hover {
            color: #A0A0A0;
        }    
    #header a img,
    #headerLogIn a img {
        height: 1.5rem;
    }
    #header #userLogIn::after {
        display: none;
    }
/****************************** SECTION MENU LATERAL ******************************/
.content-sidebar {
    background: #fff;
    padding: 0;
    position: relative;    
}
.sidebar {
    width: 16.66666667%;
    position: fixed;
}
    .sidebar ul {
        margin-bottom: 0;
        padding: 1rem 0;
        list-style: none;
    }
    .sidebar ul li a {
        width: 100%;
        padding: .5rem;
        color: #000;
    }
        .sidebar ul li a:hover {
            opacity: .75;
        }
        .sidebar ul li.dropmenu {
            width: 100%;
            position: relative;
        }
            .sidebar ul li.dropmenu .bi-caret-down-fill,
            .sidebar ul li.dropmenu .bi-caret-up-fill {
                position: absolute;
                top: .5rem;
                right: .5rem;
                font-size: 75%;
            }
            .sidebar ul li.dropmenu .bi-caret-up-fill,
            .sidebar ul li.dropmenu.open .bi-caret-down-fill {
                display: none;
            }
            .sidebar ul li.dropmenu.open .bi-caret-up-fill {
                display: block;
            }
            .sidebar ul li.dropmenu ul {
                padding: 0 0 0 1rem;
                display: none;
            }
                .sidebar ul li.dropmenu.open ul {
                    display: block;
                }
.bg-color2 {
    background: var(--textColor2) !important;
}
.border-color2 {
    border-color: var(--textColor2) !important;
}
.text-color2,
.sidebar ul li a.active,
.sidebar ul li.dropmenu.open,
.sidebar ul li.dropmenu.open > i {
    color: var(--textColor2) !important;
}
.text-color3 {
    color: var(--textColor3) !important;
}
/****************************** SECTION TIPPING ******************************/
#headerTipping {
    background: #fff;
}
#header,
#headerTipping,
#capTipping,
#departamentsEmployees > .row,
#headerTipping,
#bodyTipping,
#selectTipping,
#selectFee,
#confimationTipping,
.row-center, .row-start {
    justify-content: center;
    align-items: center;
    text-align: center;
}
.row-start {
    text-align: left;
}
#selectTipping {
    column-gap: .2rem;
}
#searchTipping {
    margin-bottom: 0;
    text-align: center;
}
#departments .department-item h4 {
    text-shadow: 1px 1px 5px #000;
    color: #fff !important;
    font-size: 100%;
}
#departments .department-item h4 img {
    height: 2.5rem;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(25%,30%);
}
#departments .department-item h4,
#selectTipping .tip-item,
#selectFee .fee-type,
#searchListTipping.dropdown-menu li,
#optionsReportings .tab-header h4 {
    background: #fff;
    margin: 0 auto .5rem auto;
    padding: 1.5rem;
    display: block;
    text-align: center;
    border: solid 2px transparent;
    border-right: solid 2px rgb(211, 211, 211);
    border-bottom: solid 2px rgb(211, 211, 211);
    border-radius: .5rem;
    box-shadow: 2px 2px 10px rgb(211, 211, 211);
}
#selectTipping .tip-item {
    padding: 1rem .5rem;
}
    #selectTipping .tip-item.active {
        box-shadow: 2px 2px 10px rgb(255, 255, 255);
        color: #fff !important;
    }
        #selectTipping .tip-item.active::placeholder {
            color: #fff !important;
        }
    #selectTipping .tip-item.active#customTip {
        text-align: left !important;
    }
        #selectTipping .tip-item.active#customTip::placeholder {            
            opacity: .25;
        }
#selectTipping #tipMessage {
    color: red;
}
#selectFee .fee-type + .fee-type {
    margin-top: 1rem;
}
    #departments .department-item h4:hover,
    #selectTipping .tip-item:hover,
    #selectFee .fee-type:hover,
    #optionsReportings .tab-header h4:hover,
    #searchListTipping.dropdown-menu li:hover:not(#noMatches),
    #optionsReportings .tab-header h4:hover {
        border-color: #A0A0A0;
        cursor: pointer;
    }
#searchListTipping.dropdown-menu {
    background: rgb(211, 211, 211);
    max-height: 300px;
    padding: .5rem .5rem 0 .5rem;
    overflow: auto;
}
    #searchListTipping.dropdown-menu li {
        box-shadow: 2px 2px 10px #A0A0A0;
    }
#selectTipping .tip-item {
    width: 24.25%;
    font-size: 1rem;
}    
#selectFee .fee-type {
    border-radius: 1rem;
    cursor: pointer;
}
    #selectFee .fee-type,
    #selectFee .fee-type.active {
        background-repeat: no-repeat;
        background-position: top right .5rem;
        background-size: 2rem !important;
    }
#selectFee .fee-type * {
    cursor: pointer;
}
#departments .department-item h4 {
    width: 98%;
}
#departments .department-item .all-staff span,
#departments .department-item .staff-item,
#bodyTipping #startOver,
#bodyTipping #selectedTipping,
#bodyTipping #selectTipping,
#bodyTipping #tipMessage,
#bodyTipping #selectFee,
#bodyTipping #payTipping {
    display: none;
}
    #departments .amount-tip {
        font-family: "Montserrat-Bold";
        font-size: 1.5rem;
        text-align: center;
    }
#departments .total-tip {
    width: 3rem;
    display: inline;
    overflow: visible;
}
#departments #payTipping {
    text-align: left;
}
/****************************** SECTION REPORTINGS ******************************/
#listHotelIDReport {
    padding: .25rem .5rem;
    text-align: center;
}
#reportings .responsive,
#reportings .responsive-min {
    display: none;
}
#reportings table {
    margin-bottom: 0;
    border-left: 3px solid #A0A0A0;
    border-right: 3px solid #A0A0A0;
}
    #reportings table td,
    #reportings table th {
        border: 0;
        border-left: 2px solid #A0A0A0;
        border-right: 2px solid #A0A0A0;
    }
    #reportings table thead tr th {
        background-color: #A0A0A0;
        font-family: "Montserrat-SemiBold";
        color: #fff;
    }
    #reportings table thead tr th {
        background-position: bottom right .1rem;
    }
        #reportings table thead tr th:hover:not(#reportings .responsive-min table thead tr th:hover) {
            background-image: url("data:image/svg+xml,<svg class='bi bi-arrow-down-up' width='.75rem' height='.75rem' fill='rgb(255,255,255)' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M11.5 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L11 2.707V14.5a.5.5 0 0 0 .5.5m-7-14a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L4 13.293V1.5a.5.5 0 0 1 .5-.5'/></svg>") !important;
            background-repeat: no-repeat;
            background-position: bottom right .1rem;
            cursor: pointer;
        }
    #reportings table tbody {
        border-top: 3px solid #A0A0A0;
    }
    #reportings table tfoot td {
        background-color: #A0A0A0;
        border-top: 5px solid #A0A0A0;
        border-bottom: 3px solid #A0A0A0;
        color: #fff;
    }               
    #reportings table i {
        margin: 0 .25rem;
        cursor: pointer;
    }
        #reportings table i.bi.bi-plus-circle {
            color: #fff !important;
        }
#optionsReportings {
    margin-top: 2rem;
    margin-bottom: 2rem;
}
    #optionsReportings .tab-header h4 {
        padding: 2rem 1rem;
    } 
.tab-content{
    display: none; 
}
#addDepartment, #addEmployee{
    min-height: 225px;
    position: relative;
}
/****************************** SECTION STAFF ******************************/
#activity .tab-header {
    padding: .5rem 1rem;
    font-size: 90%;
    text-align: center;
    text-shadow: 1px 1px 2px rgb(0,0,0,.25);
    border: solid 2px;
    color: #fff !important;
    cursor: pointer;
}
#activity .tab-header:hover {
    opacity: .75;
}
#tipsReceivedContent {
    display: block;
}
.position-link {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(80%,200%);
}
#accountSettings a.text-color2 {
    font-family: "Montserrat-Regular" !important;
    font-size: 75%;
}
#accountSettings input {
    text-align: center;
}
.bg-payment {
    margin: 0 auto .25rem auto;
    padding: .25rem;
    overflow: hidden;
    border-radius: .5rem;
    border: 3px solid transparent;
    cursor: pointer;
    transition: border 0.2s;
}
    .bg-payment img {
        width: 100%;
        border-radius: .5rem;
    }
.collet-option {
    padding: 1rem;
    border: solid 2px;
    border-radius: 1rem;
}
.collet-option.active {
    border-color: var(--textColor2);
}
.input-code {
    width: 50px;
    margin-bottom: 0;
    padding: 1rem .25rem;
    font-size: 250% !important;
    text-align: center;
}
.checkbox-float {
    position: absolute;
    top: .75rem;
    left: .75rem;
    transform: translate(0, 0);
}
/****************************** SECTION MANAGER ******************************/
#codeQR svg {
    margin: 0 auto;
    display: block;
    transform: scale(1.5) translate(10%, 10%);
    transform-origin: center center;
}
.box-medium input,
.box-medium select,
.box-medium button {
    padding: .15rem .5rem !important;
}
.disabled-edit {
    border-color: transparent;
}
#hotelSettings select option {
    text-align: left;
}
table.table {
    font-size: 85% !important;
}
table.table * {
    border: 0;
}
    table.table thead th {
        font-weight: normal !important;
        font-family: "Montserrat-SemiBold";
        border-bottom: solid 1px rgb(211, 211, 211, .5);
    }
    table.table i {
        margin: 0 .25rem;
        color: var(--textColor3);
        
    }
        table.table i:hover {
            opacity: .75;
            cursor: pointer;
        }
    table.table img {
        width: 1.5rem;
        margin-right: .5rem;        
    }
        select.text-start option{
            text-align: left !important;
        }
.col-xs-1, .col-xxs-1 {
    width: 6%;
    flex: 0 0 auto;
}
.col-xxs-1 {
    width: 3%;
}
/****************************** FOOTER ******************************/
.footer {
    background: #000;
    padding: 1rem 1rem;
    position: sticky;
    z-index: 9;
    font-size: 80%;
}
.footer * {    
    text-align: center;
    color: #fff;
}
    .footer a {
        margin: 0 auto;
        color: #fff !important;
    }   
    .footer span {
        line-height: 1;
    }
/****************************** MODALS ******************************/
.modal {
    background: rgb(0,0,0,.5);
    padding-top: 150px;
    padding-right: 0 !important;
    padding-left: 0 !important;
    top: 0;
    z-index: 999;
}
.modal .row {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
}
    .modal.modal-lg {
        padding-top: initial;
    }
        .modal.modal-lg .row {
            --bs-gutter-x: .25rem;
            --bs-gutter-y: .25rem;
        }
    .modal.modal-lg .modal-dialog {
        max-width: 95% !important;
    }        
.modal-content {
    padding: 1rem;
    text-align: center;
    border-radius: 1rem;
}
.modal-content.border {
    border-radius: 0;
    border: solid 3px #000 !important;
}
.modal-header {
    padding: 0;
    display: block;
    text-align: center;
    border: 0;
    color: #A0A0A0;
}
.modal.modal-lg .modal-header {
    color: initial;
}
.modal-body {
    padding: 1rem 0;
    font-family: Montserrat-Bold;
    text-align: center;
}
    .modal-body.medium {
        font-family: Montserrat-Medium;
    }
.modal.modal-lg .modal-content,
.modal.modal-lg .modal-header,
.modal.modal-lg .modal-body {
    text-align: left;
}
.modal.modal-lg.small input,
.modal.modal-lg.small select {
    margin-bottom: 0;
    font-size: 85% !important;
}
.modal.modal-lg.small select option {
    text-align: left !important;
}
.modal.modal-lg.regular *:not(h2) {
    font-family: "Montserrat-Regular";
}
.modal-footer {
    padding: 1.5rem 0 0 0;
    display: block;
    text-align: center;
}
    .modal-footer *:not(.modal.modal-lg .modal-footer *) {
        margin: 0 auto;
    }
.modal.modal-lg .modal-footer {
    padding: 0;
    border-top: 0;
}
#modalLogOut .modal-footer {
    border-color: #A0A0A0;
}
.modal-backdrop {display: none;}
.modal .btn-close {
    background: rgba(211, 211, 211);
    width: .5rem;
    height: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translate(-1.25rem, 1.25rem);
    font-size: 100% !important;
    border-radius: 0;
    cursor: pointer;
    z-index: 10;
}
    .modal .btn-close.bg-not {
        background: none;
        transform: translate(-3.25rem, 1.25rem);
        font-size: 150% !important;
    }
/****************************** SPAN ERROR & OTROS ******************************/
.span-error {
    width: 100%;
    margin-bottom: 1rem;
    display: block;
    color: red;
}
.selectedZone {
    border-color: var(--textColor2) !important;
    box-shadow: 0 0 8px @textColor;
}