/*
    Copyright (C) Kronius2. All rights reserved.
    Developed 2021 by MCDEV Software.
 */

@font-face {
    font-family: 'Friz-Quadrata-TT-Regular';
    src: url('../font/Friz Quadrata TT Regular/Friz Quadrata TT Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'OpenSans-Regular';
    src: url('../font/Open_Sans/OpenSans-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'OpenSans-Bold';
    src: url('../font/Open_Sans/OpenSans-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'OpenSans-ExtraBold';
    src: url('../font/Open_Sans/OpenSans-ExtraBold.ttf') format('truetype');
}

/*Video Animation*/

video {
    object-fit: cover;
    width: 100%;
    height: 868px;
    position: absolute;
    top: 0;
    left: 0;
    filter: contrast(1.1);
}

body {
    font-family: 'Friz-Quadrata-TT-Regular', serif;
    background-color: #003e36 !important;
    background: url('../img/header_bg.png');
    background-repeat: no-repeat;
    background-position: center;
    background-position-y: 0;
    /*background-size: 100% 1043px;*/
}

a.active,
a:focus,
button:focus,
button.active {
    outline: none;
}

* {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn:focus {
    box-shadow: none;
}

a:focus,
a:hover,
a:active {
    outline: 0;
    box-shadow: 0;
}

a:focus,
a:hover {
    text-decoration: none;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6 {
    margin-bottom: 0;
}

h1 {
    font-size: 24px;
    color: #f3e4c1;
}

h2 {
    font-size: 18px;
    color: #f3e4c1;
}

h4 {
    font-size: 16px;
    color: #f3e4c1;
}

a {
    transition: all ease-in-out 0.5s;
    text-decoration: none;
}

td {
    color: #f0c9ab;
}

.navbar-expand-lg .navbar-nav .nav-link {
    color: #f5c76b;
    font-size: 14px;
    padding: 40px;
}

.navbar-expand-lg .navbar-nav .nav-link:hover {
    color: #ffece6;
}

#mainNav {
    width: 100%;
    position: relative;
    margin-top: 60px;
    /*background-image: url('../img/nav_bg.png');*/
    /*background-position: center;*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
}

header {
    /*padding-top: 156px;*/
    /*background: url('../img/header_bg.jpg');*/
    /*background-repeat: no-repeat;*/
    /*background-position: center;*/
    /*margin-bottom: 345px;*/
    height: 660px;
}

/* input style */

input[type='text'],
input[type='email'],
input[type='password'] {
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #f5c76b;
    background-color: #0a3f39;
    border: unset;
    border-bottom: 1px solid #d4a24c !important;
    /*display: block;*/
    margin-top: 14px;
    padding: 20px;
}

input[type='text']:focus,
input[type='email']:focus,
input[type='password']:focus {
    background-color: #0a3f39;
    color: #f1e3d7;
}

input[type='text']::placeholder,
input[type='email']::placeholder,
input[type='password']::placeholder {
    color: #f5c76b;
}

.logo {
    margin-top: -180px;
    /*left: 120px;*/
    position: relative;
}

.logo-add {
    margin-top: -285px;
}

.logo-add .download {
    float: right;
}

.logo-add .desc {
    float: left;
}

.logo-add .title-desc {
    color: #ffddcd;
    text-shadow: 1px 1px 1px rgba(207, 28, 49, 0.8);
}

.detailed-section {
    /*background-color: #003e36;*/
    /*height: 410px;*/
}

/* ------------------------------------ */

/* CONTENT_LEFT */

/* ------------------------------------ */

.login-header .name h3 {
    font-size: 13px;
    text-transform: uppercase;
    color: #f5c76b;
    position: relative;
    font-family: "Friz-Quadrata-TT-Regular", serif;
    padding-left: 15px;
}

.login-header .type {
    margin-right: 15px;
}

.login-header .type h4 {
    font-size: 12px;
    color: #ad686b;
    font-family: "OpenSans-Regular", serif;
    position: relative;
}

.login-header {
    display: flex;
    justify-content: space-between;
    padding: 21px 15px;
    background-image: url(../img/left_sidebar_header.png);
    background-repeat: no-repeat;
    position: relative;
}

.login-body {
    padding: 15px 15px 0 15px;
}

.login-body-bg {
    /*background-image: url(../img/left_sidebar_body.png);*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
    /*background-position: center -14px;*/
    background-color: #032923;
    display: flow-root;
}

.login-body-submit {
    display: flex;
    justify-content: space-between;
    padding: 30px 0;
}

.login-footer h4 {
    font-size: 14px;
    color: #f5c76b;
    font-weight: 400;
    font-family: "OpenSans-Regular", serif;
    text-align: center;
}

.login-footer h5 {
    color: #b3ae95;
    font-size: 14px;
    font-weight: 400;
    font-family: "OpenSans-Regular", serif;
    text-align: center;
}

.login-footer h4 a {
    color: #f5c76b;
}

.login-footer .forget-pass {
    background-color: #2b1818;
    padding: 15px 0;
}

.login-footer {
    border: 3px solid #032923;
    position: relative;
}

/*.voteforcoins{*/

/*    font-size: 30px;*/

/*    color: #97937d;*/

/*    position: absolute;*/

/*    font-family: "Candara";*/

/*    text-align: center;*/

/*    filter: drop-shadow(0px 3px 2.5px rgba(0,0,0,0.48)) drop-shadow(0px 16px 25.5px rgba(35,65,57,0.36));*/

/*    left: 43%;*/

/*    top: 42%;*/

/*}*/

.ranking-table td,
.table th {
    border: 0;
    font-family: 'OpenSans-Regular', serif;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    color: #f5c76b;
    padding: 10px 15px;
}

.ranking-table .player {
    color: #f5c76b;
}

.ranking-table tr:nth-child(even) {
    background-color: #032923;
}

.ranking-table tr:nth-child(odd) {
    background-color: #0a3f39;
}

.ranking tr.marked {
    -webkit-animation: flash 2s infinite;
    animation: flash 2s infinite;
}

/* faq */

.faq-body-bg {
    background-image: url(../img/left_sidebar_faq_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    /*background-color: #032923;*/
    /*display: flow-root;*/
}

.faq-box ul {
    padding: 25px;
}

.faq-box ul li::before {
    content: "";
    background-image: url(../img/left_content_faq_arrow.png);
    background-repeat: no-repeat;
    width: 6px;
    height: 9px;
    display: block;
    position: absolute;
    right: 50px;
    margin-top: 9px;
}

.faq-box ul a {
    margin-top: 5px;
    color: #f5c76b;
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
}

.faq-box ul a:hover {
    color: #f3e3d6;
}

.faq-box ul li {
    margin-right: 5px;
}

.faq-box ul li::marker {
    font-size: 10px;
    color: #f5c76b;
}

#faq-accordion .card-header {
    background: unset;
    border: unset;
    padding: unset;
}

#faq-accordion .card {
    background: unset;
    border: unset;
    padding: unset;
}

#faq-accordion .btn.btn-link {
    margin-top: 5px;
    color: #f5c76b;
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
}

#faq-accordion .card-body {
    color: #f5c76b;
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
}

#faq-accordion .card:before {
    content: "";
    background-image: url(../img/left_content_faq_arrow.png);
    background-repeat: no-repeat;
    width: 6px;
    height: 9px;
    transition: all 0.5s;
    overflow: hidden;
    position: absolute;
    right: 35px;
    top: 16px;
}

/*#accordion .card .collapse.show:before {*/

/*    -webkit-transform: rotate(180deg);*/

/*    -moz-transform: rotate(180deg);*/

/*    transform: rotate(180deg);*/

/*}*/

/* ------------------------------------ */

/* CONTENT_CENTER */

/* ------------------------------------ */

#custom-content-center {
    padding: 0 20px;
}

/* news */

.news-sub-box p {
    color: #f5c76b;
}

