#cargando, #deshaceraccion {
    display: none;
    position: fixed;
    top: 0px;
    z-index: 1050;
    background-color: #ffc;
    font-weight: bold;
    padding: 5px 10px;
    border: 1px solid #f0c36d;
    left: 0px;
    text-align: center;
}

#msgresultado, .alert-msg-result {
    display: none;
    position: fixed;
    top: 0px;
    z-index: 190000;
    width: 100%;
    font-weight: bold;
    padding: 5px 10px;
    margin: 0px;
/*    text-align: justify;*/
}

.lds-spinner {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
    top: 45vh;
    /*left: 47vw;*/
}

    .lds-spinner div {
        transform-origin: 32px 32px;
        animation: lds-spinner 1.2s linear infinite;
    }

        .lds-spinner div:after {
            content: " ";
            display: block;
            position: absolute;
            top: 3px;
            left: 29px;
            width: 5px;
            height: 14px;
            border-radius: 20%;
            background: #fff;
        }

        .lds-spinner div:nth-child(1) {
            transform: rotate(0deg);
            animation-delay: -1.1s;
        }

        .lds-spinner div:nth-child(2) {
            transform: rotate(30deg);
            animation-delay: -1s;
        }

        .lds-spinner div:nth-child(3) {
            transform: rotate(60deg);
            animation-delay: -0.9s;
        }

        .lds-spinner div:nth-child(4) {
            transform: rotate(90deg);
            animation-delay: -0.8s;
        }

        .lds-spinner div:nth-child(5) {
            transform: rotate(120deg);
            animation-delay: -0.7s;
        }

        .lds-spinner div:nth-child(6) {
            transform: rotate(150deg);
            animation-delay: -0.6s;
        }

        .lds-spinner div:nth-child(7) {
            transform: rotate(180deg);
            animation-delay: -0.5s;
        }

        .lds-spinner div:nth-child(8) {
            transform: rotate(210deg);
            animation-delay: -0.4s;
        }

        .lds-spinner div:nth-child(9) {
            transform: rotate(240deg);
            animation-delay: -0.3s;
        }

        .lds-spinner div:nth-child(10) {
            transform: rotate(270deg);
            animation-delay: -0.2s;
        }

        .lds-spinner div:nth-child(11) {
            transform: rotate(300deg);
            animation-delay: -0.1s;
        }

        .lds-spinner div:nth-child(12) {
            transform: rotate(330deg);
            animation-delay: 0s;
        }

.lds-spinner__img {
    background-image: url(../img/loading.svg);
    background-position: center;
    margin: auto;
    background-size: 100px;
    width: 100px;
    height: 100px;
}

