@font-face {
    font-family: 'IRANYekanX VF';
    src: url('../font/iranyekanxVF/IRANYekanXVF.woff') format('woff-variations'),
    url('../font/iranyekanxVF/IRANYekanXVF.woff') format('woff'),
    url('../font/iranyekanxVF/IRANYekanXVF.woff2') format('woff2');
    font-display: fallback;
}

@font-face {
    font-family: IRANYekanX;
    font-style: normal;
    font-weight: 300;
    src: url('../font/iranyekanx/woff2/IRANYekanX-Light.woff2') format('woff2'),
    url('../font/iranyekanx/woff/IRANYekanX-Light.woff') format('woff');
}

@font-face {
    font-family: IRANYekanX;
    font-style: normal;
    font-weight: 400;
    src: url('../font/iranyekanx/woff2/IRANYekanX-Regular.woff2') format('woff2'),
    url('../font/iranyekanx/woff/IRANYekanX-Regular.woff') format('woff');
}

@font-face {
    font-family: IRANYekanX;
    font-style: normal;
    font-weight: 500;
    src: url('../font/iranyekanx/woff2/IRANYekanX-Medium.woff2') format('woff2'),
    url('../font/iranyekanx/woff/IRANYekanX-Medium.woff') format('woff');
}

@font-face {
    font-family: IRANYekanX;
    font-style: normal;
    font-weight: 700;
    src: url('../font/iranyekanx/woff2/IRANYekanX-Bold.woff2') format('woff2'),
    url('../font/iranyekanx/woff/IRANYekanX-Bold.woff') format('woff');
}

@font-face {
    font-family: IRANYekanX;
    font-style: normal;
    font-weight: 900;
    src: url('../font/iranyekanx/woff2/IRANYekanX-ExtraBold.woff2') format('woff2'),
    url('../font/iranyekanx/woff/IRANYekanX-ExtraBold.woff') format('woff');
}

:root {
    /* color*/
    --c-grey-light-8: hsl(240 24% 98%);
    --c-grey-light-7: hsl(240 24% 96%);
    --c-grey-light-6: hsl(240 14% 94%);
    --c-grey-light-5: hsl(240 10% 93%);
    --c-grey-light-4: hsl(240 6% 83%);
    --c-grey-light-3: hsl(240 5% 79%);
    --c-grey-light-2: hsl(240 3% 69%);
    --c-grey: hsl(240 2% 57%);
    --c-grey-dark-2: hsl(240 1% 39%);
    --c-grey-dark-3: hsl(240 1% 29%);
    --c-grey-dark-4: hsl(240 2% 23%);
    --c-grey-dark-5: hsl(240 2% 18%);
    --c-grey-dark-6: hsl(240 3% 11%);
    --c-red-1: hsl(358, 96%, 89%);
    --c-red-2: hsl(358, 96%, 74%);
    --c-red-3: hsl(358, 95%, 66%);
    --c-red: hsl(358, 95%, 62%);
    /* --c-red: #fa4248; */
    --c-red-5: hsl(358, 94%, 57%);
    --c-red-6: hsl(358, 95%, 47%);
    --c-blue-1: hsl(210, 81%, 78%);
    --c-blue-2: hsl(210, 80%, 67%);
    --c-blue-3: hsl(210, 80%, 50%);
    --c-blue: hsl(210, 100%, 45%);
    --c-blue-5: hsl(210, 100%, 40%);
    --c-blue-6: hsl(210, 100%, 36%);
    --c-grey-bg: hsl(240 14% 97%);
    --c-white: hsl(0, 0%, 100%);
    --c-black: hsl(0 0% 0%);
    --c-text-1: hsl(240 3% 11%);
    /* --c-text-1: #1b1b1d; */
    --till: #1dd9bb;
    --blue: #009191;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffbb01;
    --green: #02931b;
    --teal: #20c997;
    --cyan: #00baba;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #009191;
    --secondary: #6c757d;
    --success: #02931b;
    --info: #00baba;
    --warning: #ffbb01;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    /* font family */
    --ff-primary: 'IRANYekanX VF', IRANYekanX, tahoma;
    /* font size */
    --fs-base: 18px;
    --fs-1: 0.579rem;
    --fs-2: 0.694rem;
    --fs-2-5: 0.722rem;
    --fs-3: 0.833rem;
    --fs-4: 1rem;
    --fs-5: 1.2rem;
    --fs-6: 1.44rem;
    --fs-7: 1.728rem;
    --fs-8: 2.074rem;
    --fs-9: 2.488rem;
    --fs-extra: 3rem;
    /* font weight */
    --fw-regular: 400;
    --fw-extra: 900;
    --fw-damnboyhethic: 900;
    /* border radius */
    --br-1: 4px;
    --br-2: 8px;
    --br-3: 12px;
    --br-4: 16px;
    --br-5: 24px;
    --br-6: 36px;
    --br-base: 8px;
    --br-round: 9999px;
    /* box shadow */
    --bs-grey-1: hsla(0, 0%, 0%, 0.05) 0px 0px 0px 1px;
    --bs-grey-2: hsla(0, 0%, 0%, 0.05) 0px 1px 2px 0px;
    --bs-grey-3: hsla(0, 0%, 0%, 0.1) 0px 1px 3px 0px, hsla(0, 0%, 0%, 0.06) 0px 1px 2px 0px;
    --bs-grey-4: hsla(0, 0%, 0%, 0.1) 0px 4px 6px -1px, hsla(0, 0%, 0%, 0.06) 0px 2px 4px -1px;
    --bs-grey-5: hsla(0, 0%, 0%, 0.1) 0px 10px 15px -3px, hsla(0, 0%, 0%, 0.05) 0px 4px 6px -2px;
    --bs-grey-6: hsla(0, 0%, 0%, 0.1) 0px 20px 25px -5px, hsla(0, 0%, 0%, 0.04) 0px 10px 10px -5px;
    --bs-grey-7: hsla(0, 0%, 0%, 0.25) 0px 25px 50px -12px;
    --bs-grey-inset: hsla(0, 0%, 0%, 0.06) 0px 2px 4px 0px inset;
    --bs-tailwind: 0 0 #0000, 0 0 #0000, 0 0 1px rgb(66 71 76 / 32%), 0 4px 8px rgb(66 71 76 / 6%), 0 8px 48px rgb(238 238 238);
    /* spacing */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 24px;
    --sp-6: 32px;
    --sp-7: 48px;
    --sp-8: 64px;
    --sp-9: 96px;
    --sp-10: 128px;
    --sp-11: 192px;
    --sp-12: 256px;
    --sp-13: 384px;
    /* breakpoints */
    --breakpoint-xs: 320px;
    --breakpoint-sm: 480px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    /* other */
    --header-height: 58px;
    --header-height-fix: 58px;
    --global-padding: 0 15px;
}

::-moz-selection {
    background: hsl(240 3% 11%);
    color: white;
    text-shadow: none;
}

::selection {
    background: hsl(240 3% 11%);
    color: white;
    text-shadow: none;
}


/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    line-height: 1.4;
    scroll-behavior: smooth;
    scroll-padding-top: var(--header-height);
    font-size: 18px;
}

body {
    color: var(--c-text-1);
    font-family: IRANYekanX, tahoma;
    direction: rtl;
    -moz-font-feature-settings: "ss02";
    -webkit-font-feature-settings: "ss02";
    font-feature-settings: "ss02";
}

@supports (font-variation-settings: normal) {
    body {
        font-family: 'IRANYekanX VF', tahoma;
    }
}

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

body,
h1,
h2,
h3,
p {
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-bottom: 0.5rem;
    margin-top: 0;
    line-height: 1;
}

p {
    margin-bottom: 1rem;
    margin-top: 0;
    max-width: 40em;
}

img {
    display: block;
    max-width: 100%;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}


/* ==========================================================================
   Custom styles
   ========================================================================== */

body {
    position: relative;
    height: 100%;
}

body.disable-scroll {
    overflow: hidden;
    height: 100vh;
}

.page-content {
    /* padding-top: var(--header-height); */
    padding-top: var(--header-height-fix);
}

.page-width {
    margin: 0 auto;
    padding: 0 15px;
    width: 100%;
    max-width: 1220px;
}

.page-container {
    max-width: 100%;
}

.page-width.no-padding {
    padding: 0;
}

header {
    z-index: 100;
    position: fixed;
    display: block;
    width: 100%;
    height: var(--header-height);
    top: 0;
    right: 0;
    left: 0;
    margin: 0;
    background-color: rgba(255, 255, 255);
    background-color: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: saturate(190%) blur(16px);
    backdrop-filter: saturate(190%) blur(16px);
    border-bottom: 1px solid var(--c-grey-light-5);
}

body.disable-scroll header {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

header a {
    text-decoration: none;
    color: var(--c-text-1);
}

header .header-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 4px;
}

header .branding {
    width: 92px;
    margin-left: 10px;
}

header .icon-wrapper {
    height: var(--header-height);
    display: block;
    padding: 14px 6px;
    cursor: pointer;
    background-color: #0000;
    -webkit-transition: background-color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: background-color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    display: -ms-grid;
    display: grid;
    place-items: center;
}

header .icon-wrapper:hover {
    background-color: var(--c-grey-light-6);
}

header .icon-wrapper:focus {
    background-color: var(--c-grey-light-6);
}

header .icon-wrapper img {
    height: 24px;
    width: 24px;
}

header .cart .icon-wrapper {
    position: relative;
}

header .cart .cart-counter {
    position: absolute;
    top: 8px;
    right: 4px;
    font-size: var(--fs-3);
    color: var(--white);
    background-color: var(--c-red);
    min-width: 16px;
    height: 16px;
    display: -ms-grid;
    display: grid;
    place-content: center;
    border-radius: var(--br-1);
}

.search-modal {
    display: none;
}

.search-modal.is-open {
    display: block;
}

.search-modal .overlay {
    position: fixed;
    z-index: 120;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    overflow: auto;
    background-color: rgb(255, 255, 255);
    background-color: rgba(255, 255, 255, 0.9);
    -webkit-backdrop-filter: saturate(190%) blur(12px);
    backdrop-filter: saturate(190%) blur(12px);
    -webkit-animation-name: fadeIn;
    -webkit-animation-duration: 0.4s;
    animation-name: fadeIn;
    animation-duration: 0.4s
}

.search-modal .modal-content {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    height: 140px;
    z-index: 130;
    -webkit-animation-name: slideIn;
    -webkit-animation-duration: 0.4s;
    animation-name: slideIn;
    animation-duration: 0.4s
}

.search-modal .field-wrapper {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: var(--header-height);
    background-color: var(--white);
    border-bottom: 1px solid var(--c-grey-light-5);
}

.search-modal .close-modal-bt {
    position: relative;
    outline: none;
    border: none;
    width: 50px;
    background-color: var(--white);
    display: -ms-grid;
    display: grid;
    place-items: center;
    cursor: pointer;
}

.search-modal .close-modal-bt::after {
    content: '';
    position: absolute;
    height: 28px;
    width: 1px;
    background-color: var(--c-grey-light-5);
    left: 0;
}

.search-modal .search-field {
    padding-right: 10px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    outline: none;
    border: none;
    font-weight: 300;
}

.search-modal .search-field::-webkit-search-cancel-button {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    background: url('../img/icons/trash-grey-2.svg') no-repeat 50% 50%;
    background-size: contain;
    opacity: 0;
    pointer-events: none;
}

.search-modal .search-field:focus::-webkit-search-cancel-button {
    opacity: 1;
    pointer-events: all;
}

.search-modal .search-bt {
    padding: 0;
    outline: none;
    border: none;
    width: 50px;
    background-color: var(--white);
    display: -ms-grid;
    display: grid;
    place-items: center;
    cursor: pointer;
}

.search-modal .search-bt img {
    width: 24px;
    height: 24px;
}

.search-modal .suggestions {
    -webkit-transition: all 0.26s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.26s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.search-modal .suggestions .title {
    font-size: var(--fs-2);
    margin: 10px 10px 0 0;
    color: var(--c-grey);
}

.search-modal .search-history {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow-x: scroll;
    padding: 12px 0;
}

.search-modal .search-history .item {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: block;
    text-decoration: none;
    font-size: var(--fs-3);
    color: var(--c-grey-dark-4);
    background-color: var(--white);
    -webkit-box-shadow: var(--bs-grey-2);
    box-shadow: var(--bs-grey-2);
    padding: 4px 8px;
    margin-left: 8px;
    border-radius: var(--br-1);
    border: 1px solid var(--c-grey-light-4);
    -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.search-modal .search-history .item:nth-child(1) {
    margin-right: 10px;
}

.search-modal .search-history .item:hover {
    border-color: var(--c-grey-light-6);
    background-color: var(--c-grey-light-6);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.search-modal .ajax-search {}

.search-modal .result-wrapper {
    padding: 5px;
}

.search-modal .result {
    text-decoration: none;
    color: initial;
    display: block;
    margin-bottom: 10px;
}

.search-modal .result:hover .font-wrapper {
    background-color: var(--c-grey-light-8);
}

.search-modal .font-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px;
    border-radius: var(--br-2);
}

.search-modal .font-wrapper .thumb {
    width: 48px;
    height: 48px;
    padding: 8px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    border-radius: var(--br-2);
}

.search-modal .font-wrapper img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}

.search-modal .font-wrapper .details {
    width: -webkit-calc(100% - 48px);
    width: calc(100% - 48px);
    padding-right: 10px;
}

.search-modal .font-wrapper .title {
    font-weight: 500;
}

.search-modal .font-wrapper .price {}

.search-modal .font-wrapper .value {}

.search-modal .font-wrapper .currency {
    font-weight: 300;
    font-size: var(--fs-2-5);
    color: var(--c-grey);
}

.main-nav {
    position: fixed;
}

.main-nav .overlay {
    display: none;
    position: fixed;
    z-index: 120;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.2);
    -webkit-backdrop-filter: saturate(50%) blur(12px);
    backdrop-filter: saturate(50%) blur(12px);
    -webkit-animation-name: fadeIn;
    -webkit-animation-duration: 0.4s;
    animation-name: fadeIn;
    animation-duration: 0.4s
}

.main-nav.active .overlay {
    display: block;
}

.main-nav .menu-wrapper {
    position: fixed;
    z-index: 130;
    top: 0;
    bottom: 0;
    width: min(80%, 360px);
    right: min(-80%, -360px);
    height: 100%;
    min-height: 100vh;
    overflow-y: scroll;
    background: var(--white);
    -webkit-transition: right 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: right 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.main-nav.active .menu-wrapper {
    right: 0;
}

.main-nav .menu-banners {
    display: none;
}

.main-nav .sub-nav {
    width: min(80%, 360px);
    right: min(-80%, -360px);
    position: fixed;
    overflow-y: scroll;
    top: 0;
    bottom: 0;
    z-index: 140;
    background: #fff;
    -webkit-transition: right 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: right 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    padding-bottom: 80px;
}

.main-nav .sub-nav.active {
    right: 0;
}

.main-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-nav li {
    position: relative;
}

.main-nav .navbar {
    position: relative;
    padding-top: 24px;
}

.main-nav .nav-link {
    text-decoration: none;
    color: var(--c-text-1);
    padding: 10px 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

.main-nav li.has-child::after {
    content: '';
    position: absolute;
    border-style: solid;
    border-color: var(--c-red);
    border-width: 2px 2px 0 0;
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
    height: 8px;
    width: 8px;
    left: 30px;
    top: -webkit-calc(50% - 3px);
    top: calc(50% - 3px);
}

.main-nav .nav-icon {
    width: 42px;
    height: 42px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
    overflow: hidden;
    margin-left: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.main-nav .m--link>.nav-icon img {
    width: 24px;
    /* opacity: 0.3; */
}

.main-nav .nav-title {
    color: var(--c-grey-dark-4);
    font-weight: 600;
}

.main-nav .nav-link.back-bt {
    border-bottom: 1px solid var(--c-grey-light-5);
    margin-bottom: 4px;
    padding: 16px 16px 14px 16px;
    opacity: 0;
    -webkit-transition: all 1.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 1.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.main-nav .nav-link.back-bt .nav-icon {
    width: auto;
    height: auto;
    background-color: transparent;
    border-radius: 0;
}

.main-nav .sub-nav.active .nav-link.back-bt {
    opacity: 1;
}

.main-nav .nav-link.back-bt .nav-icon img {
    width: 25px;
    height: auto;
    background-color: #0000;
    border-radius: 0;
    overflow: hidden;
}

.main-nav .sub-nav.active .nav-link.back-bt .nav-title {
    font-weight: 500;
}

.main-nav .nav-footer {
    /* display: grid;
  place-items: center;
  width: 100%;
  position: absolute;
  bottom: 42px; */
    display: -ms-grid;
    display: grid;
    place-items: center;
    margin: 0 auto;
    width: 180px;
    margin-top: 100px;
}

.main-nav .social-links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 180px;
    margin-bottom: 16px;
}

.main-nav .more {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 180px;
}

.main-nav .more a {
    font-size: var(--fs-2);
    color: var(--c-grey-light-2);
}

.main-nav .close-nav {
    /* width: 37px;
  height: 61px;
  background: url('../img/bilbilak.png') no-repeat 50% 50%;
  top: 22px; */
    width: 42px;
    height: 42px;
    background-color: #fff;
    border-radius: 999px 0 0 999px;
    z-index: 150;
    top: 6px;
    position: fixed;
    right: min(-42px, -42px);
    -webkit-transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.main-nav.active .close-nav {
    /* right: calc(min(80%, 360px) - 1px); */
    right: -webkit-calc(min(80%, 360px) - 30px);
    right: calc(min(80%, 360px) - 30px);
}

.main-nav .close-nav img {
    /* width: 28px;
  height: 28px; */
    width: 36px;
    height: 36px;
    opacity: 0.24;
    border-radius: 999px;
}

.index-carousel .page-container {
    background-color: var(--c-grey-light-8);
    padding: 15px 0;
    border-radius: 0 0 var(--br-5) var(--br-5);
}

.index-carousel .page-width {
    padding: 0;
}

.index-carousel .main-carousel {
    max-width: 100%;
    overflow: hidden;
}

.index-carousel .slide {
    max-width: 480px;
    /* margin: 0 auto; */
    padding: 0 15px;
}

.index-carousel .aspect-ratio {
    width: 100%;
    display: inline-block;
    position: relative;
}

.index-carousel .aspect-ratio::after {
    padding-top: 100%;
    display: block;
    content: '';
}

.index-carousel .index-cards-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.index-carousel .slide.banner img {
    max-width: 100%;
    max-height: 100%;
    border-radius: var(--br-4);
}

.i-card {
    height: 31%;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    overflow: hidden;
}

.i-card a {
    text-decoration: none;
    color: inherit;
}

.i-card .wrapper {
    height: 100%;
    padding: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    position: relative;
    background-color: var(--white);
    border-radius: var(--br-3);
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.i-card:hover .wrapper {
    background-color: var(--c-grey-dark-5);
}

.index-carousel .slide.multiple .card:nth-child(1) .wrapper {
    border-radius: var(--br-4) var(--br-4) var(--br-2) var(--br-2);
}

.index-carousel .slide.multiple .card:nth-child(2) .wrapper {
    border-radius: var(--br-2);
}

.index-carousel .slide.multiple .card:nth-child(3) .wrapper {
    border-radius: var(--br-2) var(--br-2) var(--br-4) var(--br-4);
}

.i-card .thumb {
    width: 28%;
    max-height: 100%;
    display: inline-block;
    position: relative;
    overflow: hidden;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-shadow: 0px 2px 6px -3px;
    box-shadow: 0px 2px 6px -3px;
    border-radius: var(--br-2);
    -webkit-transition: opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.i-card:hover .thumb {
    opacity: 0;
}

.i-card .thumb::after {
    padding-top: 100%;
    display: block;
    content: '';
}

.i-card .thumb .icon-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 15px;
}

.i-card .thumb img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}

.i-card .details {
    width: 72%;
    padding-right: 15px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-transition: opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.i-card:hover .details {
    opacity: 0;
}

.i-card .details .title {
    display: none;
}

.i-card .price .value {
    font-weight: 600;
    letter-spacing: -1px;
}

.i-card .price .currency {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
}

.i-card .tags {
    font-size: var(--fs-2);
    color: var(--c-grey-dark-4);
    font-weight: 300;
    margin-bottom: 2px;
}

.i-card .details .tag {
    display: none;
    border-radius: var(--br-round);
    padding: 0 12px 2px 12px;
    background-color: var(--c-grey-light-5);
    opacity: 0.9;
}

.i-card .details .tag.font-weight {
    display: initial;
}

.i-card .oneliner {
    position: absolute;
    width: -webkit-calc(72% - 30px);
    width: calc(72% - 30px);
    left: 10px;
    top: 12px;
    height: 35px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: right;
    -webkit-justify-content: right;
    -moz-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right;
}

.i-card:hover .oneliner {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.i-card .oneliner img {
    max-width: 100%;
    max-height: 100%;
    opacity: 0.85;
}

.i-card:hover .oneliner img {
    -webkit-filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(319deg) brightness(102%) contrast(101%);
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(319deg) brightness(102%) contrast(101%);
}

.i-card .cta {
    display: none;
}

.card-large.slider {
    width: 100%;
    max-width: 480px;
    position: relative;
    overflow: hidden;
    border-radius: var(--br-4);
}

.card-large.slider .wrapper {
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: -webkit-calc(100% - 20px);
    width: calc(100% - 20px);
    height: 120px;
    padding: 12px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    background-color: rgba(255, 255, 255);
    background-color: rgba(255, 255, 255, 0.25);
    -webkit-backdrop-filter: saturate(120%) blur(12px);
    backdrop-filter: saturate(120%) blur(12px);
}

.card-large.slider a {
    text-decoration: none;
    color: inherit;
    display: block;
}

.card-large.slider .cover-image {
    max-width: 100%;
    max-height: 100%;
}

.card-large.slider .thumb {
    overflow: hidden;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-shadow: 0px 2px 6px -3px;
    box-shadow: 0px 2px 6px -3px;
    border-radius: var(--br-2);
}

.card-large.slider .thumb .icon-container {
    width: 96px;
    height: 96px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px;
}

.card-large.slider .thumb img {
    max-width: 100%;
    max-height: 100%;
}

.card-large.slider .details {
    width: -webkit-calc(100% - 80px);
    width: calc(100% - 80px);
    padding: 5px 10px 0px 0;
    height: 100%;
    overflow: hidden;
    display: -ms-grid;
    display: grid;
}

.card-large.slider .details .title {
    font-size: var(--fs-5);
    font-weight: 600;
    margin: 0;
    padding: 0;
    margin-bottom: 5px;
}

.card-large.slider .price {
    margin-bottom: 5px;
}

.card-large.slider .price .value {
    font-weight: 600;
    letter-spacing: -1px;
}

.card-large.slider .price .currency {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-text-1);
    opacity: 0.58;
}

.card-large.slider .tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 20px;
}

.card-large.slider .tag {
    padding: 0 12px 2px 12px;
    margin-left: 5px;
    margin-bottom: 50px;
    white-space: nowrap;
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-text-1);
    background-color: rgb(255 255 255 / 25%);
    border-radius: var(--br-round);
}

.index-carousel .pagination-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 10px;
    position: relative;
}

.index-carousel .main-carousel-pagination {
    width: auto;
    margin: 0 auto;
    height: 30px;
    min-width: 80px;
    padding: 0 10px;
    background-color: #fff;
    border-radius: var(--br-round);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px;
}

.index-carousel .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.index-carousel .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--c-red-3);
    width: 24px;
    border-radius: 999px;
}

.featured-categories {
    padding-top: 36px;
}

.featured-categories .page-container {
    max-width: 100%;
    overflow: hidden;
}

.index-f-cats {
    padding: 20px 0;
}

.index-f-cats .item {
    text-decoration: none;
    color: initial;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    width: 220px;
    height: 120px;
    padding: 10px;
    overflow: hidden;
    background-color: var(--white);
    border-radius: var(--br-3);
    border: 1px solid var(--c-grey-light-5);
    margin: 0 8px;
}

.index-f-cats .item:nth-child(1) {
    margin-right: 0;
}

.index-f-cats .title {
    font-weight: 300;
    color: var(--c-grey-dark-2);
    margin-bottom: -2px;
    font-size: var(--fs-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.index-f-cats .title .counter {
    background-color: var(--c-grey-light-5);
    color: var(--c-grey);
    font-size: var(--fs-2);
    letter-spacing: 0.5px;
    padding: 0 8px;
    min-width: 38px;
    height: 18px;
    margin-right: 3px;
    border-radius: var(--br-round);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.index-f-cats .title .counter div {
    margin-top: 1px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    text-shadow: 0 -webkit-calc(var(--fs-3) * -1) 0 var(--white);
    text-shadow: 0 calc(var(--fs-3) * -1) 0 var(--white);
}

.index-f-cats .counter div span {
    display: block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform .4s ease;
    transition: -webkit-transform .4s ease;
    transition: transform .4s ease;
    transition: transform .4s ease, -webkit-transform .4s ease;
    -webkit-transform: translateY(var(--m)) translateZ(0);
    transform: translateY(var(--m)) translateZ(0);
}

.index-f-cats .counter div span:nth-child(1) {
    -webkit-transition-delay: 0.06s;
    transition-delay: 0.06s;
}

.index-f-cats .counter div span:nth-child(2) {
    -webkit-transition-delay: 0.12s;
    transition-delay: 0.12s;
}

.index-f-cats .counter div span:nth-child(3) {
    -webkit-transition-delay: 0.18s;
    transition-delay: 0.18s;
}

.index-f-cats .cat-name {
    font-weight: 600;
    font-size: var(--fs-6);
}

.index-f-cats .icon {
    position: absolute;
    left: 0;
}

.index-f-cats .icon img {
    width: 70px;
    opacity: 0.25;
}

.support-faq {
    padding-top: 50px;
}

.support-faq .main-wrapper {
    padding: 15px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-3);
}

.section-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    padding-bottom: 15px;
}

.section-title .title {
    font-size: var(--fs-5);
    margin: 0;
    padding: 5px 0 5px 0;
    -webkit-columns: var(--c-text-1);
    -moz-columns: var(--c-text-1);
    columns: var(--c-text-1);
}

.section-title .view-more {
    text-decoration: none;
    font-size: var(--fs-3);
    font-weight: 300;
    color: var(--c-grey);
}

.section-title .icon {
    display: none;
}

.support-faq .profile {
    background-color: var(--white);
    padding: 15px;
    border-bottom: 1px solid var(--c-grey-light-6);
}

.support-faq .profile:nth-child(1) {
    border-radius: var(--br-2) var(--br-2) 0 0;
}

.support-faq .profile:nth-last-child(1) {
    border-radius: 0 0 var(--br-2) var(--br-2);
    border: none !important;
}

.support-faq .info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.support-faq .info .picture {
    width: 64px;
    height: 64px;
    border-radius: var(--br-round);
    overflow: hidden;
    background-color: var(--c-grey-light-6);
    -webkit-transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.support-faq .profile:hover .info .picture {
    background-color: var(--c-red);
}

.support-faq .info img {
    max-width: 100%;
    max-height: 100%;
}

.support-faq .name-bio {
    width: -webkit-calc(100% - 68px);
    width: calc(100% - 68px);
    padding-right: 10px;
}

.support-faq .name-bio .name {
    font-weight: 600;
    color: var(--c-red-3);
    margin: 0;
}

.support-faq .name-bio .bio {
    display: block;
    margin-top: 6px;
    color: var(--c-grey);
    font-size: var(--fs-2);
    font-weight: 300;
    line-height: 1.3;
}

.support-faq .contact {
    padding-top: 15px;
}

.support-faq .options {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 300px;
}

.support-faq .options input {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    z-index: -10;
}

.support-faq .option {
    height: 34px;
    width: 34px;
    margin-left: 5px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    background-color: var(--c-grey-light-6);
    background-repeat: no-repeat;
    background-position: center;
    border-radius: var(--br-round);
    cursor: pointer;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.support-faq .option.email {
    background-image: url(../img/icons/socials/at-sign-grey-18-15.svg);
}

.support-faq .option.call {
    background-image: url(../img/icons/socials/phone-call-grey-18-15.svg);
}

.support-faq .option.telegram {
    background-image: url(../img/icons/socials/send-grey-18-15.svg);
}

.support-faq .option.whatsapp {
    background-image: url(../img/icons/socials/message-circle-grey-18-15.svg);
}

.support-faq .option:nth-last-child(1) {
    margin-left: 0;
}

.support-faq .options input:checked+label {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    background-color: var(--c-grey-dark-5);
    background-image: none;
}

.support-faq .option .value {
    opacity: 0;
    visibility: hidden;
    display: block;
    width: 100%;
    padding-top: 1px;
    text-decoration: none;
    color: initial;
    text-align: center;
    font-size: var(--fs-3);
    color: var(--white);
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.support-faq .option .value span {
    margin: 0 3px;
}

.support-faq .option .value:hover {
    color: var(--c-red-3);
    text-decoration: underline;
}

.support-faq .option.email .value {
    font-size: 12px;
    direction: ltr;
}

.support-faq .option.telegram .value {
    direction: ltr;
}

.support-faq .options input:checked+label .value {
    opacity: 1;
    visibility: visible;
}

.support-faq .faq-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 54px;
    padding: 0 15px;
    margin-top: 15px;
    font-size: var(--fs-2);
    font-weight: 300;
    text-decoration: none;
    color: var(--white);
    background-color: var(--c-grey-dark-5);
    border-radius: var(--br-2);
}

.support-faq .faq-link .value {
    white-space: nowrap;
}

.support-faq .faq-link .icon img {
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}

.p-index .latest-fonts {
    padding: 50px 0;
    border-bottom: 1px solid var(--c-grey-light-5);
}

.p-index .latest-fonts .filters .wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow-y: scroll;
    padding: 12px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-2);
    position: relative;
}

.p-index .latest-fonts .filters .filter {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    white-space: nowrap;
    height: 38px;
    background-color: #0000;
    border: none;
    outline: none;
    padding: 0 8px;
    margin-left: 8px;
    font-weight: 300;
    font-size: 16px;
    position: relative;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    cursor: pointer;
    border-radius: var(--br-2);
}

.p-index .latest-fonts .filters .filter:hover {
    background-color: #e4e4e9;
}

.p-index .latest-fonts .filters .filter::after {
    content: '✖';
    position: absolute;
    left: 7px;
    top: 13px;
    line-height: 1;
    color: #d5d5df;
    display: none;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .latest-fonts .filters .filter:hover::after {
    color: var(--c-text-1);
}

.p-index .latest-fonts .filters .filter.active {
    background-color: #fff;
    padding-left: 30px;
    color: var(--c-red-3);
    font-weight: 500;
    -webkit-box-shadow: 0px 8px 8px -2px rgb(0 0 0 / 5%), 0px 4px 4px -3px rgb(0 0 0 / 15%);
    box-shadow: 0px 8px 8px -2px rgb(0 0 0 / 5%), 0px 4px 4px -3px rgb(0 0 0 / 15%);
}

.p-index .latest-fonts .filters .filter.active::after {
    display: block;
}

.p-index .latest-fonts .list-view-all {
    text-decoration: none;
    background-color: var(--c-grey-light-7);
    color: var(--c-text-1);
    width: 100%;
    display: block;
    padding: 14px 0;
    border-radius: var(--br-2);
    text-align: center;
    font-weight: 300;
}

.cards-wrapper {
    padding: 20px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.cards-wrapper .card.small {
    width: 100%;
}

.cards-wrapper .card.small a {
    text-decoration: none;
    color: initial;
    display: block;
}

.card {
    position: relative;
}

.card>a {
    text-decoration: none;
    color: var(--c-text-1);
}

.card .wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-2);
    overflow: hidden;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.card .wrapper:hover {
    /* box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12); */
    background-color: var(--c-grey-light-6);
}

.card .thumb {
    width: 98px;
    height: 98px;
    padding: 15px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}

.card .thumb img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.card .details {
    padding: 5px 10px 5px 5px;
    width: -webkit-calc(100% - 86px);
    width: calc(100% - 86px);
    height: 100%;
    overflow: hidden;
}

.card.small .details .title {
    font-size: var(--fs-4);
    font-weight: 400;
    margin-bottom: 8px;
    margin-top: 2px;
    white-space: nowrap;
}

.card .price {
    margin-bottom: 8px;
}

.card.small .price .value {
    font-weight: 600;
    font-size: var(--fs-4);
}

.card .price .currency {
    font-weight: 300;
    font-size: var(--fs-2);
}

.card .tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 22px;
    overflow: hidden;
}

.card .tag {
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    height: 22px;
    padding: 0 8px;
    margin-left: 5px;
    margin-bottom: 50px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey-dark-2);
    background-color: var(--white);
    border-radius: var(--br-round);
}

