* {box-sizing:border-box; margin:0; padding:0; color:#fff; font-family:'Inter', system-ui, sans-serif; outline:none}
html, body {height:100%; width:100%; overflow-x:hidden; scroll-behavior:smooth;}
body {background:#04070D}
body::-webkit-scrollbar {display:none}

header {display:flex; justify-content:center; width:100%; position:sticky; top:0; background: #04070D; z-index:3; border-bottom:1px solid rgba(255, 255, 255, 0.10)}
	header>div {display:flex; align-items:center; justify-content:space-between; height:80px; padding:16px 80px; width:100%; max-width:1440px}
		header>div>a {display:flex; align-items:center;}
		header>div>.menu {display:flex; align-items:center; gap:72px}
			header>div>.menu>a {font-size:14px; text-decoration:none; color:#D4D4D4; transition:color 0.2s}
				header>div>.menu>a:hover {color:#fff}
				header>div>.menu>a.active {color:#8B5CF6}
		header>div>.user {display:flex; align-items:center; gap:12px}
			header>div>.user>.lang {display:flex; align-items:center; gap:8px}
				header>div>.user>.lang>img {height:20px}
				header>div>.user>.lang>span {font-size:14px;}
			header>div>.user>.add-club {display:flex; font-weight:500; align-items:center; justify-content:center; text-decoration:none; width:110px; height:40px; border-radius:6px; color:#fff; border:1px solid #A78BFA; background:#8B5CF6; font-size:14px;}
			header>div>.user>.login {display:flex; font-weight:500; align-items:center; justify-content:center; text-decoration:none; width:110px; height:40px; border-radius:6px; color:#171717; border:1px solid #E5E5E5; background:#FFF; font-size:14px;}
			
main {display:flex; justify-content:center; width:100%}
	main>div {display:flex; flex-direction:column; align-items:center; justify-content:space-between; padding:16px 80px; width:100%; max-width:1440px}
		
		main>div>.slide {width:100%; display:flex; flex-direction:column; padding:236px 0 60px 0}
			main>div>.slide>.top {display:flex;}
				main>div>.slide>.top>.left {flex-grow:1; display:flex; justify-content:center}
					main>div>.slide>.top>.left>img {height:150px; width:150px; transform:rotate(-32.746deg);}
				main>div>.slide>.top>.center {width:746px; padding-top:20px; display:flex; flex-direction:column; align-items:center}
					main>div>.slide>.top>.center>.logo {display:flex; align-items:center; gap:8px; border-radius:6px; padding:6px; border:1px solid #353E56; background:#111726;}
						main>div>.slide>.top>.center>.logo>img {height:20px; width:20px}
						main>div>.slide>.top>.center>.logo>span {font-size:14px;}
					main>div>.slide>.top>.center>h1 {font-size:60px; margin-top:24px; text-align:center; font-weight:600; line-height:56px; letter-spacing:-1.2px;}
						main>div>.slide>.top>.center>h1>span {color:#8B5CF6}
					main>div>.slide>.top>.center>.slogan {width:500px; margin:32px 0; text-align:center; color:#737373; font-size:14px; font-weight:400; line-height:20px;}
					main>div>.slide>.top>.center>.welc {display:flex; align-items:center; gap:16px;}
						main>div>.slide>.top>.center>.welc>a {display:flex; align-items:center; justify-content:center; text-decoration:none; font-weight:500; border-radius:6px; border:1px solid #E5E5E5; background:#FFF; font-size:16px; color:#171717; gap:8px; height:48px; padding:0 16px}
							main>div>.slide>.top>.center>.welc>a>img {transition:transform 0.2s ease}
						main>div>.slide>.top>.center>.welc>a:hover img {transform:translateX(4px)}
						main>div>.slide>.top>.center>.welc>.avas {display:flex; padding-left:12px}
							main>div>.slide>.top>.center>.welc>.avas>.ava {height:48px; width:48px; border-radius:40px; margin-left:-12px}
								main>div>.slide>.top>.center>.welc>.avas>.ava>img {height:100%; width:100%; object-fit:cover}
						main>div>.slide>.top>.center>.welc>.avas-count {font-size:16px; font-weight:600;}
				main>div>.slide>.top>.right {flex-grow:1; display:flex; justify-content:center}
					main>div>.slide>.top>.right>img {height:150px; width:150px; transform:rotate(-32.746deg);}
			main>div>.slide>.btm {display:flex; align-items:center; justify-content:space-between; height:48px; margin-top:202px;}
				main>div>.slide>.btm>.line {width:1px; height:28px; opacity:0.5; background:linear-gradient(90deg, #FFF 25%, #FFF 100%);}
				main>div>.slide>.btm>.item {display:flex; align-items:center; gap:8px}
					main>div>.slide>.btm>.item>.count {color:#FFF; font-size:44px; font-weight:600; letter-spacing:-1px;}
					main>div>.slide>.btm>.item>.text {font-size:20px; font-weight:600;background:linear-gradient(135deg, #04070D 0%, #FFF 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}
					
		main>div>.clubs {width:100%; display:flex; flex-direction:column; padding:122px 0 0 0}
			main>div>.clubs>.top {display:flex; flex-direction:column; align-items:center; gap:14px}
				main>div>.clubs>.top>.logo {display:flex; align-items:center; gap:8px; border-radius:6px; padding:6px; border:1px solid #353E56; background:#111726}
					main>div>.clubs>.top>.logo>img {height:20px; width:20px}
					main>div>.clubs>.top>.logo>span {font-size:14px}
				main>div>.clubs>.top>h2 {font-size:40px; letter-spacing:-1px; margin-bottom:14px; font-weight:500}
				main>div>.clubs>.top>.text {color:#737373; font-size:14px}
			main>div>.clubs>.mid {display:flex; flex-wrap:wrap; justify-content:center; gap:20px; margin-top:40px}
				main>div>.clubs>.mid>a {text-decoration:none;}
					main>div>.clubs>.mid>a>.club {position:relative; cursor:pointer; display:flex; height:305px; border-radius:16px; overflow:hidden; width:305px; background:#1d1d1d; transition:transform 0.3s ease, box-shadow 0.3s ease}
					main>div>.clubs>.mid>a>.club:hover {transform:translateY(-8px) scale(1.03); box-shadow:0 15px 25px rgba(0, 0, 0, 0.5)}
						main>div>.clubs>.mid>a>.club>.logo {position:absolute; top:0; left:0; height:100%; width:100%}
							main>div>.clubs>.mid>a>.club>.logo>img {height:100%; width:100%; object-fit:cover; transition:transform 0.5s ease}
							main>div>.clubs>.mid>a>.club:hover>.logo>img {transform:scale(1.1)}
						main>div>.clubs>.mid>a>.club>.data {display:flex; flex-direction:column; gap:12px; margin-top:auto; padding:20px; width:100%; z-index:2; transition:transform 0.3s ease}
						main>div>.clubs>.mid>a>.club:hover>.data {transform:translateY(-4px)}
							main>div>.clubs>.mid>a>.club>.data>.top {display:flex; align-items:center}
								main>div>.clubs>.mid>a>.club>.data>.top>h3 {font-size:20px; font-weight:500}
								main>div>.clubs>.mid>a>.club>.data>.top>.reyt {display:flex; margin-left:auto; align-items:center; gap:4px; color:#F59E0B; font-size:14px; font-weight:500}
						main>div>.clubs>.mid>a>.club>.mask {position:absolute; top:0; left:0; height:100%; width:100%; background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(4, 7, 13, 0.6) 100%); transition:background 0.4s ease}
						main>div>.clubs>.mid>a>.club:hover>.mask {background:linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(4, 7, 13, 0.8) 100%)}
			main>div>.clubs>.btm {display:flex; justify-content:center; margin-top:40px}
				main>div>.clubs>.btm>a {display:flex; align-items:center; justify-content:center; text-decoration:none; font-weight:500; border-radius:6px; border:1px solid #E5E5E5; background:#FFF; font-size:16px; color:#171717; gap:8px; height:40px; padding:0 16px}
				main>div>.clubs>.btm>a:hover>img {transform:translateX(4px)}
					main>div>.clubs>.btm>a>img {transition:transform 0.2s ease}
				
		main>div>.app {width:100%; display:flex; flex-direction:column; margin-top:238px}			
			main>div>.app>.top {display:flex; flex-direction:column; align-items:center; gap:14px}
				main>div>.app>.top>.logo {display:flex; align-items:center; gap:8px; border-radius:6px; padding:6px; border:1px solid #353E56; background:#111726;}
					main>div>.app>.top>.logo>img {height:20px; width:20px}
					main>div>.app>.top>.logo>span {font-size:14px;}
				main>div>.app>.top>h2 {font-size:40px; letter-spacing:-1px; margin-bottom:14px; font-weight:500;}
			main>div>.app>.btm {margin-top:40px; display:flex; align-items:center; justify-content:space-between}
				main>div>.app>.btm>.left {display:flex; flex-direction:column; align-items:center; gap:20px; width:440px}
					main>div>.app>.btm>.left>h3 {font-size:32px; font-weight:500; line-height:40px; margin-bottom:8px;}
					main>div>.app>.btm>.left>div {display:flex; align-items:center; padding:20px; gap:12px; border-radius:16px; border-top:2px solid rgba(255, 255, 255, 0.10); border-right:1px solid rgba(255, 255, 255, 0.10); border-left:1px solid rgba(255, 255, 255, 0.10); background:linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(7, 8, 10, 0.00) 81.48%);}
						main>div>.app>.btm>.left>div>img {height:40px; width:40px}
						main>div>.app>.btm>.left>div>span {font-size:14px; color:#D4D4D4; line-height:20px;}
					main>div>.app>.btm>.left>a {display:flex; align-items:center; margin-top:8px; justify-content:center; text-decoration:none; font-weight:500; border-radius:6px; border:1px solid #E5E5E5; background:#FFF; font-size:16px; color:#171717; gap:8px; height:40px; padding:0 16px}
					main>div>.app>.btm>.left>a:hover>img {transform:translateX(4px)}
						main>div>.app>.btm>.left>a>img {transition:transform 0.2s ease}
				main>div>.app>.btm>.center {}
					main>div>.app>.btm>.center>div {border:2px solid #a4a4a4; border-radius:34px; overflow:hidden;}
				main>div>.app>.btm>.right {display:flex; flex-direction:column; align-items:center; gap:20px; width:440px}
					main>div>.app>.btm>.right>h3 {font-size:32px; font-weight:500; line-height:40px; margin-bottom:8px;}
					main>div>.app>.btm>.right>div {display:flex; align-items:center; padding:20px; gap:12px; border-radius:16px; border-top:2px solid rgba(255, 255, 255, 0.10); border-right:1px solid rgba(255, 255, 255, 0.10); border-left:1px solid rgba(255, 255, 255, 0.10); background:linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(7, 8, 10, 0.00) 81.48%);}
						main>div>.app>.btm>.right>div>img {height:40px; width:40px}
						main>div>.app>.btm>.right>div>span {font-size:14px; color:#D4D4D4; line-height:20px;}
					main>div>.app>.btm>.right>a {display:flex; align-items:center; margin-top:8px; justify-content:center; text-decoration:none; font-weight:500; border-radius:6px; border:1px solid #E5E5E5; background:#FFF; font-size:16px; color:#171717; gap:8px; height:40px; padding:0 16px}
					main>div>.app>.btm>.right>a:hover>img {transform:translateX(4px)}
						main>div>.app>.btm>.right>a>img {transition:transform 0.2s ease}
						
		main>div>.rooms {width:100%; display:flex; flex-direction:column; margin-top:232px}
			main>div>.rooms>.top {display:flex; flex-direction:column; align-items:center; gap:14px}
				main>div>.rooms>.top>.logo {display:flex; align-items:center; gap:8px; border-radius:6px; padding:6px; border:1px solid #353E56; background:#111726}
					main>div>.rooms>.top>.logo>img {height:20px; width:20px}
					main>div>.rooms>.top>.logo>span {font-size:14px}
				main>div>.rooms>.top>h2 {font-size:40px; letter-spacing:-1px; margin-bottom:14px; font-weight:500}
				main>div>.rooms>.top>.text {color:#737373; font-size:14px}
			main>div>.rooms>.mid {display:flex; flex-wrap:wrap; justify-content:center; gap:20px; margin-top:40px}
				main>div>.rooms>.mid>a {text-decoration:none;}
					main>div>.rooms>.mid>a>.room {position:relative; display:flex; height:305px; width:305px; border-radius:16px; overflow:hidden; background:#1d1d1d; cursor:pointer; transition:transform 0.3s ease, box-shadow 0.3s ease}
					main>div>.rooms>.mid>a>.room:hover {transform:translateY(-8px) scale(1.03); box-shadow:0 15px 25px rgba(0, 0, 0, 0.5)}
						main>div>.rooms>.mid>a>.room>.logo {position:absolute; top:0; left:0; height:100%; width:100%}
							main>div>.rooms>.mid>a>.room>.logo>img {height:100%; width:100%; object-fit:cover; transition:transform 0.5s ease}
							main>div>.rooms>.mid>a>.room:hover>.logo>img {transform:scale(1.1)}
						main>div>.rooms>.mid>a>.room>.data {display:flex; flex-direction:column; gap:12px; margin-top:auto; padding:20px; width:100%; z-index:2; transition:transform 0.3s ease}
						main>div>.rooms>.mid>a>.room:hover>.data {transform:translateY(-4px)}
							main>div>.rooms>.mid>a>.room>.data>.top {display:flex; align-items:center}
								main>div>.rooms>.mid>a>.room>.data>.top>h3 {font-size:20px; font-weight:500}
								main>div>.rooms>.mid>a>.room>.data>.top>.reyt {display:flex; margin-left:auto; align-items:center; gap:4px; color:#F59E0B; font-size:14px; font-weight:500}
						main>div>.rooms>.mid>a>.room>.mask {position:absolute; top:0; left:0; height:100%; width:100%; background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(4, 7, 13, 0.6) 100%); transition:background 0.4s ease}
						main>div>.rooms>.mid>a>.room:hover>.mask {background:linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(4, 7, 13, 0.8) 100%)}
			main>div>.rooms>.btm {display:flex; justify-content:center; margin-top:40px}
				main>div>.rooms>.btm>a {display:flex; align-items:center; justify-content:center; text-decoration:none; font-weight:500; border-radius:6px; border:1px solid #E5E5E5; background:#FFF; font-size:16px; color:#171717; gap:8px; height:40px; padding:0 16px}
				main>div>.rooms>.btm>a:hover>img {transform:translateX(4px)}
					main>div>.rooms>.btm>a>img {transition:transform 0.2s ease}
				
		main>div>.feedbacks {width:100%; display:flex; flex-direction:column; margin-top:232px}
			main>div>.feedbacks>.top {display:flex; flex-direction:column; align-items:center; gap:14px;}
				main>div>.feedbacks>.top>.logo {display:flex; align-items:center; gap:8px; border-radius:6px; padding:6px; border:1px solid #353E56; background:#111726;}
					main>div>.feedbacks>.top>.logo>img {height:20px; width:20px}
					main>div>.feedbacks>.top>.logo>span {font-size:14px;}
				main>div>.feedbacks>.top>h2 {font-size:40px; text-align:center; letter-spacing:-1px; font-weight:500;}
			main>div>.feedbacks>.mid {position:relative; display:flex; flex-direction:column; gap:20px; margin:40px 0;}
				main>div>.feedbacks>.mid>.mask {position:absolute; pointer-events:none; top:0; left:0; height:100%; width:100%; background: linear-gradient(to right, #04070ded 0px, #04070d57 224px, rgb(0 0 0 / 20%) 448px, rgb(4 7 13 / 20%) calc(100% - 448px), #04070d24 calc(100% - 224px), #04070df0 100%);}
				main>div>.feedbacks>.mid>.lines {position:relative; display:flex; justify-content:center; gap:20px; width:100%; overflow:hidden}
					main>div>.feedbacks>.mid>.lines a {text-decoration:none;}
					main>div>.feedbacks>.mid>.lines .inner {display:flex; gap:20px; will-change:transform}
					main>div>.feedbacks>.mid>.lines .feedback {padding:30px; flex-shrink:0; width:482px; border-radius:20px; border-top:2px solid rgba(255, 255, 255, 0.10); border-right:1px solid rgba(255, 255, 255, 0.10); background:linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(7, 8, 10, 0.00) 81.48%); border-left:1px solid rgba(255, 255, 255, 0.10); display:flex; flex-direction:column; gap:24px}
						main>div>.feedbacks>.mid>.lines .feedback>.text {font-size:18px; font-weight:400; line-height:28px; color:#D4D4D4}
						main>div>.feedbacks>.mid>.lines .feedback>.who {display:flex; gap:18px}
							main>div>.feedbacks>.mid>.lines .feedback>.who>.ava {height:48px; width:48px; border-radius:80px; overflow:hidden}
								main>div>.feedbacks>.mid>.lines .feedback>.who>.ava>img {height:100%; width:100%; object-fit:cover}
							main>div>.feedbacks>.mid>.lines .feedback>.who>.data {display:flex; flex-direction:column}
								main>div>.feedbacks>.mid>.lines .feedback>.who>.data>.name {font-size:18px; font-weight:400; line-height:28px; color:#fff}
								main>div>.feedbacks>.mid>.lines .feedback>.who>.data>.status {font-size:12px; font-weight:400; opacity:0.4; line-height:20px; color:#D4D4D4}
			main>div>.feedbacks>.btm {display:flex; align-items:center; justify-content:center;}
				main>div>.feedbacks>.btm>.ava {height:48px; width:48px; border-radius:80px; overflow:hidden; margin-left:-12px}
					main>div>.feedbacks>.btm>.ava>img {height:100%; width:100%; object-fit:cover}
				main>div>.feedbacks>.btm>span {margin-left:8px; font-size:16px; font-weight:400; color:#A3A3A3}
					main>div>.feedbacks>.btm>span>span {color:#fff}
					
		main>div>.news {width:100%; display:flex; flex-direction:column; margin-top:210px}
			main>div>.news>.top {display:flex; flex-direction:column; align-items:center; gap:14px;}
				main>div>.news>.top>.logo {display:flex; align-items:center; gap:8px; border-radius:6px; padding:6px; border:1px solid #353E56; background:#111726;}
					main>div>.news>.top>.logo>img {height:20px; width:20px}
					main>div>.news>.top>.logo>span {font-size:14px;}
				main>div>.news>.top>h2 {font-size:40px; text-align:center; letter-spacing:-1px; font-weight:500;}
			main>div>.news>.btm {display:flex; gap:20px; margin-top:40px}
				main>div>.news>.btm>a {text-decoration:none; width:calc(100% - 650px)}
					main>div>.news>.btm .left {display:flex; cursor:pointer; width:100%; flex-direction:column; transition:transform 0.3s ease, box-shadow 0.3s ease}
					main>div>.news>.btm .left:hover {transform:translateY(-8px) scale(1.03); box-shadow:0 15px 25px rgba(0, 0, 0, 0.5)}
						main>div>.news>.btm .left>.img {position:relative; height:384px; width:100%; margin-bottom:24px; border-radius:16px; overflow:hidden}
							main>div>.news>.btm .left>.img>img {height:100%; width:100%; object-fit:cover; transition:transform 0.5s ease}
							main>div>.news>.btm .left:hover>.img>img {transform:scale(1.1)}
							main>div>.news>.btm .left>.img>.mask {position:absolute; top:0; left:0; height:100%; width:100%; background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(4, 7, 13, 0.6) 100%); transition:background 0.4s ease}
							main>div>.news>.btm .left:hover>.img>.mask {background:linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(4, 7, 13, 0.8) 100%)}
						main>div>.news>.btm .left>.date {color:#8B5CF6; font-size:14px; font-weight:400;}
						main>div>.news>.btm .left>.title {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:24px; font-weight:500; line-height:32px; color:#fff; margin:12px 0}
						main>div>.news>.btm .left>.description {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; font-weight:400; line-height:20px; color:#737373;}
				main>div>.news>.btm>.right {display:flex; flex-direction:column; gap:24px}
					main>div>.news>.btm>.right>a {text-decoration:none}
						main>div>.news>.btm>.right article {cursor:pointer; display:flex; width:630px; gap:24px; transition:transform 0.3s ease, box-shadow 0.3s ease}
						main>div>.news>.btm>.right article:hover {transform:translateY(-8px) scale(1.03); box-shadow:0 15px 25px rgba(0, 0, 0, 0.5)}
							main>div>.news>.btm>.right article>.img {position:relative; height:152px; width:208px; border-radius:16px; overflow:hidden}
								main>div>.news>.btm>.right article>.img>img {height:100%; width:100%; object-fit:cover; transition:transform 0.5s ease}
								main>div>.news>.btm>.right article:hover>.img>img {transform:scale(1.1)}
								main>div>.news>.btm>.right article>.img>.mask {position:absolute; top:0; left:0; height:100%; width:100%; background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(4, 7, 13, 0.6) 100%); transition:background 0.4s ease}
								main>div>.news>.btm>.right article:hover>.img>.mask {background:linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(4, 7, 13, 0.8) 100%)}
							main>div>.news>.btm>.right article>.data {display:flex; flex-direction:column}
								main>div>.news>.btm>.right article>.data>.date {color:#8B5CF6; font-size:14px; font-weight:400;}
								main>div>.news>.btm>.right article>.data>.title {font-size:24px; width:364px; font-weight:500; line-height:32px; color:#fff; margin:12px 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;}
								main>div>.news>.btm>.right article>.data>.description {font-size:14px; width:364px; font-weight:400; line-height:20px; color:#737373; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;}
				
footer {margin-top:244px; display:flex; justify-content:center; width:100%; padding-bottom:60px}
	footer>div {display:flex; padding:0 80px; gap:166px; flex-direction:column; align-items:center; justify-content:space-between; width:100%; max-width:1440px}
		footer>div>.top {display:flex; justify-content:space-between; width:100%;}
			footer>div>.top>.left {display:flex; flex-direction:column}
				footer>div>.top>.left>img {height:90px; width:304px}
				footer>div>.top>.left>span {font-size:14px; font-weight:400; color:#fff; margin:24px 0 32px 0}
				footer>div>.top>.left>.soc {display:flex; gap:24px}
					footer>div>.top>.left>.soc>a {font-size:14px; font-weight:400; color:#fff; text-decoration:none; transition:color 0.2s}
					footer>div>.top>.left>.soc>a:hover {color:#8B5CF6}
			footer>div>.top>.right {display:flex; gap:84px; padding-top:14px}
				footer>div>.top>.right>div {display:flex; flex-direction:column; gap:10px}
					footer>div>.top>.right>div>a {font-size:14px; font-weight:400; text-decoration:none; transition:color 0.2s}
					footer>div>.top>.right>div>a:hover {color:#8B5CF6}
		footer>div>.btm {display:flex; flex-direction:column; gap:32px}
			footer>div>.btm>.top {display:flex}
				footer>div>.btm>.top>.left {font-size:12px; color:#fff; font-weight:400}
				footer>div>.btm>.top>.right {display:flex; margin-left:auto; gap:32px}
					footer>div>.btm>.top>.right>a {font-size:12px; font-weight:400; color:#fff; text-decoration:none; transition:color 0.2s}
					footer>div>.btm>.top>.right>a:hover {color:#8B5CF6}
			footer>div>.btm>.btm {color:#737373; font-size:12px; font-weight:400}
				footer>div>.btm>.btm>span {color:#fff}

/*no mobile*/
.mobileMenu {display:none}
/*mobile*/
@media (min-width:160px) and (max-width:820px) {
	header>div {padding:16px;}
		header>div>a>img {height:40px}

		/*меню*/
		header>div>.menu {display:none; position:fixed; border-top:1px solid #ffffff1a; flex-direction:column; align-items:unset; padding:20px 24px; gap:24px; top:80px; left:0; width:100%; height:calc(100% - 80px); background:#191c24;}
		header>div>.user {display:none; position:fixed; left:24px; top:340px; align-items:unset}
			header>div>.user>.lang {display:none}
		
		.mobileMenu {height:40px; width:40px; border-radius:4px; border:1px solid #FFF; display:flex; align-items:center; justify-content:center; cursor:pointer}

	main>div {padding:16px}
		main>div>.slide {padding:60px 0}
			main>div>.slide>.top>.left {display:none}
			main>div>.slide>.top>.right {display:none}
			main>div>.slide>.top>.center {width:100%; padding-top:0}
				main>div>.slide>.top>.center>h1 {font-size:40px}
				main>div>.slide>.top>.center>.slogan {width:100%}
				main>div>.slide>.top>.center>.welc {flex-direction:column}
			main>div>.slide>.btm {flex-direction:column; gap:20px; height:auto; margin-top:80px;}
			main>div>.slide>.btm>.line {display:none}
			main>div>.slide>.btm>.item {width:100%; padding-left:20px;}
				main>div>.slide>.btm>.item>.count {width:130px}
		
		main>div>.clubs {padding-top:20px}
			main>div>.clubs>.top>h2 {font-size:30px; text-align:center;}
				main>div>.clubs>.top>.text {width:100%; text-align:center;}
			main>div>.clubs>.mid {width:100%; gap:20px}
				main>div>.clubs>.mid>a {width:100%;}
					main>div>.clubs>.mid>a>.club {width:100%;}
		
		main>div>.app {margin-top:80px}			
				main>div>.app>.top>h2 {font-size:30px; text-align:center;}
			main>div>.app>.btm {flex-direction:column; gap:40px;}
				main>div>.app>.btm>.left {gap:20px; width:100%}
					main>div>.app>.btm>.left>h3 {display:none;}
				main>div>.app>.btm>.right {gap:20px; width:100%}
					main>div>.app>.btm>.right>h3 {display:none;}
		
		main>div>.rooms {margin-top:80px}
				main>div>.rooms>.top>h2 {font-size:30px; text-align:center;}
				main>div>.rooms>.top>.text {width:100%; text-align:center;}
			main>div>.rooms>.mid {width:100%}
				main>div>.rooms>.mid>a {width:100%}
					main>div>.rooms>.mid>a>.room {width:100%}

		main>div>.feedbacks {margin-top:80px}
			main>div>.feedbacks>.top>h2 {font-size:30px; text-align:center;}
			main>div>.feedbacks>.mid {position:relative; display:flex; flex-direction:column; gap:20px; margin:40px 0;}
				main>div>.feedbacks>.mid>.mask {display:none}
			main>div>.feedbacks>.btm>.ava {display:none}
			main>div>.feedbacks>.btm>span>span {width:100%; text-align:center;}

		main>div>.news {margin-top:80px}
			main>div>.news>.top>h2 {font-size:30px; text-align:center;}
			main>div>.news>.btm {flex-direction:column; gap:40px;}
				main>div>.news>.btm>a {width:100%}
				main>div>.news>.btm>.right {gap:40px;}
				main>div>.news>.btm>.right article {width:100%; flex-direction:column;}
					main>div>.news>.btm>.right article>.img {width:100%;}

	footer {margin-top:160px}
		footer>div {padding:0 16px; gap:40px; width:100%}
			footer>div>.top {flex-direction:column}
				footer>div>.top>.left {display:flex; flex-direction:column}
				footer>div>.top>.right {display:none}
}