/*padding=margenes internos:
Cuatro valores pueden ser 
especificados: superior, derecho,
 inferior, izquierdo,
en este orden.
Espacio que ocupa un elemento
es calculada, el navegador obtiene el valor final 
por medio de la siguiente fórmula:
tamaño + márgenes + márgenes internos + bordes.*/
* {
margin: 0px;
padding: 0px;
}

h1 {
font: bold 20px SketchFlow Print, sans-serif;
}
h2 {
font: bold 14px Comic Sans MS, sans-serif;
}
h3 {
font: bold 50px SketchFlow Print, sans-serif;
}
/*modelo de caja*/
header, section, footer, aside, nav, article, figure, figcaption,
hgroup{
display: block;
}
/*centrado del cuerpo*/
body {
text-align: center;
}
/*medidas del div caja principal*/
#agrupar {
width: 960px;
margin: 15px auto;
text-align: left;
}
/*cabecera*/
#cabecera {
background: #82FA58;
border: 1px solid #999999;
padding: 20px;
}
/*menu*/
#menu {
background: #31B404;
padding: 5px 15px;
}
#menu li {
display: inline-block;
list-style: none;
padding: 5px;
font: bold 20px SketchFlow Print, sans-serif;
}
/*seccion y columna:
FLOAT es una de las propiedades más ampliamente utilizadas
para aplicar el Modelo de Caja Tradicional. Hace que el 
elemento flote hacia un lado o al
otro en el espacio disponible.*/
#seccion {
float: left;
width: 660px;
margin: 20px;
font: bold 15px Comic Sans MS, sans-serif;
}
#columna {
float: left;
width: 220px;
margin: 20px 0px;
padding: 20px;
background: #F7FE2E;
font: bold 11.5px SketchFlow Print, sans-serif;
}
/*pie:
BOTH el cual significa que ambos lados del elemento serán
restaurados y el elemento seguirá el flujo normal (este elemento ya no es flotante como
los anteriores). Esto, para un elemento block, quiere decir que será posicionado debajo del
último elemento, en una nueva línea.*/
#pie {
clear: both;
text-align: center;
padding: 20px;
border-top: 2px solid #999999;
}
/*diseño del contenido*/
article {
background: #ACFA58;
border: 1px solid #999999;
padding: 20px;
margin-bottom: 15px;
}
article footer {
text-align: right;
}
time {
color: #999999;
}
figcaption {
font: italic 14px verdana, sans-serif;
}