.card a.tag {
    -webkit-transition: background-color 0.26s ease-in-out;
    transition: background-color 0.26s ease-in-out;
}

.card a.tag:hover {
    background-color: var(--c-grey-light-4);
}

.card .purchased {
    width: 100%;
    padding: 6px 0;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    font-size: var(--fs-2);
    color: var(--white);
    background-color: hsl(358deg 95% 62% / 90%);
    -webkit-box-shadow: var(--bs-grey-3);
    box-shadow: var(--bs-grey-3);
}

.p-index .big-banner {
    padding: 40px 0;
}

.p-index .designers {
    padding: 50px 0;
}

.p-index .designers .page-container {
    max-width: 100%;
    overflow: hidden;
}

.p-index .designers .swiper-wrapper {
    padding-bottom: 40px;
}

.p-index .designers .item {
    width: 200px;
    height: 267px;
    margin-left: 22px;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    color: initial;
    border-radius: var(--br-3);
    -webkit-transition: -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .designers .item:nth-last-child(1) {
    margin: 0;
}

.p-index .designers .item:hover {
    -webkit-box-shadow: var(--bs-grey-6);
    box-shadow: var(--bs-grey-6);
}

.p-index .designers .picture-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.p-index .designers .picture-wrapper img {
    -webkit-filter: grayscale(100%);
    /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    -webkit-transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .designers .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(hsl(240 3% 11% / 0%)), to(hsl(240 3% 11% / 80%)));
    background: linear-gradient(180deg, hsl(240 3% 11% / 0%) 0%, hsl(240 3% 11% / 80%) 100%);
    -webkit-transition: opacity 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .designers .second-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, hsl(240 3% 11% / 0%)), color-stop(90%, hsl(240 3% 11% / 100%)));
    background: linear-gradient(180deg, hsl(240 3% 11% / 0%) 50%, hsl(240 3% 11% / 100%) 90%);
    -webkit-transition: background-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: background-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .designers .item:hover .picture-wrapper img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

.p-index .designers .item:hover .overlay {
    opacity: 0;
}

.p-index .designers .item:hover .second-overlay {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, hsl(240 3% 11% / 0%)), color-stop(90%, hsl(240 3% 11% / 80%)));
    background: linear-gradient(180deg, hsl(240 3% 11% / 0%) 50%, hsl(240 3% 11% / 80%) 90%);
}

.p-index .designers .info {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.p-index .designers .details {
    width: 100%;
    padding: 12px;
}

.p-index .designers .font-counter {
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: var(--fs-2);
    background-color: #ffffff;
    padding: 1px 6px;
    border-radius: var(--br-round);
    opacity: 0.5;
    -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .designers .item:hover .font-counter {
    opacity: 1;
}

.p-index .designers .name {
    text-decoration: none;
    color: var(--white);
    text-align: center;
    font-size: var(--fs-5);
}

.p-index .designers .divider {
    height: 3px;
    width: 30px;
    background-color: var(--white);
    margin: 12px auto;
    border-radius: var(--br-round);
    opacity: 0.2;
}

.p-index .designers .fonts {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 10px;
}

.p-index .designers .font-icon {
    width: 38px;
    height: 38px;
    padding: 10px;
    margin-left: -10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    border: 2px solid var(--c-text-1);
    -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: -webkit-transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.p-index .designers .font-icon:hover {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.p-index .licenses {
    padding: 20px 0;
}

.p-index .licenses .section-container {
    padding: 10px 0;
}

.p-index .license {
    padding: 10px;
    margin-bottom: 15px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    color: initial;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-3);
}

.p-index .license .thumb {
    width: 48px;
    height: 48px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--white);
    border-radius: var(--br-round);
}

.p-index .license .font-icon {
    display: none;
}

.p-index .license .details {
    /* display: none; */
    width: -webkit-calc(100% - 48px);
    width: calc(100% - 48px);
    padding-right: 10px;
}

.p-index .license .details .top {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
    height: 18px;
    overflow: hidden;
    margin-bottom: 3px;
}

.p-index .license .details .bot {
    font-size: var(--fs-3);
    font-weight: 500;
    color: var(--c-text-1);
    height: 21px;
    overflow: hidden;
}

.p-index .license .license-holder {
    color: var(--c-red-3);
}

.p-index .licenses .summary-licenses {
    margin-top: 30px;
    padding: 15px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-4);
    overflow: hidden;
    position: relative;
}

.p-index .licenses .item {
    /* width: 100%; */
    /* margin: 0 20px; */
}

.p-index .licenses .license-badge {
    width: 164px;
    height: 164px;
    padding: 24px;
    margin: 20px auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 3px solid var(--c-grey-light-4);
    border-radius: var(--br-round);
    background-color: var(--white);
}

.p-index .licenses .type-1 .license-badge {
    border-color: #f5c794;
}

.p-index .licenses .type-2 .license-badge {
    border-color: var(--blue)
}

.p-index .licenses .type-3 .license-badge {
    border-color: var(--cyan)
}

.p-index .licenses .type-4 .license-badge {
    border-color: var(--orange)
}

.p-index .licenses .type-5 .license-badge {
    border-color: var(--yellow)
}

.p-index .licenses .type-6 .license-badge {
    border-color: var(--green)
}

.p-index .licenses .license-details {
    padding-top: 15px;
}

.p-index .licenses .license-details .title {
    color: var(--c-text-1);
    font-weight: 900;
    margin-bottom: 8px;
}

.p-index .licenses .license-details .summary {
    color: var(--c-grey-dark-2);
    font-size: var(--fs-3);
    font-weight: 300;
    height: 84px;
    overflow: hidden;
}

.p-index .licenses .bottom {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-bottom: 5px;
}

.p-index .licenses .view-more {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    color: var(--c-grey);
    font-size: var(--fs-2);
    font-weight: 300;
}

.p-index .licenses .view-more span {
    display: block;
    padding: 2px 5px;
}

.p-index .licenses .view-more img {
    width: 12px;
    height: 12px;
    margin-top: 2px;
}

.p-index .licenses .licenses-pagination {
    position: absolute;
    right: 15px;
    bottom: 15px;
    z-index: 10;
}

.p-index .licenses .licenses-pagination .swiper-pagination-bullet {
    background-color: var(--c-grey);
}

.p-index .licenses .licenses-pagination .swiper-pagination-bullet-active {
    width: 20px;
    border-radius: 999px;
    background-color: var(--c-red-3);
}

.blog-latest {
    padding: 60px 0 100px 0;
    overflow: hidden;
}

.blog-latest .post {
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-3);
    width: 240px;
    overflow: hidden;
    margin-left: 20px;
}

.blog-latest .post:nth-last-child(1) {
    margin-left: 0;
}

.blog-latest .post a {
    text-decoration: none;
    color: initial;
}

.blog-latest .post-cover {
    width: 240px;
    height: 180px;
    position: relative;
}

.blog-latest .post.video .post-cover a::after {
    content: '';
    background: url(../img/icons/play-circle.svg) no-repeat 50% 50%;
    width: 96px;
    height: 96px;
    position: absolute;
    top: -15px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background-color: rgb(255 255 255 / 20%);
    border-radius: var(--br-round);
}

.blog-latest .post-cover .thumb {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
}

.blog-latest .post-cover img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
}

.blog-latest .post-cover .overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left bottom, left top, from(currentColor), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(0deg, currentColor 0%, rgba(255, 255, 255, 0) 100%);
    opacity: 0.6;
    -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.blog-latest .post:hover .post-cover .overlay {
    opacity: 0;
}

.blog-latest .post-cover .overlay-2 {
    position: absolute;
    height: -webkit-calc(100% + 1px);
    height: calc(100% + 1px);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(10%, currentColor), color-stop(40%, rgba(255, 255, 255, 0)));
    background: linear-gradient(0deg, currentColor 10%, rgba(255, 255, 255, 0) 40%);
}

.blog-latest .content-card {
    width: -webkit-calc(100% - 20px);
    width: calc(100% - 20px);
    margin: -20px auto 10px auto;
    position: relative;
    padding: 10px;
    background-color: var(--white);
    border-radius: var(--br-2);
    min-height: 160px;
}

.blog-latest .content-card .top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 15px;
    color: var(--c-grey);
    font-size: var(--fs-2);
    font-weight: 300;
}

.blog-latest .content-card .category {
    color: var(--red);
}

.blog-latest .content-card .title {
    margin-bottom: 5px;
    height: 45px;
    overflow: hidden;
    color: var(--c-text-1);
    font-size: var(--fs-3);
    font-weight: 600;
    line-height: 1.5;
    -webkit-transition: color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.blog-latest .content-card .title:hover {
    color: var(--c-red-3);
}

.blog-latest .content-card .summary {
    font-size: var(--fs-2);
    font-weight: 300;
    line-height: 1.6;
    height: 40px;
    overflow: hidden;
    margin-bottom: 0;
}

.footer {}

.footer .top {}

.footer .top .page-container {
    background-color: var(--c-grey-dark-6);
    overflow: hidden;
    padding-bottom: 30px;
}

.footer .top .page-width {
    max-width: 100%;
}

.footer .brands-carousel {
    /* overflow: hidden; */
}

.footer .brands-carousel .swiper-wrapper {
    /* transition-timing-function: linear !important; */
}

.footer .brands-carousel .brand {
    padding: 40px 40px 10px 40px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 154px;
}

.footer .brands-carousel .logo {
    width: 74px;
    height: 74px;
}

.footer .brands-carousel .logo img {
    opacity: 0.4;
    -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.footer .brands-carousel .tooltip {
    position: absolute;
    padding: 5px 8px;
    width: 126px;
    top: 12px;
    margin: 0 auto;
    left: 0;
    right: 0;
    text-align: center;
    background-color: var(--c-grey-dark-3);
    font-size: var(--fs-2);
    border-radius: var(--br-1);
    opacity: 0;
    -webkit-transition: all 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.footer .brands-carousel .tooltip::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid var(--c-grey-dark-3);
    bottom: -6px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.footer .brands-carousel .overflow {
    max-width: 126px;
    overflow: hidden;
    white-space: nowrap;
}

.footer .brands-carousel .brand-name {
    color: var(--c-grey-light-3);
}

.footer .brands-carousel .font-name {
    color: var(--c-red);
}

.footer .brands-carousel .brand:hover .tooltip {
    opacity: 1;
}

.footer .brands-carousel .brand:hover img {
    opacity: 1;
}

.footer .main {
    background-color: var(--c-grey-dark-6);
    position: relative;
}

.footer .main::after {
    content: '';
    position: absolute;
    background-image: url(../img/pattern-2.svg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 340px;
    bottom: 0;
    opacity: 0.3;
}

.footer .main::before {
    content: '';
    position: absolute;
    width: 100%;
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(27, 27, 29, 0)), to(rgba(27, 27, 29, 1)));
    background: linear-gradient(0deg, rgba(27, 27, 29, 0) 0%, rgba(27, 27, 29, 1) 100%);
    height: 340px;
    bottom: 0;
    opacity: 0.8;
    z-index: 2;
}

.footer .main .box {
    padding-top: 50px;
}

.footer .main .contact {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-4);
    z-index: 5;
    position: relative;
}

.footer .main .contact .start {
    text-align: center;
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
}

.footer .main .contact .start::before {
    content: '';
    position: absolute;
    width: 80px;
    height: 6px;
    background-color: var(--c-red-3);
    top: 0px;
    border-radius: 999px;
    margin: 0 auto;
    left: 0;
    right: 0;
    -webkit-box-shadow: 0px 2px 8px -2px var(--c-red-3);
    box-shadow: 0px 2px 8px -2px var(--c-red-3);
}

.footer .main .contact .start .title {
    font-weight: 900;
    color: var(--c-grey-dark-5);
    margin-bottom: 5px;
}

.footer .main .contact .start .sub-title {
    color: var(--c-grey-dark-3);
}

.footer .main .contact-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    border-radius: var(--br-3);
    background-color: var(--c-grey-light-6);
}

.footer .main .contact-info .item {
    width: 50%;
    padding: 12px 10px;
    position: relative;
}

.footer .main .contact-info .item.phone::after {
    content: '';
    position: absolute;
    width: 1px;
    height: 38px;
    background-color: #dbdbe9;
    left: 10px;
    margin: auto;
    top: 0;
    bottom: 0;
}

.footer .main .contact-info .title {
    font-size: var(--fs-2);
    font-weight: 300;
    margin-bottom: 5px;
}

.footer .main .contact-info .phone-number {
    font-size: var(--fs-3);
    text-decoration: none;
    font-weight: 600;
    color: var(--c-text-1);
    direction: rtl;
}

.footer .main .contact-info .phone-number span {
    color: var(--c-red-3);
    margin-right: 3px;
}

.footer .main .contact-info .email {
    font-size: var(--fs-3);
    text-decoration: none;
    font-weight: 600;
    color: var(--c-text-1);
}

.footer .main .content {
    margin-top: 50px;
    position: relative;
    z-index: 5;
    padding-bottom: 50px;
    padding-bottom: 120px;
}

.footer .main .about .logo {
    width: 163px;
    display: block;
    margin: 0 auto;
}

.footer .main .about p {
    width: 100%;
    padding: 0px 30px;
    margin: 25px auto 0 auto;
    text-align: center;
    color: var(--c-grey-light-2);
    font-size: var(--fs-2);
    font-weight: 300;
    line-height: 1.6;
}

.footer .main .about .social-links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 260px;
    margin: 30px auto;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: var(--c-grey-dark-5);
    padding: 15px;
    border-radius: var(--br-3);
}

.footer .main .nav {
    display: none;
}

.footer .main .footer-badges {
    display: none;
}

.footer .bottom-bar {
    background-color: #000;
}

.footer .bottom-bar span {
    font-size: var(--fs-2);
    text-align: center;
    display: block;
    padding: 15px 0;
    color: var(--c-grey);
    font-weight: 300;
}

.fp-header .hero {
    background-color: var(--c-grey-dark-6);
}

.fp-header .cover {
    height: 360px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fp-header .oneliner {
    width: 90%;
    max-width: 560px;
    max-height: 160px;
}

.fp-header .oneliner img {
    max-height: 100%;
}

.fp-header .font-cats {
    margin-top: 15px;
    color: var(--c-grey);
    font-weight: 300;
    font-size: var(--fs-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.fp-header .cat {
    display: block;
    position: relative;
    text-decoration: none;
    color: var(--c-grey);
    padding: 0 8px;
}

.fp-header .cat::after {
    content: '';
    height: 14px;
    width: 1px;
    position: absolute;
    margin: auto;
    left: 0;
    top: 5px;
    bottom: 0;
    background-color: var(--c-grey-dark-3);
}

.fp-header .cat:nth-last-child(1)::after {
    display: none;
}

.fp-header .cat:hover {
    color: var(--c-red);
}

.fp-header .meta {}

.fp-header .meta .wrapper {
    margin-top: -70px;
}

.fp-header .meta .icon-container {
    width: 140px;
    height: 140px;
    padding: 25px;
    margin: 0 auto;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-shadow: 0px 6px 12px -6px;
    box-shadow: 0px 6px 12px -6px;
    border-radius: var(--br-4);
}

.fp-header .meta .icon-container img {
    max-width: 100%;
    max-height: 100%;
}

.fp-header .f-title {
    text-align: center;
    margin-top: 30px;
    font-size: var(--fs-7);
    font-weight: 600;
}

.fp-header .specs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow-x: scroll;
    padding: 20px 0;
}

.fp-header .spec {
    padding: 4px 8px 4px 12px;
    margin-left: 10px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--c-grey-dark-2);
    border: 1px solid var(--c-grey-light-3);
    border-radius: var(--br-round);
    font-weight: 300;
    font-size: var(--fs-3);
}

.fp-header .spec .icon {
    margin-left: 7px;
}

.fp-header .spec .icon img {
    width: 18px;
}

.fp-header .spec .value {
    padding-bottom: 2px;
}

.fp-header .spec .value a {
    text-decoration: none;
    color: var(--c-grey-dark-2);
}

.fp-header .spec .value a:nth-child(n+2)::before {
    content: ',';
    font-weight: 600;
    margin: 0 2px 0 5px;
}

.fp-header .spec .value a:hover {
    color: var(--c-red-3);
}

.fp-header .short-desc {
    padding: 20px 0;
}

.fp-header .short-desc p {
    line-height: 1.8;
    color: var(--c-text-1);
    font-weight: 300;
    margin: 0 auto;
}

.purchase-options {
    background-color: var(--c-grey-light-7);
    margin: 20px 0;
}

.purchase-options .bundles {
    padding: 25px 0;
}

.purchase-options .bundles .bundle-option {
    margin-bottom: 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #fff;
    border-radius: var(--br-2);
    border: 1px solid hsla(0, 0%, 11%, 0.15);
    position: relative;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1); */
}

.purchase-options .bundles .bundle-option:nth-last-child(1) {
    margin-bottom: 0;
}

.purchase-options .bundles input {
    width: 0;
    height: 0;
    opacity: 0;
    visibility: hidden;
    position: absolute;
}

.purchase-options .bundles .option-wrapper {
    padding: 10px 10px 10px 0;
    width: -webkit-calc(100% - 65px);
    width: calc(100% - 65px);
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 0 var(--br-2) var(--br-2) 0;
    cursor: pointer;
    height: 98px;
    /* transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1); */
}

.purchase-options .bundles .checkbox {
    width: 20px;
    height: 20px;
    background-color: var(--c-grey-light-6);
    border-radius: 999px;
    border: 1px solid var(--c-grey-light-4);
}

.purchase-options .bundles .info {
    width: -webkit-calc(100% - 20px);
    width: calc(100% - 20px);
    padding: 0 10px 0 0;
}

.purchase-options .bundles .name {
    font-weight: 500;
    margin-bottom: 3px;
}

.purchase-options .bundles .desc {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey-dark-2);
    height: 18px;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 3px;
}

.purchase-options .bundles .extra {
    display: none;
}

.purchase-options .bundles .prices {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.purchase-options .bundles .price {
    font-weight: 600;
}

.purchase-options .bundles .currency {
    font-weight: 300;
    font-size: var(--fs-2);
    margin-right: 3px;
    color: var(--c-grey);
}

.purchase-options .bundles .preview-toggle {
    width: 65px;
}

.purchase-options .bundles .circle {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 30px;
    left: 15px;
    border-radius: 14px;
    border: 1px solid var(--c-grey-light-5);
    -webkit-box-shadow: 0px 3px 6px -3px rgb(0 0 0 / 10%);
    box-shadow: 0px 3px 6px -3px rgb(0 0 0 / 10%);
    cursor: pointer;
}

.purchase-options .bundles .circle .plus {
    width: 100%;
    height: 100%;
    position: relative;
}

.purchase-options .bundles .circle .plus::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 2px;
    background-color: var(--c-grey-light-4);
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.purchase-options .bundles .circle .plus::after {
    content: '';
    position: absolute;
    width: 2px;
    height: 20px;
    background-color: var(--c-grey-light-4);
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.purchase-options .bundles .preview {
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.15s ease-out;
    transition: max-height 0.15s ease-out;
    width: 100%;
    border-radius: 0 0 var(--br-2) var(--br-2);
}

.purchase-options .bundles .preview .wrapper {
    padding: 10px;
}

.purchase-options .bundles .preview .media-container {
    padding: 10px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-1);
    position: relative;
}

.purchase-options .bundles .preview .media-container::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid var(--c-grey-light-7);
    top: -9px;
    left: 15px;
}

.purchase-options .bundles .preview img {
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
}

.purchase-options .bundles .bundle-option.open .preview {
    max-height: 600px;
    -webkit-transition: max-height 0.25s ease-in;
    transition: max-height 0.25s ease-in;
}

.purchase-options .bundles input:checked~label {
    background-color: var(--c-text-1);
    -webkit-box-shadow: -4px 4px 8px -4px var(--c-text-1);
    box-shadow: -4px 4px 8px -4px var(--c-text-1);
}

.purchase-options .bundles .bundle-option.open input:checked~label {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0 var(--br-2) 0 0;
}

.purchase-options .bundles input:checked~label .checkbox {
    background-color: var(--c-red);
    border: 1px solid var(--c-red);
    background-image: url(../img/icons/check-white.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.purchase-options .bundles input:checked~label .name {
    color: var(--red);
    font-weight: 600;
}

.purchase-options .bundles input:checked~label .desc {
    color: var(--c-grey-light-3);
}

.purchase-options .bundles input:checked~label .price {
    color: #fff;
    font-weight: 400;
}

.purchase-options .bundles input:checked~label~.preview-toggle {
    background-color: var(--c-text-1);
    border: 1px solid var(--c-text-1);
    border-radius: var(--br-2) 0 0 var(--br-2);
    -webkit-box-shadow: 4px 4px 8px -4px var(--c-text-1);
    box-shadow: 4px 4px 8px -4px var(--c-text-1);
}

.purchase-options .bundles .bundle-option.open input:checked~label~.preview-toggle {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: var(--br-2) 0 0 0;
}

.purchase-options .bundles input:checked~label~.preview {
    background-color: var(--c-text-1);
    -webkit-box-shadow: 0px 4px 8px -4px var(--c-text-1);
    box-shadow: 0px 4px 8px -4px var(--c-text-1);
}

.purchase-options .bundles input:checked~label~.preview-toggle .circle {
    border: 1px solid hsl(240deg 4% 40%);
    -webkit-box-shadow: 0px 3px 6px -3px rgb(0 0 0);
    box-shadow: 0px 3px 6px -3px rgb(0 0 0);
}

.purchase-options .bundles input:checked~label~.preview-toggle .circle .plus::after {
    background-color: hsl(240deg 4% 40%);
}

.purchase-options .bundles input:checked~label~.preview-toggle .circle .plus::before {
    background-color: hsl(240deg 4% 40%);
}

.purchase-options .bundles .bundle-option.open .preview-toggle .circle .plus::after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.purchase-options .licenses {
    padding: 30px 15px;
    margin: 0px -15px;
    border-top: 1px solid var(--c-grey-light-4);
    border-bottom: 1px solid var(--c-grey-light-4);
}

.purchase-options .licenses .header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 20px;
}

.purchase-options .licenses .header .title {
    font-weight: 500;
}

.purchase-options .licenses .header .about {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.purchase-options .licenses .header .value {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-blue);
    padding-right: 3px;
}

.purchase-options .licenses .wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--c-grey-light-5);
    padding: 7px;
    border-radius: var(--br-3);
    position: relative;
}

.purchase-options .licenses .license-select {
    width: 68%;
    max-width: 420px;
    height: 54px;
    padding: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    cursor: pointer;
    background-color: #fff;
    border-radius: var(--br-2);
    border: 1px solid var(--c-grey-light-4);
    -webkit-box-shadow: var(--bs-grey-2);
    box-shadow: var(--bs-grey-2);
}

.purchase-options .licenses .license-select::after {
    content: '';
    display: inline-block;
    border-style: solid;
    position: absolute;
    height: 8px;
    width: 8px;
    left: 10px;
    border-width: 2px 2px 0 0;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    color: var(--c-red);
}

.purchase-options .licenses .remove-license {
    position: absolute;
    font-size: 22px;
    background-color: var(--c-grey-light-5);
    width: 24px;
    height: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    right: -10px;
    z-index: 2;
    cursor: pointer;
}

.purchase-options .licenses .license-title {
    font-size: var(--fs-3);
}

.purchase-options .licenses .owner-info {
    display: none;
}

.purchase-options .licenses .price {
    font-weight: 600;
}

.purchase-options .licenses .old-price {
    text-align: center;
    text-decoration: line-through;
    color: var(--c-red-3);
}

.purchase-options .licenses .currency {
    font-weight: 300;
    font-size: var(--fs-2);
    margin-right: 3px;
    color: var(--c-grey);
}

.purchase-options .registered-license .license-info {
    padding: 10px 15px;
    margin-bottom: 15px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    font-size: var(--fs-3);
    background-color: hsl(240deg 12% 88%);
    border-radius: var(--br-2);
}

.purchase-options .registered-license .badge {
    width: 48px;
    height: 48px;
    background-color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    padding: 7px;
}

.purchase-options .registered-license .name {
    font-weight: 600;
    font-size: var(--fs-4);
    margin-bottom: 3px;
}

.purchase-options .registered-license .owner-info {
    display: block;
}

.purchase-options .licenses .add-new-license {
    height: 54px;
    padding: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    background-color: #fff;
    border-radius: var(--br-2);
    border: 1px solid var(--c-grey-light-4);
    -webkit-box-shadow: var(--bs-grey-2);
    box-shadow: var(--bs-grey-2);
}

.purchase-options .licenses .add-new-license img {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-left: 5px;
}

.purchase-options .registered-license .new-license {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 15px;
}

.purchase-options .registered-license .license-select .owner-info {
    display: none;
}

.purchase-options .total-sc {
    padding: 30px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -moz-box-orient: vertical;
    -moz-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

.purchase-options .total-sc .add-to-cart {
    outline: none;
    display: block;
    height: 54px;
    margin-top: 20px;
    border-radius: var(--br-2);
    border: none;
    background-color: var(--c-red);
    /* box-shadow: 0px 3px 10px -5px var(--c-red); */
    color: #fff;
    font-size: var(--fs-5);
    cursor: pointer;
}

.purchase-options .total-sc .total {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
}

.purchase-options .total-sc .total .title {
    font-weight: 500;
}

.purchase-options .total-sc .total .value {
    font-weight: 600;
    font-size: var(--fs-6);
}

.purchase-options .total-sc .total .currency {
    font-weight: 300;
    font-size: var(--fs-2);
    margin-right: 3px;
    color: var(--c-grey);
}

.select-license-modal {
    display: none;
}

.select-license-modal.is-open {
    display: block;
}

.select-license-modal .l-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 200;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.2);
    -webkit-backdrop-filter: saturate(50%) blur(12px);
    backdrop-filter: saturate(50%) blur(12px);
}

.select-license-modal .l-content {
    background-color: #fff;
    width: 90%;
    max-width: 500px;
    height: 630px;
    max-height: 96vh;
    border-radius: var(--br-3);
    overflow-y: auto;
    -webkit-box-shadow: var(--bs-grey-5);
    box-shadow: var(--bs-grey-5);
}

.select-license-modal .l-content .content-wrapper {
    position: relative;
}

.select-license-modal .content-wrapper>.header {
    /* padding: 15px; */
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.select-license-modal .content-wrapper>.header .title {
    font-size: var(--fs-3);
    color: var(--c-red-3);
    font-weight: 600;
    padding: 12px;
}

.select-license-modal .content-wrapper>.header .close-bt {
    padding: 10px;
}

.select-license-modal .options {
    padding: 0 10px;
    max-height: 350px;
    overflow: auto;
}

.select-license-modal .license-option-wrapper {
    position: relative;
    margin-bottom: 8px;
}

.select-license-modal .license-option-wrapper input[type=radio] {
    width: 0;
    height: 0;
    opacity: 0;
    visibility: hidden;
    position: absolute;
}

.select-license-modal .license-option-wrapper .licence-desc-toggle .circle {
    position: relative;
    width: 21px;
    height: 21px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--c-grey-light-2);
    border-radius: var(--br-round);
    background-color: #fff;
}

