td:nth-child(1) a {
 color: red;
 text-decoration: none;
}
td:nth-child(1) a:hover {
 cursor: zoom-in;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px
}
button {
font-size: 6px;
border-radius: 12px;
cursor: pointer;
}
button:disabled {
cursor: not-allowed;
}
.explicacion {
background: Black;
font-family: Arial, Helvetica, sans-serif;
height: 200px;
width: 100%;
}
.parar {
top: 150px;
font-size: 2em;
margin-left: 5px;
background: grey;
}
.estilo_codigo {
font-size: 2em;
margin-left: 5px;
background: Black;
color: LightGrey;
}
.msg-3 {
  color: LightGreen;
  display: none;
}
.msg-2 {
  color: LightGrey;
  display: none;
}
.msg-icn {
  color: Yellow;
  display: none;
}
.msg-3:before {
  border: 1px solid LightGreen;
  clip-path: polygon(0% 105%, 0% 0%, 105% 0%, 105% 105%, 243px 105%, 243px 80%, 221px 80%, 221px 105%);
}
.msg-3:after {
  left: 220px;
  background: LightGreen;
  clip-path: polygon(0 0, 0% 100%, 100% 0%, calc(100% - 2px) 0, 1px calc(100% - 2px), 1px 0);
}
.msg-2:before {
  border: 1px solid LightGrey;
  clip-path: polygon(0% 105%, 0% 0%, 105% 0%, 105% 105%, 143px 105%, 143px 80%, 121px 80%, 121px 105%);
}
.msg-2:after {
  left: 120px;
  background: LightGrey;
  clip-path: polygon(0 0, 0% 100%, 100% 0%, calc(100% - 2px) 0, 1px calc(100% - 2px), 1px 0);
}
.msg-icn:before {
  border: 1px solid Yellow;
  clip-path: polygon(0% 105%, 0% 0%, 105% 0%, 105% 105%, 43px 105%, 43px 80%, 21px 80%, 21px 105%);
}
.msg-icn:after {
  left: 20px;
  background: Yellow;
  clip-path: polygon(0 0, 0% 100%, 100% 0%, calc(100% - 2px) 0, 1px calc(100% - 2px), 1px 0);
}
.msg-icn, .msg-2, .msg-3 {
  position: absolute;
  padding:  10px 20px;
  box-sizing: border-box;
  width: 90%;
  min-width: 80px;
  height: 38px;
  font-size: 2vw;
  font-stretch: extra-condensed;
  font-weight: bold;
  line-height: 35px;
  vertical-align: middle;
}
.msg-icn:before, .msg-2:before, .msg-3:before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  height: 100%;
  width: 100%;
  border-radius: 3px;
  box-sizing: border-box;
  vertical-align: middle;
}
.msg-icn:after, .msg-2:after, .msg-3:after {
  content: "";
  position: absolute;
  width: 25px;
  height: 20px;
  top: calc(100% + 9px);
  box-sizing: border-box;
}
#zoomt {
color: Grey;
padding:6px 5px 8px 6px;
}
.minus, .plus{
			width:10px;
			height:10px;
			background:#f2f2f2;
			border-radius:4px;
			padding:4px 5px 8px 5px;
			border:1px solid #ddd;
      display: inline-block;
      vertical-align: top;
      text-align: center;
      cursor: pointer;
		}
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
   .select2-container--default {
  box-sizing: border-box;
  white-space: break-spaces!important;
	background-color: transparent;
	background-repeat : repeat center;
	position: relative;
    left: calc(15% - 190px);
	height: 18px;
	width: 180px;
	color: black;
	font-weight: normal;
  font-size: 12px;
 }
