#cgubutton {
    cursor: pointer;
    color: var(--bleu);
    text-decoration: underline;
}

.closenumap {
    position: absolute;
    z-index: 1;
    background: var(--jaune);
    right: 5px;
    top: 5px;
    filter: drop-shadow(4px 4px 9px rgba(0, 0, 0, 0.2));
}

.cgucontent {
    padding: 60px;
    overflow: scroll;
    height: 600px;
    font-size: 150%;
    font-family: var(--fontfamily);
}

#acceptTerms {
    position: absolute;
    top: 735px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    font-size: 150%;
}


.tradenotice {
    position: absolute;
    font-size: 12px;
    color: var(--vert);
    right: 20px;
    top: 0;
}

.collinks {
    line-height: 35px;
    color: var(--blanc);
    position: absolute;
    top: 198px;
    left: 67px;
}

#debug {

    margin-top: 100px;
    position: absolute;
    bottom: -65px;

}

#debug2 {
    position: fixed;
    overflow: hidden;
    top: 860px;
}

.intext {
    width: 32px;
}

*:not(.selectable) {

    -webkit-user-select: none;
    /* Safari */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* IE10+/Edge */
    user-select: none;
    /* Standard */
}

.smallbutton {
    padding: 2px;
}

.equipstat {

    width: 70px;

}


table {
    width: 100%;
}

.equipnom {
    width: 200px;
}

#alertclose,
.select_another_objective {
    cursor: pointer;
    position: relative;
    top: 0;
    right: 0;
    border-radius: 0;
    border: none;
    border-bottom-color: currentcolor;
    padding: 10px 18px !important;
    z-index: 34333;
    margin-top: 0;
    display: inline-block;
    pointer-events: all;


}

#closectx {
    right: -47px;
    top: -22px;
    font-size: 15px;
    padding: 9px;
    border-left: none;
}

#alertclose,
.select_another_objective {
    font-size: 15px;
}

.bigred #alertclose,
.red #alertclose,
.bigred .select_another_objective,
.red .select_another_objective {
    background: #db7c60;
    color: #a15740;

}

.bigred #alertclose::before,
.red #alertclose::before,
.bigred .select_another_objective::before,
.red .select_another_objective::before {
    border-top-width: 6px;
    border-top-style: solid;
    border-top-color: rgb(236, 132, 101);
    border-right-width: 6px;
    border-right-style: solid;
    border-right-color: rgb(245, 169, 146);
    border-bottom-width: 6px;
    border-bottom-style: solid;
    border-bottom-color: rgb(173, 100, 78);
    border-left-width: 6px;
    border-left-style: solid;
    border-left-color: rgb(173, 100, 78);
}

#closelert {
    width: 70px;
    font-size: 75%;
    padding: 5px;
    height: 46px;
    margin-top: 17px;
}

#rank {
    position: absolute;
    right: 25px;
    width: 248px;
    top: 265px;
    text-align: center;
}

.traits_desc_button {
    cursor: pointer;
    width: 350px;
}

.traits_desc_button:hover {
    background: var(--blanc);
}

#subtitle {
    font-size: 20px;
}

.persolog {
    color: var(--rouge);
}

#equipwin {
    position: relative;
}

#overlay #equipwin button {
    display: inline-block;
    margin: 0;
    font-size: 16px;
    position: absolute;
    left: 0;
    bottom: 0;
    border: 1px solid var(--rouge);
}

.wearreplacecss {
    left: 35px !important;
    bottom: 5px !important;
}

.wearequipcss {
    left: 42px !important;
    bottom: 65px !important;
}

#overlay .unequip {
    top: 0 !important;
    bottom: auto !important;
    right: 0 !important;
    left: auto !important;
    color: var(--rouge);
}

.equipstat {
    position: absolute;
    width: 100%;
    text-align: center;
    background: var(--jaune);
}

#equipwin .itempic {
    background-position: -1440px;
    width: 96px;
    height: 96px;
    background-size: auto 96px;
    position: absolute;
    left: 36px;
}

#updateinfo {
    font-size: 17px;
    position: absolute;
    top: 258px;
    width: 229px;
    left: 60px;
    height: 153px;
    overflow: scroll;
    padding-right: 10px;
    padding-top: 7px;
    color: var(--vert);
}



#hackflip {
    position: fixed;
    z-index: 3333;
    bottom: -80px;

}


.frontnew {
    color: var(--vert);
}

#contextemenu .tname {
    font-size: 18px;
}

#equipwin:before {
    opacity: 0.3;
    content: "";
    position: absolute;
    width: 350px;
    height: 500px;
    z-index: -1;
    left: 100px;
    top: 0;
    background-image: url(/img/MENU/EQUIP_AVATAR.png?v=V_2026_PROD_1_FIXVERSION);
    background-size: 400px;
}



#bskyicon {
    width: 12px;
    height: 10px;
}



#supportblektre {
    width: 256px;
    top: 48px;
    left: 54px;
    position: absolute;
}

#steamlogo {
    width: 128px;
    opacity: 0.5
}




.infobiz {
    display: none;
}

.SMALLJOBS td {
    height: 70px;
    padding-right: 30px;
}

.SMALLJOBS table {
    margin-bottom: 50px;
}

.bizdesc {
    font-style: italic;
    color: #a875c1;
    font-size: 18px;
    line-height: 23px !important;
    border: none;
    display: block;
    padding: 0;
    width: 100%;
    overflow-y: scroll;
    margin-bottom: 20px;
}

.bizname {
    position: relative;
    /* padding-left: 30px; */
    /* Adjust to add space for the icon */
}

/* .bizname::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    background: url('/img/MENU/bizness.png') no-repeat center center;
    background-size: contain;
} */

.tutobox {
    color: var(--vert);
    font-size: var(--fontsize);
    padding: 10px;
    border: 1px solid var(--vert);
    margin-top: 10px;
    position: relative;
    border-radius: 10px;
    font-size: 18px;

    padding-right: 25px;
}

.heure {
    color: var(--rouge);

}

.logline .heure {
    padding-right: 10px;

}

.logline .heure .sep {
    opacity: 0.9;
}

#dompreloader {
    z-index: 888888888888888888888888888888888;
    border: none;
    height: 20px;
    position: absolute;
    left: 564px;
    top: 100px;
}

#wearwin .unequip {
    font-size: 20px;
    padding: 5px;
    position: absolute;
    margin-top: -1px;
    margin-left: 10px;
}

.equipment,
.equipment button {
    font-size: 16px !important;
}

.large_button {
    padding: 12px !important;
}

.equipment td {

    height: 40px;
    border-bottom: 1px solid var(--rouge);
}

.traitNotice {
    color: var(--bleu);
    font-size: 16px !important;
}

.rayed {
    text-decoration: line-through;
}


.closetuto {
    position: absolute;
    top: 0;
    right: 0;
    width: 25px;
    height: 25px;
    border-bottom: 1px solid var(--vert);
    border-left: 1px solid var(--vert);
    cursor: pointer;
    padding-top: 6px;
    font-size: 20px;
    text-align: center;
}

canvas {
    background: var(--violet) !important;
}





.hidden {
    display: none;
}

.small {
    display: block;
    color: #64b967;
}

.nexttext {

    font-size: 16px;
    display: block;
    padding: 12px;
    /* border: 1px solid var(--vert); */
    width: auto;
    margin-top: 10px;
}

.skillalertlogo {
    width: 64px;
    position: absolute;
    left: 16px;
    top: 14px;
}

a {
    color: var(--bleu);
}

.desc {
    margin-bottom: 10px;
}

#fullmoney {
    color: var(--rouge);
}


.jaune {
    color: var(--jaune);
}

.bleu {
    color: var(--bleu);
}

.rouge {
    color: var(--rouge);
}

.violet {
    color: var(--violet);
}

.pink {
    color: var(--pink);
}

.vert {
    border-color: var(--vert);
    color: var(--vert);
}

.blanc {
    color: var(--blanc);
}

.rose {
    color: var(--rose);
}

.bizname {
    color: #816fd9;
    font-style: italic;

}



.emplacement {
    display: block;
    height: 150px;
    width: 150px;
    border: 1px solid var(--rouge);
    padding: 5px;
    text-align: center;
    margin: 10px;
    position: absolute;
}

#equip_head {
    left: 200px;
}

#equip_backpack {
    left: 380px;
    height: 122px;

}

.coolbox {
    display: inline-block;
    margin-right: 0;
    margin-top: 5px;
    text-align: center;
    position: relative;
}

#equip_torso {
    top: 180px;
    left: 200px;
}

#equip_underwear {
    top: 360px;
    left: 200px;
}

#equip_heart {
    top: 150px;
    left: 380px;
}

[data-title]:hover::after {
    content: attr(data-title);
    display: none;
}

#equip_wallet {
    top: 150px;
    left: 15px;
}

#coolmonitor {
    height: 70px;
    padding-left: 0px;
    padding-top: 10px;
    display: none;
    margin-left: 190px;
    position: absolute;
    z-index: 1;
    width: 400px;
    top: 373px;
    left: -92px;
    pointer-events: none;

}

#mobilefullscreensuggest {
    position: absolute;
    z-index: 444444444444444;
    background: var(--jaune);
    padding: 40px;
    margin-left: 50%;
    width: 300px;
    top: 115px;
}

.coolers {
    pointer-events: all;
}

.coolers .itempic::before {
    content: "";
    position: absolute;
    width: 65px;
    height: 65px;
    background-color: var(--violet);
    border-radius: 25px;
    z-index: -1;
    left: -2px;
    top: -6px;
}

#scannernoise,
#scanneridle {
    width: 324px;
    height: 128px;
    z-index: 2;
    position: absolute;
}

#tooltipbox {

    font-size: 20px;
    color: var(--blanc);
    position: absolute;
    z-index: 3333;
    background: var(--violet);
    padding: 5px;
    border-radius: 10px;
    display: none;
    pointer-events: none;
    max-width: 500px;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.2;

}

.title {
    font-size: 125%;
    display: block;

}

.timor {
    font-size: 13px;
    color: var(--blanc);
    position: absolute;
    top: -4px;
    margin-left: 10px;
    background: none;
    padding: 2px;
    border-radius: 3px;
    text-align: center;
    width: 40px;
}


.skullicon {
    background-image: url("/img/icons/skull.png");
    background-size: 36px;
    width: 36px;
    height: 36px;
    display: inline-block;
}

.soundicon {
    position: relative;
    left: -15px;
    top: -15px;

}

.soundicon svg {
    position: absolute;
}



#log .list {
    font-size: 17px;
}

#logoblektre {
    width: 284px;
    margin-left: 25px;
    margin-top: 20px;
    opacity: 0.85;
}

#worldtime {
    text-align: center;
    padding-top: 25px;
    color: #48855d;
    top: -84px;
    position: absolute;
    left: 69px;
    width: 180px;
    overflow: hidden;

}

.hovername {
    height: 23px;
    overflow: hidden;
    display: block;
    width: 187px;
}

#worldtime .time {
    font-size: 40px;
    color: var(--rouge);


}

#worldtime .date {
    font-size: 20px;
}

.myname {
    text-align: left;
    margin-bottom: 10px;
    font-weight: bold;
    width: 165px;
    overflow: hidden;
    height: 30px;

    color: var(--vert);
    width: 100px !important;
}

.col_place {
    margin-top: 4px;
    margin-bottom: 13px;
    background: #9acf9a;
}

#PEOPLEHEREBUTTON {
    margin-top: 58px;

}

#quickstart {
    display: none;
}

#tabs.nutabs button {
    width: 145px !important;
}

.nutabs::after {
    border-top: 1px solid var(--rouge);
    content: "";
    position: absolute;
    width: 640px;
    height: 9px;
    top: 28px;
    background: var(--jaune);
    z-index: 20;
}

.nutabs button {
    border-bottom:
        none !important;
    margin-right: 10px !important;

    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-left-width: 3px;
    background: #e3cd88 !important;
}

#inventaire .nutabs>div,
#inventaire .nutabs button {
    width: 88px;
}

.nutabs>div {
    text-align: center;
    width: auto;
    white-space: nowrap;
    display: inline-block;
}

.nutabs {
    display: flex;
}

.nutabs>div {
    flex-shrink: 0;
}


.preludeboxes {
    display: none;
}

.gb_caps {
    display: inline-block;
    vertical-align: top;
}

.skilluseexit {
    display: none !important;
}




.stat,
.peoplescan {
    font-family: var(--pixelfont);
}

#languagechange {
    font-size: 20px;
    padding: 10px;
    position: relative;
    padding-right: 45px;
}

#languageselector {
    text-align: center;
}

#languagechange .chevron {
    position: absolute;
    right: 15px;
    top: 11px;
}

.iframebody {
    background: var(--jaune);
    color: var(--ink);
}

.framed {
    border-top: var(--bordertop);
    border-right: var(--borderright);
    border-left: var(--borderleft);
    border-bottom: var(--borderbottom);
}

.quit {
    position: absolute;
    top: 655px;
    right: 15px;
    z-index: 2;
    padding: 5px;
    font-size: 13px;
}

.legicount {
    margin-top: 0;
}

.int_frame::before {
    content: "";
    position: absolute;
    width: calc(100% - 12px);
    height: calc(100% - 12px);
    z-index: 0;
    top: 0;
    /*    border-radius: 6px; */
    left: 0;
    border-top-width: 6px;
    border-top-style: solid;
    border-top-color: rgb(234, 215, 161);
    border-right-width: 6px;
    border-right-style: solid;
    border-right-color: rgb(234, 215, 161);
    border-bottom-width: 6px;
    border-bottom-style: solid;
    border-bottom-color: rgb(202, 175, 95);
    border-left-width: 6px;
    border-left-style: solid;
    border-left-color: rgb(202, 175, 95);
    border-image-outset: 0;
    border-image-repeat: stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 1;
    pointer-events: none;
}

button.int_frame {
    border-radius: 0 !important;
}

button.int_frame::before {
    border-radius: 0 !important;
}

button:hover.int_frame {
    background-color: rgb(174, 150, 78) !important;
}

button:hover.int_frame::before {
    border-top-color: var(--jaune);
    border-right-color: var(--jaune);
    border-bottom-color: rgb(191, 164, 81);

}



