body{background: #E8E8E8;color:#000000;font-family:  serif;}
ul{list-style: none;}
#lptcanvas {border:solid 2px black;background-color:white;}
.modificado{transition: font-size .5s;width:70%;border-radius: 15px;margin:0 auto;border: solid 4px #FF0400;font-size:24px;color:#FF0400;text-align: center;font-weight: 600;background: linear-gradient(0deg,#FFFFFF,#F29A3C);}
.modificado:hover{font-size:32px;transition: font-size .5s;}
.scroll {width:100%;height: 600px;overflow: scroll;background: #ffffff;}
a:link{text-decoration:none; cursor: pointer;  }
.principal{width: 100%;left: 0px;padding: 0px;background: #E8E8E8;/*box-shadow:  #dddddd 2px 2px 10px;border-radius: 15px;*/}
.separador{background: url('images/pix.png') repeat-y;width: 1px;}
.cabecera{background: #bbbbbb;font-weight:bold;text-align: center;color:black;font-size:18px;}
.fijo{position: sticky;top: 50px;padding: 5px;background-color: #cae8ca;border: 2px solid #4CAF50;}
.normal{background: #ffffff;color:black;}
.contenido {background: #ffffff;color:black;}
.contenido:hover{background: #ffffb3;}
.fin{background: #ff981c;}
.fin:hover{background: #c6781b;}
.pie{background: #ffff1c;}
.pie:hover{background: #bbff00}
.urg{background: #ff0000;}
.urg:hover{background: #990000;}
.ent{background: #79ff64;}
.ent:hover{background: #62ce51;}
.conf{background: #6693FF;}
.conf:hover{background: #3B5193;}
.seleccion{background: #ffffff;color:black;}
.seleccion:hover{background: #ffffb3;color:black;}
/*.button {background-color: #045FB4;font-weight: bold;border: none;color: white;padding: 5px 5px;text-align: center;text-decoration: none;display: inline-block;font-size: 14px;margin:0px -2px ;cursor: pointer;}*/
#buscarCli {border: none;padding: 5px 5px;text-align: center;text-decoration: none;display: inline-block;font-size: 12px;margin:0px -2px ;cursor: pointer;}
.orange{background-color: #ff9f00;color: #000000;}
.doble {font-size: 16px;}

.alert {height:auto;z-index: 1000;padding: 15px;font-size:18px;font-weight: bold;position:fixed;bottom: 5px;left: 50%;transform: translateX(-50%);width: 100%;#border-radius: 10px;box-shadow:  #000000 5px 5px 10px;opacity: 0.95;text-align: center;}
.alert:before{height:0px;}

.warning        {background-color: #FFAD16;color:black;}
.error          {background-color: #f00;color: #ffffff;}
.success        {background-color: #04E562;color: white;}
.closebtn       {margin-left: 15px;margin-top:-10px;vertical-align:top;color: #f00;font-weight: bold;float: right;font-size: 32px;line-height: 20px;cursor: pointer;transition: 0.3s;text-shadow: 0px 0px 2px #fff;}
.closebtn:hover {color: black;}

.inactiva {top:30px;height: 100%;padding: 5px;background-color: #ddd;font-size: 18px;font-weight: bold;position: fixed;left: 50%;transform: translateX(-50%);width: 100%;box-shadow:#000000 5px 5px 10px;#border-radius: 15px;opacity: 1;}
.ventana{height:300px;width:300px;padding: 5px;background-color: #7F7F7F;color: white;font-size: 18px;font-weight: bold;	position: fixed;top: 50px;left: 50%;transform: translateX(-50%);border-radius: 15px;box-shadow:  #000000 15px 15px 10px;}

.inputfile { overflow: hidden;color: #999999;float: left;}
.params tr{width: 100%;border:solid 1px;}
.params th{line-height: 42px;margin: 05px;text-align: right;padding-right: 10px;}
.params input[type=text],input[type=password]{width: 300px;padding-left: 10px;}
.cuentaatras{position:  absolute;top:0;right:0;color:red;}
#scan{display:none;}
nav{z-index: 80;top: -10px;left: 0px;height: 40px;padding: 0px 5px 0px 5px;width:100%;color: #ffffff;position: fixed;display: block;box-shadow: 5px 5px 15px #000;background: #045FB4;}
nav:hover{display: block;}
nav ul ul {display: none;}
nav ul li:hover > ul {display: block;margin: -1px;/*position:relative;*/}
nav ul {padding: 0 0px;list-style: none;position: relative;}
nav ul:after {content: "";clear: both;display: block;}
nav ul li {float: left;}
nav ul li:hover {background: #4b545f;border-radius: 5px;}
nav ul li:hover a {color: #fff;}
nav ul li a {display: block;padding:0px 10px;color: #ffffff;text-decoration: None;}
nav ul ul {background: #5f6975;border-radius: 5px;padding: 0px;position: absolute;top: 100%;}
nav ul ul li {float: none; border-top: 1px solid #6b727c;border-bottom: 1px solid #575f6a;position: relative;border-radius: 5px;}
nav ul ul li a {padding: 0px 10px;color: #fff;}
nav ul ul li a i{color:#fff;}
nav ul ul li a:hover {background: #4b545f;border-radius: 10px;}
section{padding-top: 45px;left: 0px;width: 100%;/*background: #cccccc;*/}
footer{color: white;font-family: serif;font-size: smaller;font-style: italic; text-align: right;bottom: 0;position: fixed;background: #111111;}
/*form {display: inline; }*/
input[type=text],[type=email],[type=password],[type=date], textarea{background: #FFFFFF;color:#000000;height:32px;font-size:16px;/*font-weight: bolder;*/border:solid 2px #CCCCCC;margin:2px;padding: 2px;border-radius: 4px;/*box-shadow: #ffffff 5px;*/}
textarea{height:80px;}
input[type=date] {height: 25px;margin: 5px auto;/*width: 90%;font-family: arial, sans-serif;*/font-size: 12px;font-weight: bold;outline: none;border: 0;border-radius: 3px;padding: 0 3px;color: #5B5B5B;}  
input[type=radio] {display:none;margin:10px;}
/* Change the look'n'feel of labels (which are adjacent to radiobuttons). Add some margin, padding to label */
input[type=radio] +label {display:inline-block;margin:-2px;padding: 4px 12px;background-color: #A8C4C1;border-color: #ddd;color:#000;cursor: pointer;}
input[type=radio] +label:hover{ background-color: #8FA3A0;}
/* Change background color for label next to checked radio button to make it look like highlighted button */
input[type=radio]:checked  +label{background-image: none;background-color:#EE4D1B;}
#action{background: rgba(89, 191, 108, 0.5);border: none;/*box-shadow: 0px 0px 40px  #ffffff ; */border-radius: 5px;padding:10px 20px;max-width: 70px;float: left;max-height: 67px;font-size: 14px;margin-left: 5px;cursor: pointer;}
.action:hover ,#action a{background: rgba(89, 191, 108, 0.8);box-shadow: 0px 0px 4px  #ffFFfF ; color:#ffffff;}
.login input[type=text],.login input[type=password]{ background: #FFFCD8;color:#4F4F4F;; width:250px;padding-left: 10px;height: 40px;}
.login input[type=submit] ,.envia{background: #2483E2;color:#fff;font-weight: bolder;border-radius: 4px;border:none;width:250px;height: 40px;}
.login input[type=submit]:hover{background: #23E06C;}
.pedirPiezas{position:static;height: 10px; background: #ffffff;z-index: -1; transition: height 1s;overflow:hidden;}
.pedirPiezas:hover{height: 300px;overflow: scroll;}
.piezas{width:100%;overflow: hidden;max-height:0px;transition: max-height 0.5s;}
.piezas a>input{}
.piezas input[type=text] {text-transform: uppercase;font-size: 20px;background: #FFFFFF; border:none;text-align: left;border-radius: 0px;}
.piezas button[type=submit],input[type=submit],.botonSubmit,.button{float: left;background: #045FB4;color:#fff;font-size: 20px;/*width:100px;*/border-radius:5px;border:solid 2px #59ADF7;margin:5px 5px;padding-bottom: 5px;}
.piezas input[type=submit]:hover,input[type=submit]:hover,.botonSubmit:hover,.button:hover{background: #00DAF7;color:#565656;}

.buttonoff{float: left;background: #ADB4BA;color:#000;font-size: 20px;border-radius:5px;border:solid 2px #59ADF7;margin:5px 5px;padding-bottom: 5px;}

.piezas input[readonly]{background: #FFFFFF;color:#9B9B9B;font-style: oblique;cursor: pointer;}
.modif{background: #B7E2CA;}
.modif input[type=text]{background:#FAFFEF;padding-right: 1px;border:solid 1px #95C4A7;border-radius: 5px;}
.buscarCli {background:transparent;border: none;padding: 5px 5px;text-align: center;text-decoration: none;display: inline-block;font-size:14px;margin:0px -2px 0px -30px ;cursor: pointer;}
#carga{height:300px;width:300px;padding: 5px;background-color: #FFFFFF;color: white;font-size: 18px;font-weight: bold;	position: fixed;top: 50%;left: 50%;transform: translateX(-50%);border-radius: 15px;box-shadow:  #000000 15px 15px 10px;}
#carga img{left:0;margin:-33px auto 0;position:absolute;right:0;top:50%}
.popup{height:auto;width:95%;top:40px;padding: 5px;background-color: #649934;color: white;position: fixed;overflow: scroll;left: 50%;transform: translateX(-50%);}
 .webcam {position:fixed; top:40px; left: 40px; height:80%;width:80%;border: solid 15px #3B5784;border-radius: 5px;}
.results{position:fixed; top:40px; left: 40px; z-index: 20;border: solid 15px #fff;border-radius: 5px;display:none;}
.botonesCaptura{position:fixed; top:50px; right: 80px; z-index: 1000; }
.botonesCaptura input,.botonesCaptura button{width: 100px;background-color: #045FB4;font-weight: bold;border: none;color: white;padding: 5px 5px;text-align: center;text-decoration: none;display: inline-block;font-size: 18px;margin:2px 2px ;cursor: pointer;}
#my_camera{width:380px;height:240px;}
.botonesCaptura input:hover,.botonesCaptura button:hover{background-color: #039FAA;}
.botonesCaptura input:disabled,.botonesCaptura button:disabled{background-color: #7A7A7A;color:#ddd;}
.botonesAccion {display: inherit;}
.btn{padding:5px 10px;background-color:#2483E2;width:70px; border: solid 2px #1F6BB7;border-radius: 2px;font-weight: bold;text-transform: uppercase;text-align: center;}
.btn:hover{background-color:#4F9FEF;color: White;}
#btn-pedido{display:none;}
#btn-pedido:checked ~ .piezas{height:auto;max-height:300px;transition: max-height 0.5s;}
#tabla_modifs{height:320px;overflow-y: auto;}
.blur{ color: transparent;   text-shadow: 0 0 8px rgba(0,0,0,0.5);}
 /* Customize the label (the container) */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 24px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  border: solid 2px #111;
  border-radius: 10%;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #111;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}
#testear{
 font-weight:bold;
 position:fixed;
 top:150px;
 right:0px;
 width:auto;
 background-color:orange;
 border: 1px solid red;
 border-radius: 10px;
 padding:1px 5px;
}
/* Style the indicator (dot/circle) */
.container .checkmark:after {
  top: 9px;
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
 border: solid white;
  border-width: 0 3px 3px 0;
 -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.ticketsFs td{
 background-color: #D3E7E8;
}
.pop{
  position:absolute;
  top:50px;
  right:5px;
  background-color:rgba(0,255,200,.9);
  color:#000;
  border-radius:20px;
  border:solid 2px #000;
  padding-top:50px;
  text-align:left;
}
.cambio_oculto{
  display:block;
  position: relative;
  width:95%;
  height:0px;
  padding:0px 10px;

  overflow: hidden;
  transition: height 2s;
  background-color: #FFF1D3;
  color:#2D1F01;
 
}
.classDel{
  background-color:#ADC7C9;
  line-height: 0px;
  display: none;
}
.classDel td{
  display: none;
}
#cli_folio{word-wrap:break-word;}
.tecnofix {color:red;font-weight: bold;text-shadow: 1px 1px 1px #FFFFFF;}
.tecnophone {color:#3B6B4A;font-weight: bold;text-shadow: 1px 1px 1px #F70000;}
#double li {  width: 50%; float:left;}
.ranking{/*position:fixed;display:block;top:35px;width:100%;*/color:#0000BF;background-color: rgba(255,255,255,.8);font-weight: bold;}
 @media only screen and (max-width: 1000px) {
#scan{display:block;}
}