@charset "UTF-8"; /*** The new CSS reset - version 1.9 (last updated 19.6.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable="false"])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable="true"]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } body { outline: none; margin: 0; padding: 0; background: #000; } html { scroll-behavior: smooth; font-family: 'Montserrat', sans-serif; height: 100vh; } @font-face { font-family: Tongari; src: url("./../fonts/Tongari/Tongari-Regular.otf"); font-weight: 400; } @font-face { font-family: Tongari; src: url("./../fonts/Tongari/Tongari-Bold.otf"); font-weight: 700; } a { cursor: pointer; } * { box-sizing: border-box; font-optical-sizing: auto; color: #fff; font-family: 'Montserrat', sans-serif; } main { position: relative; max-width: 100%; overflow: hidden; background: black; } .text-main { color: #CCC; text-align: center; font-family: Lato, sans-serif; font-size: var(--font-size-450, 18px); font-style: normal; font-weight: var(--font-weight-regular, 400); line-height: var(--font-line-height-700, 28px); letter-spacing: var(--font-letter-spacing-default, 0px); } .text-main b { color: #CCC; font-weight: 700; font-family: Lato, sans-serif; } .heading-first { align-items: center; color: #FFF; text-align: center; font-family: 'Montserrat', sans-serif; font-size: 64px; font-style: normal; font-weight: 400; line-height: 108%; } .under-btn-text { display: block; margin-top: 10px; position: relative; color: #ccc; text-align: center; leading-trim: both; text-edge: cap; font-family: Lato, sans-serif; font-size: 16px; font-style: normal; font-weight: 400; line-height: 150%; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; transition: all .2s ease-in-out; } .under-btn-text:hover { color: #fff; } .heading-second { color: #fff; text-align: center; font-family: 'Montserrat', sans-serif; font-size: 48px; font-style: normal; font-weight: 700; line-height: 116%; } .download-btn { transition: .3s ease-in-out; } .download-btn.mob { display: none; } .download-btn.orange { display: flex; justify-content: center; align-items: center; color: #FFF; text-align: center; font-size: 16px; text-transform: uppercase; background-color: #EB622B; text-align: center; font-weight: 500; line-height: 24px; max-width: 244px; height: 48px; margin: 0 auto; padding: 11px 30px; white-space: nowrap; position: relative; letter-spacing: 1px; } .download-btn.orange:hover { background: #F18536; } .download-btn.orange svg { height: 24px; min-width: 24px; margin-right: 12px; } .large-section { position: relative; display: flex; flex-direction: column; align-items: center; max-width: 100%; background-size: 100%; } .glow-large { position: absolute; width: 840px; height: 840px; } .glow-large.left { left: -70%; } .glow-large.left.one { top: 1400px; left: -640px; } .glow-large.left.two { bottom: 782px; left: -640px; } .glow-large.right.one { top: 1400px; right: -640px; } .glow-large.right.two { right: 0; bottom: 782px; right: -640px; } @keyframes bounce { 0%, 20%, 48%, 80%, 100% { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } 40% { -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes rotate { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } } @keyframes fadeInBottomToTopSoft { 0% { transform: translatey(20px); opacity: 0; } 100% { transform: translatey(0); opacity: 1; } } .terms-link.uppercase { text-transform: uppercase; } .hero-bg.desktop { display: flex; width: 100%; } .hero-bg.mob { display: none; } .to-top { display: flex; flex-direction: column; align-items: center; margin: 13px auto 0; color: #DFDFDF; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 500; line-height: normal; background-color: #000; font-weight: 500; line-height: var(--font-line-height-3, 24px); letter-spacing: var(--font-letter-spacing-regular, 1.2px); text-transform: uppercase; } .to-top svg { width: 24px; height: 24px; margin: 0 0 10px; } .to-top-section { display: flex; justify-content: center; max-width: 500px; margin: 0 auto; } .to-top-section .content-wrapper { position: relative; padding-top: 0px; z-index: 3; } html, body { background-color: #000; } :root { --color-bg: #0d0d0d; --color-title: #fff; --color-small-title: #e5e5e5; --color-txt: #ccc; --color-title-black: #1e1e1e; --color-txt-black: #535353; --color-txt-gray: #b2b2b2; --color-txt-gray-2: #b5b5b5; --color-gray: #909090; --color-300: #333; --color-primary: #eb622b; --color-primary-hover: #f18536; } header { position: fixed; top: 0; left: 0; width: 100%; padding: 0; opacity: 1; z-index: 27; height: 72px; } header * { box-sizing: border-box; font-family: 'Montserrat', sans-serif; color: #fff; } header ol, header ul, header menu { list-style: none; } header .content-wrapper { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 100%; margin: 0 auto; padding: 15px 20px; } header .download-buttons { margin: 0; } .header-container { position: relative; z-index: 2; width: 100%; background: transparent; } .header-container::before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(16, 16, 16, 0.8); background-blend-mode: luminosity; backdrop-filter: blur(17.5px); background-blend-mode: darken; } .header-link { display: flex; align-items: center; margin: 0 20px; padding: 7px 0; color: #DFDFDF; text-align: center; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 500; line-height: 140%; border: 1px solid transparent; background: transparent; transition: .3s ease-in-out; white-space: nowrap; cursor: pointer; } .header-link.border { margin-right: 0; border: 1px solid #9F9F9F; padding: 9px 24px; } .header-link.border:hover { color: #fff; background: #EB622B; border: 1px solid #EB622B; } .header-link.orange { color: #FFF; text-align: center; font-size: 16px; text-transform: uppercase; background-color: #EB622B; text-align: center; font-weight: 500; line-height: 24px; max-width: 255px; margin: 0 auto; padding: 11px 30px; white-space: nowrap; position: relative; letter-spacing: 1px; } .header-link.orange:hover { background: #F18536; } .header-link.orange svg { height: 24px; margin-right: 12px; } .header-link-container { display: none; flex-grow: 1; } .header-link.mob { position: relative; display: none; } .header-link.mob::before { position: absolute; top: 50%; left: 0; width: 4px; height: 24px; transform: translateY(-50%); content: ''; background-color: #EB622B; opacity: 0; height: 0; transition: .2s ease-in-out; } .header-link.mob.active::before { opacity: 1; height: 24px; } .header-link.mob :hover { color: #D6D6D6; } .header-buttons { display: flex; flex-direction: row; } .header-logo { display: flex; align-items: center; z-index: 10; } .header-logo.desktop { display: flex; } .header-logo.mob { display: none; } .header-logo img { width: 363px; margin-right: 12px; } .header-logo span { display: inline-flex; position: relative; margin-left: 12px; margin-top: 6px; color: #DFDFDF; font-size: 16px; font-weight: 600; line-height: 24px; } .header-logo span::before { top: 50%; margin-top: -3px; transform: translateY(-50%); content: ""; width: 1px; height: 24px; background-color: var(--color-txt); position: absolute; left: -11px; } .site-header { width: 100%; position: fixed; top: 0; z-index: 100; transition: .3s; } .site-header.black { background: var(--color-surface-pure, #000); background-blend-mode: darken; } .site-header.black .header-container::before { background: var(--color-surface-pure, #000); background-blend-mode: darken; } .site-header .download-btn { padding: 16px 32px; } .site-header .header-inner { display: flex; max-width: 100%; margin: 0 auto; padding: 15px 14px 9px 16px; position: relative; z-index: 10; transition: .3s; min-height: 74px; align-items: flex-start; } .site-header .header-inner nav { margin-left: auto; display: flex; align-items: center; } .site-header .header-inner nav ul li { margin: 0 3.5px; } .site-header .header-inner nav ul li:last-of-type { margin-left: 18px; margin-right: 6px; } .site-header .header-inner nav ul li.mob-only.decor a { font-size: 16px; font-weight: 600; line-height: 24px; } .site-header .header-inner nav ul.header-menu { display: flex; } .site-header .hamburger-menu-button { display: none; margin-left: 12px; } .hamburger-menu-button { z-index: 1; display: block; background: transparent; width: 24px; height: 24px; outline: none; border: none; cursor: pointer; padding: 0; } .hamburger-menu-button > div { position: relative; width: 24px; height: 20px; left: 2px; right: 0; margin: 0 auto; transition: .4s ease-in-out; } .hamburger-menu-button > div span { background: #fff; display: block; width: 100%; max-width: 20px; height: 2px; position: absolute; transition: .4s ease-in-out; border-radius: 0; } .hamburger-menu-button > div span:first-child { top: 3px; left: 0; } .hamburger-menu-button > div span:nth-child(2) { top: 9px; left: 0; } .hamburger-menu-button > div span:nth-child(3) { top: 15px; left: 0; } .hamburger-menu-button.close > div span { background: #DFDFDF; } .hamburger-menu-button.close > div span:first-child { transform: translateY(4px) rotate(45deg); } .hamburger-menu-button.close > div span:nth-child(2) { transform: scaleX(0); } .hamburger-menu-button.close > div span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); } .site-header .header-inner nav .header-menu .header-menu-inner { max-height: 0; overflow: hidden; transition: max-height .2s ease-out; position: relative; } .opening-section { max-width: 100%; background-position: top; background-attachment: fixed; background-size: cover; background-repeat: no-repeat; position: relative; padding: 75px 0px 0; background: url("./../images/ToSBG.webp") no-repeat 50% 100%; background-size: cover; transform: translate3d(0, 0, 0); } .opening-section .first-layer { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .opening-section .heading-first { max-width: 700px; margin: 34px auto 0; } .opening-section .hero-video-loop { position: absolute; width: auto; } .opening-section .hero-video-loop.bg { position: absolute; bottom: 0; top: unset; width: 100%; mix-blend-mode: lighten; transform: translate3d(0, 0, 0); } .opening-section .hero-glow { position: absolute; top: 0; } .opening-section .hero-glow.left { top: 0; left: 0; } .opening-section .hero-glow.right { right: 0; } .opening-section .hero-decor-divider { height: 152px; z-index: 1; opacity: 0; animation: .4s 1.5s forwards fadeInBottomToTopSoft; margin: 22px 0 0; } .opening-section .hero-decor-divider.mob { display: none; } .opening-section * { box-sizing: border-box; } .opening-section .intro-text-container { width: 100%; max-width: 1206px; margin: 0 auto; position: relative; z-index: 10; padding: 5px 20px 0; } .opening-section .intro-text-content { display: flex; flex-direction: column; align-items: center; } .opening-section { display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between; } .opening-section .download-buttons { display: flex; justify-content: flex-start; margin: 33px auto 0; } .opening-section .download-buttons + .txt-small { text-decoration: underline; transition: .2s ease-in-out; } .opening-section .download-buttons + .txt-small:hover { color: #fff; } .opening-section .download-buttons div:not(:first-child) { position: relative; margin-left: 22px; } .opening-section .download-buttons .desktop { display: flex; } .opening-section .download-buttons .download-btn { margin: 0; } .opening-section .download-btn { opacity: 0; animation: .4s 1.2s forwards fadeInBottomToTopSoft; } .opening-section .under-btn-text { margin-top: 10px; opacity: 0; animation: .4s 1.3s forwards fadeInBottomToTopSoft; } @keyframes a { 0% { transform: scale(1); } to { transform: scale(0.8); } } .terms-section { position: relative; } .terms-section .content-wrapper { position: relative; display: flex; justify-content: center; width: 100%; max-width: 864px; margin: 104px auto; padding: 0 20px; } .terms-section .terms-container { display: block; margin: 0 auto; } .terms-section .heading-third { margin: 0 0 16px; color: #D6D6D6; font-family: Lato, sans-serif; font-size: 18px; font-style: normal; font-weight: 700; line-height: 28px; text-transform: uppercase; } .terms-section .heading-third.underline { margin: 46px 0 14px; text-decoration: underline; } .terms-section .terms-text { margin-bottom: 16px; color: #D6D6D6; font-family: Lato, sans-serif; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; letter-spacing: 0px; } .terms-section .terms-text b { font-weight: 700; font-family: Lato, sans-serif; } .terms-section .terms-text + .heading-third { position: relative; margin: 44px 0 9px; } .terms-section .terms-text + .heading-third.underline { margin: 46px 0 14px; } .terms-section .terms-list { padding-left: 46px; margin: 16px 0; padding-left: 26px; color: #D6D6D6; font-family: Lato, sans-serif; font-size: 18px; font-weight: 400; line-height: 28px; list-style: disc; } .terms-section .terms-list.dec { list-style: decimal; } .terms-section .terms-list li { color: #D6D6D6; font-family: Lato, sans-serif; font-size: 18px; font-weight: 400; line-height: 28px; } .terms-section .terms-list li b { color: #D6D6D6; font-family: Lato, sans-serif; font-size: 18px; line-height: 28px; font-weight: 700; } .terms-section .terms-list + .heading-third { position: relative; font-family: Lato, sans-serif; margin: 44px 0 9px; } .terms-section .terms-list + .heading-third.underline { margin: 44px 0 15px; } .terms-section .terms-link, .terms-section a { color: #EB622B; font-family: Lato, sans-serif; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; letter-spacing: 0px; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: auto; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .faq-section { position: relative; width: 100%; z-index: 3; background: #000; } .faq-section .content-wrapper { padding: 16px 0 130px; max-width: 882px; width: 100%; margin: auto; } .faq-section .heading-second { margin: 38px auto 5px; } .faq-section .faq-list { list-style: none; padding: 12px 0 0 0; } .faq-section .faq-list li { position: relative; font-size: 18px; font-weight: 400; color: #FFF; font-feature-settings: 'liga' off, 'clig' off; font-size: 18px; font-style: normal; font-weight: 700; line-height: 150%; letter-spacing: 0.18px; border-bottom: 1px solid #404040; } .faq-section .faq-list li a { transition: .2s ease-in-out; } .faq-section .faq-list li a:hover { color: #F18536; } .faq-section .faq-list li .question { font-size: 22px; line-height: 32px; margin: 0; background: transparent; font-weight: 500; width: 100%; text-align: left; padding: 24px 50px 24px 0; border: none; text-transform: inherit; position: relative; transition: all .15s; letter-spacing: 0; cursor: pointer; color: #DFDFDF; } .faq-section .faq-list li .question svg { width: 24px; height: 24px; margin-right: 15px; transition: all .15s; fill: #9f9f9f; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; } .faq-section .faq-list li .question.active + .answer-outer:before { height: 100%; } .faq-section .faq-list li .question.active svg { fill: #fff; transform: rotate(180deg); } .faq-section .faq-list li .answer-outer { max-height: 0; overflow: hidden; transition: max-height .2s ease-out; position: relative; background: var(--color-surface-primary, #101010); } .faq-section .faq-list li .answer-outer .answer-inner { padding: 0 36px; } .faq-section .faq-list li .answer-outer .answer-inner p { padding: 0; margin: 24px 0; max-width: 730px; color: #DFDFDF; font-family: Lato, sans-serif; font-size: var(--font-size-225, 18px); font-style: normal; font-weight: var(--font-weight-regular, 400); line-height: var(--font-line-height-35, 28px); letter-spacing: var(--font-letter-spacing-none, 0px); } .faq-section .faq-list li .answer-outer .answer-inner a { color: #DFDFDF; font-family: Lato, sans-serif; font-family: var(--font-family-default, Lato); font-size: var(--font-size-225, 18px); font-style: normal; font-weight: var(--font-weight-regular, 400); line-height: var(--font-line-height-35, 28px); letter-spacing: var(--font-letter-spacing-none, 0px); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; cursor: pointer; transition: .2s ease-in-out; } .faq-section .faq-list li .answer-outer .answer-inner a:hover { color: #F18536; } .faq-section .faq-list li .answer-outer .answer-inner ul { padding-bottom: 24px; list-style: disc; padding-left: 15px; } .faq-section .decorated-line { position: relative; display: flex; justify-content: center; position: relative; height: 96px; } .faq-section .decorated-line img { max-inline-size: none; max-width: 100%; max-block-size: fit-content; } .footer { position: relative; z-index: 3; padding: 0; display: flex; flex-direction: column; align-items: center; background-color: #000; } .footer .content-wrapper { display: flex; flex-direction: column; align-items: center; position: relative; width: 100%; max-width: 1720px; margin: 0 auto; padding: 30px 20px 42px; } .footer-line { display: flex; width: 100%; justify-content: space-between; width: 100%; } .footer-line .content-wrapper { position: relative; flex-direction: column; max-width: 1678px; width: 100%; margin: 0 auto; padding: 8px 10px 15px; } .footer-line p, .footer-line span, .footer-line a { color: #9F9F9F; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; } .footer-line a { text-decoration-line: underline; transition: .2s ease-in-out; } .footer-line a:hover { color: #fff; } .footer-line-left { display: flex; flex-direction: column; } .footer-line-left ul { display: flex; align-items: center; } .footer-line-left ul li { color: #9F9F9F; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; } .footer-line-right { display: flex; } .footer-line-right p, .footer-line-right span, .footer-line-right a, .footer-line-right li { color: #9F9F9F; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; line-height: 140%; } .footer-col { display: flex; flex-direction: column; align-items: flex-start; margin: 0 0 48px; width: 100%; } .footer-col p { max-width: 1099px; margin-top: 24px; } .footer-col p, .footer-col span, .footer-col a { color: #B2B2B2; font-family: Lato, sans-serif; font-size: 14px; font-weight: 400; line-height: 140%; transition: .2s ease-in-out; } .footer-col a { text-decoration: underline; transition: .2s ease-in-out; } .footer-col a:hover { color: #fff; } .footer-fire { position: absolute; top: -26px; right: -100px; width: 375px; max-height: 228px; } .footer-logo { width: 177px; } .footer-socials { display: flex; margin-top: -2px; } .footer-socials-item { margin-left: 20px; } .footer-line ul.mob-only { display: none; } @media only screen and (min-width: 1025px) { .faq-section .faq-list { padding: 51px 0 0; } .faq-section .faq-list li .question { margin: 0; padding: 22px 45px 22px 0; line-height: 160%; } .footer { padding: 0; } .footer .content-wrapper { max-width: 1720px; padding: 0px 20px 141px; align-items: flex-start; } .footer-line .content-wrapper { flex-direction: row; justify-content: space-between; max-width: 1720px; margin: 0 auto; padding: 16px 20px; } .footer-line-left { flex-direction: row; } .footer-line-left ul li { margin-left: 32px; } } @media only screen and (min-width: 1100px) { .site-header .header-inner nav ul li ul.header-menu-inner { display: none; } } @media only screen and (min-width: 1101px) { .header-link { border-bottom: 1px solid transparent; } .header-link:hover { border-bottom: 1px solid #EB622B; } } @media only screen and (max-width: 1760px) { .footer-fire { top: 20px; right: -3vw; } } @media only screen and (max-width: 1360px) { .footer-col p { max-width: 600px; } .footer-fire { top: 20px; right: -3vw; } } @media only screen and (max-width: 1250px) { .header-link.border { padding: 7px 12px; } .site-header .header-inner nav ul li { margin: 0; } } @media only screen and (max-width: 1100px) { .under-btn-text { margin-top: 15px; } header { height: unset; } header .content-wrapper { justify-content: flex-start; } .header-link { width: 100%; margin-left: 0; padding: 11px 18px 14.5px; font-size: 18px; font-weight: 500; line-height: 28px; letter-spacing: 0; border-bottom: none; } .header-link.desktop { display: none !important; } .header-link.mob { display: flex; } .header-link:hover { border-bottom: none; } .header-link.border { display: none; border: none; } .header-link.border { display: none; } .header-link-container { display: flex; flex-direction: column; justify-content: flex-end; margin-bottom: 120px; } .header-logo.desktop { display: none; } .header-logo.mob { display: flex; } .header-logo img { margin-right: 0; margin-left: 13px; max-width: 268px; height: 48px; width: unset; margin-top: -13px; } .site-header .header-inner { padding: 28px 14px 17px 16px; } .site-header .hamburger-menu-button { display: block; } .submenu-icon { display: flex; } .site-header .header-inner .action-items { width: fit-content; margin: auto auto 10vh; display: flex; gap: 8px; } .site-header .header-inner nav .header-menu { position: absolute; left: 0; top: 74px; margin: 0; flex-direction: column; background: var(--color-surface-pure, #000); background-blend-mode: darken; text-align: center; width: 100%; overflow: overlay; height: 100vh; padding-top: 16px; padding-bottom: 80px; gap: 0; } .site-header .header-menu-inner { background: #000; } .site-header .header-inner nav { position: fixed; top: 0; left: 0; height: 100%; width: 100%; opacity: 0; transition: opacity .3s ease-out; animation: quick-hide-mobile-menu .2s 1ж; } .site-header .header-inner nav ul li { margin-left: unset; display: flex; justify-content: flex-start; position: relative; width: 100%; margin: 0; flex-direction: column; } .site-header .header-inner nav ul li a { display: flex; align-items: center; } .site-header .header-inner nav ul li a.download-btn { max-width: 224px; } .site-header .header-inner nav ul li a.border { display: none; } @keyframes quick-hide-mobile-menu { 0% { opacity: 0; } to { opacity: 0; } } .site-header .header-inner nav.is-open { opacity: 1; background-color: #000; } .site-header .header-inner nav:not(.is-open) { pointer-events: none; } .site-header .header-inner nav ul::-webkit-scrollbar { width: 4px; height: 4px; background-color: #1E1E1E; } .site-header .header-inner nav ul::-webkit-scrollbar-thumb { border-width: 0; background-color: #1E1E1E; background-clip: padding-box; } .site-header .header-inner nav ul li:last-of-type { margin-left: unset; } } @media only screen and (max-width: 1024px) { main { background: none; } .heading-first { font-size: 36px; font-style: normal; font-weight: 400; line-height: 44px; } .heading-second { font-size: 36px; line-height: 44px; } .download-btn.mob { display: flex; } .download-btn.orange { display: flex; } .hero-bg.desktop { display: none; } .hero-bg.mob { display: flex; } .to-top { margin: 13px auto 0; font-size: 16px; } .to-top-section .content-wrapper { padding-top: 0; } .opening-section { background-size: cover; display: flex; flex-direction: column; height: unset; width: 100%; padding: 0; min-height: unset; background: none; } .opening-section .first-layer { display: none; } .opening-section .heading-first { margin: 17px auto 0; } .opening-section .hero-decor-divider { height: 99px; margin: 11px 0 0; } .opening-section .hero-decor-divider.desk { display: none; } .opening-section .hero-decor-divider.mob { display: flex; } .opening-section .intro-text-container { padding: 94px 20.5px 0; } .opening-section .decorated-line { max-width: 200px; } .opening-section .download-buttons { flex-direction: column; align-items: center; width: 100%; margin: 25px auto 0; order: 3; } .opening-section .download-buttons div:not(:first-child) { margin-left: 0; margin-top: 20px; } .opening-section .download-buttons .desktop { display: flex; width: 100%; justify-content: center; } .opening-section .download-btn { display: flex; } .opening-section .under-btn-text { order: 4; } .terms-section .content-wrapper { margin: 49px auto; } .terms-section .terms-link, .terms-section a { word-break: break-all; } .faq-section .content-wrapper { padding: 35px 20px 48px; } .faq-section .heading-second { margin: 40px auto 12px; } .faq-section .faq-list li .question { padding: 24px 132px 24px 0; font-size: var(--font-size-450, 18px); font-weight: var(--font-weight-medium, 500); line-height: var(--font-line-height-700, 28px); letter-spacing: var(--font-letter-spacing-default, 0px); } .footer-line { flex-direction: column; align-items: center; } .footer-col { align-items: center; margin: 0 auto 8px; } .footer-col p { margin-top: 30px; text-align: center; } .footer-fire { display: none; } .footer-logo { width: 140px; } .footer-socials { margin-top: 44px; justify-content: center; margin: 29px auto 6px; } .footer-line ul.mob-only { display: flex; justify-content: space-between; width: 100%; max-width: 400px; padding: 0px 16px 16px; } .footer-line ul.mob-only li { margin: 0 4px; } .footer-line ul.desktop-only { display: none; } .footer-socials-item { margin-left: unset; margin: 0 10px; } .footer-socials-item:first-of-type { order: 1; } .footer-socials-item:nth-of-type(2) { order: 3; } .footer-socials-item:last-of-type { order: 2; } } @media only screen and (max-width: 500px) { .terms-section .terms-link, .terms-section a { margin-left: 6px; } } @media only screen and (max-width: 360px) { .faq-section .faq-list li .question { padding: 24px 52px 24px 0; } } @media only screen and (max-width: 350px) { .header-logo img { max-width: 240px; } }