*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

p{
	font-size: 16px;
}

:root{
	--colorBg: #0d1117;
	--colorBlock: #161b22;
	--colorBlock1: #1f242c;
	--text: #fff;
	--text2: #000;
	--text-primary: #c9d1d9;
    --text-secondary: #8b949e;
	
	--hoverColor: #ff589b;
	
    --divider: #30363d;
    --border: #30363d;
}

:root.whrite-theme{
	--colorBg: #efefef;
	--colorBlock: #fff;
	--colorBlock1: #ececec;
	--text: #000;
	--text2: #fff;
	--text-primary: #4f5256;
    --text-secondary: #626870;
	
	--hoverColor: #ff589b;
	
    --divider: #30363d;
    --border: #30363d;
}

body{
	background: var(--colorBg);
	background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
	font-family: "Vrc", sans-serif;
}

.wrapp{
	display: flow-root;
    background: var(--colorBg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
}

.header_border{
	width: auto;
    height: 70px;
}

.content_center{
	display: flow-root;
    width: 1300px;
    margin: 10px auto 10px auto;
    min-height: calc(100vh - 245px);
}

.margin_content_def {
    margin-top: 10px;
    margin-bottom: 10px;
}

.section_main{
	background: var(--colorBlock);
    padding: 15px;
	width: 100%;
	color: var(--text);
}

.section_home_main{
	background: var(--colorBlock);
	width: 100%;
	color: var(--text);
	padding: 0;
	overflow: hidden;
	position:relative;
}

.section_flex{
	display: flex;
	gap: 10px;
}

.section_Title{
	font-weight: 100;
	font-size: 23px;
	margin-bottom: 20px;
	text-align: center;
}

.px_base__block {
    overflow: hidden;
    clip-path: polygon(0px calc(100% - 8px), 4px calc(100% - 8px), 4px calc(100% - 4px), 8px calc(100% - 4px), 8px 100%, calc(100% - 8px) 100%, calc(100% - 8px) calc(100% - 4px), calc(100% - 4px) calc(100% - 4px), calc(100% - 4px) calc(100% - 8px), 100% calc(100% - 8px), 100% 8px, calc(100% - 4px) 8px, calc(100% - 4px) 4px, calc(100% - 8px) 4px, calc(100% - 8px) 0px, 8px 0px, 8px 4px, 4px 4px, 4px 8px, 0px 8px);
}

.px_base__block2 {
	clip-path: polygon(0px calc(100% - 4px), 4px calc(100% - 4px), 4px 100%, calc(100% - 4px) 100%, calc(100% - 4px) calc(100% - 4px), 100% calc(100% - 4px), 100% 4px, calc(100% - 4px) 4px, calc(100% - 4px) 0px, 4px 0px, 4px 4px, 0px 4px);
}

.img_full{
	-o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.Home_Banner{
  border-radius: 15px;
  display: flex;
  flex-wrap: wrap;
  padding: 15px;
}
.Home_Banner_R{
  border-radius: 15px;
  display: flex;
  flex-wrap: wrap;
  padding: 15px;
  flex-direction: row-reverse;
}
.Home_Banner_Item{
  margin-right: auto;
  width: 50%;
  height: 290px;
}
.Home_Banner_Item img {
    margin-left: auto;
    height: 110%;
    display: block;
    right: 86px;
    position: relative;
    bottom: 16px;
	pointer-events: none;
}
.Home_Banner_Cont{
  width: 50%;
  position: relative;
}
.Home_Banner_ContText{
    text-align: left;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	margin-left: 25px;
}

.Home_Banner_R .Home_Banner_ContText{
	text-align: left;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	margin-right: 25px;
	margin-left: 0;
}

.Home_Banner_Cont h4{
  color: var(--text);
  font-size: 130px;
  margin: 0;
  font-family: "Snaredrum", sans-serif;
  text-transform: uppercase;
  font-weight: 100;
}

.Home_Banner_Cont h2{
  color: var(--text);
  font-size: 25px;
  margin: 0;
  margin-bottom: 20px;
  font-weight: 100;
}

.Home_Banner_Cont p{
  color: var(--text);
  font-size: 17px;
  margin: 0;
  margin-top: 5px;
  white-space: wrap;
}
.Home_Banner_BgImage{
	
}
.Home_Banner_BgGradient_Left{
	background: linear-gradient(-90deg, rgba(255,255,255,0) 0%, var(--colorBlock) 95%);
	position: absolute;
	width: 100%;
	height: 100%;
	left: -2px;
}
.Home_Banner_BgGradient_Right{
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, var(--colorBlock) 95%);
	position: absolute;
	width: 100%;
	height: 100%;
	left: 2px;
}
.Home_Banner_Background{
	width: 100%;
	height: 100%;
	position: absolute;
}
.Home_Banner_Gradient{
	background: linear-gradient(0deg, var(--hoverColor) -300%, var(--colorBlock) 100%);
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: .9;
}
.Home_Banner_Cont a{
  font-family: "Pixy", sans-serif;
  transition: background-color .2s, color .2s;
  color: var(--text2);
  font-size: 20px;
  background: var(--text);
  padding: 5px 90px 5px 90px;
  text-decoration: none;
  display: inline-block;
  margin-top: 15px;
  text-transform: uppercase;
}
.Home_Banner_Cont a:hover{
	background-color: var(--hoverColor);
	color: var(--text);
}

.stage_message{
	margin: auto;
	margin-top: 100px;
	margin-bottom: 100px;
	color: var(--text);
	text-align: center;
}
.stage_message h1{
	text-align: center;
	font-size: 60px;
	font-weight: 100;
}
.stage_message h2{
	text-align: center;
	font-size: 30px;
	margin-bottom: 10px;
}
.stage_message p{
	text-align: center;
	font-size: 20px;
}
.stage_message a{
	font-family: "Pixy", sans-serif;
    transition: background-color .2s, color .2s;
    color: var(--text2);
    font-size: 20px;
    background: var(--text);
    padding: 5px 90px 5px 90px;
    text-decoration: none;
    display: inline-block;
    margin-top: 15px;
    text-transform: uppercase;
}
.stage_message svg{
	height: 50px;
	margin-bottom: 30px;
}
.stage_message a:hover{
	background-color: var(--hoverColor);
	color: var(--text);
}

.ipserver_flex{
	display: flex;
}
.ipserver_cont{
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	text-align: center;
}
.ipserver_cont p{
	color: var(--text);
	margin: 5px;
	padding: 15px;
	background-color: var(--colorBg);
}
.ipserver_cont_buttons{
	display: flex;
	margin-top: 5px;
	flex-wrap: wrap;
	justify-content: center;
}
.ipserver_cont a{
  font-family: "Pixy", sans-serif;
  transition: background-color .2s, color .2s;
  color: var(--text2);
  font-size: 20px;
  background: var(--text);
  padding: 5px 20px 5px 20px;
  text-decoration: none;
  display: inline-block;
  text-transform: uppercase;
  margin: 5px;
  width: 100%;
}
.ipserver_cont a:hover{
	background-color: var(--hoverColor);
	color: var(--text);
}
#ipsr_2{
	font-size: 15px;
	text-align: right;
}

