/* C to the S to the S */
@font-face {
  font-family: "fa";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/fontawesome/fa-regular-400.eot");
  src: url("../fonts/fontawesome/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../fonts/fontawesome/fa-regular-400.woff2") format("woff2"), url("../fonts/fontawesome/fa-regular-400.woff") format("woff"), url("../fonts/fontawesome/fa-regular-400.ttf") format("truetype"), url("../fonts/fontawesome/fa-regular-400.svg#fontawesome") format("svg"); }
.far {
  font-family: "fa";
  font-weight: 400; }

* {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased; }

body {
  background: #f9f9f9 url("../images/ian-pirie-background.jpg") no-repeat;
  background-size: auto;
  color: #fff;
  font: 15px/24px "Open Sans", sans-serif;
  font-weight: 600;
  letter-spacing: -0.01em; }

h1 {
  font-family: "Archivo Black", sans-serif;
  font-weight: normal;
  line-height: 1.5em; }

ul.content {
  list-style: none;
  position: absolute;
  left: 130px;
  top: 300px;
  width: 500px;
  margin-top: -62px; }
ul li {
  padding: 10px 0; }

#first-line {
  font-size: 22px; }

a {
  text-decoration: none;
  font-weight: 800;
  background: none;
  color: #92c0f1; }
  a:hover {
    background: #77b1ef;
    color: #fff; }

.typing {
  position: relative;
  display: inline-block;
  width: 8px;
  text-indent: -999em;
  background: #ccc;
  -webkit-animation: flick 1s infinite;
  -moz-animation: flick 1s infinite;
  -ms-animation: flick 1s infinite;
  -o-animation: flick 1s infinite;
  animation: flick 1s infinite; }

.arrow {
  background: url("arrow.png") no-repeat;
  width: 235px;
  height: 110px;
  top: 40%;
  margin-top: 195px;
  position: absolute;
  left: -108px;
  -webkit-animation: arrow 35s 1;
  -moz-animation: arrow 35s 1;
  -ms-animation: arrow 35s 1;
  -o-animation: arrow 35s 1;
  animation: arrow 35s 1; }

.social-links {
  position: absolute;
  left: 130px;
  margin-top: 20px;
  top: 170px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 20px; }
  .social-links li {
    display: inline-block;
    margin-right: 15px; }
    .social-links li a {
      display: inline-block;
      overflow: hidden;
      text-decoration: none;
      border: 0;
      font-size: 25px; }
      .social-links li a:hover {
        background: none; }
      .social-links li a .envision-logo {
        background: url("../images/icon-envision.png");
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: 0 -26px;
        text-indent: -9999px;
        display: inline-block;
        width: 27px; }
        .social-links li a .envision-logo:hover {
          background-position: 0 0; }
      .social-links li a.twitter {
        background-position: -55px 0;
        width: 20px; }
        .social-links li a.twitter:hover {
          background-position: -55px -30px; }
      .social-links li a.facebook {
        background-position: -79px 0;
        width: 14px; }
        .social-links li a.facebook:hover {
          background-position: -79px -30px; }
      .social-links li a.linkedin {
        background-position: -28px 0;
        width: 20px; }
        .social-links li a.linkedin:hover {
          background-position: -28px -30px; }
      .social-links li a.soundcloud {
        background-position: -98px 0;
        width: 21px; }
        .social-links li a.soundcloud:hover {
          background-position: -98px -30px; }
      .social-links li a.mixcloud {
        background-position: -120px 0;
        width: 31px; }
        .social-links li a.mixcloud:hover {
          background-position: -120px -30px; }

/*.dollar:before {
 *    content: '$';
 *    padding-right: 20px;
 *    
 *    color: #50657b;
 *} */
@media (max-width: 550px) {
  body {
    font-size: 15px;
    min-height: 530px; }
    body #first-line {
      padding-bottom: 0; }
    body h1 {
      font-size: 30px; }

  ul.content {
    width: 80%;
    top: 150px;
    left: 10%;
    right: 10%;
    min-width: 290px; }

  div.social-links {
    top: 20px;
    margin-top: 0px;
    left: 10%;
    width: 80%; }
    div.social-links ul {
      width: auto;
      left: 10%; }

  li.facebook-like {
    display: none; }

  .arrow {
    display: none !important; } }

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