.select-license-modal .license-option-wrapper .licence-desc-toggle .circle::after {
    content: '';
    position: absolute;
    width: 13px;
    height: 1px;
    background-color: var(--c-grey-light-2);
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.select-license-modal .license-option-wrapper .licence-desc-toggle .circle::before {
    content: '';
    position: absolute;
    width: 1px;
    height: 13px;
    background-color: var(--c-grey-light-2);
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.select-license-modal .op-label {
    cursor: pointer;
    position: relative;
}

.select-license-modal .op-label .option {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 8px 8px 40px;
    background-color: var(--c-grey-light-7);
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-2);
    position: relative;
}

.select-license-modal .license-option-wrapper .licence-desc-toggle {
    position: absolute;
    left: 8px;
    top: 9px;
    /* padding: 5px; */
}

.select-license-modal .op-label .badge {
    display: none;
}

.select-license-modal .op-label .name {
    font-size: var(--fs-3);
}

.select-license-modal .op-label .preices {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.select-license-modal .op-label .price {
    font-size: var(--fs-3);
    font-weight: 600;
}

.select-license-modal .op-label .old-price {
    display: none;
}

.select-license-modal .op-label .currency {
    font-size: var(--fs-2);
    font-weight: 300;
    margin-right: 2px;
}

.select-license-modal .license-desc {
    max-height: 0;
    width: 100%;
    overflow: hidden;
    -webkit-transition: max-height 0.15s ease-out;
    transition: max-height 0.15s ease-out;
    font-size: var(--fs-2-5);
    color: var(--c-text-1);
    /* font-weight: 300; */
    background-color: var(--c-grey-light-7);
    border-radius: 0 0 var(--br-2) var(--br-2);
}

.select-license-modal .license-head {
    display: none;
}

.select-license-modal .license-desc .content {
    padding: 10px;
}

.select-license-modal .license-desc .list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.select-license-modal .license-desc .list li {
    margin-bottom: 10px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.select-license-modal .license-desc .list li::before {
    content: '';
    height: 15px;
    width: 15px;
    margin-left: 5px;
    background-color: #fff;
    display: block;
    border-radius: var(--br-1);
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.select-license-modal .license-desc .list li.active::before {
    background-image: url(../img/icons/check-green.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 12px;
}

.select-license-modal .license-desc .list li.inactive {
    color: var(--c-grey);
}

.select-license-modal .license-desc .list li.inactive::before {
    background-image: url(../img/icons/x-dark.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 13px 11px;
    background-color: rgb(0 0 0 / 15%);
}

.select-license-modal .license-desc .list li.hidden {
    display: none;
}

.select-license-modal .license-desc .only-for-personal {
    display: block;
}

.select-license-modal .license-owner {
    padding: 10px;
    border-top: 1px solid var(--c-grey-light-5);
    overflow-y: scroll;
}

.select-license-modal .license-owner.add-padding {
    padding-bottom: 100px;
}

.select-license-modal .license-owner .form-control-x {
    margin-bottom: 10px;
}

.select-license-modal .license-owner label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    margin-bottom: 5px;
}

.select-license-modal .license-owner label .title {
    font-size: var(--fs-3);
    font-weight: 500;
}

.select-license-modal .license-owner label .sub {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
}

.select-license-modal .license-owner input {
    outline: none;
    width: 100%;
    padding: 8px;
    border: 1px solid var(--c-grey);
    border-radius: var(--br-1);
}

.select-license-modal .license-owner input:focus {
    border: 1px solid var(--c-red-3);
}

.select-license-modal .license-owner .submit-license {
    outline: none;
    display: block;
    width: 100%;
    height: 42px;
    border-radius: var(--br-1);
    border: none;
    background-color: var(--c-red);
    color: #fff;
    cursor: pointer;
}

.select-license-modal .license-option-wrapper input:checked~.op-label .option {
    background-color: var(--c-text-1);
    border-color: transparent;
    -webkit-box-shadow: 0px 3px 6px -3px var(--c-text-1);
    box-shadow: 0px 3px 6px -3px var(--c-text-1);
}

.select-license-modal .license-option-wrapper input:checked~.op-label .option::before {
    content: '';
    height: 22px;
    width: 3px;
    border-radius: 3px 0 0 3px;
    background-color: var(--c-red);
    right: 0;
    position: absolute;
    -webkit-box-shadow: -1px 0px 5px 0px var(--c-red);
    box-shadow: -1px 0px 5px 0px var(--c-red);
}

.select-license-modal .license-option-wrapper input:checked~.op-label .name {
    color: var(--c-red-3);
    /* font-weight: 300; */
}

.select-license-modal .license-option-wrapper input:checked~.op-label .price {
    color: var(--c-grey-light-7);
}

.select-license-modal .license-option-wrapper input:checked~.op-label .currency {
    opacity: 0.5;
}

.select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle .circle {
    background-color: transparent;
    border-color: var(--c-grey);
}

.select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle .circle::before {
    background-color: var(--c-grey);
}

.select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle .circle::after {
    background-color: var(--c-grey);
}

.select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle~.license-desc {
    background-color: var(--c-text-1);
    color: var(--c-grey-light-4);
    -webkit-box-shadow: 0px 3px 6px -3px var(--c-text-1);
    box-shadow: 0px 3px 6px -3px var(--c-text-1);
}

.select-license-modal .license-option-wrapper.open input:checked~.op-label~.licence-desc-toggle~.license-desc {
    border: 1px solid var(--c-text-1);
}

.select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle~.license-desc .list li.active::before {
    background-color: transparent;
}

.select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle~.license-desc .list li.inactive::before {
    background-color: transparent;
    background-image: url(../img/icons/x-red-2.svg);
}

.select-license-modal .license-option-wrapper.open .licence-desc-toggle .circle::before {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.select-license-modal .license-option-wrapper.open .license-desc {
    max-height: 600px;
    -webkit-transition: max-height 0.25s ease-in;
    transition: max-height 0.25s ease-in;
    border: 1px solid var(--c-grey-light-5);
    border-top: none;
}

.select-license-modal .license-option-wrapper.open .op-label .option {
    border-radius: var(--br-2) var(--br-2) 0 0;
    border-bottom: none;
}

.purchase-options .bundles .bundle-already-purchased {
    background-color: var(--c-grey-light-5);
    border-radius: var(--br-2);
    border: 1px solid hsla(0, 0%, 11%, 0.15);
}

.purchase-options .bundles .bundle-already-purchased label .checkbox {
    display: none !important;
}

.purchase-options .bundles .bundle-already-purchased .info {
    width: 100%;
}

.purchase-options .bundles .bundle-already-purchased .prices {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.purchase-options .bundles .bundle-already-purchased .already-purchased {
    font-size: var(--fs-3);
    color: #fff;
    background-color: var(--c-blue);
    padding: 1px 10px;
    border-radius: var(--br-1);
    margin-left: 5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.purchase-options .bundles .bundle-already-purchased .price {
    text-decoration: line-through;
}

.purchase-options .bundles .prices .upgrade {
    margin-left: 5px;
    font-weight: 300;
    opacity: 0.8;
}

.purchase-options .bundles input:checked~label .upgrade {
    color: #fff;
}

.fontpage-tabs {
    padding: 30px 0;
}

.fontpage-tabs .tabs-header {
    position: relative;
}

.fontpage-tabs .tabs-header::after {
    content: '';
    position: absolute;
    bottom: 10px;
    width: 100%;
    border-bottom: 1px solid var(--c-grey-light-5);
}

.fontpage-tabs .tabs-header .page-width {
    padding: 0;
}

.tabs .tabs-header .wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: auto;
    padding-bottom: 10px;
}

.tabs .tabs-header .tablink {
    padding: 15px 15px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative;
    border: none;
    outline: none;
    background-color: transparent;
    font-weight: 300;
    color: var(--c-grey);
    cursor: pointer;
    overflow: visible;
    -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.tabs .tabs-header .tablink:hover {
    color: var(--c-red);
}

.tabs .tabs-header .tablink.active {
    /* font-weight: 500; */
    color: var(--c-text-1);
}

.tabs .tabs-header .tablink::after {
    content: '';
    position: absolute;
    height: 9px;
    width: 0px;
    bottom: -4px;
    margin: 0 auto;
    left: 0;
    right: 0;
    z-index: 2;
    border-radius: var(--br-round);
    background-color: var(--c-grey-light-7);
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.tabs .tabs-header .tablink.active::after {
    width: 48px;
    background-color: var(--c-red);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-red);
    box-shadow: 0px 2px 4px -2px var(--c-red);
}

.tabs .tabs-content .tabcontent {
    display: none;
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;
}

.tabs .tabs-content .tabcontent>.wrapper {
    padding: 25px 0;
    max-width: 700px;
}

.fontpage-tabs .tabs-content .font-specs .spec {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 10px 0;
    font-size: var(--fs-3);
}

.fontpage-tabs .tabs-content .font-specs .spec:hover {
    background-color: var(--c-grey-light-8);
}

.fontpage-tabs .tabs-content .font-specs .spec .title {
    font-weight: 500;
}

.fontpage-tabs .tabs-content .font-specs .spec .value {
    text-align: left;
    font-weight: 300;
}

.fontpage-tabs .tabs-content .font-specs .spec.tags .tag {
    color: var(--c-text-1);
}

.font-lab-sc {
    padding: 20px 0;
}

.font-lab-sc .page-container {
    border-top: 1px solid var(--c-grey-light-5);
}

.font-lab-sc .main-wrapper {
    padding: 50px 0;
}

.font-lab-sc .controls {
    width: 100%;
    max-width: 600px;
    background-color: var(--c-grey-light-8);
    border: 1px solid var(--c-grey-light-4);
    border-radius: var(--br-2);
    position: relative;
    margin: 0 auto;
}

.font-lab-sc .controls .fl-textfield {
    width: 100%;
    border: none;
    padding: 15px;
    background-color: transparent;
    font-weight: 300;
}

.font-lab-sc .controls .character-counter {
    position: absolute;
    font-size: var(--fs-3);
    top: -25px;
    left: 0;
    color: var(--c-grey);
    font-weight: 300;
}

.font-lab-sc .controls .bt-wrapper {
    padding: 5px;
}

.font-lab-sc .controls .fl-submit {
    width: 100%;
    outline: none;
    display: block;
    height: 46px;
    border-radius: var(--br-1);
    border: none;
    background-color: var(--c-blue);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-blue);
    box-shadow: 0px 2px 4px -2px var(--c-blue);
    color: #fff;
    cursor: pointer;
}

.font-lab-sc .fl-results {
    padding: 30px 0;
}

.font-lab-sc .fl-results .result {
    padding: 15px 0 10px 0;
    border-bottom: 1px solid var(--c-grey-light-5);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.font-lab-sc .fl-results .result .media-container {
    margin-bottom: 5px;
}

.font-lab-sc .fl-results .result .font-weight {
    font-size: var(--fs-3);
    font-weight: 300;
    color: var(--c-grey-light-4);
    text-align: center;
}

.font-lab-sc .font-lab-link {
    display: none;
}

.main-font-desc .text-content-wrapper {
    /* max-width: 1024px;
  margin: 0 auto; */
}

.main-font-desc .section.before-carusel .sc-title {
    margin-bottom: 1.5rem;
    font-size: var(--fs-5);
    text-align: center;
    /* max-width: 1024px;
  margin: 0 auto; */
}

.main-font-desc .section.before-carusel {
    font-size: var(--fs-3);
    line-height: 1.8;
}

.main-font-desc .section.after-carusel {
    font-size: var(--fs-3);
    line-height: 1.8;
}

.main-font-desc .section.gallery {
    padding: 30px 0;
    overflow: hidden;
    margin: 0 -15px;
}

.main-font-desc .section.gallery .photos-carusel {
    position: relative;
}

.main-font-desc .section.gallery .item {
    width: auto;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: grab;
    /* width: 100%; */
}

.main-font-desc .section.gallery .item .caption {
    position: absolute;
    width: -webkit-calc(100% - 20px);
    width: calc(100% - 20px);
    bottom: 10px;
    left: 0;
    right: 0;
    margin: auto;
    padding: 10px;
    font-size: var(--fs-2-5);
    background-color: rgb(255 255 255 / 75%);
    border-radius: var(--br-1);
}

.main-font-desc .section.gallery .photo-wrapper {
    position: relative;
}

.main-font-desc .section.gallery .photo-wrapper img {
    max-height: -webkit-calc(100vw - 50px);
    max-height: calc(100vw - 50px);
    max-width: -webkit-calc(100vw - 50px);
    max-width: calc(100vw - 50px);
    border-radius: var(--br-2);
}

.main-font-desc .section.gallery .swiper-buttons {
    width: 36px;
    height: 36px;
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: var(--br-round);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
    font-size: 18px;
    font-weight: 600;
    color: var(--c-text-1);
    opacity: 0.6;
}

.font-p-designers {
    padding: 50px 0;
}

.font-p-designers .page-container {
    background-color: var(--c-grey-light-7);
}

.font-p-designers .container {
    padding: 50px 0;
}

.font-p-designers .designer {
    background-color: #fff;
    border-radius: var(--br-3);
    margin-bottom: 30px;
}

.font-p-designers .designer:nth-last-child(1) {
    margin-bottom: 0;
}

.font-p-designers .designer .main {}

.font-p-designers .designer .right {
    padding-top: 30px;
    position: relative;
}

.font-p-designers .designer .media-container {
    width: 120px;
    height: 120px;
    margin: 0 auto;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    border: 1px solid var(--c-grey-light-4);
}

.font-p-designers .designer .role span {
    position: absolute;
    padding: 5px 10px 5px 10px;
    margin: 10px auto;
    display: block;
    text-align: center;
    font-size: var(--fs-2-5);
    font-weight: 300;
    background-color: var(--c-grey-light-6);
    border-radius: var(--br-2);
    top: 0;
    left: 10px;
}

.font-p-designers .designer .name {
    text-align: center;
    font-weight: 600;
    font-size: var(--fs-5);
    color: var(--c-red-3);
    margin: 15px 0;
}

.font-p-designers .designer .social-links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    padding: 10px 0 30px 0;
}

.font-p-designers .designer .social {
    display: block;
    margin: 0 10px;
}

.font-p-designers .designer .about {
    border-bottom: 1px solid var(--c-grey-light-5);
}

.font-p-designers .designer .about .wrapper {
    padding: 15px;
    font-size: var(--fs-3);
    font-weight: 300;
    line-height: 1.8;
    color: var(--c-grey-dark-2);
}

.font-p-designers .designer .fonts {
    display: none;
}

.font-p-designers .designer .view-more {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    font-size: var(--fs-3);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 15px;
    color: var(--c-grey-dark-5);
    font-weight: 300;
}

.font-p-designers .designer .view-more img {
    margin-right: 5px;
    margin-top: 5px;
}

.recommended-sc {
    padding-bottom: 100px;
}

.recommended-sc .sc-title {
    margin-bottom: 15px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.recommended-sc .sc-title .title {
    font-weight: 600;
}

.recommended-sc .sc-title .carusel-controls {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.recommended-sc .sc-title .swiper-buttons {
    width: 30px;
    height: 30px;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none;
}

.recommended-sc .sc-title .rf-control-button-next {
    margin-right: 10px;
}

.recommended-sc .sc-title .rf-control-button-prev img {
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}

.recommended-sc .sc-title .swiper-buttons.swiper-button-disabled {
    cursor: inherit;
    opacity: 0.1;
}

.recommended-sc .recommended-fonts-carusel {
    overflow: hidden;
    margin: 0 -15px;
}

.recommended-sc .card {
    width: 86%;
    margin-right: 15px;
}

.recommended-sc .card a {
    text-decoration: none;
    color: initial;
}

.comments-faq-sc {
    border-top: 1px solid var(--c-grey-light-5);
    padding: 50px 0;
}

.comments-faq-sc .comments-sc .sc-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 15px;
}

.comments-faq-sc .comments-sc .sc-title .icon {
    display: none;
}

.comments-faq-sc .comments-sc .sc-title .title {
    font-weight: 600;
}

.comments-faq-sc .comment-conatiner {
    padding: 10px;
    background-color: var(--c-grey-light-6);
    border-radius: var(--br-2);
    margin-bottom: 15px;
}

.comments-faq-sc .comment-conatiner ul.children {
    margin: 0;
    padding: 0;
}

.comment-need-to-login {}

.comment-need-to-login .wrapper {
    padding: 30px;
    background-color: var(--c-grey-light-6);
    border-radius: var(--br-2);
    margin-bottom: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    line-height: 2;
    font-weight: 300;
}

.comment-need-to-login .wrapper span {}

.comment-need-to-login .wrapper a {
    color: var(--c-blue-3);
}

.comments-faq-sc .comment {
    padding-bottom: 30px;
}

.comments-faq-sc .comment-conatiner .comment:nth-last-child(1) {
    margin-bottom: 0px;
}

.comments-faq-sc .comment.type-reply {
    padding: 10px;
    background-color: var(--white);
    border-radius: var(--br-2);
    margin-bottom: 15px;
}

.comments-faq-sc .comment .c-head {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 15px;
}

.comments-faq-sc .comment .c-head .start {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.comments-faq-sc .comment .profile {
    position: relative;
    padding-bottom: 6px;
}

.comments-faq-sc .comment .avatar {
    width: 54px;
    height: 54px;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 2px solid #fff;
    border-radius: var(--br-round);
}

.comments-faq-sc .comment .profile .role {
    position: absolute;
    bottom: 0px;
    width: 54px;
    padding: 1px 0;
    font-size: var(--fs-1);
    font-weight: 300;
    color: var(--c-grey-dark-4);
    background-color: #fff;
    text-align: center;
    border-radius: var(--br-round);
}

.comments-faq-sc .comment.rol-buyer .profile .role {
    color: var(--c-blue);
}

.comments-faq-sc .comment.rol-admin .profile .role {
    color: var(--white);
    background-color: var(--c-red-3);
}

.comments-faq-sc .comment.rol-admin .avatar {
    border-color: var(--c-red-3);
}

.comments-faq-sc .comment .details {
    width: -webkit-calc(100% - 54px);
    width: calc(100% - 54px);
    padding: 0 10px 0 0;
    overflow: hidden;
}

.comments-faq-sc .comment .details * {
    white-space: nowrap;
    overflow: hidden;
}

.comments-faq-sc .comment .name {
    font-size: var(--fs-3);
    font-weight: 600;
    margin-bottom: 5px;
}

.comments-faq-sc .comment .date {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
}

.comments-faq-sc .comment .reply-to {
    font-size: var(--fs-2);
    color: var(--c-red-3);
    display: none;
}

.comments-faq-sc .comment .c-head .end {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.comments-faq-sc .comment .reply-bt {
    height: 30px;
    width: 68px;
    outline: none;
    border: none;
    background-color: #fff;
    color: var(--c-grey-dark-2);
    font-size: var(--fs-3);
    border-radius: var(--br-1);
}

.comments-faq-sc .comment.type-reply .reply-bt {
    background-color: var(--c-grey-light-7);
}

.comments-faq-sc .comment .text-wrapper {
    font-size: var(--fs-3);
    line-height: 1.8;
    padding-bottom: 10px;
}

.comments-faq-sc .comment .text-wrapper p {
    margin-bottom: 0;
}

.comments-faq-sc .comment .text-wrapper p:has(a) {
    overflow-wrap: anywhere;
}

.comments-faq-sc .comment .media {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px;
    background-color: var(--c-grey-light-4);
    border-radius: var(--br-1);
    padding-left: 0;
}

.comments-faq-sc .comment.type-reply .media {
    background-color: var(--c-grey-light-6);
}

.comments-faq-sc .comment .media .media-container {
    width: 48px;
    height: 48px;
    margin-left: 5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-1);
    overflow: hidden;
    border: 2px solid #fff;
    background-color: #fff;
}

.comments-faq-sc .comment .media .media-container img {
    max-height: 100%;
    max-width: 100%;
}

.pagination-container {
    padding: 30px 0;
}

.pagination-container>.wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.pagination-container ul {
    margin: 0 auto;
    padding: 0;
    list-style: none;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.pagination-container .item {
    width: 44px;
    height: 44px;
    margin: 0 3px;
    background-color: var(--c-grey-light-7);
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    border-radius: var(--br-round);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    -webkit-transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.pagination-container .item:hover {
    background-color: var(--c-grey-light-4);
}

.pagination-container .item a {
    text-decoration: none;
    color: inherit;
    font-weight: 500;
    line-height: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.pagination-container .item.perv img {
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}

.pagination-container .item.divider {
    background-color: transparent;
    width: 28px;
    padding-bottom: 5px;
    color: var(--c-grey);
    margin: 0;
    cursor: default;
}

.pagination-container .item.active {
    background-color: var(--c-red-3);
    color: var(--white);
}

.pagination-container .item.perv-next.disabled {
    opacity: 0.4;
    cursor: default;
    pointer-events: none;
}

.pagination-container .item.perv-next.disabled:hover {
    background-color: var(--c-grey-light-7);
}

.comments-faq-sc .new-comment {
    padding-top: 30px;
    border-top: 1px solid var(--c-grey-light-5);
}

.comments-faq-sc .new-comment .profile {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px;
}

.comments-faq-sc .new-comment .avatar {
    width: 54px;
    height: 54px;
    margin-left: 5px;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 2px solid var(--c-grey-light-5);
    border-radius: var(--br-round);
}

.comments-faq-sc .new-comment textarea {
    width: 100%;
    outline: none;
    border: none;
    background: var(--c-grey-light-7);
    padding: 15px;
    border-radius: var(--br-3);
}

.comments-faq-sc .new-comment .bottom {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 10px;
}

.comments-faq-sc .new-comment .file-attachment button {
    font-size: var(--fs-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    background-color: var(--c-grey-light-3);
    border-radius: var(--br-2);
    font-weight: 300;
}

.comments-faq-sc .new-comment .send-comment-bt button {
    font-size: var(--fs-3);
    border-radius: var(--br-2);
    background-color: var(--c-red);
    width: 160px;
    cursor: pointer;
}


/* fix new comment */

.input-wrapper.first-col {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: .5em;
}

.input-wrapper.first-col input {
    width: min(100%, 425px);
    outline: none;
    border: none;
    background: var(--c-grey-light-7);
    padding: 15px;
    border-radius: var(--br-3);
    margin-bottom: 8px;
}

.input-wrapper.send-comment-bt input#submit {
    font-size: var(--fs-3);
    border-radius: var(--br-2);
    background-color: var(--c-red);
    width: 160px;
    cursor: pointer;
    width: 200px;
    display: block;
    outline: none;
    border: none;
    height: 46px;
    padding: 0 15px;
    color: #fff;
    cursor: pointer;
}


/* fix new comment */

.comments-faq-sc .new-comment .file-attachment img {
    width: 16px;
    margin-left: 5px;
}

.comments-faq-sc .new-comment .uploade-preview {
    /* display: none; */
}

.comments-faq-sc .new-comment .uploade-preview .item {
    background-color: var(--c-grey-light-7);
    padding: 6px;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.comments-faq-sc .new-comment .uploade-preview .item:not(:last-child) {
    margin-bottom: 10px;
}

.comments-faq-sc .new-comment .uploade-preview .media-container {
    width: 48px;
    height: 48px;
    border-radius: var(--br-1);
    overflow: hidden;
}

.comments-faq-sc .new-comment .uploade-preview img {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.comments-faq-sc .new-comment .uploade-preview .remove-file {
    border: none;
    cursor: pointer;
    background-color: transparent;
    padding: 0 10px;
    font-size: var(--fs-5);
}

.btDefult {
    display: block;
    outline: none;
    border: none;
    height: 46px;
    padding: 0 15px;
    border-radius: var(--br-1);
    background-color: var(--c-blue);
    color: #fff;
    cursor: pointer;
}

.btDefult.btWithIcon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.btDefult.btWithIcon .icon {
    width: 24px;
    height: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 10px;
}

.blog-index-header {
    padding-bottom: 40px;
    border-bottom: 1px solid var(--c-grey-light-5);
}

.blog-index-header .page-container {
    position: relative;
    background: -webkit-gradient(linear, left bottom, left top, from(var(--white)), to(var(--c-grey-light-5)));
    background: linear-gradient(0deg, var(--white) 0%, var(--c-grey-light-5));
}

.blog-index-header .page-container::before {
    content: '';
    position: absolute;
    background-image: url(../img/pattern-3.svg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 320px;
    top: 10px;
    opacity: 1;
}

.blog-index-header .hero {
    position: relative;
    padding: 60px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.blog-index-header .b-main-title {
    text-align: center;
}

.blog-index-header .b-main-title .title {
    font-size: var(--fs-8);
    font-weight: 900;
}

.blog-index-header .b-main-title .sub {
    font-size: var(--fs-3);
    font-weight: 300;
}

.blog-index-header .b-featured-posts {
    position: relative;
    background-color: #fff;
    padding: 10px;
    border-radius: var(--br-3) var(--br-3) 0 0;
}

.blog-index-header .b-featured-posts .sc-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 0 20px 0;
}

.blog-index-header .b-featured-posts .sc-title .icon {
    margin-left: 5px;
}

.blog-index-header .b-featured-posts .sc-title .title {
    margin: 0;
    font-weight: 600;
    font-size: var(--fs-4);
}

.blog-index-header .b-featured-posts .full-width {
    margin: 0 -25px;
    overflow: hidden;
}

.blog-index-header .b-featured-posts .blog-latest {
    padding: 0;
    overflow: initial;
    justify-content: center;
}
.top-cat{
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    width: 120px;
}

.blog-index-header .b-featured-posts .post {
    margin-left: 0;
    margin-right: 25px;
}

.blog-index-header .b-featured-posts .post:nth-last-child(1) {
    margin-left: 25px;
}

.blog-index-content .cats-list ul {
    list-style: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 20px 0;
    overflow-x: scroll;
    overflow-y:hidden;
}
.blog-index-content .cats-list ul::-webkit-scrollbar {
    height: 6px;
    background-color: #eeeef2;
    border-radius: 999px;
}
.blog-index-content .cats-list ul::-webkit-scrollbar-thumb {
    background: #c0c0c7;
    border-radius: 999px;
}
.blog-index-content .cats-list .category {
    display: block;
    padding: 5px 20px;
    margin-left: 10px;
    text-decoration: none;
    white-space: nowrap;
    font-weight: 300;
    border: 1px solid var(--c-grey-light-4);
    border-radius: var(--br-round);
    color: var(--c-grey-dark-2);
    cursor: pointer;
}

.blog-index-content .cats-list .category:hover {
    background-color: var(--c-grey-light-6);
}

.blog-index-content .cats-list .category.active {
    background-color: var(--c-grey-dark-5);
    border-color: var(--c-grey-dark-5);
    -webkit-box-shadow: 0px 2px 6px -2px var(--c-grey-dark-5);
    box-shadow: 0px 2px 6px -2px var(--c-grey-dark-5);
    color: var(--white);
}

.posts-stream .sc-title {
    padding: 20px 0 30px 0;
}

.posts-stream .sc-title .title {
    margin: 0;
    font-weight: 600;
    font-size: var(--fs-4);
}

.posts-stream .card-post {
    margin-bottom: 50px;
}

.posts-stream .card-post a {
    text-decoration: none;
    color: initial;
}

.posts-stream .card-post .thumb {
    padding-top: 75%;
    position: relative;
    width: 100%;
}

.posts-stream .card-post .tumb-media-container {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-2);
    overflow: hidden;
}

.posts-stream .card-post .thumb img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
}

.posts-stream .card-post .top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 7px 0;
    font-size: var(--fs-3);
}

.posts-stream .card-post .category {
    color: var(--c-red-3);
}

.posts-stream .card-post .title-cap {
    display: block;
    height: 110px;
    overflow: hidden;
}

.posts-stream .card-post .headline {
    max-height: 54px;
    font-size: var(--fs-4);
    font-weight: 600;
    line-height: 1.5;
    overflow: hidden;
}

.posts-stream .card-post .dek {
    max-height: 46px;
    font-weight: 300;
    overflow: hidden;
    font-size: var(--fs-3);
}

.blog-archive-content .sc-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 15px;
    background-color: var(--c-grey-light-5);
    border-radius: var(--br-2);
    margin: 40px 0 30px 0;
}

.blog-archive-content .sc-title .icon {
    width: 22px;
    margin-left: 5px;
}

.blog-post-header .page-container {
    padding-top: 150px;
    position: relative;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: auto 260px;
}
.page-container.blog-with-cover {
    background-size: contain;
}
.blog-post-header .page-container.blog-with-cover::before {
    content: '';
    position: absolute;
    background: -webkit-gradient(linear, left bottom, left top, from(rgb(255 255 255 / 100%)), to(rgb(255 255 255 / 0%)));
    background: linear-gradient(0deg, rgb(255 255 255 / 100%) 0%, rgb(255 255 255 / 0%));
    width: 100%;
    height: 260px;
    top: 0;
    opacity: 1;
}

.blog-post-header .head {
    position: relative;
    background-color: #fff;
    padding: 15px;
    padding-bottom: 20px;
    border-radius: var(--br-2) var(--br-2) 0 0;
    min-height: 150px;
}

.blog-post-header .head .hero {
    display: none;
}

.blog-post-header .headline {
    font-size: var(--fs-5);
    line-height: 1.5;
    font-weight: 600;
}

.blog-post-header .meta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: auto;
    margin: 20px -30px 0 -30px;
    padding-right: 30px;
}

.blog-post-header .meta a {
    text-decoration: none;
    color: initial;
}

.blog-post-header .meta .item {
    padding: 5px 10px;
    margin-left: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-color: var(--white);
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-round);
}

.blog-post-header .meta .icon {
    width: 18px;
    height: 18px;
    margin-left: 5px;
}

.blog-post-header .meta .value {
    white-space: nowrap;
    font-size: var(--fs-2-5);
    font-weight: 300;
}

.blog-post-content {
    padding-top: 20px;
    border-top: 1px solid var(--c-grey-light-5);
}

.blog-post-content .entry-content p,
.blog-post-content .entry-content span {
    font-size: var(--fs-4);
    line-height: 1.8;
    margin-bottom: 1.5rem;
}

.blog-post-content .entry-content iframe {
    max-width: 100%;
}

.blog-post-content .entry-content span {
    font-weight: 300;
}

.blog-post-content .entry-content a {
    color: var(--c-red-3);
}

.blog-post-content .entry-content h2,
.blog-post-content .entry-content h3,
.blog-post-content .entry-content h4,
.blog-post-content .entry-content h5,
.blog-post-content .entry-content h6 {
    font-size: var(--fs-5);
    line-height: 1.5;
    margin-bottom: 1.5rem;
    max-width: 40em;
}

.blog-post-content .entry-content img {
    padding: 15px 0;
    max-width: min(100%, 40em);
}

.blog-post-content .posts-seo-tags {
    padding-top: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: var(--fs-2-5);
}

.blog-post-content .posts-seo-tags .title {
    font-weight: 500;
}

.blog-post-content .posts-seo-tags .tag {
    text-decoration: none;
    color: initial;
    font-weight: 300;
    margin-right: 5px;
}

.blog-post-content .posts-seo-tags .tag::after {
    content: ',';
}

.blog-post-content .posts-seo-tags .tag:nth-last-child(1):after {
    content: '';
}

.posts-share-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    clear: both;
}

.posts-share-buttons .title {
    font-size: var(--fs-3);
    font-weight: 500;
    margin-left: .5em;
    padding: 10px 0;
}

.posts-share-buttons-btn {
    padding: 10px 0;
}

.posts-share-buttons button {
    background: none;
    border: none;
    width: 20px;
    height: 20px;
    margin-left: 1em;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0;
    cursor: pointer;
}

.blog-post-content .related-posts {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid var(--c-grey-light-5);
}

.blog-post-content .related-posts .sc-title {
    margin-bottom: 20px;
}

.blog-post-content .related-posts .post-card {
    margin-bottom: 20px;
}

.blog-post-content .related-posts .post-card a {
    text-decoration: none;
    color: initial;
}

.blog-post-content .related-posts .content-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.blog-post-content .related-posts .thumb {
    position: relative;
    width: 120px;
    height: 90px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.blog-post-content .related-posts .thumb .media-container {
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-1);
    overflow: hidden;
    height: 100%;
}

.blog-post-content .related-posts .thumb img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
}

.blog-post-content .related-posts .details {
    padding: 0 10px 0 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.blog-post-content .related-posts .cat-date {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: var(--fs-2-5);
    font-weight: 300;
}

.blog-post-content .related-posts .cat {
    color: var(--c-red-3);
}

.blog-post-content .related-posts .hedline {
    padding-top: 5px;
    margin: 0;
    font-size: var(--fs-3);
    font-weight: 500;
    color: var(--c-text-1);
    line-height: 1.5;
}

.faq-top .page-container {
    position: relative;
    background: -webkit-gradient(linear, left bottom, left top, from(var(--white)), to(var(--c-grey-light-7)));
    background: linear-gradient(0deg, var(--white) 0%, var(--c-grey-light-7));
}

.faq-top .sc-title {
    text-align: center;
    padding: 80px 0 20px 0;
}

.faq-top .main-title {
    font-size: var(--fs-6);
    font-weight: 900;
}

.faq-top .sub-title {
    margin: 10px auto;
    max-width: 300px;
    font-size: var(--fs-3);
    color: var(--c-grey-dark-2);
    font-weight: 300;
    line-height: 1.5;
}

.page-search-bar .input-wrapper {
    position: relative;
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
}

.page-search-bar .input-wrapper input {
    width: 100%;
    height: 54px;
    padding: 0 15px 0 70px;
    outline: none;
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-2);
    font-size: var(--fs-4);
    background-color: #fff;
    -webkit-transition: border-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: border-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.page-search-bar .input-wrapper input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    background: url('../img/icons/trash-grey-2.svg') no-repeat 50% 50%;
    background-size: contain;
    opacity: 0;
    pointer-events: none;
}

.page-search-bar .input-wrapper input:focus::-webkit-search-cancel-button {
    opacity: 1;
    pointer-events: all;
}

.page-search-bar .input-wrapper input:focus {
    border: 1px solid var(--c-grey-light-3);
}

.page-search-bar .submit-search {
    position: absolute;
    width: 54px;
    height: 44px;
    left: 5px;
    top: 5px;
    border-radius: var(--br-1);
    border: none;
    background-color: var(--c-red-3);
    padding: 15px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
}

.page-search-bar .back-to-home {
    display: none;
}

.faq-cats {
    padding-top: 30px;
}

.faq-cats .list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-2);
}

.faq-cats .item {
    display: block;
    width: 50%;
    padding: 15px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    text-decoration: none;
    color: initial;
}

.faq-cats .item .icon {
    width: 42px;
    margin: 0 auto;
}

.faq-cats .item .title {
    font-weight: 300;
    font-size: var(--fs-3);
    padding-top: 10px;
    color: var(--c-text-1);
}

.faq-cats .item:nth-child(1) {
    border-left: 1px solid var(--c-grey-light-5);
    border-bottom: 1px solid var(--c-grey-light-5);
}

.faq-cats .item:nth-child(2) {
    border-bottom: 1px solid var(--c-grey-light-5);
}

.faq-cats .item:nth-child(3) {
    border-left: 1px solid var(--c-grey-light-5);
}

.faq-content {
    padding: 50px 0;
}

.faq-content .questions-wrapper {
    padding: 20px 0 40px 0;
}

.faq-content .questions-wrapper .sc-title .title {
    font-size: var(--fs-4);
    font-weight: 600;
    margin-bottom: 20px;
}

.faq-content .questions-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.faq-content .question-wrapper {
    border: 1px solid var(--c-grey-light-4);
    border-radius: var(--br-2);
    margin-bottom: 15px;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.faq-content .question-toggle {
    padding: 10px 15px;
    cursor: pointer;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.faq-content .question-toggle::after {
    content: '';
    display: inline-block;
    border-style: solid;
    position: absolute;
    height: 8px;
    width: 8px;
    left: 15px;
    top: 0;
    bottom: 0;
    margin: auto;
    border-width: 1px 1px 0 0;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    color: var(--c-red);
    -webkit-transition: -webkit-transform 0.2s ease-in-out;
    transition: -webkit-transform 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}

.faq-content .question-wrapper.open .question-toggle {
    border-bottom: 1px solid var(--c-grey-light-7);
}

.faq-content .question-wrapper.open .question-toggle::after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.faq-content .question-toggle .question {
    font-size: var(--fs-3);
    font-weight: 500;
    padding-left: 30px;
    margin-bottom: 0;
    line-height: 1.5;
    color: var(--c-grey-dark-4);
}

.faq-content .answer {
    font-size: var(--fs-3);
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.2s ease-out;
    transition: max-height 0.2s ease-out;
    width: 100%;
}

.faq-content .question-wrapper.open .answer {
    max-height: 300px;
    -webkit-transition: max-height 0.6s ease-out;
    transition: max-height 0.6s ease-out;
}

.faq-content .answer .wrapper {
    padding: 15px;
    color: var(--c-grey-dark-2);
}

.faq-content .answer .wrapper p {
    line-height: 1.8;
}

.faq-content .answer .wrapper p:nth-last-child(1) {
    margin-bottom: 0;
}

.faq-content .answer .wrapper a {
    color: var(--c-red-3);
}

.p-faq-search .page-search-bar .input-wrapper input {
    padding-right: 40px;
}

.p-faq-search .page-search-bar .back-to-home {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    right: 5px;
    top: 5px;
    height: 44px;
    padding: 0 5px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0.8;
}

.p-faq-search .faq-cats {
    display: none;
}

.faq-content .search-result {
    display: none;
}

.p-faq-search .faq-content .all-questions {
    display: none;
}

.p-faq-search .faq-content .search-result {
    display: block;
}

.p-faq-search .faq-content .search-result .no-result {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--c-red-3);
    padding-bottom: 80px;
}

.p-license-check .faq-top .main-title {
    line-height: 1.5;
    font-size: var(--fs-5);
    max-width: 520px;
    margin: 0 auto;
}

.p-license-check .page-search-bar .submit-search {
    width: 78px;
    background-color: var(--c-blue);
    color: #fff;
}

.p-license-check .page-search-bar .input-wrapper input {
    padding: 0 15px 0 86px;
}

.p-license-check .search-result {
    display: none;
}

.p-license-check .latest-licenses {
    border-top: 1px solid var(--c-grey-light-5);
    margin-top: 100px;
    padding: 60px 0;
}

.p-license-check .latest-licenses .main-title {
    font-size: var(--fs-4);
    font-weight: 600;
    margin-bottom: 20px;
}

.p-license-check .license {
    padding: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    color: initial;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.p-license-check .license .thumb {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.p-license-check .license .font-icon {
    width: 48px;
    height: 48px;
    padding: 10px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
}

.p-license-check .license .license-icon {
    width: 48px;
    height: 48px;
    margin-right: -20px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-round);
    background-color: rgb(255 255 255 / 80%);
    --webkit-backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.p-license-check .license .details {
    padding-right: 10px;
}

.p-license-check .license .top {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
    height: 18px;
    overflow: hidden;
    margin-bottom: 3px;
}

.p-license-check .license .bot {
    font-size: var(--fs-3);
    font-weight: 500;
    color: var(--c-text-1);
    height: 21px;
    overflow: hidden;
}

.p-license-check .license .license-holder {
    color: var(--c-red-3);
}

.p-license-check-search .search-result {
    display: block;
}

.p-license-check-search .latest-licenses {
    display: none;
}

.p-license-check-search .results-wrapper {
    padding: 40px 0;
}

.p-license-check-search .license {
    margin: 0 auto 15px auto;
    max-width: 620px;
}

.p-license-check-search .no-result {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--c-red-3);
    padding: 40px 0;
}

.license-view {
    margin: 30px auto;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-3);
    padding: 15px;
}

.license-view .block {
    padding-bottom: 30px;
}

.license-view .license-badge {
    margin: 25px auto;
    width: 164px;
    height: 164px;
    padding: 25px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--white);
    border-radius: var(--br-round);
}

.license-view .license-code span {
    display: block;
    height: 48px;
    width: 164px;
    line-height: 52px;
    margin: 0 auto;
    font-weight: 600;
    text-align: center;
    background-color: var(--c-grey-light-5);
    border: 1px solid var(--c-grey-light-4);
    border-radius: var(--br-2);
}

.license-view .title {
    text-align: center;
    padding: 20px 0;
    font-size: var(--fs-5);
    font-weight: 600;
}

.license-view .details-wrapper {
    padding: 10px;
    background-color: #fff;
    border-radius: var(--br-2);
    font-size: var(--fs-3);
}

.license-view .font-icon {
    width: 64px;
    height: 64px;
    padding: 16px;
    margin: 15px auto;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
}

.license-view .top {
    text-align: center;
    font-weight: 300;
    color: var(--c-grey-dark-2);
}

.license-view .top span {
    display: block;
}

.license-view .top .dash {
    display: none;
}

.license-view .top .font-name a {
    color: var(--c-red-3);
    padding: 10px 0;
    display: block;
}

.license-view .bot {
    padding-top: 15px;
    margin-top: 5px;
    border-top: 1px solid var(--c-grey-light-6);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.license-view .bot .license-holder {
    width: -webkit-calc(100% - 92px);
    width: calc(100% - 92px);
    padding-right: 5px;
    font-weight: 500;
    margin-bottom: 5px;
}

.license-view .bot .website-address {
    width: -webkit-calc(100% - 62px);
    width: calc(100% - 62px);
    padding-right: 5px;
    font-weight: 600;
    text-decoration: none;
    color: var(--c-text-1);
}

.fonts-list {
    padding: 20px 0;
}

.fonts-list .filters-toggle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px 15px;
    background-color: var(--white);
    border: 1px solid var(--c-grey-light-5);
    -webkit-box-shadow: 0px 6px 12px -6px hsl(240deg 2% 57% / 20%);
    box-shadow: 0px 6px 12px -6px hsl(240deg 2% 57% / 20%);
    border-radius: var(--br-3);
    z-index: 20;
    -webkit-transition: all 0.2 cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.2 cubic-bezier(0.075, 0.82, 0.165, 1);
}

.fonts-list .mob-filters-toggle {
    -webkit-transform: translateX(130px);
    -ms-transform: translateX(130px);
    transform: translateX(130px);
    visibility: hidden;
    position: fixed;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    bottom: 20px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px 15px;
    background-color: var(--white);
    border: 1px solid var(--c-grey-light-5);
    -webkit-box-shadow: 0px 6px 12px -6px hsl(240deg 2% 57% / 20%);
    box-shadow: 0px 6px 12px -6px hsl(240deg 2% 57% / 20%);
    border-radius: var(--br-3);
    z-index: 20;
    -webkit-transition: all 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.fonts-list .mob-filters-toggle.show {
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
    visibility: visible;
}

.fonts-list .filters-toggle .icon {
    width: 18px;
    margin-left: 10px;
    opacity: 0.3;
}

.fonts-list .mob-filters-toggle .icon {
    width: 18px;
    margin-left: 10px;
    opacity: 0.3;
}

.fonts-list .content-stream {
    padding: 20px 0;
}

.font-card {
    margin-bottom: 20px;
}

.font-card a {
    display: block;
    text-decoration: none;
    color: var(--c-text-1);
}

.font-card .font-wrapper {
    padding: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: var(--br-3);
    background-color: var(--c-grey-light-7);
    position: relative;
}

.font-card .thumb {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 64px;
    height: 64px;
    padding: 10px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-2);
}

.font-card .thumb img {
    max-height: 100%;
    max-width: 100%;
}

.font-card .purchased {
    padding: 5px 10px;
    position: absolute;
    top: 10px;
    left: 10px;
    text-align: center;
    font-size: var(--fs-2);
    border-radius: var(--br-1);
    color: var(--white);
    background-color: hsl(358deg 95% 62% / 90%);
    z-index: 10;
}

.font-card .details {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -moz-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    width: -webkit-calc(100% - 64px);
    width: calc(100% - 64px);
    overflow: hidden;
    padding-right: 10px;
}

.font-card .font-title {
    display: none;
}

.font-card .price {
    margin-bottom: 10px;
}

.font-card .price .value {
    font-weight: 600;
    font-size: var(--fs-5);
}

.font-card .price .currency {
    font-weight: 300;
    font-size: var(--fs-2);
}

.font-card .tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 22px;
    overflow: hidden;
}

.font-card .tag {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 22px;
    padding: 0 10px;
    margin-left: 5px;
    margin-bottom: 50px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey-dark-2);
    background-color: rgb(27 27 29 / 5%);
    border-radius: var(--br-round);
}

.font-card .oneliner {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    height: 90px;
    padding: 5px 10px 15px 10px;
    margin-bottom: 10px;
    width: 100%;
    border-bottom: 1px solid var(--c-grey-light-5);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.font-card .oneliner img {
    max-width: 100%;
    max-height: 100%;
    opacity: 0.86;
}

.font-card .cta {
    display: none;
}

.fonts-list .modal__overlay {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.fonts-list .modal__container {
    width: 100%;
    border-radius: var(--br-5) var(--br-5) 0 0;
    padding: 30px 20px 20px 20px;
    position: relative;
}

.fonts-list .contnet-filters .input-wrapper {
    margin-bottom: 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

.fonts-list .contnet-filters .input-wrapper::after {
    content: '';
    display: inline-block;
    border-style: solid;
    position: absolute;
    height: 8px;
    width: 8px;
    left: 20px;
    border-width: 1px 1px 0 0;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    color: var(--c-grey);
}

.fonts-list .contnet-filters label {
    display: block;
    margin-bottom: 5px;
    font-weight: 300;
    color: var(--c-grey);
    width: 100px;
}

.fonts-list .contnet-filters select {
    width: -webkit-calc(100% - 100px);
    width: calc(100% - 100px);
    height: 54px;
    line-height: 52px;
    padding: 0 15px;
    border: 1px solid var(--c-grey-light-4);
    -webkit-box-shadow: 0px 4px 8px -4px hsl(240deg 2% 57% / 10%);
    box-shadow: 0px 4px 8px -4px hsl(240deg 2% 57% / 10%);
    border-radius: var(--br-2);
    position: relative;
    outline: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}

.fonts-list .contnet-filters select:focus {
    /* border: none; */
    border: 1px solid var(--c-grey-light-4);
}

.fonts-list .contnet-filters .form-buttons {
    padding-top: 10px;
}

.fonts-list .contnet-filters .submit-filters {
    height: 54px;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-2);
    background-color: var(--c-text-1);
    color: var(--white);
}

.fonts-list .contnet-filters .reset-filters {
    height: 54px;
    width: 80px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-2);
    background-color: var(--c-grey-light-7);
    color: var(--c-text-1);
}

.fonts-list .contnet-filters .close-modal-bt {
    width: 24px;
    height: 24px;
    background: url(../img/icons/x-dark-2.svg) no-repeat 50% 50%;
    position: absolute;
    top: 10px;
    right: 14px;
    opacity: 0.2;
    display: none;
}

.p-search-result .sc-title .title {
    font-size: var(--fs-5);
    margin: 0;
    padding: 5px 0 5px 0;
    -webkit-columns: var(--c-text-1);
    -moz-columns: var(--c-text-1);
    columns: var(--c-text-1);
}

.p-search-result .posts-stream {
    padding: 20px 0;
}

.p-designers-list .sc-title .title {
    font-size: var(--fs-5);
    margin: 0;
    padding: 5px 0 5px 0;
    -webkit-columns: var(--c-text-1);
    -moz-columns: var(--c-text-1);
    columns: var(--c-text-1);
}

.designers-list {
    padding-bottom: 40px;
}

.designers-list .sc-title {
    padding: 20px 0;
}

.designers-list .designers {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px;
}

.designers-list .designer {
    width: -webkit-calc(50% - 8px);
    width: calc(50% - 8px);
    overflow: hidden;
    position: relative;
    text-decoration: none;
    color: initial;
    border-radius: var(--br-3);
    -webkit-transition: -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.designers-list .designer a {
    text-decoration: none;
    color: initial;
}

.designers-list .designer .picture-wrapper {
    width: 100%;
    padding-top: 133.33%;
    position: relative;
    overflow: hidden;
}

.designers-list .designer .aspect-ratio {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.designers-list .designer .picture-wrapper img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.designers-list .designer .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(hsl(240 3% 11% / 0%)), to(hsl(240 3% 11% / 80%)));
    background: linear-gradient(180deg, hsl(240 3% 11% / 0%) 0%, hsl(240 3% 11% / 80%) 100%);
    -webkit-transition: opacity 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.designers-list .designer .second-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, hsl(240 3% 11% / 0%)), color-stop(90%, hsl(240 3% 11% / 100%)));
    background: linear-gradient(180deg, hsl(240 3% 11% / 0%) 50%, hsl(240 3% 11% / 100%) 90%);
    -webkit-transition: background-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: background-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.designers-list .designer .info {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.designers-list .designer .font-counter {
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: var(--fs-2);
    background-color: #ffffff;
    padding: 1px 6px;
    border-radius: var(--br-round);
    opacity: 0.5;
    -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.designers-list .designer .details {
    width: 100%;
    padding: 12px;
}

.designers-list .designer .designer-name {
    text-decoration: none;
    color: var(--white);
    text-align: center;
    font-size: var(--fs-5);
}

.designers-list .designer .divider {
    height: 3px;
    width: 30px;
    background-color: var(--white);
    margin: 12px auto;
    border-radius: var(--br-round);
    opacity: 0.2;
    display: none;
}

.designers-list .designer .fonts {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 10px;
}

.designers-list .designer .font-icon {
    width: 32px;
    height: 32px;
    padding: 8px;
    margin-left: -10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    border: 2px solid var(--c-text-1);
    -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: -webkit-transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-transform 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.designer-cover-image .media-container img {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    max-height: 300px;
}

.designer-info .profile-photo {
    width: 148px;
    height: 148px;
    margin: -60px auto 0 auto;
    border-radius: var(--br-3);
    overflow: hidden;
    background-color: rgb(255 255 255 / 20%);
    -webkit-backdrop-filter: saturate(100%) blur(8px);
    backdrop-filter: saturate(100%) blur(8px);
    position: relative;
    padding: 10px;
}

.designer-info .profile-photo img {
    border-radius: var(--br-2);
    border: 1px solid rgb(255 255 255 / 50%);
}

.designer-info .other .name {
    text-align: center;
    font-size: var(--fs-6);
    margin: 10px 0;
    font-weight: 900;
}

.designer-info .social-links {
    padding: 20px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 15px;
}

.designer-info .about {
    padding: 40px 0;
}

.designer-info .about p {
    font-size: var(--fs-3);
    text-align: center;
    line-height: 1.8;
    margin: 0 auto;
}

.p-designer-view .font-list {
    border-top: 1px solid var(--c-grey-light-5);
}

.p-designer-view .font-list .sc-title {
    padding: 20px 0;
}

.p-designer-view .font-list .sc-title .title {
    font-size: var(--fs-5);
    margin: 0;
    padding: 5px 0 5px 0;
    -webkit-columns: var(--c-text-1);
    -moz-columns: var(--c-text-1);
    columns: var(--c-text-1);
}

.content-box {
    padding: 60px 0;
}

.content-box .box {
    max-width: 420px;
    margin: 0 auto;
    border-radius: var(--br-3);
    overflow: hidden;
}

.content-box .box .right {
    display: none;
}

.content-box .box .main {
    padding: 25px;
    background-color: var(--c-grey-light-8);
}

.content-box .box .box-title {
    font-size: var(--fs-5);
    font-weight: 600;
    padding-bottom: 20px;
}

.content-box .box .top {
    padding: 20px 0;
}

.content-box .box .bot {
    padding-top: 20px;
    margin-top: 10px;
    border-top: 1px solid var(--c-grey-light-5);
}

.content-box .box .bot .links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.content-box .box .bot .link {
    font-weight: 300;
    color: var(--c-grey-dark-4);
    font-size: var(--fs-3);
}

.form-control .input-wrapper {
    margin-bottom: 20px;
}

.form-control .input-wrapper:nth-last-child(1) {
    margin-bottom: 0;
}

.form-control label {
    display: block;
    font-weight: 300;
    font-size: var(--fs-4);
    margin-bottom: 10px;
    color: var(--c-grey-dark-2);
}

.form-control input[type=text],
.form-control input[type=search],
.form-control input[type=password],
.form-control input[type=email],
.form-control input[type=phone] {
    width: 100%;
    height: 3rem;
    padding: 0 0.75rem;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: top;
    position: relative;
    border-radius: var(--br-2);
    border: 1px solid transparent;
    border-color: var(--c-grey-light-4);
    color: var(--c-text-1);
    background-color: var(--white);
    -webkit-box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
    box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
    -webkit-transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
    -moz-appearance: none;
    -webkit-appearance: none;
}

.form-control input:focus {
    outline: none;
    border-color: var(--c-grey-light-2);
    -webkit-box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 10%);
    box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 10%);
}

.form-control .input-wrapper.custom-check {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.form-control .input-wrapper.custom-check input {
    display: none;
}

.form-control .input-wrapper.custom-check .switch {
    display: inline-block;
    height: 26px;
    position: relative;
    width: 42px;
    margin-bottom: 0;
    -webkit-flex-shrink: 0 !important;
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
}

.form-control .input-wrapper.custom-check .switch .slider {
    background-color: var(--c-grey-light-3);
    border-radius: var(--br-round);
    position: absolute;
    cursor: pointer;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    -webkit-transition: all .4s;
    transition: all .4s;
}

.form-control .input-wrapper.custom-check .switch .slider::before {
    content: "";
    height: 20px;
    width: 20px;
    position: absolute;
    bottom: 3px;
    left: 3px;
    border-radius: var(--br-round);
    background-color: #fff;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    -webkit-box-shadow: 0px 3px 8px rgb(0 0 0 / 15%), 0px 3px 1px rgb(0 0 0 / 6%);
    box-shadow: 0px 3px 8px rgb(0 0 0 / 15%), 0px 3px 1px rgb(0 0 0 / 6%);
}

.form-control .input-wrapper.custom-check input:checked~label .slider {
    background-color: var(--till);
}

.form-control .input-wrapper.custom-check input:checked~label .slider::before {
    -webkit-transform: translateX(16px);
    -ms-transform: translateX(16px);
    transform: translateX(16px);
}

.form-control .input-wrapper.custom-check span {
    padding-right: 5px;
    color: var(--c-grey-dark-2);
    font-weight: 300;
}

.form-control .input-wrapper.form-buttons {
    margin-top: 25px;
}

.form-control .input-wrapper.form-buttons button {
    width: 100%;
    height: 3rem;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: top;
    position: relative;
    font-weight: 300;
    border-radius: var(--br-2);
    border: 1px solid transparent;
    color: var(--white);
    background-color: var(--c-text-1);
    cursor: pointer;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.form-control .input-wrapper.form-buttons button.blue {
    background-color: var(--c-blue-3);
}

.form-control .input-wrapper.form-buttons button.red {
    background-color: var(--c-red-3);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-red-3);
    box-shadow: 0px 2px 4px -2px var(--c-red-3);
}

.form-control .double-input {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.form-control .double-input .input-wrapper {
    width: 50%;
}

.form-control .double-input .input-wrapper label {}

.form-control .double-input .input-wrapper:nth-child(1) input[type=text],
.form-control .double-input .input-wrapper:nth-child(1) input[type=search],
.form-control .double-input .input-wrapper:nth-child(1) input[type=password],
.form-control .double-input .input-wrapper:nth-child(1) input[type=email],
.form-control .double-input .input-wrapper:nth-child(1) input[type=phone] {
    border-radius: 0 var(--br-2) var(--br-2) 0;
    border-left: none;
}

.form-control .double-input .input-wrapper:nth-child(2) input[type=text],
.form-control .double-input .input-wrapper:nth-child(2) input[type=search],
.form-control .double-input .input-wrapper:nth-child(2) input[type=password],
.form-control .double-input .input-wrapper:nth-child(2) input[type=email],
.form-control .double-input .input-wrapper:nth-child(2) input[type=phone] {
    border-radius: var(--br-2) 0 0 var(--br-2);
}

.form-control .double-input .input-wrapper:nth-child(1) select {
    border-radius: 0 var(--br-2) var(--br-2) 0;
    border-left: none;
}

.form-control .double-input .input-wrapper:nth-child(2) select {
    border-radius: var(--br-2) 0 0 var(--br-2);
}

.form-control.small .input-wrapper {
    margin-bottom: 15px;
}

.form-control.small label {
    font-size: var(--fs-3);
    margin-bottom: 7px;
}

.form-control.small input[type=text],
.form-control.small input[type=search],
.form-control.small input[type=password],
.form-control.small input[type=email],
.form-control.small input[type=phone] {
    height: 2.6rem;
    font-size: var(--fs-3);
    padding: 0 10px;
}

.form-control.small .input-wrapper.form-buttons button {
    height: 2.6rem;
    font-size: var(--fs-3);
}

.form-control .switch-radio .switch-wrapper {
    width: 100%;
    height: 3rem;
    padding: 3px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    border-radius: var(--br-2);
    border: 1px solid transparent;
    border-color: var(--c-grey-light-5);
    background-color: var(--c-grey-light-6);
}

.form-control .switch-radio .switch-wrapper input[type=radio] {
    display: none;
}

.form-control .switch-radio .switch-wrapper label {
    width: 50%;
    margin: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-2);
    cursor: pointer;
    -webkit-transition: all 0.26s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.26s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.form-control .switch-radio .switch-wrapper input:checked+label {
    background-color: #fff;
    -webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.08), 0px 3px 1px rgba(0, 0, 0, 0.03);
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.08), 0px 3px 1px rgba(0, 0, 0, 0.03);
    color: var(--c-blue-3);
}

.form-control select {
    width: 100%;
    height: 3rem;
    padding: 0 0.75rem;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: top;
    position: relative;
    border-radius: var(--br-2);
    border: 1px solid transparent;
    border-color: var(--c-grey-light-4);
    color: var(--c-text-1);
    background-color: var(--white);
    -webkit-box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
    box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
    -webkit-transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.form-control select:focus {
    outline: none;
    border-color: var(--c-grey-light-2);
    -webkit-box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 10%);
    box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 10%);
}

.form-control .select-wrapper select {
    -moz-appearance: none;
    -webkit-appearance: none;
}

.form-control .select-wrapper {
    position: relative;
}

.form-control .select-wrapper::after {
    content: '';
    display: inline-block;
    border-style: solid;
    position: absolute;
    height: 8px;
    width: 8px;
    left: 15px;
    bottom: -webkit-calc(3rem - 8px);
    bottom: calc(3rem - 8px);
    border-width: 1px 1px 0 0;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    color: var(--c-grey);
}

.form-control .double-input .select-wrapper:nth-child(1) select {
    border-radius: 0 var(--br-2) var(--br-2) 0;
    border-left: none;
}

.form-control .double-input .select-wrapper:nth-child(2) select {
    border-radius: var(--br-2) 0 0 var(--br-2);
}

.form-control.small select {
    height: 2.6rem;
    font-size: var(--fs-3);
    padding: 0 10px;
}

.form-control .input-wrapper textarea {
    width: 100%;
    padding: 0.5rem;
    border-radius: var(--br-2);
    border: 1px solid transparent;
    border-color: var(--c-grey-light-4);
    color: var(--c-text-1);
    background-color: var(--white);
    -webkit-box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
    box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
    -webkit-transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
    -moz-appearance: none;
    -webkit-appearance: none;
    line-height: 1.5;
}

.form-control textarea:focus {
    outline: none;
    border-color: var(--c-grey-light-2);
    -webkit-box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 10%);
    box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 10%);
}

.profile-edit.profile-password .avatar {
    margin-bottom: 20px;
}

.verify-phone .phone-number {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 20px 0;
}

.verify-phone .phone-number .phone {
    font-size: var(--fs-6);
    font-weight: 600;
}

.verify-phone .phone-number .edit-phone {
    text-decoration: none;
    padding: 5px 8px 3px 8px;
    border-radius: var(--br-round);
    color: var(--c-grey);
    font-size: var(--fs-2-5);
    background-color: var(--c-grey-light-5);
}

.verify-phone .phone-number .edit-phone:hover {
    color: var(--c-text-1);
    background-color: var(--c-grey-light-3);
}

.verify-phone .form-control .input-wrapper.verify-code input {
    text-align: center;
    font-weight: 600;
    font-size: var(--fs-6);
    letter-spacing: 10px;
}

.content-box .box.verify-phone .bot .links {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.cart-sc {
    padding: 30px 0;
}

.cart-sc .cart-p-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 20px;
}

.cart-sc .cart-p-title .title {
    font-size: var(--fs-5);
    margin: 0;
    padding: 5px 0 5px 0;
    -webkit-columns: var(--c-text-1);
    -moz-columns: var(--c-text-1);
    columns: var(--c-text-1);
    padding-left: 5px;
}

.cart-sc .cart-p-title .counter {
    width: 24px;
    height: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--c-red-3);
    color: var(--white);
    font-size: var(--fs-3);
    border-radius: var(--br-round);
}

