@charset "UTF-8";
@font-face {
  font-family: 'segoepr';
  src: url("../fonts/segoepr.eot");
  src: local("☺"), url("../fonts/segoepr.woff") format("woff"), url("../fonts/segoepr.ttf") format("truetype"), url("../fonts/segoepr.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'segoeprb';
  src: url("../fonts/segoeprb.eot");
  src: local("☺"), url("../fonts/segoeprb.woff") format("woff"), url("../fonts/segoeprb.ttf") format("truetype"), url("../fonts/segoeprb.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
html {
  overflow: hidden; }

body {
  font-family: 'Lato', sans-serif !important;
  font-size: 14px;
  font-weight: 500;
  line-height: 100%;
  overflow-y: hidden; }

#splash {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  background: #66d9d9;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  transition-delay: .5s;
  -webkit-transition-delay: .5s;
  opacity: 0;
  z-index: 999999; }
  #splash h1 {
    font-family: 'segoepr'; }
  #splash .strips {
    position: absolute;
    width: 100%;
    height: 150%;
    overflow: hidden;
    transform: skewY(30deg);
    transform-origin: 34%; }
    #splash .strips span {
      display: block;
      position: absolute;
      -webkit-transition: all .5s ease-in-out;
      -moz-transition: all .5s ease-in-out;
      -o-transition: all .5s ease-in-out;
      transition: all .5s ease-in-out; }
      #splash .strips span.strip1 {
        height: 33%;
        width: 100%;
        background-color: #66dad9; }
      #splash .strips span.strip2 {
        top: 120%;
        height: 53%;
        width: 100%;
        background-color: #62c6c5; }
      #splash .strips span.strip3 {
        height: 0;
        width: 100%;
        bottom: 0;
        background-color: #57adac; }
  #splash.loading {
    display: block;
    opacity: 1; }
    #splash.loading .strips {
      position: absolute;
      width: 100%;
      height: 150%;
      overflow: hidden;
      transform: skewY(30deg);
      transform-origin: 34%; }
      #splash.loading .strips span {
        display: block;
        position: absolute; }
        #splash.loading .strips span.strip1 {
          height: 33%;
          width: 100%;
          background-color: #66dad9; }
        #splash.loading .strips span.strip2 {
          top: 0%;
          height: 53%;
          width: 100%;
          background-color: #62c6c5; }
        #splash.loading .strips span.strip3 {
          height: 53%;
          width: 100%;
          bottom: 0;
          background-color: #57adac; }
  #splash .jumbotron {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 40px;
    color: #fff;
    background: none; }
    #splash .jumbotron p {
      font-size: 36px; }
    #splash .jumbotron hr {
      border-color: #fff;
      border-width: 3px; }

#main-view #preloader {
  opacity: 1;
  transform: scaleX(0);
  transform-origin: left center 0px;
  transition: transform 2000ms linear;
  width: 100%;
  will-change: transform, opacity;
  height: 3px;
  background-color: #5aadab;
  position: absolute;
  z-index: 9; }
  #main-view #preloader.loaded {
    transform: scaleX(1); }
#main-view #map {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #a3ccff; }
#main-view #side-panel {
  height: 100%;
  background: url("../images/panel-bg.svg");
  background-size: cover;
  background-position: 87px 64px;
  background-repeat: no-repeat;
  position: absolute;
  right: 0;
  padding-right: 0;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition-delay: .5s;
  -webkit-transition-delay: .5s;
  right: -300px; }
  #main-view #side-panel.show {
    right: 0; }
  #main-view #side-panel .panel-header {
    background: url("../images/panel-header.svg");
    color: #fff;
    padding: 20px;
    font-size: 28px;
    text-align: right;
    font-family: 'segoepr'; }
  #main-view #side-panel .tweet-list {
    font-size: 13px;
    text-align: left;
    margin-left: 70px; }
    #main-view #side-panel .tweet-list .media {
      cursor: pointer; }
      #main-view #side-panel .tweet-list .media.selected {
        padding-top: 20px;
        padding-bottom: 20px; }
  #main-view #side-panel .list-group {
    box-shadow: none; }
