.modal {
width: 100%;
height: 100vh;
background: rgba(0,0,0,0.8);

position:absolute;
top: 0;
left: 0;

display: flex;

animation: modal 2s 1s forwards;
visibility: hidden;
opacity: 0;
}

.contenido 
{
margin: auto;
width: 70%;
height: 60%;
background: white;
border-radius: 10px;
font-size: 12px;
text-align: justify;
padding-left: 10px;
padding-right: 10px;
padding-right: 10px;
}

#cerrar 
{
display: none;
}

#cerrar + label
{
position:absolute;
color: #fff;
font-size: 25px;
z-index: 50;
background: darkred;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 50%;
right: 10px;
cursor: pointer;

animation: modal 2s 1s forwards;
visibility: hidden;
opacity: 0;
}

#cerrar:checked + label, #cerrar:checked ~ .modal 
{
	display:none;
}

@keyframes modal 
{
	100% 
	{
		visibility: visible;
		opacity: 1;		
	}
	
}