@font-face {
    font-family: OpenSansBold;
    src: url('/font/OpenSans-Bold.ttf');
}
@font-face {
    font-family: OpenSansRegular;
    src: url('/font/OpenSans-Regular.ttf');
}
@font-face {
    font-family: PlayfairBold;
    src: url('/font/PlayfairDisplay-Bold.ttf');
}
@font-face {
    font-family: PlayfairRegular;
    src: url('/font/PlayfairDisplay-Regular.ttf');
}
@font-face {
    font-family: PlayfairItalic;
    src: url('/font/PlayfairDisplay-Italic.ttf');
}
body{
    margin: 0;
    padding: 0;
    font-family: "OpenSansRegular", Helvetica, sans-serif;
    background-color: #e8e1dd !important;
}
header{
    margin: 0;
    width: 100%;
    background-color: #000000;
    padding: 5px 0;
}
.imglogo{
    width: 20%;
    margin-left: 2%;
}
#headeradmin{
    background: url('/img/cabecera_administricion.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 50px 0;
}
#headeradmin h1{
    margin: 0;
    padding: 0;
    text-align: center;
    font-size: 30px;
    font-weight: normal;
    color: #FFF;
    font-family: "PlayfairRegular";
}
footer{
    background: url('/img/foto-pie.jpg') no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 30px 2% 10px 2%;
    overflow-y: auto;
    width: 100%;
    box-sizing: border-box;
}
.divfooter{
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    color: white;
}
#imgfooter{
    max-width: 30%;
    margin-bottom: 10px;
}
.divfooter a{
     color: white;
     text-decoration: none;
}
.divfooter ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.divfooter ul li{
    display: inline-block;
    margin: 0 10px;
}
.divfooter .social{
    font-size: 3vw;
    color: #db0a3c;
    margin: 0 10px;
}
.marginmenu{
    margin-top: 80px;
}
.marginmenumin{
    margin-bottom: 20px;
}
#mainbody{
    background-color: #e8e1dd;
    padding: 40px ;
    /*width: 90%;*/
    /*max-width: 1300px;*/
    margin: 0 auto;

    overflow-y: auto;
}
#divlogin{
    width: 300px;
    margin: 0 auto;
}

.linelogin{
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 10px;
}
.linelogin .inputlogin{
    display: block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    box-sizing: border-box;
}
.btnadmin{
    background-color: #db0a3c;
    border: none;
    width: 100%;
    color: white;
    height: calc(2.25rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: "PlayfairItalic";
}
#colopciones{
    position: relative;
    float: left;
    width: 20%;
}
#colcontent{
    position: relative;
    float: right;
    width: 75%;
    padding: 1%;
    box-sizing: border-box;
    background-color: #FFF;
}
.buttonoption{
    width: 100%;
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #db0a3c;
    border: none;
    color: white;
    font-family: "PlayfairItalic";
    text-align: center;
    text-decoration: none;
    margin-bottom: 10px;
}
.buttonoption a:hover{
    cursor: pointer;
    color: white !important;
}
.minimage{
    max-width: 50px;
}
.arecordar{
    display: block;
    text-align: center;
    text-decoration: none;
    color: #db0a3c;
}
.navigation{
    text-align: center;
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 40px;
}
.navigation a{
    text-decoration: none;
}
.navigation .first,
.navigation .previous,
.navigation .next,
.navigation .last{
    background: #db0a3c;
    color: white;
    padding: 2px 5px 2px 8px;
    margin: 0 5px;
    box-sizing: border-box;
}
.navigation .first a,
.navigation .previous a,
.navigation .next a,
.navigation .last a{
    color: white;
    text-align: center;
}
.navigation .page{
    background: black;
    color: white;
    padding: 2px 5px 2px 8px;
    margin: 0 5px;
    box-sizing: border-box;
}
.navigation .page a{
    color: white;
    text-align: center;
}
.navigation .current{
    border: 1px solid black;
    color: white;
    padding: 1px 5px 1px 5px;
    margin: 0 5px;
    box-sizing: border-box;
}
.navigation .current{
    color: #db0a3c !important;
}
.imgformapago{
    height: 20px;
    margin-top: 10px;
    float: right;
    margin-left: 5px;
    margin-right: 5px;
}
.btnprint{
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
}
.btnprint a{
    background-color: #db0a3c;
    color: white;
    font-size: 2vw;
    text-decoration: none;
    padding: 5px 10px 5px 5px;
    font-family: "PlayfairItalic";
}
.btnprint a:hover{
    cursor: pointer;
    color: white;
}
.alignright{
    text-align: right;
}
.cuadrado{
    width: 20px;
    height: 20px;
    border: 1px solid #000000;
}

