.full-body-character {
  background-size: auto;
}

.room.black {
  background-color: black;
}

.room.white {
  background-color: white;
}

.room.main::before {
  content: ' ';
  background-image: url(./bg/logo.png);
  position: absolute;
  width: 860px;
  height: 390px;
  background-repeat: no-repeat;
  top: 70px;
  left: 530px;
}


/* Ettaran */
.room.ettaranMap {
  background-image: url(./bg/ettaran/map.jpg);
}

.room.portal {
  background-image: url(./bg/ettaran/portal.jpg);
}
.room.portal_blur,
.gem-room.portal_blur {
  background-image: url(./bg/ettaran/portal_blur.jpg);
}

.room.forest {
  background-image: url(./bg/ettaran/forest.jpg);
}
.room.forest_blur,
.gem-room.forest_blur {
  background-image: url(./bg/ettaran/forest_blur.jpg);
}


.character-button.barbarian::before,
.barbarian .portrait-picture {
  background-image: url(./cg/ettaran/barbarian_pt.png);
}
.full-body-character.barbarian {
  background-image: url(./cg/ettaran/barbarian.png);
}
.full-body-character.barbarian.step-1 {
  background-position-x: -811px;
}
.full-body-character.barbarian.step-2 {
  background-position-x: -1622px;
}
.full-body-character.barbarian.step-3 {
  background-position-x: -2433px;
}
.full-body-character.barbarian.step-4 {
  background-position-x: -3244px;
}
.full-body-character.barbarian.step-5 {
  background-position-x: -4055px;
}


.character-button.wizard::before,
.wizard .portrait-picture {
  background-image: url(./cg/ettaran/wizard_pt.png);
}
.full-body-character.wizard {
  background-image: url(./cg/ettaran/wizard.png);
}
.full-body-character.wizard.step-1 {
  background-position-x: -811px;
}
.full-body-character.wizard.step-2 {
  background-position-x: -1622px;
}
.full-body-character.wizard.step-3 {
  background-position-x: -2433px;
}
.full-body-character.wizard.step-4 {
  background-position-x: -3244px;
}
.full-body-character.wizard.step-5 {
  background-position-x: -4055px;
}
.full-body-character.wizard.step-6 {
  background-position-x: -4866px;
}
.full-body-character.wizard.step-7 {
  background-position-x: -5677px;
}


.character-button.small_demon::before,
.small_demon .portrait-picture {
  background-image: url(./cg/ettaran/small-demon_pt.png);
}
.full-body-character.small_demon {
  background-image: url(./cg/ettaran/small-demon.png);
}
.full-body-character.small_demon.step-1 {
  background-position-x: -811px;
}
.full-body-character.small_demon.step-2 {
  background-position-x: -1622px;
}
.full-body-character.small_demon.step-3 {
  background-position-x: -2433px;
}
.full-body-character.small_demon.step-4 {
  background-position-x: -3244px;
}
.full-body-character.small_demon.step-5 {
  background-position-x: -4055px;
}


/* BRUCE */

.room.bruceMap {
  background-image: url(./bg/bruce/bruce_map.jpg);
}

.room.constSite,
.gem-room.constSite {
  background-image: url(./bg/bruce/const_site.jpg);
}
.character-button.constWorker::before,
.constWorker .portrait-picture {
  background-image: url(./cg/bruce/construction_pt.png);
}
.full-body-character.constWorker {
  background-image: url(./cg/bruce/construction.png);
}
.full-body-character.constWorker.step-1 {
  background-position-x: -811px;
}
.full-body-character.constWorker.step-2 {
  background-position-x: -1622px;
}
.full-body-character.constWorker.step-3 {
  background-position-x: -2433px;
}
.full-body-character.constWorker.step-4 {
  background-position-x: -3244px;
}
.full-body-character.constWorker.step-5 {
  background-position-x: -4055px;
}

.room.chef,
.gem-room.chef {
  background-image: url(./bg/bruce/kitchen.jpg);
}
.character-button.chef::before,
.chef .portrait-picture {
  background-image: url(./cg/bruce/chef_pt.png);
}
.full-body-character.chef {
  background-image: url(./cg/bruce/chef.png);
}
.full-body-character.chef.step-1 {
  background-position-x: -811px;
}
.full-body-character.chef.step-2 {
  background-position-x: -1622px;
}
.full-body-character.chef.step-3 {
  background-position-x: -2433px;
}
.full-body-character.chef.step-4 {
  background-position-x: -3244px;
}
.full-body-character.chef.step-5 {
  background-position-x: -4055px;
}

