@font-face {
  font-family: 'Source Sans Pro';
  src: url('../../../fonts/source/sourceSansPro-bold.woff2') format('woff2'), url('../../../fonts/source/sourceSansPro-bold.woff') format('woff'), url('../../../fonts/source/sourceSansPro-bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Source Sans Pro';
  src: url('../../../fonts/source/sourceSansPro-regular.woff2') format('woff2'), url('../../../fonts/source/sourceSansPro-regular.woff') format('woff'), url('../../../fonts/source/sourceSansPro-regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
.hide {
  display: none;
}
.absolute_center {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.transform_center {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}
.unselectable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}
.text_shadow {
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
}
.box_shadow {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}
*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}
html {
  font-size: 62.5%;
}
body {
  font-size: 1.4rem;
  line-height: 1.2em;
  font-family: 'Source sans', sans-serif;
  font-weight: bold;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
  color: #3e2723;
}
label {
  cursor: pointer;
}
div {
  overflow: hidden;
}
main,
header,
nav,
article,
section,
aside,
footer {
  display: block;
}
table {
  border-collapse: collapse;
}
.game_wrap {
  position: relative;
  z-index: 10;
  width: 580px;
  max-width: 100%;
  max-height: 100vh;
  margin: 0 auto;
  overflow: hidden;
}
.ghost_level .game_wrap .game_wrap_inner:before {
  opacity: 1;
  visibility: visible;
}
.game_wrap .game_help_wrap {
  position: absolute;
  width: 100%;
  height: 100%;
}
.game_wrap .game_wrap_inner {
  padding-bottom: 152.58%;
  background: #33691e url('../images/bg.svg') center center no-repeat;
  background-size: cover;
}
.game_wrap .game_wrap_inner:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  background: #311b92 url('../images/bg_purple.svg') center center no-repeat;
  background-size: cover;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 1s;
  transition: all 1s;
}
.intro_wrap {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 20;
}
.intro_wrap .intro_wrap_inner {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 80%;
  margin: auto;
  text-align: center;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.intro_wrap img {
  max-width: 100%;
}
.intro_wrap .intro_stats {
  cursor: pointer;
  width: 38%;
  margin: 10px auto 0;
  padding: 4.5% 0;
  background: #3e2723;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
  font-size: 2.2rem;
  line-height: 1.2em;
  text-transform: uppercase;
  color: #a1887f;
}
.intro_wrap .intro_play {
  display: none;
}
.intro_wrap .intro_adviser {
  position: absolute;
  top: 24%;
  right: 22%;
  width: 16%;
  padding-bottom: 16%;
  background: url('../images/adviser.svg') center center no-repeat;
  background-size: contain;
}
.game_is_loaded .intro_wrap .intro_loading {
  display: none;
}
.game_is_loaded .intro_wrap .intro_play {
  display: block;
}
.game_wrap .intro_wrap {
  -webkit-transform: translate(0);
  transform: translate(0);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.game_wrap .game_help_wrap {
  -webkit-transform: translate(100%);
  transform: translate(100%);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.out_of_intro .intro_wrap {
  -webkit-transform: translate(-100%);
  transform: translate(-100%);
}
.out_of_intro .game_help_wrap {
  -webkit-transform: translate(0);
  transform: translate(0);
}
.timer_wrap {
  position: absolute;
  width: 19%;
  left: 0;
  right: 0;
  margin: auto;
  padding-bottom: 11%;
  background: #795548;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
  text-align: center;
}
.timer_wrap .timer_wrap_inner {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  font-size: 2.6rem;
  line-height: 1.2em;
}
.panel_wrap {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 13%;
  overflow: visible;
  background-color: #795548;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}
.panel_wrap .panel_wrap_inner {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  overflow: visible;
}
.panel_wrap .panel_logo_wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 38%;
  height: 100%;
}
.toggle_adviser .panel_wrap .panel_logo_wrap .panel_logo {
  opacity: 0.2;
}
.toggle_adviser .panel_wrap .panel_logo_wrap .panel_adviser {
  display: block;
}
.panel_wrap .panel_logo_wrap .panel_logo,
.panel_wrap .panel_logo_wrap .panel_adviser {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.panel_wrap .panel_logo_wrap .panel_logo {
  width: 64%;
  padding-bottom: 52%;
  background: url('../images/logo.png') center center no-repeat;
  background-size: contain;
}
.panel_wrap .panel_logo_wrap .panel_adviser {
  display: none;
  width: 32%;
  padding-bottom: 32%;
  background: url('../images/adviser.svg') center center no-repeat;
  background-size: contain;
}
.panel_wrap .panel_heart_wrap {
  position: absolute;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: 100%;
  left: 0;
  right: 0;
  width: 24%;
  height: 40%;
  margin: auto;
  background: #795548;
}
.panel_wrap .panel_heart_wrap .heart_img {
  height: 20px;
  width: 14%;
  background: url('../images/heart.svg') center center no-repeat;
  background-size: 100% auto;
}
.panel_wrap .panel_heart_wrap .heart_score {
  font-size: 2rem;
  line-height: 1.2em;
}
.panel_wrap .panel_heart_wrap .heart_score:before {
  content: "x";
}
.panel_wrap .panel_btns_wrap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 24%;
  height: 100%;
  margin: auto;
  padding: 0 1%;
  background: #a1887f;
  text-align: center;
}
.panel_wrap .panel_btns_wrap > div {
  width: 100%;
  margin: 1% 0;
  background: #3E2723;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
  font-size: 2rem;
  line-height: 2.6em;
  text-transform: uppercase;
  cursor: pointer;
  color: #b79e95;
}
.panel_wrap .panel_btns_wrap .restart_btn,
.panel_wrap .panel_btns_wrap .pause_btn,
.panel_wrap .panel_btns_wrap .unpause_btn {
  display: none;
}
.panel_wrap .panel_specials_wrap {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 38%;
}
.panel_wrap .special_wrap {
  position: relative;
  float: left;
  height: 50%;
  width: 50%;
  background-repeat: no-repeat;
  background-position: center center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
}
.panel_wrap .special_wrap.special_available {
  visibility: visible;
  opacity: 1;
}
.panel_wrap .special_wrap.special_ready .special_time {
  opacity: 0;
  visibility: hidden;
}
.panel_wrap .special_wrap.special_type1 {
  background-color: #c5e1a5;
  background-image: url('../images/special.svg');
  background-size: 82% auto;
}
.panel_wrap .special_wrap.special_type2 {
  background-color: #b39ddb;
  background-image: url('../images/special2.svg');
  background-size: auto 100%;
}
.panel_wrap .special_wrap.special_type3 {
  background-color: #eeeeee;
  background-image: url('../images/special3.svg');
  background-size: auto 75%;
}
.panel_wrap .special_wrap.special_type4 {
  background-color: #ffe082;
  background-image: url('../images/special4.svg');
  background-size: auto 100%;
}
.panel_wrap .special_wrap .special_time {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: inherit;
  font-size: 2rem;
  line-height: 1.2em;
  opacity: 1;
  visibility: visible;
  -webkit-transition: all 0.5s 0.1s;
  transition: all 0.5s 0.1s;
}
.panel_wrap .special_wrap .special_time:after {
  content: "sec";
}
.game_is_running .panel_btns_wrap .restart_btn,
.game_is_running .panel_btns_wrap .pause_btn {
  display: block;
}
.game_is_running .panel_btns_wrap .play_btn {
  display: none;
}
.game_is_paused .panel_btns_wrap .unpause_btn {
  display: block;
}
.game_is_paused .panel_btns_wrap .pause_btn {
  display: none;
}
.msg_wrap {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #795548;
  font-size: 2.2rem;
  line-height: 0.8em;
  opacity: 0;
  visibility: hidden;
  text-transform: uppercase;
}
.show_msg .msg_wrap {
  opacity: 1;
  visibility: visible;
}
.game_area_wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 87%;
}
.badass_wrap {
  position: absolute;
  top: 0;
  left: 0;
  overflow: visible;
  height: 0;
  width: 14%;
  padding-bottom: 12.5%;
}
.badass_wrap .badass_body {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
  overflow: visible;
  cursor: pointer;
  -webkit-filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.15));
  filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.15));
}
.badass_wrap.type1 .badass_body {
  background-image: url('../images/badass1.svg');
}
.badass_wrap.type1.badass_sleepy .badass_body {
  background-image: url('../images/badass1_sleepy.svg');
}
.badass_wrap.type2 .badass_body {
  background-image: url('../images/badass2.svg');
}
.badass_wrap.type3 .badass_body {
  background-image: url('../images/badass3.svg');
}
.badass_wrap.type4 .badass_body {
  background-image: url('../images/badass4.svg');
}
.badass_wrap.typeGhost .badass_body {
  background-image: url('../images/badassGhost.svg');
}
.badass_wrap.typeBoss {
  width: 32%;
  padding-bottom: 28%;
}
.badass_wrap.typeBoss .badass_body {
  background-image: url('../images/badassBoss.svg');
}
.badass_wrap .badass_lives {
  position: absolute;
  bottom: 100%;
  width: 100%;
  pointer-events: none;
  text-align: center;
  font-size: 2.2rem;
  line-height: 0.9em;
  color: #000;
}
.achievements_wrap {
  position: absolute;
  z-index: 110;
  right: 0;
  top: 0;
  overflow: visible;
  width: 250px;
  max-width: 60%;
  height: 100%;
  background: #795548;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
  -webkit-transform: translate(100%);
  transform: translate(100%);
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.open_achievements .achievements_wrap {
  -webkit-transform: translate(0);
  transform: translate(0);
}
.achievements_wrap .achievement_button {
  position: absolute;
  right: 100%;
  top: 14px;
  width: 50px;
  height: 50px;
  background: #3e2723 url('../images/trophy.svg') no-repeat center center;
  cursor: pointer;
}
.achievements_wrap .achievement_button:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  opacity: 0;
  background: #3e2723 url('../images/trophy2.svg') no-repeat center center;
  pointer-events: none;
  -webkit-transform: scale(2);
  transform: scale(2);
  -webkit-transition: all 1s;
  transition: all 1s;
}
.achievements_wrap .achievement_button.achievement_new_available:before {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}
.achievements_wrap .achievements_title {
  padding: 1em 1.75em;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 2rem;
  line-height: 1.2em;
}
.achievements_wrap .achievements_table {
  margin-bottom: 20px;
}
.achievements_wrap .achievement_wrap {
  height: 2.5em;
  background-color: #a1887f;
}
.achievements_wrap .achievement_wrap.achievement_done .achievement_trophy {
  background-image: url('../images/trophy2.svg');
}
.achievements_wrap .achievement_wrap .achievement_trophy {
  float: left;
  height: 100%;
  width: 35px;
  background: #424242 url('../images/trophy.svg') no-repeat center center;
  background-size: auto 68%;
}
.achievements_wrap .achievement_wrap .achievement_desc {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  float: left;
  height: 100%;
  width: calc(100% - 35px);
  padding: 0 10px;
}
.achievements_wrap .achievement_wrap .achievement_label {
  margin-right: 5px;
}
.achievements_wrap .achievement_wrap .achievement_bonus:before {
  content: "(";
}
.achievements_wrap .achievement_wrap .achievement_bonus:after {
  content: ")";
}
.achievements_wrap .kills_wrap {
  background-color: #A1887F;
  margin-bottom: 20px;
  padding: 20px;
  text-align: center;
}
.achievements_wrap .kills_wrap .kill_wrap {
  width: 25%;
  float: left;
}
.achievements_wrap .kills_wrap .kill_img {
  padding-bottom: 88%;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto;
}
.achievements_wrap .kills_wrap .kill_score:before {
  content: "x";
}
.achievements_wrap .kills_wrap .kill_wrap_black .kill_img {
  background-image: url('../images/badass1.svg');
}
.achievements_wrap .kills_wrap .kill_wrap_red .kill_img {
  background-image: url('../images/badass2.svg');
}
.achievements_wrap .kills_wrap .kill_wrap_green .kill_img {
  background-image: url('../images/badass3.svg');
}
.achievements_wrap .kills_wrap .kill_wrap_blue .kill_img {
  background-image: url('../images/badass4.svg');
}
.achievements_wrap .info_wrap {
  text-align: center;
}
.achievements_wrap .info_wrap .info_img {
  border-radius: 50%;
  width: 40%;
  margin: auto;
  padding-bottom: 40%;
  background: #fdfdfd url('../images/me2.svg') center top no-repeat;
  background-size: auto 100%;
  border: 5px solid #3e2723;
  box-sizing: content-box;
}
.achievements_wrap .info_wrap .info_link {
  color: #3e2723;
  font-size: 1.6rem;
  line-height: 1.2em;
  text-decoration: none;
}
.overlay {
  display: none;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.open_achievements .overlay {
  display: block;
  opacity: 1;
  visibility: visible;
}
.preload {
  display: none;
  background-image: url('../images/bg_purple.svg'), url('../images/badass1_sleepy.svg'), url('../images/trophy2.svg'), url('../images/badassBoss.svg'), url('../images/badassGhost.svg');
}
@media all and (max-width: 800px) {
  body {
    background: #000;
  }
}
@media all and (max-width: 580px) {
  .intro_wrap .intro_loading {
    font-size: 3.8vw;
    line-height: 1.2em;
  }
}
