/*
    Copyright (C) Mizuki2. All rights reserved.
    Developed 2023 by MCDEV Software.
 */

/* ------------------------------------ */
/* FONTS */
/* ------------------------------------ */
/* open-sans */
@font-face {
    font-family: 'OpenSans-Regular';
    src: url('../font/open-sans/static/OpenSans/OpenSans-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'OpenSans-Bold';
    src: url('../font/open-sans/static/OpenSans/OpenSans-Bold.ttf') format('truetype');
}
@font-face {
    font-family: 'OpenSans-ExtraBold';
    src: url('../font/open-sans/static/OpenSans/OpenSans-ExtraBold.ttf') format('truetype');
}

/* trajan-pro */
@font-face {
    font-family: 'Trajan-Pro-Regular';
    src: url('../font/trajan-pro/TrajanPro-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'Trajan-Pro-Bold';
    src: url('../font/trajan-pro/TrajanPro-Bold.otf') format('opentype');
}

/* myriad-pro */
@font-face {
    font-family: 'Myriad-Pro-Regular';
    src: url('../font/myriad-pro/MYRIADPRO-REGULAR.OTF') format('opentype');
}

/* friz-quadrata */
@font-face {
    font-family: 'Friz-Quadrata';
    src: url('../font/friz-quadrata-tt/FrizQuadrataTT.ttf') format('truetype');
}

/* ------------------------------------ */
/* DEFAULT */
/* ------------------------------------ */
body {
    background-color: #011612 !important;

    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #79c3b7;

    background: url('../img/header_bg.png');
    background-repeat: no-repeat;
    background-position: center;
    background-position-y: 0;
}

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

a:hover {
    color: #5a948b;
    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;
}

hr {
    border-top: 1px solid #79c3b7;
}

/* input style */
#login-form input[type='text'],
#login-form input[type='email'],
#login-form input[type='password'] {

    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #d3d2e0;
    background-color: #011612;
    border: unset;
    border-bottom: 1px solid #1d322e !important;

    /*display: block;*/
    margin-top: 14px;
    padding: 20px 20px 20px 45px;
}

#register-form input[type='text'],
#register-form input[type='email'],
#register-form input[type='password'] {

    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #d3d2e0;
    background-color: #011612;
    border: unset;
    border-bottom: 1px solid #79c3b7 !important;

    /*display: block;*/
    margin-top: 14px;
    padding: 20px;
    width: 100%;
    height: 44px;
}

#donate-form input[type='text'],
#donate-form input[type='email'],
#donate-form input[type='password'] {

    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #d3d2e0;
    background-color: #0e031b;
    border: 1px solid #3a2551 !important;

    /*display: block;*/
    /*margin-top: 14px;*/
    padding: 16px;
    width: 100%;
    /*height: 44px;*/
}

#donate-form input[type='text']::placeholder,
#donate-form input[type='email']::placeholder,
#donate-form input[type='password']::placeholder {
    background-color: #0e031b;
    color: #d3d2e0;
}

input[type='text']:focus,
input[type='email']:focus,
input[type='password']:focus {
    background-color: #011612;
    color: #d3d2e0;
}

input[type='text']::placeholder,
input[type='email']::placeholder,
input[type='password']::placeholder {
    background-color: #011612;
    color: #d3d2e0;
}

/* ------------------------------------ */
/* NAVBAR */
/* ------------------------------------ */
#navbarSupportedContent {
    margin-top: -35px;
}

