@import url(https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap);

a,
body,
div,
footer,
h1,
h2,
h3,
header,
html,
i,
img,
label,
li,
nav,
p,
section,
span,
strong,
ul {
    border: 0;
    font-size: 100%;
    margin: 0;
    padding: 0;
    vertical-align: baseline
}

footer,
header,
nav,
section {
    display: block
}

body {
    line-height: 1
}

ul {
    list-style: none
}

.h2,
.h3,
.h6,
h1,
h2,
h3 {
    color: #000
}

.h2,
.h2:link,
.h3,
.h3:link,
.h6,
.h6:link,
h1,
h1:link,
h2,
h2:link,
h3,
h3:link {
    text-decoration: none
}

.h1,
.h2,
.h3,
.h6 {
    color: #000
}

.h1,
h1 {
    font-family: HMAlphaMono, Open sans, arial, sans-serif;
    font-size: 6.8rem;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase
}

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

    .h1,
    h1 {
        font-size: 4.5rem
    }
}

.h2,
h2 {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 5rem;
    font-weight: 500;
    line-height: 1.2
}

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

    .h2,
    h2 {
        font-size: 3.8rem;
        line-height: 1.2
    }
}

.h3,
h3 {
    font-family: HMAlphaMono, Open sans, arial, sans-serif;
    font-size: 4.2rem;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase
}

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

    .h3,
    h3 {
        font-size: 3.2rem
    }
}

.h6 {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 2.4rem;
    font-weight: 500;
    line-height: 1.5;
    text-transform: none
}

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

    .h6 {
        font-size: 2rem
    }
}

.heading-3 {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 50px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: -2.25px;
    line-height: 56px;
    text-transform: none
}

@media screen and (max-width:992px) {
    .heading-3 {
        font-size: 2.8rem;
        line-height: 32px
    }
}

.heading-5 {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 32px;
    font-weight: 600;
    letter-spacing: -1.44px;
    line-height: 36px;
    text-transform: none
}

@media screen and (max-width:992px) {
    .heading-5 {
        font-size: 24px;
        letter-spacing: -1.08px;
        line-height: 28px
    }
}

.emphasis {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    text-transform: none
}

@media screen and (max-width:768px) {
    .emphasis {
        font-size: 18px;
        line-height: 26px
    }
}

.text-body-r {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px
}

.text-caption {
    font-size: 13px;
    line-height: 22px
}

.text-caption {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-weight: 500
}

.tag {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='3' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 0v.5H.526V3H0V0h4z' fill='%23D4A0FF'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='3' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 3v-.5H.526V0H0v3h4z' fill='%23D4A0FF'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='3' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 3v-.5h3.474V0H4v3H0z' fill='%23D4A0FF'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='3' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0v.5h3.474V3H4V0H0z' fill='%23D4A0FF'/%3E%3C/svg%3E");
    background-position: 0 0, 0 100%, 100% 100%, 100% 0;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: row;
    height: -moz-fit-content;
    height: fit-content;
    padding: 3px 4px;
    width: -moz-fit-content;
    width: fit-content
}

.tag.new {
    left: 10px;
    position: absolute;
    top: 10px
}

.tag span {
    -webkit-backdrop-filter: blur(19px);
    backdrop-filter: blur(19px)
}

.tag.purple span {
    background: rgba(212, 160, 255, .3)
}

.tag.black {
    filter: grayscale(1)
}

.tag.black span {
    background: hsla(0, 0%, 100%, .1)
}

.tag span {
    color: #fff;
    font-family: HMAlphaMono, Open sans, arial, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .42px;
    line-height: 18px;
    padding: 4px 8px;
    text-align: center;
    text-transform: uppercase
}

.tag.small span {
    font-size: 20px;
    letter-spacing: .36px;
    line-height: 16px;
    padding: 0 4px
}

@font-face {
    font-display: swap;
    font-family: HMAlphaMono;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/HMAlphaMono-Medium.otf)
}

.small-text {
    font-family: inherit;
    font-weight: 500
}

.small-text {
    font-size: 1.4rem;
    line-height: 1.5
}

