/* WebEngine template bundle — generated by scripts/build-css-bundle.js */

/* --- style.css --- */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
}

/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    width: 100%;
    background: url(../img/fon-bg-top.jpg) center top no-repeat, url(../img/fon-bg-bottom.jpg) center bottom no-repeat, url(../img/fon-bg-repeat.jpg) center repeat-y;
    background-color: #eaecff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: #230707;
    line-height: 1;
    min-height: 100vh;
    overflow-x: hidden;
}

a {
    transition: all 0.3s ease;
    color: #bf5252;
    text-decoration: none;
}

p {
    margin-bottom: 15px;
}

h1,
h2,
h3 {
    color: #230707;
    margin-bottom: 20px;
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: 600;
}

h1 {
    font-size: 20px;
}

h2 {
    font-size: 18px;
}

h3 {
    font-size: 16px;
}

caption {
    margin-bottom: 15px;
}

input,
textarea {
    background: url(../img/red-light-bg.jpg);
    border-radius: 30px;
    border: 1px solid #9b666e;
    color: #fff;
    padding: 8px 18px;
    position: relative;
}

button,
.button {
    transition: all 0.3s ease;
    cursor: pointer;
    background: #b4a814;
    border-radius: 5px;
    border: none;
    color: #fff;
    font-size: 11px;
    position: relative;
    z-index: 1;
    padding: 12px 28px;
    text-transform: uppercase;
    text-decoration: none !important;
    box-shadow: 0em 0.5em 10px rgba(31, 29, 29, 0.7);
}

button:hover,
.button:hover {
    background: #c1b51c;
}

/*
.button-border:after {
    content: "";
    border-radius: 8px;
    border: 3px solid rgba(80, 72, 57, 0.5);
    left: -3px;
    top: -3px;
    height: 100%;
    width: 100%;
    position: absolute;
}
*/

:focus {
    outline: none;
}

::-webkit-input-placeholder {
    color: #c37289;
}

::-moz-placeholder {
    color: #c37289;
}

:-moz-placeholder {
    color: #c37289;
}

:-ms-input-placeholder {
    color: #c37289;
}

.wrapper {
    width: 1200px;
    margin: 0 auto;
    position: relative;
}

.web-container {
    min-height: 1300px;
    display: flex;
    position: relative;
}

.flex {
    display: flex;
}

.flex-s {
    display: flex;
    justify-content: space-between;
}

.flex-s-c {
    display: flex;
    justify-content: space-between;
}

.flex-c-c {
    display: flex;
    justify-content: center;
    align-items: center;
}

.top-panel {
    width: 100%;
    position: absolute;
    top: 0px;
    background: url(../img/top-fon-menu.jpg) repeat-x;
    border-bottom: 2px solid #625c0d;
    z-index: 10;
}

.menu li a:before {
    content: "";
    position: absolute;
    background: url(../img/point-menu.png) no-repeat;
    height: 23px;
    width: 4px;
    left: 0px;
    top: 22px;
}

.menu li:first-child a:before {
    display: none;
}

.menu {
    height: 66px;
}

.menu li {
    margin: 0px 8px;
}

.menu a {
    color: #e9dd46;
    font-size: 14px;
    text-transform: uppercase;
    padding: 0px 26px;
    font-weight: 600;
    display: block;
    height: 66px;
    line-height: 66px;
    position: relative;
}

.menu a:after {
    content: "";
    transition: 0.3s;
    height: 0px;
    width: 0px;
}

.menu a:hover {
    color: #fbf6b6;
}

.menu a:hover:after {
    content: "";
    height: 2px;
    width: 100%;
    bottom: -2px;
    left: 0px;
    position: absolute;
    background: #fbf6b6;
}

.menu .active a {
    color: #fbf6b6;
    border-bottom: 2px solid #fbf6b6;
    bottom: -2px;
}

.languages a {
    margin-left: 10px;
}

.languages a:hover {
    -webkit-filter: brightness(140%);
    filter: brightness(140%);
    margin-left: 10px;
}

/* Header

-----------------------------------------------------------------------------*/

.header {
    height: 551px;
    position: relative;
}

.logo {
    display: block;
    position: absolute;
    margin-left: -50px;
    bottom: 5px;
    z-index: 2;
    transition: 0.3s;
}

.logo:hover {
    -webkit-filter: brightness(120%);
    filter: brightness(120%);
}

.countdown-block {
    position: absolute;
    bottom: 74px;
    text-align: center;
    width: 100%;
}

.countdown-block h3 {
    color: #5a2824;
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: bold;
}

.countdown li {
    margin: 0px 7px;
    position: relative;
}

.countdown li:after {
    content: ":";
    position: absolute;
    right: -12px;
    top: 8px;
    font-size: 38px;
    color: #3b0c16;
}

.countdown li:first-child:after {
    display: none;
}

.countdown li:last-child:after {
    display: none;
}

.countdown span {
    display: block;
    background: rgba(120, 40, 62, 0.5);
    border-radius: 6px;
    height: 60px;
    width: 60px;
    font-size: 32px;
    color: #fff;
    text-align: center;
    line-height: 60px;
    margin-bottom: 7px;
}

.countdown p {
    font-size: 12px;
    margin-bottom: 0px;
    font-weight: bold;
    color: #5a2823;
    text-transform: uppercase;
}

.leaves-left-1 {
    background: url(../img/leaves-left-1.png) no-repeat;
    width: 120px;
    height: 133px;
    position: absolute;
    left: 50px;
    top: -300px;
    animation: leaves-left-1 12s infinite linear;
}

@keyframes leaves-left-1 {
    0% {
        top: -300px;
    }
    90% {
        opacity: 1;
    }
    100% {
        top: 750px;
        transform: rotate(-200deg);
        left: -250px;
        opacity: 0;
    }
}

.leaves-left-2 {
    background: url(../img/leaves-left-2.png) no-repeat;
    width: 160px;
    height: 72px;
    position: absolute;
    left: 50px;
    top: -200px;
    animation: leaves-left-2 12s infinite linear;
    animation-delay: 6s;
}

@keyframes leaves-left-2 {
    0% {
        top: -200px;
    }
    90% {
        opacity: 1;
    }
    100% {
        top: 750px;
        opacity: 1;
        transform: rotate(-150deg);
        left: -250px;
        opacity: 0;
    }
}

.leaves-left-3 {
    background: url(../img/leaves-left-3.png) no-repeat;
    width: 120px;
    height: 88px;
    position: absolute;
    left: 50px;
    top: -200px;
    animation: leaves-left-3 12s infinite linear;
    animation-delay: 9s;
}

@keyframes leaves-left-3 {
    0% {
        top: -200px;
    }
    90% {
        opacity: 1;
    }
    100% {
        top: 750px;
        transform: rotate(-250deg);
        left: -250px;
        opacity: 0;
    }
}

.leaves-left-4 {
    background: url(../img/leaves-left-4.png) no-repeat;
    width: 120px;
    height: 106px;
    position: absolute;
    left: 50px;
    top: -300px;
    animation: leaves-left-4 12s infinite linear;
    animation-delay: 3s;
}

@keyframes leaves-left-4 {
    0% {
        top: -250px;
    }
    90% {
        opacity: 1;
    }
    100% {
        top: 750px;
        transform: rotate(-150deg);
        left: -250px;
        opacity: 0;
    }
}

.leaves-left-5 {
    background: url(../img/leaves-left-5.png) no-repeat;
    width: 170px;
    height: 108px;
    position: absolute;
    left: 50px;
    top: -300px;
    animation: leaves-left-5 12s infinite linear;
    animation-delay: 7s;
}

@keyframes leaves-left-5 {
    0% {
        top: -250px;
    }
    90% {
        opacity: 1;
    }
    100% {
        top: 750px;
        transform: rotate(-250deg);
        left: -250px;
        opacity: 0;
    }
}

.leaves-right-1 {
    background: url(../img/leaves-right-1.png) no-repeat;
    width: 200px;
    height: 115px;
    position: absolute;
    right: 200px;
    top: -250px;
    animation: leaves-right-1 12s infinite linear;
    animation-delay: 1s;
}

@keyframes leaves-right-1 {
    0% {
        top: -250px;
    }
    90% {
        transform: rotate(-200deg);
        opacity: 1;
    }
    100% {
        top: 850px;
        transform: rotate(-200deg);
        right: -250px;
        opacity: 0;
    }
}

.leaves-right-2 {
    background: url(../img/leaves-right-2.png) no-repeat;
    width: 140px;
    height: 55px;
    position: absolute;
    right: 200px;
    top: -250px;
    animation: leaves-right-2 12s infinite linear;
    animation-delay: 3s;
}

@keyframes leaves-right-2 {
    0% {
        top: -250px;
    }
    90% {
        transform: rotate(-100deg);
        opacity: 1;
    }
    100% {
        top: 850px;
        transform: rotate(-120deg);
        right: -250px;
        opacity: 0;
    }
}

.leaves-right-3 {
    background: url(../img/leaves-right-3.png) no-repeat;
    width: 160px;
    height: 74px;
    position: absolute;
    right: 100px;
    top: -250px;
    animation: leaves-right-3 12s infinite linear;
    animation-delay: 6s;
}

@keyframes leaves-right-3 {
    0% {
        top: -250px;
    }
    90% {
        transform: rotate(150deg);
        opacity: 1;
    }
    100% {
        top: 850px;
        transform: rotate(170deg);
        right: -250px;
        opacity: 0;
    }
}

.leaves-right-4 {
    background: url(../img/leaves-right-4.png) no-repeat;
    width: 59px;
    height: 110px;
    position: absolute;
    right: 200px;
    top: -250px;
    animation: leaves-right-4 12s infinite linear;
    animation-delay: 9s;
}

@keyframes leaves-right-4 {
    0% {
        top: -250px;
    }
    90% {
        transform: rotate(150deg);
        opacity: 1;
    }
    100% {
        top: 850px;
        transform: rotate(170deg);
        right: -250px;
        opacity: 0;
    }
}

.leaves-right-5 {
    background: url(../img/leaves-right-5.png) no-repeat;
    width: 110px;
    height: 65px;
    position: absolute;
    right: 250px;
    top: -250px;
    animation: leaves-right-5 12s infinite linear;
    animation-delay: 2s;
}

@keyframes leaves-right-5 {
    0% {
        top: -250px;
    }
    90% {
        transform: rotate(150deg);
        opacity: 1;
    }
    100% {
        top: 850px;
        transform: rotate(170deg);
        right: -250px;
        opacity: 0;
    }
}

/* Left Sidebar

-----------------------------------------------------------------------------*/

.download-block a {
    background: url(../img/download-button.jpg) center;
    height: 90px;
    font-size: 20px;
    color: #fff;
}

.download-block a:hover {
    -webkit-filter: brightness(120%);
    filter: brightness(120%);
}

.download-block b {
    text-shadow: 1px 1px 1px rgba(191, 120, 35, 1);
}

.download-block a span {
    padding-left: 50px;
}

.download-block a b {
    font-weight: 400;
    display: block;
    color: #552e07;
    font-size: 12px;
    margin-top: 5px;
}

.widget {
    padding: 25px;
    padding-bottom: 40px;
    padding-top: 31px;
    min-height: 305px;
}

.widget-title {
    text-transform: uppercase;
    font-weight: 600;
    color: #ffde00;
    font-size: 14px;
    margin-bottom: 28px;
    position: relative;
    text-shadow: 1px 3px 3px rgba(25, 23, 23, 0.85);
}

.widget-title a:hover {
    text-decoration: underline;
}

.widget-title span {
    display: block;
    margin-top: 9px;
}

.widget-title:after {
    content: "";
    background: url(../img/widget-title-bg.png) center right no-repeat;
    width: 117px;
    height: 69px;
    position: absolute;
    right: -22px;
    top: -26px;
}

.widget-title span,
.widget-title a {
    text-transform: none;
    font-size: 12px;
    color: #b4a814;
    font-weight: 400;
}

.l-input {
    width: 235px;
    height: 44px;
    border: none;
    padding: 7px 60px 15px 50px;
    position: relative;
}

.l-input input {
    background: none;
    border: none;
    padding: 5px 15px;
    width: 170px;
}

.teste {
    background: url(../img/red-light-bg.jpg);
    border-radius: 30px;
    color: #fff;
    padding: 8px 18px;
    position: relative;
    border: 1px solid #9b666e;
}

.b-input {
    width: 210px;
    height: 33px;
    border: none;
    padding: 7px 60px 15px 10px;
    font-size: 10px;
    position: relative;
}

.b-input input {
    background: none;
    border: none;
    padding: 5px 15px;
    width: 270px;
}

.select-hidden {
    display: none;
    visibility: hidden;
}

.select {
    cursor: pointer;
    display: block;
    position: relative;
    width: 170px;
    height: 30px;
}

.select-styled {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: all 0.2s ease-in;
    color: #fff;
    padding: 7px 15px;
    width: 170px;
}