.midframed {
    border-top: 2px solid var(--rouge);
    border-right: 2px solid var(--rouge);
    border-left: 8px solid var(--rouge);
    border-bottom: 8px solid var(--rouge);
}














































#visuelcache {
    /*  border-color: var(--rouge);*/
}

#visuelcache.nointerractframe {
    /* border-color: var(--violet) !important;*/
}

.persobox {
    height: 260px;
    width: 89%;
    margin-bottom: 20px;
    display: flex;
    background: var(--jaune);
    margin-left: 8px;
}

.persobox>div {
    display: inline-block;
    position: relative;
}

.preseldelete {
    font-size: 16px;
    padding: 5px;
}



.delmenu {
    position: fixed;
    z-index: 4444;
    top: -40px;
    left: 0;
    width: 100%;
    height: 100%;
    background: #e6c86e;
    text-align: center;
    padding-top: 10%;
}

.delmenu button {
    max-width: 350px;
}

.seldelete {
    background: white;
    margin-top: 100px;
}

.seldeletecancel {
    background: white;
    width: 100%;
}


.competence {
    color: #5b58aa;
}

.uicompetences {
    width: 100%;
}

.selsub {
    margin-top: 20px;
    width: 100%;
    margin-left: 50px;
    ;
}

.selsub #charbox .hoverpeople {
    margin-left: 0;
}


.selected {
    background: #674e73;
}



#noskillvalide {
    position: absolute;
    top: 75px;
    left: 20px;
    padding:
        20px;
    color: var(--rouge);
    font-size: 18px;
    width: 390px;
}


.vname {
    position: absolute;
    top: 10px;
    text-align: center;
    width: 100%;
}

.selected .perso_selector {
    border: none;
    font-weight: bold;
    display: none;
}

.persoselpic {
    pointer-events: none;
    width: 100px;

}

.selscanner {
    width: 100%;
}

.vignette {
    position: relative;
    pointer-events: none;
    width: 128px;
    height: 256px;
}

.vignette .myimage {

    position: absolute;
}

.portrait {
    width: 128px;
    height: 256px;
    background-repeat: no-repeat;
    background-position: -0 -0;
    background-size: auto 256px;
    overflow: hidden;
}

.portrait.dead {
    background-position: -2300px 0px;
    transform: rotate(-90deg);
    margin-top: 64px;
}

#coach_skin_list .dalist {
    padding-top: 100px;
}

.genrebox table td {
    text-align: center;
}

.talkbloc {
    background: var(--blanc);
    padding: 10px;
    border-radius: 5px;
    display: inline-block;
}

#coachpub {
    position: absolute;
    z-index: 2;
    right: 74px;
    transform: scale(2);
    top: 83px;
    opacity: 0.7;
    pointer-events: none;
}


.vignette .hat {
    width: 128px;
    height: 128px;
    background-size: 6528px;
    /* depends on frame number of HATS 128 * frames */

    background-repeat: no-repeat;
    overflow: hidden;
}

#hoverpeoplebox .vignette {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}




#hackbox button,
#hackbox #hackinput,
#hackbox #hack_trait_select,
#hackbox #hack_trait_value,
#hackbox #hack_item_select,
#hackbox #hack_item_qt {
    padding: 5px;
    font-size: 12px;
}

*:focus {
    outline: 1px dotted var(--rouge);
}



/* MUSIC */

.mp_button {
    left: 17px;
    top: 18px;
}



#musicon {
    position: absolute;
    top: 2px;
    left: 1px;
}

#playnext {
    left: 105px;
    top: 18px;
}

#musicplayer {
    display: none;
    position: relative;
    margin-left: 10px;
    width: 300px;
    background-image: url('/img/MENU/players.png');
    background-size: 300px;
    height: 64px
}

#character_menu .relation {
    position: relative;
    text-align: left;
    right: 0;
    top: 0;
}

#character_menu .scrollbox {
    height: 680px;
}




#musicplayer,
#musicplayer button,
#musicplayer a {
    color: var(--violet) !important;
    text-align: left;

}

#musicplayer .fakeicon {
    position: absolute;
    top: 1px;
    left: 8px;
}

#musicplayer button {

    padding: 2px !important;
    height: 30px;
    width: 30px;

    text-align: center;
    position: absolute;
    background: none;
    border: none;
    border-radius: 0;
}

#musicplayer button:hover {
    background: none !important;
}


#musicplayer button svg {
    width: 20px;
    position: absolute;
    top: -1px;
    left: 18px;

}



#musicplayer button svg.music {
    top: -2px;
    left: 3px;
}

#musictitle {
    font-size: 10Px;
    color: var(--vert);
    font-family: 'Silkscreen', cursive;
    position: absolute;
    right: 20px;
    top: 27px;
    width: 129px;
}

input,
textarea,
select {
    font-family: var(--fontfamily);
    border: none;
    background: none;
    border-top: 1px dotted var(--buttoncolor);
    border-right: 1px dotted var(--buttoncolor);
    border-left: 2px dotted var(--buttoncolor);
    border-bottom: 2px dotted var(--buttoncolor);
    font-size: 22px;
    color: var(--buttoncolor);
    padding: 14px;
    margin: 0 0 20px;
}





.demopic {


    width: 100%;


}



h1 {
    font-size: 24px;

}

h1,
h2,
h3,
h4,
h5 {
    color: var(--ink);
}

.blektropedia h1,
.blektropedia h2,
.blektropedia h3,
.blektropedia .menu {
    /*    font-family: var(--pixelfont); */
}

.blektropedia {
    background-color: var(--jaune);
}

.blektropedia .wiki {
    background: var(--jaune);
    padding: 20px;
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
    height: 540px;
    padding-right: 0px;
}

.blektropedia .wiki_layout {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.blektropedia h3 img {
    display: inline-block;
    margin: 0;
    float: none;
}

.blektropedia #logo {

    width: 300px;
    margin: auto;
}

.blektropedia #logo img {
    width: 300px;
    image-rendering: pixelated;
}

#blektropedia_iframe {
    background: var(--jaune);



}

#dalert h3 {
    margin: 10px;
}

.blektropedia img {
    image-rendering: auto;
}

.chapter .itempic {
    float: right;
}

.codexitem {

    border-bottom: 1px solid var(--rouge);
}

.cybrainicon {
    transform: scale(4);
    position: absolute;
    left: 30px;
    top: 20px;
}

.cybraintitle {

    margin-left: 110px;
}

.codexitem .competencepic {
    float: left;
    margin-right: 30px;
}

.chapter-menu {
    position: sticky;
    top: 0;
    background: var(--jaune);
    z-index: 10;
    padding: 0;
    border-bottom: 2px solid var(--rouge);
    width: 100%;
    margin-bottom: 20px;
}

.chapter {
    position: relative;
    height: 563px;
    overflow-y: scroll;
    width: auto;
    overflow-x: hidden;
    padding-right: 20px;



}

.chapter-menu ul {}

.chapter-menu ul li {
    display: inline-block;
    margin-left: 20px;
}

.chapter i {
    font-size: 18px;
    color: var(--vert);
    margin-right: 10px;
}

.chapter-menu ul li {
    margin-left: 20px !important;

}

.chapter-menu ul li a {
    text-transform: capitalize;
}

#wikimenu {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 50;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}

#wikimenu .large_button {
    width: 75px;
    height: 44px;
    margin: 0;
    padding: 0 !important;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

#wikimenu #closewiki,
#wikimenu #backwiki,
#wikimenu #topwiki {
    float: none;
    position: static;
}

#wiki_menu_toggle {
    display: none;
}

body.wiki-mobile #wikimenu {
    position: sticky;
    top: 0;
    right: auto;
    z-index: 120001;
    flex-direction: row;
    justify-content: flex-start;
    gap: 6px;
    padding: 6px 0 8px;
    background: var(--jaune);
}

body.wiki-mobile #wikimenu .large_button {
    width: auto;
    min-width: 58px;
    height: 40px;
    padding: 0 10px !important;
    font-size: 14px;
}

body.wiki-mobile #wiki_menu_toggle {
    display: flex;
}

body.wiki-mobile .wiki_layout {
    display: block;
}

body.wiki-mobile .wiki_layout>.menu {
    display: none !important;
    position: fixed;
    top: 56px;
    left: 8px;
    right: 8px;
    max-height: 55svh;
    overflow-y: auto;
    background: var(--jaune);
    border: 2px solid var(--rouge);
    padding: 10px 12px;
    box-sizing: border-box;
    z-index: 120002;
    filter: drop-shadow(4px 4px 9px rgba(0, 0, 0, 0.25));
}

body.wiki-mobile.wiki-menu-open .wiki_layout>.menu {
    display: block !important;
}

body.wiki-mobile .blektropedia {
    width: 100%;
    max-width: 100%;
    padding: 8px;
    box-sizing: border-box;
    overflow-x: hidden;
}

body.wiki-mobile .blektropedia .menu {
    width: 100%;
    flex: none;
}

body.wiki-mobile .blektropedia .wiki {
    width: 100%;
    height: calc(100svh - 84px);
    margin: 0;
    padding: 10px;
    box-sizing: border-box;
}

body.wiki-mobile .blektropedia .chapter {
    height: 100%;
    padding-right: 8px;
}

body.wiki-mobile .blektropedia .chapter h3 {
    font-size: 30px;
    margin-top: 24px;
}

body.wiki-mobile .blektropedia .chapter p {
    margin: 0 0 24px 0;
    padding-right: 0;
    font-size: 17px;
}

body.wiki-mobile .blektropedia .chapter img,
body.wiki-mobile .blektropedia .sub {
    float: none;
    margin: 0 0 14px 0;
    max-width: 100%;
}

#musicslider {
    display: none;
    position: absolute;
    z-index: 333333;
    background: var(--jaune);
    padding: 20px;
    right: 20px;
    top: 392px;
    height: 215px;
    box-shadow: 0 5px 11px rgb(0, 0, 0);

}

.volume-slider:focus {
    outline: none;
}

.blk img {
    width: 40px;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 5px;
}

.ablk {
    color: var(--vert);
    cursor: pointer;
}

.chapter h3 {
    margin-top: 40px;
    font-size: 40px;
}

.chapter img {
    float: right;
    margin-left: 30px;
    max-width: 295px;
    margin-bottom: 30px;
}

.chapter .exp img {
    float: none;
    max-width: 100%;
    margin: 0;
}

.sub {
    float: right;
    margin-left: 30px;
    max-width: 295px;
    margin-bottom: 30px;
}

.sub img {
    display: block;
    float: none;
    margin: 0;
}

.chapter p {
    margin: 0 0 50px 0;
    padding-right: 20px;
    font-size: 18px;
}

.chapter p,
.chapter li {
    line-height: 1.3;
}

.blektropedia .menu h2 {
    font-size: 17px;
}

.blektropedia li {
    margin-left: 0 !important;
    margin-bottom: 7px !important;
}

.blektropedia {
    padding: 20px;
    overflow: hidden;
    width: min(981px, 100%);
    max-width: 981px;
    margin: 0 auto;
    box-sizing: border-box;
    font-family: var(--pixelfont);
    color: var(--ink);
}

#blektropedia_container {
    position: fixed;
    top: 0;
    z-index: 2222222222222222222222;
    width: 88%;
    height: 730px;
    left: 6%;
    filter: drop-shadow(4px 4px 23px rgba(0, 0, 0, 0.2));
}




.showikpic {
    height: auto;
    border: none;
    width: auto;
    border-radius: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 215px;
    left: 76px;
    cursor: pointer;

}


.showikpic img {
    width: 210px;

}

#blektropedia_container iframe {
    width: 100%;
    height: 100%;
    overflow: scroll;
    border: none;
}

.blektropedia .menu {
    font-size: 16px;
    width: 220px;
    flex: 0 0 220px;
    box-sizing: border-box;
}

.scrollbox {
    position: relative;
    overflow-y: scroll;
    height: 100%;
    overflow-x: hidden;
}

#character_menu,
#createchar {}




#creaturecharform {
    height: 680px;
    overflow-y: scroll;
}


#creaturecharform input,
#creaturecharform select {
    font-size: 20px !important;
    padding: 6px;
    margin-top: 0px;
    margin: 0;
}

#creaturecharform td {
    padding-bottom: 8px;
    height: 50px;
}

#diffvalue {
    font-weight: bold;
}

.fun {
    display: inline-block;
    font-weight: bold;
    animation: colorblink 1s infinite steps(1);
}

@keyframes colorblink {
    0% {
        color: var(--bleu);
    }

    20% {
        color: var(--pink);
    }

    40% {
        color: var(--rouge);
    }

    60% {
        color: var(--rose);
    }

    80% {
        color: var(--vert);
    }

    100% {
        color: var(--violet);
    }
}


.minidesc {
    font-size: 80%;
    color: var(--blanc);
}

#desktop_avatar_box {
    position: absolute;
    width: 80000px;
    height: 200px;
    overflow: hidden;
    left: 0px;
}


#avatarcontrolbox {
    position: absolute;
    top: 270px;
    width: 90px;
    display: flex;
    padding-left: 3px;
    right: 94px;
}

#avatarcontrolbox>div {
    width: 50%;
    text-align: center;

    padding: 5px;
    height: 30px;

}

#avatarright {
    margin-left: 5px;
}

.smallbutton {
    border: 1px solid var(--rouge);
    cursor: pointer;
    color: var(--rouge);
}

.smallbutton:hover {
    background: var(--rouge);
    color: var(--jaune);
}

#avatarboxcontainer {
    overflow: hidden;
    right: 90px;
    position: absolute;
    height: 270px;
    width: 98px;
}

#avatarboxcontainer2 {
    overflow: hidden;
    position: relative;
    height: 270px;
    width: 98px;
}

.flexbuttons {
    display: flex;
}

.flexbuttons>button {
    margin-right: 10px !important;
}

#character_menu #charbox .hoverpeople {
    margin-left: 0;
}

#land {
    max-width: 1280px;
    position: absolute;
    top: 0;
    left: 0;

}



.butcon {
    display: inline-block;
    height: 65px;
    vertical-align: top;
}

.coutdimplante {}






