*, *:before, *:after {
  -website-box-sizing: border-box;
  -moz-border-box: border-box;
  box-sizing: border-box; }

body {
  font-family: "Knockout 50 A", "Knockout 50 B", sans-serif;
  font-weight: 400;
  font-style: normal;
  background: url(images/impact-bg.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  margin: 0;
  color: #4b4f54; }
  body #content {
    display: block;
    margin: 0 auto;
    padding: 100px 20px 80px;
    max-width: 860px;
    background: rgba(255, 255, 255, 0.6);
    text-align: center; }
    body #content #logo {
      display: block;
      width: 290px;
      height: auto;
      margin: 0 auto 60px; }
    body #content h1 {
      text-transform: uppercase;
      font-size: 2.75em;
      line-height: 1; }
    body #content p {
      font-size: 1.75em;
      letter-spacing: 0.025em; }
      body #content p.menu {
        text-align: center; }
        body #content p.menu a {
          display: inline-block;
          padding: 0.5rem 1rem;
          color: #ffffff;
          background: #f74e31;
          font-size: 1.5rem;
          text-decoration: none;
          text-transform: uppercase; }
          body #content p.menu a:hover {
            background: #4b4f54; }
    body #content #signup {
      width: 50%;
      text-align: left;
      display: block;
      margin: 40px auto 0; }
      body #content #signup input {
        color: #4b4f54;
        font-family: "Knockout 50 A", "Knockout 50 B", sans-serif;
        display: inline-block;
        float: left;
        height: 40px;
        border: none;
        border-radius: 0; }
        body #content #signup input[type="email"] {
          font-size: 1.125em;
          letter-spacing: 0.02em;
          margin: 0 0 20px;
          padding: 0 12px;
          width: 75%; }
          body #content #signup input[type="email"]:focus {
            outline: none; }
        body #content #signup input[type="submit"] {
          font-size: 1.25em;
          width: 25%;
          padding: 0;
          background-color: #ffb81c;
          outline: none !important;
          -webkit-appearance: none;
          -webkit-transition: background-color 300ms;
          -moz-transition: background-color 300ms;
          -ms-transition: background-color 300ms;
          -o-transition: background-color 300ms;
          transition: background-color 300ms; }
          body #content #signup input[type="submit"]:hover, body #content #signup input[type="submit"]:focus {
            color: #fff;
            background-color: #ef4837;
            -webkit-transition: color 300ms;
            -moz-transition: color 300ms;
            -ms-transition: color 300ms;
            -o-transition: color 300ms;
            transition: color 300ms;
            -webkit-transition: background-color 300ms;
            -moz-transition: background-color 300ms;
            -ms-transition: background-color 300ms;
            -o-transition: background-color 300ms;
            transition: background-color 300ms;
            cursor: pointer; }
      body #content #signup p {
        clear: both;
        font-size: 1em;
        letter-spacing: 0.01em;
        line-height: 1.2; }
    body #content #social {
      text-align: center;
      margin: 40px 0 0; }
      body #content #social a {
        display: inline-block;
        width: 32px;
        height: 26px;
        margin: 0 10px;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 32px 26px;
        opacity: 0.8; }
        body #content #social a:hover, body #content #social a:focus {
          opacity: 1; }
        body #content #social a.facebook {
          background-image: url("images/social-fb.png"); }
        body #content #social a.twitter {
          background-image: url("images/social-tw.png"); }
        body #content #social a.instagram {
          background-image: url("images/social-ig.png"); }
  body a {
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -ms-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
    outline: none !important; }
    body a:hover, body a:focus {
      -webkit-transition: all 300ms;
      -moz-transition: all 300ms;
      -ms-transition: all 300ms;
      -o-transition: all 300ms;
      transition: all 300ms; }

.show-for-phone {
  display: none; }

@media (max-width: 640px) {
  body #content {
    padding: 50px 20px 40px; }
    body #content #logo {
      width: 175px; }
    body #content h1 {
      font-size: 2em; }
    body #content p {
      font-size: 1.25em; }
    body #content #signup {
      width: 75%;
      margin-top: 40px; }

  body #content p.menu {
    margin-top: 2rem; } }
@media (max-width: 480px) {
  body #content #signup {
    width: 100%; }
    body #content #signup input[type="email"] {
      width: 70%; }
    body #content #signup input[type="submit"] {
      width: 30%; } }
@media (max-width: 400px) {
  body #content p {
    font-size: 1.25em;
    line-height: 0.8; }

  span.show-for-phone {
    display: inline; }

  .hide-for-phone {
    display: none; } }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body #content #social a.facebook {
    background-image: url("images/social-fb@2x.png"); }
  body #content #social a.twitter {
    background-image: url("images/social-tw@2x.png"); }
  body #content #social a.instagram {
    background-image: url("images/social-ig@2x.png"); } }

/*# sourceMappingURL=styles.css.map */