.select-options {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: -50px;
    z-index: 999;
    margin: 0;
    padding: 0;
    list-style: none;
    background: linear-gradient(to bottom, #2a1c14, #573b2b);
    border: 1px solid #6a4411;
    width: 235px;
}

.select-options li {
    margin: 0;
    list-style: none !important;
    margin: 0px !important;
    padding: 10px 10px;
    border-bottom: 1px solid #744906;
    -moz-transition: all 0.15s ease-in;
    -o-transition: all 0.15s ease-in;
    -webkit-transition: all 0.15s ease-in;
    transition: all 0.15s ease-in;
    color: #fff;
}

.select-options li:hover {
    background: rgba(255, 255, 255, 0.1);
}

.select-options li[rel="hide"] {
    display: none;
}

.login-block p {
    margin-bottom: 5px;
}

.login-block a:hover {
    text-decoration: underline;
}

.login-block .lost a {
    color: #fff;
    font-size: 12px;
    line-height: 18px;
}

.login {
    background: url(../img/login-input.png) no-repeat;
}

.text-input {
    background: url(../img/text-input.png) no-repeat;
}

.pass {
    background: url(../img/password-input.png) no-repeat;
}

.select-s {
    background: url(../img/select_server.png) no-repeat;
}

.input-text-site {
    border-radius: 25px;
    background: url(../img/red-light-bg.jpg);
    max-width: 206px;
    padding-bottom: 2px;
    border: 1px solid #96656e;
}

.select-s-page {
    background: url(../img/select_server-page.png) no-repeat;
}

.buttons {
    margin-top: 10px;
}

.top-block {
    width: 100%;
    color: #ffffff;
}

.top-block span {
    display: block;
    padding-bottom: 1px;
}

.top-block .top-number {
    width: 35px;
}

.top-block .top-flag {
    width: 25px;
    padding-top: 2px;
}

.top-block .top-name {
    width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-block .top-lvl {
    width: 55px;
}

.top-block .top-lvl sup {
    font-size: 10px;
    color: #ff0000;
}

.top-list {
    height: 36px;
    display: flex;
    align-items: center;
    padding: 0px 10px;
    font-size: 12px;
    border-bottom: 1px dashed #62441b;
    transition: 0.3s;
}

.top-list a {
    color: #fff;
}

.top-list:hover {
    background: url(../img/fon-hover.jpg) repeat;
    margin: -1px -30px 0px -30px;
    padding: 0px 28px 0px 28px;
    box-shadow: 0em 0.5em 10px rgba(0, 0, 0, 0.5);
    height: 37px;
    color: #ffd562;
    position: relative;
    z-index: 5;
}

.top-list:hover a {
    color: #ffd562;
}

.top-list-two {
    height: 36px;
    display: flex;
    align-items: center;
    padding: 0px 10px;
    font-size: 12px;
    border-bottom: 1px dashed #62441b;
    transition: 0.3s;
}

.top-list-two a {
    color: #222;
}

.top-list-two:hover {
    background: url(../img/fon-hover.jpg) repeat;
    margin: -1px -30px 0px -30px;
    padding: 0px 28px 0px 28px;
    box-shadow: 0em 0.5em 10px rgba(0, 0, 0, 0.5);
    height: 37px;
    color: #ffd562;
    position: relative;
    z-index: 5;
}

.top-list-two:hover a {
    color: #ffd562;
}

.top-title {
    height: 37px;
    display: flex;
    align-items: center;
    padding: 0px 10px;
    background: #1a100a;
    font-size: 13px;
    border-bottom: 1px solid #412a0b;
}

.no-reset {
    text-align: right;
    margin-top: 15px;
}

.no-reset a {
    color: #ffd562;
    font-size: 12px;
}

.gallery {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.gallery li {
    position: relative;
}

.gallery li img {
    outline: 1px solid rgba(255, 255, 255, 0.3);
    outline-offset: -1px;
    width: 113px;
    height: 75px;
}

.gallery li:first-child {
    margin-bottom: 8px;
}

.gallery li:first-child img {
    width: 235px;
    height: 145px;
    outline: 1px solid #ffffff;
}

.gallery li:first-child a {
    width: 235px;
    height: 145px;
}

.gallery li:first-child a:after {
    content: "";
    background-color: rgba(0, 0, 0, 0.4);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0px 50px 80px 5px rgba(0, 0, 0, 0.7);
}

.gallery li:first-child a:before {
    content: "";
    background: url(../img/play-icon.png) no-repeat;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -23px;
    margin-top: -20px;
    width: 46px;
    height: 46px;
    z-index: 2;
}

.gallery li a {
    display: block;
    cursor: pointer;
}

/* Middle

-----------------------------------------------------------------------------*/

.content {
    width: 630px;
    line-height: 1.3;
    background: url(../img/fon-all-news-bg.jpg) repeat-y;
    position: relative;
}

.content a {
    text-decoration: underline;
}

.content-page {
    background: url(../img/block-top-bg.jpg) right top no-repeat;
    min-height: 50px;
    padding: 20px;
    line-height: 1.6;
}

.content-page img {
    max-width: 590px;
}

.content-page ul {
    padding-left: 20px;
    margin-bottom: 20px;
}

.content-page ul li {
    list-style: circle;
    margin: 5px 0px;
}

.sidebar {
    width: 285px;
    padding-top: 58px;
}

.slider-effect {
    content: "";
    position: absolute;
    width: 136px;
    height: 104px;
    background: url(../img/slider-effect.png) no-repeat;
    top: 526px;
    left: 246px;
    z-index: 1;
}

.slider {
    overflow: hidden;
    position: relative;
    box-shadow: inset 0 0 100px;
    width: 630px;
    height: 280px;
}

.slider .slides {
    position: relative;
    transition: 1s;
}

.slider .slides .slide {
    float: left;
    display: block;
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    width: 630px;
    height: 280px;
    border: 1px solid #373022;
}

.slider .slides .slide:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    box-shadow: inset 0 0 80px;
}

.slider .slides .slide-info {
    position: relative;
    padding: 40px 35px 35px 35px;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.slider .slides .slide-info h2 {
    color: #fff;
    font-size: 24px;
    margin-bottom: 25px;
}

.slider .slides .slide-info .slide-text {
    background: linear-gradient(to bottom, rgba(36, 32, 27, 0.8) 70%, rgba(0, 0, 0, 0));
    color: #fff;
    line-height: 1.7;
    padding: 15px 35px;
    width: 470px;
    margin-left: -35px;
    margin-bottom: 15px;
    position: relative;
}

.slider .slides .slide-info .slide-text:before {
    content: "";
    position: absolute;
    height: 2px;
    width: 100%;
    background: #ffc500;
    top: -2px;
    left: 0;
}

.slider .slides .slide-info .slide-i {
    width: 100%;
}

.slider .slides .slide-info p {
    margin-bottom: 0px;
}

.slider .slides .slide-info .slide-date {
    font-size: 14px;
    color: #ffcc00;
    font-family: Candara, Arial, sans-serif;
}

.slider .slides .slide-info .slide-date span {
    color: #ffcc00;
    font-size: 18px;
}

.slider .slides .active .slide-info {
    transition: all 2s ease;
    opacity: 1;
}

.slider .arrows {
    position: absolute;
    height: 33px;
    width: 33px;
    top: 125px;
    z-index: 10;
    cursor: pointer;
    opacity: 0;
}

.slider .next {
    background: url(../img/arrow-right.png) no-repeat;
    right: 1px;
}

.slider .prev {
    background: url(../img/arrow-left.png) no-repeat;
    left: 1px;
}

.slider .navigation {
    position: absolute;
    bottom: 20px;
    left: 0px;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.slider .navigation .dot {
    width: 2px;
    height: 2px;
    cursor: pointer;
    background-color: #fff;
    margin: 0px 10px;
}

.slider:hover .next,
.slider:hover .prev {
    opacity: 1;
    transition: all 0.7s ease;
}

.slider .navigation .active {
    border-radius: 50%;
    width: 7px;
    height: 7px;
    margin: 0px 5px;
    background-color: #ffc103;
    position: relative;
}

.slider .navigation .active:after {
    content: "";
    position: absolute;
    left: -2px;
    top: -2px;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    padding: 1px;
    border: 1px solid rgba(240, 71, 71, 0.3);
    box-shadow: 0px 0px 8px 0px rgba(240, 71, 71, 0.6);
}

.content-title {
    background: url(../img/content-title-bg.png) no-repeat;
    height: 74px;
    position: relative;
    z-index: 2;
    padding: 19px 39px 0px 39px;
}

.content-title a {
    color: #fff;
    font-size: 12px;
}

.content-title h1,
.content-title h2,
.content-title h3 {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 0px;
    font-weight: 400;
}

.block {
    min-height: 110px;
}

.news-block {
    /*margin-top: -20px;*/
}

.news .news-img img {
    display: block;
}

.news .news-info {
    width: 100%;
    padding: 24px 20px;
}

.news .news-info p {
    line-height: 1.6;
    margin-left: -15px;
    height: 120px;
    overflow: hidden;
}

.news-date-page {
    font-family: Candara, Arial, sans-serif;
    color: #b4a814;
    ;
    font-size: 14px;
    padding-top: 20px;
}

.news-date-page span {
    color: #736c10;
}

.news-date {
    font-family: Candara, Arial, sans-serif;
    color: #903c3c;
    font-size: 14px;
}

.news-date {
    color: #b4a814;
    margin-left: -15px;
    padding-top: 14px;
}

.news-i .button {
    border: 3px solid rgba(247, 230, 200, 0.27);
    box-shadow: 0em 0.5em 10px rgba(122, 122, 122, 0.7);
}

.news-date span {
    color: #736c10;
}

.top-news-block .news-info {
    position: relative;
    z-index: 2;
}

.top-news-block .news-info h2 {
    border-bottom: 1px solid #612e0c;
    margin: 6px -20px 29px -15px;
    padding: 0px 20px 20px 0px;
}

.top-news {
    background-position: left;
    background-repeat: no-repeat;
    height: 304px;
    padding-left: 265px;
    position: relative;
}

.top-news:after {
    content: "";
    position: absolute;
    background: url(../img/fon-news-bg.png) no-repeat;
    width: 630px;
    height: 304px;
    left: 0px;
    top: 0px;
    z-index: 1;
}

.pagination {
    padding-top: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 5;
}

.page-numbers {
    display: block;
    width: 30px;
    height: 30px;
    position: relative;
    text-align: center;
    line-height: 30px;
    border-radius: 5px;
    border: 1px solid #d3c9b1;
    color: #8d7951;
    text-decoration: none !important;
    font-size: 12px;
    margin: 0px 7px;
}

.page-numbers.active {
    background: radial-gradient(#d3c846, #b4a814);
    color: #fff;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
}

.page-numbers:hover {
    background: radial-gradient(#e9e08b, #d1c876);
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2), inset 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
    color: #fff;
}

.page-numbers.prev,
.page-numbers.next {
    background: radial-gradient(#d3c846, #b4a814);
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
    font-size: 0px;
}

.page-numbers.prev:hover,
.page-numbers.next:hover {
    background: radial-gradient(#e9e08b, #d1c876);
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
}

.page-numbers.prev {
    margin: 0px 25px 0px 0px;
}

.page-numbers.next {
    margin: 0px 0px 0px 25px;
}

.page-numbers.prev:after {
    content: "";
    position: absolute;
    background: url(../img/prev-p.png) no-repeat;
    width: 12px;
    height: 16px;
    margin-left: -8px;
    margin-top: -7px;
    left: 50%;
    top: 50%;
    z-index: 2;
}

.page-numbers.prev:hover:after {
    background: url(../img/prev-p.png) no-repeat;
}

.page-numbers.next:after {
    content: "";
    position: absolute;
    background: url(../img/next-p.png) no-repeat;
    width: 12px;
    height: 16px;
    margin-right: -8px;
    margin-top: -7px;
    right: 50%;
    top: 50%;
}

.page-numbers.next:hover:after {
    background: url(../img/next-p.png) no-repeat;
}

/* Right Sidebar

-----------------------------------------------------------------------------*/

.status-block {
    position: relative;
    background: url(../img/status-bg.jpg) no-repeat;
    height: 120px;
    padding-left: 90px;
}

.status-block:after {
    content: "";
    position: absolute;
    background: url(../img/img-server-left.png) no-repeat;
    width: 106px;
    height: 154px;
    left: 0px;
    top: -16px;
}

.status-block:before {
    content: "";
    position: absolute;
    background: url(../img/img-server-right.png) no-repeat;
    width: 128px;
    height: 91px;
    right: -20px;
    top: -16px;
}

.server {
    width: 160px;
    font-size: 12px;
}

.server .server-name {
    color: #ffde00;
}

.server .status-online {
    color: #58c526;
    float: right;
}

.server .status-online b {
    font-weight: 400;
    color: #58c526;
}

.forest-progress-bar {
    height: 16px;
    margin: 9px 0px 6px 0px;
    position: relative;
}

.forest-progress-bar:after {
    content: "";
    position: absolute;
    background-color: #1a100a;
    width: 100%;
    height: 4px;
    top: 7px;
    left: 0px;
}

.forest-progress-bar span {
    height: 16px;
    background: url(../img/line-server.png) repeat-x;
    display: block;
    position: relative;
    z-index: 1;
}

.desc {
    color: #a79376;
    font-size: 11px;
    text-decoration: underline;
}

.desc:hover {
    text-decoration: none;
	color: #fff !important;
}

.events {
    line-height: 1.2;
}

.events li {
    border-bottom: 1px dashed #62441b;
    padding: 15px 0px;
    transition: 0.5s;
}

.events li:hover {
    background: url(../img/fon-hover.jpg) repeat;
    margin: -1px -30px 1px -35px;
    padding: 15px 35px 15px 25px;
    box-shadow: 0em 0.5em 10px rgba(0, 0, 0, 0.5);
    color: #ffd562;
    z-index: 2;
    position: relative;
}

.events li:hover a {
    color: #ffd562;
}

.events li:hover span {
    color: #a79255;
}

.events li a {
    display: block;
    margin-bottom: 4px;
    color: #fff;
}

.events li span {
    color: #bfb5ae;
    font-size: 11px;
}

/* Footer

-----------------------------------------------------------------------------*/

.footer {
    height: 310px;
    position: relative;
}

.footer:after {
    content: "";
    position: absolute;
    width: 1200px;
    left: 0;
    top: 73px;
}

.footer-block-t {
    position: absolute;
    width: 1200px;
    bottom: 130px;
    left: 0;
}

.f-menu {
    display: flex;
}

.f-menu li {
    margin: 0px 25px;
}

.f-menu li:first-child {
    margin: 0px 25px 0px 0px;
}

.f-menu li:last-child {
    margin: 0px 0px 0px 25px;
}

.f-menu li a {
    text-transform: uppercase;
    color: #cdae8e;
    font-size: 12px;
    padding: 0px 10px;
    display: block;
}

.f-menu li a:hover {
    color: #b1a513;
}

.f-menu li a:active {
    color: #b1a513;
}

.footer-block-l {
    width: 915px;
}

.footer-block-r {
    width: 260px;
    text-align: center;
}

.soc-block a {
    padding-top: 15px;
    display: inline-block;
    margin: -19px -6px 3px;
    background: url(../img/fon-icon-ss.png) no-repeat;
    height: 61px;
    width: 61px;
}

.soc-block a:hover {
    -webkit-filter: brightness(140%);
    filter: brightness(140%);
}

/*

.soc-block .facebook {

  background: url(../img/soc-icons.png) 7px 4px no-repeat;

}

.soc-block .twitter {

  background: url(../img/soc-icons.png) -32px 4px no-repeat;

}

.soc-block .twitch {

  background: url(../img/soc-icons.png) -72px 4px no-repeat;

}

.soc-block .youtube {

  background: url(../img/soc-icons.png) -113px 4px no-repeat;

}

*/

.footer-block-b {
    position: absolute;
    width: 1200px;
    top: 200px;
    padding-right: 30px;
}

.templstock:hover {
    -webkit-filter: brightness(120%);
    filter: brightness(120%);
}

.copyright p {
    font-size: 12px;
    color: #e0f0fd;
    margin-bottom: 25px;
}

.copyright p a {
    color: #b1a513;
}

.copyright span {
    color: #8b8b8c;
    text-transform: uppercase;
    font-size: 10px;
}

.toTop-fon {
    background: url(../img/fon-all-news-bottom-bg.jpg)center bottom no-repeat;
    display: flex;
    justify-content: center;
    height: 65px;
    padding-top: 25px;
    position: absolute;
    bottom: -55px;
    width: 630px;
}

.toTop {
    background: url(../img/fon-circle.png) no-repeat;
    width: 98px;
    height: 98px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}

.toTop:hover {
    -webkit-filter: brightness(120%);
    filter: brightness(120%);
}

.red-light {
    background: url(../img/red-light-top-bg.jpg) center top no-repeat, url(../img/red-light-bottom-bg.jpg) center bottom no-repeat, url(../img/red-light-bg.jpg) center repeat-y;
}

.red-dark {
    background: url(../img/red-dark-top-bg.jpg) center top no-repeat, url(../img/red-dark-bottom-bg.jpg) center bottom no-repeat, url(../img/red-dark-line-bg.jpg) center repeat-y;
}

.modalx-overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    cursor: pointer;
    overflow: auto;
    visibility: hidden;
    -webkit-transition: background 0.25s linear;
    -moz-transition: background 0.25s linear;
    transition: background 0.25s linear;
}

.modal_window {
    z-index: 9999;
    position: relative;
    cursor: auto;
    margin: 0 auto;
    display: none;
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    transition: all 0.25s linear;
    margin-bottom: 20px;
    transform: scale(0.4);
    background: #000;
    width: 1000px;
    height: 540px;
    box-shadow: 0px 10px 63px 0px rgba(0, 0, 0, 0.5);
    background: url(../img/sidebar-bg.jpg);
}

.close-r {
    display: block;
    position: absolute;
    margin-top: -25px;
    width: 70px;
    height: 70px;
    right: -35px;
    background: url(../img/close_popup.png) no-repeat;
    filter: hue-rotate(50deg);
    -webkit-filter: hue-rotate(50deg);
}

.modal_window iframe {
    border: 0px;
}

/*# sourceMappingURL=style.css.map */

.f16 .flag {
    display: inline-block;
    height: 16px;
    width: 16px;
    vertical-align: text-top;
    line-height: 16px;
    background: url(../img/flags.png) no-repeat;
}

.f16 ._African_Union {
    background-position: 0 -16px;
}

.f16 ._Arab_League {
    background-position: 0 -32px;
}

.f16 ._ASEAN {
    background-position: 0 -48px;
}

.f16 ._CARICOM {
    background-position: 0 -64px;
}

.f16 ._CIS {
    background-position: 0 -80px;
}

.f16 ._Commonwealth {
    background-position: 0 -96px;
}

.f16 ._England {
    background-position: 0 -112px;
}

.f16 ._European_Union,
.f16 .eu {
    background-position: 0 -128px;
}

.f16 ._Islamic_Conference {
    background-position: 0 -144px;
}

.f16 ._Kosovo {
    background-position: 0 -160px;
}

.f16 ._NATO {
    background-position: 0 -176px;
}

.f16 ._Northern_Cyprus {
    background-position: 0 -192px;
}

.f16 ._Northern_Ireland {
    background-position: 0 -208px;
}

.f16 ._Olimpic_Movement {
    background-position: 0 -224px;
}

.f16 ._OPEC {
    background-position: 0 -240px;
}

.f16 ._Red_Cross {
    background-position: 0 -256px;
}

.f16 ._Scotland {
    background-position: 0 -272px;
}

.f16 ._Somaliland {
    background-position: 0 -288px;
}

.f16 ._Tibet {
    background-position: 0 -304px;
}

.f16 ._United_Nations {
    background-position: 0 -320px;
}

.f16 ._Wales {
    background-position: 0 -336px;
}

.f16 .ad {
    background-position: 0 -352px;
}

.f16 .ae {
    background-position: 0 -368px;
}

.f16 .af {
    background-position: 0 -384px;
}

.f16 .ag {
    background-position: 0 -400px;
}

.f16 .ai {
    background-position: 0 -416px;
}

.f16 .al {
    background-position: 0 -432px;
}

.f16 .am {
    background-position: 0 -448px;
}

.f16 .ao {
    background-position: 0 -464px;
}

.f16 .aq {
    background-position: 0 -480px;
}

.f16 .ar {
    background-position: 0 -496px;
}

.f16 .as {
    background-position: 0 -512px;
}

.f16 .at {
    background-position: 0 -528px;
}

.f16 .au {
    background-position: 0 -544px;
}

.f16 .aw {
    background-position: 0 -560px;
}

.f16 .ax {
    background-position: 0 -576px;
}

.f16 .az {
    background-position: 0 -592px;
}

.f16 .ba {
    background-position: 0 -608px;
}

.f16 .bb {
    background-position: 0 -624px;
}

.f16 .bd {
    background-position: 0 -640px;
}

.f16 .be {
    background-position: 0 -656px;
}

.f16 .bf {
    background-position: 0 -672px;
}

.f16 .bg {
    background-position: 0 -688px;
}

.f16 .bh {
    background-position: 0 -704px;
}

.f16 .bi {
    background-position: 0 -720px;
}

.f16 .bj {
    background-position: 0 -736px;
}

.f16 .bm {
    background-position: 0 -752px;
}

.f16 .bn {
    background-position: 0 -768px;
}

.f16 .bo {
    background-position: 0 -784px;
}

.f16 .br {
    background-position: 0 -800px;
}

.f16 .bs {
    background-position: 0 -816px;
}

.f16 .bt {
    background-position: 0 -832px;
}

.f16 .bw {
    background-position: 0 -848px;
}

.f16 .by {
    background-position: 0 -864px;
}

.f16 .bz {
    background-position: 0 -880px;
}

.f16 .ca {
    background-position: 0 -896px;
}

.f16 .cg {
    background-position: 0 -912px;
}

.f16 .cf {
    background-position: 0 -928px;
}

.f16 .cd {
    background-position: 0 -944px;
}

.f16 .ch {
    background-position: 0 -960px;
}

.f16 .ci {
    background-position: 0 -976px;
}

.f16 .ck {
    background-position: 0 -992px;
}

.f16 .cl {
    background-position: 0 -1008px;
}

.f16 .cm {
    background-position: 0 -1024px;
}

.f16 .cn {
    background-position: 0 -1040px;
}

.f16 .co {
    background-position: 0 -1056px;
}

.f16 .cr {
    background-position: 0 -1072px;
}

.f16 .cu {
    background-position: 0 -1088px;
}

.f16 .cv {
    background-position: 0 -1104px;
}

.f16 .cy {
    background-position: 0 -1120px;
}

.f16 .cz {
    background-position: 0 -1136px;
}

.f16 .de {
    background-position: 0 -1152px;
}

.f16 .dj {
    background-position: 0 -1168px;
}

.f16 .dk {
    background-position: 0 -1184px;
}

.f16 .dm {
    background-position: 0 -1200px;
}

.f16 .do {
    background-position: 0 -1216px;
}

.f16 .dz {
    background-position: 0 -1232px;
}

.f16 .ec {
    background-position: 0 -1248px;
}

.f16 .ee {
    background-position: 0 -1264px;
}

.f16 .eg {
    background-position: 0 -1280px;
}

.f16 .eh {
    background-position: 0 -1296px;
}

.f16 .er {
    background-position: 0 -1312px;
}

.f16 .es {
    background-position: 0 -1328px;
}

.f16 .et {
    background-position: 0 -1344px;
}

.f16 .fi {
    background-position: 0 -1360px;
}

.f16 .fj {
    background-position: 0 -1376px;
}

.f16 .fm {
    background-position: 0 -1392px;
}

.f16 .fo {
    background-position: 0 -1408px;
}

.f16 .fr {
    background-position: 0 -1424px;
}

.f16 .bl,
.f16 .cp,
.f16 .mf,
.f16 .yt {
    background-position: 0 -1424px;
}

.f16 .ga {
    background-position: 0 -1440px;
}

.f16 .gb {
    background-position: 0 -1456px;
}

.f16 .sh {
    background-position: 0 -1456px;
}

.f16 .gd {
    background-position: 0 -1472px;
}

.f16 .ge {
    background-position: 0 -1488px;
}

.f16 .gg {
    background-position: 0 -1504px;
}

.f16 .gh {
    background-position: 0 -1520px;
}

.f16 .gi {
    background-position: 0 -1536px;
}

.f16 .gl {
    background-position: 0 -1552px;
}

.f16 .gm {
    background-position: 0 -1568px;
}

.f16 .gn {
    background-position: 0 -1584px;
}

.f16 .gp {
    background-position: 0 -1600px;
}

.f16 .gq {
    background-position: 0 -1616px;
}

.f16 .gr {
    background-position: 0 -1632px;
}

.f16 .gt {
    background-position: 0 -1648px;
}

.f16 .gu {
    background-position: 0 -1664px;
}

.f16 .gw {
    background-position: 0 -1680px;
}

.f16 .gy {
    background-position: 0 -1696px;
}

.f16 .hk {
    background-position: 0 -1712px;
}

.f16 .hn {
    background-position: 0 -1728px;
}

.f16 .hr {
    background-position: 0 -1744px;
}

.f16 .ht {
    background-position: 0 -1760px;
}

.f16 .hu {
    background-position: 0 -1776px;
}

.f16 .id {
    background-position: 0 -1792px;
}

.f16 .mc {
    background-position: 0 -1792px;
}

.f16 .ie {
    background-position: 0 -1808px;
}

.f16 .il {
    background-position: 0 -1824px;
}

.f16 .im {
    background-position: 0 -1840px;
}

.f16 .in {
    background-position: 0 -1856px;
}

.f16 .iq {
    background-position: 0 -1872px;
}

.f16 .ir {
    background-position: 0 -1888px;
}

.f16 .is {
    background-position: 0 -1904px;
}

.f16 .it {
    background-position: 0 -1920px;
}

.f16 .je {
    background-position: 0 -1936px;
}

.f16 .jm {
    background-position: 0 -1952px;
}

.f16 .jo {
    background-position: 0 -1968px;
}

.f16 .jp {
    background-position: 0 -1984px;
}

.f16 .ke {
    background-position: 0 -2000px;
}

.f16 .kg {
    background-position: 0 -2016px;
}

.f16 .kh {
    background-position: 0 -2032px;
}

.f16 .ki {
    background-position: 0 -2048px;
}

.f16 .km {
    background-position: 0 -2064px;
}

.f16 .kn {
    background-position: 0 -2080px;
}

.f16 .kp {
    background-position: 0 -2096px;
}

.f16 .kr {
    background-position: 0 -2112px;
}

.f16 .kw {
    background-position: 0 -2128px;
}

.f16 .ky {
    background-position: 0 -2144px;
}

.f16 .kz {
    background-position: 0 -2160px;
}

.f16 .la {
    background-position: 0 -2176px;
}

.f16 .lb {
    background-position: 0 -2192px;
}

.f16 .lc {
    background-position: 0 -2208px;
}

.f16 .li {
    background-position: 0 -2224px;
}

.f16 .lk {
    background-position: 0 -2240px;
}

.f16 .lr {
    background-position: 0 -2256px;
}

.f16 .ls {
    background-position: 0 -2272px;
}

.f16 .lt {
    background-position: 0 -2288px;
}

.f16 .lu {
    background-position: 0 -2304px;
}

.f16 .lv {
    background-position: 0 -2320px;
}

.f16 .ly {
    background-position: 0 -2336px;
}

.f16 .ma {
    background-position: 0 -2352px;
}

.f16 .md {
    background-position: 0 -2368px;
}

.f16 .me {
    background-position: 0 -2384px;
}

.f16 .mg {
    background-position: 0 -2400px;
}

.f16 .mh {
    background-position: 0 -2416px;
}

.f16 .mk {
    background-position: 0 -2432px;
}

.f16 .ml {
    background-position: 0 -2448px;
}

.f16 .mm {
    background-position: 0 -2464px;
}

.f16 .mn {
    background-position: 0 -2480px;
}

.f16 .mo {
    background-position: 0 -2496px;
}

.f16 .mq {
    background-position: 0 -2512px;
}

.f16 .mr {
    background-position: 0 -2528px;
}

.f16 .ms {
    background-position: 0 -2544px;
}

.f16 .mt {
    background-position: 0 -2560px;
}

.f16 .mu {
    background-position: 0 -2576px;
}

.f16 .mv {
    background-position: 0 -2592px;
}

.f16 .mw {
    background-position: 0 -2608px;
}

.f16 .mx {
    background-position: 0 -2624px;
}

.f16 .my {
    background-position: 0 -2640px;
}

.f16 .mz {
    background-position: 0 -2656px;
}

.f16 .na {
    background-position: 0 -2672px;
}

.f16 .nc {
    background-position: 0 -2688px;
}

.f16 .ne {
    background-position: 0 -2704px;
}

.f16 .ng {
    background-position: 0 -2720px;
}

.f16 .ni {
    background-position: 0 -2736px;
}

.f16 .nl {
    background-position: 0 -2752px;
}

.f16 .bq {
    background-position: 0 -2752px;
}

.f16 .no {
    background-position: 0 -2768px;
}

.f16 .bv,
.f16 .nq,
.f16 .sj {
    background-position: 0 -2768px;
}

.f16 .np {
    background-position: 0 -2784px;
}

.f16 .nr {
    background-position: 0 -2800px;
}

.f16 .nz {
    background-position: 0 -2816px;
}

.f16 .om {
    background-position: 0 -2832px;
}

.f16 .pa {
    background-position: 0 -2848px;
}

.f16 .pe {
    background-position: 0 -2864px;
}

.f16 .pf {
    background-position: 0 -2880px;
}

.f16 .pg {
    background-position: 0 -2896px;
}

.f16 .ph {
    background-position: 0 -2912px;
}

.f16 .pk {
    background-position: 0 -2928px;
}

.f16 .pl {
    background-position: 0 -2944px;
}

.f16 .pr {
    background-position: 0 -2960px;
}

.f16 .ps {
    background-position: 0 -2976px;
}

.f16 .pt {
    background-position: 0 -2992px;
}

.f16 .pw {
    background-position: 0 -3008px;
}

.f16 .py {
    background-position: 0 -3024px;
}

.f16 .qa {
    background-position: 0 -3040px;
}

.f16 .re {
    background-position: 0 -3056px;
}

.f16 .ro {
    background-position: 0 -3072px;
}

.f16 .rs {
    background-position: 0 -3088px;
}

.f16 .ru {
    background-position: 0 -3104px;
}

.f16 .rw {
    background-position: 0 -3120px;
}

.f16 .sa {
    background-position: 0 -3136px;
}

.f16 .sb {
    background-position: 0 -3152px;
}

.f16 .sc {
    background-position: 0 -3168px;
}

.f16 .sd {
    background-position: 0 -3184px;
}

.f16 .se {
    background-position: 0 -3200px;
}

.f16 .sg {
    background-position: 0 -3216px;
}

.f16 .si {
    background-position: 0 -3232px;
}

.f16 .sk {
    background-position: 0 -3248px;
}

.f16 .sl {
    background-position: 0 -3264px;
}

.f16 .sm {
    background-position: 0 -3280px;
}

.f16 .sn {
    background-position: 0 -3296px;
}

.f16 .so {
    background-position: 0 -3312px;
}

.f16 .sr {
    background-position: 0 -3328px;
}

.f16 .st {
    background-position: 0 -3344px;
}

.f16 .sv {
    background-position: 0 -3360px;
}

.f16 .sy {
    background-position: 0 -3376px;
}

.f16 .sz {
    background-position: 0 -3392px;
}

.f16 .tc {
    background-position: 0 -3408px;
}

.f16 .td {
    background-position: 0 -3424px;
}

.f16 .tg {
    background-position: 0 -3440px;
}

.f16 .th {
    background-position: 0 -3456px;
}

.f16 .tj {
    background-position: 0 -3472px;
}

.f16 .tl {
    background-position: 0 -3488px;
}

.f16 .tm {
    background-position: 0 -3504px;
}

.f16 .tn {
    background-position: 0 -3520px;
}

.f16 .to {
    background-position: 0 -3536px;
}

.f16 .tr {
    background-position: 0 -3552px;
}

.f16 .tt {
    background-position: 0 -3568px;
}

.f16 .tv {
    background-position: 0 -3584px;
}

.f16 .tw {
    background-position: 0 -3600px;
}

.f16 .tz {
    background-position: 0 -3616px;
}

.f16 .ua {
    background-position: 0 -3632px;
}

.f16 .ug {
    background-position: 0 -3648px;
}

.f16 .us {
    background-position: 0 -3664px;
}

.f16 .uy {
    background-position: 0 -3680px;
}

.f16 .uz {
    background-position: 0 -3696px;
}

.f16 .va {
    background-position: 0 -3712px;
}

.f16 .vc {
    background-position: 0 -3728px;
}

.f16 .ve {
    background-position: 0 -3744px;
}

.f16 .vg {
    background-position: 0 -3760px;
}

.f16 .vi {
    background-position: 0 -3776px;
}

.f16 .vn {
    background-position: 0 -3792px;
}

.f16 .vu {
    background-position: 0 -3808px;
}

.f16 .ws {
    background-position: 0 -3824px;
}

.f16 .ye {
    background-position: 0 -3840px;
}

.f16 .za {
    background-position: 0 -3856px;
}

.f16 .zm {
    background-position: 0 -3872px;
}

.f16 .zw {
    background-position: 0 -3888px;
}

.f16 .sx {
    background-position: 0 -3904px;
}

.f16 .cw {
    background-position: 0 -3920px;
}

.f16 .ss {
    background-position: 0 -3936px;
}

.f16 .nu {
    background-position: 0 -3952px;
}

.i_note,
.s_note,
.w_note,
.e_note {
    border: 1px solid;
    margin: 10px 0px;
    padding: 15px 10px 15px 40px;
    background-repeat: no-repeat;
    -moz-border-radius: .5em;
    -webkit-border-radius: .5em;
    border-radius: .5em;
    text-align: left;
}

.i_note {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../img/info.png');
    background-position: left center;
}

.s_note {
    color: #4F8A10;
    background-color: #E8EFD3;
    background-image: url('../img/success.png');
    background-position: left center;
}

.w_note {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('../img/warning.png');
    background-position: left center;
}

.e_note {
    color: #D8000C;
    background-color: #F7E0CC;
    background-image: url('../img/error.png');
    background-position: left center;
}

.QapTcha {
    width: 215px;
}

.QapTcha .clr {
    clear: both
}

.QapTcha .bgSlider {
    width: 215px;
    height: 30px;
    float: left;
    border: 1px solid #CCC;
    background-color: #FFF;
    box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1);
}

.QapTcha .slider {
    width: 30px;
    height: 30px;
    background: transparent url('../img/bg_draggable_qaptcha.jpg') no-repeat;
    background-size: 30px 30px;
    cursor: e-resize;
    position: relative;
    top: 0;
    left: 0
}

.QapTcha .txtStatus {
    width: 215px;
    margin-top: 7px;
    text-align: left;
    color: #bb2828;
    font-family: Verdana;
    font-size: 10px;
    clear: both;
    padding-bottom: 10px;
}

.QapTcha .dropSuccess {
    color: #4e8b37
}

.QapTcha .dropError {
    color: #bb2828
}

#loading {
    background-image: url(../img/l_bg.png);
    border-radius: 0 0 4px 4px;
    color: #fff;
    display: none;
    position: fixed;
    top: 0;
    left: 48%;
    z-index: 1000;
    padding: 6px;
}

ul.style2 {
    margin: 0px;
    padding: 0px;
    list-style: square;
}

ul.style2 li {
    padding: 10px 0px 15px 0px;
    background: url(../img/divider2-bg.png) repeat-x left top;
    line-height: 100%;
}

ul.style2 a {
    color: #16130f;
    text-decoration: none;
}

ul.style2 .first {
    padding-top: 0px;
    background: none;
}

ul.style3 {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

ul.style3 li {
    padding: 10px 0px 15px 0px;
    background: url(../img/divider2-bg.png) repeat-x left top;
    line-height: 100%;
}

ul.style3 a {
    color: #16130f;
    text-decoration: none;
}

ul.style3 .first {
    padding-top: 0px;
    background: none;
}

/** LIST STYLE 4 */

ul.style4 {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

ul.style4 li {
    padding: 5px 0px 5px 0px;
    background: url(../img/divider4-bg.png) repeat-x left top;
}

ul.style4 a {
    color: #16130f;
}

ul.style4 .first {
    padding-top: 0px;
    background: none;
}

ul.style4 span {
    float: right;
}

/** TITLE 1 */

/** BOX STYLE 1 */

.box-style1 {
    overflow: hidden;
}

.box-style1 .title {
    display: none;
}

.box-style1 .entry {
    padding: 20px 25px 0px 25px;
    #background: url(../img/box-content-shadow.png) no-repeat left top;
}

.box-style2 {
    overflow: hidden;
}

/** BOX STYLE 2 */

.box-style2 .entry {
    padding: 0px 50px 0px 40px;
}

.box-style2 h3 {
    padding: 0px 0px 20px 0px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 13px;
    color: #16130f;
}

/** BOX STYLE 3 */

.box-style3 .entry {
    margin-top: -20px;
    padding: 0px 40px 0px 50px;
}

/** BOX STYLE 4 */

.box-style4 {
    overflow: hidden;
}

.box-style4 .title {
    font-size: 18px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}

.box-style4 .entry {
    padding: 30px 20px 0px 30px;
    #background: url(../img/box-content-shadow.png) no-repeat left top;
}

.avatar_frame {
    padding: 3px;
    border: 1px solid #333333;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}

/** BUTTON STYLE 1 */

.button-style {
    transition: all 0.3s ease;
    cursor: pointer;
    #background: url(../img/button-blue-bg.png) repeat-x;
    height: 18px;
    line-height: 18px;
    display: inline-block;
    border: none;
    color: #fff;
    position: relative;
    z-index: 2;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 9px;
    text-shadow: 1px 1px 2px #000;
    margin-left: 5px;
    text-decoration: none;
    box-shadow: 0px 10px 49px -1px rgba(0, 0, 0, 0.75);
    padding: 0px 10px;
}

.button-style:before {
    content: "";
    #background: url(../img/button-blue-left-bg.png) no-repeat;
    width: 20px;
    height: 18px;
    position: absolute;
    left: -5px;
    top: 0;
    z-index: -1;
}

.button-style:after {
    content: "";
    #background: url(../img/button-blue-right-bg.png) no-repeat;
    width: 20px;
    height: 18px;
    position: absolute;
    right: -5px;
    top: 0;
    z-index: -1;
}

/** BUTTON STYLE 2 */

.button-style2 {
    border: none;
    position: relative;
    width: 182px;
    height: 71px;
    left: -10px;
    #background: url(../img/banner-buttong-bg.png) no-repeat left bottom;
    line-height: 71px;
    letter-spacing: 1px;
    text-align: center;
    text-decoration: none;
    text-shadow: 2px 1px 0px rgba(0, 0, 0, .5);
    text-transform: uppercase;
    font-family: serif;
    font-size: 12px;
    color: #FFFFFF;
    cursor: pointer;
}

/** TWO COLUMNS */

.two-column {
    overflow: hidden;
    margin-top: -10px;
    padding: 0px 30px 0px 50px;
}

#box1 {}

/** META STYLE 1 */

.meta-bg {
    overflow: hidden;
    position: relative;
    width: 542px;
    height: 50px;
    padding: 10px 45px 0px 35px;
    left: -10px;
}

.meta p {
    text-transform: uppercase;
    font-family: serif;
}

.meta .tags {
    float: left;
    padding: 0px 0px 3px 30px;
    background: url(../img/meta-icons-03.png) no-repeat left 0px;
}

.meta .links {
    float: right;
}

.meta .more {
    padding: 0px 10px 3px 30px;
    background: url(../img/meta-icons-01.png) no-repeat left 0px;
}

.meta .comments {
    padding: 0px 0px 3px 30px;
    background: url(../img/meta-icons-02.png) no-repeat left 0px;
}

.meta .divider {
    height: 22px;
    padding: 0px 15px;
    background: url(../img/meta-divider-bg.jpg) repeat-y center top;
}

.meta a {
    text-decoration: underline;
}

#tooltip {
    position: absolute;
    z-index: 3000;
    border: 1px solid #111;
    background-color: #221f28;
    padding: 5px;
    opacity: 0.90;
    font: normal 10px Tahoma, Helvetica, sans-serif;
    text-align: center;
    color: #fff;
}

#tooltip h3,
#tooltip div {
    margin: 0;
}

#lean_overlay {
    position: fixed;
    z-index: 9998;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: #000;
    display: none;
}

#buy_windows,
#add_to_card_windows,
#select_server,
#auction_bet {
    width: 404px;
    padding-bottom: 2px;
    display: none;
    background: #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.7);
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
    -moz-box-shadow: 0 0px 4px rgba(0, 0, 0, 0.7);
    z-index: 9999;
}

#item_filter_overlay {
    position: absolute;
    height: 400px;
    width: 300px;
    display: none;
    z-index: 9999;
}

#item_filter {
    width: 300px;
    height: 710px;
    padding-bottom: 2px;
    background: #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.7);
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
    -moz-box-shadow: 0 0px 4px rgba(0, 0, 0, 0.7);
}

.item_filter_content {
    height: 600px;
    width: 285px;
    margin: 15px;
    overflow: auto;
}

.modal-header {
    background: url(../img/hd-bg.png);
    padding: 18px 18px 14px 18px;
    border-bottom: 1px solid #CCC;
    border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
}

.modal-header h2 {
    color: #444;
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 3px;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

.modal-header2 {
    background: url(../img/hd-bg.png);
    padding: 18px 18px 14px 18px;
    border-bottom: 1px solid #CCC;
    border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
    cursor: move;
}

.modal-header2 h2 {
    color: #444;
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 3px;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

.close {
    position: absolute;
    top: 12px;
    right: 12px;
    display: block;
    width: 14px;
    height: 14px;
    background: url(../img/close.png);
    z-index: 2;
}

.form {
    margin: 0px auto;
}

.form input:not([type="checkbox"]):not([type="number"]),
.form select,
.form textarea {
    margin: 2px 0;
    width: 200px;
}

.form input[type=checkbox] {
    display: block;
    float: left;
}

.form select {
    width: 216px;
}

.right {
    float: right;
}

.left {
    float: left;
}

.fixed {
    position: fixed;
}

.QapTcha {
    width: 215px;
}

.QapTcha .clr {
    clear: both
}

.QapTcha .bgSlider {
    width: 215px;
    height: 30px;
    float: left;
    border: 1px solid #CCC;
    background-color: #FFF;
    box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1);
}

.QapTcha .slider {
    width: 30px;
    height: 30px;
    background: transparent url('../img/bg_draggable_qaptcha.jpg') no-repeat;
    background-size: 30px 30px;
    cursor: e-resize;
    position: relative;
    top: 0;
    left: 0
}

.QapTcha .txtStatus {
    width: 215px;
    margin-top: 7px;
    text-align: left;
    color: #bb2828;
    font-family: Verdana;
    font-size: 10px;
    clear: both;
    padding-bottom: 10px;
}

.QapTcha .dropSuccess {
    color: #4e8b37
}

.QapTcha .dropError {
    color: #bb2828
}

.i_note,
.s_note,
.w_note,
.e_note {
    border: 1px solid;
    margin: 10px 0px;
    padding: 15px 10px 15px 40px;
    background-repeat: no-repeat;
    -moz-border-radius: .5em;
    -webkit-border-radius: .5em;
    border-radius: .5em;
    text-align: left;
}

.i_note {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../img/info.png');
    background-position: left center;
}

.s_note {
    color: #4F8A10;
    background-color: #E8EFD3;
    background-image: url('../img/success.png');
    background-position: left center;
}

.w_note {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('../img/warning.png');
    background-position: left center;
}

.e_note {
    color: #D8000C;
    background-color: #F7E0CC;
    background-image: url('../img/error.png');
    background-position: left center;
}

.buttonn {
    float: right;
    font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    background: #660000;
    border: none;
    width: auto;
    overflow: visible;
    font-size: 1.4em;
    color: #FFF;
    padding: 7px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    font-weight: bold;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
}

.btn-fld {
    width: 254px;
    overflow: hidden;
    padding: 12px 20px 12px 130px;
}

.tabrow {
    text-align: center;
    list-style: none;
    margin: 0px 0 10px;
    padding: 0;
    line-height: 24px;
    height: 26px;
    overflow: hidden;
    font-size: 12px;
    font-family: verdana;
    position: relative;
}

.tabrow li {
    background: #fbb450;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fbb450), color-stop(1, #a34221));
    background: -moz-linear-gradient(top, #fbb450 5%, #a34221 100%);
    background: -webkit-linear-gradient(top, #fbb450 5%, #a34221 100%);
    background: -o-linear-gradient(top, #fbb450 5%, #a34221 100%);
    background: -ms-linear-gradient(top, #fbb450 5%, #a34221 100%);
    background: linear-gradient(to bottom, #302F2D 5%, #222222 100%);
    display: inline-block;
    position: relative;
    z-index: 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #3C3C3C;
    text-shadow: 0 1px #000;
    margin: 0 -5px;
    padding: 0 20px;
    border: 1px solid #363434;
}

.tabrow a {
    color: #ffffff;
    text-decoration: none;
}

.tabrow li.selected {
    color: #ffffff;
    z-index: 2;
    -moz-box-shadow: inset 0px 1px 0px 0px #f0a899;
    -webkit-box-shadow: inset 0px 1px 0px 0px #f0a899;
    box-shadow: inset 0px 1px 0px 0px #f0a899;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #915044), color-stop(1, #552a22));
    background: -moz-linear-gradient(center top, #915044 5%, #552a22 100%);
    background-color: #915044;
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
    font-family: Arial;
    font-size: 11px;
    color: #ffffff;
    text-shadow: 1px 1px 0px #000000;
    border: 1px solid #613333;
}

.tabrow:before {
    position: absolute;
    content: " ";
    width: 80%;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-bottom: 1px solid #363636;
    z-index: 1;
}

.tabrow li:before,
.tabrow li:after {
    border: 1px solid #613333;
    position: absolute;
    bottom: -1px;
    width: 5px;
    height: 5px;
    content: " ";
}

.tabrow li:before {
    left: -6px;
    border-bottom-right-radius: 6px;
    border-width: 0 1px 1px 0;
    box-shadow: 2px 2px 0 #232323;
}

.tabrow li:after {
    right: -6px;
    border-bottom-left-radius: 6px;
    border-width: 0 0 1px 1px;
    box-shadow: -2px 2px 0 #232323;
}

.tabrow li.selected:before {
    box-shadow: 2px 2px 0 #5c2f26;
}

.tabrow li.selected:after {
    box-shadow: -2px 2px 0 #5c2f26;
}

.rankings {
    display: none;
}
/*vigomu.net*/
.custom_button {
    -moz-box-shadow: inset 0px 1px 0px 0px #80615c;
    -webkit-box-shadow: inset 0px 1px 0px 0px #80615c;
    box-shadow: inset 0px 1px 0px 0px #80615c;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #6d3d34), color-stop(1, #4f2922));
    background: -moz-linear-gradient(center top, #6d3d34 5%, #4f2922 100%);
    background-color: #6d3d34;
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
    text-indent: 0;
    border: 1px solid #5c3129;
    display: inline-block;
    color: #ffffff;
    font-family: arial;
    font-size: 11px;
    font-weight: normal;
    font-style: normal;
    height: 25px;
    line-height: 25px;
    padding-left: 10px;
    padding-right: 10px;
    text-decoration: none;
    text-align: center;
    text-shadow: 1px 1px 0px #050005;
}

.custom_button-a {
    text-decoration: none;
}

.custom_button:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #4f2922), color-stop(1, #6d3d34));
    background: -moz-linear-gradient(center top, #4f2922 5%, #6d3d34 100%);
    background-color: #4f2922;
    text-decoration: none;
}

.custom_button:active {
    position: relative;
    top: 0px;
}

#character-info {
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 0px;
}

#character-info ul {
    list-style-type: none;
    display: inline;
    margin: 0px;
    padding: 0px;
    width: 100%;
}

#character-info ul li {
    float: left;
    padding: 0px;
    margin: 0px;
    width: 268px;
}

#character-info tbody tr {
    background: none;
    border: none;
}

#character-info tbody tr td {
    width: 50%;
    margin: 0 auto;
    padding: 5px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    background: rgba(170, 115, 132, 0.2);
    border: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.38);
    -moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.38);
    box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.38);
}

#character-info tbody tr td a {
    font-size: 14px;
    font-weight: bold;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: #b8ab7e;
}