.select2-center-option,
.select2-selection__choice {
  display: flex;
  align-items: center;
  gap: 5px;
}
.select2-center-option img {
  width: 50px;
  max-width: 100%;
  height: auto;
  margin-right: 5px;
}
  @media
	  only screen 
    and (max-width: 760px), (min-width: 768px) 
    and (max-width: 1024px)  {

         div.inp {
                       display: block;
                       width: 100%;
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
  height: 65px;
  background-color: yellow;
  border: 2px solid #4CAF50;
  z-index: 1;
		}
		table, thead, tbody, th, td, tr {
			display: block;
			white-space: normal;
		}
		thead tr {
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
    tr {
      margin: 0 0 1rem 0;
    }
		td {
			border: none;
			border-bottom: 1px solid #eee;
			position: relative;
			padding-left: min(30%, 100px);
		}
		td:before {
			position: absolute;
			top: 1px;
			left: 6px;

			padding-right: 10px;
			white-space: nowrap;
		}
		td:nth-of-type(2) {
        letter-spacing: -1px;
        font-stretch: condensed;
		}
		td:nth-of-type(1):before { content: "CODIGO »"; letter-spacing: -1px; font-stretch: condensed; width: min(30%, 100px); }
		td:nth-of-type(2):before { content: "DESCRIPC.»"; letter-spacing: -1px; font-stretch: condensed; width: min(30%, 100px); }
		td:nth-of-type(3):before { content: "N°SPICER »"; letter-spacing: -1px; font-stretch: condensed; width: min(30%, 100px); }
		td:nth-of-type(4):before { content: "OBSERVACIONES »"; letter-spacing: -1px; font-stretch: condensed; width: min(30%, 100px); }
		td:nth-of-type(5):before { content:var(--content,"PRECIO »"); letter-spacing: -1px; font-stretch: condensed; width: min(30%, 100px); }
		td:nth-of-type(6):before { content: "CANTIDAD »"; letter-spacing: -1px; font-stretch: condensed; width: min(30%, 100px); }
        #myTable td { padding-top: 1px; }	   
       .tabla_crucetas td:nth-of-type(1):before { content: "Núm.Serie"; }
       .tabla_crucetas td:nth-of-type(2):before { content: "Cód.Nuevo"; }
       .tabla_crucetas td:nth-of-type(3):before { content: "Cód.ant. (Arg.)"; }
       .tabla_crucetas td:nth-of-type(4):before { content: "Ø Dados"; }
       .tabla_crucetas td:nth-of-type(5):before { content: "Largo Total"; }
       .tabla_crucetas { background: yellow; }
       td[class*="texto_titulo"]:before { content: attr(data-pieza); top: 20px; text-decoration: underline; text-decoration-style: double; text-underline-offset: 2px; }
	   td[class*="texto_titulo"] { color: brown; letter-spacing: -1px; font-stretch: condensed; }
       .resultado:before { content: ""; }
       .resultado td:nth-child(1) { display: inline; }
       .fila_titulo td:nth-child(2) { display: none; }
       .fila_titulo td:nth-child(3) { display: none; }
       .fila_titulo td:nth-child(4) { display: none; }
       .fila_titulo td:nth-child(2):before { display: none; }
       .fila_titulo td:nth-child(3):before { display: none; }
       .fila_titulo td:nth-child(4):before { display: none; }
	   .select2-container--default {
    box-sizing: border-box;
    white-space: break-spaces!important;
	background-color: transparent;
	background-repeat : repeat center;
	top: -10px;
    left: 5px;
	height: 18px;
	width: 180px;
	color: black;
	font-weight: normal;
    font-size: 12px;
 }
.select2-center-option,
.select2-selection__choice {
  display: flex;
  align-items: center;
  gap: 5px;
}
.select2-center-option img {
  width: 50px;
  max-width: 100%;
  height: auto;
  margin-right: 5px;
}
.msg-icn, .msg-2, .msg-3 {
  font-size: 3.5vw;
}
}

.tabla_crucetas {
	border-style: ridge;
	border: 1px solid black;
        }
.tabla_crucetas tr:nth-child(even) {
    background: #f2f2f2;
        }
table {
  white-space: nowrap;
  font-size: 16px;
  font-family: Arial;
  font-weight: Bold;
  table-layout: fixed;
  width:100%;
  border-collapse: collapse;
  margin-left:auto;
  margin-right:auto;
}
#myTable td:nth-child(4) {
    font-size: 12px;
  }
#myTable th:nth-child(1) {
  background-position: right bottom;
  background-repeat: no-repeat;
  background-size: 17px 21px;
  width: 15%;
  }
#myTable th:nth-child(2) {
  background-position: left bottom, right bottom;
  background-repeat: no-repeat, no-repeat;
  background-size: 17px 21px, 17px 21px;
 width: 45%;
 }
#myTable th:nth-child(3) {
  background-position: left bottom, right bottom;
  background-repeat: no-repeat, no-repeat;
  background-size: 17px 21px, 17px 21px;
  width: 14%;
  }
#myTable th:nth-child(4) {
  background-position: left bottom;
  background-repeat: no-repeat, no-repeat;
  background-size: 17px 21px, 17px 21px;
  width: 12%;
  }
#t_punta {
	background: LightCyan;
    }
#t_hd {
	background: Khaki;
    }
#t_hpu {
	background: MistyRose;
    }
#t_caja {
	background: LightCyan;
    }
