@charset "utf-8";
@font-face {
    font-family: "cabiar";
    font-style: normal;
    font-weight: normal;
    src: url(CaviarDreams.ttf);

}

@media (min-width: 1px) {
    .my-row-cols-5 > * {
      flex: 0 0 20%;
      max-width: 20%;
    }
}

@media (min-width: 1000px) {
	.my-row-cols-lg-10 > * {
	  flex: 0 0 10%;
	  max-width: 10%;
	}
}


/* CSS Document
Author Hugo Uh
*/
.btn-secondary{
	background-color: #606060;
}
.btn-master{
	background-color: #A0A0A0;
}
.bg-disponible{
	background-color: #34933E;
}
.bg-cobrar{
	background-color: pink;
}
.bg-ocupado{
	background-color: #CA4444;
}
.bg-restaurante{
	background-color: #4E82CC;
}
.bg-restaurante-cliente{
	background-color: #9e51d4;
}
.bg-sucio{
	background-color: #BBB300;
}
.bg-sucio-reservado-cobrar{
    border-style: hidden;
    background: -webkit-linear-gradient(-60deg, #BBB300 0, #BBB300 49%, pink 51%, pink 100%);
    background: -moz-linear-gradient(150deg, #BBB300 0, #BBB300 49%, pink 51%, pink 100%);
    background: linear-gradient(150deg, #BBB300 0, #BBB300 49%, pink 51%, pink 100%);
    background-position: 50% 10%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
}
.bg-sucio-reservado-pagado{
    border-style: hidden;
    background: -webkit-linear-gradient(-60deg, #BBB300 0, #BBB300 49%, #CA4444 51%, #CA4444 100%);
    background: -moz-linear-gradient(150deg, #BBB300 0, #BBB300 49%, #CA4444 51%, #CA4444 100%);
    background: linear-gradient(150deg, #BBB300 0, #BBB300 49%, #CA4444 51%, #CA4444 100%);
    background-position: 50% 10%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
}
.bg-limpieza{
	background-color: purple;
}
.bg-limpieza-reservado-cobrar{
    border-style: hidden;
    background: -webkit-linear-gradient(-60deg, purple 0, purple 49%, pink 51%, pink 100%);
    background: -moz-linear-gradient(150deg, purple 0, purple 49%, pink 51%, pink 100%);
    background: linear-gradient(150deg, purple 0, purple 49%, pink 51%, pink 100%);
    background-position: 50% 10%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
}
.bg-limpieza-reservado-pagado{
    border-style: hidden;
	background-color: purple;
    background: -webkit-linear-gradient(-60deg, purple 0, purple 49%, #CA4444 51%, #CA4444 100%);
    background: -moz-linear-gradient(150deg, purple 0, purple 49%, #CA4444 51%, #CA4444 100%);
    background: linear-gradient(150deg, purple 0, purple 49%, #CA4444 51%, #CA4444 100%);
    background-position: 50% 10%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
}
.bg-mantenimiento{
	background-color: #603333;
}
.bg-bloqueado{
	background-color: #919191;
}
.bg-cancelar{
	background-color: #FF9269;
}
.bg-detallando{
	background-color: blue;
}
.bg-regresa{
	background-color: #7E3F3F;
}
.bg-deshabilitado{
	background-color: #31313E;
}
.btn-master .master_new_status {
	display: none;
}

.btn-master:hover .master_status {
	display: none;
}

.btn-master:hover .master_new_status {
	display: block;
}

.master_desconectado {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' viewBox='0 0 16 16' class='bi bi-plug' fill='white' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M6 0a.5.5 0 0 1 .5.5V3h3V.5a.5.5 0 0 1 1 0V3h1a.5.5 0 0 1 .5.5v3A3.5 3.5 0 0 1 8.5 10c-.002.434-.01.845-.04 1.22-.041.514-.126 1.003-.317 1.424a2.083 2.083 0 0 1-.97 1.028C6.725 13.9 6.169 14 5.5 14c-.998 0-1.61.33-1.974.718A1.922 1.922 0 0 0 3 16H2c0-.616.232-1.367.797-1.968C3.374 13.42 4.261 13 5.5 13c.581 0 .962-.088 1.218-.219.241-.123.4-.3.514-.55.121-.266.193-.621.23-1.09.027-.34.035-.718.037-1.141A3.5 3.5 0 0 1 4 6.5v-3a.5.5 0 0 1 .5-.5h1V.5A.5.5 0 0 1 6 0zM5 4v2.5A2.5 2.5 0 0 0 7.5 9h1A2.5 2.5 0 0 0 11 6.5V4H5z'/></svg>");
}

.master_peatonal_cerrada {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' viewBox='0 0 16 16' class='bi bi-door-closed-fill' fill='white'  fill-opacity='0.6' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4 1a1 1 0 0 0-1 1v13H1.5a.5.5 0 0 0 0 1h13a.5.5 0 0 0 0-1H13V2a1 1 0 0 0-1-1H4zm2 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/></svg>");
}

.master_peatonal_abierta {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' viewBox='0 0 16 16' class='bi bi-door-open-fill' fill='yellow'  fill-opacity='0.8' xmlns='http://www.w3.org/2000/svg'> <path fill-rule='evenodd' d='M1.5 15a.5.5 0 0 0 0 1h13a.5.5 0 0 0 0-1H13V2.5A1.5 1.5 0 0 0 11.5 1H11V.5a.5.5 0 0 0-.57-.495l-7 1A.5.5 0 0 0 3 1.5V15H1.5zM11 2v13h1V2.5a.5.5 0 0 0-.5-.5H11zm-2.5 8c-.276 0-.5-.448-.5-1s.224-1 .5-1 .5.448.5 1-.224 1-.5 1z'/></svg>");
}

.master_cortina_cerrada {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' class='bi ' fill='white' fill-opacity='0.6' x='0px' y='0px' viewBox='0 0 400 400' style='enable-background:new 0 0 400 400;' xml:space='preserve' xmlns='http://www.w3.org/2000/svg'><rect x='58' y='292.516' width='284' height='42'/> <rect x='58' y='234.516' width='284' height='42'/> <rect x='58' y='350.516' width='284' height='45'/> <path d='M200,4.484L0,115.685v279.831h42V168.797c0-4.418,3.248-8.282,7.666-8.282h300.668c4.418,0,7.666,3.864,7.666,8.282					v226.718h42V115.685L200,4.484z'/> <rect x='58' y='176.516' width='284' height='42'/></svg>");
}

.master_cortina_abierta {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' class='bi ' fill='yellow' fill-opacity='0.8' x='0px' y='0px' viewBox='0 0 400 400' style='enable-background:new 0 0 400 400;' xml:space='preserve' xmlns='http://www.w3.org/2000/svg'><path d='M200,4.484L0,115.685v279.831h42V168.797c0-4.418,3.248-8.282,7.666-8.282h300.668c4.418,0,7.666,3.864,7.666,8.282 						v226.718h42V115.685L200,4.484z'/><rect x='58' y='176.516' width='284' height='42'/>	</svg>");
}

.master_luz_encendida {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' class='bi ' fill='yellow' fill-opacity='0.8'   xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'> <path d='M96.06 454.35c.01 6.29 1.87 12.45 5.36 17.69l17.09 25.69a31.99 31.99 0 0 0 26.64 14.28h61.71a31.99 31.99 0 0 0 26.64-14.28l17.09-25.69a31.989 31.989 0 0 0 5.36-17.69l.04-38.35H96.01l.05 38.35zM0 176c0 44.37 16.45 84.85 43.56 115.78 16.52 18.85 42.36 58.23 52.21 91.45.04.26.07.52.11.78h160.24c.04-.26.07-.51.11-.78 9.85-33.22 35.69-72.6 52.21-91.45C335.55 260.85 352 220.37 352 176 352 78.61 272.91-.3 175.45 0 73.44.31 0 82.97 0 176zm176-80c-44.11 0-80 35.89-80 80 0 8.84-7.16 16-16 16s-16-7.16-16-16c0-61.76 50.24-112 112-112 8.84 0 16 7.16 16 16s-7.16 16-16 16z'/>	</svg>");
}

.master_luz_apagada {
	content: url("data:image/svg+xml; utf8, <svg width='23' height='16' class='bi ' fill='white' fill-opacity='0.6'    xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'> <path d='M176 80c-52.94 0-96 43.06-96 96 0 8.84 7.16 16 16 16s16-7.16 16-16c0-35.3 28.72-64 64-64 8.84 0 16-7.16 16-16s-7.16-16-16-16zM96.06 459.17c0 3.15.93 6.22 2.68 8.84l24.51 36.84c2.97 4.46 7.97 7.14 13.32 7.14h78.85c5.36 0 10.36-2.68 13.32-7.14l24.51-36.84c1.74-2.62 2.67-5.7 2.68-8.84l.05-43.18H96.02l.04 43.18zM176 0C73.72 0 0 82.97 0 176c0 44.37 16.45 84.85 43.56 115.78 16.64 18.99 42.74 58.8 52.42 92.16v.06h48v-.12c-.01-4.77-.72-9.51-2.15-14.07-5.59-17.81-22.82-64.77-62.17-109.67-20.54-23.43-31.52-53.15-31.61-84.14-.2-73.64 59.67-128 127.95-128 70.58 0 128 57.42 128 128 0 30.97-11.24 60.85-31.65 84.14-39.11 44.61-56.42 91.47-62.1 109.46a47.507 47.507 0 0 0-2.22 14.3v.1h48v-.05c9.68-33.37 35.78-73.18 52.42-92.16C335.55 260.85 352 220.37 352 176 352 78.8 273.2 0 176 0z'/> </svg>");
}

/* ---------------------------------------------- Scrollbar */

/* The emerging W3C standard
   that is currently Firefox-only */
* {
  scrollbar-width: thin;
  scrollbar-color: #808080	 #31313E;
}

/* Works on Chrome/Edge/Safari */
*::-webkit-scrollbar {
  width: 10px;
}
*::-webkit-scrollbar-track {
  background: #31313E;
}
*::-webkit-scrollbar-thumb {
  background-color: #808080;
  border-radius: 10px;
  border: 3px solid #31313E;
}

/* ---------------------------------------------- Quitar flechas de numeros */
/* Chrome, Safari, Edge, Opera /
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox /
input[type=number] {
  -moz-appearance: textfield;
}
// */

body{
    background-color: #31313E;
}

.vertical-align{
    display: flex;
    align-items: center;
}
.my-custom-scrollbar {
	position: relative;
	max-height: 400px;
	overflow: auto;
}
.table-wrapper-scroll-y {
	display: block;
}



#detallerestaurante{
    width: 100%;
    height: 50%;
    position: absolute;
    top:  35%;
    left: 0%;
}
#aviso_pago_mensual{
    font-size: 150%;
    width: 40%;
    margin-left: 32%;
    margin-top: 30px;
    text-align: center;
    background-color : red;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
}.boton_imagen_cobro{
     border-radius: 5px;
    background-color:#FE2E2E;
    height: 110%;
}
#imajen_Formualrio{
    margin-left: 35%;
    width: 30%;
}
#mosrest1{
  color:red;
}
#infomracion_principal{
    font-size: 80%;
    width: 15%;
    margin-top: 1%;
    margin-left: 1%;
    float: left;
    height: 90%;
    background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FAFAFA),
    color-stop(1, #A8A8A8)
    );
    background-image: -o-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: -moz-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: -webkit-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: -ms-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: linear-gradient(to bottom, #FAFAFA 0%, #A8A8A8 100%);
       -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
}
#titlulo_inf_prin{
    width: 70%;
    text-align: left;
    float: left;
}
#total_inf_prin{
    width: 30%;
    text-align: left;
    float: left;
}
#det_pro{
    width: 16%;
    height: 18%;
    float: left;
    text-align: center;
    margin-left: 2%;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
    background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FAFAFA),
    color-stop(1, #A8A8A8)
    );
    background-image: -o-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: -moz-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: -webkit-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: -ms-linear-gradient(bottom, #FAFAFA 0%, #A8A8A8 100%);
    background-image: linear-gradient(to bottom, #FAFAFA 0%, #A8A8A8 100%);
}
#comentario{
    width:35%;
    float: left;
}
#prestamoarticulo{
    position: absolute ; top: 30%; left: 20%; ;
    width: 60%;
    height: 50%;

}
#quitaarti{
    position: absolute ; top: 15%; left: 15%;
    width: 60%;
    height: 60%;
    text-align: center;
}
#reglon_fepor_mat{
    margin-top: 2px;
    text-align: center;
    width: 100%;
    height: 30px;
    line-height: 30px;

}
#reglon_fepor_mat_alto{
    margin-top: 2px;
    text-align: center;
    width: 100%;
    height: 45px;

}
#reporte_entradas3{
    width: 90%;
    height: 75%;
}
#reporte_entradas{
    width: 90%;
    height: 75%;
}
#reporte_entradas2{
    width: 90%;
    height: 85%;
}
#caja_prestamo{
    width: 80%;
    height: 50px;
    margin-top: 10px;
    font-size: 25px;
}
#btn_recuperado{
    float: left;
    width: 42%;
    height: 25%;
    margin: 3%;
    font-size: 95%;
    background-color: green;
}
#btn_norecuperado{
    float: left;
    width: 42%;
    height:25%;
    margin: 3%;
    font-size: 80%;
    background-color: red;
}
#quitandoarticulo{
    margin-left: 5px;
    text-align: center;
    width: 33%;
    float: left;
    height: 40%;
    font-size: 130%;
    border-color: white;
    border-style: solid;
    border-width: 2px;
}
#video_noasig{
    background-color: red;
}
#video_informacion{
    float: left;
}
#video_nasi{
    float: left;
}
#video_video{
    margin-left: 5%;
    width: 95%;
    margin-right: 5%;
    height: 85%;
}
#video_fecha{

}
#historialplacas{
    position: absolute;
    top:  30%;
    left: 30%;
    width: 40%;
    height: 25%;
    border-color: white;
    border-style: solid;
    border-width: 2px;
}
#renglon_historiaplacas{
    margin-top: 1%;
    width: 100%;
    text-align: center;
    height: 27%;
    line-height: 27px;
}
#input_saber_historia_placas{
    width: 95%;
    height: 80%;
}
#boton_saber_historia_placas{
    width: 97%;
    height: 90%;
}
#reporte_placas{
    border-color: white;
    border-style: solid;
    border-width: 2px;
    width: 20%;
    height: 30%;
    position: absolute;
    top: 10%;
    left: 40%;
}
#motivo_video{
    margin-left: 15px;
    width: 500px;
    margin-bottom: 15px;
    height: 50px;
    font-size: 300%;
    text-align: center;
   border-style: solid;
   border-color: white;
   border-width: 2px;

}
/*Area Corte-----------------------------------------------------------------------------------------------------------------------------------------------*/
#teclado_numerico{
    position: absolute;
    top:  105px;
    left: 300px;
    width: 28%;
    height: 70%;
}
#numero_teclado{
    color: white;
    width: 28%;
    margin-top: 2%;
    margin-left: 1%;
    margin-right: 1%;
    height: 22%;
    font-size: 500%;
    float: left;
    border-style: solid;
    border-color: white;
    border-width: 2px;
}
#numero0_teclado{
    color: white;
    width: 64%;
    margin-top: 2%;
    margin-left: 1%;
    margin-right: 1%;
    height: 22%;
    font-size: 500%;
    float: left;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
}
#inform_ticket{
    float: left;
    width: 19%;
    text-align: center;
    height: 180%;
    line-height: 40px;
    font-size: 120%;
    line-height: 100%;
}
#corte_caja{
    width: 100%;
    height: 50%;

}
#corte_renglon{
    width: 100%;
    height: 2.5%;
}
#corte_habitacion{
    width: 37%;
    height:100%;
    margin-left: 1%;
    margin-right: 1%;
    float: left;
    border-style: solid;
    border-color: white;
    border-width: 2px;
}
.sombra_caja{
    border-bottom: 3px solid #C2BEC2;
}
#corte_gastos{
    margin-left: 1%;
    margin-right: 1%;
    width: 28%;
    height:100%;
    float: left;
    border-style: solid;
    border-color: white;
    border-width: 2px;
}
#renglon_habitacion{
    width: 100%;
    height: 5%;
}
#cantidad_habitacion{
    width: 10%;
    height: 100%;
    float: left;
    font-size: 110%;
    text-align: center;
}
#canti_pro{
    width: 30%;
    float: left;
}
#nombre_pro{
    width: 70%;
    float: left;
}
#caja_baucher{
    width: 20%;
    float: left;
    margin-top: 3px;
}
.Boton_Corte{
    background-color: green;
}
#imagen_boton_corte{
    width: 10%;
    height: 100%;
    float: left;
}
#caja_rest{
    margin-top: 1%;
    width: 31%;
    float: left;
    margin-right: 1%;
    margin-left: 1%;
    border-style: solid;
    border-color: white;
    border-width: 2px;
}
#tipo_habitacion{
    width: 60%;
    height: 100%;
    float: left;
    font-size: 110%;
    text-align: left;
}
#precio_habitacion{
    width: 10%;
    height: 100%;
    float: left;
    font-size: 110%;
    text-align: left;
}
.caja_gastos{
    color: red;
}
/*Termina Area corte---------------------------------------------------------------------------------------------------------------------------------------*/

