@charset "UTF-8";
body {
  /* Prevent elements from flickering due to CSS Transforms */
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased; }

@font-face {
  font-family: "Bariol Big";
  src: url("/assets/type/bariol_bold-webfont.eot");
  src: local("☺"), url("/assets/type/bariol_bold-webfont.woff") format("woff"), url("/assets/type/bariol_bold-webfont.otf") format("opentype"), url("/assets/type/bariol_bold-webfont.svg#bariol_boldbold") format("svg"); }
@font-face {
  font-family: "Bariol Regular";
  src: url("/assets/type/bariol_regular-webfont.eot");
  src: local("☺"), url("/assets/type/bariol_regular-webfont.woff") format("woff"), url("/assets/type/bariol_regular-webfont.otf") format("opentype"), url("/assets/type/bariol_regular-webfont.svg#bariol_lightlight") format("svg"); }
@font-face {
  font-family: "Bariol Light";
  src: url("/assets/type/bariol_light-webfont.eot");
  src: local("☺"), url("/assets/type/bariol_light-webfont.woff") format("woff"), url("/assets/type/bariol_light-webfont.otf") format("opentype"), url("/assets/type/bariol_light-webfont.svg#bariol_lightlight") format("svg"); }
body {
  font-size: 18px; }

h1, h2, h3, h4, h5, h6, p {
  line-height: 1.45; }

.h1, .h2, .h3 {
  line-height: 1.2; }

h1 {
  font-size: 2em; }

h2 {
  font-size: 1.6em; }

.h1 {
  font-size: 1.8em; }

.h2 {
  font-size: 1.6em; }

/*Navbar styling*/
.navbar {
  background-color: #1b1e38;
  border-radius: 0; }

