/**** SCSS DECLARATIONS ****/

/* Unique layout styles */
#container:before {
    height: 180px;
    width: 100px;

    position: absolute;
    z-index: 2;

    top: 5px;
    left: 67px;

    content: '';

    background: url(./images/red_mask.png) no-repeat;
}

#content {
    margin-top: 130px;
}

#subProfile {
    top: 110px;
}

/* Theme */
body {
    background: #161616;
}

#container {
    background: url(./images/banner.png) center 53px no-repeat;
}


#content {
    background-color: #0c0c0c;

    border: 5px solid #0c0c0c;
}

#subProfile {
    background: #000000 linear-gradient(to bottom, #1d1d1d, #070707);

    border: 3px solid #0c0c0c;
}

#footer {
    padding: 3px 10px 3px 0;

    text-align: right;
    background-color: #131313;

    border-top: 1px solid #000000;

    font-size: 0.6em;
    font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    color: #c0c0c0;
    line-height: 220%;
}

#bgStrip {
    background: #101010 url(./images/bg_dot_texture.png);

    border-top: 1px solid #020202;
    border-bottom: 1px solid #020202;
}

#sideMenu {
    border-right: 1px solid #0c0c0c;
}

#pageContent {
    color: #b0b0b0;
}

/* Top Menu styling */
#topMenu a {
    background: #1c1c1c linear-gradient(to bottom, #141414, #050505);

    border: 2px solid #0c0c0c;
    color: #FFFFFF;
    text-shadow:
    -1px 0px 0px #434343,
    -1px -1px 0px #434343,
    0px -1px 0px #434343,
    1px -1px 0px #434343,
    1px 0px 0px #434343,
    1px 1px 0px #434343,
    0px 1px 0px #434343,
    -1px 1px 0px #434343;;
    box-shadow: 0 0 1px 1px #1d1d1d;
}

#topMenu a:hover {
    background: #b91e2c linear-gradient(to bottom, #b91e2c, #3d070c);
    border-color: #200404;
    text-shadow:
    -1px 0px 0px #505050,
    -1px -1px 0px #505050,
    0px -1px 0px #505050,
    1px -1px 0px #505050,
    1px 0px 0px #505050,
    1px 1px 0px #505050,
    0px 1px 0px #505050,
    -1px 1px 0px #505050;;
}

/* Side Menu styling */
#sideMenu .menuDiv {
    background-color: #111111;

    border-color: #090909;
}

#sideMenu .menuDiv .subHeader {
    background: linear-gradient(to bottom, #A02020, #400d0d);
}

#sideMenu li {
    list-style: none;
}

#sideMenu .menuDiv a {
    background-color: #161616;

    color: #6a6a6a;
    border-bottom: 1px solid #080808;
}

#sideMenu .menuDiv a:hover {
    background-color: #101010;
    color: #f0f0f0;
}

.menuAlert {
    background-color: #ff5050;
    border: 1px solid #ab4545;

    color: #FCFCFC;
}

.interfaceProblem {
    color: #a0a0a0;
}

/* Sub-profile styling */
#subProfile .leftSubProfile, #subProfile .rightSubProfile, #subProfile .spiritIcon {
    background: #202020 linear-gradient(to bottom, #212121, #151515);

    color: #b0b0b0;
}

#regenBarBg {
    background-color: #dadada;
}

#regenBarOverlay {
    background-image: url(./images/regen_overlay.png);
}

/* Register page styles */
#container.register {
    background: url(./images/banner.png) center 68px no-repeat;

    &::before {
        top: -20px;
        left: 71px;
    }

    #content {
        background-color: #101010;
    }

    #registerBox {
        border-color: #040404;

        input[type="text"], input[type="email"], input[type="password"] {
            border-color: transparent;
            padding: 2px;
        }
        input:hover, select:hover {
            box-shadow: 0 0 0 1px #cd391f;
        }
        input:focus, select:focus, select:focus option {
            outline: none;
            background-color: #f2f2f2;
            border-color: transparent;
            box-shadow: 0 0 0 1px #f03c1f;
        }

        input[type="checkbox"] {
            height: 14px;
            width: 14px;
        }
        input[type="checkbox"]:hover, input[type="submit"]:hover {
            box-shadow: none;
            cursor: pointer;
        }
        input[type="checkbox"]:focus, input[type="submit"]:focus {
            box-shadow: none;
            border-color: #000;
        }

        .error {
            color: #df2222;
        }
    }
    .shinigamiChar1, .shinigamiChar2, .hollowChar1, .hollowChar2 {
        border-color: #040404;
    }

    .leftTopMenu {
        max-width: 100%;
        width: auto;
        right: 20px;
        text-align: center;
        font-size: 0;
    }
    #topMenu li {
        margin: 0;
    }
    #topMenu li:first-child a {
        border-bottom-left-radius: 10px;
    }
    #topMenu li:last-child a {
        border-bottom-right-radius: 10px;
    }
    #topMenu a {
        width: 95px;
        padding: 8px 0;

        box-shadow: none;

        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
        border-color: #000000;
    }
}
#screenshotGallery {
    .boxHeader {
        border-bottom-color: #080808;
    }

    .mainImageBox {
        background-color: rgba(0,0,0,0.3);

        img {
            border: 1px solid #333333;
        }
    }

    .thumbnails {
        background-color: rgba(0,0,0,0.1);

        img.current {
            box-shadow: 0 0 2px 1px #ffffff;
        }
        img:hover {
            box-shadow: 0 0 3px 1px #ffffff;
        }
    }

}