.selectsequence{
    background-color: #db0a3c;
}
.noselectsequence{
    background-color: #000000;
}
.radius50{
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

#divticketcombinado{
    font-size: 1.5vw;
}
#divticketcombinado p{
    padding: 0;
    margin: 0 0 20px 0;
}
.itemcombinado{
    width: 70%;
    margin: 20px auto;
    font-size: 1.5vw;
    display: inline-flex;
    align-items: center;
    text-align: left;
    justify-content: left;
    flex-wrap: wrap;
    text-decoration: none;
    font-family: "PlayfairRegular";
    border: 2px solid #db0a3c;
}
.itemcombinado .mainimagecombinado{
    height: 100px;
    display: inline-block;
    margin-right: 20px;
}
.itemcombinadoselect{
    background: #db0a3c !important;
    color: white !important;
}
.itemcombinado:hover{
    cursor: pointer;
}
.btnsiguiente{
    background-color: #db0a3c;
    width: 100%;
    padding: 5px 0;
    font-size: 1.5vw;
    border: none;
    font-family: "PlayfairRegular";
    color: white;
}
.divcartstep{
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 40px;
}
.cartstep{
    position: relative;
    float: left;
    width: 100%;
    font-family: "PlayfairRegular";
    color: white;
    font-size: 1.5vw;
    padding: 5px 1%;
    box-sizing: border-box;
}
.backgroundrojo{
    background-color: #db0a3c;
    border: 1px solid #db0a3c;
}
.backgroundnegro{
    background-color: black;
}
.backgroundgris{
    background-color: #757270;
}
.bordergris{
    border: 1px solid #757270;
}
.backgroundamarillo{
    background-color: #efcd3f;
}
.rectangle{
    display: inline-block;
    width: 40px;
}
.optionstep{
    background-color: white;
    position: relative;
    float: left;
    width: 100%;
    padding: 20px 5%;
    box-sizing: border-box;
    text-align: center;
}
.optionstep .fa-spinner{
    font-size: 5vw;
}
.disabledoption{
    display: none;
}

.tabletipoentrada{
    padding: 0;
    text-align: left;
    width: 80%;
    margin: 0 10%;
}

.tabletipoentrada tr{
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid #4d4d4d;
}

.listtipoentrada{
    padding: 0;
    text-align: left;
    width: 80%;
    margin: 0 10%;
}
.listtipoentrada li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #4d4d4d;
    /* Evita que el contenido haga wrap */
    flex-wrap: nowrap;
}

.listtipoentrada li > span,
.listtipoentrada li > label,
.listtipoentrada li > .textotipoentrada {
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.listtipoentrada li .divnumbertickets {
    display: flex;
    align-items: center;
    margin-left: 20px;
    flex-shrink: 0;
    gap: 5px; /* Espacio entre botones */
    white-space: nowrap; /* Mantiene los botones en línea */
}
.divnumbertickets .buttonnumbertickets{
    background-color: #db0a3c;
    padding: 3px 5px;
    display: inline-block;
    text-align: center;
    color: white;
}
.divnumbertickets .buttonnumbertickets:hover{
    cursor: pointer;
}
.divnumbertickets label{
    min-width: 15px;
    display: inline-block;
    text-align: center;
}
.labelnumbertickets{
    border: none;
    width: 35px;
    text-align: center;
}
.labelnumbertickets::-webkit-outer-spin-button,
.labelnumbertickets::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.linetotalprecio{
    display: none;
}

.opcioncalendar{
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
}
.opcioncalendar ul{
    margin: 0;
    padding: 0;
}
.opcioncalendar ul li{
    display: inline-block;
    margin: 0 20px;
}
#divcalendar,
.divcalendar{
    position: relative;
    float: left;
    width: 40%;
    margin: 20px 30%;
}

#cal{
    width: 100%;
    background-color: #e8e1dd;
    text-align: center;
    color: #4d4d4d;
    box-sizing: border-box;
    padding: 10px 20px;
}
.cal{
    width: 100%;
    background-color: #e8e1dd;
    text-align: center;
    color: #4d4d4d;
    box-sizing: border-box;
    padding: 10px 20px;
}
.nodisponible{
    background-color: #757270;
    margin: 5px;
    padding: 5px;
    color: #4d4d4d;
}
.disponibilidadalta{
    background-color: white;
    margin: 0px 5px;
    padding: 5px;
    color: #4d4d4d;
}
.disponibilidadbaja{
    background-color: #efcd3f;
    margin: 0px 5px;
    padding: 5px;
    color: #4d4d4d;
}
.selectday{
    background-color: #db0a3c !important;
    color: white !important;
}
.selectableday:hover{
    cursor: pointer;
}
.contentcalendar:hover{
    cursor: pointer;
}