/*area de cobro--------------------------------------------------------------------------------------------------------------------------------------------*/
#titulo_habitacion{
    position: absolute;
      top:  50px;
      left: 40%;
      font-size: 40px;
}
#caja{

    float:left;
    position: absolute;
      top:  100px;
      left: 50px;
    width: 90%;
    height: 600px;
    font-size: 16px;
}
#caja_cobro{
    width: 35%;
    height: 550px;
    float: left;
}
#caja_restaurant{
    width: 62%;
    height: 500px;
    float: left;
    margin-left: 30px;

}
#caja_restaurant_titulo{
    width: 100%;
    height: 18%;

}
#img_texto_rest{
    text-align: center;
    font-family: cabiar;
}
#img_boton_rest{
    width: 50%;
    margin-left: 30%;
}
#caja_cinco{
    width:18%;
    height: 40px;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
    float: left;
    text-align: center;
    line-height: 35px;
    margin-left: 1%;
}
#rest_most_comanda{
    width: 30%;
    height: 40px;
    background-color: gray;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
    float: left;
    overflow: auto;
    font-size: 12px;
}
#caja_mostrarrest{
    font-size: 30px;
}
#caja_arearestaurante{
    top:18%;
    position: absolute;
    left: 38%;
    width: 61%;
    height:380px;
    overflow-y:scroll;
}
#restaurante_titulo{
    font-size: 28px;
}
#caja_cuatro{
    width: 25%;
    float: left;
    height: 38px;
    text-align: center;
    line-height: 33px;
    text-align: center;
}
#caja_renglon{
    margin: 3px;
    width: 99%;
    height: 40px;
}
#caja_dos{
    width: 50%;
    float: left;
    height: 38px;
    text-align: center;
    line-height: 33px;
    text-align: center;
}
#rest_most_productos{

    font-size: 12px;
    width: 31%;
    margin: 3px;
    float: left;
    height: 47px;
    text-align: center;
    overflow:auto;
    font-family: cabiar;
    font-size: 105%;
    background-color: #4E82CC;
    position: relative;
}
#img_pequena_bot_rest{
    position: absolute;
    top: 1%;

}
#nombre_buscar_resta{
    width: 60%;
    margin-left: 40%;
    height: 90%;
    font-size: 80%;

}
#precio_buscar_resta{
    position: absolute;
    top:15%;
    left: 18.5%;
}
#color_verde{

    width: 23%;
    margin-left: 8px;
    height:85px;
    float: left;
    font-size: 14px;
    margin-bottom: 5px;
    text-align: center;
    background-color: #4E82CC;
}
#color_morado{

    width: 23%;
    height:85px;
    margin-left: 8px;
    margin-bottom: 5px;
    float: left;
    font-size: 14px;
    text-align: center;
    background-color: #4E82CC;
}
#img_res_solo{
    width: 25%;
    height: 100%;
    float: left;
}
#res_solo_alim{
    background-color: #4E82CC;
    width: 100%;
    height:50px;
    line-height: 50px;
    margin-bottom: 10px;
}
#agregar_arest{
    width: 10%;
    height: 27px;
    font-size: 28px;
}
#boton_restaurante_cobro{
    float: left;
    width: 40%;
    margin-left: 8%;
    height: 50px;
    line-height: 40px;
    font-size: 28px;
    background-color: green;
}
#boton_restaurante_comanda{
    float: left;
    width: 40%;
    margin-left: 10%;
    height: 50px;
    line-height: 40px;
    font-size: 28px;
    background-color: purple;
}
#boton_restaurante_cobro_in{
    float: left;
    width: 40%;
    margin-left: 8%;
    height: 50px;
    line-height: 40px;
    font-size: 20px;
    background-color: green;
}
#boton_restaurante_comanda_in{
    float: left;
    width: 40%;
    margin-left: 10%;
    height: 50px;
    line-height: 40px;
    font-size: 20px;
    background-color: purple;
}
#restaurante_titulo{
    text-align: center;
}
#caja_areacobro{
    text-align: center;
}
/*Termina area de cobro------------------------------------------------------------------------------------------------------------------------------------*/
#formentrada{
	width:100%;
	height:30px;
	margin:10px;
}
#regresar{
    width:80px;
     height: 40px;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
     background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #E8E8E8)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #E8E8E8 100%);


}
#rescor{
    width: 50%;
    float: left;
}
#cancelacionrest{
    width: 22%;
    float: left;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    border-color: white;
    border-style: solid;
    border-width: 2px;
    margin-left: 5px;
    }
