#cerrar{display:none}
#cerrar + label{width:50px;height:50px;background-image:url('../img/cerrar.png');position:fixed;top:2%; left:1%; z-index:10000; display:none }
p{padding:5px 0px 5px 0px}

#cerrar ~ .modalContenedor{width:100%; height:100%; background-color:black; position: absolute; top:0;opacity:0; z-index:-1000; 		
	transition:z-index 0.5s, opacity 3s;
	-moz-transition:z-index 0.5s, opacity 3s;
	-webkit-transition:z-index 0.5s, opacity 3s;
	-o-transition:z-index 0.5s, opacity 3s;	
	-ms-transition:z-index 0.5s, opacity 3s;
  }
#cerrar:checked ~ .modalContenedor{opacity:0.8; z-index:1000;}

/*-------------------------------------------------------
Estilos para pantallas entre 1025 y 1280 pixels;
---------------------------------------------------------*/
@media screen and  (min-width: 1025px)
{

.ventanaModal{position: fixed; top:-60%; left:50%; width:500px; background-color:#fff; z-index:1000; margin-left:-250px;
	transition:top 2s;	-moz-transition:top 2s;	-webkit-transition:top 2s;	-o-transition:top 2s;		-ms-transition:top 2s;		
}
#cerrar:checked ~ .ventanaModal{top: 30%;}
#cerrar:checked + label{display:inline-block;cursor: pointer;}

.contenidoModal{ width:95%; height:80%; margin:0 auto;}
.tituloModal{ padding:5px; background-color:#1B1464; color:#fff}
}
/*-------------------------------------------------------
Estilos para pantallas entre 681 y 1024 pixels;
---------------------------------------------------------*/
@media screen and  (min-width: 681px)  and (max-width: 1024px) 
{
#cerrrar + label{top:20%; left:1%; z-index:100; display:none;}
.ventanaModal{position: fixed; top:-60%; left:50%; width:500px; height:250px; background-color:#fff; z-index:1000; margin-left:-250px;
	transition:top 2s;	-moz-transition:top 2s;	-webkit-transition:top 2s;	-o-transition:top 2s;		-ms-transition:top 2s;		}
#cerrar:checked ~ .ventanaModal{top: 30%;}
#cerrar:checked + label{display:inline-block; cursor: pointer;}

.contenidoModal{ width:90%; height:80%; margin:0 auto;}
.tituloModal{ padding:5px; background-color:#1B1464; color:#fff}

}
/*-------------------------------------------------------
Estilos para pantallas entre 1 y 680px pixels;
---------------------------------------------------------*/
@media screen and  (min-width: 1px)  and (max-width: 680px) 
{
#cerrrar + label{top:23%; left:1%; z-index:100; display:none}
.ventanaModal{position: fixed; top:-80%; left:50%; width:90%;  background-color:#fff; z-index:1000; margin-left:-45%;
	transition:top 2s;	-moz-transition:top 2s;	-webkit-transition:top 2s;	-o-transition:top 2s;		-ms-transition:top 2s;	}
#cerrar:checked ~ .ventanaModal{top: 30%;}
#cerrar:checked + label{display:inline-block; cursor: pointer;}

.contenidoModal{ width:90%; height:80%; margin:0 auto;}
.contenidoModal p{ font-size:14px;}
.tituloModal{ padding:5px; background-color:#1B1464; color:#fff;}

}