/*---Шрифты---*/
@font-face {
	font-family:"Joystix-Monospace";
	src: url("../resources/fonts/joystix monospace.ttf") format("truetype");
	font-display: swap;
}

@font-face{
	font-family: "Involve";
	src: url("../resources/fonts/Involve-Regular.ttf") format("truetype");
	font-display: fallback;
}


/*---Заголовки---*/
h1{
	font-family:"Joystix-Monospace";
	font-size: 40px;
	color: white;
}


h2 {
	font-family:"Joystix-Monospace";
	font-size: 22px;
	color: #78DBA0;
}

h3{
	font-family:"Joystix-Monospace";
	font-size: 14px;
	color: #223540;
}
a {
	text-decoration:none;
	color: #ffffff;
}	

/*---Общее---*/
*{
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	width: 100%;
}

body {
   background-image: url("../resources/img/bg.webp");	
   height: auto;
   cursor: default;
}

.header {
   background-image: url("../resources/img/vline.webp"),
	                 url("../resources/img/bgc1.webp");    
   background-size: 100% 100%;
   height: 406px;
   position: absolute;
   min-width: 1265px;
   z-index:2;
}

/*---Обертка сайта---*/

.mainwrapper {
	width: 1265px;
	position: relative;
	margin: 0 auto;
	padding-left: 15px;
}

/*---Обертка башки---*/

.headwrap {
	width: 1265px;
	height: 406px;
	display: flex;
	flex-flow: row wrap;
	position: relative;
	z-index:2;
}

/*---Верхнее меню---*/

.menu {
	padding-top: 20px;
	height: 30px;
	width: 80%;
	display: flex;
	flex-flow: row wrap;
	
}

.menu ul {
	display: flex;
	list-style-type: none;
}

.menu li {
	margin-right: 42px;
	position: relative;
	
	
}


.menu a, .menu a:link, .menu a:visited, .menu a:focus{
	font-family:"Involve";
	font-size: 25px;
	font-weight: 600;
	line-height: 35px;
	color: #78DBA0;
	cursor:pointer;
}

/*---Раскрывающееся меню---*/
.submenu {
	display: flex;
	position: absolute;
    width: 260px;
    height: 170px;
    background: rgba(72, 220, 189, 0.7);
    backdrop-filter: blur(3px);
    border-radius: 10px;
	flex-direction: column;
	top: 100%; left: 0;
	-webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
	margin: 10px -78px;
	-webkit-transition: 0.12s ease-in-out;
    -moz-transition: 0.12s ease-in-out;
    -o-transition: 0.12s ease-in-out;
    transition: 0.12s ease-in-out;
    z-index: 10;
	
}

.menu li:hover .submenu{
	-webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
	-webkit-transition: 0.12s ease-in-out;
    -moz-transition: 0.12s ease-in-out;
    -o-transition: 0.12s ease-in-out;
    transition: 0.12s ease-in-out;
	 
}

.submenu li{
	width: 224px;
	height: 40px;
    margin: 15px auto 0;
	line-height:40px;
	border-radius: 7px;
	border: 1px solid #feb31c;
	background: #001c24 no-repeat;
	font-family: "Involve";
	font-size: 15px;
	color: #f5f7f9;
	padding: 0 10px;
	overflow: hidden;
	cursor: default;
}

.submenu li:last-child{
	margin-bottom: 18px;
	
}

.submenu p{
	font-size: 11px;
	color: #feb61d;
	line-height: 13px;
}

.submenu a{
	font-family: "Involve";
	font-size: 15px;
	color: #f5f7f9;
	padding: 0 10px;
	cursor: pointer;
}

.x.show, .submenu, .x_1.show{
	font-size: 30px;
    font-weight: 600;
	height: auto;
	-webkit-transition: 0.12s ease-in-out;
    -moz-transition: 0.12s ease-in-out;
    -o-transition: 0.12s ease-in-out;
    transition: 0.12s ease-in-out;
	overflow: auto;
	display: block;
	margin-bottom:10px;
}

