html, body{ height: 100%;width:100%;}

body{background: #F2F2F2 url(../img/fondo.png) fixed top center no-repeat; padding: 0 0 10%;color: #484848;
    font-family: Arial,Helvetica,sans-serif;}

header {width: 100%; background-color: #FFFFFF; margin-bottom:3%;}
header .logos img{width:100%; height:10%}
header .logos .content{max-width: 80%;margin: 0 auto; position:relative;}
header .logos .logoIzq{float:left;}
header .logos .logoDer{float:right;}
header .title{background-color: #BE7261;	text-align: center;}
header .title .content{max-width: 100%; margin: 0 auto; position:relative; padding: 1.2%;}
header .title .content ul{position: absolute; right: 2em; top: 1em; width: 13%;}
header .title .content li {list-style: none; float:left;margin: 0 4%;}
header .title .content li a{font-size: 0.75em;}
header .title .content li a:active {font-weight:600;}
section{text-align:center;}
article{width: 100%; margin: 0 auto;text-align: center;}
article.videos{margin-bottom: 1.5%;}
article.content{font-size: 1.125em; line-height: 1.2em; width: 100%;}
article.content p.preg{font-size: 1.45em; color: #BE7261; margin: 2% auto;}
article.forms{text-align:center; margin: 1% auto;}
article.forms label{font-size: 1.125em; color: #484848;}
article.forms .box{margin-top: 1%;}
.forms input[type="text"], input[type="email"] {border: 1px solid #BE7261; border-radius: 2px; color: #CCCCCC; text-align: left; width: 14em; font-size:1.063em; padding: 0.4em 0 0.4em 2.2em;}
.forms input[type="text"] {background: #FFFFFF url(../img/contact.png) no-repeat 0.6em center; margin-right: 2%}
.forms input[type="email"] {background: #FFFFFF url(../img/email.png) no-repeat 0.6em center; font-style: italic;}
.forms div.cond {margin: 2% auto;}
.forms input[type="checkbox"] {padding: 0; margin:0; vertical-align: middle; position: relative; top: -1px;}
.forms div.cond label{color:#737373; font-size: 0.938em; padding-left: 8px;}
.forms input[type="submit"] {border:0; background: #BE7261; color: #FFFFFF; font-size: 1.250em; width:12em; border-radius: 28px; padding:1%; margin: 2%;}
article.museo{text-align:center; margin: 1% auto; color:#000000; font-size:0.875em;}
article.museo p.icons{margin: 3% auto; color:#595959;}
article.museo p.icons img{vertical-align: middle; margin: 0 0.4%;}
footer{background-color: #FFFFFF; width: 100%; text-align: center; bottom: 0; /*position:fixed;*/ padding: 0.2%; line-height: 1em;}
footer .content{max-width: 60%; margin: 0 auto; padding: 0.6% 0;}
footer .content p{margin: 1%;font-size: 1em;}
footer .content a{color: #44bde9}
footer .content p.copy{font-size: 0.625em;}

.clear {	clear: both;}
a:link, a:active, a:visited, a:hover   {text-decoration:none;color: #FFFFFF;}

@media only screen and (max-width : 480px) and (orientation: portrait) {
		/*header {width: 100%; background-color: #0000FF; margin-bottom:3%;}*/ /* vertical azul*/
		}
		
@media only screen and (max-width : 320px) and (orientation: portrait) {/* vertical verde*/
		/*header {background-color: #00FF00;}*/
		header .logos .content{width: 100%;}
		header .logos .logoIzq img, header .logos .logoDer img {width:90%; height:5%;}
		header .title .content ul{right:1em; top: 0;}
		header .title .content li a {font-size: 0.65em;}
		article.content {font-size: 0.65em; width: 100%;}
		article.forms label {font-size: 0.8em;}
		.forms input[type="text"] {margin-right: 0}
		.forms div.cond label {font-size: 0.7em;}
		footer {text-align: left;  padding:0;}
		footer .content {padding:0; width:100%;}
		footer .content p {font-size: 0.6em; margin:0;}		
}		

@media only screen and (max-width : 480px) and (orientation: landscape) {
		/*header {background-color: #FF00FF;}*/ /* horizontal rosa */
		header .logos .logoIzq img, header .logos .logoDer img {width:90%; height:10%;}
		article.content {font-size: 0.75em; width: 100%;}
		article.forms label {font-size: 0.8em;}
		.forms input[type="text"] {margin-right: 0}
}