.news-header .name, .bd-c {
    padding-top: 12px;
}

.news-header .name h3 {
    font-size: 13px;
    text-transform: uppercase;
    color: #f5c76b;
    position: relative;
    font-family: "Friz-Quadrata-TT-Regular", serif;
    padding-left: 15px;
}

.news-header .type {
    margin-right: 15px;
}

.news-header .type h4 {
    font-size: 12px;
    color: #ad686b;
    font-family: "OpenSans-Regular", serif;
    position: relative;
}

.news-header {
    display: flex;
    justify-content: space-between;
    /*padding: 35px 15px;*/
    padding: 20px 15px 0;
    background-image: url(../img/news_header_bg.png)!important;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    border: 3px solid #032923;
    margin-top: 20px;
}

.news-header .nav-tabs {
    border-bottom: unset;
    font-family: "OpenSans-Regular", serif;
    font-size: 12px;
}

.news-header .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    background: unset;
    color: #f5c76b;
    border-bottom: 1px solid #9b1a28;
    padding-bottom: 30px;
}

.news-header .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link {
    border: unset;
    border-bottom: 1px solid #f5c76b;
    color: #f5c76b;
    padding-bottom: 30px;
}

.news-body {
    padding: 15px 15px 0 15px;
    background-color: #032923;
}

.news-body-bg {
    /*background-image: url(../img/left_sidebar_body.png);*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
    /*background-position: center -14px;*/
    background-color: #032923;
    display: flow-root;
}

/* news-sub */

.news-sub-header .name h3 {
    font-size: 13px;
    text-transform: uppercase;
    color: #f5c76b;
    position: relative;
    font-family: "Friz-Quadrata-TT-Regular", serif;
    padding-left: 15px;
}

.news-sub-header .type {
    margin-right: 15px;
}

.news-sub-header .type h4 {
    font-size: 12px;
    color: #e9b49b;
    font-family: "OpenSans-Regular", serif;
    position: relative;
}

.news-sub-header .type h4 .link {
    color: #ee5862;
}