/* Login menu */
#subProfile.loginMenu .spiritIcon input, #subProfile .orangeButton {
    background: #b91e2c linear-gradient(to bottom, #b91e2c, #700911);

    border-color: #200004;
    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #A03040,
    -1px -1px 0px #A03040,
    0px -1px 0px #A03040,
    1px -1px 0px #A03040,
    1px 0px 0px #A03040,
    1px 1px 0px #A03040,
    0px 1px 0px #A03040,
    -1px 1px 0px #A03040;;
}

#subProfile.loginMenu .spiritIcon input:hover, #subProfile .orangeButton:hover {
    background: #772020 linear-gradient(to bottom, #751a1a, #781a1a);
    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #B03040,
    -1px -1px 0px #B03040,
    0px -1px 0px #B03040,
    1px -1px 0px #B03040,
    1px 0px 0px #B03040,
    1px 1px 0px #B03040,
    0px 1px 0px #B03040,
    -1px 1px 0px #B03040;;
}

#subProfile .poolsDisplay {
    color: #d0d0d0;
}

.poolBarContainer {
    background-color: #404040;
}

div.poolBarContainer div.displayText {
    color: #FFFFFF;
}

#healthRegenRate, #staminaRegenRate, #spiritEnergyRegenRate {
    font-weight: bold;
}

.health {
    color: #fb3050;
}

.stamina {
    color: #40d020;
}

.spiritEnergy {
    color: #1080f5;
}

div.poolBarContainer.health_fill {
    border-color: #7c0210;
}

div.poolBarContainer.stamina_fill {
    border-color: #1a7400;
}

div.poolBarContainer.spirit_energy_fill {
    border-color: #003090;
}

div.poolBarContainer.exp_fill {
    border-color: #696500;
}

div.poolBarContainer.health_fill div.fill {
    background: #fb3050 linear-gradient(to bottom, #F81E39, #ff6262, #F81E39);
}

div.poolBarContainer.stamina_fill div.fill {
    background: #60ee40 linear-gradient(to bottom, #59dd3b, #93ff6f, #59DD3B);
}

div.poolBarContainer.spirit_energy_fill div.fill {
    background: #1080f5 linear-gradient(to bottom, #1080f5, #429bf5, #1080f5);
}

div.poolBarContainer.exp_fill div.fill {
    background: #f2d000 linear-gradient(to bottom, #F2D000, #ffe746, #F2D000);
}

div.poolBarContainer.health_fill div.displayText {
    text-shadow:
    -1px 0px 0px #6c0210,
    -1px -1px 0px #6c0210,
    0px -1px 0px #6c0210,
    1px -1px 0px #6c0210,
    1px 0px 0px #6c0210,
    1px 1px 0px #6c0210,
    0px 1px 0px #6c0210,
    -1px 1px 0px #6c0210;;
}

div.poolBarContainer.stamina_fill div.displayText {
    text-shadow:
    -1px 0px 0px #134c00,
    -1px -1px 0px #134c00,
    0px -1px 0px #134c00,
    1px -1px 0px #134c00,
    1px 0px 0px #134c00,
    1px 1px 0px #134c00,
    0px 1px 0px #134c00,
    -1px 1px 0px #134c00;;
}

div.poolBarContainer.spirit_energy_fill div.displayText {
    text-shadow:
    -1px 0px 0px #003090,
    -1px -1px 0px #003090,
    0px -1px 0px #003090,
    1px -1px 0px #003090,
    1px 0px 0px #003090,
    1px 1px 0px #003090,
    0px 1px 0px #003090,
    -1px 1px 0px #003090;;
}

div.poolBarContainer.exp_fill div.displayText {
    text-shadow:
    -1px 0px 0px #695300,
    -1px -1px 0px #695300,
    0px -1px 0px #695300,
    1px -1px 0px #695300,
    1px 0px 0px #695300,
    1px 1px 0px #695300,
    0px 1px 0px #695300,
    -1px 1px 0px #695300;;
}