.font-size-l {
    font-family: inherit;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (max-width:860px) {
    .font-size-l {
        font-size: 1.8rem
    }
}

a:link,
a:visited {
    outline: 0;
    text-decoration: underline;
    text-underline-position: under;
    transition: all .2s ease
}

a:link:not(.is-primary),
a:visited:not(.is-primary) {
    color: #000
}

.align-center {
    text-align: center
}

.align-left {
    text-align: left
}

@media screen and (min-width:768.5px)and (max-width:992px) {
    .is-hidden-tablet {
        display: none !important
    }
}

@media screen and (max-width:768.5px) {
    .is-hidden-mobile {
        display: none !important
    }
}

.social-icons-footer>:hover {
    color: #ff5300 !important
}

.color-white {
    color: #fff
}

.bg {
    padding-bottom: 80px;
    padding-top: 80px
}

@media screen and (max-width:690px) {
    .bg {
        padding-bottom: 60px;
        padding-top: 60px
    }
}

.bg-black {
    background-color: #000
}

.bg-black .h2:not(.is-primary),
.bg-black .h6:not(.is-primary),
.bg-black:not(.is-primary),
.bg-black h1:not(.is-primary),
.bg-black h2:not(.is-primary),
.bg-black h3:not(.is-primary) {
    color: #fff
}

.bg-black a:not(.is-primary) {
    color: inherit
}

.bg-black .button:not(:empty).primary {
    background: #fff;
    color: #1c1d20
}

.bg-black,
.bg-black .h2,
.bg-black .h2:not(.is-primary),
.bg-black .h6,
.bg-black .h6:not(.is-primary),
.bg-black:not(.is-primary),
.bg-black a:not(.is-primary):not(.is-secondary),
.bg-black a:not(.is-primary):not(.is-secondary):not(.is-primary),
.bg-black h1,
.bg-black h1:not(.is-primary),
.bg-black h2,
.bg-black h2:not(.is-primary),
.bg-black h3,
.bg-black h3:not(.is-primary) {
    color: #fff
}

@media screen and (max-width:690px) {
    #main>.bg {
        margin-left: 0;
        margin-right: 0
    }
}

.logo {
    display: inherit;
    flex: none
}

.margin-lg {
    margin-bottom: 120px
}

@media screen and (max-width:768px) {
    .margin-lg {
        margin-bottom: 80px
    }
}

.margin-md {
    margin-bottom: 80px
}

@media screen and (max-width:768px) {
    .margin-md {
        margin-bottom: 50px
    }
}

.margin-sm {
    margin-bottom: 60px
}

@media screen and (max-width:768px) {
    .margin-sm {
        margin-bottom: 40px
    }
}

.margin-s {
    margin-bottom: 40px
}

@media screen and (max-width:768px) {
    .margin-s {
        margin-bottom: 20px
    }
}

.margin-xs {
    margin-bottom: 20px
}

.ldg-container,
.row {
    box-sizing: border-box
}

.row {
    margin-left: auto;
    margin-right: auto;
    max-width: 1440px;
    position: relative
}

@media screen and (max-width:1510px) {
    .row {
        margin-left: 4%;
        margin-right: 4%
    }
}

.row>.row {
    margin-left: 4%;
    margin-right: 4%
}

.flexbox {
    align-items: inherit;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between
}

@media screen and (max-width:690px) {
    .flexbox {
        align-items: inherit;
        display: flex;
        flex-flow: column wrap;
        justify-content: inherit
    }
}

@media screen and (max-width:690px)and (-ms-high-contrast:active),
screen and (max-width:690px)and (-ms-high-contrast:none) {
    .flexbox {
        align-items: inherit;
        display: flex;
        flex-flow: row wrap;
        justify-content: inherit
    }
}

.flexbox>* {
    flex: 1 0 0%
}

@media screen and (max-width:768px) {
    .no-margin-mobile {
        margin-left: 0 !important;
        margin-right: 0 !important
    }
}

#header {
    background-color: #fff;
    margin-bottom: 80px;
    position: relative;
    top: -100%;
    transition: all .2s;
    width: 100%;
    z-index: 99
}

@media screen and (max-width:992px) {
    #header {
        margin-bottom: 20px
    }
}