.navbar {
    background-image: url(../img/nav_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

    height: 89px;
}

.navbar-expand-lg .navbar-nav .nav-link {
    color: #eae7e7;
    font-size: 13px;
}

.navbar-expand-lg .navbar-nav .nav-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

.navbar-expand-lg .navbar-nav .nav-item {
    padding: 5px 25px 0;
}

/* .nav-item.active {
    background-image: url(../img/nav_item_hover.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 50px;
} */

/* ------------------------------------ */
/* SIDEBAR */
/* ------------------------------------ */
.sidebar-box-small {
    padding: 10px 20px 15px;
    background-image: url(../img/sidebar_panel_small2.png);
    background-repeat: no-repeat;
    position: relative;
    width: 314px;
    height: 334px;
}

.sidebar-box-small .header h3 {
    font-family: 'Trajan-Pro-Bold', serif;
    font-size: 13px;
    color: #fcffff;
    text-transform: uppercase;
    text-align: center;

    padding-top: 7px;
    margin-bottom: unset;
}

.sidebar-box-small .body h4 {
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #ffffff;
    margin-bottom: 20px;
}

.sidebar-box-small .body {
    padding: 45px 0 15px 0;
    color: white;
}


.sidebar-box-big {
    padding: 10px 20px 15px;
    background-image: url(../img/sidebar_panel_big2.png);
    background-repeat: no-repeat;
    position: relative;
    width: 314px;
    height: 408px;
}

.sidebar-box-big .header h3 {
    font-family: 'Trajan-Pro-Bold', serif;
    font-size: 13px;
    color: #fcffff;
    text-transform: uppercase;
    text-align: center;

    padding-top: 7px;
    margin-bottom: unset;
}

.sidebar-box-big .body h4 {
    font-family: 'OpenSans-Regular', serif;
    font-size: 12px;
    color: #ffffff;
    margin-bottom: 20px;
}

.sidebar-box-big .body {
    padding: 45px 0 15px 0;
    color: white;
}

/* ------------------------------------ */
/* SECTION_MAIN */
/* ------------------------------------ */
#main {
    margin-top: -75px;
    min-height: 900px;

    background-image: url('../img/content_bg2.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: 55px;
}

#main .content-slider .footer {
    font-family: 'OpenSans-Bold', serif;
    font-size: 30px;

    padding: 20px;
    margin-top: -80px;
}

/* ranking */
.ranking-top-one {
    background: #120521;
    background: linear-gradient(90deg, #052c24 0%, #0c2923 17%, #06241e 28%, #031310 100%);
    border-top: 1px solid #011612;

    padding: 10px;
}

.ranking-top-one .entity-icon {
    background-image: url(../img/ranking_top_one_icon_bg.png);
    background-repeat: no-repeat;
    float: left;
    width: 41px;
    height: 41px;
    margin-left: 20px;
}

.ranking-top-one .entity-icon .digit {
    position: absolute;
    padding-left: 17px;
    padding-top: 28px;
    z-index: 3;
}

.ranking-top-one .entity-data {
    margin-left: 69px;
}

.ranking-top-one .entity-data .player-name {
    margin-left: 10px;
    color: #fdfcfb;
}

.ranking-top-one .entity-data .empire {
    margin-left: 5px;
}

.ranking-top-one .entity-data .guild-name {
    color: #5a948b;
}

.ranking-top-one .entity-data .splitter {
    border-left: 1px solid #79c3b7;
    border-right: 1px solid #0a131a;
    display: inline-block;
    height: 8px;
    margin: 2px 4px 0;
}

.ranking-top-one .entity-data .level {
    color: #5a948b;
}

.ranking-top-one .entity-data .level .digit {
    color: #fff;
}

.ranking-top-one .color-gold {
    color: #cca844;

}


.ranking-table th {
    color: #ffffff !important;
}

.ranking-table td, .table th {
    border: 0;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    color: #ffffff;
    padding: 8px 10px;
}

/*.ranking-table tr {*/
/*    border-bottom: 1px solid #1b254a;*/
/*}*/

.ranking-table .count {
    color: #ffffff;
}
.ranking-table .player {
    color: #ffffff;
}
.ranking-table .level {
    color: #5a948b;
    text-align: center;
}
.ranking-table .value {
    color: #fff;
    float: right;
}

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

/* ranking sm */
.ranking-small tr:nth-child(odd) {
    background-color: #02251e;
}

.ranking-small tr:nth-child(even) {
    background-color: #03372d;
}


/* big ranking */
.ranking {
    font-family: 'OpenSans-Regular', serif;
    font-size: 13px;
    color: #656565;
    border: 1px solid #011612;

    width: 100%;
}

.ranking .ranking-header {
    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: 5px;
    vertical-align: middle;
    border-top: 1px solid #011612;
    border-bottom: 1px solid #011612;
    color: #fff;
}

.ranking tr:nth-child(odd) {
    /*background-color: #361716;*/
    background: #011612;
    background: radial-gradient(circle, #02251e 0%, #033329 0%, #02251e 100%);
}

.ranking tr:nth-child(even) {
    /*background-color: #3a1e1e;*/
    background: #011612;
    background: radial-gradient(circle, #03372d 0%, #04473a 0%, #03372d 100%);
}

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

.ranking a:hover {
    color: white;
}

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

.ranking-paginator a {
    font-size: 12px;
    color: #d5d5d5;
    padding: 6px;
    text-decoration: none;
}

.ranking-paginator a:hover {
    color: white;
}

.ranking-paginator a.active {
    color: white;
    background: rgb(51,36,69);
    background: linear-gradient(0deg, #02251e 0%, #033329 100%);
    border: 1px solid #011612;
    /*border-radius: 50px;*/
}

/* ranking donate history */
.ranking .donate-status-progress {
    color: #e5941b;
}
.ranking .donate-status-completed {
    color: #48ad64;
}
.ranking .donate-status-declined {
    color: #de3939;
}

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

.forgot-password a {
    color: #5a948b;
    text-decoration: none;
}
.forgot-password a:hover {
    color: #5a948b;
}

/* account sidebar */
#account_block {
    /*text-align: center;*/
}

#account_block a {
    display: block;
    padding: 8px 0;
    text-decoration: none;

    font-family: "OpenSans-Regular", serif;
    font-size: 12px;
    color: #ffffff;
}
#account_block a:hover {
    color: #5a948b;
}
#account_block .item-a {
    background-color: #03372d;
    border-bottom: 1px solid #79c3b7;
    padding-left: 20px;
}
#account_block .item-b {
    background-color: #02251e;
    border-bottom: 1px solid #79c3b7;
    padding-left: 20px;
}