#destay {
    font-size: 13px;
    padding: 10px;
}

#connect {
    overflow: hidden;
}

#connect input {
    font-size: 18px;
    padding: 9px;
    width: 140px;
}

#connect #stayco {
    width: 20px;
}

#staycobox {
    position: absolute;
    left: 250px;
    top: 47px;
    width: 90px;
}

.copyr {
    font-family: "COPYR";
}

#emptychatbox {
    content: "";
    position: absolute;
    width: 144px;
    height: 88px;
    background-size: 144px;
    background-image: url("../img/buyachatbox.png?v=V_2026_PROD_1_FIXVERSION");
    top: 491px;
    left: 167px;
}

#text {

    overflow-y: scroll;
    overflow-x: hidden;
    margin-top: 20px;
    margin-bottom: 20Px;
    width: 530px;


}

#choices {
    margin-top: 0px;
    margin-bottom: 0;
    width: 520px;
}

#itemhover {
    display: none;
    position: absolute;
    z-index: 5039503593059053;
    background: var(--jaune);
    padding: 30px;
    max-width: 400px;
    pointer-events: none;
    font-size: 20px;

}

#itemhover h4 {
    padding: 0;
    margin: 0;
    margin-bottom: 10px;
    font-size: 1em;
}

#choices .hidden {
    display: none !important;
}

.left {
    text-align: left !important;
}

.scrollableon {
    overflow-y: scroll;
    height: 250px;
}

#scrollburne {
    left: 335px;
    position: absolute;
    top: 498px;
    width: 560px;
}

#scrollburne .ssb_st,
#scrollburne .ssb_sb,
#scrollburne .ssb_up,
#scrollburne .ssb_down {
    right: 6px;
}

#scrollburne textarea {
    width: 470px;
    display: block;
    height: 65px;
    font-size: 20px;
}



.gametextzone .content {
    font-size: var(--fontsize);
    overflow: hidden;
    line-height: var(--linesize);
    width: 520px;
}

.large .gametextzone .content {
    width: 640px !important;
}

.gametextzone {
    display: block;
    width: auto;
    left: 0;
    height: var(--textheight);
    position: relative;
}

#scrollburne .gametextzone {
    overflow: hidden;
}



.gametextzone.large {
    margin-top: 0;
    max-height: 680px;
    height: 680px;
    width: 632px;
    left: 351px;
    z-index: 100000;
    position: fixed;
}

.large #choices {
    width: 580px;
}

.gametextzone.large .gamechoice_button.gridbutton .choicenumber,
.gametextzone.large .gamechoice_button.gridbutton .bloc1 {
    position: absolute;
    top: 10px;
}

.gametextzone.large .gamechoice_button.gridbutton .bloc1 {
    left: 30px;
}

.gametextzone.large .gamechoice_button.gridbutton .bloc2 {
    top: 74px;
    left: 78px;
    font-size: 19px;
    position: absolute;
}

.gametextzone.large .gamechoice_button.gridbutton .bloc3 {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.gametextzone.large .gamechoice_button.gridbutton {
    display: inline-block;
    width: 265px;
    margin-right: 20px;
    height: 310px;
    vertical-align: top;
}


.large #gametext_scrollzone {
    max-height: 675px;
    height: 675px;
    width: 595px !important;
}


.intxt {
    margin: 10px 0;
}

#notifs {
    position: absolute;
    margin-top: 75px;
    background: var(--blanc);
    z-index: 5;
    font-size: 20px;
}

.notif {

    margin: 5px;
    font-style: italic;
}



#game.trademodeclass {
    width: calc(100% - 200px)
}



#closelay {
    cursor: pointer;
    position: absolute;
    top: -0;
    left: 1055px;
    border-radius: 0;
    border: none;
    padding: 20px !important;
    z-index: 34333;
}

#closelay:hover {
    color: var(--rouge) !important;
}

.returnlay {
    position: absolute;
    left: 6px;
    top: 8px;
    border-radius:
        0;
    border:
        none;
}

#overlay .relative {
    overflow-y: scroll;
    overflow-x: hidden;
    height: 680px;
}

.trademodeclass #overlay .relative {
    overflow-y: hidden;
}



#overlay button {
    font-size: 18px;
    background: #e3cd88;
}


#overlay .header {
    text-align: right;
    position: absolute;
    width: 140px;
    margin-top: -20px;
    right: 0;


}

#objectivepanel {
    font-family: var(--pixelfont);
    margin: 13px 22px 13px;
    color: var(--rose);
    height: 44px;
    padding: 14px 18px 0px;
    overflow: hidden;
    position: absolute;
    font-size: 15px;
    width: 230px;
    left: 3px;
    top: 43px;
    cursor: pointer;
}

/* #objectivepanel:hover {
    filter: hue-rotate(-37deg);
} */

#ob_arro {
    position: absolute;
    right: 12px;
    top: 12px;
}

#alertlay #ob_arro {
    right: 111px;
    top: 46px;

}

#alertlay .ob_arro_item {
    pointer-events: all;
}

#ob_display {
    width: 230px;
    font-weight: bold;
}

.ob_arro_item {
    width: 32px;
    height: 16px;
    cursor: pointer;
    background-size: 32px;
    margin-bottom: 12px;
}




#ob_arro_up {
    background-image: url("../img/icons/obj_arro_up.png");
    position: absolute;
    transform: rotate(90deg);
    left: -16px;
    top: 7px;
}

#ob_arro_down {
    background-image: url("../img/icons/obj_arro_down.png");
    transform: rotate(90deg);
    position: absolute;
    left: -246px;
    top: 7px;

}

canvas {
    pointer-events: none
}

#openlogb {
    position: absolute;
    color: var(--jaune);
    background: var(--rouge);
    border-radius: 0;
    right: 10px;
    bottom: -1px;
    padding: 8px 16px 11px;
    font-family: var(--pixelfont);
    font-variant: all-small-caps;
    font-size: 18px;
    pointer-events: none;
    z-index: 1;
}


#worldnewsbox .logline,
#worldnewsbox .newsline {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 258px;

}

#worldnewsbox {

    margin-right: 0;
    padding: 0;
    height: 155px;
    border-radius: 0;
    font-size: 14px;
    width: 260Px;
    margin-left: 25px;
    position: absolute;
    top: 145px;
}

#worldnewsbox .staticon {
    background-size: 8px;
    height: 8px;
    width: 8px;
}

#log .staticon {
    background-size: 11px;
    height: 11px;
    width: 11px;
}

.degrade {
    content: "";
    background: linear-gradient(to bottom, rgba(230, 200, 110, 0) 0%, rgb(187, 204, 171) 100%);
    position: absolute;
    top: 47px;
    left: 4px;
    width: 100%;
    height: 101px;
    pointer-events: none;
    z-index: 1;
}

.degrade.degradejaune {
    background: linear-gradient(to bottom, rgba(230, 200, 110, 0) 0%, rgb(230, 200, 110) 100%);
    left: 0;
}

#deepwatch .degrade {
    top: auto;
    height: 330px;
}

.sondlines {
    height: 330px;
    overflow: hidden;
    font-size: 15px;
}

#worldnewsbox .relative {
    position: relative;
    overflow: hidden;
    padding: 10px;
    height: 126px;
    padding: 7px;

}

.loginfo {
    color: var(--vert);
}

.choicecooliedisabled {
    opacity: 0;
}

/* custom scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background-color: transparent
        /* var(--rouge)*/
    ;
}

::-webkit-scrollbar-thumb {
    background-color: var(--rouge);
    /* border-radius: 20px;*/
    border: 3px solid transparent;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--bleu);
}



#main_panel {

    width: 100%;
    position: relative;

}

#fiche {
    position: relative;
    width: 100%;
}

#col_popups {
    z-index: 15;
    position: absolute;
    width: 600px;
    height: 90px;
    top: 37px;
    pointer-events: none;
    overflow: hidden;
}

#col_popups .blanc {
    color: #74c7e7;
}

.truncate-single-line {
    display: inline-block;
    max-width: 64ch;
    /* Limits the text to approximately 64 characters */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.popin,
.arch_popin {
    padding: 5px;

}



#col_popups_archive {
    margin-top: 20px;
    display: none;

}

#tabs {
    display: flex;
    position: absolute;
    top: 0;
}

.iteration {
    color: var(--rose)
}

.popin {
    border: 1px solid black;
    background: white;
    margin: 5px;
    z-index: 3;
    font-size: 20px;
    position: absolute;
    max-width: 580px;


}

#autopilot {
    display: none;
}

#autopilot:hover {
    display: block;
}

.tut {
    color: #489cbd;
}

#hoverpeoplebox .col_gauche {
    max-width: 60px;
}

#hoverpeoplebox .col_droite {
    min-width: 130px;
}

.gamechoice.exit {
    color: var(--vert);
}

.gamechoice.alerte {
    color: #959595;
    /*  padding-left: 30px; */
}


.skilbucap {
    margin-left: 125px;
    position: relative;
}

.powercontainer {
    font-size: 20px;
    font-family: var(--pixelfont);
    position: absolute;
    top: 11px;
    width: 100px;
    left: -122px;
    height: 60px;
    text-align: right;
}

.alerte .powercontainer {
    filter: grayscale(100%);
}

button:hover .powercontainer {
    top: 8px;
    left: -116px;
}

.powercontainer .info {
    font-style: normal !important;
}

/* .gamechoice.alerte::before {
    content: "";
    background: url("/img/icons/alerte.svg");
    left: 6px;
    width: 30px;
    height: 30px;
    position: absolute;
    background-size: 20px;
    background-repeat: no-repeat;

} */

.gamechoice:hover.alerte::before {
    color: var(--blanc);
}

.gamechoice:hover .bizname {
    color: var(--blanc) !important;
}

.minitut {
    color: var(--vert);
    font-size: 15px;
}

#tutocombat td {
    font-size: 20px;
    padding-bottom: 30px;
    vertical-align: top;
}

#tutocombat tr td:nth-child(2) {
    padding-left: 20px;

}

#tutocombat tr {
    margin-bottom: 20px;
}

.topskill {
    display: flex;
    width: 50px;
    margin-top: 12px;
}

.skillback {
    margin-top: 10px;
    position: absolute !important;
    z-index: 9;
}

.combatinfo {
    margin-top: 10px;
    background: #9acf9a;
    position: absolute !important;
    right: 30px;
    color: white;
}

.choiceicon {
    position: absolute;
    top: 15px;
    left: 0;
}

.required {
    position: absolute;
    left: -4000px;
}

#subscribing {
    padding: 20px;
    background: var(--jaune);
    height: 690px;
    max-width: 600px;
    margin: auto;
    margin-top: 10px;
}

.maxishop {
    z-index: 9999999999;
    height: 685px;
    top: -400px;
}

.ishuman {
    color: var(--rouge) !important;
}

.ishuman.online {
    color: var(--vert) !important;
}

.removing {
    position: absolute;
}


/* #choices br {
    display: none;
}
 */

.gamechoice .itempic {
    display: inline-block;
}

#json,
#persos {
    font-size: 16px;
    margin-top: 62Px;
    /* position: absolute;*/
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 1;
    height: 500px;
}


#place {
    font-variant: all-petite-caps;

}

#thecanvas {
    position: relative;
    width: 640px;
    height: 480px;
}

#sprite_mychar {
    position: absolute;
    margin-top: 160px;
    width: 320px;
    height: 320px;
}


#map {
    position: absolute;
    width: 1200px;
    height: 728px;
    padding: 0;
    top: 0;
    left: 40px;
    z-index: 222;
    display: none;
}

#bizmap_container {
    position: absolute;
    width: 1200px;
    height: 728px;
    padding: 0;
    margin: 0;

}

#bizmap_container .bizbuton {
    border: none;
    width: 35px;
    height: 30px;
    background-image: url("/img/MENU/PAD_BLANK.png");
    background-position: 0px;
    background-size: 70px;
    padding: 0;
    position: absolute;
    cursor: pointer;

}

.hotel {
    width: 16px !important;
    left: -9px;
    position: absolute;
    top: -9px;
    opacity: 0.9;
}

.bizmap {
    background-image: url(/img/pad_map.png?v=V_2026_PROD_1_FIXVERSION) !important;
    background-size: 120px !important;
    background-position: 0 !important;
    position: relative !important;
    width: 60px;
    height: 60px;
    text-align: center;
    overflow: hidden;
    z-index: 3;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
    border: none;
    border-radius: 0 !important;
    cursor: pointer;
}

.bizmap:hover {
    background-position: -60px !important;

}

.bizinfo {
    position: absolute;
    background: var(--jaune);
    bottom: 20px;
    width: 780px;
    left: 200px;
    padding: 20px;
    border-radius: 20px;
    font-size: 24px;
    border: 6px solid var(--violet);

}

#bizmap_container .bizbuton:hover {
    background-position: -70px;
    background-color: none;

}

.inside>.monicon {
    position: absolute;
    left: -6px;
    top: -1px;
}

.curbulle {
    position: absolute;
    background: var(--blanc);
    min-width: 80px;
    padding: 2px;
    text-align: right;
    z-index: 2;
    border-radius: 10px;
    margin-top: -38px;
    margin-left: -21px;

}

/* === Chatbox container === */
/* #nuchatboxcontainer {
    position: absolute;
    right: 340px;
    top: 420px;
    display: none;
}
 */
#nuchatbox {
    display: none;
    position: absolute;
    top: 447px;
    width: 152px;
    z-index: 2;
    font-size: 14px;
    right: 23px;
    height: 197px;

}

#nuchatbox.opened {
    display: block;
    z-index: 3333333;
    top: 355px;
    height: 300px;
    padding-top: 20px;
    left: -599px;
    width: 776px;

}

#nuchatbox.opened::before {
    content: "";
    position: absolute;
    height: 300px;
    background-image: url(/img/ui2/chatboxbulle.png);
    width: 776px;
    background-size: 776px;
    left: -44px;
    top: -45px;

}

#nuchatbox.opened #chatinput {
    width: 400px;
}

.singlenotice {
    display: block !important;
    color: var(--vert);
}

.singlenotice .cnotice {}

.chatline2 {
    color: #3b772d;
}