#header>.row {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 80px;
    justify-content: space-between;
    margin: auto;
    max-width: 1440px
}

@media screen and (max-width:1510px) {
    #header>.row {
        margin: 0;
        padding-left: 4%;
        padding-right: 4%
    }
}

@media screen and (max-width:992px) {
    #header>.row {
        height: 64px
    }
}

#header a:link,
#header a:visited {
    text-decoration: none
}

#header .cart,
#header .logo {
    flex: none;
    font-size: 2rem
}

#header .logo img {
    flex: initial;
    height: 70px
}

#header .cart>* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    padding: 7px 12px;
    transition: all .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

@media screen and (min-width:993px) {
    #header .cart #mobile-menu {
        display: none
    }
}

#header nav {
    flex: 2;
    justify-content: flex-end
}

#header nav>* {
    border: 1px
}

@media screen and (max-width:992px) {
    #header .cart {
        display: flex;
        flex: 2;
        justify-content: flex-end
    }
}

#header.dark-header {
    background-color: #000;
    border: 0
}

@media screen and (min-width:993px) {

    #header.dark-header .main-navigation>ul>li>a:link,
    #header.dark-header .main-navigation>ul>li>a:visited {
        color: #fff
    }
}

#header.dark-header .cart>* {
    color: #fff
}



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

    #header.dark-header .cart>*,
    #header.dark-header .cart a {
        color: #fff
    }
}

#header.white-header:not(.out-of-top) {
    background-color: #fff
}

#footer {
    background-color: #000;
    font-weight: 400;
    padding: 80px 0 40px
}

@media screen and (max-width:768px) {
    #footer {
        padding: 60px 0 20px
    }
}

#footer>* {
    box-sizing: border-box;
    margin: auto;
    max-width: 1440px;
    padding-left: 3%
}

@media screen and (max-width:1510px) {
    #footer>* {
        margin-left: 4%;
        margin-right: 4%;
        padding-left: 0
    }
}

@media screen and (max-width:992px) {
    #footer>* {
        flex-direction: column
    }
}

#footer,
#footer a {
    color: #949494
}

#footer .logo {
    margin-bottom: 40px
}

#footer .logo img {
    height: 70px
}

input:not([type=radio]):not([type=checkbox]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

input:not(textarea):not(select):not([type=radio]):not([type=checkbox]):not([type=submit]) {
    width: 100%
}

@media screen and (min-width:690px) {
    input:not(textarea):not(select):not([type=radio]):not([type=checkbox]):not([type=submit]) {
        max-width: 400px
    }
}

@media screen and (max-width:690px) {
    input:not(textarea):not(select):not([type=radio]):not([type=checkbox]):not([type=submit]) {
        max-width: 100%
    }
}

input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range]) {
    background-color: #fff;
    border: 2px solid #000;
    border-radius: 100px;
    box-sizing: border-box;
    color: #000;
    cursor: pointer;
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 1.3rem;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: inherit;
    max-height: 76px;
    max-width: 100%;
    padding: 22px;
    transition: font-size .2s;
    z-index: 5
}

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

    input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range]) {
        font-size: 1.4rem;
        padding: 20px 12px
    }
}

input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range]):-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 1000px #f9f9f9
}

input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range]):active,
input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range]):focus {
    outline: none
}

input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range]):not([type=submit]) {
    background: #fff
}

input:not([type=file]):not([type=submit]):not(.cart__quantity-input):not(.reseller-form-input):not([type=checkbox]):not([type=range])[type=radio] {
    filter: grayscale(1) contrast(1) saturate(0);
    margin-top: 0
}

::-moz-placeholder {
    color: #3c3b3b;
    -moz-transition: opacity .2s;
    transition: opacity .2s
}

label {
    color: #3c3b3b;
    transition: opacity .2s
}

:-ms-input-placeholder {
    color: #3c3b3b
}

::-ms-input-placeholder {
    color: #3c3b3b
}

.fields-container-options input,
.fields-container-options label {
    display: inline-block;
    vertical-align: middle;
    width: auto
}

.fields-container-options label {
    margin-right: 12px
}

