/* CSS Document */

section{
	float:left;
	width:65%;
	text-align:justify;
	margin-top:10px
}

article{
	margin-bottom:5px;
	padding: 10px;
	border-radius: 10px 10px 10px 10px;
	border-style: solid;
	border-width: 0px;
	background-color: #000;
}

/* Seudoclases CSS*/
article:nth-child(odd){/*Permite seleccionar uno o mas elementos en funcion de su orden de aparicion*/
	background-color:rgba(255, 255, 255, 0.40);
}

article:nth-child(even){
	background-color:rgba(255, 255, 255, 0.80);
}

p
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
color:#000;
text-align:justify;
line-height: 1.5em;
}

p.aside
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
color:#fff;
text-align:justify;
line-height:1.5em;
}

aside
{
	float:right;
	width:300px;
	text-align:justify;
	margin-top:0px;
	margin-right:-38px;
}

blockquote
{
	margin-bottom:5px;
	padding: 10px;
	border-radius: 10px 10px 10px 10px;
	border-style:solid;
	border-width: 2px;
	border-color: #0C0;
}

blockquote:nth-child(odd){/*Permite seleccionar uno o mas elementos en funcion de su orden de aparicion*/
	background-color:rgba(40, 97, 210, 0.90);
}

blockquote:nth-child(even){
	background-color:rgba(40, 97, 210, 0.50);
}

footer
{
	float:left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#fff;
	text-align:center;
	margin-top:10px;
	width:98%;/* Establecemos que el header abarque el 100% del documento*/
	overflow:hidden;/*Eliminamos errores de float*/
	background:#0C0;
	margin-bottom: 10px;
	padding:10px;
	border-radius: 0px 0px 100px 100px;
	border-style:none;
}

/*Estilos de la galeria*/
.galeria {
width: 90%;
margin: auto;
list-style: none;
padding: 20px;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
.galeria li {
margin: 5px;
}
.galeria img {
width: 140px;
height: 100px;
}
/*Estilos del modal*/
.modal {
display: none;
}
.modal:target {
display: block;
position: fixed;
background: rgba(0,0,0,0.8);
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.modal h3 {
color: #fff;
font-size: 30px;
text-align: center;
margin: 15px 0;
}
.imagen {
width: 100%;
height: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.imagen a {
color: #fff;
font-size: 40px;
text-decoration: none;
margin: 0 10px;
}
.imagen a:nth-child(2) {
margin: 0;
height: 100%;
flex-shrink: 2;
}
.imagen img {
width: 500px;
height: 100%;
max-width: 100%;
border: 7px solid #fff;
box-sizing: border-box;
}
.cerrar {
display: block;
background: #fff;
width: 25px;
height: 25px;
margin: 15px auto;
text-align: center;
text-decoration: none;
font-size: 25px;
color: #000;
padding: 5px;
border-radius: 50%;
line-height: 25px;
}