.important-notice * {
    color: var(--btn-text-color);
}

.table.table-hover .no-hover:hover {
    background-color: #0b0c10 !important;
}

.mucms-general-text {
    font-size: 14px;
    line-height: 1.42857143;
}

.desc-row {
    margin: 0 0 1em 0;
    padding-bottom: 1em;
    text-align: center;
    border-bottom: solid 1px #f3f3f3;
}

.req-success {
    color: #009900;
}

.req-danger {
    color: #990000;
}

.req-info {
    color: #0081c9;
}

.color-white {
    color: #fff;
}

.make-space {
    margin-top: 10px;
}

.full-width-btn {
    width: 100%;
}

.full-width-btn.active {
    background-color: var(--link-text-color-hover);
    border: 1px solid rgb(39, 117, 166);
}

.btn-right {
    float: right;
}

.btn-navtop {
    float: right;
    margin-left: 20px;
}

.code-input {
    font-family: Courier New;
    letter-spacing: .5em;
}

th.headerRow {
    background: #0f1116;
}

.status-online {
    color: #008000;
}

.status-offline {
    color: #a80000;
}

.fix-img {
    margin-top: -3px;
}

.col-center {
    text-align: center;
}

.sub-header-usercp {
    background-color: var(--usercp-section-bg-color);
    font-size: 1.5em;
    color: var(--usercp-section-text-color);
    padding: 10px;
    text-align: center;
    margin: 30px 0 20px 0;
    width: 100%;
}

.home-ranking-box {
    margin-top: 1.5em;
}

.topbar {
    background-color: var(--usercp-section-bg-color);
    padding: 10px 30px;
}

.topbar .welcome-text {
    color: var(--usercp-section-text-color);
}

.topbar.ban-protection {
    background-color: #ff0000;
    padding: 10px 30px;
}

.changelog-table td {
    vertical-align: top !important;
}


/* RANKINGS */

.rankings_menu {
    width: 103%;
    overflow: auto;
    text-align: center;
    margin-bottom: 10px;
    font-size: x-small;
}

