@font-face {
  font-family: 'norwester';
  src:url('../website-files/fonts/norwester.otf'),
  url('../website-files/fonts/norwester.eot?#iefix') format('embedded-opentype'),
  url('../website-files/fonts/norwester.svg') format('svg'),
  url('../website-files/fonts/norwester.ttf') format('truetype'),
  url('../website-files/fonts/norwester.woff') format('woff'),
  url('../website-files/fonts/norwester.woff2') format('woff2');
}

html, body { height:100%; margin:0; }
body { font-family: 'Roboto', sans-serif; color:#fff; font-size:14px;  }
.banner { background: url('../website-files/images/Banner-Sharknado.jpg') no-repeat center top; background-size: cover; min-height:100%; }
.about { background: url('../website-files/images/About-long.jpg') no-repeat center top; background-size: cover; min-height:100%; padding-bottom: 380px;}
.gallery { background: url('../website-files/images/Gallery.jpg') no-repeat center top; background-size: cover; min-height:100%; }
.media { background: url('../website-files/images/NewYorkStreetEast.jpg') no-repeat center top; background-size: cover; min-height:100%; }
.trailer { background: url('../website-files/images/Trailer.jpg') no-repeat center top; background-size: cover; min-height:100%; }
.contact { background: url('../website-files/images/Contact.jpg') no-repeat center top; background-size: cover; min-height:100%; }
.footer { background: url('../website-files/images/Footer.jpg') no-repeat center top; background-size: cover; min-height:121px; }
.parallax {
  position: relative;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
section#hiddenPagesContent {
    background-color: #e7e7e7;
}
section#hiddenPagesContent > div {
    max-width: 980px;
    margin: 0px auto;
    padding: 170px 20px 50px 20px;
}
section#hiddenPagesContent > div * {
    color: #242424;
}
section.footer.parallax {
  opacity: 1;
}
section.footer.parallax p {
  color: #585858;
  text-align: center;
  width: 100%;
}
section.footer.parallax a {
  color: #585858;
  text-decoration: none;
}
section.footer.parallax ul {
  list-style-type: none;
  width: 100%;
  text-align: center;
  padding: 0;
}
section.footer.parallax li {
  display: inline-block;
  margin: 5px 20px;
}
section.footer.parallax ul.social li {
    width: 30px;
    height: 30px;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}
section.footer.parallax ul.social li.tw {
    background-image: url(../img/footer_s_01.png);
}
section.footer.parallax ul.social li.tw:hover {
    background-image: url(../img/footer_s_02.png);
}
section.footer.parallax ul.social li.fb {
    background-image: url(../img/footer_s_03.png);
}
section.footer.parallax ul.social li.fb:hover {
    background-image: url(../img/footer_s_04.png);
}
section.footer.parallax ul.social li.in {
    background-image: url(../img/footer_s_05.png);
}
section.footer.parallax ul.social li.in:hover {
    background-image: url(../img/footer_s_06.png);
}
section.footer.parallax ul.social li.yt {
    background-image: url(../img/footer_s_09.png);
}
section.footer.parallax ul.social li.yt:hover {
    background-image: url(../img/footer_s_10.png);
}
section.footer.parallax ul.social li a {
    width: 30px;
    height: 30px;
    display: inline-block;
}

.btn-circle.btn-lg {
  width: 40px;
  height: 40px;
  padding:7px;
  line-height: 24px;
  border-radius: 20px;
  background-color: #585858;
  margin-top:10px;
  margin-left:5px;
}
.btn-circle.btn-lg:hover {
background-color: #fff;
}
.cd-background-wrapper {
  min-height:670px;
}
.quotes {
  font-family: norwester;
  font-size:1.6em;
  text-shadow: 0px 1px 4px #000;
  position:relative;
}
.quotes:before {
  content:"“";
  position: absolute;
  left:0;
  top:0;
  font-size:3em;
}
.quotes:after {
  content:"”";
  position: absolute;
  right:0;
  top:0;
  font-size:3em;
}
.quotes:nth-child(2):before {
  left:50px;
}
.quotes:nth-child(2):after {
  right:50px;
}
 .headings-lines {
   position:relative;
 }
 .headings-lines:before {
   content: "";
   position: absolute;
  top: 21px;
  display: block;
  height: 3px;
  background: #fff;
  z-index: 1;
  right:calc(50% - -140px);
  left:0;
 }
 .headings-lines:after {
   content: "";
   position: absolute;
  top: 21px;
  display: block;
  height: 3px;
  background: #fff;
  z-index: 1;
  left:calc(50% - -140px);
  right:0;
 }