.news-sub-header {
    display: flex;
    justify-content: space-between;
    padding: 21px 15px;
    background-image: url(../img/news_section_header_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.news-sub-body {
    padding: 15px 15px 0 15px;
    margin-bottom: 15px;
}

.news-sub-body-bg {
    /*background-image: url(../img/left_sidebar_body.png);*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
    /*background-position: center -14px;*/
    background-color: #032923;
    display: flow-root;
}

.news-sub-body p {
    color: #f5c76b;
    font-family: "OpenSans-Regular", serif;
    font-size: 12px;
}

/* content box */

/* news */

.content-header .name {}

.content-header .name h3, .pre-social {
    font-size: 20px;
    text-transform: uppercase;
    text-align: center;
    color: #f5c76b;
    position: relative;
    font-family: "Friz-Quadrata-TT-Regular", serif;
}

.content-header .type {
    margin-right: 15px;
}

.content-header .type h4 {
    font-size: 12px;
    color: #ad686b;
    font-family: "OpenSans-Regular", serif;
    position: relative;
}

.content-header, .page-hd {
    padding: 26px 15px;
    background-image: url(../img/news_header_bg.png)!important;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    border: 3px solid #032923;
    /*margin-top: 20px;*/
}

.content-header .nav-tabs {
    border-bottom: unset;
    font-family: "OpenSans-Regular", serif;
    font-size: 12px;
}

.content-header .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    background: unset;
    color: #f5c76b;
    border-bottom: 1px solid #9b1a28;
    padding-bottom: 30px;
}

.content-header .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link {
    border: unset;
    border-bottom: 1px solid #f5c76b;
    color: #f5c76b;
    padding-bottom: 30px;
}

.content-body {
    padding: 15px 15px 0 15px;
    background-color: #032923;
    padding-bottom: 15px;
}

.content-body-bg {
    /*background-image: url(../img/left_sidebar_body.png);*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
    /*background-position: center -14px;*/
    background-color: #032923;
    display: flow-root;
}

.content-body p {
    color: #f5c76b;
}

/* ------------------------------------ */

/* CONTENT_RIGHT */

/* ------------------------------------ */

.stats-body-bg {
    background-image: url(../img/right_sidebar_stats_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-color: #032923;
    /*display: flow-root;*/
}

.server-stats ul {
    padding: 25px;
}

.server-stats ul li {
    margin-right: 5px;
    margin-top: 20px;
    color: #f5c76b;
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
}

.server-stats ul li:hover {
    color: #f3e3d6;
}

.server-stats ul li::marker {
    font-size: 10px;
    color: #f5c76b;
}

.server-stats .value {
    width: 90px;
    background-color: #0a3f39;
    border-bottom: 1px solid #d4a24c !important;
    margin-top: -6px;
    padding: 5px 20px;
    float: right;
    text-align: center;
}

.players-online-bg {
    background-image: url(../img/right_sidebar_player_online_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.players-online-body {
    padding: 35px;
}

.players-online {
    text-align: center;
}

.players-online .amount {
    display: block;
    font-size: 26px;
    color: #ffddcd;
}

.players-online .main-text {
    font-family: 'OpenSans-Regular', serif;
    font-size: 13px;
    color: #f5c76b;
}

.players-online .main-text .twenty-four {
    color: #f5c76b;
}

.discord-banner {
    background-image: url(../img/right_sidebar_banner_discord.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 127px;
    position: relative;
    margin: 10px 0 20px;
}

.discord-banner:hover {
    filter: brightness(110%);
}

.discord-banner:active {
    filter: brightness(90%);
}

/* ------------------------------------ */

/* FOOTER */

/* ------------------------------------ */

footer {
    background-image: url('../img/footer_new.png');
    background-position: center;
    background-repeat: no-repeat;
    /*background-size: cover;*/
    width: 100%;
    /*height: 418px;*/
    margin-top: -200px;
}

.first-footer {
    padding-top: 305px;
    padding-bottom: 89px;
}

.second-footer {
    /*height: 50px;*/
    height: 68px;
    background-color: #032923;
    ;
    font-size: 12px;
}

.second-footer p {
    color: #f5c76b;
}

.second-footer a {
    color: #ee5862;
}

.top-footer ul {
    display: flex;
    width: 75%;
    margin: 0 auto;
    justify-content: center;
    list-style: none;
}

.top-footer ul li a {
    font-size: 14px;
    color: #f5c76b;
    text-align: center;
}

.top-footer ul li {
    padding-right: 80px;
}

.bottom-content {
    display: flex;
    justify-content: space-between;
    padding-top: 16px;
    /*padding: 70px 0 0 0;*/
    /*padding-top: 200px;*/
}

.bottom-content .backlink a {
    color: #c65c60;
}

/* RANKING */

.ranking {
    font-family: 'OpenSans-Regular', serif;
    font-size: 13px;
    color: #656565;
    border: 1px solid #1f1e1e;
    width: 100%;
}

.ranking .ranking-header, .thead-inverse tr {
    background: rgb(30, 15, 15);
    background: radial-gradient(circle, rgba(30, 15, 15, 1) 0%, rgba(57, 30, 29, 1) 0%, rgba(30, 15, 15, 1) 100%);
}

.ranking th {
    color: #ffffff;
}

.ranking td,
.ranking th {
    padding: 10px;
    border-top: 1px solid #5f2825;
    border-bottom: 1px solid #5f2825;
    color: #f3e4c1;
}

.ranking tr:nth-child(odd) {
    /*background-color: #361716;*/
    background: rgb(41, 17, 16);
    background: radial-gradient(circle, rgba(41, 17, 16, 1) 0%, rgba(76, 31, 30, 1) 0%, rgba(41, 17, 16, 1) 100%);
}

.ranking tr:nth-child(even) {
    /*background-color: #3a1e1e;*/
    background: rgb(32, 16, 16);
    background: radial-gradient(circle, rgba(32, 16, 16, 1) 0%, rgba(59, 30, 30, 1) 0%, rgba(32, 16, 16, 1) 100%);
}

.ranking a {
    color: #f3e4c1;
    text-decoration: none;
}

.ranking a:hover {
    color: #f1e7cf;
}

.ranking-paginator {
    display: inline-block;
}

.ranking-paginator a {
    font-family: 'OpenSans-Regular', serif;
    font-size: 14px;
    color: #f5c76b;
    padding: 8px;
    text-decoration: none;
}

.ranking-paginator a:hover {
    color: #f6e2d9;
}

.ranking-paginator a.active {
    color: #f3e4c1;
    background-color: #271414;
    border-radius: 50px;
}

/* ------------------------------------ */

/* BUTTONS */

/* ------------------------------------ */

/* btn_custom */

.btn-custom {
    position: relative;
    text-align: center;
}

.btn-text-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

/* btn_login */

.btn-login {
    background-image: url('../img/btn_nav_sign_in.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 102px;
    height: 33px;
    margin: 35px;
    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 12px;
    text-transform: uppercase;
    color: #1c0e0e;
}

.btn-login:hover {
    /*color: #e6cc8d;*/
    filter: brightness(120%);
}

/* btn_header_download */

.btn-header-download {
    background-image: url('../img/btn_main_download.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 174px;
    height: 51px;
    font-family: 'OpenSans-Bold', serif;
    font-size: 13px;
    text-transform: uppercase;
    color: white;
}

.btn-header-download:hover {
    /*color: #e6cc8d;*/
    filter: brightness(120%);
}

/* btn_login_box */

.btn-login-box {
    background-image: url('../img/btn_left_sidebar.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 106px;
    height: 34px;
    /*margin: 35px;*/
    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 12px;
    text-transform: uppercase;
    color: #1c0e0e;
}

.btn-login-box:hover {
    /*color: #e6cc8d;*/
    filter: brightness(120%);
}

/* btn_content */

.btn-content {
    background-image: url('../img/btn_left_sidebar.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 140px;
    height: 34px;
    /*margin: 35px;*/
    font-family: 'OpenSans-Bold', serif;
    font-size: 12px;
    /*text-transform: uppercase;*/
    color: #1c0e0e;
}

.btn-content:hover {
    /*color: #e6cc8d;*/
    filter: brightness(120%);
}

/* btn_banner_register */

.btn-banner-register {
    background-image: url('../img/left_sidebar_banner_register.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 131px;
    margin: 10px 0 20px;
}

.btn-banner-register:hover {
    filter: brightness(110%);
}

.btn-banner-register:active {
    filter: brightness(90%);
}

.btn-text-banner-register-main {
    position: absolute;
    left: 30px;
    top: 50px;
    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 16px;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px rgba(255, 82, 101, 0.75);
    color: #3a0a0f;
}

.btn-text-banner-register-second {
    position: absolute;
    left: 30px;
    top: 75px;
    font-family: 'OpenSans-Regular', serif;
    font-size: 11px;
    color: #ff7382;
}

/* btn_banner_discord */

.btn-banner-discord {
    background-image: url('../img/right_sidebar_banner_discord.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 127px;
    margin: 10px 0 20px;
}

.btn-banner-discord:hover {
    filter: brightness(110%);
}

.btn-banner-discord:active {
    filter: brightness(90%);
}

.btn-text-banner-discord-main {
    position: absolute;
    left: 30px;
    top: 50px;
    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 16px;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px rgba(255, 192, 162, 0.75);
    color: #2b1f19;
}

.btn-text-banner-discord-second {
    position: absolute;
    left: 30px;
    top: 75px;
    font-family: 'OpenSans-Regular', serif;
    font-size: 11px;
    color: #ffe2d5;
}

/* btn_download */

.btn-download {
    background-image: url('../img/btn_download.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 265px;
    height: 79px;
}

.btn-download:hover {
    filter: brightness(120%);
}

.btn-download:active {
    filter: brightness(80%);
}

.btn-text-download-main {
    position: absolute;
    top: 40%;
    left: 60%;
    transform: translate(-50%, -50%);
    width: 100%;
    /*font-family: 'Cinzel-Bold', serif;*/
    font-size: 20px;
    text-transform: uppercase;
    color: #cab078;
    background: #FEFCFB;
    background: -webkit-radial-gradient(ellipse farthest-corner at center center, #FEFCFB 0%, #E0C0A6 77%);
    background: -moz-radial-gradient(ellipse farthest-corner at center center, #FEFCFB 0%, #E0C0A6 77%);
    background: radial-gradient(ellipse farthest-corner at center center, #FEFCFB 0%, #E0C0A6 77%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn-text-download-second {
    position: absolute;
    top: 57%;
    left: 60%;
    transform: translate(-50%, -50%);
    width: 100%;
    /*font-family: 'NunitoSans-Regular', serif;*/
    font-size: 13px;
    color: white;
}

/* btn_donate */

.btn-donate {
    background-image: url('../img/btn_donate.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 265px;
    height: 79px;
}

.btn-donate:hover {
    filter: brightness(120%);
}

.btn-donate:active {
    filter: brightness(80%);
}

.btn-text-donate-main {
    position: absolute;
    top: 40%;
    left: 60%;
    transform: translate(-50%, -50%);
    width: 100%;
    /*font-family: 'Cinzel-Bold', serif;*/
    font-size: 20px;
    text-transform: uppercase;
    color: #cab078;
    background: #FEFCFB;
    background: -webkit-radial-gradient(ellipse farthest-corner at center center, #FEFCFB 0%, #E0C0A6 77%);
    background: -moz-radial-gradient(ellipse farthest-corner at center center, #FEFCFB 0%, #E0C0A6 77%);
    background: radial-gradient(ellipse farthest-corner at center center, #FEFCFB 0%, #E0C0A6 77%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn-text-donate-second {
    position: absolute;
    top: 57%;
    left: 60%;
    transform: translate(-50%, -50%);
    width: 100%;
    /*font-family: 'NunitoSans-Regular', serif;*/
    font-size: 13px;
    color: white;
}

/* btn search */

.btn-search {
    position: absolute;
    color: #ecbd99;
    padding-top: 7px;
    right: 10px;
}

.btn-search:hover {
    color: #f3d1b7;
    filter: brightness(120%);
}

/* ------------------------------------ */

/* MISC */

/* ------------------------------------ */

.color-empire-1 {
    color: #ee5862;
}

.color-empire-2 {
    color: #ffa57b;
}

.color-empire-3 {
    color: #58abeb;
}

.form-check-label {
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #f5c76b;
}

/* SweetAlert - Kronius2 Theme */

.swal2-modal {
    background-color: #032923 !important;
    border: 2px solid #032923 !important;
}

#swal2-title {
    color: #f5c76b !important;
}

#swal2-content {
    color: #f5c76b !important;
}

.swal2-footer {
    border-top: 1px solid #2c1919 !important;
}

.swal2-footer a {
    color: #f5c76b !important;
}

.swal2-footer a:hover {
    color: #fdf0e6 !important;
}

.swal2-styled.swal2-confirm {
    background-color: #F5B993 !important;
    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 12px;
    text-transform: uppercase;
    color: #1c0e0e !important;
}

.swal2-styled.swal2-cancel {
    background-color: #5e2726 !important;
    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 12px;
    text-transform: uppercase;
    color: #ffffff !important;
}

.swal2-loader {
    border-color: #A45F5F transparent #A45F5F transparent !important;
}

/* account sidebar */

#account_block {
    /*padding-top: 29px;*/
    /*margin-bottom: 22px;*/
    text-align: center;
}

#account_block a {
    display: block;
    /*margin: 5px 0;*/
    padding: 5px 0;
    text-decoration: none;
    color: #f5c76b;
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
}

#account_block a:hover {
    color: white;
}

/* animations */

@-webkit-keyframes flash {
    0% {
        background: rgb(71, 68, 68);
    }
    50% {
        background: rgba(255, 0, 0, 0);
    }
    100% {
        background: rgba(215, 129, 113, 0.5);
    }
}

@keyframes flash {
    0% {
        background: rgba(215, 129, 113, 0.5);
    }
    50% {
        background: rgba(255, 0, 0, 0);
    }
    100% {
        background: rgba(215, 129, 113, 0.5);
    }
}

.form-group label {
    color: #f5c76b;
}

#loginCaptcha {
    transform: scale(0.9);
    transform-origin: 0 0;
    margin-top: 15px;
}

#registerCaptcha {
    transform: scale(0.94);
    transform-origin: 0 0;
    margin-top: 15px;
}


/* Captcha theme styling (custom added, minimal impact) */
.captcha-theme-wrap {
    display: inline-block;
    margin-top: 15px;
    padding: 8px;
    background: linear-gradient(180deg, rgba(4, 29, 24, 0.98) 0%, rgba(6, 20, 18, 0.98) 100%);
    border: 1px solid rgba(74, 168, 128, 0.35);
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.35) inset;
}

.captcha-theme-wrap .g-recaptcha {
    transform: scale(0.92);
    transform-origin: center top;
    margin: -4px -10px -8px -10px;
}

.captcha-row-custom td {
    vertical-align: middle !important;
}

.captcha-row-custom td:first-child {
    width: 160px;
}

.captcha-img-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 140px;
    min-height: 42px;
    padding: 6px 10px;
    background: rgba(6, 20, 18, 0.95);
    border: 1px solid rgba(74, 168, 128, 0.35);
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.35) inset;
}

.captcha-img-wrap img {
    display: block;
    max-width: 100%;
    height: auto;
}

.captcha-input-theme {
    height: 52px !important;
    font-size: 20px !important;
    letter-spacing: 1px;
    background: rgba(6, 20, 18, 0.95);
    border: 1px solid rgba(74, 168, 128, 0.35);
    color: #d9fff0;
}

.captcha-input-theme::placeholder {
    color: rgba(217,255,240,0.55);
}


.languagepicker {
    background-color: #012923;
    display: inline-block;
    padding: 0;
    height: 40px;
    overflow: hidden;
    transition: all .3s ease;
    margin: 60px 0 0 0;
    vertical-align: top;
    float: left;
    position: fixed;
    right: 0px;
    z-index: 9999;
}

.languagepicker:hover {
    /* don't forget the 1px border */
    height: 81px;
}

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

.languagepicker li {
    display: block;
    padding: 0px 10px;
    line-height: 40px;
    border-top: 1px solid #3c290a;
}

.languagepicker li:hover {
    background-color: #012923;
}

.languagepicker a:first-child li {
    border: none;
    background: #012923 !important;
}

.roundborders {
    -webkit-border-top-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.table > tbody > tr > td {
	vertical-align: middle;
}

a {
    color: #f6e2d9;
}
a:hover {
    color: #f5c76b;
}
.fade:not(.show) {
	opacity: 1!important;
}
.card {
	padding: 15px;
	border-radius: 0;
    background-color: #361617;
}
.table thead th {
    border-bottom: unset;
}
.modal-content {
    background-color: #2d1316;
	color: white;
}
.jumbotron {
	background-color: transparent;
}
.pagination {
   justify-content: center;
}
.page-link {
    color: #f3e4c1;
    background-color: #0a3f39;
    border: 1px solid #f5c76b;
}

.page-link:hover, .page-link:focus, .page-link:active {
	color: #daceb1;
    background-color: #592e2e;
    border: 1px solid #923834;
}

/* ===== Homepage center news heading fix ===== */
.content-box {
    background-color: #032923;
}

.content-box .heading-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 58px;
    padding: 16px 18px;
    margin: 0 0 12px 0;
    background-image: url(../img/news_header_bg.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    border: 3px solid #032923;
    overflow: visible;
    position: relative;
    z-index: 2;
}

.content-box .heading-main strong {
    display: block;
    margin: 0;
    line-height: 1.2;
    font-size: 18px;
    text-transform: uppercase;
    color: #f5c76b;
    font-family: "Friz-Quadrata-TT-Regular", serif;
}

.content-box .heading-main .switch {
    display: flex;
    align-items: center;
    gap: 12px;
}

.content-box .heading-main .switch .option {
    color: #f5c76b;
    text-decoration: none;
}

.content-box .heading-main .switch .option span {
    font-size: 12px;
    line-height: 1.2;
}

.content-box .padding-container,
.content-box .news-list,
.content-box .news-article,
.content-box .news-body,
.content-box .content-body,
.content-box .content-body-bg {
    overflow: visible;
}


/* ===== Animated top logo text: M2Baldana ===== */
.logo-animated-wrap {
    margin-top: -150px;
    min-height: 180px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    z-index: 12;
}

.m2baldana-hero {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 18px 38px;
    margin-top: 8px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(0, 72, 67, 0.18), rgba(0, 20, 18, 0.05));
    box-shadow: inset 0 0 20px rgba(73, 255, 231, 0.09), 0 0 28px rgba(44, 230, 207, 0.12);
    overflow: hidden;
}

.m2baldana-text {
    position: relative;
    z-index: 2;
    font-family: 'TrajanProBold', 'Friz Quadrata TT Regular', serif;
    font-size: 52px;
    line-height: 1;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #d7fff9;
    text-shadow:
        0 0 3px rgba(200,255,247,.95),
        0 0 8px rgba(130,255,241,.9),
        0 0 18px rgba(44,230,207,.8),
        0 0 34px rgba(10,170,155,.65),
        0 2px 0 rgba(0,0,0,.35);
    animation: m2baldanaPulse 2.8s ease-in-out infinite, m2baldanaIntro 900ms ease-out both;
}

.m2baldana-text::before {
    content: 'M2Baldana';
    position: absolute;
    inset: 0;
    color: rgba(255,255,255,0.28);
    filter: blur(2px);
    transform: translateY(2px) scale(1.01);
    z-index: -1;
}

.m2baldana-hero::before {
    content: '';
    position: absolute;
    top: -35%;
    left: -30%;
    width: 32%;
    height: 170%;
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(190,255,250,.36), rgba(255,255,255,0));
    transform: rotate(18deg);
    animation: m2baldanaShine 4.5s linear infinite;
    z-index: 1;
}

.m2baldana-glow {
    position: absolute;
    inset: auto 10% -8px 10%;
    height: 10px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(75,255,233,.55) 0%, rgba(75,255,233,.18) 55%, rgba(75,255,233,0) 100%);
    filter: blur(6px);
    animation: m2baldanaPulse 2.8s ease-in-out infinite;
}

@keyframes m2baldanaPulse {
    0%,100% { transform: scale(1); opacity: .94; }
    50% { transform: scale(1.025); opacity: 1; }
}

@keyframes m2baldanaShine {
    0% { left: -35%; opacity: 0; }
    8% { opacity: 1; }
    45% { opacity: 1; }
    55% { opacity: 0; }
    100% { left: 120%; opacity: 0; }
}

@keyframes m2baldanaIntro {
    0% { opacity: 0; transform: translateY(-18px) scale(.96); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 991px) {
    .logo-animated-wrap {
        margin-top: -110px;
        min-height: 130px;
    }
    .m2baldana-hero { padding: 14px 20px; }
    .m2baldana-text { font-size: 34px; letter-spacing: 2px; }
    .logo-add { margin-top: -235px; }
}

@media (max-width: 575px) {
    .logo-animated-wrap { margin-top: -80px; min-height: 100px; }
    .m2baldana-text { font-size: 24px; letter-spacing: 1px; }
    .m2baldana-hero { padding: 10px 14px; border-radius: 10px; }
}

/* ===== Position M2Baldana logo beside character sword (desktop) ===== */
header .container,
header .container .row,
header .container .col-md-8 {
    position: relative;
}

.logo {
    margin-top: 0 !important;
    position: relative;
    min-height: 0;
}

.logo-animated-wrap {
    position: absolute;
    right: 20px;
    top: 165px;
    margin-top: 0 !important;
    min-height: 0 !important;
    width: auto;
    display: block;
    z-index: 16;
    pointer-events: none;
}

.m2baldana-hero {
    margin-top: 0;
    padding: 14px 28px;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(0, 58, 54, 0.20), rgba(0, 16, 14, 0.04));
    box-shadow: inset 0 0 20px rgba(73,255,231,.08), 0 0 24px rgba(44,230,207,.13);
}

.m2baldana-text {
    font-size: 40px;
    letter-spacing: 2px;
}

/* keep header action strip visible under logo */
.logo-add {
    position: relative;
    z-index: 10;
}

@media (max-width: 1199px) {
    .logo-animated-wrap {
        right: 10px;
        top: 175px;
    }
    .m2baldana-text { font-size: 34px; }
    .m2baldana-hero { padding: 12px 22px; }
}

@media (max-width: 991px) {
    .logo-animated-wrap {
        position: relative;
        right: auto;
        top: auto;
        margin: -95px auto 10px auto !important;
        width: 100%;
        display: flex;
        justify-content: center;
    }
    .m2baldana-text { font-size: 30px; }
    .logo-add { margin-top: -210px; }
}

/* ===== Animated hero banner (M2Baldana) - premium electric (single layer) ===== */
header {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    /* animate the ORIGINAL banner only (no duplicate image overlay) */
    background-position: center top;
    background-repeat: no-repeat;
    will-change: background-position, filter;
    animation: heroBasePan 18s ease-in-out infinite alternate,
               heroBasePulse 6.8s ease-in-out infinite;
}

/* electric atmosphere overlay (NO duplicated banner image) */
header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
      radial-gradient(circle at 72% 38%, rgba(120,255,240,.22) 0%, rgba(120,255,240,0) 35%),
      radial-gradient(circle at 53% 52%, rgba(75,255,225,.16) 0%, rgba(75,255,225,0) 42%),
      radial-gradient(circle at 25% 60%, rgba(150,255,255,.08) 0%, rgba(150,255,255,0) 45%),
      linear-gradient(135deg, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 25%, rgba(0,0,0,.10) 100%);
    mix-blend-mode: screen;
    animation: heroAuraShift 10s ease-in-out infinite alternate;
}

/* premium electric streak / shimmer */
header::after {
    content: "";
    position: absolute;
    inset: -8% -12%;
    z-index: 1;
    pointer-events: none;
    background:
      linear-gradient(110deg,
        rgba(255,255,255,0) 0%,
        rgba(206,255,251,.00) 38%,
        rgba(206,255,251,.18) 46%,
        rgba(206,255,251,.00) 54%,
        rgba(255,255,255,0) 100%),
      repeating-linear-gradient(118deg,
        rgba(94,255,231,0) 0 18px,
        rgba(94,255,231,.055) 19px 20px,
        rgba(94,255,231,0) 21px 44px);
    opacity: .85;
    transform: translateX(-14%) translateY(0) skewX(-8deg);
    filter: blur(.15px);
    animation: heroElectricSweep 8.2s cubic-bezier(.4,0,.2,1) infinite;
}

header .container,
header .container .row,
header .container .col-md-8 {
    position: relative;
    z-index: 3;
}

/* animated glow on lower banner plate */
header .logo-add {
    position: relative;
    z-index: 3;
}

header .logo-add::before {
    content: "";
    position: absolute;
    left: 4%;
    right: 4%;
    bottom: 8px;
    height: 18px;
    border-radius: 18px;
    background: radial-gradient(ellipse at center, rgba(35,255,220,.42) 0%, rgba(35,255,220,.16) 48%, rgba(35,255,220,0) 80%);
    filter: blur(9px);
    opacity: .8;
    pointer-events: none;
    animation: heroPlateGlow 2.8s ease-in-out infinite;
}

header .logo-add::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 18px;
    pointer-events: none;
    background:
      linear-gradient(104deg, rgba(255,255,255,0) 16%, rgba(193,255,249,.16) 33%, rgba(255,255,255,0) 49%),
      linear-gradient(180deg, rgba(40,255,224,.06), rgba(40,255,224,0));
    transform: translateX(-120%) skewX(-16deg);
    animation: heroPlateShine 5.2s linear infinite;
}

/* subtle electric edge near sword / logo side */
.logo-animated-wrap::before {
    content: "";
    position: absolute;
    inset: -20px -50px -20px -50px;
    pointer-events: none;
    z-index: -1;
    background:
      radial-gradient(circle at 35% 50%, rgba(132,255,241,.22), rgba(132,255,241,0) 58%),
      radial-gradient(circle at 70% 35%, rgba(255,255,255,.10), rgba(255,255,255,0) 42%);
    filter: blur(10px);
    animation: heroLogoElectric 4.6s ease-in-out infinite;
}

@keyframes heroBasePan {
    0%   { background-position: 50% 0; }
    50%  { background-position: 51.2% 0.6%; }
    100% { background-position: 49.2% 1%; }
}

@keyframes heroBasePulse {
    0%,100% { filter: brightness(1) saturate(1.02) contrast(1.01); }
    50%     { filter: brightness(1.07) saturate(1.11) contrast(1.03); }
}

@keyframes heroAuraShift {
    0%   { transform: translate3d(-8px, -2px, 0) scale(1); opacity: .75; }
    100% { transform: translate3d(10px, 4px, 0) scale(1.02); opacity: 1; }
}

@keyframes heroElectricSweep {
    0%   { transform: translateX(-16%) translateY(-1%) skewX(-8deg); opacity: .15; }
    10%  { opacity: .45; }
    38%  { opacity: .9; }
    52%  { opacity: .32; }
    100% { transform: translateX(14%) translateY(1.5%) skewX(-8deg); opacity: .18; }
}

@keyframes heroPlateGlow {
    0%,100% { opacity: .48; transform: scaleX(.96); }
    50%     { opacity: .95; transform: scaleX(1.03); }
}

@keyframes heroPlateShine {
    0%   { transform: translateX(-135%) skewX(-16deg); opacity: 0; }
    8%   { opacity: .9; }
    18%  { opacity: .45; }
    34%  { opacity: 0; }
    100% { transform: translateX(170%) skewX(-16deg); opacity: 0; }
}

@keyframes heroLogoElectric {
    0%,100% { opacity: .65; transform: scale(1); }
    45%     { opacity: 1; transform: scale(1.02); }
    50%     { opacity: .78; }
}

@media (prefers-reduced-motion: reduce) {
    header,
    header::before,
    header::after,
    header .logo-add::before,
    header .logo-add::after,
    .logo-animated-wrap::before {
        animation: none !important;
    }
}


/* ===== FULL PREMIUM HERO UPGRADE (electric + fog + particles) ===== */
header {
    animation: heroBasePanPremium 14s ease-in-out infinite alternate,
               heroBasePulsePremium 4.2s ease-in-out infinite !important;
    filter: saturate(1.08);
}

/* stronger electric atmosphere */
header::before {
    background:
      radial-gradient(circle at 72% 35%, rgba(160,255,248,.28) 0%, rgba(160,255,248,0) 38%),
      radial-gradient(circle at 57% 53%, rgba(92,255,230,.24) 0%, rgba(92,255,230,0) 44%),
      radial-gradient(circle at 23% 62%, rgba(180,255,255,.10) 0%, rgba(180,255,255,0) 48%),
      radial-gradient(circle at 40% 18%, rgba(66,255,233,.08) 0%, rgba(66,255,233,0) 36%),
      linear-gradient(135deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,.12) 100%);
    opacity: .95;
    animation: heroAuraShiftPremium 7.4s ease-in-out infinite alternate !important;
}

/* cinematic energy sweep */
header::after {
    inset: -12% -16%;
    background:
      linear-gradient(112deg, rgba(255,255,255,0) 0%, rgba(230,255,252,0) 34%, rgba(230,255,252,.24) 45%, rgba(230,255,252,.02) 52%, rgba(255,255,255,0) 62%),
      repeating-linear-gradient(116deg, rgba(98,255,233,0) 0 12px, rgba(98,255,233,.07) 13px 14px, rgba(98,255,233,0) 15px 24px),
      radial-gradient(circle at 65% 50%, rgba(150,255,247,.10), rgba(150,255,247,0) 55%);
    opacity: .9;
    filter: blur(.2px) drop-shadow(0 0 6px rgba(130,255,242,.12));
    animation: heroElectricSweepPremium 5.8s cubic-bezier(.4,0,.2,1) infinite !important;
}

/* fog layer */
header .container::before {
    content: "";
    position: absolute;
    left: -6%;
    right: -6%;
    top: 70px;
    height: 360px;
    z-index: 1;
    pointer-events: none;
    background:
      radial-gradient(ellipse at 20% 55%, rgba(170,255,248,.12) 0%, rgba(170,255,248,0) 55%),
      radial-gradient(ellipse at 48% 65%, rgba(120,255,235,.10) 0%, rgba(120,255,235,0) 60%),
      radial-gradient(ellipse at 80% 48%, rgba(160,255,250,.11) 0%, rgba(160,255,250,0) 52%);
    filter: blur(14px);
    opacity: .85;
    transform: translateZ(0);
    animation: heroFogDrift 11s ease-in-out infinite alternate;
}

/* particles / electric dust */
header .container::after {
    content: "";
    position: absolute;
    inset: 20px 0 90px 0;
    z-index: 2;
    pointer-events: none;
    background-image:
      radial-gradient(circle, rgba(201,255,251,.85) 0 1px, rgba(201,255,251,0) 1.7px),
      radial-gradient(circle, rgba(121,255,233,.65) 0 1px, rgba(121,255,233,0) 1.8px),
      radial-gradient(circle, rgba(255,255,255,.55) 0 .8px, rgba(255,255,255,0) 1.4px);
    background-size: 180px 120px, 240px 160px, 310px 210px;
    background-position: 0 0, 40px 30px, 80px 50px;
    opacity: .34;
    filter: drop-shadow(0 0 3px rgba(130,255,240,.15));
    animation: heroParticlesFloat 12s linear infinite;
}

/* make lower plate feel premium */
header .logo-add::before {
    height: 22px;
    bottom: 6px;
    background: radial-gradient(ellipse at center, rgba(58,255,225,.56) 0%, rgba(58,255,225,.25) 45%, rgba(58,255,225,0) 82%);
    filter: blur(11px);
    animation: heroPlateGlowPremium 2.1s ease-in-out infinite !important;
}

header .logo-add::after {
    background:
      linear-gradient(104deg, rgba(255,255,255,0) 15%, rgba(210,255,251,.22) 34%, rgba(255,255,255,0) 52%),
      linear-gradient(180deg, rgba(64,255,227,.10), rgba(64,255,227,0));
    animation: heroPlateShinePremium 3.8s linear infinite !important;
}

/* stronger aura around right logo area */
.logo-animated-wrap::before {
    inset: -40px -90px -40px -90px;
    background:
      radial-gradient(circle at 28% 54%, rgba(140,255,243,.30), rgba(140,255,243,0) 58%),
      radial-gradient(circle at 72% 38%, rgba(255,255,255,.13), rgba(255,255,255,0) 45%),
      radial-gradient(circle at 62% 70%, rgba(75,255,228,.12), rgba(75,255,228,0) 55%);
    filter: blur(14px);
    animation: heroLogoElectricPremium 3.4s ease-in-out infinite !important;
}

.m2baldana-hero {
    background: linear-gradient(180deg, rgba(8,65,61,.30), rgba(0,18,16,.10));
    border: 1px solid rgba(148,255,246,.12);
    box-shadow: inset 0 0 28px rgba(90,255,235,.12), 0 0 35px rgba(60,241,217,.18), 0 0 80px rgba(35,220,200,.08);
    backdrop-filter: blur(2px);
}

.m2baldana-text {
    color: #d7fffa;
    text-shadow:
      0 0 6px rgba(210,255,252,.55),
      0 0 16px rgba(125,255,239,.45),
      0 0 34px rgba(66,242,220,.30);
    animation-duration: 2.1s, .8s !important;
}

.m2baldana-text::before {
    content: "";
    position: absolute;
    inset: -6px -18px;
    z-index: -1;
    background: radial-gradient(ellipse at center, rgba(106,255,238,.12) 0%, rgba(106,255,238,0) 70%);
    filter: blur(8px);
    animation: heroLogoHalo 2.8s ease-in-out infinite;
}

@keyframes heroBasePanPremium {
    0%   { background-position: 50% 0; }
    30%  { background-position: 50.8% .6%; }
    60%  { background-position: 49.4% 1.1%; }
    100% { background-position: 50.2% .2%; }
}

@keyframes heroBasePulsePremium {
    0%,100% { filter: brightness(1.02) saturate(1.05) contrast(1.02); }
    40%     { filter: brightness(1.09) saturate(1.14) contrast(1.04); }
    50%     { filter: brightness(1.12) saturate(1.18) contrast(1.05); }
}

@keyframes heroAuraShiftPremium {
    0%   { transform: translate3d(-12px,-4px,0) scale(1); opacity: .84; }
    50%  { transform: translate3d(6px,2px,0) scale(1.02); opacity: 1; }
    100% { transform: translate3d(14px,5px,0) scale(1.03); opacity: .9; }
}

@keyframes heroElectricSweepPremium {
    0%   { transform: translateX(-22%) translateY(-1%) skewX(-8deg); opacity: .08; }
    12%  { opacity: .85; }
    22%  { opacity: .38; }
    38%  { opacity: .18; }
    54%  { opacity: .95; }
    66%  { opacity: .34; }
    100% { transform: translateX(22%) translateY(2%) skewX(-8deg); opacity: .12; }
}

@keyframes heroFogDrift {
    0%   { transform: translate3d(-18px, 0, 0) scale(1); opacity: .58; }
    50%  { transform: translate3d(10px, -6px, 0) scale(1.03); opacity: .82; }
    100% { transform: translate3d(22px, 4px, 0) scale(1.06); opacity: .64; }
}

@keyframes heroParticlesFloat {
    0%   { background-position: 0 0, 40px 30px, 80px 50px; opacity: .18; }
    50%  { background-position: 90px -24px, 5px 12px, 130px 18px; opacity: .38; }
    100% { background-position: 180px -48px, -30px -6px, 180px -12px; opacity: .2; }
}

@keyframes heroPlateGlowPremium {
    0%,100% { opacity: .55; transform: scaleX(.95); }
    40%     { opacity: .95; transform: scaleX(1.02); }
    50%     { opacity: 1;  transform: scaleX(1.04); }
}

@keyframes heroPlateShinePremium {
    0%   { transform: translateX(-140%) skewX(-16deg); opacity: 0; }
    10%  { opacity: 1; }
    20%  { opacity: .45; }
    32%  { opacity: 0; }
    45%  { opacity: .28; }
    57%  { opacity: 0; }
    100% { transform: translateX(175%) skewX(-16deg); opacity: 0; }
}

@keyframes heroLogoElectricPremium {
    0%,100% { opacity: .65; transform: scale(1); }
    30%     { opacity: 1; transform: scale(1.03); }
    55%     { opacity: .82; transform: scale(1.015); }
}

@keyframes heroLogoHalo {
    0%,100% { opacity: .35; transform: scale(.98); }
    50%     { opacity: .75; transform: scale(1.03); }
}

@media (max-width: 991px) {
    header .container::before { height: 260px; top: 95px; }
    header .container::after { opacity: .22; }
    .m2baldana-hero { backdrop-filter: none; }
}

@media (prefers-reduced-motion: reduce) {
    header .container::before,
    header .container::after,
    .m2baldana-text::before { animation: none !important; }
}

/* ===== FIX: homepage news content should not overlap right statistics column ===== */
.content-box {
    position: relative;
    z-index: 1;
    min-width: 0;
}

/* Keep the news/article content clipped inside center column */
.content-box .padding-container,
.content-box .news-list,
.content-box .news-article,
.content-box .news-body,
.content-box .content-body,
.content-box .content-body-bg {
    overflow: hidden !important;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* Long CKEditor content / emoji / links should wrap instead of pushing into sidebar */
.content-box .news-list *,
.content-box .news-article *,
.content-box .news-body *,
.content-box .content-body * {
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: anywhere;
    word-wrap: break-word;
}

/* Media from articles should stay inside container */
.content-box .news-list img,
.content-box .news-article img,
.content-box .news-body img,
.content-box .content-body img,
.content-box .news-list iframe,
.content-box .news-article iframe,
.content-box .news-body iframe,
.content-box .content-body iframe,
.content-box .news-list table,
.content-box .news-article table,
.content-box .news-body table,
.content-box .content-body table {
    max-width: 100% !important;
    height: auto;
}

/* Keep right sidebar visually above if content gets close */
.stats-body-bg,
.server-stats,
.players-online-bg,
.discord-banner {
    position: relative;
    z-index: 3;
}


/* ===== FIX V2: prevent center news column from breaking right sidebar (Bootstrap flex min-width issue) ===== */
.row > [class*="col-"] {
    min-width: 0;
}

#custom-content-center {
    min-width: 0;
    max-width: 100%;
    position: relative;
    z-index: 1;
}

/* Keep right sidebar above center background if content gets long */
#custom-content-center + .col-lg-3,
#custom-content-center ~ .col-lg-3:last-child {
    position: relative;
    z-index: 2;
    min-width: 0;
}

/* Clip only the article body, not the whole header/sidebar layout */
.content-box {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

/* CKEditor often injects nowrap/inline styles; force wrapping in article text area */
.content-box .news-sub-box,
.content-box .news-sub-body,
.content-box .news-sub-body p,
.content-box .news-sub-body div,
.content-box .news-sub-body span,
.content-box .news-sub-body a,
.content-box .news-body p,
.content-box .news-body div,
.content-box .news-body span,
.content-box .news-body a {
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: anywhere;
}

/* Never let article tables/media exceed center column */
.content-box table,
.content-box iframe,
.content-box img,
.content-box video {
    max-width: 100% !important;
}



/* ===== Staff Online (Navbar + Page) ===== */
.staff-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:6px;
  padding:1px 8px;
  border-radius:999px;
  font-size:12px;
  line-height:18px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.10);
}

.dropdown-menu.staff-menu{
  min-width: 340px;
  padding: 12px 12px;
  background: rgba(10, 16, 18, .96);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  transform-origin: top right;
  animation: staffDropIn .18s ease-out both;
}

@keyframes staffDropIn{
  from { opacity: 0; transform: translateY(-6px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.staff-menu-title{
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .3px;
  opacity: .92;
  padding: 2px 6px 10px 6px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.staff-menu-title small{
  opacity:.7;
  font-weight:600;
  font-size:12px;
}

.staff-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 9px 8px;
  border-radius: 12px;
}
.staff-row:hover{
  background: rgba(255,255,255,.06);
}

.staff-dot{
  width:10px;height:10px;border-radius:50%;
  background: rgba(255,255,255,.22);
  box-shadow: 0 0 0 4px rgba(255,255,255,.04);
  flex:0 0 auto;
}
.staff-dot.on{
  background: #2ecc71;
  box-shadow: 0 0 0 4px rgba(46,204,113,.14);
}
.staff-dot.off{
  background: rgba(255,255,255,.18);
  box-shadow: 0 0 0 4px rgba(255,255,255,.06);
}
.staff-dot.pulse{
  animation: staffPulse 1.4s ease-in-out infinite;
}
@keyframes staffPulse{
  0% { box-shadow: 0 0 0 4px rgba(46,204,113,.10), 0 0 0 0 rgba(46,204,113,.0); }
  50%{ box-shadow: 0 0 0 6px rgba(46,204,113,.14), 0 0 16px 0 rgba(46,204,113,.20); }
  100%{ box-shadow: 0 0 0 4px rgba(46,204,113,.10), 0 0 0 0 rgba(46,204,113,.0); }
}

.staff-meta{ flex:1; min-width:0; }
.staff-name{
  font-weight:800;
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.staff-role{ font-size:12px; opacity:.72; }

.staff-state{
  font-size:12px;
  opacity:.85;
  font-weight:700;
}
.staff-state.ok{ color:#2ecc71; }
.staff-state.muted{ opacity:.55; }

.staff-page-link{
  font-weight: 800;
  border-radius: 10px;
}

/* Staff page layout */
.staff-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 12px;
}
@media (max-width: 992px){
  .staff-grid{ grid-template-columns: 1fr; }
}
.staff-card{
  background: rgba(10, 16, 18, .55);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 12px;
}
.staff-card-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 4px 6px 10px 6px;
}
.staff-card-title{ font-weight: 900; letter-spacing:.2px; }
.staff-count{
  margin-left:auto;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  background: rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.10);
}
.staff-card-body{ padding: 0 4px 4px 4px; }
.staff-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 10px 8px;
  border-radius: 12px;
}
.staff-item:hover{ background: rgba(255,255,255,.05); }
.staff-empty{ padding: 8px; opacity:.75; }


/* === Staff dropdown (enhanced) === */
.dropdown-menu.staff-menu{
  position: relative;
  overflow: hidden;
}
.dropdown-menu.staff-menu:before{
  content:"";
  position:absolute; inset:0;
  padding:1px;
  border-radius:16px;
  background: linear-gradient(120deg, rgba(255,215,120,.22), rgba(46,204,113,.18), rgba(120,180,255,.18), rgba(255,215,120,.22));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  animation: staffGlow 3.5s linear infinite;
  pointer-events:none;
}
@keyframes staffGlow{
  0%{ filter: hue-rotate(0deg); opacity:.85; }
  50%{ filter: hue-rotate(25deg); opacity:1; }
  100%{ filter: hue-rotate(0deg); opacity:.85; }
}

.staff-menu-title{
  padding: 4px 6px 12px 6px;
}
.staff-title-main{
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .4px;
}
.staff-title-sub{
  margin-top: 2px;
  font-size: 12px;
  opacity: .72;
}

.staff-row{
  transition: transform .12s ease, background .12s ease;
  animation: staffRowIn .22s ease-out both;
}
@keyframes staffRowIn{
  from{ opacity:0; transform: translateY(-6px); }
  to{ opacity:1; transform: translateY(0); }
}
.staff-row:hover{
  transform: translateY(-1px);
}

.staff-dot.on{
  position: relative;
  animation: staffPulse 1.6s ease-out infinite;
}
.staff-dot.on:after{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius:50%;
  background: rgba(46,204,113,.18);
  filter: blur(0px);
  animation: staffRing 1.6s ease-out infinite;
}
@keyframes staffPulse{
  0%{ transform: scale(1); }
  40%{ transform: scale(1.08); }
  100%{ transform: scale(1); }
}
@keyframes staffRing{
  0%{ transform: scale(.5); opacity:.0; }
  30%{ opacity:.55; }
  100%{ transform: scale(1.25); opacity:0; }
}

.staff-state{
  font-weight: 700;
}
.staff-row .staff-state{
  opacity: .85;
}
.staff-row .staff-state:before{ content:""; }
.staff-row .staff-state{
  color: rgba(255,255,255,.75);
}
.staff-row .staff-dot.on + .staff-meta + .staff-state{
  color: rgba(46,204,113,.95);
}
.staff-row .staff-dot.off + .staff-meta + .staff-state{
  color: rgba(255,255,255,.55);
}



/* ===== Premium Staff Ticket (modal) ===== */
.staff-row.js-staff-ticket{ cursor:pointer; }
.staff-menu-footer{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.10);
}
.staff-cta{
  width: 100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.92);
  font-weight: 800;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.staff-cta:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.09);
  box-shadow: 0 10px 28px rgba(0,0,0,0.25);
}
.staff-cta-ic{
  width: 26px; height: 26px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 10px;
  background: rgba(46,204,113,0.18);
  border: 1px solid rgba(46,204,113,0.25);
}
.staff-cta-sub{
  margin-top: 6px;
  font-size: 12px;
  color: rgba(255,255,255,0.65);
  padding: 0 2px;
}