.rankings_menu a,
.rankings_menu a:visited {
    display: inline-block;
    width: calc(100% + 20px);
    text-align: center;
    padding: 6px 0px;
    margin: 2px -15px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: var(--btn-text-color);
    background: linear-gradient(to right, rgba(48, 40, 23, 0), #652d29, rgba(48, 40, 23, 0));
}

.rankings_menu a:hover {
    color: var(--link-text-color-hover);
    text-decoration: none;
    background: linear-gradient(to right, rgba(48, 40, 23, 0), #302817, rgba(48, 40, 23, 0));
}

.rankings_menu a.active {
    color: var(--link-text-color-hover);
}

.rankings_menu_filter {
    width: 100%;
    overflow: auto;
    text-align: center;
    margin-bottom: 10px;
}

.rankings_menu_filter a,
.rankings_menu_filter a:visited {
    display: inline-block;
    width: 97.2px;
    text-align: center;
    padding: 9px 0px;
    margin: 4px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: var(--btn-text-color);
    background: linear-gradient(to right, rgba(48, 40, 23, 0), #682e29, rgba(48, 40, 23, 0));
}

.rankings_menu_filter a:hover {
    color: var(--btn-text-color);
    /* background: var(--link-text-color-hover); */
    text-decoration: none;
    background: linear-gradient(to right, rgba(48, 40, 23, 0), #582a27, rgba(48, 40, 23, 0));
}

.rankings_menu_filter a.active {
    color: rgb(255 255 255);
    background: linear-gradient(to right, rgba(48, 40, 23, 0), #692e28, rgba(48, 40, 23, 0));
}

.rankings_menu_filter_monster {
    width: 100%;
    overflow: auto;
    text-align: center;
    margin-bottom: 10px;
}

.rankings_menu_filter_monster a,
.rankings_menu_filter_monster a:visited {
    display: inline-block;
    text-align: center;
    padding: 2px 10px;
    margin: 2px;
    background: var(--link-text-color);
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: var(--btn-text-color);
}

.rankings_menu_filter_monster a:hover {
    color: var(--btn-text-color);
    background: var(--link-text-color-hover);
    text-decoration: none;
}

.rankings_menu_filter_monster a.active {
    color: var(--btn-bg-color);
}

.rankings-table {
    margin-top: 20px;
}

.rankings-table th {
    text-align: center;
}

.rankings-update-time {
    text-align: right;
    font-size: 12px;
    padding-top: 10px;
}

.rankings-duprian {
    background: var(--btn-bg-color);
    color: var(--btn-text-color);
}

.rankings-vanert {
    background: var(--link-text-color);
    color: var(--btn-text-color);
}

.rankings-gens-img {
    width: 50px !important;
    height: auto !important;
    border: 0 !important;
    -moz-box-shadow: 0 0 0px #000 !important;
    -webkit-box-shadow: 0 0 0px #000 !important;
    box-shadow: 0 0 0px #000 !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
}

.rankings-gens-img-table {
    width: 30px !important;
    height: auto !important;
    border: 0 !important;
    -moz-box-shadow: 0 0 0px #000 !important;
    -webkit-box-shadow: 0 0 0px #000 !important;
    box-shadow: 0 0 0px #000 !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    margin: -8px 0 -10px 0;
}

.char-class-img {
    border-radius: 40px;
    width: 40px;
}

.rankings-progress {
    color: #008800;
}

.rankings-progress-neg {
    color: #880000;
}

.rankings-rewards-title {
    background: var(--btn-bg-color);
    color: var(--btn-text-color);
    padding: .5em;
    margin-top: 1em;
}

.rankings-rewards-1st-place {
    background: #d4af37 !important;
    color: #ffffff !important;
    font-size: 150%;
}

.rankings-rewards-2nd-place {
    background: #c0c0c0 !important;
    color: #ffffff !important;
    font-size: 130%;
}

.rankings-rewards-3rd-place {
    background: #804a00 !important;
    color: #ffffff !important;
    font-size: 130%;
}

.rankings-rewards-flag {
    margin-left: 10px;
    margin-top: -3px;
}

.ranking-wcoins-reset-highlight {
    background-color: #eeffed;
}

.rankings-vip-status-1,
.rankings-vip-status-2,
.rankings-vip-status-3,
.rankings-vip-status-4 {
    position: relative;
}

.rankings-vip-status-1:before {
    position: absolute;
    top: 7px;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #cd7f32;
}

.rankings-vip-status-2:before {
    position: absolute;
    top: 7px;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #c0c0c0;
}

.rankings-vip-status-3:before {
    position: absolute;
    top: 7px;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #ffcc00;
}

.rankings-vip-status-4:before {
    position: absolute;
    top: 7px;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #00ffa8;
}


/* REGISTER */

.content-box .register-terms h3 {
    font-size: 20px;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 10px;
}

.content-box .register-terms h3:not(:first-child) {
    margin-top: 20px;
}


/* PROFILES */

.profile_item0 {
    position: relative;
    left: 14px;
    top: 123px;
    width: 68px;
    height: 132px;
    float: left;
}

.profile_item1 {
    position: relative;
    left: 190px;
    top: 123px;
    width: 68px;
    height: 132px;
    float: left;
}

.profile_item2 {
    position: relative;
    left: 0;
    top: 42px;
    width: 68px;
    height: 68px;
    float: left;
}

.profile_item3 {
    position: relative;
    left: -68px;
    top: 123px;
    width: 68px;
    height: 132px;
    float: left;
}

.profile_item4 {
    position: relative;
    left: -136px;
    top: 268px;
    width: 68px;
    height: 68px;
    float: left;
}

.profile_item5 {
    position: relative;
    left: -326px;
    top: 268px;
    width: 68px;
    height: 68px;
    float: left;
}

.profile_item6 {
    position: relative;
    left: -14px;
    top: 200px;
    width: 68px;
    height: 68px;
    float: left;
}

.profile_item7 {
    position: relative;
    left: 250px;
    top: -130px;
    width: 164px;
    height: 108px;
    float: left;
}

.profile_item8 {
    position: relative;
    left: -150px;
    top: -94px;
    width: 68px;
    height: 68px;
    float: left;
}

.profile_item9 {
    position: relative;
    left: -141px;
    top: -58px;
    width: 36px;
    height: 36px;
    float: left;
}

.profile_item10 {
    position: relative;
    left: -177px;
    top: 168px;
    width: 36px;
    height: 36px;
    float: left;
}

.profile_item11 {
    position: relative;
    left: -91px;
    top: 168px;
    width: 36px;
    height: 36px;
    float: left;
}

.profile_item236 {
    position: relative;
    left: 0px;
    top: 132px;
    width: 68px;
    height: 68px;
    float: left;
}

.profile_item237 {
    position: relative;
    left: 49px;
    top: 19px;
    width: 36px;
    height: 36px;
    float: left;
}

.profile_item238 {
    position: relative;
    left: -109px;
    top: 19px;
    width: 36px;
    height: 36px;
    float: left;
}

.profile-vip-status-1:before {
    top: 0;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    font-style: normal;
    content: "\f005";
    color: #cd7f32;
}

.profile-vip-status-2:before {
    top: 0;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #c0c0c0;
}

.profile-vip-status-3:before {
    top: 0;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #ffcc00;
}

.profile-vip-status-4:before {
    top: 0;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f005";
    color: #00ffa8;
}


/* DONATION */

.donation-row {
    margin: 0;
}

.donation-method {
    padding: 1em;
    text-align: center;
}


/* BUG TRACKER */

.bug-tracker-search {
    width: 100%;
}

.bug-reports-holder {
    height: 170px;
    margin: 30px 0 0 0;
    border-radius: 5px;
    box-shadow: 0 0 8px rgba(0, 0, 0, .3), 0 1px 1px rgba(0, 0, 0, .2), inset 0 0 0 1px rgba(255, 255, 255, .015), inset 0 0 15px rgba(0, 0, 0, .015);
    text-align: center;
    padding: 20px 0 20px 0;
}

.bug-reports-holder.confirmed {
    background-color: var(--btn-bg-color);
    border: 1px solid var(--btn-border-color);
    color: var(--btn-text-color);
}

.bug-reports-holder.confirmed h3 {
    color: var(--btn-text-color) !important;
}

.bug-reports-holder h1 {
    font-size: 10rem;
    margin: 0 0 5px 0;
}

.bug-reports-holder h3 {
    text-transform: uppercase;
    font-weight: bold;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    font-size: 1.5rem !important;
}

.submit-bug-report {
    border-radius: 5px;
}

.plus-ico {
    font-size: 6rem;
    width: 60px;
    height: 60px;
    float: left;
    margin: 32px 0 0 45px;
}

.submit-bug-report h1 {
    text-transform: uppercase;
    font-weight: bold;
    color: var(--title-text-color);
    float: left;
    margin: 54px 0 0 25px;
    display: block;
    font-size: 2.75rem;
}

.submit-bug-report:hover {
    background: var(--btn-bg-color);
    border: 1px solid var(--btn-border-color);
    color: var(--btn-text-color);
}

.submit-bug-report:hover h1 {
    color: var(--btn-text-color);
}

.my-reports {
    margin: 30px 0 0 0;
    padding: 10px;
    border: 1px solid var(--btn-border-color);
    background: #323232;
}

.bug-tracker-info {
    margin-top: 50px;
}

table.table-bug-tracker {
    text-align: left;
}

table.table-bug-tracker td.staff {
    background: #fff8dd;
}

table.table-bug-tracker td.staff:hover {
    background: #fffac5;
}

.bug-tracker-reply-head {
    margin-bottom: 10px;
}

.bug-tracker-reply-author {
    font-weight: bold;
    margin-bottom: 10px;
}

.bug-tracker-reply-date {
    float: right;
}

.bug-tracker-add-reply {
    margin-top: 20px;
}

.bug-tracker-add-reply-area {
    width: 100%;
}

.bug-tracker-add-reply-btn {
    width: 100%;
    margin-top: 10px;
}

.bug-tracker-input {
    margin-top: 10px;
}

.bug-tracker-input-btn {
    width: 100%;
    margin-top: 30px;
}

.tracker-msg-author {
    text-align: left;
}

.tracker-msg-date {
    text-align: right;
}


/* CHANGELOGS */

.changelog-rev {}

.changelog-by {
    color: #ff0000;
}

.changelog-date {}

.changelog-info {
    text-align: left;
}

#changelogsTabs #server-tab .text,
#changelogsTabs #website-tab .text {
    font-size: 2.5rem;
}

#changelogsTabs #server-tab .text p,
#changelogsTabs #website-tab .text p {
    font-size: 1.25rem;
}

.changelogs-tab {
    background: none;
    border: none;
    border-bottom: #02005a solid 2px;
    color: #000;
    margin-bottom: 5px;
}

.changelogs-tab .text {
    font-size: 2.5rem;
}

.changelogs-tab .text p {
    font-size: 1.25rem;
}


/* PAYPAL */

.donation-gateway-container {
    width: 100%;
    background: var(--btn-bg-color);
    border: 1px solid var(--btn-border-color);
}

.donation-gateway-content {
    margin: 10px;
    background: #f5c44d6e;
    border: 2px solid rgb(122 122 122);
    padding: 10px;
    overflow: auto;
}

.donation-gateway-conversion-rate {
    margin: 0px auto;
    text-align: center;
    color: #000;
    font-size: 18px;
    padding: 10px 0px;
}

.donation-gateway-form {
    width: 100%;
    margin: 0px auto;
    text-align: center;
}

.donation-gateway-form div {
    display: inline-block;
    padding: 0px 10px;
    color: #000;
    font-size: 18px;
}

.donation-gateway-form input[type=text] {
    width: 100px;
    display: inline;
}

.donation-gateway-continue {
    margin: 0px auto;
    text-align: center;
}

.paypal-gateway-logo {
    width: 100%;
    height: 68px;
    background: #fff9ec url('../donation/images/paypal-logo-200-68.png') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.wompi-gateway-logo {
    width: 100%;
    height: 94px;
    background: #fff9ec url('../donation/wompi.png') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.boacompra-gateway-logo {
    width: 100%;
    height: 68px;
    background: #fff9ec url('../donation/boacompra.svg') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.coinbase-gateway-logo {
    width: 100%;
    height: 68px;
    background: #fff9ec url('../donation/coinbase.png') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.crypto-gateway-logo {
    width: 100%;
    height: 68px;
    background: #fff9ec url('../donation/crypto.png') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.mercadopago-gateway-logo {
    width: 100%;
    height: 85px;
    background: #fff9ec url('../donation/images/mercadopago.png') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.pagseguro-gateway-logo {
    width: 100%;
    height: 68px;
    background: #fff9ec url('../donation/images/pagseguro.png') no-repeat top center;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}


/* GUIDES */

h4.guide-title {
    background: var(--btn-bg-color);
    padding: 15px;
    margin-top: 0;
    color: #fff;
}

.btn-guide-cat {
    margin-bottom: 10px;
}


/* AUCTIONS */

.auction {
    border: 3px solid #eee;
    display: inline-block;
    /*padding: 10px;*/
    margin: 2px;
    margin-bottom: 30px;
}

.auction table {
    width: 100%;
}

.auction-text {
    vertical-align: top;
    width: 340px;
    padding: 2px;
}

.auction-title {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 16px;
    color: #d9d9d9;
    margin: 0 0 6px 0;
    padding: 0;
    line-height: 125%;
    text-align: center;
}

.auction-get span,
.auction-job {
    border: 2px solid #eee;
    display: inline-block;
    margin: 2px 0;
    padding: 6px 8px;
    border-radius: 2px;
    text-transform: uppercase;
}

.auction-job {
    font-size: 10px;
    cursor: pointer;
}

.auction-help-text {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    border-top: 2px solid #eee;
    z-index: 1;
    height: 48px;
    font-size: 12px;
}

.auction-help-text p {
    padding: 0 4px;
}

#auction-popup {
    width: 484px;
}

.auction-item-frame .auction-give {
    position: absolute;
    bottom: -17px;
    right: 2px;
    z-index: 2;
}

.auction-item-num {
    border-radius: 50px;
    border: 2px solid #eee;
    position: absolute;
    bottom: -14px;
    left: 6px;
    z-index: 2;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 23px;
}

.auction-item-img,
.auction-jewels-img {
    display: block;
    padding: 2px;
    margin: 2px;
    background-color: #251a15;
    border: 1px solid #412c28;
    box-shadow: inset 0 0 8px #000000;
    border-radius: 4px;
}

.auction-item-img {
    width: 76px;
    height: 76px;
}

.auction-jewels-img {
    padding: 12px 12px 16px 12px
}

.auction-inv-frame {
    border: 1px #211c19 solid;
    border-radius: 4px;
    margin: 2px 16px;
    padding: 4px;
}

.auction-rate-line {
    border: 1px #eee solid;
    height: 24px;
    margin: 9px 0;
}

.auction-rate-line-stage {
    top: 0;
    left: 0;
    background-color: var(--usercp-section-bg-color);
    height: 22px;
    z-index: 1;
}

.auction-rate-text {
    font-size: 11px;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 22px;
    margin-top: -22px;
    z-index: 2;
}

.auction-rate-text img {
    margin: 5px 2px;
}

.auction-item-frame {
    border: 2px solid #eee;
    display: inline-block;
    padding: 10px;
    margin: 2px;
    white-space: nowrap;
    text-align: center;
    height: 148px;
}

.auction-img {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.auction-item-frame img {
    vertical-align: middle;
    max-height: 128px;
}

.auction-higest-bid {
    color: #00AA00;
}

.auction-outbid {
    color: #CC0000;
}

.auction-status-box {
    background-color: var(--usercp-section-bg-color);
    display: inline-block;
    width: 100%;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.auction-widget-body {
    text-align: center;
}

.auction-widget-item {
    cursor: pointer;
    display: inline-block;
    padding-top: 6px;
}

.auction-widget-current-bid {
    padding-top: 10px;
    padding-bottom: 5px;
    color: #ffffff;
}

.auction-widget-current-bid b {
    color: #ffffff;
}

.auction-widget-more-items {
    padding-top: 10px;
    color: #ffffff;
}

.auction-widget-title {
    color: #ffffff;
    font-size: 150%;
}


/* CLAIM A REWARD */

.claimreward {
    color: var(--usercp-section-text-color);
}


/* MARKET */

.market-pagination {
    text-align: center;
}

.market-filters {
    text-align: right;
}

.market-widget-price {
    color: #ffffff;
}


/* RECRUIT A FRIEND */

.recruit-link {
    background-color: var(--link-text-color) !important;
    color: var(--btn-text-color) !important;
    border: 1px solid rgba(37, 109, 156, 1.0) !important;
    outline: none !important;
}


/* WHEEL OF FORTUNE */

.skills-wheel {
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    height: 560px;
    margin: 2em auto 2em;
    overflow: hidden;
    position: relative;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 560px;
}

.skills-wheel:before {
    border-style: solid;
    border-width: 32px 32px 0 32px;
    border-color: var(--usercp-section-bg-color) transparent transparent transparent;
    content: "";
    height: 0;
    left: 50%;
    margin-left: -32px;
    position: absolute;
    top: 8px;
    z-index: 100;
    width: 0;
}

.skills-wheel .btn {
    background-color: var(--usercp-item-bg-color);
    color: #fff;
    border: 4px solid var(--usercp-section-bg-color);
    -webkit-box-shadow: inset 0 -8px 0 #2b2b2b;
    -moz-box-shadow: inset 0 -8px 0 #2b2b2b;
    box-shadow: inset 0 -8px 0 #2b2b2b;
    font-family: "avantgarde_bold", Helvetica, Arial, sans-serif;
    height: 100px;
    left: 50%;
    line-height: 90px;
    margin: -54px 0 0 -54px;
    padding: 0;
    position: absolute;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    text-decoration: none;
    text-align: center;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
    text-transform: uppercase;
    top: 50%;
    width: 100px;
}

.skills-wheel .btn:active {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    height: 96px;
    margin-top: -50px;
}

.wheel {
    border: 12px solid var(--usercp-section-bg-color);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    text-align: center;
    width: 100%;
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -ms-transform-origin: center center;
    -o-transform-origin: center center;
    transform-origin: center center;
}

.wheel li {
    font-family: "avantgarde_bold", Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-size: 1.2rem;
    height: 50%;
    line-height: 18px;
    list-style: none;
    left: 316px;
    margin: 0 0 0 -106px;
    padding: 0;
    position: absolute;
    -webkit-transform-origin: center bottom;
    -moz-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    -o-transform-origin: center bottom;
    transform-origin: center bottom;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    top: 0;
    width: 115px;
}

.wheel li:before {
    display: none;
}

.wheel a {
    color: #ffffff;
    left: 0;
    position: absolute;
    text-decoration: none;
    top: 10px;
    width: 100%;
}

.spinDisabled {
    pointer-events: none;
    cursor: default;
}

.itembg {
    border-top: 268px solid #ffb400;
}

/* WEB BANK */

.webbank-section {
    padding: 0;
    display: contents;
}

.webbank-section-title {
    background-color: var(--usercp-section-bg-color);
    font-size: 1.5em;
    color: var(--usercp-section-text-color);
    padding: 10px;
    text-align: center;
    margin-top: 20px;
}


/* USERCP */

.usercp_info {
    padding: 15px 0;
    margin: 7px;
    background-color: rgb(26 25 25 / 18%);
    padding: 19px;
    cursor: pointer;
    border: 1px solid #eeeeee1c;
    border-radius: 60px;
    font-family: "Marcellus", sans-serif;
    filter: brightness(100%) drop-shadow(0px 10px 20px rgba(81, 87, 156, 0.8));
}

.usercp_info_text {
    color: var(--usercp-info-text-color);
}

.usercp_info .active,
.usercp_info .online {
    color: #00aa00;
}

.usercp_info .blocked,
.usercp_info .offline {
    color: #ff0000;
}

.usercp_info .usercp_info_space {
    margin-top: 20px;
}

.usercp_menu {
    margin-top: 20px;
}

.usercp_menu .usercp_main {
    padding: 0 14px 16px 0;
}

@media (max-width: 768px) {
    .usercp_menu .usercp_main {
        padding: 0 0 10px 0;
    }
}

.usercp_menu .usercp_main_section {
    background-color: rgb(58 58 58 / 22%);
    font-size: 1.5em;
    color: rgb(205 154 11);
    padding: 10px;
    text-align: center;
    margin-top: 20px;
    padding: 10px;
    cursor: pointer;
    border: 1px solid #eeeeee1c;
    border-radius: 5px;
    font-family: "Marcellus", sans-serif;
    filter: brightness(100%) drop-shadow(0px 10px 20px rgba(81, 87, 156, 0.8));
}

.usercp_menu .usercp_main_item {
    padding: 4px;
    cursor: pointer;
    border: 2px solid #eeeeee1c;
    border-radius: -2px;
    font-family: "Marcellus", sans-serif;
    filter: brightness(100%) drop-shadow(0px 10px 20px rgba(81, 87, 156, 0.8));
}

.usercp_menu .usercp_main_item:hover {
    background-color: #787657;
}

.usercp_menu .usercp_main_item .usercp_main_item_icon {
    width: 30px;
    height: 40px;
    float: left;
    display: inline;
    vertical-align: middle;
    text-align: center;
    line-height: 34px;
    margin-right: 4px;
    font-size: 1em;
}

.usercp_menu .usercp_main_item .usercp_main_item_icon i {
    color: var(--usercp-section-bg-color);
    margin-top: 7px;
}

.usercp_menu .usercp_main_item .usercp_main_item_title {
    font-size: 1.0em;
    color: rgb(207 207 207);
    font-weight: bold;
}

.usercp_menu .usercp_main_item .usercp_main_item_desc {
    color: rgb(151 151 151);
    font-size: x-small;
}

.usercp_menu .usercp_main_item:hover .usercp_main_item_icon i {
    color: var(--usercp-item-text-color-hover);
}

.usercp_menu .usercp_main_item:hover .usercp_main_item_title {
    color: var(--usercp-item-text-color-hover);
}

.usercp_menu .usercp_main_item:hover .usercp_main_item_desc {
    color: var(--usercp-item-text-color-hover);
}

.usercp_side_menu {
    margin-top: 20px;
}

.usercp_menu .usercp_side_item {
    /*background: var(--usercp-item-side-bg-color);*/
    padding: 5px;
    /*color: var(--usercp-item-side-text-color);*/
    text-align: center;
    /*border-top: 3 px solid var(--usercp-item-side-bg-color-hover);*/
    border-top: 1px solid #4c4c4c;
    color: #eee;
}

.usercp_menu .usercp_side_item:hover {
    background: rgb(122 122 122);
    color: var(--usercp-item-side-text-color-hover);
}

.usercp_menu .usercp_side_item.special {
    color: var(--usercp-item-side-text-special-color);
    font-weight: bold;
}

.usercp_menu .usercp_side_item.special:hover {
    color: var(--usercp-item-side-text-special-color-hover);
}


/* DUAL STATS */

.dualstats_active {
    color: #ff8800;
    font-weight: bold;
}

/* PROMO CODES */

.promo-code-input {
    text-transform: uppercase;
    text-align: center;
    font-size: 20px;
    letter-spacing: 3px;
    min-height: 60px;
}


/* VOTE */

.vote-box {
    padding: 0 10px 10px 0;
}

.vote-box-site {
    padding: 10px;
    cursor: pointer;
    border: 3px solid #484848;
}

.vote-box-site:hover {
    background-color: #787657
}

button[data-target="#vipBonuses"] {
    display: none;
}

.vote-img {
    text-align: center;
}

.vote-text {
    text-align: center;
    font-size: 1.1em;
    color: var(--usercp-section-bg-color);
    margin-top: .5em;
}

.vote-box-site:hover .vote-text {
    color: var(--usercp-item-text-color-hover);
}


/* UNLOCK CHARACTER */

.unlock-character-locked {
    position: absolute;
    height: calc(100% + 15px);
    width: 100%;
    top: -15px;
    background: rgba(253, 253, 253, .9);
    z-index: 5;
    text-align: center;
    display: table;
    overflow: hidden;
}

.unlock-character-locked-inner {
    display: table-cell;
    vertical-align: middle;
}

.unlock-character-locked-icon {
    font-size: 6rem;
}

.unlock-character-unlocked {
    position: absolute;
    height: calc(100% + 15px);
    width: 100%;
    top: -15px;
    background: rgba(253, 253, 253, .9);
    z-index: 5;
    text-align: center;
    display: table;
    overflow: hidden;
}

.unlock-character-unlocked-inner {
    display: table-cell;
    vertical-align: middle;
}

.unlock-character-unlocked-icon {
    font-size: 6rem;
}

.row.display-flex {
    display: flex;
    flex-wrap: wrap;
}

.row.display-flex>[class*='col-'] {
    display: flex;
    flex-direction: column;
}

.unlock-character-done {
    position: absolute;
    height: calc(100% + 15px);
    width: 100%;
    top: -15px;
    background: rgba(253, 253, 253, .6);
    z-index: 5;
    text-align: center;
    display: table;
    overflow: hidden;
}

.unlock-character-done-inner {
    display: table-cell;
    vertical-align: middle;
    color: #008800;
}

.unlock-character-done-icon {
    font-size: 3rem;
    color: #008800;
}

.unlock-character-req-box {
    border-right: 1px solid #eee;
}

.unlock-character-req-box-title {
    margin-top: -10px;
    margin-bottom: 10px;
}

.unlock-character-unlock-btn {
    margin: 1rem 0;
}


/* WEBSHOP */

.webshop-item-on-sale {
    color: #ff0000;
}

.webshop .class-category {
    padding: 0 10px 10px 0;
}

.webshop .class-category-item {
    background-color: var(--usercp-section-bg-color);
    color: var(--usercp-section-text-color);
    padding: 10px;
    cursor: pointer;
    text-align: center;
    height: 16em;
}

.webshop .class-category-item h3 {
    color: var(--usercp-section-text-color);
    margin-top: 0;
    font-size: 1.2em;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.webshop .class-category-item p {
    color: var(--usercp-section-text-color);
    margin: 0;
}

.webshop .class-category-item:hover {
    background-color: var(--usercp-item-bg-color);
}

.webshop .desc-holder {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 1em;
}

.webshop .sale-holder {
    margin-bottom: 1em;
}

.webshop .quick-menu {}

.webshop .webshop-options {
    padding-right: 15px;
    padding-left: 15px;
    margin-bottom: 1em;
}

.webshop .webshop-right {
    text-align: right;
}

.webshop .webshop-left {}

.webshop .webshop-sort {
    display: inline;
    width: auto;
}

.webshop .webshop-curr {
    display: inline;
    width: auto;
}

.webshop .webshop-category {
    display: inline;
    width: auto;
}

.webshop .webshop-hover:hover,
.webshop .webshop-hover:hover i {
    cursor: pointer;
    color: var(--link-text-color-hover);
}

.webshop .webshop-table {
    margin-top: 20px;
}

.webshop .webshop-table th {
    text-align: center;
}

.webshop .webshop-table td {
    vertical-align: middle;
}

.webshop .webshop-space {
    margin-right: 14px;
}

.webshop .webshop-item-x {
    background-color: var(--usercp-section-bg-color);
    color: var(--usercp-section-text-color);
    padding: 10px 0 0 0;
    cursor: pointer;
    text-align: center;
    height: 13em;
    position: relative;
    margin-bottom: 1em;
}

.webshop .webshop-item-x:hover {
    background-color: var(--usercp-item-bg-color);
}

.webshop .webshop-item {
    background-color: var(--usercp-section-bg-color);
    color: var(--usercp-section-text-color);
    padding: 10px 0 0 0;
    cursor: pointer;
    text-align: center;
    height: 16em;
    position: relative;
}

.webshop .webshop-item:hover {
    background-color: var(--usercp-item-bg-color);
}

.webshop .webshop-item-title {
    color: var(--usercp-section-text-color);
}

.webshop .webshop-item-img {
    width: 100%;
    height: 128px;
    text-align: center;
}

.webshop .webshop-item-img-helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.webshop .webshop-item-desc {
    color: var(--usercp-section-text-color);
    width: 100%;
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    padding-bottom: 10px;
}

.webshop .webshop-item-desc span {
    color: var(--usercp-section-text-color);
}

.webshop .item-detail {
    background: var(--usercp-section-bg-color);
    padding: 6px 15px 12px 15px;
}

.webshop .item-detail .item-detail-details,
.webshop .item-detail .item-detail-class-req,
.webshop .item-detail .item-detail-store-count,
.webshop .item-detail .item-detail-total-bought {
    color: var(--usercp-section-text-color);
}

.webshop .item-detail .item-detail-title {
    color: var(--usercp-section-text-color);
    font-weight: bold;
    font-size: 1.3em;
}

.item-detail-webshop-armor,
.item-detail-webshop-speed,
.item-detail-webshop-minlvl,
.item-detail-webshop-onedmg,
.item-detail-webshop-twodmg,
.item-detail-webshop-str,
.item-detail-webshop-agi,
.item-detail-webshop-vit,
.item-detail-webshop-eng,
.item-detail-webshop-cmd,
.item-detail-webshop-dur {
    color: var(--usercp-section-text-color);
    font-weight: bold;
}

.webshop-checkbox {
    text-align: left;
}

.webshop-options-form {
    margin-right: 15px;
    margin-left: 15px;
}

@media (max-width: 768px) {
    .webshop-options-form {
        padding-top: 10px;
        margin-right: 0;
        margin-left: 0;
    }
}

.webshop-options-group {
    padding-top: 8px;
}

.webshop-options-group:first-child {
    padding-top: 0;
}

.webshop-options-group .input-group-addon {
    min-width: 185px;
}

.webshop-options-group .input-group-addon.exc-opt {
    min-width: 37rem;
    text-align: left;
}

.webshop-label-checkbox {
    border: 1px solid #ccc !important;
}

.item-detail .webshop-desc-p {
    color: var(--usercp-section-text-color);
}

.webshop-price-box .webshop-price-p {
    color: var(--usercp-section-text-color);
    text-align: left;
}

.webshop-price-p .webshop-item-price,
.webshop-price-p .webshop-options-price,
.webshop-price-p .webshop-total-price {
    color: var(--usercp-section-text-color);
    font-weight: bold;
    text-align: right;
    float: right;
}

.webshop-price-p .webshop-item-price-currency {
    float: right;
}

.webshop-purchase-item-btn {
    margin-top: 1em;
}


/* ACHIEVEMENTS */

.achievement {
    padding-bottom: 30px;
}

@media (max-width: 767px) {
    .achievement {
        padding: 0 0 10px 0;
    }
}

.achievement .achievement_item {
    /*background-color: var(--usercp-item-bg-color);*/
    padding: 10px;
    border: 3px solid #eee;
}

.ach-unlock-tab td {
    vertical-align: middle !important;
}

.achievement table {
    width: 100%;
    padding: 10px;
    border: 3px solid #eee;
}

.ach-header-row {
    text-align: center;
}

.ach-col {
    padding: 0 .5em .5em .5em;
}

.ach-stage {
    float: right;
    font-size: .7em;
}

.ach-icon {
    text-align: center;
    vertical-align: top;
    width: 50px;
    padding: .5em;
}

.ach-icon img {
    box-shadow: 0 0 8 px #000;
}

.ach-text {
    vertical-align: top;
    padding: .5em;
}

.ach-title {
    font-size: 1.2em;
    color: var(--usercp-section-bg-color);
    font-weight: bold;
}

.ach-get span,
.ach-job {
    background-color: #251a15;
    border: 1px solid #412c28;
    box-shadow: inset 0 0 8px #000000;
    display: inline-block;
    margin: 2px 0;
    padding: 6px 8px;
    border-radius: 2px;
    text-transform: uppercase;
}

.ach-job {
    font-size: 10px;
    cursor: pointer;
}

.ach-help-text {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: #251a15;
    border-top: 1px solid #412c28;
    box-shadow: inset 0 0 8px #000000;
    z-index: 1;
    height: 48px;
    font-size: 12px;
}

.ach-help-text p {
    padding: 0 4px;
}

#ach-popup {
    width: 484px;
}

.ach-item-frame {
    display: inline-block;
    text-align: center;
}

.ach-item-frame .ach-give {
    position: absolute;
    bottom: -17px;
    right: 2px;
    z-index: 2;
}

.ach-item-num {
    border-radius: 50px;
    background-color: #090807;
    border: 2px solid #412c28;
    position: absolute;
    bottom: -14px;
    left: 6px;
    z-index: 2;
    width: 23px;
    height: 23px;
    text-align: center;
    line-height: 23px;
}

.ach-item-img,
.ach-jewels-img {
    display: block;
    padding: 2px;
    margin: 2px;
    background-color: #251a15;
    border: 1px solid #412c28;
    box-shadow: inset 0 0 8px #000000;
    border-radius: 4px;
}

.ach-item-img {
    width: 76px;
    height: 76px;
}

.ach-jewels-img {
    padding: 12px 12px 16px 12px
}

.rate-line {
    border: 1px #eee solid;
    height: 22px;
    margin: 9px 0;
}

.rate-line-stage {
    top: 0;
    left: 0;
    background-color: #ffb40021;
    height: 22px;
    z-index: 1;
}

.rate-text {
    font-size: 11px;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 22px;
    margin-top: -22px;
    z-index: 2;
}

.rate-text img {
    margin: 5px;
}

.star-rating,
.current-rating {
    background: url('../achievements/star.png') repeat-x;
    height: 12px;
}

.star-rating {
    position: relative;
    float: right;
    margin: 2px;
    list-style: none;
}

.star-rating-big,
.current-rating-big {
    background: url('../achievements/star-big.png') repeat-x;
    height: 16px;
}

.star-rating-big {
    position: relative;
    display: inline-block;
    width: 80px;
}

.current-rating,
.current-rating-big {
    background-position: left bottom;
}

@media (min-width: 768px) {
    .ach-reg-btn {
        margin-top: 6px;
    }
}


/* TEMPLATE */

#events {
    margin-bottom: 0;
}

#events .event .title {
    color: var(--link-text-color);
}

#events dt.eventActive b,
#events dt.eventActive span,
#events dt.eventActive span div {
    color: rgb(0, 150, 0);
}

#events span {
    display: block;
    font-size: 12px;
}

#events .event {
    padding-bottom: 3px;
    border-bottom: 1px solid #eeeeee;
    padding-top: 3px;
}

