﻿
@font-face {
    font-family: 'gothic';
    src: url('gothic.eot');
    src: url('gothic.eot?#iefix') format('embedded-opentype'),
         url('gothic.woff') format('woff'),
         url('gothic.ttf') format('truetype'),
         url('gothic') format('svg');
    font-weight: normal;
    font-style: normal;
}

* { margin: 0; padding: 0; }
html { overflow-y: scroll;}
body { background:#75aede; font-size: 0.8em; color: #666; font-family: "gothic", helvetica, sans-serif;}
ol, ul { list-style: none; margin: 0;}
ul li { margin: 0; padding: 0;}
a, img { outline: none; text-decoration: none; border:none; color: #fff; font-family: "gothic", helvetica, sans-serif; font-weight: bold; font-size: 0.8em;}
a:hover { color: #87c8ff; }
p {
	color: #666;
	line-height: 1.4em;
	font-size: 1.1em;
	text-align: justify;
	margin-bottom: 25px;
	margin-left: 0;
	margin-right: 1%;
	margin-top: 5px;
}
h1 { font-size: 1.4em; color: #000; font-family: "gothic", helvetica, sans-serif; margin-bottom: 5px; text-align: left; }
h2 { font-size: 1.2em; color: #666; font-family: "gothic", helvetica, sans-serif; text-align: left; }
h3 { font-size: 0.9em; color: #000; font-family: "gothic", helvetica, sans-serif; margin-bottom: 10px; text-align: left; }
h4 { font-size: 1.0em; color: #000; font-family: "gothic", helvetica, sans-serif;}	
h5 { font-size: 1.0em; color: #000; font-family: "gothic", helvetica, sans-serif;}
h6 { font-size: 0.8em; color: #666; font-family: "gothic", helvetica, sans-serif;}	
h7 { font-size: 1.8em; color: #87c8ff; font-family: "gothic", helvetica, sans-serif;}

img { display: block; margin-bottom: 6px;}
aside, left, center, right { font-size: 1.2em; text-align: center;}
footer { text-align: center; line-height: 1.8em;}
article, aside, left, center, right, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { 
    display: block;
	}	

   
/* Estructura */
#wrapper {
	width: 96%;	
	max-width: 920px;
	margin: auto;
	margin-top: 5px;
	padding: 0%;
	} 
	
	left, center, right {
	margin-top: 20px;
	margin-left: 1.7%;
	margin-right: 1.7%;
	width: 29%;
	float: left;
		}
		
	aside {
	width: 26.8%;
	float: left;
		}
		
	#Line1 {
	color: #666;
	background-color: #666;
	border-width: 0px;
	float: left;
	width: 100%;
	height:2px;
	margin-bottom: 15px;
	}

	#Image1 {
	margin-bottom: 0px;
	}
	
	#post {
		width: 100%;
		float: left;
		font-size: 1.2em;
		text-align: center;
		margin-top: 20px;
		}
		
	footer {
		margin-top: 0px;
		width: 100%;
		float: left;
		font-size: 1.2em;
		/* background: #dfdfdf; */ 
		}

		
	
/* Imagen */			
#banner {

	margin: auto;
	margin-left: 25%;
	margin-top: 5px;
	margin-bottom: 15px;
	width: 75%;
	}
	
	#banner img {
		width: 75%;
		}

#video {
	margin: auto;
	margin-top: 5px;
	margin-bottom: 15px;
	width: 100%;
	}
	
#logo {
	border: 0;
	margin: auto;
	/* margin-top: 20%; */
	width: 100%;
	}
	
	#logo img {
		width: 100%;
		background: url(data/logo.gif) 0 0 no-repeat;
		}

/* Media Queries */
@media screen and (max-width: 480px) {

	#post, #footer, aside, left, center, right {
		float: left;
		clear: left;
		margin: auto;		
		width: 100%;
		}
	#banner {
		margin: auto;
		margin-left: 5%;
		width: 95%;
		}
		#banner  img {
			width: 100%;
			}
	#logo {
		margin-top: 20%;
		}
		#logo img {
			width: 100%;
			}
	#video {
		margin: auto;
		width: auto;
		}
		
}
