@font-face { font-family: onestfont; src:url(../plugins/onestfont/onest-latin-400-normal.ttf); }
@font-face { font-family: onestfontMed; src:url(../plugins/onestfont/onest-latin-500-normal.ttf); }

body {  
    background-color:  #0F0F17;
    font-family: onestfont , sans-serif;
	color: #ffffff; 
}
h1, h2, h3, h4, h5, h6{
    font-family: onestfontMed, sans-serif;
}

.footerbg{
    background-color: #00000072;
    color: #fff;
    display: flex; 
    align-items: center; /* Vertically center the items */
    justify-content: center; 
    height: 65px;
    position: relative;
    bottom: 0;
}
.video-background{
    position: fixed;
    width: 100%;
    top: 0;
    z-index: -100;
    object-fit: cover;
    object-position: center;
}

.footercontent{
    display: flex; /* Use flexbox to arrange items */
    align-items: center; /* Vertically center the items */
    justify-content: center; /* Horizontally center the items */
    gap: 5px; /* Add space between the items */
    width: 100%; /* Ensure the footer content spans the entire footer */
}
.footer-logo {
    width: 124px;
    height: 56px;
    background: transparent url("../img/footer-logo.png") top center no-repeat;
    margin-top:15px; /* Add horizontal margin */
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.footer-text {
    flex: 1; /* Allows the text to expand and take up available space */
    text-align: center;
    position: relative;
}

.left-text {
    text-align: right; /* Align text to the right on the left side */
    padding-right: 10px; /* Add padding to the right to create space from the logo */
}

.right-text {
    text-align: left; /* Align text to the left on the right side */
    padding-left: 125px; /* Add padding to the left to create space from the logo */
}
h2 { color: #f7f6f6; padding: 20px 0;}

main { padding-bottom: 50px; }
a, a:link, a:visited { color: #5870b3; }
a:hover { text-decoration: none; color: #3c1d14; }

.content-width { max-width: 1120px; padding: 0; }
.desktop-height-dist { padding-top: 350px; }

.fixed-header { position: fixed; top: 0; left: 0; right: 0; margin-left: auto; margin-right: auto; z-index: 1; }
.logo { width: 295px; height: 132.5px; position: fixed; z-index: 100000; top: 20px; left: 0; right: 0; margin-left: auto; margin-right: auto; }
.navbar-nav { 
    background-color: #000000b0;
    width: 100%; margin: 0; padding: 0; position: fixed; top: 0;
    display: flex; justify-content: center; }

    .navbar { padding: 0; height: 800px; z-index: 99999; position: fixed; top: 0;}
    .nav-item {
        max-width: 203px; width: 17%; height: 80px; line-height: 65px; text-align: center; 
    }
        .nav-link { color: rgb(224, 222, 221) !important; text-transform: uppercase; font-size: 15px; font-family: onestfontMed; }
        .nav-link:hover { color: rgb(228, 207, 185) !important; }
    
    .navbar-nav.nav-item:hover, .routeActive{
        background-image: url("../img/navbg.png");
        background-repeat: no-repeat;
        background-position: bottom;
    }
    .navLogo:hover{
        background-color: transparent;
        background-image: none;
    }
.marginleft15 {margin-left:15%;}

.user-panel { width: 316px; height: 280px;
    background-color: #0F0F17;
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -0px -308px;
    padding-top: 15px;
}
    .user-panel.login { padding-top: 0; }
    .user-panel-add { padding-top: 0px;color: #fff; font-size: 12px;}
        .user-panel-add a, .user-panel-add a:link, .user-panel-add a:visited { color: #5870b3; font-size: 12px; text-decoration: underline; }
        .user-panel-add a:hover { color: #5860B3;}
.slider-panel { 
    max-width: 790px;
    width: 790px;
    height: 291px;
    margin-left: 2px;
}
.slider-panel img { 
    max-width: 790px;
    width: 790px;
    height: 291px;
}
.splide__list {
    display: flex;
    flex-direction: row-reverse; 
}
.splide__arrow{
    background-color: transparent;
}
.splide__arrow--next{
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
	background-position: -417px -336px;
    
}
.splide__arrow--prev{
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -387px -337px;
}
.btn-big {
    
    background-image: url("../img/mainpage_sliced.png");
    background-color: transparent;
    background-repeat: no-repeat;
    text-align: center;
    color: #3c1d14;
    font-weight: 600;
    font-size: 23px;
	text-shadow: -1px 1px 0 #000,
                         1px 1px 0 #000,
                         1px -1px 0 #000,
                         -1px -1px 0 #000;
}
.headerFont{padding-left: 20px; font-family: onestfontMed; letter-spacing: 1px; font-size: 1rem;} 
.headerFontSide{width: fit-content;text-align: center;font-family: onestfontMed; letter-spacing: 1px}
.btn-big.download {
    width: 304px; height: 97px;
    background-position: -508px -1002px;
    color: #562d20;
    margin-left: -1px;
    overflow: hidden
;
	}
    .btn-big.download:hover { background-position: -508px -1102px; }
    .btn-big.download:active { background-position: -508px -1202px; }
.btn-big.wiki {
    width: 304px; height: 97px;
    background-position: -192px -1002px;
    font-size: 15px;
    font-family: onestfontMed;
    color: #24110b;
    margin-left: -1px;
	
}

    .btn-big.wiki:hover { background-position: -192px -1102px; }
    .btn-big.wiki:active { background-position: -192px -1202px; }
.btn-big.vote {
    width: 304px; height: 97px;
    background-position: -824px -1002px;
    font-size: 15px;
    font-family: onestfontMed;
    color: #1e0d07;
    margin-left: -1px;
}
    .btn-big.vote:hover { background-position: -824px -1102px; }
    .btn-big.vote:active { background-position: -824px -1202px; }

.wiki .upperText {
    color: #fff;
    font-size: 17px;
    font-weight: normal;
    position: relative;
    top: 45px;
    left: 50px;
}
.wiki .lowerText {
    color: #d3d3d3;
    font-size: 12px;
    font-weight: normal;
    position: relative;
    top: 42px;
    left: 35px;
}

.vote .upperText {
    color: #fff;
    font-size: 17px;
    font-weight: normal;
    position: relative;
    top: 45px;
    left: 75px;
}
.vote .lowerText {
    color: #d3d3d3;
    font-size: 12px;
    font-weight: normal;
    position: relative;
    top: 42px;
    left: 71px;
}

.download .upperText {
    color: #fff;
    font-size: 17px;
    font-weight: normal;
    position: relative;
    top: 35px;
    left: -77px;
}
.download .lowerText {
    color: #d3d3d3;
    font-size: 12px;
    font-weight: normal;
    position: relative;
    top: 32px;
    left: -60px;
}
.member { color: #fff; font-size: 12px; padding-left: 7px; }

.vote-bg, .register-bg{
    background:url("../img/registration-header.png") top center no-repeat, 
    url("../img/registration-bg.png") bottom center no-repeat;
    margin-left: 4px;
    max-width: 775px;
    min-height: 0px;
    height: max-content;
    
}
.register-content{
    padding-top: 35px;
}
.ranking-bg{
    background:url("../img/ranking-header.png") top center no-repeat, 
    url("../img/ranking-bg.png") bottom center;
    margin-left: 4px;
    /* padding-top: 35px; */
    height: 987px;
    max-width: 775px;
}


input[type="text"],input[type="email"], input[type="password"]{ 
    width: 260px; height: 36px;
    border: 0;
    padding: 0 10px 0 10px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #ffffffaf;
    font-size: 14px;
    background-color: transparent;
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -533px -467px;
}

.register--input input[type="text"], .register--input input[type="password"],.register--input input[type="email"]{
    background-color: transparent;
    background-image: url("../img/registration_sliced.png");
    background-repeat: no-repeat;
    background-position: -1px -1px;
    border: none;
    transition: 0.2s ease-in;
}
 
.ranking-bg input[type="text"]:focus, .register--input input[type="text"]:focus, .register--input input[type="password"]:focus,.register--input input[type="email"]:focus
{
    border: solid 1.5px #7E5DC2;
} 
.image-container-content{
    display: flex;
    flex-direction: column; /* Stack images vertically */
    align-items: center; /* Center images horizontally */
}
.register--input select{
    width: 260px; height: 32px;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #ffffffaf;
    font-size: 14px;
    background-image: url("../img/registration_sliced.png");
    background-repeat: no-repeat;
    background-position: -2px -44px;
}
input[type="text"]:hover,input[type="password"]:hover,input[type="email"]:hover {
    color: #ffffffd3;

}
input[type="text"]:focus,input[type="password"]:focus,input[type="email"]:focus {
    /* outline: 0;
    /* border-color: transparent;
    /* box-shadow: 0 0 0 .2rem #3c1d14; */
    color: #ffffff;
    outline: none;
    box-shadow: none;
    background-color: #3f46ae;
}
.input select, .input select:hover, .input select:focus{

    background-image: url("../img/ranking-list-bg.png");
    background-repeat: no-repeat;
    background-color: transparent;
    width: 260px; height: 31px;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border: none;
    font-size: 12px;
    outline: none;
    box-shadow: none;
    margin-left: 0;
}
.input select option{
    font-size: 0.7rem;
    background-color: #00000094;
    color: #ffffffd3;

    /* background-image: url("../img/ranking-list-bg.png"); */
}
.centered-pres {
    display: flex;
    flex-direction: row;
    margin: 0;
    padding: 0;
    justify-content: center;
    align-content: center;
}
.effect ~ .focus-border:before,
.effect ~ .focus-border:after{content: ""; position: absolute; top: 0; left: 50%; width: 0; height: 2px; background-color: #7E5DC2; transition: 0.4s;}
.effect ~ .focus-border:after{top: auto; bottom: 0;}
.effect ~ .focus-border i:before,
.effect ~ .focus-border i:after{content: ""; position: absolute; top: 50%; left: 0; width: 2px; height: 0; background-color: #7E5DC2; transition: 0.6s;}
.effect ~ .focus-border i:after{left: auto; right: 0;}
.effect:focus ~ .focus-border:before,
.effect:focus ~ .focus-border:after{left: 0; width: 100%; transition: 0.4s;}
.effect:focus ~ .focus-border i:before,
.effect:focus ~ .focus-border i:after{top: 0; height: 100%; transition: 0.6s;}
.effect-restrict { padding: 0; width: 260px; height: 100%; }
.register-bg .btn-small{
    background-image: url("../img/registration_sliced.png");
    background-repeat: no-repeat;
    background-position: -1px -76px;
    width: 114px;
    margin-top: 15px;
}
.register-bg .btn-small:hover{
    background-image: url("../img/registration_sliced.png");
    background-repeat: no-repeat;
    background-position: -125px -76px;
}
.register-bg .btn-small:focus{
    background-image: url("../img/registration_sliced.png");
    background-repeat: no-repeat;
    background-position: -249px -76px;
}
.btn-small { width: 94px; height: 31px; border: 0;
    color: #fff;
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -436px -557px;

    font-family: onestfontMed;
	text-align: center;
    
    font-size: 13px;
}
    .btn-small:hover { background-position: -557px -557px; }
    .btn-small:focus { background-position: -678px -557px; }
.newsPageBG .btn-small{
    line-height: 31px;
}
.form-btn { width: 147px; height: 38px; border: 0;
    background-image: url("../img/assets.png");
    background-repeat: no-repeat;
    background-position: -2px -945px;
    color: #fff;
    font-size: 10px;
    font-family: onestfontMed;
    background-color: transparent;
}
    .form-btn:hover { background-position: -152px -945px; }
    .form-btn:focus { background-position: -302px -945px; }

.paddingLeftStatistics{padding-left: 21px;}
.paddingLeftStatistics2{padding-left: 55px;}
.sidebar-title, .news-title{
    color: #fff;
    font-size: 1rem;
    font-weight: normal;
}
.sidebar-title{
    text-transform: uppercase;
}
.news-title{
    padding-bottom: 25px;
    font-family: onestfontMed;
    letter-spacing: 1px;
}
.statistic-side-bar-overview{  
    background-color: #000;
    margin-top: 5px;
  
    font-weight: bolder;
    text-transform: uppercase; 
    padding-top: 15px; 
    height: 144px;
       
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -477px -311px;
}

.statistic-side-bar-overview .col-4{  
    color: #5870b3; 
    font-size: 8px; 
}

.statistic-side-bar-overview .statistics-values{  
    padding-top: 18px;
}
.statistic-side-bar-top5player { 
    background-color: #000;

    text-transform: uppercase; 
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -812px -311px;
    margin-top: 5px;
    padding-top: 15px;
    padding-bottom: 10px;
}
.statistic-side-bar-top5player-content{
    color: #ccc; 
    font-size: 0.7rem;
    padding-top: 25px;
}
.statistic-side-bar-top5guilds a:hover,
.statistic-side-bar-top5player a:hover,
.ranking-st-txt:hover,
.ranking-nd-txt:hover,
.ranking-rd-txt:hover
{
    color: #7E5DC2;
}
.statistic-side-bar-top5guilds { 
    background-color: #000;
    margin-top: 5px;
    text-transform: uppercase; 
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -1px -1px;
    padding-top: 15px;
    padding-bottom: 10px;
    margin-bottom: 0;
}
.statistic-side-bar-top5guilds-content{
    color: #ccc; 
    font-size: 0.7rem;
    padding-top: 25px;
}

    .ranking-icon { height: 12px; width: 12px;
        background-image: url("../img/mainpage_sliced.png");
        background-repeat: no-repeat;
    }
        .ranking-icon.st { background-position: -330px -325px; }
        .ranking-icon.nd { background-position: -346px -325px; }
        .ranking-icon.rd { background-position: -362px -325px; }

        .ranking-st-txt { color: rgb(236, 176, 124); }
        .ranking-nd-txt { color: rgb(204, 179, 174); }
        .ranking-rd-txt { color: rgb(180, 121, 105); }

.content-panel { 
    max-width:775px; max-height: 780px; 
    background-image: url("../img/mainpage_sliced.png");
    background-position: -348px -606px;
    padding: 15px 20px 20px 20px !important; 
    margin-bottom: 10px;
    margin-left: 5px;
   
}
.content-panel a{ color: #fff;}

.read-more-btn{
    width: 114px;
    height: 31px;
    background-color: transparent;
    background-image: url('../img/mainpage_sliced.png') ;
    background-repeat: no-repeat;
    background-position: -436px -515px;
    position: absolute;
    padding-top: 5px;
    bottom: 25px;
    left: 80%;
    color: #fff;
    text-align: center;
}
.read-more-btn:hover{
    background-position: -557px -515px;
}
.read-more-btn:focus{
    background-position: -678px -515px;
}
.news-text-second{
    color: lightgray;
}
.newsContent{
    /* min-height: 250px; */
    max-height: 200px;
}
.darkBg{
	background-color: #00000044;
}
.darkBgAdj{
	background-color: #00000044;
	width: max-content;
	padding-left: 15px;
	padding-right: 15px;
}
.user-panel-row {padding-left: 15px; color: #fff;height: 24px; line-height: 22px;  font-size: 15px; transition: .2s ease-in; padding-top: 0px; padding-bottom: 4px;margin-top: 3px;}
    .user-panel-row a:before {
        font-family: "Font Awesome 5 Free";
        content: "\f0da";
        display: inline-block;
        vertical-align: middle;
        font-weight: 900;
        font-size: 15px;
		transition: .2s ease-in;
		padding-right: 9px;
        color: #fff;
		padding-top: 2px; 
		padding-bottom: 2px;
    }
    .user-panel-row a, .user-panel-row a:link, .user-panel-row a:visited { color: #fff; }
    .user-panel-row a:hover { color: #5860B3;  }
    .user-panel-row a:hover::before { padding-right: 15px; }

.user-panel-login { width: 316px; overflow: hidden; padding-top: 1px;}
.search { height: 100px; text-align: center; }

.player-ranking { border-collapse: separate; border-spacing:0 5px; }
    .player-ranking tbody > tr { position:relative; background: #00000072; color: #fff; }
    .player-ranking td { vertical-align: middle; font-size: 0.75rem; padding: .3rem; border: none; }
    .player-ranking td:first-child { border:none; }
    .player-ranking td:last-child { border: none; }
    .player-ranking thead th { border: none; color: #fff; font-weight: normal;}
    .player-ranking a {color: #fff;}
    .player-ranking .level {color: #788CEB;}
    .player-ranking th{padding: .3rem; padding-top: 10px;}

    .empire { width: 45px; height: 28px; margin: 0 auto; background-image: url("../img/ranking_sliced.png"); background-repeat: no-repeat; }
        .empire.blue { background-position: -100px -50px; }
        .empire.red { background-position: -50px -50px; }
        .empire.yellow { background-position: -1px -50px; }
    .centered-input-container {
            display: flex;
            justify-content: center;
        }
        .centered-input-container-div {
            margin-top: 25px;
            display: flex;
            justify-content: center;
        }
    
.player-ranking-container { position: relative; }
    .player-ranking-icon {
        width: 45px;
        height: 53px;
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -517px -481px;
        z-index: 42;
    }
        .player-ranking-icon.rank-port-st { background-position: -2px -92px; }
        .player-ranking-icon.rank-port-nd { background-position: -51px -92px; }
        .player-ranking-icon.rank-port-rd { background-position: -101px -92px; }
        .player-ranking-icon.rank-port-4 { background-position: -151px -92px; }
        .player-ranking-icon.rank-port-5 { background-position: -201px -92px; }
        .player-ranking-icon.rank-port-6 { background-position: -2px -151px; }
        .player-ranking-icon.rank-port-7 { background-position: -51px -151px; }
        .player-ranking-icon.rank-port-8 { background-position: -101px -151px; }
        .player-ranking-icon.rank-port-9 { background-position: -151px -152px; }
        .player-ranking-icon.rank-port-10 { background-position: -201px -151px; }
        .player-ranking-icon.rank-port-gt10 {   
            
            width: 45px;
            height: 41px;
            background-image: url("../img/ranking_sliced_new.png"); 
            background-repeat: no-repeat;
            background-position: -241px -151px; 
            z-index: 42;
        }
    
    .player-ranking-port {
        width: 37px;
        height: 37px;
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        position: absolute;
        z-index: 43;
        top: 2px;
        left: 3px;

    }
        .player-ranking-port.warrior-m { background-position: -255px -152px; } 
        .player-ranking-port.warrior-f { background-position: -294px -152px; } 
        .player-ranking-port.sura-m { background-position: -441px -42px; }
        .player-ranking-port.sura-f { background-position: -441px -84px; } 
        .player-ranking-port.ninja-m { background-position: -333px -152px; } 
        .player-ranking-port.ninja-f { background-position: -372px -152px; } 
        .player-ranking-port.shaman-m { background-position: -411px -152px; } 
        .player-ranking-port.shaman-f { background-position: -441px -1px; } 
        .player-ranking-port.nonBorderAdjustment {top: 8px; left: 7px;}

    .page-item.disabled .page-link { display: none; }
    .adjustPaginator{
        position: absolute;
        bottom: 10px;
        margin: 0;
        padding: 0;
    }
    .pagination > li {
        margin-right: 10px;
    }
    .page-first, .page-first a {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -357px -38px;
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }
    
    .page-first:hover, .page-first a:hover, .page-first.active, .page-first .active {
        background-position: -399px -38px;
    }
    
    .page-last, .page-last a {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -357px -0px;
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }
    
    .page-last:hover, .page-last a:hover, .page-last.active, .page-last .active {
        background-position: -399px -0px;
    }
    .page-left, .page-left a{
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -273px -0px;
        width: 31px; height: 31px;
        border: none;
    }
    .page-left:hover, .page-left a:hover{
        background-position: -315px -0px;
    }
    .page-right, .page-right a{
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -273px -38px;
        width: 31px; height: 31px;
        border: none;
    }
    .page-right:hover, .page-right a:hover{
        background-position: -315px -38px;
    }

    .page-item-1, .page-item-1 a, .page-item-1 span {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -273px -76px;
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }
    

    .page-item-1:hover, .page-item-1 a:hover,
    .page-item-1.active, .page-item-1 .active {
        background-position: -315px -76px;
    }
    
    .page-item-2, .page-item-2 a, .page-item-2 span {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -357px -76px; 
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }

    .page-item-2:hover, .page-item-2 a:hover,
    .page-item-2.active, .page-item-2 .active {
        background-position: -399px -76px; 
    }
    .page-item-3, .page-item-3 a, .page-item-3 span {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -273px -114px;
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }
    
    .page-item-3:hover, .page-item-3 a:hover,
    .page-item-3.active, .page-item-3 .active {
        background-position: -315px -114px;
    }
    
    .page-item-4, .page-item-4 a, .page-item-4 span {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -357px -114px;
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }
    
    .page-item-4:hover, .page-item-4 a:hover,
    .page-item-4.active, .page-item-4 .active {
        background-position: -399px -114px;
    }
    
    .page-item-5, .page-item-5 a, .page-item-5 span {
        background-image: url("../img/ranking_sliced.png");
        background-repeat: no-repeat;
        background-position: -172px -45px;
        width: 31px;
        height: 31px;
        border: none;
        padding: 0;
        margin: 0;
    }
    
    .page-item-5:hover, .page-item-5 a:hover,
    .page-item-5.active, .page-item-5 .active {
        background-position: -214px -45px;
    }
    .paginator-playerRanking{
        display: flex;
        flex-direction: row;
        gap: 7px;
    }

.hr-line { height: 1px; background: rgb(180, 121, 105); }
    .hr-line.news-line { margin-top: 10px; margin-bottom: 15px; background-color: #b3a18f; }
    .hr-line.dark { background: #666; }
.content-hr { font-size: 1.1rem; }

.counter-highlight { color: beige; font-size: 0.9rem; font-weight: bold; }
.user-panel-login .counter-highlight{color: #5860B3; }
.static-main-area { max-width: 779px; width: 779px; background: #000000b6; font-size: 0.9rem;}
.static-side-bar { max-width: 314px;width: 316px;  background: #000000b6; min-height: 144px; max-height: 956px;}
.static-side-bar .statistics-text{max-width: 316px;}
.padding-0{padding: 0; }
.clear { clear: both; }
.left { float: left; }
.center { margin: 0 auto; }
.toUpper { text-transform: uppercase; }
.row-resize { margin: 10px 0 10px 0; }
.top30{margin-top: 30px;}

.form-group.radio, .form-group.checkbox { padding-right: 0; padding-left: 0.5rem; margin-left: 1.2em; /* margin-right: -1.2em; */ }
.checkbox label:after,
.radio label:after
    { content: ''; display: table; clear: both; }
.checkbox .cr,
.radio .cr
    {  position: relative; margin-left: -12px; margin-top: 0px; cursor: pointer; display: inline-block;  width: 12px; height: 12px; float: left;  margin-right: .5em; margin-top: 3px; }
.radio .cr, .checkbox .cr { border-radius: 0;
    background-image: url("../img/mainpage_sliced.png");
    background-repeat: no-repeat;
    background-position: -330px -347px; 
}

.checkbox .cr:focus,
.radio .cr:focus { outline: 0; }

.checkbox .cr .cr-icon,
.radio .cr .cr-icon
    { position: absolute; line-height: 0; font-weight: bold; font-style: normal; text-transform: uppercase;
        background-image: url("../img/mainpage_sliced.png");
        background-repeat: no-repeat;
        background-position: -350px -351px;
        width: 4px;
        height: 4px;
        margin-top: 4px;
        margin-left: 4px;
    }

.radio .cr .cr-icon { margin-left: 0.04em; }
.checkbox label input[type="checkbox"],
.radio label input[type="radio"] { display: none; cursor: pointer; }

.checkbox label input[type="checkbox"]+.cr>.cr-icon,
.radio label input[type="radio"]+.cr>.cr-icon { opacity: 0; }

.checkbox label input[type="checkbox"]:checked+.cr>.cr-icon,
.radio label input[type="radio"]:checked+.cr>.cr-icon { opacity: 1; }

.checkbox label input[type="checkbox"]:disabled+.cr,
.radio label input[type="radio"]:disabled+.cr { opacity: .5; }

.topbar {
  position: sticky;
  top: 25%;
  width: 100%;
  display: block;
  justify-content: left;
  outline: none;
}

.topbar > a, .topbar .dropdown button {
  display: block;
  width: 50px;
  height: 50px;
  background: transparent;
  transition: .2s ease-in;
  border: 0;
  border-radius: 0;
  border: none;
}
.topbar > a {
  line-height: 50px;
}

.topbar .dropdown-menu {
    background: transparent;
    margin-left: 50px;
    margin-top: -57px;
    border: none;
    outline: none;
    box-shadow: none;
}

.topbar .dropdown-item {
  display: block;
  width: 50px;
  height: 50px;
  padding: 0;
  text-align: center;
  line-height: 50px;
  transition: .2s ease-in;
  border: none;
}
.topbar .dropdown-menu:focus,
.topbar .dropdown-menu:active,
.topbar .dropdown-toggle:focus,
.topbar .dropdown-toggle:active{
    outline: none !important;
    border: none !important;
    background-color: transparent;
}
.topbar .dropdown-toggle::after {
	display: none !important;
}

.topbar .elitepvp{
    background-image: url('../img/menuleft_sliced.png');
    background-repeat: no-repeat;
    background-position: -105px -56px;
}
.topbar .elitepvp:hover{
    background-position: -156px -56px;
}
.topbar .tiktok{
    background-image: url('../img/menuleft_sliced.png');
    background-repeat: no-repeat;
    background-position: -1px -56px;
}
.topbar .tiktok:hover{
    background-position: -52px -56px;
}
.topbar .youtube{
    background-image: url('../img/menuleft_sliced.png');
    background-repeat: no-repeat;
    background-position: -1px -112px;
}
.topbar .youtube:hover{
    background-position: -52px -112px;
}
.topbar .instagram{
    background-image: url('../img/menuleft_sliced.png');
    background-repeat: no-repeat;
    background-position: -105px -112px;
}
.topbar .instagram:hover{
    background-position: -156px -112px;
}
.topbar .skype{
    background-image: url('../img/skype_buttons.png');
    background-repeat: no-repeat;
    background-position: -0px -0px;
}
.topbar .skype:hover{
    background-position: -53px -0px;
}
.topbar .lang{
    background-image: url('../img/menuleft_sliced.png');
    background-repeat: no-repeat;
    background-position: -1px -0px;
    width: 50px;    
    height: 50px;
    transition: .2s ease-in;
}
.topbar .lang:hover{
    background-position: -52px -0px;
}
.topbar .lang:focus{
    border: none;
    background-color: transparent;
}
.topbar .dropdown-item{
    background-image: url('../img/menuleft_sliced.png');
    background-repeat: no-repeat;
    background-position: -1px -1px;
    width: 50px;    
    height: 50px;
}
.topbar .dropdown-item:hover{
    background-position: -52px -1px;
}
.btnMega{
    width: 114px; height: 31px;
    background: transparent;
	border-radius: 2px;
	padding: 8.5px 57px;
	font-size: 13px;
	color: #fff;
	min-width: 114px;
	text-align: center;
    background-image: url("../img/downloads_sliced.png");
    background-repeat: no-repeat;
    background-position: -781px -0px;
}
.btnMega:hover{
    background-position: -898px -0px;
}
.btnMega:focus{
    background-position: -1014px -0px;
}
.btnDosya{
    width: 114px; height: 31px;
    background: transparent;
	border-radius: 2px;
	padding: 8.5px 57px;
	font-size: 13px;
	color: #fff;
	min-width: 114px;
	text-align: center;
    background-image: url("../img/downloads_sliced.png");
    background-repeat: no-repeat;
    background-position: -781px -37px;
}
.btnDosya:hover{
    background-position: -898px -37px;
}
.btnDosya:focus{
    background-position: -1014px -37px;
}
.btnMediaFire{
    width: 114px; height: 31px;
    background: transparent;
	border-radius: 2px;
	padding: 8.5px 57px;
	font-size: 13px;
	color: #fff;
	min-width: 114px;
	text-align: center;
    background-image: url("../img/downloads_sliced.png");
    background-repeat: no-repeat;
    background-position: -781px -74px;
}
.btnMediaFire:hover{
    background-position: -898px -74px;
}
.btnMediaFire:focus{
    background-position: -1014px -74px;
}
.btnGoogleDrive{
    width: 114px; height: 31px;
    background: transparent;
	border-radius: 2px;
	padding: 8.5px 57px;
	font-size: 13px;
	color: #fff;
	min-width: 114px;
	text-align: center;
    background-image: url("../img/downloads_sliced.png");
    background-repeat: no-repeat;
    background-position: -781px -111px;
}
.btnGoogleDrive:hover{
    background-position: -898px -111px;
}
.btnGoogleDrive:focus{
    background-position: -1014px -111px;
}
.downloadClientBG{
    /* max-height: 293px; */
    height: 293px;
    min-width: 776px;
    width: 776px;
    background-image: url("../img/ranking-bg.png");
    /* background-repeat: no-repeat;
    background-position: -0px -0px; */
    margin-left: 5px;
}
.pwResetContent, .downloadContent{
    padding-top: 74px;
}
.downloadIcons{
    width: 31px;
    height: 31px;
    margin-left: 25px;
}
.btnReset{
    width: 114px; height: 31px; border: 0;
    background-image: url("../img/password_sliced.png");
    background-repeat: no-repeat;
    background-position: -785px -42px;
    color: #fff;
    font-size: 13px;
    font-family: onestfontMed;    
    margin-top: 15px;
}
.btnReset:hover{
    background-position: -785px -82px;
}
.btnReset:focus{
    background-position: -785px -122px;
}
.btnVote{
    width: 304px; height: 97px;
    background: transparent;
	padding: 5px 25px;
	font-size: 18px;
	color: #fff;
    min-width: 304px;
	text-align: center;
    background-image: url("../img/vote4coins_sliced.png");
    background-repeat: no-repeat;
    background-position: -781px -0px;
    color: #fff;
    font-size: 13px;
    font-family: onestfontMed;    
}
.btnVote:hover{
    background-position: -781px -42px;
}
.btnVote:focus{
    background-position: -781px -85px;
}
.pwResetBG{
    background-color: transparent;
    background:url("../img/registration-bg.png") bottom center no-repeat;
    width: 776px;
    min-width: 776px;
    height: 441px;
    margin-left: 5px;
}


.vote-bg a{color:#fff;}

.newsPageBG a{
    color: #fff;
}

.pwResetHeaderBG, .downloadHeaderBg{
    background-image: url("../img/mainpage_sliced.png");
    background-position: -348px -606px;
    background-repeat: no-repeat;
    width: 776px;
    min-width: 776px;
    max-height: 54px;
    height: 54px;
}

.default-button:hover { background: #5a70d1; color: #fff; }
a.default-button { color: #fff; }

@media (max-width: 990px){
    .nav-item { width: 100%; }
    .mobile-hide { display: none; }
    .desktop-height-dist { padding-top: 240px; }
    .navbar-toggler { display:none; }
    .navbar-collapse.show { display:none; }
    .mobile-bg { background: transparent; }
	.video-background {width: 990px; height: auto;}
	.content-panel {max-width: 314px; margin-left: 100px; margin-right: 100px;}
	.static-main-area{background: transparent;}
	.read-more-btn{margin-left: -75px;}
	.topbar{width: 100%; display: flex; justify-content: center; position: fixed; top:  0; left: 0%; display: flex; flex-direction: row-reverse; z-index: 999;}
	.statistics-mobile{margin-top: 25px;}
	.statistics-text{margin-top: 15px; margin-left: 2px;}
	.footer-tos{font-size: 10px; display: flex;flex-direction: row;gap: 15px;align-items: center;justify-content: center;width: 100%;}
	.newsPageBG{background-color: #000000af;background-image: url("../img/news-bg.png");width: 314px;max-width: 314px;margin: 0;padding:0}
	.newsHeaderBG{background-image: url("../img/mainpage_sliced.png");background-position: -348px -606px;background-repeat: no-repeat;width: 314px;max-width: 314px;max-height: 54px;height: 54px;margin: 0;padding:0;font-size: 1.1rem;}
	.vote-bg,.register-bg {min-width: 314px; max-width: 314px;}
	.footercontent{font-size: 10px;}
	.dcWidget{display:none;}
    .player-ranking th:nth-child(2), 
    .player-ranking td:nth-child(2), 
    .player-ranking th:nth-child(4), 
    .player-ranking td:nth-child(4) { 
        display: table-cell !important; 
    }
    .player-ranking th:nth-child(3), 
    .player-ranking td:nth-child(3), 
    .player-ranking th:nth-child(5), 
    .player-ranking td:nth-child(5) {
        display: none !important;
    }
	.experience-ranking{display:none;}
	.grecaptcha-badge{display:none;}
	.topbar .discord{background-image: url('../img/menu-left/dcButton.png');background-repeat: no-repeat;margin-right: 1px;}
	.alert{max-width: 294px;}
    
}
@media (min-width: 990px){
	.static-side-bar .statistics-text{max-width: 316px; margin: 0; padding:0;}
	.footer-tos{display: flex;flex-direction: row;gap: 35px;align-items: center;justify-content: center;width: 100%;font-size: 12px;}
	.newsPageBG{margin-left: 6px;background-color: #000000af;background-image: url("../img/news-bg.png");width: 775px;min-width: 775px; min-height: 949px;}
	.newsHeaderBG{background-image: url("../img/mainpage_sliced.png");background-position: -348px -606px;background-repeat: no-repeat;width: 776px;min-width: 776px;max-height: 54px;height: 54px;font-size: 1.1rem;}
	.footercontent{font-size: 10px;}
	.downloadMobileAlert{display: none;}
	.mobile-overview{display:none;}
	.topbar .discord{display:none;}
}



.sidebar-presentation {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
	transition: all ease-in-out 1s;
}

.sidebar-presentation .nav-item {
    display: block;
    width: 120px;
    height: 23px;
    position: relative;
    transition: all ease-in-out .3s;
    text-decoration: none;
    border: none;
}

.sidebar-presentation .nav-item.active {
    padding-left: 20px;
    text-decoration: none;
    border: none;
}


.sidebar-presentation .nav-item span {
	display: none;
    position: absolute;
    left: 20%;
    top: 50%;
    transform: translateY(-50%);
    color: white;
    font-size: 12px;
    white-space: nowrap;
    font-family: onestfontMed;
    letter-spacing: 1px;
	transition: all ease-in-out 1s;
}

.sidebar-presentation .nav-item:hover span{
    display: block;
	padding-left: 10%
}
.sidebar-presentation .nav-item.active span {
    display: block;
	padding-left: 25%
}

.nav-group {
    display: none
}

.nav-group[data-set=1] {
    display: block
}

.hidden{
    display: none;
    background: none;
}

.hover-popup {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: fit-content;
  background-color: #562d20;
  border-radius: 8px;
  padding: 1.5em;
  z-index: 42;
  transform: scale(1);
  transition: transform 200ms ease;
  transform-origin: 8% -10px;
  border: none;
  text-decoration: none;
  align-self: center;
}



@media (prefers-reduced-motion: reduce) {
  *,
  ::before,
  ::after {
    animation-delay: -1ms !important;
    animation-duration: -1ms !important;
    animation-iteration-count: 1 !important;
    background-attachment: initial !important;
    scroll-behavior: auto !important;
    transition-duration: 0s !important;
    transition-delay: 0s !important;
  }
}

.disabled {
    pointer-events: none;  /* Disables clicks */
    opacity: 0.5;          /* Makes the button appear faded */
    cursor: not-allowed;   /* Shows a "not allowed" cursor */
}
.dcWidget{
position: fixed; 
text-align: center; 
top: 75%; 
left:-185px;
transition: ease-in-out .6s;
z-index: 999;
}
.dcWidget:hover{
	left: 2%;
}
.pres-background-image{
	position: fixed; 
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	object-fit: cover;
}

.circle{
		width: 14px;
		height: 14px;
	    background-image: url("../img/menu-left/bullet.png");
	    background-color: transparent;
	    background-repeat: no-repeat;
		background-size: 14px 14px;
		margin-left:5px;
}

.topbarPres {
	display: flex;
	position: fixed;
	top: 0; 
	left: 75%;
	flex-direction: row;
	background-color: #00000077;
	border-radius: 5px;
	width: 150px;
	}

.topbarPres-item {
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	border-radius: 5px;
	margin-right: 5px;
	}
.topbarPres-item:not(:last-child) 
{
	margin-right: 0px; 
}
.topbarPres-item:hover {
	background-color: #0056b3;
	top: 7px;
	}

.topbarPres-item button{
	border:none;
	background:none;
	text-decoration: none;
	overFlow: hidden;
}

.topbarPres .langMenuPresentation{
	display: none;
	flex-direction: column;
	position: fixed; 
	top: 50px;
}
.topbarPres #languageDropdown:active .langMenuPresentation,
.topbarPres #languageDropdown:hover .langMenuPresentation{
	display: flex;
	flex-direction: column;
}
.topbarPres .langMenuPresentation button:hover{
	background-color: transparent;
}

.topbarPres .langMenuPresentation img,
.topbarPres .dropdown-toggle img{
	margin-left: 2px;
}

.language-dropdown {
    position: fixed;
    top: 0;
    left: 75%;
	top: 10px;
	margin-left: 165px;:
}
.presentationLanguageDropdown,  .language-select {
    width: 73px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background-image: linear-gradient(to right,#10283C,#10283C);
    align-self: center;
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
	border:none;
}

.language-dropdown .texts {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px
}

.language-dropdown .languages {
    position: absolute;
    top: 100%;
    left: 0;
    width: 73px;
    background-color: #10283C;
    border-radius: 4px;
    margin-top: 5px;
    display: none;
    z-index: 200
}

.language-dropdown .languages a {
    box-sizing: border-box;
    margin: 0 auto;
    line-height: 40px;
    float: left;
    color: #fff;
    width: 100%;
    height: 40px;
    padding-left: 12px;
    font-size: 14px;
    text-decoration: none
}

.languages a:hover{
    background-color: #0D3B6B;
}

.language-dropdown .languages a i {
    margin-top: 9px
}

.language-dropdown .flags {
    display: block;
    width: 20px; 
    height: 20px; 
    background-size: cover; 
}


.language-dropdown .flag-en {
    background: url('/assets/img/menu-left/en.png');
}

.language-dropdown .flag-de {
    background: url(/assets/img/menu-left/de.png)
}

.language-dropdown .flag-tr {
    background: url(/assets/img/menu-lef/tr.png)
}

.language-dropdown .flag-ro {
    background: url(/assets/img/menu-left/ro.png)
}

.language-dropdown .flag-es {
    background: url(/assets/img/menu-left/es.png)
}

.language-dropdown .flag-it {
    background: url(/assets/img/menu-left/it.png)
}

.language-dropdown .flag-pl {
    background: url(/assets/img/menu-left/pl.png)
}

.language-dropdown .flag-pt {
    background: url(/assets/img/menu-left/pt.png)
}


.footer-tos a{
	color:white;
}

.download-desc{
	margin-left: 15px;
	margin-right: 15px;
}
.news-preview{
	display: block; 
	max-height:180px; 
	text-overflow: ellipsis; 
	word-wrap: break-word;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to top,  transparent 1px, black 65px);
}