.cart-sc.cart-empty .cart-p-title .counter {
    display: none;
}

.cart-sc.cart-empty .main-wrapper {
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
    padding: 50px 20px;
    display: block;
}

.cart-sc .main-wrapper .empty-illu {
    width: 160px;
    margin: 0 auto;
}

.cart-sc .main-wrapper .empty-illu img {
    margin-right: 15px;
}

.cart-sc.cart-empty.error-page .main-wrapper {
    background-color: transparent;
}

.cart-sc.cart-empty.error-page .main-wrapper .empty-illu img {
    margin: 0;
}

.cart-sc.cart-empty.error-page .main-wrapper .empty-illu {
    width: 280px;
}

.cart-sc .main-wrapper .empty-title {
    text-align: center;
    padding: 20px 0 5px 0;
    font-weight: 600;
    font-size: var(--fs-5);
}

.cart-sc .main-wrapper .empty-subtitle {
    text-align: center;
    font-weight: 300;
    font-size: var(--fs-2-5);
    color: var(--c-grey);
}

.cart-sc .main-wrapper .links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 38px;
    padding: 20px 0;
}

.cart-sc .main-wrapper .links .link {
    font-weight: 400;
    color: var(--c-blue);
    font-size: var(--fs-3);
}

.cart-sc .main-wrapper .items {
    padding: 10px 0;
}

.cart-sc .items .item {
    margin-bottom: 15px;
}

.cart-sc .items .item:nth-last-child(1) {
    margin: 0;
}

