@charset "UTF-8";

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../media/78187650dd6b50b3-s.woff2) format("woff2");
	unicode-range: U+0460-052f,
		U+1c80-1c88,
		U+20b4,
		U+2de0-2dff,
		U+a640-a69f,
		U+fe2e-fe2f
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../media/4529092560591ab4-s.woff2) format("woff2");
	unicode-range: U+0301,
		U+0400-045f,
		U+0490-0491,
		U+04b0-04b1,
		U+2116
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../media/b8222d26e20b2e06-s.woff2) format("woff2");
	unicode-range: U+0370-03ff
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../media/008f2e8b4aae291f-s.woff2) format("woff2");
	unicode-range: U+0102-0103,
		U+0110-0111,
		U+0128-0129,
		U+0168-0169,
		U+01a0-01a1,
		U+01af-01b0,
		U+0300-0301,
		U+0303-0304,
		U+0308-0309,
		U+0323,
		U+0329,
		U+1ea0-1ef9,
		U+20ab
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../media/3c46462b57ac880e-s.woff2) format("woff2");
	unicode-range: U+0100-02af,
		U+0304,
		U+0308,
		U+0329,
		U+1e00-1e9f,
		U+1ef2-1eff,
		U+2020,
		U+20a0-20ab,
		U+20ad-20cf,
		U+2113,
		U+2c60-2c7f,
		U+a720-a7ff
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../media/3534416bbfdcc9be-s.p.woff2) format("woff2");
	unicode-range: U+00??,
		U+0131,
		U+0152-0153,
		U+02bb-02bc,
		U+02c6,
		U+02da,
		U+02dc,
		U+0304,
		U+0308,
		U+0329,
		U+2000-206f,
		U+2074,
		U+20ac,
		U+2122,
		U+2191,
		U+2193,
		U+2212,
		U+2215,
		U+feff,
		U+fffd
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url(../media/78187650dd6b50b3-s.woff2) format("woff2");
	unicode-range: U+0460-052f,
		U+1c80-1c88,
		U+20b4,
		U+2de0-2dff,
		U+a640-a69f,
		U+fe2e-fe2f
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url(../media/4529092560591ab4-s.woff2) format("woff2");
	unicode-range: U+0301,
		U+0400-045f,
		U+0490-0491,
		U+04b0-04b1,
		U+2116
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url(../media/b8222d26e20b2e06-s.woff2) format("woff2");
	unicode-range: U+0370-03ff
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url(../media/008f2e8b4aae291f-s.woff2) format("woff2");
	unicode-range: U+0102-0103,
		U+0110-0111,
		U+0128-0129,
		U+0168-0169,
		U+01a0-01a1,
		U+01af-01b0,
		U+0300-0301,
		U+0303-0304,
		U+0308-0309,
		U+0323,
		U+0329,
		U+1ea0-1ef9,
		U+20ab
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url(../media/3c46462b57ac880e-s.woff2) format("woff2");
	unicode-range: U+0100-02af,
		U+0304,
		U+0308,
		U+0329,
		U+1e00-1e9f,
		U+1ef2-1eff,
		U+2020,
		U+20a0-20ab,
		U+20ad-20cf,
		U+2113,
		U+2c60-2c7f,
		U+a720-a7ff
}

@font-face {
	font-family: __Manrope_9e0490;
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url(../media/3534416bbfdcc9be-s.p.woff2) format("woff2");
	unicode-range: U+00??,
		U+0131,
		U+0152-0153,
		U+02bb-02bc,
		U+02c6,
		U+02da,
		U+02dc,
		U+0304,
		U+0308,
		U+0329,
		U+2000-206f,
		U+2074,
		U+20ac,
		U+2122,
		U+2191,
		U+2193,
		U+2212,
		U+2215,
		U+feff,
		U+fffd
}card__time-full

@font-face {
	font-family: __Manrope_Fallback_9e0490;
	src: local("Arial");
	ascent-override: 102.96%;
	descent-override: 28.98%;
	line-gap-override: 0.00%;
	size-adjust: 103.53%
}