#events .event:first-child {
    padding-top: 0;
}

#events .event:last-child {
    border-bottom: none;
}

#bossTimer {
    margin-bottom: 0;
}

#bossTimer .boss .title {
    color: var(--link-text-color);
}

#bossTimer dt.eventActive b,
#bossTimer dt.eventActive span,
#bossTimer dt.eventActive span div {
    color: rgb(0, 150, 0);
}

#bossTimer span {
    display: block;
    font-size: 12px;
}

#bossTimer .boss {
    padding-bottom: 3px;
    border-bottom: 1px solid #eeeeee;
    padding-top: 3px;
}

#bossTimer .boss:first-child {
    padding-top: 0;
}

#bossTimer .boss:last-child {
    border-bottom: none;
}

.rightfloat {
    float: right;
}


/* MY VAULT */

.my-vault td.wh-item,
.my-vault-ext td.wh-item {
    background: #ffedc4;
    border: 1px #dddddd solid;
}

.my-vault td.wh-item-empty,
.my-vault-ext td.wh-item-empty {
    background: #eeeeee;
    border: 1px #dddddd solid;
}

@media (max-width: 767px) {
    .my-vault,
    .my-vault-ext {
        margin: 10px auto;
    }
}

@media (min-width: 768px) {
    .my-vault-right {
        float: right;
    }
    .my-vault-center {
        margin: auto;
    }
    .my-vault-ext {
        float: left;
    }
}