.ticket-modal{ position:fixed; inset:0; z-index:99999; display:none; }
.ticket-modal.is-open{ display:block; }
.ticket-modal__backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.58);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  animation: ticketFade .18s ease-out;
}
.ticket-modal__card{
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%) scale(.985);
  width:min(560px, calc(100vw - 24px));
  background: rgba(18, 28, 32, .97);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  box-shadow: 0 26px 80px rgba(0,0,0,.58);
  padding: 14px 14px 12px;
  animation: ticketPop .22s ease-out;
  overflow:hidden;
}
.ticket-modal__card:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(120px 120px at 30px 30px, rgba(46,204,113,.20), transparent 60%),
              radial-gradient(120px 120px at 95% 15%, rgba(255,215,0,.10), transparent 65%);
  pointer-events:none;
  opacity:.9;
}
@keyframes ticketFade { from{opacity:0} to{opacity:1} }
@keyframes ticketPop { from{opacity:0; transform:translate(-50%,-48%) scale(.97)} to{opacity:1; transform:translate(-50%,-50%) scale(1)} }

.ticket-modal__head{ position:relative; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; z-index:1; }
.ticket-modal__title{ font-weight:900; font-size:15px; color:rgba(255,255,255,.92); letter-spacing:.2px;}
.ticket-modal__sub{ font-size:12px; color:rgba(255,255,255,.68); margin-top:2px; max-width: 420px; }
.ticket-modal__x{
  position:relative;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.90);
  border-radius: 12px;
  padding: 7px 10px;
  cursor:pointer;
  z-index:1;
}
.ticket-modal__form{ position:relative; margin-top: 12px; z-index:1; }
.ticket-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 520px){ .ticket-grid{ grid-template-columns: 1fr; } }