ul {
    margin: 12px 0 32px 22px
}

ul li {
    list-style: disc;
    margin: 10px
}

.list-checked>:before {
    color: #ff5300;
    content: "";
    font-family: Font Awesome\ 5 Pro;
    margin-right: 10px
}

.blog-posts.article-page .footer .social-icons-footer>:hover {
    color: #ff5300 !important
}

.b-title-master {
    align-items: center
}

.b-title-master h1 {
    margin-bottom: 1vw
}

.b-title-master h1+* {
    margin-bottom: 2vw
}

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

    .b-title-master h1+* {
        margin-bottom: 5vw
    }
}

.b-title-master .button {
    margin-top: 5vw
}

@media screen and (min-width:690px) {

    .b-title-master .button {
        margin-top: 3vw
    }
}

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

    .b-title-master>*,
    .b-title-master h1 {
        margin-bottom: 5vw
    }
}

.toggle-list {
    margin-bottom: 0
}

.toggle-list .fields-container-options:not(:last-of-type) {
    margin-bottom: 40px
}

.toggle-list .fields-container-options label {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    flex-flow: row nowrap;
    outline: none;
    transition: all .2s
}

.toggle-list .fields-container-options input {
    display: block;
    height: 0;
    visibility: hidden
}

.toggle-list .fields-container-options input~label+div {
    margin: 0 0 0 32px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .5s cubic-bezier(0, 1.05, 0, 1)
}

.toggle-list .fields-container-options input:checked~label+div {
    margin: 12px 0 12px 32px;
    max-height: 100vh;
    opacity: 1;
    transition: opacity max-height .5s cubic-bezier(0, 1.05, 0, 1)
}

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

    .toggle-list .fields-container-options input:checked~label+div {
        max-height: 100%
    }
}

.toggle-list .fields-container-options p {
    line-height: 1.6
}

.introduction {
    align-items: center
}

@media (-ms-high-contrast:none),
screen and (-ms-high-contrast:active) {
    .introduction {
        flex-direction: row
    }
}

@media screen and (max-width:1200px) {
    .introduction {
        align-items: flex-start
    }
}

@media screen and (max-width:992px) {
    .introduction {
        flex-direction: column
    }
}

.button:not(:empty) {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 100px;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: inherit;
    max-height: 76px;
    min-width: 178px;
    outline: none;
    padding: 24px 32px;
    text-align: center;
    text-decoration: none;
    transition: all .3s
}

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

    .button:not(:empty) {
        min-width: 160px;
        padding: 16px 24px
    }
}

.button:not(:empty):not(.no-icon):after {
    content: "";
    display: inline-block;
    font-family: ledger-icons-font;
    margin-left: auto;
    padding-left: 6px;
    position: relative;
    transition: all .3s;
    vertical-align: middle
}

.button:not(:empty):not(.no-icon):hover:after {
    padding-left: 12px
}

.button:not(:empty).primary {
    background-color: #000;
    color: #fff
}

.button:not(:empty).primary:active {
    box-shadow: 0 0 0 2px #ff5300
}

.button:not(:empty).secondary {
    background-color: #ff5300;
    color: #fff
}

.button:not(:empty).secondary:active {
    box-shadow: 0 0 0 2px #000
}

nav ul,
nav ul li {
    margin: 0;
    padding: 0
}

nav ul li {
    list-style: none
}

nav ul li a,
nav ul li a:link,
nav ul li a:visited {
    text-decoration: none
}

