/* =========================
   Base
========================= */

body{
    margin:0;
    padding:0;
    font-family:Verdana, Arial, sans-serif;
    font-size:0.9em;
    background:#333333;
    color:#fff;
}

table{
    border-collapse:separate;
    border-spacing:1px;
}

a{
    color:#fff;
    text-decoration:none;
}

a:hover{
    color:#f1b64c;
    text-decoration:none;
}

.mainShell{
    min-height:100vh;
    background:#333333;
}

.gameHeader{
    height:68px;
    box-sizing:border-box;

    display:flex;
    align-items:stretch;
    justify-content:space-between;

    background:
        linear-gradient(to right, rgba(0,0,0,.9), rgba(0,0,0,.58), rgba(0,0,0,.9)),
        url("../images/header-banner.png") center center / cover no-repeat;
    border-bottom:1px solid #5b1d12;

    overflow:hidden;
}

.gameLogo{
    width:250px;
    padding:11px 0 0 22px;
    box-sizing:border-box;

    display:block;

    color:#fff;
    text-decoration:none;
}

.logoSmall{
    display:block;

    color:#fff;
    font-size:9pt;
    font-weight:bold;
    line-height:10px;
    letter-spacing:2px;
}

.logoWhite{
    color:#fff;
    font-family:Georgia, serif;
    font-size:25pt;
    font-weight:bold;
    line-height:29px;
}

.logoRed{
    color:#b60000;
    font-family:Georgia, serif;
    font-size:25pt;
    font-weight:bold;
    line-height:29px;
}

.headerActions{
    height:68px;

    display:flex;
    align-items:stretch;

    border-left:1px solid rgba(255,255,255,.08);
}

.headerAction{
    width:93px;
    height:68px;
    box-sizing:border-box;

    position:relative;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;

    background:linear-gradient(to bottom, rgba(8,8,8,.82), rgba(0,0,0,.88));
    border-left:1px solid rgba(255,255,255,.06);
    border-right:1px solid rgba(0,0,0,.65);

    color:#fff;
    font-size:7.5pt;
    font-weight:bold;
    text-align:center;
    text-decoration:none;
}


.headerAction:hover{
    background:
        linear-gradient(to bottom, rgba(52,20,13,.72), rgba(7,7,7,.95));
    color:#ffd35d;
}

.headerActionIcon{
    color:#fff;
    font-size:17px;
    line-height:18px;
}

.headerAction:hover .headerActionIcon{
    color:#ffd35d;
}

.headerActionText{
    line-height:12px;
}

.headerActionCount{
    position:absolute;
    top:7px;
    left:24px;

    min-width:14px;
    height:14px;
    padding:0 3px;
    box-sizing:border-box;

    color:#f0a340;
    font-size:9px;
    font-weight:bold;
    line-height:14px;
    text-align:center;
}

.headerAction.hasHeaderMessages .headerActionCount{
    background:#9f0000;
    border:1px solid #ffb3b3;
    border-radius:8px;

    color:#fff;
}

.headerAction.hasHeaderMessages .headerActionIcon{
    color:#ffd35d;
    animation:headerMessagePulse .75s infinite alternate;
}

@keyframes headerMessagePulse{
    from{
        color:#ffd35d;
    }

    to{
        color:#fff4b0;
    }
}
/* =========================
   Layout
========================= */

.gameLayout{
    display:flex;
    min-height:calc(100vh - 90px);
    background:#333333;
}

.contentArea{
    flex:1;
    padding:30px 20px 20px 115px;
    box-sizing:border-box;
}


