body {

    text-align: center;

    font-family: sans-serif;

    margin: 0;

}



.modal {

    width: 100%;

    height: 100%;

    background: rgba(0,0,0,0.2);

    
    top: 0;
    left: 0;

    
    position: absolute;

    
    display: flex;

    
    animation: modal 2s 0s forwards;

    visibility: hidden;

    opacity: 2;

}
.contenido {

    margin: auto;

    width: 60%;

    height:90%;


    border-radius: 10px;

}


.contenido span{

	color:#fff;

	background-color:#000;

	padding:.2em .5em .3em .5em;

	font-family:Arial;

	font-weight:bold;

	border:2px solid #fff;

	border-radius:50%;

	/*position:absolute;*/

	cursor:pointer;

}


#cerrar  {

    display: none;

}




#cerrar:contenido span ~ .modal{

    display: none;

}



@keyframes modal {

    100% {

        visibility: visible;

        opacity: 1;

    }

}