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

@font-face {
	font-family: 'BelligerentMadnessRegular';
	src: url('fonts/belligerent-webfont.eot?') format('eot'),
		url('fonts/belligerent-webfont.woff') format('woff'),
		url('fonts/belligerent-webfont.ttf') format('truetype'),
		url('fonts/belligerent-webfont.svg#webfontqdGI9bTD') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {
  color: #fff;
  background-color: #000;
  background: -webkit-linear-gradient(0deg, #000, #313131 50%, #000);
  background: -ms-linear-gradient(0deg, #000, #313131 50%, #000);
  background: -o-linear-gradient(0deg, #000, #313131 50%, #000);
  background: -moz-linear-gradient(0deg, #000, #313131 50%, #000);
  background: linear-gradient(90deg, #000, #313131 50%, #000);
  font-family: Helvetica, sans-serif;
  font-size: 14px;
  padding: 20px;
  margin: 0;
}

a {
  color: #5f8dd3;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

header {
  min-width: 580px;
  max-width: 960px;
  margin: 0 auto;
}

header hgroup {
  width: 380px;
  float: left;
  margin-bottom: 30px;
  margin-right: 20px;
}

header h1 {
  font: 65px 'PermanentMarkerRegular', Helvetica, sans-serif;
  letter-spacing: 0;
  text-align: center;
  margin: 0;
}

header h2 {
  display: block;
  font: 20px Helvetica, sans-serif;
  color: #808080;
  text-align: right;
  margin: 0;
  margin-top: -15px;
}

header nav {
  float: right;
  text-align: right;
}

nav {
  font-size: 16px;
  display: block;
}

nav ul {
  padding: 0;
}

nav li:nth-child(1) a {
  color: #ff0000;
}

nav li:nth-child(2) a {
  color: #ff7f2a;
}

nav li:nth-child(3) a {
  color: #ffcc00;
}

nav li:nth-child(4) a {
  color: #00d400;
}

nav li:nth-child(5) a {
  color:#5f8dd3;
}

nav li:nth-child(6) a {
  color: #ff00cc;
}

nav li {
  display: inline;
}

nav li a {
  margin: 5px;
}

nav li a.selected, nav li a:hover {
  text-decoration: overline;
}

section.page, article.page {
  clear: both;
  background-color: #fff;
  border-radius: 5px;
  min-width: 500px;
  max-width: 880px;
  color: #000;
  padding: 40px;
  margin: 0 auto;
  margin-bottom: 20px;
}

section h1 {
  margin-top: 0;
}