/*
reglas para trabajar con CSS

1) primero se definen los estilos para ETIQUETAS html, por ejemplo header, footer, div, a p, etc.

2) Después se definen los estilos para IDENTIFICADORES (id), los idīs son elementos unicos en el html, 
en el css de declaran con el simbolo # ejemplo: #nombre-id{ estilos } y en el html se llaman
mediante el atributo id ejemplo: <div id="publicidad"> </div>

3) Al final se definen los estilos para las CLASES (class), las clases son elementos que se pueden
repetir īnī veces en el html, en el css se declaran con el simbolo de . ejemplo: .nombre-clase{ estilos}
y en el html se llaman mediante el atributo <div class="borde-logos"> </div>

4) Todos los elementos se ordenan confotme van apareciendo en la dispocicion del html, teniendo en 
cuenta la prioridad anterior, es desir, primero etiquetas html, luego idīs y al final clases.

5) Los atributos se declaran de la siguiente forma: { atributo1:valor1; atributo2:valor2; ...;
atributoN:valorN; }

6)todos los atributos se ordenan alfabeticamente, por ejemplo si tengo width, color, display, entonces
el orden seria: primero color, luego display y al final width.

7) Si tenemos estilos para el comodin *, o para las etiquetas html y/o body, estos estilos son los primeros en definirce.

8)En el body debemos declarar un tamaņo de fuente global.

9) Si tenemos estilos para resetear elementos html, estos iran antes de cualquier estilo. 
*/

*{
	 		margin: 0;
	 		padding: 0;
}

/*
@font-face {
    font-family: 'varelaregular';
    src: url('../fonts/varela-regular-webfont.eot');
    src: url('../fonts/varela-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/varela-regular-webfont.woff') format('woff'),
         url('../fonts/varela-regular-webfont.ttf') format('truetype'),
         url('../fonts/varela-regular-webfont.svg#varelaregular') format('svg');
    font-weight: normal;
    font-style: normal;
}*/

@font-face {
    font-family: 'ryeregular';
    src: url('../fonts/rye-regular-webfont.eot');
    src: url('../fonts/rye-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rye-regular-webfont.woff') format('woff'),
         url('../fonts/rye-regular-webfont.ttf') format('truetype'),
         url('../fonts/rye-regular-webfont.svg#ryeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* 16px = 12pt = 100% = 1em */

body {
		 background:#212121 url(../img/fondo2.jpg);
		 color: #FFF;
		 font-family: 'ryeregular', Helvetica, Verdana;
		 font-size: 1.1em;
}

h1 {
	 color: #f60;
	 margin: 0.25em auto;
	 text-align: center;
	 text-shadow: 5px 5px 10px rgba(255,255,255,0.5);
}

header, nav, footer {
	 background: #1E6381;
	 border-radius: 0.5em;
	 margin: 0.5em auto;
	 max-width: 960px;
	 padding: 0.25em;
	 text-align: center;
}

section#contenedor{
   margin: 0.5em auto;
	 max-width: 960px;
	 padding: 0;
	 text-align: center;
}

section#principal,aside{
   background: #1E6381;
	 border-radius: 0.5em;
	 display: inline-block;
	 margin: 0.25em auto;
	 max-width: 960px;
	 min-height: 200px;
	 padding: 0.25em;
	 text-align: center;
	 vertical-align: top;
	 width: 66%;
}

article{
   background: #011E30;
	 border-radius: 0.5em;
	 min-height: 150px;
	 padding: 0.25em;
}

aside{
   width:31%;
}