#buttonrestart {
    margin-left: 166px;
    background: var(--jaune);
    font-size: 50px;
    top: -120px;
    position: absolute;
    width: 300px;
    text-align: center;
}

/* === Chatbox wrapper (hauteur animée) === */
#nuchatbox .nurelative {
    position: relative;
    padding: 5px 10px;
    height: auto;
    overflow: hidden;
    transition: height 0.3s ease;
}

/* Hauteur réduite (fermeture) */
#nuchatbox.reduced .nurelative {
    height: 17px;
}



/* === Haut de la boîte (barre de titre) === */
#nuchatbox .top {
    margin-left: 5px;
    font-style: italic;
    position: relative;
    height: 20px;
    color: var(--blanc);
}

#chatoption table input {
    margin-bottom: 0;
    margin-top: 10px;
}

#chatoption table td:first-of-type {
    text-align: right;
    padding-top: 7px;
    padding-right: 12px;
}

.unread {
    color: var(--blanc) !important;
}

#nuchatbox .title {
    font-size: 14px;
    position: absolute;
    font-weight: bold;

}

.reducertrigger {
    position: absolute;
    top: 0;
    left: 95px;

}

#nuchatbox .top {
    cursor: pointer;
}

#nuchatbox .option {
    position: absolute;
    right: 15px;
    top: 3px;
    font-size: 10px;
}

#nuchatbox .option input {
    height: 10px;
}

/* === Contenu (messages et input) === */
#nuchatcontent,
#chatbox {
    opacity: 1;
    transition: opacity 0.3s ease;
}

.opened #nuchatcontent {
    width: 485px;
}

.chateleminput {
    display: none;
}

.opened .chateleminput {
    display: block;
}

#nuchatbox.reduced #nuchatcontent,
#nuchatbox.reduced #chatbox {
    opacity: 0;
    pointer-events: none;
}

/* === Liste de messages === */
#nuchatbox ul {
    padding-left: 5px;
}

#nuchatbox li {
    list-style:
        none;
    margin-left: 0;
    line-height: 20px;
    margin-bottom: 0px;
}

#nuchatbox #nuchatcontent .name {
    color: #a8eaa8;
    margin-right: 10px;
}



#nuchatcontent>ul {
    height: 100px;
    overflow-y: scroll;
    margin-top: 0;
}


#nuchatbox.reduced {
    width: 90px;
}

/* === Zone de saisie === */
#chatspeak {
    position: absolute;
    padding: 3px;
    color: var(--blanc);
    border: 1px solid var(--blanc);
    left: 440px;
    height: 27px;
    background: none;
    border-radius: 0;
    font-size: 18px;
    top: 131px;
}

#infochat {
    text-align: center;
    bottom: 35px;
    display: block;
    position: absolute;
    left: 18px;
    border: 1px solid #916ea2;
    padding: 3px;

}

#closechatsuppo {
    text-align: center;
    bottom: 321px;
    position: absolute;
    left: 474px;
    border: 1px solid #916ea2;
    padding: 3px;
    pointer-events: all;
    z-index: 55555582;
    opacity: 0;
    cursor: pointer;
}

#closechatsuppo:hover {
    opacity: 1;
}

.chatbutton:hover {
    background: var(--violet);
    color: var(--blanc);

}

.opened #infochat {
    display: none;
}

#chatinput,
#chatspeak {
    margin-bottom: 0;
}

#nuchatbox .nurelative {
    width: 116px;
    height: 200px;
}

#nuchatbox.opened .nurelative {
    margin-left: 50px;
    width: auto;
}

#nuchatbox.reduced .nurelative {
    height: 17px;
}

.myblock {
    display: inline-block;
    vertical-align: top;
    padding-top: 10px;
}


.chatline {
    display: inline-block;
    color: var(--vert);
}

.chatline .talk {
    background: var(--blanc);
}

#chatbox input {
    font-size: 12px;
    color: #3b772d !important;
    border:
        1px dotted #3b772d;
    width: 95px;
    padding: 5px;
    margin-left: 6px;
    margin-top: -9px;
}

#chatbox input::placeholder {
    color: rgb(52, 97, 100) !important;
    opacity: 0.6;
}



#chatmodebutton::before {
    content: "speak mode : ";
}

#chatmodebutton {
    display: none;
    text-align: left;
    position: absolute;
    margin-top: -105px;
    font-size: 16px;
    padding: 5px;
    width: 220px;
    border-radius: 0;
    color: var(--vert);
    border-color: var(--vert);
}



.curbulle::after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    /* Partie gauche du triangle */
    border-right: 10px solid transparent;
    /* Partie droite du triangle */
    border-top: 10px solid var(--blanc);
    /* Couleur du triangle */
}

.bizbuton .inside {
    position: absolute;
    transform: scale(2);
    left: 20px;
    top: 16px;
}

.bizbuton {}

.OURSINEDEALERBIZ {
    display: none;
}

.wcwcclub {
    left: 1033px;
    top: 473px;
    display: block !important;
}

.saucissesellinglmc {
    left: 728px;
    top: 340px;
    display: block !important;
}

.wcplacerueharry {
    left: 294px;
    top: 347px;
    display: block !important;
}

.wcrq {
    left: 699px;
    top: 349px;
    display: block !important;
}

.COACHBIZ {
    left: 223px;
    top: 414px;
    display: block !important;
}

.VOYANTEBIZ {
    left: 185px;
    top: 327px;
    display: block !important;
}

.CHAPALBIZ {
    left: 339px;
    top: 287px;
    display: block !important;
}

.QUINCABIZ {
    left: 417px;
    top: 297px;
    display: block !important;
}

.USINE {
    left: 517px;
    top: 290px;
    display: block !important;
}

.saucissesellingjonction {
    left: 455px;
    top: 296px;
    display: block !important;
}

.HOSTOBIZ {
    left: 548px;
    top: 200px;
    display: block !important;
}

.POSTEPOLICEBIZ {
    left: 599px;
    top: 201px;
    display: block !important;
}

.ANPEBIZ {
    left: 749px;
    top: 201px;
    display: block !important;
}

.ACCUEILBANQUE {
    left: 794px;
    top: 362px;
    display: none !important;
}

.BOURSEBIZ {
    left: 835px;
    top: 342px;
    display: block !important;
}

.KISLABIZ {
    left: 909px;
    top: 343px;
    display: block !important;
}

.wcroof {
    left: 204px;
    top: 24px;
    display: block !important;
}

.disbizroof {
    left: 245px;
    top: 30px;
    display: block !important;
}

.DARKWEBIZ {
    display: block !important;

    left: 349px;
    top: 430px;
}

.disbizunderstair1 {
    left: 618px;
    top: 429px;
    display: block !important;
}

.wcbanquecouloir4 {
    display: block !important;
    left: 871px;
    top: 349px;

}

.LOVEBOX {
    left: 438px;
    top: 365px;
    display: block !important;
}

.HACKMANBIZ {
    left: 385px;
    top: 355px;
    display: block !important;
}

.saucissesellingbird {
    left: 260px;
    top: 352px;
    display: block !important;
}

.HOTEL {
    left: 204px;
    top: 355px;
    display: block !important;
}

.SUPERMARKET {
    left: 125px;
    top: 379px;
    display: block !important;

}

.DOUANE {
    left: 48px;
    top: 381px;
    display: block !important;
}

#map img {
    width: 1200px;
}

#newclosemap {
    position: absolute;
    right: 10px;
    top: 15px;
}

#closecta {
    position: absolute;
    right: 10px;
    top: 15px;
}

.showonstart {
    display: none !important;
}

.placemap {
    width: 100px;
    display: inline-block;
    cursor: pointer;
}


.sepa {
    width: 30px;
}


.staticon,
.karma_icon,
.sex_icon,
.san_icon,
.social_icon {
    height: 16px;
    width: 16px;
    display: inline-block;
    image-rendering: smooth;
    background-size: 16px;
}

.staticon.bladder {
    background-image: url(/img/nupads/bladder.png?v=V_2026_PROD_1_FIXVERSION);
}


.staticon.gas {

    background-image: url(/Game/assets/ICONS/gas.png?v=V_2026_PROD_1_FIXVERSION);
}

.staticon.karma,
.karma_icon {

    background-image: url(/img/karma2.png?v=V_2026_PROD_1_FIXVERSION);

}

.staticon.sex,
.sex_icon {
    background-image: url(/img/sex.png?v=V_2026_PROD_1_FIXVERSION);
}

.staticon.sanity,
.san_icon,
.sanity_icon {
    background-image: url(/img/san.png?v=V_2026_PROD_1_FIXVERSION);
}

.staticon.social,
.social_icon {
    background-image: url(/img/social.png?v=V_2026_PROD_1_FIXVERSION);
}

.brain {
    background-image: url(/img/MENU/skills.png?v=V_2026_PROD_1_FIXVERSION);
    background-size: 20px;
    width: 20px;
}

.staticon.life,
.life_icon,
.life_icon {
    background-image: url(/img/life.png?v=V_2026_PROD_1_FIXVERSION);
}


.staticon.score,
.score_icon {
    background-image: url(/img/score.png?v=V_2026_PROD_1_FIXVERSION);
}





#control_pad .relative {
    width: 160px;
    height: 270px !important;
}

#control_pad {
    width: 178px;
    height: 270px !important;
    position: absolute;
    pointer-events: none;
    top: -6px;
    left: 571px;
}




.nupad {
    width: 60px !important;
    height: 60px !important;
    background-size: 120px !important;
    background-position: 0 !important;
    background-image: url(/img/NUARROWSBLANK.png?v=V_2026_PROD_1_FIXVERSION) !important;
}

.nupad.nupadvert {
    background-image: url(/img/NUARROWSBLANK_green.png?v=V_2026_PROD_1_FIXVERSION) !important;
}

.nupad.nusmall {
    width: 45px !important;
    height: 45px !important;
    background-size: 90px !important;
    background-position: 0 !important;
    background-image: url(/img/NUARROWSBLANK.png?v=V_2026_PROD_1_FIXVERSION) !important;
    position: absolute;
    left: 0;
    top: 0;
}

#UIbuttons_main {
    position: absolute;
    top: 307px;
    left: 30px;
}

#UIbuttons_main>button {
    border: none;
}

#UIbuttons_main .nupad {
    display: inline-block;
}






.nupad::after {
    content: "";
    position: absolute;
    width: 48px;
    height: 48px;
    left: 9px;
    top: 3px;
    background-size: 48px;
}

.nupad:hover {
    background-position: -60px !important;
}

.nupad.nusmall:hover {
    background-position: -45px !important;
}

.nupad:hover::after {
    left: 7px;
    top: 7px;
}

.nupad[data-target=wc] {
    left: 0;
    top: 120px;
}

.nupad[data-target=wc]::after {
    background-image: url(/img/nupads/caca.png?v=V_2026_PROD_1_FIXVERSION);


}

#pad_world {
    top: 60px;
    left: 60px;
}

#pad_world::after {
    background-image: url(/img/nupads/map.png?v=V_2026_PROD_1_FIXVERSION);
}


#uib_skills::after {
    background-image: url(/img/nupads/skills.png?v=V_2026_PROD_1_FIXVERSION);
}

#uib_inv::after {
    background-image: url(/img/nupads/inv.png?v=V_2026_PROD_1_FIXVERSION);
}

#callingrelations::after {
    background-image: url(/img/nupads/contacts.png?v=V_2026_PROD_1_FIXVERSION);

}

#uib_bizs::after {
    background-image: url(/img/nupads/biz.png?v=V_2026_PROD_1_FIXVERSION);

}

#peopleherepad::after {
    background-image: url(/img/nupads/peoplehere.png?v=V_2026_PROD_1_FIXVERSION);

}

#pad_ubeurre {
    left: 120px;
    top: 120px;
}

#pad_ubeurre::after {
    background-image: url(/img/nupads/car.png?v=V_2026_PROD_1_FIXVERSION);
}




#pad_shop {
    top: 0;
    left: 0;
}

#pad_shop::after {
    background-image: url("/img/coin.gif");
    background-size: 30px !important;
    background-repeat: no-repeat;
    top: 12px;
    left: 17px;
}

#pad_shop:hover::after {
    top: 16px;
    left: 15px;
}

#pad_shop.disabled::after {
    background-image: url(/img/nupads/inertcoin.png?v=V_2026_PROD_1_FIXVERSION);
}



#pad_potomap {
    background-image: url(/img/pad_map.png?v=V_2026_PROD_1_FIXVERSION);
    width: 60px;
    height: 60px;
    background-size: 120px;
    background-position: 0;
    top: 155px;
    left: 300px;
}

#pad_interact {
    background-image: url(/img/pad_interact.png?v=V_2026_PROD_1_FIXVERSION);
    background-size: 120px;
    pointer-events: none;
}





.arrow_pad {
    position: absolute;
    font-size: 40px;
    width: 60px;
    height: 60px;
    text-align: center;
    background-image: url(/img/ARROWS.png?v=V_2026_PROD_1_FIXVERSION);
    background-repeat: no-repeat;
    background-size: 300px;
    overflow: hidden;
    z-index: 3;
    pointer-events: all;
}

.arrow_pad:hover {
    cursor: pointer;
    background-image: url(/img/ARROWS_hover.png?v=V_2026_PROD_1_FIXVERSION);
}

.sondavatar {
    position: absolute;
    right: 40px;
    top: -7px;
    transform: scaleX(-1);
}


#peopleherepad {
    left: 120px;

}


#pad_up {
    top: 0;
    left: 60px;
    background-position: 0;
}

.isdoor {
    background-position: -240px !important;
}


#pad_right {
    top: 60px;
    left: 120px;
    background-position: -60px;
}

#pad_down {
    top: 120px;
    left: 60px;
    background-position: -120px;
}

#pad_left {
    top: 60px;
    left: 0;
    background-position: -180px;
}

#cadrephaser {

    width: 650px !important;
    height: 433px !important;
    position: absolute;
    background-image: url(/img/FRAME.png?v=V_2026_PROD_1_FIXVERSION);
    z-index: 0;
    left: -16px;
    background-size: contain;
    top: -18px;
    background-repeat: no-repeat;
}

.green {
    background-color: #cefbd8;
}


