:root {
    --char-shadow: drop-shadow(black 0 0 10px);
}

.portrait-picture {
    background-image: url(./char/00_port.png);
    height: 350px;
    width: 260px;
    filter: var(--char-shadow);
}

/* Base set up */
.npc .portrait-picture {
    background-position: 0 -350px;
}
.full-body-character.enemy_h {
    background-size: initial;
    background-position-x: 1000px;
}
.full-body-character.enemy_sp {
    background-size: initial;
    background-position-x: 510px;
}
.full-body-character.main.omnicam::before,
.room.chat::before {
    content: " ";
    position: absolute;
    right: 0;
    top: 0;
}
.full-body-character.omnicam::before {
    background-image: url(./char/omnicam.png);
    width: 128px;
    height: 129px;
    top: 80px;
    animation: cam-bounce 3s infinite;
}
.room.chat::before {
    height: 100%;
    width: 550px;
}
.map-badge:hover,
.map-badge {
    background: transparent;
    background-image: url(./bg/map_badges_01.png);
}

/* Hero */
.main .portrait-picture {
    background-position: -260px 0;
}
.main_t .portrait-picture {
    background-position: -520px 0;
}
.hero .portrait-picture {
    background-position: -780px 0;
}
.hero_t .portrait-picture {
    background-position: -1040px 0;
}

.full-body-character.main {
    background-image: url(./char/main_001.png);
    filter: var(--char-shadow);
}
.full-body-character.main.civilian {
    background-image: url(./char/main_002.png);
}
.full-body-character.main.nude {
    background-image: url(./char/main_003.png);
}
.full-body-character.main.hard {
    background-image: url(./char/main_004.png);
}

.room.chat {
    background-image: url(./chat/chat_bg.jpg);
}
.room.chat.civilian {
    background-position: -1920px 0;
}
.room.chat.nude {
    background-position: 0 -1080px;
}

/* Combat */
.full-body-character.hero {
    background-image: url(./char/main_cb_001.png);
    left: 0 !important;
}
/* Hero Solo */
.room.cg.mast001_01 {
    background-image: url(./cg/mc_mast_001.jpg);
    background-position: 0 0;
}
.room.cg.mast001_02 {
    background-image: url(./cg/mc_mast_001.jpg);
    background-position: -1920px 0;
}
.room.cg.mast001_03 {
    background-image: url(./cg/mc_mast_001.jpg);
    background-position: 0 -1080px;
}
.room.cg.defeat {
    background-image: url(./cg/mc_mast_001.jpg);
    background-position: -1920px -1080px;
}
/* Landlord */
.landlord .portrait-picture {
    background-position: -260px -350px;
}
.full-body-character.landlord {
    background-image: url(./char/landlord.png);
    filter: var(--char-shadow);
}
.full-body-character.landlord.hard {
    background-image: url(./char/landlord_2.png);
    filter: var(--char-shadow);
}
.room.cg.landlord001_01 {
    background-image: url(./cg/landlord_001.jpg);
    background-position: 0 0;
}
.room.cg.landlord001_02 {
    background-image: url(./cg/landlord_001.jpg);
    background-position: -1920px 0;
}
.room.cg.landlord001_03 {
    background-image: url(./cg/landlord_001.jpg);
    background-position: 0 -1080px;
}
/* TK */
.tk .portrait-picture {
    background-position: -520px -350px;
}
.full-body-character.tk {
    background-image: url(./char/tk.png);
    filter: var(--char-shadow);
}
.room.chat.tk::before {
    background-image: url(./chat/users_0001.png);
}

