/* 
    VISUALIZAR ICONO
    ----------------------------------
    <div class="ico-book"></div>
    
    PERSONALIZA (Tamaño y Color) 
    ....................................
    .ico-book{
    	height: 71px;
    	background-color: yellow;
    }
*/


.icox{
    width: auto;
    height: 57px;
    background-color: #000;
    mask-position: center; 
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.x-archivo{
    mask-image: url(archivo.svg);
    -webkit-mask-image: url(archivo.svg);
}
.x-archivotecnico{
    mask-image: url(archivo-tecnico.svg);
    -webkit-mask-image: url(archivo-tecnico.svg);
}
.x-conferenciapublico{
    mask-image: url(conferencia-publico.svg);
    -webkit-mask-image: url(conferencia-publico.svg);
}
.x-conferencia{
    mask-image: url(conferencia.svg);
    -webkit-mask-image: url(conferencia.svg);
}
.x-corazon{
    mask-image: url(corazon.svg);
    -webkit-mask-image: url(corazon.svg);
}
.x-engranaje{
    mask-image: url(engranaje.svg);
    -webkit-mask-image: url(engranaje.svg);
}
.x-estadisticabarra{
    mask-image: url(estadistica-barra.svg);
    -webkit-mask-image: url(estadistica-barra.svg);
}

.x-graduaciongorro{
    mask-image: url(graduacion-gorro.svg);
    -webkit-mask-image: url(graduacion-gorro.svg);
}
.x-libro{
    mask-image: url(libro.svg);
    -webkit-mask-image: url(libro.svg);
}
.x-libropublicacion{
    mask-image: url(libro-publicacion..svg);
    -webkit-mask-image: url(libro-publicacion.svg);
}
.x-lupa{
    mask-image: url(lupa.svg);
    -webkit-mask-image: url(lupa.svg);
}
.x-movil{
    mask-image: url(movil.svg);
    -webkit-mask-image: url(movil.svg);
}
.x-planta{
    mask-image: url(planta.svg);
    -webkit-mask-image: url(planta.svg);
}
.x-portapapeles{
    mask-image: url(portapapeles.svg);
    -webkit-mask-image: url(portapapeles.svg);
}
.x-usuariogrupo{
    mask-image: url(usuario-grupo.svg);
    -webkit-mask-image: url(usuario-grupo.svg);
}