/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
@import url(https://fonts.googleapis.com/css?family=Inter:100,200,300,regular,500,600,700,800,900);
@import url(https://fonts.googleapis.com/css?family=Jost:regular,500);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans:regular,500,600);

html {
    -webkit-text-size-adjust: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    font-family: var(--ff);
    font-weight: 400;
    font-size: 16px;
    line-height: normal;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    scroll-behavior: smooth
}

body,
sub,
sup {
    position: relative
}

a,
body {
    font-weight: inherit;
    font-family: inherit;
    margin: 0
}

body {
    padding: 0;
    color: rgba(var(--w-clr), 1);
    /* background-color: #fff; */
    background-color: #070606;
    width: 100%;
    font-size: inherit;
    line-height: inherit;
    min-height: -webkit-fill-available;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100vh;
	z-index: 0;
}

details,
label,
main {
    display: block
}

h1 {
    font-size: 2em
}

hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

code,
kbd,
pre,
samp {
    font-size: 1em;
    font-family: monospace, monospace
}

a {
    background-color: transparent;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    color: inherit;
    font-style: inherit;
    text-decoration: none;
    cursor: pointer
}

abbr[title] {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
    border-bottom: none
}

b,
strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

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

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none;
    max-width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover
}

button,
input,
optgroup,
select,
textarea {
    font-size: 100%;
    font-family: inherit
}

input,
optgroup,
select,
textarea {
    margin: 0;
    line-height: 1.15
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
    padding: 0;
    border-style: none
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    display: table;
    max-width: 100%;
    color: inherit;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],
[type=radio],
legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

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

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

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

summary {
    display: list-item
}

[hidden],
template {
    display: none
}

@font-face {
    font-family: "swiper-icons";
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.swiper-container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-slide,
.swiper-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform
}

.swiper-wrapper {
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.swiper-container-multirow>.swiper-wrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-multirow-column>.swiper-wrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition-property: height, -webkit-transform;
    transition-property: transform, height;
    transition-property: transform, height, -webkit-transform
}

.swiper-container-3d {
    -webkit-perspective: 1200px;
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(transparent));
    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(transparent));
    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(transparent));
    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(transparent));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), transparent)
}

.swiper-container-css-mode>.swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-container-css-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: start start
}

.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper {
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory
}

.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper {
    -ms-scroll-snap-type: y mandatory;
    scroll-snap-type: y mandatory
}