/* CASH SHOP */

.cashshop .cashshop-item {
    background-color: var(--usercp-section-bg-color);
    color: var(--usercp-section-text-color);
    padding: 10px 0 0 0;
    cursor: pointer;
    text-align: center;
    height: 16em;
    position: relative;
}

.cashshop .cashshop-item:hover {
    background-color: var(--usercp-item-bg-color);
}

.cashshop .cashshop-item-title {
    color: var(--usercp-section-text-color);
}

.cashshop .cashshop-item-img {
    width: 100%;
    height: 128px;
    text-align: center;
}

.cashshop .cashshop-item-img-helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.cashshop .cashshop-item-desc {
    color: var(--usercp-section-text-color);
    width: 100%;
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    padding-bottom: 10px;
}

.cashshop .cashshop-item-desc span {
    color: var(--usercp-section-text-color);
}

.cashshop .item-detail {
    background: var(--usercp-section-bg-color);
    padding: 6px 15px 12px 15px;
    text-align: center;
}

.cashshop .item-detail .item-detail-title {
    color: var(--usercp-section-text-color);
    font-weight: bold;
    font-size: 1.3em;
}

.cashshop .cashshop-options {
    padding-right: 15px;
    padding-left: 15px;
    margin-bottom: 1em;
}

.cashshop .item-detail .item-detail-details {
    color: var(--usercp-section-text-color);
    margin-top: 1em;
}

.cashshop .clear {
    padding-left: 0;
    padding-right: 0;
}


/* ARCHITECT */

.architect-section {
    background-color: var(--usercp-section-bg-color);
    font-size: 1.5em;
    color: var(--usercp-section-text-color);
    padding: 10px;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 12px;
}

ul.castleArchitectInfo {
    list-style: disc;
    margin-left: 18px;
    line-height: 24px;
}

ul.castleArchitectInfo li {
    list-style: disc;
}

.castleArchitect .building-title {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 20px;
    color: var(--title-text-color);
    padding: 0 0 10px 0;
    line-height: 125%;
}

.castleArchitect .building-complete {
    width: 19%;
    display: inline-block;
    float: right;
    text-align: right;
}

.castleArchitect .building-image {
    padding-right: 20px;
    display: inline-block;
    vertical-align: top;
}

.castleArchitect h4 {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 16px;
    color: var(--title-text-color);
    padding: 0 0 10px 0;
    line-height: 125%;
}

.castleArchitect .building-button {
    float: right;
    display: inline-block;
    padding: 0;
}

.castleArchitect .building-price-box {
    background-color: #0f1116;
    border-left: 3px solid #ffc107;
    padding: 6px 10px;
    display: inline-block;
    margin: 0 0 8px 0;
    text-align: left;
    color: #ECF0F1;
}

.castleArchitect .building-price-val {
    color: #ffc107;
    font-size: 18px;
    font-weight: bold;
}

.castleArchitect .building-manage-btn {
    border-left: 3px solid #3498DB;
    padding: 6px 10px;
    width: 172px;
    display: inline-block;
    margin: 0 6px 8px 14px;
}

.castleArchitect .building-cannot-upgrade {
    background-color: #251a15;
    border: 1px solid #412c28;
    box-shadow: inset 0 0 8px #000000;
    width: calc(100% - 40px);
    padding: 10px 20px;
    margin-top: 20px;
    text-align: center;
    color: #3498DB;
}


/*.castleArchitect {
    padding: 20px;
    text-align: left;
}

.castleArchitect h3 {
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 6px;
}

.castleArchitect h4 {
    font-weight: bold;
    font-size: 16px;
    padding: 16px 0 6px 0;
}

.castleArchitect ul.castleArchitectInfo {
    list-style: disc;
    margin-left: 18px;
    line-height: 24px;
    padding-bottom: 20px;
}

.castleArchitect ul.castleArchitectInfo li {
    list-style: disc;
}

.castleArchitect table.castleArchitectOwner th {
    width: 50%;
}

.castleArchitect .castleArchitectProduction {
    margin-top: 20px;
}

.castleArchitect .castleArchitectLastProduction {
    margin-top: 20px;
}

.castleArchitect table.castleArchitectLastProduction th {
    width: calc(100% / 7);
}

.castleArchitect table.castleArchitectInvestment {
    margin: 20px 0 20px 0;
}

.castleArchitect table.castleArchitectInvestment th {
    width: 50%;
}

.castleArchitect table.castleArchitectMyInvestments {
    margin: 20px 0 20px 0;
}

.castleArchitect table.castleArchitectMyInvestments th {
    width: calc(100% / 3);
}

.castleArchitect .building .account_sub_header {
    margin: 40px 0 0 0;
    width: 100%;
}

.castleArchitect .building .page-desc-holder {
    width: 100%;
    text-align: center;
    padding: 20px 0 20px 0;
}

.castleArchitect .building .account-wide {
    width: 100%;
}*/


/* ITEMS INVENTORY */

.items-inventory-item-bg {
    background: var(--item-name-bg-color);
}

/* ITEM TOOLTIP */

/* ITEM BOX */
.item-box {
    background: rgba(0, 0, 0, 0.85);
    text-align: center;
    width: 100%;
    white-space: nowrap;
    min-width: 230px;
    padding: 20px 25px;
    font-size: 15px;
    font-family: 'Arial', sans-serif;
    border-radius: 10px; /* Colțuri rotunjite */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4); /* Umbra subtile */
    color: #ffffff;
    transition: all 0.3s ease; /* Tranziție lină pentru hover */
}

.item-box:hover {
    background: rgba(0, 0, 0, 0.9); /* Se face mai închis la hover */
    transform: scale(1.05); /* Mică mărire la hover */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5); /* Umbra mai puternică la hover */
}

.item-box .item-title {
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 10px;
}

.item-box .item-description {
    font-size: 13px;
    color: #ddd;
}

.item-box .item-name {
    font-size: 11px;
    color: #f4cb3f;
    font-weight: bold;
}

.item-box .item-serial {
    font-size: 11px;
    color: #0a0131;
    font-weight: bold;
}

.item-box {
    font-size: 11px;  /* Font mai mic pentru întreaga cutie */
}

.item-tooltip-item-title {
    font-size: 11px;  /* Font mic pentru titluri */
}

.item-tooltip-item-info {
    font-size: 11px;  /* Font mic pentru descriere */
}

.item-tooltip-item-list {
    font-size: 10px;  /* Font mic pentru lista de echipamente */
}

/* Dacă lista este prea mare, o putem face să se încadreze mai ușor */
.item-tooltip-item-list li {
    padding: 2px 0;
}


.mucms-item-tooltip {
    position: absolute;
    display: none;
    min-width: 258px;
    left: 0;
    top: 0;
    padding: 0px;
    z-index: 9999;
    line-height: 1.5;   /* Îmbunătățirea spațierii pentru a fi mai compact */
    max-width: 420px;   /* Dimensiune maximă mai mică */
}

.mucms-item-tooltip img {
    max-width: 100px;    /* Redu dimensiunea imaginii */
    max-height: 100px;   /* Redu dimensiunea imaginii */
}


.item-name {

    padding: 4px 8px;

}

.item-serial {

    color: #ffffff !important;

    padding-top: 10px;

}

.item-info {

    color: #ffffff !important;

}

.item-info-section {

    padding-top: 10px;

}

.item-class-req {

    color: #b4b4b4 !important;

}

.item-opt-jog {

    color: #ff99cc !important;

    padding-top: 10px;

}

.item-opt-harmony {

    color: #ffcc00 !important;

    padding-top: 10px;

}

.item-opt-skill {

    color: #9aadd5 !important;

}

.item-opt-luck {

    color: #9aadd5 !important;

}

.item-opt-life {

    color: #9aadd5 !important;

}

.item-opt-exc {

    color: #4d668d !important;

    padding-top: 10px;

}

.item-opt-anc {

    color: #9aadd5 !important;

    padding-top: 10px;

}

.item-opt-socket {

    color: #4d668d !important;

    padding-top: 10px;

}

.item-mastery-title {

    color: var(--item-color-socket-opt) !important;

}

.item-opt-mastery {

    color: #4d668d !important;

    padding-top: 10px;

}

.item-expiration {

    color: #ff544f !important;

    padding-top: 10px;

}

.muun-name {

    color: #9aadd5;

    font-size: 14px;

    padding: 2px 0 2px 0;

}

.muun-info {

    color: #9aadd5;

}

.muun-opt-expiration {

    color: #cf6e21;

    margin-top: 1rem;

}

.muun-opt-expiration-date {

    color: #9aadd5;

}

/*.item_name_acient { background-color: #3c3cc8; color: #00ff00; }

.item_name_acient1 { color: #3c77c8 !important; }

.item_name_exc { color: #07D865 !important; }

.item_dur { color: #ffffff !important; padding-top: 10px; }

.item_name_gold, .item_harmony { color: #ffcc19 !important; }

.item_name_socket { color: #a079c8 !important; }

.item_luck, .item_exc, .item_sockets, .item_skill { color: #7eb1ff; padding-top: 10px;  }

.item_class { color: #ffffff; padding-top: 10px;  }

.item_sockets_title { color: #bd48ba; }

.item_ancient { color: #989898 !important; padding-top: 10px;  }

.right_margin { margin-right: 20px; }

.item_pvp { color: #cc7fcc !important; }

.item_sockets > span, .item_pvp > span { display: block; }*/

/* ERROR NOTIFICATION STYLES */
.notification {
    padding: 8px;
    background: #e74c3c;
    border-radius: 5px;
    margin: 10px 0;
    color: #fff;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notification span {
    margin-right: 10px;
}

.notification-icon {
    font-size: 16px;
    margin-right: 8px;
}

.notification-close {
    font-size: 16px;
    cursor: pointer;
}


.donate-paymentwall {
    height: auto;
    min-height: 25em;
}

