/* definición de la estructura general */

header    { height: 3%;background: rgb(255,128,0);font-size: 1em; }
nav       { z-index: 100;float: left; width: 20%;height: 82% ;overflow-y:auto;}

nav span  { margin: 0px 100px 0px 0px;}
section   { float: left; width: 98%; height: 90% ; overflow-x:auto; overflow-y:auto; font-size: 1.0em;}
footer    { display: none;clear: both; position: fixed;width: 100%;bottom: 0px;  height: 2%;background:  rgb(255,128,0); color:white;}

/* elementos generales */

header h2, footer a { color: white;}

/* elemento usado en casi todas las páginas */

h3 		{width: 100%;color: rgb(255,128,0);border-bottom: 1px solid rgb(255,128,0); }


#divtabfiltrosalas {
	
	display: none;

}
#divtabfiltrosalas2 {
	width: 20%;
	display: inline-flex;
	float: left;
	overflow: auto;
}
#divtabfiltrosalas2 #example2_wrapper{
	width: 100%;

}


#container {
  border: 1px solid black; 
  width: 800px;
  height: 500px;
  display: block;
  float: left;
    margin-top: 10px;
}

#containerd {
  border: 1px solid black; 
  width: 800px;
  height: 500px;

  float: left;
    margin-top: 10px;
}

#botones {
  padding: 4px 4px;

  display: none; /* inline-flex; */
  float:left;
  text-align:left;
}
#menu-abrir-cerrar {
    display:scroll;
        position:fixed;
        top:4vh;
        /*left:20%;*/
}

#divtablacategorias {width:18%;font-size: 0.8em;height:80vh;float:left;overflow: auto;}
#divtablaproductoscategoria {width:44%;height:80vh;float:left;overflow: auto;}
#divtablaticket {width:38%;height:80vh; float:left; overflow: auto;
           background-repeat: repeat-y;background-size: 100% 100%; background-image: url("/media/libreta2.jpg");
}
#cabeceratabla3 {margin-top: 50px;margin-bottom:10px;display: flex;justify-content: space-between;}
#divtabla3,#divtabla4 { height:65vh;float:left; overflow: auto;font-size: 0.8em;
}

.button2 {
	cursor: pointer;
}

.flotanted {
    display:scroll;
        position:fixed;
        bottom:43%;
        right:15%;
}

.flotanteg {
    display:scroll;
        position:fixed;
        bottom:27%;
        right:15%;
}
.flotantea {
    display:scroll;
        position:fixed;
        bottom:12%;
        right:15%;
}

.flotanteaa {
    display:none;
        position:fixed;
        bottom:12%;
        right:15%;
}

.cmesa, .cimporte , .ccliente, .cticket{
	font-family: Arial, Helvetica, sans-serif;
	color: red;
	text-decoration: none;
	font-size: 1.0em;
}

.ccliente, .cticket{
color: green;
}
/* divs usados con datatables */

#divtabla, #divtabla2 {margin-top: 10px;margin-bottom: 10px;display: block;}
.divtablas { margin-right:10px; display: inline-block;width:370px;float:left;font-size: 0.8em; }
#divtablasx {background-repeat: repeat-y;background-size: 100% 100%; background-image: url("/media/table.jpg"); clear:both; overflow: auto ; display: flex; height: 78vh;}

.divtablas a{
	color:red; font-size: 1.5em;
}

.button3 {
	width:110px; 
	height:160px; 
	margin-right:20px;
	margin-left: 20px;
	margin-top: 40px;
}

#divforms {display: none;}

/* divs usados en los filtros */

.principal {
	margin-top:40px;
	font-size: xx-large; 
    text-align: center;

	
	vertical-align: middle;
}

/* divs para filtros y báscula final */

.tablafiltro, .tablabascula {width: 100%; font-size: 1.2em;text-align: center;margin-top: 5px;}
.tablafiltro table, .tablabascula table {
margin: 0 auto;
text-align: center;
width: 100%;
}