/*Inicio - Login*/
.form-signin {
    max-width: 330px;
    max-height: 430px;
    padding: 15px;
    margin: 10% auto;
}

    .form-signin input[type="text"] {
        margin-bottom: -1px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

    .form-signin input[type="password"] {
        margin-bottom: 10px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .form-signin .form-control {
        position: relative;
        height: auto;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 10px;
        font-size: 16px;
    }

.content-login {
    padding: 25px;
    border: 1px solid black;
    background-color: #ccc;
}

.avatar {
    width: 100px;
    height: 100px;
    margin: 10px auto 30px;
    border-radius: 100%;
    border: 2px solid #aaa;
    background-size: cover;
    background-color: #fff;
}


/*background-clip: padding-box; background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 6px; box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); outline: 0 none; position: relative;*/
/*Inicio - Login*/
table {
    border: none;
    border-color: transparent;
}

.columnaacciones {
    text-align: right;
}

.actionsbar {
    margin-bottom: 10px;
}

    .actionsbar .add {
        color: #3c763d !important;
    }

    .actionsbar .inactivo {
        color: #a94442 !important;
    }

    .actionsbar .activo {
        color: #3c763d !important;
    }

.logo {
    padding-left: 5px !important;
    padding-top: 1px !important;
    text-align: left !important;
}

    .logo img {
        height: 45px !important;
    }

.logo-mini {
    text-align: center !important;
}

    .logo-mini img {
        height: 40px !important;
    }

.img-bn {
    filter: url('#grayscale'); /* Versión SVG para IE10, Chrome 17, FF3.5, Safari 5.2 and Opera 11.6 */
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%); /* Para cuando es estándar funcione en todos */
    filter: Gray(); /* IE4-8 and 9 */
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    border: 3px solid transparent !important;
}

    .img-bn:hover {
        -webkit-filter: grayscale(0%);
        -moz-filter: grayscale(0%);
        -ms-filter: grayscale(0%);
        -o-filter: grayscale(0%);
        filter: none;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

.img-sel {
    border: 3px solid #3c8dbc !important;
}

.users-list-name {
    font-size: 12px;
}

    .users-list-name :hover {
        text-overflow: initial;
    }

.vresize {
    resize: vertical;
}

.hresize {
    resize: horizontal;
}

.itemTarifa {
}

hr.info {
    border-top: 1px solid #00c0ef;
}

.label-orange {
    background-color: darkorange;
    color: #fff;
}

.label-gray {
    background-color: darkgray;
    color: #fff;
}

.listCheckBox label {
    margin-right: 10px;
    margin-left: 3px;
}

.labelFiltro {
    margin-right: 10px;
    margin-left: 3px;
}

.factura {
    position: relative;
    background: #fff;
    border: 1px solid #f4f4f4;
    padding: 20px;
    margin: 10px 25px;
}

.booking-foother {
    text-align: center;
    color: whitesmoke;
    width: 100%;
    bottom: 0;
    position: fixed;
}

.day:not(.disabled) {
    color: #454545 !important;
}

.picker-switch, .next, .prev, .dow, .year, .month, .decade, .timepicker-hour, .timepicker-minute, .minute, .hour, .separator {
    color: #454545;
}

.label-servicio {
    font-size: 16px;
    margin-right: 8px;
}

@font-face {
    font-family: CodigoBarra;
    src: url('../fonts/IDAutomationHC39M.ttf');
}

.CodigoBarra {
    font-family: CodigoBarra;
}

.cropper-bg {
    width: inherit !important;
}

.span,
.chip {
    margin-bottom: 5px;
    position: relative;
    margin-right: 5px;
    display: inline-block;
    padding: 3px;
}

.chip {
    background-color: var(--color-primary);
    color: white;
    border: 1px solid #fff0;
    border-radius: var(--border-chip);
}

.cerrar,
.chip__close {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
    margin-left: 3px;
    cursor: pointer;
}

/********************
    PANEL
*********************/
.panel-footer.panel-footer-button {
    padding: 6px 10px 0px;
}

    .panel-footer.panel-footer-button .form-group {
        margin-bottom: 6px;
    }

/**********************
    FIESTA
**********************/
.container-personarelacionada-fiesta {
    display: grid;
    grid-gap: 3px;
    grid-template-columns: 70% 30%;
    align-items: center;
}

.container-personarelacionada-fiesta__btn-group {
    width: 80px;
}

.listado-mesas-fiesta {
    max-height: 400px;
    overflow-y: scroll;
}

#modalBoletas .modal-header.box-nav h5 {
    margin: 10px auto;
}

#modalBoletas .img-fiesta,
.img-fiesta {
    border-radius: 10px;
    margin: 0 auto;
}

#modalBoletas #pnlBoletas .col-xs-12 {
    margin-bottom: 10px;
}

#modalBoletas #pnlBoletas label {
    display: block;
}

#modalBoletas #pnlBoletas .name-persona-boleta {
    font-size: 16px;
    font-weight: 600;
}

#modalBoletas #pnlBoletas .codigo-qr-boleta {
    font-weight: 600;
}

#modalBoletas #pnlBoletas .box-boleta {
    color: white;
    background-color: var(--color-menu);
    border-radius: 10px;
    padding: 5px;
}

/*#modalBoletas #pnlBoletas .box-boleta__mesa {
    grid-template-columns: 1fr 3fr;
}*/

.maskphone-ticket {
    display: flex;
    column-gap: 5px;
    align-items: center;
}