.x.show p, .x_1.show p{
    font-size: 13px;
    line-height: 15px;
    
}
.x, .x_1{
	-webkit-transition: 0.12s ease-in-out;
    -moz-transition: 0.12s ease-in-out;
    -o-transition: 0.12s ease-in-out;
    transition: 0.12s ease-in-out;
}
.x a, .x_1 a{
    width: fit-content;
    height: 37px;
	cursor: pointer;
	margin-top: 18px;
	margin-bottom: 15px;
	border-radius: 5px;
	border: 1px solid #feb31c;
	display:inline-block;
	
}

.x a:hover, .x_1 a:hover{
    background:#228B22;
    color: white;
	
}

.submenu span:first-child{
    height:25px;
	margin-left: 50px;
	color:#feb61d;
	font-size: 18px;
	line-height: 25px;
	font-weight: 500;

}

/*-Блок ссылок-*/
.links {
	width: 143px;
	height: 110px;
	margin-top: 30px;
}

.tg, .vk {
	margin: 0 15px 0 0;
}

.ds {
	margin:0;
}

.social, .links {
	height:45px;
}

.vote_small a {
	width: 75px;
	height: 35px;
}

.social a, .social img {
	width: 35px;
	height: 35px;
}
.vote_small img{
	width: 88px;
	height: 31px;
}
/*-Счетчик онлайна-*/
.online {
	width: 159px;
	height: 154px;
	margin: 65px 0 0 123px;
}

.online p {
	font-family:"Involve";
	font-weight: bold;
	font-size: 21px;
	color: #B4CF44;
	text-align: center;
	height:fit-content;
}

.counter {
	text-align: center;
	font-size:70px;
	font-family: "Involve";
	font-weight:200;
	line-height:84.72px;
	width: fit-content;
	height: fit-content;
	margin: auto;
	color:#f5f7f9;
}

/*-Лого-*/
.logo {
	margin: 52px 0 0 95px;
	width: 190px;
	height: 245px;
	opacity: 0,9;
}

/*-Анимация игроков-*/
.anim {
	width: 235px;
	height: 172px;
	margin: 66px 0 0 54px;
}

.anim p {
	font-family:"Involve";
	font-weight: bold;
	font-size: 21px;
	color: #B4CF44;
	text-align: center;
	height: fit-content;
}

/*---Меню авторизации---*/

.auth {
	width: 20%;
}

.button, .lform, .links1234 {
	margin: 0 auto;
	width: 215px;
}

.button {
	height: 70px;
	padding: 16px 0px 16px 0px;
	margin: 20px 72px 10px 18px;
	background: #CDFD6D;
	color: #2d2f3b;
	font-family:"Involve";
	font-weight: 500;
	font-size: 30px;
	cursor: pointer;
}

.lform {
	height: auto;
	padding: 0px 0px 0px 0px;
}

.lform p{
	width: 20%;
	height: auto;
	font-family:"Involve";
	font-weight: 100;
	text-align: center;
	font-size: 15px;
	line-height: 18px;
	color: #F5F7F9;
	margin: 0 auto;
	padding-bottom: 5px;
}

#wrong{
	color: red;
	font-size: 17px;
	display: none;
	text-align:center;
	width: fit-content;
	height: fit-content;
}

.lform input, .lform input:focus {
	box-sizing: border-box;
	border: 2px solid #CDFD6D;
	width: 215px;
	height: 28px;
	background: rgba(0, 150, 141, 0.27);
	backdrop-filter: blur(4.4px);
    color: #ffffff;
	font-size: 15px;
	outline: none;
    text-indent: 10px;
}

.links1234 {
	height: auto;
	display: flex;
	margin: 7px auto 0px;
	justify-content: space-between;
	cursor: pointer;
	
}

.links1234 a, .links1234 a:link, .links1234 a:visited, .links1234 a:focus {
	width: 215px;
	height: auto;
	font-family:"Involve";
	font-weight: 500;
	font-size: 13px;
	line-height: 15.73px;
	color: #13A49B;
	text-align:justify;
}

/*---Обертка центра---*/
.midwrap {
	display: flex;
	flex-flow: row wrap;
	position: relative;
	z-index: 1;
	
}

.leftside {
	float:left;
	width: 1011px;
}


/*---Превью о сервере---*/