optionsesion{
    position: relative;
    float: left;
    width: 80%;
    margin: 20px 10% 0 10%;
}
#divsesiones{
    width: 100%;
    display: grid;
    overflow: hidden;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 1fr;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}
.sesionnodisponible{
    background-color: #757270;
    margin: 5px;
    padding: 5px;
    color: #4d4d4d;
    border: 1px solid #757270;
}
.sesiondisponibilidadalta{
    background-color: white;
    margin: 0px 5px;
    padding: 5px;
    color: #4d4d4d;
    border: 1px solid #757270;
}
.sesiondisponibilidadbaja{
    background-color: #efcd3f;
    border: 1px solid #efcd3f;
    margin: 0px 5px;
    padding: 5px;
    color: #4d4d4d;
}
.selectsesion{
    background-color: #db0a3c !important;
    border: 1px solid #db0a3c !important;
    color: white !important;
}
.sesionclicable:hover{
    cursor: pointer;
}
.itemsesion{
    margin: 5px 10px;
}
.itemsesion label{
    font-size: 1vw;
}
.btnsiguiente{
    background-color: #db0a3c;
    width: 100%;
    padding: 5px 0;
    font-size: 1.5vw;
    border: none;
    font-family: "PlayfairRegular";
    color: white;
}
#titleresumen{
    position: relative;
    float: left;
    width: 100%;
    font-family: "PlayfairRegular";
    font-size: 2vw;
    background-color: black;
    color: white;
    text-align: center;
    padding: 5px 0;
}
#resumen{
    position: relative;
    float: left;
    width: 100%;
    background-color: white;
    padding: 10px 0;
}
#pagarresumen{
    position: relative;
    float: left;
    width: 100%;
    background-color: #db0a3c;
    color: white;
    font-family: "PlayfairRegular";
    text-align: center;
    font-size: 2vw;
    padding: 5px 0;
    border: none;
}
.titleresumencombinado{
    position: relative;
    float: left;
    width: 100%;
    font-family: "PlayfairRegular";
    font-size: 2vw;
    text-align: center;
}
.tableresumen{
    position: relative;
    float: left;
    width: 94%;
    margin: 10px 3%;
}
.textocarrito{
    position: relative;
    float: left;
    width: 94%;
    margin: 10px 3%;
    color: #db0a3c;
}
.alignright{
    text-align: right;
}
.aligncenter{
    text-align: center;
}
.alignleftt{
    text-align: left;
}
.margintd{
    padding: 0 5px;
}
#resumen hr{
    width: 94%;
    margin: 0 3%;
    float: left;
    position: relative;
    border: black 1px solid;
}
.totalresumencombinado{
    width: 94%;
    margin: 10px 3%;
    font-size: 2vw;
    position: relative;
    float: left;
}
.totalresumencombinado span{
    float: right;
}
#coldatospersonales .lineform input{
    border: none;
    width: 100%;
    font-size: 1.5vw;
    margin: 0;
    padding: 0;
}
#coldatospersonales .lineform label{
    font-size: 1vw;
    display: block;
    width: 100%;
}
#coldatospersonales .lineform2{
    position: relative;
    float: left;
    width: 100%;
    margin:  10px 0;
    padding: 2px 5px;
    box-sizing: border-box;
    font-family: "PlayfairRegular";
}
#coldatospersonales .lineform select{
    position: relative;
    float: left;
    width: 100%;
    border: none;
    font-size: 1.5vw;
}
#coldatospersonales .lineform{
    position: relative;
    float: left;
    width: 100%;
    border: 1px solid #757270;
    margin:  10px 0;
    padding: 2px 5px;
    box-sizing: border-box;
    font-family: "PlayfairRegular";
}
#coldatospersonales .lineform label{
    font-size: 2vw;
}
#coldatospersonales .lineform input{
    font-size: 2vw;
}

