@charset "utf-8";
/* CSS Document */

.ui-dialog .ui-dialog-content {
	overflow: auto !important;
	max-height: 70vh !important;
}
.ui-dialog {
	top:15vh !important;
}

body, input, textarea, select
{
	font-family: 'Oxygen', sans-serif;
	font-size:11px;
	color:#333435;
}

body
{
	
	background-color: #FFF;
	margin:0;
	padding:0;
}	

.anchoContenido
{
	width:1200px;
	margin:0 auto;
}

a
{
	color:#333435;
	text-decoration:none;
}

a:hover
{
	color:#666666;
	text-decoration:underline;
}

.azul
{
	color:#333435;
}

.infoboxbuscaclientes {
 
position:relative; 

}
 
.infoboxbuscaclientes:hover {

} 
  
.infoboxbuscaclientes .more { 
display:none; 
}
 
.infoboxbuscaclientes:hover .more {	 
	display:block; 
	position:absolute; 
	left:0px;
	top:50px;
	width:355px;	 
	background-color:#FFFFFF; 
}

.infoboxbuscaclientesVisitas {
	position:relative; 
}
  
.infoboxbuscaclientesVisitas .more { 
display:none; 
}
 
.infoboxbuscaclientesVisitas:hover .more {	 
	display:block; 
	position:absolute; 
	left:0px;
	top:20px;
	width:355px;	 
	background-color:#FFFFFF; 
}

.visita
{
	background-color:#D6D6D6;
	color: #333435;
	text-align: center;
	font-weight: bold;
	border: 1px solid #999;
}

.boton
{
	color: #333435;
	text-align: right;
	padding:10px 0;
	margin:10px 0;
	/*background-color:#f2f2f2;*/
}

.boton a {
    color: #333435;
    text-align: right;
    font-weight: bold;
    text-decoration: none;
    padding: 5px 10px;
    /* margin: 5px 10px; */
    margin-left: 5px;
    /* background-color: #D6D6D6; */
    -webkit-transition: all .20s ease-in-out;
    border: 1px solid rgba(0,0,0,0.8);
    opacity: 0.8;
    -moz-transition: all .20s ease-in-out;
    -o-transition: all .20s ease-in-out;
	transition:all 0.5s;
}
.boton a:hover
{
	opacity:1;
	/*color:#fff;	
	background-color:#333;*/
	color:rgba(0, 126, 202,1);
	border: 0.3px solid rgba(0, 126, 202,1);
	box-shadow: 0px 2px 10px 2px rgba(0,136,218,0.1);

}
table tr td {
	padding: 0px 5px;
}
table tr:first-child td {
	padding: 5px 5px;
}
/*table tr:nth-child(odd){
	background-color:#E5E5E5;
}
table tr:nth-child(even){
	background-color:white;
}*/
table tr:first-child {
	/*background-color:#0088DA !important;*/
}
.menu
{
	background-color:#D6D6D6;	
	color:#333435;
	font-size:12px;
}
.menu a
{
	color:#3b60f5;		
	text-align:right;
}
.menu td
{
	
	background-color:#D6D6D6;
	color:#333435;		
	text-align:right;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color:#333435;
	cursor:pointer;
	height:20px;
}	

.menu td:hover
{
	color:#666666;
}

.buscador
{
	background-color:#FFFFFF;
}

.cabeceraTabla
{
	font-weight:bold;
	color:#FFFFFF;
	height:20px;
	background-color:#0088DA !important;
}

.cabeceraTablaOrdenableFijo
{
	font-weight:bold;
	background-color: #0088DA;
	color:#FFFFFF;
	height:20px;
	cursor:auto;
	font-size:12px;	
}

.cabeceraTablaOrdenable
{
	font-weight:bold;
	background-color:#069;
	color:#FFFFFF;
	height:20px;
	cursor:pointer;	
	font-size:12px;	
}

.cabeceraTablaOrdenable:hover
{

	background-color:#333435;

}

.cabeceraTablaDet
{
	font-weight:bold;
	background-image:url(imagenes/barraAzul20.png);
	background-repeat:repeat-x;
	color:#FFFFFF;
	height:20px;
}