#noasig{
    width:48%;
    float:left;
    margin: 5px;
    height: 400px;
    border-top-width: 5px;
    border-top-color: white;
    border-top-style: solid;
    border-right-width: 5px;
    border-right-color: white;
    border-right-style: solid;
}
#asig{
    width:48%;
    float:left;
    margin: 5px;
    height: 400px;
    border-top-width: 5px;
    border-top-color: white;
    border-top-style: solid;
    border-left-width: 5px;
    border-left-color: white;
    border-left-style: solid;
}
#totales{
    font-size: 30px;
}
#botonformulario{
	width:100%;
	margin:10px;
	height:40px;
}
#tituloformulario{
	font-size:40px;
	margin:7px;
    color: white;
}
#bloquear{
    width: 100%;
    height:35px;
}
#bloqueartext{
    width: 98%;
    height:70px;
}
#formdatos{
    width:48%;
    float: left;
    height: 180px;
    font-size: 15px;
}
#matricula{
    width: 45%;
   float: left;
}
/* #cantidadpersona{
    width: 50px;
} */
#titulocobro{
    width: 30%;
   float: left;
    height: 40px;
}
#titulocobro2{
    width: 35%;
   float: left;
    height: 30px;
    text-align: right;
}
#titulocobro1{
     width: 25%;
   float: left;
    height: 30px;
    text-align: right;
}
#labelcobro{
    width: 60px;
}
#restaurante{
    background-color: red;
}
#restaurante1{
    width: 99%;
    padding-top:300px;
    margin: 2px;
    -webkit-border-radius: 8px 8px 8px 8px;
    -webkit-box-shadow: 2px 2px 5px #999;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #E8E8E8)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #E8E8E8 100%);
}
#tipodepago{
    width:22%;
    height:30px;
    margin: 3px;
    line-height: 30px;
    float: left;
    border-width: 2px;
    border-color:white;
    border-style: solid;
}
#motdecan{
    width:21%;
    height:30px;
    margin: 5px;
    text-align: center;
    margin-top: 30px;
    border-style: solid;
    border-color: white;
    border-width: 2px;
    float: left;
     font-size:12px;
    line-height: 30px;
}
#comprar{
    font-size:18px;
}
#etiquetacomprar{
    width:20%;
    float: left;
    text-align: right;
}
#desmanteni{
    width:40%;
    float: left;
    margin: 5px;
    height:30px;
    border-style: solid;
    border-width: 2px;
    border-color: white;
}
#adminis{
    width: 100%;
    margin-top: 5px;
     -webkit-border-radius: 8px 8px 8px 8px;
     -webkit-box-shadow: 2px 2px 5px #999;
    height:30px;
    line-height: 30px;
    text-align: center;
    float: left;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #E8E8E8)
);
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #E8E8E8 100%);
background-image: linear-gradient(to bottom, #FFFFFF 0%, #E8E8E8 100%);
}
#tipolimpieza{
    margin-left: 40px;
    width:35%;
    margin: 5px;
    float: left;
    height:40px;
    line-height: 40px;
    border-style: solid;
    border-color:white;
    border-width: 3px;
}
.cronometro{
    font-size: 15px;
    color: red;
}
.estado2{
    font-size:  18px;
}
#inputcomprar{
     width:20%;
    margin: 1px;
    float: left;
    height:18px;
}
#formulario{
	/*Ponemos formato al formulario de entrada*/
	margin-left:40%;
	width:20%;
	text-align:center;
}
#titulohab{
    font-size: 14px;
    margin-top:1px;
}
#informa{
    width:33%;
    height:70%;
    float: left;
    text-align: left;
    font-size: 13px;
}#informa_res{
    width:33%;
    height:70%;
    float: left;
    text-align: left;
    font-size: 13px;
    overflow-y: scroll;
}
/* #cantidadpersona{
    margin-left: 30%;
    width:28%;
     height:30px;
     float: left;
} */
/* #preciopersona{
    width:40%;
     height:30px;
} */
#matricula{
    width:40%;
    height:30px;
}
#cantidadpersona1{
    margin-left: 20%;
    width:28%;
     height:30px;
     float: left;
    line-height: 35px;
}
#labelagregada{
    width: 150px;
    height: 30px;

}
#labelagregadaboton{
    width:70%;
    height: 30px;
    margin-left: 10%;
}
#formpextras{
    width:48%;
    float: left;
    height: 30px;
}
#formpextras1{
    width:90%;
    float: left;
    height: 30px;
}
#tiempoextra{
    width:40%;
    float: left;
    height: 30px;
    margin: 30px;
    line-height: 30px;
    border-width: 2px;
    border-color: white;
    border-style: solid;
}
#cantidadhora1{
    margin-left: 20%;
    width:28%;
     height:30px;
    float: left;
    line-height: 35px;
}