.room.cg.tk_boulder001_01 {
    background-image: url(./cg/boulder_tk_001.jpg);
    background-position: 0 0;
}
.room.cg.tk_boulder001_02 {
    background-image: url(./cg/boulder_tk_001.jpg);
    background-position: -1920px 0;
}
.room.cg.tk_boulder001_03 {
    background-image: url(./cg/boulder_tk_001.jpg);
    background-position: 0 -1080px;
}
/* Night Shade */
.nightShade .portrait-picture {
    background-position: -780px -350px;
}
.full-body-character.nightShade {
    background-image: url(./char/night_shade.png);
    filter: var(--char-shadow);
}
.room.cg.night001_01 {
    background-image: url(./cg/night_shade_001.jpg);
    background-position: 0 0;
}
.room.cg.night001_02 {
    background-image: url(./cg/night_shade_001.jpg);
    background-position: -1920px 0;
}
.room.cg.night001_03 {
    background-image: url(./cg/night_shade_001.jpg);
    background-position: 0 -1080px;
}
/* Amphi */
.amphi .portrait-picture {
    background-position: -1040px -700px;
}
.full-body-character.amphi {
    background-image: url(./char/amphi.png);
    filter: var(--char-shadow);
}
.room.cg.amphi001 {
    background-image: url(./cg/amphi_001.jpg);
}
/* Asmodeus */
.asmodeus .portrait-picture {
    background-position: -780px -700px;
}
.full-body-character.asmodeus {
    background-image: url(./char/asmodeus.png);
    filter: var(--char-shadow);
}
.full-body-character.asmodeus.hood {
    background-image: url(./char/asmodeus_2.png);
    filter: var(--char-shadow);
}
.room.chat.asmodeus::before {
    background-image: url(./chat/users_0001.png);
    background-position: 0 -1080px;
}
.room.cg.asmodeus001_01 {
    background-image: url(./cg/asmodeus_001.jpg);
    background-position: 0 0;
}.room.cg.asmodeus001_02 {
    background-image: url(./cg/asmodeus_001.jpg);
    background-position: -1920px 0;
}.room.cg.asmodeus001_03 {
    background-image: url(./cg/asmodeus_001.jpg);
    background-position: 0 -1080px;
}

/* Dominion TBD */
.dominion .portrait-picture {
    background-position: -260px -1050px;
}
.full-body-character.dominion {
    background-image: url(./char/dominion.png);
    filter: var(--char-shadow);
}

/* Enemies */

/* Raging Bull */
.ragingBull .portrait-picture {
    background-position: -1040px -350px;
}
.map-badge.ragingBull {
    background-image: url(./bg/map_badges_01.png);
    background-position: 0 -140px;
}
.full-body-character.enemy_h.ragingBullDemo,
.full-body-character.enemy_h.ragingBull {
    background-image: url(./char/raging_001.png);
}
.full-body-character.enemy_h.ragingBull.interested {
    background-position-y: -1080px;
}
.full-body-character.enemy_h.ragingBullDemo,
.full-body-character.enemy_h.ragingBull.seduced {
    background-position-y: -2160px;
}
.room.cg.raging001 {
    background-image: url(./cg/night_shade_001.jpg);
    background-position: -1920px -1080px;
}
.room.cg.raging002_01 {
    background-image: url(./cg/raging_001.jpg);
    background-position: 0 0;
}.room.cg.raging002_02 {
    background-image: url(./cg/raging_001.jpg);
    background-position: -1920px 0;
}.room.cg.raging002_03 {
    background-image: url(./cg/raging_001.jpg);
    background-position: 0 -1080px;
}

/* Boulder */
.npc.boulder .portrait-picture {
    background-position: 0 -700px;
}
.map-badge.boulder {
    background-image: url(./bg/map_badges_01.png);
    background-position: -120px -140px;
}
.full-body-character.enemy_h.boulder_demo,
.full-body-character.enemy_h.boulder_demo_2,
.full-body-character.enemy_h.boulder {
    background-image: url(./char/boulder_001.png);
}
.full-body-character.enemy_h.interested {
    background-position-y: -1080px;
}
.full-body-character.enemy_h.seduced {
    background-position-y: -2160px;
}

.room.cg.boulder001_01 {
    background-image: url(./cg/boulder_001.jpg);
    background-position: 0 0;
}
.room.cg.boulder001_02 {
    background-image: url(./cg/boulder_001.jpg);
    background-position: -1920px 0;
}
.room.cg.boulder001_03 {
    background-image: url(./cg/boulder_001.jpg);
    background-position: 0 -1080px;
}

