@font-face {
	font-family: Akrobat;
	src: url(../webfonts/Akrobat-Black.eot);
	src: url(../webfonts/Akrobat-Blackd41d.eot?#iefix) format("embedded-opentype"), url(../webfonts/Akrobat-Black.woff2) format("woff2"), url(../webfonts/Akrobat-Black.woff) format("woff"), url(../webfonts/Akrobat-Black.ttf) format("truetype"), url(../webfonts/Akrobat-Black.svg#Akrobat-Black) format("svg");
	font-weight: 900;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Akrobat;
	src: url(../webfonts/Akrobat-SemiBold.eot);
	src: url(../webfonts/Akrobat-SemiBoldd41d.eot?#iefix) format("embedded-opentype"), url(../webfonts/Akrobat-SemiBold.woff2) format("woff2"), url(../webfonts/Akrobat-SemiBold.woff) format("woff"), url(../webfonts/Akrobat-SemiBold.ttf) format("truetype"), url(../webfonts/Akrobat-SemiBold.svg#Akrobat-SemiBold) format("svg");
	font-weight: 600;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Akrobat;
	src: url(../webfonts/Akrobat-Bold.eot);
	src: url(../webfonts/Akrobat-Boldd41d.eot?#iefix) format("embedded-opentype"), url(../webfonts/Akrobat-Bold.woff2) format("woff2"), url(../webfonts/Akrobat-Bold.woff) format("woff"), url(../webfonts/Akrobat-Bold.ttf) format("truetype"), url(../webfonts/Akrobat-Bold.svg#Akrobat-Bold) format("svg");
	font-weight: 700;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: Akrobat;
	src: url(../webfonts/Akrobat-ExtraBold.eot);
	src: url(../webfonts/Akrobat-ExtraBoldd41d.eot?#iefix) format("embedded-opentype"), url(../webfonts/Akrobat-ExtraBold.woff2) format("woff2"), url(../webfonts/Akrobat-ExtraBold.woff) format("woff"), url(../webfonts/Akrobat-ExtraBold.ttf) format("truetype"), url(../webfonts/Akrobat-ExtraBold.svg#Akrobat-ExtraBold) format("svg");
	font-weight: 700;
	font-style: normal;
	font-display: swap
}

html {
	font-size: .495vw
}

u {
	text-decoration-line: none
}

ul {
	padding-inline-start: 0
}

img {
	height: auto
}

;

a,
body,
div,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
html,
i,
label,
li,
menu,
nav,
ol,
p,
section,
span,
strong,
ul {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth
}

body {
	font-family: Akrobat, serif;
	background-color: #0b0b0b;
	font-size: 1.4rem;
	line-height: 1.8;
	letter-spacing: .016rem;
	color: #fff;
	font-weight: 700;
	overflow-x: hidden
}

ol,
ul {
	list-style: none
}

a:hover {
	text-decoration: none
}

a:focus,
button:focus,
input:focus,
textarea:focus {
	outline: none
}

#preloader {
	position: fixed;
	background: #fff;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99999;
	height: 100vh;
	width: 100vw;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	transition: opacity .5s ease-in-out !important
}

.loader3 {
	padding: 0;
	text-align: left
}

.loader3,
.loader3 span {
	width: 50px;
	height: 50px;
	display: inline-block
}

.loader3 span {
	position: absolute;
	border-radius: 100%;
	background: #6617cc;
	animation: a 1.5s linear infinite
}

.loader3 span:last-child {
	animation-delay: -.9s;
	-webkit-animation-delay: -.9s
}

@keyframes a {
	0% {
		transform: scale(0);
		opacity: .8
	}

	to {
		transform: scale(1);
		opacity: 0
	}
}

.container {
	max-width: 91%;
	padding-left: 1.5rem;
	padding-right: 1.5rem
}

.row {
	margin-left: -1.5rem;
	margin-right: -1.5rem
}

.row>div {
	padding-left: 1.5rem;
	padding-right: 1.5rem
}

.logo_wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10;
	padding: 2.5rem 0
}

.position-relative {
	position: relative !important
}

.mainlogo {
	z-index: 10000000 !important
}

.logo_wrap img {
	width: 16.8rem;
	margin-right: 2.3rem
}

.logo_wrap p {
	font-weight: 800;
	font-size: 1.8rem;
	line-height: 1.22;
	letter-spacing: .24rem;
	color: #b097ff
}

.button {
	display: inline-block;
	font-weight: 900;
	color: #fff;
	background: linear-gradient(90deg, #6617cc, #8133ff);
	box-shadow: inset 0 0 1.1rem #a972ff;
	min-width: 14.6rem;
	text-align: center;
	padding: 2rem;
	line-height: 1.1;
	position: relative;
	z-index: 1;
	border: none;
	transition: .3s
}

.button:hover {
	color: #6617cc !important
}

.button:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 100%;
	background-color: #fff;
	transition: .3s;
	z-index: -1
}

.button:hover:before {
	left: 0;
	width: 100%;
	right: auto
}

.button.v2 {
	background: hsla(0, 0%, 100%, .05);
	color: hsla(0, 0%, 100%, .55);
	box-shadow: none
}

.text_box {
	padding: 18.6rem 18rem 10rem 18.3rem;
	position: relative;
	z-index: 1
}

.text_box:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	z-index: -1;
	opacity: .7;
	background:url('../img/bg-banner.jpg');
	background-size: contain;
	background-position: center;
	clip-path: polygon(8% 20%, 100% 0, 92% 80%, 0 100%) center;
	-webkit-clip-path: polygon(8% 20%, 100% 0, 92% 80%, 0 100%);
	/*background: linear-gradient(90deg, #d9a729, rgba(129, 51, 255, .95) 63.63%);*/
}
@media only screen and (max-width: 521px) and (min-width: 300px) {
  .text_box:before {
		background-size: 100vh;
	}
}
@media only screen and (max-width: 767px) and (min-width: 522px) {
  .text_box:before {
		background-size: 678px 455px;
	}
}

.text_box h1 {
	font-size: 9.6rem;
	line-height: .9;
	font-weight: 900;
	margin-left: -.6rem
}

.text_box p {
	font-size: 1.5rem;
	line-height: 181.5%;
	max-width: 67rem
}

.text_box .button {
	padding: 2.5rem 2rem;
	min-width: 25.8rem;
	background: linear-gradient(90deg, #9a5413, #d9a729);
	box-shadow: 0 1rem 5.7rem -1.1rem #f8d247, inset 0 0 86px #ffe872
}

.social_icons {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: end;
	align-items: flex-end;
	margin-left: 9.1%;
	margin-bottom: -14rem;
	transform: rotate(3.9deg);
	position: relative;
	z-index: 2
}

.social_icons li {
	margin-left: -.9rem
}

.social_icons li:nth-child(2) {
	margin-bottom: 1.5rem
}

.social_icons li:nth-child(3) {
	margin-bottom: 3rem
}

.social_icons li:nth-child(2) a {
	background: linear-gradient(336deg, rgba(69,252,156,1) 0%, rgba(131,58,180,1) 49%, rgba(253,29,29,1) 100%);
}

.social_icons li:nth-child(3) a {
	background: linear-gradient(225deg, rgba(255,150,150,1) 0%, rgba(255,255,255,1) 62%, rgba(255,144,144,1) 100%);
}

.social_icons li a {
	display: -ms-inline-flexbox;
	display: inline-flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 12rem;
	height: 10rem;
	-webkit-clip-path: polygon(14% 15%, 100% 0, 86% 86%, 0 100%);
	clip-path: polygon(14% 15%, 100% 0, 86% 86%, 0 100%);
	background: linear-gradient(66.67deg, #535ca7 26.85%, #8866d0 99.27%);
	transition: .3s
}

.social_icons li a:hover {
	box-shadow: inset 0 0 35rem rgba(0, 0, 0, .4)
}

.social_icons li a img {
	width: 4.5rem;
	height: 4.5rem;
	transform: rotate(-3.9deg)
}

.section {
	background-position: 50%;
	min-height: 100vh
}

.section,
.section:before {
	background-size: cover;
	background-repeat: no-repeat
}

.section:before {
	position: absolute;
	content: "";
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	background-image: url(../img/overlay.png);
	mix-blend-mode: screen
}

.man_1 {
	right: -15%;
	width: 151rem;
	z-index: 12
}

.man_1,
.man_2 {
	bottom: -75px;
	position: absolute;
	pointer-events: none
}

.man_2 {
	right: 6%;
	z-index: 13;
	width: 59rem
}

.tree_img {
	top: 0;
	right: 0
}

.gta_img,
.tree_img {
	position: absolute;
	width: 37rem;
	z-index: 11;
	pointer-events: none
}

.gta_img {
	left: -2%;
	bottom: -8rem;
	animation: c 2s ease infinite
}

.scroll_down {
	position: absolute;
	bottom: 0;
	left: 4.5%;
	text-align: center;
	width: 16rem;
	display: inline-block
}

.scroll_content {
	position: absolute;
	top: 66%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.scroll_content img {
	width: 4.5rem;
	animation: b 2s ease infinite
}

@keyframes b {

	0%,
	20%,
	50%,
	80%,
	to {
		transform: translateY(0)
	}

	40% {
		transform: translateY(-2rem)
	}

	60% {
		transform: translateY(-1rem)
	}
}

.scroll_content p {
	font-weight: 800;
	font-size: 1.8rem;
	color: #fff;
	line-height: 1.2;
	margin-top: 1.8rem
}

.firstpage {
	z-index: 10
}

.product-box {
	background: linear-gradient(90deg, rgba(102, 23, 204, .95) -25.08%, rgba(129, 51, 255, .95) 199.17%);
	-webkit-clip-path: polygon(0 9%, 100% 0, 83% 93%, 0 100%);
	clip-path: polygon(0 9%, 100% 0, 83% 93%, 0 100%);
	padding: 1.3rem 1rem 1.3rem 0;
	margin: -.2rem 0 0 auto;
	min-height: 23.5rem;
	width: 48.4rem
}

.product-box,
.product-box-left {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center
}

.product-box-left {
	width: 19rem;
	min-width: 19rem;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 1rem
}

.product-box-left img {
	max-height: 15rem;
	width: 100%;
	object-fit: contain;
	object-position: center center
}

.gun-box-left {
	background-image: url(../img/test.webp);
	background-size: cover;
	background-repeat: no-repeat;
	width: 48rem;
	margin-left: auto;
	margin-right: -6rem;
	z-index: 0
}

.gun-box-images {
	width: 100%;
	text-align: center;
	overflow: hidden
}

.gun-box-images-left img {
	width: 35rem;
	margin-left: 2rem;
	transform: scale(1.6);
	padding-top: 8rem;
	z-index: 9
}

.gun-box-text {
	padding-top: 7rem;
	padding-left: 13.3rem
}

.gun-box-text h1,
.product-box-right h1 {
	line-height: 1.2;
	font-size: 3rem;
	font-weight: 900;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0;
	margin-inline-end: 0;
	margin-bottom: 0;
	margin-top: 1rem
}

.gun-box-text h1 {
	margin-top: 0
}

.gun-box-text p,
.product-box-right p {
	width: 21.7rem;
	font-size: max(1.8rem, 12px)
}

.gun-box-text p {
	width: 25.7rem;
	margin-bottom: -.3rem
}

.gun-box-text2 p {
	width: 30.7rem;
	margin-bottom: -1.5rem;
	margin-top: .5rem
}

.gun-box-right {
	background-image: url(../img/gun-box-right.webp);
	background-size: cover;
	background-repeat: no-repeat;
	width: 56rem;
	position: relative;
	z-index: 1;
	margin-left: -.9rem
}

.gun-box-images-right img {
	width: 35rem;
	position: relative;
	margin-left: -3vw;
	transform: scale(1.5);
	padding-top: 10rem;
	top: -20px;
	z-index: 10
}

.playbutton {
	clip-path: polygon(100% 0, 88.5% 63%, 86% 65%, 80% 100%, 0 100%, 18% 0);
	opacity: .4;
	width: 18%;
	position: absolute;
	z-index: 2;
	transform: translate(-50%, -55%);
	top: 50%;
	left: 50%;
	transition: all .2s ease-in-out;
	cursor: pointer
}

.playbutton:hover {
	opacity: .8;
	width: 23%
}

.hero-bottom-sec-hlc {
	position: absolute;
	top: 15%;
	width: 42.4rem;
	animation: c 2s ease infinite
}

@keyframes c {

	0%,
	to {
		transform: translateY(0)
	}

	50% {
		transform: translateY(-2rem)
	}
}

.hero-bottom-sec-car {
	position: absolute;
	bottom: 0;
	width: 63.2rem;
	pointer-events: none
}

.left_shape {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 53rem;
	object-fit: cover;
	object-position: right center
}

.box_content {
	padding-left: 19%
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
	background: #fff
}

.about-section .left_shape {
	width: 24.6rem
}

.about-header h2 {
	font-weight: 900;
	font-size: 9.6rem;
	line-height: 11.5rem;
	color: #fd7e14;
	text-align: right
}

.about-header h2 b {
	color: #fff
}

.about-header h2 span {
	color: hsla(0, 0%, 100%, 0);
	-webkit-text-stroke-width: .1rem;
	-webkit-text-stroke-color: hsla(0, 0%, 100%, .267)
}

.about-header h2 span:last-child {
	-webkit-text-stroke-color: hsla(0, 0%, 100%, .1)
}

.about-left-img img {
	position: absolute;
	margin-top: -45rem;
	left: 2%;
	z-index: 0;
	width: 53rem;
	transform: scale(3);
	pointer-events: none;
	overflow: hidden
}

.about-tab-box {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: end;
	justify-content: flex-end
}

.tab-content {
	margin-left: -67rem
}

.tab-content .about-tab-content {
	width: 100.33rem;
	height: 67rem;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50%;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: end;
	align-items: flex-end;
	position: relative
}

.tab-content .about-tab-content iframe {
	width: 100%;
	height: 100%;
	border: none;
	position: absolute;
	top: 0;
	left: 0;
	clip-path: polygon(100% 0, 88.5% 63%, 86% 65%, 80% 100%, 0 100%, 18% 0)
}

.about_text {
	padding: 0 0 3rem 6rem;
	position: relative;
	z-index: 1
}

.about_text h4 {
	font-size: 2.4rem;
	font-weight: 900;
	line-height: 1.2
}

.about_text p {
	max-width: 20.7rem;
	margin-top: .7rem
}

.play_icon,
.small_play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: inline-block;
	width: 18.4rem
}

.small_play {
	width: 5.8rem
}

.mySwiper {
	height: 67rem;
	width: 44.7rem;
	padding-right: 12rem
}

.tab_link {
	clip-path: polygon(100% 0, 88.5% 63%, 86% 65%, 80% 100%, 0 100%, 18% 0);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50%;
	width: 100%;
	height: calc(100% - 1.5rem);
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: end;
	align-items: flex-end;
	z-index: 1
}

.tab_link:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(180deg, rgba(123, 46, 245, 0), #7a2ef557);
	z-index: -1
}

.swiper-slide {
	margin-left: 0;
	transition: margin-left .7s
}

.swiper-slide-active,
.swiper-slide-prev {
	margin-left: 12rem
}

.swiper-slide-next {
	margin-left: 6rem
}

.about-tab-text {
	padding: 0 0 1.7rem 3rem
}

.about-tab-text p {
	font-weight: 900;
	color: #fff;
	line-height: 1.2;
	max-width: 190px
}

.swiper-button-prev {
	left: 62%;
	right: auto;
	top: 4rem
}

.swiper-button-next {
	right: auto;
	left: 30%;
	top: auto;
	bottom: 4rem
}

.swiper-button-next-img {
	height: 4rem;
	width: 4rem
}

.swiper-button-prev-img {
	height: 4rem;
	width: 4rem;
	transform: rotate(180deg)
}

.swiper-button-next:after,
.swiper-button-prev:after {
	display: none
}

footer {
	background: #f8d247;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 3;
	padding: 1rem 0
}

footer .logo_wrap p {
	color: #252525
}

.footer-menu {
	text-align: right
}

.footer-center-images {
	width: 28rem;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none
}

.footer-menu ul li {
	display: inline-block;
	position: relative;
	padding-left: 2.2rem;
	line-height: 1;
	padding-top: .4rem;
	margin-left: 4rem
}

.footer-menu ul li:before {
	content: "";
	position: absolute;
	width: 1rem;
	height: 1rem;
	background: #252525;
	left: 0;
	top: 50%;
	transform: translateY(-50%)
}

.footer-menu ul li a {
	color: #252525
}

.twitch-holder {
	position: absolute;
	left: 0;
	bottom: 7rem;
	display: flex;
	flex-direction: column-reverse;
	width: 400px;
	height: 340px
}

.askownerbox {
	display: none;
	width: 400px;
	background-color: #f8d247;
	color: #000;
	text-align: center;
	font-size: 1.5rem;
	margin-bottom: -.4rem;
	padding: .5rem
}

.startbtn {
	font-size: 24px;
	padding: 2.5rem 2rem;
	min-width: 25.8rem;
	background: linear-gradient(90deg, #9a5413, #d9a729);
	box-shadow: 0 1rem 5.7rem -1.1rem #f8d247, inset 0 0 86px #ffe872;
}