#descri1{
    width: 10%;
    float: left;
    font-size: 13px;
}
#titulogastos{
    text-align: right;
    color: red;
    margin-right: 10px;
}
#descri2{
    width: 60%;
    float: left;
    font-size: 13px;
}
#espaciotoketres1{
    margin: 1%;
    width: 30%;
    float: left;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
#espaciotoketres2{
     margin: 1%;
    width: 30%;
    float: left;
     -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
#espaciotoketres3{
    margin: 1%;
    width: 30%;
    float: left;
     -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
#descri3{
    width: 15%;
    float: left;
    font-size: 13px;
}
#tituloscorte{
    text-align: right;
    margin-right: 10px;
}
#descri4{
    width: 15%;
    float: left;
    font-size: 13px;
}
#coceptocorte{
    width: 20%;
    float: left;
}
#areadetrabajo3{
    margin-left: 28%;
    width: 20%;
}
#are1{
    float: left;
    height: 450px;
    width: 48%;
    margin: 1.5%;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
#are2{
    float: left;
    height: 450px;
    width: 18%;
    margin: 1.5%;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
.gastos{
    color: red;
}
.borargasto{
    height: 35px;
    line-height: 35px;
    text-align: center;
}
#baucher{
    width: 50%;
    float: left;
}

#are3{
    float: left;
    height: 450px;
    width: 25%;
    font-size: 13px;
    margin: 1.5%;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