.room.biker,
.gem-room.biker {
  background-image: url(./bg/bruce/biker.jpg);
}
.character-button.biker::before,
.biker .portrait-picture {
  background-image: url(./cg/bruce/biker_pt.png);
}
.full-body-character.biker {
  background-image: url(./cg/bruce/biker.png);
}
.full-body-character.biker.step-1 {
  background-position-x: -811px;
}
.full-body-character.biker.step-2 {
  background-position-x: -1622px;
}
.full-body-character.biker.step-3 {
  background-position-x: -2433px;
}
.full-body-character.biker.step-4 {
  background-position-x: -3244px;
}
.full-body-character.biker.step-5 {
  background-position-x: -4055px;
}

.room.coach,
.gem-room.coach {
  background-image: url(./bg/bruce/college.jpg);
}
.character-button.coach::before,
.coach .portrait-picture {
  background-image: url(./cg/bruce/coach_pt.png);
}
.full-body-character.coach {
  background-image: url(./cg/bruce/coach.png);
}
.full-body-character.coach.step-1 {
  background-position-x: -811px;
}
.full-body-character.coach.step-2 {
  background-position-x: -1622px;
}
.full-body-character.coach.step-3 {
  background-position-x: -2433px;
}
.full-body-character.coach.step-4 {
  background-position-x: -3244px;
}
.full-body-character.coach.step-5 {
  background-position-x: -4055px;
}

.room.account,
.gem-room.account {
  background-image: url(./bg/bruce/office.jpg);
}
.character-button.account::before,
.account .portrait-picture {
  background-image: url(./cg/bruce/accountant_pt.png);
}
.full-body-character.account {
  background-image: url(./cg/bruce/accountant.png);
}
.full-body-character.account.step-1 {
  background-position-x: -811px;
}
.full-body-character.account.step-2 {
  background-position-x: -1622px;
}
.full-body-character.account.step-3 {
  background-position-x: -2433px;
}
.full-body-character.account.step-4 {
  background-position-x: -3244px;
}
.full-body-character.account.step-5 {
  background-position-x: -4055px;
}

.room.library,
.gem-room.library {
  background-image: url(./bg/bruce/library.jpg);
}
.character-button.librarian::before,
.librarian .portrait-picture {
  background-image: url(./cg/bruce/librarian_pt.png);
}
.full-body-character.librarian {
  background-image: url(./cg/bruce/librarian.png);
}
.full-body-character.librarian.step-1 {
  background-position-x: -811px;
}
.full-body-character.librarian.step-2 {
  background-position-x: -1622px;
}
.full-body-character.librarian.step-3 {
  background-position-x: -2433px;
}
.full-body-character.librarian.step-4 {
  background-position-x: -3244px;
}
.full-body-character.librarian.step-5 {
  background-position-x: -4055px;
}

.room.gym,
.gem-room.gym {
  background-image: url(./bg/bruce/gym.jpg);
}
.character-button.boxer::before,
.boxer .portrait-picture {
  background-image: url(./cg/bruce/boxer_pt.png);
}
.full-body-character.boxer {
  background-image: url(./cg/bruce/boxer.png);
}
.full-body-character.boxer.step-1 {
  background-position-x: -811px;
}
.full-body-character.boxer.step-2 {
  background-position-x: -1622px;
}
.full-body-character.boxer.step-3 {
  background-position-x: -2433px;
}
.full-body-character.boxer.step-4 {
  background-position-x: -3244px;
}
.full-body-character.boxer.step-5 {
  background-position-x: -4055px;
}