@font-face {
    font-family: "Reaver";
    src: url(../fonts/Reaver-Bold.woff) format("woff"), url(../fonts/Reaver-Bold.html) format("opentype");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: "Reaver";
    src: url(../fonts/Reaver-SemiBold.woff) format("woff"), url(../fonts/Reaver-SemiBold.ttf) format("truetype");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: "Radiance";
    src: local("Radiance"), url(../fonts/radiance-semibold.woff) format("woff"), url(../fonts/radiance-semibold.woff2) format("woff2"), url(../fonts/radiance-semibold.ttf) format("truetype"), url(../fonts/radiance-semibold.otf) format("opentype");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: "Radiance";
    src: local("Radiance"), url(../fonts/radiance.woff) format("woff"), url(../fonts/radiance.woff2) format("woff2"), url(../fonts/radiance.ttf) format("truetype"), url(../fonts/radiance.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

:root {
    --ff: "Reaver";
    --ff_r: "Radiance";
    --ff_j: "Jost", sans-serif;
    --ff_i: "Inter", sans-serif;
    --ff_ns: "Noto-Sans", sans-serif;
    --w-clr: 255, 255, 255;
    --w-clr_300: 226, 218, 206;
    --o-clr: 255, 96, 70;
    --gr-clr: 97, 97, 97;
    --b-clr: 0, 0, 0;
    --dark-clr: 19, 23, 28;
    --r-clr: 23, 191, 111;
    --grey-clr: 33, 36, 38;
    --modal-bg: linear-gradient(0deg, #081018, #081018), linear-gradient(61.21deg, #131313 0%, #252121 100%);
    --body-bg: 30, 30, 30;
    --socials-svg-fill-clr: 218, 218, 218;
    --back-icon-fill-clr: 74, 74, 74;
    --footer-links-heading-clr: 172, 172, 172;
    --lang-bg: 34, 34, 34;
    --lang-link-clr: 153, 153, 153;
    --cont-width: 91.875rem;
    --cont-px: 0.75rem;
    --header-gradient-height: 14rem;
    --header-logo-fz: 1.375rem;
    --header-logo-width: 7rem;
    --header-py: 0.4rem;
    --nav-link-fz: 1.1rem;
    --home-p-top: 8.25rem;
    --home-p-bottom: 9.75rem;
    --quote-fz: 1.25rem;
    --world-grid-gutter: 1rem;
    --world-grid-cols: 1;
    --world-item-height: 14.625rem;
    --world-item-py: 1rem;
    --world-item-px: 1.25rem;
    --world-border-clr: 85, 85, 85;
    --world-heading-shadow: 0rem 0rem 0.625rem rgba(var(--b-clr), 1);
    --world-item-heading-fz: 1.25rem;
    --promo-height: 25.5rem;
    --promo-title-fz: 2.25rem;
    --promo-title-span-fz: 1.875rem;
    --promo-title-m: 2rem;
    --promo-info-fz: 0.875rem;
    --promo-section-mb: 14rem;
    --lang-width: 14.625rem;
    --lang-py: 0.75rem;
    --footer-grid-cols: 2;
    --footer-grid-gutter: 2.5rem;
    --footer-logo-width: 7rem;
    --footer-row-cols: 1;
    --footer-row-gap: 4rem;
    --footer-py-1: 2rem;
    --footer-py-2: 1.25rem;
    --socials-grid-cols: 3;
    --socials-grid-gap: 0.75rem;
    --socials-svg-ratio: 1.625rem;
    --socials-width: 6.375rem;
    --socials-link-transition-property: cubic-bezier(.175, .885, .32, 1.275);
    --btn-py: 0.875rem;
    --btn-px: 1.25rem;
    --btn-span-fz: 1.125rem;
    --btn-p-y_large: clamp(1rem, 1.5vw, 1.5rem);
    --btn-p-x_large: clamp(1.375rem, 2vw, 2rem);
    --btn-p-y_small: 1rem;
    --btn-p-x_small: clamp(1.25rem, 1.4vw, 1.4rem);
    --btn-fz: clamp(1rem, 1.125vw, 1.125rem);
    --btn-fw: 600;
    --btn-fz_modal: 0.75rem;
    --btn-lh_modal: calc(1.5rem / var(--btn-fz_modal));
    --btn-lh: calc(24px / var(--btn-fz));
    --btn-border-width: 2px;
    --btn-radius: 0.25rem;
    --arrow-shape: polygon(50% 100%, 0 0, 100% 0);
    --arrow-width: 0.625rem;
    --arrow-height: 0.375rem;
    --modal-padding-x: clamp(1.125rem, 2.5vw, 2.5rem);
    --modal-padding-y: clamp(1.75rem, 2.25vw, 2.25rem);
    --modal-overlay-bg: rgba(var(--b-clr), .7);
    --modal-body-width: 47.875rem;
    --modal-inner-gutter: clamp(1.5rem, 2.125vw, 2.125rem);
    --modal-path-gutter: clamp(0.375rem, 0.625vw, 0.625rem);
    --modal-path-radius: 100px;
    --header-gradient: linear-gradient(180deg, #070606 0%, rgba(7, 6, 6, 0) 100%);
    --home-gradient: -webkit-gradient(linear, left top, left bottom, color-stop(60%, rgba(0, 0, 0, 0)), color-stop(80%, rgba(0, 0, 0, 0.7)), color-stop(100%, rgb(0, 0, 0)));
    --world-item-gradient: linear-gradient(180deg, rgba(19, 23, 28, 0) 60%, rgba(19, 23, 28, 0.733) 70%, #13171C 90%);
    --world-item-hidden-gradient: linear-gradient(180deg, rgba(var(--dark-clr), 0.733) 0%, rgba(var(--b-clr), 1) 90%)
}

@media only screen and (min-width:24.0625em) {
    :root {
        --quote-fz: 1.5rem
    }
}

@media only screen and (min-width:40em) {
    :root {
        --world-grid-cols: 2;
        --cont-px: 1rem;
        --header-logo-fz: 2rem;
        --promo-section-mb: 12.5rem;
        --promo-title-fz: 3.375rem;
        --promo-title-span-fz: 2.625rem;
        --promo-title-m: 2rem;
        --promo-info-fz: 1.25rem;
        --footer-logo-width: 10rem;
        --footer-py-1: 2.25rem;
        --footer-row-cols: 3;
        --quote-fz: 2.25rem;
        --btn-span-fz: 1.5rem;
        --btn-py: 0.9375rem;
        --btn-px: 1.875rem
    }
}

@media only screen and (min-width:75em) {
    :root {
        --header-logo-width: 10rem;
        --nav-list-gap: 2.5rem;
        --world-item-py: 1.875rem;
        --world-item-px: 1.25rem;
        --world-item-heading-fz: 1.5rem;
        --world-grid-cols: 3;
        --promo-height: 724px;
        --promo-title-fz: 4.5rem;
        --promo-title-span-fz: 3.25rem;
        --promo-info-fz: 1.625rem;
        --home-p-top: 8.25rem;
        --home-p-bottom: 13rem
    }
}

@media only screen and (min-width:85.375em) {
    :root {
        --footer-row-cols: 3;
        --footer-row-gap: 80px;
        --world-grid-gutter: 1.875rem;
        --quote-fz: 3.75rem;
        --lang-width: 18.875rem
    }
}

@media only screen and (min-width:90em) {
    :root {
        --nav-list-gap: 1.75rem
    }
}

@media only screen and (min-width:85.375em) {
    :root {
        --home-p-top: 7.75rem
    }
}

@media only screen and (min-width:90em) {
    :root {
        --home-p-top: 11rem
    }
}

body::before {
    position: absolute;
    content: "";
    background-color: rgba(var(--b-clr), .7);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 4;
    -webkit-transition: 300ms ease;
    transition: 300ms ease;
    opacity: 0;
    visibility: hidden
}

.body-locked {
    overflow: hidden
}

.body-locked::before {
    opacity: 1;
    visibility: visible
}

*,
::after,
::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

* {
    -webkit-tap-highlight-color: transparent;
    scrollbar-color: #edf3f6
}

button,
input {
    outline: 0;
    border: 0
}

button {
    background-color: transparent;
    cursor: pointer;
    line-height: initial
}

li,
ul {
    list-style: none
}

button,
h1,
h2,
h3,
h4,
h5,
h6,
li,
p,
ul {
    margin: 0;
    padding: 0
}

button,
picture {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

input {
    width: 100%
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
    appearance: none
}

input[type=number] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield
}

.visually-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%)
}

::-webkit-scrollbar {
    width: 9px;
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 100%;
    display: none
}

::-webkit-scrollbar-thumb {
    background-color: #3c93f0;
    border-radius: 4px;
    background-clip: padding-box;
    border: 2px solid #edf3f6;
    -webkit-box-shadow: none;
    box-shadow: none
}

::-webkit-scrollbar-thumb:hover {
    cursor: pointer
}

::-webkit-scrollbar-track {
    background-color: #edf3f6;
    cursor: pointer;
    border-radius: 6px;
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 100%
}

* ::-webkit-scrollbar-button {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: none
}

.top-wrapper {
    background-size: 100% auto;
    background-position: bottom;
    background-repeat: no-repeat;
    position: relative;
    /* background-image: url(/img/bottom-bg.png); */
}

.top-wrapper__img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-size: 100% auto;
    background-position: bottom;
    background-repeat: no-repeat;
    background-image: url(../img/bottom-bg.png);
    z-index: -4;
}

/* VIDEO HEADER */



#video-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}


#video-bg::after {
    content: '';
    background: linear-gradient(0deg, #070606 10%, transparent 70%);
    position: absolute;
    width: 100%;
    height: 100vh;
    bottom: 0;
    left: 0;
}

#video-bg video {
    height: 100%;
    width: 177.77777778vh;
    min-width: 100%;
    min-height: 56.25vw;
}

#video-gradient {
    width: 100%;
    height: 200px;
    position: absolute;
    bottom: 0px;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, rgba(0, 0, 0, 0)), color-stop(80%, rgba(0, 0, 0, 0.7)), color-stop(100%, rgb(0, 0, 0)));
}



/* VIDEO FOOTER */

#video-bg_footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    max-height: 900px;
    z-index: -1;
    overflow: hidden;
}

#video-bg_footer video {
    height: 100%;
    /*width: 177.77777778vh;*/
    min-width: 100%;
    min-height: 56.25vw;
}