.ticket-modal__label{ display:block; margin:10px 0 6px; font-size:12px; color:rgba(255,255,255,.72); }
.ticket-modal__input, .ticket-modal__textarea, .ticket-modal__select{
  width:100%;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.92);
  border-radius: 14px;
  padding: 10px 12px;
  outline:none;
}
.ticket-modal__select{ padding: 10px 12px; }
.ticket-modal__input:focus, .ticket-modal__textarea:focus, .ticket-modal__select:focus{
  border-color: rgba(46,204,113,.35);
  box-shadow: 0 0 0 4px rgba(46,204,113,.10);
}
.ticket-modal__actions{ display:flex; justify-content:flex-end; gap:10px; margin-top: 12px; }
.ticket-modal__btn{
  border-radius: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.14);
  cursor:pointer;
  font-weight: 900;
}
.ticket-modal__btn--ghost{ background: rgba(255,255,255,.06); color: rgba(255,255,255,.88); }
.ticket-modal__btn--primary{
  background: rgba(46,204,113,.22);
  border-color: rgba(46,204,113,.30);
  color: rgba(255,255,255,.94);
  box-shadow: 0 10px 28px rgba(46,204,113,.08);
}
.ticket-modal__hint{ margin-top:10px; font-size:12px; color:rgba(255,255,255,.72); min-height: 16px; }