.cart-sc .items .item .wrapper {
    padding: 10px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.cart-sc .items .item .thumb {
    width: 64px;
    height: 64px;
    padding: 10px;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.cart-sc .items .item .thumb img {
    max-width: 100%;
    max-height: 100%;
}

.cart-sc .items .item .license-icon {
    position: relative;
}

.cart-sc .items .item .license-icon .badge {
    position: absolute;
    width: 64px;
    height: 64px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    background-color: rgb(255 255 255 / 40%);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    border: 2px solid #fff;
}

.cart-sc .items .item .license-icon .thumb {
    border-radius: var(--br-round);
}

.cart-sc .items .item .info {
    width: -webkit-calc(100% - 64px);
    width: calc(100% - 64px);
    padding-right: 10px;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.cart-sc .items .item .cart-link {
    text-decoration: none;
    display: block;
    color: initial;
}

.cart-sc .items .item .title-details .title {
    font-size: var(--fs-3);
    white-space: nowrap;
    font-weight: 400;
    margin: 0;
    line-height: 1.5;
}

.cart-sc .items .item .title-details .details {
    display: none;
}

.cart-sc .items .item .price-remove {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.cart-sc .items .item .price-remove .remove-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: none;
    outline: none;
    background-color: #fff;
    padding: 2px 5px;
    border-radius: var(--br-1);
}

.cart-sc .items .item .price-remove .remove-item .icon {
    width: 17px;
    height: 17px;
    margin-left: 3px;
    opacity: 0.6;
}

.cart-sc .items .item .price-remove .remove-item .title {
    font-size: var(--fs-2-5);
    color: var(--c-grey);
    margin-top: 2px;
}

.cart-sc .items .item .price-remove .price .value {
    font-size: var(--fs-4);
    font-weight: 600;
}

.cart-sc .items .item .price-remove .price .currency {
    font-size: var(--fs-2);
    font-weight: 300;
}

.cart-sc .main-wrapper .right-sc .divider {
    height: 1px;
    width: 100%;
    background-color: transparent;
    margin: 10px 0;
}

.cart-sc .discount-steps {
    padding: 10px 0;
    margin: 0 -15px;
}

.cart-sc .discount-steps .wrapper {
    padding: 30px 30px;
    background-color: var(--c-grey-light-8);
}

.cart-sc .discount-steps .texts .title {
    font-weight: 600;
    color: var(--c-red-3);
    font-size: var(--fs-5);
    padding-bottom: 5px;
}

.cart-sc .discount-steps .texts .next-step {
    font-weight: 300;
    font-size: var(--fs-3);
    color: var(--c-grey);
}

.cart-sc .discount-steps .texts .next-step span {
    font-weight: 600;
    color: var(--c-text-1);
}

.cart-sc .discount-steps .texts .sub-text {
    display: none;
}

.cart-sc .discount-steps .steps {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 20px;
    max-width: 320px;
    margin: 0 auto;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.cart-sc .discount-steps .step {
    width: 22%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.cart-sc .discount-steps .step-title {
    text-align: center;
    font-size: var(--fs-3);
    font-weight: 300;
    color: var(--c-grey-dark-2);
    padding-bottom: 5px;
}

.cart-sc .discount-steps .step-col {
    width: 100%;
    min-height: 45px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--c-grey-light-5);
    border-radius: var(--br-2);
}

.cart-sc .discount-steps .step-value {
    font-size: var(--fs-3);
    color: var(--c-grey);
}

.cart-sc .discount-steps .step:nth-child(1) .step-col {
    height: 45px;
}

.cart-sc .discount-steps .step:nth-child(2) .step-col {
    height: 60px;
}

.cart-sc .discount-steps .step:nth-child(3) .step-col {
    height: 75px;
}

.cart-sc .discount-steps .step:nth-child(4) .step-col {
    height: 90px;
}

.cart-sc .discount-steps .step.active .step-title {
    font-weight: 500;
}

.cart-sc .discount-steps .step.active .step-col {
    background-color: var(--c-red-3);
    -webkit-box-shadow: 0px 4px 8px -4px var(--c-red-3);
    box-shadow: 0px 4px 8px -4px var(--c-red-3);
}

.cart-sc .discount-steps .step.active .step-value {
    color: var(--white);
}

.cart-sc .main-wrapper .left-sc {
    margin-top: 30px;
}

.cart-sc .cart-total-sc .wrapper {
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-3);
}

.cart-sc .cart-total-sc .details {
    padding: 15px 0;
    border-bottom: 1px dashed var(--c-grey-light-5);
}

.cart-sc .cart-total-sc .row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    padding: 15px;
}

.cart-sc .cart-total-sc .row .title {
    font-size: var(--fs-3);
}

.cart-sc .cart-total-sc .row .percentage {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--white);
    background-color: var(--c-blue-3);
    padding: 2px 3px 1px 3px;
    border-radius: var(--br-1);
}

.cart-sc .cart-total-sc .row .value {
    font-size: var(--fs-4);
    font-weight: 600;
}

.cart-sc .cart-total-sc .row .currency {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
}

.cart-sc .cart-total-sc .row .remove-this {
    font-size: var(--fs-2);
    outline: none;
    border: 1px solid var(--c-red-1);
    color: var(--c-red-2);
    font-weight: 300;
    padding: 2px 3px 1px 3px;
    border-radius: var(--br-1);
    cursor: pointer;
    background-color: #fff;
}

.cart-sc .cart-total-sc .grand-total-sc {
    padding: 20px 15px 17px 15px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.cart-sc .cart-total-sc .g-total {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    /* padding-bottom: 20px; */
}

.cart-sc .cart-total-sc .g-total label {
    display: block;
    font-size: var(--fs-3);
}

.cart-sc .cart-total-sc .g-total .value {
    font-size: var(--fs-5);
    font-weight: 900;
}

.cart-sc .cart-total-sc .g-total .currency {
    font-size: var(--fs-2);
    font-weight: 300;
    color: var(--c-grey);
}

.pool-bedeh-pool-bedeh-bishtar {
    display: none;
    width: 100%;
    height: 3rem;
    text-decoration: none;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: top;
    position: relative;
    font-weight: 300;
    border-radius: var(--br-2);
    border: 1px solid transparent;
    color: var(--white);
    background-color: var(--c-red-3);
    cursor: pointer;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.cart-sc .cart-total-sc .grand-total-mob {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 20;
    border-top: 1px solid var(--c-grey-light-5);
    background-color: rgba(255, 255, 255);
    background-color: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: saturate(190%) blur(16px);
    backdrop-filter: saturate(190%) blur(16px);
}

.cart-sc .cart-total-sc .grand-total-mob .sc-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 10px;
}

.grand-total-mob .pool-bedeh-pool-bedeh-bishtar {
    width: 240px;
    height: 50px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-shadow: 0px 3px 6px -3px var(--c-red-3);
    box-shadow: 0px 3px 6px -3px var(--c-red-3);
}

.cart-sc .cart-total-sc .grand-total-mob .g-total {
    padding: 0;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    width: -webkit-calc(100% - 240px);
    width: calc(100% - 240px);
}

.cart-sc .cart-total-sc .grand-total-mob .g-total label {
    font-size: var(--fs-2-5);
    width: 100%;
    text-align: left;
}

.cart-sc .cart-total-sc .grand-total-mob .g-total .var {
    width: 100%;
    margin-top: 5px;
    text-align: left;
    height: 26px;
    overflow: hidden;
}

.cart-sc .cart-total-sc .grand-total-mob .g-total .value {
    font-size: var(--fs-4);
    font-weight: 600;
}

.cart-sc .cart-total-sc .grand-total-mob .g-total .currency {
    font-size: var(--fs-1);
}

.cart-sc .form-coupon-wrap {
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-3);
    margin-top: 20px;
    padding: 15px;
}

.cart-sc .form-coupon-wrap .tab-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.cart-sc .form-coupon-wrap .tab-header .tablink {
    font-weight: 400;
    font-size: var(--fs-3);
    color: var(--c-grey);
    position: relative;
    margin-bottom: 2px;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    cursor: pointer;
}

.cart-sc .form-coupon-wrap .tab-header .tablink::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-bottom: 0px;
    margin-left: 5px;
    border-radius: var(--br-round);
    background-color: var(--c-grey-light-7);
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.cart-sc .form-coupon-wrap .tab-header .tablink:hover {
    color: var(--c-grey-dark-3);
}

.cart-sc .form-coupon-wrap .tab-header .tablink:hover::before {
    background-color: var(--c-red-2);
}

.cart-sc .form-coupon-wrap .tab-header .tablink.active {
    color: var(--c-grey-dark-3);
}

.cart-sc .form-coupon-wrap .tab-header .tablink.active::before {
    background-color: var(--c-red-3);
}

.cart-sc .form-coupon-wrap .alert-sc {
    display: none;
    padding-top: 10px;
}

.cart-sc .form-coupon-wrap .alert-sc.show {
    display: block;
}

.cart-sc .form-coupon-wrap .alert {
    font-size: var(--fs-3);
    padding: 10px 10px;
    border: 1px solid var(--c-grey-light-5);
    background-color: var(--c-grey-light-5);
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.cart-sc .form-coupon-wrap .alert .icon {
    width: 22px;
    height: 22px;
    margin-left: 5px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.cart-sc .form-coupon-wrap .alert.green {
    background-color: rgb(76 175 80 / 30%);
    border-color: #8bc34a;
}

.cart-sc .form-coupon-wrap .alert.green .icon {
    background: url(../img/icons/emoji/party.png) no-repeat 50% 50%;
}

.cart-sc .form-coupon-wrap .alert.red {
    background-color: rgb(251 86 91 / 30%);
    border-color: #efa3a5;
}

.cart-sc .form-coupon-wrap .alert.red .icon {
    background: url(../img/icons/emoji/sad.png) no-repeat 50% 50%;
}

.cart-sc .form-coupon-wrap .alert.blue {
    background-color: rgb(33 150 243 / 30%);
    border-color: #2196f3;
}

.cart-sc .form-coupon-wrap .alert.blue .icon {
    background: url(../img/icons/emoji/info.png) no-repeat 50% 50%;
}

.cart-sc .form-coupon-wrap .tabcontent {
    display: none;
    padding-top: 15px;
}

.cart-sc .form-coupon-wrap .tabcontent .input-wrapper {
    position: relative;
}

.cart-sc .form-coupon-wrap .tabcontent input {
    width: 100%;
    height: 48px;
    padding: 0 15px 0 90px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: top;
    position: relative;
    border-radius: var(--br-2);
    border: none;
    color: var(--c-text-1);
    background-color: var(--c-grey-light-7);
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    outline: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

.cart-sc .form-coupon-wrap .tabcontent .submit-form {
    width: 80px;
    left: 6px;
    height: 38px;
    top: 5px;
    position: absolute;
    border: none;
    outline: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    background-color: #fff;
    border-radius: var(--br-1);
    font-size: var(--fs-3);
    color: var(--c-blue-3);
    -webkit-box-shadow: 0px 1px 0px var(--c-grey-light-5);
    box-shadow: 0px 1px 0px var(--c-grey-light-5);
}

.order-summary {
    padding: 40px 0;
}

.order-summary .box {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.order-summary .header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: var(--fs-2-5);
    font-weight: 300;
    color: var(--c-grey);
}

.order-summary .order-id .id {
    font-weight: 600;
    color: var(--c-text-1);
}

.order-summary .main {
    text-align: center;
    padding: 40px 0;
}

.order-summary .main .icon {
    width: 86px;
    height: 86px;
    margin: 30px auto;
}

.order-summary .main .message {
    font-size: var(--fs-4);
    font-weight: 900;
    margin: 0;
}

.order-summary .main .sub-text {
    font-size: var(--fs-3);
    font-weight: 300;
    margin: 10px 0;
    color: var(--c-grey);
}

.order-summary .item {
    margin: -5px;
    margin-bottom: 20px;
    border-radius: var(--br-2);
    border: 1px solid var(--c-grey-light-7);
}

.order-summary .item:nth-last-child(1) {
    margin-bottom: 0;
}

.order-summary .item img {
    max-width: 100%;
    max-height: 100%;
}

.order-summary .item a {
    text-decoration: none;
    display: block;
    color: initial;
}

.order-summary .item .wrapper {
    padding: 5px;
    background-color: var(--white);
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.order-summary .item .start {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: -webkit-calc(100% - 48px);
    width: calc(100% - 48px);
}

.order-summary .item .thumb {
    width: 48px;
    height: 48px;
    padding: 8px;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.order-summary .item .title-details {
    width: -webkit-calc(100% - 48px);
    width: calc(100% - 48px);
    overflow: hidden;
    padding: 3px 5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.order-summary .item .title-details .title {
    height: 20px;
    margin: 0;
    overflow: hidden;
    font-size: var(--fs-3);
    font-weight: 600;
    line-height: 1.5;
}

.order-summary .item .title-details .details {
    height: 17px;
    font-size: var(--fs-2);
    overflow: hidden;
    color: var(--c-grey);
    line-height: 1.5;
}

.order-summary .item .font-dl-bt {
    width: 48px;
    height: 48px;
    background-color: var(--c-grey-dark-5);
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.order-summary .item .font-dl-bt .icon {
    width: 20px;
    height: 20px;
}

.order-summary .item .font-dl-bt span {
    display: none;
}

.order-summary .item .license-icon {
    position: relative;
}

.order-summary .item .badge {
    position: absolute;
    width: 48px;
    height: 48px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.order-summary .item .license-icon .thumb {
    border-radius: var(--br-round);
}

.order-summary .item.license .end {
    display: none;
}

.order-summary .item.license .start {
    width: 100%;
}

.user-top {
    padding-top: 40px;
}

.user-top a {
    text-decoration: none;
    display: block;
    color: initial;
}

.user-top .main {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.user-top .user-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.user-top .avatar {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.user-top .profile-photo {
    width: 90px;
    height: 90px;
    padding: 5px;
    border: 2px solid var(--c-grey-light-5);
    border-radius: var(--br-round);
    overflow: hidden;
    background-color: var(--white);
}

.user-top .profile-photo img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.user-top .sign-out {
    position: absolute;
    width: 52px;
    height: 24px;
    margin: auto;
    left: 0;
    right: 0;
    bottom: -10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    font-size: var(--fs-2-5);
    font-weight: 300;
    color: #fff;
    background-color: var(--c-red-3);
}

.user-top .details {
    width: -webkit-calc(100% - 90px);
    width: calc(100% - 90px);
    overflow: hidden;
    padding: 5px 10px 5px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: var(--fs-3);
}

.user-top .row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    white-space: nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.user-top .row .verifed {
    margin-right: 5px;
}

.user-top .row .verify {
    margin-right: 5px;
    font-size: var(--fs-2-5);
    color: var(--white);
    font-weight: 300;
    border: none;
    background-color: var(--c-blue-3);
    border-radius: var(--br-1);
    cursor: pointer;
}

.user-top .actions {
    padding-top: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.user-top .profile-act {
    width: 150px;
    height: 44px;
    font-size: var(--fs-3);
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--white);
    border-radius: var(--br-1);
    border: 1px solid var(--c-grey-light-5);
}

.user-top .profile-act .icon {
    display: none;
}

.user-tabs .tabs-header {
    margin-top: 40px;
    position: relative;
}

.user-tabs .tabs-header::after {
    content: '';
    position: absolute;
    bottom: 10px;
    width: 100%;
    border-bottom: 1px solid var(--c-grey-light-5);
}

.tabs.user-tabs .tabs-header .tablink {
    -webkit-transition: color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.tabs.user-tabs .tabs-header .tablink.active {
    font-weight: 500;
}

.user-tabs .tabs-content .tab-wrapper {
    padding-top: 20px;
}

.user-tabs .fonts-empty {
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
    padding: 50px 20px;
    text-align: center;
}

.user-tabs .fonts-empty .illu {
    margin: 0 auto;
    width: 160px;
}

.user-tabs .fonts-empty .text {
    padding: 10px 0;
    font-size: var(--fs-5);
    font-weight: 900;
}

.user-tabs .fonts-empty .sub-text {
    font-size: var(--fs-3);
    font-weight: 300;
    color: var(--c-grey);
}

.user-tabs .fonts-empty .links {
    padding: 15px 0 0 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 305px;
    margin: 0 auto;
}

.user-tabs .fonts-empty .link {
    font-size: var(--fs-3);
    font-weight: 300;
    color: var(--c-blue-3);
}

.orders-list {
    padding: 20px 0;
}

.orders-list .item {
    padding: 10px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
    margin-bottom: 50px;
}

.orders-list .item a {
    display: block;
    text-decoration: none;
    color: initial;
}

.orders-list .item img {
    max-width: 100%;
    max-height: 100%;
}

.orders-list .item .thumb {
    width: 72px;
    height: 72px;
    margin: -30px auto 0 auto;
    padding: 10px;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-shadow: 0px 2px 6px -2px #ffcf47;
    box-shadow: 0px 2px 6px -2px #ffcf47;
}

.orders-list .item .info {
    padding: 15px 0;
    text-align: center;
}

.orders-list .item .bundle-name {
    font-weight: 600;
}

.orders-list .item .more {
    padding: 10px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 20px;
    font-size: var(--fs-2-5);
    color: var(--c-grey);
    font-weight: 300;
}

.orders-list .item .top .actions {
    padding-top: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}

.orders-list .item .top .actions .btn {
    width: 260px;
    height: 48px;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    font-weight: 300;
    position: relative;
}

.orders-list .item .top .actions .dl-btn {
    background-color: var(--c-text-1);
    color: var(--white);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-text-1);
    box-shadow: 0px 2px 4px -2px var(--c-text-1);
}

.orders-list .item .dl-btn .icon {
    position: absolute;
    opacity: 0.4;
    right: 15px;
}

.orders-list .item .up-btn {
    font-size: var(--fs-3);
    border: 1px solid var(--c-grey-light-5);
}

.orders-list .item .up-btn .title {
    margin-left: 10px;
    color: var(--c-red-3);
    font-size: var(--fs-2-5);
}

.orders-list .item .up-btn .value {
    font-weight: 600;
}

.orders-list .item .up-btn .currency {
    font-size: var(--fs-2);
    color: var(--c-grey);
}

.orders-list .item .font-licenses {
    padding-top: 20px;
    margin-top: 30px;
    border-top: 1px solid var(--c-grey-light-5);
}

.orders-list .item .font-licenses .sc-title {
    font-size: var(--fs-2-5);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 300;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 15px;
}

.orders-list .item .font-licenses .sc-title .add-license {
    color: var(--c-red-3);
}

.orders-list .item .licenses-list {
    margin: 0 -25px;
    overflow: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.orders-list .item .license {
    padding: 10px;
    width: 300px;
    margin-left: 15px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: var(--br-2);
    background-color: var(--white);
    border: 1px solid var(--c-grey-light-5);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.orders-list .item .licenses-list .license:nth-child(1) {
    margin-right: 25px;
}

.orders-list .item .licenses-list .license:nth-last-child(1) {
    margin-left: 25px;
}

.orders-list .item .licenses-list .license:only-child {
    width: -webkit-calc(100% - 50px);
    width: calc(100% - 50px);
}

.orders-list .item .license .start {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
}

.orders-list .item .license .badge {
    width: 72px;
    height: 72px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    background-color: var(--c-grey-light-8);
}

.orders-list .item .license .l-info {
    width: -webkit-calc(100% - 72px);
    width: calc(100% - 72px);
    font-size: var(--fs-2-5);
    font-weight: 300;
    text-align: right;
    padding: 3px 10px 0 0;
}

.orders-list .item .license .type {
    font-weight: 600;
    margin-bottom: 3px;
}

.orders-list .item .owner .row {
    margin-bottom: 7px;
}

.orders-list .item .owner .title {
    color: var(--c-grey);
}

.orders-list .item .owner .value {
    color: var(--c-text-1);
    font-weight: 400;
}

.orders-list .item .license-details {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -moz-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    width: -webkit-calc(100% - 72px);
    width: calc(100% - 72px);
    padding-right: 10px;
    font-size: var(--fs-2-5);
    font-weight: 300;
    text-align: right;
}

.orders-list .item .license-details .row {
    margin-bottom: 7px;
}

.orders-list .item .license-details .row .title {
    color: var(--c-grey);
}

.orders-list .item .license-details .row .value {
    color: var(--c-text-1);
    font-weight: 400;
}

.orders-list .item .license .actions {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 72px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 6px;
    margin-top: 6px;
}

.orders-list .item .license .actions .btn {
    width: 72px;
    height: 24px;
    background-color: var(--c-grey-light-5);
    border-radius: var(--br-1);
    font-size: var(--fs-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: none;
    outline: none;
    cursor: pointer;
}

.orders-list .item .license .website-script span {
    display: none;
}

.orders-list .item .license-desk-act {
    display: none;
}

.orders-list .item .license-desk-act .btn {
    height: 50px;
    width: 260px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--c-grey-light-5);
    border-radius: var(--br-2);
    background-color: var(--white);
    font-size: var(--fs-3);
    -webkit-box-shadow: 0px 2px 4px -2px rgb(27 27 29 / 5%);
    box-shadow: 0px 2px 4px -2px rgb(27 27 29 / 5%);
    cursor: pointer;
}

.orders-list .item .license-desk-act .up-btn .title {
    font-size: var(--fs-3);
}

.orders-list .item .license-desk-act .up-btn .price {
    font-size: var(--fs-3);
}

.orders-list .item .license-desk-act .add-btn .icon {
    margin-left: 10px;
}

.standard-table .table-wrapper {
    overflow: auto;
    margin: 0 -15px;
    padding: 10px 15px 20px 15px;
}

.standard-table table {
    border-collapse: collapse;
    width: 100%;
    border-radius: var(--br-4);
    overflow: hidden;
    outline: 1px solid var(--c-grey-light-5);
    border: 1px solid transparent;
    /* border-right: 1px solid transparent;
  border-left: 1px solid transparent; */
}

.standard-table td,
.standard-table th {
    border: 1px solid var(--c-grey-light-5);
    font-size: var(--fs-3);
    text-align: right;
    padding: 8px 12px;
    white-space: nowrap;
    color: var(--c-grey-dark-4);
}

.standard-table th {
    font-weight: 500;
    background-color: var(--c-grey-light-8);
    font-size: var(--fs-3);
    color: var(--c-grey);
}

.standard-table .total .value {
    font-weight: 600;
}

.standard-table .currency {
    font-size: var(--fs-2);
    color: var(--c-grey);
    font-weight: 300;
}

.standard-table.invoices-table .details {
    font-size: var(--fs-2-5);
    color: var(--c-grey);
}

.standard-table.invoices-table td.action {
    white-space: nowrap;
    width: 1%;
}

.standard-table.invoices-table .c-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.standard-table.invoices-table .c-btn.invoice-req {
    text-decoration: underline;
    cursor: pointer;
}

.standard-table.invoices-table .c-btn.pending {
    background-color: var(--c-grey-light-6);
    padding: 3px 5px 5px 5px;
    border-radius: var(--br-round);
    color: var(--c-grey);
}

.standard-table.invoices-table .c-btn.denied {
    background-color: var(--c-red-1);
    padding: 3px 10px 5px 10px;
    border-radius: var(--br-round);
}

.standard-table.invoices-table .c-btn.denied .req-agine {
    text-decoration: underline;
    margin-right: 5px;
    cursor: pointer;
}

.standard-table.invoices-table .c-btn.download a {
    color: var(--c-blue-3);
}

.standard-table.gift-table .used .value {
    font-weight: 600;
    color: var(--c-blue-3);
}

.standard-table.gift-table .remain .value {
    font-weight: 600;
    color: var(--green);
}

.tab-gifts .create-gift-card {
    padding-top: 30px;
}

.tab-gifts .create-gift-card a {
    text-decoration: none;
    width: 100%;
    height: 3rem;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 300;
    position: relative;
    background-color: var(--c-red-3);
    color: var(--white);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-red-3);
    box-shadow: 0px 2px 4px -2px var(--c-red-3);
}

.tab-letter .box {
    padding: 30px 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.tab-letter .box .form-buttons {
    padding-top: 20px;
}

.tab-letter .box .form-buttons .submit-bt {
    background-color: var(--c-red-3);
    color: var(--white);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-red-3);
    box-shadow: 0px 2px 4px -2px var(--c-red-3);
}

.tab-letter .form-control .input-wrapper.custom-check span {
    font-size: var(--fs-3);
    padding-right: 10px;
}

.tab-letter .form-control .input-wrapper.custom-check {
    margin-bottom: 30px;
}

.tab-afilliate .afilliate-hero .wrapper {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.tab-afilliate .afilliate-hero .start {
    text-align: center;
    font-weight: 300;
    margin-bottom: 20px;
    font-size: var(--fs-3);
}

.tab-afilliate .afilliate-hero .afli-sign-up-link {
    text-decoration: none;
    width: 100%;
    height: 3rem;
    border-radius: var(--br-2);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 300;
    position: relative;
    background-color: var(--c-red-3);
    color: var(--white);
    -webkit-box-shadow: 0px 2px 4px -2px var(--c-red-3);
    box-shadow: 0px 2px 4px -2px var(--c-red-3);
}

.standard-modal .modal__container {
    max-width: min(86%, 500px);
    max-height: 90vh;
    border-radius: var(--br-4);
    padding: 0;
}

.standard-modal .modal-header {
    padding: 20px;
    padding-bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.standard-modal .modal-header-title {
    font-size: var(--fs-3);
    color: var(--c-grey);
    padding-bottom: 3px;
}

.standard-modal .modal-content-wrapper {
    padding: 20px;
}

.standard-modal .modal-close-bt {
    width: 24px;
    height: 24px;
    background: url(../img/icons/x-dark-2.svg) no-repeat 50% 50%;
    opacity: 0.5;
    cursor: pointer;
}

.m-license-script .modal__container {
    max-width: min(86%, 860px);
}

.m-license-script .modal-content-wrapper {
    font-size: var(--fs-3);
    line-height: 1.6;
    color: var(--c-grey-dark-4);
}

.m-license-script .text a {
    color: var(--c-blue-3);
}

.m-license-script .text li {
    margin-bottom: 10px;
}

.m-license-script .codearea {
    width: 100%;
    /* white-space: nowrap; */
    border: none;
    padding: 10px 0;
    background-color: var(--c-text-1);
    color: #fff;
    border-radius: var(--br-2);
    text-align: left;
}

.m-license-script .codearea::-moz-selection {
    background-color: var(--c-red-2);
}

.m-license-script .codearea::selection {
    background-color: var(--c-red-2);
}

.m-license-script .sub-text {
    font-size: var(--fs-2-5);
    color: var(--gray);
}

.m-license-edit .modal-content-wrapper {
    padding-top: 0;
}

.m-license-edit .badge {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-round);
    padding: 15px;
}

.m-license-edit .badge img {
    max-width: 100%;
    max-height: 100%;
}

.m-license-edit .font-license-type {
    text-align: center;
    font-size: var(--fs-3);
    font-weight: 600;
    padding: 10px 0;
}

.m-license-edit .sub-text {
    font-size: var(--fs-2-5);
    color: var(--c-red-3);
}

.m-designer-contacts {}

.m-designer-contacts .modal-content-wrapper {
    width: 420px;
}

.m-designer-contacts .top {}

.m-designer-contacts .profile-photo {
    width: 120px;
    height: 120px;
    margin: 0 auto;
    border-radius: 999px;
    overflow: hidden;
    padding: 5px;
    background-color: var(--c-grey-light-6);
}

.m-designer-contacts .profile-photo img {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 999px;
}

.m-designer-contacts .name {
    text-align: center;
    font-weight: 600;
    padding: 10px 0;
}

.m-designer-contacts .links {
    padding: 15px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 15px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.m-designer-contacts .links .link {
    text-decoration: none;
    color: var(--c-text-1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 15px;
    border: 1px solid var(--c-grey-light-5);
    border-radius: 999px;
    font-size: var(--fs-3);
}

.m-designer-contacts .links .icon {
    margin-left: 12px;
}

.m-designer-contacts .links .value {}

.standard-modal.m-invoice-req .modal-header {
    padding-bottom: 8px;
    padding-top: 12px;
}

.m-invoice-req .modal-content-wrapper {
    padding-top: 0px;
}

.m-invoice-req .main-wrapper {
    position: relative;
}

.m-invoice-req .inv-radio {
    display: none;
}

.m-invoice-req .l-wrapper .toggle {
    width: 50%;
    height: 48px;
    position: absolute;
    top: 0;
    background-color: var(--c-grey-light-7);
}

.m-invoice-req .first-form .l-wrapper .toggle {
    right: 0;
    border-radius: 0 var(--br-2) var(--br-2) 0;
}

.m-invoice-req .second-form .l-wrapper .toggle {
    left: 0;
    border-radius: var(--br-2) 0 0 var(--br-2);
}

.m-invoice-req .l-wrapper .switch {
    width: -webkit-calc(100% - 12px);
    width: calc(100% - 12px);
    height: 40px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    font-size: var(--fs-3);
    font-weight: 400;
}

.m-invoice-req .first-form .l-wrapper .switch {
    margin: 4px 4px auto auto;
}

.m-invoice-req .second-form .l-wrapper .switch {
    margin: 4px auto auto 4px;
}

.m-invoice-req .l-wrapper .inputs-container {
    width: 100%;
}

.m-invoice-req .l-wrapper .inputs-container .wrapper {
    visibility: hidden;
    opacity: 0;
    height: 0;
    overflow: hidden;
}

.m-invoice-req .l-wrapper .sub-text {
    font-size: var(--fs-2-5);
    color: var(--c-red-2);
}

.m-invoice-req .form-control .input-wrapper.form-buttons {
    margin-top: 0;
}

.m-invoice-req .inv-radio:checked~label .toggle .switch {
    -webkit-box-shadow: 0px 3px 8px rgb(0 0 0 / 15%), 0px 3px 1px rgb(0 0 0 / 6%);
    box-shadow: 0px 3px 8px rgb(0 0 0 / 15%), 0px 3px 1px rgb(0 0 0 / 6%);
    background-color: #fff;
    color: var(--c-blue-3);
}

.m-invoice-req .inv-radio:checked~label .inputs-container .wrapper {
    visibility: visible;
    opacity: 1;
    height: 100%;
    padding-top: 65px;
}

.profile-edit {
    padding: 60px 0px;
}

.profile-edit .box {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    padding: 25px;
    border-radius: var(--br-3);
    background-color: var(--c-grey-light-8);
}

.profile-edit .avatar {
    width: 96px;
    height: 96px;
    margin: 0 auto;
    margin-bottom: 50px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: var(--br-round);
    border: 2px solid var(--c-grey-light-5);
    background-color: var(--c-white);
}

.profile-edit .avatar .media-container {
    width: 84px;
    height: 84px;
    overflow: hidden;
    border-radius: var(--br-round);
}

.profile-edit .avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.profile-edit .avatar input[type=file] {
    display: none;
}

.profile-edit .avatar .file-select {
    width: 84px;
    height: 28px;
    margin: 0;
    position: absolute;
    bottom: -15px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: var(--fs-2-5);
    background-color: var(--white);
    border-radius: var(--br-1);
    border: 1px solid var(--c-grey-light-5);
    cursor: pointer;
}

.profile-edit #formTypeToggle.t-personal .personal-form {
    display: block;
}

.profile-edit #formTypeToggle.t-personal .business-form {
    display: none;
}

.profile-edit #formTypeToggle.t-business .personal-form {
    display: none;
}

.profile-edit #formTypeToggle.t-business .business-form {
    display: block;
}

.create-gift-card {
    padding: 30px 0;
}

.create-gift-card .box {
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
    margin-top: 80px;
    padding: 25px;
    border-radius: var(--br-3);
    background-color: var(--c-grey-light-8);
}

.create-gift-card .top {
    margin-top: -80px;
    padding: 0px 20px 40px 20px;
}

.create-gift-card .card {
    position: relative;
    max-width: 460px;
    margin: 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.create-gift-card .gift-amount {
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    bottom: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    white-space: nowrap;
    overflow: hidden;
}

.create-gift-card .gift-amount .value {
    font-size: 64px;
    font-weight: 900;
    color: var(--white);
}

.create-gift-card .gift-amount .currency {
    font-weight: 600;
}

.create-gift-card .card-image {
    border-radius: var(--br-5);
    overflow: hidden;
    -webkit-box-shadow: 0px 40px 50px -20px rgba(0, 0, 0, 0.15), 0px 4px 4px rgba(0, 0, 0, 0.05), 0px 8px 24px -8px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 40px 50px -20px rgba(0, 0, 0, 0.15), 0px 4px 4px rgba(0, 0, 0, 0.05), 0px 8px 24px -8px rgba(0, 0, 0, 0.15);
}

.create-gift-card .inputs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 460px;
    margin: 0 auto;
}

.create-gift-card .inputs .input-wrapper:nth-child(1) {
    width: -webkit-calc(75% - 20px);
    width: calc(75% - 20px);
}

.create-gift-card .inputs .input-wrapper:nth-child(2) {
    width: 25%;
}

.create-gift-card .gift-card-desc {
    max-width: 460px;
    margin: 0 auto;
}

.create-gift-card .gift-card-desc p {
    font-weight: 300;
    margin-bottom: 10px;
    line-height: 1.6;
    font-size: var(--fs-3);
}

.create-gift-card .form-buttons {
    max-width: 460px;
    margin: 0 auto;
    padding: 10px 0;
}

.order-summary .gift-card-table {
    max-width: 560px;
    margin: 0 auto;
}

.order-summary .gift-card-table table td {
    background-color: var(--white);
}

.copy-btn {
    border: none;
    outline: none;
    background-color: transparent;
    margin: 0 auto;
    cursor: pointer;
}

.gift-card-table table td.action {
    text-align: center;
}

.afilliate-sign-up {
    padding: 40px 0;
}

.afilliate-sign-up .box {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.afilliate-sign-up .wrapper {
    padding: 25px 0;
}

.afilliate-sign-up .introduction .title {
    font-size: var(--fs-5);
    text-align: center;
    font-weight: 600;
}

.afilliate-sign-up .introduction .desc {
    font-size: var(--fs-3);
    padding-top: 15px;
    line-height: 1.8;
}

.afilliate-sign-up .rules .title {
    font-size: var(--fs-4);
    font-weight: 600;
}

.afilliate-sign-up .rules li {
    font-size: var(--fs-3);
    padding-top: 15px;
    line-height: 1.8;
}

.afilliate-sign-up .form-wrapper {
    padding: 10px 0;
}

.afilliate-sign-up .form-wrapper .input-wrapper.custom-check span {
    font-size: var(--fs-3);
}

.afilliate-sign-up .afilliate-links .sc-title {
    padding: 20px 0;
    font-weight: 600;
    font-size: var(--fs-3);
}

.afilliate-sign-up .afilliate-links .form-buttons label {
    font-size: var(--fs-2-5);
}

.affiliate-top {
    padding-top: 40px;
}

.affiliate-top .main>.start {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.affiliate-top .main .start .sc-title .title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 10px 0;
}

.affiliate-top .date-filter .input-wrapper {
    width: 180px;
    margin: 10px auto;
}

.affiliate-top .date-filter .input-wrapper.select-wrapper::after {
    top: 17px;
}

.affiliate-top .reports {
    padding: 25px 0 5px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 15px;
}

.affiliate-top .reports .cell {
    background-color: var(--c-grey-light-6);
    padding: 15px;
    border-radius: var(--br-2);
    width: 100%;
}

.affiliate-top .reports .cell:nth-child(1) {
    width: -webkit-calc(50% - 8px);
    width: calc(50% - 8px);
}

.affiliate-top .reports .cell:nth-child(2) {
    width: -webkit-calc(50% - 8px);
    width: calc(50% - 8px);
}

.affiliate-top .reports .cell .title {
    font-size: var(--fs-3);
    margin-bottom: 10px;
    font-weight: 300;
    color: var(--c-grey);
}

.affiliate-top .reports .cell .value {
    font-weight: 600;
    font-size: var(--fs-7);
}

.affiliate-top .reports .cell .value span.currency {
    font-weight: 300;
    font-size: var(--fs-3);
}

.affiliate-top .main>.end {
    padding: 20px 0;
}

.affiliate-top .wallet {
    padding: 15px;
    border-radius: var(--br-3);
    background-color: var(--c-grey-dark-5);
    background-image: url(../img/circle-pattern.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.affiliate-top .wallet .title {
    text-align: center;
    font-size: var(--fs-3);
    color: var(--c-grey-light-3);
    font-weight: 300;
}

.affiliate-top .wallet .balance {
    text-align: center;
    padding: 30px 0 0px 0;
    color: var(--white);
}

.affiliate-top .wallet .balance .value {
    font-size: var(--fs-9);
    font-weight: 600;
}

.affiliate-top .wallet .balance .currency {
    font-weight: 300;
    font-size: var(--fs-3);
    color: var(--c-grey);
}

.affiliate-top .wallet .payment-req {}

.affi-links-table td.link {
    text-align: left;
}

.tab-affiSetting {}

.tab-affiSetting .box {
    padding: 30px 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.tab-affiSetting .box .container {
    margin-bottom: 30px;
}

.tab-affiSetting .box .sc-title {
    padding: 20px 0;
    font-weight: 600;
    font-size: var(--fs-3);
}

.user-dash-links {
    padding-top: 40px;
}

.user-dash-links .wrapper {
    height: 58px;
    padding: 4px;
    margin: 0 auto;
    max-width: 340px;
    background-color: var(--c-grey-light-7);
    border-radius: var(--br-round);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.user-dash-links .link {
    width: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    color: var(--c-grey-dark-2);
    border-radius: var(--br-round);
    font-weight: 300;
}

.user-dash-links .link.active {
    color: var(--c-blue-3);
    background-color: var(--white);
}

.pre-load-images {
    display: none;
}

.pre-load-images img {
    display: none;
}

.notification {}

.notification .swal2-modal {
    background-color: var(--c-grey-dark-5) !important;
    -webkit-box-shadow: 0px 6px 16px -10px var(--c-grey-dark-5) !important;
    box-shadow: 0px 6px 16px -10px var(--c-grey-dark-5) !important;
    border-radius: var(--br-2) !important;
    color: #fff;
    font-size: var(--fs-2-5);
    font-weight: 300;
    padding: 16px 16px 19px 16px;
    overflow: hidden;
    position: relative;
}

.notification .swal2-modal::before {
    content: '';
    width: 28px;
    height: 28px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 10px;
    background-position: center;
    background-size: contain;
}

.notification .swal2-modal::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 3px;
    bottom: 0;
    left: 0;
    background-color: rgba(255, 255, 255, 0.5);
    -webkit-animation: progressBar 4s ease-out;
    animation: progressBar 4s ease-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes progressBar {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}

@keyframes progressBar {
    0% {
        width: 100%;
    }
    100% {
        width: 0;
    }
}

.notification .swal2-modal .swal2-html-container {
    margin: 0;
    font-weight: 300;
    position: relative;
}

.notification.notification-success .swal2-modal {}

.notification.notification-success .swal2-modal::before {
    background-image: url(../img/icons/gifs/success.gif);
}

.notification.notification-success .swal2-modal::after {
    background-color: #08c18a;
}

.notification.notification-warning .swal2-modal::before {
    background-image: url(../img/icons/gifs/warning.gif);
}

.notification.notification-warning .swal2-modal::after {
    background-color: var(--c-red-3);
}

.notification.notification-info .swal2-modal::before {
    background-image: url(../img/icons/gifs/info.gif);
}

.notification.notification-info .swal2-modal::after {
    background-color: var(--c-grey-light-3);
}

.alerts-container {}

.sw-alert.swal2-container {
    position: relative;
    overflow: hidden;
    padding: 20px 0;
    width: 100%;
    z-index: 0;
}

#alertsContainer .sw-alert .swal2-modal:not(:last-child) {
    margin-bottom: 15px;
}

.sw-alert .swal2-modal {
    background-color: var(--c-grey-light-7) !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-radius: var(--br-2) !important;
    color: var(--c-text-1);
    font-size: var(--fs-3);
    padding: 15px 20px 15px 30px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.sw-alert .swal2-modal::before {
    content: '';
    position: absolute;
    margin: auto;
    right: 8px;
    top: 0;
    bottom: 0;
    width: 5px;
    border-radius: var(--br-round);
    background-color: var(--c-grey-light-4);
    height: -webkit-calc(100% - 26px);
    height: calc(100% - 26px);
}

.sw-alert .swal2-modal .swal2-html-container {
    margin: 0;
    font-weight: 300;
    position: relative;
    direction: rtl;
    text-align: right;
}

.sw-alert .swal2-modal .swal2-close {
    outline: none !important;
    width: 30px;
    height: 30px;
    margin: auto;
    top: 0;
    bottom: 0;
    position: absolute;
    left: 10px;
    line-height: 30px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.sw-alert .swal2-modal .swal2-close:focus {
    outline: none !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.sw-alert.sw-alert-success .swal2-modal::before {
    background-color: #08c18a;
}

.sw-alert.sw-alert-warning .swal2-modal::before {
    background-color: var(--c-red-3);
}

.sw-alert.sw-alert-info .swal2-modal::before {
    background-color: var(--c-blue-3)
}

.sw-loader {}

.sw-loader .swal2-modal {
    background-color: rgba(255, 255, 255);
    background-color: rgba(255, 255, 255, 0.7);
    -webkit-backdrop-filter: saturate(170%) blur(4px);
    backdrop-filter: saturate(170%) blur(4px);
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-radius: var(--br-4) !important;
    padding: 10px;
    overflow: hidden;
    position: relative;
    width: 100%;
    width: auto;
    height: auto;
}

.sw-loader .swal2-modal .swal2-html-container {
    margin: 0;
    width: 42px;
    height: 42px;
}

.sw-loader .swal2-modal .swal2-html-container img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}

.contact-page {
    padding: 30px 0;
}

.contact-page .sc-title {
    margin-bottom: 20px;
}

.contact-page .sc-title .title {
    font-size: var(--fs-5);
    margin: 0;
    padding: 5px 0 5px 0;
    -webkit-columns: var(--c-text-1);
    -moz-columns: var(--c-text-1);
    columns: var(--c-text-1);
    padding-left: 5px;
}

.contact-page .main-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.contact-page .main-wrapper .start {
    width: 100%;
}

.contact-page .main-wrapper .content {
    padding: 15px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
    font-size: var(--fs-3);
    line-height: 1.6;
}

.contact-page .main-wrapper .content a {
    color: var(--c-blue-3);
}

.contact-page .main-wrapper .content ul {
    padding: 0;
    list-style: none;
    margin: 0;
}

.contact-page .main-wrapper .content li {
    margin-bottom: 15px;
}

.contact-page .contact-form {
    padding: 20px 15px;
    margin-top: 30px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.contact-page .form-title {
    font-size: var(--fs-4);
    margin: 0;
    padding: 0 0 20px 0;
    color: var(--c-grey-dark-5);
    font-weight: 600;
}

.contact-page .end {
    padding: 15px;
    margin-top: 30px;
    background-color: var(--c-grey-light-8);
    border-radius: var(--br-3);
}

.contact-page .support-faq {
    padding-top: 10px;
}

.contact-page .support-faq .form-title {}

.p-page .blog-post-header .page-container {
    background: var(--c-grey-light-7);
    background: -webkit-gradient(linear, left bottom, left top, from(var(--white)), to(var(--c-grey-light-7)));
    background: linear-gradient(0deg, var(--white) 0%, var(--c-grey-light-7));
    padding-top: 80px;
}

.p-page .blog-post-header .page-container.blog-with-cover::before {
    display: none;
}

.p-page .blog-post-header .head {
    min-height: auto;
    padding: 20px 15px;
}

.p-page .blog-post-header .headline {
    margin: 0;
}

.p-page .blog-post-content {
    border-top: none;
    padding-top: 5px;
}

.p-page .blog-post-content .main-wrapper {
    padding: 0 15px;
}


/* zzz */


/* ==========================================================================
   Keyframes
   ========================================================================== */

@-webkit-keyframes fadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@-webkit-keyframes slideIn {
    from {
        top: -140px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

@keyframes slideIn {
    from {
        top: -140px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }
    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }
    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }
    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }
    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }
    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }
    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }
    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }
    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}

@-webkit-keyframes fadeEffect {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeEffect {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 200;
}

.modal__container {
    background-color: #fff;
    padding: 30px;
    max-width: 500px;
    max-height: 100vh;
    border-radius: 4px;
    overflow-y: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@-webkit-keyframes mmfadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes mmfadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes mmfadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes mmfadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@-webkit-keyframes mmslideIn {
    from {
        -webkit-transform: translateY(15%);
        transform: translateY(15%);
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes mmslideIn {
    from {
        -webkit-transform: translateY(15%);
        transform: translateY(15%);
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes mmslideOut {
    from {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    to {
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%);
    }
}

@keyframes mmslideOut {
    from {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    to {
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%);
    }
}

.micromodal-slide {
    display: none;
}

.micromodal-slide.is-open {
    display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
    -webkit-animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
    -webkit-animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
    animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
    -webkit-animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
    -webkit-animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
    animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
    /* will-change: transform; */
}

.lb-nav a.lb-prev {
    background: url(../img/icons/chevron-left-black.svg) 50% 50% no-repeat;
    opacity: 1;
    background-color: #ffffff59;
    width: 32px;
    height: 32px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    margin: auto;
    border-radius: var(--br-round);
}

.lb-nav a.lb-next {
    background: url(../img/icons/chevron-left-black.svg) 50% 50% no-repeat;
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
    opacity: 1;
    background-color: #ffffff59;
    width: 32px;
    height: 32px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
    border-radius: var(--br-round);
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

.hide-in-mobile {
    display: none;
}

.visibiliy-hidden {
    visibility: hidden;
}

a.no-styling {
    text-decoration: none;
    color: initial;
}

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

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

.hidden,
[hidden] {
    display: none !important;
}

.sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.sr-only.focusable:active,
.sr-only.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    white-space: inherit;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix::before,
.clearfix::after {
    content: " ";
    display: table;
}

.clearfix::after {
    clear: both;
}


/* ==========================================================================
   Media queries
   ========================================================================== */

@media only screen and (min-width: 320px) {
    header .icon-wrapper {
        padding: 14px 10px;
    }
    header .header-container {
        padding: 0;
    }
}

@media only screen and (min-width: 379px) {
    .i-card .thumb .icon-container {
        padding: 20px;
    }
    .i-card .oneliner {
        height: 50px;
    }
    .card .thumb {
        width: 106px;
        height: 106px;
        padding: 18px;
    }
    .card .details {
        padding: 10px;
    }
    .card .details {
        width: -webkit-calc(100% - 106px);
        width: calc(100% - 106px);
    }
    .select-license-modal .op-label .option {
        padding: 10px 10px 10px 40px;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .select-license-modal .license-option-wrapper {
        margin-bottom: 10px;
    }
    .select-license-modal .license-option-wrapper .licence-desc-toggle {
        left: 10px;
        top: 11px;
    }
    .select-license-modal .options {
        max-height: 375px;
    }
}

@media only screen and (min-width: 480px) {
    header .icon-wrapper {
        padding: 14px;
    }
    header .cart .cart-counter {
        right: 8px;
    }
    .i-card .oneliner {
        height: 60px;
    }
    .fp-header .specs {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .fontpage-tabs .tabs-content .font-specs .spec {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
    .fontpage-tabs .tabs-content .font-specs .spec .title {
        width: 160px;
    }
    .fontpage-tabs .tabs-content .font-specs .spec .value {
        text-align: right;
    }
    .recommended-sc .recommended-fonts-carusel {
        margin: 0;
    }
    .recommended-sc .card {
        width: 360px;
        margin-left: 20px;
        margin-right: 0;
    }
    .recommended-sc .sc-title .swiper-buttons {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .font-card .oneliner {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
    .grand-total-mob .pool-bedeh-pool-bedeh-bishtar {
        width: 340px;
    }
    .cart-sc .cart-total-sc .grand-total-mob .g-total {
        width: -webkit-calc(100% - 340px);
        width: calc(100% - 340px);
    }
    .user-top .profile-act {
        width: 200px;
    }
    .user-top .profile-act .icon {
        display: block;
        position: absolute;
        right: 15px;
    }
    .user-top .profile-act span {
        padding-right: 10px;
    }
}

@media only screen and (min-width: 560px) {
    .p-index .licenses .item {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-bottom: 20px;
    }
    .p-index .licenses .license-badge {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        margin: 0;
        width: 148px;
        height: 148px;
    }
    .p-index .licenses .license-details {
        padding-top: 0;
        padding: 10px 15px 10px 0;
        width: -webkit-calc(100% - 148px);
        width: calc(100% - 148px);
    }
    .p-index .licenses .license-details .summary {
        margin-bottom: 0;
    }
    .p-index .licenses .bottom {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
    .p-index .licenses .licenses-pagination {
        bottom: 10px;
    }
    .main-font-desc .section.gallery .photo-wrapper img {
        max-width: 500px;
        max-height: 500px;
    }
    .posts-stream .list-view {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 20px;
    }
    .posts-stream .card-post {
        width: -webkit-calc(50% - 10px);
        width: calc(50% - 10px);
        margin-bottom: 30px;
    }
}

@media only screen and (min-width: 768px) {
    .support-faq .support {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .support-faq .profile {
        border-bottom: none;
        border-left: 1px solid var(--c-grey-light-6);
    }
    .support-faq .profile:nth-child(1) {
        border-radius: 0 var(--br-2) var(--br-2) 0;
    }
    .support-faq .profile:nth-last-child(1) {
        border-radius: var(--br-2) 0 0 var(--br-2);
    }
    .cards-wrapper {
        gap: 20px 16px;
    }
    .cards-wrapper .card.small {
        width: -webkit-calc(50% - 8px);
        width: calc(50% - 8px);
    }
    .cards-wrapper .card.small:nth-child(9) {
        display: none;
    }
    .footer .top {
        display: block;
    }
    .footer .main .box {
        padding-top: 10px;
    }
    .footer .main .contact {
        max-width: 480px;
        margin: 0 auto;
    }
    .font-lab-sc .fl-results>.wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        border-top: 1px solid var(--c-grey-light-5);
    }
    .font-lab-sc .fl-results .result {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        -webkit-flex-basis: 50%;
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }
    .font-lab-sc .fl-results .result:nth-child(odd) {
        border-left: 1px solid var(--c-grey-light-5);
    }
    .font-lab-sc .fl-results .result:nth-last-child(1) {
        border-left: none;
    }
    .main-font-desc .section.before-carusel .sc-title {
        margin-bottom: 1.5rem;
        font-size: var(--fs-5);
        text-align: right;
    }
    .main-font-desc .section.before-carusel {
        font-size: var(--fs-4);
        line-height: 1.8;
    }
    .main-font-desc .section.after-carusel {
        font-size: var(--fs-4);
        line-height: 1.8;
    }
    .font-p-designers .designer {
        max-width: 720px;
        margin: 0 auto;
    }
    .font-p-designers .designer .main {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .font-p-designers .designer .media-container {
        width: 96px;
        height: 96px;
    }
    .font-p-designers .designer .right {
        padding: 20px;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        padding-left: 10px;
    }
    .font-p-designers .designer .role span {
        position: relative;
        margin: 10px auto;
        left: auto;
        right: auto;
        border-radius: var(--br-round);
    }
    .font-p-designers .designer .header {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 40px 20px 15px 20px;
    }
    .font-p-designers .designer .name {
        margin: 0;
    }
    .font-p-designers .designer .social-links {
        margin: 0;
        padding: 0;
    }
    .font-p-designers .designer .social {
        width: 28px;
        padding: 4px;
        margin: 0 5px;
    }
    .font-p-designers .designer .about {
        border-bottom: none;
    }
    .font-p-designers .designer .footer {
        border-top: 1px solid var(--c-grey-light-5);
    }
    .font-p-designers .designer .about .wrapper {
        padding-bottom: 0;
        color: var(--c-grey-dark-5);
    }
    .font-p-designers .designer .fonts {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        padding: 15px;
    }
    .font-p-designers .designer .footer .wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .font-p-designers .designer .fonts .font-icon {
        width: 42px;
        height: 42px;
        padding: 8px 10px 8px 0;
        border-radius: var(--br-round);
        overflow: hidden;
        border: 2px solid #fff;
        margin-left: -10px;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-p-designers .designer .fonts .font-icon img {
        max-width: 100%;
        max-height: 100%;
    }
    .font-p-designers .designer .fonts .font-icon:hover {
        -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }
    .font-p-designers .designer .view-more {
        color: var(--c-grey);
    }
    .font-p-designers .designer .view-more:hover {
        color: var(--red);
    }
    .posts-stream .list-view {
        gap: 15px;
    }
    .posts-stream .card-post {
        width: -webkit-calc(33.3% - 10px);
        width: calc(33.3% - 10px);
        margin-bottom: 30px;
    }
    .posts-stream .card-post .headline {
        font-size: var(--fs-3);
    }
    .blog-post-header .head .hero {
        display: block;
        width: 100%;
        padding-top: 33.33%;
        position: relative;
    }
    .blog-post-header .head .hero .wrapper {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background-color: var(--c-grey-light-3);
        overflow: hidden;
        border-radius: var(--br-1);
    }
    .blog-post-header .head .hero img {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        width: 100%;
    }
    .blog-post-header .page-container {
        background-size: 100% 400px;
        padding-top: 50px;
    }
    .blog-post-header .page-container.blog-with-cover::before {
        height: 400px;
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .blog-post-header .head {
        border-radius: var(--br-3) var(--br-3) 0 0;
    }
    .blog-post-header .headline {
        margin: 15px 0;
    }
    .blog-post-content .related-posts .post-stream {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        /* gap: 30px; */
    }
    .blog-post-content .related-posts .post-card {
        width: -webkit-calc(50% - 15px);
        width: calc(50% - 15px);
    }
    .license-view .details-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .license-view .font-icon {
        margin: 0;
    }
    .license-view .details {
        padding-right: 15px;
    }
    .license-view .top {
        text-align: right;
        margin-bottom: 10px;
    }
    .license-view .top span {
        display: inline-block;
    }
    .license-view .top .dash {
        display: inline-block;
    }
    .license-view .bot {
        border: none;
        padding: 0;
        margin: 0;
        display: block;
    }
    .license-view .top .font-name a {
        padding: 0;
    }
    .license-view .bot .for {
        font-weight: 300;
    }
    .license-view .bot .license-holder {
        width: auto;
        padding-left: 10px;
    }
    .license-view .bot .website-address {
        width: auto;
        padding: 0;
    }
    .fonts-list .content-stream {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .font-card {
        width: -webkit-calc(50% - 8px);
        width: calc(50% - 8px);
    }
    .font-card .oneliner {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .designers-list .designers {}
    .designers-list .designer {
        width: -webkit-calc(33.33% - 11px);
        width: calc(33.33% - 11px);
        margin-bottom: 20px;
    }
    .affiliate-top .main {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .affiliate-top .main>.start {
        width: -webkit-calc(100% - 300px);
        width: calc(100% - 300px);
    }
    .affiliate-top .main>.end {
        width: 280px;
    }
    .affiliate-top .main .start .sc-title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .affiliate-top .date-filter .input-wrapper {
        margin: 0;
    }
    .affiliate-top .main .start .sc-title .title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .affiliate-top .main .start .sc-title .title .icon {
        margin-left: 5px;
    }
    .affiliate-top .reports {
        gap: 0;
    }
    .affiliate-top .reports .cell {
        width: 33.33% !important;
        padding: 20px;
        background-color: transparent;
        border-left: 1px solid var(--c-grey-light-5);
    }
    .affiliate-top .reports .cell:nth-last-child(1) {
        border: none;
    }
    .affiliate-top .main>.end {
        padding: 0;
    }
}

@media only screen and (min-width: 992px) {
     :root {
        --header-height: 174px;
        --header-height-fix: 75px;
    }
    .hide-in-desktop {
        display: none !important;
    }
    .hide-in-mobile {
        display: initial;
    }
    body.disable-scroll {
        overflow: auto;
        height: initial;
    }
    .search-modal .search-bt:hover img {
        /* -webkit-animation-duration: 0.8s;
    animation-duration: 0.8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand; */
    }
    header {
        height: auto;
        width: 100%;
        margin: 0;
    }
    header .header-container {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        max-width: 1220px;
        margin: 0 auto;
    }
    header .header-container .branding {
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -moz-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        display: -ms-grid;
        display: grid;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-right: 16px;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        width: 228px;
    }
    header .header-container .branding a {
        width: 114px;
    }
    header .header-container .start {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -moz-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }
    header .header-container .end {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -moz-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -moz-box-orient: horizontal;
        -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        padding-left: 16px;
    }
    header .header-container .main-nav {
        -webkit-box-ordinal-group: 5;
        -webkit-order: 4;
        -moz-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4;
    }
    header .header-container .desktop-top-bar {
        height: 100px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav {
        position: relative;
        width: 100%;
    }
    header .desktop-user {
        height: 46px;
        width: 150px;
        padding: 0 8px;
        margin-right: 16px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        background-color: var(--c-grey-dark-6);
        border-radius: var(--br-2);
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    header .desktop-user .profile-picture {
        margin-left: 8px;
    }
    header .desktop-user .profile-picture img {
        width: 30px;
        height: 30px;
        border-radius: var(--br-round);
    }
    header .desktop-user.login-signup .profile-picture {
        background-color: var(--c-grey-light-5);
        border-radius: var(--br-round);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 30px;
        height: 30px;
        padding: 4px;
    }
    header .desktop-user.login-signup .profile-picture img {
        max-width: 100%;
        max-height: 100%;
        width: initial;
        height: initial;
    }
    header .desktop-user .user-name {
        max-width: 94px;
        margin-bottom: 3px;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        text-align: center;
        white-space: nowrap;
        font-size: var(--fs-3);
        font-weight: 300;
        color: var(--white);
        overflow: hidden;
    }
    header .cart .icon-wrapper {
        width: 46px;
        height: 46px;
        padding: 0;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-2);
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    header .cart .icon-wrapper:hover {
        background-color: var(--c-grey-light-5);
    }
    header .cart .cart-counter {
        right: 4px;
        top: 6px;
    }
    header .cart .icon-wrapper img {
        margin: 2px 2px 0 0;
    }
    header .search-toggle .icon-wrapper {
        height: 46px;
        width: 420px;
        padding: 0 10px;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-2);
    }
    header .search-toggle .icon-wrapper::after {
        content: attr(data-placeholder);
        position: absolute;
        right: 10px;
        color: var(--c-grey);
        font-weight: 300;
    }
    .search-modal {
        position: relative;
    }
    .search-modal .overlay {
        z-index: 150;
        height: var(--header-height);
        min-height: var(--header-height);
        bottom: auto;
        background-color: rgba(255, 255, 255);
        background-color: rgba(255, 255, 255, 0.5);
        -webkit-backdrop-filter: saturate(100%) blur(6px);
        backdrop-filter: saturate(100%) blur(6px);
    }
    .search-modal .modal-content {
        z-index: 150;
        position: absolute;
        width: 420px;
        height: auto;
        right: auto;
        margin-top: -46px;
        overflow: hidden;
        background-color: var(--white);
        border: 1px solid var(--c-grey-light-4);
        border-radius: var(--br-2);
        -webkit-animation-name: fadeIn;
        -webkit-animation-duration: 0.3s;
        animation-name: fadeIn;
        animation-duration: 0.3s;
        -webkit-box-shadow: var(--bs-grey-5);
        box-shadow: var(--bs-grey-5);
        -webkit-box-shadow: rgb(0 0 0 / 5%) 0px 10px 16px -6px, rgb(0 0 0 / 5%) 0px 3px 6px -3px;
        box-shadow: rgb(0 0 0 / 5%) 0px 10px 16px -6px, rgb(0 0 0 / 5%) 0px 3px 6px -3px;
    }
    .search-modal .field-wrapper {
        height: 46px;
        border-radius: var(--br-2) var(--br-2) 0 0;
    }
    .search-modal .suggestions .title {
        margin: 8px 10px 0 0;
        font-weight: 300;
        color: var(--c-grey-dark-2);
    }
    .search-modal .search-history .item:nth-child(1) {
        margin-right: 10px;
    }
    .search-modal .search-history {
        overflow: hidden;
    }
    .search-modal .search-field {
        font-weight: 500;
        color: var(--c-text-1);
    }
    .search-modal .search-history .item {
        padding: 4px 10px;
        font-size: var(--fs-2);
        color: var(--c-grey-dark-4);
        border-color: var(--c-grey-light-7);
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-round);
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    .search-modal .search-history .item:hover {
        color: var(--c-text-1);
        border-color: var(--c-grey-light-4);
        background-color: var(--c-grey-light-4);
    }
    .main-nav li {
        position: initial;
    }
    .main-nav .menu-wrapper {
        width: 100%;
        height: 74px;
        min-height: 74px;
        position: relative;
        right: auto;
        left: auto;
        overflow: visible;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        background-color: none;
        background-color: #0000;
    }
    .main-nav .navbar {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        margin: 0 auto;
        padding: 0;
        height: 100%;
        position: initial;
    }
    .main-nav .nav-icon {
        display: none;
    }
    .main-nav .nav-icon img {
        display: none;
    }
    .main-nav .nav-title {
        font-weight: 400;
        color: var(--c-text-1);
    }
    .main-nav .main-item>.nav-link .nav-title {
        margin-bottom: 5px;
    }
    .main-nav .main-item>.nav-link {
        height: 100%;
        margin: 0 12px;
    }
    .main-nav .main-item>.nav-link:hover {
        color: #000;
    }
    .main-nav .main-item>.nav-link::after {
        content: '';
        position: absolute;
        right: -webkit-calc(50% - 3px);
        right: calc(50% - 3px);
        bottom: 14px;
        height: 5px;
        width: 5px;
        background-color: hsl(240, 13%, 96%);
        border-radius: 999px;
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .main-item:hover>.nav-link::after {
        background-color: var(--c-red-3);
        width: 20px;
        right: -webkit-calc(50% - 10px);
        right: calc(50% - 10px);
    }
    .main-nav .main-item.mega-menu:hover>.nav-link::after {
        width: 5px;
        right: -webkit-calc(50% - 3px);
        right: calc(50% - 3px);
    }
    .main-nav .main-item.drop-down:hover>.nav-link::after {
        width: 5px;
        right: -webkit-calc(50% - 3px);
        right: calc(50% - 3px);
    }
    .main-nav .main-item.has-child::after {
        display: none;
    }
    .main-nav .sub-nav {
        width: auto;
        right: auto;
        position: initial;
        overflow-y: initial;
        top: auto;
        bottom: auto;
        z-index: 160;
        background: #fff;
        -webkit-transition: right 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: right 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
        padding-bottom: 0;
    }
    .main-nav .drop-down {
        position: relative;
    }
    .main-nav .drop-down ul {
        opacity: 0;
        visibility: hidden;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: 0px;
        right: -20px;
        width: 160px;
        padding: 5px 0 10px 0;
        background-color: #fff;
        border: 1px solid var(--c-grey-light-5);
        -webkit-box-shadow: 0 0 0 0 rgb(0 0 0 / 20%);
        box-shadow: 0 0 0 0 rgb(0 0 0 / 20%);
        border-radius: 0px 0px var(--br-4) var(--br-4);
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    .main-nav .drop-down .m--link {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: var(--fs-3);
        padding: 12px 16px;
    }
    .main-nav .drop-down .m--link:hover .nav-title {
        text-decoration: underline;
    }
    .main-nav .main-item.drop-down:hover ul {
        opacity: 1;
        visibility: visible;
        -webkit-box-shadow: var(--bs-grey-5);
        box-shadow: var(--bs-grey-5);
    }
    .main-nav .mega-menu-wrapper {
        opacity: 0;
        visibility: hidden;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        width: 980px;
        min-height: 300px;
        background-color: #fff;
        border: 1px solid var(--c-grey-light-5);
        -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
        border-radius: 0px 0px var(--br-4) var(--br-4);
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    .main-nav .main-item:hover .mega-menu-wrapper {
        opacity: 1;
        visibility: visible;
        -webkit-box-shadow: 0px 30px 20px -10px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 30px 20px -10px rgba(0, 0, 0, 0.2);
    }
    .main-nav .mega-menu-wrapper::after {
        content: '';
        position: absolute;
        top: 0;
        height: 100%;
        border-left: 1px solid var(--c-grey-light-5);
        right: 219px;
    }
    .main-nav .nav-link.back-bt {
        display: none;
    }
    .main-nav .nav-link.view-all {
        display: none;
    }
    .main-nav li.has-child::after {
        content: none;
    }
    .main-nav .mega-menu-wrapper .sub-item {
        width: 220px;
        padding: 3px 10px;
        font-size: var(--fs-3);
    }
    .main-nav .mega-menu-wrapper .sub-item:nth-child(3) {
        padding-top: 15px;
    }
    .main-nav .mega-menu-wrapper .sub-item:nth-last-child(2) {
        padding-bottom: 15px;
    }
    .main-nav .mega-menu-wrapper .sub-item>.nav-link {
        padding: 8px 16px;
        border-radius: var(--br-round);
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .mega-menu-wrapper>.sub-item:hover>.nav-link {
        color: var(--white);
        background-color: var(--c-red);
    }
    .main-nav .mega-menu-wrapper .sub-item.has-child>.nav-link::after {
        content: '';
        position: absolute;
        height: 8px;
        width: 8px;
        left: 20px;
        top: -webkit-calc(50% - 3px);
        top: calc(50% - 3px);
        -webkit-transform: rotate(-135deg);
        -ms-transform: rotate(-135deg);
        transform: rotate(-135deg);
        opacity: 0;
        border-style: solid;
        border-color: rgb(0 0 0 / 50%);
        border-width: 2px 2px 0 0;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .mega-menu-wrapper .sub-item.has-child:hover>.nav-link::after {
        opacity: 1;
    }
    .main-nav .mega-menu-wrapper .sub-item .nav-title {
        color: inherit;
        margin-bottom: 2px;
    }
    .main-nav .mega-menu-wrapper .sub--menu {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        padding: 10px 0;
        width: 480px;
        height: 264px;
        right: 220px;
        top: 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-align-content: flex-start;
        -ms-flex-line-pack: start;
        align-content: flex-start;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    .main-nav .mega-menu-wrapper .sub--menu li:first-of-type .nav-title::before {
        content: '';
        display: block;
        float: right;
        height: 5px;
        width: 5px;
        margin-top: 9px;
        margin-left: 5px;
        border-radius: var(--br-round);
        background-color: var(--c-grey-dark-2);
    }
    .main-nav .mega-menu-wrapper .sub-item.has-child:hover .sub--menu {
        visibility: visible;
        opacity: 1;
    }
    .main-nav .mega-menu-wrapper .sub--item {
        width: 170px;
        overflow: hidden;
    }
    .main-nav .mega-menu-wrapper .sub--item .nav-link {
        padding: 0 10px;
        height: 33px;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .mega-menu-wrapper .sub--item .nav-link:hover {
        text-decoration: underline;
        color: #000;
    }
    .main-nav .mega-menu-wrapper .sub--item .view-all {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .main-nav .mega-menu-wrapper .sub--item .view-all .nav-title {
        font-weight: 500;
    }
    .main-nav .mega-menu-wrapper .sub--item:first-of-type {
        -webkit-box-ordinal-group: 10000;
        -webkit-order: 9999;
        -moz-box-ordinal-group: 10000;
        -ms-flex-order: 9999;
        order: 9999;
    }
    .main-nav .main-item.mega-menu>.nav-link::before {
        content: '';
        visibility: hidden;
        opacity: 0;
        width: 35px;
        height: 11px;
        position: absolute;
        background: url(../img/bilbilak2.png) no-repeat 50% 50%;
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        bottom: -1px;
        right: -webkit-calc(50% - 18px);
        right: calc(50% - 18px);
        z-index: 170;
    }
    .main-nav .main-item.drop-down>.nav-link::before {
        content: '';
        visibility: hidden;
        opacity: 0;
        width: 35px;
        height: 11px;
        position: absolute;
        background: url(../img/bilbilak2.png) no-repeat 50% 50%;
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        bottom: -1px;
        right: -webkit-calc(50% - 18px);
        right: calc(50% - 18px);
        z-index: 170;
    }
    .main-nav .main-item:hover>.nav-link::before {
        visibility: visible;
        opacity: 1;
    }
    header.sticky {
        position: fixed;
    }
    header.sticky .header-container {
        position: relative;
    }
    header.sticky .header-container .desktop-top-bar {
        height: 74px;
    }
    header.sticky .header-container .start {
        position: initial;
    }
    header.sticky .header-container .main-nav {
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
        pointer-events: none;
    }
    header.sticky .main-nav .navbar {
        pointer-events: auto;
    }
    header.sticky .desktop-user {
        width: 46px;
        margin-right: 8px;
    }
    header.sticky .desktop-user .user-name {
        display: none;
    }
    header.sticky .desktop-user .profile-picture {
        margin-left: 0;
    }
    header.sticky .search-toggle .icon-wrapper {
        width: 46px;
        position: absolute;
        left: 124px;
        top: 14px;
        background-color: var(--c-grey-light-7);
    }
    header.sticky .search-toggle .icon-wrapper::after {
        display: none;
    }
    header.sticky .search-toggle .icon-wrapper:hover {
        background-color: var(--c-grey-light-5);
    }
    header.sticky .search-modal .overlay {
        height: 74px;
        min-height: 74px;
    }
    header.sticky .search-modal .modal-content {
        left: 0;
        right: 0;
        margin: 0 auto;
        top: 15px;
    }
    header.sticky .search-modal {
        position: initial;
    }
    .index-carousel .page-container {
        padding: 10px 0;
        border-radius: 0;
        background: var(--c-grey-light-7);
        background: -webkit-gradient(linear, left bottom, left top, from(var(--white)), to(var(--c-grey-light-7)));
        background: linear-gradient(0deg, var(--white) 0%, var(--c-grey-light-7));
    }
    .index-carousel .page-width {
        padding: 20px;
        border-radius: var(--br-6);
    }
    .index-carousel .main-carousel {
        border-radius: var(--br-4);
        overflow: hidden;
    }
    .index-carousel .slide {
        max-width: 100%;
        padding: 0;
        height: 480px;
        margin: 0 30px;
    }
    .index-carousel .slide.banner .media-container {
        overflow: hidden;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .index-carousel .slide.banner img {
        height: 480px;
        width: 1180px;
        max-width: initial;
        max-height: inherit;
    }
    .card-large.slider {
        max-width: 100%;
    }
    .card-large.slider .media-container {
        overflow: hidden;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .card-large.slider .media-container img {
        height: 480px;
        width: 1180px;
        max-width: initial;
        max-height: inherit;
    }
    .card-large.slider .wrapper {
        width: -webkit-calc(100% - 30px);
        width: calc(100% - 30px);
        left: 15px;
        bottom: 15px;
    }
    .card-large.slider .thumb {
        -webkit-transition: -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-box-shadow 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        border-radius: var(--br-3);
    }
    .card-large.slider .wrapper:hover .thumb {
        -webkit-box-shadow: 0px 6px 8px -4px;
        box-shadow: 0px 6px 8px -4px;
    }
    .card-large.slider .details {
        width: auto;
    }
    .card-large.slider .price .value {
        letter-spacing: initial;
    }
    .index-carousel .aspect-ratio {
        position: initial;
        display: block;
    }
    .index-carousel .aspect-ratio::after {
        display: none;
    }
    .index-carousel .index-cards-wrapper {
        position: initial;
        height: 480px;
    }
    .i-card {
        max-width: 100%;
        height: auto;
        border-radius: var(--br-4);
        -webkit-box-shadow: 0px 0px 0px -5px var(--c-text-1);
        box-shadow: 0px 0px 0px -5px var(--c-text-1);
        -webkit-transition: -webkit-box-shadow 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: -webkit-box-shadow 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: box-shadow 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: box-shadow 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-box-shadow 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .i-card .wrapper {
        border-radius: var(--br-4) !important;
        background-color: var(--c-grey-light-5);
        height: -webkit-calc(440px / 3);
        height: calc(440px / 3);
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 18px;
    }
    .i-card .thumb {
        width: 110px;
        height: 110px;
        border-radius: var(--br-4);
        -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: -webkit-transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), -webkit-transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .i-card .details {
        width: auto;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -moz-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        height: 100%;
        padding-top: 5px;
        width: 330px;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .i-card .details .title {
        display: block;
        font-weight: 400;
        font-size: var(--fs-4);
        margin-bottom: 0px;
    }
    .i-card .price .value {
        letter-spacing: 0;
        font-size: var(--fs-5);
    }
    .i-card .price .currency {
        font-size: var(--fs-3);
    }
    .i-card .tags {
        font-size: var(--fs-3);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        overflow: hidden;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        height: 25px;
    }
    .i-card .details .tag {
        display: block;
        background-color: var(--c-grey-light-4);
        margin-left: 10px;
        margin-bottom: 10px;
        padding: 1px 12px 3px 12px;
    }
    .i-card .oneliner {
        position: initial;
        width: -webkit-calc(100% - 440px);
        width: calc(100% - 440px);
        height: 110px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        padding: 8px 15px;
        -webkit-transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .i-card .oneliner img {}
    .i-card:hover {
        -webkit-box-shadow: 0px 4px 8px -5px var(--c-text-1);
        box-shadow: 0px 4px 8px -5px var(--c-text-1);
    }
    .i-card:hover .thumb {
        opacity: 1;
        -webkit-transform: translateX(150px);
        -ms-transform: translateX(150px);
        transform: translateX(150px);
        position: absolute;
    }
    .i-card:hover .details {
        position: absolute;
        -webkit-transform: translateX(460px);
        -ms-transform: translateX(460px);
        transform: translateX(460px);
    }
    .i-card:hover .oneliner {
        position: absolute;
        right: 50%;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
    }
    .i-card .cta {
        position: absolute;
        opacity: 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        gap: 4px;
        padding: 6px 15px 6px 5px;
        left: -160px;
        color: var(--white);
        background-color: var(--c-red);
        font-size: var(--fs-3);
        font-weight: 300;
        border-radius: 999px;
        -webkit-transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.36s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .i-card:hover .cta {
        opacity: 1;
        left: 30px;
    }
    .index-carousel .main-carousel-pagination {
        padding: 0;
        background-color: #0000;
        margin-left: 0;
    }
    .index-f-cats {
        padding: 1px 0 30px 0;
    }
    .index-f-cats .item {
        width: -webkit-calc(100% / 6);
        width: calc(100% / 6);
        margin: 0;
        border-radius: 0;
        border-color: var(--c-grey-light-4);
        border-right: none;
        height: 110px;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .index-f-cats .item:nth-child(1) {
        border-right: 1px solid var(--c-grey-light-4);
        border-radius: 0 var(--br-3) var(--br-3) 0;
    }
    .index-f-cats .item:nth-last-child(1) {
        border-radius: var(--br-3) 0 0 var(--br-3);
    }
    .index-f-cats .item:hover {
        background-color: var(--c-grey-light-8);
        z-index: 10;
    }
    .index-f-cats .title {
        color: var(--c-grey-light-2);
    }
    .index-f-cats .icon {
        display: none;
    }
    .index-f-cats .icon img {
        -webkit-transition: opacity 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: opacity 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .index-f-cats .counter {
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .index-f-cats .item:hover .counter {
        background-color: var(--c-red-3);
        color: var(--white);
    }
    .index-f-cats .item:hover .title .counter span {
        --m: var(--fs-3);
    }
    .index-f-cats .item:hover .icon img {
        opacity: 1;
    }
    .support-faq {
        background-color: var(--c-grey-light-7);
        padding-top: 20px;
        padding-bottom: 20px;
        margin-top: 80px;
    }
    .support-faq .main-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 15px 0;
    }
    .support-faq .section-title {
        display: none;
    }
    .support-faq .support {
        display: block;
        max-width: 440px;
    }
    .support-faq .profile {
        border-bottom: 1px solid var(--c-grey-light-6);
        border-left: none;
    }
    .support-faq .profile:nth-child(1) {
        border-radius: var(--br-2) var(--br-2) 0 0;
    }
    .support-faq .profile:nth-last-child(1) {
        border-radius: 0 0 var(--br-2) var(--br-2);
    }
    .support-faq .name-bio .bio {
        font-size: var(--fs-3);
    }
    .support-faq .option:hover {
        background-color: var(--c-grey-light-4);
    }
    .support-faq .option.email .value {
        font-size: var(--fs-3);
    }
    .support-faq .faq {}
    .support-faq .name-bio .name {}
    .support-faq .faq .title {
        font-weight: 600;
        color: var(--c-text-1);
        margin-bottom: 20px;
    }
    .support-faq .faq .list {
        padding-bottom: 5px;
    }
    .support-faq .faq .item {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        text-decoration: none;
        color: var(--c-text-1);
        font-weight: 300;
        margin-bottom: 20px;
    }
    .support-faq .faq .item::before {
        content: '';
        width: 24px;
        height: 24px;
        background: url('../img/icons/arrow-up-right-red.svg') no-repeat 50% 50%;
        margin-left: 5px;
    }
    .support-faq .faq .item:hover {
        text-decoration: underline;
    }
    .support-faq .faq .view-more {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 260px;
        padding: 10px 15px;
        font-size: var(--fs-3);
        font-weight: 300;
        text-decoration: none;
        color: var(--c-grey-light-4);
        background-color: var(--c-grey-dark-5);
        border-radius: var(--br-2);
    }
    .support-faq .faq .view-more .value {}
    .support-faq .faq .view-more .icon {}
    .support-faq .faq .view-more .icon img {
        opacity: 0.8;
    }
    .cards-wrapper .card.small {
        width: -webkit-calc(33% - 8px);
        width: calc(33% - 8px);
    }
    .cards-wrapper .card.small:nth-child(9) {
        display: initial;
    }
    .p-index .latest-fonts .filters .wrapper {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        overflow: hidden;
    }
    .section-title {
        padding-bottom: 25px;
    }
    .p-index .latest-fonts {
        padding: 80px 0;
        border-bottom: none;
    }
    .section-title .view-more {
        color: var(--c-grey-dark-2);
        font-weight: 500;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .section-title .icon {
        display: block;
        padding-right: 5px;
    }
    .section-title .view-more :hover {
        color: var(--c-text-1);
    }
    .p-index .designers .item {
        width: 220px;
        height: 293px;
    }
    .p-index .big-banner {
        background: -webkit-gradient(linear, left top, left bottom, from(var(--white)), to(var(--c-grey-light-7)));
        background: linear-gradient(180deg, var(--white) 0%, var(--c-grey-light-7));
    }
    .p-index .designers {
        background-color: var(--c-grey-light-7);
    }
    .p-index .licenses {
        padding-bottom: 80px;
        background-color: var(--c-grey-light-7);
    }
    .p-index .licenses .section-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        background-color: #fff;
        border-radius: var(--br-4);
        padding: 20px;
        position: relative;
    }
    .p-index .licenses .latest-licenses {
        width: 560px;
    }
    .p-index .latest-licenses .section-title {
        display: block;
        padding-bottom: 15px;
    }
    .p-index .latest-licenses .section-title .sub-title {
        font-size: var(--fs-3);
        color: var(--c-grey);
        font-weight: 500;
    }
    .p-index .licenses .summary-licenses {
        width: 380px;
        margin: 0;
    }
    .p-index .license {
        margin: 0;
        padding: 15px 0;
        background-color: #0000;
        border-radius: 0;
        border-bottom: 1px solid var(--c-grey-light-6);
    }
    .p-index .license:nth-last-child(1) {
        border-bottom: none;
    }
    .p-index .license .thumb {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        width: initial;
        height: initial;
    }
    .p-index .license .thumb img {
        max-width: 100%;
        max-height: 100%;
    }
    .p-index .license .font-icon {
        width: 48px;
        height: 48px;
        padding: 10px;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-radius: var(--br-round);
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }
    .p-index .license .license-icon {
        width: 50px;
        height: 50px;
        padding: 8px;
        margin-right: -20px;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px solid var(--c-grey-light-5);
        border-radius: var(--br-round);
        background-color: rgb(255 255 255 / 80%);
        --webkit-backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        -webkit-transition: all 0.26s ease-in-out;
        transition: all 0.26s ease-in-out;
    }
    .p-index .license:hover .thumb .license-icon {
        background-color: #fff;
        border: 1px solid var(--c-grey-light-7);
    }
    .p-index .license .details {
        width: -webkit-calc(100% - 76px);
        width: calc(100% - 76px);
    }
    .p-index .license .details .top {
        font-size: var(--fs-3);
        height: 20px;
    }
    .p-index .licenses .item {
        display: block;
        padding: 0;
    }
    .p-index .licenses .license-badge {
        width: 164px;
        height: 164px;
        margin: 20px auto;
    }
    .p-index .licenses .license-details {
        padding: 15px 0 0 0;
        width: 100%;
    }
    .p-index .licenses .bottom {
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
    .p-index .licenses .licenses-pagination {
        bottom: 15px;
        width: 200px;
        background-color: #f2f2f7;
    }
    /* .index-carousel .index-slide-3 .page-container {
  background: url(../images/large-banner.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.index-carousel .index-slide-3 .page-container::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(0deg, var(--white) 50%, #0000 140%);
} */
    .footer .main {
        padding-bottom: 100px;
    }
    .footer .main .box {
        background-color: var(--white);
        position: relative;
        border-radius: var(--br-5);
        z-index: 2;
        border-bottom: 1px solid #343434;
        padding-top: 0;
    }
    .footer .main .contact {
        max-width: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        background-color: transparent;
        border-radius: 0;
        padding: 20px;
    }
    .footer .main .contact-info {
        width: 420px;
        background-color: var(--c-grey-light-7);
    }
    .footer .main .contact .start {
        text-align: right;
        padding: 15px 20px 15px 0;
    }
    .footer .main .contact .start::before {
        margin: auto;
        left: auto;
        right: 0;
        width: 6px;
        height: 50px;
        top: 22px;
        background-color: #1b1b1d;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    .footer .main .contact .start .title {
        color: var(--c-grey-dark-6);
        font-size: var(--fs-5);
    }
    .footer .main .contact .start .sub-title {
        color: var(--c-grey);
    }
    .footer .main .contact-info .item {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .footer .main .contact-info .title {
        color: var(--c-grey-dark-2);
        font-size: var(--fs-3);
        width: 100%;
    }
    .footer .main .contact-info .phone-number {
        font-size: var(--fs-5);
        color: var(--c-grey-dark-4);
        letter-spacing: 1.2px;
        font-weight: 500;
    }
    .footer .main .contact-info .phone-number span {
        /*
  margin-right: 3px;
  font-weight: 900; */
        color: var(--c-red);
    }
    .footer .main .contact-info .email {
        font-size: var(--fs-5);
        color: var(--c-grey-dark-4);
        font-weight: 500;
    }
    .footer .main .contact-info .email span {
        /* color: var(--c-red);
  font-weight: 900;
  margin: 0 3px; */
        color: var(--c-red);
    }
    .footer .main .contact-info .item.phone::after {
        background-color: #32323a;
    }
    .footer .main .content {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        padding: 50px 0 20px 0;
        margin: 0;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .footer .main .about {
        padding: 25px;
        width: 400px;
    }
    .footer .main .nav {
        display: block;
        padding: 25px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .footer .main .footer-badges {
        display: block;
        padding: 25px;
    }
    .footer .main .about .logo {
        margin-right: 0;
    }
    .footer .main .about p {
        text-align: right;
        padding: 0;
        color: var(--c-grey-dark-2);
        font-weight: 300;
    }
    .footer .main .about .social-links {
        margin: 0;
        padding-top: 50px;
        background-color: transparent;
        padding-right: 0;
    }
    .footer .main .nav .col {}
    .footer .main .nav .col:nth-child(1) {
        padding-left: 60px;
    }
    .footer .main .nav .title {
        color: var(--c-text-1);
        font-size: var(--fs-3);
        padding-bottom: 20px;
        font-weight: 500;
    }
    .footer .main .nav .list {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .footer .main .nav .list li {
        margin-bottom: 15px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .footer .main .nav .list a {
        text-decoration: none;
        color: var(--c-grey-dark-2);
        font-size: var(--fs-3);
        font-weight: 300;
        display: block;
    }
    .footer .main .nav .list li::before {
        content: '';
        width: 5px;
        height: 5px;
        background-color: var(--c-grey-light-5);
        display: block;
        border-radius: 999px;
        margin-left: 8px;
        margin-top: 2px;
    }
    .footer .main .nav .list li:hover::before {
        background-color: var(--c-red-3);
    }
    .footer .main .nav .list li:hover a {
        color: var(--c-grey-dark-6);
    }
    .footer .main .footer-badges .wrapper {
        width: 180px;
        height: 220px;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-4);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .footer .main .footer-badges .wrapper img {
        width: 128px;
        opacity: 0.7;
    }
    .footer .main .footer-badges .wrapper:hover img {
        opacity: 1;
    }
    .footer .main::before {
        height: 500px;
        opacity: 1;
    }
    .footer .main::after {
        background-image: url(../img/pattern-2.svg);
        background-position: top;
        background-repeat: repeat-x;
        background-size: auto;
        height: 460px;
        opacity: 0.2;
    }
    .fp-header .meta .wrapper {
        margin-top: -30px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .fp-header .meta .icon-container {}
    .fp-header .meta .details {
        width: -webkit-calc(100% - 140px);
        width: calc(100% - 140px);
        padding-top: 30px;
        padding-right: 20px;
    }
    .fp-header .f-title {
        text-align: right;
    }
    .fp-header .specs {
        padding: 0;
        padding-top: 13px;
        -webkit-box-pack: right;
        -webkit-justify-content: right;
        -moz-box-pack: right;
        -ms-flex-pack: right;
        justify-content: right;
        overflow: hidden;
    }
    .fp-header .spec {
        border: none;
        padding: 0;
        margin-left: 30px;
    }
    .fp-header .spec .icon {
        margin-left: 10px;
        padding: 4px;
        background-color: var(--c-grey-light-6);
        border-radius: 8px;
    }
    .fp-header .spec .icon img {
        width: 18px;
    }
    .fp-header .short-desc {
        width: 100%;
        padding: 50px 0;
    }
    .fp-header .short-desc p {
        margin: 0;
    }
    .purchase-options {
        background-color: transparent;
    }
    .purchase-options .main-wrapper {
        background-color: var(--c-grey-light-7);
        padding: 15px;
        border-radius: var(--br-4);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .purchase-options .box {
        position: relative;
        padding: 10px;
        background-color: #fff;
        width: -webkit-calc(100% - 480px);
        width: calc(100% - 480px);
        border-radius: var(--br-3);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        min-height: 520px;
    }
    .purchase-options .bundles {
        padding: 0;
        /* width: 100%; */
    }
    .purchase-options .licenses {
        /* width: 100%; */
    }
    .purchase-options .total-sc {
        /* width: 100%; */
    }
    .purchase-options .bundles .bundle-option {
        margin-bottom: 15px;
        border-radius: 0;
        border: none;
    }
    .purchase-options .bundles .option-wrapper {
        height: 80px;
        width: 100%;
        padding: 10px;
        border-radius: var(--br-2);
        background-color: var(--c-grey-light-6);
        -webkit-transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .purchase-options .bundles .option-wrapper:hover {
        background-color: var(--c-grey-light-4);
    }
    .purchase-options .bundles input:checked~label {
        background-color: var(--c-text-1) !important;
        -webkit-box-shadow: 0px 4px 8px -4px var(--c-text-1);
        box-shadow: 0px 4px 8px -4px var(--c-text-1);
    }
    .purchase-options .bundles input:checked~label::after {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid var(--c-text-1);
        left: -8px;
    }
    .purchase-options .bundles .preview-toggle {
        display: none;
    }
    .purchase-options .bundles .info {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .purchase-options .bundles .name {
        font-size: var(--fs-5);
        font-weight: 600;
        color: var(--c-text-1);
    }
    .purchase-options .bundles .extra {
        display: inline-block;
        float: left;
        margin-top: 2px;
        margin-right: 5px;
    }
    .purchase-options .bundles .price {
        font-size: var(--fs-5);
    }
    .purchase-options .bundles .checkbox {
        background-color: var(--c-grey-light-8);
        border: 1px solid var(--c-grey-light-3);
    }
    .purchase-options .desktop-preview {
        width: 480px;
        padding-right: 25px;
    }
    .purchase-options .desktop-preview .wrapper {
        display: none;
    }
    .purchase-options .desktop-preview .wrapper img {}
    .purchase-options .bundle-1 .desktop-preview .wrapper:nth-child(1),
    .purchase-options .bundle-2 .desktop-preview .wrapper:nth-child(2),
    .purchase-options .bundle-3 .desktop-preview .wrapper:nth-child(3),
    .purchase-options .bundle-4 .desktop-preview .wrapper:nth-child(4),
    .purchase-options .bundle-5 .desktop-preview .wrapper:nth-child(5),
    .purchase-options .bundle-6 .desktop-preview .wrapper:nth-child(6),
    .purchase-options .bundle-7 .desktop-preview .wrapper:nth-child(7),
    .purchase-options .bundle-8 .desktop-preview .wrapper:nth-child(8),
    .purchase-options .bundle-9 .desktop-preview .wrapper:nth-child(9),
    .purchase-options .bundle-10 .desktop-preview .wrapper:nth-child(10) {
        display: block;
    }
    .purchase-options {
        margin: 0;
        margin-bottom: 50px;
    }
    .purchase-options .licenses {
        margin: 0;
        margin-top: 20px;
        padding: 20px 0;
        border-color: var(--c-grey-light-6);
    }
    .purchase-options .licenses .license-title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .purchase-options .licenses .selected-license {}
    .purchase-options .licenses .owner-info {
        display: block;
        width: 210px;
        overflow: hidden;
        padding-right: 7px;
        margin-right: 7px;
        border-right: 1px solid var(--c-grey-light-5);
        font-size: var(--fs-2);
    }
    .purchase-options .licenses .owner-info>div {}
    .purchase-options .licenses .owner-info .title {
        font-weight: 500;
    }
    .purchase-options .licenses .owner-info .value {
        font-weight: 300;
    }
    .purchase-options .licenses .wrapper {
        background-color: transparent;
        padding: 0;
    }
    .purchase-options .total-sc {
        padding-bottom: 5px;
    }
    .purchase-options .main-container {
        position: relative;
    }
    .select-license-modal .l-modal-overlay {
        position: absolute;
        height: 100%;
        min-height: initial;
        max-height: 100%;
        border-radius: var(--br-4);
        z-index: 10;
        padding: 20px;
    }
    .select-license-modal .l-content {
        width: 900px;
        height: 520px;
        max-height: 100%;
        max-width: 100%;
        overflow: visible;
    }
    .select-license-modal .content-wrapper>.header .title {
        display: none;
    }
    .select-license-modal .content-wrapper>.header {
        position: absolute;
        top: -10px;
        left: -10px;
    }
    .select-license-modal .content-wrapper>.header .close-bt {
        padding: 5px;
        background-color: #fff;
        cursor: pointer;
        border-radius: var(--br-3);
    }
    .select-license-modal .form-wrapper {
        width: 480px;
    }
    .select-license-modal .options {
        max-height: initial;
        overflow: hidden;
        padding: 15px;
    }
    .select-license-modal .license-option-wrapper {
        position: unset;
        margin-bottom: 5px;
    }
    .select-license-modal .license-option-wrapper:nth-last-child(1) {
        margin-bottom: 0;
    }
    .select-license-modal .op-label .option {
        padding: 10px;
        background-color: transparent;
        border: none;
        border-radius: var(--br-1);
    }
    .select-license-modal .license-option-wrapper .licence-desc-toggle {
        display: none;
    }
    .select-license-modal .op-label .badge {
        display: block;
        width: 24px;
        height: 24px;
        margin-left: 10px;
    }
    .select-license-modal .op-label .option .flex-start {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .select-license-modal .license-owner {
        padding: 15px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        overflow: hidden;
    }
    .select-license-modal .license-owner .form-control-x {
        width: -webkit-calc(50% - 7px);
        width: calc(50% - 7px);
    }
    .select-license-modal .license-owner label {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
    .select-license-modal .license-owner label .sub {
        margin-right: 5px;
    }
    .select-license-modal .license-option-wrapper input:checked~.op-label .option::after {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid var(--c-text-1);
        left: -8px;
    }
    .select-license-modal .op-label .option:hover {
        background-color: var(--c-grey-light-6);
    }
    .select-license-modal .license-desc {
        font-size: var(--fs-3);
    }
    .select-license-modal .license-desc .content {
        padding: 15px;
    }
    .select-license-modal .license-head {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        padding: 10px 15px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-bottom: 1px solid var(--c-grey-light-4);
    }
    .select-license-modal .license-head .badge {
        height: 36px;
        width: 36px;
        background-color: #fff;
        border-radius: var(--br-round);
        padding: 4px;
        margin-left: 5px;
    }
    .select-license-modal .license-head .title {
        font-size: var(--fs-4);
        font-weight: 600;
    }
    .select-license-modal .license-desc .list li {}
    .select-license-modal .l-content .content-wrapper .license-option-wrapper .license-desc {
        display: none;
        position: absolute;
        top: 15px;
        left: 15px;
        width: 400px;
        /* height: calc(100% - 30px); */
        border-radius: var(--br-2);
        background-color: var(--c-grey-light-7);
        -webkit-box-shadow: none;
        box-shadow: none;
        color: var(--c-text-1);
    }
    .select-license-modal .l-content .content-wrapper.license-0 .license-option-wrapper:nth-child(1) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-1 .license-option-wrapper:nth-child(2) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-2 .license-option-wrapper:nth-child(3) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-3 .license-option-wrapper:nth-child(4) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-4 .license-option-wrapper:nth-child(5) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-5 .license-option-wrapper:nth-child(6) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-6 .license-option-wrapper:nth-child(7) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-7 .license-option-wrapper:nth-child(8) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-8 .license-option-wrapper:nth-child(9) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-9 .license-option-wrapper:nth-child(10) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-10 .license-option-wrapper:nth-child(11) .license-desc,
    .select-license-modal .l-content .content-wrapper.license-11 .license-option-wrapper:nth-child(12) .license-desc {
        display: block;
        max-height: initial;
    }
    .select-license-modal .license-option-wrapper input:checked~.op-label~.licence-desc-toggle~.license-desc {
        background-color: var(--c-grey-light-7);
        color: var(--c-text-1);
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    .select-license-modal .license-desc .list li.active::before {
        background-size: 15px 15px;
        margin-top: 2px;
    }
    .select-license-modal .license-desc .list li.inactive::before {
        background-size: 15px 15px;
        margin-top: 2px;
    }
    .select-license-modal .license-owner.add-padding {
        padding-bottom: 15px;
    }
    .select-license-modal .op-label .old-price {
        display: block;
        text-decoration: line-through;
        color: var(--c-red-3);
        margin-left: 10px;
        font-size: var(--fs-3);
    }
    .purchase-options .registered-license .license-info {
        background-color: var(--c-grey-light-6);
    }
    .purchase-options .registered-license .info {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .purchase-options .registered-license .owner-info {
        border-right: 1px solid var(--c-grey-light-4);
    }
    .purchase-options .registered-license .badge {
        width: 38px;
        height: 38px;
        padding: 5px;
    }
    .purchase-options .bundles .bundle-already-purchased {
        border: none;
    }
    .purchase-options .bundles .bundle-already-purchased .option-wrapper {
        background-color: var(--c-grey-light-6);
        cursor: no-drop;
    }
    .purchase-options .bundles .bundle-already-purchased .option-wrapper:hover {}
    .purchase-options .bundles .bundle-already-purchased .info .details {
        opacity: 0.5;
    }
    .purchase-options .bundles .bundle-already-purchased .info .price {
        opacity: 0.5;
    }
    .font-lab-sc .controls {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .font-lab-sc .controls .fl-textfield {
        outline: none;
    }
    .font-lab-sc .controls .character-counter {
        left: 175px;
        top: 18px;
    }
    .font-lab-sc .controls .fl-submit {
        width: 160px;
    }
    .font-lab-sc .fl-results .result {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        -webkit-flex-basis: 33.3%;
        -ms-flex-preferred-size: 33.3%;
        flex-basis: 33.3%;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        padding: 25px 0 15px 0;
    }
    .font-lab-sc .fl-results .result .media-container {
        margin-bottom: 10px;
    }
    .font-lab-sc .fl-results .result {
        border-left: 1px solid var(--c-grey-light-5);
    }
    .font-lab-sc .fl-results .result:nth-child(3),
    .font-lab-sc .fl-results .result:nth-child(6),
    .font-lab-sc .fl-results .result:nth-child(9),
    .font-lab-sc .fl-results .result:nth-child(12),
    .font-lab-sc .fl-results .result:nth-child(16),
    .font-lab-sc .fl-results .result:nth-child(19) {
        border-left: none;
    }
    .font-lab-sc .fl-results .result:nth-last-child(1) {
        border-left: none;
    }
    .font-lab-sc .font-lab-link {
        display: block;
        padding: 30px 0;
    }
    .font-lab-sc .font-lab-link a {
        text-decoration: none;
        /* width: 620px; */
        padding: 15px;
        margin: 0 auto;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-2);
    }
    .font-lab-sc .font-lab-link .title {
        font-size: var(--fs-3);
        color: var(--c-grey-dark-2);
    }
    .font-lab-sc .font-lab-link .btDefult {
        background-color: var(--white);
        border: 1px solid var(--c-grey-light-4);
        -webkit-box-shadow: 0px 2px 4px -2px var(--c-grey-light-3);
        box-shadow: 0px 2px 4px -2px var(--c-grey-light-3);
        color: var(--c-text-1);
        padding: 0 20px;
        font-weight: 300;
        font-size: var(--fs-3);
    }
    .font-lab-sc {}
    .font-lab-sc .main-wrapper {
        padding: 80px 0 30px 0;
    }
    .main-font-desc {
        padding: 60px 0;
        border-top: 1px solid var(--c-grey-light-5);
    }
    .main-font-desc .section.gallery .item .caption {
        font-size: var(--fs-4);
        -webkit-backdrop-filter: saturate(190%) blur(3px);
        backdrop-filter: saturate(190%) blur(3px);
    }
    .main-font-desc .section.gallery {
        padding: 50px 0;
    }
    .main-font-desc .section.gallery .swiper-buttons {
        width: 48px;
        height: 48px;
        -webkit-backdrop-filter: saturate(190%) blur(2px);
        backdrop-filter: saturate(190%) blur(2px);
        background-color: rgb(255 255 255 / 50%);
        opacity: 0;
        -webkit-transition: opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .swiper-button-prev:after,
    .swiper-rtl .swiper-button-next:after {
        color: var(--c-grey-dark-5);
        opacity: 1;
    }
    .main-font-desc .section.gallery .photos-carusel:hover .swiper-buttons {
        opacity: 1;
    }
    .font-p-designers .designer {
        margin-right: 0;
    }
    .comments-faq-sc .pagination-container ul {
        margin-left: 0;
    }
    .pagination-container .item {
        margin: 0 5px;
    }
    .pagination-container .item:nth-last-child(1) {
        margin-left: 0;
    }
    .comments-faq-sc .page-width {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .comments-faq-sc .comments-sc {
        width: -webkit-calc(100% - 320px);
        width: calc(100% - 320px);
    }
    .comments-faq-sc .faq-sc {
        width: 300px;
    }
    .comments-faq-sc .faq-sc .sc-title {
        margin-bottom: 15px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .comments-faq-sc .faq-sc .sc-title .title {
        font-weight: 600;
    }
    .comments-faq-sc .faq-sc .faq-wrapper {
        padding: 15px;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-3);
    }
    .comments-faq-sc .faq-sc .list {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .comments-faq-sc .faq-sc .item {
        font-size: var(--fs-3);
        margin-bottom: 20px;
        font-weight: 300;
        position: relative;
    }
    .comments-faq-sc .faq-sc .item::before {
        content: '';
        height: 6px;
        width: 12px;
        border-radius: var(--br-round);
        background-color: var(--c-grey-light-4);
        display: inline-block;
        margin-top: 2px;
        margin-left: 2px;
    }
    .comments-faq-sc .faq-sc .item a {
        text-decoration: none;
        color: var(--c-grey-dark-2);
    }
    .comments-faq-sc .faq-sc .item:hover a {
        color: var(--c-red-3);
    }
    .comments-faq-sc .faq-sc .item:hover::before {}
    .comments-faq-sc .comment-conatiner {
        padding: 15px;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-3);
        margin-bottom: 30px;
    }
    .comments-faq-sc .comment {
        padding-bottom: 35px;
    }
    .comments-faq-sc .comment .profile {
        padding-bottom: 10px;
    }
    .comments-faq-sc .comment .avatar {
        width: 64px;
        height: 64px;
    }
    .comments-faq-sc .comment .profile .role {
        width: 64px;
        padding: 3px 0;
    }
    .comments-faq-sc .comment .reply-bt {
        height: 34px;
        width: 88px;
        border-radius: var(--br-round);
        cursor: pointer;
        /* background-color: var(--c-grey-light-5); */
    }
    .comments-faq-sc .comment .name {
        display: inline-block;
        margin: 0 0 0 5px;
        font-size: var(--fs-4);
    }
    .comments-faq-sc .comment .reply-to {
        display: inline-block;
        margin-bottom: 4px;
        color: var(--c-blue-2);
        font-weight: 300;
    }
    .comments-faq-sc .comment .text-wrapper {
        font-size: var(--fs-4);
        font-weight: 300;
    }
    .comments-faq-sc .comment .media {
        background-color: var(--c-grey-light-5);
        border-radius: var(--br-2);
        padding: 10px;
        -webkit-box-shadow: inset 0px 1px 0px rgb(209 209 214 / 30%), inset 0px -1px 0px #fff;
        box-shadow: inset 0px 1px 0px rgb(209 209 214 / 30%), inset 0px -1px 0px #fff;
    }
    .comments-faq-sc .comment .c-body {
        padding-right: 75px;
    }
    .comments-faq-sc .comment.type-reply {
        padding: 0;
        padding-right: 75px;
        background-color: transparent;
    }
    .comments-faq-sc .comment.type-reply>.wrapper {
        background-color: #fff;
        padding: 15px;
        border-radius: var(--br-2);
    }
    .comments-faq-sc .comment-conatiner .comment:nth-last-child(1) {
        padding-bottom: 10px;
    }
    .comments-faq-sc .comment .reply-bt:hover {
        background-color: var(--c-text-1) !important;
        color: white !important;
    }
    .comments-faq-sc .comment.type-reply .media {
        background-color: var(--c-grey-light-7);
    }
    .comments-faq-sc .new-comment .avatar {
        width: 64px;
        height: 64px;
    }
    .comments-faq-sc .new-comment textarea {
        padding: 20px;
        line-height: 1.6;
    }
    .comments-faq-sc .new-comment .send-comment-bt button {
        width: 200px;
    }
    .comments-faq-sc .new-comment .file-attachment button {
        /* color: var(--c-text-1); */
        background-color: var(--c-grey-dark-2);
    }
    .comments-faq-sc .new-comment textarea::before {}
    .blog-index-header .hero {
        padding: 100px 0;
    }
    .blog-index-header .b-main-title .title {
        font-size: var(--fs-extra);
    }
    .blog-index-header .page-container::before {
        background-repeat: repeat-x;
        background-size: auto;
        height: 500px;
        background-image: url(../img/pattern-4.svg);
    }
    .blog-index-header .b-main-title .sub {
        font-size: var(--fs-5);
        color: var(--c-grey);
    }
    .blog-index-header .b-featured-posts {
        padding: 15px;
    }
    .blog-index-header .b-featured-posts .full-width {
        margin: 0;
    }
    .blog-index-header .b-featured-posts .post {
        margin: 0;
        margin-left: 15px;
        width: 278px;
    }
    .blog-index-header .b-featured-posts .post:nth-last-child(1) {
        margin: 0;
    }
    .blog-index-content .cats-list .category {
        margin-left: 15px;
    }
    .posts-stream .list-view {
        gap: 30px;
    }
    .posts-stream .card-post {
        width: -webkit-calc(25% - 22.5px);
        width: calc(25% - 22.5px);
        margin-bottom: 30px;
    }
    .posts-stream .card-post .headline {
        max-height: 45px;
    }
    .posts-stream .card-post .title-cap:hover .headline {
        text-decoration: underline;
    }
    .posts-stream .card-post .top {
        font-size: var(--fs-2-5);
    }
    .posts-stream .card-post .date {
        color: var(--c-grey);
    }
    .posts-stream .card-post .dek {
        color: var(--c-grey);
    }
    .blog-latest .post-cover {
        width: 100%;
        overflow: hidden;
    }
    .blog-post-content {
        padding: 0;
    }
    .blog-post-content .main-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .blog-post-content .entry-content-wrap {
        padding: 20px 0 0 15px;
        width: -webkit-calc(100% - 340px);
        width: calc(100% - 340px);
    }
    .blog-post-content .related-posts {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: 340px;
        margin: 0;
        padding: 20px 15px 15px 0;
        border-top: none;
        border-right: 1px solid var(--c-grey-light-5);
    }
    .blog-post-content .related-posts .post-card {
        width: 100%;
        margin-bottom: 30px;
    }
    /* .blog-post-content .related-posts .post-stream */
    .blog-post-content .related-posts .related-posts-sticky {
        display: block;
        position: -webkit-sticky;
        /* Safari & IE */
        position: sticky;
        top: 100px;
    }
    .blog-post-content .related-posts .thumb {
        width: 100px;
        height: 75px;
    }
    .blog-post-content .related-posts .hedline {
        color: var(--c-grey-dark-2);
        max-height: 50px;
        overflow: hidden;
    }
    .blog-post-content .related-posts .date {
        color: var(--c-grey);
    }
    .blog-post-content .posts-seo-tags {
        padding: 100px 0 30px 0;
        font-size: var(--fs-3);
    }
    .blog-post-content .related-posts .sc-title {
        color: var(--c-grey);
    }
    .blog-post-header .headline {
        font-size: var(--fs-7);
        font-weight: 700;
        margin: 20px 0;
    }
    .blog-post-header .head {
        padding-bottom: 40px;
    }
    .blog-post-header .meta .item {
        border: none;
        padding: 0;
        margin-left: 30px;
    }
    .blog-post-header .meta .icon {
        width: 24px;
        height: 24px;
        margin-left: 5px;
        background-color: var(--c-grey-light-7);
        padding: 4px;
        border-radius: var(--br-1);
    }
    .blog-post-header .meta .value {
        font-size: var(--fs-3);
    }
    .blog-post-header .meta .value:hover {
        color: var(--c-red-3);
    }
    .faq-top .sc-title {
        padding-bottom: 40px;
    }
    .faq-top .main-title {
        font-size: var(--fs-7);
        margin-bottom: 15px;
    }
    .faq-top .sub-title {
        font-size: var(--fs-4);
        max-width: 100%;
    }
    .faq-cats {
        padding-top: 80px;
    }
    .faq-cats .list {
        border: none;
        gap: 30px;
    }
    .faq-cats .item {
        width: -webkit-calc(25% - 23px);
        width: calc(25% - 23px);
        padding: 30px 15px;
        border: 1px solid var(--c-grey-light-4) !important;
        border-radius: var(--br-2);
        -webkit-transition: border-color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: border-color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .faq-cats .item:hover {
        border: 1px solid var(--c-red-3) !important;
    }
    .faq-cats .item .title {
        font-size: var(--fs-4);
    }
    .faq-content {
        padding: 80px 0;
    }
    .faq-content .questions-wrapper .sc-title .title {
        font-size: var(--fs-5);
    }
    .faq-content .question-toggle {
        padding: 15px;
    }
    .faq-content .question-toggle .question {
        font-size: var(--fs-4);
        font-weight: 400;
    }
    .faq-content .answer {
        font-size: var(--fs-4);
        font-weight: 300;
    }
    .faq-content .answer .wrapper {
        color: var(--c-text-1);
    }
    .p-license-check .licenses-list {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 30px;
    }
    .p-license-check .license {
        width: -webkit-calc(50% - 15px);
        width: calc(50% - 15px);
        -webkit-transition: background-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: background-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .p-license-check .license:hover {
        background-color: var(--c-grey-light-6);
    }
    .p-license-check .license .license-icon {
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .p-license-check .license:hover .license-icon {
        background-color: rgb(255 255 255 / 100%);
        border: 1px solid var(--white);
    }
    .p-license-check-search .license {
        width: 620px;
    }
    .font-card {
        width: 100%;
        margin-bottom: 35px;
    }
    .font-card .font-wrapper {
        padding: 25px;
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        overflow: hidden;
        height: 150px;
    }
    .font-card .font-wrapper:hover {
        background-color: var(--c-grey-dark-5);
        -webkit-box-shadow: 0px 4px 8px -5px var(--c-text-1);
        box-shadow: 0px 4px 8px -5px var(--c-text-1);
    }
    .font-card .thumb {
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -moz-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        width: 100px;
        height: 100px;
        padding: 15px;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .details {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -moz-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        width: 300px;
        padding: 2px 15px 2px 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .font-title {
        display: block;
    }
    .font-card .font-title .title {
        font-weight: 400;
        font-size: var(--fs-5);
        margin: 0;
    }
    .font-card .price {
        margin: 0;
    }
    .font-card .price .value {}
    .font-card .oneliner {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -moz-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        width: -webkit-calc(100% - 400px);
        width: calc(100% - 400px);
        padding: 5px 10px;
        margin: 0;
        border: none;
        height: 100px;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .oneliner img {
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .tag {
        margin-left: 10px;
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .tag:hover {
        background-color: var(--c-red-3);
        color: var(--white);
    }
    .font-card .font-wrapper:hover .thumb {
        -webkit-transform: translateX(126px);
        -ms-transform: translateX(126px);
        transform: translateX(126px);
        position: absolute;
    }
    .font-card .font-wrapper:hover .details {
        position: absolute;
        -webkit-transform: translateX(426px);
        -ms-transform: translateX(426px);
        transform: translateX(426px);
    }
    .font-card .font-wrapper:hover .oneliner {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        position: absolute;
        right: 50%;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
    }
    .font-card .font-wrapper:hover .oneliner img {
        -webkit-filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(319deg) brightness(102%) contrast(101%);
        filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(319deg) brightness(102%) contrast(101%);
        opacity: 0.9;
    }
    .font-card .cta {
        opacity: 0;
        left: -200px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        position: absolute;
        top: 55px;
        padding: 8px 15px 10px 5px;
        border-radius: var(--br-round);
        margin: auto;
        -webkit-transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .cta .title {
        color: var(--c-grey);
        font-weight: 300;
        padding-left: 10px;
        -webkit-transition: color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .cta:hover {
        background-color: var(--c-red);
    }
    .font-card .cta:hover .title {
        color: var(--white);
    }
    .font-card .font-wrapper:hover .cta {
        opacity: 1;
        left: 30px;
    }
    .font-card .purchased {
        width: 90px;
        top: 92px;
        left: auto;
        right: 30px;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .font-card .font-wrapper:hover .purchased {
        -webkit-transform: translateX(125px);
        -ms-transform: translateX(125px);
        transform: translateX(125px);
    }
    .fonts-list .filters-wrapper {
        display: block;
    }
    .fonts-list .modal__overlay {
        position: initial;
        background: none;
        display: initial;
        -webkit-animation: none !important;
        animation: none !important;
        -webkit-transition: none;
        transition: none;
    }
    .fonts-list .modal__container {
        width: 100%;
        max-width: 100%;
        max-height: 100%;
        padding: 20px 0 20px 0;
        -webkit-animation: none !important;
        animation: none !important;
        background-color: transparent;
        border-radius: 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .fonts-list .contnet-filters .close-modal-bt {
        display: none;
    }
    .fonts-list .contnet-filters .category {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .fonts-list .contnet-filters .category .input-wrapper:nth-child(1) {
        margin-left: 20px;
    }
    .fonts-list .contnet-filters .input-wrapper {
        margin-bottom: 0;
        display: initial;
    }
    .fonts-list .contnet-filters label {
        width: auto;
        font-size: var(--fs-3);
        color: var(--c-grey-dark-2);
    }
    .fonts-list .contnet-filters select {
        width: 168px;
        height: 48px;
        line-height: 48px;
        padding: 0 15px;
    }
    .fonts-list .contnet-filters .input-wrapper::after {
        left: 15px;
        top: 45px;
    }
    .designers-list {
        padding: 30px 0;
    }
    .designers-list .designers {
        gap: 30px;
    }
    .designers-list .designer {
        width: -webkit-calc(25% - 23px);
        width: calc(25% - 23px);
        margin-bottom: 20px;
    }
    .designers-list .designer .details {
        padding: 0 15px 20px 15px;
    }
    .designers-list .designer .designer-name {
        font-size: var(--fs-6);
    }
    .designers-list .designer .divider {
        display: block;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .designers-list .designer .font-icon {
        width: 42px;
        height: 42px;
        padding: 10px;
    }
    .designers-list .designer:hover .picture-wrapper img {
        -webkit-filter: grayscale(0%);
        filter: grayscale(0%);
    }
    .designers-list .designer:hover .overlay {
        opacity: 0;
    }
    .designers-list .designer:hover .second-overlay {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, hsl(240 3% 11% / 0%)), color-stop(90%, hsl(240 3% 11% / 80%)));
        background: linear-gradient(180deg, hsl(240 3% 11% / 0%) 50%, hsl(240 3% 11% / 80%) 90%);
    }
    .designers-list .designer:hover .font-counter {
        opacity: 1;
    }
    .designers-list .designer:hover .divider {
        margin: 18px auto;
        opacity: 0.5;
    }
    .designer-info .top {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .designer-info .profile-photo {
        margin: 0;
        margin-top: -60px;
    }
    .designer-info .about {
        padding: 20px 0 80px 0;
    }
    .designer-info .other {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding-right: 15px;
        width: -webkit-calc(100% - 148px);
        width: calc(100% - 148px);
    }
    .designer-info .about p {
        text-align: right;
        font-size: var(--fs-4);
        margin: 0;
    }
    .content-box .box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
    .p-login .content-box .box {
        max-width: 930px;
        border: 1px solid var(--c-grey-light-5);
    }
    .content-box .box .main {
        padding: 25px 50px;
        width: 420px;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }
    .content-box .box .right {
        display: block;
        width: -webkit-calc(100% - 420px);
        width: calc(100% - 420px);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .door-illu {
        position: relative;
        width: 500px;
        height: 360px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .door-illu .bot-layer {
        position: absolute;
        margin: auto;
    }
    .door-illu .top-layer {
        position: absolute;
        margin: auto;
    }
    .door-illu .glow {
        position: absolute;
        margin: auto;
        width: 100px;
        height: 360px;
        left: 170px;
    }
    .door-illu .glow:after {
        /* display: none; */
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        right: 0;
        z-index: -1;
        height: 100%;
        width: 100%;
        margin: 0 auto;
        -webkit-transform: scale(0.75);
        -ms-transform: scale(0.75);
        transform: scale(0.75);
        -webkit-filter: blur(40px);
        filter: blur(40px);
        background: -webkit-gradient(linear, right top, left top, from(#fa4248), to(#ffffff));
        background: linear-gradient(270deg, #fa4248, #ffffff);
        background-size: 300% 300%;
        -webkit-animation: animateGlow 5s ease infinite;
        animation: animateGlow 5s ease infinite;
    }
    @-webkit-keyframes animateGlow {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }
    @keyframes animateGlow {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }
    .door-illu .glow-b {
        position: absolute;
        margin: auto;
        width: 100px;
        height: 360px;
        left: 170px;
        top: 0px;
    }
    .door-illu .glow-b:after {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        right: 0;
        z-index: -1;
        height: 100%;
        width: 100%;
        margin: 0 auto;
        border-radius: 0 50px 50px 0;
        -webkit-transform: scale(0.75);
        -ms-transform: scale(0.75);
        transform: scale(0.75);
        -webkit-filter: blur(10px);
        filter: blur(10px);
        background: -webkit-gradient(linear, right top, left top, from(#fa4248d3), to(#fff));
        background: linear-gradient(270deg, #fa4248d3, #fff);
        background-size: 300% 300%;
        -webkit-animation: animateGlow 5s ease infinite;
        animation: animateGlow 5s ease infinite;
    }
    .cart-sc.cart-empty .main-wrapper {
        padding-top: 80px;
    }
    .cart-sc .main-wrapper .empty-illu {
        width: 230px;
    }
    .cart-sc.cart-empty.error-page .main-wrapper .empty-illu {
        width: 320px;
    }
    .cart-sc .main-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .cart-sc .main-wrapper .right-sc {
        width: -webkit-calc(100% - 370px);
        width: calc(100% - 370px);
    }
    .cart-sc .main-wrapper .left-sc {
        margin-top: 0;
        width: 340px;
    }
    .cart-sc .main-wrapper .items {
        padding: 0;
    }
    .cart-sc .discount-steps {
        margin: 0;
    }
    .cart-sc .items .item .wrapper {
        padding: 15px;
    }
    .cart-sc .items .item .thumb {
        width: 72px;
        height: 72px;
    }
    .cart-sc .items .item .license-icon .badge {
        width: 72px;
        height: 72px;
    }
    .cart-sc .items .item .info {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
    .cart-sc .items .item .title-details {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 5px 0;
        overflow: hidden;
    }
    .cart-sc .items .item .title-details .title {
        font-size: var(--fs-4);
        font-weight: 500;
    }
    .cart-sc .items .item .title-details .details {
        display: block;
        font-size: var(--fs-3);
        color: var(--c-grey);
        font-weight: 300;
        height: 21px;
        overflow: hidden;
        white-space: nowrap;
    }
    .cart-sc .items .item .price-remove {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 150px;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }
    .cart-sc .items .item .price-remove .remove-item {
        width: 38px;
        height: 30px;
        padding: 0;
        cursor: pointer;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .cart-sc .items .item .price-remove .remove-item .icon {
        width: 19px;
        height: 19px;
        opacity: 0.5;
        margin: 0;
    }
    .cart-sc .items .item .price-remove .remove-item .title {
        display: none;
    }
    .cart-sc .items .item .price-remove .price {
        width: 100%;
        text-align: left;
        margin-top: 18px;
        line-height: 0;
    }
    .cart-sc .items .item .price-remove .price .value {
        font-size: var(--fs-5);
    }
    .cart-sc .main-wrapper .right-sc .divider {
        background-color: var(--c-grey-light-5);
        margin-top: 30px;
        margin-bottom: 20px;
    }
    .cart-sc .discount-steps .wrapper {
        padding: 30px;
        border-radius: var(--br-3);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .cart-sc .discount-steps .steps {
        margin: 0;
        width: 320px;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }
    .cart-sc .discount-steps .texts .title {
        font-weight: 900;
    }
    .cart-sc .discount-steps .texts .next-step {
        color: var(--c-grey-dark-2);
        font-size: var(--fs-4);
    }
    .cart-sc .discount-steps .texts .sub-text {
        margin-top: 15px;
        display: block;
        font-weight: 300;
        color: var(--c-grey-light-2);
        font-size: var(--fs-3);
    }
    .pool-bedeh-pool-bedeh-bishtar {
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -moz-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        margin-top: 20px;
        height: 3.2em;
        -webkit-box-shadow: 0px 6px 16px -8px rgba(250, 68, 75, 0.5);
        box-shadow: 0px 6px 16px -8px rgba(250, 68, 75, 0.5);
    }
    .cart-sc .discount-steps .step .step-col {
        -webkit-transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: background-color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .cart-sc .discount-steps .step .step-col:hover {
        background-color: var(--c-grey-light-3);
    }
    .cart-sc .discount-steps .step.active .step-col {
        /* background-color: var(--c-grey-dark-2);
  box-shadow: 0px 4px 8px -4px  var(--c-grey); */
    }
    .order-summary .box {
        padding: 25px;
    }
    .p-checkout-fail .order-summary .box {
        padding-bottom: 95px;
    }
    .order-summary .header {
        font-size: var(--fs-4);
    }
    .order-summary .main .icon {
        width: 120px;
        height: auto;
    }
    .order-summary .main .message {
        font-size: var(--fs-6);
    }
    .order-summary .main .sub-text {
        font-size: var(--fs-4);
    }
    .order-summary .order-items {
        padding-top: 20px;
    }
    .order-summary .item {
        margin: 0;
        margin-bottom: 15px;
        border-radius: var(--br-3);
    }
    .order-summary .item .wrapper {
        padding: 15px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-radius: var(--br-3);
    }
    .order-summary .item .start {
        max-width: 700px;
        overflow: hidden;
    }
    .order-summary .item .thumb {
        width: 68px;
        height: 68px;
    }
    .order-summary .item .title-details {
        width: -webkit-calc(100% - 68px);
        width: calc(100% - 68px);
        padding: 5px 15px;
    }
    .order-summary .item .title-details .title {
        height: auto;
        font-size: var(--fs-4);
    }
    .order-summary .item .title-details .details {
        height: auto;
        font-size: var(--fs-3);
        font-weight: 300;
    }
    .order-summary .item .badge {
        width: 68px;
        height: 68px;
    }
    .order-summary .item .font-dl-bt {
        width: 120px;
    }
    .order-summary .item .font-dl-bt .icon {
        margin-right: 20px;
        opacity: 0.4;
    }
    .order-summary .item .font-dl-bt span {
        display: inline-block;
        color: var(--white);
        font-weight: 300;
    }
    .order-summary .item.license .end {
        display: block;
    }
    .order-summary .item .license-details {
        font-size: var(--fs-3);
    }
    .order-summary .item .license-details .row {
        width: 160px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin: 8px 0;
    }
    .order-summary .item .license-details .title {
        color: var(--c-grey);
        font-weight: 300;
    }
    .user-top .main {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .user-top .actions {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0;
    }
    .user-top .profile-photo {
        width: 100px;
        height: 100px;
    }
    .user-top .sign-out {
        bottom: -5px;
    }
    .user-top .details {
        font-size: var(--fs-4);
        color: var(--c-grey-dark-4);
    }
    .user-top .details .phone {
        font-weight: 600;
    }
    .user-top .profile-act {
        -webkit-transition: border-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: border-color 0.26s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .user-top .profile-act:hover .icon {
        -webkit-animation: rubberBand 0.8s;
        animation: rubberBand 0.8s;
    }
    .user-top .profile-act:hover {
        /* border: 1px solid var(--c-grey-light-4); */
    }
    .tabs.user-tabs .tabs-header .tablink {
        padding: 15px 25px;
    }
    .user-tabs .fonts-empty {
        padding: 60px 20px;
    }
    .user-tabs .fonts-empty .illu {
        width: 250px;
    }
    .user-tabs .fonts-empty .text {
        font-size: var(--fs-6);
    }
    .orders-list .item {
        padding: 15px;
    }
    .orders-list .item .font-details {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        width: -webkit-calc(100% - 160px);
        width: calc(100% - 160px);
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .orders-list .item .top {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        position: relative;
        padding-bottom: 15px;
    }
    .orders-list .item .top::after {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0 -15px;
        content: '';
        border-bottom: 1px dashed var(--c-grey-light-5);
        width: -webkit-calc(100% + 30px);
        width: calc(100% + 30px);
    }
    .orders-list .item .thumb {
        margin: 0;
        width: 64px;
        height: 64px;
    }
    .orders-list .item .info {
        padding: 3px 0;
        width: -webkit-calc(100% - 72px);
        width: calc(100% - 72px);
        text-align: right;
        padding-right: 15px;
    }
    .orders-list .item .font-title {
        font-size: var(--fs-4);
        padding-bottom: 10px;
    }
    .orders-list .item .more {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 0;
        font-size: var(--fs-3);
    }
    .orders-list .item .more .designer {
        color: var(--c-blue-3);
        cursor: pointer;
    }
    .orders-list .item .top .actions {
        padding-top: 0;
    }
    .orders-list .item .top .actions .dl-btn {
        width: 140px;
    }
    .orders-list .item .dl-btn .icon {
        position: initial;
        margin-left: 10px;
        -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: opacity 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .orders-list .item .top .actions .dl-btn:hover img {
        -webkit-animation: rubberBand 0.8s;
        animation: rubberBand 0.8s;
        opacity: 0.8;
    }
    .orders-list .item .font-licenses {
        padding-top: 15px;
        margin-top: 0;
        border: none;
    }
    .orders-list .item .licenses-list {
        margin: 0;
        display: block;
        padding: 15px;
        margin-bottom: 15px;
        border-radius: var(--br-3);
        background-color: var(--c-grey-light-7);
        -webkit-box-shadow: inset 0px -1px 0px 0px #fff, inset 0px 1px 0px 0px rgb(0 0 0 / 2%);
        box-shadow: inset 0px -1px 0px 0px #fff, inset 0px 1px 0px 0px rgb(0 0 0 / 2%);
    }
    .orders-list .item .licenses-list::after {
        /* position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 -15px;
  content: '';
  border-bottom: 1px dashed var(--c-grey-light-5);
  width: calc(100% + 30px); */
    }
    .orders-list .item .license {
        margin: 0 !important;
        margin-bottom: 15px !important;
        width: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        border: none;
    }
    .orders-list .item .license:nth-last-child(1) {
        margin-bottom: 0 !important;
    }
    .orders-list .item .license .start {
        width: -webkit-calc(100% - 405px);
        width: calc(100% - 405px);
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .orders-list .item .license .badge {
        width: 48px;
        height: 48px;
    }
    .orders-list .item .license .l-info {
        width: -webkit-calc(100% - 48px);
        width: calc(100% - 48px);
        padding: 0 10px 0 0;
        font-size: var(--fs-3);
    }
    .orders-list .item .owner {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        gap: 10px;
    }
    .orders-list .item .license .type {
        font-size: var(--fs-4);
        font-weight: 500;
        margin: 0;
    }
    .orders-list .item .owner .row {
        margin: 0;
    }
    .orders-list .item .license-details {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -moz-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        width: 200px;
        padding: 5px 0 0 15px;
        text-align: left;
        font-size: var(--fs-2-5);
    }
    .orders-list .item .license-details .row {
        margin: 0;
    }
    .orders-list .item .license-details .row:nth-child(1) {
        margin-bottom: 5px;
    }
    .orders-list .item .license .actions {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -moz-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        width: 205px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        gap: 15px;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        margin: 0;
    }
    .orders-list .item .license .actions .btn {
        height: 48px;
        font-size: var(--fs-3);
        color: var(--c-grey-dark-2);
    }
    .orders-list .item .license .actions .btn.edit {
        width: 130px;
    }
    .orders-list .item .license .actions .btn.website-script {
        width: 60px;
    }
    .orders-list .item .license .website-script span {}
    .orders-list .item .license .website-script .icon {
        opacity: 0.7;
    }
    .orders-list .item .license-desk-act {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        gap: 15px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
    .orders-list .item .license-details .row .value {
        color: var(--c-grey);
    }
    .orders-list .item .license-details .row .title {
        /* color: var(--c-grey-dark-2); */
    }
    .orders-list .item .license .actions .btn {
        background-color: var(--c-grey-light-7);
    }
    .orders-list .item .license .actions .btn:hover {
        background-color: var(--c-grey-light-6);
    }
    .orders-list .item .license-desk-act .btn {
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .orders-list .item .license-desk-act .btn:hover {
        border: 1px solid hsl(240deg 10% 89%);
        -webkit-box-shadow: 0px 4px 8px -3px rgb(27 27 29 / 10%);
        box-shadow: 0px 4px 8px -3px rgb(27 27 29 / 10%);
    }
    .standard-table td,
    .standard-table th {}
    .standard-table td.td-fit {
        white-space: nowrap;
        width: 1%;
        text-align: center;
    }
    .tab-gifts .create-gift-card {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
    .tab-gifts .create-gift-card a {
        width: 300px;
    }
    .tab-letter .box {
        padding: 30px;
    }
    .tab-letter .form-control .input-wrapper.custom-check span {
        font-size: var(--fs-4);
    }
    .tab-letter .box .form-buttons .submit-bt {
        width: 300px;
    }
    .tab-afilliate .afilliate-hero .wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .tab-afilliate .afilliate-hero .start {
        font-size: var(--fs-4);
        margin: 0;
    }
    .tab-afilliate .afilliate-hero .afli-sign-up-link {
        width: 300px;
    }
    .m-license-script .codearea {
        padding: 10px;
        height: 145px;
    }
    .select-license-modal.user-dash-l-modal .l-modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.6);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        z-index: 200;
        border-radius: 0;
        padding: 0;
    }
    .create-gift-card .gift-amount .value {
        font-size: 84px;
    }
    .afilliate-sign-up .box {
        padding: 30px;
    }
    .afilliate-sign-up .wrapper {
        background-color: #fff;
        padding: 35px 25px;
        border-radius: var(--br-2);
        margin-bottom: 30px;
    }
    .afilliate-sign-up .introduction .desc {
        text-align: center;
        margin: 0 auto;
        font-size: var(--fs-3);
    }
    .afilliate-sign-up .form-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0;
    }
    .afilliate-sign-up .form-wrapper .input-wrapper {
        margin: 0;
    }
    .afilliate-sign-up .form-wrapper .input-wrapper:nth-child(2) {
        width: 300px;
    }
    .afilliate-sign-up .afilliate-links {
        max-width: 560px;
        margin: 0 auto;
    }
    .tab-affiSetting .box {
        padding: 10px 30px 30px 30px;
    }
    .tab-affiSetting .box .container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .tab-affiSetting .box .sc-title {
        width: 100%;
    }
    .tab-affiSetting .box .container .input-wrapper {
        width: 32%;
    }
    .tab-affiSetting .box .input-wrapper.form-buttons button {
        width: 300px;
    }
    .purchase-options .licenses .remove-license {
        right: -12px;
        width: 22px;
        height: 22px;
        font-size: 22px;
    }
    .purchase-options .licenses .remove-license:hover {
        background-color: var(--c-grey-dark-5);
        color: var(--red);
    }
    .contact-page .main-wrapper {
        padding: 30px;
        background-color: var(--c-grey-light-8);
        border-radius: var(--br-4);
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -moz-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -moz-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    .contact-page .main-wrapper .start {
        width: 50%;
    }
    .contact-page .main-wrapper .end {
        width: -webkit-calc(50% - 80px);
        width: calc(50% - 80px);
        margin: 0;
        padding: 0;
        background-color: transparent;
    }
    .contact-page .main-wrapper .content {
        padding: 0;
        background-color: transparent;
        border-radius: 0;
    }
    .contact-page .contact-form {
        padding: 25px 0 0 0;
        background-color: transparent;
        border-radius: 0;
        border-top: 1px solid var(--c-grey-light-5);
    }
    .contact-page .support-faq {
        padding: 0;
        background-color: transparent;
        margin: 0;
    }
    .contact-page .support-faq .support {
        max-width: 100%;
    }
    .contact-page .support-faq .form-title {
        display: none;
    }
    .p-page .blog-post-header .head {
        padding: 30px 30px 5px 30px;
    }
    .p-page .blog-post-content .main-wrapper {
        padding: 0 30px;
    }
}


/* qqq */

@media only screen and (min-width: 1200px) {
    .main-nav .mega-menu-wrapper {
        width: 1180px;
    }
    .main-nav .menu-banners {
        display: block;
        position: absolute;
        top: 15px;
        left: 15px;
    }
    .main-nav .font-lab-banner .wrapper {
        position: relative;
        width: 360px;
        height: 266px;
        background-color: var(--c-grey-light-7);
        border-radius: var(--br-3);
        -webkit-transition: background-color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: background-color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .font-lab-banner .title {
        position: absolute;
        font-size: var(--fs-7);
        font-weight: var(--fw-extra);
        top: 30px;
        left: 15px;
        -webkit-transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .font-lab-banner .caption {
        position: absolute;
        font-size: 16.2px;
        font-weight: 300;
        top: 76px;
        left: 15px;
        width: 220px;
        z-index: 10;
        color: var(--c-grey-dark-2);
        -webkit-transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .font-lab-banner .view {
        position: absolute;
        left: 20px;
        bottom: 15px;
        width: 80px;
        -webkit-transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: color 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        font-weight: 300;
    }
    .main-nav .font-lab-banner .view::after {
        content: '';
        position: absolute;
        height: 8px;
        width: 8px;
        top: 9px;
        left: 0;
        -webkit-transform: rotate(-135deg);
        -ms-transform: rotate(-135deg);
        transform: rotate(-135deg);
        border-style: solid;
        border-color: var(--c-red-3);
        border-width: 2px 2px 0 0;
        -webkit-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
        transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    .main-nav .font-lab-banner img {
        position: absolute;
        right: -41px;
        top: 10px;
    }
    .main-nav .font-lab-banner:hover .wrapper {
        background-color: var(--c-grey-light-5);
    }
    .main-nav .font-lab-banner:hover .title {
        color: var(--c-red);
    }
    .index-carousel .page-container {
        padding: 30px 0;
    }
    .index-carousel .page-width {
        background: var(--c-grey-light-7);
        background: -webkit-gradient(linear, left bottom, left top, from(#fff0), to(var(--white)));
        background: linear-gradient(0deg, #fff0 0%, var(--white));
    }
    .index-f-cats .icon {
        display: initial;
        z-index: -1;
    }
    .p-index .licenses .summary-licenses {
        width: 420px;
    }
    .p-index .license {
        padding: 18px 0;
    }
    .blog-latest .post {
        width: 280px;
        margin-left: 23px;
    }
    .blog-latest .post-cover {
        width: 280px;
        height: 210px;
    }
    .footer .brands-carousel {
        padding: 20px 0 15px 0;
    }
    .blog-latest {
        padding: 60px 0 180px 0;
    }
    .purchase-options .main-wrapper {
        padding: 20px;
    }
    .purchase-options .box {
        padding: 20px;
    }
    .purchase-options .bundles .bundle-option {
        margin-bottom: 20px;
    }
    .comments-faq-sc .comments-sc {
        width: -webkit-calc(100% - 330px);
        width: calc(100% - 330px);
    }
    /* xxx */
}

@media only screen and (max-height: 600px) {
    .main-nav .nav-footer {
        display: none;
    }
}


/* firefox fallback */

.firefox header {
    background-color: rgba(255, 255, 255, 1);
}

@media print,
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 1.25dppx),
(min-resolution: 120dpi) {}

@media print {
    *,
    *::before,
    *::after {
        background: #fff !important;
        color: #000 !important;
        /* Black prints faster */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    a[href]::after {
        content: " (" attr(href) ")";
    }
    abbr[title]::after {
        content: " (" attr(title) ")";
    }
    a[href^="#"]::after,
    a[href^="javascript:"]::after {
        content: "";
    }
    pre {
        white-space: pre-wrap !important;
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    thead {
        display: table-header-group;
    }
    tr,
    img {
        page-break-inside: avoid;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
    h2,
    h3 {
        page-break-after: avoid;
    }
}


/* fix css */

@media only screen and (min-width: 992px) {
    li.nav-item.sub-item.has-sub-child {
        position: relative;
    }
    li.nav-item.sub-item.has-sub-child:hover .sub-nav {
        opacity: 1;
        visibility: visible;
    }
    li.nav-item.sub-item.has-sub-child .sub-nav {
        position: absolute;
        right: 159px;
        top: -5px;
        border-radius: var(--br-4) !important;
        opacity: 0;
        visibility: hidden;
    }
}

.posts-stream {
    position: relative;
}

div#posts-stream-preloader {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #ffffffba;
    display: block;
    z-index: 10;
    -webkit-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
    visibility: hidden;
    opacity: 0;
}

div#posts-stream-preloader:before {
    content: "";
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid var(--dark);
    border-top: 3px solid var(--dark);
    left: 50%;
    top: 50%;
    position: absolute;
    width: 3em;
    height: 3em;
    border-radius: 50%;
    -webkit-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
    -webkit-animation: blog_preloader 400ms linear infinite;
    animation: blog_preloader 400ms linear infinite;
}

@-webkit-keyframes blog_preloader {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes blog_preloader {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

div#posts-stream-preloader.active {
    visibility: visible;
    opacity: 1;
    -webkit-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
}

a#blog-index-content-load-more {
    display: block;
    padding: 5px 20px;
    margin-left: 10px;
    text-decoration: none;
    white-space: nowrap;
    font-weight: 300;
    border: 1px solid var(--c-grey-light-4);
    border-radius: var(--br-round);
    color: var(--c-grey-dark-2);
}

a#blog-index-content-load-more:hover {
    background-color: var(--c-grey-light-6);
}

body.search .blogposts-list {
    margin-top: 2em;
}
figcaption{
    max-width: 40em;
    font-size: 13px;
    text-align: center;
}

figure {
    margin: 0 0 1em;
    margin: 0 5px;
}

.aligncenter, div.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }
    .alignleft {
    float: left;
    }
    .alignright {
    float: right;
    }
/* fix css */
.related-fonts {
    display: flex;
    flex-direction: column;
    gap: 20px;
        margin-bottom: 38px;
}
.related-fonts .font-card {
    margin-bottom: 0;
}

.related-fonts .font-card > a {
    display: flex !important;
    align-items: center;
    width: 100%;
    gap: 8px;
}
.related-fonts .font-card .font-thumb {

}
.related-fonts .font-card .font-thumb .media-container {
    width: 87px;
    height: 87px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    border-radius: 8px;
}
.related-fonts .font-card .font-thumb img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: 48px !important;
    height: auto !important;
}
.related-fonts .font-card .font-details {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-grow: 1;
}
.related-fonts .font-card .font-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
    font-size: 19px;
    margin-bottom: 0 !important;
    flex-grow: 1;
}
.related-fonts .font-card .font-info {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 300;
    color: #818181;
}
.related-fonts .font-card .font-version {
        background-color: #f7f7f7;
    padding: 2px 6px;
    border-radius: 999px;
}
.related-fonts .font-card .font-price {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 6px;
}