.stats {
    opacity: 0;

}

.statbloc {

    font-size: 20px;
    margin-bottom: 0;
    /* width: 25%; */
    font-smooth: disabled;
    -webkit-font-smoothing: none;
    text-align: left;
}



#visuelcache {


    position: relative;

    width: 600px;
    height: 400px;
    overflow: hidden;

}

.myself {
    pointer-events: none;
}

.myscan {
    padding-left: 10px;
}

.myself #perso_ {
    pointer-events: none;
}

#traits_info .list {
    width: 460px;
    margin: auto;
    margin-top: 35px;
}

.updatestat {
    position: absolute;
    top: 0;
    left: 0;
    width: 600px;
    height: 400px;
    font-style: italic;
    color: orange;
    width: 60px;
    z-index: 9;
}

.updatetrait {
    font-style: italic;
    color: green;
}


.place {
    color: darkcyan;
}


.gendered:hover {
    font-style: italic;
}

/* #infoplace {
    text-align: center;
    display: block;
    width: 100%;
    font-family: var(--pixelfont);
    font-size: 20px;
    height: 25px;
    color: var(--vert);
} */


.stat[data-stat=nom] {
    color: #048dc1;
    text-align: left;
    margin-bottom: 10px;

}



.openlay {
    width: 100%;
}

.openlay img {
    pointer-events: none;
}



.quickie {
    border: none;
    width: 70px;
    height: 60px;
    background-image: url("/img/MENU/PAD_BLANK.png");
    background-position: 0px;
    background-size: 140px;
    padding: 0;
    position: relative;


}

.quickie .itempic {
    position: absolute;
    top: 11px;
    left: 15px;
    opacity: 1;
    image-rendering: auto;
}

.quickie:hover .itempic {
    top: 15px;
    left: 13px;
}

.slotnb {
    z-index: 2;
    position: absolute;
    color: var(--blanc);
    font-weight: bold;
    right: 9px;
    top: 4px;
    text-align: right;
}


.quickie:hover .slotnb {
    right: 11px;
    top: 8px;
}



.long-press {
    background-color: red !important;
    /* Ensure the red color is applied */
}


.stats2 .statbloc .stat {
    color: var(--rouge) !important;
}

.stats3 {
    width: 100%;
    position: absolute;
    right: -623px;
}





#UIbuttons_main img {
    width: 60px;
    height: 60px;
}


.s33 {
    width: 100% !important;

}

.stats2 {
    color: var(--vert);
    text-align: center;
    padding-top: 8px;
    float: right;

}


.statwidth {
    width: 50px;
    display: inline-block;
    padding-left: 10px;
    display: none;
}

.stats3 .stat {

    font-size: 22px;
}

.fuel {
    width: 50px;
    text-align: right;
    padding-right: 10px;

}

.bonus {
    width: 50px;
}

.bigred .vert,
.red .vert {
    color: #abebab;
}

.entete {
    font-size: 15px;
    font-style: italic;
    color: var(--rouge);
}

#randpname {
    padding: 10px 8px 4px;
}

.statnotice {
    font-size: 14px;
    margin-bottom: 20px;
}

#dadetails .itempic {
    float: left;
    background-repeat: no-repeat;
}

.statsui {
    width: 140px;
    height: 100px;
    padding: 10px;
    margin-top: 10px;
    position: absolute;
    left: 26px;
    top: -9px;
    pointer-events: all;
    cursor: pointer;
}


#scannerframe {
    background-image: url('/img/9patchframe/scannerframe.png');
    width: 324px;
    background-size: 324px;
    height: 128px;
    position: absolute;
    margin-top: 0;
    top: 0;
    left: 10px;
    font-family: var(--pixelfont);
}

.statTR {
    height: 28px;
}



.needsUI_icon {
    position: absolute;
    height: 64px;
    width: 64px;
    background-repeat: no-repeat;
    position: absolute !important;
    background-size: 64px;
    top: -64px;
    left: -16px;
    opacity: 0.8
}

#needsUI_so6 {
    background-image: url("/img/icons/so6_icon.png");

}

#needsUI_shit {
    background-image: url("/img/icons/shit_icon.png");

}

#needsUI_zzz {
    background-image: url("/img/icons/wake_icon.png");
}

.tutostaticon {
    position: relative;
    width: 34px;
    height: 34px;
    image-rendering: pixelated !important;
}

.tutostaticon::before {
    content: "";
    background-size: 64px;
    width: 64px;
    height: 64px;
    position: absolute;
    top: -16px;
    left: -16px;
}

.so6icon::before {
    background-image: url("/img/icons/so6_icon.png");
}

.shiticon::before {
    background-image: url("/img/icons/shit_icon.png");
}

.zzzicon::before {
    background-image: url("/img/icons/wake_icon.png");
}

.phonicon {
    width: 32px;
}

.needsUI {
    width: 135px;
    background-size: 100px;
    height: 128px;
    position: absolute;
    top: 0;
    left: 186px;
}


.needbar {
    background-size: 352px;

    width: 32px;
    height: 84px;
    top: 40px;
    background-repeat: no-repeat;
    position: absolute;
}

.needbarback {
    content: "";
    background-image: url('/img/9patchframe/NEEDBAR.png');
    width: 24px;
    height: 92px;
    background-size: 24px;
    position: absolute;
    z-index: 0;
    left: 4px;
    top: 36px;
}

.needbarback:nth-of-type(2) {
    left: 44px;

}

.needbarback:nth-of-type(3) {
    left: 84px;

}


.sausage {
    background-image: url('/img/9patchframe/SAUSAGEBAR.png');
    left: 0;
}

.shit {
    background-image: url('/img/9patchframe/SHITBAR.png');
    left: 40px;
}

.zzz {
    background-image: url('/img/9patchframe/ZZZBAR.png');
    left: 80px;
}

.lifebar {

    width: 296px;
    height: 44px;
    margin-top: -7px;
}


.lifebar {
    background-image: url('/img/9patchframe/lifeUI.png');
    background-size: 296px;
}

#mylife .lifebar {
    background-image: none;
}

.bar2vie {
    background-image: url('/img/9patchframe/blood.png');
    background-size: 3256px;
    width: 296px;
    height: 44px;
}

.scannerbar {
    transform: scale(0.5);
    width: 148px;
    margin-left: -40px;
}






.inlinechoice {
    display: inline-block !important;
    margin-right: 10px;
}


#worldnews {
    font-size: 17px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

#worldnewsbox {
    cursor: pointer;
}

#worldnewsbox .perso_ {
    z-index: 0;
}

/* #worldnewsbox:hover {
    background: var(--blanc)
} */











#music {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 10px;
    display: none;
    font-size: 19px;

}

#loadingtext {
    position: absolute;
    top: 200px;
    left: 0;
    text-align: center;
    font-size: 30px;
    color: #e6c86e;
    width: 100%;
}

#assettext {
    position: absolute;
    top: 240px;
    left: 0;
    text-align: center;
    font-size: 10px;
    color: #e6c86e;
    width: 600px;
}


.playername {
    position: absolute;
    left: 0;

    /* border: 1px solid red;*/
    color: var(--blanc);
    /* overflow: hidden; */
    text-align: center;
    font-size: 20px;

    z-index: 1;

}

.playername:not(#paffichage):hover {
    cursor: pointer;
}

.nointerractframe .playername:hover {
    cursor: not-allowed !important;
}

.hideplayernames .playername {
    display: none !important;
}


.alert {
    color: var(--rouge) !important;
}

.newday {
    color: var(--vert);
    font-style: italic;
}



.blk {
    cursor: pointer;
}

.italic {
    font-style: italic;
}

#chart-container {
    width: 700px;
    height: 400px;
    transform: none;
}

.rougeclignotant {
    animation: clignote 0.5s step-start infinite;
    font-weight: bold;
}

@keyframes clignote {

    0%,
    50% {
        color: var(--rouge)
    }

    51%,
    100% {
        color: var(--vert)
    }
}

.invbutton.disabled {
    filter: grayscale(100%);
}

#chart-container canvas {
    background: none !important;
    font-family: "BLEKTREFONT";
    pointer-events: all;
    width: 600px;
    height: 350px;
    left: 0px;
    position: absolute;
    overflow: hidden;
}

.usNotice {
    margin-left: 32px;
    display: none;
    position: absolute;
    background: var(--blanc);
    min-width: 70px;
    max-width: 500px;
    -webkit-transition: all 2s ease-out;
    -moz-transition: all 2s ease-out;
    -ms-transition: all 2s ease-out;
    -o-transition: all 2s ease-out;
    transition: all 2s ease-out;
    z-index: 9;
    font-size: 20px;
}

.cnotice {
    font-size: 15px;
}

.perso_ {
    z-index: 1;
}

.perso_ {
    color: var(--bleu);
    position: relative;
    cursor: pointer;
}

#typedtext .perso_ {
    cursor: default;
    text-decoration: none;
}

#typedtext .perso_.typedtext_personname_clickable {
    cursor: pointer;
    text-decoration: none;
    border-bottom: none;
}

#deepwatch .perso_ {
    z-index: auto;
}

.nointerractframe .perso_ {
    /*  cursor: not-allowed; */
}


.online .perso_ {
    color: var(--vert);
}

.offline .perso_ {
    color: var(--rouge);
}

.myself .etikette.online .perso_ {
    color: var(--blanc) !important;
}



.etikette {
    font-size: 15px;

}


.etikette.online .perso_ {
    color: var(--vert) !important;
    /* vert */
}

.etikette.offline .perso_ {
    color: var(--rouge) !important;
    /* rouge */
}

.etikette.isbot .perso_ {
    color: var(--bleu);
    /* bleu */
}

.etikette.isnpc .perso_ {
    color: #4b79b2;
    /* bleu */

}

.playername:not(.myself):hover .perso_ {
    background: var(--blanc);
    cursor: pointer;
}

.nointerractframe .playername:not(.myself):hover .perso_ {
    cursor: not-allowed;
}

.nointerractframe .playername:hover {
    cursor: not-allowed;
}

.nointerractframe.DUELMODE .playername:not(.myself):hover .perso_ {
    cursor: help;
}

.nointerractframe.DUELMODE .playername:hover {
    cursor: help;
}


.crimiscanner {
    position: absolute;
    right: 0;
    top: 24px;
}

.usNotice_active {
    margin-top: -50px;

}


.usnotice_plus {
    color: var(--vert) !important;
}

.usnotice_moins {
    color: var(--rouge) !important;
}

.notifcolor {
    opacity: 0%;
}

#notifs {
    opacity: 0%;
}

#notifs:hover {
    opacity: 100%;
}

.life {
    color: var(--rouge);
}

.social {
    color: var(--social);

}

.sex {
    color: #c95b8e;
}

.gas {
    color: var(--vert);
}

.money {
    color: var(--bleu);
    height: auto;
    width: auto;
}


.san,
.sanity {
    color: #3c618e;
}

.karma {
    color: var(--vert);
}

#traitsUI {
    margin-top: 20px;
    color: var(--bleu);
}

#traitsUI .list {
    margin-left: 20px;
}

.UIbuttons {
    text-align: right;
    margin-top: 18px;
    margin-left: 0;
    margin-right: 20px;
}

#UIbuttons_main .nupad {
    margin-left: 0;
    cursor: pointer;
    position: relative;
    margin-right: -9px;
    margin-top: -4px;
}



.flex {
    display: flex;
}

#lastinfo {
    font-size: 20px;
}

#lastinfo .splash {
    margin: 26px auto 0;
    display: block;
    height: 300px;
    border: 4px solid var(--rouge);
    border-radius: 10px;
}



#bugreport_window textarea {
    width: 90%;
    min-height: 150px;
    font-size: 12px;
}



#specialthanks {
    font-size: 17px;
    color: var(--rose);
}

#fulbutton {
    left: 103px;
    top: 3px;
}




li {
    list-style: disc;
    margin-bottom: 10px;
    margin-left: 20px;
}

#connec_prelude .bugreport {
    position: relative;
    display: inline-block;
    vertical-align: top;
    right: 0;
    margin: 0;
    pointer-events: none;
}

.bugreport img {}

#lastinfo .closeprelude {
    margin-top: 20px;
}

#lastinfomaj h3 {
    color: #b08d66;
    font-weight: normal;
    font-style: italic;
}

#lastinfomaj,
#lastinfomaj a {
    font-size: 14px;
    color: var(--marron);
}

#closeprelude {
    position: absolute;
    cursor: pointer;
    right: 26px;
    top: 8px;
    z-index: 1000;
}

#logoblektre {
    margin: auto;
    display: block;
    width: 325px;
}

.endgamereport {
    display: inline-block;
    width: 250px;
}


#mobilead img {
    width: 300px;
    opacity: 0.9;
}

.large #frage {
    width: 445px;
}

#createaccount .badlogin {
    position: relative;
    top: 0;
}

.overlaymode {
    position: fixed;
    padding: 0 20px;
    width: 666px;
    left: 333px;
    z-index: 999;
    height: 702px;
    overflow-y: scroll;
    overflow-x: hidden;
    top: 30px;
}

.overlaymode h2 {
    padding-top: 0;
    margin-top: 10px;
    display: block;
}

#padshopbubble {
    position: absolute;
    background: var(--blanc);
    border-radius: 10px;
    padding: 10px;
    font-size: 15px;
    color: var(--bleu);
    top: -50px;
    display: none;
}

#padshopbubble::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 20px;
    border-width: 10px;
    border-style: solid;
    border-color: var(--blanc) transparent transparent transparent;
}

.overlaymode::before {
    content: "";
    background-image: url(/img/ui2/overlay.png);
    background-size: 1500px;
    position: fixed;
    width: 1125px;
    left: -60px;
    margin: auto;
    top: -177px;
    height: 960px;
    z-index: -1;
    pointer-events: none;
}

#connec_prelude_steamok {
    z-index: 999;
    position: absolute;
    background: var(--jaune);
    padding: 0 20px;
    width: 600px;
    margin: auto;
    left: calc(50% - 300px);
    top: 10px;
    min-height: 717px;
    box-shadow: 1px 1px 8px 9px rgba(0, 0, 0, 0.2);
    max-height: 100%;
}