/* Robber > Small */
.npc.robberSmall .portrait-picture {
    background-position: -260px -700px;
}
.map-badge.robberSmall {
    background-image: url(./bg/map_badges_01.png);
    background-position: -120px 0;
}
.full-body-character.enemy_h.robberSmall {
    background-image: url(./char/robber_small_001.png);
}
.full-body-character.enemy_h.robberSmall.interested {
    background-position-y: -1080px;
}
.full-body-character.enemy_h.robberSmall.seduced {
    background-position-y: -2160px;
}
.room.cg.robberSmall001 {
    background-image: url(./cg/enemies_001.jpg);
    background-position: 0 0;
}

/* Biker */
.npc.biker .portrait-picture {
    background-position: -520px -700px;
}
.map-badge.biker {
    background-image: url(./bg/map_badges_01.png);
    background-position: -240px 0;
}
.full-body-character.enemy_h.biker {
    background-image: url(./char/biker_001.png);
}
.full-body-character.enemy_h.biker.interested {
    background-position-y: -1080px;
}
.full-body-character.enemy_h.biker.seduced {
    background-position-y: -2160px;
}
.room.cg.biker001 {
    background-image: url(./cg/enemies_001.jpg);
    background-position: -1920px 0;
}

/* Gunman */

.npc.gunman .portrait-picture {
    background-position: 0 -1050px;
}
.map-badge.gunman {
    background-image: url(./bg/map_badges_01.png);
    background-position: -240px -140px;
}
.full-body-character.enemy_h.gunman {
    background-image: url(./char/gunman_001.png);
}
.full-body-character.enemy_h.gunman.interested {
    background-position-y: -1080px;
}
.full-body-character.enemy_h.gunman.seduced {
    background-position-y: -2160px;
}
.room.cg.gunman001_01 {
    background-image: url(./cg/gunman_001.jpg);
    background-position: 0 0;
}
.room.cg.gunman001_02 {
    background-image: url(./cg/gunman_001.jpg);
    background-position: -1920px 0;
}
.room.cg.gunman001_03 {
    background-image: url(./cg/gunman_001.jpg);
    background-position: 0 -1080px;
}

/* Punk */

.enemy_sp.punk .portrait-picture,
.npc.punk .portrait-picture {
    background-position: -520px -1050px;
}
.map-badge.punk {
    background-image: url(./bg/map_badges_01.png);
    background-position: -360px 0;
}
.full-body-character.enemy_sp.punk,
.full-body-character.enemy_h.punk {
    background-image: url(./char/punk.png);
}
.full-body-character.enemy_h.punk.interested {
    background-position-y: -1080px;
}
.full-body-character.enemy_h.punk.seduced {
    background-position-y: -2160px;
}
.room.cg.punk001 {
    background-image: url(./cg/enemies_001.jpg);
    background-position: 0 -1080px;
}


/* Jobs */

.room.job {
    background-image: url(./bg/jobs_00.jpg);
}
.room.job.temp {
    background-position: 0 0;
}
.room.job.burger {
    background-position: -1920px 0;
}
.room.job.janitor {
    background-position: 0 -1080px;
}

/* Backgrounds */
.room.start {
    background-image: url(./bg/cover.jpg);
}
 .room.map {
    background-image: url(./bg/map_d.jpg);
 }
 .room.map.night {
    background-image: url(./bg/map_n.jpg);
 }

.room.black {
  background: linear-gradient(45deg, #000, #000, #333);
}

.room.home {
    background-image: url(./bg/home.jpg);
}
.room.street.alley {
    background-image: url(./bg/street_001.jpg);
}

.room.street.downtown {
    background-image: url(./bg/downtown_001.jpg);
}

.room.street.heroVod {
    background-image: url(./bg/herovod.jpg);
}

.room.combat {
    background-image: url(./bg/battle_01.jpg);
    /* background: linear-gradient(45deg, #999, #ddd, #333); */
}

@keyframes cam-bounce {
  0% {top: 80px;}
  25% {right: 5px;}
  50% {top: 90px;}
  75% {right: -5px}
  100% {top: 80px;}
}