.quotes .signature {
  font-size:0.7em;
}
#pos-bottom-grad {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+60&0+0,0.9+34 */
  background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.9) 34%, rgba(0,0,0,0.9) 60%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 34%,rgba(0,0,0,0.9) 60%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.9) 34%,rgba(0,0,0,0.9) 60%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */
}
.btn-circle.btn-lg i { color:#0b0b0b; font-size:24px; }

/* Privacy Policy */
.hockeyvrPrivacyPolicy h2{margin-bottom: 20px; margin-top: 0px;}
.hockeyvrPrivacyPolicy ol {list-style-type: none;counter-reset: item;margin: 0;padding: 0;}
.hockeyvrPrivacyPolicy ol ol {margin-top: 20px;}
.hockeyvrPrivacyPolicy ol.firstLevel{padding:0px 10px 0px 10px}
.hockeyvrPrivacyPolicy ol > li {display: table;counter-increment: item;margin-bottom: 0.6em;}
.hockeyvrPrivacyPolicy ol > li:before {content: counters(item, ".") ". ";display: table-cell;padding-right: 0.6em;    }
.hockeyvrPrivacyPolicy li ol > li {margin: 0;}
.hockeyvrPrivacyPolicy li ol > li:before {content: counters(item, ".") " ";}
.hockeyvrPrivacyPolicy ol, .hockeyvrPrivacyPolicy ol li, .hockeyvrPrivacyPolicy ul li {
    padding-left: 10px;
    padding-bottom: 10px;
}
#privacy-policy .modal-content{background-color: #fff !important;}

@media (min-width: 992px)
{
  .modal-lg {
      width: 900px;
  }
}

@media only screen and (max-device-width: 1024px) {
    .parallax {
        background-attachment: scroll;
    }
}
h1 { font-family: Impact, Charcoal, sans-serif; font-size:90px; }
a { cursor: pointer; }
.cursor-pointer { cursor: pointer; }
a.text-orange,
a.text-orange:link,
a.text-orange:visited,
a.text-orange:hover,
a.text-orange:active {
  color:#ce8d04;
}
.navbar-toggler {
  position: absolute;
  top:10px;
  right:10px;
  background: #000;
  z-index:100;
  cursor: pointer;
  border:1px solid #999;
}
.navbar-toggler-icon {
  background:url(../website-files/images/menu-rings.svg) no-repeat;
  background-position: 50% 50%;
}
#mobile-menu {

  background:
  linear-gradient(
      rgba(0, 0, 0, 0.0),
      rgba(0, 0, 0, 1.0)
    ),

  url('../website-files/images/About-long.jpg') no-repeat 50% 87%;
  background-size:cover;
}
.round-button {
  width:40px;
  margin:0 auto;
  display: inline-block;
}
.round-button-circle {
  width: 100%;
  height:0;
  padding-bottom: 100%;
  border-radius: 50%;
  border:1px solid #fff;
  overflow:hidden;
}
.round-button-circle:hover {
}
.round-button a {
  display:block;
  float:left;
  width:100%;
  padding-top:50%;
  padding-bottom:50%;
  line-height:1em;
  margin-top:-0.5em;

  text-align:center;
  font-size:20px;
  font-weight:300;
  text-decoration:none;
}

