/* XHTML y CSS con AMAYA
   Bartolomé Sintes Marco
   http://www.mclibre.org

   CSS ejercicio: Casa de Citas - Estilo rojo
   29 de noviembre de 2006
*/

html, body { 
  margin:0px; 
  padding: 0px; 
}

html { 
  background-color: #FF9191;
  font-family: sans-serif; 
}

h1 { 
  color: #FF9FA0; 
  font-size: 900%; 
  letter-spacing: 15px; 
  margin: 0px; 
  margin-top: 1em; 
  position: fixed; 
  text-align: center; 
  text-transform: uppercase; 
  width: 100%; 
  z-index: 0; 
}

ul#indice { 
  background-color: #FF9191;
  font-size: 80%;
  height: 4em; 
  list-style-type: none; 
  margin-left: 10px; 
  margin-top: 0px; 
  padding: 10px 0px 0px; 
  position: fixed; 
  top: 0px; 
  width: 100%; 
  z-index: 4; 
}

ul#indice li { 
  border: 1px solid white; 
  float: left; 
  margin-bottom: 10px;
  margin-right: 1em; 
  text-align: center; 
  width: 15em;  
}

a { 
  color: black; 
  text-decoration: none; 
}

div#principal { 
  bottom: 5em; 
  left: 4em; 
  overflow: hidden;
  padding: 0px;
  position: absolute; 
  right: 4em;
  top: 4em; 
}

div#principal p { 
  border: 1px solid white; 
  float: left; 
  font-size: 90%; 
  min-height: 10em; 
  padding: 2px 4px; 
  width: 10em; 
}

h2 { 
  clear: both;
  color: white; 
  margin: 10px 0px; 
  padding-left: 10px; 
}

p { 
  margin: 10px; 
}

address { 
  bottom: 5px; 
  font-size: 90%; 
  left: 0px; 
  position: absolute; 
  text-align: center; 
  width: 100%; 
}

address a { 
  border: none; 
  text-decoration: underline; 
}

div#css { 
  bottom: 10px; 
  font-family: monospace; 
  font-weight: bold; 
  position: fixed; 
  right: 10px; 
  text-align: center; 
  z-index: 3;
}

div#css table { 
  border-collapse: collapse; 
}

div#css caption { 
  color: black;  
  font-size: 80%; 
}

div#css a { 
  display: block; 
  height: 20px; 
  padding-top: 3px; 
  text-decoration: none; 
  width: 22px; 
}

a.azul { 
  background-color: blue;
  color: white;  
}

a.rojo { 
  background-color: red;    
  color: white; 
}

a.verde { 
  background-color: green;  
  color: white; 
}

a.amarillo { 
  background-color: yellow; 
  color: black; 
}