.room.bruce_demon,
.gem-room.bruce_demon {
  background-image: url(./bg/bruce/mechanic.jpg);
}
.character-button.bruce_demon::before,
.bruce_demon .portrait-picture {
  background-image: url(./cg/bruce/mech_pt.png);
}
.full-body-character.bruce_demon {
  background-image: url(./cg/bruce/mech.png);
}
.full-body-character.bruce_demon.step-1 {
  background-position-x: -811px;
}
.full-body-character.bruce_demon.step-2 {
  background-position-x: -1622px;
}
.full-body-character.bruce_demon.step-3 {
  background-position-x: -2433px;
}
.full-body-character.bruce_demon.step-4 {
  background-position-x: -3244px;
}
.full-body-character.bruce_demon.step-5 {
  background-position-x: -4055px;
}


.room.bruce_tiger,
.gem-room.bruce_tiger {
  background-image: url(./bg/bruce/park.jpg);
}
.character-button.bruce_tiger::before,
.bruce_tiger .portrait-picture {
  background-image: url(./cg/bruce/tiger_pt.png);
}
.full-body-character.bruce_tiger {
  background-image: url(./cg/bruce/tiger.png);
}
.full-body-character.bruce_tiger.step-1 {
  background-position-x: -811px;
}
.full-body-character.bruce_tiger.step-2 {
  background-position-x: -1622px;
}
.full-body-character.bruce_tiger.step-3 {
  background-position-x: -2433px;
}
.full-body-character.bruce_tiger.step-4 {
  background-position-x: -3244px;
}
.full-body-character.bruce_tiger.step-5 {
  background-position-x: -4055px;
}


.room.gorilla,
.gem-room.gorilla {
  background-image: url(./bg/bruce/law_firm.jpg);
}
.character-button.gorilla::before,
.gorilla .portrait-picture {
  background-image: url(./cg/bruce/gorilla_pt.png);
}
.full-body-character.gorilla {
  background-image: url(./cg/bruce/gorilla.png);
}
.full-body-character.gorilla.step-1 {
  background-position-x: -811px;
}
.full-body-character.gorilla.step-2 {
  background-position-x: -1622px;
}
.full-body-character.gorilla.step-3 {
  background-position-x: -2433px;
}
.full-body-character.gorilla.step-4 {
  background-position-x: -3244px;
}
.full-body-character.gorilla.step-5 {
  background-position-x: -4055px;
}
.room.wolf,
.gem-room.wolf {
  background-image: url(./bg/bruce/trail.jpg);
}
.character-button.wolf::before,
.wolf .portrait-picture {
  background-image: url(./cg/bruce/wolf_pt.png);
}
.full-body-character.wolf {
  background-image: url(./cg/bruce/wolf.png);
}
.full-body-character.wolf.step-1 {
  background-position-x: -811px;
}
.full-body-character.wolf.step-2 {
  background-position-x: -1622px;
}
.full-body-character.wolf.step-3 {
  background-position-x: -2433px;
}
.full-body-character.wolf.step-4 {
  background-position-x: -3244px;
}
.full-body-character.wolf.step-5 {
  background-position-x: -4055px;
}

/* XMAS */

.room.lapland_blur,
.gem-room.lapland_blur {
  background-image: url(./bg/lapland_blur.jpg);
}
.room.lapland_cave_blur,
.gem-room.lapland_cave_blur {
  background-image: url(./bg/lapland_cave_blur.jpg);
}
.room.lapland_cave {
  background-image: url(./bg/lapland_cave.jpg);
}

.character-button.bob_elf::before,
.bob_elf .portrait-picture {
  background-image: url(./cg/xmas/bob_elf_pt.png);
}
.full-body-character.bob_elf {
  background-image: url(./cg/xmas/bob_elf.png);
}
.full-body-character.bob_elf.step-1 {
  background-position-x: -811px;
}
.full-body-character.bob_elf.step-2 {
  background-position-x: -1622px;
}
.full-body-character.bob_elf.step-3 {
  background-position-x: -2433px;
}
.full-body-character.bob_elf.step-4 {
  background-position-x: -3244px;
}
.full-body-character.bob_elf.step-5 {
  background-position-x: -4055px;
}


.character-button.rolf_guard::before,
.rolf_guard .portrait-picture {
  background-image: url(./cg/xmas/rolf_guard_pt.png);
}
.full-body-character.rolf_guard {
  background-image: url(./cg/xmas/rolf_guard.png);
}
.full-body-character.rolf_guard.step-1 {
  background-position-x: -811px;
}
.full-body-character.rolf_guard.step-2 {
  background-position-x: -1622px;
}
.full-body-character.rolf_guard.step-3 {
  background-position-x: -2433px;
}
.full-body-character.rolf_guard.step-4 {
  background-position-x: -3244px;
}
.full-body-character.rolf_guard.step-5 {
  background-position-x: -4055px;
}

