/* Layout ******************/

html {
  height: 100%;
}

body {
  position: relative;

  width: 700px;
  min-height: 100%;
  margin: 0 auto;
  padding: 0;
}

#meta {
  position: absolute;
  bottom: 0;

  width: 100%;
  height: 42px;
}

#content {
  padding-bottom: 42px;
}

#main {
  float: left;

  width: 55%;
  margin-left: 20%;
}

#sections {
  float: left;

  width: 20%;
  margin-left: -75%;
}

#news {
  float: right;

  width: 25%;
}

#content {
  overflow: hidden;

  width: 100%;
}

h1 {
  margin: 0;
  padding: 20px 20px 20px 60px;
}

#search {
  position: absolute;
  top: 0;
  right: 0;

  margin: 20px;
}

/* Fonts *******************/

body {
  font: 13px Tahoma, Sans-Serif;
}

h1 {
  letter-spacing: 1px;

  font-size: 180%;
}

#main h2 {
  font-size: 130%;
}

#sections, #news {
  font-size: 80%;
}

#sections h2, #news h2 {
  text-transform: uppercase;

  font-size: 125%;
  font-weight: bold;
}

#news h3 {
  font-size: 100%;
  font-weight: bold;
}

#meta {
  font-size: 70%;
}

#search input, #search button {
  font-size: 9px;
}

/* Colors ******************/

html {
  background: #EEE;
}

body {
  color: black;
  background: white;
}

#title {
  color: white;
  background: #45F;
}

#meta, #meta a {
  color: white;
  background: #45F;
}

#sections li a.blue {
  color: white;
  background: #293499;
}

#sections li a.light-blue {
  color: black;
  background: #DDE6FF;
}

#sections li a.separate {
  margin: 22px 0;
}

#sections li a {
  border-color: white;
}

#sections li a:hover {
  color: white;
  background: #D00;
}

#news {
  color: #293499;
}

#news a {
  color: #D00;
}

#news h2 {
  background: #DDE6FF;
}

#main h2 {
  color: #293499;
}

#main .picture {
  border-color: #45F;
}

#search {
  color: white;
}

/* Misc ********************/

#sections ul {
  margin: 50px 0;
  padding: 0;

  list-style: none;
}

#sections li a {
  display: block;

  margin: 5px 0;
  padding: 2px 5px;

  text-decoration: none;

  border-width: 1px 0;
  border-style: solid;
}

#news h2 {
  margin: 0 0 20px 0;
  padding: 10px;
}

#news h3 {
  float: left;

  margin: 0 5px;
}

#news p {
  margin: 20px 5px;
}

#main h2, #main p {
  margin-right: 15px;
  margin-left: 15px;
}

#main h2 {
  margin-top: 20px;
  margin-bottom: 10px;
}

#main .picture {
  float: left;

  margin: 0 15px 15px 0;
  padding: 5px;

  border-width: 1px;
  border-style: solid;
}

#meta p {
  margin: 5px;
}

#search p {
  margin: 0;
}

#search input {
  width: 10em;
}
