@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url(font/helveticaneuecyr_black.otf);
    src: url(font/helveticaneuecyr_black.otf?#iefix);
    font-weight: 700;
}
@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url(font/helveticaneuecyr_roman.otf);
    src: url(font/helveticaneuecyr_roman.otf?#iefix);
    font-weight: 400;
}
@font-face {
    font-family: 'Bebas Neue Cyrillic';
    src: url(font/Bebas_Neue_Cyrillic.ttf);
    src: url(font/Bebas_Neue_Cyrillic.ttf?#iefix);
}

:root {
	--h2-font-size:86px;
	--p-font-size:25px;
	--logo-height: 145px;
	--club-color: #ffffff;
	
	@media (width < 1150px) {
		--h2-font-size:56px;
		--p-font-size:18px;
		--logo-height: 109px;
	}
	
	@media (width < 850px) {
		--logo-height: 84px;
	}
}

html {
	background: #161719;
	overflow: hidden auto;
}

body {
	margin: 0;
	overflow: hidden auto;
}

h1 {
	font-family: Bebas Neue Cyrillic;
	font-weight: 400;
	font-size: var(--h2-font-size);
	line-height: 100%;
	color: #ffffff;
	margin-top: 30px;
	margin-bottom: 32px;
}

.top-fon:before {
	content: '';
	background: url(../img/grid.png) center;
	width: 100%;
	height: 1200px;
	position: absolute;
	z-index: -1;
	margin-top: -215px;
	background-size: 100%;
	background-repeat: no-repeat;
}

.container {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	max-width: 1200px;
}

header {
	.container {
		position: relative;
		margin: 0 auto;
		padding: 0;
		margin-left: 88px;
		margin-right: 88px;
		background-size: 100%;
		background-repeat: no-repeat;

		.wrap {
			height: var(--logo-height);
			display: flex;
			align-items: center;
			margin-top: 38px;
			
			.logo {
				img {
					display: block;
					height: var(--logo-height);
				}
			}
		
			@media (width < 850px) {
				padding-left: 30px;
				padding-right: 30px;
				justify-content: space-between;
			}
		}
		
		@media (width < 1380px) {
			margin-left: 30px;
			margin-right: 30px;
		}
		
		@media (width < 850px) {
			margin-left: 0px;
			margin-right: 0px;
		}
	}
}

.header_menu {
	margin-left: 90px;
	
	@media (width < 850px) {
		width: 0;
		padding: 0 25px;
		max-height: 0;
		opacity: 0;
		visibility: hidden;
		transition-duration: .3s;
		position: absolute;
		top: 100%;
		right: 0;
	}
	
	&.opened {
		width: max-content;
		max-height: 999px;
		opacity: 1;
		visibility: visible;
		padding: 25px 25px;
		background: #161719;
		z-index: 1110;
		height: 999px;
		
		.menu_list {
			flex-direction: column;
		}
	}
}

.menu_list {
    padding: 0;
    display: flex;
    gap: 60px;
	
	li {
		list-style: none;
	}
	
	a {
		font-family: HelveticaNeueCyr;
		font-weight: 700;
		font-size: 20px;
		line-height: 100%;
		letter-spacing: 0%;
		text-transform: uppercase;
		color: #FFFFFF;
		text-decoration: none;
	}
}

.float_menu {
	display: none;
	
	.open_mob_menu {
		display: flex;
		flex-flow: column;
		background: none;
		border: none;
		gap: 9px;
		cursor: pointer;
		
		span {
			background: #fff;
			width: 48px;
			height: 2px;
			transition-duration: .3s;
			
			&:last-child {
				width: 30px;
			}
		}
	}
	
	&.opened {
		.open_mob_menu {
			span {
				background: #fff;
				width: 48px;
				height: 2px;
				
				&:nth-child(1) {
					transform: rotate(45deg) translate(4px, 4.5px);
				}
				
				&:nth-child(2) {
					transform: rotate(-45deg) translate(4.5px, -4.5px);
				}
			
				&:last-child {
					transform: scaleX(0);
				}
			}
		}
	}
	
	@media (width < 850px) {
		display: block;
	}
}

.v-left {
	position: absolute;
	width: 170px;
	height: 243px;
	background: #00000054;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	z-index: 2;
	top: 337px;
	
	&:before {
		content: '';
		background: linear-gradient(to right top, #00000054 0%, #00000054 49%, transparent 50%, transparent 100%);
		width: 100%;
		height: 150px;
		position: absolute;
		z-index: -1;
		top: -150px;
	}
	
	&:after {
		content: '';
		background: linear-gradient(to right bottom, #00000054 0%, #00000054 49%, transparent 50%, transparent 100%);
		width: 100%;
		height: 148px;
		position: absolute;
		z-index: -1;
		bottom: -148px;
	}
	
	@media (width < 1620px) {
		width: 84px;
	}
	
	@media (width < 1400px) {
		width: 0px;
	}
}

.v-right {
	position: absolute;
	width: 170px;
	height: 243px;
	background: #00000054;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	z-index: 2;
	top: 337px;
	right: 0;
	
	&:before {
		content: '';
		background: linear-gradient(to left top, #00000054 0%, #00000054 49%, transparent 50%, transparent 100%);
		width: 100%;
		height: 150px;
		position: absolute;
		z-index: -1;
		top: -150px;
	}
	
	&:after {
		content: '';
		background: linear-gradient(to left bottom, #00000054 0%, #00000054 49%, transparent 50%, transparent 100%);
		width: 100%;
		height: 148px;
		position: absolute;
		z-index: -1;
		bottom: -148px;
	}
	
	@media (width < 1620px) {
		width: 84px;
	}
	
	@media (width < 1400px) {
		width: 0px;
	}
}

.buttons {
	display: flex;
	gap: 20px;
		
	@media (width < 1260px) {
		flex-flow: column-reverse;
	}
	
	@media (width < 1000px) {
		display: none;
	}
}

.buttons-m {
	display: none;
	
	@media (width < 1000px) {
		display: flex;
		flex-flow: initial;
	}
	
	@media (width < 500px) {
		display: flex;
		width: 100%;
		flex-flow: column-reverse;
	}
}

.btn {
	padding: 13px 74px;
	font-family: Bebas Neue Cyrillic;
	font-weight: 400;
	font-size: 30px;
	line-height: 140%;
	letter-spacing: 0%;
	text-align: center;
	color: #ffffff;
	border: 0;
	text-decoration: none;
	cursor: pointer;
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 79%, calc(100% - 13px) 100%, 0 100%);
	clip-path: polygon(0 0, 100% 0, 100% 79%, calc(100% - 13px) 100%, 0 100%);
	
	@media (width < 500px) {
		padding: 13px 38px;
	}
}

.btn_video {
	box-sizing: border-box;
	/*border: 2px solid rgb(255, 255, 255);*/
	background: none;
	position: relative;
	font-family: Roboto;
	font-weight: 700;
	font-size: 20px;
	line-height: 140%;
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 13px 68px;
	cursor: pointer;
	
	.play {
		width: 12px;
		height: 12px;
		display: block;
		background: #fff;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 50%, 0% 100%, 0 100%);
		clip-path: polygon(0 0, 100% 0, 100% 0%, 0% 100%, 0 100%);
		transform: rotate(132deg);
	}
	
	@media (width < 1260px) {
		justify-content: center;
		padding: 13px 8px;
	}
}

.top-sliders {
	margin-top: 13px;
	
	.swiper-horizontal {
		overflow: visible;
	}
	
	.slide_wrap {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 45px;
		
		.info {
			width: 100%;
			padding-top: 30px;
			z-index: 1;
			
			.block_title {
				font-family: Bebas Neue Cyrillic;
				font-weight: 400;
				font-size: var(--h2-font-size);
				line-height: 100%;
				letter-spacing: 0%;
				color: #FFFFFF;
				margin: 0;
			}
			
			p {
				font-family: HelveticaNeueCyr;
				font-weight: 400;
				font-size: var(--p-font-size);
				line-height: 140%;
				letter-spacing: 0%;
				color: #fff;
			}
			
			@media (width < 1260px) {
				width: calc(100% - 520px);
			}
			
			@media (width < 1000px) {
				width: 100%;
			}
		}
		
		.image_wrap {
			width: 520px;
			min-width: 520px;
			height: 420px;
			padding: 10px;
			z-index: 1;
			
			.image {
				width: 100%;
				height: 450px;
				
				img {
					display: block;
					object-fit: cover;
					width: 100%;
					height: 100%;
				}
			
				@media (width < 1000px) {
					height: auto;
				}
			}
			
			@media (width < 1000px) {
				width: 100%;
				min-width: 100%;
				height: auto;
			}
		}
		
		.image_fon {
			opacity: 0.5;
			filter: blur(150px);
			width: 614px;
			height: 614px;
			position: absolute;
			right: 0;
			
			@media (width < 1000px) {
				right: auto;
				bottom: calc(25% - 100px);
				width: clamp(100px, 70%, 614px);
				height: clamp(100px, 70%, 614px);
			}
		}
		
		@media (width < 1000px) {
			flex-direction: column;
			gap: 36px;
		}
	}
	
	.fon-booton {
		background: linear-gradient(180deg, rgba(22, 23, 25, 0) 0%, #161719 100%);
		width: 100%;
		height: 191px;
		
		@media (width < 1000px) {
			height: 96px;
		}
	}
	
	@media (width < 1380px) {
		margin-left: 30px;
		margin-right: 30px;
	}
}

.controls {
	max-width: 452px;
	margin-left: auto;
	margin-top: 131px;
	position: relative;
	
	.counter {
		margin: auto;
		display: flex;
		gap: 20px;
		justify-content: center;
		margin: 10px 0;
		position: relative;
		
		.swiper-pagination-bullet {
			width: 50px;
			height: 4px;
			background: #FFFFFF;
			border: 0;
			border-radius: 2px;
            margin: 0 !important;
			padding: 0;
			left: 0  !important;
			width: 50px;
			height: 4px;
			transform: scale(1);
			opacity: 1;
			
			&.swiper-pagination-bullet-active-prev, &.swiper-pagination-bullet-active-next {
				width: 50px;
				height: 4px;
				transform:scale(1);
				opacity: 1;
				left: 0  !important
			}
			
			&.swiper-pagination-bullet-active-main {
				background: #0074E2;
			}
		}
		
		@media (width < 1000px) {
			position: absolute;
			margin: 10px auto;
			float: inherit;
		}
	}
	
	.arrows {
		display: flex;
		justify-content: space-between;
		width: 100%;
	
		.prev {
			width: 22px;
			height: 22px;
			cursor: pointer;
			margin-top: -20px;
	  
			.icon {
				border: 2px solid #fff;
				transform: rotate(135deg);
				width: 11px;
				display: block;
				position: relative;
				transition-duration: .3s;
				
				&:after {
					content: '';
					border: 2px solid #fff;
					transform: rotate(90deg);
					width: 11px;
					display: block;
					position: absolute;
					margin: -8px 0px 0px 4px;
					transition-duration: .3s;
				}
			}
				
			&:hover {
				.icon {
					border: 2px solid #0074E2;
					
					&:after {
						border: 2px solid #0074E2;
					}
				}
			}
		}
		
		.next  {
			width: 22px;
			height: 22px;
			cursor: pointer;
			margin-top: -10px;
			
			.icon {
				border: 2px solid #fff;
				transform: rotate(-45deg);
				width: 11px;
				display: block;
				position: relative;
				transition-duration: .3s;
				
				&:after {
					content: '';
					border: 2px solid #fff;
					transform: rotate(90deg);
					width: 11px;
					display: block;
					position: absolute;
					margin: -8px 0px 0px 4px;
					transition-duration: .3s;
				}
			}
				
			&:hover {
				.icon {
					border: 2px solid #0074E2;
					
					&:after {
						border: 2px solid #0074E2;
					}
				}
			}
		}
	}
	
	@media (width < 1000px) {
		max-width: 100%;
		margin-top: 50px;
	}
}

.video-pop-up {
	position: fixed;
	overflow: auto;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: none;
	
	&.pop-up {
		background: rgba(35, 35, 35, 0.5);
		display: block;
		backdrop-filter: blur(7px);
		z-index: 1112;
		
		.bg {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			z-index: 1;
			cursor: pointer;
		}
		
		.video {
			padding: 30px;
			background: #161719;
			box-sizing: border-box;
			border-radius: 10px;
			position: fixed;
			width: 100%;
			max-width: 800px;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			z-index: 1112;
			display: flex;
			
			&.news-c {
				max-width: 1200px;
				
				.text {
					.card_news {
						.cn_wrap {
							.cn_title {
								@media (width < 1000px) {
									display: none;
								}
							}
							
							@media (width < 1000px) {
								width: 100%;
							}
							
							.social {
								@media (width < 1000px) {
									display: none;
								}
							}
						}
						
						@media (width < 1000px) {
							flex-direction: column-reverse;
							gap: 16px;
						}
					
						.image {
							.cn_title {
								display: none;
								
								@media (width < 1000px) {
									display: block;
								    font-size: 63px;
									margin-bottom: 20px;
								}
							}
							
							.thumbnail {
								@media (width < 1000px) {
									position: relative;
								}
								
								.social {
									top: 0;
									right: 0;
									flex-direction: column;
									
									@media (width > 1000px) {
										display: none;
									}
								}
							}
							
							@media (width < 1000px) {
								width: 100%;
							}
						}
					}
				}
				
				&.news-text {
					@media (width < 1000px) {
						top: 100%;
					}
				}
			}
			
			.close-video {
				position: absolute;
				right: 20px;
				top: 20px;
				cursor: pointer;
				
				&:before {
					content: '';
					background: #fff;
					width: 3px;
					height: 20px;
					position: absolute;
					transform: rotate(45deg);
				}
				
				&:after {
					content: '';
					background: #fff;
					width: 3px;
					height: 20px;
					position: absolute;
					transform: rotate(135deg);
				}
			}
			
			.body-v {
				height: 0;
				padding-bottom: 56.25%;
				position: relative;
				width: 100%;
				
				.videos {
					border: 0;
					left: 0;
					position: absolute;
					top: 0;
				}
				
				.card_news {
					display: flex;
					gap: 80px;
					
					.cn_wrap {
						width: 50%;
						position: relative;
						
						.cn_title {
							font-size: 86px;
						}
						
						.cn_text {
							margin-bottom: 90px;

							& * {
								font-family: HelveticaNeueCyr;
								font-weight: 400;
								font-size: 18px;
								line-height: 140%;
								color: #BBBBBB;
							}
							
							@media (width < 1000px) {
								margin-bottom: 0;
							}
						}
					}
					
					.image {
						width: 50%;
						
						.thumbnail {
							> img {
								width: 100%;
								height: 100%;
								object-fit: cover;
							}
						}
					}
				}
				
				&.text {
					height: auto;
					padding-bottom: initial;
				}
			}
			
			@media (width < 1000px) {
				max-width: auto;
			}
		}
		
		&.mobi-class {
			.video {
				&.news-c {
					&.news-text {
						top: 200%;
					}
				}
			}
		}
	}
}
						
.social {
	position: absolute;
	bottom: 0;
	display: flex;
	gap: 20px;

	.heateor {
		border-radius: 50%;
		width: 64px;
		height: 64px;
		display: flex;
		justify-content: center;
		align-items: center;

		&.telegram {
			background: #37AEE2;
		}

		&.facebook {
			background: #3B579D;
		}

		&.x {
			background: #242424;
		}
	}
}

.sidebar {
	position: absolute;
	top: 0;
	right: 0;
	
	.social {
		bottom: auto;
		flex-direction: column;
		top: 0;
	
		@media (width < 1380px) {
			position: relative;
			flex-direction: row;
		}
	}
	
	@media (width < 1380px) {
        position: relative;
    }
}

.news_one {
	.wrap {
		.block_title_wrap {
			display: flex;
			flex-direction: row-reverse;
			gap: 80px;
			
			.image {
				img {
					max-width: 600px;
				
					@media (width < 1380px) {
						width: 100%;
						height: auto;
					}
				}
				
				@media (width < 1380px) {
					display: flex;
					justify-content: center;
				}
			}
			
			@media (width < 1380px) {
				flex-direction: column;
				margin-top: 30px;
				gap: 30px;
			}
		}
		
		@media (width < 1400px) {
			padding: 0 30px;
		}
	}
}

h3 {
	font-family: Bebas Neue Cyrillic;
	font-weight: 400;
	font-size: 45px;
	line-height: 100%;
	letter-spacing: 0%;
	color: #FFF;
}

.block_wrap {
	margin-top: 20px;
}

.text_content {
	strong {
		display: initial;
	}
	
	a {
		color: #fff;
		font-weight: 700;
		transition-duration: 0.3s;
		
		&:hover {
			color: #0074E2;
		}
	}
	
	ul, ol {
		font-family: HelveticaNeueCyr;
		font-weight: 400;
		font-size: 20px;
		line-height: 140%;
		color: #D9D9D9;
	}
}
						
.wrap-club {
	.club {
		display: flex;
		gap: 10px;
		margin-top: 10px;

		img {
			width: 40px;
		}

		.date {
			display: block;
			font-family: Bebas Neue Cyrillic;
			font-weight: 400;
			font-size: 20px;
			line-height: 100%;
			color: var(--club-color);
			margin: auto 0;
		}
	}
}

h2 {
	font-family: Bebas Neue Cyrillic;
    font-weight: 400;
    font-size: var(--h2-font-size);
    line-height: 100%;
    letter-spacing: 0%;
    color: #0074E2;
    margin: 0;
}

p {
	font-family: HelveticaNeueCyr;
	font-weight: 400;
	font-size: 20px;
	line-height: 140%;
	color: #D9D9D9;
}

h4 {
	font-family: Bebas Neue Cyrillic;
	font-weight: 400;
	font-size: 30px;
	line-height: 100%;
	color: #FFFFFF;
	margin: 0;
	
	img {
		margin-right: 15px;
		width: 21px;
	}
}

strong {
	font-family: HelveticaNeueCyr;
	font-weight: 700;
	display: block;
}

.btn_button {
	background: none;
	border: 2px solid #FFFFFF;
	position: relative;
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 79%, calc(100% - 13px) 100%, 0 100%);
	clip-path: polygon(0 0, 100% 0, 100% 79%, calc(100% - 13px) 100%, 0 100%);
	margin-top: 21px;
	padding: 13px 44px;
	transition-duration: .3s;
	
	&:after {
		content: '';
		width: 20px;
		height: 21px;
		position: absolute;
		z-index: -1;
		border-left: 2px solid rgb(255, 255, 255);
		bottom: -11.5px;
		right: -12.5px;
		transition: rotet;
		transform: rotate(42deg);
		transition-duration: .3s;
	}
	
	&:hover {
		background: #0074E2;
		border: 2px solid #0074E2;
		font-family: Bebas Neue Cyrillic;
		font-weight: 400;
		font-size: 30px;
		line-height: 140%;
		letter-spacing: 0%;
		text-align: center;
		color: #ffffff;
		text-decoration: none;
		cursor: pointer;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 79%, calc(100% - 13px) 100%, 0 100%);
		clip-path: polygon(0 0, 100% 0, 100% 79%, calc(100% - 13px) 100%, 0 100%);
	
		&:after {
			transition-duration: .3s;
			border-left: 2px solid #0074E2;
		}
	}
	
	@media (width < 1000px) {
		width: 100%;
	}
	
	@media (width < 700px) {
		display: none;
	}
}

.btn_button-mob {
	display: none;
	
	@media (width < 700px) {
		display: block;
	}
}

.the_network {
	background: #161719;
	
	.content {
		display: flex;
		
		.short {
			width: 50%;
			max-width: 590px;
			
			@media (width < 700px) {
				width: 100%;
			}
		}
		
		.network {
			width: 50%;
			display: flex;
			flex-wrap: wrap;
			gap: 32px 7px;
			
			.characteristic {
				width: calc(50% - 3.5px);
				
				p {
					font-size: 18px;
					padding-left: 36px;
					margin: 14px 0 0 0;
				}
				
				@media (width < 1000px) {
					width: 100%;
				}
			}
			
			@media (width < 1000px) {
				flex-direction: column;
			}
			
			@media (width < 700px) {
				width: 100%;
			}
		}
		
		@media (width < 1000px) {
			gap: 39px;
		}
		
		@media (width < 700px) {
			flex-direction: column;
			gap: 0;
		}
	}
	
	@media (width < 1380px) {
		margin-left: 30px;
		margin-right: 30px;
	}
}

.our-clubs {
	h3 {
		font-family: Bebas Neue Cyrillic;
		font-weight: 400;
		font-size: 45px;
		line-height: 80px;
		color: #fff;
		margin: 0;
	}
	
	p {
		font-family: HelveticaNeueCyr;
		font-weight: 400;
		font-size: 18px;
		line-height: 140%;
		color: #fff;
		max-width: 300PX;
		
		@media (width < 1250px) {
			margin-top: 0;
		}
		
		@media (width < 700px) {
			max-width: 100%;
		}
	}
	
	.item-c {
		 @media (width < 700px) {
			flex-direction: column;
			gap: 22px;
		}
	}
	
	.btn {
		max-height: 48px;
		margin-top: auto;
		white-space: nowrap;
		display: block;
		
		&.btn_button {
			@media (width < 1250px) {
				margin-right: 30px;
				margin-bottom: 7px;
			}
		
			@media (width < 700px) {
				width: initial;
				margin-left: 30px;
			}
		}
	}
					
				
}

.two-clubs {
	margin-top: 174px;
	
	.title {
		position: absolute;
		width: 100%;
		display: flex;
		justify-content: center;	
		z-index: 100;
		
		h2 {
			background: #161719;
			-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 93% 100%, 7% 100%);
			clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 93% 100%, 7% 100%);
			width: 100%;
			max-width: 702px;
			text-align: center;
			height: 116px;
			margin-top: -16px;
			
			@media (width < 1380px) {
				-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				width: auto;
				height: auto;
				margin-top: 0;
			}
		}
		
		@media (width < 1380px) {
			position: initial;
			justify-content: left;
			margin-left: 30px;
			margin-right: 30px;
			margin-bottom: 45px;
		}
	}
	
	.clubs {
		display: flex;
		gap: 80px;
		
		.clubs-item {
			position: relative;
			
			img {
				width: 100%;
			}
			
			.item-c {
				background: #161719;
				position: absolute;
				bottom: -33px;
				display: flex;
				gap: 72px;
				-webkit-clip-path: polygon(0px 0px, 87% 0px, 100% 100%, 100% 100%, 0% 100%);
				clip-path: polygon(0px 0px, 87% 0px, 100% 100%, 100% 100%, 0% 100%);
				padding-right: 158px;
				
				.content {
					margin-left: 30px;
					width: 100%;
				
					@media (width < 700px) {
						width: auto;
					}
				}
				
				@media (width < 1380px) {
					padding-right: 30px;
					padding-left: 30px;
					width: 100%;
					position: initial;
				}
					
				@media (width < 1250px) {
					-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
					clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 0;
					margin-top: -51px;
				}
				
				@media (width < 700px) {
					gap: 22px;
				}
			}

			&:nth-child(1) {
				.item-c {
					right: 0;
					-webkit-clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
					clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 158px;
					
					@media (width < 1380px) {
						right: auto;
						padding-right: 30px;
						padding-left: 30px;
						width: 100%;
					}
					
					@media (width < 1250px) {
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
					}
				}
			}
		}
		
		@media (width < 1380px) {
			gap: 51px;
			flex-direction: column;
		}
	}
}

.three-clubs {
	margin-top: 174px;
	
	.title {
		position: absolute;
		width: 100%;
		display: flex;
		justify-content: center;	
		z-index: 100;
		
		h2 {
			background: #161719;
			-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 93% 100%, 7% 100%);
			clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 93% 100%, 7% 100%);
			width: 100%;
			text-align: center;
			height: 116px;
			margin-top: -73px;
			max-width: 1151px;
			
			@media (width < 1380px) {
				-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				width: auto;
				height: auto;
				margin-top: 0;
			}
		}
		
		@media (width < 1380px) {
			position: initial;
			justify-content: left;
			margin-left: 30px;
			margin-right: 30px;
			margin-bottom: 45px;
		}
	}
	
	.clubs {
		display: flex;
		gap: 30px;
		
		.clubs-item {
			position: relative;
			
			.image {
				width: 100%;
				height: 628px;
				
				img {
					display: block;
					object-fit: cover;
					width: 100%;
					height: 100%;
				}
			}
			
			.item-c {
				background: #161719;
				display: flex;
				padding-right: 158px;
				gap: 22px;
				-webkit-clip-path: polygon(0px 0px, 36% 0px, 100% 100%, 100% 100%, 0% 100%);
				clip-path: polygon(0px 0px, 36% 0px, 100% 100%, 100% 100%, 0% 100%);
				padding-left: 292px;
				flex-direction: column;
				margin-top: -58px;
				width: 300px;
				
				.content {
					width: 100%;
					text-align: center;
					margin-left: 0;
					
					p {
						margin-top: 0;
						height: 75px;
				
						@media (width < 700px) {
							height: auto;
						}
					}
				
					@media (width < 1380px) {
						margin-left: 30px;
						text-align: left;
					}
				
					@media (width < 700px) {
						width: auto;
						margin-right: 30px;
					}
				}
				
				.btn_button {
					margin: auto;
					
					@media (width < 1380px) {
						margin-bottom: 30px;
						margin-right: 30px;
					}
				
					@media (width < 700px) {
						width: auto;
						margin-left: 30px;
					}
				}
				
				@media (width < 1380px) {
					padding-right: 30px;
					padding-left: 30px;
					width: 100%;
					position: initial;
					flex-direction: row;
				}
					
				@media (width < 1250px) {
					-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
					clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 0;
					margin-top: -51px;
				}
				
				@media (width < 700px) {
					gap: 22px;
					flex-direction: column;
				}
			}

			&:nth-child(1) {
				.item-c {
					-webkit-clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
					clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 158px;
					margin-left: auto;
					margin-right: 0;
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
			}
			
			&:nth-child(2) {
				.item-c {
					-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 100%, 100% 100%, 0% 100%);
					clip-path: polygon(0px 0px, 100% 0px, 100% 100%, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 0;
					width: 100%;
					
					.content {
						p {
							margin-left: auto;
							margin-right: auto;
					
							@media (width < 1380px) {
								margin-left: 0;
							}
						}
					}
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
			}
			
			&:nth-child(3) {
				.item-c {
					-webkit-clip-path: polygon(0px 0px, 64% 0px, 100% 100%, 100% 100%, 0% 100%);
					clip-path: polygon(0px 0px, 64% 0px, 100% 100%, 100% 100%, 0% 100%);
					padding-left: 0;
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
			}
		}
		
		@media (width < 1380px) {
			gap: 51px;
			flex-direction: column;
		}
	}
}

.four-clubs {
	margin-top: 174px;
	
	.title {
		position: absolute;
		width: 100%;
		display: flex;
		justify-content: center;	
		z-index: 100;
		
		h2 {
			background: #161719;
			-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 93% 100%, 7% 100%);
			clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 93% 100%, 7% 100%);
			width: 100%;
			max-width: 702px;
			text-align: center;
			height: 116px;
			margin-top: -16px;
			
			@media (width < 1380px) {
				-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				width: auto;
				height: auto;
				margin-top: 0;
			}
		}
		
		@media (width < 1380px) {
			position: initial;
			justify-content: left;
			margin-left: 30px;
			margin-right: 30px;
			margin-bottom: 45px;
		}
	}
	
	.clubs {
		display: flex;
		gap: 80px;
		flex-wrap: wrap;
		
		.clubs-item {
			position: relative;
			width: calc(50% - 40px);
			
			.image {
				width: 100%;
				height: 628px;
				
				img {
					display: block;
					object-fit: cover;
					width: 100%;
					height: 100%;
				}
			}
			
			.item-c {
				background: #161719;
				position: absolute;
				display: flex;
				padding-right: 158px;
				gap: 22px;
				bottom: -45px;
				-webkit-clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
				padding-left: 292px;
				
				.content {
					width: 100%;
					margin-left: 0;
					
					p {
						margin-top: 0;
						height: 75px;
				
						@media (width < 700px) {
							height: auto;
						}
					}
				
					@media (width < 1380px) {
						margin-left: 30px;
						text-align: left;
					}
				
					@media (width < 700px) {
						width: auto;
						margin-right: 30px;
					}
				}
				
				.btn_button {
					margin: auto;
					margin-bottom: 45px;
					margin-left: 47px;
					
					@media (width < 1380px) {
						margin-bottom: 30px;
						margin-right: 30px;
					}
				
					@media (width < 700px) {
						width: auto;
						margin-left: 30px;
					}
				}
				
				@media (width < 1380px) {
					padding-right: 30px;
					padding-left: 30px;
					width: 100%;
					position: initial;
					flex-direction: row;
				}
					
				@media (width < 1250px) {
					-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
					clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 0;
					margin-top: -51px;
				}
				
				@media (width < 700px) {
					gap: 22px;
					flex-direction: column;
				}
			}

			&:nth-child(1) {
				.item-c {
					right: 0;
					-webkit-clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
					clip-path: polygon(87px 0px, 100% 0px, 100% 0%, 100% 100%, 0% 100%);
					padding-right: 0;
					padding-left: 158px;
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
			}
			
			&:nth-child(2) {
				.item-c {
					-webkit-clip-path: polygon(0px 0px, 87% 0px, 100% 100%, 100% 100%, 0% 100%);
					clip-path: polygon(0px 0px, 87% 0px, 100% 100%, 100% 100%, 0% 100%);
					padding-right: 158px;
					padding-left: 0;
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
			}

			&:nth-child(3) {
				.item-c {
					right: 0;
					-webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 13% 100%);
					clip-path: polygon(0px 0px, 100% 0px, 100% 0%, 100% 100%, 13% 100%);
					padding-right: 0;
					padding-left: 158px;
					top: -23px;
					bottom: auto;
						
					.btn_button {
						margin-bottom: auto;
						margin-top: 23px;
		
						@media (width < 1380px) {
							margin-top: auto;
							margin-bottom: 30px;
							margin-right: 30px;
						}
					}
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
				
				&:after {
					content: '';
					width: 600px;
					height: 50px;
					position: absolute;
					bottom: 0;
					-webkit-clip-path: polygon(4% 0px, 100% 0px, 100% 100%, 0% 100%);
					clip-path: polygon(4% 0px, 100% 0px, 100% 100%, 0% 100%);
					background: #161719;
					right: 0;
					
					@media (width < 1380px) {
						display: none;
					}
				}
			}
			
			&:nth-child(4) {
				.item-c {
					-webkit-clip-path: polygon(0px 0px, 100% 0px, 87% 100%, 100% 100%, 0% 100%);
					clip-path: polygon(0px 0px, 100% 0px, 87% 100%, 0% 100%);
					padding-right: 158px;
					padding-left: 0;
					top: -23px;
					bottom: auto;
						
					.btn_button {
						margin-bottom: auto;
						margin-top: 23px;
		
						@media (width < 1380px) {
							margin-top: auto;
							margin-bottom: 30px;
							margin-right: 30px;
						}
					}
					
					@media (width < 1380px) {
						right: auto;
						width: 100%;
						-webkit-clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);
						clip-path: polygon(0% 0%, 255px 0%, 300px 50px, 100% 50px, 100% 100%, 0% 100%);						
						padding-right: 0;
						padding-left: 0;
						margin-top: -51px;
						display: flex;
					}
				}
				
				&:after {
					content: '';
					width: 600px;
					height: 50px;
					position: absolute;
					bottom: 0;
					-webkit-clip-path: polygon(0px 0px, 94% 0px, 100% 100%, 0% 100%);
					clip-path: polygon(0px 0px, 94% 0px, 100% 100%, 0% 100%);
					background: #161719;
					
					@media (width < 1380px) {
						display: none;
					}
				}
			}
		
			@media (width < 1380px) {
				width: 100%;
			}
		}
		
		@media (width < 1380px) {
			gap: 51px;
			flex-direction: column;
		}
	}
}

.news {
	margin-top: 140px;
	position: relative;
	
	.wrap {
		@media (width < 1400px) {
			padding: 0 30px;
		}
	}
	
	.block_title_wrap {
		touch-action: pan-y;
		width: calc(100% + 260px);
		margin: 0 -130px 46px -130px;
		overflow: visible;
		display: flex;
		justify-content: space-between;
		
		@media (width < 1400px) {
			width: 100%;
			margin: 0 0 46px;
		}
	}
		
	.new {
		margin-left: 0;
		margin-top: auto;
		margin-bottom: auto;
			
		.counter {
			margin: 0 0 4px 0;
			width: 100% !important;
		}
		
		@media (width > 1000px) {
			position: absolute;
			top: 39px;
			right: 36px;
			width: 400px;
		}
		
		@media (width > 1400px) {
			right: -132px;
		}
	}
	
	.news_grid {
		touch-action: pan-y;
		width: calc(100% + 260px);
		margin: 0 -130px;
		overflow: visible;
		width: 100%;
		
		.swiper-slide {
			max-width: 280px;
			cursor: pointer;
		
			.image {
				width: 100%;
				height: 350px;
				
				img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
			}
			
			.cn_wrap {
				.wrap-club {
					margin-top: 11px;
					display: flex;
					justify-content: space-between;
					
					.club {
						display: flex;
						gap: 10px;
						
						img {
							width: 32px;
						}
						
						.date {
							margin: 0 auto;
							display: block;
							font-family: Bebas Neue Cyrillic;
							font-weight: 400;
							font-size: 20px;
							line-height: 100%;
							color: var(--club-color);
							margin: auto;
						}
					}
					
					span {
						font-family: Bebas Neue Cyrillic;
						font-weight: 400;
						font-size: 20px;
						line-height: 100%;
						color: #ffffff;
						margin: auto 0;
						
						svg {
							margin-left: 10px;
						}
					}
				}
				
				.cn_title {
					font-family: Bebas Neue Cyrillic;
					font-weight: 400;
					font-size: 30px;
					line-height: 110.00000000000001%;
					color: #ffffff;
					margin-top: 18px;
				}
				
				.cn_text {
					font-family: HelveticaNeueCyr;
					font-weight: 400;
					font-weight: 400;
					font-size: 18px;
					line-height: 140%;
					color: #DFDFDF;
				}
			}
		}
		
		@media (width < 1400px) {
			width: 280px;
			margin: 0 0 46px 0;
		}
	}
	
	&:before {
		content: '';
		background: url(../img/news-fon.svg) no-repeat;
		width: 100%;
		height: 235px;
		position: absolute;
		z-index: -1;
		top: 33%;
	}
}

footer {
	position: relative;
	overflow: hidden;
	-webkit-clip-path: polygon(15% 0px, 85% 0px, 91% 100px, 100% 100px, 100% 100%, 0% 100%, 0% 100px, 9% 100px);
	clip-path: polygon(15% 0px, 85% 0px, 91% 100px, 100% 100px, 100% 100%, 0% 100%, 0% 100px, 9% 100px);
	margin-top: -100px;
	background: #161719;
	
	.container {
		margin-top: 100px;
	}
	
	.wrap {
		@media (width < 1400px) {
			padding: 0px 30px;
		}
	}
	
	h2 {
		margin-top: 60px;
		text-align: center;
		margin-bottom: 36px;
		
		@media (width < 1000px) {
			display: none;
		}
		
		@media (width < 700px) {
			display: block;
		}
	}
	
	.info {
		display: flex;
		flex-direction: column;
		gap: 50px;
	
		.info_wrap {
			display: flex;
			justify-content: space-between;
			
			.logo {
				margin-right: 40px;
				
				img {
					width: 142px;
				}
				
				@media (width < 800px) {
					width: 142px;
					margin-right: 19px;
				}
			}
			
			.ponss {
				display: flex;
				gap: 60px;
				margin: auto;
				
				.pons {
					display: flex;
					flex-direction: column;
					
					a {
						font-family: Bebas Neue Cyrillic;
						font-weight: 400;
						font-size: 40px;
						line-height: 80px;
						color: #FFFFFF;
						text-decoration: none;
						white-space: nowrap;
						margin-left: -12px;
						
						span {
							font-family: Oswald;
							font-weight: 400;
							font-size: 40px;
							line-height: 80px;
							color: #FFFFFF;
							
							@media (width < 1380px) {
								font-size: 30px;
								line-height: 30px;
							}
						}
						
						@media (width < 1380px) {
							font-size: 30px;
							line-height: 30px;
							height: 40px;
						}
					}
					
					span {
						font-family: HelveticaNeueCyr;
						font-weight: 400;
						font-size: 19px;
						line-height: 140%;
						color: #DFDFDF;
						margin-left: 12px;
					}
						
					@media (width < 1380px) {
						margin-bottom: 15px
					}
				}
				
				@media (width < 1380px) {
					gap: 0px;
					flex-direction: column;
				}
				
				@media (width < 800px) {
					margin: 0;
					float: left;
				}
			}
			
			.contact {
				display: flex;
				gap: 36px;
				margin: auto;
				margin-left: 60px;
				flex-direction: column;
				width: 100%;
				
				address, a {
					font-family: HelveticaNeueCyr;
					font-weight: 700;
					font-size: 19px;
					line-height: 140%;
					color: #FFFFFF;
					text-decoration: none;
					display: flex;
					gap: 21px;
					white-space: nowrap;
					font-style: inherit;
					
					svg {
						margin: auto 0;
					}
				
					@media (width < 1380px) {
						font-size: 18px;
					}
				
					@media (width < 900px) {
						white-space: initial;
					}
				}
				
				@media (width < 1380px) {
					max-width: 440px;
				}
				
				@media (width < 900px) {
					gap: 15px;
					margin: 0;
				}
			}
		
			@media (width < 800px) {
				flex-wrap: wrap;
			}
		}
	}
	
	.info-wrap {
		margin-top: 78px;
		margin-bottom: 144px;
		display: flex;
		justify-content: space-between;
		
		.column {
			display: flex;
			
			.copy {
				font-family: HelveticaNeueCyr;
				font-weight: 400;
				font-size: 20px;
				line-height: 140%;
				color: #DFDFDF;
				margin: auto;
				
				a {
					color: #FFFFFF;
				}
				
				@media (width < 1380px) {
					font-size: 18px;
				}
			}
			
			.socials {
				gap: 30px;
				display: flex;
		  
				a {
					width: 64px;
					height: 64px;
					display: block;
					background: #192331;
					-webkit-clip-path: polygon(0% 20%, 20% 0%, 100% 0%, 100% 80%, 80% 100%, 0% 100%);
					clip-path: polygon(0% 20%, 20% 0%, 100% 0%, 100% 80%, 80% 100%, 0% 100%);
					
					.icon_facebook {
						background: url("../img/icon_facebook.svg") no-repeat;
						width: 10px;
						height: 23px;
						display: flex;
						margin: 20px auto;
					}
					
					.icon_instagram {
						background: url("../img/icon_instagram.svg") no-repeat;
						width: 24px;
						height: 24px;
						display: flex;
						margin: 20px auto;
					}
					
					.icon_telegram {
						background: url("../img/icon_telegram.svg") no-repeat;
						width: 24px;
						height: 24px;
						display: flex;
						margin: 20px auto;
					}
				}
			}
			
			&:nth-child(2) {
				@media (width < 800px) {
					margin-top: -107px;
					position: absolute;
					width: calc(101% - 70px);
					justify-content: center;
				}
			}
		}

		@media (width < 900px) {
			margin-bottom: 62px;
			margin-top: 51px;
		}

		@media (width < 800px) {
			margin-top: 158px;
		}

		@media (width < 700px) {
			flex-direction: column;
		}
	}
	
	&:before {
		content: '';
		background: url(../img/grid.png) center;
		width: 100%;
		height: 1200px;
		position: absolute;
		z-index: -1;
		background-size: 100%;
		bottom: 0;
	}
	
	
	
	&:after {
		content: '';
		background: url(../img/mask-f.svg) center;
		width: 100%;
		height: 30px;
		position: absolute;
		z-index: -1;
		margin-top: -38px;
		background-size: 100%;
		background-repeat: no-repeat;
		max-width: 930px;
		right: 0;
				
		@media (width < 900px) {
			background-size: 59%;
			background-position-x: left;
		}
				
		@media (width < 900px) {
			display: none;
		}
	}
	
	@media (width < 1000px) {
		-webkit-clip-path: polygon(75% 0px, 100% 0%, 100% 100%, 0% 100%, 0% 59px, 69% 59px);
		clip-path: polygon(75% 0px, 100% 0%, 100% 100%, 0% 100%, 0% 59px, 69% 59px);
	}
	
	@media (width < 700px) {
		-webkit-clip-path: 0;
		clip-path: 0;
	}
}