#coldatospersonales h2{
    margin: 0 0 20px 0;
    padding: 0;
    text-align: center;
    font-size: 2vw;
    font-family: "PlayfairRegular";
}
#titleresumen{
    position: relative;
    float: left;
    width: 100%;
    font-family: "PlayfairRegular";
    font-size: 2vw;
    background-color: black;
    color: white;
    text-align: center;
    padding: 5px 0;
}
#resumen{
    position: relative;
    float: left;
    width: 100%;
    background-color: white;
    padding: 10px 0;
}
#pagarresumen{
    position: relative;
    float: left;
    width: 100%;
    background-color: #db0a3c;
    color: white;
    font-family: "PlayfairRegular";
    text-align: center;
    font-size: 2vw;
    padding: 5px 0;
    border: none;
}
.titleresumencombinado{
    position: relative;
    float: left;
    width: 100%;
    font-family: "PlayfairRegular";
    font-size: 2vw;
    text-align: center;
}
.tableresumen{
    position: relative;
    float: left;
    width: 94%;
    margin: 10px 3%;
}
.textocarrito{
    position: relative;
    float: left;
    width: 94%;
    margin: 10px 3%;
    color: #db0a3c;
}
.btnregistro{
    font-size: 2vw;
    font-family: "PlayfairItalic";
    padding: 5px 20px;
    display: inline-block;
    margin-bottom: 20px;
    text-decoration: none;
    box-sizing: border-box;
    width: 48%;
    text-align: center;
    position: relative;
    cursor: pointer;
}
.btnnoselect{
    color: black;
    border: solid 1px black;
    background-color: transparent;
}
.btnnoselect:hover{
    color: black !important;
    cursor: pointer;
}
.btnselect{
    background-color: #db0a3c;
    border: 1px solid #db0a3c;
    color: white;
}
.btnselect:hover{
    color: white !important;
    cursor: pointer;
}
.derecha{
    float: right;
}
.nav{
    background-color: #757270;
    color: white;
}
.nav a{
    color: white;
    width: 10%;
    font-size: 20px;
}

.nav p{
    width: 80%;
    margin-bottom: 0;
}
#popup-contenedor{
    background-color: black;

}

#popup-contenedor .modal-content{
    padding:1em;
    border: solid #db0a3c 3px;
    text-align: center;

}

#popup-contenedor .modal-content .modal-header hr{
    display: block;
    margin-left: auto;
    margin-right: auto;
    float:none!important;
    width:15%;
    border-width: 5px;
}
#popup-contenedor .modal-content .modal-body{
    font-size:20px;
}
#popupfooter{

    font-family: "PlayfairRegular"!important;
    font-style: italic;
    /*display:flex!important;
    width: 100%;*/
}

.izquierda{
    background-color: black!important;
    border-color: #db0a3c!important;
    font-size: 20px!important;


}

#clientes tbody tr td{
    width: 10%!important;
}

/*modal backend*/
#popup{
    z-index: 1000;
    position:fixed;
    top: 35%;
    right: 35%;
    padding: 1em;
    width: 30%;
    background-color: black;
}

.loading {
    color:#db0a3c;
    font-size: 3em;
}

.oculto{
    display:none!important;
}
.form-group{
    margin-bottom: 10px;
}

.circuloagencias{
    width: 10px;
    height: 10px;
    background-color: #D7F665;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-border-radius:5px;
    -khtml-border-radius:5px;
    display: inline-block;
}

.circuloclientes{
    width: 10px;
    height: 10px;
    background-color: #017D54;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-border-radius:5px;
    -khtml-border-radius:5px;
    display: inline-block;
}

@media (max-width: 1200px) {
    #popup{
        z-index: 1000;
        position:fixed;
        top: 25%;
        right: 25%;
        padding: 1em;
        width: 50%;
        background-color: black;
    }
}
@media (max-width: 992px) {
}
@media (max-width: 768px) {
    .imglogo{
        width: 60%;
    }
}
@media (max-width: 576px) {
}

.hover{
    cursor: pointer;
}

.mensajehorario {
    color: #db0a3c;
    font-size: 1.5vw;
    margin-top: 10px;
    font-family: "OpenSansBold";
}