#header-menu a {
  font-size:1.2rem;
  text-transform: uppercase;
  font-weight: 900;
  background: -webkit-linear-gradient(#fff, #6391aa);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#header-menu a:hover {
  color:#fff;
  background:transparent;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #fff;
}

#oculus-vive-cont {
  position:fixed;
  width: 100%;
  text-align: right;
  margin-top:100px;
  z-index: 2000;
}

#oculus-logo {
  max-width: 100px;
  margin-right:20px;
}

#vive-logo {
  max-width: 100px;
  margin-right:20px;
}

#header-menu-2 {
  display:flex;
  justify-content: space-around;
  -webkit-flex-flow: row wrap;
}

#header-menu-2 a {
  color:#fff;
  text-transform:uppercase;
  font-weight: 900;
  font-size:1.2rem;
  text-align: center;
}

#logo-src {
  max-width:415px;
  position: fixed;
  top:20px;
  left:20px;
}

video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  transform: translateX(-50%) translateY(-50%);
  background: url('website-files/video/sharknado-video-background.jpg') no-repeat;
  background-size: cover;
  transition: 1s opacity;
}

.download-buttons-row {
  max-width: 520px;
  margin:0 auto;
}

.download-buttons-row .col-md {
  padding-left:5px;
  padding-right:5px;
}

.download-buttons {
  width:100%;
  max-width:200px;
  display: inline-block;
  background: rgba(0,0,0,0.5);
  padding:2px 0;
  border-radius:4px;
  margin-bottom:10px;
  min-height: 30px;
}

.download-icons {
  max-width:26px;
}

.steam-logo {
  max-width: 77px;
}

.ios-logo {
  max-width: 53px;
}

.vrx-logo {
  max-width: 120px;
}

.google-play-logo {
  max-width: 100px;
}

.playstation-vr-logo {
  max-width: 100px;
}

#banner-wrapper h1 {
  font-family: norwester;
  font-size:2.5rem;
  text-shadow: 0px 2px 20px #000;
  margin-bottom:12px;
}

#banner-wrapper h4 {
  margin-bottom:30px;
  font-family:norwester;
  text-shadow: 0px 2px 20px #000;
}

#banner-wrapper h2 {
  font-family:norwester;
  text-shadow: 0px 1px 6px #000;
  font-size:2.3rem;
}

#arcade-edition:after {
  content:"(location based)";
  display:block;
  font-size:0.5em;
}

#full-version:after {
  content:"(downloadable)";
  display:block;
  font-size:0.5em;
}

#steam-button:before {
  content:"Available Now";
  font-size:0.8em;
  font-weight: bold;
}

#oculus-button:before {
  content:"Available Now";
  font-size:0.8em;
  font-weight: bold;
}

#playstation-button:before {
  content:"Available Dec";
  font-size:0.8em;
  font-weight: bold;
}

.carousel-indicators {
  bottom:-40px;
}

.carousel-indicators li {
  width:60%;
  max-width:300px;
  margin-left:15px;
  margin-right:15px;
}

.carousel-indicators li.active img {
  border:1px solid red;
}

.header-left-area {
  background:rgba(73,57,57,0.95);
  font-size:1.3rem;
}

.header-left-area:before {
  content: '';
  position: absolute;
  right:0;
  bottom:99.7%;
  display: block;
  width: 100%;
  padding-bottom: 14%;
  left: 0;
  transform: skew(83deg);
  transform-origin: bottom right;
  background:rgba(73,57,57,0.95);
}

.header-right-area {
  background:rgba(70,96,110,0.95);
  font-size:1.3rem;
}

.header-right-area:before {
  content: '';
  position: absolute;
  right:0;
  bottom:99.7%;
  display: block;
  width: 100%;
  padding-bottom: 14%;
  left: 0;
  transform: skew(97deg);
  transform-origin: bottom right;
  background:rgba(70,96,110,0.95);
}

