@font-face{font-family:'SourceSerifPro';src:url('../fonts/SourceSerifPro-Regular.eot');src:url('../fonts/SourceSerifPro-Regular.eot?#iefix') format('embedded-opentype'),url('../fonts/SourceSerifPro-Regular.woff') format('woff'),url('../fonts/SourceSerifPro-Regular.woff2') format('woff2'),url('../fonts/SourceSerifPro-Regular.ttf') format('truetype'),url('../fonts/SourceSerifPro-Regular.svg') format('svg');font-weight:400;font-style:normal}
@font-face{font-family:'SourceSerifPro';src:url('../fonts/SourceSerifPro-Bold.eot');src:url('../fonts/SourceSerifPro-Bold.eot?#iefix') format('embedded-opentype'),url('../fonts/SourceSerifPro-Bold.woff') format('woff'),url('../fonts/SourceSerifPro-Bold.woff2') format('woff2'),url('../fonts/SourceSerifPro-Bold.ttf') format('truetype'),url('../fonts/SourceSerifPro-Bold.svg') format('svg');font-weight:700;font-style:normal}

body{
    margin: 0;
    padding: 0;
    position: relative;
}

.black-theme body {
    --header-background-color: #132A3F;
    --header-color:#fff;
    --color: black;
    --black: rgba(51, 51, 51, 1);
    --blue-sky: rgba(194, 225, 243, 0.3);
    --green: rgba(0, 82, 130, 1);
    --grey: rgba(245, 246, 248, 1);
    --grey-dark: rgba(135, 149, 159, 1);
    --grey-black: rgba(47, 71, 87, 1);
    --grey-light: rgba(208, 212, 217, 0.25);
    --grey-light2: rgba(207, 213, 216, 1);
    --grey-very-light: rgba(240, 241, 243, 1);
    --grey-another:rgba(87, 107, 120, 1);
    --grey-soft: rgba(217, 217, 217, 1);
    --gold-100: rgba(231, 228, 222, 1);
    --gold-200: rgba(207, 201, 190, 1);
    --gold-400: rgba(160, 146, 125, 1);
    --gold-500: rgba(27, 24, 18, 1);
    --gold-900: rgba(27, 24, 18, 1);
    --rose-gold-100: rgba(251, 241, 238, 1);
    --rose-gold-500: rgba(236, 186, 168, 1);
    --rose-gold-800: rgba(94, 74, 67, 1);
    --deep-rose-gold-600:rgba(150, 110, 101, 1);
    --deep-rose-gold-500:rgba(188, 138, 126, 1);
    --deep-rose-gold-100:rgba(242, 232, 229, 1);
    --exploration-rose-gold:rgba(236, 186, 168, 1);
    --exploration-rose-gold2:rgba(188, 138, 126, 1);
    --navy-blue-500: rgba(19, 42, 63, 1);
    --navy-blue-400: rgba(66, 85, 101, 1);
    --navy-blue-200: rgba(161, 170, 178, 1);
    --base-900: rgba(29, 29, 29, 1);
    --base-600: rgba(150, 150, 150, 1);
    --base-700: rgba(109, 109, 109, 1);
    --base-800: rgba(77, 77, 77, 1);
    --base-200: rgba(250, 250, 250, 1);
    --base-300: rgba(234, 234, 234, 1);
    --base-400: rgba(218, 218, 218, 1);
    --base-500: rgba(175, 175, 175, 1);
    --base-100: rgba(255, 255, 255, 1);
    --dark: #132A3F;
    --dark-black:rgba(13, 18, 20, 1);
    --yellow:rgba(255, 163, 0, 1);
    --warning-500: rgba(255, 163, 0, 1);
    --warning-700: rgba(153, 98, 0, 1);
    --line-color: rgba(208, 208, 208, 1);
    --line-border: 2px solid rgba(208, 208, 208, 1);
    --exploration: rgba(19, 42, 63, 1);
    --exploration4: rgba(19, 42, 63, .4);
    --error:rgba(255, 217, 217, 1);
    --error-600: rgba(204, 51, 51, 1);
    --success-600: rgba(0, 159, 103, 1);
    --success-500: rgba(0, 199, 129, 1);
    --danger-600: rgba(213, 0, 55, 1);
    --product-tile-height:380px;
    --mobile-product-tile-height:328px;
}

/* Largest devices such as desktops (1280px and up) */
/*@media only screen and (min-width: 80em) {...}*/
header{
    background-color: var(--header-background-color);
    color: var(--header-color);
    max-height: 72px;
}