#character-info div {
    padding-left: 10px;
}

#small_menu ul {
    margin: 0px;
    padding: 0px;
}

#small_menu li {
    list-style: none;
}

ul#vote-options {
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
}

ul#vote-options {
    list-style: none;
}

ul#vote-options h5 {
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
}

#vote-options {
    color: #555;
    font-size: auto;
    line-height: auto;
    list-style-type: none;
    margin: 0;
}

#vote-options li {
    border-radius: 5px;
    line-height: 45px;
    height: 45px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    margin-top: 10px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.6);
}

#vote-options li img {
    width: 75px;
    height: 45px;
}

#vote-options li button {
    border: 1px solid #999;
    line-height: 28px;
    margin: 6px 0;
    padding: 0 5px;
}

#vote-options li h5 {
    color: #444;
    font-weight: bolder;
    font-size: 24px;
    border-left: 1px solid #453129;
    padding-left: 10px;
    margin-left: 10px;
}

ul#paypal-options {
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

ul#paypal-options {
    list-style: none;
    list-style-type: none;
}

ul#paypal-options h4 {
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

ul#paypal-options h3 {
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#paypal-options {
    color: #555;
    font-size: auto;
    line-height: auto;
    list-style-type: none;
    margin: 0;
}

#paypal-options li {
    border-radius: 5px;
    line-height: 45px;
    height: 45px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    margin-top: 10px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.6);
}

#paypal-options li h4 {
    color: #444;
    font-weight: bolder;
    font-size: 22px;
    padding-left: 10px;
    margin-left: 10px;
}

#paypal-options li h3 {
    color: #444;
    font-size: 18px;
    padding-left: 10px;
    margin-left: 10px;
}

#paypal-options button {
    padding-top: 5px;
    height: 33px;
}

#helm {
    position: absolute;
    left: 73px;
    top: 58px;
    width: 56px;
    height: 66px;
}

#wings {
    position: absolute;
    left: 272px;
    top: 59px;
    width: 127px;
    height: 110px;
}

#pendant {
    position: absolute;
    left: 233px;
    top: 80px;
    width: 29px;
    height: 29px;
}

#sword {
    position: absolute;
    left: 6px;
    top: 242px;
    width: 69px;
    height: 129px;
}

#armor {
    position: absolute;
    left: 40px;
    top: 138px;
    width: 82px;
    height: 98px;
}

#shield {
    position: absolute;
    left: 330px;
    top: 242px;
    width: 69px;
    height: 129px;
}

#gloves {
    position: absolute;
    left: 271px;
    top: 178px;
    width: 85px;
    height: 55px;
}

#pants {
    position: absolute;
    left: 89px;
    top: 297px;
    width: 58px;
    height: 74px;
}

#ring_left {
    position: absolute;
    left: 102px;
    top: 252px;
    width: 29px;
    height: 29px;
}

#ring_right {
    position: absolute;
    left: 272px;
    top: 252px;
    width: 29px;
    height: 29px;
}

#boots {
    position: absolute;
    left: 258px;
    top: 297px;
    width: 58px;
    height: 74px;
}

/* AUCTION */

.inv {
    table-layout: fixed;
    background-color: #212121;
    border: 1px solid #100f0d;
    margin: 0px;
    padding: 0px;
}

.waretitle {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    background: #610000;
    font-style: oblique;
    font-weight: bold;
    color: #fff;
}

/* AUCTION END */

/* ------------------- PAGINATION ---------------------- */

#pagination {
    color: #4C9AEB;
    font: normal 12px verdana, arial, helvetica, serif;
    line-height: 17px;
    margin: 0;
    padding: 12px 8px 8px 12px;
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    -khtml-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

#pagination a {
    border: 1px solid #ccc;
    background: #fff;
    color: #8e9091;
    font: bold 12px verdana, arial, helvetica, serif;
    margin-right: 8px;
    padding: 4px 8px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
}

#pagination a.on {
    border: 1px solid #660000;
    background: #f7f7f7;
    color: #660000;
    margin-right: 8px;
    padding: 4px 8px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
}

#pagination a:hover {
    border: 1px solid #660000;
    color: #660000;
}

#pagination ul {
    height: 21px;
}

#pagination li {
    list-style-type: none;
    float: left;
}

/* ------------------- PAGINATION END ---------------------- */

.item_table {
    width: 200px;
    border: 0;
    margin: auto;
}

.item_table td {
    padding: 3px;
}

.each_item {
    width: 10px;
    border: 0;
    border-collapse: collapse;
}

.each_item td {
    padding: 0px;
}

.each_item .item_name {
    background: url(../img/ws_item_name.png);
    background-size: 136px 34px;
    height: 34px;
}

.each_item .item_bg {
    background-image: url(../img/ws_item_bg.png);
    background-size: 136px 140px;
    height: 140px;
}

.each_item .item_footer {
    background: url(../img/ws_item_footer.png);
    background-size: 136px 6px;
    height: 6px;
}

.item_image {
    text-align: center;
    height: 140px;
    width: 136px;
}

.items {
    text-align: center;
}

.items a {
    color: #FFFFFF;
    font-family: Verdana, Helvetica, sans-serif;
    font-size: 13px;
    text-decoration: none;
    padding-bottom: 5px;
}

.items a:hover {
    color: #000000;
}

#item_buy {
    margin-left: 5px;
    margin-right: 5px;
    width: 100%;
}

#item_buy_left {
    float: left;
    padding-right: 5px;
}

#item_buy_right {
    float: left;
    background-color: #3e1d1c;
    width: 492px;
    padding: 1px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

#item_buy_right .full {
    margin: 1px;
    padding: 1px;
    width: 488px;
    background-color: #76403f;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #FFFFFF;
    text-shadow: #000 0px 1px 0px;
    height: 18px;
    line-height: 18px;
}

#item_buy_right .opt_title {
    margin: 1px;
    padding-left: 1px;
    width: 250px;
    float: left;
    background-color: #76403f;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    text-shadow: #000 0px 1px 0px;
    height: 20px;
    line-height: 20px;
}

#item_buy_right .opt {
    margin: 1px;
    padding-left: 1px;
    width: 236px;
    float: left;
    background-color: #76403f;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    text-shadow: #000 0px 1px 0px;
    height: 20px;
    line-height: 20px;
}

#item_buy_right .opt select {
    border: 0px;
    border-radius: 0;
    width: 60%;
    font-size: 12px;
    line-height: 1;
    background: #5d302f;
    color: #fff;
    margin-top: 1px;
    padding: 0;
    -webkit-appearance: none;
}

#item_buy_right .opt input[type="number"] {
    width: 35px;
    border: 0px;
    border-radius: 0;
    font-size: 12px;
    line-height: 1;
    background: #5d302f;
    color: #fff;
    margin-top: 1px;
    padding: 0;
    -webkit-appearance: none;
}

#item_image_bg {
    position: relative;
    background: url(../img/item_bg.png) no-repeat;
    width: 129px;
    height: 184px;
}

#item_image_bg img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.item_info {
    margin-top: 2px;
    background: url(../img/item_desc.png) no-repeat;
    width: 129px;
    height: 36px;
    line-height: 36px;
    z-index: 500;
}

.item_info .info {
    padding-left: 5px;
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #FFFFFF;
    text-shadow: #000 0px 1px 0px;
}

.item_info .info .btimes {
    color: #ed7876;
}

.item_info .info .goldcr {
    color: #ffaf04;
}

.item_info .info .normalcr {
    color: #d9a08a;
}

#buy_buttons {
    margin-right: 10px;
    width: 99%;
}

#buy_buttons button {
    margin: 2px;
}

.buy_button {
    background: url(../img/slect_btn.png);
    width: 155px;
    height: 42px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #FFFFFF;
    text-shadow: #000 0px 1px 0px;
    border: 0;
    float: right;
}

.buy_button:hover {
    cursor: pointer;
}

.payment-method-button {
    margin: 4px;
    background-color: #EFEFEF;
    border-radius: 4px;
    border: 1px solid #D0D0D0;
    overflow: auto;
    float: left;
}

.payment-method-button label {
    float: left;
}

.payment-method-button label span {
    text-align: center;
    padding: 3px 0px;
    display: block;
    width: 120px;
    height: 50px;
    line-height: 50px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    cursor: pointer;
}

.payment-method-button label input {
    position: absolute;
    top: -20px;
}

.auction_bet_button {
    margin: 0 auto;
    background: #660000;
    color: #fff;
    border-radius: 4px;
    border: 1px solid #D0D0D0;
    text-align: center;
    padding: 3px 0px;
    display: block;
    width: 220px;
    height: 35px;
    cursor: pointer;
}

.span_red {
    background: #660000;
    color: #fff;
}

#sell_item {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.6);
    padding: 5px;
    -webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.38);
    -moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.38);
    box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.38);
    border: 1px solid rgba(0, 0, 0, 0.15);
    display: none;
}

.input-main {
    padding: 7px 9px;
    margin: 2px 0;
    border: 1px solid #CCC;
    border-bottom-color: #B3B3B3;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
    box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1);
}

.main-tr {
    font-weight: bold;
    background-color: rgba(255, 255, 255, 0.4);
}

.w-coins,
.wcoins {
    color: #CC6600;
    font-weight: bold;
}

.zz-coins,
.zzcoins {
    color: #003399;
    font-weight: bold;
}

#events div {
    padding: 3.5px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #fff;
}

#events div small {
    float: right;
}

.offline {
    color: red;
}

.online {
    color: green;
}

