/* mixins */
.hide {
  display: none;
}
.absolute_center {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.css_arrow {
  position: absolute;
  margin: auto;
  border-style: solid;
  height: 10px;
  width: 10px;
  border-width: 0 8px 10px;
  border-color: transparent transparent green;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.css_arrow.top {
  top: -12px;
  left: 0;
  right: 0;
}
.css_arrow.top_right {
  top: -12px;
  right: -15px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.css_arrow.right {
  top: 0;
  right: -15px;
  bottom: 0;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
.css_arrow.down_right {
  bottom: -12px;
  right: -15px;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}
.css_arrow.down {
  bottom: -12px;
  left: 0;
  right: 0;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.css_arrow.down_left {
  bottom: -12px;
  left: -15px;
  -webkit-transform: rotate(225deg);
  transform: rotate(225deg);
}
.css_arrow.left {
  top: 0;
  left: -15px;
  bottom: 0;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}
.css_arrow.top_left {
  top: -10px;
  left: -13px;
  -webkit-transform: rotate(315deg);
  transform: rotate(315deg);
}
.logo_mixin {
  position: relative;
  padding: 0 0 0.3em;
  font-size: 6.3rem;
  line-height: 0.8em;
  font-weight: bold;
}
.logo_mixin:before {
  content: "";
  position: absolute;
  top: 64px;
  left: 258px;
  width: 43px;
  height: 43px;
  margin: 0 auto;
  background: #ffffff url('../images/sprites.png') -270px -138px no-repeat;
}
/***************************************************************/
/* base */
*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html {
  font-size: 62.5%;
}
html,
body,
.wrap_main {
  width: 100%;
  height: 100%;
}
body {
  font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
  color: #222222;
}
div {
  overflow: hidden;
}
h2 {
  margin-bottom: 20px;
  text-transform: uppercase;
  text-align: center;
  font-size: 25px;
  line-height: 1.2em;
}
ul {
  list-style: none;
}
.wrap_main {
  position: relative;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  background: #ffffff url('../images/treasure.png') no-repeat right bottom;
  background-position: right -100px bottom -100px;
  font-size: 16px;
  line-height: 1.3em;
}
.full_size {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
  overflow: auto;
  margin: auto;
  z-index: 1;
}
.full_size > .content {
  overflow: auto;
}
/***************************************************************/
/* main loading */
.main_loading_wrap {
  display: block;
  z-index: 500;
  background: #fff;
  text-align: center;
}
.main_loading_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 500px;
  height: 500px;
  max-width: 80%;
  max-height: 80%;
  margin: auto;
  padding: 20px;
  background: #fff;
}
.main_loading_content.loading_done .loading_label {
  display: none;
}
.main_loading_content.loading_done .close_loading {
  display: inline-block;
}
.main_loading_content .loading_logo_wrap {
  position: relative;
  padding: 0 0 0.3em;
  font-size: 6.3rem;
  line-height: 0.8em;
  font-weight: bold;
  margin-top: 140px;
}
.main_loading_content .loading_logo_wrap:before {
  content: "";
  position: absolute;
  top: 64px;
  left: 258px;
  width: 43px;
  height: 43px;
  margin: 0 auto;
  background: #ffffff url('../images/sprites.png') -270px -138px no-repeat;
}
.main_loading_content .loading_label {
  margin: 33px 0px 0px;
}
.main_loading_content .loading_label span {
  opacity: 0;
  animation: 1.2s anim_loading_dots infinite;
}
.main_loading_content .loading_label span:nth-child(2) {
  animation-delay: 0.2s;
}
.main_loading_content .loading_label span:nth-child(3) {
  animation-delay: 0.4s;
}
.main_loading_content .close_loading {
  display: none;
  height: 30px;
  margin-top: 15px;
  padding: 0 10px;
  border: 1px solid #cccccc;
  font-size: 15px;
  line-height: 1.2em;
  line-height: 28px;
  cursor: pointer;
}
@keyframes anim_loading_dots {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  50.01% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
/***************************************************************/
/* prologue */
.prologue_wrap {
  display: block;
  z-index: 450;
  background: #fff;
  text-align: center;
}
.prologue_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 500px;
  height: 500px;
  max-width: 80%;
  max-height: 80%;
  margin: auto;
  padding: 20px;
  background: #fff;
}
.prologue_content h2 {
  margin-bottom: 15px;
  font-size: 30px;
  line-height: 1.2em;
}
.prologue_content p {
  margin-top: 1.3em;
  font-size: 18px;
  line-height: 1.3em;
}
.prologue_content .close_prologue_btn {
  display: inline-block;
  height: 30px;
  margin-top: 1.3em;
  padding: 0 10px;
  border: 1px solid #cccccc;
  font-size: 16px;
  line-height: 1.2em;
  line-height: 28px;
  cursor: pointer;
}
/***************************************************************/
/* main menu */
/* new game */
/* game menu */
/* you failed */
/* you won */
.main_menu_content .continue_game_btn {
  display: none;
}
.main_menu_content,
.new_game_content,
.game_menu_content,
.you_failed_content,
.you_won_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 500px;
  height: 500px;
  max-width: 80%;
  max-height: 80%;
  margin: auto;
  padding: 20px;
  border: 1px solid #666;
  background: #fff;
}
.main_menu_content li,
.new_game_content li,
.game_menu_content li,
.you_failed_content li,
.you_won_content li {
  width: 120px;
  height: 50px;
  margin: 0 auto 15px;
  text-align: center;
  line-height: 50px;
  border: 1px solid #ccc;
  cursor: pointer;
}
.new_game_wrap,
.game_menu_wrap {
  display: none;
}
.game_menu_wrap {
  z-index: 200;
  background: rgba(255, 255, 255, 0.6);
}
.you_failed_wrap {
  z-index: 200;
  background: rgba(255, 255, 255, 0.6);
  display: none;
}
.you_failed_wrap .you_failed_content {
  display: none;
  height: 240px;
}
.you_won_wrap {
  z-index: 200;
  background: rgba(255, 255, 255, 0.6);
  display: none;
}
.you_won_wrap .you_won_content {
  display: none;
  height: 320px;
}
.you_won_wrap .won_desc {
  display: none;
  margin-bottom: 20px;
}
.you_won_wrap .won_sorox .won_desc_sorox,
.you_won_wrap .won_wakes .won_desc_wakes,
.you_won_wrap .won_elis .won_desc_elis,
.you_won_wrap .won_drein .won_desc_drein {
  display: block;
}
/***************************************************************/
/* create player */
.new_game_wrap h3 {
  margin-bottom: 0.65em;
  text-align: center;
}
.new_game_wrap .characters {
  margin-bottom: 0.65em;
  line-height: 0;
  text-align: center;
}
.new_game_wrap .choose_character {
  overflow: visible;
}
.new_game_wrap .choose_character .info {
  overflow: visible;
}
.new_game_wrap .choose_character .name {
  text-align: center;
}
.new_game_wrap .choose_character .dice {
  text-align: center;
}
.new_game_wrap .choose_character .desc {
  margin: 0.65em -20px;
  padding: 0.65em 20px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.new_game_wrap .choose_character .desc .value {
  overflow: visible;
}
.new_game_wrap .character {
  display: inline-block;
  width: 45px;
  height: 45px;
  border: 1px solid #ccc;
  background: url('../images/sprites.png') 0 0 no-repeat;
  cursor: pointer;
  -webkit-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.new_game_wrap .character.active {
  background-color: green;
}
.new_game_wrap .character#sorox {
  background-position: -45px -180px;
}
.new_game_wrap .character#wakes {
  background-position: -90px -180px;
}
.new_game_wrap .character#elis {
  background-position: -135px -180px;
}
.new_game_wrap .character#drein {
  background-position: 0 -180px;
}
.new_game_wrap .play_game_btn {
  position: absolute;
  bottom: 0px;
  right: 20px;
}
.new_game_wrap .back_btn {
  position: absolute;
  bottom: 0px;
  left: 20px;
}
.player_el {
  position: absolute;
  z-index: 4;
  width: 45px;
  height: 45px;
  border: 1px solid #111;
  background: rgba(255, 255, 255, 0.38) url('../images/sprites.png') center center no-repeat;
}
.bg_sorox {
  background-position: -45px -180px;
}
.bg_wakes {
  background-position: -90px -180px;
}
.bg_elis {
  background-position: -135px -180px;
}
.bg_drein {
  background-position: 0 -180px;
}
/***************************************************************/
/* game loading */
.level_loading_wrap {
  z-index: 300;
  background: #fff;
}
.level_loading_wrap .level_loading_content {
  position: absolute;
  overflow: hidden;
  top: 50%;
  left: 0;
  right: 0;
  width: 600px;
  max-width: 80%;
  margin: auto;
  padding: 70px 0;
  text-align: center;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.level_loading_wrap .level_loading_content .title {
  text-transform: uppercase;
  font-size: 35px;
  line-height: 1.2em;
}
.level_loading_wrap .level_loading_content .day_count {
  font-size: 18px;
  line-height: 1.2em;
  color: #969696;
}
.level_loading_wrap .level_loading_content .play_btn {
  display: none;
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100px;
  height: 30px;
  border: 1px solid #000;
  font-size: 15px;
  line-height: 1.2em;
  line-height: 28px;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
}
/***************************************************************/
/* tutorial wrap */
.tutorial_wrap {
  z-index: 180;
  background: rgba(255, 255, 255, 0.8);
}
.tutorial_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 300px;
  height: 300px;
  margin: auto;
  padding: 20px;
  background: #fff;
  border: 1px solid #cccccc;
  text-align: center;
}
.tutorial_content .tutorial_part {
  display: none;
}
.tutorial_content .tutorial_part.active {
  display: block;
}
.tutorial_content .tutorial_img_wrap {
  position: relative;
  height: 110px;
  border: 1px solid #cccccc;
}
.tutorial_content .tutorial_btns {
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  margin: auto;
}
.tutorial_content .tutorial_btns .tutorial_next_btn,
.tutorial_content .tutorial_btns .tutorial_close_btn {
  display: inline-block;
  height: 30px;
  margin: 0 20px;
  padding: 0 10px;
  border: 1px solid #cccccc;
  font-size: 15px;
  line-height: 1.2em;
  line-height: 28px;
  cursor: pointer;
}
.tutorial_content .part_search .area_part {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  background: #cccccc url('../images/sprites.png') 0 -90px no-repeat;
}
.tutorial_content .part_move .area_part {
  top: 0;
  bottom: 0;
  overflow: visible;
  margin: auto;
}
.tutorial_content .part_move .area_part.block1 {
  left: 58px;
  background-position: -90px 0;
}
.tutorial_content .part_move .area_part.block2 {
  right: 58px;
  background-position: -360px 0;
}
.tutorial_content .part_attack .area_part {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.tutorial_content .part_attack .area_part.block1 {
  background-position: -405px 0;
  background-color: rgba(255, 255, 255, 0.44);
}
.tutorial_content .part_attack .area_part.block2 {
  background-position: 0 -135px;
}
.tutorial_content .part_attack_direction .area_part {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  overflow: visible;
  background-position: -405px 0;
}
.tutorial_content .part_return .area_part {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  background-position: -90px -45px;
}
.tutorial_content .part_stuck .block1 {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 120px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  border: 1px solid #000;
  cursor: pointer;
}
.tutorial_content .tutorial_num {
  font-weight: 600;
}
/***************************************************************/
/* choose dice numbers */
.choose_dice_numbers_wrap {
  z-index: 100;
  background: rgba(255, 255, 255, 0.6);
}
.choose_dice_numbers_content {
  position: absolute;
  overflow: hidden;
  top: 50%;
  left: 0;
  right: 0;
  width: 600px;
  max-width: 80%;
  max-height: 250px;
  margin: auto;
  padding: 20px;
  background: #fff;
  border: 1px solid #000;
  text-align: center;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.choose_dice_numbers_content .choose_dice_number {
  display: inline-block;
  opacity: 0.6;
  width: 45px;
  height: 45px;
  margin-left: 5px;
  border: 1px solid #000;
  text-align: center;
  line-height: 43px;
  color: #000;
}
.choose_dice_numbers_content .choose_dice_number:first-child {
  margin-left: 0;
}
.choose_dice_numbers_content .choose_dice_number.can_add {
  cursor: pointer;
  opacity: 1;
}
/***************************************************************/
/* area */
.game_wrap {
  display: none;
}
.game_wrap .main_panel {
  position: relative;
  overflow: visible;
  min-height: 400px;
}
.game_wrap .middle_wrap {
  position: relative;
  overflow: visible;
  padding: 0 220px;
}
.game_wrap .middle {
  overflow: visible;
  width: 100%;
  height: 100%;
}
.game_wrap .player_items_wrap {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 200px;
  height: 390px;
  padding: 30px 0 10px;
  border: 1px solid #000;
  background: #fff;
}
.game_wrap .player_items_wrap h3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.game_wrap .player_items_wrap_inner {
  overflow: auto;
  height: 100%;
}
.game_wrap .player_items_wrap_inner .item {
  position: relative;
  height: 55px;
  padding: 5px 10px 5px 65px;
  cursor: pointer;
}
.game_wrap .player_items_wrap_inner .item:hover,
.game_wrap .player_items_wrap_inner .item:active {
  background: #eee;
}
.game_wrap .player_items_wrap_inner .item .name {
  display: none;
}
.game_wrap .player_items_wrap_inner .item .desc {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  overflow: hidden;
  max-height: 43px;
  width: 100%;
  padding: 0px 10px 0px 65px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.game_wrap .player_items_wrap_inner .img {
  position: absolute;
  top: 5px;
  left: 10px;
  display: inline-block;
  width: 45px;
  height: 45px;
  border: 1px solid #000;
  background-image: url('../images/sprites.png');
  background-repeat: no-repeat;
}
.game_wrap .player_achievement_wrap {
  position: absolute;
  top: 0;
  right: 0;
  overflow: visible;
  width: 200px;
  height: 350px;
  margin-top: 30px;
  padding: 10px;
  border: 1px solid #000;
  background: #fff;
}
.game_wrap .player_achievement_h_wrap {
  position: absolute;
  top: -40px;
  left: -1px;
  right: -1px;
  height: 40px;
  margin: auto;
  border-right: 1px solid #000;
  border-left: 1px solid #000;
}
.game_wrap .player_achievement_h_wrap h3 {
  float: left;
  height: 100%;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  background: #efefef;
  text-align: center;
  line-height: 38px;
  cursor: pointer;
  font-size: 17px;
}
.game_wrap .player_achievement_h_wrap h3.selected {
  background: #fff;
  border-bottom-color: #fff;
}
.game_wrap .player_achievement_h_wrap .change_achievement {
  width: 70%;
  border-right: 1px solid #000;
}
.game_wrap .player_achievement_h_wrap .change_kills {
  width: 30%;
}
.game_wrap .player_achievement_wrap_inner {
  overflow: auto;
  height: 100%;
}
.game_wrap .player_achievement_wrap_inner .player_achievmant {
  padding: 10px 0;
  border-top: 1px solid #000;
}
.game_wrap .player_achievement_wrap_inner .player_achievmant:first-child {
  border-top: none;
}
.game_wrap .player_achievement_wrap_inner .player_achievmant.done {
  color: #aaa;
}
.game_wrap .player_achievement_wrap_inner .player_achievmant .label {
  font-weight: 600;
}
.game_wrap .player_kills_wrap_inner {
  display: none;
  overflow: auto;
  height: 100%;
}
.game_wrap .player_kills_wrap_inner .player_kill.explored {
  margin-top: 1.3em;
}
.game_wrap .bottom_panel {
  height: 50px;
}
.area_playable {
  position: relative;
  overflow: visible;
  margin: 0 auto;
  border: 2px solid red;
}
.area_part {
  position: absolute;
  width: 45px;
  height: 45px;
  border: 1px solid #111;
  background: #eeeeee url('../images/sprites.png') center center no-repeat;
  line-height: 45px;
  font-size: 0;
  text-indent: -999px;
  text-align: center;
  cursor: pointer;
  transform-origin: 50% 50%;
}
.area_part.front.bg_wall_plane {
  background-position: 0 0;
}
.area_part.front.bg_wall_rock {
  background-position: -45px 0;
}
.area_part.front.bg_wall_one {
  background-position: -90px 0;
}
.area_part.front.bg_wall_l {
  background-position: -135px 0;
}
.area_part.front.bg_wall_dead {
  background-position: -225px 0;
}
.area_part.front.bg_wall_t {
  background-position: -270px 0;
}
.area_part.front.bg_wall_x {
  background-position: -315px 0;
}
.area_part.front.bg_wall_slash {
  background-position: -360px 0;
}
.area_part.front.bg_wall_y {
  background-position: -405px 0;
}
.area_part.front.bg_wall_i {
  background-position: -450px 0;
}
.area_part.front.bg_wall_lava {
  background-position: 0 -45px;
}
.area_part.front.bg_wall_gate {
  background-position: -45px -45px;
}
.area_part.front.bg_wall_start {
  background-position: -90px -45px;
}
.area_part.front .info {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.2;
  width: 100%;
  height: 100%;
  background: #7e6094 url('../images/sprites.png') 0 0 no-repeat;
}
.teleport_is_actived .area_part.front .info {
  display: block;
  background-position: -360px -225px;
}
.area_part.back {
  z-index: 3;
  height: 47px;
  border-bottom-width: 3px;
  margin-top: -2px;
}
.area_part.back.bg_0 {
  background: #cccccc url('../images/sprites.png') 0 -90px no-repeat;
}
.area_part.back.bg_1 {
  background: #cccccc url('../images/sprites.png') -45px -90px no-repeat;
}
.area_part.back .info {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.2;
  width: 100%;
  height: 100%;
  background: #7e6094 url('../images/sprites.png') 0 0 no-repeat;
}
.seek_is_actived .area_part.back .info {
  display: block;
  background-position: -315px -225px;
}
/***************************************************************/
/* enemies */
.enemy_el {
  position: absolute;
  z-index: 2;
  width: 45px;
  height: 45px;
  border: 1px solid #111;
  background: rgba(255, 255, 255, 0.38) url('../images/sprites.png') center center no-repeat;
  cursor: pointer;
}
.enemy_el:before {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 5px;
  height: 5px;
  pointer-events: none;
}
.enemy_el.has_item:before {
  content: "";
  background: green;
}
.enemy_el.has_not_item:before {
  content: "";
  background: red;
}
.bg_rat {
  background-position: 0 -135px;
}
.bg_big_rat {
  background-position: -45px -135px;
}
.bg_goblin_archer {
  background-position: -90px -135px;
}
.bg_goblin_warrior {
  background-position: -135px -135px;
}
.bg_keeper {
  background-position: -180px -135px;
}
.bg_crimson_keeper {
  background-position: -315px -135px;
}
.bg_goblin_king {
  background-position: -225px -135px;
}
.bg_dragon {
  background-position: -270px -135px;
}
/***************************************************************/
/* items */
.bg_small_health_potion {
  background-position: 0px -225px;
}
.bg_medium_health_potion {
  background-position: -45px -225px;
}
.bg_large_health_potion {
  background-position: -90px -225px;
}
.bg_scroll_of_hidden_items {
  background-position: -135px -225px;
}
.bg_temp_first_hit_double_demage {
  background-position: -180px -225px;
}
.bg_temp_first_hit_triple_demage {
  background-position: -225px -225px;
}
.bg_flush_rocks_with_earth {
  background-position: -270px -225px;
}
.bg_eye {
  background-position: -315px -225px;
}
.bg_power_up3 {
  background-position: -360px -225px;
}
.bg_health_cross {
  background-position: -405px -225px;
}
.bg_shield {
  background-position: -450px -225px;
}
.bg_shield2 {
  background-position: 0px -270px;
}
.bg_shield3 {
  background-position: -45px -270px;
}
.bg_shield4 {
  background-position: -90px -270px;
}
.bg_shield4 {
  background-position: -90px -270px;
}
.bg_sword {
  background-position: -135px -270px;
}
.item .img.bg_temp_block_attack_15_percentage {
  background-position: -450px -225px;
}
.item .img.bg_temp_block_attack_20_percentage {
  background-position: 0px -270px;
}
.item .img.bg_temp_block_attack_25_percentage {
  background-position: -45px -270px;
}
.item .img.bg_temp_block_attack_30_percentage {
  background-position: -90px -270px;
}
.item .img.bg_temp_regenerate_1HP_after_5_turns {
  background-position: -135px -270px;
}
/***************************************************************/
/* abilities */
.wrap_main .top_panel {
  margin-bottom: 20px;
  padding: 10px;
  border: 1px solid #000;
  border-top: none;
}
.wrap_main .top_panel .player_stats_wrap_inner {
  float: left;
  width: 200px;
  border-right: 1px solid #000;
}
.wrap_main .top_panel .player_stats_wrap_inner > div {
  float: left;
  width: 50%;
  height: 22px;
  line-height: 22px;
}
.wrap_main .top_panel .player_stats_wrap_inner .name .label {
  display: none;
}
.wrap_main .top_panel .score {
  float: left;
  width: 150px;
  height: 45px;
  line-height: 45px;
  text-align: center;
}
.wrap_main .top_panel .score .label {
  vertical-align: middle;
}
.wrap_main .top_panel .score .value {
  vertical-align: middle;
  font-size: 20px;
  font-weight: bold;
}
.wrap_main .top_panel .ability {
  float: left;
  width: 45px;
  height: 45px;
  margin-left: 10px;
  border: 1px solid #000;
}
.wrap_main .top_panel .ability:first-child {
  margin-left: 0;
}
.wrap_main .top_panel .ability {
  background: rgba(255, 255, 255, 0.38) url('../images/sprites.png') center center no-repeat;
  cursor: pointer;
}
.wrap_main .top_panel .ability.count_0 {
  background-color: #ccc;
}
.wrap_main .top_panel .ability_small_seek {
  background-position: -315px -225px;
}
.wrap_main .top_panel .ability_large_seek {
  background-position: -315px -225px;
}
.wrap_main .top_panel .ability_teleport {
  background-position: -360px -225px;
}
.wrap_main .top_panel .ability_regenerate_1hp_after_fight {
  background-position: -405px -225px;
}
.wrap_main .top_panel .ability_block_attack_20_percentage {
  background-position: 0px -270px;
}
.wrap_main .top_panel .game_buttons_wrap {
  float: right;
}
.wrap_main .top_panel .game_buttons_wrap .new_day_btn,
.wrap_main .top_panel .game_buttons_wrap .game_menu_main_btn {
  float: left;
  width: 120px;
  height: 45px;
  margin: 0 0 0 10px;
  text-align: center;
  line-height: 45px;
  border: 1px solid #000;
  cursor: pointer;
}
.wrap_main .day_13 .top_panel .game_buttons_wrap .new_day_btn {
  border-color: #ccc;
  color: #ccc;
}
/***************************************************************/
/* fight table */
.game_fight_wrap {
  z-index: 101;
  display: none;
  background: rgba(255, 255, 255, 0.6);
}
.game_fight_content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  height: 400px;
  max-width: 650px;
  max-height: 80%;
  margin: auto;
  padding: 20px;
  border: 1px solid #666;
  background: #fff;
}
.game_fight_content .captured_items {
  clear: both;
  float: left;
  width: 50%;
}
.game_fight_content .captured_items .item {
  position: relative;
  height: 45px;
  padding-left: 55px;
}
.game_fight_content .captured_items .img {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 45px;
  height: 45px;
  border: 1px solid #000;
  background-image: url('../images/sprites.png');
  background-repeat: no-repeat;
}
.game_fight_content .fight_table_btns {
  float: right;
  width: 50%;
  text-align: right;
}
.game_fight_content .fight_table_btns .flee_btn,
.game_fight_content .fight_table_btns .win_btn {
  display: block;
  width: 120px;
  float: right;
  text-align: center;
  height: 50px;
  border: 1px solid #000000;
  line-height: 48px;
  cursor: pointer;
}
.game_fight_content .fight_table_btns .win_btn {
  display: none;
}
.player_fight_table {
  float: left;
  padding-right: 70px;
}
.enemy_fight_table {
  float: right;
  padding-left: 70px;
}
.player_fight_table,
.enemy_fight_table {
  overflow: visible;
  width: 50%;
  min-height: 200px;
}
.player_fight_table .fight_table_wrap,
.enemy_fight_table .fight_table_wrap {
  overflow: visible;
  width: 100%;
  border: 1px solid #000;
}
.player_fight_table .fight_table_wrap .img,
.enemy_fight_table .fight_table_wrap .img {
  position: relative;
  overflow: visible;
  width: 45px;
  height: 45px;
  border: 1px solid #000;
  background-image: url('../images/sprites.png');
  background-repeat: no-repeat;
}
.player_fight_table .fight_table_wrap .img .is_dead,
.enemy_fight_table .fight_table_wrap .img .is_dead {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  height: 18px;
  background: #1e1e1e;
  font-size: 10px;
  line-height: 18px;
  font-weight: bold;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
}
.dice_table {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100px;
  height: 100%;
  margin: auto;
  padding-top: 55px;
  text-align: center;
}
.dice_table .dice_btn {
  clear: both;
  padding-top: 50px;
  cursor: pointer;
}
.dice_table .dice_img {
  width: 80px;
  height: 80px;
  margin: auto;
  border-radius: 50%;
  border: 1px solid #000;
  background: url('../images/dice18.png') center center no-repeat;
}
.dice_table .dice_result {
  float: left;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #000;
  line-height: 38px;
}
.dice_table .dice_result.enemy {
  float: right;
}
/***************************************************************/
/* add temporaly text for show some information */
.show_float_text {
  position: absolute;
  top: 0;
  left: 50%;
  padding: 2px 10px;
  border-radius: 3px;
  background: #000;
  color: #fff;
  white-space: nowrap;
  pointer-events: none;
  text-align: center;
  font-size: 12px;
  line-height: 1.2em;
  -webkit-transform: translate(-50%);
  transform: translate(-50%);
}
span.player_el .show_float_text {
  margin-top: -15px;
}
/*temp admin*/