#connec_prelude_steamok img {
    width: 100%;
    margin-top: 22px;
}

#connec_prelude .container {}

#lastinfo .content {
    overflow-y: scroll;
    position: relative;
    max-height: 700px;
}

.logbox {
    padding-top: 20px;
}

.lifeitemsbar {
    margin-top: 5px;
    position: absolute;
    top: 220px;
    left: 68px;
}

#diskUI {
    background-image: url("/Game/assets/ICONS/UIdisk.png");
    height: 27px;
    width: 85px;
    background-repeat: no-repeat;
    margin-bottom: 10px;
    background-size: 32px;

    padding-left: 46px;
    padding-top: 5px;
    display: inline-block;
}

#gasUI {
    background-image: url("/Game/assets/ICONS/gas.png");
    height: 27px;
    width: 224px;
    background-repeat: no-repeat;
    margin-bottom: 10px;
    background-size: 32px;
    margin-left: 3px;
    padding-left: 46px;
    padding-top: 5px;
    display: inline-block;
}

#gear {
    width: 20px;
    fill: #d77355;
    height: 15px;
}

.UIbuttons .openlay .material-symbols-outlined {
    font-size: 30px;

}

#typedtext .openmap {
    margin: auto;
    display: block;
}

#lostpassword {
    font-size: 12px;

}

.closenews {
    position: absolute;
    cursor: pointer;
    right: 5px;
    top: -20px;
}



#hackbox {

    position: fixed;
    left: 0;
    top: 0;
    pointer-events: all;
    width: 100%;
    z-index: 200;
    background: var(--jaune);
    padding:
        21px;
}

#hackbox:hover {
    display: block;
}


.material-symbols-outlined {


    font-size: 20px;
    vertical-align: top;
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 48
}

#bizdetails {
    font-size: 17px;
}

#bizdetails td {
    text-align: right;

    padding-bottom: 15px;
    padding-right: 32px;
}

#iscriminal {
    position: absolute;
    bottom: 5px;
    left: 10px;
    display: none;
    border-radius: 10px;
    background: var(--violet);
    padding: 6px;
    padding-top: 6px;
    pointer-events: all;
    cursor: pointer;
    font-family: var(--pixelfont);
    height: 35px;
    padding-top: 20px;
    text-align: center;
    width: 67px;
}


#creaturecharform h2 {
    margin:
        0;

    font-size: 35px;
    width: 100%;
    display: block;
    margin-bottom: 25px;

}

.capital_button {
    font-size: 17px;
    padding: 5px;
}

.bizlowinfo {
    color: #8b9368;
}

.persoscrollbar {
    width: 400px;
    height: 32px;
}

#scroll-left {
    float: left;
}

#scroll-right {
    float: right;
}


.scrollable-container {
    width: 400px;
    overflow-x: auto;
    white-space: nowrap;
    position: relative;
    cursor: grab;
}

.scrollable-container:active {
    cursor: grabbing;
}

/* Hide scrollbar for Chrome, Safari, and Opera */
.scrollable-container::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge, and Firefox */
.scrollable-container {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollable-content {
    display: inline-block;


}

.scroll-link {
    margin: 10px;
    cursor: pointer;

    text-decoration: underline;
    display: inline-block;
}





.maxlimit {
    width: 100%;
    text-align: center;
}



#skininfo2 {
    margin-left: 20px;
    position: absolute;
    height: 400px;
    width: 100%;
    top: 0;
    pointer-events: none;
}

.apparencebox {
    position: relative;
}

.skininfo {
    font-size: 21px;
    background: var(--violet);
    color: var(--blanc);
    padding:
        10px;
    border-radius:
        10px;
    margin:
        0 20px;
    position: absolute;
    z-index: 3;
    top: 0;
    right: 128px;
    width: 500px;
    padding:
        20px;
}

button:disabled,
button:disabled:hover {
    background-color: #cccccc;
    color: #666666;
    cursor: not-allowed;
    border: 1px solid #aaaaaa;
}


.hl_arrowpad {
    height: 60px;
    width: 60px;
    top: 0;
    left: 0;
    position: absolute;
    background-image: url('/img/nupads/hl-sheet.png');
    background-repeat: no-repeat;
    background-size: 600px;
    opacity: 0.7;
    display: none;
    animation: play 0.5s steps(10) forwards;
}

@keyframes play {
    from {
        background-position: 0 0;
    }

    to {
        background-position: -600px 0;
    }
}



.avatarbox {
    width: 96px;
    height: 192px;
    display: inline-block;
    margin-right: 15px;
    margin-bottom: 15px;
    position: relative;
    cursor: pointer;
}

.selected.int_frame::before {
    border-top-color: #f48c6d;
    border-right-color: #f48c6d;
    border-bottom-color: #bd654b;
    border-left-color: #bd654b;
}

.avatarbox.selected {

    background: var(--rouge);
    border-radius: 5px;
}

.avatarbox.disabled {
    filter: grayscale(100%);
    pointer-events: all;
    background: var(--jaune);
}

.avatarbox.selected.disabled {
    /*     filter: grayscale(0%); */
    pointer-events: all;
}

.avatarbox .portrait {
    background-size: auto 196px;
    width: 96px;
    height: 192px;
}

.avatarbox .hat {
    width: 96px;
    height: 96px;
    background-size: 3840px;
}

.flexbox {
    display: flex;
}

.contener div {
    width: 50%;
}

#logoblektre {
    width: 284px;
    margin-left: 25px;
    margin-top: 32px;

}




html {
    overflow-x: hidden;
    overflow: hidden;

}

.noframe {
    border: none;

    background: none;

}

.skillmenu {
    text-align: left;
}

.skillmenu button {
    margin-left: 0;
    margin-right: 0;
    background: white;
}


* {
    -ms-interpolation-mode: nearest-neighbor;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-pixelated;
    image-rendering: pixelated;
}

.image-clignote {
    animation-duration: .2s;
    animation-name: clignoter;
    animation-iteration-count: infinite;
    transition: none;
}

@keyframes clignoter {
    0% {
        opacity: 1;
    }

    40% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#mapexplain {
    position: absolute;
}

#mapexplain h2 {
    background: var(--blanc);
}

#bmap .mapic img {
    margin-left: -30px;

}

#mapexplain h4 {
    color: var(--bleu);
    margin: 25px 0px 0;
    padding-left: 0;
    font-weight: normal;
}

.mapcol {
    width: calc(30% - 40px);
    padding: 20px;
    font-size: 20px;
    overflow: hidden;
}

.mapic {

    text-align: center;
    width: 100%;
    margin: auto;

}

area:focus {
    border: none;
    outline-style: none;
    -moz-outline-style: none;
}

#travelbox {
    position: absolute;
    width: 100%;
    height: calc(100% - 115px);
    top: 115px;
    left: 0;
}

#travelbox .relative {
    display: flex;

}

.relative {
    position: relative;
}

.travel_clickable {
    cursor: pointer;
    display: inline-block;
    width: 32%;
    height: 385px;

}

#pdriver {
    display: none !important;
}

#achievement {
    z-index: 333;
    position: fixed;
    bottom: 0;
    background: var(--violet);
    border-radius: 10px;
    right: 0;
    padding: 20px;
    font-size: 15px;
    color: var(--blanc);
    display: none;
    cursor: pointer;
}



.infodev {
    font-size: 17px;
    position: absolute;
    top: 0;
    background: #bcffe0;
    z-index: 1;
    display: none;
}

#deepwatch {
    font-size: 18px;
    line-height: 20px;
}

#deepwatch .deepwatch-layout {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

#deepwatch .deepwatch-left {
    flex: 0 0 60%;
    max-width: 60%;
    min-width: 0;
}

#deepwatch .deepwatch-right {
    flex: 0 0 40%;
    max-width: 40%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    overflow: visible;
}

#deepwatch .sondavatar {
    position: relative;
    right: auto;
    top: auto;
    margin-top: 0;
    overflow: visible;
}

#deepwatch .deepwatch-traits-list .deepwatch_trait {
    width: 100%;
    box-sizing: border-box;
}

#deepwatch .deepwatch_wiki_link {
    cursor: pointer;
}

#deepwatch .deepwatch_wiki_link:hover {
    text-decoration: underline;
}

#deepwatch .deepwatch-events {
    overflow: hidden;
}

#deepwatch .deepwatch-equipement td {
    padding-right: 10px;
}

#infobulleperso {
    width: 210px;
    height: 105px;
    position: absolute;
    margin-top: 0;
    margin-left: 0;
    margin-bottom: 10px;
    animation-fill-mode: forwards;
    cursor: pointer;
    right: 0px;
}

.nointerractframe #infobulleperso {
    width: 350px;
    right: 10px;
}

#permisUI {
    background-image: url(/img/9patchframe/PERMISUI.png?v=V_2026_PROD_1_FIXVERSION);
    background-size: 1800px;
    background-position: left;
    width: 300px;
    height: 160px;
    position: absolute;
    top: 5px;
    left: 35px;

}

#mylife {
    position: absolute;
    top: 171px;
    left: 39px;
}

#permisflame {
    margin-left: 10px;
}

#electro .flame {
    width: 40px;
    z-index: 2;
    position: absolute;
    margin-left: 20px;
    top: -88px;
}

#electro .flame:nth-of-type(2) {
    margin-left: 120px;
    transform: scaleX(-1);
}

#electro .flame:nth-of-type(3) {
    margin-left: 220px;
}

#permiselec,
#permisburn {
    position: absolute;
    width: 320px;
    top: -20px;
    left: -5px;
}

.statbloc.money {

    position: absolute;


}

#moneycounter {
    top: 72px;
    font-size: 38px;
    width: 260px;
    text-align: right;
    display: block;
    padding: 0;
    color: var(--bleu);
    overflow: hidden;
    height: 50px;
    right: -275px;
    position: absolute;
}

#maxindicator {
    position: absolute;
    font-size: 20px;
    top: 76px;
    height: 200px;
    line-height: 2px;
    width: 240px;
    left: 37px;
}

#maxindicator .monicon {
    transform: scale(0.5);
    top: 7px;
    left: -13px;
}






#hoverpeoplebox {
    z-index: 4;
    top: 0;
    left: 0;
    pointer-events: none;
}

.hoverpeople {

    color: var(--rouge) !important;
    text-align: left;
    line-height: 20px;
    font-size: 16px;

    z-index: 1;
}

.hoverpeople td {
    padding: 5px;
}

#charbox .hoverpeople {
    margin: 0;
    margin-left: 10px;
}

.inventory {
    width: 100%;
    font-size: 20px;
}

#inventory_info .itempic {
    margin: auto;
    margin-bottom: 40px;
}

#inventaire {
    overflow: hidden;
    height: 650px;
}

#inventaire .list {
    overflow-y: scroll;
    height: 599px;
    margin-top: 0;
    position: absolute;
    width: 100%;
    top: 44px;
}

#inventaire .filter {
    padding: 5px;
    cursor: pointer;
}

.encapsinvbut {
    width: 80px;
}

#inventaire .setslot {
    /* background: #b1e7b1; */
    border-color: #6b8e6b;
    color: #6b8e6b;
    opacity: 0.7;
}

#inventaire .itemname {
    width: 275px;
}

.filter.active {
    background: var(--rouge) !important;
    color: var(--jaune) !important;
}

.inv_mul_td {
    width: 30px !important;
    text-align: center;
}

.actioninv {
    width: 12px !important;
}

.invitempic {
    width: 30px;
}

#overlay {
    margin-top: 20px;
}


#overlay #deepwatch h2:not(.hidden) {
    display: block;
}

#overlay button {
    padding: 5px;
    margin: 0;
}

#yourmoney {
    position: absolute;
}

.tradewprice {

    color: var(--rouge);
    width: 100%;
    text-align: right;

}

.failedvalidation {
    border-color: red !important;
}

.error {
    color: red;
}

.inventaire_item td,
.uicompetences td {
    border-bottom: 1px solid var(--rouge);
    width: 60px;

}

.inventaire_item.wear {
    color: var(--rouge);
}

.inventaire_item.food {
    color: var(--vert);
}

.inventaire_item.quest {
    color: var(--bleu);
}




.infolink {
    cursor: pointer;
    text-decoration: underline;
}

#tradecontainer .infolink {
    text-decoration: none !important;
}

.inventaire_item button {
    font-family: var(--fontfamily);
    border: none;
    background: none;
    border-top: 1px solid var(--rouge);
    border-right: 1px solid var(--rouge);
    border-left: 4px solid var(--rouge);
    border-bottom: 4px solid var(--rouge);
    font-size: 22px;
    color: var(--rouge);
    padding: 5px;
    margin: 0;
    pointer-events: all;

}






.mobile_only {
    display: none;
}



.info {
    font-style: italic;
}

#phaserframe {
    border: none !important;
    width: 600px;
    height: 400px !important;
    margin: auto;
    background: url(/Game/assets/places/cutscenes/NOISE.gif) !important;
    background-size: 300px !important;
}

#noiseloading {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    background-image: url("/Game/assets/places/cutscenes/NOISE.gif");
    height: 800px;
    width: 800px;
    background-size: 300px !important;
    display: none;
}

.infolog {
    display: inline-block;

}

#infolog {
    width: 300px;
    font-size: 15px;
    position: relative;

}



/* .statsadv {
    margin-top: 5px;
} */

.statsadv>div {
    display: inline-block;
    width: 32px;
    text-align: left;
}

.advmoney {
    margin-top: 0;
    position: absolute;
    right: 6px;
    width: 135px;
    text-align: right;
}

.pipilbox .relation {
    display: none;
}

.relation {
    font-size: 16px;
    color: var(--blanc);
    display: block;
    position: absolute;
    top: 30px;
    right: 10px;
    text-align: right;
}

.roleui {
    width: 50%;
    overflow: scroll;
}






#objectivepanel .marquee {
    width: 175px;
    margin-left: 40px;
    top: -23px;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
}

#ob_display {
    display: inline-flex;
    white-space: nowrap;
    position: relative;
}

#ob_display span {
    padding-right: 2rem;
    color: var(--jaune)
}

.marquee,
.hovermarquee {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    position: absolute;
    height: 60px;
    top: -8px;
}

