/* === IMPORTANTE ===================================================
  No modificar estos estilos, ya que son imprescindibles para
  que la página se vea correctamente.
  ================================================================== */

/*-- Básico ----------------------------------------------------------*/
ul, ul li { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, p, form { margin: 0; padding: 0; }
.clear { clear: both; }
img { border: none; }

/*-- Layout ----------------------------------------------------------*/
#contenedor {
  width: 90%;
  max-width: 900px;
  width: 900px;
  margin: 0 auto;
}



#cabecera { clear: both; }
#menu { clear: both; }
#lateral { float: left; width: 20%; }
#contenido { float: right; width: 78%; }
#contenido #principal { float: left; width: 70%; }
#contenido #secundario { float: right; width: 20%; }
#pie { clear: both; }

/*-- Cabecera --------------------------------------------------------*/
#cabecera #logo { float: left; }
#cabecera #buscador { float: right; }

/*-- Menu ------------------------------------------------------------*/
#menu ul#menu_principal li { display: inline; float: left; }

/*-- Sección Principal -----------------------------------------------*/
#contenido #principal .articulo img { width: 100px; float: left; }

/*-- Pie de página ---------------------------------------------------*/
#pie .enlaces  { float: left; }
#pie .copyright { float: right; }

/* === IMPORTANTE ===================================================
  A partir de aquí, se pueden añadir todos los estilos propios que
  sean necesarios.
  ================================================================== */

#cabecera {padding: 1em;}
#menu {padding: 0.5em; margin-bottom: 0.5em;}
#noticias, #publicidad, #principal, #secundario {padding: 0.5em;}
#pie {padding: 0.5em 0px;}

.articulo {margin: 1em}
.articulo img {margin: 0.5em;}
#publicidad {margin-top: 1em;}
#pie {margin-top: 1em;}


/* ======Ejercicio 4====== */
#menu {
  border: 0.9px solid blue;
}

#noticias {
  border: 1px solid lightgray;
}

#publicidad {
  border: 1px dashed #CC6600;
}

#secundario {
  border: 1px solid #CC6600;
}

#pie {
  border-top: 1px solid #C5C5C5;
  border-bottom: 1px solid #C5C5C5;
}

/* ======Ejercicio 5====== */

#noticias {
  background-color: #F8F8F8;
}
#pie {
  background-color: #F8F8F8;
}

#publicidad { background-color: #FFF6CD;}

#secundario h2 {
  background-color: #DB905C;
  padding: 0.2em;
}

#menu {
  background-image: url(imagenes/fondo_menu.gif);
}

#cabecera #logo h1 {
  background-image: url(imagenes/logo.gif);
  width: 160px; height: 50px;
}