.preview {
	position: relative;
	background-image:url("../resources/img/preview.webp");
	width: 981px;
	height: 409px;
	margin: 7px auto;
}

.pretext {
    position: absolute;
	width: auto;
	height: auto;
	margin: 83px 0 0 47px;
}

.under {
	font-family:"Involve";
	color: white;
	font-size: 10px;
	height: 12px;
	margin-bottom: 0px;
}

.desc {
	margin-top: 10px;
	font-family:"Involve";
	font-size:14px;
	color: white;
	font-weight: normal;
	height: 60px;
	margin-bottom: 30px;
}

.pretext h1 {
	width: 481px;
	height: 40px;
	margin-bottom:7px;
}

.pretext h2{
	height: 22px;
	margin-bottom: 5px;
}

.fun {
	color: #CDFD6D;
	height: 22px;
}

.pretext button {
	width: 157px;
	height: 58px;
	background-color: #CDFD6D;
	font-family:"Involve";
	font-size: 22px;
	font-weight: 600;
	cursor: pointer;
}
/*--Эффект параллакса--*/

.preview:hover .parallax_ele {
	-ms-transform: translateX(6px) translateY(5px) scale(1.1);
	-webkit-transform: translateX(6px) translateY(5px) scale(1.1);
	transform: translateX(6px) translateY(5px) scale(1.1);
	transition: transform 1s linear;
	-webkit-transition: transform 1s linear; 
	-moz-transition: transform 1s linear; 
	-o-transition: transform 1s linear; 
}

.preview .parallax_ele { 
	transition:2s ease;
	-webkit-transition:2s ease;
	-moz-transition:2s ease;
	-o-transition:2s ease;
}

.clsr{
   position: absolute;
   width: 77px;
   height: 74px;
   left: 433px;
   top: 248px;
	
}

.clsrght {
   position: absolute;
   width: 86px;
   height: 72px;
   left:845px;
   top:203px;	

}

.clsup { 
   position: absolute;
   width: 47px;
   height: 35px;
   left:953px;
   top:97px;
   
}

.frth {
   position: absolute;
   width: 13px;
   height: 15px;
   left:741px;
   top:63px;	
   
}

.frup {
	position: absolute;
    width: 14px;
    height: 13px;
    left:875px;
	top:40px;
	
}

.vrfr {
    position: absolute;
    width: 15.41px;
    height: 15.22px;
	left:484.94px;
	top:59.07px;
    

}

.mdlup {
    position: absolute;
    width: 27.55px;
    height: 27px;
	left:807.89px;
	top:92.07px;
    
}
/*---Новости---*/
.news {
	height: 564px;
	display: flex;
	flex-direction: column;
	margin-top: 80px;
}

.but1{
	width: 219px;
    height: 50px;
    align-self: center;
    background: #FE901B;
    font-family: "Involve";
    font-size: 18px;
    font-weight: 500;
    color: #F5F7F9;
    margin-top: 42px;
    cursor: pointer;
    text-align: center;
    line-height: 50px;
}


.but1 a:link, .but1 a:hover, .but1 a:visited {
	font-family:"Involve";
	font-size: 18px;
	font-weight: 500;
}

.news-wrapper {
	width: 1011px;
	height: 469px;
	display: flex;
	margin-top: 80px;
	justify-content: space-between;
	align-items: flex-start;
	flex-flow: row wrap;
	background: url("../resources/img/news/cheese.png") center no-repeat;
	margin: 0 auto;
}

.news-item{
	background:  url("../resources/img/news/newsbg.png");
	background-position: center;
	background-repeat: no-repeat;
	width: 255px;
	height: 343px;
	z-index:1;
	margin: auto 33px auto 35px;
	overflow: visible;
	position:relative;
}

.news-item__title {
	width: 220px;
	height: 34px;
	text-align: center;
	margin-top:15px;
}

.news-item__title a, .news-item__title h3 .news-item__title a:link, .news-item__title a:hover, .news-item__title a:visited{
	font-family:"Joystix-Monospace";
	font-size: 14px;
	color: #223540;
	
}