#timer_div_title {
    position: absolute;
    height: 16px;
    width: 210px;
    top: 10px;
    left: 560px;
    font-size: 16px;
    text-align: center;
}

#timer_div_time {
    position: absolute;
    height: 70px;
    width: 220px;
    top: 30px;
    left: 560px;
}

.timmer_inner_block {
    width: 50px;
    height: 65px;
    background-color: #fff;
    -moz-border-radius: .5em;
    -webkit-border-radius: .5em;
    border-radius: .5em;
    margin: 2px;
    float: left;
    opacity: 0.2;
    /*filter:alpha(opacity=20); */
}

#timer_div_time .timmer_inner_block .title {
    text-align: center;
}

#timer_div_time .timmer_inner_block .count {
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    padding-top: 10px;
}

.add_to_card {
    font-size: 12px;
    background: #eaebec;
    border: #ccc 1px solid;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 1px 2px #d1d1d1;
    -webkit-box-shadow: 0 1px 2px #d1d1d1;
    box-shadow: 0 1px 2px #d1d1d1;
    width: 100%;
}

.add_to_card th {
    padding: 15px 20px 16px 20px;
    border-top: 1px solid #fafafa;
    border-bottom: 1px solid #e0e0e0;
    background: #ededed;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
    background: -moz-linear-gradient(top, #ededed, #ebebeb);
}

.add_to_card th:first-child {
    text-align: left;
    padding-left: 20px;
}

.add_to_card tr:first-child th:first-child {
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
}

.add_to_card tr:first-child th:last-child {
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}

.add_to_card tr {
    text-align: center;
    padding-left: 20px;
}

.add_to_card td:first-child {
    text-align: left;
    padding-left: 20px;
    border-left: 0;
}

.add_to_card td {
    padding: 10px;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
    background: #fafafa;
    background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
    background: -moz-linear-gradient(top, #fbfbfb, #fafafa);
}

.add_to_card tr.even td {
    background: #f6f6f6;
    background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
    background: -moz-linear-gradient(top, #f8f8f8, #f6f6f6);
}

.add_to_card tr:last-child td {
    border-bottom: 0;
}

.add_to_card tr:last-child td:first-child {
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.add_to_card tr:last-child td:last-child {
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.add_to_card tr:hover td {
    background: #f2f2f2;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0));
    background: -moz-linear-gradient(top, #f2f2f2, #f0f0f0);
}

.ticket {
    font-size: 12px;
    background: #eaebec;
    border: #ccc 1px solid;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 1px 2px #d1d1d1;
    -webkit-box-shadow: 0 1px 2px #d1d1d1;
    box-shadow: 0 1px 2px #d1d1d1;
    __width: 100%;
}

.ticket th {
    padding: 15px 10px 16px 0px;
    border-top: 1px solid #fafafa;
    border-bottom: 1px solid #e0e0e0;
    background: #ededed;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
    background: -moz-linear-gradient(top, #ededed, #ebebeb);
}

.ticket th:first-child {
    text-align: left;
    padding-left: 10px;
}

.ticket tr:first-child th:first-child {
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
}

.ticket tr:first-child th:last-child {
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}

.ticket tr {
    text-align: center;
    padding-left: 20px;
}

.ticket td:first-child {
    text-align: left;
    padding-left: 20px;
    border-left: 0;
}

.ticket td {
    padding: 10px;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
    background: #fafafa;
    background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
    background: -moz-linear-gradient(top, #fbfbfb, #fafafa);
}

.ticket tr.even td {
    background: #f6f6f6;
    background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
    background: -moz-linear-gradient(top, #f8f8f8, #f6f6f6);
}

.ticket tr:last-child td {
    border-bottom: 0;
}

.ticket tr:last-child td:first-child {
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.ticket tr:last-child td:last-child {
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.ticket tr:hover td {
    background: #f2f2f2;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0));
    background: -moz-linear-gradient(top, #f2f2f2, #f0f0f0);
}

.discount_notice {
    margin: 20px auto;
    left: 200px;
    width: 280px;
    height: auto;
    background: white;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
    position: fixed;
    z-index: 90;
    opacity: 0.9;
}

.discount_notice .content {
    padding: 30px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-style: normal;
    color: #6a2f3c;
    font-weight: bold;
    position: relative;
    display: block;
}

.ribbon-discount-green {
    width: 85px;
    height: 88px;
    overflow: hidden;
    position: absolute;
    top: -3px;
    right: -3px;
}

.ribbon-green {
    font: bold 15px Sans-Serif;
    color: #333;
    text-align: center;
    text-shadow: rgba(255, 255, 255, 0.5) 0px 1px 0px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    position: relative;
    padding: 7px 0;
    left: -5px;
    top: 15px;
    width: 120px;
    background-color: #BFDC7A;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45));
    background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45);
    background-image: -moz-linear-gradient(top, #BFDC7A, #8EBF45);
    background-image: -ms-linear-gradient(top, #BFDC7A, #8EBF45);
    background-image: -o-linear-gradient(top, #BFDC7A, #8EBF45);
    color: #6a6340;
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.ribbon-green:before,
.ribbon-green:after {
    content: "";
    border-top: 3px solid #6e8900;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: -3px;
}

.ribbon-green:before {
    left: 0;
}

.ribbon-green:after {
    right: 0;
}

â€‹ .PriorityZero {
    background-color: rgb(230, 138, 138);
}

.PriorityOne {
    background-color: rgb(204, 64, 64);
}

.PriorityTwo {
    background-color: rgb(255, 0, 0);
}

.PriorityThree {
    background-color: rgb(153, 0, 0);
}

.plans {
    list-style: none;
    margin: 0;
    padding: 10px 20px;
}

.plan {
    background: white;
    border-radius: 6px;
    height: 60px;
    margin: 10px 0;
    opacity: 1;
    padding: 4px 25px;
    width: 100%;
}

.price {
    border-radius: 100%;
    cursor: default;
    display: block;
    float: left;
    height: 46px;
    line-height: 46px;
    margin: 8px 10px 0 0;
    text-align: center;
    width: 46px;
}

.price-green {
    background-color: #e1f1d1;
    color: #52b327;
    font-weight: bold;
}

.price-red {
    background-color: #f1e1d1;
    color: #b35227;
}

.details {
    color: #222;
    display: block;
    float: left;
    height: 46px;
    margin: 8px 0;
    padding: 0px 10px;
}

.plan-title {
    font-size: 17px;
    font-weight: normal;
    margin: 2px 0 0;
    padding: 0;
    text-transform: uppercase;
}

.plan-description {
    color: #666;
    font-size: 14px;
    margin: 0;
    padding: 0;
}

.selectvip {
    background: #660000;
    border: none;
    border-radius: 4px;
    color: white;
    display: inline-block;
    float: right;
    font-size: 14px;
    margin: 15px 0;
    padding: 7px 16px;
    text-decoration: none;
}

.selectvip:hover {
    background-color: #990000;
    text-decoration: none;
    cursor: painter;
}

#exception {
    width: 100%;
    height: 0 auto;
    line-height: 25px;
    min-height: 25px;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #FFF;
    display: none;
    background-color: red;
    position: fixed;
    z-index: 9999;
}

#inventory div {
    cursor: pointer;
}

#inventory div:hover {
    padding-top: 1px;
}

.wh_items {
    width: 261px;
    margin: 2px auto;
    padding-top: 6px;
    padding-left: 3px;
    height: 485px;
}

.square {
    cursor: pointer;
    position: absolute;
    opacity: 0.8;
}

.square:hover {
    padding: 1px;
    opacity: 1;
}

.square img {
    width: 100%;
    height: 100%;
}

.f16 .flag {
    display: inline-block;
    height: 16px;
    width: 16px;
    vertical-align: text-top;
    line-height: 16px;
    background: url(../img/flags.png) no-repeat;
}

.f16 ._African_Union {
    background-position: 0 -16px;
}

.f16 ._Arab_League {
    background-position: 0 -32px;
}

.f16 ._ASEAN {
    background-position: 0 -48px;
}

.f16 ._CARICOM {
    background-position: 0 -64px;
}

.f16 ._CIS {
    background-position: 0 -80px;
}

.f16 ._Commonwealth {
    background-position: 0 -96px;
}

.f16 ._England {
    background-position: 0 -112px;
}

.f16 ._European_Union,
.f16 .eu {
    background-position: 0 -128px;
}

.f16 ._Islamic_Conference {
    background-position: 0 -144px;
}

.f16 ._Kosovo {
    background-position: 0 -160px;
}

.f16 ._NATO {
    background-position: 0 -176px;
}

.f16 ._Northern_Cyprus {
    background-position: 0 -192px;
}

.f16 ._Northern_Ireland {
    background-position: 0 -208px;
}

.f16 ._Olimpic_Movement {
    background-position: 0 -224px;
}

.f16 ._OPEC {
    background-position: 0 -240px;
}

.f16 ._Red_Cross {
    background-position: 0 -256px;
}

.f16 ._Scotland {
    background-position: 0 -272px;
}

.f16 ._Somaliland {
    background-position: 0 -288px;
}

.f16 ._Tibet {
    background-position: 0 -304px;
}

.f16 ._United_Nations {
    background-position: 0 -320px;
}

.f16 ._Wales {
    background-position: 0 -336px;
}

.f16 .ad {
    background-position: 0 -352px;
}

.f16 .ae {
    background-position: 0 -368px;
}

.f16 .af {
    background-position: 0 -384px;
}

.f16 .ag {
    background-position: 0 -400px;
}

.f16 .ai {
    background-position: 0 -416px;
}

.f16 .al {
    background-position: 0 -432px;
}

.f16 .am {
    background-position: 0 -448px;
}

.f16 .ao {
    background-position: 0 -464px;
}

.f16 .aq {
    background-position: 0 -480px;
}

.f16 .ar {
    background-position: 0 -496px;
}

.f16 .as {
    background-position: 0 -512px;
}

.f16 .at {
    background-position: 0 -528px;
}

.f16 .au {
    background-position: 0 -544px;
}

.f16 .aw {
    background-position: 0 -560px;
}

.f16 .ax {
    background-position: 0 -576px;
}

.f16 .az {
    background-position: 0 -592px;
}

.f16 .ba {
    background-position: 0 -608px;
}

.f16 .bb {
    background-position: 0 -624px;
}

.f16 .bd {
    background-position: 0 -640px;
}

.f16 .be {
    background-position: 0 -656px;
}

.f16 .bf {
    background-position: 0 -672px;
}

.f16 .bg {
    background-position: 0 -688px;
}

.f16 .bh {
    background-position: 0 -704px;
}

.f16 .bi {
    background-position: 0 -720px;
}

.f16 .bj {
    background-position: 0 -736px;
}

.f16 .bm {
    background-position: 0 -752px;
}

.f16 .bn {
    background-position: 0 -768px;
}

.f16 .bo {
    background-position: 0 -784px;
}

.f16 .br {
    background-position: 0 -800px;
}

.f16 .bs {
    background-position: 0 -816px;
}

.f16 .bt {
    background-position: 0 -832px;
}

.f16 .bw {
    background-position: 0 -848px;
}

.f16 .by {
    background-position: 0 -864px;
}

.f16 .bz {
    background-position: 0 -880px;
}

.f16 .ca {
    background-position: 0 -896px;
}

.f16 .cg {
    background-position: 0 -912px;
}

.f16 .cf {
    background-position: 0 -928px;
}

.f16 .cd {
    background-position: 0 -944px;
}

.f16 .ch {
    background-position: 0 -960px;
}

.f16 .ci {
    background-position: 0 -976px;
}

.f16 .ck {
    background-position: 0 -992px;
}

.f16 .cl {
    background-position: 0 -1008px;
}

.f16 .cm {
    background-position: 0 -1024px;
}

.f16 .cn {
    background-position: 0 -1040px;
}

.f16 .co {
    background-position: 0 -1056px;
}

.f16 .cr {
    background-position: 0 -1072px;
}

.f16 .cu {
    background-position: 0 -1088px;
}

.f16 .cv {
    background-position: 0 -1104px;
}

.f16 .cy {
    background-position: 0 -1120px;
}

.f16 .cz {
    background-position: 0 -1136px;
}

.f16 .de {
    background-position: 0 -1152px;
}

.f16 .dj {
    background-position: 0 -1168px;
}

.f16 .dk {
    background-position: 0 -1184px;
}

.f16 .dm {
    background-position: 0 -1200px;
}

.f16 .do {
    background-position: 0 -1216px;
}

.f16 .dz {
    background-position: 0 -1232px;
}

.f16 .ec {
    background-position: 0 -1248px;
}

.f16 .ee {
    background-position: 0 -1264px;
}

.f16 .eg {
    background-position: 0 -1280px;
}

.f16 .eh {
    background-position: 0 -1296px;
}

.f16 .er {
    background-position: 0 -1312px;
}

.f16 .es {
    background-position: 0 -1328px;
}

.f16 .et {
    background-position: 0 -1344px;
}

.f16 .fi {
    background-position: 0 -1360px;
}

.f16 .fj {
    background-position: 0 -1376px;
}

.f16 .fm {
    background-position: 0 -1392px;
}

.f16 .fo {
    background-position: 0 -1408px;
}

.f16 .fr {
    background-position: 0 -1424px;
}

.f16 .bl,
.f16 .cp,
.f16 .mf,
.f16 .yt {
    background-position: 0 -1424px;
}

.f16 .ga {
    background-position: 0 -1440px;
}

.f16 .gb {
    background-position: 0 -1456px;
}

.f16 .sh {
    background-position: 0 -1456px;
}

.f16 .gd {
    background-position: 0 -1472px;
}

.f16 .ge {
    background-position: 0 -1488px;
}

.f16 .gg {
    background-position: 0 -1504px;
}

.f16 .gh {
    background-position: 0 -1520px;
}

.f16 .gi {
    background-position: 0 -1536px;
}

.f16 .gl {
    background-position: 0 -1552px;
}

.f16 .gm {
    background-position: 0 -1568px;
}

.f16 .gn {
    background-position: 0 -1584px;
}

.f16 .gp {
    background-position: 0 -1600px;
}

.f16 .gq {
    background-position: 0 -1616px;
}

.f16 .gr {
    background-position: 0 -1632px;
}

.f16 .gt {
    background-position: 0 -1648px;
}

.f16 .gu {
    background-position: 0 -1664px;
}

.f16 .gw {
    background-position: 0 -1680px;
}

.f16 .gy {
    background-position: 0 -1696px;
}

.f16 .hk {
    background-position: 0 -1712px;
}

.f16 .hn {
    background-position: 0 -1728px;
}

.f16 .hr {
    background-position: 0 -1744px;
}

.f16 .ht {
    background-position: 0 -1760px;
}

.f16 .hu {
    background-position: 0 -1776px;
}

.f16 .id {
    background-position: 0 -1792px;
}

.f16 .mc {
    background-position: 0 -1792px;
}

.f16 .ie {
    background-position: 0 -1808px;
}

.f16 .il {
    background-position: 0 -1824px;
}

.f16 .im {
    background-position: 0 -1840px;
}

.f16 .in {
    background-position: 0 -1856px;
}

.f16 .iq {
    background-position: 0 -1872px;
}

.f16 .ir {
    background-position: 0 -1888px;
}

.f16 .is {
    background-position: 0 -1904px;
}

.f16 .it {
    background-position: 0 -1920px;
}

.f16 .je {
    background-position: 0 -1936px;
}

.f16 .jm {
    background-position: 0 -1952px;
}

.f16 .jo {
    background-position: 0 -1968px;
}

.f16 .jp {
    background-position: 0 -1984px;
}

.f16 .ke {
    background-position: 0 -2000px;
}

.f16 .kg {
    background-position: 0 -2016px;
}

.f16 .kh {
    background-position: 0 -2032px;
}

.f16 .ki {
    background-position: 0 -2048px;
}

.f16 .km {
    background-position: 0 -2064px;
}

.f16 .kn {
    background-position: 0 -2080px;
}

.f16 .kp {
    background-position: 0 -2096px;
}

.f16 .kr {
    background-position: 0 -2112px;
}

.f16 .kw {
    background-position: 0 -2128px;
}

.f16 .ky {
    background-position: 0 -2144px;
}

.f16 .kz {
    background-position: 0 -2160px;
}

.f16 .la {
    background-position: 0 -2176px;
}

.f16 .lb {
    background-position: 0 -2192px;
}

.f16 .lc {
    background-position: 0 -2208px;
}

.f16 .li {
    background-position: 0 -2224px;
}

.f16 .lk {
    background-position: 0 -2240px;
}

.f16 .lr {
    background-position: 0 -2256px;
}

.f16 .ls {
    background-position: 0 -2272px;
}

.f16 .lt {
    background-position: 0 -2288px;
}

.f16 .lu {
    background-position: 0 -2304px;
}

.f16 .lv {
    background-position: 0 -2320px;
}

.f16 .ly {
    background-position: 0 -2336px;
}

.f16 .ma {
    background-position: 0 -2352px;
}

.f16 .md {
    background-position: 0 -2368px;
}

.f16 .me {
    background-position: 0 -2384px;
}

.f16 .mg {
    background-position: 0 -2400px;
}

.f16 .mh {
    background-position: 0 -2416px;
}

.f16 .mk {
    background-position: 0 -2432px;
}

.f16 .ml {
    background-position: 0 -2448px;
}

.f16 .mm {
    background-position: 0 -2464px;
}

.f16 .mn {
    background-position: 0 -2480px;
}

.f16 .mo {
    background-position: 0 -2496px;
}

.f16 .mq {
    background-position: 0 -2512px;
}

.f16 .mr {
    background-position: 0 -2528px;
}

.f16 .ms {
    background-position: 0 -2544px;
}

.f16 .mt {
    background-position: 0 -2560px;
}

.f16 .mu {
    background-position: 0 -2576px;
}

.f16 .mv {
    background-position: 0 -2592px;
}

.f16 .mw {
    background-position: 0 -2608px;
}

.f16 .mx {
    background-position: 0 -2624px;
}

.f16 .my {
    background-position: 0 -2640px;
}

.f16 .mz {
    background-position: 0 -2656px;
}

.f16 .na {
    background-position: 0 -2672px;
}

.f16 .nc {
    background-position: 0 -2688px;
}

.f16 .ne {
    background-position: 0 -2704px;
}

.f16 .ng {
    background-position: 0 -2720px;
}

.f16 .ni {
    background-position: 0 -2736px;
}

.f16 .nl {
    background-position: 0 -2752px;
}

.f16 .bq {
    background-position: 0 -2752px;
}

.f16 .no {
    background-position: 0 -2768px;
}

.f16 .bv,
.f16 .nq,
.f16 .sj {
    background-position: 0 -2768px;
}

.f16 .np {
    background-position: 0 -2784px;
}

.f16 .nr {
    background-position: 0 -2800px;
}

.f16 .nz {
    background-position: 0 -2816px;
}

.f16 .om {
    background-position: 0 -2832px;
}

.f16 .pa {
    background-position: 0 -2848px;
}

.f16 .pe {
    background-position: 0 -2864px;
}

.f16 .pf {
    background-position: 0 -2880px;
}

.f16 .pg {
    background-position: 0 -2896px;
}

.f16 .ph {
    background-position: 0 -2912px;
}

.f16 .pk {
    background-position: 0 -2928px;
}

.f16 .pl {
    background-position: 0 -2944px;
}

.f16 .pr {
    background-position: 0 -2960px;
}

.f16 .ps {
    background-position: 0 -2976px;
}

.f16 .pt {
    background-position: 0 -2992px;
}

.f16 .pw {
    background-position: 0 -3008px;
}

.f16 .py {
    background-position: 0 -3024px;
}

.f16 .qa {
    background-position: 0 -3040px;
}

.f16 .re {
    background-position: 0 -3056px;
}

.f16 .ro {
    background-position: 0 -3072px;
}

.f16 .rs {
    background-position: 0 -3088px;
}

.f16 .ru {
    background-position: 0 -3104px;
}

.f16 .rw {
    background-position: 0 -3120px;
}

.f16 .sa {
    background-position: 0 -3136px;
}

.f16 .sb {
    background-position: 0 -3152px;
}

.f16 .sc {
    background-position: 0 -3168px;
}

.f16 .sd {
    background-position: 0 -3184px;
}

.f16 .se {
    background-position: 0 -3200px;
}

.f16 .sg {
    background-position: 0 -3216px;
}

.f16 .si {
    background-position: 0 -3232px;
}

.f16 .sk {
    background-position: 0 -3248px;
}

.f16 .sl {
    background-position: 0 -3264px;
}

.f16 .sm {
    background-position: 0 -3280px;
}

.f16 .sn {
    background-position: 0 -3296px;
}

.f16 .so {
    background-position: 0 -3312px;
}

.f16 .sr {
    background-position: 0 -3328px;
}

.f16 .st {
    background-position: 0 -3344px;
}

.f16 .sv {
    background-position: 0 -3360px;
}

.f16 .sy {
    background-position: 0 -3376px;
}

.f16 .sz {
    background-position: 0 -3392px;
}

.f16 .tc {
    background-position: 0 -3408px;
}

.f16 .td {
    background-position: 0 -3424px;
}

.f16 .tg {
    background-position: 0 -3440px;
}

.f16 .th {
    background-position: 0 -3456px;
}

.f16 .tj {
    background-position: 0 -3472px;
}

.f16 .tl {
    background-position: 0 -3488px;
}

.f16 .tm {
    background-position: 0 -3504px;
}

.f16 .tn {
    background-position: 0 -3520px;
}

.f16 .to {
    background-position: 0 -3536px;
}

.f16 .tr {
    background-position: 0 -3552px;
}

.f16 .tt {
    background-position: 0 -3568px;
}

.f16 .tv {
    background-position: 0 -3584px;
}

.f16 .tw {
    background-position: 0 -3600px;
}

.f16 .tz {
    background-position: 0 -3616px;
}

.f16 .ua {
    background-position: 0 -3632px;
}

.f16 .ug {
    background-position: 0 -3648px;
}

.f16 .us {
    background-position: 0 -3664px;
}

.f16 .uy {
    background-position: 0 -3680px;
}

.f16 .uz {
    background-position: 0 -3696px;
}

.f16 .va {
    background-position: 0 -3712px;
}

.f16 .vc {
    background-position: 0 -3728px;
}

.f16 .ve {
    background-position: 0 -3744px;
}

.f16 .vg {
    background-position: 0 -3760px;
}

.f16 .vi {
    background-position: 0 -3776px;
}

.f16 .vn {
    background-position: 0 -3792px;
}

.f16 .vu {
    background-position: 0 -3808px;
}

.f16 .ws {
    background-position: 0 -3824px;
}

.f16 .ye {
    background-position: 0 -3840px;
}

.f16 .za {
    background-position: 0 -3856px;
}

.f16 .zm {
    background-position: 0 -3872px;
}

.f16 .zw {
    background-position: 0 -3888px;
}

.f16 .sx {
    background-position: 0 -3904px;
}

.f16 .cw {
    background-position: 0 -3920px;
}

.f16 .ss {
    background-position: 0 -3936px;
}

.f16 .nu {
    background-position: 0 -3952px;
}

table.sidebar_rank {
    width: 100%;
    border: 0;
    border-collapse: collapse;
    margin: 4px;
}

table.sidebar_rank th {
    border: 0;
    text-align: left;
    border-bottom: 1px solid #642E39;
    padding-bottom: 0px;
    font-weight: normal;
}

table.sidebar_rank tr {
    border: 0;
    text-align: left;
}

table.sidebar_rank td {
    border: 0;
    text-align: left;
    border-bottom: 1px solid #642E39;
    padding-bottom: 3px;
    padding-top: 3px;
}

.ref-reward-dropdown {
    position: relative;
    display: inline-block;
}

.ref-reward-dropdown-content {
    display: none;
    position: relative;
    background-color: #f9f9f9;
    min-width: 150px;
    overflow: hidden;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 2500;
    overflow-y: auto;
    max-height: 500px;
}

.ref-reward-dropdown-content a {
    color: black;
    padding: 6px 8px;
    text-decoration: none;
    display: block;
}

.ref-reward-dropdown-content a:hover {
    background-color: #f1f1f1
}

.ref-reward-dropdown:hover .ref-reward-dropdown-content {
    display: block;
}

.item_size_12 {
    font-size: 12px;
}

.item_font_family {
    font-family: tahoma;
}

.item_white {
    color: #FFFFFF;
}

.item_light_green {
    color: #00FF00;
}

.item_light_blue {
    color: #80B2FF;
}

.item_light_blue_2 {
    color: #3366FF;
}

.item_blue {
    color: #0066FF;
}

.item_pink {
    color: #FF1493;
}

.item_yellow {
    color: #FADE09;
}

.item_yellow_2 {
    color: #FFCC00;
}

.item_red {
    color: #FF0000;
}

.item_dark_red {
    color: #800000;
}

.item_dark_red_background {
    background-color: #800000;
}

.item_purple {
    color: #800080;
}

.item_socket {
    color: #B266FF;
}

.item_grey {
    color: #808080;
}

.item_yellow_title {
    color: #FFCC19;
}

.item_exe_title {
    color: #008000;
}

.item_socket_title {
    color: #B266FF;
}

.item_socket_exe_title {
    color: #7401DF;
}

.item_ancient_title {
    color: #01DF01;
}

.item_ancient_background {
    background-color: #0000FF;
}

.lk-title {
    padding: 0px 30px 30px 30px;
}

.lk-title button {
    float: right;
    margin-left: 17px;
    margin-top: 3px;
}

.lk-title .coins {
    float: right;
    color: #ff9b39;
    font-weight: bold;
    font-size: 14px;
    margin-top: 3px;
    display: inline-block;
    margin-bottom: 10px;
}

.lk-title .username {
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
}

.lk-coins {
    padding: 0px 30px 15px 30px;
}

.lk-coins a {
    float: right;
    margin-left: 17px;
    margin-top: 3px;
}

.lk-coins img {
    float: right;
    margin-left: 17px;
    margin-top: 3px;
}

.lk-coins .coins {
    float: right;
    color: #ff9b39;
    font-weight: bold;
    font-size: 14px;
    margin-top: 3px;
    display: inline-block;
    margin-bottom: 10px;
}

.lk-coins .username {
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    __text-transform: uppercase;
}

.lk-form li {
    position: relative;
}

.lk-form li a {
    display: block;
    padding: 10px 25px 10px 60px;
    text-decoration: none;
    color: #95b2bc;
    font-size: 14px;
    border-top: 1px solid rgba(170, 115, 132, 0.2);
}

.lk-form li b {
    font-weight: normal;
    color: #00cd52;
}

.lk-form li span {
    float: right;
}

.lk-form li:hover {
    background: rgba(170, 115, 132, 0.2);
    box-shadow: 0px 11px 31px -9px rgba(0, 0, 0, 0.1);
}

.lk-form li:before {
    content: "";
    background: url(../img/nav.png) -5px 0px no-repeat;
    height: 8px;
    width: 5px;
    margin-right: 15px;
    position: absolute;
    left: 35px;
    top: 13px;
    opacity: 0.3;
}

.lk-form li:last-child:before {
    content: "";
    background: url(../img/close-icon.png) 0px 0px no-repeat;
    height: 8px;
    width: 8px;
    opacity: 0.4;
}

#inventoryc {
    background-image: url('../img/inventoryc.png');
    width: 400px;
    height: 320px;
    text-align: center;
    display: inline-block;
    position: relative;
}

#inventoryc>img {
    position: absolute;
    top: 74px;
    left: 130px;
    border-radius: 50%;
    border: 3px solid #24314e;
}

#inventoryc>div {
    position: absolute;
    background-repeat: no-repeat;
    background-position: center center;
}

#in_weapon {
    width: 90px;
    height: 136px;
    bottom: 0;
    left: -6px;
}

#in_shield {
    width: 90px;
    height: 136px;
    bottom: 0;
    right: -4px;
}

#in_helm {
    width: 68px;
    height: 68px;
    top: 2px;
    left: 66px;
}

#in_armor {
    width: 72px;
    height: 110px;
    top: 72px;
    left: 40px;
}

#in_pants {
    width: 68px;
    height: 68px;
    bottom: 8px;
    left: 82px;
}

#in_gloves {
    width: 68px;
    height: 68px;
    top: 116px;
    right: 54px;
}

#in_boots {
    width: 68px;
    height: 68px;
    bottom: 8px;
    right: 82px;
}

#in_wings {
    width: 138px;
    height: 102px;
    top: 8px;
    right: -2px;
}

#in_zoo {
    width: 68px;
    height: 68px;
    top: 2px;
    left: -2px;
}

