/* 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; }

#selectHotel{ width: 270px !important;}

@media (max-width: 768px) {
    .usuario-conectado{ margin-top:10px;}
    .seleccione-hotel{ margin-top:0px;}
    .top-menu{ width:100% !important;}
    .page-header.navbar .top-menu .navbar-nav{ width: 100% !important; padding-left: 20px !important; padding-right: 20px !important;}
    .top-menu{ padding-top: 10px !important; padding-bottom: 20px !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;}
}
@media (max-width: 480px) {
    .usuario-conectado{ margin-top: 0px !important; font-size: 11px !important;}
    .seleccione-hotel{ margin-top: -6px !important; font-size: 11px !important;}
    .seleccione-hotel select{ font-size: 11px !important;}
    .top-menu .nav.navbar-nav li{ width: 40% !important; margin-right: 1% !important;}
    .top-menu .nav.navbar-nav li.dropdown{ width: 50px !important;}
    #selectHotel{ width: 130px !important; margin-bottom: 5px;}
    #dggridReserva_wrapper{ overflow-x: scroll;}
}

#dggrid_wrapper{ overflow-x: scroll;}

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

/* FILTROS */
#filtros.col-md-12 label{ display: block !important; float:left !important; width: auto !important; margin: 0px 0px 0px 0px !important; position: relative; /*background-color: #E1E1E1;*/ 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.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;}

.grupoG{ display: inline-block; float: left; padding: 2px; background-color: #fff; width: auto; margin-left: 20px; 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: 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{ padding: 5px 5% 5px 10% !important;}
.DTE_Field.hijo label{ border-left: 4px solid #f0ab5c; padding-left: 10px; }
.DTE_Field.hijo2{ border-left: 1px solid #ff0000; padding: 5px 20% 5px 10% !important; }
.DTE_Field.hijo2 label{ border-left: 4px solid #f0ab5c; 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%;}

/* 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; }

td.details-control {
    background: url('../images/details_open.png') no-repeat center center !important;
    cursor: pointer;
}
tr.shown td.details-control {
    background: url('../images/details_close.png') no-repeat center center !important;
}

td>div.DTE_Field>label {width: 0px !important; }
td>div.DTE_Field>div.DTE_Field_Input {width: 100% !important; }

.dt-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100%;
}

.chkStyle>label {
    width: 80% !important;
}

.chkStyle>div.DTE_Field_Input{
    width: 20% !important;
}