.lineaTabla
{
	background-color:#FFFFFF;
	color:#333435;
	text-decoration:none;
}

.lineaTabla:hover
{
	background-color:#CCCCCC;
	color:#333435;
	text-decoration:none;
}

.lineaTablaSel
{
	background-color:#FFFFFF;
	color:#333435;
	text-decoration:none;
	cursor:pointer;
}

.lineaTablaSel:hover
{
	background-color:#CCCCCC;
	color:#333435;
	text-decoration:none;
}

.lineaTabla2
{
	background-color:#E5E5E5;
	color:#333435;
	text-decoration:none;
}
.lineaTabla2:hover
{
	background-color:#CCCCCC;
	color:#333435;
	text-decoration:none;
}

.lineaTablaSinStock
{
	background-color: #FF7C7C;
	color:#333435;
	text-decoration:none;
}

.lineaTabla a
{
	color:#333435;		
}

.lineaTabla2 a
{
	color:#333435;		
}

.lineaTabla9px
{
	background-color:#FFFFFF;
	padding: 0px 5px;
}
.lineaTabla9px:hover, .lineaTabla12px:hover
{
	background-color:#CCCCCC;
}

.lineaTabla12px
{
	background-color:#FFFFFF;
}

.lineaTabla29px
{
	background-color:#E5E5E5;
}

.lineaTabla212px
{
	background-color:#E5E5E5;
}

.lineaTabla29px:hover, .lineaTabla212px:hover
{
	background-color:#CCCCCC;
}


.letra9
{
	font-size:10px;
}	
	
.titulo
{
	background-color:#FFFFFF;
	font-size:14px;
	font-weight:bold;
	margin:10px;
	text-transform:uppercase;
	
}	

.linea
{
	border-bottom-width: 1px;
	border-bottom-style:solid;
	border-bottom-color: #999999;
}

.lineaTablaDet
{
	background-color:#FFFFFF;
}
.lineaTablaDet:hover
{
	background-color:#FFFFFF;	
}

.enlacePaginas
{
	color:#666666;
	padding:3px;	
	height:20px;
}
.enlacePaginas span.actual{
	display: -webkit-inline-box;
    border: 1px solid rgba(0, 126, 202,1);
    padding: 3px 5px;
    color: rgba(0, 126, 202,1);
}
.enlacePaginas a
{	
	opacity:0.5;
	color:#333435;
	border: 1px solid #333435;
	cursor:pointer;
	text-decoration:none;
	padding:3px 5px;
	height:20px;
	transition:all 0.3s;
}

.enlacePaginas a:hover
{
	opacity:1;
	color:rgba(0, 126, 202,1);
	text-decoration:none;
	border: 1px solid rgba(0, 126, 202,1);
	/*background-color: #D6D6D6;	*/
	box-shadow: 0px 2px 10px 2px rgba(0,136,218,0.1);
}

.Recuadro{
	border: 1px solid rgb(0,0,0,0.3);
}

.recCelda{
	cursor:pointer;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-left-color: #666666;
}

.Imagenes{
    border: 1px solid rgba(0,0,0,0.3);
}
.barraDerechaImagenes {
	background-image: url(imagenes/barraDerechaImagenes.png);
	background-repeat:  repeat-y;
}

	
.BarraInferiorImagenes {
	background-image: url(imagenes/barraInfImagenes.png);
	background-repeat:  repeat-x;
}

TextArea {
	
	font-size:11px;
	color:#333435;

}

.controladorCalendario
{
	color:#FFFFFF;
	font-weight:bold;
	background-image:url(imagenes/barraAzul20.png);
	background-repeat:repeat-x;	
}

.controladorCalendario a
{
	color:#FFFFFF;
	text-decoration:none;
	font-weight:bold;
}

.diaCalendario
{
	position:relative; 
}

.diaCalendario .more
{	 
	position:absolute; 
	left:-355px;
	top:20px;
	width:355px;	 
	background-color:#C2c2c2;
}

.cabHojaGastos
{
    color:#333435;
	
	background-color:#FAFAD2;
	font-weight:bold;
	padding: 10px;	
}