#espacio1{
    width: 70%;
    float: left;
}
#espacio2{
    width: 30%;
    float: left;
}
#arearestaurant{
    width: 95%;
    margin: 2.5%;
    float: left;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}

#Hospedaje{
    margin-top: 15px;
    width: 90%;
    margin-left: 5%;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);
}
#tiini{
    width: 50%;
    float: left;
    text-align: center;
}
#ticket{
    width: 50%;
    float: left;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
}
#tickerfeche{
    text-align: center;
}


#gastos{
    width: 25%;
    float: left;
}
#gastoscant{

     width: 20%;
     float: left;
     height: 25%;
     text-align: center;
    border-color: white;
    border-style: solid;
    border-width: 2px;
    visibility: hidden;
}
#gasto{
    margin-top: 8px;
    text-align: center;
    line-height: 30px;
    width: 75%;
    height: 30px;
    border-color: white;
    border-style: solid;
    border-width: 2px;

}
#gasto_titulo{
    margin-top: 8px;
    text-align: center;
    line-height: 30px;
    width: 75%;
    height: 30px;

}
#caja_buscador_placas{
    margin-left: 30%;
    width: 40%;
    height: 70%;

}
#formulario_gastos_nombre{
    margin-top: 3%;
    width: 90%;
    height: 25px;

}
#Busca_de_Placas{
    width: 100%;
    height: 24%;
}
#botom_buscar_placa{
    width: 65%;
    height: 30px;
}
#detalleres0{
    width: 100%;
    margin-top: 4px;
    font-size: 14px;
    margin-left: 2.5%;
    float: left;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #8ADE6F)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #8ADE6F 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #8ADE6F 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #8ADE6F 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #8ADE6F 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #8ADE6F 100%);
}
#detalleres1{
    width: 100%;
    margin-top: 4px;
    font-size: 14px;
    margin-left: 2.5%;
    float: left;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #4C4B73)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #4C4B73 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #4C4B73 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #4C4B73 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #4C4B73 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #4C4B73 100%);
}
#valoresdecantidad{
    width:33%;
}
#imagen_detalle{
    width: 30%;
    height: 80%;
    float: left;
}
#info_detalle{
    width: 70%;
    height: 80%;
    float: left;
}
#recamarera{
	width:12%;
    height:90px;
    margin:2.5px;
    float:left;
    background-color: #31313E;
    position: relative;
    color:  white;
    font-size: 90%;
    font-family: cabiar;
    border-color: white;
    border-style: solid;
    border-width: 1px;
	}
#forma_pago{
    width:18%;
    height:45px;
    margin:2.5px;
    float:left;
    background-color: #7FAF80;
    position: relative;
    color:  white;
    font-size: 110%;
    font-family: cabiar;
    }
#menu{
	/*Formato para el menu*/
    	width:100%;
    	height:40px;
    	color:white;
        position: relative;
        background-color: #C4C4C4;
        font-family: cabiar;

}
#submenu{
    position: absolute;
    top: -15%;
    left:92%;
    float:left;
    margin:10px;
    width: 7%;
    height: 80%;
    font-size:195%;
    font-family: cabiar;
    background-color: #9C7777;
}
#submenu_atras{
    position: absolute;
    top: -15%;
    left:75%;
    float:left;
    margin:10px;
    width: 15%;
    height: 80%;
    font-size:195%;
    font-family: cabiar;
    background-color: #777B9C;
}


#boton_heramientas_icono{
    top: 5%;
    left: 25%;
    width:50%;
    height: 60%;
    position: absolute;

}