#account_block .account-info {
    margin: 0 20px 20px;
}
#account_block .violet {
    color: #5a948b;
}
#account_block .premium {
    color: #7bd458;
}
#account_block .default {
    color: #a781e0;
}
#account_block .account-info .coins-text {
    position: absolute;
    right: 0;
    top: 0;
    margin-right: 20px;

    font-family: "OpenSans-Bold", serif;
    font-size: 16px;
    color: #ffead7;

    cursor: default;
}
#account_block .account-info .coins-text img {
    margin-left: 5px;
    margin-top: -2px;
}

/* ------------------------------------ */
/* CONTENT_CENTER */
/* ------------------------------------ */

#custom-content-center {
    padding: 0 5px;
    margin-top: 12px;
}

.content-section {
    background-image: url(../img/news_title_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    font-family: "Trajan-Pro-Bold", serif;
    font-size: 12px;
    color: #fcffff;
    text-align: center;
    text-transform: uppercase;
    margin: 30px 63px 20px;
    padding: 17px;
}

/* news */
.news-header .name {
    padding-top: 12px;
}

.news-header .name h3 {
    position: relative;
    font-family: "Trajan-Pro-Regular", serif;
    font-size: 16px;
    color: #ffffff;
    text-transform: uppercase;
    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);*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
    background-color: #022921;
    position: relative;
    /*border: 3px solid #361f1f;*/
    /*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 {
    border: unset;
    border-bottom: 1px solid #79c3b7;
    color: #5a948b;
}

.news-header .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    background: unset;
    color: #ffffff;
    border-bottom: 1px solid #92ffed;
}


.posted-on-splitter {
    margin: 6px 10px 0;
    border-left: 1px solid #79c3b7;
    border-right: 1px solid #0a131a;
    height: 12px;
}

.posted-on {
    color: #5a948b;
    padding-top: 3px;
}

.news-body {
    /*padding: 15px 15px 0 15px;*/
    padding: 15px;
    background-color: #02251e;
}

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

