@charset "UTF-8";

.hero{
	height: 33.375em;
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden;
}
.hero::before{
	content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
    border: 1em solid var(--blanco);
    transition: all 0.5s ease-in-out;
    mix-blend-mode: overlay;
    animation: 2s agrandar 1s forwards;
}
.imagen-fondo{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index:-1;
}
.justify-center{
	justify-content: center;
}

.justify-end{
	justify-content: flex-end;
}

.hero .title{
	text-align: center;
	width: 70%;
	margin: 0 auto;
	line-height: 1.25em;
	opacity: 0;
	animation: 1s mostrar 1.5s forwards;
}

.title, .title * {
	color: var(--blanco) !important;
}

.hero .noticia{
/* 	width: 27.125em; */
/* 	height: min(23vh, 16.5em); */
    padding: 1.5em;
    background: var(--blanco);
/*     margin: 0 5vw 0 auto; */
/*     display: flex; */
/*     flex-direction: column; */
/*     justify-content: space-around; */
}

.hero h4{
	letter-spacing: 0.8px;
}

.hero .noticia .fecha{
	color: var(--azul-100);
}

.hero .noticia .mas{
	display: block;
	text-align: right;
	text-decoration: none;
	font-weight: bold;
	width: 40%;
	margin: 0 0 0 auto;
}

@keyframes agrandar {
	0% {
		width: 5em;
		height: 5em;
	}
	10%{
		width: 2vh;
		height: 2vh;
		
	}
	90%{
		width: 105vh;
		height: 105vh;
	}
	100% {
		width: 100vh;
		height: 100vh;
		opacity: 0.7;
	}
}

@keyframes mostrar{
	100%{
		opacity: 1.0;
	}	
}