#video-bg_footer::after {
    content: '';
    background: linear-gradient(180deg, #070606 10%, transparent 70%);
    position: absolute;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
}





.header {
    --cont-width: 100%;
    --header-play-width: 16.125rem;
    --actions-gap: 1rem;
    --cont-px: clamp(1rem, 1.875vw, 1.875rem);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: var(--header-py) 0;
    z-index: 3
}

.header__body,
.header__navigation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 2.75rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header__body {
    grid-gap: 1rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative;
    z-index: 1
}

.header__logo,
.header__play span {
    letter-spacing: .125rem;
    font-weight: 600;
    text-transform: uppercase
}

.header__logo {
    font-size: var(--header-logo-fz);
    max-width: 9.75rem;
    filter: grayscale(0.3);
    transition: 0.3s;
}

.header__logo:hover {
    /* filter: grayscale(0.3); */
}

.header__actions,
.header__play {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header__play {
    grid-gap: 1rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    padding: var(--btn-py) var(--btn-px);
    border-radius: 6px;
    border: 3px solid rgba(var(--w-clr), .56);
    -webkit-transition: 200ms ease;
    transition: 200ms ease;
    padding: .9375rem;
    display: none;
    max-width: var(--header-play-width)
}

@media (hover:hover) and (pointer:fine) {
    .header__play:hover {
        -webkit-transform: scale(1.025);
        transform: scale(1.025);
        /* border: 3px solid rgba(var(--o-clr), 1) */
    }
}

.header__play:active {
    -webkit-transform: scale(.985);
    transform: scale(.985)
}

.header__play span {
    font-size: 1.125rem;
    color: rgba(var(--w-clr), 1)
}

.header__play>span {
    max-width: 14.0625rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.header__actions {
    grid-gap: var(--actions-gap)
}

.header__login,
.lang__select span {
    color: rgba(var(--w-clr), .56);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: .125rem;
}

.header__login {
    font-size: .75rem;
    font-family: var(--ff);
    -webkit-transition: 300ms ease;
    transition: 300ms ease;
    display: none;
}

.header__login:hover {
    color: rgba(var(--w-clr), 1)
}



.header__options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media only screen and (min-width:40em) {
    .header__login {
        font-size: .875rem
    }
}

@media only screen and (min-width:75em) {
    .header__logo {
        max-width: 9.75rem
    }
}

@media only screen and (min-width:85.375em) {
    .header {
        --actions-gap: 1rem
    }

    .header__play {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .header__options {
        grid-gap: 2.75rem
    }
}

.nav {
    display: none
}

.nav__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: var(--nav-list-gap);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.nav__link {
    color: rgba(var(--w-clr), .8);
    letter-spacing: .12rem;
    text-transform: uppercase;
    font-size: var(--nav-link-fz);
    position: relative;
    padding: 15px 0;
}

@media (hover:hover) and (pointer:fine) {
    .nav__link:hover {
        color: rgba(var(--w-clr), 1)
    }
}

.nav__link--dropdown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: .625rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: default;
    position: relative
}

.nav__link--dropdown:hover .dropdown {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    pointer-events: all
}

.nav__link--dropdown:hover .nav__arrow {
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.nav__arrow {
    -webkit-clip-path: var(--arrow-shape);
    clip-path: var(--arrow-shape);
    width: var(--arrow-width);
    height: var(--arrow-height);
    background-color: rgba(var(--w-clr), .8);
    -webkit-transition: 300ms ease;
    transition: 300ms ease;
    display: block
}

@media only screen and (min-width:88em) {
    .nav {
        display: block
    }


}

.dropdown {
    position: absolute;
    top: 45px;
    left: 0;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    opacity: 0;
    -webkit-transform: translateY(1rem);
    transform: translateY(1rem);
    visibility: hidden;
    pointer-events: none;
    border: 1px solid rgba(var(--w-clr), .56);
    background-color: rgba(var(--lang-bg), 1);
    overflow: hidden;
}

.dropdown__list {
    border: 2px solid rgba(var(--w-clr), .8);
    white-space: nowrap;
    padding: 0.5rem;
}

.dropdown__item {
    padding: .375rem .625rem;
    -webkit-transition: 300ms ease;
    transition: 300ms ease
}

@media (hover:hover) and (pointer:fine) {
    .dropdown__item:hover {
        -webkit-transform: translateX(.25rem);
        transform: translateX(.25rem)
    }
}

.dropdown__link {
    word-break: break-all;
    font-size: .875rem
}

.lang {
    position: relative;
    display: none;
}

.lang:hover .lang__hidden {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: visible;
    pointer-events: all
}

.lang:hover .lang__arrow {
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.lang__select {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 8px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer
}

.lang__select span {
    font-size: .8125rem
}

.lang__hidden {
    position: absolute;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    top: 0;
    right: 0;
    -webkit-transform: translateY(.625rem);
    transform: translateY(.625rem);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    -webkit-transition: 300ms ease;
    transition: 300ms ease
}

.lang__list {
    border: 1px solid rgba(var(--w-clr), .56);
    background-color: rgba(var(--lang-bg), 1);
    width: var(--lang-width);
    text-align: left;
    margin-top: 1.5rem;
    border-radius: .0625rem;
    padding: var(--lang-py) 0
}

.lang__item {
    display: block;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.lang__arrow,
.lang__link {
    -webkit-transition: 300ms ease;
    transition: 300ms ease
}

.lang__link {
    font-size: 1rem;
    font-family: var(--ff_r);
    font-weight: 400;
    line-height: 1.125rem;
    color: rgba(var(--lang-link-clr), 1);
    padding: 0 var(--lang-py)
}

@media (hover:hover) and (pointer:fine) {
    .lang__link:hover {
        color: rgba(var(--b-clr), 1);
        background-color: rgba(var(--lang-link-clr), 1)
    }
}

.lang__arrow {
    -webkit-clip-path: var(--arrow-shape);
    clip-path: var(--arrow-shape);
    width: var(--arrow-width);
    height: var(--arrow-height);
    background-color: rgba(var(--w-clr), .56);
    display: none
}

@media only screen and (min-width:40em) {
    .lang__select {
        font-size: 13px
    }

    .lang__arrow {
        display: block
    }

    .lang {
        display: block;
    }

    .header__login {
        display: block;
    }
}

.burger {
    display: grid;
    grid-gap: .5rem
}

.burger span {
    display: block;
    background-color: rgba(var(--w-clr), 1);
    width: 2rem;
    height: .1875rem;
    border-radius: 4px
}

@media only screen and (min-width:88em) {
    .burger {
        display: none
    }
}

.container {
    max-width: calc(var(--cont-width) + var(--cont-px)*2);
    width: 100%;
    padding: 0 var(--cont-px);
    margin: 0 auto
}

/*.header__container {
    max-width: 1730px;
}*/

.container-hero {
    max-width: calc((91.875rem + 0.75rem)*2);
    width: 100%;
    padding: 0 var(--cont-px);
    margin: 0 auto
}

.home {
    --btn-span-shadow: 0.125rem 0.125rem 0.1875rem rgba(var(--b-clr), 1);
    --btn-download-clr: 133, 133, 133;
    --title-shadow: 0rem 0rem 1.25rem rgba(var(--b-clr), 1);
    --quote-author-fz: 0.875rem;
    --quote-width: 460px;
    --play-btn-width: 18.75rem;
    --home-px: 0;
    --home-p-bottom: 0;
    --home-p-top: 0;
    padding-top: var(--home-p-top);
    height: 100%;
    min-height: 28.5rem;
    display: grid;
    place-items: center;
    position: relative
}

.home::before,
.home__video {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0
}

.home__video {
    display: none;
    height: 100%;
    overflow: hidden
}

.home__video video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 100vw
}

.home::before {
    content: "";
    height: var(--header-gradient-height);
    background-image: var(--header-gradient)
}

.home__container {
    max-width: 1700px;
    margin: 0 auto;
    /* --cont-width: 100%;
    margin-left: unset; */
}

.home__body {
    padding-bottom: var(--home-p-bottom);
    position: relative;
    z-index: 1;
}

/*.home__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}*/

.home__quote-block {
    margin: 0 0 1.875rem
}

.home__quote {
    text-shadow: var(--title-shadow);
    font-size: var(--quote-fz);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3125rem;
    margin-bottom: 5px
}



/* @media only screen and (min-width:120em) {
    .home__quote {
        font-size: 3vw;
    }

    .home__quote-author {
        font-size: 0.9vw !important;
    }

    .home__play-inner {
        font-size: 0.9vw !important;
    }

    .home__play-inner span {
        font-size: 1.3vw !important;
    }

    .home__play span {
        font-size: 1.5vw;
    }

    .home__play img {
        height: 2.188vw !important;
    }

    .servers__block-heading {
        font-size: 2.188vw !important;
    }

    .servers__block-info {
        font-size: 0.938vw !important;
    }

    .servers__container {
        max-width: 79vw;
    }

    .servers__name {
        font-size: 0.938vw !important;
    }

    .properties__item span {
        font-size: 0.625vw !important;
    }

    .servers__links a {
        font-size: 0.625vw !important;
    }

    .servers__block-top {
        padding: 1.667vw 1.667vw !important;
    }

    .servers__bar {
        height: 0.417vw !important;
    }

    .servers__col {
        grid-gap: 0.729vw !important;
    }
} */

.home__quote-author {
    color: rgba(var(--w-clr), .7);
    text-transform: uppercase;
    font-weight: 700;
    font-size: var(--quote-author-fz);
    letter-spacing: .125rem
}

.home__quote-author span {
    color: rgba(var(--w-clr), 1);
    text-decoration: underline
}

.home__play {
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    padding: var(--btn-py) var(--btn-px);
    border-radius: 6px;
    border: 3px solid rgba(var(--w-clr), .56);
    -webkit-transition: 200ms ease;
    transition: 200ms ease;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

@media (hover:hover) and (pointer:fine) {
    .home__play:hover {
        -webkit-transform: scale(1.025);
        transform: scale(1.025);
        /* border: 3px solid rgba(var(--o-clr), 1) */
    }
}

.home__play:active {
    -webkit-transform: scale(.985);
    transform: scale(.985)
}

.home__play span {
    font-size: 1rem;
    letter-spacing: .125rem;
    font-weight: 600;
    color: rgba(var(--w-clr), 1);
    font-family: var(--ff)
}

.home__play img {
    height: 2.625rem
}

.home__play-inner,
.world__item-descr p {
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.home__play span,
.home__play-inner {
    text-shadow: var(--btn-span-shadow);
    text-transform: uppercase
}

.home__play-inner {
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-gap: .0625rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    color: rgba(var(--w-clr), .7);
    font-size: .9375rem;
    font-weight: 700;
    letter-spacing: 2px
}

.top {
    background-size: 100% auto;
    background-position: top left;
    background-repeat: no-repeat
}

@media only screen and (min-width:85.375em) {
    .home {
        background-size: 100% auto;
        --home-px: 9.5%
    }

    .home__container {
        --cont-width: 75%
    }

}



@media only screen and (min-width:40em) {
    .home {
        --quote-author-fz: 1.125rem;
        --play-btn-width: 22.75rem;
        --home-p-bottom: 8.5rem;
        --home-p-top: 11.375rem
    }

    .home::after,
    .home__video {
        display: block
    }

    .home__play span {
        font-size: 1.375rem
    }
}

.world {
    --world-py: 2rem;
    position: relative;
    margin-bottom: -9.375rem
}

.world__body {
    position: relative;
    z-index: 1
}

.world__title {
    margin-bottom: 1.5rem;
    font-weight: 600;
    font-size: 1rem;
    font-family: var(--ff_r);
    letter-spacing: .1875rem;
    text-transform: uppercase
}

.world__grid {
    display: grid;
    grid-template-columns: repeat(var(--world-grid-cols), 1fr);
    grid-gap: var(--world-grid-gutter)
}

.world__grid-item {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: var(--world-item-height);
    -webkit-transition: 200ms ease;
    transition: 200ms ease;
    will-change: transform;
    position: relative;
    border-bottom: 2px solid rgba(var(--world-border-clr), 1);
    overflow: hidden
}

.world__grid-item::after,
.world__grid-item::before {
    position: absolute;
    content: "";
    left: 0;
    width: 100%;
    height: 100%
}

.world__grid-item::before {
    background-image: var(--world-item-gradient);
    top: 0;
    -webkit-transition: 400ms ease;
    transition: 400ms ease
}

.world__grid-item::after {
    opacity: 0;
    bottom: 0;
    background-image: var(--world-item-hidden-gradient);
    -webkit-transition: 400ms ease;
    transition: 400ms ease;
    -webkit-transition-delay: 150ms;
    transition-delay: 150ms
}

@media (hover:hover) and (pointer:fine) {
    .world__grid-item:hover {
        -webkit-transform: scale(1.015);
        transform: scale(1.015);
        border-bottom: 2px solid rgba(var(--o-clr), 1)
    }

    .world__grid-item:hover::before {
        opacity: 0
    }

    .world__grid-item:hover::after {
        height: 100%;
        opacity: 1
    }
}

.world__grid-link {
    width: 100%;
    height: 100%;
    padding: var(--world-item-py) var(--world-item-px) 1rem var(--world-item-px);
    position: relative;
    z-index: 1;
    display: grid;
    place-items: flex-end
}

.world__item-date {
    color: rgba(var(--w-clr), .7);
    font-size: .9375rem;
    font-family: var(--ff_j);
    text-transform: uppercase;
    margin-bottom: .125rem;
    letter-spacing: .0625em
}

.world__item-heading {
    font-weight: 700;
    font-size: var(--world-item-heading-fz);
    text-shadow: var(--world-heading-shadow)
}

.world__item-descr {
    height: 0;
    opacity: 0;
    -webkit-transition: 400ms ease 75ms;
    transition: 400ms ease 75ms
}

.world__item-descr p {
    -webkit-line-clamp: 4;
    overflow: hidden;
    font-size: 1rem;
    margin-top: .4375rem;
    color: rgba(var(--w-clr), .7)
}

@media only screen and (min-width:40em) {
    .world__item-descr p {
        font-size: 1rem
    }
}

@media only screen and (max-width:75em) {
    .world__grid-item::before {
        opacity: 0
    }

    .world__grid-item::after {
        opacity: .6;
        height: 100%
    }

    .world__item-descr {
        height: 100% !important;
        opacity: 1 !important
    }

    .world__item-descr p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden
    }
}

@media only screen and (min-width:85.375em) {
    .world::before {
        height: 100%
    }
}

.promo {
    --promo-btn-px: 1.5rem;
    --promo-btn-py: 1.125rem;
    margin-top: 5rem;
    min-height: var(--promo-height);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: grid;
    place-items: flex-start;
    padding-bottom: var(--promo-section-mb)
}

.promo__container {
    --cont-width: 91.875rem
}

.promo__body {
    text-align: center;
    letter-spacing: .125rem
}

.promo__title {
    font-size: var(--promo-title-fz);
    line-height: 110%;
    text-transform: uppercase;
    color: rgba(var(--w-clr), 1);
    margin-bottom: var(--promo-title-m)
}

.promo__title>span {
    display: block;
    font-size: var(--promo-title-span-fz);
    color: rgba(var(--w-clr_300), .56)
}

.promo__info {
    margin-bottom: 2.75rem
}

.promo__info p {
    font-size: var(--promo-info-fz);
    line-height: 146%
}

.promo__play {
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    border-radius: 6px;
    border: 3px solid rgba(var(--w-clr), .56);
    -webkit-transition: 200ms ease;
    transition: 200ms ease;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    padding: var(--promo-btn-py) var(--promo-btn-px)
}

@media (hover:hover) and (pointer:fine) {
    .promo__play:hover {
        -webkit-transform: scale(1.025);
        transform: scale(1.025);
        /* border: 3px solid rgba(var(--o-clr), 1) */
    }
}

.promo__play:active {
    -webkit-transform: scale(.985);
    transform: scale(.985)
}

.menu__play span,
.promo__play span {
    letter-spacing: .125rem;
    font-weight: 600;
    color: rgba(var(--w-clr), 1);
    text-transform: uppercase
}

.promo__play span {
    font-size: var(--btn-span-fz);
    line-height: 145%
}

@media only screen and (min-width:40em) {
    .promo {
        --promo-btn-py: 1.375rem;
        --promo-btn-px: 1.875rem
    }
}

@media only screen and (min-width:75em) {
    .promo {
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end
    }
}

@media only screen and (min-width:120em) {
    .promo {
        background-position: top left
    }
}

.footer {
    min-height: 1rem;
    --footer-info-gap: 2.75rem;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

.footer__body {
    color: rgba(var(--w-clr), .8);
    padding: var(--footer-py-2) 0 var(--footer-py-1) 0
}

.footer__row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-gap: 1.5rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.footer__rights {
    font-size: 1rem
}

.footer__links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    grid-gap: 1rem 2.5rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.footer__links a {
    -webkit-transition: 300ms ease;
    transition: 300ms ease
}

@media (hover:hover) and (pointer:fine) {
    .footer__links a:hover {
        color: rgba(var(--w-clr), 1)
    }
}

@media only screen and (min-width:75em) {
    .footer__row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    .footer__rights {
        font-size: 1.375rem
    }

    .footer {
        --footer-info-gap: 4.5rem
    }
}

.menu {
    --menu-width: 18.75rem;
    --menu-cont-px: 1rem;
    --menu-cont-py: 3rem;
    --menu-nav-link-fz: 1.125rem;
    --link-transition: cubic-bezier(0.35, 0, 0.07, 1);
    --close-btn-ratio: 1.5rem;
    --close-span-height: 0.1875rem;
    position: fixed;
    top: 0;
    right: 0;
    width: var(--menu-width);
    height: 100%;
    -webkit-transition: 300ms ease;
    transition: 300ms ease;
    z-index: 4;
    background-color: rgba(var(--b-clr), 1);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    visibility: hidden;
    border-left: 1px solid rgba(var(--w-clr), .25)
}

.menu__container {
    height: 100%;
    padding: var(--menu-cont-py) var(--menu-cont-px);
    position: relative
}

.menu__play {
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    padding: var(--btn-py) var(--btn-px);
    border-radius: 6px;
    border: 3px solid rgba(var(--w-clr), .56);
    -webkit-transition: 200ms ease;
    transition: 200ms ease
}

@media (hover:hover) and (pointer:fine) {
    .menu__play:hover {
        -webkit-transform: scale(1.025);
        transform: scale(1.025);
        /* border: 3px solid rgba(var(--o-clr), 1) */
    }
}

.menu__play:active {
    -webkit-transform: scale(.985);
    transform: scale(.985)
}

.menu__play span {
    font-size: 1.125rem
}

.menu__close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: var(--close-btn-ratio);
    height: var(--close-btn-ratio)
}

.menu__close span {
    --rotation: 0;
    display: block;
    position: absolute;
    width: 100%;
    height: var(--close-span-height);
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(var(--rotation));
    transform: translate(-50%, -50%) rotate(var(--rotation));
    border-radius: .25rem;
    background-color: rgba(var(--w-clr), 1)
}

.menu__close span:nth-child(1) {
    --rotation: 45deg
}

.menu__close span:nth-child(2) {
    --rotation: -45deg
}

.menu-nav__link {
    text-transform: uppercase;
    font-size: var(--menu-nav-link-fz)
}

.menu-nav__current,
.menu-nav__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: .625rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.menu-nav__list {
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-gap: .75rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    overflow: hidden
}

.menu-nav__list-second {
    margin-top: 60px;
}

.menu-nav__dropdown {
    max-height: 0;
    opacity: 0;
    -webkit-transition: 300ms ease;
    transition: 300ms ease;
    overflow: hidden
}

@media only screen and (min-width:40em) {
    .menu {
        --menu-width: 100%;
        --menu-cont-px: 2rem;
        --menu-cont-py: 5rem;
        --menu-nav-link-fz: 1.75rem;
        --close-btn-ratio: 2.5rem;
        --close-span-height: 0.25rem;
        border-left: none
    }

    .menu__inner {
        width: 100%
    }

    .menu__container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100%
    }

    .menu__close {
        top: 1.5rem;
        right: 1.5rem;
        -webkit-transition: 400ms ease;
        transition: 400ms ease;
        -webkit-transition-delay: 600ms;
        transition-delay: 600ms;
        opacity: 0;
        -webkit-transform: translateY(-.625rem);
        transform: translateY(-.625rem)
    }

    .menu__dropdown ul {
        padding-left: 1rem
    }

    .menu-nav__list {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        grid-gap: 2rem;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .menu-nav__item {
        opacity: 0;
        -webkit-transform: translateY(.75rem);
        transform: translateY(.75rem)
    }

    .menu-nav__item:nth-of-type(1) {
        -webkit-transition: all 400ms var(--link-transition) .1s;
        transition: all 400ms var(--link-transition) .1s
    }

    .menu-nav__item:nth-of-type(2) {
        -webkit-transition: all 400ms var(--link-transition) .2s;
        transition: all 400ms var(--link-transition) .2s
    }

    .menu-nav__item:nth-of-type(3) {
        -webkit-transition: all 400ms var(--link-transition) .3s;
        transition: all 400ms var(--link-transition) .3s
    }

    .menu-nav__item:nth-of-type(4) {
        -webkit-transition: all 400ms var(--link-transition) .4s;
        transition: all 400ms var(--link-transition) .4s
    }

    .menu-nav__item:nth-of-type(5) {
        -webkit-transition: all 400ms var(--link-transition) .5s;
        transition: all 400ms var(--link-transition) .5s
    }
}

.show-menu {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
    opacity: 1
}

.show-links .menu-nav__item,
.show-menu .menu__close {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.active-dropdown .menu-nav__dropdown {
    padding-top: .25rem
}

.active-dropdown .menu-nav__arrow {
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.modal,.modal-terms, .modal-policy,
.modal__close>svg {
    -webkit-transition: 200ms ease;
    transition: 200ms ease
}

.modal, .modal-terms, .modal-policy {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    background-color: var(--modal-overlay-bg);
    overflow-y: scroll;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    border: 1px solid rgba(var(--w-clr), .1)
}

.modal__container {
    padding: 1rem;
    display: grid;
    place-items: center;
    height: 100%
}

.modal__body {
    position: relative;
    background: var(--modal-bg);
    max-width: var(--modal-body-width);
    width: 100%;
    border-top: 3px solid #1f3347;
    padding: var(--modal-padding-y) var(--modal-padding-x);
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transition: 300ms ease 200ms;
    transition: 300ms ease 200ms
}

.modal__inner,
.modal__step {
    width: 100%
}

.modal__close,.modal__closeTerms,.modal__closePolicy {
    position: absolute;
    top: var(--modal-padding-y);
    right: var(--modal-padding-x);
    z-index: 2
}

.modal__close>svg {
    fill: rgba(var(--w-clr), .4)
}

@media (hover:hover) and (pointer:fine) {
    .modal__close:hover>svg {
        fill: rgba(var(--w-clr), 1)
    }
}

.modal__step-name {
    font-size: clamp(1rem, 1.125vw, 1.125rem);
    margin-bottom: 1.5rem;
    text-transform: uppercase;
    letter-spacing: .125rem;
    font-weight: 600
}

.modal__step-name>span {
    opacity: .6
}

.modal__step-name--last span:nth-child(2) {
    color: #fee893;
    opacity: 1
}

.modal__heading {
    text-align: center;
    font-size: clamp(1.125rem, 1.5vw, 1.5rem);
    margin-bottom: clamp(1.5rem, 2.125vw, 2.125rem);
    padding-bottom: clamp(1.25rem, 2.5vw, 2.5rem);
    border-bottom: 3px solid #16212c;
    text-transform: uppercase
}

.modal__grid-item {
    display: none;
}

.modal__grid-item--active {
    display: block;
}

.modal__tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr)
}

.modal__tabs-item {
    font-size: .625rem;
    letter-spacing: .02rem;
    padding: 0 .375rem;
    height: 2.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: rgba(var(--w-clr), .5);
    text-transform: uppercase;
    cursor: pointer;
    -webkit-transition: 300ms ease;
    transition: 300ms ease
}

.modal__tabs-item--active {
    background: rgba(19, 28, 39, .6);
    /* border-top: 3px solid #1f3347; */
    color: rgba(var(--w-clr), 1);
    position: relative;
}

.modal__tabs-item--active::after {
    content: "";
    top: -3px;
    left: 0px;
    height: 1px;
    width: 100%;
    position: absolute;
    border-top: 3px solid #1f3347;
}

@media (hover:hover) and (pointer:fine) {
    .modal__tabs-item:not(.modal__tabs-item--active):hover {
        color: rgba(var(--w-clr), .8)
    }
}

.modal__grid-name {
    text-transform: uppercase;
    font-size: clamp(1rem, 1.125vw, 1.125rem);
    margin-bottom: .2rem
}

.modal__grid-descr {
    font-size: .75rem;
    font-family: var(--ff_j);
    text-transform: uppercase;
    letter-spacing: .0175rem;
    color: rgba(var(--w-clr), .6);
    min-height: 1.25rem;
    padding-bottom: .75rem;
    border-bottom: 3px solid #131c27
}

.modal__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-gap: var(--modal-inner-gutter);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.modal__contact-block {
    text-transform: uppercase;
    font-size: .875rem;
    font-weight: 600;
    color: rgba(var(--w-clr), .8)
}

.modal__contact-block a {
    color: #4a637b
}

@media (hover:hover) and (pointer:fine) {
    .modal__contact-block a:hover {
        text-decoration: underline
    }
}

.modal__register {
    min-width: 19.875rem;
    max-width: 19.875rem;
    margin-left: auto;
    margin-right: auto;
    border: 2px solid #60a94e !important;
    font-family: var(--ff) !important
}

.modal__flex,
.modal__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr)
}

.modal__grid {
    grid-gap: 2rem;
    padding: clamp(1rem, 2.5vw, 2.5rem);
    border: 3px solid #131c27
}

.modal__flex {
    grid-gap: .625rem .875rem;
    margin-top: 1.25rem
}

.modal__flex-link {
    white-space: nowrap;
    padding: .3125rem 0.25rem !important;
    border: 2px solid rgba(var(--w-clr), .2) !important;
    grid-gap: .625rem
}

.modal__flex-link img {
    max-width: 1.25rem
}

.modal__flex-link>span {
    line-height: 1.4375rem;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.modal__flex-link:not(.modal__flex-link--fluid) span {
    max-width: 9.75rem
}

.modal__flex-link--fluid {
    grid-column: span 2
}

.modal__flex-link--fluid>span {
    max-width: 13.625rem
}

.modal__path {
    font-family: "Segoe UI", sans-serif;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: var(--modal-path-gutter);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: .625rem;
    border: 1px solid #4a637b;
    margin-left: auto;
    margin-right: auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-size: .75rem;
    border-radius: .25rem
}

.modal__path span,
.modal__path-item {
    display: grid;
    place-items: center
}

.modal__path-item img,
.modal__path-item svg {
    max-width: 1rem
}

@media only screen and (max-width:75em) {
    .modal__grid {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 100%
    }
}

@media only screen and (min-width:75em) {
    .modal__path {
        padding: .62rem 1.75rem
    }

    .modal__tabs-item {
        font-size: .875rem
    }
}

@media only screen and (max-width:40em) {
    .modal__path {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .modal__container {
        padding: 0
    }

    .modal__flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .modal__body {
        max-width: 100%;
        height: 100%
    }
}

.show-modal {
    opacity: 1;
    visibility: visible;
    pointer-events: all
}

.show-modal .modal__body {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.button {
    font-family: var(--ff_i);
    font-size: var(--btn-fz);
    line-height: var(--btn-lh);
    text-transform: uppercase;
    border: var(--btn-border-width) solid rgba(var(--w-clr), .6);
    padding: var(--btn-p-y_large) var(--btn-p-x_large)
}

.button,
.modal__flex-link,
.modal__register {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    font-weight: var(--btn-fw);
    color: rgba(var(--w-clr), 1);
    border-radius: var(--btn-radius);
    -webkit-transition: 200ms ease;
    transition: 200ms ease
}

.button--small,
.modal__flex-link,
.modal__register {
    padding: var(--btn-p-y_small) var(--btn-p-x_small)
}

.button--modal {
    font-family: var(--ff_j);
    border: var(--btn-border-width) solid rgba(var(--w-clr), .2)
}

.button--modal,
.modal__flex-link,
.modal__register {
    font-size: var(--btn-fz_modal);
    font-weight: 500;
    line-height: var(--btn-lh_modal);
    letter-spacing: .0175rem;
    text-transform: uppercase
}

.modal__register {
    border: var(--btn-border-width) solid rgba(var(--w-clr), .2)
}

.modal__flex-link {
    font-family: var(--ff_j)
}

@media (hover:hover) and (pointer:fine) {

    .button:hover,
    .modal__flex-link:hover,
    .modal__register:hover {
        border: var(--btn-border-width) solid rgba(var(--o-clr), 1);
        -webkit-transform: scale(1.015);
        transform: scale(1.015)
    }
}

.button:active,
.modal__flex-link:active,
.modal__register:active {
    -webkit-transform: scale(.97);
    transform: scale(.97)
}

.servers {
    --server-grid-cols: 1;
    --server-grid-gap: clamp(3.25rem, 4.375vw, 4.375rem);
    --server-block-clr: 8, 17, 24;
    --server-top-block-clr: 15, 29, 39;
    --server-block-radius: 0.75rem;
    --block-top-py: 1.75rem;
    --block-top-px: 1rem;
    --inner-py: 1.25rem;
    --inner-px: 1rem;
    --block-image-w: 17.125rem;
    --online-block-clr: 29, 155, 240;
    --grn-clr: 23, 191, 111;
    --bar-h: 0.5rem;
    --bar-filled-gradient: linear-gradient(270deg, #FFB800 0%, #FF2929 100%);
    --bar-clr: 22, 32, 44;
    --text-block-heading: 1.75rem;
    --text-block-info: 0.875rem;
    --section-mb: 5.125rem;
    margin-bottom: var(--section-mb)
}

.servers__wrapper {
    display: grid;
    grid-template-columns: repeat(var(--server-grid-cols), 1fr);
    grid-gap: var(--server-grid-gap);
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.servers__block {
    background-color: rgba(var(--server-block-clr), 1);
    border-radius: var(--server-block-radius)
}

.servers__block:nth-child(1) .servers__block-top::before {
    background-image: url(../img/servers/interlude-block-bg.jpg);
    opacity: .1
}

.servers__block:nth-child(2) .servers__block-top::before {
    background-image: url(../img/servers/essence-block-bg.jpg);
    opacity: .3
}

.servers__block-heading {
    font-size: var(--text-block-heading);
    font-weight: 700;
    line-height: 2.5rem;
    margin-bottom: 1.25rem;
    position: relative;
    z-index: 1
}

.servers__block-info {
    font-size: var(--text-block-info);
    font-weight: 400;
    color: rgba(var(--w-clr), .8);
    position: relative;
    z-index: 1
}

.servers__block-top {
    padding: var(--block-top-py) var(--block-top-px);
    border-radius: .375rem;
    background-color: rgba(var(--server-top-block-clr));
    position: relative
}

.servers__block-top::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: inherit
}

.servers__block-image {
    position: absolute;
    right: 0;
    bottom: 0;
    max-width: var(--block-image-w);
}

.servers__block-image--essence {
    max-width: 18.875rem;
    bottom: 0;
}

.servers__block-image img,
.servers__block-image picture,
.servers__block-image svg {
    height: 100%;
    width: 100%
}

.servers__block-inner {
    /* padding: var(--inner-py) var(--inner-px) */
}

.servers__name {
    font-size: 1.125rem;
    font-weight: 700;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.servers__col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-gap: .875rem;
    z-index: 1;

    position: relative;
}

.servers__bar {
    height: var(--bar-h);
    position: relative;
    border-radius: .375rem;
    overflow: hidden;
    background-color: rgba(var(--bar-clr), 1)
}

.servers__bar-filled {
    position: absolute;
    border-radius: inherit;
    height: 100%;
    top: 0;
    left: 0;
    background-image: var(--bar-filled-gradient)
}

.servers__links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    grid-gap: 1rem 1rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.servers__links a {
    color: rgba(var(--w-clr));
    font-size: .75rem;
    -webkit-transition: 300ms ease;
    transition: 300ms ease;
    text-decoration: underline;

    /* padding: 0.25rem 0.75rem;
    border-radius: var(--server-block-radius);
    background-color: #0F1E2C;*/
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

/* @media (hover:hover) and (pointer:fine) {
    .servers__links a:hover {
        background-color: #142635;
    }
} */

/* .servers__box:not(:last-child) {
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    border-bottom: 1px solid #0e161e;
} */

.servers__box {
    position: relative;
    padding: var(--inner-py) var(--inner-px);
}

.servers__box:nth-child(even)::after {
    content: "";
    background-color: #0A151F;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    border-radius: 12px;
}

.properties,
.properties__item,
.servers__row--flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.servers__row--flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    grid-gap: .875rem;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.properties,
.properties__item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.properties {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 1rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.properties__item {
    padding: .25rem .75rem;
    border-radius: var(--server-block-radius);
    background-color: rgba(var(--prop-item-clr), 1);
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

.properties__item span {
    font-size: .75rem;
    font-weight: 700
}

.properties__online {
    --prop-item-clr: var(--online-block-clr)
}

.properties__state--up {
    --prop-item-clr: var(--grn-clr)
}

.properties__state--down {
    --prop-item-clr: var(--r-clr)
}

@media only screen and (min-width:40em) {
    .servers__block-image {
        top: -5.35rem;
    }

    .servers__block-image--essence {
        top: -6.21rem;
    }

    .servers {
        --text-block-heading: 2rem;
        --text-block-info: 1rem;
        --section-mb: 8.5rem
    }

    .servers__row--flex {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    .servers__box:not(:last-child) {
        /* margin-bottom: 2.25rem */
    }
}

@media only screen and (min-width:75em) {
    .servers {
        --block-top-py: 2rem;
        --block-top-px: 2rem;
        --text-block-info: 1.125rem;
        --text-block-heading: 2.625rem;
        --server-grid-cols: 2
    }

    .servers__block-image {
        display: block;
        top: -4.5rem;
    }

    .servers__block-image--essence {
        top: -5.33rem;
    }
}

.streams {
    --streams-grid-gap: 2rem;
    --streams-item-h: 16.5rem;
    --streams-item-clr: 8, 16, 24;
    --streams-border-clr: 20, 41, 63;
    --add-btn-ratio: 2rem;
    position: relative
}

.streams__row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18.75rem, 1fr));
    grid-gap: var(--streams-grid-gap)
}

.streams__row-item {
    background-color: rgba(var(--streams-item-clr), .75);
    border: 1px solid rgba(var(--streams-border-clr), 1);
    border-radius: .375rem;
    min-height: var(--streams-item-h);
    cursor: pointer;
    position: relative;
    -webkit-transition: 200ms ease;
    transition: 200ms ease
}

@media (hover:hover) and (pointer:fine) {
    .streams__row-item:hover {
        border: 1px solid rgba(var(--w-clr), .25);
        -webkit-transform: scale(1.015);
        transform: scale(1.015)
    }
}

.streams__heading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-gap: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1.875rem
}

.streams__add-stream {
    padding: .625rem 2.25rem;
    -webkit-transition: 200ms ease;
    transition: 200ms ease;
    border: 1px solid rgba(var(--w-clr), .6);
    border-radius: .375rem
}

@media (hover:hover) and (pointer:fine) {
    .streams__add-stream:hover {
        /* border: 1px solid rgba(var(--w-clr), 1) */
        transform: scale(1.025);
    }
}

.streams__add-stream span {
    font-weight: 600;
    color: rgba(var(--w-clr), 1);
    text-transform: uppercase;
    letter-spacing: .25rem
}

.streams__title {
    letter-spacing: .2rem;
    font-size: 1.125rem;
    text-transform: uppercase;
    font-weight: 600
}

.streams__video-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.streams__video-container iframe,
.streams__video-container video {
    width: 100% !important;
    height: 100% !important
}

.streams__add-btn,
.streams__add-btn span {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.streams__add-btn {
    width: var(--add-btn-ratio);
    height: var(--add-btn-ratio)
}

.streams__add-btn span {
    display: block;
    border-radius: .5rem;
    background-color: rgba(var(--streams-border-clr), 1)
}

.streams__add-btn span:nth-child(1) {
    width: 100%;
    height: .1875rem
}

.streams__add-btn span:nth-child(2) {
    width: .1875rem;
    height: 100%
}

@media only screen and (min-width:40em) {
    .streams {
        --streams-grid-gap: 3.375rem;
        --streams-item-h: 12.5rem
    }

    .streams__heading {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.no-underline {
    text-decoration: none !important;
}

.term-title {
    margin-bottom: 40px;
}

.term p {
    color: rgba(255, 255, 255, 0.8);
    line-height: 25px;
    padding: 5px 0;
}

.term a {
    color: #fff;
    text-decoration: underline;
}

.term ul, .term li {
    list-style: inside;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.7;
}

.term ul, .term li, .term p {
    letter-spacing: 0px;
}

.text-area p {
    margin: 1rem 0;
}
.text-page {
    padding: 10rem 0 14rem 0;
}
.text-page {
    padding: 10rem var(--cont-px, 1rem) 14rem var(--cont-px, 1rem);
}
/*# sourceMappingURL=style.min.css.map */