#in_pendant {
    width: 38px;
    height: 38px;
    top: 20px;
    right: 136px;
}

#in_ring1 {
    width: 38px;
    height: 38px;
    bottom: 92px;
    left: 96px;
}

#in_ring2 {
    width: 38px;
    height: 38px;
    bottom: 92px;
    right: 96px;
}

#in_pentagram {
    width: 96px;
    height: 96px;
    bottom: -6px;
    right: 152px;
}

#in_ear1 {
    width: 32px;
    height: 32px;
    top: 72px;
    left: 0px;
}

#in_ear2 {
    width: 32px;
    height: 32px;
    top: 72px;
    left: 115px;
}

.filter-left {
    float: left;
    color: #464646;
    position: static;
    margin: 1px 6px 1px 1px;
}

.select-imitation:after {
    top: 14px;
}

.select-imitation {
    background-color: #F0F0F0;
    width: 127px;
    padding: 4px 16px;
    cursor: pointer;
    border-top: 3px solid #fbfbfb;
    box-shadow: 0 -1px 0 #f0f0f0;
    border-radius: 16px;
}

.sel-value {
    white-space: nowrap;
}

.select-imitation-list {
    position: absolute;
    z-index: 100;
    background-color: #F9F9F9;
    border: 1px #E9EAEB solid;
    box-shadow: inset 0 1px 0 0 #FFFFFF, 0 1px 2px 0 #b3b3b3;
    padding: 2px;
    display: none;
    white-space: nowrap;
    margin-top: -1px;
    width: 150px;
    max-height: 182px;
    overflow-x: hidden;
    overflow-y: auto;
}

.select-imitation-list a {
    font-size: 11px;
    display: block;
    padding: 3px 12px;
}

.select-imitation-list a:hover {
    text-decoration: none;
    background-color: #d6d6d7;
}

.non:after {
    content: none;
}

/* Modern Fairy Throne responsive shell
-----------------------------------------------------------------------------*/
:root {
    --ft-bg: #0a0a0a;
    --ft-panel: rgba(10, 10, 10, 0.68);
    --ft-panel-soft: rgba(255, 255, 255, 0.055);
    --ft-border: rgba(212, 175, 55, 0.24);
    --ft-gold: #d4af37;
    --ft-gold-hover: #e6c65a;
    --ft-dark-hover: #14110a;
    --ft-gold-soft: rgba(212, 175, 55, 0.16);
    --ft-text: #e7e0d0;
    --ft-muted: #b9ad94;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--ft-bg);
    color: var(--ft-text);
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    line-height: 1.6;
}

body::selection {
    background: var(--ft-gold);
    color: #000;
}

a {
    color: var(--ft-gold);
}

a:hover,
a:focus {
    color: #f6d76f !important;
}

h1,
h2,
h3 {
    color: #fff;
    font-family: 'Cinzel', serif;
    letter-spacing: 0.04em;
}

img {
    max-width: 100%;
    height: auto;
}

input,
textarea,
select {
    width: 100%;
    max-width: 100%;
    background: rgba(0, 0, 0, 0.42);
    border: 1px solid var(--ft-border);
    border-radius: 999px;
    color: #fff;
}

.button,
.loginModalTrigger,
#mobileMenuButton,
.login-modal-submit,
.toTop,
a.bg-gold,
button.bg-gold,
a.bg-black\/40,
button.bg-black\/40,
a.bg-gold\/10,
button.bg-gold\/10 {
    background: linear-gradient(135deg, var(--ft-gold), #f8d96d);
    border-radius: 999px;
    color: #080808;
    font-weight: 700;
    box-shadow: 0 0 24px rgba(212, 175, 55, 0.28);
}

.bg-gold:hover,
.login-modal-submit:hover,
button.bg-gold:hover,
a.bg-gold:hover {
    background: var(--ft-dark-hover) !important;
    color: var(--ft-gold-hover) !important;
    border-color: var(--ft-gold-hover) !important;
    box-shadow: 0 0 26px rgba(212, 175, 55, 0.35);
}

.button,
.loginModalTrigger,
#mobileMenuButton,
.login-modal-submit,
a.bg-gold,
button.bg-gold,
a.bg-black\/40,
button.bg-black\/40,
a.bg-gold\/10,
button.bg-gold\/10,
.toTop {
    background: var(--ft-gold) !important;
    border-color: var(--ft-gold) !important;
    color: #050505 !important;
    box-shadow: 0 0 24px rgba(212, 175, 55, 0.28);
}

#mobileMenuButton {
    justify-content: center;
    text-align: center;
}

#mobileMenuButton span:not(.sr-only) {
    margin: 0;
}

#mobileMenuButton span,
.toTop {
    color: #050505 !important;
}

#mobileMenuButton .bg-gold {
    display: block;
    width: 1.25rem;
    height: 2px;
    background: #050505 !important;
}

.bg-black\/40:hover,
.bg-gold\/10:hover,
button.bg-black\/40:hover,
a.bg-black\/40:hover,
button.bg-gold\/10:hover,
a.bg-gold\/10:hover {
    background: var(--ft-gold-hover) !important;
    color: var(--ft-dark-hover) !important;
    border-color: var(--ft-gold-hover) !important;
    box-shadow: 0 0 26px rgba(212, 175, 55, 0.35);
}

.button:not(.bg-gold):hover,
.loginModalTrigger:not(.bg-gold):hover,
#mobileMenuButton:hover,
a.bg-black\/40:hover,
button.bg-black\/40:hover,
a.bg-gold\/10:hover,
button.bg-gold\/10:hover {
    background: var(--ft-gold-hover);
    color: var(--ft-dark-hover) !important;
    border-color: var(--ft-gold-hover);
}

.slider .navigation .dot {
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.8) !important;
    box-shadow: none;
    color: transparent !important;
}

.slider .navigation .dot.active {
    background: var(--ft-gold) !important;
}

.wrapper,
.web-container,
.content,
.sidebar,
.footer,
.footer-block-t,
.footer-block-b,
.footer-block-l,
.footer-block-r {
    width: auto;
    max-width: none;
}

.wrapper,
.web-container {
    min-height: 0;
    position: relative;
}

/*
 * Triple column: center raised vs sidebars (--ft-triple-overlap).
 */
.ft-triple-layout {
    --ft-triple-overlap: 3.75rem;
    /* Lower three-column side rails (narrower = larger center gutter) */
    --ft-sidebar-rail: min(14.5rem, 16vw);
}

:root {
    /* Мінімальна висота смузі героя (не фіксуємо max — висота від контенту панелей) */
    --ft-hero-panels-row-min-h: clamp(18rem, 34vh, 28rem);
    --ft-hero-panels-strip-pad-b: 0.5rem;
    --ft-hero-panels-strip-inner-h: calc(var(--ft-hero-panels-row-min-h) + 0.75rem);
    /* Зовнішня висота смуги = внутрішня + padding-bottom (border-box) */
    --ft-hero-panels-strip-outer-h: calc(var(--ft-hero-panels-strip-inner-h) + var(--ft-hero-panels-strip-pad-b));
    /* Однакова ширина лівого/правого слота лише від vw+rem — не залежить від стану сусідньої панелі (без JS lock). */
    --ft-hero-panel-slot-w: min(36rem, max(17rem, 38vw));
}

/*
 * Zoom лише всередині .ft-hero-zoom-inner: зовнішня #fairyThroneHero лишається на всю ширину,
 * щоб згортання панелей не зсувало нижні секції (layout + scrollbar).
 */
#fairyThroneHero:not(.hidden) {
    overflow-x: clip;
    max-width: 100%;
}

#fairyThroneHero:not(.hidden) .ft-hero-zoom-inner {
    /* На <lg без zoom — панелі візуально ширші, краще поміщаються кнопки; zoom лише на великих екранах */
    zoom: 1;
    display: flow-root;
    width: 100%;
    min-width: 0;
    overflow-x: clip;
    box-sizing: border-box;
}

.ft-hero-slot {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    box-sizing: border-box;
}

/* Внутрішні зміни героя не поширюють layout на siblings нижче (часткова ізоляція; висота слота все одно з контенту). */
#ftHeroSlot.ft-hero-slot {
    contain: layout;
}

@media (max-width: 1023px) {
    /* Вужчі поля секції — більше ширини під hero-картки на планшетах/телефонах */
    #fairyThroneHero:not(.hidden) {
        padding-inline: 0.625rem;
        padding-top: 2rem;
        padding-bottom: 1.5rem;
    }

    @media (min-width: 640px) {
        #fairyThroneHero:not(.hidden) {
            padding-inline: 0.75rem;
        }
    }
}

@media (min-width: 1024px) {
    #fairyThroneHero:not(.hidden) .ft-hero-zoom-inner {
        zoom: 0.7;
    }

    /*
     * Chronicles (.ft-triple-overlap) заїжджає вгору на hero — без додаткового padding-bottom
     * темний блок перекриває низ карток. Резерв = overlap + базовий pb секції (lg:pb-12 ≈ 3rem).
     */
    #fairyThroneHero:not(.hidden) {
        padding-bottom: calc(1.25rem + var(--ft-triple-overlap));
    }

    .ft-triple-layout > aside.ft-sidebar-col.left-sidebar,
    .ft-triple-layout > aside.ft-sidebar-col.right-sidebar {
        width: var(--ft-sidebar-rail) !important;
        max-width: var(--ft-sidebar-rail);
        flex: 0 0 var(--ft-sidebar-rail) !important;
        min-width: 0;
        margin-top: calc(-1 * var(--ft-triple-overlap));
        padding-top: calc(var(--ft-triple-overlap) * 2);
    }

    .ft-triple-layout .ft-main-col {
        margin-top: calc(-1 * var(--ft-triple-overlap));
    }

    .ft-triple-layout .ft-main-shell {
        box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45), 0 0 35px rgba(212, 175, 55, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    }

    .ft-triple-layout .ft-main-shell .engine-content {
        flex: 1 1 auto;
        min-height: 0;
    }

    /*
     * Нижній триблок (сайдбари + Chronicles): grid з фіксованими крайніми колонками —
     * зміни ширини/контенту центру не перерозподіляють бокові рейки.
     */
    .web-container.ft-triple-layout {
        display: grid;
        grid-template-columns: var(--ft-sidebar-rail) minmax(0, 1fr) var(--ft-sidebar-rail);
        align-items: start;
        column-gap: 0.5rem;
    }

    .web-container.ft-triple-layout > aside.left-sidebar {
        grid-column: 1;
        grid-row: 1;
    }

    .web-container.ft-triple-layout > main.ft-main-col {
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
    }

    .web-container.ft-triple-layout > aside.right-sidebar {
        grid-column: 3;
        grid-row: 1;
    }

    /* Верхні hero-панелі: grid (ліва | 1fr «вітрина» | права). Висота ряду = контент, без зайвого «повітря» знизу. */
    #fairyThroneHero:not(.hidden) .ft-hero-panels-strip {
        direction: ltr;
        display: grid;
        grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
        align-items: start;
        min-height: 0;
        max-height: none;
        height: auto;
        padding-bottom: var(--ft-hero-panels-strip-pad-b);
        overflow: visible;
        box-sizing: border-box;
        padding-inline: 0.1875rem;
    }

    #fairyThroneHero:not(.hidden) .ft-hero-left-group,
    #fairyThroneHero:not(.hidden) .ft-hero-right-group {
        min-height: 0;
        max-height: none;
        align-self: start;
    }

    /* Tailwind min-h на слайдері інакше тягне висоту панелі повз max-height смуги героя */
    #fairyThroneHero .hero-panel-right .hero-slider-content {
        min-height: 0;
        flex: 1 1 auto;
    }

    #fairyThroneHero .ft-hero-rail-slot {
        display: flex;
        flex: 0 0 2.25rem;
        width: 2.25rem;
        min-width: 2.25rem;
        max-width: 2.25rem;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        align-self: stretch;
        overflow: hidden;
        box-sizing: border-box;
    }

    #fairyThroneHero .ft-hero-rail-slot .ft-hero-edge-toggle--rail {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: 2.75rem;
        min-height: 2.75rem;
        max-height: 2.75rem;
    }

    /* Ліва рейка + ліва панель — один flex-рядок; grid-колонка 1 — позиція не залежить від ширини правої групи. */
    #fairyThroneHero .ft-hero-left-group {
        grid-column: 1;
        justify-self: start;
        box-sizing: border-box;
        min-width: 0;
    }

    /* width/min/max/flex-basis = var; слот з тим самим border-radius + overflow — кліп тіні/backdrop під анімацією ширини (без «привида»). */
    .ft-hero-panel-slot--left,
    .ft-hero-panel-slot--right {
        flex: 0 0 var(--ft-hero-panel-slot-w);
        flex-basis: var(--ft-hero-panel-slot-w);
        width: var(--ft-hero-panel-slot-w);
        min-width: var(--ft-hero-panel-slot-w);
        max-width: var(--ft-hero-panel-slot-w);
        align-self: stretch;
        min-height: 0;
        max-height: 100%;
        border-radius: 1.5rem;
        overflow: hidden;
        isolation: isolate;
        transition:
            flex-basis 0.38s cubic-bezier(0.4, 0, 0.2, 1),
            width 0.38s cubic-bezier(0.4, 0, 0.2, 1),
            min-width 0.38s cubic-bezier(0.4, 0, 0.2, 1),
            max-width 0.38s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.32s ease;
    }

    /* Tailwind w-full на слотах інакше перебиває width і права «плаває» при згортанні лівої (залежність від ширини flex-батька). */
    #fairyThroneHero #ftHeroPanelLeftSlot.ft-hero-panel-slot--left,
    #fairyThroneHero #ftHeroPanelRightSlot.ft-hero-panel-slot--right {
        width: var(--ft-hero-panel-slot-w);
        min-width: var(--ft-hero-panel-slot-w);
        max-width: var(--ft-hero-panel-slot-w);
    }

    /* Ліва: прокрутка всередині .hero-copy-col — кнопки CTA не зникають під clip фіксованої смуги героя */
    #fairyThroneHero .ft-hero-panel-slot--left > .hero-panel.hero-panel-left {
        display: flex;
        flex-direction: column;
        min-width: 0;
        min-height: 0;
        max-height: 100%;
        width: 100%;
        overflow: hidden;
        transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
        transform: translateX(0);
    }

    #fairyThroneHero .hero-panel-left .hero-copy-col {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    #fairyThroneHero .hero-panel-left .hero-slider-cta {
        flex-shrink: 0;
        margin-top: auto;
        position: sticky;
        bottom: 0;
        z-index: 2;
        padding-top: 1.25rem;
        padding-bottom: 0.25rem;
        background: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.55) 40%,
            rgba(0, 0, 0, 0.82) 100%
        );
    }

    #fairyThroneHero .ft-hero-panel-slot--right > .hero-panel {
        min-width: 0;
        min-height: 0;
        max-height: 100%;
        width: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
        transform: translateX(0);
    }

    /* Без max-height:0 (миттєвий клац). Згорнутий слот не має задавати intrinsic cross-size з усього тексту —
     * інакше align-items:stretch роздуває праву панель (див. debug: leftSlotH≈rightSlotH після transitionend). */
    #fairyThroneHero.ft-hero-left-collapsed .ft-hero-panel-slot--left {
        flex: 0 0 0;
        flex-basis: 0;
        width: 0;
        min-width: 0;
        max-width: 0;
        border-radius: 0;
        min-height: 0;
        align-self: flex-start;
        max-height: var(--ft-hero-panels-strip-inner-h);
        opacity: 0;
        pointer-events: none;
    }

    #fairyThroneHero.ft-hero-left-collapsed .ft-hero-panel-slot--left .hero-panel-left {
        min-height: 0;
        transform: translateX(-100%);
    }

    #fairyThroneHero.ft-hero-right-collapsed .ft-hero-panel-slot--right {
        flex: 0 0 0;
        flex-basis: 0;
        width: 0;
        min-width: 0;
        max-width: 0;
        border-radius: 0;
        min-height: 0;
        align-self: flex-start;
        max-height: var(--ft-hero-panels-strip-inner-h);
        opacity: 0;
        pointer-events: none;
    }

    #fairyThroneHero.ft-hero-right-collapsed .ft-hero-panel-slot--right .hero-panel-right {
        min-height: 0;
        transform: translateX(100%);
    }

    /* Лише одна панель: слот справа (слайдер) обмежуємо по висоті — інакше align-items:stretch тягне зайвий cross-size.
     * Лівий слот без max-height: там копі + таймер + CTA вищі за clamp; інакше overflow:hidden на слоті обрізає низ. */
    #fairyThroneHero.ft-hero-left-collapsed:not(.ft-hero-right-collapsed) .ft-hero-panel-slot--right {
        max-height: var(--ft-hero-panels-strip-inner-h);
        min-height: 0;
    }

    #fairyThroneHero.ft-hero-right-collapsed:not(.ft-hero-left-collapsed) .ft-hero-panel-slot--left {
        max-height: none;
        min-height: 0;
    }

    #fairyThroneHero.ft-hero-left-collapsed:not(.ft-hero-right-collapsed) .ft-hero-panel-slot--right .hero-panel-right,
    #fairyThroneHero.ft-hero-right-collapsed:not(.ft-hero-left-collapsed) .ft-hero-panel-slot--left .hero-panel-left {
        min-height: 0;
    }

    .ft-hero-edge-toggle {
        align-items: center;
        justify-content: center;
    }

    /* Права панель + права рейка — дзеркально до .ft-hero-left-group; grid-колонка 3. */
    #fairyThroneHero .ft-hero-right-group {
        grid-column: 3;
        justify-self: end;
        box-sizing: border-box;
        min-width: 0;
    }

    #fairyThroneHero .ft-hero-edge-toggle--rail {
        box-sizing: border-box;
    }

    #fairyThroneHero #ftToggleHeroLeft.ft-hero-edge-toggle--rail {
        border-radius: 0.7rem 0.3rem 0.3rem 0.7rem;
    }

    #fairyThroneHero #ftToggleHeroRight.ft-hero-edge-toggle--rail {
        border-radius: 0.3rem 0.7rem 0.7rem 0.3rem;
    }
}

@media (max-width: 1023px) {
    #fairyThroneHero.ft-hero-left-collapsed .ft-hero-panel-slot--left,
    #fairyThroneHero.ft-hero-right-collapsed .ft-hero-panel-slot--right {
        flex: none !important;
        max-width: none !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    #fairyThroneHero.ft-hero-left-collapsed .ft-hero-panel-slot--left .hero-panel-left,
    #fairyThroneHero.ft-hero-right-collapsed .ft-hero-panel-slot--right .hero-panel-right {
        transform: none !important;
    }
}

@media (min-width: 1280px) {
    :root {
        --ft-hero-panel-slot-w: min(42rem, max(18rem, 34vw));
    }

    .web-container.ft-triple-layout {
        column-gap: 0.75rem;
    }
}