#regenBarFillCover {
    background-color: #1c1c1c;
}

/* Character select */
#characterSelect, #createCharacter {
    background: linear-gradient(to bottom right, #222222, #161616);
    border-color: #080808;
}

#characterSelect .characterDisplay {
    background: linear-gradient(to bottom, #242424, #181818);
    border-color: #080808;
}

#characterSelect a.close {
    color: #c42828;
    text-shadow:
    -1px 0px 0px #000000,
    -1px -1px 0px #000000,
    0px -1px 0px #000000,
    1px -1px 0px #000000,
    1px 0px 0px #000000,
    1px 1px 0px #000000,
    0px 1px 0px #000000,
    -1px 1px 0px #000000;;
}

#characterSelect a.close:hover {
    color: #e04040;
}

#characterSelect .inBattle {
    color: #E03020;
}

/* Notifications */
@keyframes glowPulse {
    from {
        text-shadow: none;
    }
    to {
        text-shadow:
    -1px 0px 0px #C42020,
    -1px -1px 0px #C42020,
    0px -1px 0px #C42020,
    1px -1px 0px #C42020,
    1px 0px 0px #C42020,
    1px 1px 0px #C42020,
    0px 1px 0px #C42020,
    -1px 1px 0px #C42020;;
    }
}

#notifications a {
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    color: #ECECEC;
}

#notifications a:hover {
    color: #e9622c;
}

#notificationLeftButton {
    background: url(../../images/icons/left_hover.png) 0/20px no-repeat;
}

#notificationLeftButton:hover {
    background-image: url(../../images/icons/left.png);
}

#notificationRightButton {
    background: url(../../images/icons/right_hover.png) 0/20px no-repeat;
}

#notificationRightButton:hover {
    background-image: url(../../images/icons/right.png);
}

/* Message styles */
#friendsList .subHeader {
    background: #1c1c1c linear-gradient(to bottom, #3A3A3A, #202020);
    border: 1px solid #000000;

    color: #e0e0e0;
    text-shadow:
    -1px 0px 0px #434343,
    -1px -1px 0px #434343,
    0px -1px 0px #434343,
    1px -1px 0px #434343,
    1px 0px 0px #434343,
    1px 1px 0px #434343,
    0px 1px 0px #434343,
    -1px 1px 0px #434343;;
}

#friendsList .subHeader:hover {
    background: linear-gradient(to bottom, #4A4A4A, #2a2a2a);
    text-shadow:
    -1px 0px 0px #303030,
    -1px -1px 0px #303030,
    0px -1px 0px #303030,
    1px -1px 0px #303030,
    1px 0px 0px #303030,
    1px 1px 0px #303030,
    0px 1px 0px #303030,
    -1px 1px 0px #303030;;
}

#friendsList .subHeader:before {
    background: linear-gradient(to bottom, #902020, #401010);
}

#friendsList .errorMessage {
    background-color: #F2F2F2;

    color: #00C000;
}

#onlineFriends {
    background-color: #161616;

    border: 1px solid #080808;
}

#onlineFriends::-webkit-scrollbar-thumb {
    background-color: #808080;
}

#onlineFriends li {
    background-color: #161616;
    border-bottom: 1px solid #080808;
    color: #808080;
}

#onlineFriends li:hover, #conversationList .conversationHeader:hover {
    background-color: #101010;
    color: #f0f0f0;
}

#onlineFriends .online {
    background-color: #00A000;
    border-color: #00A000;
}
#onlineFriends .inactive {
    background-color: #dcdc21;
    border-color: #dcdc21;
}
#onlineFriends .offline {
    background-color: #808080;
    border-color: #808080;
}

#messages .conversation {
    background-color: #202020;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}

#messages .conversationHeader {
    background: linear-gradient(to bottom, #B02020, #802020);
    border-color: #000000;
    color: #e0e0e0;
    text-shadow:
    -1px 0px 0px #651010,
    -1px -1px 0px #651010,
    0px -1px 0px #651010,
    1px -1px 0px #651010,
    1px 0px 0px #651010,
    1px 1px 0px #651010,
    0px 1px 0px #651010,
    -1px 1px 0px #651010;;
}

#messages .conversationHeader:before {
    background: linear-gradient(to bottom, #F05a5a, #DF1010);
}

#messages .conversationHeader:hover {
    background: linear-gradient(to bottom, #751a1a, #781a1a);
    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #B03040,
    -1px -1px 0px #B03040,
    0px -1px 0px #B03040,
    1px -1px 0px #B03040,
    1px 0px 0px #B03040,
    1px 1px 0px #B03040,
    0px 1px 0px #B03040,
    -1px 1px 0px #B03040;;
}

