@import url("https://fonts.googleapis.com/css?family=Roboto+Condensed");
body {
  background: #000;
  overflow-x: hidden;
  position: fixed;
  width: 100vw;
  height: 100vh;
  margin: 0; }

a {
  color: #418a41;
  cursor: crosshair;
  font-family: serif; }

p {
  margin-bottom: 3vw;
  line-height: 1.6;
  font-family: serif; }
  @media (orientation: portrait) {
    p {
      margin-bottom: 9vw; } }

h2 {
  margin-top: 5vw;
  text-align: center; }
  @media (orientation: portrait) {
    h2 {
      margin-top: 12vw; } }

h3 {
  text-align: center; }

hr {
  border: none;
  border-bottom: 1px solid;
  margin: 2vw 5vw; }
  @media (orientation: portrait) {
    hr {
      margin: 8vw 12vw; } }

img {
  width: 100%;
  height: auto; }

.noclick {
  pointer-events: none; }

.fixed {
  position: fixed; }

.center {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%); }

.middle {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%); }

.middle.center {
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.full {
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0; }

.mask {
  width: 100vw;
  height: 25vh;
  z-index: 6; }
  .mask#topMask {
    background: -webkit-gradient(linear, left top, left bottom, from(black), to(rgba(0, 0, 0, 0)));
    background: -webkit-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
    background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
    top: 0; }
  .mask#bottomMask {
    background: -webkit-gradient(linear, left bottom, left top, from(black), to(rgba(0, 0, 0, 0)));
    background: -webkit-linear-gradient(bottom, black 0%, rgba(0, 0, 0, 0) 100%);
    background: -o-linear-gradient(bottom, black 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to top, black 0%, rgba(0, 0, 0, 0) 100%);
    bottom: 0; }

#symbolRun {
  z-index: 5;
  width: 20vw;
  mix-blend-mode: multiply; }
  #symbolRun .run {
    position: absolute;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-animation: run 50s linear infinite;
    animation: run 50s linear infinite; }
    #symbolRun .run:nth-child(1) {
      -webkit-animation-delay: -25s;
      animation-delay: -25s; }

@-webkit-keyframes run {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%); }
  100% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%); } }

@keyframes run {
  0% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%); }
  100% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%); } }

#logo {
  z-index: 8;
  width: 66vw;
  mix-blend-mode: difference; }
  @media (orientation: portrait) {
    #logo {
      width: 90vw; } }

#indxSliderPlayer {
  z-index: 4;
  width: 50vw;
  height: 50vh; }
  @media (orientation: portrait) {
    #indxSliderPlayer {
      width: 70vw;
      height: 50vh; } }
  #indxSliderPlayer img {
    cursor: crosshair;
    position: absolute;
    width: auto;
    max-height: 100%;
    -webkit-box-shadow: 0px 3px 52px 0px rgba(97, 197, 97, 0.6);
    box-shadow: 0px 3px 52px 0px rgba(97, 197, 97, 0.6); }
    @media (orientation: portrait) {
      #indxSliderPlayer img {
        max-width: 100%;
        height: auto; } }

#strobeBg {
  -webkit-animation: strobeGreen 50ms infinite;
  animation: strobeGreen 50ms infinite;
  background: #326b32;
  z-index: 20;
  mix-blend-mode: hard-light;
  opacity: 0.2;
  pointer-events: none; }

@-webkit-keyframes strobeGreen {
  50% {
    background: black; } }

@keyframes strobeGreen {
  50% {
    background: black; } }

footer {
  bottom: 0;
  z-index: 10;
  width: 100vw; }

#socialNav {
  text-align: center;
  z-index: 20;
  width: 100vw;
  bottom: 3vh; }
  #socialNav a {
    display: inline-block;
    font-size: 1.2vw;
    padding: 0 1.6vw;
    font-family: "Roboto Condensed", sans-serif; }
    @media (orientation: portrait) {
      #socialNav a {
        font-size: 5vw; } }

.lightbox {
  z-index: 999;
  display: none;
  overflow-y: scroll; }
  .lightbox .bg {
    z-index: -1;
    background: black;
    opacity: 0.8;
    position: fixed;
    cursor: crosshair; }
  .lightbox .txtBox {
    z-index: 2;
    width: 30vw;
    margin: 3vw auto;
    position: relative;
    color: #326b32; }
    @media (orientation: portrait) {
      .lightbox .txtBox {
        width: 80vw;
        margin: 20vw auto; } }
  .lightbox .videoBox {
    height: 70vh; }
    @media (orientation: portrait) {
      .lightbox .videoBox {
        height: auto;
        width: 100vw; } }
  .lightbox video {
    cursor: none;
    margin: 0 auto;
    display: block;
    max-height: 100%; }
    @media (orientation: portrait) {
      .lightbox video {
        max-width: 100%; } }