.tablafiltro table th, .tablafiltro table td {border-bottom: 1px solid #ddd;text-align: center;}

.tablabascula tr td:nth-child(odd){ 
		text-align: right;
	}
.tablabascula tr td:nth-child(even){
		text-align: left;
	}

/* elementos de tabla */

th, td {
    border-bottom: 1px solid #ddd;text-align: left;
}

tr:nth-child(odd) {background-color:  rgb(170,200,230);}
tr:nth-child(even) {background-color: #f2f2f2;}

/* situación de elementos de datatable */

.dataTables_wrapper .dataTables_filter {
	float:right;
	text-align:right
}

/* botones de datatable */

a.dt-button.buttons-new, a.dt-button.buttons-new:hover, a.dt-button.buttons-new:active, a.dt-button.buttons-new:active:hover, a.dt-button.buttons-new:focus,a.dt-button.buttons-new:focus:active,a.dt-button.buttons-new:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/new.png') no-repeat center center;
}
a.dt-button.buttons-edit, a.dt-button.buttons-edit:hover, a.dt-button.buttons-edit:active, a.dt-button.buttons-edit:active:hover, a.dt-button.buttons-edit:focus,a.dt-button.buttons-edit:focus:active,a.dt-button.buttons-edit:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/edit.png') no-repeat center center;
}
a.dt-button.buttons-print, a.dt-button.buttons-print:hover, a.dt-button.buttons-print:active, a.dt-button.buttons-print:active:hover, a.dt-button.buttons-print:focus,a.dt-button.buttons-print:focus:active,a.dt-button.buttons-print:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/print.png') no-repeat center center;
}
a.dt-button.buttons-delete, a.dt-button.buttons-delete:hover, a.dt-button.buttons-delete:active, a.dt-button.buttons-delete:active:hover, a.dt-button.buttons-delete:focus,a.dt-button.buttons-delete:focus:active,a.dt-button.buttons-delete:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/delete.png') no-repeat center center;
}
a.dt-button.buttons-copy, a.dt-button.buttons-copy:hover, a.dt-button.buttons-copy:active, a.dt-button.buttons-copy:active:hover, a.dt-button.buttons-copy:focus,a.dt-button.buttons-copy:focus:active,a.dt-button.buttons-copy:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/copy.png') no-repeat center center;
}
a.dt-button.buttons-csv, a.dt-button.buttons-csv:hover, a.dt-button.buttons-csv:active, a.dt-button.buttons-csv:active:hover, a.dt-button.buttons-csv:focus,a.dt-button.buttons-csv:focus:active,a.dt-button.buttons-csv:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/csv.png') no-repeat center center;
}
a.dt-button.buttons-excel, a.dt-button.buttons-excel:hover, a.dt-button.buttons-excel:active, a.dt-button.buttons-excel:active:hover, a.dt-button.buttons-excel:focus,a.dt-button.buttons-excel:focus:active,a.dt-button.buttons-excel:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/xls.png') no-repeat center center;
}
a.dt-button.buttons-pdf, a.dt-button.buttons-pdf:hover, a.dt-button.buttons-pdf:active, a.dt-button.buttons-pdf:active:hover, a.dt-button.buttons-pdf:focus,a.dt-button.buttons-pdf:focus:active,a.dt-button.buttons-pdf:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/pdf.png') no-repeat center center;
}
a.dt-button.buttons-up, a.dt-button.buttons-up:hover, a.dt-button.buttons-up:active, a.dt-button.buttons-up:active:hover, a.dt-button.buttons-up:focus,a.dt-button.buttons-up:focus:active,a.dt-button.buttons-up:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/arriba.png') no-repeat center center;
}
a.dt-button.buttons-down, a.dt-button.buttons-down:hover, a.dt-button.buttons-down:active, a.dt-button.buttons-down:active:hover, a.dt-button.buttons-down:focus,a.dt-button.buttons-down:focus:active,a.dt-button.buttons-down:focus:active:hover {
	width: 40px;
	height: 30px;
	background: url('../images/abajo.png') no-repeat center center;
}
.editrecord {
	margin-top: 20px;
}

.acciones {
	margin-top: 20px;
	width: 100%;color: rgb(50,100,170); border-top: 1px solid rgb(50,100,170);
	padding-top: 20px;
}

.acciones button, .acciones input {
	margin: 20px;
	width: 100px;
}

/* cuadros de lista en cargas */

.lista {float: left;width: 80%;padding: 10px;}
.lista select {width: 100%;}

/* cuadros de lista en autorizaciones */

.lista2 {float: left;width: 40%;padding: 10px;}
.lista2 select {width: 100%;}

.lista3 {float: right;width: 40%;padding: 10px;}
.lista3 select {width: 100%;}

.lista4 {width: 100%;margin: .4em 0;text-align: left;}
.lista4 label {width: 35%; float: left;text-align: right;margin-right: 10px;}
.lista4 select {width: 45%;}

.clear {clear: both;}

/* div de clases de toma de datos */

.field {width: 100%; margin: .4em 0;text-align: left;}
.field label {width: 35%; float: left;text-align: right;margin-right: 10px;}
.field input {width: 45%;}

/* ocultamos elementos que se visualizan en formato smartphone */
#mv2 li {
  float: right;
  margin: 5px;
}
#mv2 {
float: left;
width: 100%;
height: 100%;
background: #eee;
overflow-y: auto;

}
#menu, .log {display: none;}

/* definíción de menú y sección */

#s1 { display: block; }

#mv, #menuprincipal {
	overflow: visible;
	font-size: 1.2em;
}
/* visualizáción del menú */

#menusecundario {
	display: none;
}

#selectormenu {
	color: white;

}

#menuprincipal li:hover > #menusecundario{
	display: block;
}

#menusecundario li {
	overflow: visible;
	position: relative;
	z-index: 99999;
}

#menusecundario li:hover {
	display: block;

}

#mv h1 , #mv2 h1 { 
	
	margin-bottom: 0px;
	padding: 6px;
	font-size: 1em;
	border-style: solid;
	border-color: #CCC;
	background-color: #666;
	color: #FFF;}
#mv ul , #mv2 ul {
	list-style-type: none;
	z-index: 100;
	position: relative;
	margin: 0px;
	padding: 0px; }
#mv ul h1 a, #mv2 ul h1 a {
	display: inline;
	background-color: #666; }
#mv ul a, #mv2 ul a {
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	text-decoration: none;
	font-size: 0.8em;
	display: block;

	padding: 6px;
	border-width: 1px;
	border-style: solid;
	border-color: #CCC;
	border-top-color: #FFF;
	background-color: #EEE; }
#mv ul a:hover, #mv2 ul a:hover {
	color: #FFF;
	background-color: #36f;

	border-right-style: solid;
	border-right-color: #36A; 

	border-left-style: solid;
	border-left-color: #36A; }
canvas {
  border-color: #36A;
  border-style: solid;;	
  display: inline-block;
  text-align: center;
  margin-top: 30px;
  margin-bottom: 10px;
  cursor: default;
  position:relative;
}

.sc_bar .ui-resizable-handle {
    width:25px !important;
}


.textodialogo {
  width: 50vw;
  font-size: 1.2em;
  color:navy;
}
.textoprecio {
  width: 50vw;
  font-size: 1.5em;
  font-weight: bold;
  color:red;
}