#steam-logo-header {
  position: relative;
}
/*
#steam-logo-header:before {
  position:absolute;
  content:"-30% until Jan 2";
  background: #4C6B22;
  color:#A4D007;
  top: -180%;
  right:7px;
  font-size:1em;
  line-height:17px;
  padding:0 3px;
  border-radius:3px;
}
*/
.text-dark { color:#242424; }
.header { position:fixed; width:100%; background:rgba(0,0,0,0.6);  z-index:1000 }
.header.on-scroll { background:#000; opacity:0.8; }
.no-underline { text-decoration: none !important; }
.list-inline-item { margin-left:5px !important; margin-right:5px !important; text-align: center;}
.list-inline-item a { color:#fff; }
.list-inline-item a:hover { text-decoration: none; color:#ce8d04 }
.font-roboto { font-family: 'Roboto', sans-serif; color:#fff; }
.font-impact { font-family: Impact, Charcoal, sans-serif; }
.text-orange { color:#ce8d04; }
.text-lg { font-size:24px; }
.text-xlg { font-size:30px; }
.text-uppercase { text-transform: uppercase; }
.btn { border-radius: 18px; }
.btn-primary { background-color: #dc9400 !important; border-color: transparent; }
.padding-top-30 { padding-top:30px !important; }
.padding-top-5 { padding-top:5px !important; }
.no-padding { padding:0; }
.no-margin { margin:0; }
.margin-5 { margin:5px; }
.margin-bottom-15 { margin-bottom:30px; } /* ?? lol */
.margin-bottom-10 { margin-bottom:10px !important; }
.margin-top-10 { margin-top:10px !important; }
.margin-top-20 { margin-top:20px !important; }

.padding-left-20 { padding-left:20px; }
.padding-right-20 { padding-right:20px; }
.padding-sm { padding:20px; }
.padding-md { padding:40px !important; }
.padding-lg { padding:80px; }
.no-padding-top { padding-top:0 !important; }
.no-padding-bottom { padding-bottom:0 !important; }
.position-bottom { position: absolute; bottom: 0 !important; width:100%; transform:none !important; -webkit-transform:none !important;  }
.position-bottom-wide { position: absolute; bottom: 0; }
.media-col .position-bottom { width:100%; left:0; background: rgba(0, 0, 0, 0.75); padding: 15px; }
.position-relative { position: relative;}
.spacer { width:40px; border-bottom: solid 2px #fff; margin:20px 0 20px 0;  }
.spacer.dark { width:40px; border-bottom: solid 2px #242424; margin:20px 0 0 0;  }
.center { margin: 0 auto;  }
.display-table { display: table; width: 100%; }
.table-cell-center { display: table-cell; vertical-align: middle; }
.gallery-image {
  position:relative;
  height:100%;
  display: inline-block;
}
.gallery-image img {
  width:100%;
  vertical-align:top;
}
.gallery-image:after {
  content:'\A';
  position:absolute;
  width:100%; height:100%;
  top:0; left:0;
  background:rgba(0,0,0,0.6);
  opacity:0;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  opacity:1;
}
.gallery-image:hover:after {
  opacity:0;
}
.modal-body { padding:0; }
.media-text { text-shadow: 1px 1px 2px #000000; }
.media-col { background-size:100% auto; background-position: center center; margin-right:0px; height:300px; border:solid 2px #fff;  }
.form-control {
  background-color: transparent !important;
  border:solid 1px #4b4b4b;
  border-radius: 0;
}
.btn-secondary {
  background-color: #ce8d04;
  opacity: 0.5;
  color:#fff;
  border:none;
  border-radius: 0;
}
.btn-secondary:hover {
  background-color: #ce8d04 !important;
  opacity: 1;
  color:#fff !important;
}

#press-package-cont a {
  display:inline-block;
  text-align: center;
  width:160px;
  margin-bottom:10px;
}

#press-package-cont span.caption_wrap {
    display: inline-block;
    position: relative;
}

#press-package-cont span.caption_txt {
    display: inline-block;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
    color: #ffffff;
    font-weight: 700;
}

.newsContentArea img{height: auto !important; width: 100% !important;}
.newsContentArea a { word-break: break-all;}
.modal-open .modal{overflow-y: scroll;}

@media (max-width: 1110px) {

  #logo-src {
    max-width:280px;
  }
  .header a.pull-left {
    width:28% !important;
  }

}

@media (max-width: 736px) {
  .modal{top:15%;}
  h1 { font-size:50px}
  h2 { font-size:24px; }
  .padding-md { padding:40px; }
  .padding-lg { padding:40px; }
  .footer .text-left {
     text-align: center !important;
     padding:10px !important;
  }
  .footer .text-right {
     text-align: center !important;
     padding:10px !important;
  }
  .trailer { min-height:400px; }
  .media-col { margin:20px !important; }
  .header a { float: none !important; text-align: center !important;}
  .about {
    padding-bottom: 0;
  }
  .media { min-height:676px; }
  .frame ul li {
    width: 210px !important;
    height:280px !important;

  }
  .media-col .position-bottom {
    width:100% !important;
    height:180px !important;
  }
  .footer {
    padding-top:40px !important;
    padding-bottom:40px !important;
  }
  .position-bottom-wide {
    position: relative;
  }
  .position-bottom { width:100%;}
  .footer .pull-right {
    float:none !important;
  }
  .footer {
    margin-top: 0 !important;
  }
  #banner-wrapper h1 {
    font-size:1.7em;
  }
  .header-logos {
    max-width: 24% !important;
  }
  .quotes {
    font-size:1.2em;
  }
  .headings-lines:before, .headings-lines:after {
    top:12px;
  }
}

@media (max-width: 615px) {

  #oculus-vive-cont {
    text-align:left;
    margin-top:150px;
  }

  #oculus-logo {
    margin-left:43px;
  }

  h1.headings-lines {
    margin-bottom:26px;
    margin-top:15px;
  }

}

@media (max-width: 574px) {

  #banner-wrapper h1 {
    font-size:3rem;
  }

  .footer_menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  .footer_menu li {
    margin: 0 5px !important;
    width: auto;
    padding: 0 10px;
    text-align: center;
  }

  .footer_icons li {
    width:26%;
  }

  .footer_icons img {
    max-width:92%;
    margin:12px auto;
  }

  #banner-wrapper h1 {
    font-size:1.7rem;
  }

}


@media (max-width: 390px) {

  #logo-src {
    top:70px;
    left:2%;
    max-width:98%;
  }

  #oculus-vive-cont {
    margin-top:200px;
  }

  .quotes {
    font-size:0.8em;
  }

}

