/*cuadro modal*/
.modal{
width:100%;
height:100%;
background: rgba(0,0,0,0.6);
position:fixed;
top:0;
left:0;
display:flex;
animation: modal 2s 3s forwards;
/*animation-fill-mode:forwards;forward cuando termine la animacion se quede ahi laimagen*/
visibility:hidden;
opacity:0;
z-index:90;
}
.contenido{
/*background:white;*/
-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	/* -moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000; */
margin:auto;
width:50%;
/* height:80%; */
}
.contenido img{height:auto; width:100%;}
#cerrar{display:none;}

#cerrar + label {
animation: modal 2s 3s forwards;
background:red;
color:#fff;
cursor:pointer;
font-size:25px;
height:40px;
line-height:40px;
opacity:0;
	position:fixed;
	right:22%;/*right:10px;*/
	text-align:center;
	top:10%;
	visibility:hidden;
	width:40px;
	z-index:100;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
	/*animation-delay:3s;*/		
}
#cerrar:checked + label, #cerrar:checked ~ .modal{
display:none;
}

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