/* Global styles — tüm sayfalarda yüklenir */
.camp_popup,
.fancybox-button div,
body,
html {
    height: 100%
}

.Input label,
[fr=Share] .link>.link-text {
    text-overflow: ellipsis;
    white-space: nowrap
}

*,
.fancybox-container,
.fancybox-thumbs {
    -webkit-tap-highlight-color: transparent
}

*,
.fancybox-container *,
.loaderComment {
    box-sizing: border-box
}

.MobileAddition .Content .Products .ProductItem .Info .PriceBox .SalePrice .Info,
body,
p {
    margin: 0
}

.PopClosed,
.d-none,
section[Mod=Nav] .SubNav>.NavItem>.Multiple_SubNav:empty {
    display: none !important
}

.Btn,
.module-005 .product-section .product-detail .price .new-price>span,
section[L=Head] .Mod.StandartHead>.Container .BagCounter>span:first-child,
section[L=Head] .Mod.StandartHead>.Container .BagCounter>span:nth-child(2) {
    font-size: 13px
}

.AddressForm,
.AddressForm .Form .BtnList.show .Btn,
.Container,
.Container.WFULL,
.Empty,
.FilterBarBottom>.Left,
.MobileAddition .Content .Title span,
.Mod,
.Page[PageType=Success],
.Page[PageType=Success]>.Container .OrderDetail .Addition,
.Page[PageType=Success]>.Container .OrderDetail .ProductList,
.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product,
.Page[PageType=Success]>.Container .Qr .Content .App>img,
.Page[PageType=View] .Information .FeaturesBar .Feature,
.Page[PageType=View] .Information .VariationArea,
.Page[PageType=View] .Information>.InfoBar,
.Page[PageType=View] .Information>.InfoBar .Info,
.PopContent[mod=StoreStockView]>.Step[S="0"] .SizeList .Btn,
.PopupBox .PopClosed,
.PopupBox.RightPop .PopClosed,
.PopupBox>.Document>.Container,
.ProductOtherViewContainer .OtherProductView,
.ProductOtherViewContainer .OtherProductView>.Container,
.ProductOtherViewContainer .OtherProductView>.Container .Group,
.ProductOtherViewContainer .OtherProductView>.Container .Group .List,
.col-12,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>.BtnList>.Btn>span,
.fr_comment_image_area_content,
.fr_comment_image_area_content .List,
.module-005,
[Grid="1122"] .ProductItem:nth-child(6n+1),
[Grid="1122"] .ProductItem:nth-child(6n+2),
[Grid="201"] .ProductItem:nth-child(+3n),
[Grid="201f"] .ProductItem:nth-child(+3n),
[Mod=fr_comment] .fr_comment_list,
[Mod=fr_comment] .fr_comment_rating>i,
[PageType=Aboutus] .ContentArea .View .Form[Type=Contact],
[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Info .Item:first-child,
[PageType=Aboutus] .ContentArea .View .Form[Type=Human],
[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale],
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Photo>img,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery>div>img,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery[Count="1"]>div,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery[Count="3"]>div:nth-child(3),
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem .Gallery img,
[PageType=Account] .OrderItem>.Area .Gallery>div>img,
[PageType=Account] .OrderItem>.Area .Gallery[Count="1"]>div,
[PageType=Account] .OrderItem>.Area .Gallery[Count="3"]>div:nth-child(3),
[PageType=Account] .OrderItem>.Area .InfoBar .Content .Info .OrderNumber>span:first-child,
[PageType=Account] .OrderItem>.Area .InfoBar .Content .Info .OrderNumber>span:nth-child(2),
[PageType=Account] .OrderItem>.Area .InfoBar .Status .Arrows>svg,
[PageType=Account] .OrderItem>.Area .InfoBar .Status .StatuBar>span:nth-child(2),
[PageType=Account] .Table table tbody,
[PageType=Account] .Table table tbody tr,
[PageType=Account] .Table table thead,
[PageType=Account] .Table table thead tr,
[PageType=Account] .ViewTab[T="#sifre"]>.Container,
[PageType=Account] .ViewTab[T="#siparislerim"]>.Container,
[PageType=Account] [P=Gift] .GiftItem .Info .Left,
[PageType=Account] [P=Gift] .GiftItem .Information .Date span,
[PageType=Stores],
[PageType=Stores] .Content .Detail .Item .Infos .Address>span,
[PageType=Stores] .Content .Detail .Item .Infos .Hour>span,
[PageType=Stores] .Content .Detail .Item .Infos .Phone>span,
[fr=OrderDetail] .Address>span:nth-child(2),
[fr=OrderDetail] .OrderNumber>span,
[fr=OrderDetail] .Payment>span:nth-child(2),
body.WFULL .Container:not(.WFULL):not(.W1180):not(.W1320):not(.W1440):not(.W1600),
form,
html {
    width: 100%
}

body {
    padding: 0;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: 300;
    -webkit-overflow-scrolling: touch;
    font-variant-ligatures: no-common-ligatures;
    text-rendering: optimizelegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    user-select: none
}

body.Query>:not(.PageLoading)>* {
    pointer-events: none
}

body.Query [Mod=Search]>* {
    filter: none
}

.fancybox-is-open .fancybox-stage,
body.AdditionView,
body.compensate-for-scrollbar {
    overflow: hidden
}

body.Query:before {
    content: "";
    display: flex;
    background-image: url('/NewWebSites/img/body_loading.svg?v45');
    width: 32px;
    height: 22px;
    position: fixed;
    left: 38px;
    top: 46px;
    background-size: 32px;
    z-index: 20
}

body.PopupOpen,
body.openNav {
    overflow: hidden !important;
    overscroll-behavior: contain;
    position: relative !important;
    padding-left: 0;
    padding-top: 0;
    padding-right: 0;
    margin-left: 0;
    margin-top: 0;
    margin-right: 15px !important
}

* {
    text-decoration: none;
    color: inherit
}

div {
    unicode-bidi: isolate
}

@keyframes shake {

    0%,
    100% {
        transform: translateX(0)
    }

    25%,
    75% {
        transform: translateX(-5px)
    }

    50% {
        transform: translateX(5px)
    }
}

.alertfunc {
    cursor: pointer;
    animation: .3s ease-in-out 2 shake
}

.camp_popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999999999;
    background: #0000006b;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px
}

.Page[PageType=View] .GalleryBar>.List>.Item,
.camp_popup .camp_popupContent,
.hov03,
.hov05,
.hov06,
.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content,
[PageLoad="1"],
[fr=Share] .link {
    position: relative
}

.PopupBox.Center .Closed,
.camp_popup .camp_popupContent .camp_popupClosed {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer
}

.Input .Btn.PasswordEye.show>svg[fr=open],
.Input .Btn.PasswordEye>svg[fr=closed],
.Input input:focus~button,
.Input input:not(:placeholder-shown)~button,
.Input select:focus~button,
.Input select:not(:placeholder-shown)~button,
.Input textarea:not(:placeholder-shown)~button,
.Input.view button.passwordViewer>svg[fr="{passwordHide}"],
.NotificationBar.show,
.camp_popup .camp_popupContent .camp_popupImage,
.camp_popup .camp_popupContent .camp_popupImage>img,
.system-notification-item div+div.Sh1,
[PageType=Aboutus] .Nav .SearchBox.Load .Closed,
[PageType=Aboutus] .Nav .SearchBox.Loading .Loading,
[PageType=Account] .Container[P=Balance] .Title,
[PageType=Account] .Container[P=Payment] .Title,
[PageType=Account] .Container[P=Return] .OrderDetail,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action .InputBox,
[PageType=Account] .Container[P=Return] .OrderDetail .Title .Number,
[PageType=Account] .Container[P=Return] .OrderDetail .Title .Text,
[PageType=Account] .TabView.active,
[PageType=SupportDetail] .QuestionArea .SearchBox.Load .Closed,
[PageType=SupportDetail] .QuestionArea .SearchBox.Loading .Loading,
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="0"] .Btn[fr=commentAdd] {
    display: block
}

.Container.WFULL,
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .BtnList .Btn {
    max-width: 100%
}

.Container.W1600,
body.W1600 .Container:not(.WFULL):not(.W1180):not(.W1320):not(.W1440):not(.W1600) {
    width: 100%;
    max-width: 1600px
}

.Container.W1320,
body.W1320 .Container:not(.WFULL):not(.W1180):not(.W1320):not(.W1440):not(.W1600) {
    width: 100%;
    max-width: 1320px
}

.Container.W1440,
body.W1440 .Container:not(.WFULL):not(.W1180):not(.W1320):not(.W1440):not(.W1600) {
    width: 100%;
    max-width: 1440px
}

.Container.W1180,
body.W1180 .Container:not(.WFULL):not(.W1180):not(.W1320):not(.W1440):not(.W1600) {
    width: 100%;
    max-width: 1180px
}

.fancybox-button:hover,
body[SlideTheme=WHITE] .Mod3_Group_UserBar_Btn>svg {
    color: #fff
}

body[SlideTheme=WHITE] .Mod3_Group_UserBar_Btn>svg>path {
    fill: #fff
}

span.currIco {
    display: inline !important
}

.system-notification-item {
    position: fixed;
    bottom: -100%;
    left: 50%;
    background: #000;
    font-size: 13px;
    color: #fff;
    padding: 12px;
    transition: .3s;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1000
}

.Btn.Black,
.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText:hover,
.system-notification-item.info,
.system-notification-item.success {
    background: #000;
    color: #fff
}

.system-notification-item.error {
    background: red;
    color: #fff
}

.system-notification-item.show {
    bottom: 20px;
    transition: .3s
}

.system-notification-item div+div {
    text-decoration: underline;
    cursor: pointer;
    margin-left: 40px
}

.Input .Btn.PasswordEye.show>svg[fr=closed],
.Input .Btn.PasswordEye>svg,
.Input .Btn.PasswordEye>svg[fr=open],
.Input.view button.passwordViewer>svg[fr="{passwordView}"],
.MobileAddition .Content .Addition .Item[V="0"],
.MobileAddition .Content .Addition .Items .Item.Products,
.Page[PageType=Success]>.Container .OrderDetail .Addition .Item.Products,
.Page[PageType=Success]>.Container .OrderDetail .Addition .Item[V="0"],
.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox[DiscountRate="0"] .SalePrice,
.Page[PageType=Success]>.Container .PaymentInformationP3 .Btn>svg,
.Page[PageType=Success]>.Container .Qr .Content .App.Mobil,
.Page[PageType=View] .Information .Btn>div:last-child,
.Page[PageType=View] .Information .Btn[fr=alternative_preview_btn][data-id="0"],
.Page[PageType=View] .Information .Desc:empty,
.Page[PageType=View] .Information .VariationArea .Colors .ColorItem>.Name,
.Page[PageType=View] .Information .VariationArea .SelectedNote:empty,
.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox[DiscountRate="0"] .SalePrice .Info>.DiscountRate.show,
.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox[OldPrice="0"] .OldPrice,
.PopContent[fr=Loading].isPay:before,
.ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-next:after,
.ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-prev:after,
.card-js .icon,
[PageType=Aboutus] .ContentArea .Title:empty,
[PageType=Aboutus] .ContentArea+.CustomerBox,
[PageType=Aboutus] .Nav .SearchBox .MobilNav,
[PageType=Aboutus] .SearchArea .NavList,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item:not([data-status="1"]) .Information .Success,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item:not([data-status="99"]) .Information .Return,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="1"] .Information .Action,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="1"] .Note,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="99"] .Information .Action,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="99"] .Note,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery[Count="1"]>div:last-child,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery[Count="2"]>div:last-child,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery[Count="3"]>div:last-child,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery[Count="4"]>div:last-child,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item:not([data-status="0"]) .BtnList .Btn[fr=View],
[PageType=Account] .Container[P=Return].New .TabList,
[PageType=Account] .Container[P=Support] table tr td div>span,
[PageType=Account] .LeftArea .Navs .Item>svg,
[PageType=Account] .OrderItem>.Area .Gallery[Count="1"]>div:last-child,
[PageType=Account] .OrderItem>.Area .Gallery[Count="2"]>div:last-child,
[PageType=Account] .OrderItem>.Area .Gallery[Count="3"]>div:last-child,
[PageType=Account] .OrderItem>.Area .Gallery[Count="4"]>div:last-child,
[PageType=Account] [P=Gift] .TabView[T=passiveGift] .GiftItem .StatuBar>svg,
[PageType=Account] [P=Payment] .Table table tbody td>span,
[fr=OrderDetail] .Addition>.Item.Products,
[fr=OrderDetail] .Addition>.Item[V="0"],
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="0"] .Comment,
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Btn[fr=commentAdd],
section[Mod=Nav] .SubNav>.NavItem>.Box .Icon {
    display: none
}

.NavItem,
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabList .TabItem.active,
.fr_comment_CommentAreaHeaderBtn:hover {
    color: #000
}

.NavItem[rowb="1"] {
    margin-bottom: 5px
}

.NavItem[rowb="2"] {
    margin-bottom: 15px
}

.NavItem[rowb="3"],
section[Mod=Nav] .SubNav>.NavItem[rowb="3"] {
    margin-bottom: 40px
}

.NavItem[rowb="4"],
section[Mod=Nav] .SubNav>.NavItem[rowb="4"] {
    margin-bottom: 50px
}

.NavItem[rowb="5"] {
    margin-bottom: 60px
}

.NavItem[lasticon="1"] .Icon.Right,
section[Mod=Nav] .SubNav>.NavItem[lasticon="1"] .Icon.Right {
    display: block;
    font-size: 10px;
    vertical-align: super;
    padding-left: 8px;
    margin-top: -11px;
    font-weight: inherit
}

.NavItem[firsticon="1"] .Icon.Left,
section[Mod=Nav] .SubNav>.NavItem[firsticon="1"] .Icon.Left {
    display: block;
    font-size: 10px;
    vertical-align: super;
    padding-right: 8px;
    margin-top: -11px;
    font-weight: inherit
}

.AddressForm .Form .Invoice .TypeBoxForm.active,
.AddressForm.Invoice .Form .Invoice,
.FilterBarBottom>.Right .FilterGrid>div.active,
.Input .Information>.Icon.show+.Wind,
.MobileAddition .Content .Addition .Item.Delivered[V="0"],
.Page[PageType=Success]>.Container .Qr .Content .App.Desktop,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Size.show,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show,
[Mod=fr_comment] .fr_comment_arrows.show,
[Mod=fr_comment] .fr_comment_footer.show,
[Mod=fr_comment] .fr_comment_list_item_size.show,
[Mod=fr_comment] .fr_comment_list_item_text_more.show,
[PageType=Account] .Container[P=Return] [T=newReturn] .ReturnInformation .Desc span,
[PageType=Account] .OrderItem>.Area .InfoBar .Status .StatuBar,
[fr=OrderDetail] .Addition>.Item.Delivered[V="0"],
section[Mod=Nav] .UserBar .Btn[fr=Bag]:not([Q="0"])>div,
section[Mod=Nav] .UserBar .Btn[fr=Bag]>div>span {
    display: flex
}

.currIco {
    margin-left: 2px
}

[PageLoad="1"]:empty {
    position: relative;
    background: 0 0 !important;
    width: var(--plw, 100%);
    height: var(--plh, 17px);
    border: 0 !important
}