/* =========================
   Sidebar / Menu
========================= */
.newSidebar{
    width:190px;
    min-height:calc(100vh - 96px);

  background:linear-gradient(to right, #0b0b0b, #141414);
    border-right:1px solid #2e2e2e;

    color:#fff;
    font-size:8.5pt;
}

.newMenuBlock{
    border-bottom:1px solid #1f1f1f;
}

.newMenuTitle{
    width:100%;
    height:31px;
    padding:0 10px;
    box-sizing:border-box;

    display:flex;
    align-items:center;
    justify-content:space-between;

    background:linear-gradient(to bottom, #171717, #0d0d0d);
    border:0;
    border-top:1px solid #333;
    border-bottom:1px solid #292018;

    color:#efe6d0;
    font-size:8.5pt;
    font-weight:bold;
    text-align:left;
    text-transform:uppercase;
    letter-spacing:0;

    cursor:pointer;
}

.menuTitleText{
    display:flex;
    align-items:center;
    gap:6px;
}

.menuTitleText:before{
    content:"";
    width:12px;
    height:12px;

    display:inline-block;

    background:linear-gradient(to bottom, #d8bd76, #8f6724);
    border:1px solid #4a3514;
    box-sizing:border-box;
}

.menuCollapseArrow:before{
    content:"";
    width:0;
    height:0;

    display:block;

    border-left:4px solid transparent;
    border-right:4px solid transparent;
    border-bottom:6px solid #d7c18a;
}

.newMenuBlock.isCollapsed .menuCollapseArrow:before{
    border-bottom:0;
    border-top:6px solid #d7c18a;
}

.newMenuItems{
    padding:5px 0 6px 0;
}

.newMenuBlock.isCollapsed .newMenuItems{
    display:none;
}

.newMenuLink,
.menuInlineLinks{
    min-height:19px;
    padding:3px 8px 3px 14px;
    box-sizing:border-box;

    display:block;

    color:#f2f2f2;
    font-size:8.5pt;
    line-height:14px;
    text-decoration:none;
}

.newMenuLink:hover{
    background:#242424;
    color:#ffd35d;
}

.newMenuLink.activeMenuItem{
    background:linear-gradient(to right, #6a1510, #2a0806);
    border-left:3px solid #d0a348;
    padding-left:11px;

    color:#fff;
}

.menuInlineLinks{
    display:flex;
    align-items:center;
    gap:6px;
    padding-left:14px;
}

.menuInlineLinks a{
    color:#f2f2f2;
    text-decoration:none;
}

.menuInlineLinks a:hover{
    color:#ffd35d;
}

.menuInlineLinks span{
    color:#777;
}

.menuInlineLinks a.activeMenuItem{
    color:#ffd35d;
    font-weight:bold;
}


/* =========================
   Panels / Tables
========================= */

.panel,
.homeBox,
.ownerPanel{
    background:#737373;
    color:#000;
    border:1px solid #222;
    box-sizing:border-box;
    overflow:hidden;
}

.panelTitle,
.homeTitle,
.gamePanelTitle,
.newPanelTitle,
.tableTitle,
.sectionTitle{
    height:25px;
    line-height:25px;
    padding:0 6px;
    box-sizing:border-box;

    background:linear-gradient(to bottom, #3a3a3a 0%, #4b170f 42%, #160806 100%);

    border:0;
    border-top:1px solid #666;
    border-bottom:1px solid #666;

    color:#fff;
    font-family:Verdana, Arial, sans-serif;
    font-size:9pt;
    font-weight:bold;
    text-align:center;
}

.panelInner,
.homeInner{
    padding:4px;
    background:#7b7b7b;
    color:#000;
    box-sizing:border-box;
}

.gameTable,
.newGameTable,
.NewGridCenter{
    background:#7b7b7b;
    color:#000;

    border-collapse:separate;
    border-spacing:1px;
    border:1px outset #666;
}

.gameTable th,
.newGameTable th,
.NewGridTitle td,
.NewGridTitle th{
    height:20px;
    padding:0 0 0 5px;
    background:#555;
    color:#fff;
    text-align:left;
}

.gameTable td,
.newGameTable td,
.NewGridCenter td{
    background:#777;
    border:1px solid #666;

    padding:1px;

    color:#000;
}


/* =========================
   Buttons / Forms
========================= */

button,
input[type="submit"],
.mailButton,
.but{
    min-height:22px;

    padding:2px 10px;

    background:#e8e8e8;
    border:1px solid #999;
    border-radius:3px;

    color:#000;

    font-family:Verdana, Arial, sans-serif;
    font-size:8.5pt;

    cursor:pointer;
}

button:hover,
input[type="submit"]:hover,
.mailButton:hover,
.but:hover{
    background:#fff;
    color:#000;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
textarea,
select{
    background:silver;
    border:1px solid #000;
    color:#000;

    font-family:Verdana, Arial, sans-serif;
    font-size:8.5pt;

    box-sizing:border-box;
}


/* =========================
   Notices
========================= */

.pageNotice{
    width:420px;
    max-width:100%;

    margin:0 auto 10px auto;
    padding:6px 10px;
    box-sizing:border-box;

    background:linear-gradient(to bottom, #e9dfba, #cfc082);
    border:1px solid #8d7a36;

    color:#111;
    font-size:8.5pt;
    font-weight:bold;
    text-align:center;
}

.pageNoticeError{
    background:linear-gradient(to bottom, #f0c6c6, #d89191);
    border-color:#8d3333;
    color:#4a0000;
}

.pageNoticeSuccess{
    background:linear-gradient(to bottom, #d8edc0, #9fc878);
    border-color:#557d33;
    color:#163000;
}

.newMenuTitle:hover{
    background:linear-gradient(to bottom, #3a3a3a 0%, #4b170f 42%, #160806 100%);
    color:#fff;
}

/* =========================
   General Page Blocks
========================= */

.pageBox{
    width:850px;
    max-width:100%;
    margin:0 auto;
}

.pageBoxSmall{
    width:520px;
    max-width:100%;
    margin:0 auto;
}

.pageBoxWide{
    width:1100px;
    max-width:100%;
    margin:0 auto;
}

.infoBar{
    height: 26px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    background:#888;
    border:1px solid #555;
    color:#000;
    font-size:11px;
}

.formActions{
    margin:8px 0;
    text-align:center;
}

.ownerText{
    width:850px;
    max-width:100%;
    margin:14px auto 0 auto;

    color:#fff;
    line-height:18px;
    text-align:center;
}

.ownerText span,
.ownerText strong{
    font-weight:bold;
    color:#fff;
}

.ownerTextLine + .ownerTextLine{
    margin-top:5px;
}

.ownerPanel{
    width:420px;
    margin:16px auto 0 auto;
}

.ownerPanelBody{
    padding:8px;
    text-align:center;
    color:#000;
}

.ownerPanelLine{
    margin-bottom:8px;
    color:#000;
}

.purchaseOnly{
    width:850px;
    max-width:100%;
    margin:30px auto 0 auto;
    text-align:center;
}

.purchaseLink{
    background:none !important;
    border:0 !important;
    color:#fff !important;

    font-family:Verdana, Arial, sans-serif;
    font-size:9pt;
    font-weight:bold;

    cursor:pointer;
}

.purchaseLink:hover{
    color:yellow !important;
}

/* =========================
   Airport
========================= */

.airportRadio{
    width:28px;
    text-align:center;
}

.airportCooldown{
    float:right;
    color:#ffff00;
    font-weight:bold;
}

.coolCity{
    color:#4db4ff !important;
    font-weight:bold;
}

.hotCity{
    color:#ff4545 !important;
    font-weight:bold;
}


.airportRouteList{
    width:370px;
    margin:0;
    color:#000;
    font-size:10pt;
}

.airportRoute{
    display:block;
    min-height:24px;
    line-height:24px;
    color:#000;
    white-space:nowrap;
    font-size:14px;
}

.airportRoute input{
    margin-right:6px;
    vertical-align:middle;
}

.airportRoute.coolCity{
    color:#4db4ff !important;
    font-weight:bold;
}

.airportRoute.hotCity{
    color:#ff4545 !important;
    font-weight:bold;
}

.airportTravelNote{
    margin-top:8px;
    color:#000;
    text-align:center;
font-size:14px;
}

.airportTravelLayout{
    width:560px;
    max-width:100%;
    margin:18px auto 10px auto;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
}

.airportImageBox{
    width:190px;
    height:115px;
    border:1px solid #222;
    background:#333;
    overflow:hidden;
    flex:0 0 190px;
}

.airportImageBox img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.pageBoxAirport{
    width:650px;
    max-width:100%;
    margin:0 auto;
}

.slotContent{
    padding-top:30px;
}

.slotSpinMessage{
    width:620px;
    margin:0 auto 10px auto;
    color:#fff;
    font-size:13px;
    font-weight:bold;
    text-align:center;
}

.slotPageGrid{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:18px;
}

.slotMainColumn{
    width:620px;
}

.slotJackpot{
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    background:#888;
    border-bottom:1px solid #555;
    color:#d6a23c;
    text-transform:uppercase;
    letter-spacing:1px;
    font-size:11px;
}

.slotJackpot strong{
    color:#ffd46a;
    font-size:20px;
    text-shadow:1px 1px #000;
}

.slotReelsThreeRows{
    display:flex;
    justify-content:center;
    gap:12px;
    margin:18px 0 14px 0;
}

.slotReelColumn{
    width:104px;
    height:318px;
    overflow:hidden;
    background:$888;
    border:2px solid #555;
    border-radius:4px;
    box-shadow:inset 0 0 18px rgba(0,0,0,.75);
}

.slotSymbolCell{
    height:106px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.slotSymbolCell img{
    width:82px;
    height:82px;
    object-fit:contain;
    display:block;
}

.slotPayline{
    background:#888;
    border-top:1px solid #fc0026;
    border-bottom:1px solid #fc0026;
    box-shadow:inset 0 0 18px rgba(0,0,0,.75);
}

.slotBetForm{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin-bottom:12px;
    color:#fff;
    font-weight:bold;
}

.slotBetForm input{
    width:110px;
}

.slotSidePanel{
    width:300px;
}

.slotSideBox{
    margin-bottom:12px;
}

.slotPayoutTable,
.slotWinnerTable{
    width:100%;
    border-collapse:collapse;
    font-size:12px;
}

.slotPayoutTable td,
.slotWinnerTable td{
    border:1px solid #999;
    padding:4px;
    background:#808080;
    color:#000;
}

.slotPayoutTable img{
    width:28px;
    height:28px;
    object-fit:contain;
    vertical-align:middle;
    margin-right:3px;
}

.slotSpinMessage{
    width:620px;
    margin:0 auto 10px auto;
    padding:7px 10px;
    box-sizing:border-box;

    border:1px solid #333;
    font-size:13px;
    font-weight:bold;
    text-align:center;
    text-shadow:1px 1px #000;
}

.slotSpinMessageLose{
    background:linear-gradient(to bottom, #3b1515, #1c0909);
    border-color:#7b2525;
    color:#ff9b9b;
}

.slotSpinMessageWin{
    background:linear-gradient(to bottom, #293b16, #121c09);
    border-color:#789239;
    color:#ffe08a;
}

.slotSpinMessageJackpot{
    padding:8px;
    background:linear-gradient(to bottom, #f3c555, #8a520d);
    border:1px solid #ffdf78;
    color:#fff3b0;
    font-size:14px;
    letter-spacing:1px;
    text-transform:uppercase;
    box-shadow:
        0 0 10px rgba(255, 196, 62, .65),
        inset 0 1px 0 rgba(255,255,255,.35);
}

.slotOwnerLogTable{
    width:100%;
    margin-top:10px;
    border-collapse:collapse;
    border-spacing:0;
    border:1px solid #ccc;
}

.slotOwnerLogTable th,
.slotOwnerLogTable td{
    border:1px solid #ccc;
    padding:2px 6px;
}

.slotOwnerLogTable th{
    text-align:left;
}

.slotOwnerLogTable td:first-child{
    text-align:left;
}

.slotOwnerLogTable td:last-child{
    text-align:left;
    font-weight:bold;
}

.slotOwnerLogTable tr.slotLogProfit td,
.slotOwnerLogTable tr.slotLogLoss td{
    background:#777 !important;
    color:#000;
}

.slotOwnerLogTable tr.slotLogProfit:nth-child(even) td,
.slotOwnerLogTable tr.slotLogLoss:nth-child(even) td{
    background:#6f6f6f !important;
}

.slotOwnerLogTable tr.slotLogProfit td:last-child{
    color:#d8ffd0;
}

.slotOwnerLogTable tr.slotLogLoss td:last-child{
    color:#ffd0d0;
}

.slotOwnerLogTable .positiveAmount,
.slotOwnerLogTable .negativeAmount{
    color:inherit;
    font-weight:bold;
}

.slotOwnerLogTable tr.slotLogProfit td:first-child{
    border-left:3px solid #5da45d;
}

.slotOwnerLogTable tr.slotLogLoss td:first-child{
    border-left:3px solid #9d4a4a;
}

/* =========================
   Roulette
========================= */

.rouletteContent{
    padding-top:30px;
}

.roulettePageGrid{
    display:flex;
    justify-content:center;
}

.roulettePanel{
    width:1500px;
}

.roulettePlayArea{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:18px;
    padding:14px 10px;
}

.rouletteWheelBox{
    width:220px;
    text-align:center;
    position:relative;
}

.roulettePointer{
    width:0;
    height:0;
    margin:0 auto -4px auto;

    border-left:9px solid transparent;
    border-right:9px solid transparent;
    border-top:0;
    border-bottom:16px solid #ffd46a;

    position:relative;
    z-index:2;
}

.rouletteWheel{
    width:190px;
    height:190px;
    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    border:8px solid #3a1b13;

    background:
        repeating-conic-gradient(
            from 0deg,
            #8b1111 0deg 10deg,
            #111 10deg 20deg,
            #1f6b29 20deg 22deg,
            #111 22deg 30deg
        );

    box-shadow:
        inset 0 0 20px rgba(0,0,0,.85),
        0 2px 5px rgba(0,0,0,.8);

    transition:transform 3.2s cubic-bezier(.12,.78,.18,1);
}

.rouletteWheelInner{
    width:72px;
    height:72px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:#737373;
    border:3px solid #c9a044;

    color:#fff;
    font-size:28px;
    font-weight:bold;
    text-shadow:1px 1px #000;

    box-shadow:inset 0 0 12px rgba(0,0,0,.65);
}

.rouletteBetForm{
    width:1220px;
}

.rouletteBoard{
    display:grid;
    grid-template-columns:96px repeat(12, 96px);
    grid-template-rows:repeat(3, 68px);
    gap:2px;
    justify-content:center;
    margin:0 auto 8px auto;
}

.rouletteNumber{
    width:86px;
    height:58px;
    padding:0;

    color:#fff;
    font-weight:bold;
    text-align:center;

    border:1px solid #111;
    border-radius:0;

    cursor:pointer;
    box-sizing:border-box;
}


.rouletteRed{
    background:#8b1111;
}

.rouletteBlack{
    background:#111;
}

.rouletteOutsideBets{
    width:1222px;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:4px;
    margin:0 auto 8px auto;
}

.rouletteOutsideBets button{
    height:25px;
    font-weight:bold;
}

.rouletteRedBet{
    background:#8b1111 !important;
    color:#fff !important;
}

.rouletteBlackBet{
    background:#111 !important;
    color:#fff !important;
}

.selectedBet{
    outline:2px solid #ffd46a;
    box-shadow:0 0 8px rgba(255,212,106,.7);
}

.rouletteSelected{
    margin:6px 0;
    color:#000;
    font-weight:bold;
    text-align:center;
}

.rouletteBetControls{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;

    color:#000;
    font-weight:bold;
}

.rouletteBetControls input{
    width:110px;
}

.rouletteOwnerPanel{
    width:620px;
}
.rouletteZeroStack{
    grid-row:1 / 4;
    grid-column:1;

    display:grid;
    grid-template-rows:1fr 1fr;
    gap:2px;
}

.rouletteZeroStack .rouletteZero{
    width:100%;
    height:100%;
}

.roulettePanel{
    width:1120px;
}

.roulettePlayArea{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:22px;
    padding:14px 10px;
}

.rouletteBetForm{
    width:820px;
}

.rouletteBoardClassic{
    display:grid;
    grid-template-columns:62px 1fr 74px;
    grid-template-rows:auto auto auto;
    gap:4px;

    width:820px;
    padding:8px;

    background:#202020;
    border:1px solid #111;
    box-shadow:inset 0 0 18px rgba(0,0,0,.55);
    box-sizing:border-box;
}

.rouletteZeroColumn{
    grid-column:1;
    grid-row:1;
    display:grid;
    grid-template-rows:1fr 1fr;
    gap:4px;
}

.rouletteNumbersGrid{
    grid-column:2;
    grid-row:1;

    display:grid;
    grid-template-columns:repeat(12, 52px);
    grid-template-rows:repeat(3, 44px);
    gap:4px;
}

.rouletteColumnBets{
    grid-column:3;
    grid-row:1;

    display:grid;
    grid-template-rows:repeat(3, 44px);
    gap:4px;
}

.rouletteDozens{
    grid-column:2;
    grid-row:2;

    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:4px;
}

.rouletteBottomBets{
    grid-column:1 / 4;
    grid-row:3;

    display:grid;
    grid-template-columns:repeat(6, 1fr);
    gap:4px;
}

.rouletteBetBox{
    min-height:44px;
    padding:2px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;

    background:#191919;
    border:1px solid #555;
    border-radius:4px;

    color:#fff;
    font-size:11px;
    font-weight:bold;
    text-align:center;

    cursor:pointer;
    box-sizing:border-box;
}

.rouletteBetBox span{
    line-height:12px;
}

.rouletteBetBox em{
    width:34px;
    height:18px;
    line-height:18px;

    display:block;

    background:#101010;
    border:1px solid #777;
    border-radius:3px;

    color:#fff;
    font-style:normal;
    font-size:11px;
}

.rouletteBetRed{
    background:#981625;
    border-color:#c94757;
}

.rouletteBetBlack{
    background:#111;
    border-color:#666;
}

.rouletteZeroBox{
    background:#145c37;
    border-color:#39a96a;
    min-height:92px;
    color:#61ff9a;
    font-size:18px;
}

.rouletteSideBet,
.rouletteWideBet,
.rouletteBottomBet{
    background:#1b1515;
    border-color:#5c2c1c;
}

.selectedBet{
    outline:2px solid #ffd46a;
    box-shadow:
        0 0 8px rgba(255,212,106,.8),
        inset 0 0 10px rgba(255,212,106,.25);
}

.crimesGrid{
    display:grid;
    grid-template-columns:repeat(3, 200px);
    gap:22px 34px;
    justify-content:center;
}

.crimeCard{
    width:200px;
    margin:0;
    text-align:center;
}

.crimeImageButton{
    width:200px;
    height:120px;
    padding:0;
    border:1px solid #222;
    background:#111;
    cursor:pointer;
    display:block;
}

.crimeImageButton img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.crimeImageButton:hover{
    filter:brightness(1.12);
}

.crimeExpBar{
    width:150px;
    height:8px;
    margin:7px auto 3px auto;
    background:#2b2b2b;
    border:1px solid #aaa;
    box-sizing:border-box;
}

.crimeExpBar div{
    height:100%;
    background:linear-gradient(to right, #8d3617, #e0a820);
}

.crimeExpText{
    color:#fff;
    font-size:10pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
}

.resultImageBox{
    width:420px;
    max-width:100%;
    margin:12px auto 0 auto;
    text-align:center;
}

.resultImageBox img{
    width:280px;
    max-width:100%;
    max-height:230px;
    object-fit:cover;
    border:1px solid #222;
}

.statsTabs{
    text-align:center;
    margin:22px 0 12px 0;
}

.personalSnapshot{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:8px;
    margin-bottom:14px;
}

.snapshotCard{
    background:#777;
    border:1px solid green;
    padding:8px 10px;
    box-sizing:border-box;
    color:#000;
    font-size:8.5pt;
}

.snapshotCard span{
    display:block;
    color:#111;
}

.snapshotCard strong{
    display:block;
    margin-top:3px;
    color:#fff;
    text-shadow:0 1px 1px #000;
}

.personalStatsGrid{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:18px;
    margin-top:18px;
}

.missionProgressBar,
.achievementProgressBar{
    height:8px;
    background:#222;
    border:1px solid #aaa;
    box-sizing:border-box;
}

.missionProgressBar div,
.achievementProgressBar div{
    height:100%;
    background:linear-gradient(to right, #8d3617, #d9a323);
}

.missionProgressText{
    margin-bottom:3px;
}

.missionClaimedText,
.groupClaimedText{
    color:#d8d8d8;
    font-weight:bold;
}

.statsTabs{
    text-align:center;
    margin:22px 0 12px 0;
}

.personalWideTable{
    min-width:560px;
   margin:0 auto 0 auto;
}

.personalStatsGrid{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:18px;
    margin-top:14px;
}

.personalStatsSmallTable{
    width:auto;
}

.rankupSmallTable{
    width:auto;
}

.personalStatsSmallTable td,
.rankupSmallTable td{
    white-space:nowrap;
}

.missionInlineClaim{
    display:inline-block;
    margin-left:8px;
}

.missionClaimedText{
    margin-left:8px;
    color:#ddd;
    font-weight:bold;
}

.groupClaimBox,
.groupClaimedText{
    width:560px;
    max-width:100%;
    margin:8px auto 0 auto;
    text-align:center;
}

.cleanGameTable{
    border-collapse:collapse !important;
    border-spacing:0 !important;
}

.cleanGameTable th,
.cleanGameTable td{
    border:1px solid #666 !important;
}

.missionClaimedRow td{
    background:#696969  !important;
    color:#b9b9b9;
    opacity:.78;
}

.missionClaimedRow td:first-child{
    text-decoration:none;
    color:#cfcfcf;
}
.missionClaimedRow td:first-child:before{
    content:"✓ ";
    color:#9fd28b;
    font-weight:bold;
}

.missionReadyRow td{
    background:#777 !important;
}

.missionReadyRow td:first-child{
    color:#d8ffd0;
    font-weight:bold;
}

.personalIntro{
    width:560px;
    max-width:100%;
    margin:0 auto 10px auto;
    color:#d8d8d8;
    font-size:8.5pt;
    text-align:center;
}

.personalIntro span{
    color:#fff;
    font-weight:bold;
}
.personalWideTable th:nth-child(2),
.personalWideTable td:nth-child(2){
    width:75px;
    text-align:center;
}

.personalWideTable th:nth-child(3),
.personalWideTable td:nth-child(3){
    white-space:nowrap;
}
.warTableBox{
    width:520px;
    max-width:100%;
    margin:28px auto 0 auto;
}

.warPlayArea{
    background:#777;
    border:1px solid #bcbcbc;
    border-top:0;
    padding:18px 20px;
    text-align:center;
}

.warCards{
    display:flex;
    justify-content:center;
    gap:70px;
    margin-bottom:18px;
}

.warCardSlot{
    color:#fff;
    font-size:9pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
}

.warCardSlot img,
.warCardBack{
    display:block;
    width:71px;
    height:96px;
    margin:8px auto 0 auto;
    border:1px solid #111;
    background:#fff;
}

.warCardBack{
    line-height:100px;
    color:#111;
    font-size:28px;
    font-weight:bold;
}

.warBetForm{
    text-align:center;
}

.warBetForm input{
    width:130px;
}

.warInfo{
    margin-top:12px;
}

.newPageContent{
    padding-top:28px;
}

.propertyTable{
    width:980px;
    margin:0 auto;
}

.propertyTable th,
.propertyTable td{
    height:27px;
    padding:3px 8px;
    box-sizing:border-box;
    white-space:nowrap;
}

.propertyTable th{
    text-align:left;
}

.propertyTable td{
    background:#777;
}

.propertyTable .cityName{
}

.propertyOwnerName{
    color:#fff;
}

.emptyOwner{
    color:#111;
}

.propertySubGrid{
    width:760px;
    max-width:100%;

    margin:18px auto 0 auto;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
    align-items:start;
}

.propertySubGrid .newPanel{
    width:100%;
}

.propertySubTable{
    width:100%;
    font-size:9pt;
}

.propertySubTable th,
.propertySubTable td{
    height:27px;
    padding:3px 8px;
    box-sizing:border-box;
    white-space:nowrap;
}

.propertyInfoTable{
    border-collapse:collapse !important;
    border-spacing:0 !important;

    border:1px solid #bcbcbc !important;
    background:#737373 !important;

    box-shadow:none !important;
    outline:0 !important;
}

.propertyInfoTable th,
.propertyInfoTable td{
    border:1px solid #666 !important;
    box-shadow:none !important;
    outline:0 !important;
}

.propertyInfoTable th{
    height:25px;
    padding:0 5px;

    background:linear-gradient(to bottom, #3a3a3a 0%, #4b170f 42%, #160806 100%);

    color:#fff;
    text-align:left;
}

.propertyInfoTable td{
    height:24px;
    padding:2px 5px;

    background:#777;
    color:#000;
}

.propertyInfoTable .propertyOwnerName{
    color:#fff;
}

.propertyInfoTable .emptyOwner{
    color:#111;
}

.lotteryBox{
    width:820px;
    max-width:100%;
    margin:28px auto 0 auto;
}

.lotteryInfoGrid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;

    background:#777;
    border:1px solid #bcbcbc;
    border-top:0;
    padding:12px;
}

.lotteryCard{
    background:#686868;
    border:1px solid #4f4f4f;
    padding:10px;
    text-align:center;
}

.lotteryName{
    color:#fff;
    font-weight:bold;
    font-size:11pt;
    text-shadow:0 1px 1px #000;
}

.lotteryPot{
    margin:8px 0;
    color:#ffb51d;
    font-size:18pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
}

.lotteryLine{
    color:#000;
    font-size:9pt;
    line-height:20px;
}

.lotteryBuyBox{
    margin-top:14px;
}

.lotteryBuyBox .panelTitle{
    margin:0;
}

.lotteryBuyForm{
    background:#777;
    border:1px solid #bcbcbc;
    border-top:0;
    padding:12px;
    text-align:center;
}

.lotteryBuyForm label{
    color:#000;
    font-weight:bold;
}

.lotteryBuyForm input{
    width:120px;
    height:20px;
    margin:0 8px;
}

.lotterySmallText{
    background:#777;
    border-left:1px solid #bcbcbc;
    border-right:1px solid #bcbcbc;
    border-bottom:1px solid #bcbcbc;
    padding:6px;
    color:#000;
    font-size:8.5pt;
    text-align:center;
}

.doubleUpBox{
    width:740px;
    max-width:100%;
    margin:28px auto 0 auto;
}

.doubleUpInner{
    background:#777;
    border:1px solid #bcbcbc;
    border-top:0;
    padding:14px 18px 18px 18px;
    text-align:center;
}

.diceRow{
    display:flex;
    justify-content:center;
    gap:6px;
    margin-bottom:16px;
}

.die{
    width:48px;
    height:48px;
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    grid-template-rows:repeat(3, 1fr);
    gap:2px;
    padding:5px;
    box-sizing:border-box;
    background:#eee;
    border:2px solid #111;
    border-radius:4px;
}

.die span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#111;
    align-self:center;
    justify-self:center;
    opacity:0;
}

.die1 span:nth-child(5),
.die2 span:nth-child(1),
.die2 span:nth-child(9),
.die3 span:nth-child(1),
.die3 span:nth-child(5),
.die3 span:nth-child(9),
.die4 span:nth-child(1),
.die4 span:nth-child(3),
.die4 span:nth-child(7),
.die4 span:nth-child(9),
.die5 span:nth-child(1),
.die5 span:nth-child(3),
.die5 span:nth-child(5),
.die5 span:nth-child(7),
.die5 span:nth-child(9),
.die6 span:nth-child(1),
.die6 span:nth-child(3),
.die6 span:nth-child(4),
.die6 span:nth-child(6),
.die6 span:nth-child(7),
.die6 span:nth-child(9){
    opacity:1;
}

.doubleUpStats{
    display:flex;
    justify-content:center;
    gap:18px;
    margin-bottom:12px;
    color:#fff;
    font-size:9pt;
}

.doubleUpStats strong{
    color:#000;
    font-weight:normal;
}

.doubleUpForm,
.doubleUpActions{
    margin-top:10px;
}

.doubleUpForm input{
    width:160px;
}

.doubleUpActions{
    display:flex;
    justify-content:center;
    gap:18px;
}

.doubleUpInfo{
    margin-top:14px;
}

.diceImage{
    width:52px;
    height:52px;
    object-fit:contain;
    display:block;
}

.mailButton:disabled,
.but:disabled{
    opacity:.45;
    cursor:default;
}

.crimePageHeader{
    width:760px;
    max-width:100%;
    margin:22px auto 12px auto;
    text-align:center;
}

.crimePageTitle{
    color:#fff;
    font-size:14pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
}

.crimePageSub{
    margin-top:3px;
    color:#d0d0d0;
    font-size:8.5pt;
}

.crimesGrid{
    width:760px;
    max-width:100%;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:18px 22px;
}

.crimeCard{
    margin:0;
    padding:0;
    background:#777;
    border:1px solid #555;
    box-sizing:border-box;
}

.crimeImageButton{
    width:100%;
    display:block;
    padding:0;
    margin:0;
    background:none;
    border:0;
    cursor:pointer;
}

.crimeImageButton img{
    width:100%;
    height:118px;
    display:block;
    object-fit:cover;
    border-bottom:1px solid #444;
    filter:contrast(1.08) brightness(.92);
}

.crimeImageButton:hover img{
    filter:contrast(1.15) brightness(1.05);
}

.crimeCardBody{
    padding:7px 8px 8px 8px;
    box-sizing:border-box;
}

.crimeName{
    color:#fff;
    font-size:9pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
    margin-bottom:5px;
}

.crimeMeta{
    display:flex;
    justify-content:space-between;
    gap:8px;
    color:#000;
    font-size:8pt;
    line-height:16px;
}

.crimeReward{
    color:#111;
    font-size:8pt;
    line-height:16px;
}

.crimeStatus{
    margin:4px 0;
    color:#ffb51d;
    font-size:8pt;
    font-weight:bold;
}

.crimeRiskLow{
    color:#0d3b00;
    font-weight:bold;
}

.crimeRiskMedium{
    color:#5a3a00;
    font-weight:bold;
}

.crimeRiskHigh{
    color:#650000;
    font-weight:bold;
}

.crimeExpBar{
    height:8px;
    background:#303030;
    border:1px solid #bcbcbc;
    box-sizing:border-box;
    overflow:hidden;
}

.crimeExpBar div{
    height:100%;
    background:linear-gradient(to right, #8b3b1d, #ffbd23);
}

.crimeExpText{
    margin-top:3px;
    color:#fff;
    font-size:8pt;
    font-weight:bold;
    text-align:center;
    text-shadow:0 1px 1px #000;
}

.forumContent{
    padding:24px 24px 0 24px;
    box-sizing:border-box;
}

.forumLayout{
    width:100%;
    display:grid;
    grid-template-columns:52% 48%;
    gap:34px;
    align-items:start;
}

.forumLeft,
.forumRight{
    min-width:0;
}

.forumTopicTable{
    width:100%;
}

.forumTopicTable th:first-child{
    width:auto;
}

.forumRepliesHeader,
.forumReplies{
    width:58px;
    text-align:center !important;
}

.forumTopicLink{
    color:#000;
    text-decoration:none;
}

.forumTopicLink:hover{
    text-decoration:underline;
}

.forumHeaderLink{
    color:#fff;
    text-decoration:none;
    font-weight:bold;
}

.forumHeaderLink:hover{
    text-decoration:underline;
}

.forumSideBox{
    width:100%;
    margin:0 0 16px 0;
}

.forumShoutbox{
    min-height:360px;
    max-height:440px;
    overflow-y:auto;

    background:#737373;
    border-left:1px solid #bcbcbc;
    border-right:1px solid #bcbcbc;
    padding:4px 6px;

    color:#000;
    font-size:8.5pt;
    box-sizing:border-box;
}

.forumShoutbox span{
    color:#fff;
    font-weight:bold;
}

.forumShoutInput{
    display:flex;
    gap:6px;

    background:#737373;
    border-left:1px solid #bcbcbc;
    border-right:1px solid #bcbcbc;
    border-bottom:1px solid #bcbcbc;
    padding:5px;
    box-sizing:border-box;
}

.forumShoutInput input[type="text"]{
    flex:1;
    height:20px;
    box-sizing:border-box;
}

.forumRules{
    background:#737373;
    border-left:1px solid #bcbcbc;
    border-right:1px solid #bcbcbc;
    border-bottom:1px solid #bcbcbc;
    padding:4px 6px;

    color:#000;
    font-size:8.5pt;
    box-sizing:border-box;
}

.forumPages{
    margin-top:4px;
    color:#fff;
    font-size:8.5pt;
}

.forumPages a,
.forumPages span{
    margin-right:4px;
    color:#fff;
}

.forumTopicContent{
    padding:24px 24px 0 24px;
    box-sizing:border-box;
}

.forumTopicLayout{
    width:100%;
    display:grid;
    grid-template-columns:50% 50%;
    gap:34px;
    align-items:start;
}

.forumPostColumn{
    min-width:0;
}

.forumPostBox{
    width:100%;
    margin:0 0 14px 0;
    background:#737373;
    border:1px solid #bcbcbc;
    box-sizing:border-box;
}

.forumPostHeader{
    min-height:19px;
    line-height:19px;
    padding:0 6px;
    box-sizing:border-box;

    background:url("../images/cell_bg.jpg") repeat-x;
    color:#fff;
    font-size:8.5pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
}

.forumPostHeader a{
    color:#fff;
    text-decoration:none;
    font-weight:normal;
    margin-left:6px;
}

.forumPostHeader a:hover{
    text-decoration:underline;
}

.forumPostBody{
    min-height:44px;
    padding:5px 6px;
    box-sizing:border-box;

    color:#000;
    font-size:9pt;
    line-height:17px;
}

.forumReplyBox{
    width:100%;
    margin-top:18px;
    background:#737373;
    border:1px solid #bcbcbc;
    box-sizing:border-box;
}

.forumSmilies{
    padding:3px 6px;
    text-align:right;
    font-size:9pt;
}

.forumReplyBox textarea{
    width:100%;
    height:135px;
    display:block;
    box-sizing:border-box;
    resize:vertical;
}

.forumReplyBottom{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:8px;

    padding:4px 5px;
    color:#fff;
    font-size:8.5pt;
    box-sizing:border-box;
}

/* Forum topic page */
.forumContent{
    padding:24px 24px 0 24px;
    box-sizing:border-box;
}

.forumLayout{
    width:100%;
    display:grid;
    grid-template-columns:50% 50%;
    gap:34px;
    align-items:start;
}

.forumLeft,
.forumRight{
    min-width:0;
}

.forumTopicTable{
    width:100%;
}

.forumRepliesHeader,
.forumReplies{
    width:58px;
    text-align:center !important;
}

.forumTopicLink{
    color:#000;
    text-decoration:none;
}

.activeTopicRow td{
    background:#9a9a9a;
    font-weight:bold;
}

.forumHeaderLink{
    color:#fff;
    text-decoration:none;
    font-weight:bold;
}

.forumPost{
    width:100%;
    margin:0 0 14px 0;

    background:#777;
    border:1px solid #bcbcbc;
    box-sizing:border-box;
}

.forumPostHeader{
    min-height:19px;
    line-height:19px;

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:0 6px;
    box-sizing:border-box;

    background:url("../images/cell_bg.jpg") repeat-x;
    color:#fff;

    font-size:8.5pt;
    font-weight:bold;
    text-shadow:0 1px 1px #000;
}

.forumPostActions a{
    color:#fff;
    text-decoration:none;
    font-weight:normal;
    margin-left:8px;
}

.forumPostBody{
    min-height:42px;
    padding:5px 6px;
    box-sizing:border-box;

    color:#000;
    font-size:9pt;
    line-height:17px;
}

.staffForumPost .forumPostBody{
    background:#6f5b5b;
    color:#fff;
}

.forumReplyBox{
    width:100%;
    margin-top:18px;

    background:#777;
    border:1px solid #bcbcbc;
    box-sizing:border-box;
}

.forumEmojiRow{
    padding:3px 6px;
    text-align:right;
    font-size:9pt;
}

.forumReplyBox textarea{
    width:100%;
    height:135px;
    display:block;
    box-sizing:border-box;
    resize:vertical;
}

.forumReplyBottom{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:8px;

    padding:4px 5px;
    box-sizing:border-box;

    color:#fff;
    font-size:8.5pt;
}

.forumPages{
    margin-top:4px;
    color:#fff;
    font-size:8.5pt;
}

.forumPages a,
.forumPages span{
    margin-right:4px;
    color:#fff;
}

/* ========================= Booze ========================= */

.boozeBox{
    width:760px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.boozeStatus{
    margin-bottom:6px;
    color:#fff;
    font-size:8.5pt;
    text-align:center;
}

.boozeMarketNotice{
    width:100%;
    margin:0 auto 8px auto;
    padding:5px 8px;
    box-sizing:border-box;

    background:#565656;
    border:1px solid #999;

    color:#fff;
    font-size:8pt;
    text-align:center;
}

.boozeMarketNotice strong{
    color:#ffd46a;
}

.boozeGrid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:6px;
}

.boozeCard{
    position:relative;

    min-height:158px;
    padding:6px 7px;
    box-sizing:border-box;

    background:#707070;
    border:1px solid #999;

    text-align:center;
}

.boozeCard.boozeHot{
    border-color:#d69a28;
    background:#746b58;
    box-shadow:none;
}

.boozeHotLabel{
    position:absolute;
    top:4px;
    left:4px;
    right:4px;

    height:15px;
    line-height:15px;

    background:#3a2b14;
    border:1px solid #9b6a1b;

    color:#ffd46a;
    font-size:7pt;
    font-weight:bold;
    text-align:center;
}

.boozeImageBox{
    width:76px;
    height:76px;
    margin:8px auto 4px auto;

    display:flex;
    align-items:center;
    justify-content:center;
}

.boozeImageBox img{
    max-width:76px;
    max-height:76px;
    object-fit:contain;
    display:block;
}

.boozeName{
    margin-bottom:4px;

    color:#fff;
    font-size:8.5pt;
    font-weight:bold;
}

.boozePrices{
    width:130px;
    max-width:100%;
    margin:0 auto;

    color:#000;
    font-size:7.5pt;
    line-height:14px;
}

.boozePriceRow{
    display:flex;
    justify-content:space-between;
    gap:8px;

    padding:0 2px;
    box-sizing:border-box;
}

.boozeHolding{
    margin-top:1px;
    color:#111;
}

.boozePrices strong{
    color:#fff;
    font-weight:bold;
}

.boozeCard input{
    width:62px;
    height:18px;
    margin-top:5px;
    box-sizing:border-box;

    background:#d8d8d8;
    border:1px solid #222;

    color:#000;
    font-size:8pt;
    text-align:center;
}

.boozeActions{
    margin-top:10px;
    text-align:center;
}

.boozeMapHot{
    color:#ffcc33;
    font-weight:bold;
    background:#4a250f;
}

.boozeMapPrice{
    color:#fff;
}

.boozeMapBox{
    margin-top:14px;
}

.boozeMapTitle{
    margin-bottom:5px;
    font-weight:bold;
    text-align:center;
    color: #FFF;
}

.boozeMapLocked{
    padding:10px;
    box-sizing:border-box;

    background:#5f5f5f;
    border:1px solid #aaa;
    line-height:18px;
    text-align:center;
}

.boozeMapLocked form{
    margin-top:8px;
}

.boozeMapTable{
    width:100%;
        border-collapse:collapse;
    border-spacing:0;
    border:1px solid #bcbcbc;
}

.boozeMapTable th,
.boozeMapTable td{
    border:1px solid #bcbcbc;
    text-align:center;
    font-size:9.0pt;
}

.boozeMapTable td:first-child,
.boozeMapTable th:first-child{
    text-align:left;
}

.boozeMapHot{
    background:#4a250f !important;
    color:#ffcc33 !important;
    font-weight:bold;
}

.boozeMapExpires{
    margin-top:5px;
    text-align:center;
}

/* ========================= Online Players ========================= */
.onlinePlayersBox{
    width:1100px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.playerSearchForm{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;

    color:#000;
}

.playerSearchForm label{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:3px;
}

.playerSearchForm input,
.playerSearchForm select{
    width:160px;
    height:20px;
    box-sizing:border-box;

    background:#d8d8d8;
    border:1px solid #222;

    color:#000;
}

.onlinePlayerList{
    padding:8px 12px;
    box-sizing:border-box;

    color:#fff;
    line-height:19px;
    text-align:center;
}

.onlineName{
    color:#fff;
    font-weight:bold;
    text-decoration:none;
}

.onlineSeparator{
    margin:0 6px;
    color:#111;
}

.onlineAdmin{
    color:#ff9c00 !important;
    font-weight:bold;
}

.onlineSelf{
    color:#ff3333 !important;
    font-weight:bold;
}

.onlineLegend{
    margin-top:12px;
    padding-bottom:8px;

    color:#000;
    line-height:18px;
    text-align:center;
}

.onlineEmpty{
    padding:12px;
    color:#000;
    text-align:center;
}
.playerSearchResultsText{
    margin-top:12px;

    color:#000;
    line-height:17px;
    text-align:center;
}

.playerSearchResultsText .onlineName{
    color:#fff;
    font-weight:normal;
}

/* ========================= Game Statistics ========================= */
.statisticsPage{
    width:980px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.statisticsGrid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    align-items:start;
}

.statisticsGridBottom{
    margin-top:14px;
}

.statisticsNetworkBox{
    width:520px;
    max-width:100%;
    margin:14px auto 0 auto;
}

.statisticsFooterLink{
    margin-top:7px;
    text-align:center;
}

.statisticsPage .gameTable td,
.statisticsPage .gameTable th{
    padding:3px 5px;
}

/* Statistics tables zonder dubbele borders */
.statisticsPage .panel{
    border:1px solid #aaa;
    background:#7a7a7a;
}

.statisticsPage .panelTitle{
    border-left:0;
    border-right:0;
    border-top:0;
}

.statisticsPage .gameTable{
    width:auto;
    border:0;
    border-collapse:collapse;
}

.statisticsPage .gameTable th{
    background:#3f3f3f;
    border:1px solid #666;
    text-align:left;
}

.statisticsPage .gameTable td{
    border:1px solid #aaa;
}

.statisticsPage .gameTable tr:first-child th{
    border-top:0;
}

.statisticsPage .gameTable tr td:first-child,
.statisticsPage .gameTable tr th:first-child{
    border-left:0;
}

.statisticsPage .gameTable tr td:last-child,
.statisticsPage .gameTable tr th:last-child{
    border-right:0;
}

.statisticsPage .panel .gameTable{
    width:100%;
}

.statisticsPage .panel .gameTable th,
.statisticsPage .panel .gameTable td{
    padding:4px 6px;
}

.statisticsPage .gameTable td:last-child,
.statisticsPage .gameTable th:last-child{
    text-align:left;
}

.statisticsPage .gameTable td:last-child{
    width:90px;
}

/* ========================= Bank ========================= */
.bankPage{
    width:980px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.bankMainPanel{
    text-align:center;
    color:#000;
    
}

.bankIntro{
    margin:8px 0 18px 0;
}

.bankTransferForm,
.bankDepositForm{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:7px;
    margin-bottom:14px;
}

.bankTransferForm label{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:3px;
}

.bankTransferForm input,
.bankTransferForm select,
.bankDepositForm input{
    width:170px;
    height:20px;
    box-sizing:border-box;
    background:#d8d8d8;
    border:1px solid #222;
    color:#000;
}

.bankAccountBox{
    margin:10px 0;
    line-height:18px;
}

.interestRatesTitle,
.bankHistoryTitle,
.bankSubTitle{
    margin:12px 0 4px 0;
    font-weight:bold;
    text-align:center;
}

.interestRateTable{
    width:260px;
    margin:0 auto 8px auto;
}

.bankHistoryGrid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:start;
    margin-top:8px;
}

.bankHistoryGrid .gameTable{
    width:100%;
}

.bankToggleRates{
    margin:4px auto 6px auto;
    display:block;

    background:none;
    border:0;
    text-decoration:none;
    cursor:pointer;
}

.bankToggleRates:hover{
    text-decoration:underline;
}
.jailBox{
    width:520px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.jailReload{
    margin-bottom:3px;
    text-align:center;
    color:#fff;
}

.jailReload a{
    color:#fff;
    text-decoration:none;
}

.jailTable{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
}

.jailTable th,
.jailTable td{
    height:20px;
    padding:2px 4px;
    box-sizing:border-box;
    border:1px solid #b7b7b7;
}

.jailTable a{
    color:#fff;
    font-weight:bold;
    text-decoration:none;
}

.inlineForm{
    margin:0;
    padding:0;
}

.textActionButton{
    padding:0;
    margin:0;

    background:none;
    border:0;

    color:#fff;
    font:inherit;
    text-decoration:none;

    cursor:pointer;
}

.jailAdmin td{
    background:#8a5b24;
}

.jailFriend td{
    background:#7f9f72;
}

.jailNetwork td{
    background:#8670a8;
}

button.textActionButton,
button.textActionButton:hover,
button.textActionButton:focus,
button.textActionButton:active{
    min-height:0;
    height:auto;

    padding:0;
    margin:0;

    background:transparent !important;
    border:0 !important;
    border-radius:0;
    box-shadow:none;
    outline:none;

    color:#fff !important;

    font-family:Verdana, Arial, sans-serif;
    font-size:8.5pt;
    font-weight:normal;
    line-height:normal;

    cursor:pointer;
}

button.textActionButton:hover{
    color:yellow !important;
    text-decoration:none;
}

.bulletFactoryBox{
    width:620px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.ammoMarket{
    width:500px;
    max-width:100%;
    margin:8px auto 12px auto;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.ammoCard{
    background:#686868;
    border:1px solid #aaa;
    padding:8px;
    box-sizing:border-box;
    text-align:center;
}

.ammoType{
    color:#fff;
    font-size:14pt;
    font-weight:bold;

}

.ammoName{
    margin:2px 0 8px 0;
    color:#111;
    font-size:8pt;
    font-weight:bold;
}

.ammoData{
    display:flex;
    justify-content:space-between;
    align-items:center;

    width:145px;
    margin:3px auto;

    color:#000;
    font-size:8.5pt;
}

.ammoData strong{
    color:#fff;
}

.bulletBuyForm{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin:10px 0;
}

.bulletBuyForm input{
    width:110px;
}

.bulletBuyForm select{
    width:130px;
}

.bulletOwnerPanel{
    width:420px;
}

.bulletPriceGrid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-bottom:8px;
}

.bulletPriceGrid label{
    display:flex;
    flex-direction:column;
    gap:3px;
    color:#000;
    font-weight:bold;
}

.bulletPriceGrid input{
    width:100%;
}

.creditStorePage{
    width:860px;
    max-width:100%;
    margin:24px auto 0 auto;
}

.creditStoreIntro{
    margin-bottom:12px;
    padding:10px;
    box-sizing:border-box;

    background:#737373;
    border:1px solid #aaa;

    color:#000;
    text-align:center;
}

.creditStoreTitle{
    color:#fff;
    font-size:13pt;
    font-weight:bold;
}

.creditStoreBalance{
    margin-top:5px;
    color:#000;
    font-size:9pt;
}

.creditStoreBalance strong{
    color:#fff;
}

.creditStoreText{
    margin-top:4px;
    color:#111;
    font-size:8pt;
}

.creditCategory{
    margin-bottom:14px;
    background:#737373;
    border:1px solid #aaa;
}

.creditItemGrid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
    padding:8px;
    box-sizing:border-box;
}

.creditItemCard{
    min-height:112px;
    padding:8px;
    box-sizing:border-box;

    background:#686868;
    border:1px solid #999;

    text-align:center;
}

.creditItemName{
    color:#fff;
    font-size:9pt;
    font-weight:bold;
}

.creditItemDesc{
    min-height:32px;
    margin:6px 0;

    color:#111;
    font-size:8pt;
    line-height:15px;
}

.creditItemCost{
    margin-bottom:7px;

    color:#ffd46a;
    font-size:8.5pt;
    font-weight:bold;
}

.gtaResultImage,
.gtaCooldownImage{
    margin:12px auto 16px auto;
}

.gtaResultImage img,
.gtaCooldownImage img{
    max-width:300px;
    max-height:200px;
    border:1px solid #333;
    object-fit:cover;
}

.gtaResultImage img,
.gtaCooldownImage img{
    width:300px;
    height:150px;
    object-fit:cover;
    display:block;
    margin:0 auto;
    border:0;
    border:1px solid #000;
}

.actionResultText{
    margin:0 auto 10px auto;
    font-size:9pt;
    font-weight:bold;
    text-align:center;
    letter-spacing:0;
}

.actionResultSuccess{
    color:#9ee27d;
}

.actionResultError{
    color:#f1a0a0;
}

.gtaPage{
    width:520px;
    max-width:100%;
    margin:28px auto 0 auto;
    text-align:center;
}

.gtaTable{
    width:100%;
    margin:0 auto;
}

.gtaTable td{
    height:24px;
    padding:3px 6px;
    box-sizing:border-box;
    color:#000;
}

.gtaRadioCell{
    width:28px;
    text-align:center;
}

.gtaChanceCell{
    width:90px;
    text-align:right;
    color:#fff !important;
    font-weight:bold;
}

.gtaButtonCell{
    padding:8px 0 !important;
    text-align:center;
}

.gtaBoard{
    width:980px;
    max-width:100%;
    margin:35px auto 0 auto;

    display:grid;
    grid-template-columns:520px 340px;
    gap:18px;
    align-items:start;
    justify-content:center;
}

.gtaMainPanel,
.gtaSmallPanel{
    background:#777;
    border:1px solid #b8b8b8;
}

.gtaOptionList{
    padding:12px;
}

.gtaOptionRow{
    display:flex;
    align-items:center;
    gap:10px;

    min-height:28px;
    padding:6px 12px;
    border-bottom:1px solid #999;

    color:#000;
    cursor:pointer;
}

.gtaOptionRow:last-child{
    border-bottom:0;
}

.gtaOptionRow:hover{
    background:#868686;
}

.gtaOptionRow input{
    margin:0;
}

.gtaSubmitRow{
    padding:10px;
    text-align:center;
}

.gtaSidePanels{
    width:340px;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.gtaInfoTable{
    width:100%;
    border-collapse:collapse;
}

.gtaInfoTable td{
    padding:5px 8px;
    color:#000;
    font-size:8.5pt;
}

.gtaInfoTable td:first-child{
    font-weight:bold;
    width:55%;
}

.gtaGarageHint{
    padding:0 8px 10px 8px;
    color:#111;
    font-size:8pt;
    text-align:center;
}

.gtaNetworkSelect{
    display:none;
    padding:0 12px 8px 38px;
    border-bottom:1px solid #999;
}

.gtaNetworkSelect select{
    width:220px;
    height:22px;
    font-size:8.5pt;
}

.garageBox{
    width:920px;
    max-width:100%;
    margin:26px auto 0 auto;
}

.garageTable{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
}

.garageTable th,
.garageTable td{
    border:1px solid #bfbfbf;
    padding:2px 5px;
    font-size:8pt;
    line-height:15px;
    height:20px;
    vertical-align:middle;
}

.garageTable th{
    padding:0 5px;
    height:20px;
    line-height:20px;
}

.garageTable th:first-child,
.garageTable td:first-child{
    width:28px;
    text-align:center;
    padding:0;
}

.garageTable th:nth-child(4),
.garageTable td:nth-child(4){
    width:70px;
}

.garageTable th:nth-child(6),
.garageTable td:nth-child(6){
    width:70px;
}

.garageTable th:nth-child(7),
.garageTable td:nth-child(7){
    width:72px;
    text-align:center;
    padding:1px;
}

.garageTable td{
    vertical-align:middle;
}

.garageCarImage{
    width:42px;
    height:28px;
    object-fit:cover;
    display:block;
    margin:0 auto;
    transition:transform .15s ease, box-shadow .15s ease;
    position:relative;
    z-index:1;
}

.garageCarImage:hover{
    transform:scale(8);
    z-index:20;
    box-shadow:0 0 8px #000;
}

.mutedRow{
    color:#2b2b2b;
    opacity:.65;
}

.garageActions{
    margin:14px 0 10px 0;
    text-align:center;
}

.garageActions button,
.garageTransferBox button{
    margin:2px;
}

.garageTransferBox{
    text-align:center;
    font-size:8.5pt;
    line-height:24px;
}

.garageTransferBox input{
    width:160px;
}

.garageTransferBox select{
    min-width:170px;
}

.garagePages{
    margin:5px 0 10px 0;
    font-size:8.5pt;
    color:#fff;
    text-align:left;
}

.garagePages a,
.garagePages span{
    margin-right:5px;
    color:#fff;
    text-decoration:none;
}

.garagePages span{
    font-weight:bold;
}

.garagedCarRow td{
    background:#6f765f;
    color:#111;
}

.garagedCarRow td a,
.garagedCarRow td span{
    color:#111;
}

.garageIcon{
    display:inline-block;
    margin-left:5px;
    color:#f4d27a;
    font-size:14pt;
    font-weight:bold;
}

.garageInfoLine{
    padding:4px 6px;
    border-left:1px solid #bfbfbf;
    border-right:1px solid #bfbfbf;
    background:#6f6f6f;
    color:#fff;
    font-size:8pt;
    text-align:center;
}

.garageInfoLine strong{
    color:#fff;
}

.privateGarageTitle{
    margin-top:18px;
}

.garageNoPrivate{
    width:920px;
    max-width:100%;
    margin:16px auto 0 auto;
    padding:5px 8px;
    box-sizing:border-box;

    background:#777;
    border:1px solid #bfbfbf;

    color:#fff;
    font-size:8pt;
    text-align:center;
}

.businessHQ{
    width:850px;
    margin:30px auto 0 auto;
    background:#7c7c7c;
    border:1px solid #aaa;
}

.businessIntro{
    padding:12px;
    text-align:center;
    font-size:9pt;
}

.businessCards{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:10px;
    padding:10px;
}

.businessCard{
    background:#686868;
    border:1px solid #aaa;
    padding:12px;
    text-align:center;
}

.businessCardTitle{
    color:#fff;
    font-weight:bold;
    font-size:10pt;
    margin-bottom:8px;
}

.businessPrice{
    color:#ffd46a;
    font-weight:bold;
    margin-bottom:8px;
}

.businessMeta{
    font-size:8.5pt;
    margin-bottom:8px;
}

.businessStatus{
    display:inline-block;
    padding:3px 10px;
    font-size:8pt;
    font-weight:bold;
}

.businessStatus.available{
    background:#bfdc9b;
    color:#173000;
}

.businessStatus.full{
    background:#d79a9a;
    color:#3a0000;
}

.businessStatus.owned{
    background:#d8cc8a;
    color:#2f2500;
}

.businessCreateBox{
    border-top:1px solid #999;
    padding:14px 12px 18px 12px;
    text-align:center;
}

.businessSubTitle{
    color:#fff;
    font-weight:bold;
    margin-bottom:10px;
}

.businessForm{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
}

.businessFormRow{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.businessForm label{
    font-size:8.5pt;
    font-weight:bold;
    color:#fff;
}

.businessForm input,
.businessForm select{
    height:23px;
    min-width:190px;
    box-sizing:border-box;
}

.businessCrusherBox .centerText{
    padding:0 0 16px 0;
    text-align:center;
}

.businessCrusherBox .mailButton{
    margin-top:4px;
}

/* =========================
   Inbox
========================= */

.inboxBox{
    width:900px;
    max-width:100%;
    margin:0 auto;
}

.inboxActionsTop{
    margin-bottom:6px;
}

.inboxActionsBottom{
    margin-top:8px;
    text-align:left;
}

.inboxTable{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
}

.inboxTable th,
.inboxTable td{
    border:1px solid #bfbfbf;
    padding:4px 6px;
    font-size:8.5pt;
}

.inboxTable th{
    height:21px;
    line-height:21px;
    padding:0 6px;
    box-sizing:border-box;
    vertical-align:middle;
}

.inboxTable td{
    height:22px;
    line-height:16px;
    box-sizing:border-box;
    vertical-align:middle;
}

.inboxCheck{
    width:28px;
    text-align:center;
    padding:0 !important;
}

.inboxTable a{
    color:#fff;
    font-weight:bold;
}

.inboxTable a:hover{
    color:yellow;
}

.inboxTable tr.newMessage td{
    background:#ae9761;
    font-weight:bold;
}

.inboxPages{
    margin-top:5px;
    color:#fff;
    font-size:8.5pt;
}

.inboxPages a,
.inboxPages span{
    margin-right:5px;
    color:#fff;
}
.headerAction.hasHeaderMessages .headerActionCount{
    min-width:16px;
    height:16px;
    line-height:16px;

    top:7px;
    left:24px;

    padding:0 4px;
    box-sizing:border-box;

    background:#b00000;
    border:1px solid #ffb3b3;
    border-radius:8px;

    color:#fff;
    font-size:10px;
    font-weight:bold;
    text-align:center;

    animation:headerMessagePulse .8s infinite alternate;
}

@keyframes headerMessagePulse{
    from{
        filter:brightness(1);
    }

    to{
        filter:brightness(1.6);
    }
}

.headerAction.hasHeaderMessages .headerActionIcon{
    color:#ffdf4d;
    animation:headerEnvelopeBlink .8s infinite alternate;
}

@keyframes headerEnvelopeBlink{
    from{
        color:#ffdf4d;
        filter:brightness(1);
    }

    to{
        color:#ff3333;
        filter:brightness(1.5);
    }
}

/* =========================
   View Message
========================= */

.messageViewPage{
    width:780px;
    max-width:100%;
    margin:0 auto;
}

.messageViewPage .panelTitle{
    text-align:left;
    padding-left:8px;
}

.messageViewPage .panelTitle span{
    float:right;
    padding-right:8px;
    font-weight:normal;
}

.messageViewTitle{
    text-align:left;
    padding-left:6px;
}
.messageViewActionsTop{
    width:760px;
}

.messageBodyBox{
    min-height:70px;

    background:#7d7d7d;
    border-left:1px solid #bfbfbf;
    border-right:1px solid #bfbfbf;
    border-bottom:1px solid #bfbfbf;

    padding:6px 6px 8px 6px;
    box-sizing:border-box;

    color:#000;
    line-height:17px;
}

.messageViewActions{
    margin-top:8px;
    text-align:center;
}
/* =========================
   Network Information
========================= */

.networkInfoBox{
    width:620px;
    max-width:100%;
    margin:0 auto;
}

.networkInfoText{
    margin-bottom:8px;

    color:#fff;
    font-size:8.5pt;
    line-height:17px;
    text-align:center;
}

.networkInfoText strong{
    color:#fff;
}

.networkInfoTable{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
}

.networkInfoTable th,
.networkInfoTable td{
    border:1px solid #bfbfbf;
    padding:3px 5px;

    font-size:8.5pt;
    line-height:15px;
}

.networkInfoTable th{
    height:21px;
    line-height:21px;
    padding:0 5px;
}

.networkInfoTable td:nth-child(1),
.networkInfoTable td:nth-child(4),
.networkInfoTable td:nth-child(5),
.networkInfoTable td:nth-child(6){
    text-align:left;
}

/* =========================
   Network Headquarters
========================= */

.networkHqBox{
    width:900px;
    max-width:100%;
    margin:0 auto 16px auto;

    background:#777;
    border:1px solid #bcbcbc;
    box-sizing:border-box;

    color:#000;
}

.networkHqBox .panelTitle{
    margin:0;
    border-left:0;
    border-right:0;
    border-top:0;
    text-align:center;
}

.networkHqText{
    padding:12px 18px 8px 18px;

    color:#000;
    line-height:18px;
    text-align:center;
}

.networkHqText strong{
    color:#000;
    font-weight:bold;
}

.centerActions{
    padding:0 0 14px 0;

    color:#000;
    font-size:8.5pt;
    line-height:18px;
    text-align:center;
}

.centerActions strong{
    display:block;
    margin:4px 0 2px 0;

    color:#fff;
    font-size:9pt;
    font-weight:bold;
}

.centerActions input[type="number"],
.centerActions select{
    width:165px;
    height:21px;
    margin:2px 0;
    box-sizing:border-box;
}

.centerActions button{
    margin-top:3px;
}
.networkHistoryToggle{
    margin:10px 0 4px 0;
    color:#fff;
    font-size:8.5pt;
    text-align:center;
    cursor:pointer;
}

.networkHistoryToggle:hover{
    text-decoration:underline;
}

.networkHistoryBox{
    display:none;
    width:460px;
    max-width:100%;
    margin:0 auto 12px auto;
    text-align:center;
}

.networkHistoryBox.isOpen{
    display:block;
}

.networkHistoryTable{
    width:100%;
    margin-top:4px;
}

.networkHistoryTable th,
.networkHistoryTable td{
    font-size:8.5pt;
    text-align:left;
}

.networkDetailsBox{
    width:900px;
    max-width:100%;
    margin:0 auto;

    background:#777;
    border:1px solid #bcbcbc;
    box-sizing:border-box;

    color:#000;
}

.networkDetailsBox .panelTitle{
    margin:0;
    text-align:center;
}

.networkInfoDetails{
    display:block;
    min-height:260px;

    padding:10px 14px 16px 14px;
    box-sizing:border-box;

    background:#777;
    color:#000;
    text-align:center;
}

.networkSectionTitle{
    margin:4px 0 18px 0;
    color:#000;
    font-size:9pt;
    font-weight:bold;
}

.networkStructureGrid{
    width:430px;
    max-width:100%;
    margin:0 auto 34px auto;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px 26px;

    color:#000;
    text-align:left;
}

.networkStructureGrid strong{
    color:#000;
    font-weight:bold;
}

.networkLegend{
    margin-bottom:18px;
    color:#000;
}

.networkMembersList{
    width:650px;
    max-width:100%;
    margin:0 auto 18px auto;

    color:#fff;
    line-height:20px;
    text-align:center;
}

.networkMembersList a{
    color:#fff;
    text-decoration:none;
}

.networkMemberDivider{
    margin:0 8px;
    color:#000;
}

.networkOnline{
    color:#7dff7d !important;
}

.networkTotals{
    margin-top:8px;
    color:#000;
}

.networkLeaveForm{
    margin-top:16px;
    text-align:center;
}

.networkStructureGrid a{
    color:#fff;
    text-decoration:none;
}

.networkJoinIntro{
    margin:0 0 14px 0;
    color:#000;
    line-height:17px;
    text-align:center;
}

.networkJoinTable{
    width:735px;
    max-width:100%;
    margin:0 auto 16px auto;
}

.networkJoinTable th,
.networkJoinTable td{
    text-align:center;
}

.networkJoinTable td:first-child,
.networkJoinTable th:first-child{
    text-align:left;
}

.networkJoinTable form{
    margin:0;
}

.networkCreateInfo{
    margin:10px 0 10px 0;
    color:#000;
    line-height:18px;
    text-align:center;
}

.networkCreateForm{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:6px;
    margin:0;
}

.networkCreateForm input{
    width:180px;
}

.networkTabs{
    width:900px;
    max-width:100%;
    margin:0 auto 12px auto;
    text-align:center;
}

.networkTabs .mailButton{
    margin:0 2px;
}

.loginBody{
    margin:0;
    min-height:100vh;
    background:#111 url("../images/login-bg.png") center center / cover no-repeat;
    color:#fff;
    font-family:Arial, Helvetica, sans-serif;
}

.loginOverlay{
    min-height:100vh;
    padding:42px 54px;
    box-sizing:border-box;
    background:linear-gradient(to right, rgba(0,0,0,.78), rgba(0,0,0,.42), rgba(0,0,0,.12));
}

.loginBrand{
    width:520px;
    margin-top:20px;
}

.loginLogoText{
    line-height:42px;
    font-family:Georgia, serif;
    font-weight:bold;
}

.loginLogoSmall{
    display:block;
    font-size:18px;
    letter-spacing:2px;
}

.loginLogoWhite{
    font-size:52px;
    color:#fff;
}

.loginLogoRed{
    font-size:52px;
    color:#b00000;
}

.loginTagline{
    margin-top:8px;
    color:#e4d4a0;
    font-size:18px;
    font-style:italic;
}

.loginIntro{
    margin-top:18px;
    width:420px;
    color:#ddd;
    font-size:14px;
    line-height:21px;
}

.loginPanel{
    width:360px;
    margin-top:42px;
    background:rgba(35,35,35,.88);
    border:1px solid #777;
}

.loginPanelInner{
    padding:14px;
    box-sizing:border-box;
}

.loginNotice{
    width:100%;
    margin:0 0 10px 0;
}

.loginForm label{
    display:block;
    margin:8px 0 3px 0;
    color:#fff;
    font-size:8.5pt;
    font-weight:bold;
}

.loginForm input{
    width:100%;
    height:24px;
    padding:3px 6px;
    box-sizing:border-box;
    border:1px solid #111;
    background:#d8d8d8;
    color:#000;
}

.loginSubmit{
    margin-top:12px;
    width:100%;
    height:26px;
}

.loginLinks{
    margin-top:12px;
    text-align:center;
    font-size:8.5pt;
}

.loginLinks a{
    color:#fff;
    text-decoration:none;
}

.loginLinks a:hover{
    text-decoration:underline;
}

.loginLinks span{
    margin:0 6px;
    color:#aaa;
}

.loginNewsBox{
    width:520px;
    margin-top:26px;
    background:rgba(35,35,35,.82);
    border:1px solid #777;
}

.loginNewsInner{
    padding:10px 12px;
    box-sizing:border-box;
    color:#ddd;
    font-size:8.5pt;
}

.loginNewsItem{
    padding:4px 0;
    border-bottom:1px solid rgba(255,255,255,.12);
}

.loginNewsItem:last-child{
    border-bottom:0;
}

.loginNewsItem span{
    float:right;
    color:#aaa;
}

.newStatsBar{
    height:31px;
    padding:0 9px;
    box-sizing:border-box;

    display:flex;
    align-items:center;
    justify-content:space-between;

    background:linear-gradient(to bottom, #151515, #080808);
    border-top:1px solid #332018;
    border-bottom:1px solid #2d2d2d;

    color:#eee;
    font-size:8.5pt;
    font-weight:bold;
}

.newStatsLeft{
    height:100%;

    display:flex;
    align-items:center;
    gap:0;

    overflow:hidden;
    white-space:nowrap;
}

.newRefreshButton{
    width:22px;
    height:22px;
    margin-right:9px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:linear-gradient(to bottom, #272727, #111);
    border:1px solid #4a4a4a;

    color:#d7bd76;
    font-size:11px;
    font-weight:bold;
    line-height:1;
    text-decoration:none;
}

.newRefreshButton:hover{
    background:linear-gradient(to bottom, #3a2a16, #15110b);
    border-color:#9f7b34;
    color:#ffd35d;
}

.newStat{
    min-height:18px;
    padding:0 13px;
    box-sizing:border-box;

    display:flex;
    align-items:center;
    gap:5px;

    border-right:1px solid #333;

    color:#f2f2f2;
    line-height:18px;
}

.newStat:first-of-type{
    border-left:1px solid #333;
}

.newStat strong{
    color:#d7ad4d;
    font-weight:bold;
}

.newStat em{
    color:#e8e8e8;
    font-style:normal;
    font-weight:bold;
}

.statIcon{
    width:12px;

    display:inline-block;

    color:#d7bd76;
    font-size:9px;
    text-align:center;
}

.newClock{
    min-width:78px;
    padding-left:12px;

    color:#ffe100;
    font-size:8.5pt;
    font-weight:bold;
    text-align:right;
}

.networkTabs{
    width:850px;
    max-width:100%;
    margin:18px auto 10px auto;
    text-align:center;
}

.networkOverviewBox{
    width:850px;
    max-width:100%;
    margin:0 auto;
}

.networkOverviewInner{
    background:#7d7d7d;
    border:1px solid #aaa;
    border-top:0;
    padding:14px 18px 18px 18px;
    box-sizing:border-box;
    text-align:center;
    color:#000;
}

.networkSectionTitle{
    margin:4px 0 14px 0;
    font-weight:bold;
    font-size:10pt;
    color:#000;
}

.networkStructureGrid{
    width:520px;
    max-width:100%;
    margin:0 auto 34px auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px 28px;
    text-align:left;
}

.networkStructureItem{
    font-size:9pt;
    color:#000;
}

.networkStructureItem strong{
    color:#000;
}

.networkStructureItem a,
.networkMembersList a{
    color:#fff;
    font-weight:bold;
    text-decoration:none;
}

.networkStructureItem a:hover,
.networkMembersList a:hover{
    text-decoration:underline;
}

.networkLegend{
    margin:0 0 16px 0;
    color:#000;
    font-size:9pt;
}

.networkMembersList{
    margin:0 auto 18px auto;
    color:#000;
    font-size:9pt;
    text-align:center;
}

.networkMemberDivider{
    margin:0 8px;
    color:#000;
}

.networkOnline{
    color:#66ff66 !important;
    font-weight:bold;
}

.networkTotals{
    margin:0 0 16px 0;
    color:#000;
    font-size:9pt;
}

.networkLeaveForm{
    margin:0;
    text-align:center;
}

.networkJoinInner{
    background:#7d7d7d;
    border:1px solid #aaa;
    border-top:0;
    padding:12px 16px 18px 16px;
    box-sizing:border-box;
    color:#000;
    text-align:center;
}

.networkJoinText{
    margin:0 0 14px 0;
    font-size:9pt;
    line-height:17px;
    color:#000;
}

.networkJoinTable{
    width:auto;
    margin:0 auto 16px auto;
}

.networkJoinTable td,
.networkJoinTable th{
    text-align:center;
    white-space:nowrap;
}

.networkJoinTable form{
    margin:0;
}

.networkCreateBlock{
    margin-top:16px;
    font-size:9pt;
    line-height:22px;
    color:#000;
    text-align:center;
}

.networkCreateForm{
    margin-top:8px;
}

.networkCreateForm input{
    width:180px;
    height:20px;
    box-sizing:border-box;
}
.inlineForm{
    display:inline;
    margin-left:6px;
}

.networkManageSection{
    margin:12px auto 18px auto;
    padding:0;
    text-align:center;
    color:#fff;
    font-size:9pt;
    line-height:18px;
}

.networkManageSection form{
    display:block;
    margin-top:6px;
}

.networkManageSection input,
.networkManageSection select{
    height:20px;
    min-width:180px;
    margin:0 4px;
    padding:1px 4px;
    box-sizing:border-box;

    background:#cfcfcf;
    border:1px solid #111;

    color:#000;
    font-size:8.5pt;
}

.networkManageSection .mailButton{
    display:inline-block;
    margin-left:4px;
}

.inlineForm{
    display:inline;
    margin-left:6px;
}
.networkManageBox{
    margin:0 auto 16px auto;
    background:#7b7b7b;
    border:1px solid #b8b8b8;
    box-sizing:border-box;
    color:#000;
}

.networkManageBox .panelTitle{
    margin:0;
    border-left:0;
    border-right:0;
    border-top:0;
}

.networkManageSection{
    padding:10px 12px 14px 12px;
    text-align:center;
    color:#000;
    font-size:9pt;
    line-height:18px;
}

.networkManageSection + .networkManageSection{
    border-top:1px solid rgba(255,255,255,.25);
}

.networkManageSection strong{
    color:#000;
}

.networkManageSection form{
    display:block;
    margin-top:6px;
}

.networkManageSection input,
.networkManageSection select{
    height:22px;
    min-width:190px;
    margin:0 4px;
    padding:2px 4px;
    box-sizing:border-box;
    background:#d8d8d8;
    border:1px solid #222;
    color:#000;
    font-size:8.5pt;
}

.networkProtectionTable{
    width:100%;
    margin:0;
}

.networkManageForm{
    display:block;
    margin-top:8px;
}

.networkManageForm input{
    width:230px;
    height:22px;
    margin-right:6px;
}

.networkManageBox{
    background:#7f7f7f;
    border:1px solid #b7b7b7;
    border-top:0;
    padding-bottom:14px;
    box-sizing:border-box;
    color:#000;
    overflow:visible;
}

.networkManageSection{
    padding:14px 12px 10px 12px;
    text-align:center;
    font-size:9pt;
    line-height:18px;
}

.networkManageForm{
    display:block;
    margin-top:8px;
}

.networkManageForm input,
.networkManageSection input,
.networkManageSection select{
    height:22px;
    min-width:220px;
    box-sizing:border-box;
    background:#d8d8d8;
    border:1px solid #222;
    color:#000;
    font-size:8.5pt;
}

.networkManageSection select{
    min-width:130px;
}

.networkManageSection .mailButton{
    margin-left:4px;
}

.networkMembersPanel{
    width:calc(100% - 80px);
    max-width:850px;
    margin:14px auto;
    padding-bottom:26px;
    text-align:center;
}

.networkMembersRow{
    margin:0 auto;
    padding:10px 0 8px 0;
    text-align:center;
}

.networkMembersLabel{
    margin-bottom:2px;
    color:#000;
    font-size:10pt;
    font-weight:bold;
}

.networkInlineForm{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    margin:0;
}

.networkInlineForm input[type="text"],
.networkInlineForm select{
    height:20px;
    min-width:205px;
    box-sizing:border-box;
}

.networkRecruitingCheck{
    display:inline-flex;
    align-items:center;
    gap:4px;
    font-size:10pt;
}

.networkEmptyText{
    font-size:8.5pt;
}

.tableSubHeader td{
    background:#555;
    color:#fff;
    font-weight:bold;
}

.textActionLink{
    margin-left:8px;
    padding:0;
    background:none;
    border:0;
    color:#fff;
    font-size:8.5pt;
    font-weight:bold;
    cursor:pointer;
}

.textActionLink:hover{
    color:#f1b64c;
    background:none;
}

.networkProtectionTable{
    border-collapse:collapse;
    border-spacing:0;
}

.networkProtectionTable td,
.networkProtectionTable th{
    border:1px solid #222;
}

.networkProtectionTable .tableSubHeader td{
    border-top:0;
}

.ownerHoverLink{
    position:relative;
    display:inline-block;
    color:#fff;
    text-decoration:none;
}

.ownerHoverLink:hover{
    color:#ffb23a;
}

.ownerHoverLink[data-tooltip]:hover::after{
    content:attr(data-tooltip);
    white-space:pre-line;

    position:absolute;
    left:0;
    top:18px;
    z-index:50;

    min-width:115px;
    padding:5px 8px;

    background:#1f1f1f;
    border:1px solid #8b3a22;

    color:#fff;
    font-size:8pt;
    font-weight:normal;
    line-height:15px;
    text-align:left;
}

.cityHot td{
    color:#ff3333;
}

.cityCold td{
    color:#4db8ff;
}

.cityHot .propertyOwnerName,
.cityCold .propertyOwnerName,
.cityHot .ownerHoverLink,
.cityCold .ownerHoverLink{
    color:#fff;
}

.cityHot .emptyOwner,
.cityCold .emptyOwner{
    color:#ddd;
}

.propertyServiceTable{
    margin-top:14px;
}

.networkPropertyName{
    color:#fff;
    font-weight:bold;
    cursor:help;
}

.pageWidthServices{
    width:980px;
    max-width:100%;
    margin:14px auto 0 auto;
}

.propertyServiceTable .newGameTable{
    width:100%;
}

.propertyServiceTable .newGameTable th:first-child,
.propertyServiceTable .newGameTable td:first-child{
    width:170px;
}

.propertyServiceTable .newGameTable th,
.propertyServiceTable .newGameTable td{
    height:24px;
    padding:3px 7px;
}

.deadBody{
    margin:0;
    min-height:100vh;
    background:#050505 url("../images/dead-background.png") center center / cover no-repeat fixed;
    color:#fff;
    font-family:Arial, Helvetica, sans-serif;
}

.deadScene{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px;
    box-sizing:border-box;
    background:rgba(0,0,0,0.28);
}

.deadPanel{
    width:620px;
    max-width:100%;
    padding:30px 34px;
    box-sizing:border-box;

    background:rgba(20,20,20,0.72);
    border:1px solid rgba(160,40,30,0.75);

    text-align:center;
}

.deadTitle{
    color:#c51515;
    font-family:Georgia, serif;
    font-size:34px;
    font-weight:bold;
    text-transform:uppercase;
    margin-bottom:12px;
}

.deadKilledBy{
    color:#d8c38a;
    font-size:12pt;
    font-weight:bold;
    margin-bottom:18px;
}

.deadMessage{
    min-height:60px;
    padding:14px 18px;
    margin-bottom:22px;

    background:rgba(0,0,0,0.45);
    border:1px solid rgba(255,255,255,0.18);

    color:#eee;
    font-size:10pt;
    line-height:20px;
}

.deadError{
    width:max-content;
    max-width:100%;
    margin:0 auto 14px auto;
    padding:7px 12px;

    background:linear-gradient(to bottom, #f0c6c6, #d89191);
    border:1px solid #8d3333;

    color:#4a0000;
    font-size:8.5pt;
    font-weight:bold;
}

.deadForm label{
    display:block;
    margin-bottom:8px;

    color:#fff;
    font-size:12pt;
    font-weight:bold;
}

.deadForm input{
    width:240px;
    max-width:100%;
    height:24px;
    margin-right:6px;
    box-sizing:border-box;
}

.deadForm button{
    height:26px;
    padding:0 12px;
}

.rankingsPage{
    width:1180px;
    max-width:100%;
    margin:34px auto 0 auto;
}

.rankingHero{
    width:760px;
    max-width:100%;
    margin:0 auto 18px auto;
    padding:16px 20px;
    box-sizing:border-box;

    background:
        linear-gradient(to bottom, rgba(25,25,25,.96), rgba(5,5,5,.96));
    border:1px solid #6f1d12;
    box-shadow:0 0 18px rgba(0,0,0,.55);

    text-align:center;
}

.rankingHeroTitle{
    color:#d7b46a;
    font-family:Georgia, serif;
    font-size:24px;
    font-weight:bold;
    text-transform:uppercase;
}

.rankingHeroTitle{
    color:#d8b35f;
    font-family:Georgia, serif;
    font-size:25px;
    font-weight:bold;
    text-transform:uppercase;
}

.rankingHeroText{
    margin-top:7px;
    color:#e5e5e5;
    font-size:9pt;
}

.rankingGrid{
    display:grid;
    grid-template-columns:360px 430px 360px;
    gap:16px;
    justify-content:center;
    align-items:start;
}

.rankingPanelFeatured{
    margin-top:-10px;
    border-color:#8f8f8f;
    box-shadow:0 0 14px rgba(255,255,255,.08), 0 8px 18px rgba(0,0,0,.32);
}

.rankingTable{
    width:100%;
    margin:0;
    border:0 !important;
    border-collapse:collapse !important;
    border-spacing:0 !important;
}

.rankingTable td,
.rankingTable th{
    height:27px;
    padding:4px 6px;
    box-sizing:border-box;

    border:0 !important;
    border-right:1px solid #666 !important;
    border-bottom:1px solid #aaa !important;

    font-size:9pt;
}

.rankingTable td:last-child,
.rankingTable th:last-child{
    border-right:0 !important;
}

.rankingTable tr:last-child td{
    border-bottom:0 !important;
}

.rankingTable .tableSubHeader td{
    background:#2f2f2f !important;
    color:#fff;
    font-weight:bold;
}

.rankingTable a{
    color:#fff;
    font-weight:bold;
    text-decoration:none;
}

.rankingTable a:hover{
    color:#ffcc66;
}

.tableSubHeader td{
    background:#2d2d2d;
    color:#fff;
}

.rankingWinnerRow td{
    background:#cebd92;
    color:#fff;
}

.rankingSmallText{
    display:block;
    color:#d8d8d8;
    font-size:8pt;
    font-weight:normal;
}

.rankingPanel{
    background:#808080;
    border:1px solid #aaa;
    box-shadow:0 8px 18px rgba(0,0,0,.28);
    overflow:hidden;
}

.rankingPanel .panelTitle{
    margin:0;
    border:0;
    border-bottom:1px solid #111;
}

.rankingPanel .newGameTable{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
    border:0;
    margin:0;
}

.rankingPanel .newGameTable tr{
    border:0;
}

.rankingPanel .newGameTable th,
.rankingPanel .newGameTable td{
    border:1px solid #bdbdbd;
    border-left:0;
    border-top:0;
}

.rankingPanel .newGameTable th:last-child,
.rankingPanel .newGameTable td:last-child{
    border-right:0;
}

.rankingPanel .newGameTable tr:last-child td{
    border-bottom:0;
}

.rankingPanel .tableSubHeader td{
    border-top:0;
}

.rankingTable tr:nth-child(odd):not(.tableSubHeader) td{
    background:#858585;
}

.rankingTable tr:nth-child(even):not(.tableSubHeader) td{
    background:#7b7b7b;
}

.rankingPanelFeatured .rankingTable tr:nth-child(2) td{
    background:#4a4a4a;
    color:#fff;
    font-weight:bold;
}

.rankingPlace{
    width:28px;
    text-align:center;
    color:#111;
    font-weight:bold;
}

.rankingEmpty{
    color:#111;
    font-style:italic;
}

.dailyMissionHeader{
    width:650px;
    max-width:100%;
    margin:12px auto 4px auto;

    color:#fff;
    font-size:9pt;
    font-weight:bold;
}

.dailyMissionHeader small{
    float:right;
    color:#ddd;
    font-size:8pt;
    font-weight:normal;
}

.dailyMissionBoard{
    width:650px;
    max-width:100%;
    margin:0 auto 16px auto;

    border:1px solid #aaa;
    background:#777;
}

.dailyMissionRow{
    display:grid;
    grid-template-columns:1fr 150px 74px;
    gap:10px;
    align-items:center;

    min-height:42px;
    padding:6px 8px;
    box-sizing:border-box;

    border-bottom:1px solid #999;
}

.dailyMissionRow:last-child{
    border-bottom:0;
}

.dailyMissionMain strong{
    color:#111;
    font-size:9pt;
}

.dailyMissionReward{
    margin-top:3px;
    color:#e8e8e8;
    font-size:8pt;
}

.dailyMissionProgressText{
    margin-bottom:3px;
    color:#fff;
    font-size:8pt;
    font-weight:bold;
    text-align:center;
}

.dailyMissionBar{
    height:8px;
    background:#242424;
    border:1px solid #aaa;
}

.dailyMissionBar div{
    height:100%;
    background:linear-gradient(to right, #8b2f16, #f0b32f);
}

.dailyMissionAction{
    text-align:center;
}

.dailyMissionAction span{
    color:#ddd;
    font-size:8pt;
}

.dailyMissionReady{
    background:#838b73;
}

.dailyMissionClaimed{
    color:#444;
    background:#6f6f6f;
    opacity:.65;
}

.dailyMissionClaimed .dailyMissionReward,
.dailyMissionClaimed .dailyMissionProgressText,
.dailyMissionClaimed .dailyMissionAction span{
    color:#333;
}

.dailyMissionClaimed .dailyMissionBar div{
    background:#555;
}

.achievementHeader{
    width:1050px;
    max-width:100%;
    margin:12px auto 12px auto;

    color:#fff;
    font-size:9pt;
    font-weight:bold;
}

.achievementGrid{
    width:1050px;
    max-width:100%;
    margin:0 auto 25px auto;

    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:12px;
}

.achievementCard{
    min-height:112px;
    padding:12px;
    box-sizing:border-box;

    display:grid;
    grid-template-columns:48px 1fr;
    column-gap:10px;

    background:linear-gradient(to bottom, #1b1b1b, #111);
    border:1px solid #333;
    border-radius:8px;

    color:#fff;
}

.achievementIcon{
    width:44px;
    height:44px;

    background:#222;
    border:1px solid #333;
    border-radius:5px;

    object-fit:cover;
    filter:grayscale(1) brightness(.35);
    opacity:.75;
}

.achievementCompleted .achievementIcon,
.achievementReady .achievementIcon{
    filter:none;
    opacity:1;
}

.achievementTitle{
    color:#fff;
    font-size:9pt;
    font-weight:bold;
}

.achievementReward{
    margin-top:2px;
    color:#cfcfcf;
    font-size:8pt;
}

.achievementProgressText,
.achievementProgressBar,
.achievementBottom{
    grid-column:auto;
}

.achievementProgressText{
    grid-column:1 / 3;
    margin-top:8px;

    display:flex;
    justify-content:space-between;

    color:#ddd;
    font-size:8pt;
}

.achievementProgressBar{
    grid-column:1 / 3;

    height:10px;
    margin-top:5px;

    background:#242424;
    border:1px solid #444;
    border-radius:6px;
    overflow:hidden;
}

.achievementProgressBar div{
    height:100%;
    background:linear-gradient(to right, #8f263c, #c43d5c);
}

.achievementBottom{
    grid-column:1 / 3;
    margin-top:8px;

    color:#ddd;
    font-size:8pt;
}

.achievementBottom form{
    margin:0;
}

.achievementReady{
    background:linear-gradient(to bottom, #302914, #17140c);
    border-color:#9a7a30;
}

.achievementCompleted{
    background:linear-gradient(to bottom, #243024, #121812);
    border-color:#4f8a4f;
}

.achievementCompleted::after{
    content:"COMPLETED";
    position:absolute;
    top:10px;
    right:10px;

    color:#9dff9d;
    font-size:7pt;
    font-weight:bold;
}

.achievementCompleted .achievementProgressBar div{
    background:linear-gradient(to right, #1f8f45, #46c96a);
}

.achievementCompleted .achievementBottom{
    color:#a9ffb8;
}

.achievementCard .textActionLink{
    margin:0;
    padding:0;

    background:none;
    border:0;

    color:#fff;
    font-size:8pt;
    font-weight:bold;
    text-decoration:underline;
    cursor:pointer;
}

.achievementCard .textActionLink:hover{
    color:#f1b64c;
}

.achievementCard{
    min-height:112px;
    padding:12px;
    box-sizing:border-box;

    display:block;

    background:linear-gradient(to bottom, #717171, #777);
    border:1px solid #666;
    border-radius:7px;

    color:#fff;
    position:relative;
}

.achievementInfoFull{
    min-height:38px;
}
.achievementTooltip{
    display:none;
    position:absolute;
    left:10px;
    right:10px;
    bottom:60%;
    z-index:20;

    margin-bottom:6px;
    padding:7px 9px;
    box-sizing:border-box;

    background:#666;
    border:1px solid #666;

    color:#fff;
    font-size:8pt;
    line-height:14px;
    text-align:center;

    pointer-events:none;
}

.achievementCard:hover .achievementTooltip{
    display:block;
}
.favorStoreHeader{
    width:760px;
    max-width:100%;
    margin:0 auto 10px auto;
    color:#fff;
    font-weight:bold;
    text-align:center;
}

.favorStoreGrid{
    width:760px;
    max-width:100%;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:10px;
}

.favorStoreCard{
    padding:10px;
    background:#7f7f7f;
    border:1px solid #bdbdbd;
    color:#000;
    text-align:center;
}

.favorStoreTitle{
    color:#fff;
    font-weight:bold;
    margin-bottom:6px;
}

.favorStorePrice{
    color:#ffd36a;
    font-weight:bold;
    margin-bottom:6px;
}

.favorStoreDescription{
    min-height:34px;
    margin-bottom:10px;
    font-size:8.5pt;
}

.networkGarageWrap{
    width:820px;
    max-width:100%;
    margin:0 auto;
}

.networkGarageTitle{
    width:820px;
    max-width:100%;
    margin:0 auto 4px auto;

    color:#fff;
    font-size:9pt;
    font-weight:bold;
}

.networkGarageTable{
    width:820px;
    max-width:100%;
    margin:0 auto;
    table-layout:fixed;
}

.networkGarageTable th,
.networkGarageTable td{
    height:20px;
    padding:1px 6px;
    box-sizing:border-box;
    vertical-align:middle;
}

.networkGarageTable .carNameCol{
    width:190px;
}

.networkGarageTable .valueCol{
    width:95px;
}

.networkGarageTable .damageCol{
    width:70px;
}

.networkGarageTable .locationCol{
    width:110px;
}

.networkGarageTable .donatedCol{
    width:110px;
}

.networkGarageTable .imageCol{
    width:70px;
    text-align:center;
}

.networkGarageTable .actionCol{
    width:70px;
    text-align:center;
}

.crimeVictimInput{
    width:150px;
    height:20px;
    margin:0 auto 4px auto;
    display:block;
    box-sizing:border-box;

    background:#c8c8c8;
    border:1px solid #111;

    color:#000;
    font-size:8.5pt;
    text-align:center;
}

.missionIntroPanel,
.missionPanel{
    width:760px;
    max-width:100%;
    margin:0 auto 14px auto;
    background:#808080;
    border:1px solid #bdbdbd;
}

.missionHero{
    height:190px;
    overflow:hidden;
    background:#111;
}

.missionHero img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.missionStoryBox{
    padding:14px 18px;
    text-align:left;
}

.missionCampaignName{
    margin-bottom:10px;
    color:#fff;
    font-size:12pt;
    font-weight:bold;
    text-align:center;
}

.missionStoryText{
    color:#000;
    font-size:9pt;
    line-height:18px;
}

.missionTable{
    width:620px;
    margin:12px auto 0 auto;
}

.missionLabel{
    width:135px;
    background:#383838;
    color:#fff;
    font-weight:bold;
}

.missionProgressLine{
    display:flex;
    align-items:center;
    gap:10px;
}

.missionProgressLine span{
    width:70px;
    color:#fff;
    font-weight:bold;
    text-align:right;
}

.missionProgressBar{
    height:9px;
    flex:1;
    background:#202020;
    border:1px solid #999;
}

.missionProgressBar div{
    height:100%;
    background:linear-gradient(to right,#8c351d,#f3bd35);
}

.missionActionBox{
    padding:12px 0 16px;
    text-align:center;
}

.missionActiveText{
    color:#ffd56a;
    font-weight:bold;
}

.missionCompleteText{
    color:#b7f0a4;
    font-weight:bold;
}

.missionProgressBar.missionProgressComplete div{
    background:linear-gradient(to right,#2f7d32,#9be36b);
}

.textLinkButton{
    padding:0;
    margin:0;
    background:none;
    border:0;
    color:#fff;
    font:inherit;
    cursor:pointer;
    text-decoration:none;
}

.textLinkButton:hover{
    color:#ffcc66;
}

table.jailTable tr.jailOwnRow > td{
    background:#b9edf1 !important;
    color:#000 !important;
}

table.jailTable tr.jailMissionNpcRow > td{
    background:#e7dbfa !important;
    color:#000 !important;
}

table.jailTable tr.jailOwnRow > td a{
    color:#000 !important;
}

table.jailTable tr.jailMissionNpcRow > td .textActionButton{
    color:#000 !important;
}

button.jailBustLink{
    display:inline;
    width:auto;
    height:auto;
    min-width:0;
    padding:0;
    margin:0;

    background:none !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;

    color:#000 !important;
    font:inherit;
    font-weight:bold;
    line-height:inherit;
    text-align:left;

    cursor:pointer;
}

button.jailBustLink:hover{
    color:#f1b64c !important;
    text-decoration:none;
}

.menuInlineLinks{
    display:flex;
    align-items:center;
    gap:6px;
    padding:3px 6px;
}

.menuInlineLinks a{
    display:inline-block;
    padding:0;

    color:#fff;
    text-decoration:none;
}

.menuInlineLinks span{
    color:#fff;
}

.menuInlineLinks a:hover,
.menuInlineLinks a.activeMenuItem{
    color:#ffd36a;
}

.gmwForm{
    width:620px;
    max-width:100%;
    margin:12px auto;
    text-align:center;
}

.gmwForm label{
    display:block;
    margin-top:px;
    font-weight:bold;
}

.gmwForm input,
.gmwForm select,
.gmwForm textarea{
    width:260px;
    max-width:100%;
    box-sizing:border-box;
}

.gmwForm textarea{
    width:520px;
}

.gmwCheck{
    font-weight:normal !important;
}

.gmwCheck input{
    width:auto;
}

.gmwInfo{
    padding:10px;
    text-align:center;
    line-height:20px;
}

.gmwTable{
    width:100%;
        border-collapse:collapse;
    border-spacing:0;
    margin:0;
}


.gmwForm,
.gmwInfo{
    background:#808080;
    color:#000;
}

.gmwForm{
    width:100%;
    margin:0;
    padding:12px 0 14px 0;
    box-sizing:border-box;
}

.gmwInfo{
    padding:10px;
    text-align:center;
    line-height:20px;
}

/* ========================= DTM ========================= */

.dtmPage{
    width:900px;
    max-width:100%;
    margin:0 auto;
}

.dtmBox,
.dtmHero{
    width:760px;
    max-width:100%;
    margin:0 auto 14px auto;
}

.dtmHeroInner,
.dtmActiveInner{
    padding:12px;
    background:#808080;
    color:#000;
    text-align:center;
}

.dtmStory{
    width:680px;
    max-width:100%;
    margin:0 auto 12px auto;
    line-height:18px;
    font-size:9pt;
}

.dtmStartForm,
.dtmInviteForm,
.dtmReadyForm,
.dtmCancelForm{
    margin:10px auto 0 auto;
    text-align:center;
}

.dtmStartForm select,
.dtmInviteForm input,
.dtmReadyForm input,
.dtmReadyForm select{
    height:20px;
    margin:0 4px;
    box-sizing:border-box;
}

.dtmInviteForm label,
.dtmReadyForm label{
    display:inline-block;
    margin-left:8px;
    font-weight:bold;
}

.dtmRoleTable{
    width:680px;
    max-width:100%;
    margin:12px auto;
}

.inlineForm{
    display:inline;
    margin:0;
}

.textActionLink{
    padding:0;
    margin:0 4px 0 0;
    background:none;
    border:0;
    color:#fff;
    font:inherit;
    font-weight:bold;
    text-decoration:underline;
    cursor:pointer;
}

.textActionLink:hover{
    color:#ffd36a;
    text-decoration:none;
}

.dtmBox .gameTable,
.dtmBox .cleanGameTable{
    width:100%;
    margin:0;
    border-collapse:collapse;
    border-spacing:0;
}

.dtmBox .gameTable th,
.dtmBox .gameTable td,
.dtmBox .cleanGameTable th,
.dtmBox .cleanGameTable td{
    padding:2px 3px;
}

.CooldownNotice{
    width:760px;
    max-width:100%;
    margin:0 auto 12px auto;
    padding:4px 10px;
    box-sizing:border-box;

    color:#ffd46a;
    font-size:10pt;
    font-weight:bold;
    text-align:center;
}

/* ========================= Hospital ========================= */

.hospitalBox{
    width:760px;
    max-width:100%;
    margin:28px auto 0 auto;
}

.hospitalInner{
    padding:16px 24px 18px 24px;
    box-sizing:border-box;

    background:linear-gradient(to bottom, #8a8a8a, #747474);
    border:1px solid #aaa;
    border-top:0;

    text-align:center;
}

.hospitalIntro{
    width:620px;
    max-width:100%;
    margin:0 auto 14px auto;

    color:#111;
    line-height:18px;
}

.hospitalStatusLine{
    margin:8px auto 12px auto;

    color:#000;
    font-size:9pt;
    line-height:20px;
}

.hospitalProgress{
    width:420px;
    max-width:100%;
    height:10px;

    margin:8px auto 12px auto;

    background:#2b2b2b;
    border:1px solid #b7b7b7;
    box-sizing:border-box;
}

.hospitalProgress div{
    height:100%;

    background:linear-gradient(to right, #7fb65c, #cce7a3);
}

.hospitalForm{
    margin:10px auto 0 auto;

    color:#000;
    font-size:9pt;
    text-align:center;
}

.hospitalForm label{
    margin-left:8px;
    margin-right:4px;

    color:#000;
    font-weight:bold;
}

.hospitalForm select{
    width:175px;
    height:22px;

    margin-right:6px;

    background:#d0d0d0;
    border:1px solid #111;

    color:#000;
    font-size:8.5pt;
}

.hospitalTreatmentNote{
    width:520px;
    max-width:100%;

    margin:14px auto 0 auto;
    padding-top:10px;

    border-top:1px solid rgba(255,255,255,0.35);

    color:#111;
    font-size:8.5pt;
    line-height:18px;
}

.hospitalHealthBox{
    width:360px;
    max-width:100%;
    margin:0 auto 16px auto;
}

.hospitalHealthText{
    margin-bottom:5px;
    color:#000;
    font-weight:bold;
}

.hospitalHealthBar{
    height:9px;
    padding:1px;
    box-sizing:border-box;

    background:#222;
    border:1px solid #aaa;
}

.hospitalHealthBar div{
    height:100%;
    background:linear-gradient(to right, #9a1d1d, #d69b32, #98c56a);
}

.hospitalTreatmentGrid{
    width:100%;
    margin:14px auto 14px auto;

    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
}

.hospitalTreatmentCard{
    display:block;
    cursor:pointer;
}

.hospitalTreatmentCard input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.hospitalTreatmentCardBody{
    min-height:116px;
    padding:14px 10px;
    box-sizing:border-box;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;

    background:linear-gradient(to bottom, #7f7f7f, #686868);
    border:1px solid #b5b5b5;

    color:#050505;
    text-align:center;
}

.hospitalTreatmentCardBody strong{
    color:#fff;
    font-size:10pt;
}

.hospitalTreatmentCardBody span{
    font-size:8.5pt;
    font-weight:bold;
}

.hospitalTreatmentCardBody em{
    color:#ffd35d;
    font-style:normal;
    font-weight:bold;
}

.hospitalTreatmentCard input:checked + .hospitalTreatmentCardBody{
    background:linear-gradient(to bottom, #8c836d, #706a5b);
    border:2px solid #d6ad2d;
    box-shadow:inset 0 0 0 1px #3a2416, 0 0 10px rgba(214, 173, 45, .25);
}

.hospitalTimeSelect{
    margin:10px auto 12px auto;
    text-align:center;
}

.hospitalTimeSelect label{
    margin-right:6px;
    color:#000;
    font-weight:bold;
}

.hospitalTimeSelect select{
    width:190px;
    height:24px;

    background:#d6d6d6;
    border:1px solid #111;

    color:#000;
    font-size:8.5pt;
}

.hospitalForm .mailButton{
    margin-top:2px;
    min-width:110px;
}

/* =========================
   Modern Page Panels
========================= */

.contentArea{
    padding-top:42px;
}

.pageBox,
.homeBox,
.newPanel,
.gamePanel{
    width:760px;
    max-width:100%;
    margin:0 auto 18px auto;
    box-sizing:border-box;

    background:linear-gradient(to bottom, #8d8d8d, #797979);
    border:1px solid #9f9f9f;

    color:#000;
}

.panelTitle,
.homeTitle,
.gamePanelTitle{
    height:22px;
    line-height:22px;

    background:linear-gradient(to bottom, #202020 0%, #6f1f0d 48%, #2a0904 100%);
    border-bottom:1px solid #151515;

    color:#fff;
    font-size:10pt;
    font-weight:bold;
    text-align:center;
}

.pageInner,
.homeInner,
.panelInner,
.gamePanelInner{
    padding:16px 20px 18px 20px;
    box-sizing:border-box;
}

.pageIntro{
    margin:0 auto 14px auto;
    max-width:620px;

    color:#050505;
    font-size:9pt;
    line-height:16px;
    text-align:center;
}

/* =========================
   Tables
========================= */

.newGameTable,
.gameTable,
.messageTable{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;

    background:#808080;
    border:1px solid #b7b7b7;

    color:#000;
    font-size:9pt;
}

.newGameTable th,
.gameTable th,
.messageTable th{
    height:22px;
    padding:2px 6px;

    background:#333;
    border:1px solid #9b9b9b;

    color:#fff;
    font-size:9pt;
    font-weight:bold;
    text-align:left;
}

.newGameTable td,
.gameTable td,
.messageTable td{
    min-height:21px;
    padding:3px 6px;

    background:#828282;
    border:1px solid #6f6f6f;

    color:#000;
    vertical-align:middle;
}

.newGameTable tr:nth-child(even) td,
.gameTable tr:nth-child(even) td,
.messageTable tr:nth-child(even) td{
    background:#787878;
}

.newGameTable a,
.gameTable a,
.messageTable a{
    color:#fff;
    font-weight:bold;
    text-decoration:none;
}

.newGameTable a:hover,
.gameTable a:hover,
.messageTable a:hover{
    color:#ffd15c;
    text-decoration:underline;
}

/* Geen dubbele rand direct onder panel title */
.panelTitle + .newGameTable,
.panelTitle + .gameTable,
.gamePanelTitle + .newGameTable,
.gamePanelTitle + .gameTable{
    border-top:0;
}

/* =========================
   Forms
========================= */

input[type="text"],
input[type="password"],
input[type="number"],
select,
textarea{
    height:21px;
    box-sizing:border-box;

    background:#d2d2d2;
    border:1px solid #111;

    color:#000;
    font-size:8.5pt;
}

textarea{
    height:auto;
    min-height:90px;
    padding:5px;
}

.mailButton,
button,
input[type="submit"]{
    min-height:22px;
    padding:2px 10px;
    box-sizing:border-box;

    background:linear-gradient(to bottom, #f5f5f5, #d8d8d8);
    border:1px solid #aaa;
    border-radius:3px;

    color:#000;
    font-size:8.5pt;
    font-weight:normal;
    text-decoration:none;
    cursor:pointer;
}

.mailButton:hover,
button:hover,
input[type="submit"]:hover{
    background:linear-gradient(to bottom, #fff, #e4e4e4);
    border-color:#d1a642;
}

button:disabled,
.mailButton.disabled,
.mailButton[disabled]{
    background:#aaa;
    border-color:#888;
    color:#666;
    cursor:default;
}

/* =========================
   Notices
========================= */

.pageNotice{
    display:table;
    width:auto;
    max-width:760px;

    margin:0 auto 12px auto;
    padding:6px 12px;
    box-sizing:border-box;

    background:linear-gradient(to bottom, #e9dfba, #cfc082);
    border:1px solid #8d7a36;

    color:#111;
    font-size:8.5pt;
    font-weight:bold;
    text-align:center;
}

.pageNoticeError{
    background:linear-gradient(to bottom, #f0c6c6, #d89191);
    border-color:#8d3333;
    color:#4a0000;
}

.pageNoticeSuccess{
    background:linear-gradient(to bottom, #d8edc0, #9fc878);
    border-color:#557d33;
    color:#163000;
}

/* =========================
   Hospital
========================= */

.hospitalPageBox{
    width:760px;
}

.hospitalInner{
    text-align:center;
}

.hospitalHealthBox{
    width:360px;
    max-width:100%;
    margin:0 auto 16px auto;
}

.hospitalHealthText{
    margin-bottom:6px;

    color:#000;
    font-size:9pt;
    font-weight:bold;
}

.hospitalHealthBar{
    height:8px;
    padding:1px;
    box-sizing:border-box;

    background:#1d1d1d;
    border:1px solid #aaa;
}

.hospitalHealthBar div{
    height:100%;

    background:linear-gradient(to right, #8b1e13, #d8b13d, #74aa54);
}

.hospitalTreatmentGrid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:26px;

    margin:16px 0 14px 0;
}

.hospitalTreatmentCard{
    display:block;
    cursor:pointer;
}

.hospitalTreatmentCard input{
    display:none;
}

.hospitalTreatmentCardBody{
    min-height:98px;
    padding:22px 12px 16px 12px;
    box-sizing:border-box;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;

    background:linear-gradient(to bottom, #898989, #767676);
    border:1px solid #b5b5b5;

    color:#000;
}

.hospitalTreatmentCardBody strong{
    color:#fff;
    font-size:10pt;
}

.hospitalTreatmentCardBody span{
    color:#000;
    font-size:8.5pt;
    font-weight:bold;
}

.hospitalTreatmentCardBody em{
    color:#ffd45c;
    font-size:8.5pt;
    font-style:normal;
    font-weight:bold;
}

.hospitalTreatmentCard input:checked + .hospitalTreatmentCardBody{
    border-color:#d7aa2f;
    box-shadow:inset 0 0 0 1px #d7aa2f;
    background:linear-gradient(to bottom, #8f8a7b, #777268);
}

.hospitalTimeSelect{
    margin:8px auto 14px auto;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    color:#000;
    font-size:9pt;
    font-weight:bold;
}

.hospitalTimeSelect select{
    width:250px;
}

.hospitalStatusBox{
    width:420px;
    max-width:100%;
    margin:10px auto 16px auto;
    padding:10px 14px;
    box-sizing:border-box;

    background:rgba(40, 40, 40, 0.12);
    border:1px solid #999;

    color:#000;
    font-size:9pt;
    line-height:18px;
    text-align:center;
}

.hospitalForm{
    margin:0;
}

.hospitalSubmit{
    min-width:110px;
}

/* =========================
   Hospital - Modern Override
========================= */

.hospitalPageBox{
    width:760px;
    background:linear-gradient(to bottom, #1f1f1f, #151515);
    border:1px solid #3a3a3a;
    box-shadow:0 18px 45px rgba(0,0,0,0.35);
}

.hospitalPageBox .panelTitle{
    height:28px;
    line-height:28px;

    background:linear-gradient(to bottom, #161616, #4f1108 55%, #110403);
    border-bottom:1px solid #742313;

    color:#fff;
    font-size:10pt;
}

.hospitalPageBox .pageInner{
    padding:22px 28px 24px 28px;

    background:
        radial-gradient(circle at top center, rgba(160,160,160,0.12), transparent 45%),
        linear-gradient(to bottom, #8f8f8f, #7b7b7b);
}

.hospitalIntro{
    max-width:610px;
    margin-bottom:18px;

    color:#111;
    font-size:9pt;
    line-height:17px;
}

.hospitalHealthBox{
    width:360px;
    margin-bottom:22px;
}

.hospitalHealthText{
    margin-bottom:7px;

    color:#070707;
    font-size:9.5pt;
}

.hospitalHealthBar{
    height:9px;
    padding:1px;

    background:#141414;
    border:1px solid #b9b9b9;
}

.hospitalHealthBar div{
    background:linear-gradient(to right, #8f2416, #d6a42f, #6fa64f);
}

.hospitalTreatmentGrid{
    gap:26px;
    margin:0 0 16px 0;
}

.hospitalTreatmentCardBody{
    min-height:116px;
    padding:24px 12px 18px 12px;

    background:
        linear-gradient(to bottom, rgba(255,255,255,0.08), transparent),
        linear-gradient(to bottom, #858585, #707070);
    border:1px solid #adadad;

    transition:border-color 0.15s ease, background 0.15s ease;
}

.hospitalTreatmentCardBody strong{
    margin-bottom:2px;

    color:#fff;
    font-size:10pt;
}

.hospitalTreatmentCardBody span{
    color:#050505;
}

.hospitalTreatmentCardBody em{
    color:#ffd35d;
}

.hospitalTreatmentCard:hover .hospitalTreatmentCardBody{
    border-color:#d0a748;
    background:
        linear-gradient(to bottom, rgba(255,255,255,0.12), transparent),
        linear-gradient(to bottom, #8d8d8d, #737373);
}

.hospitalTreatmentCard input:checked + .hospitalTreatmentCardBody{
    border:2px solid #d7aa2f;
    box-shadow:none;
    background:
        linear-gradient(to bottom, rgba(255,213,92,0.12), transparent),
        linear-gradient(to bottom, #8f8977, #746f64);
}

.hospitalTimeSelect{
    margin-top:12px;
    margin-bottom:16px;
}

.hospitalTimeSelect select{
    width:250px;
    height:24px;
}

.hospitalSubmit{
    min-width:112px;
    height:24px;
}

/* =========================
   Hospital - Dark Premium Skin
========================= */

.hospitalPageBox{
    width:745px;
    max-width:100%;
    margin:0 auto 20px auto;

    background:
        radial-gradient(circle at top center, rgba(120,120,120,0.12), transparent 42%),
        linear-gradient(to bottom, #151515, #0b0b0b);
    border:1px solid #2f2f2f;
    box-shadow:0 18px 45px rgba(0,0,0,0.65);

    color:#d9d0bd;
}

.hospitalPageBox .panelTitle{
    height:45px;
    line-height:45px;
    padding-left:70px;
    box-sizing:border-box;

    background:
        linear-gradient(to bottom, rgba(130,31,24,0.95), rgba(45,7,7,0.98)),
        linear-gradient(to right, #5d1210, #220606);
    border-bottom:1px solid #050505;

    color:#d9c8a2;
    font-family:Georgia, serif;
    font-size:15pt;
    font-weight:bold;
    text-align:left;
    text-transform:uppercase;

    position:relative;
}

.hospitalPageBox .panelTitle:before{
    content:"+";
    width:36px;
    height:36px;
    line-height:33px;

    position:absolute;
    left:22px;
    top:4px;

    border:1px solid #b98528;
    border-radius:50%;

    color:#e2b34b;
    font-size:25px;
    font-family:Arial, sans-serif;
    text-align:center;
}

.hospitalPageBox .pageInner{
    padding:26px 36px 16px 36px;

    background:
        radial-gradient(circle at center top, rgba(255,255,255,0.07), transparent 42%),
        linear-gradient(to bottom, #151515, #0b0b0b);
}

.hospitalIntro{
    max-width:520px;
    margin:0 auto 18px auto;

    color:#d6c48d;
    font-size:9pt;
    line-height:16px;
    text-align:center;
}

.hospitalHealthBox{
    width:410px;
    max-width:100%;
    margin:0 auto 20px auto;
}

.hospitalHealthText{
    margin-bottom:8px;

    color:#d9d0bd;
    font-family:Georgia, serif;
    font-size:10pt;
    font-weight:bold;
    text-align:center;
}

.hospitalHealthText strong{
    color:#e2b34b;
}

.hospitalHealthBar{
    height:8px;
    padding:1px;
    box-sizing:border-box;

    background:#050505;
    border:1px solid #3f3f3f;
    box-shadow:inset 0 1px 2px rgba(0,0,0,0.9);
}

.hospitalHealthBar div{
    height:100%;
    background:linear-gradient(to right, #c62317, #d89b27, #74a64d);
}

.hospitalTreatmentGrid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:20px;

    margin:18px 0 22px 0;
}

.hospitalTreatmentCard{
    display:block;
    cursor:pointer;
}

.hospitalTreatmentCard input{
    display:none;
}

.hospitalTreatmentCardBody{
    min-height:168px;
    padding:24px 18px 18px 18px;
    box-sizing:border-box;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:9px;

    background:
        linear-gradient(to bottom, rgba(255,255,255,0.035), transparent),
        #101010;
    border:1px solid #444;
    box-shadow:
        inset 0 0 18px rgba(255,255,255,0.03),
        0 2px 9px rgba(0,0,0,0.45);

    color:#d9d0bd;
}

.hospitalTreatmentCardBody:before{
    width:52px;
    height:52px;
    line-height:52px;
    margin-bottom:10px;

    display:block;

    border:1px solid #777;
    border-radius:50%;

    color:#999;
    font-size:28px;
    text-align:center;
}

.hospitalTreatmentCard:nth-child(1) .hospitalTreatmentCardBody:before{
    content:"+";
    color:#d6a23d;
    border-color:#d6a23d;
    font-size:36px;
    font-weight:bold;
}

.hospitalTreatmentCard:nth-child(2) .hospitalTreatmentCardBody:before{
    content:"";
    background:
        radial-gradient(circle at center 15px, #aaa 0 8px, transparent 9px),
        radial-gradient(circle at center 34px, #aaa 0 14px, transparent 15px);
    border-color:#777;
}

.hospitalTreatmentCard:nth-child(3) .hospitalTreatmentCardBody:before{
    content:"♛";
    font-size:28px;
}

.hospitalTreatmentCardBody strong{
    color:#d9c8a2;
    font-family:Georgia, serif;
    font-size:11pt;
    text-transform:uppercase;
}

.hospitalTreatmentCardBody span{
    color:#d9d0bd;
    font-size:8.5pt;
}

.hospitalTreatmentCardBody em{
    width:100%;
    margin-top:6px;
    padding-top:12px;

    border-top:1px solid #2d2d2d;

    color:#e2b34b;
    font-size:9pt;
    font-style:normal;
    font-weight:bold;
    text-align:center;
}

.hospitalTreatmentCard input:checked + .hospitalTreatmentCardBody{
    border-color:#d7a32f;
    box-shadow:
        inset 0 0 18px rgba(215,163,47,0.08),
        0 0 10px rgba(215,163,47,0.25);
}

.hospitalTimeSelect{
    margin:0 auto 16px auto;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    color:#d9c8a2;
    font-family:Georgia, serif;
    font-size:10pt;
    font-weight:bold;
}

.hospitalTimeSelect select{
    width:230px;
    height:27px;

    background:#111;
    border:1px solid #555;

    color:#d9d0bd;
}

.hospitalSubmit,
.hospitalForm > .mailButton{
    min-width:235px;
    height:36px;

    background:linear-gradient(to bottom, #8e1714, #4d0707);
    border:1px solid #a32a22;
    border-radius:3px;

    color:#d9c8a2;
    font-family:Georgia, serif;
    font-size:10pt;
    font-weight:bold;
    text-transform:uppercase;
}

.hospitalSubmit:hover,
.hospitalForm > .mailButton:hover{
    background:linear-gradient(to bottom, #a41d18, #5b0908);
    border-color:#d7a32f;
    color:#fff;
}

.hospitalStatusBox{
    width:420px;
    max-width:100%;
    margin:14px auto 18px auto;
    padding:12px 16px;
    box-sizing:border-box;

    background:#101010;
    border:1px solid #3d3d3d;

    color:#d9d0bd;
    font-size:9pt;
    line-height:19px;
    text-align:center;
}

body:has(.hospitalPageBox) .contentArea{
    background:
        radial-gradient(circle at 50% 80px, rgba(120,120,120,0.08), transparent 280px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.018) 0,
            rgba(255,255,255,0.018) 1px,
            transparent 1px,
            transparent 6px
        ),
        #151515;
}

/* =========================
   Hospital - Mockup Texture Override
========================= */

.hospitalPageBox{
    width:1050px;
    max-width:calc(100% - 60px);

    background:
        linear-gradient(to bottom, rgba(255,255,255,0.035), transparent 55px),
        radial-gradient(circle at 50% 25%, rgba(255,255,255,0.05), transparent 260px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.018) 0,
            rgba(255,255,255,0.018) 1px,
            transparent 1px,
            transparent 5px
        ),
        #111;

    border:1px solid #4a4a4a;
    box-shadow:
        0 0 0 1px #050505,
        0 0 0 2px #232323,
        0 18px 45px rgba(0,0,0,0.75),
        inset 0 1px 0 rgba(255,255,255,0.08);

    color:#d8caa8;
}

.hospitalPageBox .panelTitle{
    height:58px;
    line-height:58px;
    padding-left:98px;

    background:
        radial-gradient(circle at 20% 0%, rgba(255,255,255,0.12), transparent 120px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.025) 0,
            rgba(255,255,255,0.025) 1px,
            transparent 1px,
            transparent 4px
        ),
        linear-gradient(to bottom, #55120f 0%, #3a0b09 52%, #130302 100%);

    border-bottom:1px solid #050505;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.12),
        inset 0 -1px 0 rgba(120,35,25,0.55),
        0 2px 0 #000;

    color:#d8c59b;
    font-family:Georgia, serif;
    font-size:20pt;
    font-weight:bold;
    text-align:left;
    text-transform:uppercase;
}

.hospitalPageBox .panelTitle:before{
    content:"+";

    width:38px;
    height:38px;
    line-height:35px;

    left:30px;
    top:9px;

    background:
        radial-gradient(circle at 35% 25%, rgba(255,255,255,0.2), transparent 18px),
        linear-gradient(to bottom, #291b10, #0d0906);
    border:1px solid #c19132;
    border-radius:50%;

    color:#e0b04b;
    font-size:29px;
    font-weight:bold;
    box-shadow:
        0 0 10px rgba(193,145,50,0.28),
        inset 0 1px 0 rgba(255,255,255,0.12);
}

.hospitalPageBox .pageInner{
    padding:26px 52px 32px 52px;

    background:
        radial-gradient(circle at 50% 16%, rgba(255,255,255,0.08), transparent 260px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.015) 0,
            rgba(255,255,255,0.015) 1px,
            transparent 1px,
            transparent 6px
        ),
        linear-gradient(to bottom, #151515, #0d0d0d);
}

.hospitalIntro{
    max-width:650px;
    margin:0 auto 24px auto;

    color:#d9c18a;
    font-family:Georgia, serif;
    font-size:12pt;
    line-height:22px;
}

.hospitalHealthBox{
    width:575px;
    margin-bottom:30px;
}

.hospitalHealthText{
    color:#d8caa8;
    font-family:Georgia, serif;
    font-size:13pt;
}

.hospitalHealthText strong{
    color:#e5ad31;
}

.hospitalHealthBar{
    height:11px;
    padding:2px;

    background:#080808;
    border:1px solid #454545;
    box-shadow:
        inset 0 1px 2px rgba(0,0,0,0.95),
        0 1px 0 rgba(255,255,255,0.07);
}

.hospitalHealthBar div{
    background:linear-gradient(to right, #d51f17, #d49d2d, #74a852);
    box-shadow:0 0 6px rgba(212,157,45,0.25);
}

.hospitalTreatmentGrid{
    gap:26px;
    margin:0 0 28px 0;
}

.hospitalTreatmentCardBody{
    min-height:232px;
    padding:28px 28px 22px 28px;

    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,0.08), transparent 95px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.018) 0,
            rgba(255,255,255,0.018) 1px,
            transparent 1px,
            transparent 5px
        ),
        linear-gradient(to bottom, #171717, #0b0b0b);

    border:1px solid #3e3e3e;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.08),
        inset 0 0 22px rgba(255,255,255,0.025),
        0 5px 12px rgba(0,0,0,0.55);
}

.hospitalTreatmentCardBody:before{
    width:66px;
    height:66px;
    line-height:64px;
    margin-bottom:18px;

    background:
        radial-gradient(circle at 35% 25%, rgba(255,255,255,0.18), transparent 24px),
        linear-gradient(to bottom, #1f1f1f, #090909);

    border:1px solid #777;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.12),
        0 0 8px rgba(0,0,0,0.8);
}

.hospitalTreatmentCard:nth-child(1) .hospitalTreatmentCardBody:before{
    border-color:#d1a23b;
    color:#d1a23b;
    box-shadow:
        0 0 10px rgba(209,162,59,0.22),
        inset 0 1px 0 rgba(255,255,255,0.12);
}

.hospitalTreatmentCardBody strong{
    margin-bottom:7px;

    color:#d9c99d;
    font-family:Georgia, serif;
    font-size:14pt;
    line-height:18px;
    text-align:center;
}

.hospitalTreatmentCardBody span{
    color:#e6e0d2;
    font-family:Georgia, serif;
    font-size:11pt;
}

.hospitalTreatmentCardBody em{
    margin-top:10px;
    padding-top:18px;

    border-top:1px solid #303030;

    color:#e0a72e;
    font-family:Georgia, serif;
    font-size:12pt;
}

.hospitalTreatmentCard input:checked + .hospitalTreatmentCardBody{
    border:1px solid #d1a23b;
    box-shadow:
        0 0 0 1px rgba(209,162,59,0.45),
        0 0 16px rgba(209,162,59,0.25),
        inset 0 0 26px rgba(209,162,59,0.08);

    background:
        radial-gradient(circle at 50% 0%, rgba(209,162,59,0.22), transparent 110px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.018) 0,
            rgba(255,255,255,0.018) 1px,
            transparent 1px,
            transparent 5px
        ),
        linear-gradient(to bottom, #2a2417, #0d0d0d);
}

.hospitalTimeSelect{
    margin-bottom:22px;

    color:#d8caa8;
    font-family:Georgia, serif;
    font-size:13pt;
}

.hospitalTimeSelect select{
    width:325px;
    height:39px;
    padding:0 12px;

    background:
        linear-gradient(to bottom, rgba(255,255,255,0.05), transparent),
        #0d0d0d;
    border:1px solid #4b4b4b;

    color:#e4ded0;
    font-size:11pt;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.08),
        0 1px 0 rgba(255,255,255,0.05);
}

.hospitalSubmit,
.hospitalForm > .mailButton{
    min-width:330px;
    height:47px;

    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,0.18), transparent 40px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.025) 0,
            rgba(255,255,255,0.025) 1px,
            transparent 1px,
            transparent 4px
        ),
        linear-gradient(to bottom, #9f1613, #5b0606);

    border:1px solid #9c2d24;
    border-radius:3px;

    color:#d9c99d;
    font-family:Georgia, serif;
    font-size:12pt;
    font-weight:bold;
    letter-spacing:0;
    text-transform:uppercase;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.12),
        inset 0 -1px 0 rgba(0,0,0,0.5),
        0 3px 9px rgba(0,0,0,0.55);
}

.hospitalSubmit:hover,
.hospitalForm > .mailButton:hover{
    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,0.22), transparent 40px),
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.025) 0,
            rgba(255,255,255,0.025) 1px,
            transparent 1px,
            transparent 4px
        ),
        linear-gradient(to bottom, #b51d18, #690909);

    border-color:#d1a23b;
}

.contentArea{
    background:
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.018) 0,
            rgba(255,255,255,0.018) 1px,
            transparent 1px,
            transparent 5px
        ),
        #111;

    min-height:calc(100vh - 100px);
}

/* =========================
   Hospital - Final Size/Border Fix
========================= */

.hospitalPageBox{
    width:760px;
    max-width:760px;

    background:#0e0e0e;
    border:1px solid #3d3d3d;

    box-shadow:
        0 0 0 1px #000,
        0 12px 34px rgba(0,0,0,0.65),
        inset 0 1px 0 rgba(255,255,255,0.08);
}

.hospitalPageBox .panelTitle{
    height:48px;
    line-height:48px;
    padding-left:90px;

    background:
        radial-gradient(circle at 18% 0%, rgba(255,255,255,0.12), transparent 130px),
        linear-gradient(to bottom, #5f120e 0%, #3a0907 62%, #120201 100%);

    border-bottom:1px solid #000;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.14),
        inset 0 -1px 0 rgba(139,42,26,0.35);

    font-size:18pt;
}

.hospitalPageBox .panelTitle:before{
    left:28px;
    top:7px;
}

.hospitalPageBox .pageInner{
    padding:24px 42px 26px 42px;

    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,0.055), transparent 260px),
        linear-gradient(to bottom, #171717 0%, #0f0f0f 100%);

    border-top:1px solid #1f1f1f;
}

/* iets compacter */
.hospitalIntro{
    max-width:560px;
    margin-bottom:18px;

    font-size:10pt;
    line-height:18px;
}

.hospitalHealthBox{
    width:410px;
    margin-bottom:22px;
}

.hospitalHealthText{
    font-size:11pt;
}

.hospitalTreatmentGrid{
    gap:22px;
    margin-bottom:22px;
}

.hospitalTreatmentCardBody{
    min-height:172px;
    padding:22px 18px 18px 18px;

    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,0.055), transparent 95px),
        linear-gradient(to bottom, #171717, #0b0b0b);

    border:1px solid #373737;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.07),
        inset 0 0 18px rgba(255,255,255,0.02),
        0 4px 10px rgba(0,0,0,0.45);
}

.hospitalTreatmentCardBody:before{
    width:56px;
    height:56px;
    line-height:54px;
    margin-bottom:12px;
}

.hospitalTreatmentCardBody strong{
    font-size:11pt;
    line-height:15px;
}

.hospitalTreatmentCardBody span{
    font-size:9pt;
}

.hospitalTreatmentCardBody em{
    margin-top:7px;
    padding-top:12px;

    font-size:9.5pt;
}

.hospitalTreatmentCard input:checked + .hospitalTreatmentCardBody{
    background:
        radial-gradient(circle at 50% 0%, rgba(201,151,42,0.20), transparent 110px),
        linear-gradient(to bottom, #1a160f, #0b0b0b);

    border-color:#c89a2f;

    box-shadow:
        0 0 0 1px rgba(200,154,47,0.35),
        0 0 12px rgba(200,154,47,0.18),
        inset 0 0 18px rgba(200,154,47,0.07);
}

.hospitalTimeSelect{
    margin-bottom:18px;
}

.hospitalTimeSelect select{
    width:270px;
    height:31px;
}

.hospitalSubmit,
.hospitalForm > .mailButton{
    min-width:260px;
    height:38px;

    font-size:10.5pt;
}

.pageBox.hospitalPageBox{
    border:1px solid #222 !important;
    outline:1px solid #000;
    box-shadow:
        0 0 0 1px #3a3a3a,
        0 14px 35px rgba(0,0,0,0.70),
        inset 0 1px 0 rgba(255,255,255,0.06);
}

.hospitalPageBox,
.hospitalPageBox *{
    border-color:#333;
}

.hospitalPageBox .panelTitle{
    border-color:#000;
}

.hospitalPageBox .pageInner{
    border:0;
}