/* news-sub */
.news-sub-header .name h3 {
    font-size: 12px;
    text-transform: uppercase;
    color: #fcffff;
    position: relative;
    font-family: "OpenSans-ExtraBold", serif;
    padding-left: 12px;
    padding-top: 3px;
    margin-bottom: unset;
}

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

.news-sub-header .type h4 {
    position: relative;
    font-size: 11px;
    color: #5a948b;
    font-family: "OpenSans-Regular", serif;
    margin-bottom: unset;
    padding-top: 5px;
}

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

.news-sub-header {
    display: flex;
    justify-content: space-between;
    padding: 21px 15px;
    background-image: url(../img/news_title_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: #02251e;
    display: flow-root;
}

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

.news-sub-box {
    margin-top: 15px;
}

/* Download */
.download-box {
    padding: 20px;
}

.download-box-highlight {
    /*transition: background 0.25s linear;*/
}
.download-box-highlight:hover {
    background-color: #12352e78;
}

.download-box-left {
    border: #1d322e 1px solid;
}

.download-box-right {
    border: #1d322e 1px solid;
    border-left: unset;
}

.download-box-left-lower {
    border: #1d322e 1px solid;
    border-top: unset;
}

.download-box-right-lower {
    border: #1d322e 1px solid;
    border-left: unset;
    border-top: unset;
}

.download-box img {
    margin-right: 20px;
    float: left;
}
.download-box .main-text {
    display: block;
    font-size: 11px;
    color: #ffffff;
}
.download-box .sub-text {
    font-size: 11px;
    color: #5a948b;
}
.download-box .size-text {
    font-size: 12px;
    color: #5a948b;
    float: right;
    margin-top: -8px;
}

.download-system-requirements-table {
    border: #412b5a 1px solid;
    font-family: "OpenSans-Regular", serif;
    font-size: 12px;
}

.download-system-requirements-table .table {
    margin-bottom: unset;
}

.download-system-requirements-table .table tr th:last-child {
    border-right: 0;
}
.download-system-requirements-table .table tr td:last-child {
    border-right: 0;
}

.download-system-requirements-table .table th {
    border-top: unset;
    color: white;
    border-right: #412b5a 1px solid;
}

.download-system-requirements-table .table td {
    border-top: unset;
    border-right: #412b5a 1px solid;
}
.download-system-requirements-table .table td.title {
    color: #7b6c93;
}
.download-system-requirements-table .table td .desc {
    color: #4d3f57;
    display: block;
}


/* account */
.account {
    background-color: #041915;
    border: #1d322e 1px solid;
    padding: 20px;
}

.account .key {
    color: #ffffff;
}
.account .value {
    color: #5a948b;
}
.account .value.white {
    color: white;
}
.account .value.green {
    color: #66ae4b;
}
.account .value.yellow {
    color: #e7e4d2;
}
.account .value.OK {
    color: #69e9c3;
}
.account .value.BLOCK {
    color: #e96969;
}
.account .value.SHUTDOWN {
    color: #e9c069;
}

/* account > character-box */
.account-character-box {
    padding: 20px;
}

.account-character-box-left {
    border: #1d322e 1px solid;
}

.account-character-box-right {
    border: #1d322e 1px solid;
    border-left: unset;
}

.account-character-box-left-lower {
    border: #1d322e 1px solid;
    border-top: unset;
}

.account-character-box-right-lower {
    border: #1d322e 1px solid;
    border-left: unset;
    border-top: unset;
}

.account-character-box img {
    /*margin-top: 12px;*/
    margin-right: 20px;
    float: left;
}
.account-character-box img:hover {
    filter: grayscale(100%) brightness(70%) sepia(70%) hue-rotate(-100deg) saturate(200%) contrast(1);
}
.account-character-box .player-name {
    display: block;
    font-size: 11px;
    color: #ffffff;
    margin-right: 5px;
}
.account-character-box .level {
    font-size: 11px;
    color: #5a948b;
}
.account-character-box .level-value {
    font-size: 11px;
    color: #ffffff;
}
.account-character-box .guild-name {
    font-size: 11px;
    color: #5a948b;
}
.account-character-box .guild-name-value {
    font-size: 11px;
    color: #ffffff;
}
.account-character-box .no-character {
    margin-top: 14px;
    position: absolute;
    color: #9e8cb0;
}

.account-character-box .action {
    display: table-cell;
    padding-top: 10px;
}

/* donate */
.donate-box {
    background-color: #160728;
    border: #7d4e9e 1px solid;
    padding: 22px;
    cursor: pointer;
}
.donate-box.selected {
    background: rgb(74,28,127);
    background: linear-gradient(0deg, rgba(74,28,127,1) 0%, rgba(17,4,31,1) 100%);
}
.donate-box:hover {
    background: rgb(74,28,127);
    background: linear-gradient(0deg, rgba(74,28,127,1) 0%, rgba(17,4,31,1) 100%);
}
.donate-box .coins-value {
    display: block;
    font-family: 'OpenSans-Bold', serif;
    font-size: 14px;
    color: #ffffff;
}
.donate-box .coins-bonus-value {
    font-family: 'OpenSans-Regular', serif;
    font-size: 11px;
    color: #a555ff;
    margin-left: 2px;
}
.donate-box .coins-text {
    font-family: 'OpenSans-Regular', serif;
    font-size: 11px;
    color: #b380f9;
}
.donate-box .amount {
    font-family: 'OpenSans-Bold', serif;
    font-size: 14px;
    color: #ffffff;

    padding: 5px 10px;
    background-color: #0f091d;
    border-radius: 5px;

    position: absolute;
    top: 0;
    right: 0;
    margin: 27px 35px 27px 0;
}
.donate-box.selected .amount {
    background-color: #21103c;
}
.donate-box img.coins-image {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}
.donate-box .content {
    margin-left: 35px;
}
.donate-box .badge {
    position: absolute;
    right: 15px;
    top: 1px;
    height: 31px;
    width: 32px;
}
.donate-box .badge .text {
    color: #ffffff;
    transform: rotate(45deg);
    display: table-cell;
    font-family: 'OpenSans-Regular', serif;
    font-size: 9px;
    padding-left: 6px;
}
.donate-box .badge.red {
    background-image: url(../img/donate_badge_red.png);
    background-repeat: no-repeat;
}
.donate-box .badge.turquoise {
    background-image: url(../img/donate_badge_turquoise.png);
    background-repeat: no-repeat;
}
.donate-box.selected .payment-logo {
    filter: brightness(0) invert(1);
}
.donate-box.payment-box {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 77px;
    padding: unset;
}

.donate-submit {
    margin-top: 35px;
}
.donate-submit .purchase-tooltip {
    color: #e1dbe9;
    background-color: #170928;
    padding: 5px 10px;
    /*text-align: center;*/
}
.donate-submit .purchase-tooltip .purple {
    color: #b380f9;
}
.donate-submit .purchase-tooltip .turquoise {
    color: #39b8ad;
}

/* ------------------------------------ */
/* CONTENT_RIGHT */
/* ------------------------------------ */

.server-stats ul {
    padding: 0 15px 0 23px;
}

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

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

.server-stats .type .dark {
    color: #5a948b;
}

.server-stats .value {
    float: right;
    /*color: #e1d9d9;*/
}

.server-stats .footer {
    border-radius: 5px;
    background-color: #79c3b726;
    padding: 5px 12px;
    margin: 0 37px;
}

/* ------------------------------------ */
/* NEW FOOTER */
/* ------------------------------------ */

/* ------------------------------------ */
/* FOOTER */
/* ------------------------------------ */
/* footer {
    background-image: url('../img/footer_bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 10%;
    margin-top: -8px;
    padding: 0px 0;
}
footer p.copyright {
    color: #b4b4b4;
}
footer p.copyright a {
    color: #5a948b;
}
footer p.copyright a:hover {
    filter: brightness(120%);
} */

/* ------------------------------------ */
/* 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/nav_account_btn.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    width: 129px;
    height: 35px;

    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 11px;
    text-transform: uppercase;
    color: #ffffff;
}

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

/* btn_login_box */
.btn-login-box {
    background-image: url('../img/content_btn_bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    width: 97px;
    height: 37px;
    /*margin: 35px;*/

    font-family: 'Friz-Quadrata-TT', serif;
    font-size: 12px;
    text-transform: uppercase;
    color: #ffffff;
}

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

/* btn_ranking */
.btn-ranking {
    background-image: url('../img/content_btn_bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    width: 97px;
    height: 37px;
    /*margin: 35px;*/

    font-family: 'Friz-Quadrata-TT', serif;
    font-size: 12px;
    text-transform: uppercase;
    color: #ffffff;
}

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

/* btn_login */
.btn-content {
    background-image: url('../img/nav_account_btn.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    width: 129px;
    height: 35px;

    font-family: 'OpenSans-ExtraBold', serif;
    font-size: 11px;
    text-transform: uppercase;
    color: #ffffff;
}

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

/* account settings button */
.btn-account-settings {
    color: #ffffff;
    background-color: #1d322e;
    border-radius: 5px;
    width: 75px;
    height: 20px;
    margin-right: 10px;
}
.btn-account-settings:hover {
    filter: brightness(110%);
}

/* account character action button */
.btn-account-character-action {
    color: #ffffff;
    background-color: #2c124d;
    width: 62px;
    height: 22px;
    margin-right: 10px;
}
.btn-account-character-action:hover {
    filter: brightness(110%);
}

/* ------------------------------------ */
/* MISC */
/* ------------------------------------ */

/* input icon */
.input-icon {
    position: absolute;
    padding-right: 10px;
    color: #5a948b;
    /*top: 14px;*/
    margin-top: -30px;
    left: 31px;
}

.input-icon:after {
    content: '';
    height: 10px;
    width: 1px;
    border-right: 1px solid #241d31;
    position: absolute;
    right: 0;
    top: 4px;
}

/* particles */
#particles-js {
    width: 100%;
    height: 700px;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    position: absolute;
    /*top: 0;*/
}

.highlighted {
    color: #5a948b;
    text-decoration: underline;
}

/* empire colors */
.color-empire-1 {
    color: #ee594b;
}

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

.color-empire-3 {
    color: #656feb;
}

/* SweetAlert - Mizuki2 Theme */
.swal2-modal {
    background-color: #02251e !important;
    border: 1px solid #1d322e !important;
}

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

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

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

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

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

.swal2-styled.swal2-confirm {
    background-color: #1d322e !important;
    font-size: 12px;
    text-transform: uppercase;
    color: #ffffff !important;
}

.swal2-styled.swal2-cancel {
    background-color: #041915 !important;
    font-size: 12px;
    text-transform: uppercase;
    color: #ffffff !important;
}

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

.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step {
    background-color: #041915 !important;
}

.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step ~ .swal2-progress-step {
    background-color: #5a948b !important;
}

.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step ~ .swal2-progress-step-line {
    background-color: #5a948b !important;
}

.swal2-progress-steps .swal2-progress-step {
    background-color: #041915 !important;
}

.swal2-progress-steps .swal2-progress-step-line {
    background-color: #5a948b !important;
}

/* ------------------------------------ */
/* BOOTSTRAP_MODIFICATION */
/* ------------------------------------ */
.form-check-input {
    margin-top: 2px;
}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    overflow: hidden;
    background-color: #011612;
    /* background-image: url(../img/footer_logo.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 231px 102px; */
}

#preloader:before {
    content: "";
    position: fixed;
    /*top: calc(50% - 30px);*/
    /*left: calc(50% - 30px);*/
    /*border: 6px solid #37517e;*/
    /*border-top-color: #fff;*/
    /*border-bottom-color: #fff;*/
    /*border-radius: 50%;*/
    width: 60px;
    height: 60px;
}