#boton_heramientas_texto{
    position: absolute;
    top: 78%;
    color: white;
    font-size: 80%;
    text-align: center;
    width: 100%;
    font-family: cabiar;
}
#info_reca{
    font-size: 65%;
    margin-top: 3px;
}
#boton_heramientas_articulo{
     width: 30%;
    height: 49%;
    float: left;
    background-color: #BA5FAE;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas_saleregresa{
     width: 30%;
    height: 49%;
    float: left;
    background-color: #7E3F3F;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas_recamarera{
    width: 30%;
    height: 48%;
    float: left;
    background-color: purple;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas_corte{
    width: 30%;
    height: 49%;
    float: left;
    background-color: #2F5F4C;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas_herrra{
    width: 30%;
    height: 49%;
    float: left;
    background-color: #7D8832;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas_gastos{
    width: 30%;
    height: 49%;
    float: left;
    background-color: #315078;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas_mantenimiento{
    width: 30%;
    height: 49%;
    float: left;
    background-color: #603333;
    margin: 1%;
    position: relative;
    font-family: cabiar;
}
#boton_heramientas{
    width: 30%;
    height: 49%;
    float: left;
    background-color: orange;
    margin: 1%;
    position: relative;
}
#boton_heramientas_cantidad{
    width: 30%;
    height: 49%;
    float: left;
    background-color: #FF5733;
    margin: 1%;
    position: relative;
}

.trabajo {
	overflow: auto;
	max-height: 240px;
}

#trabajo .container{
    color:black;
	text-align: left;
	font-size: 16px;
	overflow: auto;
	max-height: 200px;
 }

#trabajo .container .media-list{
    color:black;
	text-align: left;
	font-size: 16px;
	height: 190px;
	max-height: 200px;
	overflow: auto;
 }

#trabajo .container .media-list .media-body{
	padding-bottom: 10px;
	padding-top: 10px;
	border-bottom: 1px dashed #efefef;
 }

#trabajo .row{
	font-size: 16px;
	font-weight: bold;
	overflow: auto;
	max-height: 240px;
}

#trabajo .row .card-body{
	font-size: 11px;
	font-weight:normal
}

#trabajo .my-table-wrapper{
	overflow: auto;
	max-height: 200px;
}

#trabajo .table{
	font-size: 14px;
	font-weight:normal;
}

#areadetrabajo{
    /*width: 100%;
    height: 65%;
    position: absolute;//*/
}
#espaciocobro{
    width: 20%;
    float: right;
    height: 350px;
}
#boton_heramientas_bloqueo{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #919191;
    position: relative;
    color:  white;
}
#boton_heramientas_rentar{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #E05E2E;
    position: relative;
    color:  white;
}
#boton_heramientas_cancelar{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #34933E;
    position: relative;
    color:  white;
}
#boton_heramientas_cobrar{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #CA4444;
    position: relative;
    color:  white;
}
#boton_heramientas_restaurante{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #4E82CC;
    position: relative;
    color:  white;
}
#boton_heramientas_desocupar{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #BBB300;
    position: relative;
    color:  white;
}
#boton_heramientas_limpiar{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: purple;
    position: relative;
    color:  white;
}
#boton_heramientas_detallar{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #B920E2;
    position: relative;
    color:  white;
}
#boton_heramientas_comentarios{
    width: 30%;
    height: 49%;
    margin: 1%;
    float: left;
    background-color: #BBB300;
    position: relative;
    color:  white;
}

#campocobro{
    width: 70%;
    float: left;
    height:150px;
}
#caja_campo_cobro{
    background-color: #31313E;
    width: 17%;
    height: 45%;
    position: relative;
    float: left;
    margin: 1%;
    border-style: solid;
    border-width: 1px;
    border-color: white;
}