.server_online_flex{
	display: flex;
	flex-direction: row;
	position: relative;
}
.server_online_item{
	position: relative;
	top: 50%;
    transform: translateY(-50%);
	height: fit-content;
}
.server_online_textbox{
	position: relative;
	margin-left: 15px;
	margin-top: auto;
	margin-bottom: auto;
	top: 0;
	transform: translateY(0);
	height: fit-content;
}
.server_online_item img{
	height: 120px;
	width: 120px;
}

.status {
    display: inline-block;
    margin-top: 2px;
    width: 0.63em;
    height: 0.63em;
    border-radius: 50%;
	margin-top: 10px;
	margin-bottom: auto;
    margin-right: 7px;
}
.status-up {
    background-color: #00ca6f;
    box-shadow: 0 0 0.66em #00ca6fb8;
    animation: 2s blink infinite step-end;
}
@keyframes blink {
	90% {
    opacity: 0.5;
	}
}





@media screen and (max-width: 1335px) {
	.content_center{
	width: 1000px;
	}
	.Home_Banner_Item img {
    right: 48px;
	}

}
@media screen and (max-width: 1100px) {
	.content_center{
	width: 100%;
	}
	.content_center_margin{
		margin-left: 8px;
		margin-right: 8px;
	}
	.section_main {
		padding: 8px;
	}
	.content_center{
	min-height: calc(100vh - 290px);
	}
	.Home_Banner_Item img {
    right: 27px;
	}
}
@media screen and (max-width: 800px) {
.content_center{
	min-height: calc(100vh - 340px);
}

.Home_Banner_Cont{
  width: 100%;
  height: 220px;
  }
.Home_Banner_Item{
  width: 100%;
  height: 175px;
  }
  .Home_Banner_Cont{
  text-align: center;
}
.Home_Banner_ContText, .Home_Banner_R .Home_Banner_ContText{
  margin-left: 0;
  margin-right: 0;
  text-align: center;
  width: 100%;
  top: 17%;
  transform: translateY(0);
}
.Home_Banner {
    flex-direction: column-reverse;
}
.Home_Banner_R{
  flex-direction: column-reverse;
}
.Home_Banner_Item img {
    margin-right: auto;
    margin-left: auto;
	height: 90%;
	right: 0;
	left: 0;
	top: 12px;
}
.Home_Banner_BgGradient_Left, .Home_Banner_BgGradient_Right{
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, var(--colorBlock) 95%);
	left: 0px;
	bottom: -2px;
}
.Home_Banner_Cont h4{
  margin-left: 8px;
}
.ipserver_flex {
    flex-direction: column;
}
#ipsr_2{
	margin-top: 10px;
	text-align: center;
}
.section_flex {
    flex-direction: column;
}

.server_online_flex {
    justify-content: center;
}
.server_online_item {
    top: 0;
    transform: translateY(0);
}
	
}


@font-face {
font-family: "Psychic_Force"; 
src: url("/fonts/PsychicForce.otf") format("opentype"); 
font-style: normal; 
font-weight: normal; 
} 

@font-face {
font-family: "Pixy"; 
src: url("/fonts/PIXY.otf") format("opentype"); 
font-style: normal; 
font-weight: normal; 
} 

@font-face {
font-family: "Vrc"; 
src: url("/fonts/vcrosdmonorusbyd.ttf") format("truetype"); 
font-style: normal; 
font-weight: normal; 
} 

@font-face {
font-family: "Snaredrum"; 
src: url("/fonts/SnaredrumOneNbp.ttf") format("truetype"); 
font-style: normal; 
font-weight: normal; 
}