#main-view .media {
  text-align: left;
  background: #fff;
  padding: 10px;
  margin-bottom: 10px;
  box-shadow: 2px 2px 5px 0px rgba(140, 138, 134, 0.5);
  -webkit-box-shadow: 2px 2px 5px 0px rgba(140, 138, 134, 0.5);
  border-top: 5px solid transparent;
  opacity: .8;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out; }
  #main-view .media.selected {
    opacity: 1; }
  #main-view .media time {
    color: #66757f;
    padding-bottom: 10px;
    display: block;
    font-size: 10px; }
  #main-view .media .media-left {
    position: relative; }
  #main-view .media .tweet-indicator {
    position: absolute;
    top: 0;
    left: 40px; }
  #main-view .media .media-heading {
    color: #14171a;
    font-size: 14px;
    font-weight: bold; }
    #main-view .media .media-heading a {
      color: #383737; }
    #main-view .media .media-heading .handle {
      color: #66757f;
      font-weight: normal; }
  #main-view .media p {
    font-size: 12px;
    color: #666; }
#main-view #full-feed {
  position: absolute;
  width: 100%;
  height: 100vh;
  bottom: calc(-100vh + 50px);
  min-height: calc(-100vh);
  text-align: center;
  -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  z-index: 999998; }
  #main-view #full-feed .full-list-holder {
    background: #efefef;
    width: 100%;
    height: calc(100vh - 78px);
    display: block;
    margin-top: 12px;
    padding: 20px;
    border-top: 5px solid #5aadab;
    overflow: auto; }
    #main-view #full-feed .full-list-holder .render-holder {
      min-height: 150px; }
  #main-view #full-feed .show-all-btn {
    background: #c76796;
    border: none;
    box-shadow: none;
    padding: 10px 20px 10px 20px;
    text-shadow: none; }
  #main-view #full-feed .media {
    margin-bottom: 20px;
    padding-top: 10px;
    padding-bottom: 10px; }
#main-view #full-feed.open {
  padding-top: 13px;
  bottom: -13px; }
#main-view #instructions {
  background: #1da1f2;
  background: url(../images/info-panel.svg);
  color: #fff;
  position: absolute;
  bottom: 100px;
  padding: 20px;
  padding-bottom: 40px;
  background-size: cover;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition-delay: .5s;
  -webkit-transition-delay: .5s;
  left: -300px; }
  #main-view #instructions.show {
    left: 0px; }
  #main-view #instructions p {
    text-align: left;
    font-size: 18px;
    font-weight: 300; }

@media screen and (max-width: 768px) {
  #main-view #map {
    display: none; }
  #main-view #side-panel {
    width: 100%; }
    #main-view #side-panel .panel-header {
      padding-top: 12px;
      padding-bottom: 12px; }
    #main-view #side-panel .tweet-list-container {
      display: none; }
  #main-view #instructions {
    bottom: 40px;
    padding: 10px;
    left: -200%; }
    #main-view #instructions p {
      font-size: 14px; }
    #main-view #instructions button.close {
      margin-left: 10px; }
  #main-view #full-feed {
    top: 46px;
    z-index: auto; }
    #main-view #full-feed .show-all-btn {
      display: none; }
    #main-view #full-feed .full-list-holder {
      height: calc(100vh - 168px);
      height: auto;
      position: fixed;
      top: 45px;
      bottom: 50px; }
      #main-view #full-feed .full-list-holder .render-holder {
        min-height: auto; } }
@media screen and (max-width: 320px) {
  #main-view #side-panel .panel-header {
    font-size: 24px; }
  #main-view #full-feed .full-list-holder {
    /*height: calc(100vh - 188px);*/ } }

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