[PageLoad="1"]:empty::before {
    content: "";
    position: absolute;
    inset: 0;
    display: block;
    width: var(--plw, 100%);
    height: var(--plh, 17px);
    border-radius: 4px;
    opacity: .8;
    pointer-events: none;
    background: linear-gradient(90deg, #e4e4e4 25%, #f5f5f5 50%, #e9e9e9 75%);
    background-size: 400% 100%;
    background-position: 200% 0;
    animation: 2s linear infinite loadingGradient
}

@keyframes loadingGradient {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

.d-flex {
    -ms-box-orient: horizontal;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap
}

@media(min-width: 576px) {

    .c-xs-1,
    .c-xs-10,
    .c-xs-11,
    .c-xs-12,
    .c-xs-2,
    .c-xs-3,
    .c-xs-4,
    .c-xs-5,
    .c-xs-6,
    .c-xs-7,
    .c-xs-8,
    .c-xs-9 {
        float: left
    }

    .c-xs-12 {
        width: 100%
    }

    .c-xs-11 {
        width: 91.66666667%
    }

    .c-xs-10 {
        width: 83.33333333%
    }

    .c-xs-9 {
        width: 75%
    }

    .c-xs-8 {
        width: 66.66666667%
    }

    .c-xs-7 {
        width: 58.33333333%
    }

    .c-xs-6 {
        width: 50%
    }

    .c-xs-5 {
        width: 41.66666667%
    }

    .c-xs-4 {
        width: 33.33333333%
    }

    .c-xs-3 {
        width: 25%
    }

    .c-xs-2 {
        width: 16.66666667%
    }

    .c-xs-1 {
        width: 8.33333333%
    }

    .c-xs-pull-12 {
        right: 100%
    }

    .c-xs-pull-11 {
        right: 91.66666667%
    }

    .c-xs-pull-10 {
        right: 83.33333333%
    }

    .c-xs-pull-9 {
        right: 75%
    }

    .c-xs-pull-8 {
        right: 66.66666667%
    }

    .c-xs-pull-7 {
        right: 58.33333333%
    }

    .c-xs-pull-6 {
        right: 50%
    }

    .c-xs-pull-5 {
        right: 41.66666667%
    }

    .c-xs-pull-4 {
        right: 33.33333333%
    }

    .c-xs-pull-3 {
        right: 25%
    }

    .c-xs-pull-2 {
        right: 16.66666667%
    }

    .c-xs-pull-1 {
        right: 8.33333333%
    }

    .c-xs-pull-0 {
        right: auto
    }

    .c-xs-push-12 {
        left: 100%
    }

    .c-xs-push-11 {
        left: 91.66666667%
    }

    .c-xs-push-10 {
        left: 83.33333333%
    }

    .c-xs-push-9 {
        left: 75%
    }

    .c-xs-push-8 {
        left: 66.66666667%
    }

    .c-xs-push-7 {
        left: 58.33333333%
    }

    .c-xs-push-6 {
        left: 50%
    }

    .c-xs-push-5 {
        left: 41.66666667%
    }

    .c-xs-push-4 {
        left: 33.33333333%
    }

    .c-xs-push-3 {
        left: 25%
    }

    .c-xs-push-2 {
        left: 16.66666667%
    }

    .c-xs-push-1 {
        left: 8.33333333%
    }

    .c-xs-push-0 {
        left: auto
    }
}

@media(min-width: 1380px) {

    .c-xl-1,
    .c-xl-10,
    .c-xl-11,
    .c-xl-12,
    .c-xl-2,
    .c-xl-3,
    .c-xl-4,
    .c-xl-5,
    .c-xl-6,
    .c-xl-7,
    .c-xl-8,
    .c-xl-9 {
        float: left
    }

    .c-xl-12 {
        width: 100%
    }

    .c-xl-11 {
        width: 91.66666667%
    }

    .c-xl-10 {
        width: 83.33333333%
    }

    .c-xl-9 {
        width: 75%
    }

    .c-xl-8 {
        width: 66.66666667%
    }

    .c-xl-7 {
        width: 58.33333333%
    }

    .c-xl-6 {
        width: 50%
    }

    .c-xl-5 {
        width: 41.66666667%
    }

    .c-xl-4 {
        width: 33.33333333%
    }

    .c-xl-3 {
        width: 25%
    }

    .c-xl-2 {
        width: 16.66666667%
    }

    .c-xl-1 {
        width: 8.33333333%
    }

    .c-xl-pull-12 {
        right: 100%
    }

    .c-xl-pull-11 {
        right: 91.66666667%
    }

    .c-xl-pull-10 {
        right: 83.33333333%
    }

    .c-xl-pull-9 {
        right: 75%
    }

    .c-xl-pull-8 {
        right: 66.66666667%
    }

    .c-xl-pull-7 {
        right: 58.33333333%
    }

    .c-xl-pull-6 {
        right: 50%
    }

    .c-xl-pull-5 {
        right: 41.66666667%
    }

    .c-xl-pull-4 {
        right: 33.33333333%
    }

    .c-xl-pull-3 {
        right: 25%
    }

    .c-xl-pull-2 {
        right: 16.66666667%
    }

    .c-xl-pull-1 {
        right: 8.33333333%
    }

    .c-xl-pull-0 {
        right: auto
    }

    .c-xl-push-12 {
        left: 100%
    }

    .c-xl-push-11 {
        left: 91.66666667%
    }

    .c-xl-push-10 {
        left: 83.33333333%
    }

    .c-xl-push-9 {
        left: 75%
    }

    .c-xl-push-8 {
        left: 66.66666667%
    }

    .c-xl-push-7 {
        left: 58.33333333%
    }

    .c-xl-push-6 {
        left: 50%
    }

    .c-xl-push-5 {
        left: 41.66666667%
    }

    .c-xl-push-4 {
        left: 33.33333333%
    }

    .c-xl-push-3 {
        left: 25%
    }

    .c-xl-push-2 {
        left: 16.66666667%
    }

    .c-xl-push-1 {
        left: 8.33333333%
    }

    .c-xl-push-0 {
        left: auto
    }
}

@media(min-width: 1480px) {

    .c-xxl-1,
    .c-xxl-10,
    .c-xxl-11,
    .c-xxl-12,
    .c-xxl-2,
    .c-xxl-3,
    .c-xxl-4,
    .c-xxl-5,
    .c-xxl-6,
    .c-xxl-7,
    .c-xxl-8,
    .c-xxl-9 {
        float: left
    }

    .c-xxl-12 {
        width: 100%
    }

    .c-xxl-11 {
        width: 91.66666667%
    }

    .c-xxl-10 {
        width: 83.33333333%
    }

    .c-xxl-9 {
        width: 75%
    }

    .c-xxl-8 {
        width: 66.66666667%
    }

    .c-xxl-7 {
        width: 58.33333333%
    }

    .c-xxl-6 {
        width: 50%
    }

    .c-xxl-5 {
        width: 41.66666667%
    }

    .c-xxl-4 {
        width: 33.33333333%
    }

    .c-xxl-3 {
        width: 25%
    }

    .c-xxl-2 {
        width: 16.66666667%
    }

    .c-xxl-1 {
        width: 8.33333333%
    }

    .c-xxl-pull-12 {
        right: 100%
    }

    .c-xxl-pull-11 {
        right: 91.66666667%
    }

    .c-xxl-pull-10 {
        right: 83.33333333%
    }

    .c-xxl-pull-9 {
        right: 75%
    }

    .c-xxl-pull-8 {
        right: 66.66666667%
    }

    .c-xxl-pull-7 {
        right: 58.33333333%
    }

    .c-xxl-pull-6 {
        right: 50%
    }

    .c-xxl-pull-5 {
        right: 41.66666667%
    }

    .c-xxl-pull-4 {
        right: 33.33333333%
    }

    .c-xxl-pull-3 {
        right: 25%
    }

    .c-xxl-pull-2 {
        right: 16.66666667%
    }

    .c-xxl-pull-1 {
        right: 8.33333333%
    }

    .c-xxl-pull-0 {
        right: auto
    }

    .c-xxl-push-12 {
        left: 100%
    }

    .c-xxl-push-11 {
        left: 91.66666667%
    }

    .c-xxl-push-10 {
        left: 83.33333333%
    }

    .c-xxl-push-9 {
        left: 75%
    }

    .c-xxl-push-8 {
        left: 66.66666667%
    }

    .c-xxl-push-7 {
        left: 58.33333333%
    }

    .c-xxl-push-6 {
        left: 50%
    }

    .c-xxl-push-5 {
        left: 41.66666667%
    }

    .c-xxl-push-4 {
        left: 33.33333333%
    }

    .c-xxl-push-3 {
        left: 25%
    }

    .c-xxl-push-2 {
        left: 16.66666667%
    }

    .c-xxl-push-1 {
        left: 8.33333333%
    }

    .c-xxl-push-0 {
        left: auto
    }
}

.row {
    margin-left: -8px;
    margin-right: -8px;
    width: 100%;
    display: inline-block
}

.c-lg-1,
.c-lg-10,
.c-lg-11,
.c-lg-12,
.c-lg-2,
.c-lg-3,
.c-lg-4,
.c-lg-5,
.c-lg-6,
.c-lg-7,
.c-lg-8,
.c-lg-9,
.c-md-1,
.c-md-10,
.c-md-11,
.c-md-12,
.c-md-2,
.c-md-3,
.c-md-4,
.c-md-5,
.c-md-6,
.c-md-7,
.c-md-8,
.c-md-9,
.c-sm-1,
.c-sm-10,
.c-sm-11,
.c-sm-12,
.c-sm-2,
.c-sm-3,
.c-sm-4,
.c-sm-5,
.c-sm-6,
.c-sm-7,
.c-sm-8,
.c-sm-9,
.c-xl-1,
.c-xl-10,
.c-xl-11,
.c-xl-12,
.c-xl-2,
.c-xl-3,
.c-xl-4,
.c-xl-5,
.c-xl-6,
.c-xl-7,
.c-xl-8,
.c-xl-9,
.c-xs-1,
.c-xs-10,
.c-xs-11,
.c-xs-12,
.c-xs-2,
.c-xs-3,
.c-xs-4,
.c-xs-5,
.c-xs-6,
.c-xs-7,
.c-xs-8,
.c-xs-9,
.c-xxl-1,
.c-xxl-10,
.c-xxl-11,
.c-xxl-12,
.c-xxl-2,
.c-xxl-3,
.c-xxl-4,
.c-xxl-5,
.c-xxl-6,
.c-xxl-7,
.c-xxl-8,
.c-xxl-9,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9 {
    position: relative;
    min-height: 1px;
    padding-left: 8px;
    padding-right: 8px
}

.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9 {
    float: left
}

.col-11 {
    width: 91.66666667%
}

.col-10 {
    width: 83.33333333%
}

.col-9 {
    width: 75%
}

.col-8 {
    width: 66.66666667%
}

.col-7 {
    width: 58.33333333%
}

.col-6,
[Grid="102"] .ProductItem:nth-child(3n+2),
[Grid="102"] .ProductItem:nth-child(3n+3),
[Grid="102f"] .ProductItem:nth-child(3n+2),
[Grid="102f"] .ProductItem:nth-child(3n+3),
[Grid="1122"] .ProductItem,
[Grid="2"] .ProductItem,
[Grid="204"] .ProductItem:nth-child(3n+2),
[Grid="204f"] .ProductItem:nth-child(3n+2),
[Grid="302"] .ProductItem:nth-child(5n+4),
[Grid="302"] .ProductItem:nth-child(5n+5) {
    width: 50%
}

.col-5 {
    width: 41.66666667%
}

.col-4 {
    width: 33.33333333%
}

.col-3,
[Grid="4"] .ProductItem {
    width: 25%
}

.col-2 {
    width: 16.66666667%
}

.col-1 {
    width: 8.33333333%
}

.col-pull-12 {
    right: 100%
}

.col-pull-11 {
    right: 91.66666667%
}

.col-pull-10 {
    right: 83.33333333%
}

.col-pull-9 {
    right: 75%
}

.col-pull-8 {
    right: 66.66666667%
}

.col-pull-7 {
    right: 58.33333333%
}

.col-pull-6 {
    right: 50%
}

.col-pull-5 {
    right: 41.66666667%
}

.col-pull-4 {
    right: 33.33333333%
}

.col-pull-3 {
    right: 25%
}

.col-pull-2 {
    right: 16.66666667%
}

.col-pull-1 {
    right: 8.33333333%
}

.col-pull-0 {
    right: auto
}

.col-push-12,
.hov01:hover::before {
    left: 100%
}

.col-push-11 {
    left: 91.66666667%
}

.col-push-10 {
    left: 83.33333333%
}

.col-push-9 {
    left: 75%
}

.col-push-8 {
    left: 66.66666667%
}

.col-push-7 {
    left: 58.33333333%
}

.col-push-6 {
    left: 50%
}

.col-push-5 {
    left: 41.66666667%
}

.col-push-4 {
    left: 33.33333333%
}

.col-push-3 {
    left: 25%
}

.col-push-2 {
    left: 16.66666667%
}

.col-push-1 {
    left: 8.33333333%
}

.col-push-0 {
    left: auto
}

@media(max-width: 768px) {

    .c-xs-hide,
    .hidden-mobile {
        display: none !important
    }

    .p-xs-0 {
        padding: 0 !important
    }

    .m-xs-0 {
        margin: 0 !important
    }
}

@media(max-width: 767px) {
    .col-hide {
        display: none !important
    }

    .p-0 {
        padding: 0 !important
    }

    .m-0 {
        margin: 0 !important
    }
}

@media(max-width: 991px) {
    .Container.WFULL {
        padding: 0 20px
    }

    .Container.WFULL .row {
        margin: 0
    }

    .c-sm-hide {
        display: none !important
    }

    .p-sm-0 {
        padding: 0 !important
    }

    .m-sm-0 {
        margin: 0 !important
    }
}

@media(max-width: 1199px) {
    .c-md-hide {
        display: none !important
    }

    .p-md-0 {
        padding: 0 !important
    }

    .m-md-0 {
        margin: 0 !important
    }
}

@media(min-width: 768px) {
    .hidden-desktop {
        display: none !important
    }

    .c-sm-1,
    .c-sm-10,
    .c-sm-11,
    .c-sm-12,
    .c-sm-2,
    .c-sm-3,
    .c-sm-4,
    .c-sm-5,
    .c-sm-6,
    .c-sm-7,
    .c-sm-8,
    .c-sm-9 {
        float: left
    }

    .c-sm-12 {
        width: 100%
    }

    .c-sm-11 {
        width: 91.66666667%
    }

    .c-sm-10 {
        width: 83.33333333%
    }

    .c-sm-9 {
        width: 75%
    }

    .c-sm-8 {
        width: 66.66666667%
    }

    .c-sm-7 {
        width: 58.33333333%
    }

    .c-sm-6 {
        width: 50%
    }

    .c-sm-5 {
        width: 41.66666667%
    }

    .c-sm-4 {
        width: 33.33333333%
    }

    .c-sm-3 {
        width: 25%
    }

    .c-sm-2 {
        width: 16.66666667%
    }

    .c-sm-1 {
        width: 8.33333333%
    }

    .c-sm-pull-12 {
        right: 100%
    }

    .c-sm-pull-11 {
        right: 91.66666667%
    }

    .c-sm-pull-10 {
        right: 83.33333333%
    }

    .c-sm-pull-9 {
        right: 75%
    }

    .c-sm-pull-8 {
        right: 66.66666667%
    }

    .c-sm-pull-7 {
        right: 58.33333333%
    }

    .c-sm-pull-6 {
        right: 50%
    }

    .c-sm-pull-5 {
        right: 41.66666667%
    }

    .c-sm-pull-4 {
        right: 33.33333333%
    }

    .c-sm-pull-3 {
        right: 25%
    }

    .c-sm-pull-2 {
        right: 16.66666667%
    }

    .c-sm-pull-1 {
        right: 8.33333333%
    }

    .c-sm-pull-0 {
        right: auto
    }

    .c-sm-push-12 {
        left: 100%
    }

    .c-sm-push-11 {
        left: 91.66666667%
    }

    .c-sm-push-10 {
        left: 83.33333333%
    }

    .c-sm-push-9 {
        left: 75%
    }

    .c-sm-push-8 {
        left: 66.66666667%
    }

    .c-sm-push-7 {
        left: 58.33333333%
    }

    .c-sm-push-6 {
        left: 50%
    }

    .c-sm-push-5 {
        left: 41.66666667%
    }

    .c-sm-push-4 {
        left: 33.33333333%
    }

    .c-sm-push-3 {
        left: 25%
    }

    .c-sm-push-2 {
        left: 16.66666667%
    }

    .c-sm-push-1 {
        left: 8.33333333%
    }

    .c-sm-push-0 {
        left: auto
    }
}

.BackToTop,
.Input .Btn {
    right: 15px;
    cursor: pointer
}

@media(max-width: 575px) {

    .Container,
    .Container.WFULL .c-lg-1,
    .Container.WFULL .c-lg-10,
    .Container.WFULL .c-lg-11,
    .Container.WFULL .c-lg-12,
    .Container.WFULL .c-lg-2,
    .Container.WFULL .c-lg-3,
    .Container.WFULL .c-lg-4,
    .Container.WFULL .c-lg-5,
    .Container.WFULL .c-lg-6,
    .Container.WFULL .c-lg-7,
    .Container.WFULL .c-lg-8,
    .Container.WFULL .c-lg-9,
    .Container.WFULL .c-md-1,
    .Container.WFULL .c-md-10,
    .Container.WFULL .c-md-11,
    .Container.WFULL .c-md-12,
    .Container.WFULL .c-md-2,
    .Container.WFULL .c-md-3,
    .Container.WFULL .c-md-4,
    .Container.WFULL .c-md-5,
    .Container.WFULL .c-md-6,
    .Container.WFULL .c-md-7,
    .Container.WFULL .c-md-8,
    .Container.WFULL .c-md-9,
    .Container.WFULL .c-sm-1,
    .Container.WFULL .c-sm-10,
    .Container.WFULL .c-sm-11,
    .Container.WFULL .c-sm-12,
    .Container.WFULL .c-sm-2,
    .Container.WFULL .c-sm-3,
    .Container.WFULL .c-sm-4,
    .Container.WFULL .c-sm-5,
    .Container.WFULL .c-sm-6,
    .Container.WFULL .c-sm-7,
    .Container.WFULL .c-sm-8,
    .Container.WFULL .c-sm-9,
    .Container.WFULL .c-xl-1,
    .Container.WFULL .c-xl-10,
    .Container.WFULL .c-xl-11,
    .Container.WFULL .c-xl-12,
    .Container.WFULL .c-xl-2,
    .Container.WFULL .c-xl-3,
    .Container.WFULL .c-xl-4,
    .Container.WFULL .c-xl-5,
    .Container.WFULL .c-xl-6,
    .Container.WFULL .c-xl-7,
    .Container.WFULL .c-xl-8,
    .Container.WFULL .c-xl-9,
    .Container.WFULL .c-xs-1,
    .Container.WFULL .c-xs-10,
    .Container.WFULL .c-xs-11,
    .Container.WFULL .c-xs-12,
    .Container.WFULL .c-xs-2,
    .Container.WFULL .c-xs-3,
    .Container.WFULL .c-xs-4,
    .Container.WFULL .c-xs-5,
    .Container.WFULL .c-xs-6,
    .Container.WFULL .c-xs-7,
    .Container.WFULL .c-xs-8,
    .Container.WFULL .c-xs-9,
    .Container.WFULL .c-xxl-1,
    .Container.WFULL .c-xxl-10,
    .Container.WFULL .c-xxl-11,
    .Container.WFULL .c-xxl-12,
    .Container.WFULL .c-xxl-2,
    .Container.WFULL .c-xxl-3,
    .Container.WFULL .c-xxl-4,
    .Container.WFULL .c-xxl-5,
    .Container.WFULL .c-xxl-6,
    .Container.WFULL .c-xxl-7,
    .Container.WFULL .c-xxl-8,
    .Container.WFULL .c-xxl-9,
    .Container.WFULL .col-1,
    .Container.WFULL .col-10,
    .Container.WFULL .col-11,
    .Container.WFULL .col-12,
    .Container.WFULL .col-2,
    .Container.WFULL .col-3,
    .Container.WFULL .col-4,
    .Container.WFULL .col-5,
    .Container.WFULL .col-6,
    .Container.WFULL .col-7,
    .Container.WFULL .col-8,
    .Container.WFULL .col-9 {
        padding-left: 0;
        padding-right: 0
    }

    .Container {
        margin-right: auto;
        margin-left: auto
    }

    .Container.WFULL .row {
        margin-left: 0;
        margin-right: 0
    }

    .row {
        margin-left: -3px;
        margin-right: -3px
    }

    .c-lg-1,
    .c-lg-10,
    .c-lg-11,
    .c-lg-12,
    .c-lg-2,
    .c-lg-3,
    .c-lg-4,
    .c-lg-5,
    .c-lg-6,
    .c-lg-7,
    .c-lg-8,
    .c-lg-9,
    .c-md-1,
    .c-md-10,
    .c-md-11,
    .c-md-12,
    .c-md-2,
    .c-md-3,
    .c-md-4,
    .c-md-5,
    .c-md-6,
    .c-md-7,
    .c-md-8,
    .c-md-9,
    .c-sm-1,
    .c-sm-10,
    .c-sm-11,
    .c-sm-12,
    .c-sm-2,
    .c-sm-3,
    .c-sm-4,
    .c-sm-5,
    .c-sm-6,
    .c-sm-7,
    .c-sm-8,
    .c-sm-9,
    .c-xl-1,
    .c-xl-10,
    .c-xl-11,
    .c-xl-12,
    .c-xl-2,
    .c-xl-3,
    .c-xl-4,
    .c-xl-5,
    .c-xl-6,
    .c-xl-7,
    .c-xl-8,
    .c-xl-9,
    .c-xs-1,
    .c-xs-10,
    .c-xs-11,
    .c-xs-12,
    .c-xs-2,
    .c-xs-3,
    .c-xs-4,
    .c-xs-5,
    .c-xs-6,
    .c-xs-7,
    .c-xs-8,
    .c-xs-9,
    .c-xxl-1,
    .c-xxl-10,
    .c-xxl-11,
    .c-xxl-12,
    .c-xxl-2,
    .c-xxl-3,
    .c-xxl-4,
    .c-xxl-5,
    .c-xxl-6,
    .c-xxl-7,
    .c-xxl-8,
    .c-xxl-9,
    .col-1,
    .col-10,
    .col-11,
    .col-12,
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9 {
        position: relative;
        min-height: 1px;
        padding-left: 6px;
        padding-right: 6px
    }
}

@media(min-width: 992px) {

    .c-md-1,
    .c-md-10,
    .c-md-11,
    .c-md-12,
    .c-md-2,
    .c-md-3,
    .c-md-4,
    .c-md-5,
    .c-md-6,
    .c-md-7,
    .c-md-8,
    .c-md-9 {
        float: left
    }

    .c-md-12,
    .col-md-5-5 {
        width: 100%
    }

    .c-md-11 {
        width: 91.66666667%
    }

    .c-md-10 {
        width: 83.33333333%
    }

    .c-md-9 {
        width: 75%
    }

    .c-md-8 {
        width: 66.66666667%
    }

    .c-md-7 {
        width: 58.33333333%
    }

    .c-md-6 {
        width: 50%
    }

    .c-md-5 {
        width: 41.66666667%
    }

    .c-md-4 {
        width: 33.33333333%
    }

    .c-md-3 {
        width: 25%
    }

    .c-md-2 {
        width: 16.66666667%
    }

    .c-md-1 {
        width: 8.33333333%
    }

    .c-md-pull-12 {
        right: 100%
    }

    .c-md-pull-11 {
        right: 91.66666667%
    }

    .c-md-pull-10 {
        right: 83.33333333%
    }

    .c-md-pull-9 {
        right: 75%
    }

    .c-md-pull-8 {
        right: 66.66666667%
    }

    .c-md-pull-7 {
        right: 58.33333333%
    }

    .c-md-pull-6 {
        right: 50%
    }

    .c-md-pull-5 {
        right: 41.66666667%
    }

    .c-md-pull-4 {
        right: 33.33333333%
    }

    .c-md-pull-3 {
        right: 25%
    }

    .c-md-pull-2 {
        right: 16.66666667%
    }

    .c-md-pull-1 {
        right: 8.33333333%
    }

    .c-md-pull-0 {
        right: auto
    }

    .c-md-push-12 {
        left: 100%
    }

    .c-md-push-11 {
        left: 91.66666667%
    }

    .c-md-push-10 {
        left: 83.33333333%
    }

    .c-md-push-9 {
        left: 75%
    }

    .c-md-push-8 {
        left: 66.66666667%
    }

    .c-md-push-7 {
        left: 58.33333333%
    }

    .c-md-push-6 {
        left: 50%
    }

    .c-md-push-5 {
        left: 41.66666667%
    }

    .c-md-push-4 {
        left: 33.33333333%
    }

    .c-md-push-3 {
        left: 25%
    }

    .c-md-push-2 {
        left: 16.66666667%
    }

    .c-md-push-1 {
        left: 8.33333333%
    }

    .c-md-push-0 {
        left: auto
    }

    .col-md-1-5,
    .col-md-2-5,
    .col-md-3-5,
    .col-md-4-5,
    .col-md-5-5 {
        padding: 0 10px;
        float: left
    }

    .col-md-1-5 {
        width: 20%
    }

    .col-md-2-5 {
        width: 40%
    }

    .col-md-3-5 {
        width: 60%
    }

    .col-md-4-5 {
        width: 80%
    }
}

@media(min-width: 1200px) {

    .c-lg-1,
    .c-lg-10,
    .c-lg-11,
    .c-lg-12,
    .c-lg-2,
    .c-lg-3,
    .c-lg-4,
    .c-lg-5,
    .c-lg-6,
    .c-lg-7,
    .c-lg-8,
    .c-lg-9 {
        float: left
    }

    .c-lg-12,
    .col-lg-5-5 {
        width: 100%
    }

    .c-lg-11 {
        width: 91.66666667%
    }

    .c-lg-10 {
        width: 83.33333333%
    }

    .c-lg-9 {
        width: 75%
    }

    .c-lg-8 {
        width: 66.66666667%
    }

    .c-lg-7 {
        width: 58.33333333%
    }

    .c-lg-6 {
        width: 50%
    }

    .c-lg-5 {
        width: 41.66666667%
    }

    .c-lg-4 {
        width: 33.33333333%
    }

    .c-lg-3 {
        width: 25%
    }

    .c-lg-2 {
        width: 16.66666667%
    }

    .c-lg-1 {
        width: 8.33333333%
    }

    .c-lg-pull-12 {
        right: 100%
    }

    .c-lg-pull-11 {
        right: 91.66666667%
    }

    .c-lg-pull-10 {
        right: 83.33333333%
    }

    .c-lg-pull-9 {
        right: 75%
    }

    .c-lg-pull-8 {
        right: 66.66666667%
    }

    .c-lg-pull-7 {
        right: 58.33333333%
    }

    .c-lg-pull-6 {
        right: 50%
    }

    .c-lg-pull-5 {
        right: 41.66666667%
    }

    .c-lg-pull-4 {
        right: 33.33333333%
    }

    .c-lg-pull-3 {
        right: 25%
    }

    .c-lg-pull-2 {
        right: 16.66666667%
    }

    .c-lg-pull-1 {
        right: 8.33333333%
    }

    .c-lg-pull-0 {
        right: auto
    }

    .c-lg-push-12 {
        left: 100%
    }

    .c-lg-push-11 {
        left: 91.66666667%
    }

    .c-lg-push-10 {
        left: 83.33333333%
    }

    .c-lg-push-9 {
        left: 75%
    }

    .c-lg-push-8 {
        left: 66.66666667%
    }

    .c-lg-push-7 {
        left: 58.33333333%
    }

    .c-lg-push-6 {
        left: 50%
    }

    .c-lg-push-5 {
        left: 41.66666667%
    }

    .c-lg-push-4 {
        left: 33.33333333%
    }

    .c-lg-push-3 {
        left: 25%
    }

    .c-lg-push-2 {
        left: 16.66666667%
    }

    .c-lg-push-1 {
        left: 8.33333333%
    }

    .c-lg-push-0 {
        left: auto
    }

    .col-lg-1-5,
    .col-lg-2-5,
    .col-lg-3-5,
    .col-lg-4-5,
    .col-lg-5-5 {
        padding: 0 10px;
        float: left
    }

    .col-lg-1-5 {
        width: 20%
    }

    .col-lg-2-5 {
        width: 40%
    }

    .col-lg-3-5 {
        width: 60%
    }

    .col-lg-4-5 {
        width: 80%
    }
}

.MultipleInputs {
    width: 100%;
    display: flex;
    gap: 18px
}

.InputGroup,
.fr_comment_CommentAreaBody .CommentFilterArea .Searchbox {
    width: 100%;
    position: relative
}

.InputGroup>.Title {
    width: 100%;
    position: relative;
    margin-bottom: 24px
}

.Inputs {
    width: 100%;
    display: flex;
    gap: 16px
}

.Input {
    width: 100%;
    position: relative;
    margin-bottom: 6px
}

.Input.Box {
    background: 0 0;
    display: flex;
    flex-direction: column-reverse
}

.Input .Btn,
.Input .InputGroup {
    align-items: center;
    display: flex
}

.Input.Box select,
.Input.Box textarea {
    background: #efefef;
    border: 1px solid #000;
    padding: 12px
}

.Input.Box label {
    position: inherit;
    border: 0;
    padding: 0;
    line-height: 14px !important;
    font-size: 12px !important;
    margin-bottom: 6px;
    color: #4a4a4a
}

.Input .Btn {
    position: absolute;
    width: auto;
    top: 15px;
    background: #eaeaea;
    line-height: 18px;
    font-size: 11px;
    padding: 1.5px 8px .5px;
    height: 20px
}

.Input button.passwordViewer {
    position: absolute;
    right: 5px;
    bottom: 24px;
    border: 0;
    background: #fff;
    display: block;
    line-height: 0;
    border-radius: 2px;
    cursor: pointer;
    padding: 4px
}

.Input button.passwordViewer>svg {
    height: 11px;
    display: none
}

.Input button.passwordViewer>svg[fr="{passwordView}"] {
    height: 11px;
    display: block
}

.Input button.passwordViewer>svg[fr="{passwordHide}"] {
    height: 11px
}

.Input input,
.Input select,
.Input textarea,
body.inputt2 .Input input,
body.inputt2 .Input select,
body.inputt2 .Input textarea {
    display: block;
    height: auto;
    width: 100%;
    font-size: 14px;
    color: #000;
    appearance: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e5e5e5;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    border-radius: 0;
    padding: 26px 10px 4px 12px;
    outline: 0;
    resize: none;
    font-weight: 400;
    font-family: inherit;
    line-height: 18px
}

.Input input:focus,
.Input select.selected,
.Input textarea:focus,
body.inputt2 .Input input:focus,
body.inputt2 .Input select.selected,
body.inputt2 .Input textarea:focus {
    border-color: #000;
    box-shadow: 1px 1px 0 0 #000
}

input:-webkit-autofill,
select:-webkit-autofill,
textarea:-webkit-autofill {
    transition: background-color 5000s ease-in-out;
    background-color: #fff !important
}

.Input.error input,
.Input.error select,
.Input.error textarea,
.Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .fieldset-sms .input-group>input[type=number].input-code.timeup {
    border-color: red
}

.Input.info input,
.Input.info select,
.Input.info textarea {
    border-color: #ff9800
}

.Input.error .error,
.Input.info .error,
.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.DiscountRate.show,
.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.Price.show,
.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox .SpecialText.show,
.card-js .card-number-wrapper .show {
    opacity: 1;
    display: block
}

.Input .InputGroup {
    gap: 14px
}

.Input .CheckGroup {
    display: flex;
    align-items: center;
    cursor: pointer
}

.Input .Check,
.Page[PageType=Success]>.Container .Member .CheckGroup .Check,
[PageType=Account] .Container[P=Payment] .List .AccountItem .Title .Check {
    display: flex;
    width: 14px;
    height: 14px;
    justify-content: center;
    position: relative;
    align-items: center;
    margin-right: 10px;
    flex: none
}

.AddressForm .Form .Invoice .TypeBox .CheckBox .Check::before,
.AddressForm .Title .Invoice .Check::before,
.Input .Check::before,
.Page[PageType=Success]>.Container .Member .CheckGroup .Check::before,
[PageType=Account] .Container[P=Payment] .List .AccountItem .Title .Check::before {
    content: "";
    width: 14px;
    height: 14px;
    border: 1px solid #000;
    flex: none
}

.AddressForm .Form .Invoice .TypeBox .CheckBox .Check.active::after,
.AddressForm .Title .Invoice.active .Check::after,
.Input .Check.active::after,
.Page[PageType=Success]>.Container .Member .CheckGroup .Check.active::after,
[PageType=Account] .Container[P=Payment] .List .AccountItem .Title .Check.active::after,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Check.active::after {
    content: "";
    width: 6px;
    height: 6px;
    background: #000;
    position: absolute;
    left: 4px;
    top: 4px;
    flex: none
}

.Input .inputClear {
    position: absolute;
    right: 5px;
    bottom: 24px;
    color: #4d4d4d;
    font-size: 16px;
    display: none
}

.Input .inputClear:hover,
[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Info .Item span:nth-child(2),
[PageType=Account] .TabList>.TabItem:hover,
[PageType=Account] [P=Gift] .TabView[T=passiveGift] .GiftItem .StatuBar>span,
[fr=OrderDetail] .History .Item.active>span,
[fr=RequestDetail] .History .Item.active>span {
    color: #000;
    font-size: 13px
}

.Input .Information {
    position: absolute;
    top: 0;
    right: 12px;
    z-index: 2
}

.Input .Information>.Icon {
    position: absolute;
    top: 15px;
    right: 0;
    z-index: 2;
    cursor: pointer
}

.Input .Information>.Wind {
    position: absolute;
    top: 100%;
    right: -11px;
    z-index: 2;
    display: none;
    border: 1px solid #ccc;
    background: #fff;
    width: 297px;
    padding: 11px;
    gap: 12px;
    margin-top: 33px
}

.Input .Information.active>.Wind,
.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates,
.module-login .signUp-middle-section .product-item,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information,
section[Mod=Nav] .UserBar .Btn[fr=Bag] {
    display: flex;
    align-items: center
}

.Input .Information.active>.Wind::before {
    content: "";
    position: absolute;
    top: -5px;
    right: 0;
    width: 0;
    height: 0;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    border-bottom: 8px solid #fff;
    z-index: 1
}

.Input .Information.active>.Wind::after {
    content: "";
    position: absolute;
    top: -8px;
    right: 1px;
    width: 0;
    height: 0;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-bottom: 8px solid #ccc
}

.Input .Information.active>.Wind .Text {
    font-size: 11px;
    line-height: 15px;
    max-width: 59%
}

.Input .Information.active>.Wind .Closed {
    position: absolute;
    top: 10px;
    right: 10px
}

.Input label {
    pointer-events: none;
    transform-origin: 0 0;
    position: absolute;
    top: -1px;
    left: 9px;
    z-index: 2;
    font-size: 14px;
    overflow: hidden;
    text-align: start;
    border: 1px solid transparent;
    transition: opacity .1s ease-in-out, transform .1s ease-in-out;
    color: #7b7b7b;
    line-height: 50px
}

.Input textarea+label {
    line-height: 75px
}

.Input input:not(:placeholder-shown),
.Input textarea:not(:placeholder-shown),
.modLogin_container_right_area_form_box_input input:not(:placeholder-shown),
body.inputt2 .Input input:not(:placeholder-shown),
body.inputt2 .Input textarea:not(:placeholder-shown) {
    border-color: #000
}

.Input input:focus~label,
.Input input:not(:placeholder-shown)~label,
.Input select.selected~label,
.Input select:focus~label,
.Input textarea:focus~label,
.Input textarea:not(:placeholder-shown)~label,
body.inputt2 .Input input:focus~label,
body.inputt2 .Input input:not(:placeholder-shown)~label,
body.inputt2 .Input select:focus~label,
body.inputt2 .Input textarea:focus~label,
body.inputt2 .Input textarea:not(:placeholder-shown)~label {
    font-size: 12px;
    color: #000;
    line-height: 18px;
    background: 0 0;
    padding: 0 3px;
    top: 4px;
    font-weight: 300
}

.Input input:not(:placeholder-shown)~label::after,
.Input select:not(:placeholder-shown)~label::after,
.Input textarea:not(:placeholder-shown)~label::after,
.modLogin_container_right_area_form_box_input input:not(:placeholder-shown)~label::after,
body.inputt2 .Input input:not(:placeholder-shown)~label::after,
body.inputt2 .Input select:not(:placeholder-shown)~label::after,
body.inputt2 .Input textarea:not(:placeholder-shown)~label::after {
    position: absolute;
    inset: 1rem .5rem;
    z-index: -1;
    height: 1.5em;
    content: "";
    background-color: var(--bs-body-bg);
    border-radius: .65rem
}

.Input .error {
    width: 100%;
    color: red;
    font-size: 11px;
    font-weight: 300;
    height: 16px;
    line-height: 16px;
    opacity: 0
}

.Input.info .error {
    color: #ff9800
}

.Input .Btn.PasswordEye {
    border: 0;
    background: 0 0;
    padding: 0;
    width: auto
}

.Input .Info {
    color: red;
    line-height: 27px;
    font-size: 10px
}

.Btn {
    width: 100%;
    line-height: 40px;
    text-align: center;
    color: #000;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center
}

.AddressForm .Title .Text>span:nth-child(2):hover,
.BagInformation .Addition .Btn:hover,
.Btn:hover,
.Page[PageType=View] .Information .Btn.active:hover,
.Page[PageType=View] .Information .SizeTable>div:hover,
.PopupBox.Center .Closed:hover,
.PopupBox.RightPop .Closed:hover {
    opacity: .8
}

.Btn.OutLineBlack {
    background: #fff;
    color: #000;
    border: 1px solid #000
}

.Btn.Disabled {
    background: #f0f0f0;
    color: #606060;
    pointer-events: none;
    border-color: #efefef
}

section[L=View] {
    display: block;
    width: 100%;
    position: relative;
    z-index: 1
}

section[L=Breadcrumb],
section[L=Footer] {
    display: block;
    width: 100%;
    position: relative;
    z-index: -1
}

section[L=Breadcrumb] {
    margin-bottom: -30px;
    margin-top: 20px;
    display: none
}

section[L=Breadcrumb] .Breadcrumbs {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    padding: 0 32px;
    gap: 4px;
    font-size: 12px;
    font-family: sans-serif
}

section[L=Breadcrumb] .Breadcrumbs a,
section[Mod=Nav] .SubNav>.NavItem.Bold>.Box .Name {
    font-weight: 700
}

section[L=Breadcrumb] .Breadcrumbs span {
    color: #666
}

body[Page=Bag] section[L=Head]+.NotificationBar+section[L=View],
body[Page=Payment] section[L=Head]+.NotificationBar+section[L=View] {
    padding-top: 107px
}

section[L=Head] .Mod.StandartHead {
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid #e6e6e6;
    background: #fff
}

section[L=Head] .Mod.StandartHead>.Container {
    width: 100%;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

section[L=Head] .Mod.StandartHead>.Container .TheBack {
    display: flex;
    flex-direction: column;
    position: relative;
    height: 74px;
    align-items: flex-start;
    justify-content: center;
    padding: 0 20px 0 0;
    z-index: 2;
    cursor: pointer
}

section[L=Head] .Mod.StandartHead>.Container .TheBack>svg {
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 1
}

section[L=Head] .Mod.StandartHead>.Container .Logo {
    display: flex;
    align-items: center;
    gap: 4px;
    position: absolute;
    left: 0;
    justify-content: center;
    width: 100%
}

section[L=Head] .Mod.StandartHead>.Container .Logo>img {
    display: block;
    height: 20px
}

section[L=Head] .Mod.StandartHead>.Container .BagCounter {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    opacity: 0
}

.module-004 .saosmc-successAnimation {
    display: block;
    width: 100%;
    height: 170px;
    position: relative;
    overflow: hidden
}

.module-004 .saosmc-successAnimation::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.module-004 .saosmc-successAnimation .saosmcsa-circle4 {
    display: block;
    width: 140px;
    height: 140px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    border-radius: 50%;
    animation-name: saosmcsa-greenDots;
    animation-duration: 15s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: normal
}

.module-004 .saosmc-successAnimation .saosmcsa-circle4 circle {
    fill: transparent;
    stroke: #48D792;
    stroke-width: 4.2;
    stroke-dasharray: 0.1, 13;
    stroke-linecap: round
}

.module-004 .saosmc-successAnimation .saosmcsa-circle5 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 90px;
    background: #48d792;
    position: absolute;
    left: 50%;
    top: 50%;
    filter: blur(.5px);
    transform: translateX(-50%) translateY(-50%);
    border-radius: 50%;
    box-shadow: 0 3px 6px #48d7927C
}

.module-004 .saosmc-successAnimation .saosmcsa-circle5 i {
    color: #fff;
    font-size: 25px;
    font-weight: 700
}

@keyframes saosmcsa-greenDots {
    from {
        transform: translateX(-50%) translateY(-50%) rotate(0)
    }

    to {
        transform: translateX(-50%) translateY(-50%) rotate(360deg)
    }
}

.PopupBox {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2147483647
}

.ModsPop>.OverFlow,
.PopupBox>.OverFlow {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    background: #00000047;
    z-index: 1
}

.ModsPop>.Document,
.PopupBox>.Document {
    position: relative;
    z-index: 2;
    background: #fff;
    min-width: 320px;
    min-height: 120px;
    transition: .1s
}

.ModsPop.LoginLoad>.Document,
.PopupBox.LoginLoad>.Document {
    width: auto !important;
    border-radius: 12px;
    padding: 10px !important;
    min-width: inherit;
    margin: 20px;
    min-height: inherit
}

.ModsPop.Center>.Document,
.PopupBox.Center>.Document {
    padding: 60px 20px 40px
}

.ModsPop.RightPop,
.PopupBox.RightPop {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start
}

.PopupBox.RightPop>.Document {
    min-width: 420px;
    min-height: 100%;
    right: -100%;
    transition: .1s;
    flex: none
}

.ModsPop.RightPop.Show .Document,
.PopupBox.RightPop.Show .Document {
    right: 0;
    transition: .1s
}

.ModsPop.RightPop .Closed,
.PopupBox.RightPop .Closed {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    PADDING: 20PX
}

[fr=Share] .Title {
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase
}

[fr=Share] .link-head {
    position: relative;
    font-size: 11px;
    margin-bottom: 6px;
    margin-top: 20px;
    letter-spacing: 1px;
    text-transform: uppercase
}

[fr=Share] .link>.link-text {
    display: block;
    height: auto;
    width: 100%;
    padding: 10px 16px;
    overflow: hidden;
    font-size: 12px;
    line-height: 18px;
    color: #6d6f71;
    letter-spacing: .3px;
    cursor: pointer;
    background-color: #f3f3f3;
    border: 1px solid #d7d7d8;
    outline: 0
}

[fr=Share] .social-area {
    display: flex;
    gap: 8px;
    justify-content: center
}

[fr=Share] .social-area>a {
    padding: 8px;
    color: #292929;
    border: 1px solid #ccc;
    border-radius: 100%;
    width: 34px;
    height: 34px;
    display: flex;
    justify-content: center;
    align-items: center
}

[PageType=Account] .LeftArea .Navs .Item:hover,
[fr=Share] .social-area>a:hover,
section[Mod=Nav] .SubNav>.NavItem:hover>.Box .Name {
    opacity: .6
}

[fr=OrderDetail],
[fr=RequestDetail] {
    width: 100%;
    padding: 60px 40px;
    overflow: auto
}

[fr=RequestDetail]::-webkit-scrollbar {
    width: 6px;
    background: #b2b2b2;
    display: block
}

[fr=RequestDetail]::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 2px
}

[fr=RequestDetail]::-webkit-scrollbar-thumb:hover {
    background: #555
}

[fr=RequestDetail] .Title {
    width: 100%;
    line-height: 17px;
    margin-bottom: 20px
}

[fr=RequestDetail] .Quantity {
    width: 100%;
    margin-bottom: 5px;
    line-height: 17px
}

[fr=RequestDetail] .History {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
    position: relative;
    margin: 42px 0
}

.NotificationBar+section[L=HEAD] .Mod>:first-child,
[fr=OrderDetail] .Btn,
[fr=RequestDetail] .Btn {
    margin-top: 32px
}

[fr=OrderDetail] .History::before,
[fr=RequestDetail] .History::before {
    content: "";
    width: 1px;
    height: 100%;
    border-left: 1px dashed #000;
    position: absolute;
    left: 6px;
    top: 1px
}

[fr=OrderDetail] .History::after,
[fr=RequestDetail] .History::after {
    content: "";
    width: 1px;
    height: 26px;
    border-left: 1px solid #fff;
    position: absolute;
    left: 6px;
    bottom: -10px
}

[fr=OrderDetail] .History .Item,
[fr=RequestDetail] .History .Item {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding-left: 28px;
    position: relative
}

[fr=OrderDetail] .History .Item::before,
[fr=RequestDetail] .History .Item::before {
    content: "";
    width: 11px;
    height: 11px;
    border: 1px solid;
    position: absolute;
    left: 0;
    top: 1px;
    background: #fff
}

[fr=RequestDetail] .History .Item.active::before {
    content: "";
    width: 11px;
    height: 11px;
    border: 1px solid;
    position: absolute;
    left: 0;
    top: 1px;
    background: #000;
    z-index: 1
}

[fr=OrderDetail] .History .Item.completed::after,
[fr=RequestDetail] .History .Item.completed::after {
    content: "";
    width: 1px;
    height: calc(100% + 32px);
    border-left: 1px solid;
    position: absolute;
    left: 6px;
    top: 13px
}

[fr=OrderDetail] .History .Item>span:first-child,
[fr=RequestDetail] .History .Item>span:first-child {
    width: 100%;
    font-weight: 500;
    line-height: 16px;
    color: #666
}

[fr=OrderDetail] .History .Item>span:nth-child(2),
[fr=RequestDetail] .History .Item>span:nth-child(2) {
    width: 100%;
    font-size: 11px;
    color: #666
}

[fr=RequestDetail] .ProductList {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 610px;
    margin-top: 0
}

[fr=OrderDetail] .ProductList .ProductItem,
[fr=RequestDetail] .ProductList .ProductItem {
    width: 100%;
    display: flex;
    padding-bottom: 10px;
    margin-bottom: 10px;
    position: relative;
    align-items: stretch
}

[fr=OrderDetail] .ProductList .ProductItem .Gallery,
[fr=RequestDetail] .ProductList .ProductItem .Gallery {
    width: 100%;
    max-width: 63px;
    margin-right: 12px;
    flex: none
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Gallery[pageload="1"],
.ProductItem.Favorite .Gallery[pageload="1"],
[fr=OrderDetail] .ProductList .ProductItem .Gallery[pageload="1"],
[fr=RequestDetail] .ProductList .ProductItem .Gallery[pageload="1"] {
    height: 121px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Gallery>img,
.Page[PageType=View] .GalleryBar>.List>.Item,
.Page[PageType=View] .GalleryBar>.List>.Item video,
.Page[PageType=View] .GalleryBar>.List>.Item>img,
[fr=OrderDetail] .ProductList .ProductItem .Gallery>img,
[fr=RequestDetail] .ProductList .ProductItem .Gallery>img {
    width: 100%;
    display: block
}

.Page[PageType=View] .GalleryBar>.List>.Item::before {
    content: '';
    display: block;
    background: #eee;
    padding-top: calc((100% / (209 / 313)))
}

.Page[PageType=View] .GalleryBar>.List>.Item img,
.Page[PageType=View] .GalleryBar>.List>.Item video {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    object-fit: cover;
    width: 100%;
    height: 100%
}

[fr=OrderDetail] .ProductList .ProductItem .Info,
[fr=RequestDetail] .ProductList .ProductItem .Info {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: auto;
    padding: 0
}

[fr=RequestDetail] .ProductList .ProductItem .Info .Item {
    width: 100%;
    margin-bottom: 6px
}

.Page[PageType=View] .Information .FeaturesBar .FeaturesBtn:hover,
.Rating:hover .comment-text,
[Mod=fr_comment] .fr_comment_list_item_text_more:hover,
[PageType=Account] .Container[P=Payment] .PaymentBar>div.Btn:nth-child(2),
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .BtnList .Btn:hover,
[PageType=Account] .address-card-actions>.Btn.Edit {
    text-decoration: underline
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Check {
    display: flex;
    width: 14px;
    height: 14px;
    justify-content: flex-start;
    position: relative;
    align-items: center;
    padding-left: 24px;
    gap: 6px;
    cursor: pointer
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Check::before {
    content: "";
    width: 12px;
    height: 12px;
    border: 1px solid #000;
    flex: none;
    position: absolute;
    left: 0
}

.Page[PageType=Success]>.Container .Icon {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .Name,
.BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .Variation,
[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Color .Text {
    font-size: 11px
}

.BagInformation .Addition .Items .Item.Products>.Wind .ProductItem:last-child,
[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Input,
[PageType=Aboutus] .ContentArea .View .Form[Type=Human] .Input,
[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .Input,
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .Item:last-child {
    margin-bottom: 0
}

[PageType=Account] .Table table tbody td.tLeft,
[PageType=Account] .Table table thead th.tLeft,
section[Mod=Nav] .SubNav>.NavItem>.Box .Icon.Left {
    text-align: left
}

[PageType=Account] .Table table tbody td.tRight,
[PageType=Account] .Table table thead th.tRight,
section[Mod=Nav] .SubNav>.NavItem>.Box .Icon.Right {
    text-align: right
}

section[Mod=Nav] .SubNav>.NavItem {
    width: 100%;
    cursor: pointer;
    color: #000
}

section[Mod=Nav] .SubNav>.NavItem[rowb="1"] {
    margin-bottom: 20px
}

section[Mod=Nav] .SubNav>.NavItem[rowb="2"] {
    margin-bottom: 30px
}

.Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content>.otc label {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap
}

.Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content>.otc .fieldset-sms {
    border: 0;
    padding: 0;
    margin: 0
}

.Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content>.otc .input-group {
    display: flex;
    align-items: center;
    justify-content: space-between
}

[fr=OrderDetail] .Addition>.Item.Grand {
    margin-top: 8px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Variation>span,
[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Variation>span {
    margin-left: 4px
}

.AddressForm .Title .Text,
.MobileAddition .Content,
.Page[PageType=Success]>.Container .OrderDetail,
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information,
[PageType=Account] .address-card-detail>div,
[PageType=Account] .address-card-detail>div>span:nth-child(2),
[PageType=SupportDetail] .QuestionArea .BoxArea {
    width: 100%;
    display: flex;
    flex-direction: column
}

.MobileAddition .Content .Products .ProductItem .Info .PriceBox .OldPrice {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end
}

.AddressForm .Form .Invoice .TypeBoxForm .TabForm.active,
.Page[Steps="2"] .BagInformation .Addition .BalanceBar,
.PopContent[mod=StoreStockView]>.Step.active,
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView.active,
[PageType=Account] .Container[P=Balance] .Balance>div:first-child>span:first-child,
[PageType=Account] .Container[P=Payment] .PaymentBar>div:first-child>span:first-child,
[PageType=Account] .Container[P=Payment] .PaymentBar>div:nth-child(2)>span:first-child,
[PageType=Account] .Container[P=Return] [T=newReturn] .ReturnInformation,
[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Info .Text,
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List,
[PageType=Account] .Empty .Btn,
[PageType=Account] .OrderItem>.Area .InfoBar .Content .Info,
[PageType=Account] .RightArea .ViewTab.show {
    display: flex;
    flex-direction: column
}

.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.Price>span {
    margin-left: 3px
}

.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .SpecialText {
    width: fit-content;
    border: 1px solid #000;
    line-height: 20px;
    padding: 2px 5px 0
}

.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText:not(:empty) {
    display: block;
    opacity: 1
}

[PageType=Account] .ViewTab[T="#siparislerim"] .Text>span>strong {
    font-weight: 100
}

.MobileAddition .Content .Addition .Item,
.Page[PageType=Success]>.Container .OrderDetail .Addition .Item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 17px;
    margin-bottom: 3px
}

[fr=OrderDetail] .Addition>.Item>span:first-child,
[fr=OrderDetail] .Addition>.Item>span:nth-child(2) {
    line-height: 17px
}

.PopContent .Preview .List .ProductItem .Info .PriceBox .SalePrice {
    display: flex;
    flex-direction: column;
    gap: 5px
}

.PopupBox.heightAuto .Document {
    height: calc(100% - 100px);
    margin: 50px
}

.PopupBox.heightAuto .Container,
.PopupBox.heightAuto .PopContent {
    width: 100%;
    height: -webkit-fill-available
}

.PopupBox.width60 .Document {
    width: 100%;
    max-width: 560px
}

.PopupBox.heightAuto .PopContent {
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.module-login .right-siderbar .siderbar-container .identity-popup-top-header .top-header-buttons .signIn-popUp-button,
.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.forgot-link {
    cursor: pointer
}

.list-divider {
    width: 100%;
    display: block;
    height: 0 !important
}

@keyframes an_filterBarTop {
    0% {
        bottom: -110px
    }

    100% {
        bottom: 0
    }
}

@keyframes an_filterBarBottom {
    0% {
        bottom: -110px
    }

    100% {
        bottom: 0
    }
}

@keyframes an_productList {
    0% {
        opacity: 0;
        bottom: -180px
    }

    100% {
        opacity: 1;
        bottom: 0
    }
}

.ProductItem .Gallery .VariationBar .Favorite:before,
.ProductItem.Wait .Info .Properties .Btn.Favorite:before {
    content: "";
    display: flex;
    background: url(/NewWebSites/img/icon_favorite.svg);
    width: 10px;
    height: 14px
}

.ProductItem .Gallery .VariationBar .Favorite.active:before,
.ProductItem.Wait .Info .Properties .Btn.Favorite.active:before {
    content: "";
    display: flex;
    background: url(/NewWebSites/img/icon_favorite_activ.svg) 0 0/11px;
    width: 10px;
    height: 14px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Code[pageload="1"],
.ProductItem.Favorite .Info .Product>.Code[pageload="1"],
.ProductItem.Wait .Info .Product>.Code[pageload="1"],
[Mod=fr_comment] .fr_comment_list_item_like>i,
[Mod=fr_comment] .fr_comment_list_item_text_more>svg,
[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Code[pageload="1"] {
    height: 15px
}

.module-login .signUp-middle-section .product-item img {
    height: 30px
}

.AddressForm .Title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.AddressForm .Title .Text>span:first-child {
    width: 100%;
    font-weight: 600
}

.AddressForm .Title .Text>span:nth-child(2) {
    width: 100%;
    cursor: pointer;
    text-decoration: underline;
    color: #2196f3
}

.AddressForm .Title .Invoice {
    display: flex;
    cursor: pointer;
    align-items: center
}

.AddressForm .Title .Invoice .Check {
    display: flex;
    width: 14px;
    height: 14px;
    justify-content: center;
    position: relative;
    align-items: center;
    margin-right: 14px;
    flex: none
}

.AddressForm .Title .Invoice .Text,
[fr=OrderDetail] .Date {
    width: 100%;
    line-height: 17px
}

.AddressForm .Form {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    margin-top: 10px
}

.AddressForm .Form .Invoice {
    width: 100%;
    display: none;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    margin-top: 24px
}

.AddressForm .Form .BtnList {
    width: 100%;
    display: none;
    gap: 25px;
    margin-top: 20px;
    flex-direction: row-reverse
}

.AddressForm .Form .BtnList.show {
    display: flex;
    justify-content: space-between
}

.AddressForm .Form .Invoice .TypeBox {
    width: 100%;
    display: flex;
    gap: 40px
}

.AddressForm .Form .Invoice .TypeBox .CheckBox {
    display: flex;
    cursor: pointer
}

.AddressForm .Form .Invoice .TypeBox .CheckBox .Check {
    display: flex;
    width: 14px;
    height: 14px;
    justify-content: center;
    position: relative;
    align-items: center;
    margin-right: 7px;
    flex: none
}

.AddressForm .Form .Invoice .TypeBox .CheckBox .Text,
.Page[PageType=Success]>.Container .Qr .Content,
.PopContent[mod=StoreStockView]>.MessageArea .Mitem,
.PopContent[mod=StoreStockView]>.MessageArea .Mitem br,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment span,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment span,
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem {
    width: 100%;
    display: flex
}

.AddressForm .Form .Invoice .TypeBoxForm {
    width: 100%;
    display: none;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: column;
    margin-top: 23px
}

.AddressForm .Form .Invoice .TypeBoxForm .InvoiceTabItem {
    display: flex;
    justify-content: flex-start;
    gap: 25px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px
}

.AddressForm .Form .Invoice .TypeBoxForm .InvoiceTabItem .TabItem {
    border-bottom: 1px solid #ccc;
    line-height: 26px;
    margin-bottom: -1px;
    cursor: pointer
}

.AddressForm .Form .Invoice .TypeBoxForm .InvoiceTabItem .TabItem.active {
    display: flex;
    border-color: #000
}

.AddressForm .Form .Invoice .TypeBoxForm .TabForm,
[PageType=Account] .RightArea .ViewTab {
    width: 100%;
    display: none
}

.Page[PageType=View] {
    opacity: 0;
    transition: .4s
}

body[Page=View] .Mod10001_Group_NavBar .Logo {
    opacity: 0;
    transition: .3s
}

.Page[PageType=View][Load="1"],
body[Page=View].Scroll500 .Mod10001_Group_NavBar .Logo {
    opacity: 1;
    transition: .3s
}

.CustomerBox .SenderMessage .Text,
[PageType=Aboutus] .Nav .Box .List .Item.active,
[PageType=Account] .Container[P=Payment] .List .AccountItem .Items .Item span:nth-child(2),
[PageType=Account] [P=Gift] .GiftItem .Information .Date span:last-child,
[PageType=SupportDetail] .QuestionArea .Box .List .Item.active {
    font-weight: 500
}

[PageType=Account] {
    margin-top: 160px
}

[PageType=Account]>.Container {
    width: 100%;
    max-width: 1420px;
    padding: 0 40px;
    margin: 60px auto;
    display: flex
}

[PageType=Account] .LeftArea {
    max-width: 340px;
    min-width: 200px;
    width: 100%
}

[PageType=Account] .LeftArea .Navs {
    width: 100%;
    padding-right: 60px
}

[PageType=Account] .LeftArea .Navs .Item {
    width: 100%;
    margin-bottom: 22px;
    cursor: pointer;
    position: relative
}

[PageType=Account] .LeftArea .Navs .Item.active::before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #000;
    position: absolute;
    left: -10px;
    top: 4px
}

[PageType=Account] .RightArea {
    width: 100%;
    max-width: 1080px
}

.CustomerBox,
[PageType=Account] .OrderList {
    width: 100%;
    margin-top: 50px
}

[PageType=Account] .AddressList {
    width: 100%;
    display: flex;
    flex-wrap: wrap
}

[PageType=Account] .address-card {
    width: calc(50% - 8px);
    margin-right: 16px;
    margin-bottom: 16px;
    border: 1px solid #dfdfdf;
    padding: 14px;
    border-radius: 0
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn:hover,
.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn:hover,
[PageType=Account] .address-card:hover {
    border: 1px solid #000
}

[PageType=Account] .address-card:nth-child(+2n) {
    margin-right: 0
}

[PageType=Account] .address-card-title {
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 10px;
    font-size: 13px
}

[PageType=Account] .address-card-detail {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 6px
}

[PageType=Account] .address-card-detail>div>span:first-child {
    width: 100%;
    text-transform: uppercase;
    font-size: 11px;
    color: #6f6f6f
}

[PageType=Account] .address-card-actions {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 22px;
    justify-content: flex-start
}

[PageType=Account] .address-card-actions>.Btn {
    max-width: inherit;
    width: initial;
    line-height: initial
}

[PageType=Account] .address-card-actions>.Btn.Delete {
    color: red
}

[PageType=Account] .OrderItem {
    width: 100%;
    padding-bottom: 26px;
    margin-bottom: 26px;
    border-bottom: 1px solid #000
}

[PageType=Account] .OrderItem>.Area {
    width: 100%;
    display: flex;
    flex-direction: row
}

[PageType=Account] .OrderItem>.Area .Gallery {
    width: 100px;
    display: flex;
    flex: none;
    flex-wrap: wrap
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery>div,
[PageType=Account] .OrderItem>.Area .Gallery>div {
    width: 50%;
    display: grid
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery>div:last-child,
[PageType=Account] .OrderItem>.Area .Gallery>div:last-child {
    width: 50%;
    display: flex;
    background: #fff;
    align-items: center;
    justify-content: center
}

[PageType=Account] .OrderItem>.Area .InfoBar {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-left: 28px
}

[PageType=Account] .OrderItem>.Area .InfoBar .Content {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 5px
}

[PageType=Account] .OrderItem>.Area .InfoBar .Content .Info .Name {
    width: 100%;
    line-height: 17px;
    margin-top: 1px
}

[PageType=Account] .OrderItem>.Area .InfoBar .Content .Info .Desc {
    width: 100%;
    font-size: 11px;
    color: #828282;
    margin: 5px 0 7px
}

[PageType=Account] .OrderItem>.Area .InfoBar .Content .Info .OrderNumber {
    width: 100%;
    font-size: 11px;
    color: #828282
}

[PageType=Account] .OrderItem>.Area .InfoBar .Content .Price {
    font-size: 11px;
    position: absolute;
    right: 0
}

[PageType=Account] .OrderItem>.Area .InfoBar .Status {
    width: 100%;
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between
}

[PageType=Account] .OrderItem>.Area .InfoBar .Status .StatuBar>span:first-child {
    width: 12px;
    height: 12px;
    border-radius: 100%;
    flex: none;
    margin-right: 6px
}

[PageType=Account] .OrderItem>.Area .InfoBar .Status .Arrows {
    text-align: right;
    cursor: pointer
}

[PageType=Account] .ViewTab[T="#"]>.Container {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 18px
}

[PageType=Account] .ViewTab[T="#"] .NavBox {
    width: calc(33.33% - 12px);
    border: 1px solid #dedede;
    padding: 18px;
    display: flex;
    align-items: flex-start;
    flex-direction: column
}

[PageType=Account] .ViewTab[T="#"] .NavBox .Title {
    width: 100%;
    color: #000;
    font-weight: 400;
    line-height: 16px;
    margin: 0
}

[PageType=Account] .ViewTab[T="#"] .NavBox .Text {
    width: 100%;
    font-size: 11px;
    line-height: 16px;
    margin: 21px 0
}

[PageType=Account] .ViewTab[T="#"] .NavBox .Btn {
    width: 100%;
    font-size: 13px;
    text-align: left;
    line-height: 18px;
    display: flex;
    justify-content: flex-start
}

.Page[PageType=Success]>.Container .PaymentInformationP2 .Text:last-child>strong,
[PageType=Account] .ViewTab[T="#"] .NavBox .Btn:hover {
    text-decoration: underline;
    cursor: pointer
}

[PageType=Account] .TheBack {
    font-size: 13px;
    line-height: 16px;
    padding-bottom: 35px;
    font-weight: 400;
    gap: 5px;
    align-items: center;
    display: none;
    color: #1577c5
}

[PageType=Account] .TheBack>svg>path {
    fill: #1577c5
}

[PageType=Account] .TheBack>span {
    margin-bottom: -1px
}

[PageType=Account] .Title {
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 17px
}

[PageType=Account] .Note {
    font-size: 12px;
    line-height: 17px;
    margin-top: 30px;
    margin-bottom: 11px;
    color: #6e6e6e;
    display: block
}

[PageType=Account] .Btn {
    max-width: 80%
}

[PageType=Account] .TabList {
    display: flex;
    line-height: 17px;
    gap: 32px;
    margin-bottom: 27px
}

[PageType=Account] .TabList>.TabItem {
    font-size: 12px;
    line-height: 17px;
    color: #747474;
    cursor: pointer
}

[PageType=Account] .TabList>.TabItem.active {
    color: #000;
    text-decoration: underline
}

[PageType=Account] .TabView {
    display: none;
    width: 100%
}

[PageType=Account] .ViewTab[T="#siparislerim"] .Text {
    align-items: center;
    display: none
}

[PageType=Account] .ViewTab[T="#siparislerim"] .Text>span {
    width: auto;
    font-size: 12px;
    line-height: 17px
}

[PageType=Account] .ViewTab[T="#siparislerim"] .Text>select {
    margin-left: auto;
    border: 0;
    outline: 0
}

[PageType=Account] .Container[P=Support] .Table span.Status,
[PageType=Account] .Container[P=Support] table tr td .Status {
    color: #1a32a4
}

[PageType=Account] .Container[P=Return] [T=successReturn] {
    width: 100%;
    max-width: 450px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box {
    padding-bottom: 40px
}

[PageType=Account] .Container[P=Return],
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail {
    padding-bottom: 120px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Head {
    border: 1px solid #000;
    padding: 12px;
    display: flex
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Head span:first-child {
    border-right: 1px solid #ccc;
    padding-right: 10px;
    margin-right: 10px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Info {
    border: 1px solid #000;
    border-top: 0;
    padding: 18px;
    display: flex;
    align-items: center
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Info svg {
    height: 40px;
    margin-right: 16px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Info .Text span:first-child {
    margin-bottom: 8px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .Box .Info .Text span:nth-child(2) {
    color: #505050
}

[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .Title {
    margin-bottom: 10px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .Divider {
    height: 1px;
    background: #000;
    margin: 15px 0
}

[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .Item {
    padding: 0;
    margin-bottom: 12px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem .Gallery {
    width: 54px;
    display: flex;
    flex: none;
    flex-wrap: wrap;
    margin-right: 5px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem .Info {
    width: 100%;
    display: flex;
    margin-bottom: 12px;
    justify-content: flex-start;
    height: inherit;
    gap: 7px
}

[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem .Info .Item {
    width: 100%;
    display: flex;
    gap: 5px;
    align-items: flex-start;
    border: 0;
    padding: 0;
    margin: 0;
    flex-direction: row
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Info .Item span:first-child,
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem .Info .Item span:first-child {
    width: 100px;
    color: #686868
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Info .Item span:nth-child(2),
[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .ProductItem .Info .Item span:nth-child(2) {
    width: 100px
}

[PageType=Account] [P=Gift] .List {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 20px;
    flex-wrap: wrap
}

[PageType=Account] [P=Gift] .GiftItem {
    width: 100%;
    border: 1px solid #000;
    border-radius: 14px 0 0;
    max-width: 410px;
    position: relative;
    overflow: hidden;
    padding: 0 20px
}

[PageType=Account] [P=Gift] .GiftItem .StatuBar {
    position: absolute;
    left: 0;
    top: 0;
    background: #aaffc7;
    border-radius: 0 0 20px;
    display: flex;
    padding: 4px 20px 4px 5px;
    align-items: center;
    gap: 0
}

[PageType=Account] [P=Gift] .TabView[T=passiveGift] .GiftItem .StatuBar {
    background: #b0b0b0
}

[PageType=Account] [P=Gift] .GiftItem .StatuBar svg {
    height: 17px;
    flex: none
}

[PageType=Account] [P=Gift] .GiftItem .StatuBar span {
    width: 100%;
    margin-left: 10px;
    color: #004818;
    padding-top: 3px
}

[PageType=Account] [P=Gift] .GiftItem .Info {
    width: 100%;
    padding: 24px 0 12px;
    display: flex;
    align-items: center;
    align-content: center
}

[PageType=Account] [P=Gift] .GiftItem .Info .Left .Rate {
    width: 100%;
    font-size: 24px;
    text-align: center;
    line-height: 28px
}

[PageType=Account] [P=Gift] .GiftItem .Info .Left .Text {
    width: 100%;
    font-size: 14px;
    text-align: center;
    line-height: 38px
}

[PageType=Account] [P=Gift] .GiftItem .Info .Right {
    width: 100%;
    padding: 15px 20px;
    border-left: 1px dashed #7b7b7b
}

[PageType=Account] [P=Gift] .GiftItem .Info .Right .Rate {
    width: 100%;
    text-align: center;
    line-height: 28px
}

[PageType=Account] [P=Gift] .GiftItem .Info .Right .Code {
    width: 100%;
    background: #000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px
}

[PageType=Account] [P=Gift] .GiftItem .Info .Right .Code span {
    width: 100%;
    text-align: center;
    font-size: 19px;
    font-weight: 600
}

[PageType=Account] [P=Gift] .GiftItem .Info .Right .Code svg {
    margin-left: 5px;
    cursor: pointer
}

[PageType=Account] [P=Gift] .GiftItem .Information {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 20px 0;
    border-top: 1px solid #ccc
}

[PageType=Account] [P=Gift] .GiftItem .Information svg {
    width: 36px;
    border-right: 1px solid #ccc;
    padding-right: 10px
}

[PageType=Account] [P=Gift] .GiftItem .Information .Date {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding-left: 8px
}

.NotificationBar {
    width: 100%;
    background: #000;
    color: #fff;
    position: sticky;
    height: 32px;
    top: 0;
    z-index: 2;
    display: none
}

body[Page=Bag] .NotificationBar {
    position: fixed;
    top: 60px;
    z-index: 1
}

.NotificationBar>.Container {
    width: 100%;
    padding: 7px 40px;
    overflow: hidden
}

.NotificationBar>.Container .Text {
    width: 100%;
    text-align: center;
    font-size: 12px;
    line-height: 17px
}

.NotificationBar .NotificationBarClosed {
    position: absolute;
    display: flex;
    right: 40px;
    top: 0;
    z-index: 1;
    align-items: center;
    height: 30px;
    line-height: 30px;
    cursor: pointer
}

.NotificationBar .NotificationBarClosed>svg,
.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>div[pageload="1"],
.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Variation[pageload="1"],
.ProductItem.Favorite .Info .Properties .Btn[pageload="1"],
[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Color[pageload="1"],
[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>div[pageload="1"],
[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Variation[pageload="1"],
section[Mod=Nav] .UserBar .Btn>svg {
    height: 14px
}

.Empty .Text {
    width: 100%;
    text-align: center;
    margin-bottom: 14px
}

.Empty .SubText {
    width: 100%;
    margin-bottom: 32px;
    text-align: center
}

.Empty .Btn {
    width: 70%;
    margin: 0 auto;
    max-width: 210px
}

[PageType=SupportDetail] .QuestionArea .Box .List {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 14px
}

[PageType=SupportDetail] .QuestionArea .Box .BtnMore {
    width: 100%;
    font-size: 11px;
    color: #383838;
    text-decoration: underline;
    cursor: pointer
}

[PageType=Aboutus],
[PageType=SupportDetail] {
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative
}

[PageType=SupportDetail]>.Container {
    width: 100%;
    padding: 0 84px;
    display: block
}

[PageType=SupportDetail]>.Container .Content {
    width: 100%;
    display: flex;
    padding-top: 140px
}

[PageType=SupportDetail] .QuestionArea {
    width: 342px;
    flex: none
}

[PageType=SupportDetail] .QuestionArea .Box {
    width: 100%;
    border: 1px solid #000;
    padding: 40px
}

[PageType=SupportDetail] .QuestionArea .Box .Title {
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    margin-bottom: 26px;
    text-transform: uppercase
}

[PageType=SupportDetail] .QuestionArea .Box .List .Item {
    width: 100%;
    font-size: 13px;
    cursor: pointer
}

[PageType=SupportDetail] .QuestionArea .SeachList {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 12px
}

[PageType=Aboutus] .SearchArea .SeachList .Item,
[PageType=SupportDetail] .QuestionArea .SeachList .Item {
    background: #fff;
    padding: 10px;
    cursor: pointer;
    border: 1px solid #000
}

[PageType=SupportDetail] .QuestionArea .SearchBox {
    width: 100%;
    font-size: 13px;
    cursor: pointer;
    margin-top: 30px;
    border: 1px solid #000;
    position: relative
}

[PageType=Aboutus] .Nav .SearchBox input,
[PageType=SupportDetail] .QuestionArea .SearchBox input {
    width: 100%;
    font-size: 13px;
    cursor: pointer;
    border: 0;
    outline: 0;
    line-height: 40px;
    padding: 0 12px
}

[PageType=Aboutus] .Nav .SearchBox .Closed,
[PageType=SupportDetail] .QuestionArea .SearchBox .Closed {
    position: absolute;
    right: 8px;
    top: 9px;
    display: none
}

[PageType=Aboutus] .Nav .SearchBox .Loading,
[PageType=SupportDetail] .QuestionArea .SearchBox .Loading {
    position: absolute;
    right: 12px;
    top: 12px;
    display: none
}

[PageType=SupportDetail] .AnswerArea {
    width: 100%;
    font-size: 13px;
    cursor: pointer;
    padding-left: 60px;
    max-width: 680px
}

[PageType=SupportDetail] .AnswerArea img {
    max-width: 100%;
    height: inherit
}

[PageType=SupportDetail] .AnswerArea .Question {
    width: 100%;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 32px
}

.fr_comment_CommentAreaBody .CommentCounter>.Text,
[PageType=SupportDetail] .AnswerArea .Answer {
    width: 100%;
    font-size: 14px
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Title,
[PageType=Aboutus] .ContentArea .View .Form[Type=Human] .Title,
[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .Title {
    width: 100%;
    font-weight: 500;
    text-transform: none;
    margin-bottom: 24px
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm {
    width: 100%;
    margin-bottom: 25px
}

.CustomerBox .Customer,
[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Name {
    width: 100%;
    margin-bottom: 10px
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Info {
    width: 100%;
    display: flex;
    gap: 10px;
    flex-wrap: wrap
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Info .Item {
    background: #f8f8f8;
    padding: 10px;
    width: calc(50% - 5px);
    display: flex;
    flex-direction: column
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Info .Item span {
    color: #646464;
    margin-right: 7px;
    font-size: 12px !important
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .InputGroup,
[PageType=Aboutus] .ContentArea .View .Form[Type=Human] .InputGroup,
[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .InputGroup,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail {
    width: 100%;
    display: flex;
    gap: 20px
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .BtnList,
[PageType=Aboutus] .ContentArea .View .Form[Type=Human] .BtnList,
[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .BtnList {
    width: 100%;
    margin-top: 35px;
    display: flex;
    justify-content: flex-end
}

[PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .BtnList .Btn,
[PageType=Aboutus] .ContentArea .View .Form[Type=Human] .BtnList .Btn,
[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .BtnList .Btn {
    width: auto;
    min-width: 30%;
    text-align: center
}

[PageType=Aboutus]>.Container {
    width: 100%;
    padding: 0 84px;
    margin-top: 160px;
    display: flex
}

[PageType=Aboutus] .Nav {
    width: 342px;
    flex: none;
    margin-right: 121px;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 160px
}

[PageType=Aboutus] .Nav .Box {
    width: 100%;
    border: 1px solid #000;
    padding: 40px;
    background: #fff
}

[PageType=Aboutus] .Nav .Box .List {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px
}

[PageType=Aboutus] .Nav .Box .List .Item {
    width: 100%;
    font-size: 13px;
    cursor: pointer;
    text-transform: uppercase
}

[PageType=Aboutus] .Nav .SearchBox {
    width: 100%;
    font-size: 13px;
    cursor: pointer;
    margin-top: 30px;
    border: 1px solid #000;
    position: relative;
    margin-bottom: 30px
}

[PageType=Aboutus] .SearchArea .SeachList {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}

[PageType=Aboutus] .ContentArea {
    width: 100%;
    font-size: 13px;
    padding-bottom: 80px
}

[PageType=Aboutus] .ContentArea .Title {
    width: 100%;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 17px
}

[PageType=Aboutus] .ContentArea .View {
    width: 100%;
    font-size: 14px;
    border: 1px solid #000;
    padding: 42px 33px;
    max-width: 1000px
}

[fr=FullScreenGallery] {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 999999;
    background: #fff
}

[fr=FullScreenGallery] .Closed {
    position: absolute;
    right: 30px;
    top: 0;
    z-index: 9999999;
    cursor: pointer;
    margin: 31px 24px
}

[fr=FullScreenGallery] .swiper-container {
    width: 100%;
    position: relative;
    z-index: 9
}

[fr=FullScreenGallery] .swiper-container .swiper-wrapper {
    width: 100vw;
    height: 100vh
}

[fr=FullScreenGallery] .swiper-container .swiper-wrapper .swiper-slide {
    width: 100%;
    background-position: 50%;
    background-size: cover
}

[fr=FullScreenGallery] .swiper-container .swiper-wrapper .swiper-slide img {
    height: 100%;
    display: none
}

.swiper-pagination-bullets.swiper-pagination-horizontal,
[fr=FullScreenGallery] .swiper-horizontal>.swiper-pagination-bullets {
    position: absolute;
    top: 0;
    margin: 30px;
    height: 16px;
    gap: 2px;
    align-items: center;
    display: none
}

[fr=FullScreenGallery] .swiper-pagination .swiper-pagination-bullet {
    background: 0 0;
    font-size: 13px;
    opacity: 1;
    width: 20px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center
}

[fr=FullScreenGallery] .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
    content: "";
    width: 3px;
    height: 3px;
    display: flex;
    background: #000;
    position: absolute;
    bottom: -3px;
    text-align: center;
    align-items: center;
    justify-content: center
}

[fr=OrderDetail]::-webkit-scrollbar {
    width: 6px;
    background: #b2b2b2;
    display: block
}

[fr=OrderDetail]::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 2px
}

[fr=OrderDetail]::-webkit-scrollbar-thumb:hover {
    background: #555
}

[fr=OrderDetail] .OrderNumber {
    width: 100%;
    margin-bottom: 32px;
    line-height: 17px
}

[fr=OrderDetail] .Address,
[fr=OrderDetail] .Cargo,
[fr=OrderDetail] .Payment {
    width: 100%;
    line-height: 17px;
    display: flex
}

[fr=OrderDetail] .Address>span:first-child,
[fr=OrderDetail] .Cargo>span:first-child,
[fr=OrderDetail] .Payment>span:first-child {
    width: 65px;
    flex: none;
    display: block
}

[fr=OrderDetail] .Cargo>span:nth-child(2) strong {
    font-weight: 500;
    margin-right: 10px
}

[fr=OrderDetail] .BtnArea {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 32px
}

[fr=OrderDetail] .BtnArea>.Btn {
    width: auto;
    margin: 0;
    line-height: 32px
}

[fr=OrderDetail] .Addition {
    width: 100%;
    margin: 33px 0 55px
}

[fr=OrderDetail] .Addition>.Item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1px
}

[fr=OrderDetail] .History {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
    position: relative
}

[fr=OrderDetail] .History .Item.active::before {
    content: "";
    width: 11px;
    height: 11px;
    border: 1px solid;
    position: absolute;
    left: 0;
    top: 1px;
    background: #000
}

[fr=OrderDetail] .ProductList {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 610px;
    margin-top: 65px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Product {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2px;
    position: relative
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Name {
    width: 100%;
    font-size: 12px;
    line-height: 17px;
    max-width: 74%
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Name[pageload="1"],
[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Name[pageload="1"] {
    height: 17px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Code {
    font-size: 11px;
    width: 100%;
    color: #888;
    line-height: 15px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Color,
[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Color {
    width: 100%;
    font-size: 11px;
    color: #262626;
    display: flex;
    gap: 7px;
    align-items: center
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Color .Code,
[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Color .Code {
    width: 10px;
    height: 10px;
    display: block;
    flex: none;
    border: 1px solid #e5e5e5
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Color .Variation {
    font-size: 11px;
    border-left: 1px solid #ccc;
    padding-left: 8px;
    display: none
}

[fr=OrderDetail] .ProductList .ProductItem .Info .PriceBox {
    position: absolute;
    right: 0;
    top: 2px;
    width: initial;
    min-width: 100px;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    display: flex;
    flex-direction: row;
    align-items: center
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea,
[fr=OrderDetail] .ProductList .ProductItem .Info .Properties {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: auto;
    margin-bottom: 10px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea .Btn[fr=commentAdd] {
    margin: 0;
    border: 1px solid #1b1b1b;
    color: #000;
    border-radius: 4px;
    line-height: 25px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate {
    display: flex;
    gap: 4px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate+div {
    margin-left: auto;
    color: #000;
    text-decoration: underline;
    cursor: pointer
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate>span {
    display: flex;
    font-size: 10px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="1"]>span:first-child {
    color: #ffeb3b
}

[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="2"]>span:first-child,
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="2"]>span:nth-child(2),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="3"]>span:first-child,
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="3"]>span:nth-child(2),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="3"]>span:nth-child(3),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:first-child,
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(2),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(3),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(4),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:first-child,
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(2),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(3),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(4),
[fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(5) {
    color: #ffee54
}

.module-005 .evaluation-section {
    border-bottom: 1px solid #99999940;
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.module-005 .evaluation-section .evaluation-text {
    text-transform: uppercase;
    font-weight: 600;
    padding: 20px;
    color: #333;
    font-size: 17px
}

.module-005 .evaluation-section .Popup_Close {
    padding: 20px 10px 20px 20px;
    margin: 0 10px;
    border-left: 1px solid #99999940;
    font-size: 15px;
    color: #000000b5
}

.module-005 .product-section {
    padding: 20px 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    border-bottom: 1px solid #99999940
}

.module-005 .product-section .product-image {
    width: 45px
}

.module-005 .product-section .product-detail {
    display: flex;
    flex-direction: column;
    padding-left: 10px
}

.module-005 .product-section .product-detail .sale {
    font-size: 16px;
    font-weight: 600;
    color: #be144d
}

.module-005 .product-section .product-detail .price {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    font-weight: 600
}

.module-005 .product-section .product-detail .price .new-price {
    font-size: 17px;
    color: #000
}

.module-005 .product-section .product-detail .price .old-price {
    padding-left: 8px;
    text-decoration: line-through;
    color: #070707;
    opacity: .5;
    font-size: 13px;
    display: none
}

.module-005 .product-section .product-detail .product-name {
    padding-top: 3px;
    color: #000;
    opacity: .6;
    color: 15px;
    font-weight: 400
}

.module-005 .comment-section {
    padding: 10px
}

.module-005 .comment-section .comment-intro {
    font-size: 12px;
    color: #000;
    text-align: center
}

.module-005 .comment-section .rating-section {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 20px
}

.module-005 .comment-section .rating-section .rating-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    color: #e8e8e8
}

.module-005 .comment-section .rating-section .rating-item .fa {
    font-size: 22px
}

.module-005 .comment-section .rating-section .rating-item.Active .fa,
.module-005 .comment-section .rating-section .rating-item.Active .rating-text {
    color: #ff9d00
}

.module-005 .comment-section .rating-section .rating-item.Selected .icon-ifa,
.module-005 .comment-section .rating-section .rating-item.Selected .rating-text {
    color: #ff9d00ad
}

.module-005 .comment-section .rating-section .rating-item .rating-text {
    padding-top: 14px;
    font-size: 13px;
    font-weight: 400
}

.module-005 .comment-section .message-form {
    margin-top: 10px;
    height: 104px;
    border: 1px solid #efefef;
    background-color: #f5f5f5;
    border-radius: 2px
}

.module-005 .comment-section .message-form .comment {
    width: 100%;
    height: 83%;
    background-color: transparent;
    border-style: none;
    padding: 13px;
    font-size: 13px;
    overflow-y: scroll;
    color: #000;
    opacity: .4
}

.module-005 .comment-section .message-form .comment::-webkit-scrollbar {
    width: 0
}

.module-005 .comment-section .message-form .text-size {
    text-align: end;
    padding-right: 10px;
    padding-bottom: 3px;
    font-size: 10px;
    color: #000;
    opacity: .7
}

.module-005 .comment-section .select-section .select-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 20px
}

.BackToTop,
.loaderComment {
    display: flex;
    align-items: center
}

.module-005 .comment-section .select-section .select-item .select-text {
    margin-left: 12px;
    font-size: 13px;
    font-weight: 400;
    color: #464646
}

.module-005 .comment-section .select-section .select-item .select-text .select-special {
    font-size: 13px;
    font-weight: 400;
    color: #464646;
    text-decoration: underline
}

@keyframes rotation {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.BackToTop {
    z-index: 1;
    position: fixed;
    bottom: -500px;
    background: #fff;
    border: 1px solid #000;
    color: #000;
    font-weight: 600;
    height: 30px;
    justify-content: center;
    border-radius: 3px;
    font-size: 12px;
    transition: .3s, visibility .5s;
    opacity: 0;
    padding: 4px 12px;
    gap: 6px
}

body.Scroll600 .BackToTop {
    bottom: 30px;
    transition: .6s;
    opacity: 1
}

body.Scroll600 .BackToTop svg {
    height: 14px;
    width: initial
}

body.Scroll600 .BackToTop svg>path {
    stroke: #000
}

.loaderComment {
    justify-content: center;
    margin: 30px auto 20px;
    width: 22px;
    height: 22px;
    border: 2px solid #e8e8e8;
    border-bottom-color: transparent;
    border-radius: 50%;
    animation: 1s linear infinite rotation !important
}

.module-005 .comment-section .select-section .select-item .select-box .switch {
    display: inline-block;
    position: relative;
    width: 42px;
    height: 25px;
    border-radius: 20px;
    background: #e5e6e7;
    transition: background .28s cubic-bezier(.4, 0, .2, 1);
    vertical-align: middle;
    cursor: pointer
}

.module-005 .comment-section .select-section .select-item .select-box .switch::before {
    content: '';
    position: absolute;
    top: 1px;
    left: 2px;
    width: 22px;
    height: 22px;
    background: #fafafa;
    border-radius: 50%;
    transition: left .28s cubic-bezier(.4, 0, .2, 1), background .28s cubic-bezier(.4, 0, .2, 1), box-shadow .28s cubic-bezier(.4, 0, .2, 1)
}

.module-005 .comment-section .select-section .select-item .select-box .switch:active::before {
    box-shadow: 0 2px 8px rgba(0, 0, 0, .28), 0 0 0 20px rgba(128, 128, 128, .1)
}

.module-005 .comment-section .select-section .select-item .select-box input:checked+.switch {
    background: #343434
}

.module-005 .comment-section .select-section .select-item .select-box input:checked+.switch::before {
    left: 18px;
    background: #fff
}

.module-005 .comment-section .select-section .select-item .select-box input:checked+.switch:active::before {
    box-shadow: 0 2px 8px rgba(0, 0, 0, .28), 0 0 0 20px rgba(0, 150, 136, .2)
}

.module-005 .evaluation-btn {
    margin-top: 20px;
    color: #fff;
    background-color: #000;
    border-radius: 0;
    width: calc(100% - 0px);
    padding: 13px 26px;
    letter-spacing: .5px;
    transition: .2s;
    border: 0;
    font-weight: 100;
    font-size: 12px
}

.module-005 .evaluation-btn:hover {
    background-color: #48d792;
    border-color: #48d792
}

@media only screen and (max-width: 991px) {
    .Popup .Modal .Htm .Document .Popup_Close.Outside {
        font-size: 9px
    }
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar,
[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar {
    display: flex;
    align-items: center;
    width: max-content
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity {
    display: flex;
    align-items: center;
    gap: 8px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>div {
    font-size: 11px;
    color: #262626
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>div:nth-child(2)[pageload="1"],
[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>div:nth-child(2)[pageload="1"] {
    height: 24px
}

[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Variation {
    display: flex;
    align-items: center;
    margin-left: 10px;
    font-size: 11px;
    color: #262626;
    border-left: 1px solid #ccc;
    padding-left: 10px
}

.card-number-wrapper .card-type-icon {
    height: 23px;
    width: 32px;
    position: absolute;
    display: block;
    right: 8px;
    top: 7px;
    background: url(https://cardjs.co.uk/img/cards.png) 0 23px no-repeat;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    -moz-transition: opacity .15s linear;
    -ms-transition: opacity .15s linear;
    -o-transition: opacity .15s linear;
    transition: opacity .15s linear
}

.card-js .card-number-wrapper .card-type-icon.visa {
    background-position: 0 0
}

.card-js .card-number-wrapper .card-type-icon.master-card {
    background-position: -32px 0
}

.card-js .card-number-wrapper .card-type-icon.american-express {
    background-position: -64px 0
}

.card-js .card-number-wrapper .card-type-icon.discover {
    background-position: -96px 0
}

.card-js .card-number-wrapper .card-type-icon.diners {
    background-position: -128px 0
}

.card-js .card-number-wrapper .card-type-icon.jcb {
    background-position: -160px 0
}

.Page[PageType=Success]>.Container {
    max-width: 680px;
    margin: 0 auto;
    padding: 120px 0 132px
}

.Page[PageType=Success]>.Container .Title {
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin: 35px 0 16px
}

.Page[PageType=Success]>.Container .Text {
    width: 100%;
    font-size: 14px;
    color: #656565;
    text-align: center
}

.Page[PageType=Success]>.Container .OrderNumber {
    width: 100%;
    margin: 18px 0 22px;
    text-align: center;
    font-weight: 500;
    font-size: 14px
}

.Page[PageType=Success]>.Container .Description {
    text-align: center;
    font-size: 14px;
    color: #656565;
    max-width: 460px;
    margin: 0 auto;
    line-height: 20px
}

.Page[PageType=Success]>.Container .Email {
    width: 100%;
    text-align: center;
    margin-top: 18px;
    font-weight: 500;
    font-size: 14px
}

.Page[PageType=Success]>.Container .Qr {
    width: 100%;
    margin-top: 32px;
    border: 1px solid #000;
    padding: 16px
}

.Page[PageType=Success]>.Container .Qr .Content .App {
    width: 80px;
    display: none;
    flex-direction: column;
    flex: none;
    margin-right: 40px
}

.Page[PageType=Success]>.Container .Qr .Content .App>.Text {
    display: flex;
    gap: 8px;
    width: 100%;
    margin-top: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

.Page[PageType=Success]>.Container .Qr .Content .App>.Text>span {
    line-height: 14px;
    font-size: 12px;
    font-weight: 500;
    padding-top: 2px
}

.Page[PageType=Success]>.Container .Qr .Content .TextBox {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: center
}

.Page[PageType=Success]>.Container .Qr .Content .TextBox .Text,
section[Mod=Nav] .SubNav>.NavItem>.Box .Name {
    color: currentColor
}

section[Mod=Nav] .SubNav>.NavItem.TopTextLast>.Box .Name::after {
    content: "S2'05";
    font-size: 10px;
    vertical-align: super;
    margin-left: 2px
}

section[Mod=Nav] .SubNav>.NavItem.TopTextFirst>.Box .Name::before {
    content: "S2'05";
    font-size: 10px;
    vertical-align: super;
    margin-right: 2px
}

.Page[PageType=Success]>.Container .Divider {
    width: 100%;
    background: #000;
    height: 1px;
    margin: 32px 0
}

.Page[PageType=Success]>.Container .Address,
.Page[PageType=Success]>.Container .Cargo,
.Page[PageType=Success]>.Container .Payment {
    width: 100%;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.Page[PageType=Success]>.Container .Address .Title,
.Page[PageType=Success]>.Container .Cargo .Title,
.Page[PageType=Success]>.Container .Payment .Title {
    width: 100%;
    margin: 0 0 11px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.Page[PageType=Success]>.Container .Address .Title>.Btn {
    font-size: 10px;
    text-decoration: underline;
    width: initial;
    line-height: 14px
}

.Page[PageType=Success]>.Container .Address .Text,
.Page[PageType=Success]>.Container .Cargo .Text {
    width: 100%;
    text-align: left;
    line-height: 20px;
    font-size: 13px
}

.Page[PageType=Success]>.Container .Address .AddressContainer {
    width: 100%;
    text-align: left;
    line-height: 20px;
    font-size: 13px;
    margin: 50px 0
}

.Page[PageType=Success]>.Container .Address .AddressContainer .Note {
    display: block;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px
}

.Page[PageType=Success]>.Container .Payment .Text {
    width: 100%;
    text-align: left;
    line-height: 20px;
    font-size: 13px;
    text-transform: capitalize
}

.Page[PageType=Success]>.Container .OrderDetail .Title {
    width: 100%;
    margin: 10px 0 50px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem {
    width: 100%;
    display: flex;
    padding-bottom: 10px;
    margin-bottom: 10px;
    position: relative
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Gallery {
    width: 100%;
    max-width: 88px;
    margin-right: 26px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Gallery>img:hover {
    opacity: .8;
    box-shadow: 0 0 0 1px #000
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info {
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    height: inherit
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Name {
    width: 100%;
    margin-bottom: 2px;
    font-size: 12px;
    line-height: 17px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Name:hover {
    opacity: .8;
    text-decoration: underline
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Code {
    font-size: 11px;
    width: 100%;
    color: #888;
    margin-bottom: 10px;
    line-height: 15px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Color .Text {
    font-size: 11px;
    width: initial
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 3.5px;
    align-items: flex-end;
    height: auto
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox .OldPrice {
    display: flex;
    font-size: 12px;
    text-decoration: line-through;
    line-height: 17px;
    justify-content: flex-end
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox .SalePrice {
    display: flex;
    flex-direction: row;
    width: initial
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox[DiscountRate="0"] .OldPrice {
    text-decoration: none
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox .SalePrice>.Info {
    display: flex;
    justify-content: flex-end;
    flex-direction: row;
    margin: 0
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox .SalePrice>.Info>.Price {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 2px 6px 0;
    line-height: 15px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox .SalePrice>.Info>.DiscountRate {
    display: flex;
    line-height: 15px;
    padding: 2px 6px 0 0
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox[DiscountRate="0"] .SalePrice>.Info>.DiscountRate {
    display: none;
    line-height: 15px;
    padding: 2px 6px 0 0
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties {
    width: 100%;
    display: flex;
    margin-top: auto;
    align-items: center;
    justify-content: flex-start
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>div {
    margin-right: 8px;
    font-size: 11px;
    color: #262626
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Quantity>select {
    width: 100%;
    border: 1px solid #000;
    padding: 4px 9px;
    outline: 0;
    font-size: 11px
}

.Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Variation {
    display: flex;
    align-items: center;
    margin-left: 5px;
    font-size: 11px;
    color: #262626;
    min-width: 65px
}

.MobileAddition .Content .Addition .Items,
.Page[PageType=Success]>.Container .OrderDetail .Addition .Items {
    width: 100%;
    margin-bottom: 14px;
    color: #262626
}

.MobileAddition .Content .Addition .Item.Grand,
.Page[PageType=Success]>.Container .OrderDetail .Addition .Item.Grand {
    margin-top: 10px;
    font-weight: 500
}

.Page[PageType=Success]>.Container .Btn {
    width: 40%
}

.Page[PageType=Success]>.Container .Member {
    width: 100%;
    border: 1px solid #000;
    padding: 18px;
    gap: 16px;
    display: flex;
    flex-direction: column;
    margin-bottom: 24px
}

.Page[PageType=Success]>.Container .Member .Title {
    width: 100%;
    margin: 0;
    text-align: left;
    font-weight: 100
}

.Page[PageType=Success]>.Container .Member .Text {
    width: 100%;
    text-align: left;
    color: #000;
    line-height: 20px
}

.Page[PageType=Success]>.Container .Member .CheckGroup {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    margin: 20px 0
}

.Page[PageType=Success]>.Container .Member .CheckGroup .Text {
    width: 100%;
    font-size: 12px;
    max-width: 300px;
    line-height: 17px
}

.Page[PageType=Success]>.Container .Next {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-content: flex-start;
    text-align: left;
    gap: 17px
}

.Page[PageType=Success]>.Container .Next .Title {
    line-height: 20px;
    text-align: left;
    margin: 0
}

.Page[PageType=Success]>.Container .Next .Text {
    width: 100%;
    text-align: left;
    line-height: 20px
}

.Page[PageType=Success]>.Container .PaymentInformationP2 {
    width: 100%;
    padding: 12px;
    border: 1px dashed #000;
    margin: 20px 0
}

.Page[PageType=Success]>.Container .PaymentInformationP2 .Text {
    width: 100%;
    font-size: 12px;
    line-height: 18px;
    color: #000
}

.Page[PageType=Success]>.Container .PaymentInformationP3 {
    padding: 12px;
    display: flex;
    margin: 20px 0;
    flex-direction: column;
    align-items: center;
    align-content: center;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    gap: 15px;
    font-size: 14px
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Item {
    line-height: 18px
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Item>span:first-child {
    color: #656565
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Item>span:nth-child(2) {
    color: #000;
    font-weight: 400
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Note {
    width: 100%;
    text-align: center;
    color: red
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Btn {
    border: 1px solid #dedede;
    background: #f5f5f5;
    margin-top: 0
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Btn.success {
    border: 1px solid #4caf50;
    background: 0 0;
    color: #2f8432;
    margin-top: 0;
    pointer-events: none
}

.Page[PageType=Success]>.Container .PaymentInformationP3 .Btn.success>svg {
    display: block;
    margin-right: 20px
}

.Page[PageType=Success]>.Container .CargoNote,
.fr_comment_CommentAreaBody .CommentFilterArea .Filterbox {
    width: 100%;
    display: flex;
    align-items: center
}

.Page[PageType=Success]>.Container .CargoNote>svg {
    margin-right: 6px;
    flex: none
}

.Page[PageType=Success]>.Container .CargoNote>span {
    width: 100%;
    font-size: 11px;
    color: red
}

[PageType=Account] .Empty {
    margin: 40px 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid #000;
    padding: 40px;
    display: none
}

[PageType=Account] .Empty .Icon {
    display: flex;
    margin-bottom: 8px;
    align-items: center;
    justify-content: center
}

[PageType=Account] .Empty .Title {
    font-size: 11px;
    margin-bottom: 8px;
    text-align: center
}

[PageType=Account] .Empty .Text {
    font-size: 11px;
    margin-bottom: 11px
}

[PageType=Account] .Container[P=Support] .BtnList {
    display: flex;
    margin-top: 30px;
    justify-content: flex-end;
    width: 100%
}

[PageType=Account] .Container[P=Support] .BtnList>.Btn {
    display: block;
    width: 210px
}

[PageType=Account] .Container[P=Balance] .Balance,
[PageType=Account] .Container[P=Payment] .PaymentBar {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between
}

[PageType=Account] .Container[P=Balance] .Balance>div:first-child,
[PageType=Account] .Container[P=Payment] .PaymentBar>div:first-child {
    display: flex;
    gap: 18px
}

[PageType=Account] .Container[P=Balance] .Balance>div:first-child>span:nth-child(2),
[PageType=Account] .Container[P=Payment] .PaymentBar>div:first-child>span:nth-child(2),
[PageType=Account] .Container[P=Payment] .PaymentBar>div:nth-child(2)>span:nth-child(2) {
    color: #1a32a4;
    font-weight: 500;
    font-size: 13px
}

[PageType=Account] .Container[P=Payment] .PaymentBar>div:nth-child(2) {
    display: flex;
    gap: 18px;
    max-width: inherit;
    width: inherit
}

[PageType=Account] .Container[P=Payment] .List {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
    margin-top: 30px;
    flex-wrap: wrap
}

[PageType=Account] .Container[P=Payment] .List .AccountItem {
    display: flex;
    flex-direction: column;
    border: 1px solid #000;
    align-items: flex-start;
    width: calc(33.33% - 20px)
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .Title {
    display: flex;
    width: 100%;
    border-bottom: 1px solid;
    padding: 18px 22px;
    cursor: pointer
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .Title .Text {
    font-size: 13px;
    font-weight: 500
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .Items {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .Items .Item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 6px 22px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="1"],
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="99"],
[PageType=Account] .Container[P=Return] .Select {
    border-bottom: 1px solid #000;
    padding-bottom: 10px
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .Items .Item span:first-child {
    color: #696969
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .BtnList {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0 22px;
    margin-top: 5px;
    gap: 20px
}

[PageType=Account] .Container[P=Payment] .List .AccountItem .BtnList .Btn {
    font-size: 10px;
    text-decoration: underline;
    cursor: pointer
}

[PageType=Account] .Container[P=Balance] .Balance>div.Btn {
    display: none;
    width: auto;
    text-decoration: underline;
    cursor: pointer
}

[PageType=Account] .Table {
    display: none;
    margin-top: 62px;
    overflow: auto
}

[PageType=Account] .Table table {
    width: 100%;
    border-collapse: collapse;
    border: 0
}

[PageType=Account] .Table table thead th {
    border-bottom: 1px solid #a9a9a9;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    line-height: 28px
}

[PageType=Account] .Table table tbody td {
    border-bottom: 1px solid #a9a9a9;
    font-size: 12px;
    text-align: center;
    padding: 14px 0
}

[PageType=Account] .Container[P=Return] [T=newReturn] .ReturnInformation .Title {
    display: flex;
    font-weight: 500
}

[PageType=Account] .Container[P=Return] [T=newReturn] .ReturnInformation .Desc {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
    line-height: 24px
}

[PageType=Account] .Container[P=Return] [T=newReturn] .ReturnInformation .Btn {
    padding: 0 30px;
    width: 100%
}

[PageType=Account] .Container[P=Return] .Select {
    display: flex;
    align-items: center
}

[PageType=Account] .Container[P=Return] .Select>select {
    border: 0;
    margin-left: 15px;
    outline: 0;
    font-size: 12px;
    letter-spacing: 0
}

[PageType=Account] .Container[P=Return] .OrderDetail .Title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List {
    display: flex;
    flex-direction: column;
    gap: 40px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item {
    display: flex;
    flex-direction: column;
    border-top: 1px solid #000;
    padding-top: 15px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Photo {
    width: 52px;
    margin-right: 16px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Product {
    display: flex;
    flex-direction: column;
    gap: 6px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Product>.Item {
    display: block;
    border: 0;
    padding: 0
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .LastDay,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Return,
[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Success {
    display: none;
    gap: 20px;
    margin-left: auto
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action {
    display: flex;
    gap: 20px;
    margin-left: auto
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action .InputBox>span {
    display: block;
    margin-bottom: 6px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action .InputBox>select {
    display: block;
    border: 1px solid #000;
    height: 34px;
    font-size: 12px;
    min-width: 200px;
    outline: 0
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action .InputBox>select.error {
    border: 1px solid #e91e1e;
    color: red
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Note {
    display: block;
    margin: 0
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item:not([data-status="0"]) .Information .Check {
    pointer-events: none;
    opacity: .2
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="99"] .Information .Return {
    display: flex;
    border: 1px dashed #000;
    padding: 10px
}

[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="1"] .Information .Success {
    display: flex;
    border: 1px dashed #4caf50;
    padding: 10px;
    color: #319435
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid #a9a9a9;
    padding-bottom: 30px;
    margin-bottom: 30px
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery {
    width: 100px;
    display: flex;
    flex: none;
    flex-wrap: wrap;
    margin-right: 20px
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Info {
    width: 100%;
    display: flex;
    margin-bottom: 12px;
    justify-content: space-between
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Info .Item {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: flex-start;
    border: 0;
    padding: 0;
    margin: 0
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Cargo,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Code {
    width: 100%;
    border: 1px dashed #acacac;
    background: #f8f8f8;
    padding: 7px;
    display: flex;
    align-items: center;
    justify-content: center
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Cargo span:first-child,
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Code span:first-child {
    margin-right: 4px;
    font-weight: 500
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Cargo span:nth-child(2),
[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Code span:nth-child(2) {
    color: #1a32a4;
    padding-top: 2px
}

[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .BtnList {
    width: 220px;
    flex: none;
    margin-left: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

[PageType=Account] .Table::-webkit-scrollbar {
    display: none;
    width: 2px;
    background: #b2b2b2
}

[PageType=Account] .Table:hover::-webkit-scrollbar {
    display: block
}

[PageType=Account] .Table::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 2px
}

[PageType=Account] .Table::-webkit-scrollbar-thumb:hover {
    background: #555
}

[Grid="1"] .ProductItem {
    width: 100%;
    margin: auto
}

[Grid="102"] .ProductItem {
    width: 51%;
    margin: auto
}

[Grid="102"] .ProductItem>div {
    max-width: 450px;
    margin: auto
}

[Grid="102f"] .ProductItem {
    width: 100%;
    max-width: 51%;
    margin: auto
}

[Grid="201"] .ProductItem,
[Grid="201f"] .ProductItem {
    width: calc(50%)
}

[Grid="201"] .ProductItem>div,
[Grid="204"] .ProductItem>div {
    max-width: 450px
}

[Grid="201"] .ProductItem:nth-child(+3n)>div,
[Grid="201f"] .ProductItem:nth-child(+3n)>div {
    margin: auto
}

[Grid="204"] .ProductItem,
[Grid="204f"] .ProductItem {
    max-width: calc(50%);
    min-width: calc(50%)
}

[Grid="204"] .ProductItem:nth-child(3n+1)>div {
    max-width: 450px;
    margin-left: auto
}

[Grid="204"] .ProductItem:not(:nth-child(6n +1), :nth-child(6n +2)),
[Grid="204f"] .ProductItem:not(:nth-child(6n +1), :nth-child(6n +2)) {
    width: 25%;
    max-width: inherit;
    min-width: inherit
}

[Grid="204"] .ProductItem:not(:nth-child(6n +1), :nth-child(6n +2))>div,
[Grid="204f"] .ProductItem:not(:nth-child(6n +1), :nth-child(6n +2))>div {
    width: 100%;
    max-width: inherit;
    min-width: inherit
}

[Grid="302"] .ProductItem {
    width: calc(33.33)
}

[Grid="6"] .ProductItem {
    width: 16.66%
}

[Grid="12"] .ProductItem {
    width: 8.333%
}

.ProductItem.Favorite,
.ProductItem.Wait {
    width: 100%;
    border-bottom: 1px solid #b2b2b2;
    display: flex;
    padding-bottom: 0;
    margin-bottom: 25px;
    padding-left: 1px;
    padding-top: 1px;
    align-items: flex-start
}

.ProductItem.Wait .Gallery {
    display: block;
    width: 115px;
    margin-right: 5px;
    height: auto;
    flex: none
}

.ProductItem.Favorite .Info,
.ProductItem.Wait .Info {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: inherit;
    padding-top: 0
}

.ProductItem.Favorite .Info .Product .PriceBox,
.ProductItem.Wait .Info .Product .PriceBox {
    display: flex;
    gap: 4px;
    flex-direction: column;
    position: inherit;
    align-items: flex-start;
    width: max-content
}

.ProductItem.Favorite .Info .Product>.Code,
.ProductItem.Wait .Info .Product>.Code {
    margin: 5px 0 10px;
    font-size: 11px;
    color: #888
}

.ProductItem.Wait .Info .Product>.Color .Variation {
    display: block;
    border-left: 1px solid #ccc;
    line-height: 10px;
    padding-left: 5px
}

.ProductItem.Wait .Info .Properties {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    margin: inherit
}

.ProductItem.Favorite .Info .Properties .Btn,
.ProductItem.Wait .Info .Properties .Btn {
    margin-right: 14px;
    line-height: 25px;
    font-size: 12px;
    width: initial;
    padding: 2px 8px 0
}

.ProductItem.Wait .Info .Properties .Btn[fr=stockOut] {
    display: none;
    color: #989898;
    border-color: #c3c3c3
}

.ProductItem.Favorite .Gallery {
    display: block;
    max-width: 115px;
    margin-right: 5px;
    height: auto;
    flex: none
}

.ProductItem.Favorite .Info .Properties {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    margin: inherit;
    align-items: stretch;
    gap: 12px
}

.ProductItem.Favorite .Info .Properties .Sizes>select {
    border: 1px solid #000;
    font-size: 12px;
    padding: 4px 6px;
    outline: 0;
    background: 0 0
}

[PageType=Error] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 30px 0 0
}

[PageType=Error] .Icon {
    margin-bottom: 34px
}

[PageType=Error] .Title {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px
}

[PageType=Error] .Text {
    font-size: 13px;
    text-align: center;
    line-height: 25px;
    margin-bottom: 15px
}

[PageType=Error] .Text.Bold {
    font-size: 12px;
    line-height: 19px;
    font-weight: 500;
    margin-bottom: 23px;
    border: 1px solid #ddd;
    border-left: 0;
    border-right: 0;
    padding: 8px 0
}

.MobileAdditionHead {
    height: calc(100% - 1px);
    position: absolute;
    z-index: 3;
    background: #fff;
    width: 65%;
    padding: 13px 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    top: -100%;
    transition: .2s
}

.MobileAdditionHead svg {
    display: flex;
    margin-top: -3px
}

.MobileAdditionHead div {
    display: flex;
    gap: 4px;
    margin-bottom: -2px
}

.MobileAddition {
    position: absolute;
    display: none;
    top: -100%;
    z-index: 2;
    background: #fff;
    width: 100%;
    height: 100%;
    padding: 80px 0 30px;
    transition: .4s;
    flex-direction: column
}

.MobileAddition .Content .Addition {
    width: 100%;
    display: flex;
    align-items: flex-start;
    padding: 0 20px
}

.MobileAddition .Content .Divider {
    height: 1px;
    background: #000;
    margin: 16px 0
}

.MobileAddition .Content .Title {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0 20px
}

.MobileAddition .Content .Title .Btn {
    display: flex;
    width: 100%;
    line-height: inherit;
    text-decoration: underline;
    text-align: right;
    justify-content: flex-end
}

.MobileAddition .Content .Products {
    width: 100%;
    margin-top: 30px;
    display: flex;
    gap: 32px;
    flex-direction: column;
    overflow: auto;
    padding: 0 20px
}

.MobileAddition .Content .Products .ProductItem {
    width: 100%;
    padding: 0
}

.MobileAddition .Content .Products .ProductItem .Gallery {
    width: 44px;
    flex: none;
    margin-right: 8px
}

.MobileAddition .Content .Products .ProductItem .Info {
    height: inherit;
    margin: 0;
    padding: 0
}

.MobileAddition .Content .Products .ProductItem .Info .Name {
    max-width: 60%
}

.MobileAddition .Content .Products .ProductItem .Info .PriceBox {
    position: absolute;
    right: 0;
    top: 0;
    width: initial;
    display: flex;
    align-items: flex-end
}

body.AdditionView .MobileAddition,
body.AdditionView .MobileAdditionHead {
    top: 0;
    opacity: 1;
    transition: .4s;
    display: flex
}

.CustomerBox .Customer div {
    width: 100%;
    font-size: 11px
}

.CustomerBox .SenderMessage {
    width: 100%;
    display: flex;
    border: 1px solid #000;
    align-items: center;
    justify-content: flex-start;
    padding: 14px 24px
}

.CustomerBox .SenderMessage .Icon {
    margin-right: 10px;
    display: flex
}

.CustomerBox .SenderMessage .Arrow {
    margin-left: auto;
    transform: rotate(180deg);
    display: flex
}

@media(max-width: 1280px) {
    body[Page=View] section[L=Head] {
        position: sticky;
        background: #fff
    }

    [PageType=Account] .LeftArea {
        max-width: 260px;
        min-width: 200px;
        width: 100%
    }

    .Page[PageType=View][Load="0"],
    .Page[PageType=View][Load="1"] {
        position: relative;
        opacity: 1
    }

    .Page[PageType=View] .GalleryBar {
        width: 50%
    }

    .Page[PageType=View] .Information {
        width: 50%;
        flex: auto
    }

    [Grid="6"] .ProductItem {
        width: 25%
    }
}

@media(max-width: 990px) {
    body.PopupOpen {
        margin-right: 0 !important
    }

    .PopupBox.Mobil:not(.Loading) {
        display: flex;
        width: 100%;
        min-height: initial;
        flex-direction: column;
        justify-content: flex-end
    }

    .PopupBox.Mobil:not(.Loading)>.Document {
        width: 100%;
        min-height: initial;
        right: inherit;
        bottom: -100%
    }

    .PopupBox.Mobil.Show:not(.Loading) .Document {
        bottom: 0;
        transition: .2s;
        min-width: 100%;
        width: 100% !important
    }

    .PopupBox.LoginLoad>.Document {
        width: auto !important;
        border-radius: 4px;
        padding: 10px;
        min-width: inherit;
        margin: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: inherit
    }

    .PopupBox:not(.Loading)>.Document>.Container {
        overflow: auto
    }

    .PopupBox.Mobil:not(.Loading)>.Document>.Container {
        margin: 0;
        padding: 0
    }

    .PopupBox.RightPop {
        display: flex;
        justify-content: flex-end;
        height: 100%
    }

    .modLogin_closed {
        padding: 32px
    }

    .modLogin_container_left_area {
        display: none
    }

    .modLogin_container_title {
        font-size: 12px
    }

    .modLogin_container_right_area {
        width: 100%;
        padding: 60px 24px 24px
    }

    .modLogin_container_right_area_container {
        width: 100%
    }
}

.Container.W1360 {
    width: 100%;
    max-width: 1360px
}

section[L=HEAD] {
    position: relative;
    z-index: 2
}

section[L=VIEW] {
    position: relative;
    z-index: 1
}

section[L=FOOTER] {
    position: relative;
    z-index: 0
}

.ModsPop,
.module-login.Right,
section[Mod=Nav],
section[Mod=Nav]>.Container,
section[Mod=Nav]>.Overflow {
    position: fixed;
    top: 0;
    height: 100%
}

section[Mod=Nav] {
    left: 0;
    width: 100%;
    z-index: 100;
    display: none;
    transition: .4s
}

section[Mod=Nav].Show {
    display: block;
    transition: .4s
}

section[Mod=Nav]>.Overflow {
    width: 100%;
    left: 0;
    background: #0000002e;
    z-index: 0
}

section[Mod=Nav]>.Container {
    left: 75px;
    width: 350px;
    background: #fff;
    z-index: 1;
    transition: .4s
}

section[Mod=Nav] .BtnList {
    display: inline;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0;
    z-index: 1;
    border-top: 1px solid #a9a9a9;
    text-align: center;
    line-height: 55px;
    background: #fff;
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-around
}

section[Mod=Nav] .BtnList>* {
    width: 50%;
    border-left: 1px solid #a9a9a9;
    justify-content: center
}

section[Mod=Nav] .BtnList>:first-child {
    border-left: 0
}

section[Mod=Nav] .Bar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    padding: 19px 20px
}

section[Mod=Nav] .Bar .Closed {
    align-items: center;
    justify-content: center;
    flex: none;
    display: none
}

section[Mod=Nav] .Logo {
    display: block;
    margin-left: 10px
}

section[Mod=Nav] .Logo>img {
    height: 20px;
    display: block
}

section[Mod=Nav] .UserBar {
    margin-left: auto;
    align-items: center;
    display: none
}

section[Mod=Nav] .UserBar .Btn {
    margin-left: 24px;
    line-height: 16px
}

section[Mod=Nav] .UserBar .Btn[fr=Bag]>div {
    line-height: 14px;
    display: none;
    margin-left: 4px;
    padding-top: 2px;
    font-size: 12px
}

section[Mod=Nav] .TopNav {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin-top: 25px;
    padding-bottom: 38px;
    border-bottom: 1pt solid #a9a9a9
}

section[Mod=Nav] .TopNav>.NavItem {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    cursor: pointer;
    position: relative
}

section[Mod=Nav] .TopNav>.NavItem.active::before {
    content: "";
    width: 4px;
    height: 4px;
    background: #000;
    position: absolute;
    bottom: -5px
}

section[Mod=Nav] .SubNav {
    width: 100%;
    padding: 28px 28px 160px;
    display: none;
    overflow: auto
}

section[Mod=Nav] .SubNav::-webkit-scrollbar {
    display: none;
    width: 2px;
    background: #b2b2b2
}

section[Mod=Nav] .SubNav:hover::-webkit-scrollbar {
    display: block
}

section[Mod=Nav] .SubNav::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 2px
}

section[Mod=Nav] .SubNav::-webkit-scrollbar-thumb:hover {
    background: #555
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item.active .Info .Address,
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item.active .Info .BtnText[S='1'],
.Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .tab-content#email,
.Rating .comment-area .icon-section span>svg[x=grey],
.Rating .comment-area .icon-section[point="0.1"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.2"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.3"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.4"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.5"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.6"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.7"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.8"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="0.9"] span:first-child>svg[x=half],
.Rating .comment-area .icon-section[point="1"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.1"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.1"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.2"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.2"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.3"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.3"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.4"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.4"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.5"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.5"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.6"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.6"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.7"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.7"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.8"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.8"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="1.9"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="1.9"] span:nth-child(2)>svg[x=half],
.Rating .comment-area .icon-section[point="2"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.1"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.1"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.1"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.2"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.2"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.2"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.3"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.3"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.3"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.4"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.4"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.4"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.5"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.5"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.5"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.6"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.6"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.6"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.7"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.7"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.7"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.8"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.8"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.8"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="2.9"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="2.9"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="2.9"] span:nth-child(3)>svg[x=half],
.Rating .comment-area .icon-section[point="3"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.1"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.1"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.1"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.1"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.2"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.2"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.2"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.2"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.3"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.3"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.3"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.3"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.4"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.4"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.4"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.4"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.5"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.5"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.5"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.5"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.6"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.6"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.6"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.6"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.7"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.7"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.7"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.7"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.8"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.8"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.8"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.8"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="3.9"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="3.9"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="3.9"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="3.9"] span:nth-child(4)>svg[x=half],
.Rating .comment-area .icon-section[point="4"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.1"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.1"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.1"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.1"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.1"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.2"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.2"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.2"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.2"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.2"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.3"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.3"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.3"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.3"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.3"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.4"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.4"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.4"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.4"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.4"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.5"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.5"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.5"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.5"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.5"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.6"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.6"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.6"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.6"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.6"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.7"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.7"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.7"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.7"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.7"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.8"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.8"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.8"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.8"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.8"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="4.9"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="4.9"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="4.9"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="4.9"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="4.9"] span:nth-child(5)>svg[x=half],
.Rating .comment-area .icon-section[point="5"] span:first-child>svg[x=full],
.Rating .comment-area .icon-section[point="5"] span:nth-child(2)>svg[x=full],
.Rating .comment-area .icon-section[point="5"] span:nth-child(3)>svg[x=full],
.Rating .comment-area .icon-section[point="5"] span:nth-child(4)>svg[x=full],
.Rating .comment-area .icon-section[point="5"] span:nth-child(5)>svg[x=full],
.fancybox-is-sliding .fancybox-slide,
.fancybox-show-thumbs .fancybox-thumbs,
.fancybox-slide--current,
.fancybox-slide--next,
.fancybox-slide--previous,
[PageType=Stores] .Content .Detail .Item.active,
section[Mod=Nav] .SubNav.active {
    display: block
}

section[Mod=Nav] .SubNav>.NavItem>.Box {
    width: 100%;
    height: 32px;
    line-height: 30px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 2px 12px 0;
    position: relative
}

section[Mod=Nav] .SubNav>.NavItem:not([SB="0"])>.Box::after {
    content: "\f107";
    font-family: 'Font Awesome 6 Pro';
    font-weight: 300;
    font-size: 14px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%)
}

section[Mod=Nav] .SubNav>.NavItem>.Multiple_SubNav {
    display: none;
    padding: 0 29px 10px
}

section[Mod=Nav] .SubNav>.NavItem>.Multiple_SubNav .NavItem .Box {
    width: 100%;
    line-height: 26px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 2px 12px 0
}

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

    .camp_popup .camp_popupContent,
    .camp_popup .camp_popupContent img {
        width: 100%
    }

    section[Mod=Nav]>.Container {
        left: 0;
        width: 100%;
        padding: 0
    }

    section[Mod=Nav] .Bar {
        padding: 0
    }

    section[Mod=Nav] .TopNav {
        margin-top: 33px;
        padding-bottom: 30px
    }

    section[Mod=Nav] .Bar .Logo {
        margin: 0
    }

    section[Mod=Nav] .Bar .Closed {
        display: flex;
        padding: 18px 20px;
        align-items: center;
        justify-content: center
    }

    section[Mod=Nav] .Bar .Closed>svg {
        width: 14px
    }

    section[Mod=Nav] .Bar .UserBar {
        display: flex;
        padding: 0 20px
    }
}

.ProductOtherViewContainer .OtherProductView {
    margin-bottom: 24px
}

.ModsPop {
    width: 100%;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 11111111111
}

.ModsPop.RightPop>.Document {
    min-width: 420px;
    min-height: 100%;
    right: -120%;
    transition: .1s;
    flex: none
}

.tiyu-pop-container [campaing=true] .tiyu-price {
    display: flex;
    background: #ffeb3b;
    width: fit-content;
    padding: 3px 4px 2px;
    align-items: center;
    font-weight: 400;
    gap: 8px
}

.tiyu-pop-container [campaing=true] .tiyu-price .tiyu-sale {
    width: 100%;
    margin: 0;
    font-weight: 400
}

.tiyu-pop-container [campaing=true] .tiyu-price .tiyu-discount {
    display: block;
    border-left: 1px solid #000;
    padding-left: 6px;
    line-height: 10px
}

.tiyu-pop-container [campaing=true] .tiyu-campaing-badge {
    border: 1px solid #000;
    padding: 2px 4px;
    color: #000;
    width: fit-content;
    font-weight: 300
}

.fancybox-active {
    height: auto
}

.fancybox-is-hidden {
    left: -9999px;
    margin: 0;
    position: absolute !important;
    top: -9999px;
    visibility: hidden
}

.fancybox-container {
    -webkit-backface-visibility: hidden;
    height: 100%;
    left: 0;
    outline: 0;
    position: fixed;
    top: 0;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    transform: translateZ(0);
    width: 100%;
    z-index: 99999999
}

.fancybox-bg,
.fancybox-inner,
.fancybox-outer,
.fancybox-stage {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.fancybox-outer {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto
}

.fancybox-bg {
    background: rgba(0, 0, 0, .62);
    opacity: 0;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.47, 0, .74, .71)
}

.fancybox-is-open .fancybox-bg {
    opacity: .9;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.fancybox-caption,
.fancybox-infobar,
.fancybox-navigation .fancybox-button,
.fancybox-toolbar {
    direction: ltr;
    opacity: 1;
    position: absolute;
    transition: opacity .25s, visibility 0s .25s;
    z-index: 99997
}

.fancybox-show-caption .fancybox-caption,
.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-nav .fancybox-navigation .fancybox-button,
.fancybox-show-toolbar .fancybox-toolbar {
    opacity: 1;
    transition: opacity .25s, visibility;
    visibility: visible
}

.fancybox-slide,
.fancybox-slide--image .fancybox-content {
    transition-property: transform, opacity;
    -webkit-backface-visibility: hidden
}

.fancybox-infobar {
    color: #ccc;
    font-size: 13px;
    -webkit-font-smoothing: subpixel-antialiased;
    height: 44px;
    left: 0;
    line-height: 44px;
    min-width: 44px;
    mix-blend-mode: difference;
    padding: 0 10px;
    pointer-events: none;
    top: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.fancybox-toolbar {
    right: 0;
    top: 0
}

.fancybox-stage {
    direction: ltr;
    overflow: visible;
    transform: translateZ(0);
    z-index: 99994
}

.fancybox-slide {
    display: none;
    height: 100%;
    left: 0;
    outline: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: absolute;
    text-align: center;
    top: 0;
    white-space: normal;
    width: 100%;
    z-index: 99994
}

.fancybox-content,
.fancybox-slide:before {
    display: inline-block;
    vertical-align: middle
}

.fancybox-slide:before {
    content: "";
    font-size: 0;
    height: 100%;
    width: 0
}

.fancybox-slide--image {
    overflow: hidden;
    padding: 0
}

.fancybox-button--fsenter svg:nth-child(2),
.fancybox-button--fsexit svg:first-child,
.fancybox-button--pause svg:first-child,
.fancybox-button--play svg:nth-child(2),
.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small,
.fancybox-slide--image:before {
    display: none
}

.fancybox-slide--html {
    padding: 6px
}

.fancybox-content {
    background: #fff;
    margin: 0;
    max-width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: relative;
    text-align: left
}

.fancybox-image,
.fancybox-slide--image .fancybox-content,
.fancybox-spaceball {
    max-width: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    left: 0;
    top: 0
}

.fancybox-slide--image .fancybox-content {
    animation-timing-function: cubic-bezier(.5, 0, .14, 1);
    background: 0 0/100% 100% no-repeat;
    overflow: visible;
    padding: 0;
    position: absolute;
    transform-origin: top left;
    user-select: none;
    z-index: 99995
}

.hov05::before,
.hov06::before {
    z-index: 2;
    display: block;
    content: ''
}

.fancybox-can-zoomOut .fancybox-content {
    cursor: zoom-out
}

.fancybox-can-zoomIn .fancybox-content {
    cursor: zoom-in
}

.fancybox-can-pan .fancybox-content,
.fancybox-can-swipe .fancybox-content {
    cursor: grab
}

.fancybox-is-grabbing .fancybox-content {
    cursor: grabbing
}

.fancybox-container [data-selectable=true] {
    cursor: text
}

.fancybox-image,
.fancybox-spaceball {
    background: 0 0;
    border: 0;
    height: 100%;
    margin: 0;
    max-height: none;
    padding: 0;
    position: absolute;
    user-select: none;
    width: 100%
}

.Rating .comment-area .icon-section span>svg[x=full],
.fancybox-spaceball {
    z-index: 1
}

.fancybox-slide--iframe .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--video .fancybox-content {
    height: 100%;
    overflow: visible;
    padding: 0;
    width: 100%
}

.fancybox-slide--video .fancybox-content {
    background: #000
}

.fancybox-slide--map .fancybox-content {
    background: #e5e3df
}

.fancybox-slide--iframe .fancybox-content {
    background: #fff
}

.fancybox-iframe,
.fancybox-video {
    background: 0 0;
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%
}

.fancybox-iframe {
    left: 0;
    position: absolute;
    top: 0
}

.fancybox-error {
    background: #fff;
    cursor: default;
    max-width: 400px;
    padding: 40px;
    width: 100%
}

.fancybox-error p {
    color: #444;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0
}

.fancybox-button {
    background: 0 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    height: 64px;
    margin: 0;
    padding: 10px;
    position: relative;
    transition: color .2s;
    vertical-align: top;
    visibility: inherit;
    width: 64px
}

.fancybox-button,
.fancybox-button:link,
.fancybox-button:visited {
    color: #ccc
}

.fancybox-button:focus {
    outline: 0
}

.fancybox-button.fancybox-focus {
    outline: dotted 1px
}

.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
    color: #888;
    cursor: default;
    outline: 0
}

.fancybox-button svg {
    display: block;
    height: 100%;
    overflow: visible;
    position: relative;
    width: 100%
}

.fancybox-button svg path {
    fill: currentColor;
    stroke-width: 0
}

.fancybox-progress {
    background: #ff5268;
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scaleX(0);
    transform-origin: 0;
    transition-property: transform;
    transition-timing-function: linear;
    z-index: 99998
}

.fancybox-close-small {
    background: 0 0;
    border: 0;
    border-radius: 0;
    color: #ccc;
    cursor: pointer;
    opacity: .8;
    padding: 8px;
    position: absolute;
    right: -12px;
    top: -44px;
    z-index: 401
}

.fancybox-close-small:hover {
    color: #fff;
    opacity: 1
}

.fancybox-slide--html .fancybox-close-small {
    color: currentColor;
    padding: 10px;
    right: 0;
    top: 0
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
    overflow: hidden
}

.fancybox-navigation .fancybox-button {
    background-clip: content-box;
    height: 100px;
    opacity: 1;
    position: absolute;
    top: calc(50% - 50px);
    width: 70px;
    background-color: transparent
}

.fancybox-navigation .fancybox-button div {
    padding: 7px
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
    left: env(safe-area-inset-left);
    padding: 31px 26px 31px 6px
}

.fancybox-navigation .fancybox-button--arrow_right {
    padding: 31px 6px 31px 26px;
    right: 0;
    right: env(safe-area-inset-right)
}

.fancybox-caption {
    background: linear-gradient(0deg, rgba(0, 0, 0, .85) 0, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, .15) 65%, rgba(0, 0, 0, .075) 75.5%, rgba(0, 0, 0, .037) 82.85%, rgba(0, 0, 0, .019) 88%, transparent);
    bottom: 0;
    color: #eee;
    font-size: 14px;
    font-weight: 400;
    left: 0;
    line-height: 1.5;
    padding: 75px 44px 25px;
    pointer-events: none;
    right: 0;
    text-align: center;
    z-index: 99996
}

@supports (padding: max(0px)) {
    .fancybox-caption {
        padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left))
    }
}

.fancybox-caption--separate {
    margin-top: -50px
}

.fancybox-caption__body {
    max-height: 50vh;
    overflow: auto;
    pointer-events: all
}

.fancybox-caption a,
.fancybox-caption a:link,
.fancybox-caption a:visited {
    color: #ccc;
    text-decoration: none
}

.fancybox-caption a:hover {
    color: #fff;
    text-decoration: underline
}

.fancybox-loading {
    animation: 1s linear infinite a;
    background: 0 0;
    border: 4px solid #888;
    border-bottom-color: #fff;
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999
}

@keyframes a {
    to {
        transform: rotate(1turn)
    }
}

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, .25, 1)
}

.fancybox-fx-slide.fancybox-slide--previous {
    opacity: 0;
    transform: translate3d(-100%, 0, 0)
}

.fancybox-fx-slide.fancybox-slide--next {
    opacity: 0;
    transform: translate3d(100%, 0, 0)
}

.fancybox-fx-slide.fancybox-slide--current {
    opacity: 1;
    transform: translateZ(0)
}

.fancybox-fx-fade.fancybox-slide--next,
.fancybox-fx-fade.fancybox-slide--previous {
    opacity: 0;
    transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1
}

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1.5)
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(.5, .5, .5)
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    opacity: 1;
    transform: scaleX(1)
}

.fancybox-fx-rotate.fancybox-slide--previous {
    opacity: 0;
    transform: rotate(-1turn)
}

.fancybox-fx-rotate.fancybox-slide--next {
    opacity: 0;
    transform: rotate(1turn)
}

.fancybox-fx-rotate.fancybox-slide--current {
    opacity: 1;
    transform: rotate(0)
}

.fancybox-fx-circular.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0)
}

.fancybox-fx-circular.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0)
}

.fancybox-fx-circular.fancybox-slide--current {
    opacity: 1;
    transform: scaleX(1) translateZ(0)
}

.fancybox-fx-tube.fancybox-slide--previous {
    transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg)
}

.fancybox-fx-tube.fancybox-slide--next {
    transform: translate3d(100%, 0, 0) scale(.1) skew(10deg)
}

.fancybox-fx-tube.fancybox-slide--current {
    transform: translateZ(0) scale(1)
}

@media (max-height: 576px) {
    .fancybox-slide {
        padding-left: 6px;
        padding-right: 6px
    }

    .fancybox-slide--image {
        padding: 6px 0
    }

    .fancybox-close-small {
        right: -6px
    }

    .fancybox-slide--image .fancybox-close-small {
        background: #4e4e4e;
        color: #f2f4f6;
        height: 36px;
        opacity: 1;
        padding: 6px;
        right: 0;
        top: 0;
        width: 36px
    }

    .fancybox-caption {
        padding-left: 12px;
        padding-right: 12px
    }

    @supports (padding: max(0px)) {
        .fancybox-caption {
            padding-left: max(12px, env(safe-area-inset-left));
            padding-right: max(12px, env(safe-area-inset-right))
        }
    }
}

.fancybox-share {
    background: #f4f4f4;
    border-radius: 3px;
    max-width: 90%;
    padding: 30px;
    text-align: center
}

.fancybox-share h1 {
    color: #222;
    font-size: 35px;
    font-weight: 700;
    margin: 0 0 20px
}

.fancybox-share p {
    margin: 0;
    padding: 0
}

.fancybox-share__button {
    border: 0;
    border-radius: 3px;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 5px 10px;
    min-width: 130px;
    padding: 0 15px;
    text-decoration: none;
    transition: .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.fancybox-share__button:link,
.fancybox-share__button:visited {
    color: #fff
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .BtnText:hover,
.fancybox-share__button:hover {
    text-decoration: none
}

.fancybox-share__button--fb {
    background: #3b5998
}

.fancybox-share__button--fb:hover {
    background: #344e86
}

.fancybox-share__button--pt {
    background: #bd081d
}

.fancybox-share__button--pt:hover {
    background: #aa0719
}

.fancybox-share__button--tw {
    background: #1da1f2
}

.fancybox-share__button--tw:hover {
    background: #0d95e8
}

.fancybox-share__button svg {
    height: 25px;
    margin-right: 7px;
    position: relative;
    top: -1px;
    vertical-align: middle;
    width: 25px
}

.fancybox-share__button svg path {
    fill: #fff
}

.fancybox-share__input {
    background: 0 0;
    border: 0;
    border-bottom: 1px solid #d7d7d7;
    border-radius: 0;
    color: #5d5b5b;
    font-size: 14px;
    margin: 10px 0 0;
    outline: 0;
    padding: 10px 15px;
    width: 100%
}

.fancybox-thumbs {
    background: 0 0;
    bottom: 0;
    display: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 2px 2px 4px;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: 99995
}

.fancybox-thumbs-x {
    overflow-x: auto;
    overflow-y: hidden
}

.fancybox-show-thumbs .fancybox-inner {
    right: 0
}

.fancybox-thumbs__list {
    font-size: 0;
    height: 100%;
    list-style: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: relative;
    white-space: nowrap;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.fancybox-thumbs-x .fancybox-thumbs__list {
    overflow: hidden
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
    width: 7px
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3)
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px
}

.fancybox-thumbs__list a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    float: left;
    height: 75px;
    margin: 2px;
    outline: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 52px
}

.fancybox-thumbs__list a:before {
    border: 2px solid #000;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: .2s cubic-bezier(.25, .46, .45, .94);
    z-index: 99991;
    border-radius: 2px
}

.fancybox-thumbs__list a:focus:before {
    opacity: .5
}

.fancybox-thumbs__list a.fancybox-thumbs-active:before {
    opacity: 1
}

@media (max-width: 576px) {
    .fancybox-thumbs {
        width: 100%
    }

    .fancybox-show-thumbs .fancybox-inner {
        right: 0;
        width: 100%
    }

    .fancybox-thumbs__list a {
        max-width: calc(100% - 10px)
    }
}

.fancybox-caption,
.fancybox-infobar,
[data-fancybox-play],
[data-fancybox-thumbs],
[data-fancybox-zoom] {
    display: none !important
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .Hour,
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .Maps,
.fancybox-navigation .fancybox-button>div,
.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>svg,
.fr_comment_image_area_content .Counter,
.swiper-button-next:not(:empty):after,
.swiper-button-prev:not(:empty):after,
[Mod=fr_comment] .fr_comment_sizeText[data=''],
[PageType=Stores] .Content>select {
    display: none
}

.fancybox-navigation .fancybox-button--arrow_right::before {
    content: "\f054";
    font-size: 28px;
    font-family: "font awesome 6 pro";
    font-weight: 300
}

.fancybox-navigation .fancybox-button--arrow_left::before {
    content: "\f053";
    font-size: 28px;
    font-family: "font awesome 6 pro";
    font-weight: 300
}

body.inputt2 .Input label {
    position: absolute;
    top: -1px;
    left: 9px;
    z-index: 2;
    font-size: 14px;
    overflow: hidden;
    text-align: start;
    border: 1px solid transparent;
    transition: opacity .1s ease-in-out, transform .1s ease-in-out;
    color: #7b7b7b;
    line-height: 50px
}

body.inputt2 input:-webkit-autofill,
body.inputt2 select:-webkit-autofill,
body.inputt2 textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    transition: background-color 5000s ease-in-out;
    background-color: #fff !important
}

.PopupBox.Bottom {
    display: flex;
    align-items: flex-end;
    bottom: -100%;
    top: inherit;
    transition: bottom .3s
}

.PopupBox.Bottom.Show {
    bottom: 0;
    transition: bottom .3s
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-prev:after {
    content: "\f053";
    font-family: "font awesome 6 pro";
    font-weight: 200;
    font-size: 24px;
    color: #000
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
    content: "\f054";
    font-family: "font awesome 6 pro";
    font-weight: 200;
    font-size: 24px;
    color: #000;
    transform: rotate(180deg)
}

.hov01::before,
.hov02::before {
    content: "";
    pointer-events: none
}

.LazyModule {
    min-height: 400px;
    display: block;
    position: relative;
    overflow: hidden
}

.LazyModule:first-child {
    min-height: 60vh
}

.LazyModule.loaded {
    min-height: auto
}

.LazyModule.loaded>* {
    opacity: 0;
    transform: translateY(40px);
    animation: .8s forwards fadeUp
}

@keyframes fadeUp {
    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.skeleton-loader {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px
}

.skeleton {
    background: linear-gradient(90deg, #e0e0e0 25%, #f6f6f6 50%, #e0e0e0 75%);
    background-size: 200% 100%;
    animation: 1.5s infinite shimmer;
    border-radius: 6px
}

.skeleton-title {
    width: 60%;
    height: 20px
}

.skeleton-line {
    width: 100%;
    height: 14px
}

.skeleton-line.short {
    width: 80%
}

.skeleton-box {
    width: 100%;
    height: 180px
}

@keyframes shimmer {
    0% {
        background-position: -200% 0
    }

    100% {
        background-position: 200% 0
    }
}

.hov01,
.hov02 {
    position: relative;
    overflow: hidden
}

.hov01::before {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .15);
    transform: skewX(-20deg);
    transition: .5s
}

.hov02::before,
.hov05::before {
    width: 0;
    height: 0;
    position: absolute
}

.hov02::before {
    top: 50%;
    left: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .25) 0, transparent 70%);
    transform: translate(-50%, -50%);
    transition: .4s ease-out
}

.hov02:hover::before {
    width: 200%;
    height: 200%;
    opacity: 0
}

.hov03::after,
.hov03::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: scale3d(0, 0, 1);
    transition: transform .3s ease-out;
    background: rgba(255, 255, 255, .1);
    content: '';
    pointer-events: none
}

.hov03::before {
    transform-origin: left top
}

.hov03::after {
    transform-origin: right bottom
}

.hov03:focus::after,
.hov03:focus::before,
.hov03:hover::after,
.hov03:hover::before {
    transform: scale3d(1, 1, 1)
}

.hov04:hover img {
    opacity: 1;
    -webkit-animation: 1.5s hov04;
    animation: 1.5s hov04
}

@-webkit-keyframes hov04 {
    0% {
        opacity: .4
    }

    100% {
        opacity: 1
    }
}

@keyframes hov04 {
    0% {
        opacity: .4
    }

    100% {
        opacity: 1
    }
}

.hov05::before {
    top: 50%;
    left: 50%;
    background: rgba(255, 255, 255, .2);
    border-radius: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0
}

.hov05:hover::before {
    -webkit-animation: .75s hov05;
    animation: .75s hov05
}

@-webkit-keyframes hov05 {

    0%,
    40% {
        opacity: 1
    }

    100% {
        width: 200%;
        height: 200%;
        opacity: 0
    }
}

@keyframes hov05 {

    0%,
    40% {
        opacity: 1
    }

    100% {
        width: 200%;
        height: 200%;
        opacity: 0
    }
}

.hov06::before {
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg)
}

.hov06:hover::before {
    -webkit-animation: .75s hov06;
    animation: .75s hov06
}

@-webkit-keyframes hov06 {
    100% {
        left: 125%
    }
}

@keyframes hov06 {
    100% {
        left: 125%
    }
}

.hov07 img,
.hov07 video {
    -webkit-filter: grayscale(0) blur(0);
    filter: grayscale(0) blur(0);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out
}

.hov07:hover img,
.hov07:hover video {
    -webkit-filter: grayscale(50%) blur(2px);
    filter: grayscale(50%) blur(2px)
}

.hov08 img,
.hov08 video {
    -webkit-mask-image: linear-gradient(45deg, #000 25%, rgba(0, 0, 0, .2) 50%, #000 75%);
    mask-image: linear-gradient(45deg, #000 25%, rgba(0, 0, 0, .2) 50%, #000 75%);
    -webkit-mask-size: 800%;
    mask-size: 800%;
    -webkit-mask-position: 0;
    mask-position: 0
}

.hov08:hover img,
.hov08:hover video {
    transition: mask-position 2s, -webkit-mask-position 2s;
    -webkit-mask-position: 120%;
    mask-position: 120%;
    opacity: 1
}

[PageType=Stores] .Container {
    width: 100%;
    padding: 0 84px;
    margin-top: 160px;
    display: flex;
    flex-direction: column
}

[PageType=Stores] .TitleBar {
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #efefef;
    padding-bottom: 14px;
    margin-bottom: 32px
}

[PageType=Stores] .TitleBar .Title {
    width: 100%;
    font-size: 16px
}

[PageType=Stores] .TitleBar .Search {
    width: 320px;
    flex: none;
    position: relative
}

[PageType=Stores] .TitleBar .Search>input {
    border: 1px solid #ccc;
    line-height: 30px;
    padding: 0 12px;
    width: 100%
}

[PageType=Stores] .Content {
    width: 100%;
    display: flex;
    align-items: flex-start
}

[PageType=Stores] .Content .List {
    width: 420px;
    flex: none;
    overflow: auto;
    padding-right: 8px
}

[PageType=Stores] .Content .List::-webkit-scrollbar {
    width: 2px;
    background: #efefef;
    display: block
}

[PageType=Stores] .Content .List::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 2px
}

[PageType=Stores] .Content .List::-webkit-scrollbar-thumb:hover {
    background: #e3e3e3
}

[PageType=Stores] .Content .List .Item {
    width: 100%;
    border-bottom: 1px solid #efefef;
    padding: 19px 16px
}

[PageType=Stores] .Content .List .Item .Name {
    width: 100%;
    font-weight: 700;
    font-size: 16px
}

[PageType=Stores] .Content .List .Item .Count {
    width: 100%;
    font-weight: 400;
    line-height: 23px
}

[PageType=Stores] .Content .List .Item.active {
    background: #efefef;
    border-left: 3px solid #000
}

[PageType=Stores] .Content .Detail {
    width: 100%;
    padding-left: 36px;
    display: flex;
    gap: 12px;
    flex-direction: column
}

[PageType=Stores] .Content .Detail .Item {
    width: 100%;
    border: 1px solid #efefef;
    padding: 16px 16px 8px;
    display: none
}

[PageType=Stores] .Content .Detail .Item .Title {
    width: 100%;
    border-bottom: 1px solid #efefef;
    line-height: 34px
}

[PageType=Stores] .Content .Detail .Item .Infos {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 16px 0 0;
    gap: 14px
}

[PageType=Stores] .Content .Detail .Item .Infos .Address,
[PageType=Stores] .Content .Detail .Item .Infos .Hour,
[PageType=Stores] .Content .Detail .Item .Infos .Phone {
    width: 100%;
    display: flex;
    gap: 10px
}

[PageType=Stores] .Content .Detail .Item .Infos .Address>svg,
[PageType=Stores] .Content .Detail .Item .Infos .Hour>svg,
[PageType=Stores] .Content .Detail .Item .Infos .Phone>svg {
    height: 18px
}

[PageType=Stores] .Content .Detail .Item .Infos .Btn {
    width: initial;
    display: flex;
    gap: 10px;
    justify-content: flex-start;
    text-decoration: underline;
    font-weight: 600;
    letter-spacing: .4px;
    margin-top: 10px
}

@media(max-width: 1140px) {

    .Page[PageType=View]>.Container,
    [PageType=Account] .Container[P=Balance] .Table table,
    [PageType=Account] .Container[P=Balance] .Table table tbody,
    [PageType=Account].show .RightArea .ViewTab[T="#sifre"] .col-6 {
        display: flex;
        flex-direction: column
    }

    .Page[PageType=View] .GalleryBar {
        width: 100%;
        height: 380px
    }

    .Page[PageType=View] .GalleryBar>.List>.Item {
        width: inherit;
        width: min-content
    }

    .Page[PageType=View] .GalleryBar>.List>.Item.Video {
        min-width: max-content
    }

    .Page[PageType=View] .Information .Content {
        position: relative
    }

    .Page[PageType=View] .GalleryBar>.List {
        display: flex;
        flex-direction: row
    }

    .Page[PageType=Success]>.Container .Qr .Content .App.Desktop,
    .Page[PageType=View]>.ShadowImageLogo,
    .Page[Steps="2"] .BagInformation .Addition .BalanceBar .Text span:nth-child(2),
    .system-notification-item>a:not(.Sh1) [PageType=Aboutus] .Nav .SearchBox .MobilNav [fr=Closed],
    [Grid="4"] .ProductItem .Info,
    [PageType=Aboutus] .SearchArea .MobilNav [fr=Closed],
    [PageType=Aboutus] .SearchArea.Nav .MobilNav [fr=Open],
    [PageType=Account] .Container[P=Balance] .Table table thead tr th:nth-child(2),
    [PageType=Account] .Container[P=Balance] .Table table thead tr th:nth-child(3),
    [PageType=Account] .Container[P=Payment] .Table table thead,
    [PageType=Account] .Container[P=Support] table thead,
    [PageType=Account].show .LeftArea,
    [PageType=Stores] .Content .List,
    [PageType=Stores] .TitleBar,
    [PageType=SupportDetail] .QuestionArea .CustomerBox,
    [PageType=SupportDetail] .QuestionArea .SearchBox {
        display: none
    }

    .ProductOtherViewContainer,
    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Note {
        margin-top: 20px;
        margin-bottom: 0
    }

    section[L=Head] .Mod.StandartHead>.Container {
        padding: 0 20px
    }

    .Page[Steps="2"] .BagInformation .Addition .BalanceBar .Text span:first-child {
        font-size: 10px
    }

    .BagInformation {
        margin: 0;
        width: 100%
    }

    .BagInformation .Addition {
        position: static;
        margin-top: 40px;
        border-top: 1px solid #b2b2b2;
        padding-top: 25px
    }

    .Page[Steps="2"] .BagInformation .Addition .BalanceBar {
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 6px
    }

    .Page[Steps="2"] .BagInformation .Addition .BalanceBar .Text {
        display: flex;
        flex-direction: column;
        margin: 0 12px 0 0;
        line-height: 13px;
        padding: 6px 0;
        align-items: flex-start;
        font-size: 11px;
        gap: 0
    }

    .Page[Steps="2"] .BagInformation .Addition .BalanceBar .Text span:nth-child(3) {
        font-size: 10px;
        margin-top: 2px
    }

    .Page[Steps="2"] .BagInformation .Addition .BalanceBar .Btn {
        display: flex;
        flex-direction: column;
        margin: 0 0 0 auto;
        line-height: 13px;
        padding: 6px 0;
        align-items: center;
        font-size: 11px;
        flex: none;
        width: 30%
    }

    .BagInformation .Addition .BalanceBar .Btn span:first-child,
    .Page[PageType=Success]>.Container .Qr .Content .App.Mobil,
    [PageType=Aboutus] .SearchArea.Nav .NavList,
    [PageType=Aboutus] .SearchBox.Nav .NavList,
    [PageType=Account] .Container[P=Balance] .Table table thead tr,
    [PageType=Account] .TheBack {
        display: flex
    }

    .BagInformation .Addition .BalanceBar .Btn span:nth-child(2) {
        text-transform: uppercase
    }

    .BagInformation .Addition .Btn[fr=paymentBtn],
    .BagInformation .Addition .Btn[fr=paymentResume] {
        position: fixed;
        bottom: 20px;
        box-shadow: 0 0 0 20px #fff;
        left: 0;
        margin: 0 20px;
        width: calc(100% - 40px);
        z-index: 111111111111
    }

    .BagInformation .Addition .Items {
        display: flex !important;
        flex-direction: column;
        padding-right: 16px;
        margin-bottom: 0
    }

    .BagInformation .Addition .Items .Item.Products,
    section[Mod=Search] .Inputs .ResultData .Filters .FilterGrid {
        display: none !important
    }

    .Search [PageType=List] .ProductItem,
    [Grid="4"] .ProductItem,
    [Grid="5"] .ProductItem,
    [Grid="6"] .ProductItem {
        width: 25%
    }

    .ProductOtherViewContainer .OtherProductView>.Container .Group .List .ProductItem {
        width: 50%
    }

    [PageType=Aboutus] .ContentArea,
    section[Mod=Search] .Container {
        padding: 0
    }

    [PageType=Aboutus] .ContentArea .Box {
        width: 100%;
        padding: 0;
        background: #fff
    }

    [PageType=Aboutus] .ContentArea .Box .List {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 6px
    }

    [PageType=Aboutus] .ContentArea .Box .List .Item {
        width: 100%;
        font-size: 11px;
        cursor: pointer;
        text-transform: uppercase;
        border-bottom: 1px solid #000;
        line-height: 33px
    }

    section[Mod=Search][Find="0"] .Inputs .BestSearch {
        display: flex;
        flex-direction: column;
        padding: 24px !important
    }

    section[Mod=Search] .Inputs .BestSearch .List {
        display: flex;
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 24px
    }

    section[Mod=Search] .Inputs .BestSearch .List .Item {
        text-align: left
    }

    section[Mod=Search] .Inputs .BestSearch .BtnText {
        margin: 0 !important
    }

    section[Mod=Search] .Inputs .Input>input,
    section[Mod=Search] .Inputs .ResultData {
        padding: 16px !important
    }

    section[Mod=Search] .Result {
        padding-top: 190px !important
    }

    section[Mod=Search][Find="0"] .Result {
        margin-top: 270px
    }

    section[Mod=Search] .Inputs .ResultData .Filters .FilterBox .FilterWind {
        display: none;
        right: 0;
        top: 100%;
        background: #fff;
        border: 1px solid #000;
        width: 100% !important;
        position: fixed !important;
        top: inherit !important;
        bottom: 0 !important
    }

    section[Mod=Search][Find="1"] .Inputs .Input>.TextDelete {
        padding-right: 16px !important
    }

    .NotificationBar>.Container {
        padding: 7px 16px;
        overflow: hidden
    }

    .NotificationBar .NotificationBarClosed {
        right: 16px
    }

    [PageType=Aboutus] .ContentArea+.CustomerBox,
    [PageType=Aboutus] .SearchArea .MobilNav [fr=Open],
    [PageType=Aboutus] .SearchArea.Nav .MobilNav [fr=Closed],
    [PageType=Account] .Container[P=Support] table tr td div>span,
    [PageType=Account] .LeftArea .Navs .Item>svg,
    [PageType=Account].show .RightArea {
        display: block
    }

    [PageType=Account] .address-card {
        width: 100%;
        margin-right: 0
    }

    [Grid="12"] .ProductItem {
        width: 25%;
        padding: 6px !important
    }

    .PopContent {
        overflow: auto
    }

    .Page[PageType=Success]>.Container .Qr .Content .TextBox .Text {
        font-size: 11px
    }

    .system-notification-item {
        position: fixed;
        left: 0;
        bottom: -100%;
        z-index: 10014;
        width: calc(100% - 28px);
        padding: 13px 20px;
        font-size: 11px;
        margin: 14px;
        border-radius: 3px
    }

    .system-notification-item>a {
        text-decoration: underline
    }

    .system-notification-item.show {
        bottom: 0;
        left: 0;
        transition: .2s
    }

    [PageType=Account] .RightArea {
        display: none;
        width: 100%;
        padding-bottom: 40px
    }

    [PageType=Account] {
        padding-top: 110px;
        margin: 0
    }

    [PageType=Account]>.Container {
        width: 100%;
        padding: 0 20px;
        margin: 0
    }

    [PageType=Account] .LeftArea {
        min-width: 200px;
        width: 100%;
        max-width: 100%
    }

    [PageType=Account] .LeftArea .Navs,
    [PageType=Stores] .Content .Detail {
        width: 100%;
        padding: 0
    }

    [PageType=Account] .LeftArea .Navs .Item {
        margin: 0;
        display: flex;
        line-height: 45px;
        justify-content: flex-start;
        align-items: center
    }

    [PageType=Account] .LeftArea .Navs .Item>svg {
        margin-left: auto
    }

    [PageType=Account] .LeftArea .Navs .Item.active::before {
        top: 20px
    }

    [PageType=Account] .Note {
        text-align: center
    }

    [PageType=Account] .Btn {
        max-width: 100%
    }

    [PageType=Account] .Empty .Btn {
        max-width: 100%;
        width: 100%
    }

    [PageType=Account].show .RightArea .ViewTab[T="#kisisel-bilgilerim"] .col-6 {
        width: 100%;
        display: flex;
        flex-direction: column
    }

    [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .BtnList .Btn,
    [PageType=Aboutus] .ContentArea .View .Form[Type=Human] .BtnList .Btn,
    [PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .BtnList .Btn,
    [PageType=Account] .Container[P=Payment] .List .AccountItem,
    [PageType=Account] .Container[P=Support] .BtnList .Btn,
    [PageType=Account] .ViewTab[T="#sifre"]>.Container,
    [PageType=Account].show .RightArea .ViewTab[T="#sifre"] .col-6 {
        width: 100%
    }

    [PageType=Account] .ViewTab[T="#siparislerim"]>.Container {
        width: 100%;
        max-width: 100%
    }

    [PageType=Account] .OrderItem {
        padding-bottom: 20px;
        margin-bottom: 38px
    }

    .PopupBox>.Document {
        max-height: 100%
    }

    .PopupBox.mod2>.Document {
        border-radius: 12px 12px 0 0
    }

    [PageType=Account] .Container[P=Payment] .PaymentBar>div:first-child,
    [PageType=Account] .Container[P=Payment] .PaymentBar>div:nth-child(2) {
        display: flex;
        flex-direction: column;
        align-content: center;
        justify-content: center;
        align-items: center;
        gap: 6px
    }

    [PageType=Account] .Container[P=Payment] .Table table tbody tr {
        display: flex;
        flex-direction: column;
        margin-bottom: 26px
    }

    [PageType=Account] [P=Payment] .Table table tbody td {
        display: flex;
        gap: 10px;
        padding: 8px 0;
        border-bottom: 0
    }

    [PageType=Account] [P=Payment] .Table table tbody td:first-child,
    [PageType=Account] [P=Payment] .Table table tbody td:last-child {
        border-bottom: 1px solid #a9a9a9
    }

    [PageType=Account] [P=Payment] .Table table tbody td>span {
        display: block;
        width: 70px;
        flex: none;
        text-align: left;
        font-weight: 500
    }

    [PageType=Account] .Container[P=Balance] .Balance>div.Btn {
        line-height: inherit
    }

    [PageType=Account] .Container[P=Balance] .Balance {
        display: flex;
        align-items: flex-start
    }

    [PageType=Account] .Container[P=Balance] .Balance>div:first-child {
        display: flex;
        flex-direction: column;
        align-content: center;
        justify-content: center;
        align-items: flex-start;
        gap: 6px
    }

    [PageType=Account] .Container[P=Balance] .Table table thead tr th:first-child {
        width: calc(100% - 150px)
    }

    [PageType=Account] .Container[P=Balance] .Table table thead tr th:nth-child(4) {
        width: 75px;
        flex: none;
        display: flex;
        justify-content: flex-end
    }

    [PageType=Account] .Container[P=Balance] .Table table thead tr th:nth-child(5) {
        width: 75px;
        flex: none
    }

    [PageType=Account] .Container[P=Balance] .Table table tbody tr {
        display: flex;
        flex-wrap: wrap;
        margin: 10px 0 0
    }

    [PageType=Account] .Container[P=Balance] .Table table tbody tr td:first-child {
        display: flex;
        width: calc(100% - 150px);
        border: 0;
        padding-bottom: 0
    }

    [PageType=Account] .Container[P=Balance] .Table table tbody tr td:nth-child(2) {
        order: 3;
        border: 0;
        padding-top: 6px;
        padding-bottom: 0;
        font-weight: 500;
        width: 100%
    }

    [PageType=Account] .Container[P=Balance] .Table table tbody tr td:nth-child(3) {
        order: 5;
        width: 100%;
        text-align: left;
        padding-top: 6px
    }

    [PageType=Account] .Container[P=Balance] .Table table tbody tr td:nth-child(4),
    [PageType=Account] .Container[P=Balance] .Table table tbody tr td:nth-child(5) {
        display: flex;
        width: 75px;
        flex: none;
        justify-content: flex-end;
        border: 0;
        padding-bottom: 0
    }

    [PageType=Account] [P=Gift] .GiftItem .Info .Left .Text {
        font-size: 12px
    }

    [PageType=Account] [P=Gift] .GiftItem {
        padding: 10px
    }

    [PageType=Account] [P=Gift] .GiftItem .Info {
        padding-top: 10px
    }

    [PageType=Account] [P=Gift] .GiftItem .Information {
        padding: 10px 0 0
    }

    [PageType=Account] [P=Gift] .GiftItem .Info .Right .Code span {
        font-size: 16px
    }

    body[Page=Bag] .NotificationBar {
        top: 50px
    }

    body[Page=Bag] section[L=Head]+section[L=View],
    body[Page=Payment] section[L=Head]+section[L=View] {
        padding-top: 55px
    }

    body[Page=Bag] section[L=Head]+.NotificationBar+section[L=View],
    body[Page=Payment] section[L=Head]+.NotificationBar+section[L=View] {
        padding-top: 87px
    }

    body[Page=Payment] .NotificationBar {
        top: 55px
    }

    section[L=Head] .Mod.StandartHead>.Container .TheBack {
        height: 54px
    }

    .Empty .Btn {
        width: 80%
    }

    body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container {
        display: flex;
        justify-content: flex-start
    }

    body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container .Logo {
        position: inherit;
        width: initial
    }

    body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container .BagCounter {
        opacity: 1;
        margin-left: auto
    }

    body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container .BagCounter svg {
        transition: .3s
    }

    body[Page=Payment].AdditionView section[L=Head] .Mod.StandartHead>.Container .BagCounter svg {
        transform: rotate(270deg);
        transition: .3s
    }

    .Page[PageType=Success]>.Container {
        padding: 80px 20px 82px
    }

    .Page[PageType=Success]>.Container .Qr .Content {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px
    }

    .Page[PageType=Success]>.Container .Qr .Content .App {
        margin: 0
    }

    .Page[PageType=Success]>.Container .Qr .Content .TextBox {
        order: -1;
        width: 100%;
        gap: 0
    }

    .Page[PageType=Success]>.Container .Divider {
        margin: 16px 0
    }

    .AddressForm .Form .BtnList.show,
    [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .InputGroup {
        display: flex;
        flex-direction: column;
        gap: 0
    }

    .AddressForm .Form .BtnList .Btn {
        width: 100%;
        margin: 16px 0 0
    }

    body.Query:before {
        content: "";
        display: flex;
        background-image: url('/NewWebSites/img/body_loading.svg?v45');
        width: 24px;
        height: 16px;
        position: fixed;
        left: 16px;
        top: 32px;
        background-size: 25px;
        z-index: 20
    }

    [PageType=SupportDetail]>.Container {
        width: 100%;
        padding: 100px 20px 0
    }

    [PageType=SupportDetail]>.Container .Content {
        display: flex;
        flex-direction: column-reverse;
        padding: 0;
        gap: 60px
    }

    [PageType=SupportDetail] .AnswerArea {
        margin: 0;
        padding: 0
    }

    [PageType=SupportDetail] .QuestionArea .Box {
        padding: 18px
    }

    [PageType=Aboutus]>.Container {
        padding: 0 20px;
        margin-top: 60px;
        display: flex;
        flex-direction: column
    }

    [PageType=Aboutus] .Nav {
        width: 100%;
        margin: 0 0 8px;
        position: inherit
    }

    [PageType=Aboutus] .Nav .Box,
    [PageType=Aboutus] .Nav .CustomerBox {
        padding: 0;
        display: none
    }

    [PageType=Aboutus] .ContentArea .View {
        border: 0;
        padding: 0;
        margin-top: 0;
        margin-bottom: 60px
    }

    [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .InputGroup .Input {
        margin-bottom: 5px
    }

    [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm {
        margin-bottom: 50px
    }

    body[Page=About] .Nav .SearchBox {
        border: 0 solid #000;
        display: none
    }

    [PageType=Aboutus] .Nav .SearchBox input {
        width: calc(100% - 52px);
        border: 1px solid #000
    }

    [PageType=Aboutus] .Nav .SearchBox .MobilNav {
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        padding: 13px
    }

    [PageType=Aboutus] .Nav .SearchBox .MobilNav svg>path {
        fill: #000
    }

    [PageType=Aboutus] .Nav .SearchBox .Loading {
        right: 65px
    }

    [PageType=Aboutus] .Nav .SearchBox .Closed {
        right: 60px
    }

    [PageType=Aboutus] .SearchArea .NavList {
        width: 100%;
        display: none;
        gap: 5px;
        flex-direction: column;
        margin-top: 30px;
        margin-bottom: 40px
    }

    [PageType=Aboutus] .SearchArea .NavList a {
        width: 100%;
        line-height: 20px;
        border: 1px solid #000;
        padding: 8px
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        position: relative;
        align-items: flex-start
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Gallery {
        width: 67px;
        margin-right: 10px
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information {
        width: auto
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Info {
        display: flex;
        flex-direction: column;
        width: 100%
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Info .Item {
        display: flex;
        flex-direction: row;
        margin-bottom: 6px
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail {
        position: absolute;
        left: 0;
        display: flex;
        flex-direction: row;
        top: 120px;
        border: 1px solid #a9a9a9;
        border-left: 0;
        border-right: 0;
        gap: 0
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Cargo,
    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information .Detail .Code {
        background: 0 0;
        border: 0;
        font-size: 11px
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .BtnList {
        width: 100%;
        display: flex;
        flex-direction: column;
        margin: 55px 0 0;
        gap: 16px
    }

    [PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .BtnList>.Btn {
        border: 1px solid #000
    }

    [PageType=Account] .Container[P=Return] .Select {
        display: flex;
        justify-content: space-between
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information {
        display: flex;
        flex-wrap: wrap
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action {
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 20px
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Action .InputBox>select {
        width: 100%;
        min-width: 100%
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Check {
        padding-left: 35px;
        margin-left: 10px
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .List {
        margin-bottom: 30px
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .BtnList {
        display: flex;
        flex-direction: column-reverse;
        gap: 13px !important
    }

    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Return,
    [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Success {
        width: 100%;
        margin: 15px 0 0
    }

    [PageType=Account] .Container[P=Support] table {
        display: flex;
        padding-bottom: 80px
    }

    [PageType=Account] .Container[P=Support] table tr {
        display: flex;
        width: 100%;
        flex-direction: column;
        justify-content: flex-end;
        border-top: 1px solid #a9a9a9
    }

    [PageType=Account] .Container[P=Support] table tr td {
        display: flex;
        width: 100%;
        border: 0;
        padding: 8px 0
    }

    [PageType=Account] .Container[P=Support] table tr td:last-child {
        margin-bottom: 10px
    }

    [PageType=Account] .Container[P=Support] table tr td div {
        display: flex;
        gap: 4px;
        flex-direction: column-reverse !important;
        width: 100%
    }

    [PageType=Account] .Container[P=Support] table tr td div>div {
        display: flex;
        font-weight: 500;
        gap: 4px;
        flex-direction: row !important;
        width: 100%;
        margin-top: 8px
    }

    [PageType=Account] .Container[P=Support] .BtnList {
        position: fixed;
        bottom: 0;
        left: 0;
        padding: 16px 20px;
        background: #ffff
    }

    [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm .Info .Item {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }

    [PageType=Aboutus] .ContentArea .View .Form[Type=Human] .InputGroup,
    [PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .InputGroup {
        gap: 0;
        flex-direction: column
    }

    [PageType=Stores] .Container {
        width: 100%;
        margin-top: 80px;
        padding: 0 24px
    }

    [PageType=Stores] .Content {
        display: flex;
        flex-direction: column;
        gap: 24px
    }

    [PageType=Stores] .Content>select {
        display: block;
        width: 100%;
        padding: 8px;
        font-size: 13px;
        font-weight: 600;
        border: 1px solid #000;
        outline: 0
    }
}

.Rating {
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: #000;
    font-weight: 500;
    cursor: pointer;
    display: none
}

.Rating .comment-area {
    display: flex;
    align-items: center;
    gap: 6px
}

.Rating .comment-area .icon-section {
    display: flex;
    flex-direction: row;
    gap: 2px
}

.Rating .comment-area .icon-section span {
    width: 12px;
    height: 12px;
    position: relative
}

.Rating .comment-area .icon-section span>svg {
    position: absolute;
    left: 0;
    top: 0;
    display: none;
    height: 11px
}

.Rating .comment-area .icon-section span>svg[x=half] {
    left: -3px;
    right: 3px;
    z-index: 1
}

.Rating .comment-area .icon-section span>svg[x=grey] path {
    fill: #e7e7e7
}

.Rating .comment-area .icon-section span>svg[x=full] path,
.Rating .comment-area .icon-section span>svg[x=half] path {
    fill: #ffe81e
}

[Mod=fr_comment] {
    width: 100%;
    padding: 18px 45px;
    font-family: system-ui;
    display: none
}

[Mod=fr_comment] .fr_comment_title {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    font-weight: 400;
    font-size: 20px;
    padding: 22px 0 0
}

[Mod=fr_comment] .fr_comment_arrows {
    display: none;
    align-items: center;
    gap: 8px
}

[Mod=fr_comment] .fr_comment_arrows_next,
[Mod=fr_comment] .fr_comment_arrows_prev {
    border-radius: 6px;
    background: #fff;
    width: 29px;
    height: 29px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: none;
    box-shadow: #00000021 0 3px 6px;
    padding: 0;
    border: 1px solid #ececec
}

[Mod=fr_comment] .fr_comment_arrows_next>svg,
[Mod=fr_comment] .fr_comment_arrows_prev>svg {
    height: 38px;
    fill: #000
}

[Mod=fr_comment] .fr_comment_empty {
    gap: 7px;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #5c5932
}

[Mod=fr_comment] .fr_comment_empty svg {
    height: 22px;
    fill: #c5c18d
}

[Mod=fr_comment] .fr_comment_ratingBar {
    display: flex;
    width: 100%;
    padding: 16px;
    background: #fffce4;
    border-radius: 9px;
    align-items: center;
    margin: 14px 0
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div,
[Mod=fr_comment] .fr_comment_starBar {
    display: flex;
    align-items: center;
    margin-right: 20px
}

[Mod=fr_comment] .fr_comment_starBar svg {
    height: 16px;
    fill: #ccc
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="1"] span:first-child svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="2"] span:first-child svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="2"] span:nth-child(2) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="3"] span:first-child svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="3"] span:nth-child(2) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="3"] span:nth-child(3) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:first-child svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(2) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(3) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(4) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:first-child svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(2) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(3) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(4) svg,
.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(5) svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="1"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="2"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="2"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="3"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="3"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="3"] span:nth-of-type(3)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-of-type(3)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-of-type(4)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-of-type(3)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-of-type(4)>svg,
[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-of-type(5)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="1"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="2"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="2"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="3"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="3"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="3"] span:nth-of-type(3)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-of-type(3)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-of-type(4)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:first-of-type>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-of-type(2)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-of-type(3)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-of-type(4)>svg,
[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-of-type(5)>svg {
    fill: #f9d602
}

[Mod=fr_comment] .fr_comment_rating {
    max-width: 150px;
    margin-right: 40px
}

[Mod=fr_comment] .fr_comment_rating>span {
    font-size: 22px;
    font-weight: 600
}

[Mod=fr_comment] .fr_comment_all {
    font-size: 14px;
    margin-right: 26px
}

[Mod=fr_comment] .fr_comment_total {
    font-size: 14px
}

[Mod=fr_comment] .fr_comment_sizeText {
    margin-left: auto;
    display: flex;
    font-size: 14px;
    align-items: center
}

[Mod=fr_comment] .fr_comment_sizeText>img {
    margin-right: 26px;
    height: 32px
}

[Mod=fr_comment] .fr_comment_list .flickity-viewport {
    min-height: initial
}

[Mod=fr_comment] .fr_comment_footer {
    width: 100%;
    height: 1px;
    background: #efefef;
    margin: 35px 0 20px;
    align-items: center;
    justify-content: center;
    display: none
}

[Mod=fr_comment] .fr_comment_footer_btn {
    background: #efefef;
    padding: 9px 30px;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    border: 1px solid transparent
}

[Mod=fr_comment] .fr_comment_footer_btn:hover {
    background: #fff;
    border-color: #efefef
}

[Mod=fr_comment] .fr_comment_list_item {
    background: #fff;
    border: 1px solid #e3e3e3;
    padding: 10px;
    border-radius: 5px;
    width: 320px;
    height: 186px;
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start
}

[Mod=fr_comment] .fr_comment_list_item_stars {
    width: 100%;
    display: flex;
    margin-bottom: 5px
}

[Mod=fr_comment] .fr_comment_list_item_stars>div {
    line-height: 12px;
    margin-right: 5px;
    font-size: 12px;
    font-weight: 600
}

[Mod=fr_comment] .fr_comment_list_item_stars>span {
    line-height: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div>span>svg,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates>svg,
[Mod=fr_comment] .fr_comment_list_item_stars svg {
    height: 12px;
    fill: #ccc
}

[Mod=fr_comment] .fr_comment_list_item_user {
    width: 100%;
    display: flex;
    margin-bottom: 10px;
    align-items: center
}

[Mod=fr_comment] .fr_comment_list_item_user>div:first-child {
    font-size: 12px;
    color: #737373;
    margin-right: 18px;
    display: flex;
    align-items: center
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user>div:nth-child(2),
[Mod=fr_comment] .fr_comment_list_item_user>div:nth-child(2) {
    font-size: 12px;
    color: #6e6e6e
}

[Mod=fr_comment] .fr_comment_list_item_text {
    width: 100%;
    font-size: 13px;
    line-height: 17px;
    font-weight: 300;
    height: 86px;
    overflow: hidden
}

[Mod=fr_comment] .fr_comment_list_item_text_more {
    position: absolute;
    left: 4px;
    bottom: 27px;
    font-size: 13px;
    line-height: 17px;
    font-weight: 300;
    align-items: center;
    background: #fff;
    padding: 2px 6px;
    cursor: pointer;
    display: none
}

[Mod=fr_comment] .fr_comment_list_item_text_more>span {
    width: 100%;
    font-size: 12px;
    line-height: 16px;
    font-weight: 500
}

[Mod=fr_comment] .fr_comment_list_item_foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto
}

[Mod=fr_comment] .fr_comment_list_item_size {
    gap: 3px;
    display: none
}

[Mod=fr_comment] .fr_comment_list_item_size>span:first-child {
    font-size: 12px;
    font-weight: 300
}

[Mod=fr_comment] .fr_comment_list_item_size>span:nth-child(2) {
    font-size: 12px;
    font-weight: 600
}

[Mod=fr_comment] .fr_comment_list_item_source {
    display: flex;
    gap: 5px;
    justify-content: flex-start;
    align-items: center;
    font-size: 12px
}

[Mod=fr_comment] .fr_comment_list_item_source span:first-child {
    color: #777;
    font-size: 10px
}

[Mod=fr_comment] .fr_comment_list_item_like,
[Mod=fr_comment] .fr_comment_list_item_source span:nth-child(2) {
    display: flex;
    gap: 4px;
    margin-left: auto
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Possitive>i::before,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive>i::before,
[Mod=fr_comment] .fr_comment_list_item_like>i::before {
    display: block;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNC4yNSA5Ljc4NGExIDEgMCAwIDEgMSAxdjExYTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xdi0xMWExIDEgMCAwIDEgMS0xem04LjQxNC04LjU1Yy45NzQtLjEzNSAyLjIyLjQ2NSAyLjgwOCAyLjU2NWE4LjY4NiA4LjY4NiAwIDAgMS0uNTIgNC40MDcuMjUuMjUgMCAwIDAgLjIzNy4zMjhIMjEuNWEyLjUgMi41IDAgMCAxIDEuMjI4IDQuNjc4IDIuMjQ5IDIuMjQ5IDAgMCAxLS45NTkgMy4wNzggMi4yNTEgMi4yNTEgMCAwIDEtMSAzYy4xNTIuMzEuMjMxLjY1LjIzMS45OTUgMCAuNjUtLjI5MiAxLjc1LTIuMjUgMS43NWgtNi41YTE3LjMyOCAxNy4zMjggMCAwIDEtNC4xMDgtLjQ3MWMtLjMwNi0uMDY1LS42My0uMTMyLS45ODctLjJhLjUuNSAwIDAgMS0uNDA1LS40OTFWMTAuNzU3YzAtLjE2NS4wOC0uMzE5LjIxNi0uNDEyQzguODcxIDkuMDMgMTEgNi4wMyAxMSAzLjI4NGEyIDIgMCAwIDEgMS42NjQtMi4wNXpNMyAxOS4yODRhLjc1Ljc1IDAgMSAwIDAgMS41Ljc1Ljc1IDAgMCAwIDAtMS41eiIgZmlsbD0iI0NDQyIvPjwvc3ZnPg==);
    background-repeat: no-repeat;
    background-position: center;
    height: 14px;
    content: ""
}

[Mod=fr_comment] .fr_comment_list_item_like>i::before {
    background-size: cover;
    width: 15px
}

[Mod=fr_comment] .fr_comment_list_item_like>span {
    font-size: 12px;
    color: #949494
}

.fr_comment_CommentArea {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 9999
}

.fr_comment_CommentAreaHeader {
    background: #fff;
    display: flex;
    padding: 20px;
    justify-content: space-between;
    position: absolute;
    top: 0;
    z-index: 10;
    align-items: center
}

.fr_comment_CommentAreaHeaderBtn {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #374151;
    padding: 4px 8px;
    border-radius: 5px;
    cursor: pointer;
    margin-left: 8px;
    position: relative
}

.fr_comment_CommentAreaHeaderBtn.Active {
    background: #f4f4f4;
    color: red
}

.fr_comment_CommentAreaHeaderBtn.BtnBack {
    margin-right: auto
}

.fr_comment_CommentAreaHeaderBtn.BtnBack>i {
    width: 38px;
    height: 38px;
    border-radius: 100%;
    background: #d1d5e4;
    border: 1px solid #ccc;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 14px;
    cursor: pointer
}

.fr_comment_CommentAreaBody {
    width: 60%;
    margin: 0 auto;
    padding: 25px 0;
    display: flex;
    gap: 0;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: 0;
    padding-bottom: 50px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn {
    border: 1px solid #efefef;
    border-radius: 4px;
    padding: 6px;
    display: flex;
    align-items: center;
    font-size: 13px;
    cursor: pointer;
    margin-right: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn.active,
.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn.active {
    border: 1px solid #4caf50;
    color: #308a34
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn>span:first-child {
    line-height: 14px;
    margin-right: 10px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div>span,
.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn>span:nth-child(2) {
    line-height: 14px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: 0;
    padding-bottom: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn {
    border: 1px solid #efefef;
    border-radius: 4px;
    padding: 6px;
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-right: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>span {
    font-size: 13px;
    margin-left: auto
}

.fr_comment_CommentAreaBody .CommentFilterArea {
    width: 100%;
    display: flex;
    align-items: center;
    padding-bottom: 14px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Searchbox>svg {
    height: 18px;
    position: absolute;
    right: 10px;
    top: 10px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Searchbox>input {
    width: 100%;
    background: #fff;
    border: 1px solid #e7e7e7;
    padding: 12px;
    border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Filterbox>span {
    margin-right: 6px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Filterbox>select,
.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>select {
    width: 100%;
    background: #fff;
    border: 1px solid #e7e7e7;
    padding: 11px;
    border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox {
    width: 100%;
    max-width: 340px;
    display: flex;
    align-items: center;
    margin-left: 20px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>span {
    margin-right: 6px;
    font-size: 14px;
    font-weight: 200
}

.fr_comment_CommentAreaBody .CommentCounter {
    width: 100%;
    margin-bottom: 14px
}

.fr_comment_CommentAreaBody .CommentCounter>.Title {
    width: 100%;
    font-size: 20px;
    font-weight: 600
}

.fr_comment_CommentAreaBody .CommentList {
    width: 100%;
    overflow: auto;
    padding-right: 14px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item {
    background: #fff;
    border: 1px solid #e3e3e3;
    padding: 18px;
    border-radius: 5px;
    width: 100%;
    margin-bottom: 16px;
    display: flex;
    flex-direction: column
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_text {
    width: 100%;
    display: flex;
    margin-bottom: 5px;
    font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user {
    width: 100%;
    display: flex;
    margin-top: 15px;
    margin-bottom: 5px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user>div:first-child {
    font-size: 12px;
    color: #737373;
    margin-right: 18px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user>div:nth-child(3) {
    font-size: 12px;
    color: #2ebf34;
    margin-left: 12px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer {
    width: 100%;
    font-size: 13px;
    line-height: 16px;
    font-weight: 300;
    padding: 11px;
    background: #f5f5f5;
    border-radius: 4px;
    box-sizing: border-box;
    flex: 1
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user,
.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user>div:first-child {
    width: 100%;
    font-size: 13px;
    line-height: 17px;
    font-weight: 300
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user>div:first-child>strong {
    font-weight: 600;
    font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user>div:nth-child(2) {
    width: 100%;
    font-size: 10px;
    line-height: 20px;
    font-weight: 400
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_text {
    width: 100%;
    font-size: 13px;
    line-height: 17px;
    font-weight: 400;
    margin-top: 8px;
    overflow: hidden
}

.fr_comment_CommentAreaBody .CommentMoreBtn {
    margin-top: 24px;
    background: #efefef;
    padding: 12px 30px;
    border-radius: 3px;
    border: 1px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative
}

.fr_comment_CommentAreaBody .CommentMoreBtn.loading {
    pointer-events: none;
    opacity: .7
}

.fr_comment_CommentAreaBody .CommentMoreBtn .spinner {
    display: none;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(0, 0, 0, .1);
    border-left-color: #00ffb1;
    border-radius: 50%;
    animation: 1s linear infinite modsspin
}

.fr_comment_CommentAreaBody .CommentMoreBtn.loading .spinner {
    display: inline-block
}

.fr_comment_CommentAreaBody .CommentMoreBtn:hover {
    background: #fff;
    border-color: #00ffb1;
    color: #00ffb1
}

.fr_comment_CommentAreaBody .CommentList::-webkit-scrollbar {
    width: 6px !important;
    height: 6px !important
}

.fr_comment_CommentAreaBody .CommentList ::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important
}

.fr_comment_CommentAreaBody .CommentList::-webkit-scrollbar-thumb {
    background-color: #000;
    border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentList::-webkit-scrollbar-track {
    background: rgb(241 241 241/41%)
}

.fr_comment_CommentAreaBody .CommentList .CommentItem {
    width: 100%;
    border-bottom: 1px solid #f2f2f2;
    padding-bottom: 26px;
    margin-bottom: 26px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates {
    display: flex;
    align-items: center;
    margin-right: 12px;
    border-right: 1px solid #ccc;
    padding-right: 12px;
    width: fit-content
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="1"]>svg:first-child,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="2"]>svg:first-child,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="2"]>svg:nth-child(2),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="3"]>svg:first-child,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="3"]>svg:nth-child(2),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="3"]>svg:nth-child(3),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:first-child,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(2),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(3),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(4),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:first-child,
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(2),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(3),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(4),
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(5),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="1"]>svg:first-child,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:first-child,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:nth-child(2),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:first-child,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(2),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(3),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:first-child,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(2),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(3),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(4),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:first-child,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(2),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(3),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(4),
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(5) {
    fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Date {
    font-size: 12px;
    width: max-content
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Name {
    font-size: 12px;
    margin-right: 12px;
    border-right: 1px solid #ccc;
    padding-right: 12px;
    width: min-content
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Size {
    font-size: 12px;
    margin-left: auto;
    margin-right: 14px;
    border-right: 1px solid #ccc;
    padding-right: 10px;
    display: none
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.fr_comment_list_item_source {
    font-size: 12px;
    display: flex;
    align-items: center;
    margin-left: auto;
    color: #d7d7d7;
    gap: 6px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.fr_comment_list_item_source span:first-child {
    color: #626262
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Possitive {
    font-size: 12px;
    display: flex;
    align-items: center;
    margin-left: 10px;
    width: unset
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Size.show+.Possitive,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show+.Possitive {
    margin-left: inherit
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Possitive>i::before,
.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive>i::before {
    width: 14px;
    background-size: 14px;
    margin-right: 5px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment {
    background: #efefef;
    padding: 25px;
    border-radius: 10px;
    margin-top: 5px;
    font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment div {
    border-radius: 6px;
    width: 68px;
    height: 68px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    margin-top: 9px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment div+div {
    margin-left: 8px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer {
    width: 100%;
    display: flex;
    margin-top: 24px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>span {
    font-size: 12px;
    margin-right: 40px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>.BtnList {
    display: flex;
    gap: 24px;
    align-items: center;
    font-size: 12px;
    margin-top: -9px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>.BtnList>.Btn {
    cursor: pointer;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px
}

.fr_comment_image_popup {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #00000045;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center
}

.fr_comment_image_popup_area {
    display: flex;
    width: 900px;
    height: 625px;
    background: #fff;
    border-radius: 8px;
    align-items: flex-start;
    overflow: hidden
}

.fr_comment_image_area_content .List>.Item {
    display: none;
    align-items: flex-start
}

.fr_comment_image_area_content .List>.Item.show {
    display: flex;
    align-items: flex-start;
    width: 100%
}

.fr_comment_image_area_content .List>.Item>div:first-child {
    display: flex;
    background: #000;
    height: 625px;
    width: 470px;
    position: relative;
    flex: none;
    align-items: center;
    justify-content: center
}

.fr_comment_image_area_content>.List>.Item>div:first-child>img {
    width: 470px !important;
    width: fit-content;
    margin: 0;
    padding: 0;
    transform-origin: 0% 0%
}

.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows {
    display: flex;
    gap: 14px;
    z-index: 10;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    width: 100%;
    padding: 0 14px;
    height: 40px;
    border-radius: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 4px rgba(51, 51, 51, .16);
    cursor: pointer
}

.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.next,
.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.prev {
    border-radius: 50% !important;
    background: #fff !important;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: none;
    box-shadow: #00000021 0 3px 6px
}

.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.next.Disabled,
.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.prev.Disabled {
    background: #cbcbcb !important;
    pointer-events: none
}

.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.next>svg,
.fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.prev>svg {
    height: 26px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2) {
    width: calc(100% - 470px);
    display: flex;
    flex-direction: column;
    position: relative
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Closed {
    position: absolute;
    right: 0;
    color: #757575;
    padding: 6px 13px;
    font-size: 21px;
    cursor: pointer
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    padding: 24px;
    flex-direction: column
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates>svg {
    height: 15px;
    fill: #ccc
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Date {
    font-size: 12px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Name {
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 16px;
    font-weight: 100
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size {
    font-size: 13px;
    display: none;
    margin: 8px 0;
    font-weight: 100;
    background: #efefef;
    padding: 6px;
    border-radius: 4px;
    width: fit-content
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size>span:first-child {
    font-weight: 300;
    margin-right: 5px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive {
    font-size: 12px;
    display: flex;
    align-items: center;
    margin-left: auto
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment {
    width: 100%;
    margin-top: 12px;
    font-size: 14px;
    font-weight: 100
}

@media only screen and (max-width: 768px) {
    .ModsPop.RightPop>.Document {
        width: 100%;
        min-width: 100%
    }

    .fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment,
    [Mod=fr_comment],
    [Mod=fr_question] {
        padding: 16px
    }

    .fr_comment_CommentAreaBody .CommentCounter>.Title,
    [Mod=fr_comment] .fr_comment_rating>span,
    [Mod=fr_question] .fr_question_title {
        font-size: 14px
    }

    [Mod=fr_size_suggets] {
        margin-top: 16px !important
    }

    .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>span,
    .fr_comment_CommentAreaHeaderBtn.BtnBack>span,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Closed,
    [Mod=fr_best_comment],
    [Mod=fr_comment] .fr_comment_arrows,
    [Mod=fr_comment] .fr_comment_sizeText {
        display: none
    }

    [Mod=fr_comment] .fr_comment_ratingBar {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding: 10px
    }

    [Mod=fr_comment] .fr_comment_starBar {
        margin-right: 5px
    }

    [Mod=fr_comment] .fr_comment_starBar svg {
        height: 10px
    }

    [Mod=fr_comment] .fr_comment_total {
        font-size: 11px;
        margin-left: 18px
    }

    [Mod=fr_comment] .fr_comment_rating {
        margin-right: auto
    }

    [Mod=fr_comment] .fr_comment_all {
        font-size: 11px;
        margin-right: 0
    }

    [Mod=fr_comment] .fr_comment_title {
        font-size: 13px
    }

    .fr_comment_CommentAreaHeader {
        background: 0 0;
        padding: 16px
    }

    .fr_comment_CommentAreaHeaderBtn {
        margin: 0;
        padding: 0
    }

    .fr_comment_CommentAreaHeaderBtn.BtnBack>i {
        width: 28px;
        height: 28px;
        margin: 0
    }

    .fr_comment_CommentAreaBody {
        width: 100%;
        padding: 16px
    }

    .fr_comment_CommentAreaBody .CommentCounter {
        margin-left: 80px
    }

    .fr_comment_CommentAreaBody .CommentCounter>.Text {
        font-size: 11px
    }

    .fr_comment_CommentAreaBody .CommentFilterArea.Ratings {
        overflow: auto;
        scrollbar-width: none
    }

    .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        width: 60px;
        margin-left: 20px;
        position: relative
    }

    .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>svg {
        height: calc(100% - 4px);
        position: absolute;
        bottom: 2px;
        right: 2px;
        top: 3px;
        padding: 5px;
        background: #fff;
        width: calc(100% - 2px);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: -1px;
        margin-top: -1px;
        z-index: -1
    }

    .fr_comment_CommentAreaBody .CommentFilterArea .Searchbox>input,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Date {
        font-size: 12px
    }

    .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>select {
        font-size: 0;
        line-height: 16px;
        background: 0 0
    }

    .fr_comment_image_popup {
        background: #000;
        display: flex;
        align-items: stretch;
        z-index: 99999
    }

    .fr_comment_image_popup_area {
        display: flex;
        width: 100%;
        height: 100%;
        background: #fff;
        border-radius: 8px;
        align-items: flex-start;
        overflow: hidden
    }

    .fr_comment_image_area_content {
        display: flex;
        flex-direction: column;
        height: 100%;
        width: 100%
    }

    .fr_comment_image_area_content .Counter {
        display: flex;
        flex-direction: row;
        width: 100%;
        color: #fff;
        background: #0000006e;
        text-align: center;
        font-size: 12px;
        line-height: 34px;
        font-weight: 100;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        justify-content: space-between;
        padding: 0 16px;
        align-items: center
    }

    .fr_comment_image_area_content .Counter>div:nth-child(2) {
        font-size: 23px;
        cursor: pointer;
        color: #c7c7c7
    }

    .fr_comment_image_area_content .List {
        display: flex;
        width: 100%;
        height: 100%;
        background: #000;
        flex-direction: column;
        justify-content: center;
        align-items: center
    }

    .fr_comment_image_area_content>.List>.Item {
        display: none;
        align-items: flex-start
    }

    .fr_comment_image_area_content>.List>.Item.show {
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: flex-start;
        width: 100%;
        background: #000
    }

    .fr_comment_image_area_content>.List>.Item>div:first-child {
        display: flex;
        background: #000;
        width: 100%;
        position: relative;
        height: 100%;
        justify-content: center;
        align-items: center
    }

    .fr_comment_image_area_content>.List>.Item>div:first-child>img {
        width: 100% !important;
        height: auto !important;
        margin: 0;
        padding: 0;
        transform-origin: 0% 0%
    }

    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows {
        display: flex;
        gap: 14px;
        z-index: 10;
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto 0;
        width: 100%;
        padding: 0 14px;
        height: 40px;
        border-radius: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        box-shadow: 0 4px 4px rgba(51, 51, 51, .16);
        cursor: pointer
    }

    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.next,
    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.prev {
        border-radius: 50% !important;
        background: #fff !important;
        width: 40px;
        height: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex: none;
        box-shadow: #00000021 0 3px 6px
    }

    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.next.Disabled,
    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.prev.Disabled {
        background: #cbcbcb !important;
        pointer-events: none
    }

    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.next>svg,
    .fr_comment_image_area_content>.List>.Item>div:first-child>.Arrows>.prev>svg {
        height: 26px
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2) {
        width: 100%;
        display: flex;
        flex-direction: column;
        background: 0 0;
        color: #fff;
        position: absolute;
        bottom: 0
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        padding: 24px;
        flex-direction: column;
        align-items: flex-start
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info:before {
        content: "";
        box-shadow: 0 102px 100px 68px #000
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates {
        display: flex;
        align-items: center
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates>svg {
        height: 15px;
        fill: #ccc
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="1"]>svg:first-child,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:first-child,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:nth-child(2),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:first-child,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(2),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(3),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:first-child,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(2),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(3),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(4),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:first-child,
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(2),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(3),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(4),
    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(5) {
        fill: #f9c10a
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Name {
        font-size: 14px;
        margin-top: 10px;
        margin-bottom: 16px;
        font-weight: 100
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size {
        font-size: 13px;
        display: none;
        margin: 8px 0;
        font-weight: 100;
        background: #efefef;
        color: #000;
        padding: 6px;
        border-radius: 4px;
        width: fit-content
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show {
        display: flex
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size>span:first-child {
        font-weight: 300;
        margin-right: 5px
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive {
        font-size: 12px;
        display: flex;
        align-items: center;
        margin-left: auto
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show+.Possitive {
        margin-left: inherit
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive>i::before {
        content: "";
        display: block;
        background-repeat: no-repeat;
        background-position: center;
        width: 14px;
        height: 14px;
        background-size: 14px;
        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNC4yNSA5Ljc4NGExIDEgMCAwIDEgMSAxdjExYTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xdi0xMWExIDEgMCAwIDEgMS0xem04LjQxNC04LjU1Yy45NzQtLjEzNSAyLjIyLjQ2NSAyLjgwOCAyLjU2NWE4LjY4NiA4LjY4NiAwIDAgMS0uNTIgNC40MDcuMjUuMjUgMCAwIDAgLjIzNy4zMjhIMjEuNWEyLjUgMi41IDAgMCAxIDEuMjI4IDQuNjc4IDIuMjQ5IDIuMjQ5IDAgMCAxLS45NTkgMy4wNzggMi4yNTEgMi4yNTEgMCAwIDEtMSAzYy4xNTIuMzEuMjMxLjY1LjIzMS45OTUgMCAuNjUtLjI5MiAxLjc1LTIuMjUgMS43NWgtNi41YTE3LjMyOCAxNy4zMjggMCAwIDEtNC4xMDgtLjQ3MWMtLjMwNi0uMDY1LS42My0uMTMyLS45ODctLjJhLjUuNSAwIDAgMS0uNDA1LS40OTFWMTAuNzU3YzAtLjE2NS4wOC0uMzE5LjIxNi0uNDEyQzguODcxIDkuMDMgMTEgNi4wMyAxMSAzLjI4NGEyIDIgMCAwIDEgMS42NjQtMi4wNXpNMyAxOS4yODRhLjc1Ljc1IDAgMSAwIDAgMS41Ljc1Ljc1IDAgMCAwIDAtMS41eiIgZmlsbD0iI0NDQyIvPjwvc3ZnPg==);
        margin-right: 5px
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment {
        width: 100%;
        margin-top: 12px;
        font-size: 14px;
        font-weight: 100;
        text-align: left
    }

    .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment span {
        width: 100%;
        display: flex
    }
}

.comment-loading {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px
}

.comment-loading .spinner {
    width: 40px;
    height: 40px;
    border: 2px solid rgba(0, 0, 0, .1);
    border-top: 3px solid #00ffb1;
    border-radius: 50%;
    animation: 1s linear infinite modsspinsecondSpin
}

@keyframes modsspinsecondSpin {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes modsspin {
    to {
        transform: rotate(360deg)
    }
}

.PopContent[mod=StoreStockView] {
    width: 100%;
    padding: 40px 0;
    font-family: system-ui
}

.PopContent[mod=StoreStockView]>.Title {
    width: 100%;
    font-size: 13px;
    line-height: 16px;
    margin-bottom: 16px;
    padding: 0 40px
}

.PopContent[mod=StoreStockView]>.Text {
    width: 100%;
    font-size: 12px;
    font-weight: 200;
    padding: 0 40px
}

.PopContent[mod=StoreStockView]>.Info {
    width: calc(100% - 80px);
    margin: 12px 40px;
    background: #f8f8f8;
    padding: 15px;
    font-size: 12px;
    font-weight: 300
}

.PopContent[mod=StoreStockView]>.Step {
    width: 100%;
    margin-top: 30px;
    display: none
}

.PopContent[mod=StoreStockView]>.MessageArea {
    width: 100%;
    font-size: 12px;
    font-weight: 200;
    padding: 0 40px;
    overflow: auto;
    display: flex;
    flex-direction: column
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem b {
    margin: 5px 0
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem p {
    display: block;
    margin-bottom: 5px
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem ul {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin: 10px 0
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem li {
    margin-bottom: 10px;
    font-weight: 300;
    font-size: 11px
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem>div {
    padding: 12px;
    font-size: 12px;
    font-weight: 200;
    max-width: 85%;
    border-radius: 6px;
    margin: 10px 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    overflow-wrap: anywhere
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem[asist=true]>div {
    background: #e7f6e8
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem[asist=false] {
    justify-content: flex-end
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem[asist=true] {
    align-items: flex-start
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem[asist=false]>div {
    background: #ffdfb0;
    align-items: flex-end
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem .productItem {
    display: flex;
    align-items: flex-start;
    border: 1px solid #bdd6bf;
    margin-bottom: 4px;
    background: #03030314;
    border-radius: 6px;
    padding: 6px;
    flex-direction: column;
    min-height: 104px;
    position: relative;
    color: #000
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem .productItem img {
    max-width: 60px !important;
    flex: none;
    border-radius: 5px;
    position: absolute
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem .productItem span:nth-child(3) {
    font-weight: 300;
    text-align: right;
    margin-left: 80px;
    margin-top: 7px
}

.PopContent[mod=StoreStockView]>.MessageArea .Mitem .productItem a,
.PopContent[mod=StoreStockView]>.MessageArea .Mitem .productItem span:nth-child(2) {
    font-weight: 500;
    margin-left: 80px
}

.PopContent[mod=StoreStockView]>.Step[S="0"] {
    padding: 0 40px
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .Text {
    width: 100%;
    font-size: 12px;
    font-weight: 300;
    margin-bottom: 32px
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .SizeList {
    width: 100%;
    display: flex;
    gap: 12px;
    margin-bottom: 30px
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .SizeList .Item {
    width: 100%;
    border: 1px solid;
    line-height: 40px;
    text-align: center;
    font-weight: 300;
    font-size: 11px;
    max-width: 80px;
    cursor: pointer
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .Btn:hover,
.PopContent[mod=StoreStockView]>.Step[S="0"] .SizeList .Item:hover {
    border-color: #b7b7b7
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .SizeList .Item.active {
    border-color: #000;
    font-weight: 700
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .Btn {
    width: 100%;
    border: 1px solid #000;
    line-height: 40px;
    text-align: center;
    font-size: 12px;
    cursor: pointer
}

.PopContent[mod=StoreStockView]>.Step[S="0"] .Btn.Disabled {
    pointer-events: none;
    color: #919191
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .SearchBox {
    width: calc(100% - 80px);
    border: 1px solid #000;
    position: relative;
    display: flex;
    margin: 0 40px 30px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .SearchBox input {
    width: 100%;
    border: 0;
    outline: 0;
    padding: 12px;
    font-size: 12px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .SearchBox .Btn {
    width: 70px;
    line-height: 40px;
    font-size: 13px;
    border-left: 1px solid #000;
    text-align: center;
    cursor: pointer
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .BtnText {
    width: calc(100% - 80px);
    font-size: 12px;
    text-decoration: underline;
    font-weight: 300;
    line-height: 22px;
    margin: 0 40px;
    cursor: pointer
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabList {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabList .TabItem {
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
    width: 100%;
    text-align: center;
    line-height: 40px;
    font-size: 13px;
    color: #939393;
    font-weight: 400;
    cursor: pointer
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabList .TabItem:first-child,
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabList .TabItem:nth-child(2) {
    border-right: 1px solid #000
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView {
    display: none;
    width: 100%;
    overflow: auto
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView::-webkit-scrollbar {
    width: 3px !important;
    height: 3px !important
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView ::-webkit-scrollbar {
    width: 3px !important;
    height: 3px !important
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView::-webkit-scrollbar-thumb {
    background-color: #000
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView::-webkit-scrollbar-track {
    background: rgb(228 228 228 / 41%)
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Blank {
    width: 100%;
    display: none;
    flex-direction: column;
    padding: 36px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Blank svg {
    display: flex;
    flex-direction: column;
    margin-bottom: 23px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Blank span:first-child {
    width: 100%;
    display: flex;
    flex-direction: row;
    font-size: 13px;
    font-weight: 200;
    line-height: 22px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Blank span:nth-child(2),
.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Blank span:nth-child(3) {
    width: 100%;
    display: flex;
    flex-direction: row;
    font-size: 12px;
    font-weight: 200;
    line-height: 24px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item {
    width: 100%;
    display: flex;
    border-bottom: 1px solid #000;
    padding: 20px 40px;
    justify-content: flex-start;
    align-items: flex-start;
    cursor: pointer
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Check {
    width: 40px;
    position: relative
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Check:before {
    content: "";
    width: 14px;
    height: 14px;
    display: block;
    border: 1px solid #707070;
    border-radius: 100%
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item.active .Check:after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #000;
    border-radius: 100%;
    position: absolute;
    top: 3px;
    left: 3px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .Name {
    width: 100%;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 4px;
    text-transform: uppercase
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .Desc {
    width: 100%;
    font-size: 13px;
    font-weight: 300;
    color: #575757;
    margin-bottom: 12px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .Sizes {
    width: 100%;
    font-size: 12px;
    color: #575757;
    font-weight: 300;
    line-height: 20px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .Address {
    width: 100%;
    font-size: 12px;
    color: #575757;
    font-weight: 300;
    line-height: 20px;
    margin-top: 10px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .List .Item .Info .BtnText {
    text-align: left;
    width: initial;
    margin: 5px 0 0
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Empty {
    width: 100%;
    display: flex;
    align-items: flex-start;
    padding: 50px 40px;
    text-align: left;
    align-content: flex-start;
    flex-direction: column
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Empty svg {
    height: 34px
}

.PopContent[mod=StoreStockView]>.Step[S="1"] .TabView .Empty div {
    width: 100%;
    display: flex;
    flex-direction: column;
    font-weight: 200;
    font-size: 12px;
    margin-top: 8px
}

.wo_mod_33_content {
    font-size: 12px;
    color: #0f3c11;
    line-height: 9px;
    padding: 8px 6px;
    word-break: break-word;
    background: #e1ffe2;
    font-weight: 300;
    border-radius: 5px
}

.InputGroups {
    display: flex;
    width: 100%;
    gap: 22px
}

.PopContent {
    padding: 1px 5px 1px 1px;
    overflow: auto;
    max-height: 75vh
}

.PopContent::-webkit-scrollbar {
    width: 0;
    background: #b2b2b200;
    display: block
}

.PopContent:hover::-webkit-scrollbar {
    width: 2px
}

.PopContent::-webkit-scrollbar-thumb {
    background: #000;
    border-radius: 2px
}

.PopContent::-webkit-scrollbar-thumb:hover {
    background: #555
}


.ProductItem.nonStock {
    display: none
}



.PopContent[fr=AddBagSuccess] {
    max-height: 90vh
}

.PopContent[fr=AddBagSuccess] .Preview .ProductItem>div>.Info,
.PopContent[fr=StockNotificationForm] .Preview .ProductItem>div>.Info {
    height: inherit;
    min-height: 132px;
}



.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product>.Color .Code,
.ProductItem .Info .Product>.Color .Code {
    width: 10px;
    height: 10px;
    display: block;
    flex: none;
    border: 1px solid #e5e5e5;
    margin-top: -2px
}

.ProductItem.Favorite .Info .Properties .Btn.Favorite,
.ProductItem.Favorite .Info .Properties .Sizes,
.ProductItem.Wait .Info .Properties .Btn.Favorite {
    display: flex;
    align-items: center
}



.ProductItem.Favorite .Info .Product>.Name:hover {
    text-decoration: underline;
}

.ProductItem.Favorite .Info .Product,
.ProductItem.Wait .Info .Product {
    display: flex;
    flex-direction: column
}


.ProductItem.Favorite .Info .Properties .Sizes>select[pageload="1"] {
    height: 14px
}

.ProductItem.Favorite .Info .Product>.Name[pageload="1"] {
    height: 17px
}

.ProductItem.Favorite .Info .Product>.Name {
    width: 100%;
    margin-bottom: 2px;
    font-size: 12px;
    line-height: 17px
}

.ProductItem.Favorite .Info .Product>.Rating {
    display: none;
}

.ProductItem.Favorite .Info .Product>.Rating:not([Point="0"]) {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: #000000;
    font-weight: 500;
}

.ProductItem.Favorite .Info .Product>.Rating .bottom-header-left {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 4px 0px;
}





.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.Price>span {
    margin-left: 3px
}

.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info {
    line-height: 18px;
    font-size: 16px;
    font-weight: 500;
}

.Page[PageType=View] .Information .InfoBar .Info .PriceBox .OldPrice {
    line-height: 18px;
    font-size: 16px;
    font-weight: 400;
    color: #8B8B8B;
}

.Page[PageType=View] .PriceBox .OldPrice:before {
    content: "";
    background: #a4a4a4;
    top: 8px;
}

.Page[PageType=View] .PriceBox .OldPrice .Info>.Price:before {
    content: "";
    background: #a4a4a4;
    top: 8px;
}


.PopContent .ProductItem .Gallery .VariationBar {
    display: none
}

@media(max-width: 1140px) {


    .ProductItem.Wait .Info .Properties .Btn {
        font-size: 11px
    }

    .ProductItem.Wait .Info .Properties .Btn:last-child {
        margin-right: 0
    }

    .ProductItem.Favorite .Info .Properties .Sizes>select {
        pointer-events: none
    }


}

/*PRODUCT CARD*/
.action-loading,
.add-bag-loading {
    position: relative !important;
    pointer-events: none !important;
}

.action-loading>*,
.add-bag-loading>* {
    opacity: .22;
}

.action-loading:after,
.add-bag-loading:after {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    left: 50%;
    top: 50%;
    margin-left: -9px;
    margin-top: -9px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: addBagButtonLoading .65s linear infinite;
}

@keyframes addBagButtonLoading {
    to {
        transform: rotate(360deg);
    }
}