/* ===== Premium Staff Ticket (modal) ===== */
.staff-row.js-staff-ticket{ cursor:pointer; }
.staff-menu-footer{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.10);
}
.staff-cta{
  width: 100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.92);
  font-weight: 800;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.staff-cta:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.09);
  box-shadow: 0 10px 28px rgba(0,0,0,0.25);
}
.staff-cta-ic{
  width: 26px; height: 26px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 10px;
  background: rgba(46,204,113,0.18);
  border: 1px solid rgba(46,204,113,0.25);
}
.staff-cta-sub{
  margin-top: 6px;
  font-size: 12px;
  color: rgba(255,255,255,0.65);
  padding: 0 2px;
}

.ticket-modal{ position:fixed; inset:0; z-index:99999; display:none; }
.ticket-modal.is-open{ display:block; }
.ticket-modal__backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.58);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  animation: ticketFade .18s ease-out;
}
.ticket-modal__card{
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%) scale(.985);
  width:min(560px, calc(100vw - 24px));
  background: rgba(18, 28, 32, .97);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  box-shadow: 0 26px 80px rgba(0,0,0,.58);
  padding: 14px 14px 12px;
  animation: ticketPop .22s ease-out;
  overflow:hidden;
}
.ticket-modal__card:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(120px 120px at 30px 30px, rgba(46,204,113,.20), transparent 60%),
              radial-gradient(120px 120px at 95% 15%, rgba(255,215,0,.10), transparent 65%);
  pointer-events:none;
  opacity:.9;
}
@keyframes ticketFade { from{opacity:0} to{opacity:1} }
@keyframes ticketPop { from{opacity:0; transform:translate(-50%,-48%) scale(.97)} to{opacity:1; transform:translate(-50%,-50%) scale(1)} }