#messages .conversationMessages {
    background-color: #202020;
    border: 1px solid #080808;

    color: #A0A0A0;
}

#messages .conversationMessages::-webkit-scrollbar-thumb {
    background-color: #808080;
}

#messages .receivedMessages, #inbox .receivedMessages, #pageContent .receivedMessages {
    background-color: #222222;
}

#messages .sentMessages, #inbox .sentMessages, #pageContent .sentMessages {
    background-color: #181818;
}

/* Whitespace fix for inbox */
#messages .close:hover {
    background: linear-gradient(to bottom, #B02020, #803030);
    border-color: #601010;

    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #651010,
    -1px -1px 0px #651010,
    0px -1px 0px #651010,
    1px -1px 0px #651010,
    1px 0px 0px #651010,
    1px 1px 0px #651010,
    0px 1px 0px #651010,
    -1px 1px 0px #651010;;
}

/* Inbox styles */
#inbox {
    border: 1px solid #080808;

    .conversationMenu a {
        display: block;
        padding: 5px;
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }
    .conversationMenu a:last-child {
        border-bottom: 0;
    }

    .conversationMenu::before {
        border-color: transparent transparent #080808 transparent;
    }
    .reportLink {
        color: #ff232e;
    }
}

#pageContent p.orangeSubHeader.inboxHeader {
    border: 1px solid #080808;
}

#conversationList {
    border-right: 1px solid #080808;
    background-color: #202020;
}

#conversationList::-webkit-scrollbar-track {
    border-left: 1px solid #080808;
}

#conversationList::-webkit-scrollbar-thumb {
    background-color: #808080;
}

#conversationList .conversationHeader {
    background-color: #161616;
    border-bottom: 1px solid #080808;
    color: #808080;
}

#conversationList .conversationHeader:hover {
    background-color: #101010;
    color: #f0f0f0;
}

#conversationList .conversationHeader.open {
    background-color: #101010;
}

#conversationMessages {
    background-color: #202020;
}

#messageInput {
    border-top: 1px solid #080808;
}

#messageInput textarea {
    border-right: 1px solid #080808;
}

#newConversationBox {
    background: linear-gradient(to bottom right, #202020, #161616);
    box-shadow: 0 0 4px #808080;
}

#newConversationBox input {
    background-color: #E8E8E8;
}

#newConversationBox textarea {
    background-color: #E8E8E8;
}

.time {
    color: #B0B0B0;
}

/* Friends page */
#pageContent .friendDisplay {
    background: #242424 linear-gradient(to bottom, #242424, #181818);
    border-color: #080808;
}

#pageContent .friendDisplay hr {
    border-color: #121212;
}

/* Team page */
#pageContent .teamMember, #pageContent .allyHealDisplay {
    background: #242424 linear-gradient(to bottom, #242424, #181818);
    border-color: #080808;
}

/* Battle styles */
#pageContent .abilityButtonInfo {
    border: 1px solid #000000;
    background: linear-gradient(to bottom, #363636, #2A2A2A);
}
#pageContent .signature-ability-button-container {
    border: 1px solid #000000;
    background: #101010 linear-gradient(45deg,
        rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 35%, rgba(255, 255, 255, 0.05) 45%,
        rgba(255, 255, 255, 0.08) 50%,
        rgba(255, 255, 255, 0.05) 55%, rgba(255, 255, 255, 0) 65%, rgba(255, 255, 255, 0) 100%);

    .signature-ability-button label {
        font-weight: bold;
    }
}

/* OP styles */
#patrolmap td {
    border: 1px solid #000000;
}

/* Travel page style */
#shinigamiBaseInfo {
    background: #102070 linear-gradient(to bottom, #095eA4, #072e6f);

    color: #c0c0c0;

    border: 1px solid #304090;
}

#hollowBaseInfo {
    background: #903031 linear-gradient(to bottom, #903031, #700203);

    color: #cfcfcf;

    border: 1px solid #802030;
}

#attackBase {
    background: #fceac3 linear-gradient(to bottom, #0A000A, #202020, #202020, #0A000A);

    color: #C0C0C0;

    border: 1px solid #000000;
}

.searchAreaPlayer::before {
    background: rgba(255, 255, 255, 0.3);
    border-radius: 5px;
}

#shinigamiBaseInfo .poolBarContainer div {
    background: #f16565 linear-gradient(to bottom, #f05d40, #a02020);
}

#hollowBaseInfo .poolBarContainer div {
    background: #94dbff linear-gradient(to bottom, #70a0e0, #2a5ac0);
}

#bossDisplay {
    background: #303030 linear-gradient(to bottom, #404040, #1a1a1a);

    border: 1px solid #000000;
    border-radius: 10px;
}