.cabSemanas
{
    color:#333435;
	background-color:#FAFAD2;
	font-weight:bold;
	padding: 10px;	
}

.cabHojaGastos:hover
{
	color:#F0E68C;
	
}

.cabAmarillo
{
    color:#333435;
	background-color:#D6D6D6;
	font-weight:bold;
	padding: 10px;	
}

.cabAmarillo:hover
{
	color:#F0E68C;
	
}
.selCli {
	width:100%;
	display:flex;
}
.formulario
{
	color: black;
    margin-bottom: 10px;
    width: 49%;
    border: 0.3px solid rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 0px 16px 9px rgba(0,0,0,0.17);
    box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.07);
    transition: all 0.3s;
    padding: 10px;
}
.forclose2{
	font-size:15px;
	display:flex;
	text-decoration:none !important;
	transition:all 0.3s;
}
.forclose2:hover  {
	color:#0088DA;
	text-shadow: 0px 0px 5px rgba(0, 136, 218,0.3);
}
.close2 {
	width:100%;
}
.close2:after {
	content: "\274c"; /* use the hex value here... */
}
.letraRoja
{
	color:#FF0000;
}

.botonSimple {
	font-weight: bold;
	color: #FFFFFF;
	background-color: #666666;
	border: 1px solid #333435;
	text-align:center;
	padding:2px;
	cursor:pointer;

}

.botonSimple:hover {
	font-weight: bold;
	color: #FFFFFF;
	background-color:#999999;
	
}

.infobox100 
{
	width:19px;
	position:relative; 
}  
.infobox100 .more 
{
	z-index:30;
	position:absolute; 	
	left:-300px;
	top:-1px;
	width:100%;
	border:1px solid #333435; 
	background-color:#FFFFFF; 
}

.infoboxPais 
{
	width:19px;
	position:relative; 
}  
.infoboxPais .more 
{
	z-index:30;
	position:absolute; 	
	left:-300px;
	top:-1px;
	width:355px;
	border:1px solid #333435; 
	background-color:#FFFFFF; 
}

.infoboxProvincia {
	width:19px;
	position:relative; 
}
  
.infoboxProvincia .more { 
	
	z-index:20;
	position:absolute; 
	left:-300px;
	top:-1px;
	width:355px;
	border:1px solid #333435; 
	background-color:#FFFFFF; 
}

.infoboxPoblacion {
 
	position:relative; 
	width:19px;
}
  
.infoboxPoblacion .more { 
	z-index:10;	
	position:absolute; 	
	left:-300px;
	top:-1px;
	width:355px;
	border:1px solid #333435; 
	background-color:#FFFFFF; 
}

.detallePedido
{
	height:20px;
}	
.detallePedido:hover
{
	background-color:#999999;
	color:#FFFFFF;
	height:20px;
	cursor:pointer;	
}

.recuadro
{
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color:#666666;
	border-right-color: #666666;
	border-bottom-color: #666666;
	border-left-color: #666666;		
}

.titulillo
{
	font-size:15px;
	font-weight:bold;
	height:25px;
}

.infoboxArticulos
{
	width:19px;
	position:relative; 
	z-index:999;
}  
 
.infoboxArticulos .more 
{
	position:absolute;
	z-index:31;
	left:-160px;
	top:27px;
	width:477px;
	background-color:#FFFFFF;
}

.lineaBrowser2Sel
{
	background-color:#c2c2c2;
	height:20px;
	cursor:pointer;
}

.lineaBrowser1Sel
{
	background-color:#FFFFFF;
	height:20px;
	cursor:pointer;
}

.lineaBrowser2Sel:hover
{
	background-color:#E2E2E2;
}

.lineaBrowser1Sel:hover
{
	background-color:#E2E2E2;
}

.TituloInformacion #articulo{	
	color: #333435;
}

.TituloInformacion td
{
	font-weight:bold;
}

.CodigoArticulo {
	background-color: #CCCCCC;
	font-weight:bold;
}
.linea{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
}

.lineaAzul{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333435;
}

.lineaDerecha
{
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color:#999;	
}

.lineaAzulGorda{
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #333435;
}

.lineaAzulSuperior{
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #333435;
}

