body {text-align: center; color: crimson; font-family: serif; margin: 0;}
.modal { width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.95); position: absolute; top: 0; left: 0; display: flex; animation: modal 2s 3s forwards; visibility: hidden; opacity: 0;}
.contenido { margin: auto; width: 40%; height: 40%; background: white; border-radius: 10px;}
#cerrar { display: none;}
#cerrar + label { position: fixed; color: #fff; font-size: 25px; z-index: 50; background: darkred; height: 40px; width: 40px; line-height: 40px; border-radius: 50%; right: 500px; top: 200px; cursor: pointer; animation: modal 2s 3s forwards; visibility: hidden; opacity: 0;}
#cerrar:checked + label, #cerrar:checked ~ .modal { display: none; }
@keyframes modal {100% { visibility: visible; opacity: 1;}}