.hacker #connect-btn {
    filter: invert(1);
}

.hacker #website-btn {
    filter: invert(1);
}

.hacker #help-btn {
    filter: invert(1);
}

.hacker #account-btn {
    filter: invert(1);
}

.hacker #font-setting-btn {
    filter: invert(1);
}

.hacker #setting-btn {
    filter: invert(1);
}

.hacker.app .window .content {
    background: rgba(0, 0, 0, 0.75);
}

.hacker .GRAY, .hacker .BLK, .hacker .NOR, .hacker .WHT, .hacker .CYN, .hacker .MAG, .hacker .BLU, .hacker .YEL, .hacker .RED, .hacker .GRN, .hacker.app .out, .app .freeze, .hacker.app .window .content {
    color: #7ecf69;
}

.hacker .HIR, .hacker .HIG, .hacker .HIY, .hacker .HIB, .hacker .HIM, .hacker .HIC, .hacker .HIW, .hacker .landing2, .hacker .landing3 {
    color: #baffa8;
    filter: drop-shadow(0px 0px 12px lime);
}

.hacker .BBLK, .hacker .BRED, .hacker .BGRN, .hacker .BYEL, .hacker .BBLU, .hacker .BMAG, .hacker .BCYN, .hacker .BWHT {
    background-color: darkgreen;
}

.hacker .landing {
    width: 100%;
    animation-name: none;
    filter: hue-rotate(45deg) saturate(0.65);
}

.hacker .version {
    color: #baffa8;
}

.hacker #map-container {
    background: none;
}

.hacker .label {
    color: #7ecf69 !important;
}

.hacker .client-input {
    color: #7ecf69;
}

.hacker.app .send {
    border: none;
    background: none;
    color: #baffa8;
    filter: drop-shadow(0px 0px 12px lime);
    caret-color: #baffa8;
}

body.hacker {
    background-image: url("/client/public/image/hacker.jpg");
    background-size: 25%;    /*animation-name: hacker-bg;*/
    animation-duration: 5s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes hacker-bg {
    0% {
        background-position-y: 100%;
    }

    100% {
        background-position-y: 0%;
    }

}

.hacker #map-legand-btn {
    filter: invert(1);
}

.hacker .bar-border {
    background: none;
}

.hacker .bar {
    background-color: #baffa8 !important;
    filter: drop-shadow(0px 0px 12px lime);
}

.hacker #hp-container .text {
    display: none;
}

.classic .GRAY, .classic .BLK, .classic .NOR, .classic .WHT, .classic .CYN, .classic .MAG, .classic .BLU, .classic .YEL, .classic .RED, .classic .GRN, .classic.app .out, .app .freeze, .classic.app .window .content {
    color: #666;
}

.classic .HIR, .classic .HIG, .classic .HIY, .classic .HIB, .classic .HIM, .classic .HIC, .classic .HIW, .classic .landing2, .classic .landing3 {
    color: #666;
    filter: drop-shadow(0px 0px 0.5px #333);
}

.classic .BBLK, .classic .BRED, .classic .BGRN, .classic .BYEL, .classic .BBLU, .classic .BMAG, .classic .BCYN, .classic .BWHT {
    background: none;
}

.classic .landing {
    width: 100%;
    animation-name: none;
    filter: saturate(0) brightness(0.6);
}

.classic #map-container {
    background-image: url('../image/map-classic.png');
}

.classic .label {
    color: #666;
    font-weight: bold;
}

.classic .client-input {
    color: #666;
    font-weight: bold;
}

body.classic {
    background: none;
    background-image: url('../image/classic-bg.jpg');
    background-position: left top;
    background-repeat: no-repeat;
    background-color: #008080 !important;
}

.classic.app .window .content {
    background: rgba(240, 240, 240, 0.95);
}

.classic .handle {
    border-radius: 0;
    background: rgb(0, 0, 133) !important;
    border: 2px #dddddd solid;
    height: 25px;
    background-image: url('../image/telnet-icon.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: 5px !important;
}

.classic.app .out {
}

.classic #lock-win-btn {
    filter: drop-shadow(0px 0px 5px black);
}

.classic .tool-bar {
    background: #ccc;
}

.classic #hp-container .text {
    color: #000;
}

.classic.app .send {
    border: none;
    background: none;
    box-shadow: none;
    color: #666;
}

.classic .label {
    color: #666 !important;
}

.classic .bar-border {
    background: none;
}

.classic .scroll-view {
    border: 2px #dddddd solid;
    box-shadow: 2px 2px gray;
    left: 1.5% !important;
}

.classic #hp-bar .bar, .classic #pet-hp-bar .bar {
    background-color: #7dff7d;
}

.classic #mp-bar .bar {
    background-color: #ff8a97;
}

.classic #sp-bar .bar, .classic #pet-ep-bar .bar {
    background-color: #8cbcff;
}

.coder .GRAY, .coder .BLK, .coder .NOR, .coder .WHT, .coder .CYN, .coder .MAG, .coder .BLU, .coder .YEL, .coder .RED, .coder .GRN, .coder.app .out, .app .freeze, .coder.app .window .content {
    color: #666;
}

.coder .HIR, .coder .HIG, .coder .HIY, .coder .HIB, .coder .HIM, .coder .HIC, .coder .HIW, .coder .landing2, .coder .landing3 {
    color: #666;
    filter: drop-shadow(0px 0px 0.5px #333);
}

.coder .BBLK, .coder .BRED, .coder .BGRN, .coder .BYEL, .coder .BBLU, .coder .BMAG, .coder .BCYN, .coder .BWHT {
    background: none;
}

.coder .landing {
    width: 100%;
    animation-name: none;
    filter: saturate(0) brightness(0.6);
}

.coder #map-container {
    background-image: url('../image/map-classic.png');
}

.coder .label {
    color: #666;
    font-weight: bold;
}

.coder .client-input {
    color: #666;
    font-weight: bold;
}

body.coder {
    background: none;
    background-image: url('../image/classic-bg.jpg');
    background-position: left top;
    background-repeat: no-repeat;
    background-color: #008080 !important;
}

.coder.app .window .content {
    background: rgba(255, 255, 255, 0.93);
}

.coder .handle {
}

.coder.app .out {
}

.coder #lock-win-btn {
    filter: drop-shadow(0px 0px 5px black);
}

.coder .tool-bar {
    background: #ccc;
}

.coder #hp-container .text {
    color: #000;
}

.coder.app .send {
    border: none;
    background: none;
    box-shadow: none;
    color: #666;
}

.coder .label {
    color: #666 !important;
}

.coder .bar-border {
    background: none;
}

.coder .scroll-view {
    border: 2px #dddddd solid;
    box-shadow: 2px 2px gray;
    left: 1.5% !important;
}

.coder #hp-bar .bar {
    background-color: #7dff7d;
}

.coder #mp-bar .bar {
    background-color: #ff8a97;
}

.coder #sp-bar .bar {
    background-color: #8cbcff;
}