html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  background: black;
}

h1 {
  color: white;
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Geneva, Verdana, sans-serif;
  font-size: 20pt;
  font-weight: 100;
}
h2 {
  color: white;
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Geneva, Verdana, sans-serif;
  font-size: 12pt;
  font-weight: lighter;
}
p {
  color: white;
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Geneva, Verdana, sans-serif;
  font-size: 10pt;
  font-weight: lighter;
}
a:link {
  color: white;
}
a:visited {
  color: grey;
}

.dynamicImage {
  width: 90%;
  max-width: 500px;
}
/* Essentials */
.container {
  display: table;
}
.content {
  display: table-row;
  height: 100%;
}
.content-body {
  display: table-cell;
}

/* Aestetics */
.container {
  width: 100%;
  height: 100%;
  text-align: center;
}
.header, .footer {
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Geneva, Verdana, sans-serif;
  font-size: 8pt;
  color: white;
  padding: 2em;
  background: #161616;
}
.content-body {
  padding: 1em;
  vertical-align: middle;
}

/*  SECTIONS  */
.section {
  clear: both;
  padding: 0px;
  margin: 0px;
}

/*  COLUMN SETUP  */
.col {
  display: block;
  float:left;
  margin: 2% 0 2% 1.6%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
/*  GRID OF TWO  */
.span_2_of_2 {
width: 100%;
}
.span_1_of_2 {
width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
.col {
  margin: 5% 0 5% 0%;
}
}

@media only screen and (max-width: 480px) {
.span_2_of_2, .span_1_of_2 { width: 100%; }
}