.` {
	font-family: __Manrope_9e0490, __Manrope_Fallback_9e0490;
	font-style: normal
}

/*
! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com
*/
*,
:after,
:before {
	box-sizing: border-box;
	border: 0 solid #e5e7eb
}

:after,
:before {
	--tw-content: ""
}

html {
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
	font-feature-settings: normal;
	font-variation-settings: normal
}

body {
	margin: 0;
	line-height: inherit
}

hr {
	height: 0;
	color: inherit;
	border-top-width: 1px
}

abbr:where([title]) {
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: inherit;
	font-weight: inherit
}

a {
	color: inherit;
	text-decoration: inherit
}

b,
strong {
	font-weight: bolder
}

code,
kbd,
pre,
samp {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
	font-size: 1em
}

small {
	font-size: 80%
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sub {
	bottom: -.25em
}

sup {
	top: -.5em
}

table {
	text-indent: 0;
	border-color: inherit;
	border-collapse: collapse
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-feature-settings: inherit;
	font-variation-settings: inherit;
	font-size: 100%;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
	margin: 0;
	padding: 0
}

button,
select {
	text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
	-webkit-appearance: button;
	background-color: transparent;
	background-image: none
}

:-moz-focusring {
	outline: auto
}

:-moz-ui-invalid {
	box-shadow: none
}

progress {
	vertical-align: baseline
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
	height: auto
}

[type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px
}

::-webkit-search-decoration {
	-webkit-appearance: none
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit
}

summary {
	display: list-item
}

blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
	margin: 0
}

fieldset {
	margin: 0
}

fieldset,
legend {
	padding: 0
}

menu,
ol,
ul {
	list-style: none;
	margin: 0;
	padding: 0
}

dialog {
	padding: 0
}

textarea {
	resize: vertical
}

input::-moz-placeholder,
textarea::-moz-placeholder {
	opacity: 1;
	color: #9ca3af
}

input::placeholder,
textarea::placeholder {
	opacity: 1;
	color: #9ca3af
}

[role=button],
button {
	cursor: pointer
}

:disabled {
	cursor: default
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
	display: block;
	vertical-align: middle
}

img,
video {
	max-width: 100%;
	height: auto
}

[hidden] {
	display: none
}

*,
:after,
:before {
	--tw-border-spacing-x: 0;
	--tw-border-spacing-y: 0;
	--tw-translate-x: 0;
	--tw-translate-y: 0;
	--tw-rotate: 0;
	--tw-skew-x: 0;
	--tw-skew-y: 0;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
	--tw-pan-x: ;
	--tw-pan-y: ;
	--tw-pinch-zoom: ;
	--tw-scroll-snap-strictness: proximity;
	--tw-gradient-from-position: ;
	--tw-gradient-via-position: ;
	--tw-gradient-to-position: ;
	--tw-ordinal: ;
	--tw-slashed-zero: ;
	--tw-numeric-figure: ;
	--tw-numeric-spacing: ;
	--tw-numeric-fraction: ;
	--tw-ring-inset: ;
	--tw-ring-offset-width: 0px;
	--tw-ring-offset-color: #fff;
	--tw-ring-color: rgba(59, 130, 246, .5);
	--tw-ring-offset-shadow: 0 0 #0000;
	--tw-ring-shadow: 0 0 #0000;
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	--tw-blur: ;
	--tw-brightness: ;
	--tw-contrast: ;
	--tw-grayscale: ;
	--tw-hue-rotate: ;
	--tw-invert: ;
	--tw-saturate: ;
	--tw-sepia: ;
	--tw-drop-shadow: ;
	--tw-backdrop-blur: ;
	--tw-backdrop-brightness: ;
	--tw-backdrop-contrast: ;
	--tw-backdrop-grayscale: ;
	--tw-backdrop-hue-rotate: ;
	--tw-backdrop-invert: ;
	--tw-backdrop-opacity: ;
	--tw-backdrop-saturate: ;
	--tw-backdrop-sepia:
}

::backdrop {
	--tw-border-spacing-x: 0;
	--tw-border-spacing-y: 0;
	--tw-translate-x: 0;
	--tw-translate-y: 0;
	--tw-rotate: 0;
	--tw-skew-x: 0;
	--tw-skew-y: 0;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
	--tw-pan-x: ;
	--tw-pan-y: ;
	--tw-pinch-zoom: ;
	--tw-scroll-snap-strictness: proximity;
	--tw-gradient-from-position: ;
	--tw-gradient-via-position: ;
	--tw-gradient-to-position: ;
	--tw-ordinal: ;
	--tw-slashed-zero: ;
	--tw-numeric-figure: ;
	--tw-numeric-spacing: ;
	--tw-numeric-fraction: ;
	--tw-ring-inset: ;
	--tw-ring-offset-width: 0px;
	--tw-ring-offset-color: #fff;
	--tw-ring-color: rgba(59, 130, 246, .5);
	--tw-ring-offset-shadow: 0 0 #0000;
	--tw-ring-shadow: 0 0 #0000;
	--tw-shadow: 0 0 #0000;
	--tw-shadow-colored: 0 0 #0000;
	--tw-blur: ;
	--tw-brightness: ;
	--tw-contrast: ;
	--tw-grayscale: ;
	--tw-hue-rotate: ;
	--tw-invert: ;
	--tw-saturate: ;
	--tw-sepia: ;
	--tw-drop-shadow: ;
	--tw-backdrop-blur: ;
	--tw-backdrop-brightness: ;
	--tw-backdrop-contrast: ;
	--tw-backdrop-grayscale: ;
	--tw-backdrop-hue-rotate: ;
	--tw-backdrop-invert: ;
	--tw-backdrop-opacity: ;
	--tw-backdrop-saturate: ;
	--tw-backdrop-sepia:
}

.fixed {
	position: fixed
}

.absolute {
	position: absolute
}

.relative {
	position: relative
}

.right-0 {
	right: 0
}

.top-0 {
	top: 0
}

.z-\[960\] {
	z-index: 960
}

.order-1 {
	order: 1
}

.mx-auto {
	margin-left: auto;
	margin-right: auto
}

.mb-2 {
	margin-bottom: .5rem
}

.mb-4 {
	margin-bottom: 1rem
}

.ml-auto {
	margin-left: auto
}

.inline {
	display: inline
}

.flex {
	display: flex
}

.hidden {
	display: none
}

.h-14 {
	height: 3.5rem
}

.h-5 {
	height: 1.25rem
}

.h-\[42px\] {
	height: 42px
}

.h-\[600px\] {
	height: 600px
}

.h-full {
	height: 100%
}

.h-screen {
	height: 100vh
}

.w-14 {
	width: 3.5rem
}

.w-5 {
	width: 1.25rem
}

.w-60 {
	width: 15rem
}

.w-\[125px\] {
	width: 125px
}

.w-full {
	width: 100%
}

.w-screen {
	width: 100vw
}

.min-w-\[240px\] {
	min-width: 240px
}

.max-w-\[424px\] {
	max-width: 424px
}

.max-w-container {
	max-width: 1232px
}

.grow {
	flex-grow: 1
}

.transform {
	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes spin {
	to {
		transform: rotate(1turn)
	}
}

.animate-spin {
	animation: spin 1s linear infinite
}

.grid-cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr))
}

.flex-col {
	flex-direction: column
}

.flex-wrap {
	flex-wrap: wrap
}

.items-start {
	align-items: flex-start
}

.items-center {
	align-items: center
}

.items-baseline {
	align-items: baseline
}

.justify-center {
	justify-content: center
}

.justify-between {
	justify-content: space-between
}

.gap-1 {
	gap: .25rem
}

.gap-10 {
	gap: 2.5rem
}

.gap-2 {
	gap: .5rem
}

.gap-2\.5 {
	gap: .625rem
}

.gap-4 {
	gap: 1rem
}

.gap-6 {
	gap: 1.5rem
}

.gap-8 {
	gap: 2rem
}

.overflow-hidden {
	overflow: hidden
}

.rounded-lg {
	border-radius: .5rem
}

.rounded-xl {
	border-radius: .75rem
}

.border {
	border-width: 1px
}

.border-t {
	border-top-width: 1px
}

.border-solid {
	border-style: solid
}

.border-white\/10 {
	border-color: hsla(0, 0%, 100%, .1)
}

.bg-neutrals-1 {
	--tw-bg-opacity: 1;
	background-color: rgb(16 16 19/var(--tw-bg-opacity))
}

.bg-neutrals-2\/90 {
	background-color: rgba(26, 26, 30, .9)
}

.bg-neutrals-3\/50 {
	background-color: rgba(33, 33, 38, .5)
}

.fill-transparent {
	fill: transparent
}

.object-cover {
	-o-object-fit: cover;
	object-fit: cover
}

.object-top {
	-o-object-position: top;
	object-position: top
}

.p-4 {
	padding: 1rem
}

.p-6 {
	padding: 1.5rem
}

.\!px-0 {
	padding-left: 0 !important;
	padding-right: 0 !important
}

.px-3 {
	padding-left: .75rem;
	padding-right: .75rem
}

.px-3\.5 {
	padding-left: .875rem;
	padding-right: .875rem
}

.px-4 {
	padding-left: 1rem;
	padding-right: 1rem
}

.px-6 {
	padding-left: 1.5rem;
	padding-right: 1.5rem
}

.py-3 {
	padding-top: .75rem;
	padding-bottom: .75rem
}

.py-3\.5 {
	padding-top: .875rem;
	padding-bottom: .875rem
}

.py-4 {
	padding-top: 1rem;
	padding-bottom: 1rem
}

.py-6 {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem
}

.py-8 {
	padding-top: 2rem
}

.pb-8,
.py-8 {
	padding-bottom: 2rem
}

.pt-56 {
	padding-top: 14rem
}

.text-center {
	text-align: center
}

.text-\[\#aaaaaa\] {
	--tw-text-opacity: 1;
	color: rgb(170 170 170/var(--tw-text-opacity))
}

.text-brand-1 {
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.text-inherit {
	color: inherit
}

.text-white {
	--tw-text-opacity: 1;
	color: rgb(255 255 255/var(--tw-text-opacity))
}

.no-underline {
	text-decoration-line: none
}

.decoration-0 {
	text-decoration-thickness: 0
}

.opacity-25 {
	opacity: .25
}

.opacity-75 {
	opacity: .75
}

.filter {
	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.transition {
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
	transition-timing-function: cubic-bezier(.4, 0, .2, 1);
	transition-duration: .15s
}

circle,
path {
	fill: currentColor;
	transition: fill .1s linear, stroke .1s linear
}

.visible-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	border: 0;
	clip: rect(0 0 0 0);
	-webkit-clip-path: inset(100%);
	clip-path: inset(100%)
}

.locked-position {
	overflow: hidden;
	position: fixed
}

body {
	display: flex;
	min-height: 100vh;
	flex-direction: column;
	--tw-bg-opacity: 1;
	background-color: rgb(26 26 30/var(--tw-bg-opacity));
	font-weight: 600;
	color: hsla(0, 0%, 100%, .7)
}

@media (min-width:769px) {
	body {
		--tw-bg-opacity: 1;
		background-color: rgb(16 16 19/var(--tw-bg-opacity))
	}
}

body {
	font-size: 12px;
	line-height: 20px
}

body,
html {
	scroll-behavior: smooth
}

.button {
	display: inline-flex;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	border-radius: .5rem;
	border-style: none;
	background-color: transparent;
	vertical-align: top;
	text-decoration-line: none;
	outline-width: 0;
	transition: border .1s linear, color .1s linear, background .1s linear
}

.button:disabled,
a[aria-disabled=true] {
	pointer-events: none
}

.button:disabled {
	opacity: .6
}

.button--tab {
	border: 1px solid hsla(0, 0%, 100%, .1);
	padding: .5rem .75rem;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 16px;
	letter-spacing: 1px
}

.button--tab:focus-visible {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--tab:active {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

@media (min-width:769px) {
	.button--tab:focus-visible {
		border-color: hsla(0, 0%, 100%, .1);
		color: inherit
	}

	.button--tab:active {
		border-color: hsla(0, 0%, 100%, .1);
		color: inherit
	}
}

.button--tab.active {
	display: none
}

@media (min-width:769px) {
	.button--tab.active {
		display: block;
		--tw-border-opacity: 1;
		border-color: rgb(255 169 51/var(--tw-border-opacity));
		--tw-text-opacity: 1;
		color: rgb(255 169 51/var(--tw-text-opacity))
	}
}

.button--tab.active {
	pointer-events: none
}

.button--icon {
	border: 1px solid hsla(0, 0%, 100%, .1);
	padding: .5rem
}

.button--icon:focus-visible {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--icon:active {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--dark {
	--tw-bg-opacity: 1;
	background-color: rgb(35 35 40/var(--tw-bg-opacity));
	padding: .625rem 1.25rem;
	color: hsla(0, 0%, 100%, .7);
	font-weight: 800;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 1px
}

.button--dark:focus,
.button--dark:hover,
.button--dark--active {
	--tw-bg-opacity: 1;
	background-color: rgb(255 169 51/var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: #fff;
}

.button--primary {
	background-color: hsla(0, 0%, 100%, .1);
	padding: .625rem 1.25rem;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 1px
}

.button--primary:focus,
.button--primary:hover {
	--tw-bg-opacity: 1;
	background-color: rgb(255 169 51/var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: rgb(16 16 19/var(--tw-text-opacity))
}

.button--secondary,
html.light .button--secondary {
	border: 1px solid hsla(0, 0%, 100%, .1);
	padding: .625rem 1.25rem;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 1px
}

.button--secondary:hover,
html.light .button--secondary:hover {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--secondary:focus-visible,
html.light .button--secondary:focus-visible {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

html.light .button--secondary {
	--tw-border-opacity: 1;
	border-color: rgb(241 240 245/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(115 115 115/var(--tw-text-opacity))
}

.button--secondary.active,
html.light .button--secondary.active {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: rgb(255 169 51/var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: rgb(16 16 19/var(--tw-text-opacity))
}

.button--filter {
	width: 100%;
	border: 1px solid hsla(0, 0%, 100%, .1);
	padding: .5rem .75rem;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 16px;
	letter-spacing: 1px
}

.button--filter:hover {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--filter:focus-visible {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--filter.active,
.button--filter:active {
	--tw-border-opacity: 1;
	border-color: rgb(255 169 51/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(255 169 51/var(--tw-text-opacity))
}

.button--filter.active {
	pointer-events: none
}

.typography-caption {
	font-size: 10px;
	line-height: 16px
}

.typography-button,
.typography-caption {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 1px
}

.typography-button {
	font-size: 12px;
	line-height: 20px
}

.text-h1,
.text_type_h1 {
	font-weight: 800;
	text-transform: uppercase;
	font-size: 18px;
	line-height: 24px;
	letter-spacing: 1px
}

@media screen and (max-width:768px) {
	.text_type_h1 {
		font-size: 15px;
		line-height: 20px
	}
}

@media screen and (max-width:320px) {
	.text_type_h1 {
		font-size: 12px
	}
}

.text-h2 {
	font-size: 16px
}

.text-h2,
.text-h3 {
	font-weight: 800;
	text-transform: uppercase;
	line-height: 20px;
	letter-spacing: 1px
}

.text-h3 {
	font-size: 14px
}

.advertisements-list {
	display: grid;
	gap: .5rem
}

@media (min-width:769px) {
	.advertisements-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.5rem
	}
}

@media (min-width:1233px) {
	.advertisements-list {
		grid-template-columns: repeat(4, minmax(0, 1fr))
	}
}

.advertisement {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	border-radius: .75rem;
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255/var(--tw-bg-opacity));
	padding: 1.5rem;
	color: #4b4b52
}

.advertisement__caption {
	margin-bottom: .75rem;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 16px;
	letter-spacing: 1px
}

.advertisement__title {
	margin-bottom: .5rem;
	--tw-text-opacity: 1;
	color: rgb(26 26 30/var(--tw-text-opacity))
}

.advertisement__status {
	margin-bottom: .75rem;
	display: inline-flex;
	border-radius: .25rem;
	padding: .25rem .5rem;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 16px;
	letter-spacing: 1px
}

.advertisement__status_value_engaged {
	color: #e70000;
	background-color: rgba(231, 0, 0, .1)
}

.advertisement__status_value_free {
	color: #009956;
	background-color: rgba(0, 153, 86, .1)
}

@media screen and (max-width:768px) {
	.text-h1 {
		font-size: 15px;
		line-height: 20px
	}

	.text-h2 {
		font-size: 14px
	}

	.text-h3 {
		font-size: 12px
	}
}

@media screen and (max-width:320px) {

	.text-h1,
	.text-h2 {
		font-size: 12px
	}
}

.hover\:text-white:hover {
	--tw-text-opacity: 1;
	color: rgb(255 255 255/var(--tw-text-opacity))
}

.hover\:underline:hover {
	text-decoration-line: underline
}

.focus\:text-white:focus {
	--tw-text-opacity: 1;
	color: rgb(255 255 255/var(--tw-text-opacity))
}

.focus\:underline:focus {
	text-decoration-line: underline
}

@media (min-width:769px) {
	.md\:right-4 {
		right: 1rem
	}

	.md\:top-4 {
		top: 1rem
	}

	.md\:order-none {
		order: 0
	}

	.md\:mb-2 {
		margin-bottom: .5rem
	}

	.md\:mb-20 {
		margin-bottom: 5rem
	}

	.md\:mb-4 {
		margin-bottom: 1rem
	}

	.md\:mb-6 {
		margin-bottom: 1.5rem
	}

	.md\:block {
		display: block
	}

	.md\:flex {
		display: flex
	}

	.md\:inline-flex {
		display: inline-flex
	}

	.md\:grid {
		display: grid
	}

	.md\:hidden {
		display: none
	}

	.md\:w-auto {
		width: auto
	}

	.md\:gap-10 {
		gap: 2.5rem
	}

	.md\:rounded-xl {
		border-radius: .75rem
	}

	.md\:rounded-bl-none {
		border-bottom-left-radius: 0
	}

	.md\:rounded-br-none {
		border-bottom-right-radius: 0
	}

	.md\:rounded-tl-none {
		border-top-left-radius: 0
	}

	.md\:rounded-tr-none {
		border-top-right-radius: 0
	}

	.md\:bg-neutrals-2 {
		--tw-bg-opacity: 1;
		background-color: rgb(26 26 30/var(--tw-bg-opacity))
	}

	.md\:bg-neutrals-2\/80 {
		background-color: rgba(26, 26, 30, .8)
	}

	.md\:bg-neutrals-2\/90 {
		background-color: rgba(26, 26, 30, .9)
	}

	.md\:p-6 {
		padding: 1.5rem
	}

	.md\:p-8 {
		padding: 2rem
	}

	.md\:px-0 {
		padding-left: 0;
		padding-right: 0
	}

	.md\:px-2 {
		padding-left: .5rem;
		padding-right: .5rem
	}

	.md\:px-2\.5 {
		padding-left: .625rem;
		padding-right: .625rem
	}

	.md\:px-6 {
		padding-left: 1.5rem;
		padding-right: 1.5rem
	}

	.md\:py-0 {
		padding-top: 0;
		padding-bottom: 0
	}

	.md\:py-10 {
		padding-top: 2.5rem;
		padding-bottom: 2.5rem
	}

	.md\:py-2 {
		padding-top: .5rem;
		padding-bottom: .5rem
	}

	.md\:py-2\.5 {
		padding-top: .625rem;
		padding-bottom: .625rem
	}

	.md\:py-3 {
		padding-top: .75rem;
		padding-bottom: .75rem
	}

	.md\:py-3\.5 {
		padding-top: .875rem;
		padding-bottom: .875rem
	}

	.md\:pb-10 {
		padding-bottom: 2.5rem
	}

	.md\:pb-12 {
		padding-bottom: 3rem
	}

	.md\:pb-2 {
		padding-bottom: .5rem
	}
}

@media (min-width:321px) {
	.mobile\:w-\[166px\] {
		width: 166px
	}
}

@media (min-width:769px) {
	.tabletMD\:w-\[192px\] {
		width: 192px
	}
}

@media (max-width:768px) {
	.tablet\:px-0 {
		padding-left: 0;
		padding-right: 0
	}
}

.\[\&\>\*\:first-child\]\:mb-4>:first-child {
	margin-bottom: 1rem
}

.\[\&\>\*\:not\(\:last-child\)\:not\(\:first-child\)\]\:mb-3>:not(:last-child):not(:first-child) {
	margin-bottom: .75rem
}

.\[\&\>\*\:not\(\:last-child\)\]\:border-b>:not(:last-child) {
	border-bottom-width: 1px
}

.\[\&\>\*\:not\(\:last-child\)\]\:border-solid>:not(:last-child) {
	border-style: solid
}

.\[\&\>\*\:not\(\:last-child\)\]\:border-white\/10>:not(:last-child) {
	border-color: hsla(0, 0%, 100%, .1)
}

.\[\&\>\*\:not\(\:last-child\)\]\:pb-6>:not(:last-child) {
	padding-bottom: 1.5rem
}

@media (min-width:769px) {
	.md\:\[\&\>\*\:not\(\:last-child\)\]\:border-b>:not(:last-child) {
		border-bottom-width: 1px
	}

	.md\:\[\&\>\*\:not\(\:last-child\)\]\:border-solid>:not(:last-child) {
		border-style: solid
	}

	.md\:\[\&\>\*\:not\(\:last-child\)\]\:border-white\/10>:not(:last-child) {
		border-color: hsla(0, 0%, 100%, .1)
	}

	.md\:\[\&\>\*\:not\(\:last-child\)\]\:pb-6>:not(:last-child) {
		padding-bottom: 1.5rem
	}

	.\[\&\>li\]\:md\:flex-auto>li {
		flex: 1 1 auto
	}
}

.banner-d {
	background-color: rgb(33 33 38/var(--tw-bg-opacity));
	position: relative;
	display: flex !important;
	align-items: center;
	justify-content: center;
	text-transform: uppercase;
}

.banner-d span {
	color: #ffffff;
	text-align: center;
	line-height: 1.2;
}

.banner-240-96 {
	width: 240px;
	height: 96px;
}

.banner-178-78 {
	width: 178px;
	height: 96px;
}

.banner-d-img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 2;
}

.banner-d-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.js-trigger-video-modal {
	cursor: pointer;
}

.video-modal,
.video-modal .overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3000;
}

.video-modal {
	overflow: hidden;
	position: fixed;
	opacity: 0.0;
	-webkit-transform: translate(500%, 0%);
	transform: translate(500%, 0%);
	-webkit-transition: -webkit-transform 0s linear 0s;
	transition: transform 0s linear 0s;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.video-modal .overlay {
	z-index: 0;
	background: rgba(42, 36, 35, 0.82);
	opacity: 0.0;
	-webkit-transition: opacity 0.2s ease-out 0.05s;
	transition: opacity 0.2s ease-out 0.05s;
}

.video-modal-content {
	position: relative;
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
	z-index: 1;
	margin: 0 auto;
	overflow-y: visible;
	background: #000;
	width: calc(100% - 12em);
	height: 0;
	padding-top: calc((100% - 12em) * 0.5625);
}

@media (min-aspect-ratio: 16/9) {
	.video-modal-content {
		width: 0;
		height: calc(100vh - 10em);
		padding-top: 0;
		padding-left: calc((100vh - 10em) * 1.7778);
	}
}

@media (max-width: 640px) {
	.video-modal-content {
		width: calc(100% - 1em);
		padding-top: calc((100% - 1em) * 0.5625);
	}
}

.close-video-modal {
	display: block;
	position: absolute;
	left: 0;
	top: -40px;

	text-decoration: none;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
}

iframe#youtube {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;

	background: #000;
	box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
}

.show-video-modal .video-modal {
	opacity: 1.0;

	transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
}

.show-video-modal .video-modal .overlay {
	opacity: 1.0;
}

.show-video-modal .video-modal-content {
	transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
}

.video {
	opacity: 0;
	transition: opacity .2s linear;
	visibility: hidden;
	pointer-events: none
}

.video.open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.desktop-video.open {
	display: none
}

@media (min-width:1233px) {
	.desktop-video.open {
		display: block
	}
}

.desktop-video {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.desktop-video__iframe {
	position: sticky;
	top: 50px;
	left: 0;
	width: 100%;
	border: none;
	z-index: 100000000;
	aspect-ratio: 1.7777777778
}

.video__iframe {
	display: block
}

@media (min-width:1233px) {
	.video__iframe {
		display: none
	}
}

.video__iframe {
	width: calc(100% - 360px);
	max-width: calc(100vw - 2em);
	max-height: calc(100vh - 7em);
	border: none;
	aspect-ratio: 1.7777777778
}

@media screen and (max-width:992px) {
	.video__iframe {
		width: calc(100% - 150px)
	}
}

@media screen and (max-width:768px) {
	.video__iframe {
		aspect-ratio: 1.3333333333
	}
}

@media screen and (max-width:640px) {
	.video__iframe {
		width: calc(100% - 16px)
	}
}

.video__btn:after,
.video__btn:before {
	top: 50%;
	left: 50%;
	margin: 0;
	border-radius: 0;
	width: 20px;
	height: 2px;
	transform: translate(-50%, -50%) rotate(45deg)
}

.video__btn:after {
	transform: translate(-50%, -50%) rotate(-45deg)
}

.menu.active .navigation {
	display: flex
}

.navigation {
	position: absolute;
	top: 100%;
	left: 0;
	display: none;
	width: 100%;
	min-width: 100%;
	flex-direction: column;
	gap: 1.5rem;
	overflow: auto;
	--tw-bg-opacity: 1;
	background-color: rgb(26 26 30/var(--tw-bg-opacity));
	padding: 1.5rem 1rem 9rem;
	z-index: 999;
	height: calc(100vh - 90px)
}

.navigation>:not(:last-child) {
	border-bottom: 1px;
	border-color: hsla(0, 0%, 100%, .1);
	border-style: solid;
	padding-bottom: 1.5rem
}

@media (min-width:769px) {
	.menu {
		display: none
	}
}

.button-menu {
	position: relative;
	display: flex;
	height: 24px;
	min-height: 24px;
	width: 24px
}

@media (min-width:769px) {
	.button-menu {
		display: none
	}
}

.button-menu.active div:nth-of-type(2) {
	opacity: 0
}

.button-menu.active div:first-of-type,
.button-menu.active div:last-of-type {
	top: 50%;
	bottom: auto;
	transform: translate(-50%, -50%) rotate(45deg)
}

.button-menu.active div:last-of-type {
	transform: translate(-50%, -50%) rotate(-45deg)
}

.button-menu div:first-of-type {
	top: calc(50% - 6px)
}

.button-menu div:last-of-type {
	top: calc(50% + 6px)
}

.button-menu div {
	position: absolute;
	left: 50%;
	top: 50%;
	height: .125rem;
	width: 1.25rem;
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255/var(--tw-bg-opacity));
	transform: translate(-50%, -50%);
	transition: background-color .1s linear, opacity .1s linear, top .1s linear, bottom .1s linear, transform .1s linear
}

.button-menu:focus-visible div {
	--tw-bg-opacity: 1;
	background-color: rgb(255 169 51/var(--tw-bg-opacity))
}

.scroll-buttons {
	position: fixed;
	left: 0;
	bottom: 0;
	display: flex;
	width: 100%;
	gap: .5rem;
	border-color: hsla(0, 0%, 100%, .1);
	border-top: 1px hsla(0, 0%, 100%, .1);
	border-style: solid;
	--tw-bg-opacity: 1;
	background-color: rgb(33 33 38/var(--tw-bg-opacity));
	padding: 1rem
}

@media (min-width:769px) {
	.scroll-buttons {
		display: none
	}
}

.scroll-buttons {
	z-index: 900;
	transition: background-color .1s linear, border-color .1s linear
}

html.light .scroll-buttons {
	--tw-border-opacity: 1;
	border-color: rgb(241 240 245/var(--tw-border-opacity));
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.scroll-buttons-space {
	padding-bottom: 5rem
}

@media (min-width:769px) {
	.scroll-buttons-space {
		padding-bottom: 0
	}
}

.card {
	border-bottom: 1px;
	border-color: hsla(0, 0%, 100%, .1);
	border-style: solid;
	--tw-text-opacity: 1;
	color: rgb(170 170 170/var(--tw-text-opacity));
	transition: border .1s linear, color .1s linear, opacity .1s linear, background .1s linear
}

.card.open,
.card:hover {
	background-color: hsla(0, 0%, 100%, .1)
}

.card.fixed-vip.open,
.card.fixed-vip:hover {
	background-image: linear-gradient(90deg, #ff9300, #ff2600)
}

.card.open .card__dropdown {
	display: block
}

@media (min-width:769px) {
	.card.open .card__dropdown {
		display: none
	}
}

.card.open .card__dropdown-arrow svg {
	transform: rotate(180deg)
}

.card.fixed-vip {
	border-radius: .25rem;
	--tw-text-opacity: 1;
	color: rgb(16 16 19/var(--tw-text-opacity));
	background-image: linear-gradient(90deg, #ff2600, #ff9300)
}

.card.super-vip .card__name {
	--tw-text-opacity: 1;
	color: rgb(223 173 79/var(--tw-text-opacity))
}

.card.fixed-vip .card__name,
.card.super-vip .card__name {
	font-size: 13px
}

@media (max-width:768px) {

	.card.fixed-vip .card__name,
	.card.super-vip .card__name {
		font-size: .875rem;
		line-height: 1.25rem
	}
}

@media (max-width:425px) {

	.card.fixed-vip .card__name,
	.card.super-vip .card__name {
		font-size: .75rem;
		line-height: 1rem
	}
}

.card.super-vip .card__dropdown span,
.card.super-vip .card__dropdown-arrow,
.card.super-vip .card__icons,
.card.super-vip .card__status {
	color: #e18000
}

.card.premium .card__dropdown span,
.card.premium .card__dropdown-arrow,
.card.premium .card__icons,
.card.premium .card__name,
.card.vip .card__dropdown span,
.card.vip .card__dropdown-arrow,
.card.vip .card__icons,
.card.vip .card__name {
	color: #558ac7
}

.card.fixed-vip .card__status svg,
.card.vip .card__status svg {
	width: 20px;
	height: 20px
}

.card.usual .card__status svg {
	width: 12px;
	height: 12px
}

.card.vip .card__status {
	--tw-text-opacity: 1;
	color: rgb(255 147 0/var(--tw-text-opacity))
}

.card__wrapper {
	position: relative;
	display: flex;
	min-height: 35px;
	align-items: center
}

@media (min-width:769px) {
	.card__wrapper {
		min-height: 28px
	}
}

.card__dropdown {
	display: none
}

.card__dropdown>* {
	display: flex;
	min-height: 35px;
	cursor: pointer;
	align-items: center;
	gap: .25rem
}

@media (min-width:769px) {
	.card__dropdown>* {
		min-height: 28px
	}
}

.card .card__dropdown-arrow path {
	fill: none;
	stroke: currentColor
}

.card__dropdown-arrow {
	display: flex;
	cursor: pointer;
	align-items: center;
	align-self: stretch
}

@media (min-width:769px) {
	.card__dropdown-arrow {
		display: none
	}
}

.card__dropdown-arrow:before {
	content: "";
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%
}

.card__dropdown-arrow svg {
	transition: transform .1s linear
}

.card__dropdown span,
.card__status {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	min-width: 34px
}

/* Smaller, muted country flags so they don't overpower the card */
.card__status img {
	width: 16px !important;
	height: auto !important;
	border-radius: 2px;
	opacity: .72;
	filter: saturate(.75);
}

.card__name {
	margin-left: .25rem;
	margin-right: auto;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 12px;
}

.card__name:focus,
.card__name:hover {
	text-decoration: underline
}

.card__icons {
	display: none;
	align-items: center;
	justify-content: flex-end;
	gap: 1px
}

@media (min-width:769px) {
	.card__icons {
		display: flex
	}
}

.card__icons>li {
	display: flex;
	cursor: pointer;
	align-items: center;
	justify-content: center
}

.card__rate {
	margin-left: .25rem;
	width: 48px;
	min-width: 48px
}

.card__chronicle {
	width: 52px;
	min-width: 52px
}

.card__time {
	display: flex;
	width: 90px;
	min-width: 90px;
	justify-content: center;
	padding: 4px 2px;
	border-radius: 4px
}

.card__time-full {
	display: none
}

@media (min-width:769px) {
	.card__time-full {
		display: block
	}
}

.card__time-short {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis
}

@media (min-width:769px) {
	.card__time-short {
		display: none
	}
}

.card:not(.fixed-vip) .card__time-today,
.card:not(.fixed-vip) .card__time-tomorrow,
.card:not(.fixed-vip) .card__time-yesterday {
	transition: background-color .1s linear, color .1s linear
}

.card:not(.fixed-vip) .card__time-date_today,
.card:not(.fixed-vip) .card__time-today {
	color: #51c255
}

.card:not(.fixed-vip) .card__time-date_today {
	font-weight: 700
}

.card:not(.fixed-vip) .card__time-date_tomorrow,
.card:not(.fixed-vip) .card__time-date_yesterday,
.card:not(.fixed-vip) .card__time-tomorrow,
.card:not(.fixed-vip) .card__time-yesterday {
	--tw-text-opacity: 1;
	color: rgb(255 255 255/var(--tw-text-opacity))
}

.card:not(.fixed-vip) .card__time-date_tomorrow,
.card:not(.fixed-vip) .card__time-date_yesterday {
	font-weight: 700
}

@media screen and (max-width:375px) {

	.card__dropdown span,
	.card__status {
		width: 24px;
		min-width: 24px
	}

	.card__time {
		width: 48px;
		min-width: 48px
	}

	.card.fixed-vip .card__status svg {
		width: 16px;
		height: 16px
	}
}

html.light .card {
	--tw-border-opacity: 1;
	border-color: rgb(241 240 245/var(--tw-border-opacity));
	--tw-text-opacity: 1;
	color: rgb(26 26 30/var(--tw-text-opacity))
}

html.light .fixed-vip {
	--tw-text-opacity: 1;
	color: rgb(255 255 255/var(--tw-text-opacity))
}

html.light .super-vip .card__dropdown span,
html.light .super-vip .card__dropdown-arrow,
html.light .super-vip .card__icons,
html.light .super-vip .card__name,
html.light .super-vip .card__status {
	--tw-text-opacity: 1;
	color: rgb(255 147 0/var(--tw-text-opacity))
}

html.light .premium .card__dropdown span,
html.light .premium .card__dropdown-arrow,
html.light .premium .card__icons,
html.light .premium .card__name,
html.light .vip .card__dropdown span,
html.light .vip .card__dropdown-arrow,
html.light .vip .card__icons,
html.light .vip .card__name {
	color: #507298
}

html.light .premium .card__status,
html.light .usual .card__name,
html.light .usual .card__status {
	color: #737373
}

html.light .card:not(.fixed-vip) .card__time-date_today,
html.light .card:not(.fixed-vip) .card__time-today {
	color: #227325;
	background-color: #e1f2e4
}

html.light .card:not(.fixed-vip) .card__time-date_tomorrow,
html.light .card:not(.fixed-vip) .card__time-date_yesterday,
html.light .card:not(.fixed-vip) .card__time-tomorrow,
html.light .card:not(.fixed-vip) .card__time-yesterday {
	--tw-bg-opacity: 1;
	background-color: rgb(241 240 245/var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: rgb(26 26 30/var(--tw-text-opacity))
}

html.light .card.open,
html.light .card:hover {
	background-color: rgba(16, 16, 19, .05)
}

html.light .fixed-vip.open,
html.light .fixed-vip:hover {
	background-image: linear-gradient(90deg, rgba(255, 38, 0, .85), rgba(255, 147, 0, .85))
}

.server-list {
	position: relative;
	display: grid;
	width: 100%;
	max-width: 888px;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	align-items: flex-start;
	--tw-bg-opacity: 1;
	background-color: rgb(33 33 38/var(--tw-bg-opacity));
	padding-left: 1rem;
	padding-right: 1rem
}

@media (min-width:769px) {
	.server-list {
		border-radius: .75rem
	}
}

@media (min-width:1233px) {
	.server-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.5rem;
		padding-left: 1.5rem;
		padding-right: 1.5rem
	}
}

.server-list {
	transition: background-color .1s linear
}

.server-list__title {
	margin-bottom: .75rem;
	display: flex;
	flex-direction: column;
	text-align: center;
	transition: color .1s linear
}

.server-list__title span {
	display: none
}

@media (min-width:769px) {
	.server-list__title span {
		display: inline
	}
}

.server-list__title time {
	font-size: 12px;
	font-weight: 600;
	line-height: 20px
}

html.light .server-list {
	--tw-bg-opacity: 1;
	background-color: rgb(255 255 255/var(--tw-bg-opacity));
	--tw-text-opacity: 1;
	color: rgb(90 90 90/var(--tw-text-opacity))
}
.topBlock-ranking { 
  width: calc(100% - 15px); 
  margin-bottom: 25px; 
  background: #faf7f2 none repeat scroll 0 0;
  margin-bottom: 15px;
  padding: 20px;
  border-radius: 5px;
}
.single-ranking-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-pack: distribute;
  
}
.single-ranking-list .ranking-box-left {
  max-width: 80px;
}

.ranking-box-middle {
  font-size: 30px;
  margin: 0 15px;
}
.ranking-box-middle a{
  text-decoration:underline;
}
.single-ranking-list .ranking-box-right{
  margin-left: auto;
}
.place-badge {
  border-radius: 5px;
  padding: 10px 10px;
  background: rgb(255 169 51/1) none repeat scroll 0 0;
  font-size: 20px;
  color: #FFF;
  text-transform: uppercase;
  line-height: 25px;
  display: inline-block;
  font-weight: 600;
	width: 50px;
}
.vote-badge {
	border-radius: 5px;
	padding: 3px 10px;
	background: rgb(255 169 51/1) none repeat scroll 0 0;
	font-size: 14px;
	color: #FFF !important;
	line-height: 25px;
	display: inline-block;
	cursor: pointer;
	width: 120px;
	margin: 1px;
}
.server-banner{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	gap: 5px;
}
@media (max-width: 1000px) {
  .server-banner {
    flex-direction: column;
  }
	.ranking-box-middle {
		font-size: 24px;
	}
}
.ranking-description{
  margin-top: 10px;
  overflow: hidden;
  max-height:58px;
}
.ranking-description:first-letter {
  font-size: 28px;
  color: rgb(255 169 51/1);
  font-weight:900;
  letter-spacing:2px;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span,
.pagination > li:last-child > a, 
.pagination > li:last-child > span {
	border-radius:0;
}

.pagination > li > a {
	border-color:#c8c8c8;
	color: #000;
}

.pagination > li > a:hover {
	border-color:#c8c8c8;
	background-color: #e8e8e8;
	color: #000;
}

.pagination>.active>a, 
.pagination>.active>span, 
.pagination>.active>a:hover, 
.pagination>.active>span:hover, 
.pagination>.active>a:focus, 
.pagination>.active>span:focus {
	background-color: #ff7d09;
	border-color:#ff7d09;
}

/* === Redesigned ranking cards === */
.rank-list{display:flex;flex-direction:column;gap:12px}
.rank-card{display:flex;align-items:center;gap:14px;background:rgba(33,33,38,1);border:1px solid #2a2a30;border-radius:10px;padding:14px;transition:border-color .15s ease, transform .15s ease}
.rank-card:hover{border-color:#3b3b44;transform:translateY(-1px)}
.rank-card--1{border-left:3px solid #DFAD4F}
.rank-card--2{border-left:3px solid #C0C5CE}
.rank-card--3{border-left:3px solid #C8843C}
.rank-card__pos{display:flex;flex-direction:column;align-items:center;gap:5px;width:46px;flex-shrink:0}
.rank-medal{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;background:#2f2f35;color:#e3e3e7}
.rank-medal--gold{background:#DFAD4F;color:#3a2c08}
.rank-medal--silver{background:#C0C5CE;color:#2c2f36}
.rank-medal--bronze{background:#C8843C;color:#3a230c}
.rank-pos-num{font-size:11px;font-weight:700;color:#7d7898}
.rank-card__logo{height:56px;border-radius:12px;background:#0c0c10;border:1px solid #34343b;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;padding:5px;box-sizing:border-box}
.rank-card__logo img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;image-rendering:auto}
.rank-card__title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:2px}
.rank-vip-badge{
	display:inline-flex;align-items:center;gap:5px;
	font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
	padding:3px 8px;border-radius:999px;
	background:rgba(240,169,51,.14);color:#f0a933;border:1px solid rgba(240,169,51,.4)
}
.rank-vip-badge--super{
	background:linear-gradient(135deg,rgba(255,215,120,.18),rgba(240,169,51,.1));
	color:#ffe09a;border-color:rgba(255,215,120,.5)
}
.rank-card--vip{
	border-color:rgba(240,169,51,.35);
	background:linear-gradient(105deg,rgba(240,169,51,.07) 0%,#1a1a20 42%);
	box-shadow:0 0 0 1px rgba(240,169,51,.12),0 10px 28px rgba(0,0,0,.25)
}
.rank-card--supervip{
	border-color:rgba(255,215,120,.55);
	background:linear-gradient(105deg,rgba(255,200,80,.12) 0%,#1c1a16 45%);
	box-shadow:0 0 0 1px rgba(255,215,120,.2),0 12px 32px rgba(240,169,51,.12);
	position:relative
}
.rank-card--supervip::before{
	content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;
	background:linear-gradient(180deg,#ffe09a,#f0a933,#c8843c)
}
.rank-card--vip:hover,.rank-card--supervip:hover{transform:translateY(-2px)}
.rank-card--supervip .rank-card__name{color:#ffe9b5}
.rank-mono{font-weight:800;font-size:22px;color:#DFAD4F;display:inline-flex;align-items:center;justify-content:center}
.rank-card__main{flex:1;min-width:0}
.rank-card__name{color:#fff;font-size:16px;font-weight:800;text-decoration:none;display:inline-block}
.rank-card__name:hover{color:#f0a500;text-decoration:underline}
.rank-card__desc{color:#9b97b3;font-size:12px;margin:3px 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.rank-card__chips{display:flex;gap:6px;flex-wrap:wrap}
.rank-chip{background:#2f2f35;color:#e3e3e7;font-size:11px;padding:3px 8px;border-radius:5px;white-space:nowrap}
.rank-chip i{margin-right:3px;opacity:.85}
.rank-chip--pvp{background:rgba(226,75,74,0.15);color:#ef9595}
.rank-chip--pve{background:rgba(99,153,34,0.18);color:#a7d16b}
.rank-card__actions{display:flex;flex-direction:column;gap:7px;width:130px;flex-shrink:0}
.rank-btn{display:block;text-align:center;border-radius:7px;font-size:13px;text-decoration:none;padding:9px;line-height:1.2}
.rank-btn--vote{background:#f0a500;color:#3a2c08;font-weight:800}
.rank-btn--vote:hover{background:#ffc23d}
.rank-btn--details{border:1px solid #34343b;color:#e3e3e7;padding:7px}
.rank-btn--details:hover{background:#2f2f35}
.det-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
.det-actions__site{flex:0 0 auto;min-width:110px;padding:11px 14px!important}
.det-actions__vote{
	flex:0 0 auto;margin-left:auto;min-width:128px;padding:12px 20px!important;
	border-radius:12px!important;font-size:14px!important;letter-spacing:.04em;text-transform:uppercase;
	background:linear-gradient(135deg,#f0a933,#e08a14)!important;color:#16161c!important;
	box-shadow:0 8px 22px rgba(240,169,51,.28);transition:transform .15s,filter .15s
}
.det-actions__vote:hover{filter:brightness(1.06);transform:translateY(-1px);background:linear-gradient(135deg,#ffc23d,#f0a933)!important;color:#16161c!important}
.det-actions__vote i{margin-right:6px}
@media (max-width:640px){
	.rank-card{flex-wrap:wrap}
	.rank-card__main{flex-basis:100%;order:3;margin-top:4px}
	.rank-card__actions{width:100%;flex-direction:row;order:4}
	.rank-btn{flex:1}
	.det-actions__vote,.det-actions__site{flex:1;text-align:center;min-width:0}
}