#bossAvatar img {
    border: 1px solid #000000;
}

#bossInfo {
    background-color: #202020;

    color: #cacaca;

    border: 1px solid #000000;
}

#pageContent #attackBoss a {
    background: #A02020 linear-gradient(to bottom, #b02020, #500f0F);

    border: 1px solid #080808;
    color: #FFFFFF;
    text-shadow:
    -1px 0px 0px #434343,
    -1px -1px 0px #434343,
    0px -1px 0px #434343,
    1px -1px 0px #434343,
    1px 0px 0px #434343,
    1px 1px 0px #434343,
    0px 1px 0px #434343,
    -1px 1px 0px #434343;;
}

#pageContent #attackBoss a:hover {
    background: #1c1c1c linear-gradient(to bottom, #9c131f, #240407);
    border-color: #000000;
    text-shadow:
    -1px 0px 0px #505050,
    -1px -1px 0px #505050,
    0px -1px 0px #505050,
    1px -1px 0px #505050,
    1px 0px 0px #505050,
    1px 1px 0px #505050,
    0px 1px 0px #505050,
    -1px 1px 0px #505050;;
}

.bossDamageBarContainer {
    background-color: #202020;

    border: 1px solid #000000;
}

.shinigamiDamageBar {
    background: #89d1ed linear-gradient(to bottom, #6a8ada, #5264d0);
}

.hollowDamageBar {
    background: #db6a6a linear-gradient(to bottom, #d04d4d, #b03030);
}

#content table.mapGrid tr td.mapNumber {
    background-color: #202020;
}

#content table.mapGrid tr td.topMapNumber {
    border-bottom: 1px solid #202020;
}

#content table.mapGrid tr td.leftMapNumber {
    border-right: 1px solid #202020;
}

#travel .mapXNumbers, #travel .mapYNumbers {
    background-color: #202020;
}

.logout_timer {
    color: #cacaca;
}

#pageContent #raidDisplay {
    background: #202020 linear-gradient(to bottom right, #222222, #161616);
    border-color: #080808;
}

/* Custom sword page */
#pageContent .customSwordForm .abilityBox {
    /* #242424 */
    background: linear-gradient(to right, #1f1f1f, #303030, #303030, #1f1f1f);
    border: 1px solid #080808;
}

#pageContent .customSwordForm .abilityBox .tooltip {
    background: #a0a0a0 linear-gradient(to bottom, #303030, #202020);
    box-shadow: 0 0 5px #000000;
}

#pageContent .customSwordForm .errorMessage {
    color: #20C000;
}

#pageContent .customSwordForm .confirmDialog {
    border-color: #909090;
    background: linear-gradient(to bottom right, #222222, #161616);
    box-shadow: 0 0 3px #808080;
}

#pageContent .customSwordForm .topBorder {
    border-color: #606060;
}

/* Content style items */
#pageContent .orangeButton {
    background: #b91e2c linear-gradient(to bottom, #b91e2c, #700911);

    border: 1px solid #200004;
    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #A03040,
    -1px -1px 0px #A03040,
    0px -1px 0px #A03040,
    1px -1px 0px #A03040,
    1px 0px 0px #A03040,
    1px 1px 0px #A03040,
    0px 1px 0px #A03040,
    -1px 1px 0px #A03040;;
}

#pageContent .orangeButton:hover {
    background: #772020 linear-gradient(to bottom, #751a1a, #781a1a);
    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #B03040,
    -1px -1px 0px #B03040,
    0px -1px 0px #B03040,
    1px -1px 0px #B03040,
    1px 0px 0px #B03040,
    1px 1px 0px #B03040,
    0px 1px 0px #B03040,
    -1px 1px 0px #B03040;;
}

input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
textarea,
select {
    background-color: #e9e9e9;
}

.subHeader {
    background: #1c1c1c linear-gradient(to bottom, #202020, #111111);
    border-color: #000000;
    color: #e0e0e0;
    text-shadow:
    -1px 0px 0px #434343,
    -1px -1px 0px #434343,
    0px -1px 0px #434343,
    1px -1px 0px #434343,
    1px 0px 0px #434343,
    1px 1px 0px #434343,
    0px 1px 0px #434343,
    -1px 1px 0px #434343;;
}

.redSubheader {
    background: #B00000 linear-gradient(to bottom, #A02020, #400d0d);
    border: 1px solid #101010;

    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #651010,
    -1px -1px 0px #651010,
    0px -1px 0px #651010,
    1px -1px 0px #651010,
    1px 0px 0px #651010,
    1px 1px 0px #651010,
    0px 1px 0px #651010,
    -1px 1px 0px #651010;;
}