.news-item__img {
	width:320px;
	height: 150px;
	position:relative;
	top: 10px;
	left: -45px;
}
.news-item__data{
	width: 153px;
	height: 16px;
	display:flex;
	font-family:"Involve";
	font-size: 13px;
	font-weight: 400;
	margin-top: 10px;
}

.news-item__data img{
	width:14px;
	height:9px;
	align-self:center;
	margin-left: 10px;
}

.news-item__text {
	width: 225px;
	height: 82px;
	margin: 10px 16px 20px 14px;
	font-family: "Involve";
	font-size: 15px;
	overflow: hidden;
    text-overflow: ellipsis;
	display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.news-item__button{
	width: 172px;
	height: 51px;
	font-family:"Involve";
	font-size: 18px;
	font-weight: 500;
	color: #F5F7F9;
	background: #223540;
	text-align: center;
	margin: 20px 41px 0;
	cursor: pointer;
	
}

/*---Мы в соцсетях под новостями---*/

.wnsc {
   position: relative;
   display: flex;
   flex-direction: column;
   margin: 78.87px auto 0;
   align-items:center;
	
}
.wnsc-imgds {
	max-height: 146.08px;
}

.wnsc-imgvk {
	max-height: 128.25px;
	margin: 20.08px 0;
}

.wnsc-imgtg {
	max-height: 138.97px;
}
/*---Сайдбар---*/

.sidebar {
    float: right;
	width: 254px;
	height: 1232px;
	align-items: center;
	font-family:"Involve";
	font-size: 11px;
	font-weight: 400;
	margin-top: -57px;
	
}

.sidebar p {
	width: 216px;
	height: 14px;
	text-align:center;
	margin: 0 auto 7px;
	
}
.monit {
	width: 216px;
	height: 31px;
	font-family:"Joystix-Monospace";
	font-size: 22px;
	text-align:center;
	margin: 0 auto 7px;
}

/*---Мониторинг---*/
.fixedpanel {
   position: relative;
   width: 215px; 
   height: 132px;
   background: linear-gradient(357.33deg, rgba(0, 0, 0, 0) 2.22%, #6CA2B3 158.89%), #C7CFD2;
   border-radius: 20px; 
   user-select: none;
   cursor: pointer;
   margin-bottom: 20px;
   
}

.fixedpanel:active {
   position: relative;
   width: 215px; 
   height: 132px;
   background: linear-gradient(357.33deg, rgba(0, 0, 0, 0) 2.22%, #6CA2B3 158.89%), #C7CFD2;
   border-radius: 20px; 
   user-select: none;
 
}

.vers{
	font-family:"Involve";
	font-size: 13px;
	font-weight: 500;
	color: #FEB61D;
	background: #2e3b3d;
	padding: 2px 8px 1px 8px;
	border-radius: 10px;
	position: absolute;
	width: 51px;
	height: 20px;
	top: 6px;
	left: 74px;
	line-height: 16.4px;
	text-align: center;

}

.abouts1 {
	position: absolute;
	top:31px;
	left:18px;
	width: 179px;
	height: 60px;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
}
.abouts1 img {
	width: 45px;
	height: 45px;
	margin-top: 7.5px;
	
}

.abouts1 p {
	font-family:"Involve";
	font-size:14px;
	color: white;
	line-height: 110%;
	text-align: center;
	margin-bottom:15px;
	
}

.servonl img {
	width:60px;
	height: 60px;
	margin:0px;
}

.panfoot {
	display: flex;
	position:absolute;
	width: 179px;
	height: 16px;
	top:70px;
}

.panfoot p{
	font-family:"Involve";
	font-size: 14px;
	font-weight: 500;
	color: #2d3b3d;
	line-height: 16px;
	text-align:left;

}

.left{
    display:inline-block;
	font-family:"Involve";
	font-size: 10px;
	font-weight: 500;
	color: white;
	background: #2e3b3d;
	padding: 1px 6px;
	border-radius: 10px;
	width: 37px;
	height: 16px;
	line-height: 16px;
}

.right{
	display:inline-block;
	font-family:"Involve";
	font-size: 10px;
	font-weight: 500;
	color: white;
	background: #2e3b3d;
	padding: 1px 6px;
	border-radius: 10px;
	width: 37px;
	height: 16px;
	line-height: 16px;
	margin-left: 3px;
}

.content {
	width: 215px;
	height: 257px;
    position: absolute;
	display: none;
    left: 0px;
    top: 120px;
    background: linear-gradient(180deg, #00687C -36.81%, #00667A -36.81%, rgba(0, 0, 0, 0) 105.98%), #13E4BF;
    box-shadow: inset 0px 5px 18.4px rgba(0, 95, 101, 0.8);
    border-radius: 20px;

}

ul:not(.browser-default) > li {
	list-style-type: none;
}

.servlist, .servlist ul, .servlist li {
	min-height:132px;
	height:auto;
	width: 215px;
	margin: 24px auto;
}

/*---Текущий онлайн---*/

.total {
   position: relative;
   width: 215px;
   height: 92px;
   box-sizing: border-box;
   background: rgba(245, 247, 249, 0.65);
   border: 1px solid #0E1820;
   backdrop-filter: blur(4.75px);
   border-radius: 20px;
   margin: 45px auto 0;
   
}

.total p{
	margin: 0 auto;
	max-width: 174px;
	max-height: 52px;
	line-height: 11.1px;
	text-align: start;
	display: flex;
}

.total p:first-child {
	margin: 20px auto 5px;
	
}

.total p:last-child{
	margin: 5px auto 20px;
}

.lefts {
	 display: inline-block;
     white-space: nowrap;
  
}

.rights{
	text-align: right;
	display: inline-block;
	align-self: flex-end;
}

/*---Подвал---*/
.footwrap{
	width: 1265px;
	height: 1525px;
	margin-top: 140px;
	position: absolute;
}
/*---Контейнер топов---*/
.leaderboard {
	width:1005px;
	height:1123px;
	margin-top: 140px;
	display: flex;
	flex-flow: row wrap;
	align-items: center; 
}

.leaderboard h1 {
	width: 1265px;
	height: 48px;
	text-align: center;
}
/*---Топы голосовавших---*/
.voters {
	width:475px;
	height: 935px;
	background: url("../resources/img/voters.webp") center no-repeat;
}

.voters p{
	width: 300px;
	height: 60px;
	margin: 90px auto 0;
	display:block;
	text-align:center;
	font-family:"Involve";
	font-size: 24px;
	color: #e9ffbd;
    box-sizing: border-box;
    border: 3px solid #CDFD6D;
	line-height: 60px;

}

table{
	width:357px;
	height: 501px;
	margin: 50px auto 0;
	border-collapse: collapse;
}

table.voterate{
    height: 35px;
	margin-top: 20px;
	font-family: "Involve";
	color: #e9ffbd;
}

.voterate thead{
	font-size: 13px;
}

.voterate td{
	font-size: 25px;
	margin-top:18px;
	border-bottom: 3px solid #CDFD6D;
	text-align: left;
	padding: 6px;
	
}

.voterate td:last-child, .voterate th:last-child{
	text-align: right;
}

.voterate td:first-child, .voterate th:first-child{
	width:auto;
}

.voters a, .voters button {
	width: 255px;
	height: 66px;
	background: #cdfd6d;
	margin: 60px 108px 100px;
	font-family: "Involve";
	font-size: 25px;
	color: #2B3F4A;
	cursor: pointer;
}

/*---Топы пригласивших---*/
.refs {
	width:475px;
	height: 935px;
	background: url("../resources/img/referals.webp") center no-repeat;
	margin-left: 50px;
}

.refs p{
	width: 300px;
	height: 60px;
	margin: 90px auto 0;
	display:block;
	text-align:center;
	font-family:"Involve";
	font-size: 24px;
	color: #253646;
    box-sizing: border-box;
    border: 3px solid #253646;
	line-height: 60px;

}

table{
	width:357px;
	height: 501px;
	margin: 50px auto 0;
	border-collapse: collapse;
}

table.refrate{
    height: 35px;
	margin-top: 20px;
	font-family: "Involve";
	color: #253646;
}

.refrate thead{
	font-size: 13px;
}

.refrate td{
	font-size: 25px;
	margin-top:18px;
	border-bottom: 3px solid #253646;
	text-align: left;
	padding: 6px;
	
}

.refrate td:last-child, .refrate th:last-child{
	text-align: right;
}

.refrate td:first-child, .refrate th:first-child{
	width:auto;
}

.refs a, .refs button {
	width: 255px;
	height: 66px;
	background: #2b3f4a;
	margin: 60px 108px 100px;
	font-family: "Involve";
	font-size: 25px;
	color: #CDFD6D;
	cursor: pointer;
}

/*---Подвал---*/
.podval {
	width: 1265px;
	height: 162px;
	
}

.credits {
	width: 1265px;
	height: 108px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.footlogo {
	height: 108px;
	width: 87px;
}

.command {
	width: 308px;
	height: 60px;
	font-family:"Involve";
	color: #c4f2d3;
	text-align: center;
}

.command p{
	width: 308px;
	height: 30px;
	font-size: 25px;
	font-weight: 500;
	text-align: justify-all;
}

.command span {
	font-size: 18px;
	font-weight: 200;
}
/*-Сыр-*/
.cheese {
	width: 54px;
	height: 53px;
} 
/*-Стрелка наверх-*/
.arrow {
	width:44px;
	height: 48px;
	
}

/*---Политики---*/

.policies{
	width: 1265px;
	height: 22px;
	margin-top: 32px;
	font-family:"Involve";
	font-size: 18px;
	font-weight: 200;
	color: #c4f2d3;
}


.policies a{
	margin-left: 41px;
}

.policies a:first-child{
	margin-left: 0px;
}

.policies a:link, .policies a:hover, .policies a:visited {
	font-family:"Involve";
	font-size: 18px;
	font-weight: 200;
	color: #c4f2d3;
}

/*---Изображение футера---*/

.footerimg {
	background: url("../resources/img/footimg.webp");
	height: 1525px;
	min-width: 1265px;
	background-size: 100% 100%;
	margin-top: 140px;
}

/*---Мини-Подвал---*/
.footwrap-small{
	width: 1265px;
	height: 421px;
	margin-top: 140px;
	position: absolute;
}

.podval-small{
    width: 1265px;
	height: 162px;
    margin-top:152.13px;
}

.footerim {
	background: url("../resources/img/foot-small.webp");
	height: 421px;
	min-width: 1265px;
	background-size: 100% 100%;
	margin-top: 140px;
}

/*---Личный кабинет---*/
.cabinet_search{
	height:306px;
	width: 20%;
}

.search{
	width: 216px;
    height: 26px;
    border-radius: 11px;
	border: 1.5px solid #CDFD6D;
	margin: 25px auto;
}
.search input{
    background: transparent;
	text-align: center;
}

.search input::placeholder{
	font-size: 13px;
	font-weight:400;
	line-height:13.11px;
	color:#007C66;
}
.cabinet{
	height:488px;
	width: 215px;
	margin: 0 auto;
}

.cabinet_head{
	width:216px;
	height: 172px;
	margin: 0 auto;
	display: flex;
	flex-flow: column nowrap;

}

.cabinet_head p {
	font-family: "Joystix-Monospace";
    font-size: 26px;
    font-weight: 400;
    line-height: 31.2px;
    text-align: left;
	width:fit-content;
	height:fit-content;
	
}
.short_info{
	height: 60px;
	display:flex;
	flex-flow: row nowrap;
}
.avatar{
	width: 60px;
	height: 60px;
	
}
.cabinet_username{
	font-family: "Involve";
    font-size: 19px;
    font-weight: 600;
    line-height: 22.99px;
    text-align: left;

}

.cabinet_head a{
	background: url('../resources/img/serlvogo/cabbutton.png');
	font-family: "Involve";
    font-size: 13px;
    font-weight: 500;
    line-height: 43px;
    text-align: center;
	width: 215px;
    height: 43px;
	color: #CDFD6D;
	margin-top: 23px;

}

.cabinet_links{
	height: 275px;
	display: flex;
	flex-direction: column;


}

.cabinet_links a{
	font-family: "Involve";
    font-size: 19px;
    font-weight: 400;
    line-height: 22.99px;
    text-align: left;
	margin-top: 13px;
	color: #000000;

}