header .header-wrapper{
    max-width: 1240px;
    margin: 0 auto;
    height: 72px;   
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: static;
}
.button{
    padding: 8px 16px 8px 16px;
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
    font-family: SourceSerifPro;
    font-size: 18px;
    font-weight: 600;
    line-height: 23px;
    letter-spacing: 0em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 50px auto 0 auto;
}
.dark-background{
    background-color: var(--dark);
}
.grey-background{
    background-color: var(--grey);
}
.header-wrapper a.logo{
    display: block;
}
.header-wrapper a.logo > img{
    height: 40px;
    width: auto;
}
.slick-slider .slick-track{
    height: 100%;
    display: flex;
}
.img-fit-cover{
    object-fit: cover;
}
.menu-top {
  list-style-type: none;
  display: flex;
  margin: 0;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 0;
  margin-left: 50px;
  font-family: Marcellus;
  font-weight: 400;
  font-size: 16px;
}
.menu-top > li{
    margin-right: 28px;
}
.menu-top > li:last-child{
    margin-right: 0;
}
.menu-top > li a{
    font-family: inherit;
    color: inherit;
    text-decoration: none;
}
.menu-top > li a:hover{
    color: var(--deep-rose-gold-500);
}
.menu-top-right {
  position: relative;
  margin-left: auto;
  display: flex;
  list-style-type: none;
  align-items: center;
  justify-content: flex-end;
  padding: 0;
}
.menu-top-right li{
    margin-right: 15px;
}
.menu-top-right li:last-child{
    margin-right: 0;
}
li.menu-account > a{
    font-family: 'SourceSerifPro';
    font-weight: normal;
    font-size: 14px;
}
li.menu-cart{
    position: relative;
}
li.menu-cart .cart-count{
    position: absolute;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    top: -7px;
    right: -7px;
    background-color: var(--rose-gold-500);
    color: var(--navy-blue-500);
    border-radius: 50%;
    font-family: SourceSerifPro;
    font-size: 12px;
    font-weight: 600;
}
li.menu-cart .cart-count[data-count="0"]{
    display: none;
}
a[href="#search"]{
    display: block;
}
#is_search_display{display: none;}
.form-search{
    height: 34px;
    width: 209px;
    background-color: #fff;
    display: none;
    align-items: center;
}
#is_search_display:checked ~ .form-search {
  display: flex;
  position: absolute;
  top: 50%;
  right: 100%;
  transform: translateY(-50%);
}
#is_search_display:checked ~ a[href="#search"]{
    display: none;
}
.form-search form{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.form-search svg.lup{
    margin: auto 10px;
}
.form-search form input[type="text"]{
    margin-left: auto;
  border: none;
  font-family: Marcellus;
  font-size: 14px;
  color: #969696;
  outline: none;
  width: calc(100% - 10px);
}
li.menu-account{
    height: 32px;
    border-left: 1px solid #fff;
    padding-left: 15px;
    display: flex;
    align-items: center;
}
li.menu-account a[href="#account"]{
    color: #fff;
    font-family: SourceSerifPro;
    font-size: 14px;
    text-decoration: none;
}
.section{
    padding-bottom: 20px;
}
.section-content{
    max-width: 1240px;
    margin: 0 auto;
    padding: 20px 0;
    text-align: center;
}
.slick-slider{
    margin: 0;
    padding: 0;
}
.slick-slide{
    height: auto!important;
}
.slick-dots {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
    bottom: 14px;
    text-align: center;
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.slick-dots li {
  margin: 0 7px;
  position: relative;
}
.slick-dots li > button {
  border-radius: 50%;
  background-color: var(--dark);
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  padding: 0;
  overflow: hidden;
  text-indent: -200px;
  width: 8px;
  height: 8px;
  border:none ;
  cursor: pointer;
  opacity: 0.1;
}
.slick-dots li.slick-active > button {
  opacity: 1;
}
.slider li a{
    display: block;
    width: 100%;
    height: auto;
}
.slider li a img{
    width: 100%;
    height: auto;
}
ul.catalog{
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
    gap:22px;
}
ul.catalog li{
    width: calc(20%);
    position: relative;
}
ul.catalog li a{
    display: block;
    width: 100%;
    height: 100%;

}
ul.catalog li img{
    width: 100%;
    height: auto;
/*    display: block;*/
    border: none;
}
ul.catalog li img:not(.mobile){
    display: block;
}
ul.catalog li span{
    position: absolute;
    text-align: center;
    bottom: 25px;
    margin: 0 auto;
    font-family: Marcellus;
    font-size: 24px;
    color: #fff;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}
ul.catalog li a:after{
    content: '';
    width: 100%;
    height: 100px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.3));
    z-index: 1;
}
.section.half-dark-background{
    position: relative;
}
.section.half-dark-background .section-content:after{
    content: '';
    height: calc(50% + 40px);
    width: 100%;
    background-color: var(--dark);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.section-header{
    height: 60px;
    padding-top: 20px;
    overflow: visible;
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}
.section-header > .title{
    margin: 0;
    padding: 0;
    font-family: Marcellus;
    font-size: 32px;
    color: #fff;
}
.section-header > .view-all{
    margin-left: auto;
    font-family: "SourceSerifPro";
    color:var(--warning-500) ;
    font-size: 18px;
    font-weight: 400;
    text-decoration: none;
    margin-top: 8px;
}
.section-header > .line{
    height: 1px;
    width: 100%;
    background-color: var(--line-color);
    border: none;
    position: relative;
}
.section-header > .title.center{
    position: absolute;
    padding: 0 30px;
    left: 50%;
    transform: translateX(-50%);
    font-family: Marcellus;
    font-size: 32px;
    font-weight: 400;
    line-height: 40px;
    letter-spacing: 0em;
    text-align: center;
    color: var(--black);
    background-color: #fff;
    z-index: 2;
}
.section-header > .title.center::after {
  content: '';
  border: var(--line-border);
  width: 2px;
  height: 2px;
  position: absolute;
  right: 2px;
  left: auto;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  background-color: var(--line-color);
  z-index: 2;
}
.section-header > .title.center::before {
  content: '';
  border: var(--line-border);
  width: 2px;
  height: 2px;
  position: absolute;
  left: 2px;
  right: auto;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  background-color: var(--line-color);
  z-index: 2;
}
.section.trending-collection .section-content{
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 20px;
}
.section.trending-collection .section-content .main-catalog{
    width: calc(58% - 20px);
}
.section.trending-collection .section-content .catalog{
  width: 42%;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex-direction: row;
}
.section.trending-collection .section-content .catalog li {
  width: calc(50% - 4px);
}

.section.half-light-background{
    position: relative;
}
.section.half-light-background .section-content:after{
    content: '';
    height: calc(50% + 40px);
    width: 100%;
    background-color: var(--rose-gold-100);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
ul.products{
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
    gap:22px;
}
ul.products li{
    width: calc(20%);
    position: relative;
}
.product-card{
    display: block;
    text-decoration: none;
    padding: 0 8px 8px 8px;
    background-color: #fff;
    min-height: 400px;
    text-align: left;

    border: 1px solid rgba(234, 234, 234, 1);
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
}
.product-card > img{
    width: calc(100% + 16px);
    display: block;
    margin: 0 -8px 8px -8px;
    padding: 0;
    border: 0;
}
.product-card .sku{
    font-family: SourceSerifPro;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0em;
    text-align: left;
    color: var(--base-600);
    display: block;
}
.product-card .title{
    font-family: SourceSerifPro;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0em;
    text-align: left;
    color: var(--base-900);
    display: block;
    margin-top: 5px;
}
.product-card .prices{
    margin-top: 7px;
}
.product-card .prices ins{
    font-family: SourceSerifPro;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    color: var(--base-900);
    display: block;
    text-decoration: none;
    margin-bottom: 2px;
}
.product-card .prices del{
    font-family: SourceSerifPro;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0em;
    text-align: center;
    color: var(--base-600);
}
.product-card .prices mark{
    background-color: var(--error);
    color: var(--error-600);
    padding: 2px;
    font-family: SourceSerifPro;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    letter-spacing: 0em;
    text-align: left;
    margin-left: 6px;
}
.product-card .stars-review{
    margin-top: 9px;
    font-family: SourceSerifPro;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: 0em;
    text-align: left;
    color: var(--base-700);
    display: flex;
    justify-content: flex-start;
    align-items: initial;
    gap:3px;
}
.product-card .categories{
    font-family: SourceSerifPro;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0em;
    text-align: left;
    color: var(--deep-rose-gold-500);
    position: absolute;
    bottom: 8px;
}
.product-card .discount {
  position: absolute;
  top: -7px;
  right: 7px;
  border: 20px solid var(--yellow);
  border-bottom-color: transparent;
  border-left-color: var(--yellow);
  border-width: 8px 20px;
  height: 36px;
  border-radius: 0 8px 0 0;
}
.product-card .discount::before {
  content: '';
  width: 7px;
  height: 7px;
  top: -8px;
  left: -27px;
  border-radius: 4px 4px 0px 0px;
  background: rgba(153, 98, 0, 1);
  display: block;
  position: absolute;
  z-index: 3;
}
.product-card .discount::after {
  content: '';
  width: 7px;
  height: 7px;
  top: -8px;
  left: -22px;
  background: var(--yellow);
  display: block;
  position: absolute;
  z-index: 2;
}
.product-card .discount span {
  position: absolute;
  font-family: SourceSerifPro;
  font-size: 18px;
  font-weight: 600;
  line-height: 23px;
  letter-spacing: 0em;
  text-align: center;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  top: 6px;
  padding-right: 5px;
}
.product-card .discount span::after {
  position: absolute;
  font-family: inherit;
  content: '%';
  color: #fff;
  font-size: 10px;
  top: -6px;
  right: -3px;
}
.section-header.best-deal{
    position: relative;
    padding-top: 50px;
}
.section.half-light-background .section-header.best-deal ~ .section-content::after {
    height: calc(50% + 70px);
}
.section-header.best-deal .title{
    color: var(--black);
    font-family: Marcellus;
    font-size: 48px;
    font-weight: 400;
    line-height: 60px;
    letter-spacing: 0em;
    text-align: left;
}
.section-header.best-deal .subtitle {
font-family: Allison;
font-size: 48px;
font-weight: 400;
line-height: 61px;
letter-spacing: 0em;
text-align: center;
color: var(--yellow);
position: absolute;
bottom: 33px;
left: -13px;
padding: 0;
margin: 0;
}
.product--countdown{
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: 20px;
}
.product--countdown > span{
    display: flex;
    flex-direction: row;
    color: var(--rose-gold-800);
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    margin-right: 10px;

}
.product-countdown-block{
    display: flex;
    flex-direction: row;
}
.product-countdown-block .clock-item .num{
    padding: 2px 4px 2px 4px;
    border-radius: 6px;
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0em;
    text-align: left;
    color: #fff;
    background-color: var(--error-600);
}
.product-countdown-block .clock-item .icon{
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 600;
    padding: 0 5px;
}
.product-card .discount{
    display: none;
}
.product-card[data-discount-type="2"] .discount{
    display: block;
}
.product-card[data-discount-type="2"] .prices mark{
    display: none;
}
.section-content > a.block{
    display: block;
    width: 100%;
}
.section-content > a.block img{
    width: 100%;
    display: block;
}
.section.pattern-background .section-content .product-card{
    background-color: #fff;
}
.section.pattern-background .section-header .title{
    background: transparent;
    color: var(--exploration-rose-gold);
}
.section.pattern-background .section-header .line{
    background-color: var(--exploration-rose-gold);
}
.section.pattern-background .section-header .title:after, .section.pattern-background .section-header .title:before{
    background-color: var(--exploration-rose-gold);
    border-color: var(--exploration-rose-gold);
}
.section.gallery .section-content{
    display: flex;
    flex-direction: row;
    gap: 10px;
}
.section.gallery .section-content > a{
    width: 31%;
    background-size: cover;
}
.section.gallery .section-content > a > img{
    width: 100%;
    visibility: hidden;
}
.section.gallery .section-content > ul{
    width: calc(69% - 10px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    list-style-type: none;
    margin: 0;
    padding: 0;
    gap: 10px;
}
.section.gallery .section-content > ul li{
    width: calc(33.3333333% - 7px);
    position: relative;
}
.section.gallery .section-content > ul li a{
    display: block;
    height: 100%;
    width: 100%;
    background-size: cover;
    position: relative;
}
.section.gallery .section-content > ul li a > img{
    width: 100%;
    visibility: hidden;
}
.section.gallery .section-content .gallery li a > img{
/*    visibility: hidden;*/
}

.section.gallery .section-content .gallery li a .product-mini-card{
    position:absolute;
    bottom: 0;
    left:0;
    width: 100%;
    z-index: 2;
}
.section.gallery .section-content .gallery li.product a:after{
    position: absolute;
    top: 0;
    left:0;
    content: '';
    width: 100%;
    height: 100%;
    z-index: 1;
    background: linear-gradient(180deg, rgba(19, 42, 63, 0) -0.05%, #132A3F 100%), linear-gradient(0deg, transparent, transparent);

}
.product-mini-card .mini-card-wrapper{
    padding: 0 20px 20px 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
}
.product-mini-card .mini-card-wrapper img{
    width: 30%;
}
.product-mini-card .mini-card-wrapper .info{
    width: calc(70% - 8px);
    display: flex;
    text-align: left;
    color: #fff;
    flex-direction: column;
    gap: 5px;
    justify-content: center;
}
.product-mini-card .mini-card-wrapper .info .sku{
    font-size: 12px;
    font-family: SourceSerifPro;
}
.product-mini-card .mini-card-wrapper .info .name{
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
}
.product-mini-card .mini-card-wrapper .button{
    width: 100%;
    margin: 0;
    padding: 8px 16px 8px 16px;
    font-size: 12px;
    background-color: var(--exploration);
    border:  var(--exploration);;
}
.prices del ~ del{
    margin-left: 5px;
}
footer{
    background-color: var(--grey);
}
.footer-wrapper{
    max-width: 1240px;
    margin:20px auto 0px auto;
    padding: 37px 0 50px 0;
    display: flex;
    flex-direction: row;
}
.footer-wrapper > .company-profile{
    width: 35%;
}
.footer-wrapper > .footer-menu{
    width: 40%;
}
.footer-wrapper > .footer-social-media{
    margin-left: auto;
}
.footer-wrapper > .company-profile .logo img{
    max-width: 124px;
    display: block;
}
.footer-wrapper > .company-profile .company-contacts{
    margin: 25px 0 25px 0;
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    gap: 7px;
}
.footer-wrapper > .company-profile .company-contacts a {
  text-decoration: none;
  color: var(--exploration);
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.footer-wrapper > .company-profile .company-contacts a .icon{
    width: 30px;
    display: block;
}
.footer-wrapper > .company-profile .company-operational-hours{
    padding: 10px 0 0 0;
    border-top: 1px solid rgba(217, 217, 217, 1);
    display: inline-flex;
    flex-direction: column;
    gap: 2px;
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
}
.footer-wrapper > .company-profile .company-operational-hours .hours{
    font-weight: 700;
}
.footer-wrapper > .footer-menu ul{
    margin-top: 16px;
    list-style-type: none;
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 7px;
}
.footer-wrapper > .footer-menu{
    display: flex;
    flex-direction: row;
}
.footer-wrapper > .footer-menu li a{
    text-decoration: none;
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    color: var(--exploration);
}
.footer-wrapper > .footer-menu ul li:first-child a{
    font-weight: 700;
    margin-bottom: 7px;
    display:block;
}
.footer-wrapper .footer-social-media{
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 25%;
    padding-top: 16px;
}
.footer-wrapper .footer-social-media .title{
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
}
.footer-wrapper .footer-social-media .social-media{
    list-style-type: none;
    display: flex;
    flex-direction: row;
    margin: 0;
    padding: 0;
    gap: 30px;
}

.menu-account-mobile{
    display: none;
}
input.mobile-search-input[name="s"]{
    display: none;
}
.title.mobile{
    display: none;
}
ul.menu-top .fly-menu{
    display: none;
}
ul.menu-top li:hover a{
    color:var(--deep-rose-gold-500);
}
ul.menu-top li:hover .fly-menu{
    display: block;
}
.fly-menu{
    position: absolute;
    width: 100%;
    left: 0;
    background-color: transparent;
    box-shadow: 0px 16px 20px 0px rgba(0, 0, 0, 0.15);
    z-index: 2;
    top: 40px;
}
.fly-menu:hover ~ a{
    color: var(--rose-gold-500);
}
.fly-menu > .white{
    background-color: #fff;
}
.fly-menu > .transparent{
    height: 25px;
    background-color: transparent;
}
.fly-menu .section-content.type-1 .title{
    color: #000;
    font-size: 24px;
    font-family: Marcellus;
    text-align: left;
} 
.fly-menu .section-content.type-1 .child-menu{
    display: flex;
    flex-direction: row;
}
.fly-menu .section-content.type-1 .child-menu input[name="child-menu"]{
    display: none;
}
.fly-menu .section-content.type-1 .child-menu .child-menu-sidebar{
    width: 192px;
    border-right: 1px solid rgba(217, 217, 217, 1);
}
.fly-menu .section-content.type-1 .child-menu .child-menu-content{
    width: calc(100% - 204px);
    padding-left: 12px;
}
.fly-menu .section-content.type-1 .child-menu .child-menu-sidebar ul{
    list-style-type: none;
    padding: 0;
    margin: 5px 0 0 0;
    display: flex;
    flex-direction: column;
}
.fly-menu .section-content.type-1 .child-menu .child-menu-sidebar ul li{
    color: #000;
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 400;
    height: 54px;
/*    display: flex;*/
    align-items: center;
    padding-left: 9px;
    position: relative;
}
.fly-menu .section-content.type-1 .child-menu .child-menu-sidebar ul li label{
    cursor: pointer;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.fly-menu .section-content.type-1 .child-menu .child-menu-sidebar ul li label:hover{
    color: var(--rose-gold-500);
    font-weight: 700;
}
.fly-menu .section-content.type-1 .child-menu .child-menu-content .tab{
    display: none;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 8px;
    flex-direction: row;
    flex-wrap: wrap;
}
.child-menu-content .tab a{
    display: flex;
    gap: 8px;
    flex-direction: column;
    color: var(--base-800);
    width: 106px;
    font-size: 12px;
}
.child-menu-content .tab a img{
    width: 300px;
    max-width: 100%;
    object-fit: cover;
    aspect-ratio:1/1;
}

input[name="child-menu"]:nth-child(1):checked ~ .child-menu-sidebar li:nth-child(1){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}
input[name="child-menu"]:nth-child(2):checked ~ .child-menu-sidebar li:nth-child(2){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}
input[name="child-menu"]:nth-child(3):checked ~ .child-menu-sidebar li:nth-child(3){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}
input[name="child-menu"]:nth-child(4):checked ~ .child-menu-sidebar li:nth-child(4){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}
input[name="child-menu"]:nth-child(5):checked ~ .child-menu-sidebar li:nth-child(5){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}
input[name="child-menu"]:nth-child(6):checked ~ .child-menu-sidebar li:nth-child(6){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}
input[name="child-menu"]:nth-child(6):checked ~ .child-menu-sidebar li:nth-child(7){
    display: flex;
    background-color: var(--rose-gold-100);
    border-right: 4px solid var(--deep-rose-gold-500);
    color: var(--deep-rose-gold-500);
    font-weight: 700;
    box-sizing: border-box;
}

input[name="child-menu"]:nth-child(1):checked ~ .child-menu-content .tab:nth-child(1){
    display: flex;
}
input[name="child-menu"]:nth-child(2):checked ~ .child-menu-content .tab:nth-child(2){
    display: flex;
}
input[name="child-menu"]:nth-child(3):checked ~ .child-menu-content .tab:nth-child(3){
    display: flex;
}
input[name="child-menu"]:nth-child(4):checked ~ .child-menu-content .tab:nth-child(4){
    display: flex;
}
input[name="child-menu"]:nth-child(5):checked ~ .child-menu-content .tab:nth-child(5){
    display: flex;
}
input[name="child-menu"]:nth-child(6):checked ~ .child-menu-content .tab:nth-child(6){
    display: flex;
}
input[name="child-menu"]:nth-child(6):checked ~ .child-menu-content .tab:nth-child(7){
    display: flex;
}
.mobile{
    display: none;
}

.fly-menu .section-content.type-2 .title{
    color: #000;
    font-size: 24px;
    font-family: Marcellus;
    text-align: left;
    border-bottom: 1px solid var(--grey-soft);
    margin-bottom: 15px;
} 
.fly-menu .section-content.type-2 .child-menu{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
}
.fly-menu .section-content.type-2 .child-menu .banner-image{
    display: flex;
    flex-direction: row;
    gap: 7px;
    position: relative;
}
.fly-menu .section-content.type-2 .child-menu .banner-image a{
    display: block;
    width: 298px;
} 
.fly-menu .section-content.type-2 .child-menu .banner-image a img{
    max-width: 100%;
    display: block;
}
.fly-menu .section-content.type-2 .child-menu .banner-image a:nth-child(3){
    width: 326px;
}
.fly-menu .section-content.type-2 .child-menu .banner-image a:nth-child(4){
    position: absolute;
    right: 0;
    bottom: 0;
    width: 326px;
}
.fly-menu .section-content.type-2 .child-menu .more-collection{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 290px;
}
.fly-menu .section-content.type-2 .child-menu .more-collection span{
    width: 100%;
    font-size: 18px;
    font-family: Marcellus;
    text-align: left;
}
.fly-menu .section-content.type-2 .child-menu .more-collection a{
    width: 50%;
    text-align: left;
    font-size:15px ;
    font-family: SourceSerifPro;
    font-weight: 400;
}

.fly-menu .section-content.type-3 .title{
    color: #000;
    font-size: 24px;
    font-family: Marcellus;
    text-align: left;
    border-bottom: 1px solid var(--grey-soft);
    margin-bottom: 15px;
}

.fly-menu .section-content.type-3 .child-menu .title{
    color: #000;
    font-size: 24px;
    font-family: Marcellus;
    text-align: left;
    border-bottom: 0;
    margin-bottom: 10px;
    display: block;
}

.fly-menu .section-content.type-3 .child-menu .title ~ .title{
    margin-top: 20px;
}
.fly-menu .section-content.type-3 .child-menu .banner-images{
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.fly-menu .section-content.type-3 .child-menu .banner-images a{
    display: flex;
    flex-direction: column;
    width: 197px;
    gap: 3px;
    color: #000;
    font-size: 16px;
}
#flying-navigation-check{
    display: none;
}
.otp-input ~ .error-message{
    display: block;
}
.otp-input.error ~ .error-message{
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: var(--error-600);
    margin-top: 6px;
}
.gray-screen{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background-color: rgba(0, 0, 0, .7);
    display: none;
    align-items: flex-start;
    justify-content: center;
}
.gray-screen-wrapper{
    max-width: 1024px;
    overflow-y: scroll;
    background-color: #fff;
    margin-top: 100px;
}
.gray-screen-inner{
    padding: 35px 35px;
}
.search-promo-wrapper{
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-top: 15px;
}
.search-promo-inner{
    height: 42px;
    border: 1px solid var(--base-400);
    width: calc(100% - 63px);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    position: relative;
}
input.search-promo{
    font-family: SourceSerifPro;
    font-size: 14px;
    font-weight: 400;
    color: var(--base-900);
    border: 0;
    width: calc(100% - 10px);
    outline: 0;
}
.search-promo-inner svg{
    margin-left: 16px;
}
.search-promo-wrapper a[href="#check-kode-promo"]{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 53px;
    background-color: var(--navy-blue-200);
    color: #fff;
    font-family: SourceSerifPro;
    font-size: 14px;
    font-weight: 700;
    margin-left: auto;
    text-decoration: none;
}
.voucher-item .voucher-check{
    display: none;
}
.voucher-item-title{
    padding: 0;
    margin: 0;
    display: flex;
    font-family: SourceSerifPro;
    font-size: 16px;
    font-weight: 600;
    color: var(--base-900);
}
.flying-login-menu{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 11;
    background-color: #fff;
    display: none;
}
.flying-login-menu.show{
    display: block;
}
.flying-register-menu{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 11;
    background-color: #fff;
    display: none;
}
.flying-register-menu.show{
    display: block;
}
.flying-otp-menu{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 12;
    background-color: #fff;
    display: none;
}
.flying-forget-password{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 12;
    background-color: #fff;
    display: none;
}
.flying-otp-email{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 12;
    background-color: #fff;
    display: none;
}
.flying-reset-password{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 12;
    background-color: #fff;
    display: none;
}
.flying-reset-password-success{
    position: absolute;
    top: 10px;
    left: 50%;
    width: 100%;
    max-width: 406px;
    transform: translateX(-50%);
    z-index: 12;
    background-color: #fff;
    display: none;
}
.reset-success-body{
    position: relative;
    height: 100%;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.reset-success-body h3{
    font-family: Marcellus;
    font-size: 20px;
    font-weight: 400;
    color: var(--base-900);
    text-align: center;
}
.reset-success-body a[href="#kembali"]{
    border-radius: 4px;
    background-color: var(--navy-blue-500);
    color: #fff;
    padding: 9px 16px;
    border: none;
    width: calc(100% - 40px);
    font-size: 16px;
    font-weight: 700;
    font-family: SourceSerifPro;
    cursor: pointer;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: block;
}
.flying-reset-password .otp-header{
    height: 158px;
}
.flying-login-menu.sent-otp{
    display: none;
}
.flying-login-menu.sent-otp ~ .flying-otp-menu{
    display: block;
}
.flying-login-menu.forget-password{
    display: none;
}
.flying-login-menu.forget-password ~ .flying-forget-password{
    display: block;
}
.flying-forget-password.sent-otp-email{
    display: none;
}
.flying-forget-password.sent-otp-email ~ .flying-otp-email{
    display: block;
}
.flying-forget-password.new-password ~ .flying-otp-email{
    display: none;
}
.flying-forget-password.new-password ~ .flying-reset-password{
    display: block;
}
.flying-reset-password.success{
    display: none;
}
.flying-reset-password.success ~ .flying-reset-password-success{
    display: block;
}

.divider-forget-password{
    display: block;
    height: 15px;
    padding: 0;
    margin: 0;
}
.lupa-kata-sandi{
    font-size: 14px;
    font-weight: 600;
    font-family: SourceSerifPro;
    color: var(--deep-rose-gold-500);
    text-decoration: none;
    display: block;
    text-align: right;
}

.flying-register-menu.sent-otp{
    display: none;
}
.flying-register-menu.sent-otp ~ .flying-otp-menu{
    display: block;
}
.otp-header{
    background-color: #fff;
    display: block;
    height: 120px;
}
.otp-header .close-otp{
    display: none;
}
.otp-header .close-otp-email{
    display: none;
}
.otp-header .close-forget-password{
    display: none;
}
.otp-header .close-reset-password{
    display: none;
}
.otp-welcome{
    padding: 0 16px;
}
.otp-welcome{
    position: absolute;
    left: 0;
    top: 90px;
    max-width: 186ox;
    font-size: 14px;
    font-weight: 400;
    font-family: SourceSerifPro;
    color: var(--base-800);
}
.otp-welcome  h2{
    font-size: 20px;
    font-family: Marcellus;
    font-weight: 400;
    color: var(--base-900);
    margin: 7px 0;
}
.login-body-tab{
    font-size: 14px;
    font-weight: 400;
    font-family: SourceSerifPro;
}
.otp-body-tab{
    font-size: 14px;
    font-weight: 400;
    font-family: SourceSerifPro;
}
.forget-password-body-tab{
    font-size: 14px;
    font-weight: 400;
    font-family: SourceSerifPro;
}
.forget-password-body-tab .otp-email{
    font-weight: 700;
}
.otp-body-tab .otp-number{
    font-weight: 700;
}
.otp-body-tab .otp-email{
    font-weight: 700;
}
.login-header{
    background: linear-gradient(77.15deg, #E7E4DE 0%, #E0D4BC 95.7%);
    display: block;
    height: 200px;
}
.register-header{
    display: block;
    height: 200px;
    background-size: auto 150%;
}
.register-body{
    padding: 20px 16px;
}
.login-header img{
    position: absolute;
    height: 200px;
    top: 0;
    right: 0;
    display: block;
}
.login-header .close-login{
    display: none;
}
.register-header .close-login{
    display: none;
}
.login-welcome{
    padding: 0 16px;
    position: absolute;
    left: 0;
    top: 90px;
    max-width: 186ox;
    font-size: 14px;
    font-weight: 400;
    font-family: SourceSerifPro;
    color: var(--base-800);
}
.login-welcome  h2{
    font-size: 20px;
    font-family: Marcellus;
    font-weight: 400;
    color: var(--base-900);
    margin: 7px 0;
}
.login-welcome .description{
    max-width: 186px;
}
.register-welcome{
    padding: 0 16px;
}
.otp-welcome{
    padding: 0 16px;
}
.login-body input[name="login-type"]{
    display: none;
}
.login-header-tab{
    padding: 20px 16px 10px 16px;
    display: flex;
    flex-direction: row;
    gap: 20px;
}
.border-login{
    height: 0px;
    display: block;
    width: calc(100% - 32px);
    margin-left: 16px;
    border-top: 1px solid var(--base-400);
}
.login-header-tab > *{
    font-size: 14px;
    font-weight: 400;
    font-family: SourceSerifPro;
    color: var(--base-700);
    cursor: pointer;
}
#whatsapp-login:checked ~ .login-header-tab .whatsapp-header, #email-login:checked ~ .login-header-tab .email-header{
    font-weight: 700;
    font-size: 14px;
    color: var(--deep-rose-gold-500);
    position: relative;
}
#whatsapp-login:checked ~ .login-header-tab .whatsapp-header:after, #email-login:checked ~ .login-header-tab .email-header:after{
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    height: 4px;
    width: 100%;
    background-color: var(--deep-rose-gold-500);;
}
#whatsapp-login:checked ~ .login-body-tab .whatsapp-content{
    display: block;
}
#whatsapp-login:checked ~ .login-body-tab .email-content{
    display: none;
}
#email-login:checked ~ .login-body-tab .email-content{
    display: block;
}
#email-login:checked ~ .login-body-tab .whatsapp-content{
    display: none;
}
.login-body-tab{
    display: block;
    padding: 30px 16px;
}
.otp-body-tab{
    display: block;
    padding: 30px 16px;
}
.reset-body-tab{
    display: block;
    padding: 30px 16px;
}
.forget-password-body-tab{
    display: block;
    padding: 20px 16px 30px 16px;
}

.form-element {
    position: relative;
}
.form-textbox {
    font-size: 17px;
    font-family: SourceSerifPro;
    font-weight: 400;
    line-height: 1.23543;
    letter-spacing: -.022em;
    display: inline-block;
    box-sizing: border-box;
    vertical-align: top;
    width: 100%;
    height: 3.3em;
    margin-bottom: 14px;
    padding-top: 18px;
    padding-left: 16px;
    padding-right: 16px;
    color: #333;
    text-align: left;
    border: 1px solid #d6d6d6;
    border-radius: 4px;
    background: rgba(255,255,255,.8);
    background-clip: padding-box;
}
.form-icon {
    display: none;
    position: absolute;
    top: 3px;
    right: 16px;
}
.form-dropdown {
    font-size: 17px;
    line-height: 1.23543;
    font-weight: 400;
    letter-spacing: -.022em;
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 3.3em;
    color: #333;
    padding: 1.11765rem 2.35294rem 0 .94118rem;
    text-align: left;
    background: rgba(255,255,255,.8);
    border: 1px solid #d6d6d6;
    border-radius: 4px;
    background-clip: padding-box;
    margin-bottom: 14px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    min-height: 32px;
     outline: 0;
     outline-offset:1px;
}
.form-dropdown option {
    color: #333;
}
.form-dropdown ~ .form-icon {
    display: block;
    pointer-events: none;
    color: #888;
    right: 17px;
    font-size: 21px;
    font-weight: 300;
    top: 1rem;
    line-height: 0;
}
.form-dropdown.form-textbox ~ .icon {
    font-size: 24px;
    line-height: 1.16667;
    font-weight: 500;
    letter-spacing: .009em;
    color: #111;
    right: 7px;
    top: 11px;
}
.form-dropdown:focus {
    border-color: #2462b7;
    outline: 0;
    outline: none;
    box-shadow: 0 0 0 3px rgba(131,192,253,.5);
    webkit-appearance: none;
}
.form-textbox:required {
    box-shadow: none;
}
.form-textbox:focus {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-color: #2462b7;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(131,192,253,.5);
}
.is-error .form-textbox {
    border-color: #de071c;
    background: #fef0f0;
    margin-bottom: 0;
    margin-top: 0;
}
.form-label, .form-block-label {
    font-size: 17px;
    line-height: 1.23543;
    font-weight: 400;
    letter-spacing: -.022em;
    display: block;
    position: relative;
    vertical-align: top;
    color: #333;
}
.form-textbox ~ .form-label {
    position: absolute;
    top: 18px;
    left: 17px;
    color: #888;
    pointer-events: none;
    padding: 0;
    z-index: 1;
    transition-timing-function: ease-in;
    transition-duration: .125s;
}
.is-error.form-textbox-counter, .is-error .form-label, .is-error.form-label {
    color: #de071c;
}
.form-textbox ~ .form-label {
    pointer-events: none;
}
.is-error .form-textbox ~ .form-label {
    color: #de071c;
}
.is-error .form-textbox:focus {
    background: rgba(255,255,255,.8);
    border-color: #2462b7;
}
.form-element .eye-rib{
    position: absolute;
    top: 15px;
    right: 20px;
}
.form-element input.checkbox-eye{
    display: none;
}
.form-element input.checkbox-eye ~ .eye-rib .show{
    display: block;
}
.form-element input.checkbox-eye ~ .eye-rib .hide{
    display: none;
}
.form-element input.checkbox-eye:checked ~ .eye-rib .show{
    display: none;
}
.form-element input.checkbox-eye:checked ~ .eye-rib .hide{
    display: block;
}
.form-message-wrapper {
    font-size: 10px;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0;
    display: none;
    margin-top: 8px;
    margin-bottom: 12px;
    letter-spacing: .006em;
    font-family: SourceSerifPro;
}
.radio-wrapper label{
    font-family: SourceSerifPro;
    font-size: 17px;
    font-weight: 400;
    color:var(--base-700);
}
.radio-wrapper ~ .form-label{
    font-size: 14px;
    font-family: SourceSerifPro;
    font-weight: 700;
    color: var(--base-700);
}
.is-error .form-message-wrapper::before{
    font-family: SF Pro Icons,AOS Icons;
    color: inherit;
    display: inline-block;
    font-style: normal;
    font-weight: inherit;
    font-size: inherit;
    line-height: 1;
    text-decoration: underline;
    position: relative;
    z-index: 1;
    alt: '';
}
.is-error .form-message-wrapper::before{
    text-decoration: none;
}
.is-error .form-message-wrapper {
    display: block;
    color: #de071c;
}
.is-error .form-message-wrapper::before {
    display: none;
}
.is-error .form-message-wrapper::before{
/*    content: "";*/
}
.is-error .form-message-wrapper::before {
    padding-right: .3em;
    display: inline-block;
    top: 0;
}
.form-textbox[required]:valid ~ .form-label, .form-textbox:focus ~ .form-label, .form-textbox[placeholder] ~ .form-label, .form-textbox.form-textbox-entered ~ .form-label {
    font-size: 12px;
    line-height: 1.75;
    font-weight: 400;
    letter-spacing: -.01em;
    top: 8px;
    color: #666;
    font-family: SourceSerifPro;
}

.is-error .form-textbox:focus ~ .form-label, .is-error .form-textbox:valid[required] ~ .form-label, .is-error .form-textbox[placeholder] ~ .form-label, .is-error .form-textbox.form-textbox-entered ~ .form-label {
    color: #de071c;
}
.login-body-tab input[type="submit"]{
    border-radius: 4px;
    background-color: var(--navy-blue-500);
    color: #fff;
    padding: 9px 16px;
    border: none;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    font-family: SourceSerifPro;
    margin-top: 20px;
    cursor: pointer;
}
.login-body-tab input[type="submit"]:disabled{
    background-color: var(--navy-blue-200);
}

.register-body input[type="submit"]{
    border-radius: 4px;
    background-color: var(--navy-blue-500);
    color: #fff;
    padding: 9px 16px;
    border: none;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    font-family: SourceSerifPro;
    margin-top: 10px;
    cursor: pointer;
}
.register-body input[type="submit"]:disabled{
    background-color: var(--navy-blue-200);
}

.otp-body-tab input[type="submit"]{
    border-radius: 4px;
    background-color: var(--navy-blue-500);
    color: #fff;
    padding: 9px 16px;
    border: none;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    font-family: SourceSerifPro;
    margin-top: 10px;
    cursor: pointer;
}
.otp-body-tab input[type="submit"]:disabled{
    background-color: var(--navy-blue-200);
}

.reset-body-tab input[type="submit"]{
    border-radius: 4px;
    background-color: var(--navy-blue-500);
    color: #fff;
    padding: 9px 16px;
    border: none;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    font-family: SourceSerifPro;
    margin-top: 10px;
    cursor: pointer;
}
.reset-body-tab input[type="submit"]:disabled{
    background-color: var(--navy-blue-200);
}

.forget-password-body-tab input[type="submit"]{
    border-radius: 4px;
    background-color: var(--navy-blue-500);
    color: #fff;
    padding: 9px 16px;
    border: none;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    font-family: SourceSerifPro;
    margin-top: 10px;
    cursor: pointer;
}
.forget-password-body-tab input[type="submit"]:disabled{
    background-color: var(--navy-blue-200);
}
.login-footer{
    position: relative;
    font-size: 14px;
    font-weight: 600;
    font-family: SourceSerifPro;
    color: var(--base-800);
    text-align: center;
    padding: 15px;
}
.login-footer a{
    color: var(--rose-gold-500);
    text-decoration: none;
}
.notification{
    position: fixed;
    z-index: 100;
    top: 10px;
    left: 50%;
    width: calc(100% - 32px);
    display: none;
    background-color: #fff;
    color: #fff;
    font-size: 14;
    font-weight: 600;
    font-family: SourceSerifPro;
    transform: translateX(-50%);
}
.notification.show{
    display: block;
}
.notification-inner{
    padding: 9px 16px;
    display: flex;
    flex-direction: row;
    gap: 8px;
}
.notification.error{
    background-color: var(--error-600);
}
.notification.success{
    background-color: var(--success-600);
}
.notification.warning{
    background-color: var(--base-800);
}
.notification svg{
    display: none;
}
.notification svg{
    display: none;
}
.notification.error svg.icon-error{
    display: block;
}
.notification.success svg.icon-success{
    display: block;
} 
.notification.warning svg.icon-warning{
    display: block;
} 
.otp-input{
    position: relative;
    margin-top: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}
.otp-input input {
  width: 20%;
  padding: 15px 10px;
  margin: 2px;
  text-align: center;
  font-weight: bold;
  outline: none;
  border: 1px solid var(--grey-light2);
  border-radius: 4px;
  font-family: SourceSerifPro;
  font-size: 20px;
  font-weight: 600;
}
li.menu-account{
    position: relative;
}
#account_profile{
    display: none;
}
.profile-navigation{
    display: none;
    position: absolute;
    width: 480px;
    right: 0;
    top: 45px;
    z-index: 5;
    border: 1px solid var(--navy-blue-400);
}
#account_profile:checked ~ .profile-navigation{
    display: block;
}
.profile-navigation .profile-header{
    background-color: var(--navy-blue-500);
    background-image: url(/wp-content/uploads/2024/11/jaringVector.png);
    background-repeat: repeat;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 15px;
}
.profile-navigation .profile-header .profile-header-left{
    position: relative;
    width: 55%;
    display: flex;
    flex-direction: row;
    gap: 8px;
    justify-content: flex-start;
    align-items: center;
}
.profile-navigation .profile-header .profile-header-left .profile-header-details{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.profile-navigation .profile-header .profile-header-right{
    position: relative;
    width: 45%;
}
.profile-header-details .member-type{
    display: flex;
    flex-direction: row;
    gap: 5px;
    justify-content: center;
    align-items: center;
    font-family: SourceSerifPro;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
}
.profile-header-details h3{
    font-size: 16px;
    font-family: SourceSerifPro;
    font-weight: 700;
    color: #fff;
    padding: 0;
    margin: 0;
}
.profile-header-right .ubs-points{
    display: flex;
    flex-direction: row;
    font-size: 14px;
    font-family: SourceSerifPro;
    font-weight: 600;
    color: #fff;
    align-items: center;
    gap: 8px;
}
.profile-navigation .profile-body{
    background-color: #fff;
    padding: 20px;
    display: flex;
    flex-direction: row;
}
.profile-navigation .profile-body > div{
    width: 50%;
    font-size: 16px;
    font-family: SourceSerifPro;
    font-weight: 400;
    color: var(--base-900);
    display: flex;
    flex-direction: column;
    gap: 18px;
    text-decoration: none;
}
.profile-body-left .profile-item a, .profile-body-right .profile-item a{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: 8px;
    align-items: center;
    text-decoration: none;
    color: var(--base-900);
}

.profile-body-right .profile-item.log-out{
    margin-top: auto;
}
.profile-header-details .member-type img{
    display: inline-block;
    width: 20px;
    height: 20px;
}

/*Largest devices such as desktops (1280px and up) */
@media only screen and (max-width: 80em) {
    #flying-navigation-check:checked ~ footer .footer-navigation .menu-categories svg{
        fill: var(--rose-gold-500);
    }
    #flying-navigation-check:checked ~ footer .footer-navigation .menu-categories span{
        color: var(--rose-gold-500);
    }
    .flying-navigation-menu .child-menu-content .tab h3{
        grid-column:1/4;
        font-size: 18px;
        font-weight: 400;
        font-family: SourceSerifPro;
        margin: 15px 0 0 0;
        padding: 0;
    }
    .ui-loader-default{
        display: none;
    }
    body .header-wrapper a.logo{
        display: none;
    }
    body.home .header-wrapper a.logo{
        display: block;
    }

    body{
        padding-top: 84px;
        padding-bottom: 73px;
    }

    body.home{
        padding-top: 108px;
        padding-bottom: 73px;
    }

    .product-card[data-discount-type="1"] .prices del ~ del {
        display: none;
    }
    .mobile{
        display: block;
    }
    .desktop{
        display: none;
    }
    .section {
      margin-bottom: 10px;
      padding-bottom: 0;
    }
    .section:not( .for-slide, #best-deals, #best-seller ) {
        margin-left: 18px;
        margin-right: 18px;
        width: calc(100% - 36px);
    }
    .section.mobile{
        display: block;
    }
     header .header-wrapper{
        max-width: calc(100vw - 40px);
        height: 75px;
        max-height: unset;
        display: flex;
        justify-content: center;
    }
    header{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        max-height: unset;
        z-index: 3;
    }
    .menu-top-right{
        flex-direction:row-reverse;
    }
    .header-wrapper .menu-top{
        display: none;
    }
    .menu-top-right .menu-search{
        display: none;
    }
    .menu-top-right .menu-account{
        display: none;
    }
    .menu-top-right .menu-account-mobile{
        display: block;
        margin-right: 0;
    }
    body.home .mobile-search{
        position: fixed;
        top: 72px;
        z-index: 3;
        width: 100%;
    }
    body:not(.home) .mobile-search{
        position: fixed;
        top: 22px;
        z-index: 3;
        width: calc(100% - 115px);
        left: 35px;
    }
    body:not(.home) header .header-wrapper{
        height: 85px;
    }
    .header-wrapper a.logo img{
        width: 110px;
        height: auto;
    }
    .title.mobile{
        display: block;
    }
    .title.mobile ~ .title{
        display: none;
    }
    .section-content .slider li a{
        width: auto;
        display: block;
        height: 100%;
    }
    .section-content .slick-dots{
        position: relative;
        bottom: -14px;
        margin: 0;
        padding: 0;
    }
    .section-content .slick-dots .slick-active button{
        width: 16px;
        border-radius: 4px;
        background-color: var(--exploration-rose-gold2);
    }
    .section.dark-background{
        background-color: inherit;
    }

    .section-content .slider li a picture {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
    }
    .section-content .slider li a img{
        width: 100%;
        height: calc(100% - 20px);
        border-radius: 3px;
        transition: .5s ease-out all;
    }
    .section-content .slider li.slick-active a img{
        width: 100%;
        height: auto;
        border-radius: 3px;
    }
    .section-content li.slick-slide{
        padding: 0 3px;
    }
    .section.member{
        position: relative;
        display: flex;
        width: 100%;
        flex-direction: row;
        font-family: SourceSerifPro;
        font-weight: 400;
        font-size: 14px;
    }
    .member-points b, .member-type b{
        display: block;
        font-weight: 700;
    }
    .section.member .member-type, .section.member .member-points{
        display: flex;
        position: relative;
        flex-direction: row;
        width: calc(50% - 32px);
        padding: 16px;
        align-items: center;
        justify-content: flex-start;
    }
    .section.member .member-type .member-type-icon{
        width: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .section.member .member-points .member-points-icon{
        width: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .member-type-icon img{
        width: 32px;
        height: auto;
    }
    .member-points-icon img{
        width: 32px;
        height: auto;
    }
    svg.mobile-search-icon{
        position: absolute;
        left:27px;
        top: 50%;
        transform: translateY(-50%);
    }
    input.mobile-search-input[name="s"]{
        display: block;
        width: calc(100% - 75px);
        margin: 0 auto;
        height: auto;
        font-size: 14px;
        padding: 11px 14px 11px 30px;
        border-radius: 2px;
        border: 1px solid rgba(224, 224, 224, 1);
        box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.15);
        outline: none;
    }
    body:not(.home) .menu-top-right li.menu-notification{
        display: none;
    }
    a.go-home{
        position: fixed;
        display: block;
        left: 20px;
        top: 34px;
    }
    body.home a.go-home{
        display: none;
    }
    .half-strip{
        position: absolute;
        left: 0;
        top: 0;
        z-index: -1;
        width: 100%;
        height: 50%;
        background-color: var(--header-background-color);
    }
    .section#jelajah-kategori .section-content::after {
        display: none;
    }
    .section#jelajah-kategori .title.mobile{
        font-size: 18px;
        color: var(--exploration);
    }
    .section-header{
        height: 18px;
    }
    .section-header > .view-all{
        font-size: 14px;
    }
    .section-header > .view-all svg{
        display: none;
    }

    #jelajah-kategori ul.catalog{
        flex-wrap: wrap;
        gap: 15px;
    }
    #jelajah-kategori ul.catalog li{
        width: calc(33.3333% - 10px);
    }
    #jelajah-kategori ul.catalog li:before{
        content: "";
        display: block;
        padding-bottom: 100%;
    }
    #jelajah-kategori ul.catalog li a{
        position: absolute;
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        top: 0;
        left:0;
        overflow: hidden;
    }
    #jelajah-kategori ul.catalog li span{
        font-size: 14px;
        bottom: 10px;
    }
    .section.trending-collection a.main-catalog{
        display: none;
    }
    .section.trending-collection .section-header{
        padding-top: 0;
    }
    .section.trending-collection .section-header span.line{
        display: none;
    }
    .section.trending-collection .section-header h2:before, .section.trending-collection .section-header h2:after{
        display: none;
    } 
    .section.trending-collection .section-header > .title.center{
        position: relative;
        left:auto;
        transform:unset;
        z-index: 1;
        font-size: 18px;
        padding: 0;
    }
    .section.trending-collection .section-content .catalog{
        width: 100%;
        gap: 16px;
    }
    .section.trending-collection .section-content .catalog li{
        width: 100%;
        height: 160px;
        overflow: hidden;
        position: relative;
    }
    .section.trending-collection .section-content ul.catalog li a{
        position: absolute;
        bottom: 0;
    }
    #best-deals.section .section-header .subtitle{
        display: none;
    }
    #best-deals.section .section-header .title{
        font-size: 18px;
        color: #fff;
        padding-left: 20px;
    }
    #best-deals.section.half-light-background .section-content::after{
        background-color: var(--deep-rose-gold-500);
    }
    #best-deals .product--countdown span.tracking-wide{
        display: none;
    }
    #best-deals .product--countdown .product-countdown-block .clock-item:nth-child(3) .icon{
        display: none;
    }
    #best-deals .product--countdown .product-countdown-block .clock-item:nth-child(4){
        display: none;
    }
    #best-deals .section-header > .view-all{
        margin-top: 0;
        color: #fff;
        margin-right: 20px;
    }
    #best-deals .section-header.best-deal{
        padding-top: 30px;
    }
    #best-deals .product-countdown-block .clock-item .num{
        background-color: #fff;
        color: var(--base-900);
        font-family: SourceSerifPro;
        font-weight: 600;
        font-size: 12px;
    }
    #best-deals .product-countdown-block .clock-item .icon{
        color: #fff;
    }
    #best-deals .section-content ul.products{
        gap: 12px;
    }
    #best-deals .section-content ul.products li{
        width: auto;
    }
    #best-deals .section-content ul.products li a{
        width: auto;
    }
    #best-deals .section-content ul.products li a img{
        width: 134px;
        height: auto;
        margin: 3px 3px 6px 3px;
        display: block;
    }
    #best-deals .section-content{
        max-width: unset;
        overflow: scroll;
        margin-left: 20px;
        -ms-overflow-style: none;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
    }
    #best-deals .section-content::-webkit-scrollbar {
        display: none; /* for Chrome, Safari, and Opera */
    }
    .product-card .sku{
        padding: 2px 0px 2px 8px;
        background-color: var(--gold-100);
        border-radius: 0px 10px 10px 0px;
        display: inline-block;
    }
    .product-card .sku .purity{
        padding: 2px 8px 2px 8px;
        border-radius: 0px 10px 10px 0px;
        background-color: var(--gold-400);
        color: #fff;
    }
    #best-deals .section-content ul.products li a.product-card{