.orangeSubHeader {
    background: #b91e2c linear-gradient(to bottom, #b91e2c, #700911);

    color: #e0e0e0;
    text-shadow:
    -1px 0px 0px #A03040,
    -1px -1px 0px #A03040,
    0px -1px 0px #A03040,
    1px -1px 0px #A03040,
    1px 0px 0px #A03040,
    1px 1px 0px #A03040,
    0px 1px 0px #A03040,
    -1px 1px 0px #A03040;;
}

table {
    background: #202020 linear-gradient(to bottom right, #222222, #161616);
    border-color: #080808;
}

th {
    background: #B00000 linear-gradient(to bottom, #A02020, #400d0d);
    border: 1px solid #101010;

    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #651010,
    -1px -1px 0px #651010,
    0px -1px 0px #651010,
    1px -1px 0px #651010,
    1px 0px 0px #651010,
    1px 1px 0px #651010,
    0px 1px 0px #651010,
    -1px 1px 0px #651010;;
}

th.subHeader {
    background: linear-gradient(to bottom, #202020, #0c0c0c);
    border: 1px solid #101010;

    color: #d0d0d0;
    text-shadow:
    -1px 0px 0px #202020,
    -1px -1px 0px #202020,
    0px -1px 0px #202020,
    1px -1px 0px #202020,
    1px 0px 0px #202020,
    1px 1px 0px #202020,
    0px 1px 0px #202020,
    -1px 1px 0px #202020;;
}

td {
    border: 1px solid #080808;
}

td.social {
    background: linear-gradient(to bottom, #262626, #202020);
}

.row1 {
    background-color: #222222;
}

.row2 {
    background-color: #181818;
}

.row1.team, .row2.team {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/*
.row1.team {
	background: linear-gradient(to bottom, #191919, #222222, #222222, #191919)
}
.row2.team {
	background: linear-gradient(to bottom, #141414, #181818, #181818, #141414)
}*/

hr.subtle {
    color: rgba(255, 255, 255, 0.1);
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

a, #pageContent a, .conversationMessages a {
    color: #d0d0d0;
}

a:hover, #pageContent a:hover, .conversationMessages a:hover {
    color: #A01000;
}

input[type="text"], select, textarea {
    background-color: #dcdcdc;
}

#pageContent .button, .button {
    border: 1px solid #000000;
    background: #101010 linear-gradient(to bottom, #303030 50%, #000000 5%, #3a3a3a);
    color: #c0c0c0;
}

#pageContent .button:hover, .button:hover {
    border: 1px solid #000000;
    background: #202020 url("./images/ui-bg_glass_40_202020_1x400.png") 50% 50% repeat-x;
    color: #c0c0c0;
}

#pageContent a.button, a.button {
    margin: 2px 0;
    color: #c0c0c0;
    text-decoration: none;
}

#pageContent a.button:hover {
    color: #d0d0d0;
}

/* Re-used style classes */
.box {
    background-color: #242424;
    border-color: #080808;
}

.boxHeader {
    background: linear-gradient(to bottom, #202020, #0c0c0c);
    border: 1px solid #101010;

    color: #d0d0d0;
    text-shadow:
    -1px 0px 0px #202020,
    -1px -1px 0px #202020,
    0px -1px 0px #202020,
    1px -1px 0px #202020,
    1px 0px 0px #202020,
    1px 1px 0px #202020,
    0px 1px 0px #202020,
    -1px 1px 0px #202020;;
}

#pageContent .displayBox, .displayBox {
    background: #242424 linear-gradient(to bottom, #242424, #181818);
    border-color: #080808;
}

/* View battles page */
td.winner {
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 96%, #FFDA00);
}

/* Tooltips */
.tooltip {
    span {
        background: #444444 linear-gradient(to bottom, #444444, #282828);
        border-color: #080808;
        color: #a8a8a8;
    }

    .content {
        background-color: #444;
        color: #ddd;
    }
    .content::after {
        border-color: #555 transparent transparent transparent;
    }
    .content.bottom::after {
        border-color: transparent transparent #555 transparent;
    }
}
.tooltip a, #pageContent .tooltip a {
    color: #fff;
}

.tooltip.activeTip span {
    background: #505050 linear-gradient(to bottom, #505050, #343434);
}

/* Global message styles */
.globalMessage {
    background-color: #e4d8bc;
    background: url(./images/global_icon.png) 5% 75% no-repeat,
    url(./images/global_darker_bg.png) center bottom/1px 50px repeat-x, /* bottom strip*/
    url(./images/global_lighter_bg.png) repeat; /* main color */

    border: 4px solid #2e2e2e;
}

.globalMessage .header {
    color: #231E1F;
    border-bottom: 2px solid #231E1F;
}

.globalMessage .message {
    color: #231E1F;
}