.sombra { background: #fff repeat-x 0 100%;  position: relative; z-index:50; }
.sombra { border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; box-shadow: rgba(0,0,0,0.3) 0 1px 3px; -webkit-box-shadow: rgba(0,0,0,0.3) 0 1px 3px; }
.tituloBanner {
	font-size: 36px;
}

.idiomaSel
{
	color:#FF6600;
}

.telefonos
{
	font-weight:bold;
	font-size:12px;
	background-color:#f2f2f2;
}

.enalce, .enalce:hover
{
	color:#3b60f5;
}

.masNews
{
	width:19px;
	position:relative; 
}  
.masNews .more 
{
	z-index:30;
	position:absolute; 	
	left:-165px;
	top:20px;
	width:355px;
	border:1px solid #f2f2f2; 
	background-color:#FFFFFF; 
	
	border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; box-shadow: rgba(0,0,0,0.3) 0 1px 3px; -webkit-box-shadow: rgba(0,0,0,0.3) 0 1px 3px;
}

.masReeNews
{
	width:19px;
	position:relative; 
}  
.masReeNews .more 
{
	z-index:30;
	position:absolute; 	
	left:-270px;
	top:20px;
	width:355px;
	border:1px solid #f2f2f2; 
	background-color:#FFFFFF; 
	
	border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; box-shadow: rgba(0,0,0,0.3) 0 1px 3px; -webkit-box-shadow: rgba(0,0,0,0.3) 0 1px 3px;
}

.recalm
{
color: #FF0000; 
background-color:#FFFF00;
}

.preparped
{
color: #FFFF00; 
background-color:#55B63D;
}

.recuadromenu
{
	border-bottom-width: 4px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;


}
hr {
display: block;
-webkit-margin-before: 0em;
-webkit-margin-after: 0em;
-webkit-margin-start: auto;
-webkit-margin-end: auto;
border-style: inset;
border-width: 1px;
}

.infoboxBusCli 
{
	width:19px;
	position:relative; 
	z-index:999;
}  
.infoboxBusCli .more 
{
	z-index:30;
	position:absolute; 	
	left:10px;
	top:10px;
	width:800px;
	border:1px solid #333435; 
	background-color:#FFFFFF; 
}

.aviso{
	margin:10px 0; 
	padding:5px; 
	background-color:#FF6; 
	background:url(imagenes/avisoIco.png) no-repeat #FF6 5px 5px; 
	line-height:40px; 
	padding-left:60px; 
	font-weight:bold; 
	color:#e69a00;
}

.infoForm{
	background-color:#999;
	margin-bottom:20px;
    border: 1px solid black;
}

.infoForm .conte{
	padding:10px; 
	font-weight:bold;
	font-weight:bold; 
	color:#FFF;
	line-height:30px;

}

.ui-dialog{
	/*margin-top:60px;*/
}


.avisos
{
	color:#333;
}

.efeVencido
{
	color:#F00 !important;
}

.colCanServ
{
	background-color:#FC0;
}
.colLinMod
{
	background-color:#0086da77;	
}
.colLinMod2
{
	background-color:#4f9fd160;	
}
.overflow{
	overflow:auto;
}

#detVis
{
	display:none;
}
/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  /*overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */

.modal-content {
  background-color: #fefefe;
  margin: auto;
  border: 1px solid #888;
  width: 95%;
  display:flex;
  flex-wrap:wrap;
}

/* The Close Button */
.close {
    /* display: flex; */
    margin-left: 97%;
    margin-right: 5px;
    color: #333;
    /* background-color: rgb(0,136,240); */
    font-size: 28px;
    font-weight: bold;
    width: 30px;
    padding-top: 3px;
}

.close:hover,
.close:focus{
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
#image2canvas {
	width:100%;
	height:80vh;	
	display:flex;
	justify-content: center;
	overflow:auto;
	
}
/*  POPUP END   */
.gastos #calendario {
	display:flex !important;
}
.gastos #calendario > div {
	display:flex !important;
}

.overflow-visible {
	overflow: visible !important;
}

.infoboxProvincia #resultado,
.infoboxPais #resultado2 {
	overflow: auto;
    max-height: 400px;
}


