body {
  font-size: 62.5%;
  line-height: 1.8;
  font-family: helvetica, arial, verdana, sans-serif;
  background-color: #FFF;
  color: #000; }

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

.clearfix {
  display: block; }

a {
  color: #004E67; }
  a:hover {
    text-decoration: none; }

h1 {
  width: 80em;
  margin: 3em auto 0 auto; }
  h1 span {
    font-size: 2em; }
  h1 .fn {
    font-weight: normal; }
  h1 .sn {
    font-weight: bold; }

#header {
  width: 80em;
  margin: 0 auto 0 auto; }
  #header #about {
    float: left;
    width: 60em; }
    #header #about p {
      font-size: 1.4em; }
  #header #contact {
    float: left;
    width: 20em;
    text-align: right; }
    #header #contact li {
      font-size: 1.2em;
      font-weight: bold; }
      #header #contact li span {
        font-weight: normal; }

#featured {
  width: 77em;
  margin: 3em auto 3em auto;
  border: 0.5em solid #4175C9;
  padding: 1em;
  -moz-border-radius: 1em; }
  #featured .logo {
    float: left; }
  #featured .contents {
    margin-left: 196px;
    padding-left: 1em; }
    #featured .contents p {
      font-size: 1.4em; }

#stuff {
  width: 80em;
  margin: 0 auto;
  padding-bottom: 3em; }
  #stuff .box {
    float: left;
    width: 20em; }
  #stuff .contents {
    padding: 0 1em 1em 1em; }
    #stuff .contents h3 {
      font-size: 1.5em;
      font-weight: bold; }
      #stuff .contents h3 a {
        text-decoration: none; }
    #stuff .contents li {
      margin-bottom: 0.5em; }
      #stuff .contents li a {
        display: block;
        text-decoration: none;
        padding: 0.45em;
        background-color: #C0CAE3;
        -moz-border-radius: 0.3em;
        border: 1px solid #4175C9;
        color: #000;
        font-size: 1.1em; }
        #stuff .contents li a:hover {
          background-color: #A4B3CA;
          color: #000; }
      #stuff .contents li.more a {
        border: none;
        background-color: transparent;
        color: #000; }