/*        height: 310px;*/
        min-height: 310px;
    }
    .section.half-light-background .section-header.best-deal ~ .section-content::after {
      height: calc(50% + 24px);
    }
    
    #best-seller .section-header .title{
        font-size: 18px;
        font-weight: 400;
        left: 0;
        transform: none;
        padding: 0;
        margin-left: 20px;
    }
    #best-seller .section-header .line{
        display: none;
    }
    #best-seller .section-header .title::after, #best-seller .section-header .title::before{
        display: none;
    }
    #best-seller .section-content{
        max-width: unset;
        overflow: scroll;
        margin-left: 20px;
        -ms-overflow-style: none;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
        position: relative;
    }
    #best-seller .section-content ul.products{
        gap: 12px;
    }
    #best-seller .section-content ul.products li{
        width: auto;
    }
    #best-seller .section-content ul.products li a{
        width: auto;
    }
    #best-seller .section-content ul.products li a img{
        width: 134px;
        height: auto;
        margin: 3px 3px 6px 3px;
        display: block;
    }
    #best-seller .section-content ul.products li a.product-card {
      height: 310px;
      min-height: 310px;
    }
    #best-seller .section-content .view-all.button{
        display: none;
    }
    #best-seller .section-header a.view-all{
        padding-right: 20px;
    }
    ul.products:after{
        content: '';
        width: 10px;
        display: block;
        height: 100px;
    }
    #gallery .section-header .line{
        display: none;
    }
    #gallery .section-header .title{
        font-size: 18px;
        left: 0;
        transform: unset;
    }
    #gallery .section-header .title:before, #gallery .section-header .title:after{
        display: none;
    }
    #gallery .section-content{
        flex-wrap: wrap;
    }
    #gallery .section-content > a, #gallery .section-content > ul.gallery{
        width: 100%;
    } 
    #gallery .section-content > ul.gallery .gallery-item{
        width: calc(50% - 5px);
    }
    #gallery .section-content > ul.gallery .gallery-item .product-mini-card{
        display: none;
    }
    ul.footer-navigation-menu{
        list-style-type: none;
        display: none;
        gap: 0;
        flex-direction: row;
        background-color: var(--exploration);
        padding: 10px 0;
        margin: 0;
    }
    body.home ul.footer-navigation-menu{
        display: flex;
    }

    ul.footer-navigation-menu li{
        width: 20%;
        min-height: 53px;
        display: flex;
    }
    ul.footer-navigation-menu li > a, ul.footer-navigation-menu li > label{
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap:5px;
        cursor: pointer;
    }
    ul.footer-navigation-menu li a .title, ul.footer-navigation-menu li label .title{
        font-size: 12px;
        font-family: Marcellus;
        color: #fff;
        position: relative;
    }
    ul.footer-navigation-menu li a:hover svg{
        fill: var(--rose-gold-500) ;
    }
    ul.footer-navigation-menu li a:hover .title{
        color: var(--rose-gold-500);
    }
    ul.footer-navigation-menu li a:hover .title:after{
        content: '';
        background-color: var(--rose-gold-500);
        height: 2px;
        width: 16px;
        position: absolute;
        bottom: -5px;
        left: 50%;
        transform: translateX(-50%);
    }

    body.home footer a.menu-home svg{
        fill: var(--rose-gold-500);
    }
    body.home footer a.menu-home .title{
        color: var(--rose-gold-500);
    }
    body.home footer a.menu-home .title:after{
        content: '';
        background-color: var(--rose-gold-500);
        height: 2px;
        width: 16px;
        position: absolute;
        bottom: -5px;
        left: 50%;
        transform: translateX(-50%);
    }
    .flying-navigation-menu{
        position: fixed;
        left: 0;
        top: 75px;
        width: 100vw;
        height: calc(100vh - 143px);
        z-index: 3;
        display: none;
    }
    .header-wrapper{
        position: fixed;
        width: 100%;
        top: 0;
        left: 0;
    }
    .footer-navigation {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 3;
    }
    #flying-navigation-check:checked ~ header{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
    }
    #flying-navigation-check:checked ~ header .header-wrapper a.logo{
        visibility: hidden;
    }
    #flying-navigation-check:checked ~ header .header-wrapper .menu-top-right .menu-notification{
        display: none;
    }
    #flying-navigation-check:checked ~ div:not(.mobile-search){
       display: none;
    }
    #flying-navigation-check:checked ~ .mobile-search{
        position: fixed;
    left: 3px;
    width: calc(100% - 100px);
    display: block;
    top: 16px;
    }
    #flying-navigation-check:checked ~ footer .flying-navigation-menu{
        display: flex;
    }
    .flying-navigation-menu.mobile input[type="radio"]{
        display: none;
    }
    .flying-navigation-menu.mobile .child-menu-sidebar{
        width: 110px;
        display: flex;
        background-color: var(--base-200);
    }
    .flying-navigation-menu.mobile .child-menu-content{
        width: calc(100vw - 110px);
        display: block;
        padding: 10px;
        overflow-y: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
    }
    .flying-navigation-menu .child-menu-sidebar ul{
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    .flying-navigation-menu .child-menu-sidebar ul li{
        font-size: 13px;
        font-family: SourceSerifPro;
        font-weight: 400;
        text-align: left;
        height: 48px;
        padding-left: 8px;
        display: flex;
        align-items: center;
    }
    .flying-navigation-menu .child-menu-sidebar ul li label{
        cursor: pointer;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    }
    .flying-navigation-menu .child-menu-content .tab{
        display: none;
        grid-template-columns: 1fr 1fr 1fr;
        width: 100%;
        gap: 5px;
        row-gap: 20px;
    }
    .flying-navigation-menu .child-menu-content .tab a{
        display: block;
        width: auto;
        text-align: center;
        text-decoration: none;
        font-size: 12px;
        font-family: Marcellus;
    }
    .flying-navigation-menu .child-menu-content .tab a img{
        margin-bottom: 3px;
    }
    input[name="child-menu-mobile"]:nth-child(1):checked ~ .child-menu-sidebar li:nth-child(1){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }
    input[name="child-menu-mobile"]:nth-child(2):checked ~ .child-menu-sidebar li:nth-child(2){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }
    input[name="child-menu-mobile"]:nth-child(3):checked ~ .child-menu-sidebar li:nth-child(3){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }
    input[name="child-menu-mobile"]:nth-child(4):checked ~ .child-menu-sidebar li:nth-child(4){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }
    input[name="child-menu-mobile"]:nth-child(5):checked ~ .child-menu-sidebar li:nth-child(5){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }
    input[name="child-menu-mobile"]:nth-child(6):checked ~ .child-menu-sidebar li:nth-child(6){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }
    input[name="child-menu-mobile"]:nth-child(6):checked ~ .child-menu-sidebar li:nth-child(7){
        display: flex;
        background-color: var(--rose-gold-100);
        border-right: 4px solid var(--deep-rose-gold-500);
        color: var(--deep-rose-gold-500);
        font-weight: 700;
        box-sizing: border-box;
    }

    input[name="child-menu-mobile"]:nth-child(1):checked ~ .child-menu-content .tab:nth-child(1){
        display: grid;
    }
    input[name="child-menu-mobile"]:nth-child(2):checked ~ .child-menu-content .tab:nth-child(2){
        display: grid;
    }
    input[name="child-menu-mobile"]:nth-child(3):checked ~ .child-menu-content .tab:nth-child(3){
        display: grid;
    }
    input[name="child-menu-mobile"]:nth-child(4):checked ~ .child-menu-content .tab:nth-child(4){
        display: grid;
    }
    input[name="child-menu-mobile"]:nth-child(5):checked ~ .child-menu-content .tab:nth-child(5){
        display: grid;
    }
    input[name="child-menu-mobile"]:nth-child(6):checked ~ .child-menu-content .tab:nth-child(6){
        display: grid;
    }
    input[name="child-menu-mobile"]:nth-child(6):checked ~ .child-menu-content .tab:nth-child(7){
        display: grid;
    }
}
/* Large devices such as laptops (1024px and up) */
@media only screen and (max-width: 64em) {

}
/* Medium devices such as tablets (768px and up) */
@media only screen and (max-width: 45em) {
    .login-footer{
        position: absolute;
        text-align: center;
        bottom: 30px;
        font-size: 14px;
        font-weight: 600;
        font-family: SourceSerifPro;
        width: 100%;
    }
    .login-header .close-login{
        display: block;
        position: absolute;
        left: 20px;
        top: 50px;
    }
    .register-header .close-register{
        display: block;
        position: absolute;
        left: 20px;
        top: 50px;
    }
    .flying-login-menu{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .flying-register-menu{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .login-welcome  h2{
        font-size: 20px;
        font-family: Marcellus;
        font-weight: 400;
        color: var(--base-900);
        margin: 7px 0;
    }
    .login-welcome .description{
        max-width: 186px;
    }
    .login-welcome{
        position: absolute;
        left: 0;
        top: 90px;
        max-width: 186ox;
        font-size: 14px;
        font-weight: 400;
        font-family: SourceSerifPro;
        color: var(--base-800);
    }

    .register-welcome  h2{
        font-size: 20px;
        font-family: Marcellus;
        font-weight: 400;
        color: var(--base-900);
        margin: 7px 0;
    }
    .register-welcome .description{
        max-width: 186px;
    }
    .register-welcome{
        position: absolute;
        left: 0;
        top: 90px;
        max-width: 186ox;
        font-size: 14px;
        font-weight: 400;
        font-family: SourceSerifPro;
        color: var(--base-800);
    }

    /*    */
    .otp-header .close-otp{
        display: block;
        position: absolute;
        left: 20px;
        top: 50px;
    }
    .otp-header .close-otp-email{
        display: block;
        position: absolute;
        left: 20px;
        top: 50px;
    }
    .otp-header .close-forget-password{
        display: block;
        position: absolute;
        left: 20px;
        top: 50px;
    }
    .otp-header .close-reset-password{
        display: block;
        position: absolute;
        left: 20px;
        top: 50px;
    }
    .flying-otp-menu{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .flying-otp-email{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .flying-reset-password{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .flying-reset-password-success{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .flying-forget-password{
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        transform: none;
    }
    .otp-welcome  h2{
        font-size: 20px;
        font-family: Marcellus;
        font-weight: 400;
        color: var(--base-900);
        margin: 7px 0;
    }
    .otp-welcome .description{
        max-width: 186px;
    }
    .flying-reset-password .otp-welcome .description{
        max-width: none;
    }
    .otp-welcome{
        position: absolute;
        left: 0;
        top: 90px;
        max-width: 186ox;
        font-size: 14px;
        font-weight: 400;
        font-family: SourceSerifPro;
        color: var(--base-800);
    }
}