.countdown-container {
    display: flex;
    justify-content: center;
    pointer-events: none;
    margin-top: -113px;
}


/* Containerul principal pentru titlu și temporizator */

.index-countdown-center {
    position: relative;
    top: 147px;
    width: 262px;
    height: 112px;
    z-index: 5;
    background-color: rgb(23 25 32);
    border: 3px solid var(--link-text-color);
    border-radius: 8px;
    box-shadow: 0 4px 8px rgb(23 25 32 / 0%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    box-sizing: border-box;
    pointer-events: auto;
}


/* Titlu centrat pe orizontală */

.index-countdown-title {
    font-size: 1em;
    font-weight: bold;
    color: #ffb400;
    padding: 5px 0;
    border-radius: 5px;
    margin-bottom: 5px;
    text-align: center;
}


/* Containerul pentru elementele timer-ului, aranjate orizontal */

.index-countdown-content {
    display: flex;
    align-items: center;
    /* Centrează pe verticală */
    justify-content: space-between;
    /* Spațiu egal între elemente */
    width: 100%;
    /* Ocupă întreaga lățime disponibilă */
    height: calc(100% - 30px);
    /* Ajustează înălțimea pentru a lăsa spațiu pentru titlu */
}


/* Fundalul timer-ului */

.timer-bg {
    background-color: rgb(255 255 255 / 0%);
    /* Fundal similar */
    padding: 5px 0;
    border: 1px solid var(--link-text-color);
    /* Bordură similară */
    color: var(--link-text-color);
    /* Culoare text */
    text-align: center;
    display: flex;
    flex-direction: column;
    /* Așează numărul și textul într-o coloană */
    align-items: center;
    justify-content: center;
    width: 100%;
    /* Ocupă întreaga lățime disponibilă */
    box-sizing: border-box;
    /* Include padding și border în dimensiuni */
}


/* Stil pentru numărul timer-ului */

.timer-number {
    color: var(--usercp-section-text-color);
    /* Culoare text pentru număr */
    font-size: 1.5em;
    /* Ajustează mărimea textului pentru a se potrivi în pătrat */
    margin-bottom: 2px;
    /* Spațiu între număr și textul asociat */
}

.badge-tooltip .title {
    color: #ffffff;
    font-size: 14px;
}


/* ACTIVITY REWARDS */

.timeline {
    border-left: var(--title-text-color) solid;
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    margin: 0 0 0 66px;
    position: relative;
    line-height: 1.4em;
    font-size: 1.03em;
    padding: 10px 0 10px 50px;
    list-style: none;
    text-align: left;
}

.timeline .event {
    padding-bottom: 25px;
    position: relative;
}

.timeline .event:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border: none;
}

.timeline .event:before,
.timeline .event:after {
    position: absolute;
    display: block;
    top: 0;
}

.timeline .event:before {
    left: -210px;
    content: attr(data-date);
    text-align: right;
    font-weight: 100;
    font-size: 0.9em;
    min-width: 120px;
    top: 10px;
}

.timeline .event:after {
    left: -66px;
    background: var(--title-text-color);
    border-radius: 50%;
    height: 30px;
    width: 30px;
    content: "";
    top: 5px;
}

.timeline .event.done:after {
    background: #008000;
    font-family: "Font Awesome 5 Pro";
    content: "\f00c";
    color: #ffffff;
    padding: 5px 8px;
}

.timeline .event.active:after {
    background: #0f1116;
}

.timeline .event .make-border {
    border-bottom: 1px #eeeeee dashed;
}

.activity-claim-reward-btn {
    margin-bottom: 10px;
}


/* ICE WIND VALLEY */

.active-period {
    color: #00bb00;
}


/* CASTLE SIEGE */

.cs-attacker {
    color: #b90000;
}

.cs-defender {
    color: #009000;
}


/* IWV & ARKA */

.event-winner-icon {
    color: #ffc100;
}

.event-looser-icon {
    color: #b90000;
}


/* MY CHARACTERS */