.maskphone-ticket__plus::after {
    content: '+';
    font-size: 2rem;
}

.maskphone-ticket__code {
    width: 20%;
}

maskphone-ticket__number {
    width: 80%;
}

/*****************
    Solicitudes
******************/
.contenedor-file-solicitud {
}

.button-default {
    padding: 1px 6px;
    user-select: none;
    text-align: center;
    cursor: pointer;
    background-color: #EFEFEF;
    border-image: initial;
    -webkit-appearance: button;
    border-radius: 2px;
    border: 1px solid;
    border: 1px solid #767676;
}

.button-default:hover,
.button-default:active{
    background-color: #fbfbfb;
}

.imagenes-solicitud {
    width: 100%;
    height: 140px;
    background-repeat: no-repeat;
    background-position: center center;
    margin-bottom: 8px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    border-radius: 5px;
    cursor: pointer;
}

.files-imagen-solicitud {
    display: block;
    font: 900;
    font-family: sans-serif;
    line-height: initial;
    color: #000;
}

#imageModal {
    width: 100%;
}

/*****************
    ambientes
******************/
.item-ambiente {
    position: relative;
}

.img-ambiente {
    border-radius: 10px;
    margin-bottom: 15px;
    width: 100%;
    min-height: 119px;
}

.nombre-ambiente {
    position: absolute;
    margin: 0;
    top: auto;
    width: 100%;
    bottom: 0;
    color: #fff;
    margin-bottom: 0px;
    padding: 5px 10px;
    opacity: 0.8;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}


/*****************
    credencial
******************/
.modal-credencial .modal-content, .credencial {
    border-radius: 25px;
}

.modal-credencial .modal-content {
    max-width: 330px;
    margin: 2rem auto 0;
    background-color: transparent;
}

.credencial {
    width: inherit;
}

    .credencial .modal-title {
        text-transform: uppercase;
    }

    .credencial .credencial-header,
    .credencial .credencial-footer {
        color: #fff;
    }

    .credencial .credencial-header {
        display: block;
        padding: 8px 15px 90px;
        border-top-right-radius: 25px;
        border-top-left-radius: 25px;
        text-align: center;
    }

        .credencial .credencial-header > div {
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            position: relative;
            margin-bottom: 15px;
        }

        .credencial .credencial-header .button-close-modal {
            position: absolute;
            right: 0;
            opacity: unset;
        }

    .credencial .credencial-body {
        display: flex;
        flex-direction: column;
        padding: 0 20px;
        background-color: #fff;
    }

.credencial-body #pnlClienteHotel {
    display: grid;
    text-align: center;
    color: #2f45b4;
}

#pnlCertificadoCovid .credencial-body.border,
.credencial .credencial-footer {
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 25px;
}

#pnlCertificadoCovid .credencial-body.row-grid {
    grid-template-rows: 105px 1fr;
}

.credencial .credencial-body h4 {
    margin: 0;
}

.credencial .credencial-body > div:nth-child(1) {
    margin-top: -35px;
    text-align: center;
}

.credencial .credencial-body > div:nth-child(2) {
    display: grid;
    /*align-items: center;*/
    grid-gap: 30px;
    margin: 0px 0 40px;
}

#pnlCertificadoCovid .credencial-body > div:nth-child(2) {
    grid-template-rows: 45px 1fr;
    grid-gap: 0;
    margin: 0;
}

#pnlCertificadoCovid .credencial-body > div:nth-child(2) input {
    width: 100%;
}

.credencial .credencial-body .img-credencial {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    position: relative;
    top: -40px;
}

#pnlCamposCertificado button[type=button] {
    border: 0;
    display: block;
}

.credencial .credencial-footer {
    padding: 8px 10px 10px;
}

.credencial .credencial-footer,
#pnlBarcode {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.swiper-slide__content {
    background-color: rgba(0, 0, 0, 0.78);
    background-color: var(--color-menu);
    color: #FFF;
    display: flex;
    align-items: center;
    padding: 5px 10px;
}

@keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}