/*
 * Середні десктопи (1024–1599px): фіксована смуга героя + zoom 0.7 давали обрізання CTA / слайдера;
 * трохи більша висота ряду та менший «стиск» zoom — панелі не «тягнуться» за контентом за межі смуги.
 * Проміжок між лівою/правою групами: середня grid-колонка була 1fr (порожній «розпір») — тут 0, gap 0;
 * ширина слотів панелей (--ft-hero-panel-slot-w) не змінюється.
 */
@media (min-width: 1024px) and (max-width: 1599.98px) {
    :root {
        --ft-hero-panels-row-min-h: clamp(19rem, 36vh, 30rem);
    }

    #fairyThroneHero:not(.hidden) .ft-hero-zoom-inner {
        zoom: 0.76;
    }

    #fairyThroneHero:not(.hidden) .ft-hero-panels-strip {
        gap: 0;
        column-gap: 0;
        grid-template-columns: minmax(0, auto) minmax(0, 0px) minmax(0, auto);
    }

    .header-auth-btn {
        min-width: 0;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    #fairyThroneHero .hero-panel-slider .slider .slides .slide-info .slide-text p {
        font-size: 0.82rem;
        line-height: 1.45;
    }
}

/* Hero panel carousel — fluid; JS uses translate in px (see initSlider) */
.hero-panel-slider {
    position: relative;
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.hero-panel-slider .slider {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
    min-height: min(20rem, 44vh);
    max-height: min(26rem, 50vh);
    height: auto;
    border-radius: 1.25rem;
    box-shadow:
        inset 0 0 90px rgba(0, 0, 0, 0.72),
        0 0 0 1px rgba(212, 175, 55, 0.2);
    overflow: hidden;
    position: relative;
}

.hero-panel-slider .slider .slides {
    position: relative;
    flex: 1 1 auto;
    height: 100%;
    min-height: 11rem;
    transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.hero-panel-slider .slider .slides .slide {
    float: none;
    position: relative;
    flex: 0 0 auto;
    height: 100%;
    min-height: 11rem;
    border: 1px solid rgba(212, 175, 55, 0.22);
    background-size: cover;
    background-position: center;
    box-sizing: border-box;
}

.hero-panel-slider .slider .slides .slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    box-shadow: inset 0 0 70px rgba(0, 0, 0, 0.55);
    pointer-events: none;
}

.hero-panel-slider .slider .slides .slide::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient(185deg, transparent 38%, rgba(5, 5, 5, 0.9) 100%);
    pointer-events: none;
}

.hero-panel-slider .slider .slides .slide-info {
    position: relative;
    z-index: 4;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: stretch;
    height: 100%;
    min-height: inherit;
    padding: 1.15rem 1.2rem 1.25rem;
    opacity: 0;
    transition: opacity 0.45s ease;
}

.hero-panel-slider .slider .slides .slide.active .slide-info {
    opacity: 1;
}

.hero-panel-slider .slider .slides .slide-info h2 {
    font-family: Cinzel, Georgia, serif;
    font-size: clamp(1.25rem, 2.4vw, 1.75rem);
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #f5f0e6;
    margin: 0 0 0.55rem;
    text-shadow: 0 0 22px rgba(212, 175, 55, 0.35);
}

.hero-panel-slider .slider .slides .slide-info .slide-text {
    width: 100%;
    max-width: 28rem;
    margin-left: 0;
    margin-bottom: 0.75rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.65rem;
    background: rgba(0, 0, 0, 0.58);
    border: 1px solid rgba(212, 175, 55, 0.18);
    line-height: 1.55;
}

.hero-panel-slider .slider .slides .slide-info .slide-text::before {
    display: none;
}

.hero-panel-slider .slider .slides .slide-info .slide-text p {
    margin: 0;
    color: #e7e2d8;
    font-size: 0.9rem;
}

.hero-panel-slider .slider .slides .slide-info .slide-i {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
}

.hero-panel-slider .slider .slides .slide-info .slide-date {
    font-size: 0.8rem;
    color: #d4af37;
    letter-spacing: 0.04em;
}

.hero-panel-slider .slider .slides .slide-info .slide-date span {
    font-size: 1rem;
    font-weight: 700;
    color: #f0d78c;
}

.hero-panel-slider .slider .slides .slide-info .button {
    border-radius: 999px;
    padding: 0.45rem 1rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.hero-panel-slider .slider .arrows {
    position: absolute;
    top: 50%;
    margin-top: -1.375rem;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 999px;
    background: rgba(10, 10, 10, 0.72) !important;
    cursor: pointer;
    z-index: 12;
    opacity: 0.65;
    transition:
        opacity 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease;
    box-shadow: 0 0 18px rgba(0, 0, 0, 0.45);
}

.hero-panel-slider .slider .arrows:hover,
.hero-panel-slider .slider .arrows:focus-visible {
    opacity: 1;
    border-color: rgba(212, 175, 55, 0.75);
    outline: none;
}

.hero-panel-slider .slider .prev {
    left: 0.5rem;
    right: auto;
}

.hero-panel-slider .slider .next {
    right: 0.5rem;
    left: auto;
}

.hero-panel-slider .slider .prev::after,
.hero-panel-slider .slider .next::after {
    display: block;
    font-size: 1.35rem;
    line-height: 1;
    color: #d4af37;
    font-weight: 700;
}

.hero-panel-slider .slider .prev::after {
    content: "\2039";
}

.hero-panel-slider .slider .next::after {
    content: "\203a";
}

.hero-panel-slider .slider .navigation {
    bottom: 0.65rem;
    left: 0;
    right: 0;
    z-index: 12;
}

.hero-panel-slider .slider:hover .next,
.hero-panel-slider .slider:hover .prev {
    opacity: 0.92;
}

/* Відступ між блоком онлайну/часу та віджетом Events (права колонка) */
.right-sidebar .status-block + .widget {
    margin-top: 1.75rem;
}

@media (min-width: 1024px) {
    .right-sidebar .status-block + .widget {
        margin-top: 2.25rem;
    }
}

.content,
.sidebar {
    background: transparent;
    padding-top: 0;
    line-height: inherit;
}

.content a {
    text-decoration: none;
}

.content-shell,
.widget,
.panel-general,
.panel-sidebar,
.panel-addstats,
.panel-downloads,
.news-article,
.myaccount-table,
.general-table-ui,
.rankings-table {
    border: 1px solid var(--ft-border);
    background: var(--ft-panel);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(14px);
}

.content-shell {
    overflow: hidden;
}

.engine-content {
    color: var(--ft-text);
}

.engine-content > *:first-child {
    margin-top: 0;
}

.content-page {
    background: transparent;
    padding: 0;
    color: var(--ft-text);
}

.content-page img {
    max-width: 100%;
}

.content-title {
    height: auto;
    background: transparent;
    padding: 0;
}

.content-title h1,
.content-title h2,
.content-title h3 {
    color: var(--ft-gold);
    font-size: 16px;
    margin: 0;
}

.menu {
    display: flex;
    height: auto;
    flex-direction: column;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.menu li {
    margin: 0;
}

.menu li a::before,
.menu a::after {
    display: none;
}

.menu a {
    display: block;
    height: auto;
    line-height: 1.2;
    padding: 13px 16px;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--ft-text);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.menu a:hover,
.menu .active a {
    border-color: var(--ft-border);
    background: var(--ft-gold-soft);
    color: var(--ft-gold) !important;
}

.menu .ft-admincp-nav-button {
    border-color: rgba(212, 175, 55, 0.7);
    background: var(--ft-gold);
    color: #050505 !important;
    box-shadow: 0 0 22px rgba(212, 175, 55, 0.24);
}

.menu .ft-admincp-nav-button:hover,
.menu .ft-admincp-nav-button:focus-visible {
    border-color: var(--ft-gold-hover);
    background: var(--ft-dark-hover);
    color: var(--ft-gold-hover) !important;
}

#mainNavigation.is-open {
    display: block;
}

@media (min-width: 1024px) {
    #mainNavigation.is-open {
        display: flex;
    }

    header #mainNavigation {
        justify-content: center;
    }

    header #mainNavigation .menu {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 6px 14px;
    }

    header #mainNavigation .menu a {
        padding: 11px 18px;
        font-size: 13px;
        letter-spacing: 0.11em;
    }
}

.login-modal-form {
    display: grid;
    gap: 18px;
}

.login-modal-field {
    display: grid;
    gap: 8px;
    margin: 0;
}

.login-modal-label {
    display: block;
    color: #a8a29e;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    line-height: 1;
    text-transform: uppercase;
}

.login-modal-input {
    display: block;
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 20px;
    border: 1px solid var(--ft-border);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.62);
    color: #fff;
    font-size: 15px;
    line-height: 48px;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.login-modal-input:focus {
    border-color: var(--ft-gold);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.28);
}

.login-modal-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 8px;
}

.login-modal-links {
    font-size: 14px;
    line-height: 1.8;
}

.login-modal-submit {
    flex: 0 0 auto;
    min-width: 118px;
    padding: 13px 24px;
    border: 1px solid var(--ft-gold);
    border-radius: 999px;
    background: var(--ft-gold);
    color: #000;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.login-modal-submit:hover {
    background: var(--ft-dark-hover);
    color: var(--ft-gold-hover);
}

.ft-login-page {
    max-width: 26rem;
    margin-top: 1rem;
}

.header-actions {
    align-items: stretch;
}

.header-auth-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    min-height: 44px;
    text-align: center;
}

.header-account {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.header-account .header-account-logout {
    min-width: 0;
}

@media (max-width: 1023.98px) {
    .header-account .header-auth-btn.header-account-user {
        min-width: 0;
    }

    .header-account .header-auth-btn.header-account-logout {
        min-width: 0;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
}

.launch-countdown {
    display: grid;
    gap: 16px;
    max-width: 620px;
    margin-top: 26px;
    padding: 18px;
    border: 1px solid rgba(212, 175, 55, 0.25);
    border-radius: 24px;
    background: rgba(0, 0, 0, 0.38);
    box-shadow: 0 0 28px rgba(212, 175, 55, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
}

.launch-countdown-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.launch-countdown-heading span {
    color: var(--ft-gold);
    font-family: 'Cinzel', serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.launch-countdown-heading strong {
    color: var(--ft-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.launch-countdown-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.launch-countdown-grid div {
    padding: 14px 10px;
    border: 1px solid rgba(212, 175, 55, 0.18);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.04);
    text-align: center;
}

.launch-countdown-grid strong {
    display: block;
    color: var(--ft-gold-hover);
    font-family: 'Cinzel', serif;
    font-size: clamp(24px, 4vw, 36px);
    line-height: 1;
    text-shadow: 0 0 16px rgba(212, 175, 55, 0.28);
}

.launch-countdown-grid span {
    display: block;
    margin-top: 8px;
    color: var(--ft-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.download-block {
    margin-bottom: 20px;
}

.download-block a {
    min-height: 92px;
    border: 1px solid var(--ft-border);
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.24), rgba(124, 45, 18, 0.18)), rgba(0, 0, 0, 0.72);
    box-shadow: 0 0 30px rgba(212, 175, 55, 0.18);
}

.download-block a span {
    padding-left: 0;
    color: #fff;
    text-align: center;
}

.download-block a b {
    color: var(--ft-gold);
}

.widget {
    min-height: 0;
    margin-bottom: 20px;
    padding: 22px;
    border-radius: 24px;
    color: var(--ft-text);
}

.red-light,
.red-dark {
    background: var(--ft-panel);
}

.widget-title {
    margin-bottom: 18px;
    color: var(--ft-gold);
    font-family: 'Cinzel', serif;
    font-size: 15px;
    letter-spacing: 0.12em;
    text-shadow: 0 0 18px rgba(212, 175, 55, 0.28);
}

.widget-title::after {
    display: none;
}

.widget-title:after,
.widget::before,
.widget::after,
.red-light::before,
.red-light::after,
.red-dark::before,
.red-dark::after {
    content: none !important;
    display: none !important;
}

.widget-title span,
.widget-title a {
    color: var(--ft-muted);
}

.ft-account-widget .ft-account-widget-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--ft-border);
}

.ft-account-widget-meta {
    min-width: 0;
    flex: 1 1 auto;
}

.ft-account-kicker {
    margin: 0;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--ft-gold);
}

.ft-account-name {
    margin: 0;
    font-family: 'Cinzel', Georgia, serif;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--ft-gold);
    word-break: break-word;
}

.ft-account-name-badge {
    flex: 0 1 auto;
    max-width: 58%;
    padding: 8px 14px;
    border: 1px solid rgba(212, 175, 55, 0.38);
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.1);
    font-size: 0.8rem;
    line-height: 1.1;
    text-align: right;
    overflow-wrap: anywhere;
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.12);
}

.ft-account-logout {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border: 1px solid rgba(212, 175, 55, 0.38);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.35);
    color: var(--ft-gold);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
}

.ft-account-logout:hover {
    border-color: var(--ft-gold);
    background: var(--ft-gold-soft);
    color: var(--ft-gold-hover);
}

.l-input,
.b-input {
    width: 100%;
    height: auto;
    padding: 0;
}

.l-input input,
.b-input input {
    width: 100%;
    padding: 12px 16px;
}

.buttons {
    gap: 12px;
}

.lost a {
    color: var(--ft-muted);
}

.top-block,
.events,
.panel-usercp ul,
.footer-menu,
.f-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.top-list,
.top-title,
.events li,
.panel-usercp ul li {
    border-bottom: 1px solid rgba(212, 175, 55, 0.13);
}

.panel-usercp ul li:last-child {
    border-bottom: none;
}

.ft-account-widget .panel-usercp .usercp-menu-item {
    font-size: 12px;
    letter-spacing: 0.04em;
}

/* Sidebar rankings: #+flag зліва, Name по центру, LvL/Score справа */
.top-block-sidebar > .top-title,
.top-block-sidebar > .top-list {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    column-gap: 0.75rem;
    row-gap: 0;
    justify-items: start;
    align-items: center;
    padding: 10px 12px 10px 0;
    min-height: 42px;
    height: auto;
    box-sizing: border-box;
}

.top-block-sidebar .top-rank-with-flag {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    gap: 0;
    flex-shrink: 0;
}

/* Col 3: LvL / Score — правий край рядка */
.top-block-sidebar > .top-title > .top-lvl,
.top-block-sidebar > .top-title > .score,
.top-block-sidebar > .top-list > .top-lvl,
.top-block-sidebar > .top-list > .score {
    justify-self: end;
}

.top-block-sidebar > .top-title > span:not(.top-rank-with-flag):not(.top-name),
.top-block-sidebar > .top-list > span:not(.top-rank-with-flag):not(.top-name) {
    display: block;
    width: auto !important;
    min-width: 0;
    padding-bottom: 0;
}

.top-block-sidebar > .top-title > span.top-name,
.top-block-sidebar > .top-list > span.top-name {
    display: block;
    width: 100% !important;
    min-width: 0;
    padding-bottom: 0;
}

.top-block-sidebar .top-rank-with-flag .top-number {
    text-align: left;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.top-block-sidebar .top-rank-with-flag .top-flag {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: 0;
    margin-left: -0.22em;
}

.top-block-sidebar .top-flag img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    display: block;
}

.top-block-sidebar .top-name {
    justify-self: stretch;
    width: 100% !important;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Заголовок «Name» — не обрізати через ellipsis у вузькій комірці */
.top-block-sidebar > .top-title > .top-name {
    overflow: visible;
    text-overflow: clip;
}

.top-block-sidebar .top-lvl,
.top-block-sidebar .score {
    text-align: right;
    white-space: nowrap;
}

.top-block-sidebar .top-lvl sup {
    margin-left: 2px;
    font-size: 10px;
    color: rgba(212, 175, 55, 0.9);
}

.top-block-sidebar > .top-list:hover {
    margin: 0;
    padding: 10px 12px 10px 0;
    height: auto;
    min-height: 42px;
    background: rgba(212, 175, 55, 0.1);
    box-shadow: none;
}

.top-block-sidebar > .top-list:hover a {
    color: var(--ft-gold-hover, #ffd562);
}

.events li:hover {
    margin: 0;
    padding: 15px 0;
    background: transparent;
    box-shadow: none;
}

.status-block {
    height: auto;
    min-height: 130px;
    padding-left: 0;
    border: 1px solid var(--ft-border);
    border-radius: 24px;
    background: var(--ft-panel);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.36);
}

.status-block::before,
.status-block::after {
    display: none;
}

.server {
    width: 100%;
    padding: 20px;
}

.server-row,
.server-time-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.server-row-heading {
    font-weight: 700;
}

.server .server-name {
    color: var(--ft-gold) !important;
}

.server .status-online,
.server .status-offline,
.server .online-count {
    float: none;
    flex: 0 0 auto;
    text-align: right;
}

.server .status-online {
    color: #22c55e !important;
    text-shadow: 0 0 12px rgba(34, 197, 94, 0.55);
}

.server .status-offline {
    color: #ef4444 !important;
    text-shadow: 0 0 12px rgba(239, 68, 68, 0.55);
}

.server .online-count {
    color: var(--ft-gold);
}

.server-time-list {
    display: grid;
    gap: 4px;
    margin-top: 12px;
    color: var(--ft-muted);
    font-size: 11px;
    line-height: 1.45;
}

.server-time-label {
    flex: 0 0 auto;
    color: var(--ft-muted);
}

.server-time-value {
    color: var(--ft-gold);
    text-align: right;
    white-space: nowrap;
}

.forest-progress-bar::after {
    background: rgba(255, 255, 255, 0.11);
    border-radius: 999px;
}

.forest-progress-bar span {
    background: linear-gradient(90deg, #755b16, var(--ft-gold));
    border-radius: 999px;
    box-shadow: 0 0 16px rgba(212, 175, 55, 0.36);
}

.slider {
    width: 100%;
    height: clamp(220px, 42vw, 360px);
    border-radius: 24px;
    box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.65);
}

.slider .slides {
    display: flex;
    height: 100%;
}

.slider .slides .slide {
    float: none;
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(212, 175, 55, 0.22);
    background-size: cover;
}

.slider .slides .slide-info {
    align-content: center;
    padding: 28px;
}

.slider .slides .slide-info .slide-text {
    width: min(100%, 520px);
    margin-left: 0;
    padding: 14px 18px;
    border-radius: 18px;
    background: rgba(0, 0, 0, 0.62);
}

.slider .slides .slide-info .slide-text::before {
    background: var(--ft-gold);
}

.slider .navigation .active {
    background-color: var(--ft-gold);
}

/* Таблиця рангів лишається display:table — інакше ламається вирівнювання колонок */
.rankings-table {
    display: table;
    table-layout: fixed;
    width: 100%;
    max-width: 100%;
    border-color: var(--ft-border);
    color: var(--ft-text);
}

.general-table-ui,
.myaccount-table {
    display: block;
    overflow-x: auto;
    border-color: var(--ft-border);
    color: var(--ft-text);
}

.rankings-table tr:first-child td,
.general-table-ui tr:first-child td,
.rankings-table-place,
.page-title,
.panel-body .panel-title {
    color: var(--ft-gold);
}

.rankings-table tr td,
.general-table-ui tr td,
.myaccount-table tr td {
    border-color: rgba(212, 175, 55, 0.14);
}

.rankings-table tr:nth-child(2n+2) td,
.general-table-ui tr:nth-child(2n+2) td,
.myaccount-table tr:nth-child(2n+2) td {
    background: rgba(212, 175, 55, 0.045);
}

.news-article:hover,
.panel-general:hover,
.panel-addstats:hover,
.panel-downloads:hover {
    background: rgba(212, 175, 55, 0.08);
}

.footer {
    height: auto;
    position: relative;
}

.footer::after {
    display: none;
}

.footer-block-t,
.footer-block-b {
    position: static;
    display: flex;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Верхній ряд: меню + соцмережі */
.footer-block-t {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 1.25rem;
}

/* Нижній ряд: копірайт на всю ширину */
.footer-block-b {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.75rem;
    margin-top: 0.25rem;
}

.f-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.5rem 1rem;
}

.footer .f-menu li {
    margin: 0;
}

.footer .f-menu li:first-child,
.footer .f-menu li:last-child {
    margin: 0;
}

.soc-block {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

.footer .soc-block a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin: 0 4px;
    padding: 0;
    border: 1px solid rgba(212, 175, 55, 0.38);
    border-radius: 50%;
    background:
        radial-gradient(circle at 35% 25%, rgba(212, 175, 55, 0.18), transparent 42%),
        rgba(0, 0, 0, 0.46);
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    vertical-align: middle;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.footer .soc-block a:hover,
.footer .soc-block a:focus-visible {
    border-color: var(--ft-gold);
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 224, 128, 0.28), transparent 42%),
        rgba(212, 175, 55, 0.14);
    box-shadow: 0 0 24px rgba(212, 175, 55, 0.25);
    transform: translateY(-2px);
}

.footer .soc-block img {
    display: block;
    max-width: 22px;
    max-height: 22px;
    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(212, 175, 55, 0.18));
}

.copyright {
    color: var(--ft-muted);
    width: 100%;
    text-align: center;
}

.copyright p {
    margin-bottom: 0.75rem;
}

.copyright span {
    display: inline-block;
    max-width: 100%;
}

.footer .copyright p {
    color: var(--ft-muted);
    font-size: 13px;
}

.footer .copyright p a {
    color: var(--ft-gold);
}

.footer .copyright p a:hover {
    color: var(--ft-gold-hover);
}

.footer .copyright span {
    color: var(--ft-muted);
    text-transform: none;
    font-size: 12px;
    line-height: 1.55;
}

.f-menu a,
.footer-menu li a {
    color: var(--ft-muted);
}

#toTop {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    background-image: none !important;
    position: fixed !important;
    top: 6.75rem !important;
    left: 1.25rem !important;
    right: auto !important;
    bottom: auto !important;
    width: 3rem;
    height: 3rem;
    z-index: 55;
    transition: opacity .2s ease, visibility .2s ease;
}

@media (min-width: 640px) {
    #toTop {
        top: 7rem !important;
        left: 1.5rem !important;
    }
}

@media (min-width: 1024px) {
    #toTop {
        top: calc(4.25rem + 1.25rem + 0.35rem) !important;
        left: 2.75rem !important;
    }
}

@media (min-width: 1280px) {
    #toTop {
        left: 4.25rem !important;
    }
}
#toTop.is-visible {
    display: flex !important;
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
}

.nav-section {
    margin-bottom: 24px;
    padding: 24px;
    border: 1px solid var(--ft-border);
    border-radius: 24px;
    background: rgba(0, 0, 0, 0.42);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.nav-section-hero {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.13), rgba(0, 0, 0, 0.58));
}

.nav-section-kicker {
    margin: 0 0 8px;
    color: var(--ft-gold);
    font-family: 'Cinzel', serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
}

.nav-section h2 {
    margin: 0 0 14px;
    color: #fff;
    font-size: 24px;
}

.nav-section h3 {
    margin: 0 0 10px;
    color: var(--ft-gold);
    font-size: 16px;
}

.nav-section p {
    max-width: 780px;
    color: var(--ft-muted);
    line-height: 1.75;
}

.nav-section-actions,
.nav-section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.nav-section-actions {
    justify-content: flex-start;
    margin-top: 22px;
    flex-wrap: wrap;
}

.nav-section-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.nav-section-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nav-stat-card,
.nav-feature-card {
    display: block;
    padding: 20px;
    border: 1px solid var(--ft-border);
    border-radius: 22px;
    background: rgba(0, 0, 0, 0.45);
    color: var(--ft-text);
}

.nav-stat-card span,
.nav-download-row span {
    display: block;
    color: var(--ft-muted);
    font-size: 12px;
}