@media screen and (max-width: 920px)  {
.formulario > div:nth-child(2),
.formulario > div:nth-child(3) {
	width:100% !important;
}
.css-1xamfmm {
	display:none !important;
}
.fila  {
	width: max-content !important;
}
.boton  {
    display:flex;
}

.boton a {
    text-align: center;
}
.width100 {
	width:100%;
}

#capture .calendario > div {
	width:100%;
}
._forfes > div {
	width:50% !important;
	text-align:center;
}

.gastos #calendario > div {
		flex-wrap:wrap;
		width:100% !important;
}
.gastos #calendario ._calendar {
	width:100%;
	display:flex;
	flex-wrap:wrap;
}
.gastos #calendario ._calendar table {
	width:100%;

}
.gastos #calendario ._forcalendar{
	width:100% !important;
}
	
.ui-dialog{
	width:95% !important;

}

}




/*  - -   */

.layout-n1,
.layout-n2 {
	/*justify-content:space-between;*/
	display:flex;
	flex-wrap:wrap;
	width: 100%;
}

.layout-comp {
	width:20%;
	/*padding: 5px;*/
	display:flex;
}
.layout-comp-div {
	margin:5px;
	cursor: pointer;
	width:100%;
	border: 1px solid black;
	padding: 5px;
	min-height: 180px;
	margin-bottom:5px;
	overflow: hidden;
}
.layout-comp .img_comp {
	width:100%;
	height: 150px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}

.layout-comp .img_comp img {
	height:100%;
	width: unset;
}

.layout-comp  span {
	display: block;
	padding: 2px;
	font-weight: bold;
	width:100%;
	text-align: center;
}



.layout-n1 > .utils,
.layout-n2 > .utils {
	width: 100%;
}
.utils > button {
	padding: 0px 0px 0px 0px;
    border: 1px solid black;
    text-align: center;
    width: 100px;
    margin-bottom: 10px;
    cursor: pointer;
}
.utils > button i {
	padding: 5px;
}

.layout-n2 > .layout-comp {
	width:25%;
	min-height: 220px;
}

.layout-n2 > .layout-comp .img_comp {
	width:100%;
	height: 200px;
	display: flex;
	justify-content: center;
	overflow: hidden;
}

.layout-n1 .h2,
.layout-n2 .h2 {
	background-color: #999;
    padding: 10px;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    color: white;
    border: 1px solid black;
    margin-bottom: 10px;
}

.table-1 {
	margin-top:10px;
	margin-bottom: 10px;
}



.flex {
	display: flex;
}
.flex.justify-center {
    justify-content: center;
}
.flex.justify-right {
	justify-content: flex-end;
}
.flex.item-center {
	align-items: center;
}
.flex.flex-wrap {
	flex-wrap: wrap;
}

.p-0 {
	padding: 0px;
}
.p-5  {
	padding:5px;
}
.p-10  {
	padding:10px;
}

.m-0 {
	margin: 0px !important;
}

.js-hidden {
	display: none;
}
.min-width-100{
	min-width: 100px;
}

.button-form-1 {
	color: #333435;
	text-align: right;
	font-weight: bold;
	text-decoration: none;
	padding: 5px 10px;
	/* margin: 5px 10px; */
	margin-left: 5px;
	/* background-color: #D6D6D6; */
	-webkit-transition: all .20s ease-in-out;
	border: 1px solid rgba(0,0,0,0.8);
    opacity: 0.8;
	-moz-transition: all .20s ease-in-out;
	-o-transition: all .20s ease-in-out;
	transition: all 0.5s;
	width: fit-content;
	cursor: pointer;
}
.button-form-1:hover
{
	opacity:1;
	/*color:#fff;	
	background-color:#333;*/
	color:rgba(0, 126, 202,1);
	border: 0.3px solid rgba(0, 126, 202,1);
	box-shadow: 0px 2px 10px 2px rgba(0,136,218,0.1);
}

.table-1 {
	width: 100%;
	border-collapse: collapse;
}
.table-1 tr:first-child td {
	font-weight: bold;
    background-color: #0088DA;
    color: #FFFFFF;
    height: 20px;
    cursor: auto;
    font-size: 12px;
}
.table-1 tr:not(:first-child) {
	background-color: #FFFFFF;
    padding: 0px 5px;
	height: 22px;
}
.table-1 tr:not(:first-child):nth-child(odd) {
	background-color: #E5E5E5;
}