.hovermarquee p {
    display: inline-block;
    padding-left: 100%;
    margin: 0;
    padding: 0;
}






#uipad2 {
    position: absolute;
    z-index: 1;
    top: 12px;
    left: -21px;
    width: 100%;
    height: 420px;
    pointer-events: none;
}

#uipad2 .nua2 {
    width: 40px;
    height: 40px;
    background-size: 40px;
    position: absolute;
    pointer-events: all;
    display: none;
    cursor: pointer;
}

#nua2_left {
    left: -25px;
    top: 226px;
    background-image: url(/img/ui2/bgpad/left.png);
}

#nua2_right {
    right: -60px;
    top: 226px;
    background-image: url(/img/ui2/bgpad/right.png);

}

#nua2_up {
    top: -4px;
    left: 286px;
    background-image: url(/img/ui2/bgpad/up.png);
}

#nua2_down {
    top: 434px;
    background-image: url(/img/ui2/bgpad/down.png);
    left: 286px;

}

.speech-bubble {
    position: relative;
    background: #ffffff;
    border-radius: .4em;
}

.speech-bubble:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 0;
    border: 59px solid transparent;
    border-top-color: #ffffff;
    border-bottom: 0;
    border-left: 0;
    margin-left: -29.5px;
    margin-bottom: -59px;
}

.advtalk {
    display: none;
}

.usNotice .itempic {
    display: inline-block;
    vertical-align: bottom;
}

.competencepic {
    width: 32px;
    height: 32px;
    background-image: url(/Game/assets/ICONS/COMPETENCES_FRAMES.png?v=V_2026_PROD_1_FIXVERSION);
    margin: auto;
}

.allbars {
    position: absolute;
    top: 280px;
}

.alerte .competencepic {
    filter: grayscale(100%);
}

.large .competencepic {
    position: absolute;
    top: 64px;
}

#competences .competencepic {
    margin-top: 35px;
}

#nuchatcontent .nom {
    cursor: pointer;
    color: #c13dcc;
}

.nom .myself {
    font-style: italic;
}

#nuchatcontent .nom:not(.myself):hover {
    text-decoration: underline;
}

#nuchatcontent .myself .nom {
    color: var(--blanc);
}

#chatboxsettings {
    right: 600px;
    position: absolute;

}

#chatoptions h2 {
    margin-bottom: 0px;
}

.unreadbox {
    position: relative;
    background: #ffffff;
    border-radius: 10px;
    padding: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    max-width: 200px;
    word-wrap: break-word;
    font-size: 16px;
    color: #000;
}

.unreadbox::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 20px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #ffffff;
}


#nuchatbox button {
    font-size: 14px;
    padding: 4px;
    border-radius: 0;
    border: 1px solid var(--rouge);
}

#nuchatbox:not(.opened) {
    cursor: pointer;
}



.reduced #chatboxsettings {
    display: none;


}

.compbutton .nom {
    position: absolute;
    top: 10px;
    width: 200px;
    left: 0;
    width: 150px;
    margin: auto;
}

.compbutton .price {
    position: absolute;
    z-index: 3;
    background: var(--blanc);
    top: 103px;
    padding: 5px;
    right: 5px;
    transform: rotate(-4deg);
    font-size: 20px;
}

/* #buycomp {
    background: var(--blanc) !important;
} */

.buycompe {}

#quest {
    color: #d9a300;
    border-color: #d9a300;
}

.power {
    position: absolute;
    top: 80px;
    left: 12px;
    font-size: 23px;
}

.power .staticon {
    position: absolute;
    right: -93px;
    top: 6px;
}

.compbutton {
    display: inline-block;
    width: 154px;
    height: 122px;
    text-align: center;
    margin: 10px !important;
    cursor: pointer;
    position: relative;
    font-size: 15px !important;
}

#new_skill_system {
    margin-top: 8px;
}

.skill_memory_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 8px;
    table-layout: fixed;
}

.skill_memory_header {
    text-align: center;
    padding: 8px 6px;
    border: 1px solid var(--blanc);
    background: rgba(255, 255, 255, 0.06);
    font-size: 16px;
    white-space: nowrap;
}

.skill_memory_table td {
    vertical-align: top;
}

.skill_memory_skill {
    width: 100%;
    max-width: none;
    aspect-ratio: 1 / 1;
    min-height: 0;
    height: auto;
    margin: 0 !important;
    padding: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

.skill_memory_skill .nom {
    position: static;
    width: 100%;
    text-align: center;
    margin: 0;
    line-height: 1.2;
    font-size: 14px;
}

.skill_memory_empty {
    width: 100%;
    aspect-ratio: 1 / 1;
    min-height: 0;
    border: 1px dashed rgba(255, 255, 255, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.5);
    font-size: 20px;
}

.skill_memory_install {
    font-size: 11px;
    letter-spacing: 0.08em;
    padding: 5px 8px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 255, 255, 0.75);
    cursor: pointer;
}

.skill_memory_install:hover {
    background: rgba(255, 255, 255, 0.09);
    color: rgba(255, 255, 255, 0.95);
}

#alignement_map {
    position: absolute;
    right: 50px;
    top: 40px;
    overflow: visible;
}

#deepwatch .deepwatch-align-map {
    position: relative;
    overflow: visible;
}

#deepwatch .deepwatch-align-map::before {
    content: "";
    background-image: url(/img/ui2/align_bg.png);
    background-size: 220px;
    width: 220px;
    height: 220px;
    position: absolute;
    top: -25px;
    left: -25px;
}

#alignement_map::before {
    content: "";
    background-image: url(/img/ui2/align_bg.png);
    background-size: 260px;
    width: 260px;
    height: 260px;
    position: absolute;
    top: -30px;
    left: -30px;
}

.alignement-label {
    position: absolute;
    font-size: 12px;
    color: #64b964;
    white-space: nowrap;
    letter-spacing: 0.2px;
}

.alignement-label-xneg {
    left: 0;
    top: 55%;
    transform: translate(0, -50%);
}

.alignement-label-xpos {
    right: 0;
    top: 55%;
    transform: translate(0, -50%);
}

.alignement-label-yneg {
    left: 50%;
    bottom: -15px;
    transform: translate(-50%, 0);
}

.alignement-label-ypos {
    left: 50%;
    top: -15px;
    transform: translate(-50%, 0);
}

.alignement-player-label {
    position: absolute;
    transform: translate(-50%, -100%);
    font-size: 12px;
    color: #fff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
    white-space: nowrap;
    pointer-events: none;
}


.itempic {
    width: 32px;
    height: 32px;
    background-image: url(/Game/assets/objets/__ITEMLIB.png?v=V_2026_PROD_1_FIXVERSION);
}

.itempic.itemhatpic {
    background-image: url(/Game/assets/hats/HATS-SHEET32.png?v=V_2026_PROD_1_FIXVERSION);
}

#tradecontainer {
    display: flex;
    height: 515Px;
}

#tradecontainer .tradebox .inventory {
    font-size: 20px !important;
}

.skillcompnotice {
    position: absolute;
    font-size: 13px;
    right: 50px;
    display: none;
    top: 15px;
}

.tradebox {
    width: 49%;
    height: 500px;
    overflow-y: scroll;
}

#trade .inventaire_item {
    cursor: pointer;
}

#trade .inventaire_item:hover {
    background: var(--blanc);
}

#trade .perso_ {
    color: var(--blanc) !important;
}

#trade .trading {
    background: var(--blanc) !important;
}

table {
    border-collapse: collapse;
}

#tradevalid {
    margin-bottom: 20px;
    text-align: right;
}

#tradecontainer .nom {
    margin-bottom: 20px;
}

.subtab {
    display: none;
}

.dtskill {
    padding:
        10px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    display: block;
    margin-top: 25px;
}

#nusubmenu {
    position: absolute;
    left: 124px;
    display: none;

    z-index: 10;
    top: 40px;
}

#nusubmenu.disabled {
    opacity: 0;
    pointer-events: none;

}

.nusub_tab {
    background: #dfd5b7;
    padding:
        20px;
    /*  border-top: 4px solid var(--rouge);
    border-left: 4px solid var(--rouge);
    border-bottom: 4px solid var(--rouge);
    border-right:
        none; */
    border: none;
    color: #775c84;
    margin-bottom: 10px;
    filter: drop-shadow(4px 4px 10px rgba(0, 0, 0, 0.5));
    cursor: pointer;
    /* border-radius: 11px; */
    font-weight: bold;
}

.moons-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
}

.moons-display {
    display: inline-block;
    text-align: center;
    width: 150px;
    white-space: nowrap;
}

.centered {
    text-align: center;
}

.jor-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;

}



.jor-display {
    display: inline-block;
    text-align: center;
    width: 150px;
    white-space: nowrap;
}

.origine-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
}

.origine-display {
    display: inline-block;
    text-align: center;
    width: 150px;
    white-space: nowrap;
}


.nusub_tab.active {
    font-style: italic;
    margin-left: 60px;
    color: var(--rouge)
}

#tradepricecontainer {
    position: relative;
    height: 50px;
}

.inline {
    display: inline-block;
}

#alertlay {
    position: absolute;
    width: calc(100% - 200px);
    height: 300px;
    left: 75px;
    top: 100px;
    z-index: 9999;
    font-size: var(--fontsize);
}

#alert_box::before {
    content: "";
    position: absolute;
    width: 560px;
    height: 428px;
    background-image: url(/img/ui2/alertlay.png);
    background-size: 560px;
}

#alert_box.red::before {
    background-image: url(/img/ui2/alertlayred.png);

}

#alert_box.bigred::before {
    background-image: url(/img/ui2/alertlaybigred.png);

}


#alert_box.red,
#alert_box.bigred {
    color: var(--blanc) !important;
}

#alert_box {
    margin: auto;
    width: 500px;
    height: 100%;

}

.selectable_objectif {
    pointer-events: all;
    text-align: left;
    width: 400px;
    position: relative;
    padding-left: 18px;
    margin-bottom: 20px;
}

.selectable_objectif:hover {
    color: var(--jaune);
}

.obj_selected {
    color: var(--jaune);
}

.selectable_objectif::before {
    content: "•";
    position: absolute;
    left: 0;
}

#alert_content {
    padding: 15px;
    font-size: var(--fontsize);
    text-align: center;
    pointer-events: auto;
    height: 291px;
    top: 58px;
    left: 62px;
    position: relative;
    width: 415px;
    height: 300px;
    overflow-y: hidden;
    line-height: 28px;
}

.tretboost {
    color: var(--vert)
}

.trettotal {
    color: var(--vert);
    font-size: 13px;
    position: absolute;
    top: 102px;
    right: 180px;
}

#evoltret {
    font-size: 18px;
    color: var(--vert);
}

.tretdesc {
    font-size: 20px;
    line-height: normal;
    margin-top: 42px;
    display: block;
    padding-bottom: 9px;
    text-align: left;
    padding-left: 11px;
}

#dalert {
    pointer-events: none;
    margin-bottom: 18px;
}

.moreobjectives {
    margin-top: -25px;
    font-size: 14px;
    opacity: 0.9;
    margin-bottom: -11px;
    color: var(--jaune);
}

.select_another_objective {
    margin-top: 10px;
}

.red #alert_content,
.bigred #alert_content {
    top: 31px;
}

.bigred #alert_content {
    font-size: 21px;
}

#alert_content h2 {
    color: var(--rouge);
    font-size: 18px;
}

.red #alert_content h3,
.bigred #alert_content h3 {
    color: var(--jaune) !important;
    font-size: 16px;
    margin-top: 10px;
}

#alert_content .text_item {
    display: block;
}

#alert_content .tretdesc .text_item {
    display: inline;
}

#alert_content .itemalert_item_title {
    display: block;
    pointer-events: auto;
}

#alert_content .itemalert_item_title .text_item {
    display: inline;
}

.item_shortcode {
    cursor: help;
    border-bottom: 1px dotted currentColor;
}

.inventaire_item .item_shortcode {
    border-bottom: 0;
    cursor: inherit;
}

.pressBox {
    text-align: center;
}

.rank {
    color: var(--rose)
}

.pressButton {
    border-radius: 20px;
    padding: 25px;
}

.pressButton:hover {
    background: none !important;
}

.boxitem {

    margin: auto;
    padding-top: 20px;
    display: inline-block;
}


#game {}

#mobile_panel_buttons {
    display: none;
}

body.mobile-runtime #bottom_swipe_menu {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    width: 100%;
    max-width: 450px;
    height: 60px;
    max-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-sizing: border-box;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(0, 100%, 0);
    transition: transform 180ms ease-out;
    will-change: transform;
    z-index: 120000;
    text-align: center;
    background: rgba(230, 200, 110, 0.96);
    border-top: 1px solid rgba(85, 65, 95, 0.35);
}

.p9frame {
    position: relative;
}



.p9frame::before {
    content: "";
    position: absolute;
    top: -14px;
    left: -14px;
    margin: 24px;
    text-align: center;
    border-image: url("/img/p9/p9.png") 18 fill repeat;
    border-image-width: 36px;
    border-image-outset: 36px;
    z-index: 1;
    pointer-events: none;
    width: calc(100% - 22px);
    height: calc(100% - 22px);
    overflow: visible;
    display: block;
}

.p9frame.redalert::before {
    border-image: url("/img/p9/p9red.png") 18 fill repeat;
    border-image-width: 36px;
    border-image-outset: 36px;
}



.p9frame.framecolor::before {
    content: "";
    position: absolute;
    top: -12px;
    left: -12px;
    margin:
        24px;
    text-align: center;
    border-image:
        url("/img/p9/p9color.png") 18 fill repeat;
    border-image-outset: 0;
    border-image-width: 1;
    border-image-width: 36px;
    border-image-outset: 36px;
    z-index: 1;
    pointer-events: none;
    width: calc(100% - 32px);
    height: calc(100% - 32px);
    overflow:
        visible;
    display: block;
}

.p9light::before {
    border-image: url("/img/p9/p9_light.png") 18 fill repeat;
    content: "";
    position: absolute;
    top: -14px;
    left: -14px;
    margin: 24px;
    text-align: center;
    border-image-width: 36px;
    border-image-outset: 36px;
    z-index: 1;
    pointer-events: none;
    width: calc(100% - 24px);
    height: calc(100% - 24px);
    overflow: visible;
    display: block;
}