#t_salida {
	background: Khaki;
    }
#t_bridaspc {
	background: MistyRose;
    }
#t_hf {
	background: LightCyan;
    }
#t_bridasestr {
	background: Khaki;
    }
#t_seguro {
	background: MistyRose;
    }
#t_accesorio {
	background: MistyRose;
    }
#t_movimiento {
	background: Khaki;
    }
#t_manguito {
	background: LightCyan;
    }
#t_agricola {
	background: LightGrey;
    }
tr {
	background: White;
    }
.separador {
	line-height: 2px;
	}
td {
  padding-top: 5px;
  text-align: center;
  border-top:solid 1px black;
  border-left:solid 1px black;
  border-right:solid 1px black;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  }
th {
  vertical-align: bottom;
  border-style: hidden;
  background: yellow;
  position: sticky;
  top: 0;
}
h1, h2 {
 display: inline;
 font-family: Verdana;
 font-size: 20px;
 font-weight: bold;
 background-color: lightgrey;
 margin-left:auto;
 margin-right:auto;
 text-align: center;
 }
h3 {
 display: table;
 font-family: Verdana;
 font-size: 16px;
 text-align: justify;
 }
hr {
height:2px;
background-color:
#123455;
}
.final {
 margin-left:auto;
 margin-right:auto;
 text-align: center;
 width: 60%;
 }
#piezas {
    position: absolute;
    left: 5px;
    top: 32px;
	height: 18px;
	width: 220px;
	color: black;
	font-weight: normal;
	background-repeat : repeat center;
}
#piezas1 {
    position: absolute;
    top: 22px;
    left: 5px;
	height: 18px;
	width: 260px;
	color: black;
	font-weight: normal;
}
#myInput {
    position: absolute;
    top: 20px;
    left: 60%;
    line-height:20px;
	border: 1px solid;
	border-radius: 2px;
	height: 15px;
	width: 160px;
	font-stretch: condensed;
}
#myInput1 {
    position: absolute;
    top: 3px;
    left: 10px;
    font-stretch: condensed;
    line-height:20px;
	border: 1px solid;
	border-radius: 2px;
	height: 15px;
	width: 160px;
	visibility: hidden;
}
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  opacity:30%;
}
img.imagen_titulo {
    display: block;
    margin-left: auto;
    margin-right: 0;
}
td.texto_titulo {
 vertical-align: middle;
 text-align: left;
 border-left: hidden;
 border-right: hidden;
 font-style: italic;
}
.fila_titulo span {
 font-style: italic;
}	
td[colspan="2"] {
 border-right: hidden;
}
a:link {
 padding-top: 40px;
 margin: auto;
}
.fila_titulo {
 background: transparent;
 height:54px;
}
#cant_fotos {
 position: absolute;
 right: 12px;    
 top: 7px;
 font-size: 0.5em;
 text-align: right;
 font-stretch: ultra-condensed;
 z-index: 999;
}
#cant_fotos1 {
 font-size: 12px;
 text-align: center;
 font-stretch: extra-condensed;
}
#progressbar, #progressbar1 {
		background-color: red;
        width:0%;
        height:6px;
}
#myProgress, #myProgress1 {
  width: 100%;
  height:6px;
  background-color: lightgrey;
}
.inp {
text-align: left;
display: none;
}
.tipo_ {
display: none;
}
.filtro {
background-color: yellow;
}
#resultado {
    position: absolute;
    top: 20px;
    left: 5px;
    width: 50%;
    word-wrap: break-word;
    color: blue;
    letter-spacing: -1px;
    font-size: xx-small;
    font-stretch: extra-condensed;
    text-align: left;
}
#resultado1 {
    position: absolute;
    top: 32px;
    left: 2px;
    display: inline-block;
    color: brown;
    font-size: xx-small;
    font-weight: bold;
    font-stretch: extra-condensed;
    text-align: left;
}
#total1 { 
    position: absolute;
    right: 3px;    
    top: 45px;
    background-color: lightgreen;
    font-size: 12px;
    font-stretch: extra-condensed;
    font-weight: bold;
    white-space: nowrap;
}
.fotos {
    font-weight: bold;
    color: red;
    display: inline-block;
    height: 10px;
    line-height: 100%;
    vertical-align: middle;
}
.cons:after {
    content: "CONSULTAR";
    color: grey;
}
.imp:after {
    content: "SIN STOCK";
    color: grey;
}
.p_imp {
    color: grey;
}
.nuevo {
    text-decoration: underline dotted darkblue;
}
#sel1 {
    font-stretch: condensed;
}