/* CLASES DE LAS DISTINTAS PAGINAS QUE COMPONEN EL PROYECTO - Se usan para resetar filtro y botones en resolución tablet y movil

    body.reservas{}
    body.calendario{}
    body.credenciales-espacio{}
    body.aperturas{}
    body.credenciales-sin-reserva{}
    body.listado-locks{}
    body.desconectadores-energia{}
    body.teclados-inalambricos{}
    body.gateways{}
    body.identificador-tarjetas{}
    body.credenciales-vacias{}
    body.listado-huespedes{}
    body.envios-policia{}
    body.tarjetas-auxilio{}
    body.listado-huellas{}
    body.listado-usuarios{}
    body.listado-empleados{}
    body.gestion-hoteles{}
    body.listado-espacios{}

 */

/* Estilos Callcenterplus */


/* Página de Login */
/* bg color */
.login {background-color: #F6F6F6 !important; }
.login .logo img{max-width: 250px; height: auto;}
.login .content {margin-top:0px;}
.login .content .login-form {display: none;}
.login .content .newpass-form {display: none;}
.login .content .recordatorio_contrasena_ok {display: none;}
.login .content .recordatorio_contrasena_ko {display: none;}
.login .content .reseteo_pass_2horas {display: none;}
.login .content .reseteo_pass_correcto {display: none;}
.login .content .form-control {background-color: #E1E1E1;color:#555;}
.login .content .form-control::placeholder {color:#555;}
.login .content .create-account{background-color: #E1E1E1;}

.page-header.navbar {/*background-color: #113055 !important;*/}
.page-sidebar, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover {/*background-color: #113055 !important;*/}
.page-header.navbar .page-logo .logo-default {margin: 2px 0 0 !important;height: 44px;}
.login .content .create-account p a {color:#555;}

.page-container-bg-solid .page-bar, .page-content-white .page-bar{margin:15px -20px 0;}

/* Para el calendario */
.jqtl-event-node::before {font-size:10px;} /*Fechas que se muestran en los huéspedes*/

#myTimeline{margin-left:20px; margin-right:20px; overflow-x: hidden;}
.jqtl-ruler-content-top{text-transform:uppercase;}
.jqtl-side-index {outline:0px !important; margin-right: 10px !important; margin-left: 10px !important;}
/*.jqtl-side-index-item {background-color: #3598dc !important;}*/
.jqtl-side-index .jqtl-side-index-margin {outline:0px !important;}
.card {border: 1px solid rgba(0,0,0,.125); margin-left:5px; background-color: #F6F6F6}
.card-block.timeline-event-view .h3{width:100%; padding-left:20px;}
.card-block.timeline-event-view .lead{width:100%; padding-left:20px;}
.jqtl-event-title { width:100%; padding-left:20px; font-family: inherit; font-size: 1.75rem; font-weight: 500; line-height: 1.1; color: inherit;}
.jqtl-event-content {width:100%; padding-left:20px;}
.jqtl-event-meta{width:100%; padding-left:20px;}

.jqtl-container label{text-align: center;}

.page-container {/*background-color: #217EBD !important;*/}
.page-footer {/*background-color: #E96807 !important;*/}

/* Filtros para inputs de dataTables */
.buscar {display:inline-block; width:70%;}
.mostrar {display:inline-block; width:50%;}

/*div.DTED_Lightbox_Wrapper {z-index:100000;}*/

.btnConIcono {width:100%;float:left;margin:5px;}

input.search-input { box-sizing: border-box; -moz-box-sizing: border-box; width: 100%; margin-bottom: 5px; height: auto;}

input[type="text"] { background-color: #fff; border: 1px solid #ccc; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition: border linear .2s,box-shadow linear .2s; -moz-transition: border linear .2s,box-shadow linear .2s;
    -o-transition: border linear .2s,box-shadow linear .2s; transition: border linear .2s,box-shadow linear .2s;
}

input[type="text"] { display: inline-block; height: 25px; padding: 4px 6px; margin-top: 5px; line-height: 20px; color: #555; vertical-align: middle; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}

.loader { border: 30px solid #ffc340; /* Light grey */ border-top: 30px solid #ffb040; border-radius: 50%; width: 160px; height: 160px; animation: spin 1.5s linear infinite; position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0;}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
table.dataTable{  -webkit-overflow-scrolling: touch;}

.modal2 { display: none; position: fixed; z-index: 999999; top: 0; left: 0; height: 100%; width: 100%; background-color: rgba(255, 255, 255, 0.6); }

/*Resetear el color de las tablas cuando está clickado
table.dataTable td.sorting_1, table.dataTable td.sorting_2, table.dataTable td.sorting_3, table.dataTable th.sorting_1, table.dataTable th.sorting_2, table.dataTable th.sorting_3 {background:#acbad5 !important;}*/

div.DTED_Lightbox_Wrapper {  z-index: 99999999 !important;}
div.DTED_Lightbox_Background{ z-index: 9995 !important;}
.editor-datetime{ z-index: 999999999 !important;}

table.dataTable tbody td.select-checkbox::before, table.dataTable tbody td.select-checkbox::after, table.dataTable tbody th.select-checkbox::before, table.dataTable tbody th.select-checkbox::after { top:inherit !important; }

.modal2{  z-index: 9999999999 !important; }
.modal-content .btn{ background: none !important; background-color:#333333 !important; text-shadow: none !important; color: #fff !important; border-radius: none !important; border:none !important;}
/*.modal-content .btn{ background: none; background-color:#333333; text-shadow: none !important; color: #fff; border-radius: none;}*/
.modal-content .btn.cancelar{ background-color:#ff0000 !important; }

#permisos {clear: both; display: block;}

#dggridReserva thead th, #dggridReserva tbody td { padding: 2px 6px !important;}

/*
#dggridReserva td{ font-size:11px !important;}
#dggridReserva td .fa{ font-size:10px !important;}
button.btnConIcono {padding: 1px 10px;}
*/

.jqtl-container {touch-action: none;}
.infoReserva{width: 450px !important; margin: 30px auto;}

.usuario-conectado{ margin-top:15px; margin-right:10px;}
.seleccione-hotel{ margin-top:8px;}
.seleccione-hotel label{ float: left !important; margin-right: 10px !important; padding-top: 7px; }
.seleccione-hotel select{ float: left !important; width:auto;  }

/*#selectHotel{ width: 100% !important;}*/

#dggrid_wrapper{ overflow-x: scroll;}

#filtros input[type="text"] { height: 34px; padding: 4px 6px; margin-top: 0px !important;}

/* FILTROS */

/*#filtros.col-md-12 label input{ line-height: inherit !important;}*/

/*#filtros #btnPeriodo, #filtros #btnActivos, #filtros #btnEntradaHoy, #filtros #btnSalidaHoy, #filtros #btnEntradaManana, #filtros #btnSalidaManana{ margin-top: 25px; float: left; margin-right: 5px;}*/

.bloque-filtros-1{ display:inline-block; width:25% !important; margin-right:1% !important; vertical-align:top;  }

.bloque-filtros-1 label{ display:inline-block; width:30% !important;}
.bloque-filtros-1 label.edif{ margin-right:5% !important;}

.bloque-filtros-2{ display:inline-block; width:30% !important; margin-right:1% !important; vertical-align:top; }
.bloque-filtros-3{ display:inline-block; width:47% !important; margin-right:0% !important; vertical-align:top; padding-top:20px; }
.bloque-filtros-5{ display:inline-block; margin-right:1% !important; vertical-align:top; }
.bloque-filtros-6{ display:inline-block; margin-right:0% !important; vertical-align:top; }

.bloque-filtros-4 label span{ display: block; }
.bloque-filtros-4 input{ width: auto !important; }

.bloque-filtros-4{ display:inline-block; width:40% !important; margin-right:1% !important; vertical-align:top; }

.grupoG{ background-color: #fff;}

/*.grupoG label{ width: 40% !important; }

.grupoG label span{ display: block; width: 100% !important;}
.grupoG input{ height: 34px !important;}*/

/*
#filtros.col-md-12 label{ display: block !important; float:left !important; width: auto !important; margin: 0px 0px 0px 0px !important; position: relative; padding: 5px;}
#filtros.col-md-12 label.edif{ width: 13% !important; background-color: #fff !important;}

#filtros.col-md-12 label .input-medium { width: 100% !important;}

#filtros #btnPeriodo, #filtros #btnActivos, #filtros #btnEntradaHoy, #filtros #btnSalidaHoy, #filtros #btnSalidaManana{ margin-top: 25px; float: left; margin-right: 5px;}

.grupoG{ display: inline-block; float: left; padding: 2px; background-color: #fff; width: auto; margin-right: 20px;}
.grupoG label{ width: 40% !important; }

.grupoG label span{ display: block; width: 100% !important;}
.grupoG input{ height: 34px !important;}
*/

/* DOS FILTROS */
#filtros.cincuenta.col-md-12 label{ width: 47% !important;}
/*#dggrid.dataTable{ display: block !important; }*/
input[type="date"].form-control, input[type="time"].form-control, input[type="datetime-local"].form-control, input[type="month"].form-control { line-height: inherit !important;}

#dggridReserva tbody td.tdBoton{ margin-right: 0px !important;}
.tdBoton button{ margin-right: 0px !important; margin-left: 0px !important;}

.jqtl-container { -webkit-overflow-scrolling: touch;}

#lblModal{ position: absolute; top: 40%; left: 60%; padding:10px !important; background-color: #fff; border: 1px solid #333; border-radius:10px; display: none;}
#lblModal.activo{ display: block;}

@media (max-width: 1380px) { 
    .bloque-filtros-1{ display:inline-block; width:25% !important; margin-right:1% !important; vertical-align:top;  }
    .bloque-filtros-2{ display:inline-block; width:35% !important; margin-right:1% !important; vertical-align:top; }
    .bloque-filtros-3{ display:inline-block; width:40% !important; margin-right:0% !important; vertical-align:top; padding-top:20px; }
    .bloque-filtros-5{ display:inline-block; margin-right:1% !important; vertical-align:top; }
    .bloque-filtros-6{ display:inline-block; margin-right:0% !important; vertical-align:top; }
}

@media (max-width: 1280px) { 
    .bloque-filtros-1{ display:inline-block; width:33% !important; margin-right:1% !important; vertical-align:top;  }
    .bloque-filtros-2{ display:inline-block; width:39% !important; margin-right:1% !important; vertical-align:top; }
    .bloque-filtros-3{ display:inline-block; width:40% !important; margin-right:0% !important; vertical-align:top; padding-top:20px; }
    .bloque-filtros-5{ display:inline-block; margin-right:1% !important; vertical-align:top; }
    .bloque-filtros-6{ display:inline-block; margin-right:0% !important; vertical-align:top; }
}

@media (max-width: 768px) { 
    #lblModal{ position: absolute; top: 55%; left: 2%; width: 96%; } 
    .modal2 .loader{ top:-150px !important;}
}

#ntarjeta:focus { background-color: #DDDDDD;}

/*.DTE_Field.padre{  border-top: 1px dashed #666 !important;}*/

.DTE_Field.hijo{ border-left: 1px solid #ff0000; padding: 5px 25% 5px 23% !important;}
.DTE_Field.hijo label{ border-left: 4px solid #36c6d3; padding-left: 10px; }
.DTE_Field.hijo2{ border-left: 1px solid #ff0000; padding: 5px 25% 5px 23% !important; }
.DTE_Field.hijo2 label{ border-left: 4px solid #36c6d3; padding-left: 10px; }

/* */
#main.calendarioFlechas{ position: relative;}
#main.calendarioFlechas #myTimeline{ position:relative; left: 10px !important; margin-right: 40px !important; }
#main.calendarioFlechas #moveLeft{ position: absolute; left: 2px; /*top:50%;*/ top:0px; /*height: 100% !important;*/ height: 40px;}
#main.calendarioFlechas #moveRight{  position: absolute; right: 2px; /*top:50%;*/ top:0px; /*height: 100% !important;*/ height: 40px; }

#main.calendarioFlechas .jqtl-ruler-line-item { background-color: #f6da9c !important; border-right:1px solid #000 !important;}

#main.calendarioFlechas .jqtl-ruler-content-top .jqtl-ruler-line-rows:nth-child(2) .jqtl-ruler-line-item{ background-color: #fce8bc !important;}
#main.calendarioFlechas .jqtl-side-index .jqtl-side-index-item { background-color: #fce8bc !important;}

/* EVEN ODD
#main.calendarioFlechas  .jqtl-side-index .jqtl-side-index-item:nth-child(odd) {
  background-color: #f6da9c !important;
}*/

#main.calendarioFlechas .jqtl-ruler-content-top .jqtl-ruler-line-rows .jqtl-ruler-line-item.domingo { background-color: #e0ab38 !important;}

table.dataTable tbody th, table.dataTable tbody td { padding: 4px 5px;}

/* ICONO AVISO */
.DTE_Field_Info{ position: relative; top: -27px; left: 270px; width: 40px;}
.icono-aviso{ font-size:18px; position:relative; top:3px; left:4px; color: #3598dc;}

table.dataTable thead th, table.dataTable thead td {padding-left: 5px;}

#capahuespedes{ padding: 6px 4px; background-color: #fff; border: 2px solid #3598dc; background-color:#3598dc; color: #fff; position: relative; top:10px; left: -271px;
width: 267px; border-radius: 4px; text-align: center; display: none; }

div.DTE_Body div.DTE_Body_Content div.DTE_Form_Info div.mensajePMS {
    background-color: #3598dc; color: #fff;
    padding: 6px 4px; text-align: center;
    border-radius: 4px; border: 2px solid #3598dc;
    width: 60%; position: relative; top: 10px; left: 20%;
}

/* CAMPO TELEFONO +34 telefono */
.campoPrefijo{ display: inline-block; width: 100% !important; padding-right: 0px;}
/*.campoPrefijo .DTE_Field_Input{ width: 10% !important; float: left !important;}*/

/*.campoTelefono{   position: relative; top: -47px;}*/
.campoTelefono .DTE_Label{ display: none !important;}

.campoTelefono  .DTE_Field_Input{ width: 49% !important;}

#DTE_Field_act_bookings-prefijo{ display: inline-block; width: 20%; margin-right: 2%;}
#campoPersonalizadoTelefono{ display: inline-block; width: 78%;}
#DTE_Field_act_staff-prefijo{ display: inline-block; width: 20%; margin-right: 2%;}

/* RESETEO FORM EDITAR HOTELES */
#customFormHoteles .DTE_Field.DTE_Field_Type_textarea label.DTE_Label{ float:none !important; width:100% !important; }
#customFormHoteles .DTE_Field.DTE_Field_Type_textarea div.DTE_Field_Input{ float:none !important; width:100% !important; }
#customFormHoteles  div.DTE_Field_Type_textarea textarea { min-height: 310px !important; }

#btnEntradaHoy{ margin-left:0px !important; }

.bloque-filtros-3 button{ margin-right:5px !important; margin-bottom:5px !important; font-size: 13px !important;}


/* RESETEOS POR PÁGINA 
body.reservas{}
    body.calendario{}
    body.credenciales-espacio{}
    body.aperturas{}
    body.credenciales-sin-reserva{}
    body.listado-locks{}
    body.desconectadores-energia{}
    body.teclados-inalambricos{}
    body.gateways{}
    body.identificador-tarjetas{}
    body.credenciales-vacias{}
    body.listado-huespedes{}
    body.envios-policia{}
    body.tarjetas-auxilio{}
    body.listado-huellas{}
    body.listado-usuarios{}
    body.listado-empleados{}
    body.gestion-hoteles{}
    body.listado-espacios{}
*/

body #filtros label select, body #filtros label input, #filtros label input[type="text"]{ width:100% !important; }



@media (max-width: 960px) {
    
    /* CALENDARIO */
    body.calendario #filtros label{ width:31% !important; margin-right:1%; }

    /* CREDENCIALES ESPACIO */
    body.credenciales-espacio #filtros label{ width:100% !important; margin-right:0; }
    body.credenciales-espacio #dggrid_wrapper .dt-buttons{ display:none !important; }

    /* APERTURAS */
    body.aperturas #filtros label{ width:31% !important; margin-right:1%; }
    body.aperturas #dggrid_wrapper .dt-buttons{ display:none !important; }

    /* CREDENCIALES SIN RESERVA */
    body.credenciales-sin-reserva{}

    /* LISTADO LOCKS - CIERRES */
    body.listado-locks #filtros label{ width:100% !important; margin-right:0; }
    body.listado-locks #dggrid_wrapper .dt-buttons{ display:none !important; }

    /*body.gateways .dt-buttons{ display:none !important; }
    body.gateways #dggrid_filter{ display:none !important; }*/

    body.identificador-tarjetas #filtros p { margin-top:0px !important; margin-bottom:20px !important;  }

    /* TARJETAS AUXILIO */
    body.tarjetas-auxilio #dggrid_wrapper .dt-buttons{ display:none !important; }

    /*body.gestion-hoteles .dt-buttons{ display:none !important; }*/
    body.gestion-hoteles #dggrid_filter{ display:none !important; }

    /* LISTADO ESPACIOS */
    body.listado-espacios #dggrid_wrapper .dt-buttons{ display:none !important; }
}




/* RESETEOS MEDIA QUERY */
@media (max-width: 960px) {
    a.btn.disabled { display: none; }
    .bloque-filtros-1 label { display: inline-block; width: 30% !important;}
    .bloque-filtros-1 label.edif{ margin-right:1% !important;}
   
    .bloque-filtros-2 label span{ display: block; }
    .bloque-filtros-5 label span{ display: block; }
    .bloque-filtros-6 label span{ display: block; }

    .top-menu{ width:100% !important; padding-left: 0px; padding-right: 0px;}
    .top-menu ul{ width:100% !important;}

    .top-menu .nav.navbar-nav li.usuario-conectado{ width:30% !important;}
    .top-menu .nav.navbar-nav li.usuario-conectado label{ display: inline-block !important; width: 100% !important;}
    .top-menu .nav.navbar-nav li.seleccione-hotel{ width: 62% !important;}
    .top-menu .nav.navbar-nav li.seleccione-hotel label{ display: inline-block; width: auto !important;}
    .top-menu .nav.navbar-nav li.seleccione-hotel select#selectHotel{ display: inline-block; width: auto !important; width: 73% !important;}

    .page-sidebar .page-sidebar-menu{ padding-top:0px !important; }
    .page-content-wrapper .page-content{ padding-top:0px !important; }

    .bloque-filtros-1{ display:inline-block; width:100% !important; margin-right:1% !important; vertical-align:top;  }
    .bloque-filtros-2{ display:inline-block; width:48% !important; margin-right:1% !important; vertical-align:top; }
    .bloque-filtros-3{ display:inline-block; width:100% !important; margin-right:0% !important; vertical-align:top; padding-top:20px; }
    .bloque-filtros-5{ display:inline-block; margin-right:1% !important; vertical-align:top; }
    .bloque-filtros-6{ display:inline-block; margin-right:0% !important; vertical-align:top; }
}

@media (max-width: 768px) {
    a.btn.disabled { display: none; }
    .usuario-conectado{ margin-top:10px;}
    .seleccione-hotel{ margin-top:0px;}
    .page-header.navbar .top-menu .navbar-nav{ width: 100% !important; padding-left: 0px !important; padding-right: 0px !important;}
    .top-menu{ width:100% !important; padding-top: 10px !important; padding-bottom: 20px !important; padding-left: 0px; padding-right: 0px;}
    .top-menu ul{ width:100% !important; }
    .top-menu .nav.navbar-nav li{ width: 40% !important; margin-right: 1% !important; }
    .top-menu .nav.navbar-nav li label strong{ display: block !important; clear: both;}
    .top-menu .nav.navbar-nav li.dropdown{ width: 50px !important;}
    /*#selectHotel{ width: 200px !important;}*/
    #dggridReserva_wrapper{ overflow-x: scroll;}
        .top-menu .nav.navbar-nav li.seleccione-hotel select#selectHotel{  width: 100% !important;}

    .page-sidebar .page-sidebar-menu{ padding-top:0px !important; }

    .page-content-wrapper .page-content{ padding-top:20px !important; }

    .col-md-6{ display:block; width:100%; margin-right:0;}
    div.dt-buttons { text-align: left;}
    div.dt-buttons a{ margin: 0px 5px 5px 0px; }

    .usuario-conectado{ display:none !important; }
    .top-menu .nav.navbar-nav li.seleccione-hotel{ margin-left:10px !important; width:85% !important; }
    .dropdown-quick-sidebar-toggler{ margin-top:23px !important; }

}
@media (max-width: 480px) {
    a.btn.disabled { display: none; }
    #filtros .grupoG label input, #filtros .grupoG label input[type="text"], #filtros .grupoG label select[type="text"]{ width:72px !important; }

    .top-menu .nav.navbar-nav li{ width: 40% !important; margin-right: 1% !important;}
    .top-menu .nav.navbar-nav li.dropdown{ width: 50px !important; margin-right: 0px; position: relative; top:-10px;}

    .top-menu .nav.navbar-nav li.usuario-conectado{ display: none !important;}
    .top-menu .nav.navbar-nav li.seleccione-hotel{ /*margin-top: -6px !important;*/ font-size: 11px !important; width: 80% !important;}
    .top-menu .nav.navbar-nav li.seleccione-hotel label{ display: none !important;}
        .dropdown-quick-sidebar-toggler{ margin-top:0px !important; }

    .seleccione-hotel select{ font-size: 11px !important; width: 100% !important;}

    #dggridReserva_wrapper{ overflow-x: scroll;}

    .bloque-filtros-1{ display:inline-block; width:100% !important; margin-right:0% !important; vertical-align:top;  }
    .bloque-filtros-2{ display:inline-block; width:62% !important; margin-right:0% !important; vertical-align:top; }
    .bloque-filtros-5{ display:inline-block; width:46% !important; margin-right:0% !important; vertical-align:top; }

    #filtros > input { width:87px !important; }
    #btnPeriodo{ font-size:13px !important;   padding: 6px 6px; }
    #filtros input[type="text"] { width:72px !important; }
    .page-content-wrapper .page-content .page-title { margin-bottom: 10px !important;}
    .bloque-filtros-3 { padding-top: 0px !important;}
    #filtros{ margin-bottom: 5px !important; }
}

#btnPeriodo{ margin-left:0px !important; }

.desactivado{ opacity: 0.5;}
.derecha{ margin-left: 30px;}
.ms-container {width: 80% !important;}