/* Coloca este CSS y las dos imágenes en la misma carpeta.
   Cargar después del CSS anterior, o reemplazar su bloque .iconos-1.
   Azul por defecto. Para blanco, agrega la clase iconos-blancos al icono
   o al contenedor del menú. */
.iconos-1 {
  background-image: url("iconos-azul.png?v2");
  background-repeat: no-repeat;
  background-size: 720px 60px;
  width: 30px;
  height: 30px;
  display: block;
}
.iconos-1.iconos-blancos,
.iconos-blancos .iconos-1 {
  background-image: url("iconos-blanco.png?v2");
}
.iconos-1.hover:hover { cursor: pointer; }
/* Cada hover conserva su dibujo. Las posiciones originales no cambian. */
.iconos-1.solicitud, .iconos-1.solicitud.hover:hover { background-position: 0px 0px; }
.iconos-1.ventas, .iconos-1.ventas.hover:hover { background-position: -30px 0px; }
.iconos-1.familiasyline, .iconos-1.familiasyline.hover:hover { background-position: -60px 0px; }
.iconos-1.transito, .iconos-1.transito.hover:hover { background-position: -90px 0px; }
.iconos-1.reportes, .iconos-1.reportes.hover:hover { background-position: -150px 0px; }
.iconos-1.sucursales, .iconos-1.sucursales.hover:hover { background-position: -180px 0px; }
.iconos-1.catalogos, .iconos-1.catalogos.hover:hover { background-position: -210px 0px; }
.iconos-1.config, .iconos-1.config.hover:hover { background-position: -240px 0px; }
.iconos-1.clientes, .iconos-1.clientes.hover:hover { background-position: -270px 0px; }
.iconos-1.cuentas, .iconos-1.cuentas.hover:hover { background-position: -300px 0px; }
.iconos-1.ingresosventas, .iconos-1.ingresosventas.hover:hover { background-position: -330px 0px; }
.iconos-1.calendario, .iconos-1.calendario.hover:hover { background-position: -360px 0px; }
.iconos-1.cotizacion, .iconos-1.cotizacion.hover:hover { background-position: -390px 0px; }
.iconos-1.cotizaciones, .iconos-1.cotizaciones.hover:hover { background-position: -420px 0px; }
.iconos-1.facturas, .iconos-1.facturas.hover:hover { background-position: -450px 0px; }
.iconos-1.productos, .iconos-1.productos.hover:hover { background-position: -480px 0px; }
.iconos-1.kardex, .iconos-1.kardex.hover:hover { background-position: -510px 0px; }
.iconos-1.descuentos, .iconos-1.descuentos.hover:hover { background-position: -540px 0px; }
.iconos-1.precios, .iconos-1.precios.hover:hover { background-position: 0px -30px; }
.iconos-1.mayoreo, .iconos-1.mayoreo.hover:hover { background-position: -30px -30px; }
.iconos-1.mostrador, .iconos-1.mostrador.hover:hover { background-position: -60px -30px; }
.iconos-1.almacen, .iconos-1.almacen.hover:hover { background-position: -90px -30px; }
.iconos-1.gastos, .iconos-1.gastos.hover:hover { background-position: -120px -30px; }
.iconos-1.inventario, .iconos-1.inventario.hover:hover { background-position: -150px -30px; }
.iconos-1.sugerido, .iconos-1.sugerido.hover:hover { background-position: -180px -30px; }
.iconos-1.rh, .iconos-1.rh.hover:hover { background-position: -210px -30px; }
.iconos-1.cobranza, .iconos-1.cobranza.hover:hover { background-position: -270px -30px; }
.iconos-1.proveedores, .iconos-1.proveedores.hover:hover { background-position: -300px -30px; }
.iconos-1.nuevoprov, .iconos-1.nuevoprov.hover:hover { background-position: -330px -30px; }
.iconos-1.encamino, .iconos-1.encamino.hover:hover { background-position: -360px -30px; }
.iconos-1.existencia, .iconos-1.existencia.hover:hover { background-position: -390px -30px; }
.iconos-1.existenciagral, .iconos-1.existenciagral.hover:hover { background-position: -420px -30px; }
.iconos-1.sugcompra, .iconos-1.sugcompra.hover:hover { background-position: -450px -30px; }
.iconos-1.compras, .iconos-1.compras.hover:hover { background-position: -480px -30px; }
.iconos-1.ventaespecial, .iconos-1.ventaespecial.hover:hover { background-position: -510px -30px; }
.iconos-1.inicio, .iconos-1.inicio.hover:hover { background-position: -570px 0px; }
.iconos-1.cajachica, .iconos-1.cajachica.hover:hover { background-position: -600px 0px; }
.iconos-1.reetiquetados, .iconos-1.reetiquetados.hover:hover { background-position: -630px 0px; }
.iconos-1.muestreos, .iconos-1.muestreos.hover:hover { background-position: -660px 0px; }
.iconos-1.pedidos, .iconos-1.pedidos.hover:hover { background-position: -690px 0px; }