@charset "utf-8";
/* CSS Document */


* {padding: 0; margin: 0;}
a {outline: 0; text-decoration:none; color:#433;}
a:hover{color:#D00;}
a img {border-width:0;}


body{
	font-family: 'Indie Flower', cursive;
	font-size:21px;
	font-weight:normal;
	color:#555;
	background: #E5E5E5 url("img/cuadrosblancos.png") center top;
}


#todo{
	position:relative;
	margin:40px auto;
	width:80%;
	max-width:1600px;
	background:#FFF;
	box-shadow:#999 0 0 5px;
	border:#B3B3B3 1px solid;
}

header{
	text-align:center;
	padding: 40px 0 0 0;
}

#logo{
	width: 95%;
	max-width: 751px;
}

main{
	position:relative;
	padding: 0 3%;
	height: auto !important;
	height: 450px;
	min-height: 450px;
}

h1{
	text-align:center;
	font-size: 33px;
	letter-spacing: 4px;
	font-weight:normal;
	color:#666;
	padding: 20px;
	text-transform:uppercase;
}

#indiceportada{
	text-align:center;
	padding: 80px 0;
}
#indiceportada a img{
	width: 95%;
	max-width: 250px;
}
#indiceportada a:hover{
	opacity:0.7;
}




#galeria{
	margin: 30px;
	text-align:center;
}
#galeria a img{
	margin: 10px;
	border:#EEE 8px solid;
}

#galeria a:hover img{
	border-color:#DDD;
}

.info{
	margin: 20px;
	text-align:center;
	line-height:160%;
	font-size: 21px;
	color:#999;
}
.info a{
	display: inline-block;
	margin: 2px 0;
	padding: 3px 12px;
	background: #faff84;
	color:#000;
}
.info a:hover{
	background:#f6ff00;
	color:#000;
}

.error{
	display:block;
	background: #333 url("../img/error.png") no-repeat 20px 20px;
	min-height:60px;
	margin: 120px 250px;
	padding: 20px 30px 10px 90px;
	color:#CCC;
}
.error strong{
	display:block;
	padding-bottom: 10px;
}

footer{
	position:relative;
	clear:both;
	border-top:#FF7ADB 2px solid;
	color:#777;
	padding: 20px 50px;
	text-align:left;
	font-size: 17px;
	line-height: 140%;
	letter-spacing:1px;
}

footer a img{
	float:right;
	margin: 0 10px;
}



@media screen and (max-width: 500px) {
	#todo, main{
		width: 96%;
		margin: 10px auto;
		padding: 0;
	}

	#galeria a img{
		max-width: 90%;
		height: auto;
	}	
}