.mycharacters-accordion {
    color: #fff;
    cursor: pointer;
    padding: 23px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
    margin-top: 13px;
    border-radius: 5px;
    background: linear-gradient(to bottom, #0d0d0d, #151517);
    background-size: 100% 100%;
    background-position: center;
    display: flex;
    justify-content: space-between;
    filter: brightness(100%) drop-shadow(0px 12px 20px #161515);
    background: #0b0c10;
    border-radius: 5px;
    border: 1px solid #ffffff12;
    line-height: 2px;
}

.mycharacters-active,
.mycharacters-accordion:hover {
    background-color: var(--title-text-color);
    color: var(--content-bg-color);
    background: linear-gradient(to bottom, #0f1116, #0f1116);
}

.mycharacters-active small,
.mycharacters-accordion:hover small {
    color: #ffffff;
    /* line-height: 5px; */
}

.mycharacters-panel {
    /* background-color: #e7e1e914; */
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.table-mycharacters th {
    text-align: center;
    vertical-align: bottom !important;
}

.mycharacters-glogo {
    float: right;
    line-height: -1px;
    top: -12px;
    position: relative;
}

.table-mycharacters td.row-title {
    font-weight: bold;
}


/* PARTY MATCHING */

.party-matching {
    background-color: var(--usercp-section-bg-color);
    padding: 10px 30px;
}

.party-matching-text {
    color: var(--usercp-section-text-color);
}


/* ACCOUNT SETTINGS */

.account-settings-item {
    padding: 10px;
    cursor: pointer;
    border: 3px solid #f28427;
    margin-bottom: 1em;
}

.account-settings-item a:hover {
    text-decoration: none;
}

.account-settings-item:hover {
    background-color: #787657;
}

.account-settings-item .title {
    font-size: 1.2em;
    color: rgb(207 207 207);
    font-weight: bold;
}

.account-settings-item .desc {
    color: var(--general-text-color);
    font-size: 12px;
}

.account-settings-item:hover .title {
    color: var(--usercp-item-text-color-hover);
}

.account-settings-item:hover .desc {
    color: var(--usercp-item-text-color-hover);
}

.account-settings-item .icon {
    --fa-primary-color: var(--usercp-section-bg-color);
    ;
    --fa-secondary-color: var(--title-text-color);
    position: absolute;
    font-size: 2em;
    top: 12px;
    left: 16px;
}

.account-settings-item:hover .icon {
    --fa-primary-color: var(--usercp-item-text-color-hover);
    --fa-secondary-color: var(--usercp-item-text-color-hover);
}

.account-settings-item.discord .icon .fab.fa-discord {
    color: var(--usercp-item-bg-color-hover);
}

.account-settings-item.discord:hover .icon .fab.fa-discord {
    color: var(--usercp-item-text-color-hover);
}

.account-settings-item.facebook .icon .fab.fa-facebook {
    color: var(--usercp-item-bg-color-hover);
}

.account-settings-item.facebook:hover .icon .fab.fa-facebook {
    color: var(--usercp-item-text-color-hover);
}


/* TOGGLE */

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.toggle-slider {
    background-color: var(--title-text-color);
}

input:focus+.toggle-slider {
    box-shadow: 0 0 1px var(--title-text-color);
}

input:checked+.toggle-slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}


/* Rounded sliders */

.toggle-slider.round {
    border-radius: 34px;
}

.toggle-slider.round:before {
    border-radius: 50%;
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    vertical-align: middle;
}


/* */

.form-horizontal .control-label {
    padding-top: 0;
}

.server-info-home-panel table td {
    padding: 3px 0;
    font-size: 14px !important;
}

.server-info-home-panel table.table-body-items td {
    padding: 6px 14px;
}


/* Adventures */

.adventures-check-icon-done {
    color: #00ac28;
}

.adventures-check-icon-error {
    color: #a20000;
}

.adventures-lock-icon {
    color: #ffffff;
    margin-right: 10px;
}

.adventures-unlocked-info {
    padding: 8px;
    text-align: center;
}

.adventures-locked-req-col {
    padding: 8px;
    text-align: center;
}

.adventures-unlock-btn {
    margin-bottom: 10px;
}

.adventure-skill-icon {
    font-size: 4rem;
    --fa-primary-color: #2C3E50;
    --fa-secondary-color: #2980B9;
}

.btn-skill-add {
    width: 2rem;
    height: 2rem;
}

.adventure-skill-title {
    font-weight: bold;
    font-size: 16px;
}

.adventure-skill-icon-add {
    padding: 1rem 1.1rem;
    border: 1px #2C3E50 solid;
    border-radius: 5px;
    background-color: #2980B9;
    color: #ffffff;
}

.adventures-skill {
    margin-bottom: 1.25rem;
}

.adventures-skill-points {
    font-size: 12px;
    color: #888;
}

.adventure-skill-icon-add-btn {
    background: none;
    border: none;
}

.adventure-skills {
    margin: 2rem 0 0 0;
}

.adventure-section-title {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
    background: #f3f3f3;
    font-weight: bold;
    margin-bottom: 1rem;
    text-align: center;
}

#adventure-duration {
    text-align: left;
}

.adventure-finish-btn {
    margin-top: 2rem;
}

.adventure-hero-alive {
    color: #0c8500;
}

.adventure-hero-dead {
    color: #8f0000;
}

.adventure-heal-icon {
    cursor: pointer;
    --fa-primary-color: #2C3E50;
    --fa-secondary-color: #2980B9;
    font-size: 14px;
}

.adventure-result-box {
    padding: 3rem 3rem 0 3rem;
    color: #fff;
    text-align: center;
    border: 1px solid #f3f3f3;
    margin-bottom: 2rem;
}

.adventure-result-box-title {
    background-color: #f3f3f3;
    padding: 1rem;
    margin-top: -3rem;
    margin-left: -3rem;
    margin-bottom: 3rem;
    width: calc(100% + 6rem);
}

.adventure-result-box-section {
    margin-bottom: 2rem;
}

.adventure-result-box-icon {
    font-size: 30px;
}

.adventure-result-box-section-title {
    font-size: 30px;
}

.adventure-result-box-section-subtitle {
    font-size: 14px;
    margin-top: -10px;
}

.adventure-result-box-section-title-item {
    font-size: 20px;
}

.adventure-token-icon {
    cursor: pointer;
    --fa-primary-color: #2C3E50;
    --fa-secondary-color: #2980B9;
    font-size: 14px;
}


/* Event Winner Rewards */

.event-winner-reward-box {
    padding: 20px;
    border: 1px solid #2c3e50;
}

.event-winner-reward-box table th {
    text-align: center;
}

.char-inv-table {
    margin: auto;
}


/* Link Accounts */

.link-account-icon {
    font-size: 44px;
    --fa-primary-color: #2C3E50;
    --fa-secondary-color: #2980B9;
}

.link-account-value {
    font-size: 26px;
    font-weight: bold;
}

.link-account-panel {
    width: 100%;
}

.link-account-icon-panel {
    width: 20%;
    min-width: 50px;
    display: inline-block;
}

.link-account-title-panel {
    width: 35%;
    min-width: 120px;
    display: inline-block;
    text-align: left;
}

.link-account-reward-box {
    border: 2px solid #2C3E50;
    padding: 1rem;
    height: 100%;
}

.link-account-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

.link-account-row>[class*='link-account-col'] {
    display: flex;
    flex-direction: column;
    margin: 0 0 15px 0;
}

.link-account-claim-reward {
    width: 100%;
    height: 40px;
}

.link-account-claim-reward-btn {
    position: absolute;
    bottom: 1rem;
    width: calc(100% - 2rem - 34px);
}

.link-account-locked-rewards {
    position: absolute;
    height: calc(100% + 15px);
    width: 100%;
    top: -15px;
    background: rgba(253, 253, 253, .8);
    z-index: 5;
    text-align: center;
    display: table;
    overflow: hidden;
}

.link-account-locked-rewards-inner {
    display: table-cell;
    vertical-align: middle;
}

.link-account-locked-rewards-icon {
    font-size: 100px;
}

.link-account-btn-small {
    color: #aaa;
}

hr.link-account-hr {
    margin: 5px 0 5px 0 !important;
}

.pagination>li>a,
.pagination>li>span {
    float: none;
}


/* Speed Server */

.ranking-list .ranking-top {
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
    padding: 32px 0 30px;
    list-style: none;
}

.ranking-list .ranking-top li {
    float: left;
    width: 20%;
    height: 210px;
    background-position: center;
    background-repeat: no-repeat;
}

.ranking-list .ranking-top li.rank1 {
    background-image: url(../donation/images/bg_rank1.png);
}

.ranking-list .ranking-top li.rank2 {
    background-image: url(../donation/images/bg_rank2.png);
}

.ranking-list .ranking-top li.rank3 {
    background-image: url(../donation/images/bg_rank3.png);
}

.ranking-list .ranking-top li.rank4 {
    background-image: url(../donation/images/bg_rank4.png);
}

.ranking-list .ranking-top li.rank5 {
    background-image: url(../donation/images/bg_rank5.png);
}

.ranking-list .ranking-top li .char {
    margin-top: 70px;
}

.ranking-list .ranking-top li.rank1 .char {
    color: #caa516;
}

.ranking-list .ranking-top li.rank2 .char {
    color: #aaa;
}

.ranking-list .ranking-top li.rank3 .char {
    color: #bb746d;
}

.ranking-list .ranking-top li span {
    display: block;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #5cbbff;
}

@media (max-width: 500px) {
    .ranking-list .ranking-top li {
        width: 100%
    }
}

.muun-container {
    display: block;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    height: 130px;
    margin-bottom: 60px;
}

.muun-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.muun-checkmark {
    position: absolute;
    bottom: -50px;
    left: calc(50% - 12.5px);
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
}

.muun-serial {
    position: absolute;
    bottom: -20px;
    right: 0;
    left: 0;
}

.muun-container:hover input~.muun-checkmark {
    background-color: #ccc;
}

.muun-container input:checked~.muun-checkmark {
    background-color: var(--btn-bg-color);
}

.muun-checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.muun-container input:checked~.muun-checkmark:after {
    display: block;
}

.muun-container .muun-checkmark:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

.separator-right-border {
    border-right: 1px #eee solid;
}

.muun-add-space {
    margin-top: 1rem;
}

.next-vip-period {
    font-size: 20px;
}

.next-vip-period-dates {
    font-size: 20px;
    font-weight: bold;
}

table.custom-vip {
    width: 100%;
    border-collapse: collapse;
}

table.custom-vip tr {
    position: relative;
}

table.custom-vip td {
    padding: 5px 10px;
    border-bottom: 1px solid #ddd;
}

table.custom-vip .overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: #eee;
    opacity: 0.5;
}

table.custom-vip .custom-vip-unlock {
    font-size: 2rem;
    margin-top: .5rem;
    color: #156600;
}

table.custom-vip .custom-vip-lock {
    font-size: 2rem;
    margin-top: .5rem;
    color: #9e0000;
}

table.custom-vip tr.vip-package-locked {
    background-color: #eee;
}

.bigSlider {
    position: relative;
    background: var(--footer-bg-color);
    margin-top: 2rem;
}

.slider-for {
    width: 100%;
    z-index: 2;
    position: relative
}

.tabs-content {
    display: none;
    opacity: 0
}

.tabs-content.active {
    display: block;
    opacity: 1;
    animation: 1s opas linear
}

.slideTabs {
    position: relative
}

.slideContent {
    position: relative;
    padding: 120px 120px 70px 140px;
    height: 700px
}

.hero-logo {
    position: absolute;
    left: -10px;
    top: 65px
}

.hero-trailer {
    position: absolute;
    left: -10px;
    top: 180px;
    transition: .2s all ease;
    cursor: pointer;
}

.hero-trailer:hover {
    transform: scale(1.1);
}

.slide-hero {
    position: absolute;
    right: 0;
    top: 0px;
    z-index: 1
}

.slide-tabs-caption {
    position: absolute;
    display: flex;
    z-index: 3;
    transform: rotate(-90deg);
    top: 280px;
    left: -10px
}

.slide-tabs-caption li {
    margin: 0px 15px;
    cursor: pointer
}

.slide-tabs-caption .active {
    color: #fff
}

.slideInfo {
    position: relative;
    z-index: 2
}

.slideInfo-name {
    color: var(--title-text-color);
    font-size: 60px;
    line-height: 60px;
    display: block;
    letter-spacing: 5px;
    margin-bottom: 40px;
    text-transform: uppercase
}

.slideInfo-text {
    width: 100%;
    max-width: 500px;
    font-size: 12px;
    font-style: italic;
    line-height: 1.4;
    margin-bottom: 45px
}

.slideInfo-stats {
    max-width: 580px
}

.slideInfo-stats_title {
    color: #cc7954;
    font-size: 18px;
    text-transform: uppercase;
    margin-bottom: 20px;
    display: block
}

.stats {
    padding: 10px 0px;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    margin-right: 20px
}

.stats span {
    display: block
}

.stats-name {
    color: var(--title-text-color);
    font-size: 12px;
    font-weight: 600;
    width: 80px
}

.stats-bar {
    width: 140px;
    background: rgba(255, 255, 255, 0.1);
    height: 3px;
    margin-right: 15px
}

.stats-bar span {
    width: 0%;
    height: 3px;
    position: relative;
    transition: 3s
}

.stats-bar span:after {
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    width: 8px;
    height: 3px
}

.stats-number {
    font-size: 12px;
    width: 30px
}

.stat-green {
    color: #46c022
}

.stat-green span {
    background: linear-gradient(to right, #1e3621, #4fee20)
}

.stat-green span:after {
    box-shadow: 0px 0px 10px 1px #4fee20
}

.stat-red {
    color: #cf4721
}

.stat-red span {
    background: linear-gradient(to right, #451b15, #cf3e14)
}

.stat-red span:after {
    box-shadow: 0px 0px 10px 1px #cf3e14
}

.stat-yellow {
    color: #cd8c21
}

.stat-yellow span {
    background: linear-gradient(to right, #332615, #cf8914)
}

.stat-yellow span:after {
    box-shadow: 0px 0px 10px 1px #cf8914
}

@keyframes opas {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    100% {
        display: block;
        opacity: 1
    }
}

.slick-active .slideFor .stats-bar span {
    width: 100%
}

.hero_3 {
    right: 0
}

.bigSlider .slick-arrow {
    width: 150px;
    height: 150px;
    font-size: 0px;
    position: absolute;
    top: 50%;
    margin-top: -75px;
    box-shadow: none
}

.bigSlider .slick-arrow:hover {
    filter: brightness(100%)
}

.bigSlider .slick-arrow.slick-prev {
    background: url(../characters/slider/arrow-left.png) no-repeat, var(--footer-bg-color);
    border: none;
    left: 0;
    z-index: 99;
}

.bigSlider .slick-arrow.slick-next {
    background: url(../characters/slider/arrow-right.png) no-repeat, var(--footer-bg-color);
    border: none;
    right: 0;
    z-index: 99;
}

.slideNav {
    cursor: pointer;
    transition: 0.3s
}

.slideNav-img {
    background: url(../characters/slider/hero-slider-mini-bg.png) center no-repeat;
    width: 120px;
    height: 120px;
    position: relative;
    margin: 0 auto;
    transition: 0.3s
}

.slideNav-img img {
    position: absolute;
    bottom: 0px;
    transition: 0.3s
}

.slideNav-text {
    text-align: center;
    color: var(--title-text-color);
    font-size: 16px;
    position: relative;
    top: -10px;
    transition: 0.3s
}

.slider-nav {
    width: 100%;
    max-width: 1050px;
    margin: 0 auto;
    margin-top: -180px;
    z-index: 5
}

.slider-nav:before {
    content: "";
    position: absolute;
    width: 1000px;
    height: 257px;
    left: 50%;
    margin-left: -489px;
    top: -100px
}

.bigSlider .slick-center .slideNav-img {
    background: url(../characters/slider/hero-slider-mini-hover-bg.png) center no-repeat;
    filter: drop-shadow(0px 0px 25px rgba(248, 72, 21, 0.7))
}

.bigSlider .slick-center .slideNav-img img {
    transform: scale(1.3)
}

.bigSlider .slick-center .slideNav-text {
    font-size: 20px;
    top: 5px
}

.sliderGallery {
    position: relative;
    margin-top: -10px;
    margin-bottom: 30px
}

.slider-nav .slick-track {
    height: 180px;
    padding-top: 30px
}

.sliderGallery .slick-list {
    padding: 20px 0px;
    max-width: 960px;
    width: 100%;
    margin: 0 auto
}

.sliderGallery .slick-arrow {
    width: 65px;
    height: 65px;
    font-size: 0px;
    position: absolute;
    top: 50%;
    margin-top: -32px;
    filter: drop-shadow(0px 20px 10px rgba(0, 0, 0, 0.5));
    transition: 0.3s;
    box-shadow: none
}

.sliderGallery .slick-arrow:hover {
    width: 93px;
    height: 93px;
    margin-top: -46px
}

.sliderGallery .slick-arrow.slick-prev {
    background: url(../../assets/characters/slider/c-left.png) no-repeat;
    left: 0px
}

.sliderGallery .slick-arrow.slick-prev:hover {
    background: url(../../assets/characters/slider/c-left-hover.png) no-repeat;
    left: -15px
}

.sliderGallery .slick-arrow.slick-next {
    background: url(../../assets/characters/slider/c-right.png) no-repeat;
    right: 0px
}

.sliderGallery .slick-arrow.slick-next:hover {
    background: url(../../assets/characters/slider/c-right-hover.png) no-repeat;
    right: -15px
}

.sliderImg img {
    width: 220px;
    height: 145px;
    transition: 0.3s;
    margin: 0 auto
}

.sliderImg img:hover {
    transform: scale(1.1);
    box-shadow: 20px 0px 15px 1px rgba(0, 0, 0, 0.5), -20px 0px 15px 1px rgba(0, 0, 0, 0.5)
}

.discord-btn {
    width: 100%;
    padding: 6px 12px;
    background-color: #5865f2 !important;
    border: 1px solid #4f5be2 !important;
    color: #ffffff;
    text-align: center;
}

.discord-btn svg {
    vertical-align: middle;
    fill: #ffffff;
    margin-top: -2px;
    margin-right: 1rem;
}

.discord-btn-unlink {
    width: 100%;
    padding: 6px 12px;
    background-color: #9c0000 !important;
    border: 1px solid #820000 !important;
    color: #ffffff;
    text-align: center;
}

.discord-btn-unlink svg {
    vertical-align: middle;
    fill: #ffffff;
    margin-top: -2px;
    margin-right: 1rem;
}

.facebook-btn {
    width: 100%;
    padding: 6px 12px;
    background-color: #385490 !important;
    border: 1px solid #2e4880 !important;
    color: #ffffff;
    text-align: center;
}

.google-btn {
    width: 100%;
    padding: 6px 12px;
    background-color: #4285f4 !important;
    border: 1px solid #316fd7 !important;
    color: #ffffff;
    text-align: center;
}

.discord-btn .icon-white,
.facebook-btn .icon-white,
.google-btn .icon-white,
.facebook-btn-unlink .icon-white,
.forum-btn-link .icon-white {
    color: #fff;
    margin-right: 1rem;
}

.facebook-btn-unlink {
    width: 100%;
    padding: 6px 12px;
    background-color: #9c0000 !important;
    border: 1px solid #820000 !important;
    color: #ffffff;
    text-align: center;
}

.forum-btn-link {
    width: 100%;
    padding: 6px 12px;
    color: #ffffff;
    text-align: center;
}

table.usercp tr.odd {
    background: #2b2318;
}

table.usercp tr.even {
    background: transparent
}

.footer-time {
    font-size: 45px;
    color: var(--link-text-color);
    font-weight: bold;
    position: relative;
    top: -10px;
}

.footer-date {
    font-size: 12px;
    position: relative;
    top: -22px;
}


/* Notifications */

.fading-notification {
    border: 1px solid;
    margin: 10px 0px;
    padding: 16px 25px 1px 50px;
    background-repeat: no-repeat;
    text-align: left;
    width: 100%;
    border-radius: 5px;
}

.red {
    color: #a74f55;
    background-color: #36181b;
    background-image: url('../images/error.png');
    background-position: 10px center;
}

.green {
    color: #79b72a;
    background-color: #2e3618;
    background-image: url('../images/success.png');
    background-position: 10px center;
}

.orange {
    color: #d68c44;
    background-color: #362518;
    background-image: url('../images/warning.png');
    background-position: 10px center;
}

.light_brown {
    color: #3c3738;
    background-color: #adcbfb29;
    background-image: url('../images/wiki-img2.png');
    font-size: 13px;
    padding-left: 62px;
    border: 1px solid #cdcbcb;
    background-position: 14px center;
}



.ct-chart .tooltip {

    border: 1px solid #fff;

}

html.dark .ct-chart .tooltip {

    border: 1px solid #282d36;

}



table.skill-tree-3rd-table {

    border: 1px solid red;

    border-collapse: collapse;

}

table.skill-tree-3rd-table td {

    border: 0px solid blue;

    border-collapse: collapse;

    font-size: 10px;

    color: white;

    font-family: 'Arial';

    vertical-align: bottom;

    text-align: left;

}

.skill-tree-3rd-table .level-skill {

    margin-left: 8px;

    height: 15px;

    width: 15px;

    color: #999;

}

.skill-tree-3rd-table .bg-icon {

    background: rgba(0, 0, 0, 0.7);

    transition: all 0.2s ease-out;

}

.skill-tree-3rd-table .bg-icon:hover {

    background: rgba(0, 0, 0, 0.1);

}



.skill-tree-3rd-table .skill-tooltip {

    text-decoration:none;

    position:relative;

    width: 30px;

    height: 42px;

}

.skill-tree-3rd-table .skill-tooltip span {

    display:none;

}

.skill-tree-3rd-table .skill-tooltip:hover span {

    display:block;

    position: absolute;

    overflow:hidden;

    background: rgba(0, 0, 0, 0.8);

    padding: 5px 10px;

    border-radius: 3px;

    margin-top: 45px;

    width: 140px;

    margin-left: -70px;

    text-align: center;

    color: gold;

    border:  1px solid #52433c;

    font-family: Arial;

    box-shadow: 2px 2px 5px #000;

}

.skill-tree-3rd-table .skill-tooltip:hover span.left {

    margin-left: -5px;

}

.skill-tree-3rd-table .skill-tooltip:hover span.right {

    margin-left: -115px;

}

.skill-tree-3rd-table .skill-tooltip:hover span.bottom {

    margin-left: -65px;

    margin-top: -35px;

}

.skill-tree-3rd-table .skill-tooltip:hover span.bottom-right {

    margin-left: -115px;

    margin-top: -35px;

}

.modal-content.modalMasterSkillTree {

    background-color: transparent;

    box-shadow: none;

    border: none;

}

.modal-body.modalMasterSkillTree button.close {

    position: absolute;

    right: 2rem;

    top: 1.25rem;

    opacity: 1;

    text-shadow: none;

}

.modal-body.modalMasterSkillTree button.close span {

    color: #ccc;

    font-weight: 400;

}

.btn-share-build {

    margin-right: 1rem;

}

.form-my-characters-options {

    display: inline-block;

}

.skill-tree-3rd-table td {

    padding: 0;

    margin: 0;

}

table.skill-tree-3rd-table {

    border: 1px solid red;

    border-collapse: collapse;

}

table.skill-tree-3rd-table td {

    border: 0px solid blue;

    border-collapse: collapse;

    font-size: 10px;

    color: white;

    font-family: 'Arial';

    vertical-align: bottom;

    text-align: left;

}

.skill-tree-3rd-table .level-skill {

    margin-bottom: -4px;

    margin-left: 8px;

    height: 15px;

    width: 15px;

    color: #999;

}

.skill-tree-3rd-table .bg-icon {

    background: rgba(0, 0, 0, 0.7);

    transition: all 0.2s ease-out;

}

.skill-tree-3rd-table .bg-icon:hover {

    background: rgba(0, 0, 0, 0.1);

}

.skill-tree-3rd-table .skill-tooltip {

    text-decoration:none;

    position:relative;

    width: 30px;

    height: 42px;

}

.skill-tree-3rd-table .skill-tooltip span {

    display:none;

}

.skill-tree-3rd-table .skill-tooltip:hover span {

    display:block;

    position: absolute;

    overflow:hidden;

    background: rgba(0, 0, 0, 0.8);

    padding: 5px 10px;

    border-radius: 3px;

    margin-top: 45px;

    width: 140px;

    margin-left: -70px;

    text-align: center;

    color: gold;

    border:  1px solid #52433c;

    font-family: Arial;

    box-shadow: 2px 2px 5px #000;

}

.skill-tree-3rd-table .skill-tooltip:hover span.left {

    margin-left: -5px;

}

.skill-tree-3rd-table .skill-tooltip:hover span.right {

    margin-left: -115px;

}

.skill-tree-3rd-table .skill-tooltip:hover span.bottom {

    margin-left: -65px;

    margin-top: -35px;

}

.skill-tree-3rd-table .skill-tooltip:hover span.bottom-right {

    margin-left: -115px;

    margin-top: -35px;

}

table.skill-tree-4th-table {

    border: 1px solid red;

    border-collapse: collapse;

}

table.skill-tree-4th-table td {

    border: 0px solid blue;

    border-collapse: collapse;

    font-size: 10px;

    color: white;

    font-family: 'Arial';

    vertical-align: bottom;

    text-align: left;

}

.skill-tree-4th-table .level-skill {

    //margin-bottom: -4px;

    margin-left: 8px;

    height: 15px;

    width: 15px;

    color: #999;

}

.skill-tree-4th-table .bg-icon {

    background: rgba(0, 0, 0, 0.7);

    transition: all 0.2s ease-out;

}

.skill-tree-4th-table .bg-icon:hover {

    background: rgba(0, 0, 0, 0.1);

}

.skill-tree-4th-table .skill-tooltip {

    text-decoration:none;

    position:relative;

    width: 31px;

    height: 42px;

}

.skill-tree-4th-table .skill-tooltip span {

    display:none;

}

.skill-tree-4th-table .skill-tooltip:hover span {

    display:block;

    position: absolute;

    overflow:hidden;

    background: rgba(0, 0, 0, 0.8);

    padding: 5px 10px;

    border-radius: 3px;

    margin-top: 45px;

    width: 140px;

    margin-left: -70px;

    text-align: center;

    color: gold;

    border:  1px solid #52433c;

    font-family: Arial;

    box-shadow: 2px 2px 5px #000;

}

.skill-tree-4th-table .skill-tooltip:hover span.left {

    margin-left: -5px;

}

.skill-tree-4th-table .skill-tooltip:hover span.right {

    margin-left: -115px;

}

.skill-tree-4th-table .skill-tooltip:hover span.bottom {

    margin-left: -65px;

    margin-top: -35px;

}

.skill-tree-4th-table .skill-tooltip:hover span.bottom-right {

    margin-left: -115px;

    margin-top: -35px;

}

.modal-content.modalMasterSkillTree, .modal-content.modalEnhancedSkillTree {

    background-color: transparent;

    box-shadow: none;

    border: none;

}

.modal-body.modalMasterSkillTree button.close, .modal-body.modalEnhancedSkillTree button.close {

    position: absolute;

    right: 1rem;

    opacity: 1;

    text-shadow: none;

    font-weight: normal;

}

.modal-body.modalEnhancedSkillTree button.close {

    top: 1.275rem;

}

.modal-body.modalMasterSkillTree button.close span, .modal-body.modalEnhancedSkillTree button.close span {

    color: #ccc;

}

.btn-sell-character {

    margin-right: 1rem;

}

.mycharacters-form-sell-character {

    display: inline-block;

}

.btn-share-build {

    margin-right: 1rem;

}

.btn-apply-build {

    margin-right: 1rem;

}

.btn-view-master-skill-tree {

    margin-right: 1rem;

}

.form-my-characters-options {

    display: inline-block;

}

table td.my-characters-in-market {

    background: #a50000;

    color: #ffffff;

}

.char-market-gens-img {

    width: 30px;

}

.character-market-view .inventory-bg {

    margin: 0 auto;

}

@media (min-width: 1000px) {

    .modal-lg.character-market-view-modal {

        width: 960px;

    }

}

button.enhanced-skill-tree-btn-top {

    font-size: 12px;

    background: none;

    border: none;

    color: #777;

    margin: bottom;

    width: 101px;

    height: 30px;

    margin-bottom: 1px;

    cursor: pointer;

    float: left;

    margin-left: 11px;

    white-space: nowrap;

    overflow: hidden;

}

button.enhanced-skill-tree-btn-top.active {

    color: #b2b2b2 !important;

}

button.enhanced-skill-tree-btn-top:hover {

    background: url(../../templates/assets/skill-tree/button-h.png);

    background-repeat: no-repeat;

    background-position: center top;

    color: #b2b2b2;

}

button.enhanced-skill-tree-btn-left {

    width: 19px;

    height: 19px;

    background: none;

    border: none;

    cursor: pointer;

}

button.enhanced-skill-tree-btn-left:hover {

    background: url(../../templates/assets/skill-tree/button-lh.png);

}

button.enhanced-skill-tree-btn-right {

    width: 19px;

    height: 19px;

    background: none;

    border: none;

    cursor: pointer;

    margin-left: 55px;

}

button.enhanced-skill-tree-btn-right:hover {

    background: url(../../templates/assets/skill-tree/button-rh.png);

}

.carousel-showmanymoveone .carousel-control {

    width: 4%;

    background-image: none;

}

.carousel-showmanymoveone .carousel-control.left {

    margin-left: 15px;

}

.carousel-showmanymoveone .carousel-control.right {

    margin-right: 15px;

}

.carousel-showmanymoveone .cloneditem-1,

.carousel-showmanymoveone .cloneditem-2,

.carousel-showmanymoveone .cloneditem-3 {

    display: none;

}

@media all and (min-width: 768px) {

    .carousel-showmanymoveone .carousel-inner > .active.left,

    .carousel-showmanymoveone .carousel-inner > .prev {

        left: -50%;

    }

    .carousel-showmanymoveone .carousel-inner > .active.right,

    .carousel-showmanymoveone .carousel-inner > .next {

        left: 50%;

    }

    .carousel-showmanymoveone .carousel-inner > .left,

    .carousel-showmanymoveone .carousel-inner > .prev.right,

    .carousel-showmanymoveone .carousel-inner > .active {

        left: 0;

    }

    .carousel-showmanymoveone .carousel-inner .cloneditem-1 {

        display: block;

    }

}

@media all and (min-width: 768px) and (transform-3d), all and (min-width: 768px) and (-webkit-transform-3d) {

    .carousel-showmanymoveone .carousel-inner > .item.active.right,

    .carousel-showmanymoveone .carousel-inner > .item.next {

        -webkit-transform: translate3d(50%, 0, 0);

        transform: translate3d(50%, 0, 0);

        left: 0;

    }

    .carousel-showmanymoveone .carousel-inner > .item.active.left,

    .carousel-showmanymoveone .carousel-inner > .item.prev {

        -webkit-transform: translate3d(-50%, 0, 0);

        transform: translate3d(-50%, 0, 0);

        left: 0;

    }

    .carousel-showmanymoveone .carousel-inner > .item.left,

    .carousel-showmanymoveone .carousel-inner > .item.prev.right,

    .carousel-showmanymoveone .carousel-inner > .item.active {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        left: 0;

    }

}

@media all and (min-width: 992px) {

    .carousel-showmanymoveone .carousel-inner > .active.left,

    .carousel-showmanymoveone .carousel-inner > .prev {

        left: -25%;

    }

    .carousel-showmanymoveone .carousel-inner > .active.right,

    .carousel-showmanymoveone .carousel-inner > .next {

        left: 25%;

    }

    .carousel-showmanymoveone .carousel-inner > .left,

    .carousel-showmanymoveone .carousel-inner > .prev.right,

    .carousel-showmanymoveone .carousel-inner > .active {

        left: 0;

    }

    .carousel-showmanymoveone .carousel-inner .cloneditem-2,

    .carousel-showmanymoveone .carousel-inner .cloneditem-3 {

        display: block;

    }

}

@media all and (min-width: 992px) and (transform-3d), all and (min-width: 992px) and (-webkit-transform-3d) {

    .carousel-showmanymoveone .carousel-inner > .item.active.right,

    .carousel-showmanymoveone .carousel-inner > .item.next {

        -webkit-transform: translate3d(25%, 0, 0);

        transform: translate3d(25%, 0, 0);

        left: 0;

    }

    .carousel-showmanymoveone .carousel-inner > .item.active.left,

    .carousel-showmanymoveone .carousel-inner > .item.prev {

        -webkit-transform: translate3d(-25%, 0, 0);

        transform: translate3d(-25%, 0, 0);

        left: 0;

    }

    .carousel-showmanymoveone .carousel-inner > .item.left,

    .carousel-showmanymoveone .carousel-inner > .item.prev.right,

    .carousel-showmanymoveone .carousel-inner > .item.active {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        left: 0;

    }

}

.builds-section-title {

    margin-bottom: 1rem;

    margin-top: 1rem;

}

.builds-section-title:first-child {

    margin-top: 0;

}

.build-box {

    background: #eee;

    border: 1px solid var(--usercp-section-bg-color);

    padding: 2rem;

    border-radius: .5rem;

    margin-bottom: 32px;

}

.build-box-title {

    font-size: 20px;

    font-weight: bold;

    margin-bottom: 1rem;

}

.builds-likes-box {

    padding: 6px 12px;

    text-align: right;

    background-color: var(--link-text-color);

    border: 1px solid rgba(37, 109, 156, 1.0);

    outline: none;

    width: auto;

}

.builds-likes {

    width: fit-content;

    color: #fff;

}

.builds-likes * {

    color: #fff;

}

.builds-likes .fa-thumbs-up {

    margin-right: 1rem;

}

.builds-view-build * {

    color: #fff;

}

.builds-view-build .fa-search {

    margin-right: 1rem;

}

.builds-delete-build * {

    color: #fff;

}

.builds-delete-build .fa-trash {

    margin-right: 1rem;

}

.builds-footer {

    margin-top: 1rem;

}

.carousel-showmanymoveone .carousel-control.left, .carousel-showmanymoveone .carousel-control.right {

    opacity: 0.1;

}

.carousel-showmanymoveone .carousel-control.left:hover, .carousel-showmanymoveone .carousel-control.right:hover {

    opacity: 1;

}

.builds-stats-badge {

    padding: 1rem 3rem;

    background-color: var(--link-text-color);

    margin-bottom: .25rem;

}

.builds-stats-title {

    font-size: 12px;

    color: #ccc;

    margin-bottom: 1rem;

}

.builds-stats-value {

    font-size: 30px;

    color: #fff;

}

.builds-separator {

    margin-top: 2rem;

}

.build-img {

    width: 100%;

    position: absolute;

}

.modalVariablePoints:target {

    opacity: 1;

    pointer-events: auto;

}

.modalVariablePoints {

    position: fixed;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background: rgba(0, 0, 0, 0.5);

    z-index: 99999;

    opacity: 0;

    -webkit-transition: opacity 400ms ease-in;

    -moz-transition: opacity 400ms ease-in;

    transition: opacity 400ms ease-in;

    pointer-events: none;

}

.modalVariablePoints > div {

    width: 740px;

    height: 371px;

    background: transparent url(../../templates/assets/skill-tree/points.png) no-repeat top center;

    position: relative;

    margin: 8% auto;

    padding: 5px 20px 13px 20px;

    border-radius: 10px;

    text-align: center;

}

.modalVariablePoints > div table .title {

    font-size: 12px;

    color: #fbc919;

    font-weight: normal;

    margin: 1rem;

}

.modalVariablePoints > div table tr td {

    vertical-align: top;

    text-align: center;

    font-size: 12px;

    color: #b2b2b2;

}

.modalVariablePointsClose {

    background: #606061;

    color: #FFFFFF;

    line-height: 25px;

    position: absolute;

    right: calc(50% - 35px);

    text-align: center;

    bottom: 16px;

    width: 71px;

    height: 32px;

    background: transparent url(../../templates/assets/skill-tree/cancel.png) no-repeat top center;

    text-decoration: none;

    -moz-box-shadow: 1px 1px 3px #000;

    -webkit-box-shadow: 1px 1px 3px #000;

    box-shadow: 1px 1px 3px #000;

    cursor: pointer;

}

.modalVariablePoints > div table tr td.division {

    width: 25%;

    text-align: center !important;

}

.row.build-desc {

    margin-top: 2rem;

}

.skill-tree-4th-table td {

    padding: 0;

}

.builds-add-points-icons {

    height: 94px;

}

.mucms-lootbox-free-ticket-wrapper {

    margin-top: 3rem;

}

.mucms-lootbox-free-ticket-box {

    padding: 5rem;

    background-color: var(--usercp-section-bg-color);

}

.mucms-lootbox-free-ticket-box * {

    color: #fff;

}

.mucms-lootbox-free-ticket-title {

    font-size: 26px;

}

.mucms-lootbox-free-ticket-info {

    margin-top: 1rem;

}

.mucms-lootbox-free-ticket-star {

    color: #ff0000;

}

.mucms-lootbox-free-ticket-desc {

    font-size: 70%;

    margin-top: 2rem;

}

.mucms-mysterybox-container {

    position:relative;

    display:flex;

    justify-content:center;

    width:100%;

    margin:0 auto;

    overflow:hidden;

}

.mucms-mysterybox-container .selector-top {

    width: 0;

    height: 0;

    border-left: 20px solid transparent;

    border-right: 20px solid transparent;

    border-top: 20px solid var(--link-text-color);

    position:absolute;

    z-index:2;

}

.mucms-mysterybox-container .selector-bot {

    width: 0;

    height: 0;

    border-left: 20px solid transparent;

    border-right: 20px solid transparent;

    border-bottom: 20px solid var(--link-text-color);

    position:absolute;

    z-index:2;

    bottom: 0;

}

.mucms-mysterybox-container .mysterybox-wheel {

    display:flex;

}

.mucms-mysterybox-container .mysterybox-wheel .mysterybox-row {

    display:flex;

}

.mucms-mysterybox-container .mysterybox-wheel .mysterybox-row .card img {

    max-width: 128px;

    max-height: 128px;

}

.lootbox-rarity-4 {

    background: var(--usercp-section-bg-color);

    -webkit-box-shadow: inset 0px 0px 40px 0px #e1bd00;

    -moz-box-shadow: inset 0px 0px 40px 0px #e1bd00;

    box-shadow: inset 0px 0px 40px 0px #e1bd00;

}

.lootbox-rarity-3 {

    background: var(--usercp-section-bg-color);

    -webkit-box-shadow: inset 0px 0px 40px 0px #c634ff;

    -moz-box-shadow: inset 0px 0px 40px 0px #c634ff;

    box-shadow: inset 0px 0px 40px 0px #c634ff;

}

.lootbox-rarity-2 {

    background: var(--usercp-section-bg-color);

    -webkit-box-shadow: inset 0px 0px 40px 0px #2d8aff;

    -moz-box-shadow: inset 0px 0px 40px 0px #2d8aff;

    box-shadow: inset 0px 0px 40px 0px #2d8aff;

}

.lootbox-rarity-1 {

    background: var(--usercp-section-bg-color);

    -webkit-box-shadow: inset 0px 0px 40px 0px #2d9800;

    -moz-box-shadow: inset 0px 0px 40px 0px #2d9800;

    box-shadow: inset 0px 0px 40px 0px #2d9800;

}



.lootbox-rewards-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Cardurile sunt centrate pe orizontală */
    gap: 3px; /* Spațiu fix între carduri */
    padding: 2rem;
    background: #0f0f0f; /* Fundal întunecat */
    border-radius: 20px; /* Colțuri rotunjite */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7); /* Umbră profundă */
}

.lootbox-reward-box {
    background: linear-gradient(135deg, #282828, #383838); /* Fundal gradient subtil */
    border-radius: 16px; /* Colțuri rotunjite */
    text-align: center;
    padding: 1.5rem;
    width: 180px; /* Dimensiune constantă */
    height: 220px; /* Dimensiune fixă pentru consistență */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5); /* Umbră subtilă */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lootbox-reward-box:hover {
    transform: translateY(-10px); /* Ridicare pe hover */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.7); /* Umbră intensificată pe hover */
}

.lootbox-reward-box img {
    max-width: 80px; /* Dimensiune constantă a imaginilor */
    margin-bottom: 1rem;
}

.lootbox-reward {
    font-size: 1.2rem;
    font-weight: bold;
    color: #ffffff; /* Text alb clar */
    text-transform: uppercase; /* Text cu majuscule */
}


.lootbox-rewards-title {

    margin-top: 3rem;

    font-size: 20px;

}
.lootbox-case-item {
    display: flex;
    flex-direction: column; /* Aranjare verticală a conținutului */
    align-items: center; /* Centrează pe orizontală */
    justify-content: center; /* Centrează pe verticală */
    width: 180px; /* Lățime fixă */
    height: 220px; /* Înălțime fixă */
    margin: 3px; /* Spațiu între carduri */
    padding: 1rem; /* Spațiu interior */
    border-radius: 10px; /* Colțuri rotunjite */
    background: linear-gradient(145deg, #1a1a1a, #0b0c10); /* Fundal gradient */
    border: 3px solid transparent; /* Margine pentru raritate (va fi colorată) */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5); /* Umbră subtilă */
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.lootbox-case-item:hover {
    transform: translateY(-5px); /* Ridicare pe hover */
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.7); /* Intensifică umbra */
}

/* Rarități dinamice */
.lootbox-rarity-1 {
    border-color: #2d9800; /* Verde */
}

.lootbox-rarity-2 {
    border-color: #2d8aff; /* Albastru */
}

.lootbox-rarity-3 {
    border-color: #c634ff; /* Mov */
}

.lootbox-rarity-4 {
    border-color: #e1bd00; /* Auriu */
}

.lootbox-rarity-5 {
    border-color: #ff0000; /* Roșu */
}

.lootbox-content img {
    max-width: 80px; /* Dimensiunea imaginii */
    margin-bottom: 10px; /* Spațiu între imagine și text */
}

.lootbox-content .name {
    font-size: 1rem; /* Dimensiune text */
    font-weight: bold; /* Text îngroșat */
    color: #ffffff; /* Alb */
    text-align: center; /* Text centrat */
    text-transform: uppercase; /* Majuscule */
}

.lootbox-button {

    width: 100%;

    font-size: 20px;

    margin-top: 1rem;

}
.mucms-mysterybox-container .selector-top,
.mucms-mysterybox-container .selector-bot {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.mucms-mysterybox-container .selector-top {
    top: -10px;
    width: 0;
    height: 0;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-top: 40px solid #ffc700;
    animation: pulseGlow 1.5s infinite ease-in-out;
}

.mucms-mysterybox-container .selector-bot {
    bottom: -10px;
    width: 0;
    height: 0;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 40px solid #ffc700;
    animation: pulseGlow 1.5s infinite ease-in-out;
}
.mucms-mysterybox-container .mysterybox-wheel .mysterybox-row .card {

    height:200px;

    width:200px;

    margin:3px;

    display:flex;

    flex-flow: wrap;

    align-items:center;

    justify-content:center;

    color:white;

    font-size:1.5em;

    padding: 2rem 0;

}

.mucms-mysterybox-container .mysterybox-wheel .mysterybox-row .card div {

    color: white;

    font-size: 16px;

}