.m-auto {
	margin: auto;
}

.width-50 {
	width:50%;
}

.width-45 {
	width:45%;
}

.width-35 {
	width:35%;
}
.width-25 {
	width:25%;
}
.width-20 {
	width:20%;
}
.width-18 {
	width: 18%;
}
.width-16 {
	width: 16%;
}
.width-15 {
	width:15%;
}
.width-8 {
	width: 8%;
}
.width-5 {
	width: 5%;
}
.width-100 {
	width:100%;
}


.form-1 div {
	display: flex;
	/*flex-direction: column;*/
	padding: 0px 1%;
	align-items: center;
}
.form-1 div label {
	margin-right: 5px;
}


.form-1 input {
	padding: 5px;
	width: 100%;
}
.form-1 button {
	width:100%;
}




.form-div {
	position: fixed;
	width: 100%;
	left: 0;
	bottom:0;
	z-index: 56;
}
.form-div .form-1 {
	padding: 20px 0;
	display: flex;
	flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
	
    border-top: 2px solid rgb(0 136 218);
    box-shadow: 0px 0px 5px rgb(58 146 255);
}

.table_centred td {
	text-align: center;;
}

.cursor-pointer {
	cursor: pointer;
}

.albaranVenta__title {
	font-size: 1rem;
	font-weight: 600;
	padding-bottom: 10px;
}

.albaranVenta__title>span {
	background-color: #e5e5e5;
	padding: 6px 15px;
	border-radius: 10px;
}

.display-none {
	display: none !important;
}




/* BEFORE */
.PedSel::before {
	content: 'Ped.Seleccionado';
	position: absolute;
}
.ArtCant::before {
	content: 'Cantidad';
	position: absolute;
}
.PedSel,.ArtCant{
	text-align: center;
}


.p-albaranar:hover i {
	color:red;
}



.wContainer__lista {
    height: max-content;
    max-height: 300px;
    overflow-x: none;
    overflow-y: auto;
  }

  .wContainer__lista::-webkit-scrollbar {
    display: none;
  }

  /* Hide scrollbar for IE, Edge and Firefox */
  .wContainer__lista {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
  }

  .loader {
    display: flex;
    justify-content: center;
    margin: auto;
    margin-top: 20px;
    border: 4px solid #f3f3f3;
    /* Light grey */
    border-top: 16px solid #3498db;
    /* Blue */
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    animation: spin 2s linear infinite;
  }

  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }

    100% {
      transform: rotate(360deg);
    }
  }

  .wContainer__lista {
    margin-top: 20px;
  }

  .wContainer__lista>table {
    display: table;
    width: 100%;
    font-size: 14px;
    position: relative;
  }

  .wContainer__lista>table>thead{
    position: sticky;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    background-color: #3498db;
  }

  .wContainer__lista>table>thead>tr {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    background-color: #3498db;
    color: #f3f3f3;
    font-weight: 600;
  }

  .wContainer__lista>table>thead>tr>td {
    padding: 10px 20px;
	border-radius: 1vh;
  }

  .wContainer__lista>table>tbody>tr{
    object-fit: contain;
    cursor: pointer;
  }

  
  .wContainer__lista>table>tbody>tr>td {
    padding: 10px 20px;
	border-radius: 1vh;
  }

  .wContainer__lista>table>tbody>tr:hover {
    opacity: 1;
    transform: scale(1.1);
    box-shadow: 0px 10px 20px rgba(0,0,0,0.3);
  }

  .wContainer__lista>table>tbody tr:nth-child(odd) {
    background-color: #b7dbf2;
  }

  .wContainer__lista>table>tbody tr:nth-child(even) {
    background-color: #f3f3f3;
  }

  .wContainer__lista td:nth-child(1) {
    width: 30%;
  }

  .crearAlbaran__btn {
    background: none;
    background-color: none;
    border: none;
    outline: none;
    cursor: pointer;
    border-radius: 50%;
  }

  .searchNombreGlobal__input {
	  margin-top: 10px;
	  width: 15rem;
	  height: 1.5rem;
	  padding: 10px 20px;
	  font-size: 1rem;
	  border: none;
	  outline: none;
	  border-radius: 1vh;
	  box-shadow: inset 6px 6px 10px 0 rgba(0, 0, 0, 0.2),
    inset -6px -6px 10px 0 rgba(255, 255, 255, 0.5);
  }