@media screen and (max-width: 390px) and (min-width: 250px) {

  #logo-src {
    top:10px;
    left:10px;
    max-width:65%;
  }

}

  @media (max-width: 490px) {

    #banner-wrapper h1 {
      font-size:1.5rem;
    }

    #banner-wrapper h2 {
      font-size: 1.5rem;
    }

    .header-left-area {
      font-size:1rem;
    }

    .header-right-area {
      font-size:1rem;
    }

    .header-logos {
      max-width:31% !important;
    }

    #steam-logo-header:before {
      font-size:0.65em;
      top:-115%;
      line-height: 12px;
    }

    #banner-wrapper h1 {
      margin-bottom:18px;
    }


  }

@media (min-width: 768px) {
    .header a.pull-left {
        width: 40%;
    }
    .header a.pull-left img {
        max-width: 100%;
    }
    .header .pull-right {
        padding: 22px 20px 30px !important;
    }
    .header .list-inline-item {
        margin-right: 15px !important;
    }
}
@media (min-width: 992px) {

}
@media (max-width: 992px) {
  .quotes:before, .quotes:after {
    display:none;
  }
}
@media (min-width: 1200px) {

}

@media screen and (max-width: 545px) and (max-height: 650px) {

  .cd-background-wrapper {
    height:calc(100vh - -240px) !important;
  }

}

@media screen and (max-width: 390px) and (max-height: 650px) {

  .cd-background-wrapper {
    height:calc(100vh - -200px) !important;
  }

}