.main-navigation {
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.main-navigation>ul>li>a {
    white-space: nowrap
}

.main-navigation ul {
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.4
}

.main-navigation ul li a:link,
.main-navigation ul li a:visited {
    display: block;
    padding: 12px 1.5vw
}

@media screen and (min-width:993px) {
    .main-navigation>ul {
        box-sizing: border-box;
        display: flex;
        margin-left: 4%;
        margin-right: 1%;
        text-align: center
    }

    .main-navigation>ul>li {
        padding: 0;
        position: relative
    }
}

@media screen and (max-width:992px) {
    .main-navigation {
        background: #fff;
        box-shadow: 0 5px 5px rgba(0, 0, 0, .1);
        box-sizing: border-box;
        left: 0;
        max-height: 0;
        overflow-y: auto;
        position: absolute;
        top: 60px;
        transition: all .2s;
        width: 100%;
        z-index: 20
    }

    .main-navigation>ul {
        position: static;
        z-index: 30
    }

    .main-navigation>ul li a:link,
    .main-navigation>ul li a:visited {
        display: block;
        padding: 12px
    }

    .main-navigation.is-open {
        max-height: none;
        padding-bottom: 20px;
        padding-top: 10px
    }
}

.footer-navigation {
    flex: 4;
    flex-wrap: wrap;
    margin-top: 60px
}

@media screen and (min-width:993px) {
    .footer-navigation {
        margin-left: 7%;
        margin-top: 0
    }
}

.footer-navigation>* {
    flex: auto;
    margin-bottom: 40px;
    width: 100%
}

@media screen and (min-width:768px) {
    .footer-navigation>* {
        padding-right: 4%;
        width: 33%
    }
}

.footer-navigation>* li {
    color: #fff;
    font-weight: 600
}

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

    .footer-navigation div>ul>li {
        position: relative
    }

    .footer-navigation div>ul>li:after {
        content: " ";
        font-family: ledger-icons-font;
        position: absolute;
        right: 2%;
        top: 0
    }
}

.vertical-swiper-block {
    padding-bottom: 0 !important;
    padding-top: 0 !important
}

.vertical-swiper-block .vertical-swiper .item {
    display: flex;
    flex-direction: column-reverse;
    padding-bottom: 60px;
    padding-top: 60px;
    scroll-snap-align: start
}

@media screen and (max-width:690px) {
    .vertical-swiper-block .vertical-swiper .item {
        border-bottom: 1px solid #3c3b3b
    }

    .vertical-swiper-block .vertical-swiper .item:last-of-type {
        border-bottom: 0
    }
}

.vertical-swiper-block .vertical-swiper .item:not(:last-of-type):after {
    background-color: #3c3b3b;
    bottom: 0;
    content: "";
    height: 1px;
    margin-left: 0;
    margin-right: 0;
    position: absolute;
    width: 114%;
    z-index: 2
}

@media screen and (max-width:690px) {
    .vertical-swiper-block .vertical-swiper .item:not(:last-of-type):after {
        content: none
    }
}

@media screen and (min-width:690.5px) {
    .vertical-swiper-block .vertical-swiper .item {
        align-items: center;
        flex-direction: row;
        justify-content: center;
        min-height: 490px;
        position: relative
    }

    .vertical-swiper-block .vertical-swiper .item .illustration {
        max-width: 46%
    }
}

@media screen and (max-width:690px) {
    .vertical-swiper-block .vertical-swiper .item {
        text-align: center
    }

    .vertical-swiper-block .vertical-swiper .item .illustration {
        flex: none
    }
}

.vertical-swiper-block .vertical-swiper .item>* {
    flex: 1
}

@media screen and (max-width:1024px) {
    .vertical-swiper-block .vertical-swiper .item .title {
        font-size: 4.2rem
    }
}

@media screen and (max-width:690px) {
    .vertical-swiper-block .vertical-swiper .item .title {
        font-size: 2.4rem;
        margin-top: 20px
    }
}

.vertical-swiper-block .vertical-swiper .slide-index {
    background: rgba(255, 83, 0, .3);
    display: flex;
    flex-direction: column;
    height: 100%;
    left: -4%;
    position: absolute;
    top: 0;
    width: 6px;
    z-index: 5
}

@media screen and (min-width:690.5px) {
    .vertical-swiper-block .vertical-swiper .slide-index {
        left: -2.5%
    }
}

.vertical-swiper-block .vertical-swiper .slide-index>* {
    position: sticky;
    top: 0
}

.vertical-swiper-block .vertical-swiper .slide-index .index {
    background-color: #ff5300;
    bottom: auto;
    color: #fff;
    display: block;
    flex: none;
    font-size: 1.6rem;
    height: 32px;
    left: 0;
    line-height: 32px;
    text-align: center;
    transition: all .2s;
    width: 32px
}