.globalMessage .time {
    color: #565049;
}

#pageContent .globalMessage a {
    color: #202020;
}

#pageContent .globalMessage a:hover {
    color: #404040;
}

#pageContent .globalMessage a.close {
    color: #c42828;
    text-shadow:
    -1px 0px 0px #000000,
    -1px -1px 0px #000000,
    0px -1px 0px #000000,
    1px -1px 0px #000000,
    1px 0px 0px #000000,
    1px 1px 0px #000000,
    0px 1px 0px #000000,
    -1px 1px 0px #000000;;
}

#pageContent .globalMessage a.close:hover {
    color: #e04040;
}

.system_message {
    color: #00C000;
}

/* Chat interface styles */
.staffTitle {
    color: #e0e0e0;
}

div.mod {
    background-color: #209030;
}

div.headMod {
    background-color: #07a9c6;
}

div.contentAdmin {
    background-color: #8A00A0;
    /* color: #E0E0E0; */
}

div.admin {
    background-color: #a01a10;
}

div.dogeOverlord {
    background-color: #EDC000;
    color: #000000;
}

#pageContent a.mod, #pageContent span.mod {
    color: #239639;
}

#pageContent a.headMod, #pageContent span.headMod {
    color: #07a9c6;
}

#pageContent a.admin, #pageContent span.admin {
    color: #df3b33;
}

#pageContent a.headAdmin, #pageContent span.headAdmin {
    color: #df3b33;
}

.postTime {
    color: #d0d0d0;
}

hr {
    background-color: #808080;
}

/* Equip page */
div.equipSlot {
    background: #242424 linear-gradient(to bottom, #2e2e2e, #1c1c1c);

    border-color: #101010;
}

div.equipSlot.slotHover {
    box-shadow: 0 0 5px 0 #ffffff;
}

.signature-container {
    border-color: #101010;
}

.abilityButton.signature-move {
    background: #451a03 linear-gradient(to bottom, #78350f, #451a03) !important;
    border-color: #ffd700 !important;
}

div.equipTooltip::before {
    border-bottom-color: #242424;
}

div.equipTooltip.up::before {
    border-top-color: #242424;
}

.equipHeader h3, .equippedMove {
    background: #B00000 radial-gradient(ellipse, #a52121, #7b1919, #4c0200);
    box-shadow: inset 0 0 15px 1px #101010;
    color: #c0c0c0;
    border-color: #101010;
    text-shadow:
    -1px 0px 0px #202020,
    -1px -1px 0px #202020,
    0px -1px 0px #202020,
    1px -1px 0px #202020,
    1px 0px 0px #202020,
    1px 1px 0px #202020,
    0px 1px 0px #202020,
    -1px 1px 0px #202020;;
}

.equipHeader h3:hover,
.equippedMove:hover {
    background: #101010 radial-gradient(ellipse, #3f3f3f, #101010);
    color: #bababa;
}

.equipItem.active .equipHeader h3,
div.equippedMove.active {
    background: #101010 radial-gradient(ellipse, #494949, #1c1c1c);
    border-color: #000;

    color: #c0c0c0;
}

/* Barracks */
#barracks {
    background: #202020 linear-gradient(to bottom right, #222222, #161616);
    border-color: #080808;
}

/* Elite Squad HQ (Kido - Blue, Medic - Green, Stealth - Red) */
#pageContent .eliteSquad .officerDisplay {
    background: #242424 linear-gradient(to bottom, #242424, #181818);
    border-color: #080808;
}

#pageContent .eliteSquadPerks .fill.elite3 {
    background: linear-gradient(to bottom, #70a0e7, #73b6ff, #70a0e7);
}

#pageContent .eliteSquadPerks .fill.elite3.complete {
    background: linear-gradient(to bottom, #1080f5, #429bf5, #1080f5);
}

#pageContent .eliteSquadPerks .fill.elite4 {
    background: linear-gradient(to bottom, #80d272, #a2e894, #80d272);
}

#pageContent .eliteSquadPerks .fill.elite4.complete {
    background: linear-gradient(to bottom, #59d73b, #8af56e, #59d73b);
}

#pageContent .eliteSquadPerks .fill.elite5 {
    background: linear-gradient(to bottom, #eb4152, #f57b79, #eb4152);
}

#pageContent .eliteSquadPerks .fill.elite5.complete {
    background: linear-gradient(to bottom, #c30f26, #fa4747, #c30f26);
}