#productos{
    width: 15%;
    height: 450px;
    float: left;
}
#buscar{
    width: 100%;
    height: 40px;
    margin-top: 40px;
}
#buscador{
    width: 80%;
    height: 40px;
}
#titi_cob_res_solo{
    width: 100%;
    height:35%;
    text-align: center;
    font-size: 140%;
    line-height: 150%;
}
#boton_realiz-cob_res_solo{
    width: 90%;
    font-size: 100%;
    height: 40px;
}
#input_realiz-cob_res_solo{
    height: 40px;
}
#producto{
    width: 100%;
    height: 40px;
    line-height: 40px;
    background-color: #4E82CC;
    margin-top: 20px;
}
#image_bo_coman{
    position: absolute;
    width: 30%;
    height: 100%;
}
#cobrarrestaurante{
    width: 95%;
    height: 40px;
    line-height: 20px;
    margin: 5%;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #DEDEDE)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #DEDEDE 100%);

}
#aignarcortesia{
    margin-left: 10%;
    width:25%;
    float: left;
    height: 40px;
    line-height: 40px;
    background-color: purple;
}
#valoresdecantidad{
    height: 40px;
    width: 8%;
    float: left;

}
#borarprodutcobase{
    margin-left: 10%;
    width: 25%;
    height: 40px;
    line-height: 40px;
    float: left;
    background-color: green;
}
#canpro{
    width: 16%;
    margin: 3px;
    height: 40px;
    line-height: 40px;
    margin-top: 10px;
    -webkit-border-radius: 8px 8px 8px 8px;
    float: left;
     -webkit-box-shadow: 2px 2px 5px #999;
	background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #C4C4C4)
);
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C4C4C4 100%);
background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 100%);

}
#cantidad{
    width: 31%;
    height: 400px;
    float: left;
    padding: 5px;
}
#totaldetalleres{
    float: left;
    margin-top: 10px;
    font-size: 16px;
    margin-left: 4px;
}
#cortesia{
    width: 31%;
    height: 400px;
    float: left;
    padding: 5px;
}
#borrar{
    width: 65%;
    height: 400px;
    float: left;
    padding: 5px;
    font-size: 50%;
}
#mostrarproducto{
    width: 22%;
    font-size: 13px;
    height: 60px;
    line-height: 20px;
    margin: 5px;
    float: left;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
     background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #DEDEDE)
    );
    background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #DEDEDE 100%);
}
#campocobro1{
    position: absolute;
    text-align: center;
    width: 99%;
    float: left;
    height: 450px;
}
#campocobro2{
	top: 35%;
    position: absolute;
    text-align: center;
    width: 99%;
    float: left;
    height: 450px;
}
#etihab{
    width: 30%;
    float: left;
    height: 60px;
}
#campobotoncobro{
    width: 30%;
    float: left;
    height: 150px;
}
#areacobro{
    width: 60%;
    float: right;
    height:250px;
    border-width: 2px;
    border-color: white;
    border-style: solid;

}
#estadoboton{
    float:left;
    padding-left: 25px;
    font-size:14px;
}
#titulotiempo{
    text-align: center;
    margin:50px;

}
#cambiarhoras{
    text-align: center;
    height:30px;
    width:18%;
    margin: 5px;
    line-height: 30px;
    float: left;
    border-width: 2px;
    border-color: white;
    border-style: solid;
    background-image: url(../imagenes/reloj.png);
    background-repeat: no-repeat;
}
#botonher{
	line-height: 30px;
	width:100%;
	text-align:center;
    margin-top: 8px;
	height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #DEDEDE)
);
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #DEDEDE 100%);
background-image: linear-gradient(to bottom, #FFFFFF 0%, #DEDEDE 100%);
}
#botonher0{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/dinero.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #ED8F47)
    );
    background-image: url(../imagenes/dinero.png),-o-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
    background-image: url(../imagenes/dinero.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
    background-image: url(../imagenes/dinero.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
    background-image: url(../imagenes/dinero.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
    background-image: url(../imagenes/dinero.png),linear-gradient(to bottom, #FFFFFF 0%, #ED8F47 100%);
    background-repeat: no-repeat;
}
#botonher1{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/bloqueo.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #787878)
    );
    background-image: url(../imagenes/bloqueo.png),-o-linear-gradient(bottom, #FFFFFF 0%, #787878 100%);
    background-image: url(../imagenes/bloqueo.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #787878 100%);
    background-image: url(../imagenes/bloqueo.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #787878 100%);
    background-image: url(../imagenes/bloqueo.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #787878 100%);
    background-image: url(../imagenes/bloqueo.png),linear-gradient(to bottom, #FFFFFF 0%, #787878 100%);
    background-repeat: no-repeat;
}
#botonher2{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/herramientas.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #1C1C1C)
    );
    background-image: url(../imagenes/herramientas.png),-o-linear-gradient(bottom, #FFFFFF 0%, #1C1C1C 100%);
    background-image: url(../imagenes/herramientas.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #1C1C1C 100%);
    background-image: url(../imagenes/herramientas.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #1C1C1C 100%);
    background-image: url(../imagenes/herramientas.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #1C1C1C 100%);
    background-image: url(../imagenes/herramientas.png),linear-gradient(to bottom, #FFFFFF 0%, #1C1C1C 100%);
    background-repeat: no-repeat;
}
#botonher3{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/beso.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #E3202D)
    );
    background-image: url(../imagenes/beso.png),-o-linear-gradient(bottom, #FFFFFF 0%, #E3202D 100%);
    background-image: url(../imagenes/beso.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #E3202D 100%);
    background-image: url(../imagenes/beso.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #E3202D 100%);
    background-image: url(../imagenes/beso.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #E3202D 100%);
    background-image: url(../imagenes/beso.png),linear-gradient(to bottom, #FFFFFF 0%, #E3202D 100%);
    background-repeat: no-repeat;

}
#botonher4{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/check.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #2CDE3E)
    );
    background-image: url(../imagenes/check.png),-o-linear-gradient(bottom, #FFFFFF 0%, #2CDE3E 100%);
    background-image: url(../imagenes/check.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #2CDE3E 100%);
    background-image: url(../imagenes/check.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #2CDE3E 100%);
    background-image: url(../imagenes/check.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #2CDE3E 100%);
    background-image: url(../imagenes/check.png),linear-gradient(to bottom, #FFFFFF 0%, #2CDE3E 100%);
    background-repeat: no-repeat;
}
#botonher5{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/bote.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #E3E33D)
    );
    background-image: url(../imagenes/bote.png),-o-linear-gradient(bottom, #FFFFFF 0%, #E3E33D 100%);
    background-image: url(../imagenes/bote.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #E3E33D 100%);
    background-image: url(../imagenes/bote.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #E3E33D 100%);
    background-image: url(../imagenes/bote.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #E3E33D 100%);
    background-image: url(../imagenes/bote.png),linear-gradient(to bottom, #FFFFFF 0%, #E3E33D 100%);
    background-repeat: no-repeat;
}
#botonher6{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/restaurant.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #3DA9E3)
    );
    background-image: url(../imagenes/restaurant.png),-o-linear-gradient(bottom, #FFFFFF 0%, #3DA9E3 100%);
    background-image: url(../imagenes/restaurant.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #3DA9E3 100%);
    background-image: url(../imagenes/restaurant.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #3DA9E3 100%);
    background-image: url(../imagenes/restaurant.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #3DA9E3 100%);
    background-image: url(../imagenes/restaurant.png),linear-gradient(to bottom, #FFFFFF 0%, #3DA9E3 100%);
    background-repeat: no-repeat;
}
#botonher7{
    line-height: 30px;
    width:100%;
    text-align:center;
    margin-top: 8px;
    height:30px;
    -webkit-box-shadow: 2px 2px 5px #999;
    -webkit-border-radius: 8px 8px 8px 8px;
    background-image: url(../imagenes/limpieza.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #003CFF)
    );
    background-image: url(../imagenes/limpieza.png),-o-linear-gradient(bottom, #FFFFFF 0%, #003CFF 100%);
    background-image: url(../imagenes/limpieza.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #003CFF 100%);
    background-image: url(../imagenes/limpieza.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #003CFF 100%);
    background-image: url(../imagenes/limpieza.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #003CFF 100%);
    background-image: url(../imagenes/limpieza.png),linear-gradient(to bottom, #FFFFFF 0%, #003CFF 100%);
    background-repeat: no-repeat;
}
#habestado1{
	/*Formato para el menu*/
	width:9.5%;
	float:left;
	margin:2.5px;
    margin-bottom: 10px;
	height:80px;
	text-align:center;
	-webkit-border-radius: 8px 0px 8px 8px;
	background-image: url(../imagenes/dinero.png),-webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FFFFFF),
	color-stop(1, #ED8F47)
	);
	background-image: url(../imagenes/dinero.png),-o-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
	background-image: url(../imagenes/dinero.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
	background-image: url(../imagenes/dinero.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
	background-image: url(../imagenes/dinero.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #ED8F47 100%);
	background-image: url(../imagenes/dinero.png),linear-gradient(to bottom, #FFFFFF 0%, #ED8F47 100%);
	 background-repeat: no-repeat;
    -webkit-box-shadow: 2px 2px 5px #999;
	}
#boton_info_reca{
    float: left;
    width: 16%;
    height: 30px;
    border-style: solid;
    border-width: 1px;
    border-color: white;
    margin: 2px;
    font-size: 120%;
}
#mostrar_info_rec{
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}
#habestado9{
    /*Formato para el menu*/
    width:9.5%;
    float:left;
    margin:2.5px;
    margin-bottom: 10px;
    height:80px;
    text-align:center;
    -webkit-border-radius: 8px 0px 8px 8px;
    background-image: url(../imagenes/x.png),-webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFFFFF),
    color-stop(1, #A62121)
    );
    background-image: url(../imagenes/x.png),-o-linear-gradient(bottom, #FFFFFF 0%, #A62121 100%);
    background-image: url(../imagenes/x.png),-moz-linear-gradient(bottom, #FFFFFF 0%, #A62121 100%);
    background-image: url(../imagenes/x.png),-webkit-linear-gradient(bottom, #FFFFFF 0%, #A62121 100%);
    background-image: url(../imagenes/x.png),-ms-linear-gradient(bottom, #FFFFFF 0%, #A62121 100%);
    background-image: url(../imagenes/x.png),linear-gradient(to bottom, #FFFFFF 0%, #A62121 100%);
     background-repeat: no-repeat;
    -webkit-box-shadow: 2px 2px 5px #999;
    }
    #estado_hab0{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #34933E;
        position: relative;
        color:  white;
    }
    #estado_hab12{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #7E3F3F;
        position: relative;
        color:  white;
    }
    #estado_hab1{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #E05E2E;
        position: relative;
        color:  white;
    }
     #estado_hab2{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #CA4444;
        position: relative;
        color:  white;
    }
    #estado_hab3{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #4E82CC;
        position: relative;
        color:  white;
    }
    #estado_hab4{
       width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #BBB300;
        position: relative;
        color:  white;
    }
    #estado_hab5{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: purple;
        position: relative;
        color:  white;
    }
    #estado_hab6{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #603333;
        position: relative;
        color:  white;
    }
    #estado_hab7{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #919191;
        position: relative;
        color:  white;
    }
    #estado_hab8{
       width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: purple;
        position: relative;
        color:  white;
    }
    #estado_hab11{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #B920E2;
        position: relative;
        color:  white;
    }
     #estado_hab9{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #FF9269;
        position: relative;
        color:  white;
    }
    #estado_hab10{
        width:9.8%;
        height:70px;
        margin:1px;
        float:left;
        background-color: #BBB300;
        position: relative;
        color:  white;
    }
#titulo_hab{
      position: absolute;
      top: 2%;
      width: 65%;
      left: 1%;
      height: 25%;
      font-size: 13px;
      overflow: hidden;
      font-family: cabiar;
      word-wrap: break-word;
}
#numero_hab{
    position: absolute;
      top: 1%;
      left:68%;
      font-size: 18px;
      font-family: cabiar;

}
#imagen_hab{
    position: absolute;
    top: 25%;
    left:0%;
    width: 40%;
    height: 78%;
    font-size: 30px;
}
#imagen_commentario_hab{
    position: absolute;
    top: 3px;
    left:87%;
}
#imagen_commentario_hab img{
    max-width:73%;
    height:auto;
}
#areadetrabajo1{
    visibility: hidden;
    position: absolute;
    top:33.5%;
    width: 100%;
    height: 65%;
    color:white;
}
#rec_img_asig{
    width: 60%;
    height: 60%;
    position: absolute;
    top: 18%;
    left:30%;
}
#rec_texto_tit{
    width: 100%;
    height: 25%;
    position: absolute;
    top: 2%;
    left:0%;
    font-size: 80%;
    text-align: center;
    font-family: cabiar;
}
#rec_texto_asig{
    width: 100%;
    height: 25%;
    position: absolute;
    top: 70%;
    left:0%;
    font-size: 110%;
    text-align: center;
    font-family: cabiar;
}
#rec_sin_asig{
    width: 18.5%;
    height: 26%;
    background-color: #CC6969;
    float: left;
    margin: 0.5%;
    position:relative;
}
#rec_con_asig{
    width: 18.5%;
    height: 26%;
    background-color: #69CC7B;
    float: left;
    margin: 0.5%;
    position:relative;
}
#placas_hab{
    position: absolute;
    top: 54%;
    left:40%;
    width: 60%;
    height: 22%;
    font-size: 16px;
    word-wrap: break-word;
    overflow: hidden;
}
#tip_hab{
    position: absolute;
      top: 77%;
      left:45%;
      width: 50%;
      height: 22%;
      font-size: 12px;
}
#iconito{
    top: 30%;
    left:85%;
     position: absolute;
     width: 10%;
     height: 30%;
     font-size: 80%;
}
#cronometro_hab{
    position: absolute;
      top: 30%;
      left:40%;
      width: 30%;
      height: 22%;
      font-size: 12px;
      text-align: center;
}
#habestadoborrado{
     width:9.8%;
    height:70px;
    margin:1px;
    float:left;
    text-align:center;
}

#numrohab{
	text-align:right;
	font-size:25px;
}

#titulomenu{
	float:left;
	margin:10px;
	font-size:20px;
}
a:link
{
 text-decoration:none;
}
a.estilo2:link { font-family: cabiar,Tahoma, Verdana, Arial; color: white; text-decoration: none}
a.estilo2:visited { font-family: cabiar,Tahoma, Verdana, Arial; color: white; text-decoration: none}
a.estilo2:hover { font-family: cabiar,Tahoma, Verdana, Arial; color: white}
a.estilo2:active { font-family: cabiar,Tahoma, Verdana, Arial; color: white; text-decoration: none}
a.estilo:link { font-family: cabiar,Tahoma, Verdana, Arial; color: white; text-decoration: none}
a.estilo:visited { font-family: cabiar,Tahoma, Verdana, Arial; color: white; text-decoration: none}
a.estilo:hover { font-family: cabiar,Tahoma, Verdana, Arial; color: white}
a.estilo:active { font-family: cabiar,Tahoma, Verdana, Arial; color: white; text-decoration: none}