.icon-bar {
  margin-top: 5px;
  background-color: #ff4a6b; }

.navbar-brand a {
  padding-top: 0px !important; }
.navbar-brand img {
  padding-top: 10px !important; }

.navbtn {
  background-color: #1b1e38;
  border-color: #77FEED;
  border-width: 1px;
  border-radius: 5px;
  font-size: 1em;
  height: 35px;
  width: 140px;
  text-align: center;
  margin-top: -10px;
  padding-bottom: 30px;
  margin-right: 20px !important; }
  .navbtn a {
    color: #fc4c6d; }

.navbtn:hover {
  border-color: #fc4c6d; }
  .navbtn:hover a {
    color: #77FEED !important; }

.navbar-custom {
  font-family: "Bariol Big";
  font-size: 1em;
  margin-bottom: 0px;
  border-radius: 0; }
  .navbar-custom a {
    text-decoration: none;
    margin-right: 10px;
    padding-top: 0px !important;
    margin-bottom: 0px; }
  .navbar-custom li {
    margin-top: 10px; }
  .navbar-custom #preorder {
    color: #ff4a6b !important;
    font-family: "Bariol Big" !important; }
  .navbar-custom #preorder:hover {
    color: #d23f59 !important; }
  .navbar-custom a:hover {
    background-color: transparent !important; }
  .navbar-custom .twitter-follow-button {
    margin-top: -5px;
    margin-right: 15px;
    margin-left: 15px; }

#active {
  color: #fff !important;
  /*text-decoration: underline;*/ }

.hoverfix:hover {
  color: white !important; }

.bottom-large-spacer {
  padding-bottom: 60px; }

.bottom-xlarge-spacer {
  padding-bottom: 120px; }

.bottom-med-spacer {
  padding-bottom: 40px; }

.bottom-small-spacer {
  padding-bottom: 20px; }

.bottom-xsmall-spacer {
  padding-bottom: 10px; }

.top-small-spacer {
  padding-top: 20px; }

.top-xsmall-spacer {
  padding-top: 10px; }

.top-med-spacer {
  padding-top: 40px; }

.top-xlarge-spacer {
  padding-top: 120px; }

.top-large-spacer {
  padding-top: 60px; }

.left-xsmall-spacer {
  padding-left: 10px; }

.left-small-spacer {
  padding-left: 20px; }

.left-med-spacer {
  padding-left: 40px; }

.left-large-spacer {
  padding-left: 60px; }

.right-xsmall-spacer {
  padding-right: 10px; }

.right-small-spacer {
  padding-right: 20px; }

.right-med-spacer {
  padding-right: 40px; }

.right-large-spacer {
  padding-right: 60px; }

body {
  font-family: "Bariol Regular"; }

a {
  color: #FFF;
  text-decoration: underline; }

.video {
  color: white;
  font-family: "Bariol Big", Sans-Serif !important;
  height: 600px; }
  .video #background {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover; }

strong {
  font-family: "Bariol Big", Sans-Serif; }

.alert {
  font-family: "Bariol Big";
  background-color: #f6f16c;
  color: #6e0ea7;
  border-radius: 0px;
  margin-bottom: 0px;
  border: 0px; }
  .alert a {
    color: #f60e4c;
    text-decoration: underline; }

.h1 {
  font-family: "Bariol Big", Sans-Serif;
  font-weight: 500; }

.h2 {
  font-family: "Bariol Regular", Sans-Serif;
  font-weight: 500; }

.h3 {
  font-family: "Bariol Regular", Sans-Serif; }

#one {
  color: #fc4c6d; }

#two {
  color: #27dffd; }

#three {
  color: #2add74; }

#four {
  color: #AE98C9; }

#five {
  color: #ffee5f; }

.bgvideo {
  height: 500px;
  background-image: url("/assets/images/may2015/secondSection.png");
  background-size: cover; }

.vert-center {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%); }

.papertoys {
  background-image: url("/assets/images/may2016/patterngrid.png");
  background-size: 25px;
  color: #4e5092; }
  .papertoys .h3 {
    font-family: "Bariol Big", Sans-Serif;
    color: #4e5092; }
  .papertoys a {
    color: #ff2b64;
    text-decoration: underline; }

@media (max-width: 979px) {
  .header {
    background-image: url("/assets/images/release/particle-bg.png") !important;
    height: auto !important; }
    .header img {
      padding-top: 20px !important; }
    .header .trailerbutt {
      margin-left: -10px !important;
      width: 200px !important; }
    .header .pre-order-btn {
      width: 200px !important;
      margin-left: -10px !important; }
    .header .info {
      height: auto !important; } }
.pre2-btn {
  background: #FF5E4D;
  color: white;
  border-color: #C93D5F;
  border-width: 3px;
  border-radius: 10px;
  font-family: "Bariol Regular", Sans-Serif;
  /* Watch the trailer: */
  letter-spacing: 0px;
  font-size: 1em; }

.header {
  background: url("/assets/images/release/gnog-particles.png");
  background-position: center, center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #FFF;
  color: white; }
  .header img {
    padding-top: 20px; }
  .header p {
    line-height: 1em;
    font-size: 2.5em;
    color: #FB275E; }
  .header iframe {
    border-width: 5px !important;
    border-radius: 10px !important;
    border-color: #FB275E !important;
    border-style: solid !important; }
  .header .buy-buttons img {
    margin-right: 10px;
    margin-left: 10px; }
  .header .ps4-preorder {
    font-size: 1.5em !important;
    font-family: "Bariol Regular", Sans-Serif; }
  .header a {
    color: #4e4e95;
    text-decoration: underline;
    font-family: "Bariol Big"; }
  .header #EU {
    font-size: .8em; }

.sub-header {
  background-color: #071126;
  background-image: url("/assets/images/release/boxbg.png");
  background-size: cover;
  background-position: center center;
  color: #a4f1fc; }
  .sub-header .h2 {
    color: #a4f1fc;
    font-size: 2.5em; }
  .sub-header .quote {
    font-family: "Bariol Regular", Sans-Serif;
    color: #caa6fc; }
    .sub-header .quote em {
      color: #a4f1fc; }
    .sub-header .quote #press {
      color: #ddeb9f; }
    .sub-header .quote #and {
      color: #caa6fc; }
    .sub-header .quote strong {
      color: #caa6fc; }

.psvr {
  background-image: url("/assets/images/release/nickvr.jpg");
  background-size: cover;
  color: white;
  font-family: "Bariol Regular", Sans-Serif; }
  .psvr p {
    line-height: 1.2em;
    font-size: 1.2em; }
  .psvr .h2 {
    font-size: 2.5em; }
  .psvr .quote {
    color: #58daff; }

.intro {
  background-image: url("/assets/images/release/synthbg.png");
  background-size: cover;
  background-position: top;
  background-color: #39135a;
  color: #a4f1fc; }
  .intro p {
    line-height: 1em; }
  .intro .h2 {
    font-size: 2.5em; }
    .intro .h2 span:nth-child(1) {
      color: #caa6fc; }
    .intro .h2 span:nth-child(2) {
      color: #a4f1fc; }
    .intro .h2 span:nth-child(3) {
      color: #ddeb9f; }
  .intro .bullet p {
    font-size: 1.1em; }
  .intro .bullet p:nth-child(1) {
    color: #ddeb9f; }
  .intro .bullet p:nth-child(2) {
    color: #caa6fc; }
  .intro .bullet p:nth-child(3) {
    color: #caa6fc; }
  .intro .bullet p:nth-child(4) {
    color: #ddeb9f; }
  .intro .bullet p:nth-child(5) {
    color: #a4f1fc; }
  .intro .bullet p:nth-child(6) {
    color: #ddeb9f; }
  .intro .bullet p:nth-child(7) {
    color: #ddeb9f; }
  .intro .bullet p:nth-child(8) {
    color: #ddeb9f; }
  .intro .bullet p:nth-child(9) {
    color: #caa6fc; }

.unique {
  background-color: #fff;
  color: #916cff; }
  .unique .h2 {
    font-size: 2.5em; }

.synth-section {
  background-image: url("/assets/images/release/synth-section2.png");
  background-color: #e1e1e1;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  color: #926eff; }
  .synth-section p {
    line-height: 1em; }
  .synth-section .h2 {
    font-size: 2.5em; }
  .synth-section .synth-btn {
    background: #e1e1e1;
    border-color: #ff415a;
    color: #ff415a;
    border-width: 3px;
    border-radius: 10px;
    width: 260px;
    height: 70px;
    font-family: "Bariol Regular", Sans-Serif;
    margin-right: 10px;
    /* Watch the trailer: */
    font-size: 1.5em;
    letter-spacing: 0px; }
  .synth-section .synth-btn:active {
    -moz-box-shadow: inset 0 0 0px white;
    -webkit-box-shadow: inset 0 0 0px white;
    box-shadow: inset 0 0 0px white; }
  .synth-section .synth-btn:hover {
    color: #ff415a; }
  .synth-section .synth-btn:focus {
    outline: none; }

.sub-section {
  background-image: url("/assets/images/release/sub-section.png");
  background-size: cover;
  background-position: center;
  background-color: #131f38;
  color: #ff9063; }
  .sub-section p {
    line-height: 1em; }
  .sub-section .h2 {
    font-size: 2.5em; }
  .sub-section .sub-btn {
    color: #ff9063;
    background: #131f38;
    border-color: #ff9063;
    border-width: 3px;
    border-radius: 10px;
    width: 260px;
    height: 70px;
    font-family: "Bariol Regular", Sans-Serif;
    margin-right: 10px;
    /* Watch the trailer: */
    font-size: 1.5em;
    letter-spacing: 0px; }
  .sub-section .sub-btn:active {
    -moz-box-shadow: inset 0 0 0px white;
    -webkit-box-shadow: inset 0 0 0px white;
    box-shadow: inset 0 0 0px white; }
  .sub-section .sub-btn:hover {
    color: #ff9063; }
  .sub-section .sub-btn:focus {
    outline: none; }

.space-section {
  background-image: url("/assets/images/release/vrtx-section.png");
  background-size: cover;
  background-position: center;
  background-color: #1bd387;
  color: #293784; }
  .space-section p {
    line-height: 1em; }
  .space-section .h2 {
    font-size: 2.5em; }
  .space-section .space-btn {
    color: #293784;
    background: #1bd387;
    border-color: #293784;
    border-width: 3px;
    border-radius: 10px;
    width: 260px;
    height: 70px;
    font-family: "Bariol Regular", Sans-Serif;
    margin-right: 10px;
    /* Watch the trailer: */
    font-size: 1.5em;
    letter-spacing: 0px; }
  .space-section .space-btn:active {
    -moz-box-shadow: inset 0 0 0px white;
    -webkit-box-shadow: inset 0 0 0px white;
    box-shadow: inset 0 0 0px white; }
  .space-section .space-btn:hover {
    color: #293784; }
  .space-section .space-btn:focus {
    outline: none; }

.comingSoon {
  font-size: 1.2em;
  color: #ff415a; }
  .comingSoon .h2 {
    font-size: 2.5em; }

.popup-gallery {
  padding-left: 0px !important;
  padding-right: 0px !important; }

.monsters {
  background-color: #FFF;
  background-image: url("/assets/images/may2015/firstSection.png");
  background-size: cover;
  background-position: 50% 50%;
  height: 500px;
  color: #7a37b2; }
  .monsters .h1 {
    font-size: 1.7em; }

.monsters-mobile {
  background-color: #e8e8e8;
  background-image: url("/assets/images/may2015/firstSectionPhone2.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  height: 500px;
  color: #7a37b2; }
  .monsters-mobile .h1 {
    font-size: 1.7em; }

.web {
  color: #fff; }

.screenshots {
  font-size: 1.2em;
  color: #4e4e95;
  background-image: url("/assets/images/release/gnog-particles.png");
  background-size: 70%;
  background-repeat: repeat;
  background-color: white; }
  .screenshots .h2 {
    font-size: 2.5em; }
  .screenshots .h1 {
    color: #FF5E4D; }
  .screenshots a {
    color: #ff415a;
    font-family: "Bariol Big"; }
  .screenshots .pre-btn {
    background: #ad7fff;
    border-color: #52e897;
    border-width: 3px;
    border-radius: 10px;
    margin-top: 15px;
    margin-bottom: 15px;
    width: auto;
    height: 70px;
    font-family: "Bariol Regular", Sans-Serif;
    /* Watch the trailer: */
    font-size: 1.5em;
    color: #FFF;
    letter-spacing: 0px; }
  .screenshots .pre-btn:hover {
    color: #54f998; }

#woodrow .h1 {
  font-family: "Bariol Light", Sans-Serif; }

.info {
  background-color: white;
  background-image: url("/assets/images/release/particle-bg.png"); }
  .info .h1 {
    color: #4e5092;
    font-family: "Bariol Regular", Sans-Serif;
    font-size: 2.2em; }
  .info span {
    font-family: "Bariol Big", Sans-Serif; }
  .info .h3 {
    font-family: "Bariol Regular", Sans-Serif;
    color: #4e5092; }

.textfield {
  width: 96%;
  height: 50px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  outline: 0px;
  border: none;
  font-size: 1.5em;
  font-family: "Bariol Big", Sans-Serif;
  font-weight: 500;
  color: #FFF;
  background-color: #fc4c6d;
  border-color: #FFF;
  margin-right: 25px;
  padding-left: 15px; }

::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #FFF; }

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #FFF; }

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #FFF; }

:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #FFF; }

.gameplay {
  background-color: #fff; }

.blueprint {
  color: #FFF; }

#monsters img {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  -ms-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  -webkit-transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  -ms-transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1); }

#monsters img:hover {
  -webkit-transform: translate3d(0, -20px, 0);
  -moz-transform: translate3d(0, -20px, 0);
  -ms-transform: translate3d(0, -20px, 0); }

/*

#underline {
text-decoration: none; 
background: url(/images/underline.svg) ;
background-repeat: no-repeat;
}

*/
#twitch {
  font-size: .5em; }

.blueprintbig {
  background-color: #141813;
  font-family: "Bariol Light";
  font-size: 2em;
  color: #F1EEDD; }

.blueprintbig a {
  color: #F1EEDD;
  font-family: "Bariol Big";
  text-decoration: underline; }

.blueprintsmall {
  background-color: #141813;
  font-family: "Bariol Light";
  font-size: 3em;
  color: #F1EEDD; }

.blueprintsmall a {
  color: #F1EEDD;
  font-family: "Bariol Big"; }

.blueprintxsmall a {
  color: #F1EEDD;
  font-family: "Bariol Big"; }

.blueprintxsmall {
  background-color: #141813;
  font-family: "Bariol Light";
  font-size: 2em;
  color: #F1EEDD; }

#blueprints {
  height: 370px; }

#blueprints1 {
  height: 370px; }

#blueprints2 {
  height: 370px; }

#woodrow {
  background-image: url(/assets/images/woodrowBackground-1.svg);
  background-position: 50% 00%;
  background-repeat: no-repeat;
  /*	background-attachment: fixed;*/ }

#woodrowmobile {
  background-image: url(/assets/images/woodrowBackground-1.svg);
  background-position: 50% 00%;
  background-repeat: no-repeat; }

.footer {
  background-color: #16182c;
  background-image: url("/assets/images/may2016/gnog-promo-footer.png");
  color: #F1EEDD;
  font-family: "Bariol Big", Sans-Serif;
  font-size: 32px;
  color: #4e5092; }
  .footer .links a {
    text-decoration: underline;
    font-size: .7em;
    margin-right: 20px;
    margin-left: 20px; }

.inline-image {
  display: inline-block; }
  .inline-image img {
    border: 0 none;
    display: inline-block;
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    margin-right: 30px; }

#rotate {
  -webkit-animation-name: rotate;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: rotate;
  -moz-animation-duration: 3s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear; }

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(360deg); }
  to {
    -webkit-transform: rotate(0deg); } }
@-moz-keyframes rotate {
  from {
    -moz-transform: rotate(360deg); }
  to {
    -moz-transform: rotate(0deg); } }
.boxes {
  background-color: #FFF; }

.lead-description {
  background-color: white;
  color: black;
  height: 500px; }

.fullscreen-bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  z-index: -100; }

.fullscreen-bg__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.trailerbutt {
  /* Rectangle 3: */
  /* Rectangle 3: */
  background: #FFF;
  border-color: #52e897;
  border-width: 3px;
  border-radius: 10px;
  margin-top: 15px;
  margin-bottom: 15px;
  width: 220px;
  height: 70px;
  font-family: "Bariol Regular", Sans-Serif;
  margin-right: 10px;
  /* Watch the trailer: */
  font-size: 1.5em;
  color: #ff6783;
  letter-spacing: 0px; }

.trailerbutt:hover {
  color: #ac83fc !important; }

.pre-order-btn {
  /* Rectangle 3: */
  /* Rectangle 3: */
  background: #ad7fff;
  border-color: #52e897;
  border-width: 3px;
  border-radius: 10px;
  margin-top: 15px;
  margin-bottom: 15px;
  width: 220px;
  height: 70px;
  font-family: "Bariol Regular", Sans-Serif;
  /* Watch the trailer: */
  font-size: 1.5em;
  color: #FFF;
  letter-spacing: 0px; }

.pre-order-btn:hover {
  color: #54f998; }

/* Float */
.hvr-float {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out; }

.hvr-float:hover, .hvr-float:focus, .hvr-float:active {
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px); }

#mc_embed_signup .button, .subscribe {
  width: 96%;
  height: 50px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  outline: 0px;
  border: none;
  font-family: "Bariol Big", Sans-Serif;
  font-size: 1.5em;
  font-weight: 500;
  color: #4e5092;
  background-color: #2add74;
  border-color: #FFF;
  margin-right: 25px;
  padding-left: 15px; }

#mc_embed_signup .button:hover, .subscribe:hover {
  background-color: #629077; }

#mc_embed_signup input.email, input[type="text"], textarea {
  width: 96%;
  height: 50px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  outline: 0px;
  border: none;
  font-size: 1.5em;
  font-family: "Bariol Big", Sans-Serif;
  font-weight: 500;
  color: #FFF;
  background-color: #fc4c6d;
  border-color: #FFF;
  margin-right: 25px;
  padding-left: 15px; }