.nav-stat-card strong {
    display: block;
    margin-top: 6px;
    color: var(--ft-gold);
    font-family: 'Cinzel', serif;
    font-size: 24px;
}

.nav-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.nav-donation-card img {
    width: 100%;
    max-height: 80px;
    object-fit: contain;
    margin-bottom: 16px;
    filter: drop-shadow(0 0 14px rgba(212, 175, 55, 0.16));
}

.nav-list,
.nav-mini-ranking,
.nav-download-list {
    display: grid;
    gap: 10px;
}

.nav-list-row,
.nav-mini-ranking-row,
.nav-download-row {
    display: grid;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
}

.nav-list-row {
    grid-template-columns: 90px minmax(0, 1fr) auto;
    color: var(--ft-text);
}

.nav-mini-ranking-row {
    grid-template-columns: 42px minmax(0, 1fr) auto;
}

.nav-download-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.nav-list-row span,
.nav-mini-ranking-row span {
    color: var(--ft-gold);
    font-weight: 700;
}

.nav-list-row strong,
.nav-mini-ranking-row strong,
.nav-download-row strong {
    color: #fff;
}

.nav-list-row em,
.nav-mini-ranking-row em,
.nav-download-row em {
    color: var(--ft-muted);
    font-style: normal;
    white-space: nowrap;
}

.nav-section-link {
    color: var(--ft-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.nav-section-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 11px 18px;
    border: 1px solid var(--ft-gold);
    border-radius: 999px;
    background: var(--ft-gold) !important;
    color: #050505 !important;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none !important;
}

.nav-empty {
    padding: 18px;
    border: 1px dashed rgba(212, 175, 55, 0.25);
    border-radius: 18px;
    color: var(--ft-muted);
}

.nav-table-wrap {
    overflow-x: auto;
}

.nav-content-table {
    width: 100%;
    border-collapse: collapse;
    color: var(--ft-text);
}

.nav-content-table th,
.nav-content-table td {
    padding: 13px 12px;
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
    text-align: left;
}

.nav-content-table th {
    color: var(--ft-gold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.nav-form {
    display: grid;
    gap: 18px;
    max-width: 680px;
}

.nav-form-field {
    display: grid;
    gap: 8px;
    margin: 0;
}

.nav-form-field span {
    color: var(--ft-gold);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.nav-form-field input {
    height: 48px;
    padding: 0 18px;
}

.nav-form-field em,
.nav-form-note {
    color: var(--ft-muted);
    font-style: normal;
}

@media (min-width: 1024px) {
    .menu {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 6px;
    }

    .menu a {
        padding: 10px 14px;
    }

    .footer-block-t {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 1.25rem 1.5rem;
    }

    .footer-block-t .f-menu {
        justify-content: flex-start;
        flex: 1 1 auto;
        min-width: 0;
    }

    .footer-block-t .soc-block {
        justify-content: flex-end;
        flex-shrink: 0;
    }

    .footer-block-b {
        flex-direction: row;
        align-items: flex-start;
        justify-content: flex-start;
    }

    .copyright {
        text-align: left;
    }
}

@media (max-width: 640px) {
    body {
        font-size: 13px;
    }

    .widget {
        padding: 18px;
        border-radius: 20px;
    }

    .slider {
        height: 260px;
    }

    .slider .slides .slide-info {
        padding: 20px;
    }

    .slider .slides .slide-info h2 {
        font-size: 20px;
    }

    .slider .slides .slide-info .slide-text {
        max-height: 116px;
        overflow: hidden;
    }

    .buttons {
        align-items: stretch;
        flex-direction: column;
    }

    .launch-countdown {
        padding: 14px;
    }

    .launch-countdown-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .launch-countdown-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .server-time-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 0;
    }

    .server-time-value {
        text-align: left;
        white-space: normal;
    }

    .nav-section,
    .nav-stat-card,
    .nav-feature-card {
        padding: 18px;
    }

    .nav-section-grid,
    .nav-section-stats,
    .nav-feature-grid {
        grid-template-columns: 1fr;
    }

    .nav-section-title-row,
    .nav-section-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .nav-list-row,
    .nav-mini-ranking-row,
    .nav-download-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .nav-section-button {
        width: 100%;
    }
}

/*
 * Логін: мобільна / вузька ширина (<1024px) — стиль сайту; кнопка Sign In внизу справа.
 */
@media (max-width: 1023.98px) {
    .login-modal-actions,
    .ft-login-page .login-modal-actions {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        padding-top: 0.5rem;
    }

    .login-modal-links,
    .ft-login-page .login-modal-links {
        text-align: left;
    }

    .login-modal-submit,
    .ft-login-page .login-modal-submit {
        align-self: flex-end;
        width: auto;
        min-width: 9.5rem;
    }

    .ft-login-page {
        max-width: 26rem;
        margin: 1.25rem auto 0;
        padding: 1.5rem 1.25rem 1.75rem;
        border-radius: 1.5rem;
        border: 1px solid var(--ft-border);
        background: rgba(10, 10, 10, 0.78);
        box-shadow:
            0 22px 50px rgba(0, 0, 0, 0.45),
            0 0 28px rgba(212, 175, 55, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.05);
        backdrop-filter: blur(14px);
    }

    .ft-login-page .login-modal-form {
        gap: 1rem;
    }
}

/*
 * Hero carousel (Fairy Throne) — appended last so these rules win over legacy
 * `.slider` / `.slider .slides` blocks earlier in this file.
 */
#fairyThroneHero .hero-panel-slider .slider {
    min-height: min(20rem, 44vh);
    max-height: min(26rem, 50vh);
    border-radius: 1.25rem;
    overflow: hidden;
}

#fairyThroneHero .hero-panel-slider .slider .slides {
    transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

#fairyThroneHero .hero-panel-slider .slider .slides .slide {
    float: none;
    box-sizing: border-box;
    background-size: cover;
    background-position: center;
}

/* UserCP pages (My Account, Market, …) — full width of Chronicles column */
.engine-content .usercp-page {
    width: 100%;
    max-width: 100%;
}

.engine-content .usercp-page .page-title {
    width: 100%;
}

.engine-content .usercp-page .myaccount-table,
.engine-content .usercp-page .general-table-ui {
    display: table;
    width: 100%;
}

/* My Account / My Characters */
.engine-content .ft-account-section,
.engine-content .ft-characters-table-wrap {
    margin-bottom: 1.75rem;
    overflow-x: auto;
    border: 1px solid var(--ft-border);
    border-radius: 1.5rem;
    background:
        radial-gradient(circle at top left, rgba(212, 175, 55, 0.12), transparent 34%),
        rgba(0, 0, 0, 0.48);
    box-shadow:
        0 20px 48px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(14px);
}

.engine-content .ft-account-table.myaccount-table,
.engine-content .myaccount-characters-table {
    width: 100%;
    min-width: 100%;
    margin: 0;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent !important;
    color: var(--ft-text);
    font-family: 'Inter', sans-serif;
    box-shadow: none;
}

.engine-content .ft-account-table.myaccount-table tr td {
    padding: 1rem 1.25rem !important;
    border: 0;
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
    background: transparent !important;
    vertical-align: middle;
}

.engine-content .ft-account-table.myaccount-table tr:last-child td {
    border-bottom: 0;
}

.engine-content .ft-account-table.myaccount-table tr td:first-child {
    width: 34%;
    color: var(--ft-gold);
    font-family: 'Cinzel', serif;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.engine-content .ft-account-table.myaccount-table tr td:last-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: #f5efe2;
    font-size: 0.95rem;
    font-weight: 600;
}

.engine-content .ft-account-value {
    min-width: 0;
    overflow-wrap: anywhere;
}

.engine-content .ft-account-table .label,
.engine-content .myaccount-character-block-level {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.75rem;
    padding: 0.32rem 0.72rem;
    border: 1px solid rgba(212, 175, 55, 0.3);
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.12);
    color: var(--ft-gold-hover);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1;
    text-transform: uppercase;
}

.engine-content .ft-account-table .label-danger {
    border-color: rgba(180, 56, 48, 0.42);
    background: rgba(180, 56, 48, 0.16);
    color: #ffb3aa;
}

.engine-content .ft-account-table .label-success {
    border-color: rgba(94, 177, 104, 0.42);
    background: rgba(94, 177, 104, 0.16);
    color: #a9f2b1;
}

.engine-content .ft-account-table .ft-online-status-online {
    border-color: rgba(46, 204, 113, 0.58);
    background: rgba(46, 204, 113, 0.18);
    color: #8ff0aa;
    box-shadow: 0 0 18px rgba(46, 204, 113, 0.18);
}

.engine-content .ft-account-table .ft-online-status-offline {
    border-color: rgba(239, 68, 68, 0.58);
    background: rgba(239, 68, 68, 0.18);
    color: #ffaaa5;
    box-shadow: 0 0 18px rgba(239, 68, 68, 0.16);
}

.engine-content .ft-account-action {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2rem;
    margin-left: auto;
    padding: 0.45rem 0.9rem;
    border: 1px solid rgba(212, 175, 55, 0.48);
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.1);
    color: var(--ft-gold-hover) !important;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.engine-content .ft-account-action:hover,
.engine-content .ft-account-action:focus-visible {
    border-color: var(--ft-gold);
    background: var(--ft-gold);
    color: #050505 !important;
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.24);
}

.engine-content .ft-account-form-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.55rem;
    padding: 0.7rem 1.35rem;
    border: 1px solid var(--ft-gold) !important;
    border-radius: 999px;
    background: var(--ft-gold) !important;
    color: #050505 !important;
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none !important;
    box-shadow: 0 0 24px rgba(212, 175, 55, 0.22);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.engine-content .ft-account-form-button:hover,
.engine-content .ft-account-form-button:focus-visible {
    border-color: var(--ft-gold-hover) !important;
    background: var(--ft-dark-hover) !important;
    color: var(--ft-gold-hover) !important;
    box-shadow: 0 0 28px rgba(212, 175, 55, 0.3);
    transform: translateY(-1px);
}

.engine-content .ft-account-form-button:active {
    transform: translateY(0);
}

.engine-content .myaccount-characters-table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.engine-content .ft-characters-slider {
    position: relative;
    margin-bottom: 1.75rem;
    padding: 1.1rem 3.25rem 1.35rem;
    overflow: hidden;
    border: 1px solid var(--ft-border);
    border-radius: 1.5rem;
    background:
        radial-gradient(circle at top left, rgba(212, 175, 55, 0.12), transparent 34%),
        rgba(0, 0, 0, 0.48);
    box-shadow:
        0 20px 48px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(14px);
}

.engine-content .ft-characters-slider-viewport {
    overflow: hidden;
}

/* Swipe zones: no text/image selection, no native drag */
.ft-swipe-zone,
.ft-swipe-zone * {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

.ft-swipe-zone img,
.ft-swipe-zone a {
    -webkit-user-drag: none;
    -moz-user-drag: none;
    user-drag: none;
}

.ft-swipe-zone::selection,
.ft-swipe-zone *::selection {
    background: transparent;
}

.ft-swipe-zone {
    touch-action: pan-y;
    cursor: grab;
}

.ft-swipe-zone:active {
    cursor: grabbing;
}

.engine-content .ft-characters-slider-track {
    display: flex;
    align-items: stretch;
    gap: 1rem;
    transition: transform 0.34s ease;
    will-change: transform;
}

.engine-content .ft-characters-slide {
    flex: 0 0 100%;
    display: grid;
    grid-template-rows: 1fr auto;
    gap: 1rem;
    min-width: 0;
    padding: 1.15rem;
    border: 1px solid rgba(212, 175, 55, 0.14);
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, 0.035);
    text-align: center;
}

@media (min-width: 640px) {
    .engine-content .ft-characters-slide {
        flex-basis: calc((100% - 1rem) / 2);
    }
}

@media (min-width: 1024px) {
    .engine-content .ft-characters-slide {
        flex-basis: calc((100% - 2rem) / 3);
    }
}

.engine-content .ft-characters-slider-btn {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.45rem;
    height: 2.45rem;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.68);
    color: var(--ft-gold);
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1;
    transform: translateY(-50%);
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.12);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.engine-content .ft-characters-slider-btn:hover,
.engine-content .ft-characters-slider-btn:focus-visible {
    border-color: var(--ft-gold);
    background: var(--ft-gold);
    color: #050505;
}

.engine-content .ft-characters-slider-btn:disabled {
    cursor: default;
    opacity: 0.35;
}

.engine-content .ft-characters-slider-btn-prev {
    left: 0.7rem;
}

.engine-content .ft-characters-slider-btn-next {
    right: 0.7rem;
}

.engine-content .ft-characters-slider-dots {
    display: flex;
    justify-content: center;
    gap: 0.45rem;
    min-height: 0.65rem;
    margin-top: 1rem;
}

.engine-content .ft-characters-slider-dots button {
    width: 0.55rem;
    height: 0.55rem;
    padding: 0;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.1);
}

.engine-content .ft-characters-slider-dots button.active {
    background: var(--ft-gold);
    box-shadow: 0 0 14px rgba(212, 175, 55, 0.36);
}

.engine-content .myaccount-characters-table td {
    min-width: 10.5rem;
    padding: 1.15rem 1rem !important;
    border: 0;
    border-right: 1px solid rgba(212, 175, 55, 0.12);
    background: transparent !important;
    text-align: center;
    vertical-align: top;
}

.engine-content .myaccount-characters-table td:last-child {
    border-right: 0;
}

.engine-content .myaccount-characters-row-main td {
    border-bottom: 1px solid rgba(212, 175, 55, 0.16);
}

.engine-content .myaccount-character-card {
    display: grid;
    justify-items: center;
    gap: 0.8rem;
    color: var(--ft-text) !important;
    text-decoration: none !important;
    cursor: pointer;
}

.engine-content .myaccount-characters-table .myaccount-character-block,
.engine-content .ft-characters-slider .myaccount-character-block {
    position: relative;
    display: inline-flex;
    margin: 0;
    padding: 0.45rem;
    border: 1px solid rgba(212, 175, 55, 0.28);
    border-radius: 1.1rem;
    background:
        linear-gradient(180deg, rgba(212, 175, 55, 0.12), rgba(0, 0, 0, 0.54)),
        rgba(0, 0, 0, 0.62);
    box-shadow: 0 0 26px rgba(212, 175, 55, 0.12), 0 16px 30px rgba(0, 0, 0, 0.3);
}

.engine-content .myaccount-characters-table .myaccount-character-block img,
.engine-content .ft-characters-slider .myaccount-character-block img {
    width: 6.25rem;
    height: 6.25rem;
    object-fit: cover;
    border-radius: 0.85rem;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    transition: filter 0.2s ease, transform 0.2s ease;
}

.engine-content .myaccount-character-card:hover .myaccount-character-block img {
    filter: brightness(1.14);
    transform: translateY(-2px);
}

.engine-content .myaccount-characters-table .myaccount-character-name,
.engine-content .ft-characters-slider .myaccount-character-name {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    color: #fff;
    font-family: 'Cinzel', serif;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.engine-content .myaccount-characters-table .online-status-indicator,
.engine-content .ft-characters-slider .online-status-indicator {
    width: auto;
    max-width: none;
    height: auto;
    margin-left: 0.2rem;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(212, 175, 55, 0.28);
}

.engine-content .myaccount-characters-row-meta td {
    padding-top: 0.95rem !important;
    padding-bottom: 1.2rem !important;
}

.engine-content .myaccount-character-meta {
    padding-top: 0.95rem;
    border-top: 1px solid rgba(212, 175, 55, 0.12);
}

.engine-content .myaccount-character-block-level {
    position: static;
    margin: 0 0 0.65rem;
}

.engine-content .myaccount-character-block-location {
    display: block;
    margin: 0;
    color: var(--ft-muted);
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.5;
}

.engine-content .ft-unstick-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.55rem 1rem;
    border: 1px solid rgba(212, 175, 55, 0.55) !important;
    border-radius: 999px;
    background: rgba(212, 175, 55, 0.1) !important;
    color: var(--ft-gold-hover) !important;
    font-family: 'Inter', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none !important;
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.12);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.engine-content .ft-unstick-button:hover,
.engine-content .ft-unstick-button:focus-visible {
    border-color: var(--ft-gold) !important;
    background: var(--ft-gold) !important;
    color: #050505 !important;
    box-shadow: 0 0 24px rgba(212, 175, 55, 0.28);
    transform: translateY(-1px);
}

.engine-content .ft-unstick-button:active {
    transform: translateY(0);
}

@media (max-width: 640px) {
    .engine-content .ft-account-table.myaccount-table tr,
    .engine-content .ft-account-table.myaccount-table td {
        display: block;
        width: 100%;
    }

    .engine-content .ft-account-table.myaccount-table tr td:first-child {
        padding-bottom: 0.35rem !important;
    }

    .engine-content .ft-account-table.myaccount-table tr td:last-child {
        align-items: stretch;
        flex-direction: column;
        padding-top: 0.35rem !important;
    }

    .engine-content .ft-account-action {
        width: 100%;
        margin: 0;
    }

    .engine-content .ft-unstick-button {
        width: 100%;
    }

    .engine-content .ft-account-form-button {
        width: 100%;
    }

    .engine-content .ft-characters-slider {
        padding: 1rem 2.85rem 1.2rem;
    }
}

/* --- main.css --- */
.admincp-button {
	position:absolute;
	top:10px;
	right:10px;
	z-index: 9999;
}