.p9light2::before {
    border-image-source: url("/img/p9/p9_light2.png") 18 fill repeat;
}

.neoframe {
    --mobile9-img: url("../css/mobile/patch9.png");
    border: 24px solid transparent;
    /* reserve 24px in layout */
    border-image-source: var(--mobile9-img);
    border-image-slice: 12 fill;
    border-image-width: 24px;
    /* or 1 if you prefer unitless */
    border-image-repeat: stretch;
    background-color: var(--jaune);
    background-clip: padding-box;
}

body.p9frame::before {
    border-image: url("/img/p9/p9_big.png") 18 fill repeat;
    border-image-width: 36px;
    border-image-outset: 36px;
}

.nointerractframe .ctx_arro {
    display: none !important;
}

.ctx_arro:hover {
    color: var(--rouge);
}

.nointerractframe #ctx_avatar {
    display: none;
}

.ctx_arro {
    position: absolute;
    background: var(--jaune);
    padding: 4px 12px 12px;
    font-size: 35px;
    border-top: 2px solid #fcde85;
    border-right: 2px solid #fcde85;
    border-bottom: 2px solid #bca45b;
    border-left: 2px solid #bca45b;
    cursor: pointer;
    top: 60px;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

#ctx_previous {
    left: -60px;
    border-right: none;
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.3);

}

#ctx_next {
    right: -60px;
    border-left: none;
}

#ctx_avatar {
    width: 64px;
    height: 128px;
    margin-left: 10px;

}

#ctx_avatar .vignette {
    transform: scale(0.5);
    transform-origin: top left;
}

#ctx_actions {}

#contextemenu {
    position: absolute;
    background: #f2d787;
    z-index: 999;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    width: 320px;
    padding: 0;
    left: 120px;
    top: 30Px;
    min-height: 168px;
}

#contextemenu .butcon {
    height: auto;
    margin: 0;
}

.nointerractframe #contextemenu {
    padding: 18px;
    top: 333px !important;
    right: auto;
    left: 234px !important;
    padding-bottom: 0;
    padding-top: 9px;
    width: 340px;
    border: 3px solid #795c88;
    border-radius: 10px;
}

.embrouilleMode #contextemenu {
    display: block;
}

.nointerractframe .statsadv {
    position: absolute;
    top: 7px;
    left: 191px;
}

.nointerractframe #contextemenu .butcon {
    display: none;
}


.contextlink {
    padding: 5px;
    font-size: 20px;
    margin-bottom: 0;
}

.contextlink:hover {

    background: var(--jaune);
}

#endgamebutton {
    top: 350px;
    position: absolute;
    z-index: 1;
    left: 0;
}

.particle {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 0;
    background-color: red;
    /* Default color, overridden by JS */
    animation: particleAnimation 1s forwards;
    z-index: 9999999999;
}

@keyframes particleAnimation {
    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(var(--tx), var(--ty));
        opacity: 0;
    }
}

.reward p {
    margin: 0;
}

.reward .portrait {
    margin: auto;
}



#specialthanks li {
    margin-left: 0;
}

#credit {
    text-align: center;
    color: var(--rose);
}

.center {
    text-align: center;
}

.bulle {
    background: var(--blanc);
    color: var(--bleu);
    border-radius: 10px;
    padding: 8px;
    z-index: 5;
    position: absolute;
    top: 65px;
    max-width: 200px;
    word-wrap: break-word;
    font-size: 18px;
    text-align: center;
    width: auto;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    pointer-events: none;
}

.bulle::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 15px;
    border-style: solid;
    border-color: var(--blanc) transparent transparent transparent;
}

.wclass {
    background: color(--violet);
}

#chatoption_individual input {
    font-size: 15px;
}

.bulle.whisperclass {
    background: var(--vert);
}

.bulle.whisperclass::after {
    border-color: var(--vert) transparent transparent transparent;
}

.trans {
    font-size: 6px;
    display: none;
}

.monicon {
    width: 16px;
    height: 16px;
    margin-left: 5px;
    margin-right: 6px;
    position: relative;
    display: inline-block;
}

.monicon::before {
    background-size: 16px;
    top: 2px;
    left: 0;
    position: absolute;
    content: "";
    width: 16px;
    height: 16px;
    background-image: url("/img/coin.gif");
    background-size: 16px;
    background-repeat: no-repeat;

}

#gametext_scrollzone .monicon::before {
    top: 0;
}

#permisUI .monicon {
    width: 32px;
    height: 32px;
}

#permisUI .monicon::before {
    width: 32px;
    height: 32px;
    background-size: 32px;
    left: -10px;
}


.tocall {
    cursor: pointer;
    font-family: var(--pixelfont);
}

.tocall:hover {
    background: var(--blanc)
}

.neoskill {
    color: var(--rose);
}

.neoskill_shortcode {
    cursor: pointer;
    text-decoration: underline;
}

#filtertextinventaire {
    font-size: 12px;
    right: 34px;
    height: auto;
    pointer-events: all;
    z-index: 3233;
    position: absolute;
    width: 80px;
    padding:
        5px;
    background: var(--jaune);
    top: 0;
}

#newobj {


    width: 150px;
    height: 40px;
    position: absolute;
    background-size: 150px;
    top: 27px;
    background-repeat: no-repeat;
    left: 95px;
    /* animation: blink 0.4s infinite steps(1); */
}

/* @keyframes blink {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
} */

#cleartextfilter {
    border-radius: 0;
    font-size: 13px !important;
    position: absolute;
    right: 9px;
    top: 0;
}


#debug2 button {
    padding: 0;
    font-size: 12px;
}

.ticket {
    font-family: 'Courier New', Courier, monospace;
}

.ticket td {
    padding-right: 20px;
}

#macompta {}

#macompta td {

    border-bottom: 1px solid #ccb1d9;
}

.comptah {
    width: 50px;
}

.comptam {
    padding-left: 25px;
    text-align: right;
    width: 160px;
}

.comptamotif {
    padding-left: 20px;
    font-size: 15px;
}



.triangle {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-bottom: 100px solid #e6c86e;
    position: absolute;
    top: -80px;
    z-index: 3333;
    left: 50px;
    display: none;
}

/* :not(.buycompe).notowned {
    filter: grayscale(100%);
} */

.compbutton.owned {}

.skillpage_KARMA {
    background: var(--vert);
}

.buycompe.notowned {
    filter: none;
}

.powerdesc {
    font-size: 30px;
    text-align: center;
    width: 100%;
    display: block;
}

.buybloc {
    text-align: center;
    width: 100%;
    display: block;
    margin-top: 20px;
}



.stat {
    transition: color 0.3s;
}

.stat.flash {
    color: white;
    transition: color 0.1s;
}

#statparticles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    z-index: 1000;
}

.statparticle {
    position: absolute;
    width: 5px;
    height: 5px;
    background: white;
    border-radius: 50%;
    opacity: 1;
    animation: particle-move 0.5s ease-out forwards;
}

@keyframes particle-move {
    0% {
        transform: scale(1) translateY(0);
        opacity: 1;
    }

    100% {
        transform: scale(0.5) translateY(-50px);
        opacity: 0;
    }
}

#biztabs {
    display: flex;
}

.biztab.active {
    background: var(--rouge) !important;
    color: var(--jaune) !important;
}

.bizfolder {
    display: none;
}


.biz {
    border-bottom: 1px solid #ccb1d9;
}

.capital {
    border: none;
    padding: 0;
    display: block;
    border-radius: 10px;
    width: 100%;

}

.capitalnotice {
    color: var(--vert);
    font-size: 16px;
    margin-top: -30px;
    cursor: pointer;
}

.capitalnotice::after {
    content: attr(data-biztooltip);
    position: absolute;
    background: #4c3963;
    color: #fff;
    padding: 10px;
    border-radius: 10px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s;
    z-index: 3333;
    width: 400px;
    border: 1px solid var(--vert);
    left: 0;
}

.capitalnotice:hover::after {
    opacity: 1;
}

#steamlogin_container {
    position: absolute;
    top: 0;
    width: 600px;
    padding: 30px;
    margin: auto;
    background: var(--jaune);
    text-align: center;
    z-index: 444;
    height: 90%;
    left: calc(50% - 300px);
    z-index: 9999999999999999999;
}

#mobiledisclaimer {
    display: none;

}

#calltoaction {
    position: absolute;
    top: 0;
    width: 600px;
    padding: 30px;
    margin: auto;
    background: var(--jaune);
    text-align: center;
    z-index: 444;
    height: 90%;
    left: calc(50% - 300px);
}

#calltoaction img {
    width: 100%;
}

.steamexplain {
    color: var(--vert);
    text-align: left;
}

.UIdisabled img {
    opacity: 0;
}

.skillmenubutton.UIdisabled {
    display: none;
}

#ctabut button {
    color: var(--bleu) !important;
}

#tutoarro {
    position: absolute;
    z-index: 10;
    display: none;
    /* pointer-events: none; */
}

#tutoarro img {
    width: 60px;
}

@keyframes oscillate {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-30px);
    }
}

#tutoarro {
    animation: oscillate 1.2s infinite;
    filter: drop-shadow(4px 4px 10px rgba(0, 0, 0, 0.5));
}

#versiontxt {
    margin: 0;
    text-align: left;
    font-size: 18px;
    padding: 0;
    line-height: normal;
    position: absolute;
    top: 593px;
    left: 64px;
}

#closeslider {
    margin: 0;
    position: absolute;
    height: auto;
    margin-top: -15px;
    left: 145px;
}

#c3corner {
    position: fixed;
}

.moon_icon {
    background-image: url("/img/icons/MOONICON.png");
    background-size: 15px;
    width: 15px;
    height: 15px;
    display: inline-block;

}

.volume-table {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.volume-table tr {
    display: flex;
    align-items: center;
}

.volume-table td:first-child {
    width: 80px;
}

.volume-table td:nth-child(2) {
    flex: 1;
}

#rlcontainer {
    text-align: center;
    width: 100%;
    color: var(--vert);
}

#rltimer {}

.button-cell {
    text-align: center;
    padding-top: 15px;
}

.disabled {
    pointer-events: none;
    filter: grayscale(100%);
}



.volume-container {
    margin: 10px 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.slider-group {
    display: flex;
    align-items: center;
    gap: 5px;
}

.volume-slider {
    width: 120px;
    padding-left: 0;
    padding-right: 0;
}

.volume-value {
    min-width: 40px;
    display: inline-block;
}

#numap {
    position: absolute;
    top: -0;
    left: 20px;
    width: 1250px;
    height: 760px;
    display: none;
    z-index: 2;
    border-radius:
        11px;
}

#numap iframe {
    border: none;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    overflow: hidden;

}

.portretbox {
    width: 130px;
    position: relative;
}

.peoplemenu_item .portret {
    transform: scale(0.5);
    width: 130px;
    position: absolute;
    top: -80px;
}


.peoplemenu_item {
    position: relative;
    border-top: 1px solid var(--rouge);

    padding-bottom: 14px;
    display: block;
    cursor: pointer;
    padding-top: 14px;
}

.peoplemenu_item:hover {
    background: var(--blanc)
}

.peoplemenu_item .hoverpeople {
    margin: 0;
}

.peoplemenu_item .statsadv {
    margin: 0
}

.peoplemenu_item .advmoney {
    position: absolute;
    text-align: left;
    width: 100%;
    height: auto;
    left: 300px;
    margin: 0;
    top: 26px;
}

.cleantabs.nutabs::after {
    display: none;
}

#spyface h2 {
    display: block;
    height: 52px;
    text-align: center;
    padding-bottom: 60px;
    padding-top: 0;
    margin-top: 0px;
    color: #64b964;
}

#spylogo {
    display: block;
    height: 40px;
    text-align: center;
    padding: 0;
    position: absolute;
    right: 338px;
    top: 26px;

}

#spylogo img {
    width: 120px;
    margin: auto;
    display: block;
    position: absolute;
    left: calc(50% - 60px);
    top: 0;
}

.advscaninfo {
    position: absolute;
    right: 0;
    width: 250px;
    top: 0;
    padding-top: 27px;
    font-size: 16px;
}


.buttons>div {
    display: inline-block;
    padding: 5px;
    height: 35px;
    width: 110px;
    overflow: hidden;
}

.buttons button {
    height: 36px;
}

.buttons button:hover {
    height: 36px;
}

#cornerbuttons .tribut {
    text-align: right;
}


#cornerbuttons {
    position: absolute;
    bottom: 55px;
    right: 60px;
    width: 225px;
}

#cornerbuttons div {


    cursor: pointer;
    pointer-events: all;
    z-index: 2;
    position: absolute;

}




.minicon {
    height: 40px;
    width: 40px;
    background-size: 80px;
    background-position: 0;
}

.minicon:hover {
    background-position: -40px;
}




.minicon_music {
    left: 48px;
    top: -5px;
    background-image: url("/img/ui2/minicon_music.png?v=V_2026_PROD_1_FIXVERSION")
}

.minicon_screen {
    left: 95px;
    top: -5px;
    background-image: url("/img/ui2/minicon_fullscreen.png?v=V_2026_PROD_1_FIXVERSION")
}

.minicon_bug {
    left: 143px;
    top: -5px;
    background-image: url("/img/ui2/minicon_bug.png?v=V_2026_PROD_1_FIXVERSION")
}

#deconnexion {
    width: 60px;
    height: 60px;
    background-image: url("/img/ui2/logoff.png?v=V_2026_PROD_1_FIXVERSION");
    background-size: 120px;
    background-position: 0;

    left: 192px;
    top: -15px;
}

#deconnexion:hover {
    background-position: -60px;
}

#freetoplay {
    position: absolute;
    top: 455px;
    left: 59px;
    width: 215px;
    height: 99px;
    padding-top: 15px;
    text-align: left;
    font-size: 17px;
}

#mypreloader {
    position: absolute;
    z-index: -1;
}

.implante {
    background: var(--ink) !important;
    color: var(--paper);
}

#devstuff {

    z-index: 22;
    display: block;
    position: absolute;
}