/* News styles */
.newsDiv {
    background-color: #202020;
    background: linear-gradient(to bottom right, #202020, #161616);

    border: 1px solid #080808;
}

.newsHeader {
    background: #B00000 linear-gradient(to bottom, #A02020, #400d0d);
    color: #FFFFFF;
    text-shadow:
    -1px 0px 0px #651010,
    -1px -1px 0px #651010,
    0px -1px 0px #651010,
    1px -1px 0px #651010,
    1px 0px 0px #651010,
    1px 1px 0px #651010,
    0px 1px 0px #651010,
    -1px 1px 0px #651010;;
}

/* Name colors */
.defaultName {
    color: #DADADA !important;
}

.blackName {
    color: #000000 !important;
}

.blueName {
    color: #3030EF !important;
}

.pinkName {
    color: #EA30CA !important;
}

.orangeName {
    color: #FF8000 !important;
}

.goldName {
    color: #FFD300 !important;
}

.whiteName {
    color: #FFFFFF !important;
}

.greenName {
    color: #20BA30 !important;
}

.tealName {
    color: #07a9c6 !important;
}

.purpleName {
    color: #A000C0 !important;
}

.redName {
    color: #D02010 !important;
}

/* Landing page styles */
.topPlayerList {
    /*border-color: #c1c1c1;*/

    color: #b0b0b0;
    border-color: #000000;
}

.raceLeaderInfo {
    background-color: #202020;
    background: linear-gradient(to bottom right, #222222, #161616);

    border-color: #080808;

    color: #b0b0b0;
}

/* Override for darkness to add margin to race leaders due to mask bg protruding */
.raceLeaderInfo:first-child {
    margin-top: 8px;
}

p.subHeader.shinigami {
    color: #eaeaea;
    background: linear-gradient(to bottom, #095eA4, #072e6f);
}

p.subHeader.hollow {
    color: #eaeaea;
    background: linear-gradient(to bottom, #AF303A, #7A0203);
    text-shadow:
    -1px 0px 0px #6F1010,
    -1px -1px 0px #6F1010,
    0px -1px 0px #6F1010,
    1px -1px 0px #6F1010,
    1px 0px 0px #6F1010,
    1px 1px 0px #6F1010,
    0px 1px 0px #6F1010,
    -1px 1px 0px #6F1010;;
}

.infoDiv {
    background: #202020 linear-gradient(to bottom right, #202020, #161616);
    border-color: #080808;
}

#newsContainer {
    background: #202020 linear-gradient(to bottom right, #202020, #161616);

    border-color: #080808;
}

#newsContainer::-webkit-scrollbar-thumb {
    background-color: #808080;
}

.fb-like {
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
}

/* UI tab style overrides */
#tabs .ui-widget-content, .ui-accordion .ui-widget-content {
    background: #202020 linear-gradient(to bottom right, #202020, #161616);
    border-color: #080808;
    color: #b0b0b0;
}

#pageContent .ui-tabs-panel {
    background-color: #202020;
    background: linear-gradient(to bottom right, #202020, #161616);

    border: 1px solid #080808;
}

#pageContent .ui-tabs-anchor {
    background-color: #303030;

    color: #a0a0a0;
}

#pageContent .ui-tabs-active .ui-tabs-anchor {
    color: #CA0804;

    background: linear-gradient(to bottom, #404040, #202020);
}

/**** jQuery widget styles ****/

/* ../../jquery/images/ui-bg_glass_75_c0e0f0_1x400.png */

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: 1px solid #000000;
    background: #101010 url("./images/ui-bg_glass_40_040404_1x400.png") 50% 50% repeat-x;
    color: #c0c0c0;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
    border: 1px solid #000000;
    background: #202020 url("./images/ui-bg_glass_40_202020_1x400.png") 50% 50% repeat-x;
    color: #c0c0c0;
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
    color: #c0c0c0;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    border: 1px solid #000000;
    background: #1f1f1f;
    color: #d0d0d0;
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
    color: #212121;
}

/* Override for current page links (SHOULD BE SAME AS .ui-state-active STYLE) */
#pageContent .currentPage, #pageContent .currentPage:hover {
    border: 1px solid #000000;
    background: #1f1f1f;
    color: #d0d0d0;
}

button.button span, a.button span {
    padding: .3em .8em;
}

/* The outer container of the dialog. */
.ui-dialog {
    background-color: #242424;
    box-shadow: 0 0 5px 0 #FFFFFF;

    color: #c0c0c0;
}

.ui-dialog .ui-dialog-titlebar { /*The title bar containing the dialog's title and close button. */
    background: #B00000 linear-gradient(to bottom, #A02020, #400d0d);
    border: 1px solid #101010;

    color: #F0F0F0;
    text-shadow:
    -1px 0px 0px #651010,
    -1px -1px 0px #651010,
    0px -1px 0px #651010,
    1px -1px 0px #651010,
    1px 0px 0px #651010,
    1px 1px 0px #651010,
    0px 1px 0px #651010,
    -1px 1px 0px #651010;;
}