.page-title {
	color: var(--ft-gold, #d4af37);
	font-family: 'Cinzel', Georgia, serif;
	font-size: clamp(1.15rem, 2.2vw, 1.65rem);
	margin-bottom: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* RANKINGS MODULE — Fairy Throne (dark / gold) */
.table.rankings-table,
.rankings-table {
	width: 100%;
	max-width: 100%;
	table-layout: fixed;
	border-spacing: 0;
	border-collapse: collapse;
	border: 1px solid var(--ft-border, rgba(212, 175, 55, 0.24));
	background: var(--ft-panel, rgba(10, 10, 10, 0.68));
	border-radius: 1rem;
	overflow: hidden;
}
.rankings-table a {
	text-decoration: none;
	color: var(--ft-gold, #d4af37);
	font-weight: 600;
}
.rankings-table a:hover {
	color: var(--ft-gold-hover, #e6c65a);
}

.rankings-class-image {
	width: 30px;
	height: auto;
	box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.35), 0 0 12px rgba(212, 175, 55, 0.18);
	border-radius: 50%;
}
.rankings-table tr td {
	border-bottom: 1px solid rgba(212, 175, 55, 0.14);
	padding: 12px 10px;
	font-size: 13px;
	color: var(--ft-text, #e7e0d0);
	vertical-align: middle !important;
	text-align: center;
}
.rankings-table tbody tr:last-child td,
.rankings-table tr:last-child td {
	border-bottom: none;
}
.rankings-table tr:nth-child(2n+2) td {
	background: rgba(212, 175, 55, 0.045);
}
.rankings-table-place {
	color: var(--ft-gold, #d4af37);
	font-weight: 700;
	font-size: 1.05rem;
	font-family: 'Cinzel', Georgia, serif;
	text-align: center;
	width: 3rem;
	max-width: 4rem;
}

.rankings-col-place {
	width: 3rem;
	max-width: 4rem;
}

.rankings-col-flag,
.rankings-col-class,
.rankings-col-name {
	box-sizing: border-box;
	padding-left: 0.85rem;
	padding-right: 0.85rem;
}

.rankings-col-flag {
	width: 13%;
	min-width: 6.5rem;
	max-width: none;
}

.rankings-col-flag img {
	display: block;
	margin: 0 auto;
	max-width: 32px;
	height: auto;
}

.rankings-col-class {
	width: 13%;
	min-width: 6.5rem;
	max-width: none;
}

.rankings-col-class .rankings-class-image {
	display: block;
	margin: 0 auto;
}

.rankings-col-gens {
	width: 3.25rem;
	max-width: 3.75rem;
	text-align: center;
	vertical-align: middle !important;
}

.rankings-col-gens .rankings-gens-img {
	display: inline-block;
	vertical-align: middle;
}

.rankings-col-name {
	text-align: center;
	vertical-align: middle !important;
	word-wrap: break-word;
	overflow-wrap: anywhere;
	min-width: 0;
	width: 18%;
}

/* flex лише всередині — <td> лишається table-cell, інакше «роз’їжджаються» колонки */
.rankings-col-name .rankings-name-inline {
	display: inline-flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	max-width: 100%;
	vertical-align: middle;
}

.rankings-col-name .rankings-name-inline > a {
	display: inline-block;
	max-width: 100%;
	min-width: 0;
	vertical-align: middle;
}

.rankings-col-name .rankings-name-inline .online-status-indicator {
	display: inline-block;
	flex-shrink: 0;
	margin: 0;
	vertical-align: middle;
}

.rankings-col-guild {
	min-width: 0;
	text-align: center;
	vertical-align: middle !important;
	word-wrap: break-word;
	overflow-wrap: anywhere;
}

.rankings-col-logo img,
.rankings-col-logo > * {
	display: inline-block;
	vertical-align: middle;
}

.rankings-col-logo {
	width: 4.5rem;
	max-width: 5rem;
	text-align: center;
	vertical-align: middle !important;
}

.rankings-col-score,
.rankings-col-num {
	width: 5.5rem;
	max-width: 7rem;
	text-align: center;
	white-space: nowrap;
}

.rankings-col-online {
	min-width: 0;
	text-align: center;
	vertical-align: middle !important;
	font-size: 12px;
	line-height: 1.35;
}

.rankings-col-head {
	text-align: center;
	vertical-align: middle !important;
}
.rankings-table tr:first-child td {
	color: var(--ft-gold, #d4af37);
	border-bottom: 1px solid rgba(212, 175, 55, 0.28);
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background: linear-gradient(180deg, rgba(212, 175, 55, 0.14), rgba(10, 10, 10, 0.5));
}
.rankings-table tr:nth-child(n+2):hover td {
	background: rgba(212, 175, 55, 0.09);
}
.rankings-update-time {
	text-align: right;
	font-size: 11px;
	color: var(--ft-muted, #b9ad94);
	padding: 12px 4px 0;
	letter-spacing: 0.04em;
}
.rankings_menu {
	width: 100%;
	overflow-x: auto;
	text-align: center;
	margin-bottom: 1.25rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	-webkit-overflow-scrolling: touch;
}
.rankings_menu span {
	width: 100%;
	flex: 1 0 100%;
	display: block;
	padding: 6px 0 10px;
	color: var(--ft-muted, #b9ad94);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.rankings_menu a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 7.5rem;
	padding: 11px 16px;
	margin: 0;
	border: 1px solid var(--ft-border, rgba(212, 175, 55, 0.24));
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.45);
	text-align: center;
	color: var(--ft-muted, #b9ad94);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	transition:
		color 0.2s ease,
		background-color 0.2s ease,
		border-color 0.2s ease,
		box-shadow 0.2s ease;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
	text-decoration: none;
}
.rankings_menu a.active {
	color: var(--ft-gold, #d4af37) !important;
	border-color: rgba(212, 175, 55, 0.55) !important;
	background: var(--ft-gold-soft, rgba(212, 175, 55, 0.16)) !important;
	box-shadow: 0 0 22px rgba(212, 175, 55, 0.2);
}
.rankings_menu a:hover {
	color: var(--ft-gold-hover, #e6c65a) !important;
	border-color: rgba(212, 175, 55, 0.45);
	background: rgba(212, 175, 55, 0.1);
}
.rankings_guild_logo tr td {
	border: 0px !important;
	padding: 0px !important;
	margin: 0px !important;
}
.rankings-gens-img {
	width: auto !important;
	height: 30px !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;
}

/* MY ACCOUNT MODULE */
.myaccount-table {
	width: 100%;
	background: rgba(255, 255, 255, 0.3);
}
.myaccount-table tr td:first-child {
	color: #6b5428;
	font-weight: bold;
}
.myaccount-table tr td {
	border-bottom: 1px solid #f1f1f1;
	padding: 20px 30px !important;
}
.myaccount-table tr:nth-child(2n+2) td {
	background: rgba(255, 255, 255, 0.3);
}
.myaccount-table tr:last-child td {
	border: 0px;
}

/* GENERAL TABLE UI */
.general-table-ui {
	width: 100%;
	table-layout: fixed;
	background: var(--ft-panel, rgba(10, 10, 10, 0.68));
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	border: 1px solid var(--ft-border, rgba(212, 175, 55, 0.24));
	border-radius: 1rem;
	padding: 10px;
	margin: 10px 0;
	color: var(--ft-text, #e7e0d0);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.general-table-ui tr td {
	padding: 10px 8px;
	vertical-align: middle !important;
	border-bottom: 1px solid rgba(212, 175, 55, 0.12);
}
.general-table-ui tr:first-child td {
	color: var(--ft-gold, #d4af37);
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-bottom-color: rgba(212, 175, 55, 0.25);
	background: linear-gradient(180deg, rgba(212, 175, 55, 0.1), transparent);
}
.general-table-ui tr:nth-child(2n+2) td {
	background: rgba(212, 175, 55, 0.04);
}
.general-table-ui tr td {
	text-align: center;
}
.general-table-ui img {
	width: 50px;
	height: auto;
	box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.3), 0 0 14px rgba(212, 175, 55, 0.12);
	border-radius: 50%;
}

/* TERMS OF SERVICE PAGE */
.tos_list li {
	color: #0000aa;
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 40px;
}
.tos_list li p {
	color: #444;
	text-align: justify;
	text-justify: inter-word;
	text-transform: none;
	padding-right: 35px;
	font-size: 14px;
	font-weight: normal;
}

/* PAYPAL */
.paypal-gateway-container {
	width: 100%;
}

.paypal-gateway-content {
	background: #fef2da;
	border: 3px solid #f79433;
	padding: 15px;
	overflow: auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font-weight: bold;
}

.paypal-gateway-logo {
	width: 100%;
	height: 100px;
	background: #fff9ec url('../img/paypal-logo-200-68.png') no-repeat center;
	background-size: contain;
	margin-bottom: 15px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.paypal-gateway-conversion-rate {
	margin: 0px auto;
	text-align: center;
	color: #000;
	font-size: 18px;
	padding: 10px 0px;
}

.paypal-gateway-form {
	width: 100%;
	margin: 20px auto;
	text-align: center;
}

.paypal-gateway-form div {
	display: inline-block;
	padding: 0px 10px;
	color: #000;
	font-size: 24px;
}

.paypal-gateway-form input[type=text] {
	width: 60px;
	font-size: 24px;
	border: 3px solid #f79433;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #f79433;
}

.paypal-gateway-continue {
	margin: 0px auto;
	text-align: center;
}

.paypal-gateway-continue input[type=submit] {
	background: url('../img/paypal-submit.jpg') no-repeat;
	width: 200px;
	height: 40px;
	border: 0px;
}

.module-requirements {
	font-size: 12px;
	margin-top: 20px;
}

/* SIDEBAR */
.panel-sidebar {
	background: #20324d;
	border: 1px solid rgba(255, 255, 255, 0.1);
	-moz-border-radius: 0px;
	border-radius: 0px;
}

.panel-sidebar > .panel-heading {
	background: #20324d url('../img/sidebar_panel_title.jpg') no-repeat top center;
	color: #fff;
	font-family: 'PT Sans', sans-serif;
	border: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	height: 61px;
	padding: 0px 15px 0px 15px;
}

.panel-sidebar > .panel-heading > .panel-title {
	font-weight: bold;
	padding-top: 20px;
	text-transform: uppercase;
}

.panel-sidebar > .panel-body {
	color: #fff;
}

/* USERCP SIDEBAR PANEL */
.panel-usercp ul {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

.panel-usercp ul li {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	line-height: 1.35;
	list-style: none;
}

.panel-usercp ul li a.usercp-menu-item {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	min-height: 40px;
	padding: 8px 0;
	box-sizing: border-box;
	color: #a79376 !important;
	font-weight: bold;
	text-decoration: none;
}

.panel-usercp ul li a.usercp-menu-item:active,
.panel-usercp ul li a.usercp-menu-item:hover {
	color: #ffffff !important;
	text-decoration: none;
}

.panel-usercp ul li a.usercp-menu-item img {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	object-fit: contain;
	display: block;
}

.panel-usercp ul li a.usercp-menu-item .usercp-menu-label {
	flex: 1 1 auto;
	min-width: 0;
	text-align: left;
}

/* SIDEBAR BANNERS */
.sidebar-banner {
	margin: 20px 0px;
	border: 0px;
}
.sidebar-banner img {
	width: 100%;
	height: auto;
	border: 1px solid rgba(255, 255, 255, 0.1);
	transition: all 0.3s ease;
}
.sidebar-banner img:hover {
	-webkit-filter: brightness(130%);
    filter: brightness(130%);
}

/* GENERAL PANEL STYLING */
.panel-general {
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.3);
	transition: all 0.3s ease;
	border: 1px solid #c09074;
	-moz-border-radius: 0px;
	border-radius: 0px;
	color: #333;
}
.panel-general:hover {
	background: rgba(255, 255, 255, 0.8);
}

.panel-body .panel-title {
	color: #6b5428;
	font-family: 'PT Sans', sans-serif;
	font-size: 14px;
	border-bottom: 1px solid #c09074;
	margin-bottom: 20px !important;
	font-weight: bold;
}

/* ADD STATS MODULE */
.panel-addstats {
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.3);
	transition: all 0.3s ease;
	-moz-border-radius: 0px;
	border-radius: 0px;
	color: #333;
	padding-top: 15px;
}
.panel-addstats:hover {
	background: rgba(255, 255, 255, 0.8);
}
.panel-addstats .character-avatar img {
	width: 100px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 5px #666;
	-moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -khtml-border-radius: 50%;
}
.panel-addstats .character-name {
	color: #6b5428;
	font-family: 'PT Sans', sans-serif;
	font-size: 18px;
	border-bottom: 1px solid #c09074;
	padding: 20px 0px;
	margin-bottom: 20px !important;
	font-weight: bold;
}

/* DOWNLOADS */
.panel-downloads {
	margin-bottom: 30px;
	background: rgba(255, 255, 255, 0.3);
	transition: all 0.3s ease;
	-moz-border-radius: 0px;
	border-radius: 0px;
	color: #333;
}
.panel-downloads:hover {
	background: rgba(255, 255, 255, 0.8);
}
	.panel-downloads .panel-title {
		font-size: 18px;
	}
	.download-description {
		font-size: 11px;
		position: relative;
		top: -7px;
		color: #777;
	}

.online-status-indicator {
	margin-left: 5px;
}

/* WEBENGINE CMS */
.webengine-powered { color: #8b8b8c !important; }
.webengine-powered:active, .webengine-powered:hover { color: #ffffff !important; }

/* FOOTER MENU */
.footer-menu {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}
	.footer-menu li:first-child {
		color: #fff;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.footer-menu li a {
		color: #ff9000;
	}
	.footer-menu li a:hover, .footer-menu li a:active {
		color: #ffc000 !important;
	}

/* CASTLE SIEGE SIDEBAR PANEL */
.panel-castle-siege {
	color: #fff;
}
	.panel-castle-siege img {
		box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.5);
	}
	.panel-castle-siege a {
		color: #fff;
	}
	.panel-castle-siege .title-castle-owner {
		font-weight: bold;
		color: #a79376;
	}
	.panel-castle-siege .title-guild-master {
		font-weight: bold;
		color: #a79376;
	}
	.panel-castle-siege .title-castle-battle {
		font-weight: bold;
	}
	.panel-castle-siege .castle-siege-countdown {
		margin-top: 35px;
	}
	.panel-castle-siege .castle-countdown {
		font-size: 28px;
		font-weight: bold;
		color: #fff;
	}
	.panel-castle-siege .castle-countdown span {
		color: #ffcc00;
		font-size: 20px;
	}

/* NEWS */
.news-article {
	position: relative;
	padding: 15px 15px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
}
	.news-article .news-image {
		padding: 10px;
	}
	.news-article .news-image img {
		width: 100%;
		height: auto;
		box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
	}
	.news-article .news-content {
		padding: 10px;
	}
		.news-article .news-content h3 {
			margin: 0px 0px 15px 0px;
			padding: 0px 0px 5px 0px;
			text-transform: uppercase;
			font-size: 18px;
			font-weight: bold;
			border-bottom: 1px solid #230707;
		}
		.news-article .news-content h3 a {
			color: #230707;
		}
		.news-article .news-content .news-date {
			font-size: 12px;
			font-style: italic;
			color: #aaa;
		}
	.news-article:hover {
		background: rgba(255, 255, 255, 0.3);
	}

/* LANGUAGE PICKER */
.webengine-language-switcher {
	display: inline-block;
	list-style: none;
	padding: 0px !important;
	margin: 0px !important;
	width: 47px;
	height: 16px;
	overflow: hidden;
	transition: all .3s ease;
}
.webengine-language-switcher:hover {
	width: 400px;
}
	.webengine-language-switcher li {
		display: inline-block;
		list-style-type: none;
		background: #333333;
		padding: 0px 5px 2px 5px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		-khtml-border-radius: 3px;
		transition: all .3s ease;
	}
	.webengine-language-switcher li:hover {
		-webkit-filter: brightness(120%);
		filter: brightness(120%);
	}
	.webengine-language-switcher li a {
		color: #999999;
	}
	.webengine-language-switcher li a:hover {
		color: #ffffff !important;
	}
	
/* MY ACCOUNT CHARACTER LIST */
.myaccount-character-block {
	background: #333;
	border: 1px solid #666;
	padding: 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;
	margin: 0px auto;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
	.myaccount-character-block img {
		width: 100px;
		height: auto;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		-moz-box-shadow: 0 0 5px #000;
		-webkit-box-shadow: 0 0 5px #000;
		box-shadow: 0 0 5px #000;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
		.myaccount-character-block img:hover {
			-webkit-filter: brightness(120%);
			filter: brightness(120%);
		}
.myaccount-character-block-location {
	font-size: 12px;
	color: #000;
	margin-bottom: 20px;
	margin-top: 2px;
	line-height: 1.2;
}
.myaccount-character-block-level {
	position: relative;
	top: -77px;
	display: inline-block;
	background: rgba(0,0,0,0.5);
	padding: 0px 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #fff;
	font-size: 10px;
}
.myaccount-character-name a {
	font-weight: bold;
	color: #000;
	font-size: 16px;
}

/* --- profiles.css --- */
/* GUILD PROFILES */
.profiles_guild_card {
	width: 100%;
	background: #000000 url('../img/profiles/guild.jpg') no-repeat;
	background-size: cover;
	overflow: auto;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -khtml-border-radius: 10px;
	border: 1px solid #333;
	-moz-box-shadow: 0 0 10px #555;
	-webkit-box-shadow: 0 0 10px #555;
	box-shadow: 0 0 10px #555;
	padding: 80px 40px;
	color: #ffffff;
	text-shadow: 1px 1px 1px #000;
}
	.profiles_guild_card .guild_logo img {
		-moz-box-shadow: 0 0 10px #000;
		-webkit-box-shadow: 0 0 10px #000;
		box-shadow: 0 0 10px #000;
	}
	.profiles_guild_card .guild_name {
		font-family: 'Cinzel', serif;
		font-size: 24px;
		color: #ffffff;
		font-weight: bold;
	}
	.profiles_guild_card table {
		table-layout: fixed;
	}
	.profiles_guild_card hr {
		    border-top: 1px solid #333;
			margin-top: 30px;
			margin-bottom: 30px;
	}
	.profiles_guild_card .guild_members {
		font-family: 'Cinzel', serif;
		font-size: 24px;
		color: #ffffff;
		font-weight: bold;
	}
	.profiles_guild_card .guild_members_list {
		margin-top: 30px;
	}

/* PLAYER PROFILES */
.profiles_player_card {
	width: 100%;
	overflow: auto;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -khtml-border-radius: 10px;
	border: 1px solid #333;
	-moz-box-shadow: 0 0 10px #555;
	-webkit-box-shadow: 0 0 10px #555;
	box-shadow: 0 0 10px #555;
	padding: 50px 20px;
}

	.DK.profiles_player_card, .BK.profiles_player_card, .BM.profiles_player_card, .DGK.profiles_player_card { background: url('../img/profiles/knight.jpg') no-repeat; background-size: cover; }
	.DW.profiles_player_card, .SM.profiles_player_card, .GM.profiles_player_card, .SW.profiles_player_card { background: url('../img/profiles/wiz.jpg') no-repeat; background-size: cover; }
	.ELF.profiles_player_card, .ME.profiles_player_card, .HE.profiles_player_card, .NE.profiles_player_card { background: url('../img/profiles/elf.jpg') no-repeat; background-size: cover; }
	.SUM.profiles_player_card, .BS.profiles_player_card, .DSM.profiles_player_card, .DS.profiles_player_card { background: url('../img/profiles/sum.jpg') no-repeat; background-size: cover; }
	.DL.profiles_player_card, .LE.profiles_player_card, .EL.profiles_player_card { background: url('../img/profiles/dl.jpg') no-repeat; background-size: cover; }
	.MG.profiles_player_card, .DM.profiles_player_card, .MK.profiles_player_card { background: url('../img/profiles/mg.jpg') no-repeat; background-size: cover; }
	.RF.profiles_player_card, .FM.profiles_player_card, .FB.profiles_player_card { background: url('../img/profiles/rf.jpg') no-repeat; background-size: cover; }
	.GL.profiles_player_card, .ML.profiles_player_card, .SL.profiles_player_card { background: url('../img/profiles/gl.jpg') no-repeat; background-size: cover; }
	.RW.profiles_player_card, .RSM.profiles_player_card, .GRM.profiles_player_card { background: url('../img/profiles/rw.jpg') no-repeat; background-size: cover; }
	.SLR.profiles_player_card, .SLRR.profiles_player_card, .MSLR.profiles_player_card, .SLTR.profiles_player_card { background: url('../img/profiles/sl.jpg') no-repeat; background-size: cover; }
	.GC.profiles_player_card, .GB.profiles_player_card, .MGB.profiles_player_card, .HGC.profiles_player_card { background: url('../img/profiles/gc.jpg') no-repeat; background-size: cover; }

.profiles_player_content {
	float: right;
	width: 50%;
	color: #fff;
}

.profiles_player_table {
	width: 100%;
}

.profiles_player_table .cname {
	font-family: 'Cinzel', serif;
	text-align: center;
	font-size: 24px;
	color: #fff;
	font-weight: bold;
}

.profiles_player_table .cclass {
	text-align: center;
	font-size: 11px;
	color: #eee;
}

.profiles_player_table .isoffline {
	color: #ff0000;
}

.profiles_player_table .isonline {
	color: #00ff00;
}

.profiles_player_table_info {
	table-layout: fixed;
	margin-top: 10px;
}
.profiles_player_table_info tr td {
	padding: 3px 10px;
}
.profiles_player_table_info tr td:first-child {
	text-align: right;
}

/* --- override.css --- */
/*vigomu.net*/
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    border-top: none !important;
}

.form-control {
	background: #fafafa;
	border: 1px solid #e3e3e3;
	color: #666;
}
.form-control:focus {
	border: 1px solid #ccc;
}

/* http://stackoverflow.com/questions/19562903/remove-padding-from-columns-in-bootstrap-3 */
.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

/* http://stackoverflow.com/questions/20547819/vertical-align-with-bootstrap-3 */
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.thumbnail {
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid #ccc;
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #c09074;
}

.btn-primary {
    color: #fff;
    background: #b4a814;
	border: 0px;
	-moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
	-moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
	text-decoration: none !important;
	font-size: 11px;
	text-transform: uppercase;
	font-family: 'Open Sans', sans-serif;
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
	background: #c1b51c !important;
    color: #fff !important;
}

/* TABLES */
.table-bordered {
	border: 1px solid #c09074 !important;
	background: rgba(255, 255, 255, 0.3) !important;
}
.table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border: 1px solid #c09074 !important;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background: rgba(255, 255, 255, 0.5) !important;
}
.table-hover>tbody>tr:hover {
    background: rgba(255, 255, 255, 0.8) !important;
}

/* LINKS */
a {
	text-decoration: none !important;
}

/* --- castle-siege.css --- */
/*!
    
 =========================================================
 * WebEngine CMS
 * https://webenginecms.org/
 =========================================================
 
 * Author Lautaro Angelico (https://lautaroangelico.com/)
 * Copyright (c) 2013-2020 Lautaro Angelico, All Rights Reserved
 
 * Licensed under the MIT license
 * http://opensource.org/licenses/MIT
 
 =========================================================
 
*/
.castle-siege-block .castle-owner-panel {
	background: #000 url('../img/castle_owner_bg.jpg') no-repeat;
	background-size: cover;
	color: #ffffff;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
	border: 1px solid #333;
	-moz-box-shadow: 0 0 10px #555;
	-webkit-box-shadow: 0 0 10px #555;
	box-shadow: 0 0 10px #555;
	padding: 20px;
	text-shadow: 1px 1px 1px #000;
	transition: 0.3s;
}
.castle-siege-block .castle-owner-panel:hover {
	-webkit-filter: brightness(120%);
	filter: brightness(120%);
}
.castle-siege-block .castle-owner-panel a {
	color: #cccccc;
}
.castle-siege-block .castle-owner-panel a:hover, .castle-siege-block .castle-owner-panel a:active {
	color: #ffffff;
}
.castle-siege-block .castle-owner-panel .panel-body .castle-owner-name, .castle-siege-block .castle-owner-panel .panel-body .castle-owner-name a {
	color: #ffffff;
	display: block;
	padding: 5px;
	font-size: 24px;
	font-weight: bold;
}
.castle-siege-block .castle-owner-panel .panel-body .castle-owner-ally-title {
	margin-top: 20px;
}
.castle-siege-block .castle-owner-panel .panel-body .castle-owner-ally {
	padding: 5px 0px;
}
.castle-siege-block .castle-owner-panel .panel-body h4 {
	color: #ffcc00 !important;
}

.castle-siege-block #siegeTimer {
	font-size: 48px;
	font-weight: bold;
}
.castle-siege-block #siegeTimer span {
	color: #aaaaaa;
	font-size: 26px;
}

.castle-owner-widget {
	background: #000 url('../img/castle_owner_bg.jpg') no-repeat top right;
	background-size: cover;
	color: #cccccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
	border: 1px solid #333;
	-moz-box-shadow: 0 0 10px #000;
	-webkit-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000;
	padding: 20px;
	text-shadow: 1px 1px 1px #000;
	transition: 0.3s;
}
.castle-owner-widget:hover {
	-webkit-filter: brightness(120%);
	filter: brightness(120%);
}
	.castle-owner-widget .panel-heading {
		text-align: center;
	}
		.castle-owner-widget .panel-heading .panel-title {
			font-size: 28px;
			font-weight: bold;
		}
	.castle-owner-widget .panel-body span.alt {
		color: #cf7957;
		font-weight: bold;
	}
	.castle-owner-widget .panel-body a {
		color: #ffffff;
	}
	
	.btn-castlewidget {
		color: #ffffff;
		background-color: transparent;
		border-color: #ffffff;
		-moz-transition: all .1s ease-in;
		-o-transition: all .1s ease-in;
		-webkit-transition: all .1s ease-in;
		transition: all .1s ease-in;
		-moz-border-radius: 0px;
		border-radius: 0px;
		text-shadow: none;
	}
	.btn-castlewidget:active, .btn-castlewidget:focus, .btn-castlewidget:hover {
		color: #000000 !important;
		background-color: #ffffff !important;
		border-color: #ffffff !important;
	}

/* UserCP Add Stats */
.engine-content .ft-addstats-page {
    display: grid;
    gap: 1.25rem;
}

.engine-content .ft-addstats-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
    margin-bottom: 0.25rem;
}

.engine-content .ft-addstats-tab {
    min-height: 2.55rem;
    padding: 0.68rem 1.25rem;
    border: 1px solid rgba(212, 175, 55, 0.24);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.46);
    color: var(--ft-text-muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    line-height: 1;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 0 18px rgba(212, 175, 55, 0.06);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.engine-content .ft-addstats-tab:hover,
.engine-content .ft-addstats-tab.is-active {
    border-color: rgba(212, 175, 55, 0.72);
    background: rgba(212, 175, 55, 0.16);
    color: var(--ft-gold-hover);
    box-shadow: 0 0 24px rgba(212, 175, 55, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.engine-content .ft-addstats-tab.is-active {
    transform: translateY(-1px);
}

.engine-content .ft-addstats-card {
    width: min(100%, 31rem);
    overflow: hidden;
    border: 1px solid var(--ft-border);
    border-radius: 1.5rem;
    background:
        radial-gradient(circle at top left, rgba(212, 175, 55, 0.14), transparent 34%),
        rgba(0, 0, 0, 0.52);
    box-shadow:
        0 20px 48px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(14px);
}

.engine-content .ft-addstats-card[hidden] {
    display: none !important;
}

.engine-content .ft-addstats-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1.25rem;
    align-items: center;
    padding: 1.25rem;
    border-bottom: 1px solid rgba(212, 175, 55, 0.14);
}

.engine-content .ft-addstats-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5.5rem;
    height: 5.5rem;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.32);
    border-radius: 1.25rem;
    background: rgba(0, 0, 0, 0.45);
    box-shadow: 0 0 28px rgba(212, 175, 55, 0.12);
}

.engine-content .ft-addstats-avatar img {
    max-width: 100%;
    height: auto;
}

.engine-content .ft-addstats-kicker {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--ft-gold);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.engine-content .ft-addstats-heading h3 {
    margin: 0;
    color: #f5efe2;
    font-family: 'Cinzel', serif;
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.engine-content .ft-addstats-points {
    margin-top: 0.65rem;
    color: var(--ft-text-muted);
    font-size: 0.9rem;
}

.engine-content .ft-addstats-points strong {
    color: var(--ft-gold-hover);
}

.engine-content .ft-addstats-form {
    padding: 1.25rem;
}

.engine-content .ft-addstats-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.engine-content .ft-addstats-stat {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    margin: 0;
    padding: 0.95rem;
    border: 1px solid rgba(212, 175, 55, 0.16);
    border-radius: 1rem;
    background: rgba(0, 0, 0, 0.32);
}

.engine-content .ft-addstats-label {
    color: var(--ft-gold);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.engine-content .ft-addstats-current {
    color: #f5efe2;
    font-weight: 800;
}

.engine-content .ft-addstats-stat .form-control {
    grid-column: 1 / -1;
    width: 100%;
}

.engine-content .ft-addstats-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.1rem;
}

.engine-content .ft-addstats-requirements {
    margin-top: 1.25rem;
    padding: 1rem 1.25rem;
    border: 1px solid rgba(212, 175, 55, 0.16);
    border-radius: 1.25rem;
    background: rgba(0, 0, 0, 0.36);
    color: var(--ft-text-muted);
}

.engine-content .ft-addstats-requirements p {
    margin: 0.35rem 0;
}

@media (max-width: 640px) {
    .engine-content .ft-addstats-hero,
    .engine-content .ft-addstats-grid {
        grid-template-columns: 1fr;
    }

    .engine-content .ft-addstats-avatar {
        width: 100%;
        height: auto;
        min-height: 5.5rem;
    }

    .engine-content .ft-addstats-actions .btn {
        width: 100%;
    }
}