.ticket-modal__head{ position:relative; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; z-index:1; }
.ticket-modal__title{ font-weight:900; font-size:15px; color:rgba(255,255,255,.92); letter-spacing:.2px;}
.ticket-modal__sub{ font-size:12px; color:rgba(255,255,255,.68); margin-top:2px; max-width: 420px; }
.ticket-modal__x{
  position:relative;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.90);
  border-radius: 12px;
  padding: 7px 10px;
  cursor:pointer;
  z-index:1;
}
.ticket-modal__form{ position:relative; margin-top: 12px; z-index:1; }
.ticket-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 520px){ .ticket-grid{ grid-template-columns: 1fr; } }

.ticket-modal__label{ display:block; margin:10px 0 6px; font-size:12px; color:rgba(255,255,255,.72); }
.ticket-modal__input, .ticket-modal__textarea, .ticket-modal__select{
  width:100%;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.92);
  border-radius: 14px;
  padding: 10px 12px;
  outline:none;
}
.ticket-modal__select{ padding: 10px 12px; }
.ticket-modal__input:focus, .ticket-modal__textarea:focus, .ticket-modal__select:focus{
  border-color: rgba(46,204,113,.35);
  box-shadow: 0 0 0 4px rgba(46,204,113,.10);
}
.ticket-modal__actions{ display:flex; justify-content:flex-end; gap:10px; margin-top: 12px; }
.ticket-modal__btn{
  border-radius: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.14);
  cursor:pointer;
  font-weight: 900;
}
.ticket-modal__btn--ghost{ background: rgba(255,255,255,.06); color: rgba(255,255,255,.88); }
.ticket-modal__btn--primary{
  background: rgba(46,204,113,.22);
  border-color: rgba(46,204,113,.30);
  color: rgba(255,255,255,.94);
  box-shadow: 0 10px 28px rgba(46,204,113,.08);
}
.ticket-modal__hint{ margin-top:10px; font-size:12px; color:rgba(255,255,255,.72); min-height: 16px; }