.character-button.craig_bear::before,
.craig_bear .portrait-picture {
  background-image: url(./cg/xmas/craig_bear_pt.png);
}
.full-body-character.craig_bear {
  background-image: url(./cg/xmas/craig_bear.png);
}
.full-body-character.craig_bear.step-1 {
  background-position-x: -811px;
}
.full-body-character.craig_bear.step-2 {
  background-position-x: -1622px;
}
.full-body-character.craig_bear.step-3 {
  background-position-x: -2433px;
}
.full-body-character.craig_bear.step-4 {
  background-position-x: -3244px;
}
.full-body-character.craig_bear.step-5 {
  background-position-x: -4055px;
}

.character-button.santa::before,
.santa .portrait-picture {
  background-image: url(./cg/xmas/santa_pt.png);
}
.full-body-character.santa {
  background-image: url(./cg/xmas/santa.png);
}
.full-body-character.santa.step-1 {
  background-position-x: -811px;
}
.full-body-character.santa.step-2 {
  background-position-x: -1622px;
}
.full-body-character.santa.step-3 {
  background-position-x: -2433px;
}
.full-body-character.santa.step-4 {
  background-position-x: -3244px;
}
.full-body-character.santa.step-5 {
  background-position-x: -4055px;
}

.character-button.krampus::before,
.krampus .portrait-picture {
  background-image: url(./cg/xmas/krampus_pt.png);
}
.full-body-character.krampus {
  background-image: url(./cg/xmas/krampus.png);
}
.full-body-character.krampus.step-1 {
  background-position-x: -811px;
}
.full-body-character.krampus.step-2 {
  background-position-x: -1622px;
}
.full-body-character.krampus.step-3 {
  background-position-x: -2433px;
}
.full-body-character.krampus.step-4 {
  background-position-x: -3244px;
}
.full-body-character.krampus.step-5 {
  background-position-x: -4055px;
}
.full-body-character.krampus.step-6 {
  background-position-x: -4866px;
}

/* New Year */

.room.sihai_blur,
.gem-room.sihai_blur {
  background-image: url(./bg/chinese_blur.jpg);
}

.character-button.bullking::before,
.bullking .portrait-picture {
  background-image: url(./cg/year/bullking_pt.png);
}
.full-body-character.bullking {
  background-image: url(./cg/year/bullking.png);
}
.full-body-character.bullking.step-1 {
  background-position-x: -811px;
}
.full-body-character.bullking.step-2 {
  background-position-x: -1622px;
}
.full-body-character.bullking.step-3 {
  background-position-x: -2433px;
}
.full-body-character.bullking.step-4 {
  background-position-x: -3244px;
}
.full-body-character.bullking.step-5 {
  background-position-x: -4055px;
}

.character-button.yeartiger::before,
.yeartiger .portrait-picture {
  background-image: url(./cg/year/yeartiger_pt.png);
}
.full-body-character.yeartiger {
  background-image: url(./cg/year/yeartiger.png);
}
.full-body-character.yeartiger.step-1 {
  background-position-x: -811px;
}
.full-body-character.yeartiger.step-2 {
  background-position-x: -1622px;
}
.full-body-character.yeartiger.step-3 {
  background-position-x: -2433px;
}
.full-body-character.yeartiger.step-4 {
  background-position-x: -3244px;
}
.full-body-character.yeartiger.step-5 {
  background-position-x: -4055px;
}

/* Tutorial */

.full-body-character.narrator.tutorial-0 {
  background-image: url(./cg/tutorial-0.png), url(./cg/tutorial-base.png);
}
.full-body-character.narrator.tutorial-1 {
  background-image: url(./cg/tutorial-1.png), url(./cg/tutorial-base.png);
}
.full-body-character.narrator.tutorial-2 {
  background-image: url(./cg/tutorial-2.png), url(./cg/tutorial-base.png);
}
.full-body-character.narrator.tutorial-3 {
  background-image: url(./cg/tutorial-3.png), url(./cg/tutorial-base.png);
}