/* width */

.w-90 {
	width:90%;
}
.w-100 {
	width:100%;
}

/* margin */
.m-b-5px {
	margin-bottom: 5px;
}

/* padding */
.p-0 {
	padding: 0px;
}
/* text-align */
.txt-left {
	text-align: left !important;
}
.txt-center {
	text-align: center !important;
}

.img50x50 {
	width: 50px;
	height: 50px;
}

.img100x100 {
	width: 100px;
	height: 100px;
}

.preview {
	padding: 5px 5px;
	border-radius: 5px;
	margin-right: 5px;
	display: grid;
	border:2px solid transparent;
	position: relative;
}
.preview.success {
	background-color: #1eff00;
}
.preview.error {
	background-color: rgb(255, 0, 43);
}
.preview span.upload {
	padding-top: 2px;
	padding-bottom: 2px;

    white-space: nowrap;
    width: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
	/* -webkit-line-clamp: 1; */
    /* -webkit-box-orient: vertical; */
    /* display: -webkit-box; */
}
.preview span.view {
	padding-top: 2px;
    padding-bottom: 2px;
    /* white-space: nowrap; */
    width: 100px;
    /* text-overflow: ellipsis; */
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.preview:hover .action-buttons {
	opacity: 1;
}

.action-buttons {
	display: flex;
	position: absolute;
	width: 100%;
	height: 100%;
	justify-content: center;
    align-items: center;
	background-color: rgba(0,0,0,0.5);
	opacity: 0;
	transition: all 1s;
	border-radius: 5px;
}
.action-buttons > * {
	padding: 5px;
	font-size: 20px;
	color: white;
	transition: all 0.5s;
	cursor: pointer;
}
.action-buttons .delete:hover {
	color: red !important;
}
.action-buttons > *:hover {
	color: rgb(0, 238, 255);
}

/* Catálogo por agrupaciones (Sin fotos) */
.flex-title {
	background: rgb(153,153,153);
	border: 1px solid #000;
	color: #FFF;
	padding: 10px;
	font-weight: bold;
	font-size: 15px;
	text-align: center;
	margin-bottom: 10px;
}
.flex-container {
	display: flex;
	flex-wrap: wrap;
}
.flex-item {
	width: 20%;
	display: flex;
}
.flex-item-inner {
	cursor: pointer;
	margin: 5px;
	padding: 5px;
	width: 100%;
	border: 1px solid #000;
	min-height: 180px; 
	color: rgb(51, 52, 53);
	overflow-x: hidden;
	overflow-y: hidden;
	transition: ease 0.5s;
}
.flex-item-inner.no-foto {
	min-height: 60px !important; 
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.flex-item-img {
	width: 100%;
	display: flex;
	justify-content: center;
	height: 150px;
	overflow-x: hidden;
	overflow-y: hidden;
}
.flex-item-inner span {
	display: block;
	padding: 2px;
	font-weight: bold;
	text-align: center;
	width: 100%;
}
.flex-item-img img {
	height: 100%;
}
.flex-item-inner:hover {
	background: rgba(0,0,0,0.1);
}

.hover:hover {
	cursor: pointer;
}

.layout-comp .img_comp .wrapper {
    position:relative;
    width: 100%;
    height: 100%;
	justify-content: center;
	display:flex;
}

.cross-img {
	opacity: 0.1;
}

.cross-img {
	position: absolute;
	/* top:0px;
	left: 50px; */
	
	width: 100%;
	height: 100%;
}


.layout-comp .img_comp .wrapper img {
	height:100%;
	width: unset;
}

.cabeceraTablaSeparable{
	white-space: normal;
	word-wrap: break-word;
	word-break: break-word;
	text-align: center;
	max-width: 100px;
}