:root, [data-bs-theme=light] { --bs-blue: #0d6efd; --bs-indigo: #6610f2; --bs-purple: #6f42c1; --bs-pink: #d63384; --bs-red: #dc3545; --bs-orange: #fd7e14; --bs-yellow: #ffc107; --bs-green: #198754; --bs-teal: #20c997; --bs-cyan: #0dcaf0; --bs-black: #000; --bs-white: #fff; --bs-gray: #6c757d; --bs-gray-dark: #343a40; --bs-gray-100: #f8f9fa; --bs-gray-200: #e9ecef; --bs-gray-300: #dee2e6; --bs-gray-400: #ced4da; --bs-gray-500: #adb5bd; --bs-gray-600: #6c757d; --bs-gray-700: #495057; --bs-gray-800: #343a40; --bs-gray-900: #212529; --bs-primary: #00D3AF; --bs-secondary: #6c757d; --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-light: #fff; --bs-dark: #09111A; --bs-primary-rgb: rgb(0, 211, 174); --bs-secondary-rgb: 108, 117, 125; --bs-success-rgb: 25, 135, 84; --bs-info-rgb: 13, 202, 240; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; --bs-light-rgb: 248, 249, 250; --bs-dark-rgb: 33, 37, 41; --bs-primary-text-emphasis: #052c65; --bs-secondary-text-emphasis: #2b2f32; --bs-success-text-emphasis: #0a3622; --bs-info-text-emphasis: #055160; --bs-warning-text-emphasis: #664d03; --bs-danger-text-emphasis: #58151c; --bs-light-text-emphasis: #495057; --bs-dark-text-emphasis: #495057; --bs-primary-bg-subtle: #cfe2ff; --bs-secondary-bg-subtle: #e2e3e5; --bs-success-bg-subtle: #d1e7dd; --bs-info-bg-subtle: #cff4fc; --bs-warning-bg-subtle: #fff3cd; --bs-danger-bg-subtle: #f8d7da; --bs-light-bg-subtle: #fcfcfd; --bs-dark-bg-subtle: #ced4da; --bs-primary-border-subtle: #9ec5fe; --bs-secondary-border-subtle: #c4c8cb; --bs-success-border-subtle: #a3cfbb; --bs-info-border-subtle: #9eeaf9; --bs-warning-border-subtle: #ffe69c; --bs-danger-border-subtle: #f1aeb5; --bs-light-border-subtle: #e9ecef; --bs-dark-border-subtle: #adb5bd; --bs-white-rgb: 255, 255, 255; --bs-black-rgb: 0, 0, 0; --bs-font-sans-serif: "Gantari", sans-serif; --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); --bs-body-font-family: var(--bs-font-sans-serif); --bs-body-font-size: 1rem; --bs-body-font-weight: 400; --bs-body-line-height: 1.5; --bs-link-decoration: underline; --bs-border-width: 1px; --bs-border-style: solid; --bs-border-radius: 0.375rem; --bs-border-radius-sm: 0.25rem; --bs-border-radius-lg: 0.5rem; --bs-border-radius-xl: 1rem; --bs-border-radius-xxl: 2rem; --bs-border-radius-2xl: var(--bs-border-radius-xxl); --bs-border-radius-pill: 50rem; --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); --bs-focus-ring-width: 0.25rem; --bs-focus-ring-opacity: 0.25; --bs-focus-ring-color: rgba(13, 110, 253, 0.25); --bs-body-color: #B2CCE7; --bs-body-color-rgb: 255, 255, 255; --bs-body-bg: #09111A; --bs-body-bg-rgb: 9 17 26; --bs-emphasis-color: #fff; --bs-emphasis-color-rgb: 255, 255, 255; --bs-secondary-color: rgba(222, 226, 230, 0.75); --bs-secondary-color-rgb: 222, 226, 230; --bs-secondary-bg: #101B25; --bs-secondary-bg-rgb: 15, 26, 37; --bs-tertiary-color: rgba(222, 226, 230, 0.5); --bs-tertiary-color-rgb: 222, 226, 230; --bs-tertiary-bg: #2b3035; --bs-tertiary-bg-rgb: 43, 48, 53; --bs-primary-text-emphasis: #6ea8fe; --bs-secondary-text-emphasis: #a7acb1; --bs-success-text-emphasis: #75b798; --bs-info-text-emphasis: #6edff6; --bs-warning-text-emphasis: #ffda6a; --bs-danger-text-emphasis: #ea868f; --bs-light-text-emphasis: #f8f9fa; --bs-dark-text-emphasis: #dee2e6; --bs-primary-bg-subtle: #031633; --bs-secondary-bg-subtle: #161719; --bs-success-bg-subtle: #051b11; --bs-info-bg-subtle: #032830; --bs-warning-bg-subtle: #332701; --bs-danger-bg-subtle: #2c0b0e; --bs-light-bg-subtle: #343a40; --bs-dark-bg-subtle: #1a1d20; --bs-primary-border-subtle: #084298; --bs-secondary-border-subtle: #41464b; --bs-success-border-subtle: #0f5132; --bs-info-border-subtle: #087990; --bs-warning-border-subtle: #997404; --bs-danger-border-subtle: #842029; --bs-light-border-subtle: #495057; --bs-dark-border-subtle: #343a40; --bs-heading-color: #fff; --bs-link-color: #6ea8fe; --bs-link-hover-color: #00D3AF; --bs-link-color-rgb: 0, 211, 174; --bs-link-hover-color-rgb: 139, 185, 254; --bs-code-color: #e685b5; --bs-highlight-color: #dee2e6; --bs-highlight-bg: #664d03; --bs-border-color: #00d3b06b; --bs-border-color-translucent: rgba(255, 255, 255, 0.15); --bs-form-valid-color: #75b798; --bs-form-valid-border-color: #75b798; --bs-form-invalid-color: #ea868f; --bs-form-invalid-border-color: #ea868f } *, ::after, ::before { box-sizing: border-box } @media (prefers-reduced-motion:no-preference) { :root { scroll-behavior: smooth } } body { margin: 0; font-family: var(--bs-body-font-family); font-size: var(--bs-body-font-size); font-weight: var(--bs-body-font-weight); line-height: var(--bs-body-line-height); color: var(--bs-body-color); text-align: var(--bs-body-text-align); background-color: var(--bs-body-bg); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent } hr { margin: 1rem 0; color: var(--bs-primary); border: 0; border-top: var(--bs-border-width) solid; opacity: .25 } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5rem; font-weight: 500; line-height: 1.2; color: var(--bs-heading-color) } .h1, h1 { font-size: calc(1.375rem + 1.5vw) } @media (min-width:1200px) { .h1, h1 { font-size: 2.5rem } } .h2, h2 { font-size: calc(1.325rem + .9vw) } @media (min-width:1200px) { .h2, h2 { font-size: 2rem } } .h3, h3 { font-size: calc(1.3rem + .6vw) } @media (min-width:1200px) { .h3, h3 { font-size: 1.75rem } } p { margin-top: 0; margin-bottom: 1rem } ol, ul { padding-left: 2rem } dl, ol, ul { margin-top: 0; margin-bottom: 1rem } ol ol, ol ul, ul ol, ul ul { margin-bottom: 0 } b, strong { font-weight: bolder } a { color: var(--bs-primary); text-decoration: none } a:hover { --bs-link-color-rgb: var(--bs-link-hover-color-rgb) } a:not([href]):not([class]), a:not([href]):not([class]):hover { color: inherit; text-decoration: none } figure { margin: 0 0 1rem } img, svg { vertical-align: middle } button { border-radius: 0 } button:focus:not(:focus-visible) { outline: 0 } button, input, optgroup, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit } button, select { text-transform: none } [role=button] { cursor: pointer } [type=button], [type=reset], [type=submit], button { -webkit-appearance: button } [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) { cursor: pointer } iframe { border: 0 } .list-unstyled { padding-left: 0; list-style: none } .img-fluid { max-width: 100%; height: auto } .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-right: auto; margin-left: auto } @media (min-width:576px) { .container, .container-sm { max-width: 540px } } @media (min-width:768px) { .container, .container-md, .container-sm { max-width: 720px } } @media (min-width:992px) { .container, .container-lg, .container-md, .container-sm { max-width: 960px } } @media (min-width:1200px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1140px } } @media (min-width:1400px) { .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { max-width: 1320px } } :root { --bs-breakpoint-xs: 0; --bs-breakpoint-sm: 576px; --bs-breakpoint-md: 768px; --bs-breakpoint-lg: 992px; --bs-breakpoint-xl: 1200px; --bs-breakpoint-xxl: 1400px } .row { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--bs-gutter-y)); margin-right: calc(-.5 * var(--bs-gutter-x)); margin-left: calc(-.5 * var(--bs-gutter-x)) } .row>* { flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-top: var(--bs-gutter-y) } .col { flex: 1 0 0% } .col-4 { flex: 0 0 auto; width: 33.33333333% } .col-5 { flex: 0 0 auto; width: 41.66666667% } .col-6 { flex: 0 0 auto; width: 50% } .col-7 { flex: 0 0 auto; width: 58.33333333% } .col-8 { flex: 0 0 auto; width: 66.66666667% } .col-9 { flex: 0 0 auto; width: 75% } .col-10 { flex: 0 0 auto; width: 83.33333333% } .col-11 { flex: 0 0 auto; width: 91.66666667% } .col-12 { flex: 0 0 auto; width: 100% } @media (min-width:768px) { .col-md-2 { flex: 0 0 auto; width: 16.66666667% } .col-md-3 { flex: 0 0 auto; width: 25% } .col-md-4 { flex: 0 0 auto; width: 33.33333333% } .col-md-5 { flex: 0 0 auto; width: 41.66666667% } .col-md-6 { flex: 0 0 auto; width: 50% } .col-md-7 { flex: 0 0 auto; width: 58.33333333% } .col-md-8 { flex: 0 0 auto; width: 66.66666667% } .col-md-9 { flex: 0 0 auto; width: 75% } .col-md-10 { flex: 0 0 auto; width: 83.33333333% } } @media (min-width:992px) { .col-lg { flex: 1 0 0% } .col-lg-2 { flex: 0 0 auto; width: 16.66666667% } .col-lg-3 { flex: 0 0 auto; width: 25% } .col-lg-4 { flex: 0 0 auto; width: 33.33333333% } .col-lg-5 { flex: 0 0 auto; width: 41.66666667% } .col-lg-6 { flex: 0 0 auto; width: 50% } .col-lg-7 { flex: 0 0 auto; width: 58.33333333% } .col-lg-8 { flex: 0 0 auto; width: 66.66666667% } .col-lg-9 { flex: 0 0 auto; width: 75% } .col-lg-10 { flex: 0 0 auto; width: 83.33333333% } .px-lg-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important } } .btn { --bs-btn-padding-x: 0.75rem; --bs-btn-padding-y: 0.375rem; --bs-btn-font-family: ; --bs-btn-font-size: 1rem; --bs-btn-font-weight: 600; --bs-btn-line-height: 1.5; --bs-btn-color: var(--bs-body-color); --bs-btn-bg: transparent; --bs-btn-border-width: var(--bs-border-width); --bs-btn-border-color: transparent; --bs-btn-border-radius: 1.5rem; --bs-btn-hover-border-color: transparent; --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075); --bs-btn-disabled-opacity: 0.65; --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5); display: inline-block; padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x); font-family: var(--bs-btn-font-family); font-size: var(--bs-btn-font-size); font-weight: var(--bs-btn-font-weight); line-height: var(--bs-btn-line-height); color: var(--bs-btn-color); text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; border: var(--bs-btn-border-width) solid var(--bs-btn-border-color); border-radius: var(--bs-btn-border-radius); background-color: var(--bs-btn-bg); transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } @media (prefers-reduced-motion:reduce) { .btn { transition: none } } .btn:hover { color: var(--bs-btn-hover-color); background-color: var(--bs-btn-hover-bg); border-color: var(--bs-btn-hover-border-color) } .btn-check+.btn:hover { color: var(--bs-btn-color); background-color: var(--bs-btn-bg); border-color: var(--bs-btn-border-color) } .btn:focus-visible { color: var(--bs-btn-hover-color); background-color: var(--bs-btn-hover-bg); border-color: var(--bs-btn-hover-border-color); outline: 0; box-shadow: var(--bs-btn-focus-box-shadow) } .btn-check:focus-visible+.btn { border-color: var(--bs-btn-hover-border-color); outline: 0; box-shadow: var(--bs-btn-focus-box-shadow) } .btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active { color: var(--bs-btn-active-color); background-color: var(--bs-btn-active-bg); border-color: var(--bs-btn-active-border-color) } .btn-check:checked+.btn:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible, .btn:first-child:active:focus-visible, :not(.btn-check)+.btn:active:focus-visible { box-shadow: var(--bs-btn-focus-box-shadow) } .btn-check:checked:focus-visible+.btn { box-shadow: var(--bs-btn-focus-box-shadow) } .btn.disabled, .btn:disabled, fieldset:disabled .btn { color: var(--bs-btn-disabled-color); pointer-events: none; background-color: var(--bs-btn-disabled-bg); border-color: var(--bs-btn-disabled-border-color); opacity: var(--bs-btn-disabled-opacity) } .btn-primary { --bs-btn-color: var(--bs-body-bg); --bs-btn-bg: #00D3AF; --bs-btn-border-color: #00D3AF; --bs-btn-hover-color: var(--bs-body-bg); --bs-btn-hover-bg: #41f5d7; --bs-btn-hover-border-color: #00eec6; --bs-btn-focus-shadow-rgb: 49, 132, 253; --bs-btn-active-color: var(--bs-body-bg) !; --bs-btn-active-bg: #00eec6; --bs-btn-active-border-color: #41f5d7; --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: var(--bs-body-bg) !; --bs-btn-disabled-bg: #00D3AF; --bs-btn-disabled-border-color: #00D3AF } .btn-outline-primary { --bs-btn-color: #fff; --bs-btn-border-color: var(--bs-primary); --bs-btn-hover-color: var(--bs-body-bg); --bs-btn-hover-bg: var(--bs-primary); --bs-btn-hover-border-color: var(--bs-primary); --bs-btn-focus-shadow-rgb: 13, 110, 253; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--bs-primary); --bs-btn-active-border-color: var(--bs-primary); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: var(--bs-primary); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--bs-primary); --bs-gradient: none; background: rgba(0, 211, 175, 0.1); } .fade:not(.show) { opacity: 0 } .collapse:not(.show) { display: none } .collapsing { height: 0; overflow: hidden; transition: height .35s ease } @media (prefers-reduced-motion:reduce) { .collapsing { transition: none } } .collapsing.collapse-horizontal { width: 0; height: auto; transition: width .35s ease } @media (prefers-reduced-motion:reduce) { .collapsing.collapse-horizontal { transition: none } } .input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-control, .input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-select, .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) { border-top-right-radius: 0; border-bottom-right-radius: 0 } .input-group.has-validation>.dropdown-toggle:nth-last-child(n+4), .input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-control, .input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-select, .input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) { border-top-right-radius: 0; border-bottom-right-radius: 0 } .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { margin-left: calc(var(--bs-border-width) * -1); border-top-left-radius: 0; border-bottom-left-radius: 0 } .dropdown, .dropdown-center, .dropend, .dropstart, .dropup, .dropup-center { position: relative } .dropdown-toggle { white-space: nowrap } .dropdown-toggle::after { display: inline-block; margin-left: .255em; vertical-align: .255em; content: ""; border-top: .3em solid; border-right: .3em solid transparent; border-bottom: 0; border-left: .3em solid transparent } .dropdown-toggle:empty::after { margin-left: 0 } .dropdown-menu { --bs-dropdown-zindex: 1000; --bs-dropdown-min-width: 10rem; --bs-dropdown-padding-x: 0; --bs-dropdown-padding-y: 0.5rem; --bs-dropdown-spacer: 0.125rem; --bs-dropdown-font-size: 1rem; --bs-dropdown-color: var(--bs-body-color); --bs-dropdown-bg: var(--bs-body-bg); --bs-dropdown-border-color: var(--bs-border-color-translucent); --bs-dropdown-border-radius: var(--bs-border-radius); --bs-dropdown-border-width: var(--bs-border-width); --bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width)); --bs-dropdown-divider-bg: var(--bs-border-color-translucent); --bs-dropdown-divider-margin-y: 0.5rem; --bs-dropdown-box-shadow: var(--bs-box-shadow); --bs-dropdown-link-color: var(--bs-body-color); --bs-dropdown-link-hover-color: var(--bs-body-color); --bs-dropdown-link-hover-bg: var(--bs-tertiary-bg); --bs-dropdown-link-active-color: #fff; --bs-dropdown-link-active-bg: #0d6efd; --bs-dropdown-link-disabled-color: var(--bs-tertiary-color); --bs-dropdown-item-padding-x: 1rem; --bs-dropdown-item-padding-y: 0.25rem; --bs-dropdown-header-color: #6c757d; --bs-dropdown-header-padding-x: 1rem; --bs-dropdown-header-padding-y: 0.5rem; position: absolute; z-index: var(--bs-dropdown-zindex); display: none; min-width: var(--bs-dropdown-min-width); padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x); margin: 0; font-size: var(--bs-dropdown-font-size); color: var(--bs-dropdown-color); text-align: left; list-style: none; background-color: var(--bs-dropdown-bg); background-clip: padding-box; border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color); border-radius: var(--bs-dropdown-border-radius) } .dropdown-menu[data-bs-popper] { top: 100%; left: 0; margin-top: var(--bs-dropdown-spacer) } .dropdown-menu-start { --bs-position: start } .dropdown-menu-start[data-bs-popper] { right: auto; left: 0 } .dropdown-menu-end { --bs-position: end } .dropdown-menu-end[data-bs-popper] { right: 0; left: auto } @media (min-width:576px) { .dropdown-menu-sm-start { --bs-position: start } .dropdown-menu-sm-start[data-bs-popper] { right: auto; left: 0 } .dropdown-menu-sm-end { --bs-position: end } .dropdown-menu-sm-end[data-bs-popper] { right: 0; left: auto } } @media (min-width:768px) { .dropdown-menu-md-start { --bs-position: start } .dropdown-menu-md-start[data-bs-popper] { right: auto; left: 0 } .dropdown-menu-md-end { --bs-position: end } .dropdown-menu-md-end[data-bs-popper] { right: 0; left: auto } } @media (min-width:992px) { .dropdown-menu-lg-start { --bs-position: start } .dropdown-menu-lg-start[data-bs-popper] { right: auto; left: 0 } .dropdown-menu-lg-end { --bs-position: end } .dropdown-menu-lg-end[data-bs-popper] { right: 0; left: auto } } @media (min-width:1200px) { .dropdown-menu-xl-start { --bs-position: start } .dropdown-menu-xl-start[data-bs-popper] { right: auto; left: 0 } .dropdown-menu-xl-end { --bs-position: end } .dropdown-menu-xl-end[data-bs-popper] { right: 0; left: auto } } @media (min-width:1400px) { .dropdown-menu-xxl-start { --bs-position: start } .dropdown-menu-xxl-start[data-bs-popper] { right: auto; left: 0 } .dropdown-menu-xxl-end { --bs-position: end } .dropdown-menu-xxl-end[data-bs-popper] { right: 0; left: auto } } .dropup .dropdown-menu[data-bs-popper] { top: auto; bottom: 100%; margin-top: 0; margin-bottom: var(--bs-dropdown-spacer) } .dropup .dropdown-toggle::after { display: inline-block; margin-left: .255em; vertical-align: .255em; content: ""; border-top: 0; border-right: .3em solid transparent; border-bottom: .3em solid; border-left: .3em solid transparent } .dropup .dropdown-toggle:empty::after { margin-left: 0 } .dropend .dropdown-menu[data-bs-popper] { top: 0; right: auto; left: 100%; margin-top: 0; margin-left: var(--bs-dropdown-spacer) } .dropend .dropdown-toggle::after { display: inline-block; margin-left: .255em; vertical-align: .255em; content: ""; border-top: .3em solid transparent; border-right: 0; border-bottom: .3em solid transparent; border-left: .3em solid } .dropend .dropdown-toggle:empty::after { margin-left: 0 } .dropend .dropdown-toggle::after { vertical-align: 0 } .dropstart .dropdown-menu[data-bs-popper] { top: 0; right: 100%; left: auto; margin-top: 0; margin-right: var(--bs-dropdown-spacer) } .dropstart .dropdown-toggle::after { display: inline-block; margin-left: .255em; vertical-align: .255em; content: "" } .dropstart .dropdown-toggle::after { display: none } .dropstart .dropdown-toggle::before { display: inline-block; margin-right: .255em; vertical-align: .255em; content: ""; border-top: .3em solid transparent; border-right: .3em solid; border-bottom: .3em solid transparent } .dropstart .dropdown-toggle:empty::after { margin-left: 0 } .dropstart .dropdown-toggle::before { vertical-align: 0 } .dropdown-divider { height: 0; margin: var(--bs-dropdown-divider-margin-y) 0; overflow: hidden; border-top: 1px solid var(--bs-dropdown-divider-bg); opacity: 1 } .dropdown-item { display: block; width: 100%; padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x); clear: both; font-weight: 400; color: var(--bs-dropdown-link-color); text-align: inherit; text-decoration: none; white-space: nowrap; background-color: transparent; border: 0; border-radius: var(--bs-dropdown-item-border-radius, 0) } .dropdown-item:focus, .dropdown-item:hover { color: var(--bs-dropdown-link-hover-color); background-color: var(--bs-dropdown-link-hover-bg) } .dropdown-item.active, .dropdown-item:active { color: var(--bs-dropdown-link-active-color); text-decoration: none; background-color: var(--bs-dropdown-link-active-bg) } .dropdown-item.disabled, .dropdown-item:disabled { color: var(--bs-dropdown-link-disabled-color); pointer-events: none; background-color: transparent } .dropdown-menu.show { display: block } .dropdown-header { display: block; padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x); margin-bottom: 0; font-size: .875rem; color: var(--bs-dropdown-header-color); white-space: nowrap } .dropdown-item-text { display: block; padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x); color: var(--bs-dropdown-link-color) } .dropdown-menu-dark { --bs-dropdown-color: #dee2e6; --bs-dropdown-bg: #343a40; --bs-dropdown-border-color: var(--bs-border-color-translucent); --bs-dropdown-box-shadow: ; --bs-dropdown-link-color: #dee2e6; --bs-dropdown-link-hover-color: #fff; --bs-dropdown-divider-bg: var(--bs-border-color-translucent); --bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15); --bs-dropdown-link-active-color: #fff; --bs-dropdown-link-active-bg: #0d6efd; --bs-dropdown-link-disabled-color: #adb5bd; --bs-dropdown-header-color: #adb5bd } .nav { --bs-nav-link-padding-x: 1rem; --bs-nav-link-padding-y: 0.5rem; --bs-nav-link-font-weight: ; --bs-nav-link-color: var(--bs-link-color); --bs-nav-link-hover-color: var(--bs-link-hover-color); --bs-nav-link-disabled-color: var(--bs-secondary-color); display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none } .nav-link { display: block; padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x); font-size: var(--bs-nav-link-font-size); font-weight: var(--bs-nav-link-font-weight); color: var(--bs-nav-link-color); text-decoration: none; background: 0 0; border: 0; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out } @media (prefers-reduced-motion:reduce) { .nav-link { transition: none } } .nav-link:focus, .nav-link:hover { color: var(--bs-nav-link-hover-color) } .nav-link:focus-visible { outline: 0; box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25) } .navbar { --bs-navbar-padding-x: 0; --bs-navbar-padding-y: 0.5rem; --bs-navbar-color: rgba(var(--bs-emphasis-color-rgb), 0.65); --bs-navbar-hover-color: rgba(var(--bs-emphasis-color-rgb), 0.8); --bs-navbar-disabled-color: rgba(var(--bs-emphasis-color-rgb), 0.3); --bs-navbar-active-color: rgba(var(--bs-emphasis-color-rgb), 1); --bs-navbar-brand-padding-y: 0.3125rem; --bs-navbar-brand-margin-end: 1rem; --bs-navbar-brand-font-size: 1.25rem; --bs-navbar-brand-color: rgba(var(--bs-emphasis-color-rgb), 1); --bs-navbar-brand-hover-color: rgba(var(--bs-emphasis-color-rgb), 1); --bs-navbar-nav-link-padding-x: 0.8rem; --bs-navbar-toggler-padding-y: 0.25rem; --bs-navbar-toggler-padding-x: 0.75rem; --bs-navbar-toggler-font-size: 1.25rem; --bs-navbar-toggler-icon-bg: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 7H11C11.2652 7 11.5196 7.10536 11.7071 7.29289C11.8946 7.48043 12 7.73478 12 8C12 8.26522 11.8946 8.51957 11.7071 8.70711C11.5196 8.89464 11.2652 9 11 9H6C5.73478 9 5.48043 8.89464 5.29289 8.70711C5.10536 8.51957 5 8.26522 5 8C5 7.73478 5.10536 7.48043 5.29289 7.29289C5.48043 7.10536 5.73478 7 6 7ZM13 15H18C18.2652 15 18.5196 15.1054 18.7071 15.2929C18.8946 15.4804 19 15.7348 19 16C19 16.2652 18.8946 16.5196 18.7071 16.7071C18.5196 16.8946 18.2652 17 18 17H13C12.7348 17 12.4804 16.8946 12.2929 16.7071C12.1054 16.5196 12 16.2652 12 16C12 15.7348 12.1054 15.4804 12.2929 15.2929C12.4804 15.1054 12.7348 15 13 15Z" fill="%2300D3AF"/><path d="M18 11H6C5.73478 11 5.48043 11.1054 5.29289 11.2929C5.10536 11.4804 5 11.7348 5 12C5 12.2652 5.10536 12.5196 5.29289 12.7071C5.48043 12.8946 5.73478 13 6 13H18C18.2652 13 18.5196 12.8946 18.7071 12.7071C18.8946 12.5196 19 12.2652 19 12C19 11.7348 18.8946 11.4804 18.7071 11.2929C18.5196 11.1054 18.2652 11 18 11Z" fill="white"/></svg>'); --bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.15); --bs-navbar-toggler-border-radius: var(--bs-border-radius); --bs-navbar-toggler-focus-width: 0.25rem; --bs-navbar-toggler-transition: box-shadow 0.15s ease-in-out; position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x) } .navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl { display: flex; flex-wrap: inherit; align-items: center; justify-content: space-between } .navbar-brand { padding-top: var(--bs-navbar-brand-padding-y); padding-bottom: var(--bs-navbar-brand-padding-y); margin-right: var(--bs-navbar-brand-margin-end); font-size: var(--bs-navbar-brand-font-size); color: var(--bs-navbar-brand-color); text-decoration: none; white-space: nowrap } .navbar-brand:focus, .navbar-brand:hover { color: var(--bs-navbar-brand-hover-color) } .navbar-nav { --bs-nav-link-padding-x: 0; --bs-nav-link-padding-y: 0.5rem; --bs-nav-link-font-weight: ; --bs-nav-link-color: var(--bs-navbar-color); --bs-nav-link-hover-color: var(--bs-navbar-hover-color); --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color); display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; list-style: none } .navbar-nav .nav-link.active, .navbar-nav .nav-link.show { color: var(--bs-navbar-active-color) } .navbar-nav .dropdown-menu { position: static } .navbar-text { padding-top: .5rem; padding-bottom: .5rem; color: var(--bs-navbar-color) } .navbar-text a, .navbar-text a:focus, .navbar-text a:hover { color: var(--bs-navbar-active-color) } .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center } .navbar-toggler { padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x); font-size: var(--bs-navbar-toggler-font-size); line-height: 1; color: var(--bs-navbar-color); background-color: transparent; border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color); border-radius: var(--bs-navbar-toggler-border-radius); transition: var(--bs-navbar-toggler-transition) } @media (prefers-reduced-motion:reduce) { .navbar-toggler { transition: none } } .navbar-toggler:hover { text-decoration: none } .navbar-toggler:focus { text-decoration: none; outline: 0; box-shadow: 0 0 0 var(--bs-navbar-toggler-focus-width) } .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; background-image: var(--bs-navbar-toggler-icon-bg); background-repeat: no-repeat; background-position: center; background-size: 100% } .navbar-nav-scroll { max-height: var(--bs-scroll-height, 75vh); overflow-y: auto } @media (min-width:992px) { .navbar-expand-lg { flex-wrap: nowrap; justify-content: flex-start } .navbar-expand-lg .navbar-nav { flex-direction: row } .navbar-expand-lg .navbar-nav .dropdown-menu { position: absolute } .navbar-expand-lg .navbar-nav .nav-link { padding-right: var(--bs-navbar-nav-link-padding-x); padding-left: var(--bs-navbar-nav-link-padding-x) } .navbar-expand-lg .navbar-nav-scroll { overflow: visible } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto } .navbar-expand-lg .navbar-toggler { display: none } } .btn-close { --bs-btn-close-color: var(--bs-body-color); --bs-btn-close-bg: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.6013 3.41234C20.475 3.28578 20.325 3.18536 20.1598 3.11685C19.9946 3.04834 19.8176 3.01307 19.6388 3.01307C19.46 3.01307 19.2829 3.04834 19.1178 3.11685C18.9526 3.18536 18.8026 3.28578 18.6763 3.41234L12 10.0749L5.32375 3.39869C5.19735 3.27229 5.04729 3.17202 4.88214 3.10362C4.71698 3.03521 4.53998 3 4.36122 3C4.18246 3 4.00545 3.03521 3.8403 3.10362C3.67515 3.17202 3.52509 3.27229 3.39869 3.39869C3.27229 3.52509 3.17202 3.67515 3.10362 3.8403C3.03521 4.00545 3 4.18246 3 4.36122C3 4.53998 3.03521 4.71698 3.10362 4.88214C3.17202 5.04729 3.27229 5.19735 3.39869 5.32375L10.0749 12L3.39869 18.6763C3.27229 18.8027 3.17202 18.9527 3.10362 19.1179C3.03521 19.283 3 19.46 3 19.6388C3 19.8175 3.03521 19.9945 3.10362 20.1597C3.17202 20.3248 3.27229 20.4749 3.39869 20.6013C3.52509 20.7277 3.67515 20.828 3.8403 20.8964C4.00545 20.9648 4.18246 21 4.36122 21C4.53998 21 4.71698 20.9648 4.88214 20.8964C5.04729 20.828 5.19735 20.7277 5.32375 20.6013L12 13.9251L18.6763 20.6013C18.8027 20.7277 18.9527 20.828 19.1179 20.8964C19.283 20.9648 19.46 21 19.6388 21C19.8175 21 19.9945 20.9648 20.1597 20.8964C20.3248 20.828 20.4749 20.7277 20.6013 20.6013C20.7277 20.4749 20.828 20.3248 20.8964 20.1597C20.9648 19.9945 21 19.8175 21 19.6388C21 19.46 20.9648 19.283 20.8964 19.1179C20.828 18.9527 20.7277 18.8027 20.6013 18.6763L13.9251 12L20.6013 5.32375C21.1201 4.80494 21.1201 3.93115 20.6013 3.41234Z" fill="%23B2CCE7"/></svg>'); --bs-btn-close-opacity: 0.5; --bs-btn-close-hover-opacity: 0.75; --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); --bs-btn-close-focus-opacity: 1; --bs-btn-close-disabled-opacity: 0.25; --bs-btn-close-white-filter: invert(1) grayscale(100%) brightness(200%); box-sizing: content-box; width: 1em; height: 1em; padding: .25em .25em; color: var(--bs-btn-close-color); background: transparent var(--bs-btn-close-bg) center/1em auto no-repeat; border: 0; border-radius: .375rem; opacity: var(--bs-btn-close-opacity) } .btn-close:hover { color: var(--bs-btn-close-color); text-decoration: none; opacity: var(--bs-btn-close-hover-opacity) } .btn-close:focus { outline: 0; box-shadow: var(--bs-btn-close-focus-shadow); opacity: var(--bs-btn-close-focus-opacity) } .btn-close.disabled, .btn-close:disabled { pointer-events: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; opacity: var(--bs-btn-close-disabled-opacity) } .modal { --bs-modal-zindex: 1055; --bs-modal-width: 500px; --bs-modal-padding: 1rem; --bs-modal-margin: 0.5rem; --bs-modal-color: ; --bs-modal-bg: var(--bs-body-bg); --bs-modal-border-color: var(--bs-border-color-translucent); --bs-modal-border-width: var(--bs-border-width); --bs-modal-border-radius: var(--bs-border-radius-lg); --bs-modal-box-shadow: var(--bs-box-shadow-sm); --bs-modal-inner-border-radius: calc(var(--bs-border-radius-lg) - (var(--bs-border-width))); --bs-modal-header-padding-x: 1rem; --bs-modal-header-padding-y: 1rem; --bs-modal-header-padding: 1rem 1rem; --bs-modal-header-border-color: var(--bs-border-color); --bs-modal-header-border-width: var(--bs-border-width); --bs-modal-title-line-height: 1.5; --bs-modal-footer-gap: 0.5rem; --bs-modal-footer-bg: ; --bs-modal-footer-border-color: var(--bs-border-color); --bs-modal-footer-border-width: var(--bs-border-width); position: fixed; top: 0; left: 0; z-index: var(--bs-modal-zindex); display: none; width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; outline: 0 } .modal-dialog { position: relative; width: auto; margin: var(--bs-modal-margin); pointer-events: none } .modal.fade .modal-dialog { transition: transform .3s ease-out; transform: translate(0, -50px) } @media (prefers-reduced-motion:reduce) { .modal.fade .modal-dialog { transition: none } } .modal.show .modal-dialog { transform: none } .modal.modal-static .modal-dialog { transform: scale(1.02) } .modal-dialog-scrollable { height: calc(100% - var(--bs-modal-margin) * 2) } .modal-dialog-scrollable .modal-content { max-height: 100%; overflow: hidden } .modal-dialog-scrollable .modal-body { overflow-y: auto } .modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - var(--bs-modal-margin) * 2) } .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; color: var(--bs-modal-color); pointer-events: auto; background-color: var(--bs-secondary-bg); background-clip: padding-box; border: var(--bs-modal-border-width) solid var(--bs-modal-border-color); border-radius: var(--bs-modal-border-radius); outline: 0 } .modal-backdrop { --bs-backdrop-zindex: 1050; --bs-backdrop-bg: rgba(0, 0, 0, 0.33); position: fixed; top: 0; left: 0; z-index: var(--bs-backdrop-zindex); width: 100vw; height: 100vh; background-color: var(--bs-backdrop-bg); backdrop-filter: blur(3px); } .modal-backdrop.fade { opacity: 0 } .modal-backdrop.show { opacity: var(--bs-backdrop-opacity) } .modal-body { position: relative; flex: 1 1 auto; padding: var(--bs-modal-padding) } @media (min-width:576px) { .modal { --bs-modal-margin: 1.75rem; --bs-modal-box-shadow: var(--bs-box-shadow) } .modal-dialog { max-width: var(--bs-modal-width); margin-right: auto; margin-left: auto } .modal-sm { --bs-modal-width: 300px } } @media (min-width:992px) { .modal-lg, .modal-xl { --bs-modal-width: 800px } } .d-block { display: block !important } .d-flex { display: flex !important } .d-none { display: none !important } .position-relative { position: relative !important } .position-absolute { position: absolute } .top-0 { top: 0 !important } .end-0 { right: 0 } .border-bottom { border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important } .flex-wrap { flex-wrap: wrap !important } .h-100 { height: 100% !important } .w-100 { width: 100% !important } .flex-wrap { flex-wrap: wrap !important } .justify-content-center { justify-content: center !important } .justify-content-between { justify-content: space-between !important } .justify-content-around { justify-content: space-around !important } .justify-content-evenly { justify-content: space-evenly !important } .align-items-center { align-items: center !important } .m-1 { margin: .25rem !important } .m-2 { margin: .5rem !important } .m-3 { margin: 1rem !important } .m-4 { margin: 1.5rem !important } .m-5 { margin: 3rem !important } .my-1 { margin-top: .25rem !important; margin-bottom: .25rem !important } .my-2 { margin-top: .5rem !important; margin-bottom: .5rem !important } .my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important } .my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important } .my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important } .mt-0 { margin-top: 0 !important } .mt-1 { margin-top: .25rem !important } .mt-2 { margin-top: .5rem !important } .mt-3 { margin-top: 1rem !important } .mt-4 { margin-top: 1.5rem !important } .mt-5 { margin-top: 3rem !important } .mt-auto { margin-top: auto !important } .me-0 { margin-right: 0 !important } .me-1 { margin-right: .25rem !important } .me-2 { margin-right: .5rem !important } .me-3 { margin-right: 1rem !important } .me-4 { margin-right: 1.5rem !important } .me-5 { margin-right: 3rem !important } .me-auto { margin-right: auto !important } .mb-0 { margin-bottom: 0 !important } .mb-1 { margin-bottom: .25rem !important } .mb-2 { margin-bottom: .5rem !important } .mb-3 { margin-bottom: 1rem !important } .mb-4 { margin-bottom: 1.5rem !important } .mb-5 { margin-bottom: 3rem !important } .ms-auto { margin-left: auto !important } .p-0 { padding: 0 !important } .p-1 { padding: .25rem !important } .p-2 { padding: .5rem !important } .p-3 { padding: 1rem !important } .p-4 { padding: 1.5rem !important } .px-2 { padding-right: .5rem !important; padding-left: .5rem !important } .px-3 { padding-right: 1rem !important; padding-left: 1rem !important } .px-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important } .ps-4 { padding-left: 1.5rem !important } .py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important } .py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important } .py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important } .py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important } .pt-2 { padding-top: .5rem !important } .pt-3 { padding-top: 1rem !important } .pt-4 { padding-top: 1.5rem !important } .pt-5 { padding-top: 3rem !important } .fw-medium { font-weight: 500 !important } .fw-semibold { font-weight: 600 !important } .fw-bold { font-weight: 700 !important } .fw-bolder { font-weight: bolder !important } .text-center { text-align: center !important } .text-primary { --bs-text-opacity: 1; color: var(--bs-primary) !important } .text-white { --bs-text-opacity: 1; color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important } .text-body { --bs-text-opacity: 1; color: var(--bs-body-color-rgb) !important } .bg-primary { background-color: var(--bs-primary) !important; color: var(--bs-body-bg); } .bg-secondary { background-color: var(--bs-secondary-bg) !important } .bg-dark { background-color: var(--bs-body-bg) !important } .bg-body-secondary { --bs-bg-opacity: 1; background-color: rgba(var(--bs-secondary-bg-rgb), var(--bs-bg-opacity)) !important } .bg-body-tertiary { background-color: var(--bs-secondary-bg) !important } .rounded-2 { border-radius: var(--bs-border-radius) !important } .rounded-3 { border-radius: var(--bs-border-radius-lg) !important } .rounded-4 { border-radius: var(--bs-border-radius-xl) !important } .rounded-5 { border-radius: var(--bs-border-radius-xxl) !important } @media (min-width:576px) { .d-sm-flex { display: flex !important } .col-sm-3 { flex: 0 0 auto; width: 25% } .col-sm-4 { flex: 0 0 auto; width: 33.33333333% } .p-sm-2 { padding: .5rem !important } } @media (min-width:768px) { .d-md-none { display: none !important } .d-md-block { display: block !important } .mt-md-2 { margin-top: .5rem !important } .mt-md-3 { margin-top: 1rem !important } .mt-md-4 { margin-top: 1.5rem !important } .mt-md-5 { margin-top: 3rem !important } .mb-md-4 { margin-bottom: 1.5rem !important } .mb-md-5 { margin-bottom: 3rem !important } .p-md-0 { padding: 0 !important } .p-md-4 { padding: 1.5rem !important } .px-md-0 { padding-right: 0 !important; padding-left: 0 !important } .px-md-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important } .px-md-5 { padding-right: 3rem !important; padding-left: 3rem !important } .py-md-3 { padding-top: 1rem !important; padding-bottom: 1rem !important } .py-md-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important } .py-md-5 { padding-top: 3rem !important; padding-bottom: 3rem !important } .pt-md-3 { padding-top: 1rem !important } .pt-md-4 { padding-top: 1.5rem !important } .pt-md-5 { padding-top: 3rem !important } .pe-md-4 { padding-right: 1.5rem !important } .pe-md-5 { padding-right: 3rem !important } } @media (min-width:992px) { .d-lg-block { display: block !important } .d-lg-none { display: none !important } .me-lg-5 { margin-right: 3rem !important } .mb-lg-0 { margin-bottom: 0 !important } } .mx-auto { margin-right: auto !important; margin-left: auto !important } @media only screen and (min-width:991px) { .dropdown-toggle.lang::after { display: inline-block; margin-left: 0; vertical-align: 0; content: none; border-top: 0; border-right: 0; border-bottom: 0; border-left: 0; } } .f30 { font-size: 30px; } @media only screen and (max-width: 991px) and (min-width: 768px) { .vol-btn { position: unset !important; right: unset !important; margin-right: auto !important; margin-left: auto !important; display: block !important; margin-bottom: -10px; } } @media only screen and (max-width: 767px) { .vol-btn { margin-top: 10px !important; margin-right: 10px !important; } } .vol-btn:active { border-color: var(--bs-secondary-bg) !important; } .primary-line-bg { background: rgba(0, 211, 175, 0.1); border: 1px solid #00D3AF; border-radius: 20px; padding: 8px; } .f20 { font-size: 20px; } .f24 { font-size: 24px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); border-radius: 10px; background-color: none; } ::-webkit-scrollbar { width: 8px; background-color: none; } ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); background-color: #00D3AF; } .bg-glow { background-image: url('data:image/svg+xml,<svg width="206" height="206" viewBox="0 0 206 206" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_268_1146)"><g filter="url(%23filter0_f_268_1146)"><circle cx="103" cy="103" r="76" fill="%2300D3AF" fill-opacity="0.15"/></g></g><defs><filter id="filter0_f_268_1146" x="-6.6" y="-6.6" width="219.2" height="219.2" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="16.8" result="effect1_foregroundBlur_268_1146"/></filter><clipPath id="clip0_268_1146"><rect width="206" height="206" fill="white"/></clipPath></defs></svg>'); background-size: cover; background-repeat: no-repeat; } /* .column { margin: 15px 15px 0; padding: 0; } */ .column:last-child { padding-bottom: 60px; } /* .column::after { content: ''; clear: both; display: block; } */ .column div { position: relative; float: left; margin-bottom: 2rem !important; } .column div span { position: absolute; bottom: -10px; /* left: 0; */ z-index: -1; display: block; max-width: 159px; /* margin: 0; */ /* padding: 0; */ color: #fff; font-size: 18px; text-decoration: none; text-align: center; -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; opacity: 0; margin-bottom: 10px; } figure { width: max-content; /* height: 200px; */ margin: 0; padding: 0; /* background: #fff; */ overflow: hidden; } figure:hover+span { bottom: -33px; opacity: 1; } .gamelist-item figure { position: relative; } .gamelist-item figure::before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); } .gamelist-item figure:hover::before { -webkit-animation: shine .75s; animation: shine .75s; } @-webkit-keyframes shine { 100% { left: 125%; } } @keyframes shine { 100% { left: 125%; } } .img-hov:hover { border: solid 3px #00D3AF; border-radius: 0.7rem; } .bg-body-warning { background: rgba(247, 183, 51, 0.10000000149011612); border: 1px solid rgb(247, 183, 51); border-radius: 20px; color: #FFECC3; } #clickarea { height: 320px; font-size: 20px; text-align: center; } #start { border: 0; line-height: 4; padding: 0% 15%; width: 100%; height: 300px; text-align: center; color: #fff; background-color: rgba(34, 34, 34, 1); } #start:hover { background-color: #000; } .ripple { position: absolute; background: #fff; border-radius: 50%; width: 5px; height: 5px; animation: rippleEffect 0.88s 1; opacity: 0; /* margin-top: -60px !important; */ } @keyframes rippleEffect { 0% { transform: scale(1); opacity: 0.4 } 100% { transform: scale(100); opacity: 0 } } .btn-ripple { position: relative !important; overflow: hidden; outline: none; border: none; color: #fff; border-radius: 20px; padding: 8px 16px; /* margin: 8px; */ font-size: 14px; font-family: inherit; cursor: pointer } /* spacebar test */ .btn-spacebar { position: relative !important; overflow: hidden; outline: none; border: none; color: #fff; border-radius: 2px; padding: 8px 16px; margin: 8px; font-size: 14px; font-family: inherit; cursor: pointer; } #spacebarbutton { border: 0; font-size: 1.3rem; width: 100%; height: 300px; color: #fff; } #spacebarArea { height: 320px; font-size: 20px; text-align: center; } #spacebarbutton:active { border: none !important; } #spacebarbutton:focus-visible { outline: none; } .hidden { display: none; } /* scroll Test */ .scrollpadding { padding-top: 150px; padding-bottom: 150px; }