@media screen and (min-width:690.5px) {
    .vertical-swiper-block .vertical-swiper .slide-index .index {
        height: 50px;
        line-height: 50px;
        width: 50px
    }
}

@media screen and (max-width:1024px) {
    .vertical-swiper-block .vertical-swiper .slide-index .index {
        height: 42px;
        line-height: 42px;
        width: 42px
    }
}

.vertical-swiper-block .vertical-swiper .slide-index .progress-bar {
    background-color: #ff5300;
    display: block;
    height: 110px;
    left: 0;
    position: relative;
    top: 0;
    transition: all .2s;
    width: 6px
}

@font-face {
    font-display: block;
    font-family: ledger-icons-font;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/icomoon.eot);
    src: url(../fonts/icomoon.eot#iefix) format("embedded-opentype"), url(../fonts/icomoon.ttf) format("truetype"), url(../fonts/icomoon.woff) format("woff"), url(../images/icomoon.svg#icomoon) format("svg")
}

[class^=icon-] {
    speak: never;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: ledger-icons-font !important;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    text-transform: none
}

.icon-stream:before {
    content: ""
}

html {
    direction: ltr;
    font-size: 62.5%;
    scroll-behavior: smooth
}

body {
    background: #fff;
    color: #000;
    counter-reset: section;
    font-family: Inter, Times New Roman, arial, sans-serif;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.5
}

@media screen and (max-width:768px) {
    body {
        font-size: 1.4rem
    }
}

@media screen and (min-width:768px) {
    body {
        font-size: 1.6rem
    }
}

img {
    max-width: 100%
}

* {
    box-sizing: border-box
}

#main:not(.flexbox) {
    display: block
}

.faq-section-2 .faq-2 {
    transition: height .5s ease-in-out 0s
}

@media screen and (max-width:859px) {
    .faq-section-2 .faq-2 {
        display: none
    }
}

.faq-section-2 .faq-2 .fields-container-options {
    border-bottom: 1px solid rgba(0, 0, 0, .2);
    padding-bottom: 28px
}

.faq-section-2 .faq-2 .fields-container-options .title {
    font-size: 2rem
}

@media screen and (min-width:860px) {
    .faq-section-2 .faq-mobile {
        display: none
    }
}

.getting-started .list-tab-exchange>:hover>input~label {
    opacity: 1
}

.getting-started .list-tab-exchange>:hover>input~label img {
    filter: grayscale(0) invert(200%) contrast(1)
}

.staking-coin .crypto-gallery .grid-items>:hover {
    background-color: transparent;
    border: 2px solid;
    margin-bottom: -2px;
    margin-top: -2px
}

.validator-nodes .crypto-gallery .grid-items>:hover {
    background-color: transparent;
    border: 2px solid;
    margin-bottom: -2px;
    margin-top: -2px
}

.heateor_sss_sharing_ul a>:hover,
.heateor_sss_sharing_ul i>:hover {
    background-color: #ff5300
}

/* Default template */

/* stars on wallet pages */

.nk-card .small-text {
    color: #FF5300 !important;
}

.recover-block .main-container {
    background: linear-gradient(123deg, #0a0a0a, #262626);
    border: 1px solid #525252;
    position: relative;
}

.recover-block .main-container .wrapper {
    align-items: center;
    background-color: #000;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
}

.recover-block .main-container .image-container {
    box-sizing: border-box;
    flex: 1;
}

.recover-block .main-container .image-container img {
    height: 100%;
    max-height: 480px;
}

.recover-block .main-container .text-container {
    align-items: flex-start;
    box-sizing: border-box;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    justify-content: center;
    max-width: 50%;
    padding: 51px 48px;
}

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

    .recover-block .main-container {
        margin-bottom: 0;
        margin-top: 0;
    }

    .recover-block .main-container .wrapper {
        flex-direction: column-reverse;
    }

    .recover-block .main-container .image-container {
        align-items: center;
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .recover-block .main-container .image-container img {
        height: 100%;
        max-height: 480px;
    }

    .recover-block .main-container .text-container {
        max-width: 100%;
        padding: 24px;
        width: 100%;
    }
}