html, body {
  background-color: black;
  margin: 0;
  padding: 0;
  color: white;
  height: 100%;
  min-height: 100%; }

body {
  background: url("/images/background.jpg") no-repeat;
  background-size: 100%;
  background-position: center top;
  text-align: center;
  font-size: 100%;
  /*font-family: 'Yanone Kaffeesatz', sans-serif;*/
  font-family: 'Teko', sans-serif; }

#logo {
  width: 200px;
  height: 174px; }

h1 {
  font-size: 3.0rem;
  margin-top: 0; }

#container {
  position: relative;
  margin: 0 auto;
  width: 900px;
  height: auto;
  min-height: 100%;
  padding-top: 2rem; }

#albumcover {
  width: 400px;
  height: auto;
  max-width: 100%; }

#playerContainer {
  max-width: 850px;
  min-width: 300px;
  margin: auto;
  margin-bottom: 2rem;
  text-align: center; }
  #playerContainer iframe {
    border: 0;
    width: 400px;
    height: 400px;
    max-width: 100%; }

#videoContainer {
  max-width: 100%;
  min-width: 300px; }
  #videoContainer iframe {
    border: 0;
    width: 600px;
    height: 340px;
    max-width: 100%; }

#outlets {
  text-align: center;
  width: 100%; }
  #outlets .breaker {
    display: inline-block; }

.outlet {
  display: inline-block;
  font-size: 1.7rem;
  padding: 0.6rem;
  margin: 0.6rem; }
  .outlet a, .outlet a:visited, .outlet a:hover {
    color: white;
    text-decoration: none; }

.socialLink {
  display: inline-block;
  padding: 0.6rem;
  margin: 0.6rem; }
  .socialLink a, .socialLink a:visited, .socialLink a:hover {
    text-decoration: none; }
  .socialLink.facebook img {
    height: 40px;
    width: 40px; }
  .socialLink.youtube img {
    height: 40px;
    width: 57px; }

#signup {
  margin-top: 2rem; }
  #signup .prompt {
    font-family: Ariel, sans-serif;
    font-size: 1.0rem;
    padding: 0.5em; }
  #signup .fields input {
    display: inline-block; }
  #signup .tinyletter a, #signup .tinyletter a:hover, #signup .tinyletter a:visited {
    color: #666; }

@media only screen and (max-width: 800px) {
  #container {
    width: 100%; } }
@media only screen and (max-width: 600px) {
  h1 {
    font-size: 2.0rem; }

  .outlet {
    font-size: 1.4rem; }

  #signup .prompt {
    font-size: 0.8rem; } }
@media only screen and (max-width: 400px) {
  h1 {
    font-size: 1.5rem; }

  .outlet {
    font-size: 1.2rem; }

  #signup .prompt {
    font-size: 1.0rem; } }
