.article-date:before {
    background: url('../ibero-system/assets/icons/ionicons/time.svg');
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    position: relative;
    bottom: -2px;
    background-size: contain;
    color: var(--uia-dark);
    margin-right: 5px;
    background-blend-mode: color;
}

/*BARRA DE NOTICIAS Y ARTICULOS*/
.main-article{
    height: 500px;
    overflow: hidden;
}

.main-article {
    display: flex;
    justify-content: end;
    flex-direction: column;
}

.main-article .grid{
    z-index: 2;
    margin-bottom: 40px;
    margin-left: 20px;
}

.main-article .overlay{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.7+0,0+100;Neutral+Density */
    background: -moz-linear-gradient(bottom, rgba(42, 42, 42, 1) 100%, rgba(42, 42, 42, 0) 0%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(bottom, rgba(42, 42, 42, 1) 100%, rgba(42, 42, 42, 0) 0%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to top, rgba(42, 42, 42, 1) 100%, rgba(42, 42, 42, 0) 0%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3000000', endColorstr='#00000000', GradientType=0);
    /* IE6-9 */
    height: 50%;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.main-article img{
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    width: auto;
    z-index: 0;
}

.main-article .news small::before {
    filter: invert(99%) sepia(99%);
}

@media (max-width:80em) {
    .newsArticleSide{
        display: none !important;
    }
}

/*SECONDARY ARTICLE*/
.secondary-article {
    overflow: hidden;
}
.secondary-article .col-5 {
    overflow: hidden;
}

.secondary-article .col-5 img{
    width: auto;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}