.MobileAddition .Content .Products .ProductItem .Info .PriceBox .SalePrice .Info,[PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .PriceBox .SalePrice>.Info,body,p { margin: 0 } body,html { height: 100% } .Btn,section[L=Head] .Mod.StandartHead>.Container .BagCounter>span:first-child,section[L=Head] .Mod.StandartHead>.Container .BagCounter>span:nth-child(2) { font-size: 13px } .Input label,.modLogin_container_right_area_form_box_input label { text-overflow: ellipsis; white-space: nowrap; pointer-events: none; transform-origin: 0 0 } 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 } body.Query>:not(.PageLoading)>* { pointer-events: none } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList .PosItem.active img,body.Query [Mod=Search]>* { filter: none } body.AdditionView { 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 { 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 } div { unicode-bidi: isolate } body[SlideTheme="WHITE"] .Mod3_Group_UserBar_Btn>svg{color: #fff} body[SlideTheme="WHITE"] .Mod3_Group_UserBar_Btn>svg>path{fill: #fff} * { box-sizing: border-box; text-decoration: none; color: inherit } .AddressForm,.AddressForm .Form .BtnList.show .Btn,.BagInformation .Addition,.BagInformation .Addition .Btn,.BagInformation .Addition .Items .Item>span:first-child>strong,.BagInformation .CouponBox .Inputs>.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 .InfoBar,.Page[PageType=View] .Information .InfoBar .Info,.Page[PageType=View] .Information .VariationArea,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Photo>img,.PopContent[fr=AddBagSuccess] .TabView>.Title,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Btn:hover,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item>span:first-child>strong,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Gallery>img,.PopContent[fr=BagProductDelete] .BtnList>.Btn,.PopContent[fr=OrderContract],.PopContent[fr=OrderContract] .Viewer .ContractTab,.PopContent[fr=PaymentAccountForm] .Banks .Logo>svg,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table thead,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table thead tr,.PopContent[fr=ProductInstallment] .Pay .Tab .Text,.PopContent[fr=SizeTable] .Viewer .Info,.PopContent[fr=SizeTable] .Viewer .Info>.Img,.PopContent[fr=SizeTable] .Viewer .Info>.Text,.PopContent[fr=SmsCountdown] .Btn,.PopContent[fr=SmsCountdown] .CountArea,.PopContent[fr=SmsCountdown] .CountArea .Text,.PopContent[fr=SmsCountdown] .CountArea .Timer,.PopContent[fr=SmsCountdown] .Inputs>.Input,.PopContent[fr=Support]>.List .ItemBox,.PopContent[fr=Support]>.List .ItemBox .Item>div,.PopContent[fr=mod100Preview] .Btn,.PopContent[fr=mod100Preview] .Products .ProductItem>div .Gallery img,.PopupBox .PopClosed,.PopupBox.RightPop .PopClosed,.PopupBox>.Document>.Container,.ProductOtherViewContainer .OtherProductView,.ProductOtherViewContainer .OtherProductView>.Container,.ProductOtherViewContainer .OtherProductView>.Container .Group,.ProductOtherViewContainer .OtherProductView>.Container .Group .List,.col-12,.modLogin_container_left_area_closed,.modLogin_container_left_area_item_02,.modLogin_container_left_area_item_03,.modLogin_container_overflow,.modLogin_container_right_area_closed,.modLogin_container_right_area_form,.modLogin_container_right_area_form_box02,.modLogin_container_right_area_form_box03,.modLogin_container_right_area_form_box_btn_group,.modLogin_container_right_area_form_box_contract,.modLogin_container_right_area_form_box_contract_conntainer,.modLogin_container_right_area_form_box_social_box,.modLogin_container_right_area_form_box_social_btn_group,.modLogin_container_right_area_form_box_social_text02,.modLogin_container_right_area_title_box,.modLogin_container_right_area_title_box_text02,.modLogin_container_right_area_title_box_text03,.modLogin_container_right_area_title_box_text04,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .intl-tel-input,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .intl-tel-input .form-input,[Grid="201"] .ProductItem:nth-child(+3n),[Grid="201f"] .ProductItem:nth-child(+3n),[Grid=Special] .ProductItem[ListType="1"] .Layout.Gallery,[Grid=Special] .ProductItem[SubType="1"],[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] [P=Gift] .GiftItem .Info .Left,[PageType=Account] [P=Gift] .GiftItem .Information .Date span,[PageType=Bag] .TabList .TabItem.active,[PageType=Bag] .TabList .TabItem:hover,[PageType=Bulletin] .AppBox .Box,[PageType=Bulletin] .AppBox .Box .Apps .Item .Info .Icon svg,[PageType=Bulletin] .AppBox .Box .Apps .Item img,[PageType=Bulletin] .Content .Box .Contrat .Btn,[PageType=Bulletin] .Content .Box .Input,[PageType=List] .FilterBar .FilterBarTop .SubCategories,[PageType=List].List.Type1,[PageType=Payment] .ContentArea .TabView .ContentLeft,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Info .Note,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Info .Item span:nth-child(2)>svg,[PageType=Payment] .InstallmentBox .PosView table tbody,[PageType=Payment] .InstallmentBox .PosView table thead,[PageType=Payment] .InstallmentBox .PosView table thead tr,[PageType=Support] .Content,[PageType=Support] .SearchArea .SearchBox,[fr=OrderDetail] .Address>span:nth-child(2),[fr=OrderDetail] .OrderNumber>span,[fr=OrderDetail] .Payment>span:nth-child(2),form { width: 100% } 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 } .system-notification-item.success { background: #000; color: #fff } .system-notification-item.error { background: red; color: #fff } .system-notification-item.info { background: #000; color: #fff } .system-notification-item.show { bottom: 20px; transition: .3s } .system-notification-item div+div { text-decoration: underline; cursor: pointer; margin-left: 40px } .BagInformation .Addition .BalanceBar .Btn span:first-child,.BagInformation .Addition .Items .Item[V="0"],.FilterBarBottom>.Left .FilterBox .FilterItem>.Item>span,.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.Load[BagCount="0"] .TabView[T="1"] .BagInformation,.Page.Load[BagCount="0"] .TabView[T="1"] .ProductList,.Page:not([BagCount="0"]) .TabView[T="1"]>.Empty,.Page:not([FavoriteCount="0"]) .TabView[T="2"]>.Empty,.Page[FavoriteCount="0"] .TabView[T="2"] .ProductList,.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=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 .InfoBar .Info .PriceBox .Campaigns:empty,.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText:empty,.Page[PageType=View] .Information .SizeTable[data-id="0"],.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=AddBagSuccess] .TabList .TabItem[Q="0"]>span:nth-child(2),.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .Campaigns:empty,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SpecialText:empty,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .Campaigns:empty,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SpecialText:empty,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox[DiscountRate="0"] .SalePrice .Info>.DiscountRate.show,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox[OldPrice="0"] .OldPrice,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item[V="0"],.PopContent[fr=AddBag]>.Footer>.Btn.SizeTable[data-id="0"],.PopContent[fr=AddBag]>.Note:empty,.PopContent[fr=AddBag]>.PriceBox .SalePrice .SpecialText:empty,.PopContent[fr=AddBag]>.Variations .SizeItem:not([qty="0"]) .Notification,.PopContent[fr=AddBag]>.Variations .SizeItem[Notification="0"] .Notification,.PopContent[fr=Loading].isPay:before,.PopContent[fr=OrderContract] .Viewer .ContractTab .ContractTabTitle>svg[fr=accordionOpen],.PopContent[fr=OrderContract] .Viewer .ContractTab.Open .ContractTabTitle>svg[fr=accordioClose],.PopContent[fr=ProductInstallment] .InstallmentBox .PosView,.PopContent[fr=SizeTable] .Viewer .Table .TableRow>div:empty,.ProductItem .Gallery .VariationBar .List>.SizeItem:not([Qty="0"])>div,.ProductItem .Gallery .VariationBar .List>.SizeItem[Notification="0"]>div,.ProductItem .Info .Colors[Count="1"],.ProductItem .Info .PriceBox .SalePrice .SpecialText:empty,.ProductItem.Wait .Info .Properties .Btn[fr=stockIn],.ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-next:after,.ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-prev:after,.card-js .icon,.modLogin_container_right_area_form_box_btn[fr="{nonLogin}"],.modLogin_container_right_area_form_box_change_register_text01,.modLogin_container_right_area_form_box_input.view .passwordViewer>svg[fr="{passwordView}"],.modLogin_container_right_area_form_box_social_btn[fr="{social_btn_apple}"],.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content[CD=ErrorBox],.module-login.TopFull .right-siderbar .siderbar-container .popUp-left-pic,.system-notification-item div+div.Sh0,[Grid="12"] .ProductItem .Info,[Grid="12"] .ProductItem .VariationBar,[Grid=Special] .ProductItem[INFO="1"] .Info,[Grid=Special] .ProductItem[INFO="1"] .VariationBar,[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,[PageType=Bag]:not([BagCount="0"]) .TabView[T="1"] .ProductList .ProductItem.ItemEmpty,[PageType=Bag]:not([FavoriteCount="0"]) .TabView[T="2"] .ProductList .ProductItem.ItemEmpty,[PageType=List] .CategoryTextBox .CategoryTextMore svg[fr=categoryTextMoreClose],[PageType=List] .CategoryTextBox.show .CategoryTextMore svg[fr=categoryTextMoreOpen],[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List+[fr=addAddressForm],[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem[data-id="99"],[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList[data-id="99"] .List .PayItem:not([data-id="99"]),[PageType=Payment] .InstallmentBox .PosView,[PageType=Support] .Content .Categories .List .Box .Title svg,[fr=OrderDetail] .Addition>.Item.Products,[fr=OrderDetail] .Addition>.Item[V="0"],body.addAddressForm [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar,body.editAddressForm [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar,section[Mod=Nav] .SubNav>.NavItem>.Box .Icon { display: none } .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}"],.PopContent[fr=ProductInstallment] .InstallmentBox .PosView.active,.system-notification-item div+div.Sh1 { display: block } .MobileAddition .Content .Addition .Item.Delivered[V="0"]{display:flex} .BagInformation .Addition .Items .Item.Delivered[V="0"]{display:flex} [fr=OrderDetail] .Addition>.Item.Delivered[V="0"]{display:flex} .currIco { margin-left: 2px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content,[PageLoad="1"]:empty { position: relative } [PageLoad="1"]:empty:before { content: ""; height: 100%!important; position: absolute; width: var(--plw)!important; background: #fff!important; background: linear-gradient(90deg,#f0f0f0 25%,#f5f5f5 50%,#f0f0f0 75%)!important; animation: 1.5s infinite loadingGradient; border-radius: 4px; opacity: .8 } @keyframes loadingGradient { 0% { background-position: 200% 0 } 100% { background-position: -200% 0 } } .d-none,body.addAddressForm [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar,body.editAddressForm [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar { display: none!important } .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) { .W1180,.W1320,.W1440,.W1600,.W575 { width:540px } .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: 768px) { .W1180,.W1320,.W1440,.W1600 { width:750px } .W575 { width: 540px } .hidden-desktop { display: none!important } } @media(min-width: 992px) { .W1180,.W1320,.W1440,.W1600 { width:970px } .W575 { width: 540px } .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 { 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 } } @media(min-width: 1200px) { .W1180,.W1320,.W1440,.W1600 { width:1180px } .W575 { width: 540px } .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 { 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 } } @media(min-width: 1380px) { .W1320,.W1440,.W1600 { width:1320px } .W1180 { width: 1180px } .W575 { width: 540px } .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) { .W1440,.W1600 { width:1440px } .W1320 { width: 1320px } .W1180 { width: 1180px } .W575 { width: 540px } .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 } } @media(min-width: 1650px) { .W1600 { width:1600px } .W1440 { width: 1440px } .W1320 { width: 1320px } .W1180 { width: 1180px } .W575 { width: 540px } } .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="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),[Grid=Special] .ProductItem[SubType="1"][data_w="1"] { width: 50% } .col-5 { width: 41.66666667% } .col-4 { width: 33.33333333% } .FilterBarBottom>.Left .FilterBox .FilterItem[F=colors]>.FilterWind .List>.Item,.col-3,[Grid="4"] .ProductItem,[Grid=Special] .ProductItem[SubType="2"][data_w="2"],[Grid=Special] .ProductItem[SubType="3"][data_w="1"],[Grid=Special] .ProductItem[SubType="4"] { 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 { 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) { .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 } } @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) { .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% } .col-md-5-5 { width: 100% } } @media(min-width: 1200px) { .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% } .col-lg-5-5 { width: 100% } } .MultipleInputs { width: 100%; display: flex; gap: 18px } .InputGroup,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box .Item { width: 100%; position: relative } .InputGroup>.Title { width: 100%; position: relative; margin-bottom: 24px } [fr=PhoneChange] .Text,[fr=PhoneChange] .Title { margin-bottom: 16px; text-align: center } .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.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; right: 0; width: auto; bottom: 20px; background: #eaeaea; line-height: 18px; font-size: 11px; padding: 1.5px 8px .5px; cursor: pointer } .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,.modLogin_container_right_area_form_box_input .passwordViewer>svg { height: 11px; display: none } .Input button.passwordViewer>svg[fr="{passwordView}"],.modLogin_container_right_area_form_box_input .passwordViewer>svg[fr="{passwordView}"] { height: 11px; display: block } .Input button.passwordViewer>svg[fr="{passwordHide}"],.modLogin_container_right_area_form_box_input .inputClear>svg,.modLogin_container_right_area_form_box_input .passwordViewer>svg[fr="{passwordHide}"] { height: 11px } .Input input,.Input select,.Input textarea { display: block; width: 100%; font-size: 12px; font-weight: 100; color: #000; appearance: none; background-color: #fff; background-clip: padding-box; border: 0; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; border-bottom: 1px solid #000; border-radius: 0; line-height: 18px; padding: 16px 6px 2px 1px; outline: 0; resize: none } input:-webkit-autofill,select:-webkit-autofill,textarea:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #fff inset!important; 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,.modLogin_container_right_area_form_box_input.error input { 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, .modLogin_container_right_area_form_box_input.error .modLogin_container_right_area_form_box_input_error, .modLogin_container_right_area_form_box_contract_contract01.error .modLogin_container_right_area_form_box_input_error { opacity: 1; display: block; } .Page.Load[PageType=List] .Empty{ opacity: 1 } .Page.Load[PageType=List] .CategoryName{ opacity: 1 } .Input .InputGroup { display: flex; align-items: center; 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,.modLogin_container_right_area_form_box_contract_contract01 .Check::before,.modLogin_container_right_area_form_box_input_content_checkgroup .Check::before,[PageType=Account] .Container[P=Payment] .List .AccountItem .Title .Check::before,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Check::before,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Check::before,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Check::before,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .CheckGroup .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,.PopContent[fr=OrderCancel] .List .Check.active::after,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr .Check.active::after,.modLogin_container_right_area_form_box_contract_contract01 .Check.active::after,.modLogin_container_right_area_form_box_input_content_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,[PageType=Bulletin] .Content .Box .Contrat .Check.active::after,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Check.active::after,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Check.active::after,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Check.active::after,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .CheckGroup .Check.active::after,[PageType=Payment] .InstallmentBox .PosView table tbody tr .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,.PopContent[fr=SizeTable] .Viewer .Tab>.TabItem.active,.PopContent[fr=SizeTable] .Viewer .Table .TableRow>div.active,[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: 0; z-index: 2 } .Input .Information>.Icon { position: absolute; top: 15px; right: 0; z-index: 2; cursor: pointer } .AddressForm .Form .Invoice .TypeBoxForm.active,.AddressForm.Invoice .Form .Invoice,.FilterBarBottom>.Right .FilterGrid>div.active,.Input .Information>.Icon.show+.Wind,.Page:not([BagCount="0"]) .TabView[T="1"] .BagInformation,.Page:not([BagCount="0"]) .TabView[T="1"] .ProductList,.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox:not([DiscountRate="0"]) .SalePrice .Info>.DiscountRate,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox:not([DiscountRate="0"]) .SalePrice .Info>.DiscountRate,.PopContent[fr=AddBag]>.PriceBox:not([DiscountRate="0"]) .SalePrice .Info>.DiscountRate,.PopContent[fr=ProductInstallment] .InstallmentArea.show+.InstallmentBox,.PopContent[fr=StockNotificationForm]>.Form .Contract,.PopContent[fr=StockNotificationForm]>.Form .Contract .Text,.PopContent[fr=Support]>.List .ItemBox.M1,.ProductItem .Info .PriceBox:not([DiscountRate="0"]) .SalePrice .Info>.DiscountRate,.modLoginBox.show,.modLoginBox[Operation="3"][FormType="0"] .modLogin_container_right_area_form_box_btn[fr="{alternative_login_mail}"],.modLoginBox[Operation="3"][FormType="1"] .modLogin_container_right_area_form_box_btn[fr="{alternative_login_phone}"],.module-login .right-siderbar .siderbar-container .identity-popup-top-header,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content[CD=ErrorBox].Active,[PageType=Account] .Container[P=Return] [T=newReturn] .ReturnInformation .Desc span,[PageType=Account] .OrderItem>.Area .InfoBar .Status .StatuBar,[PageType=Bag] .TabView.active,[PageType=Payment] .BagInformation .Addition .Items .Item.Products,[PageType=Payment] .InstallmentArea.show+.InstallmentBox,[PageType=Payment] .InstallmentBox.show,body[Page=Bag] [fr=login][NonLogin="1"] .modLogin_container_right_area_form_box_btn[fr="{nonLogin}"],section[Mod=Nav] .UserBar .Btn[fr=Bag]:not([Q="0"])>div,section[Mod=Nav] .UserBar .Btn[fr=Bag]>div>span { display: flex } .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,.PopContent[fr=ProductInstallment] .InstallmentArea,.ProductItem.Favorite .Info .Properties .Btn.Favorite,.ProductItem.Favorite .Info .Properties .Sizes,.ProductItem.Wait .Info .Properties .Btn.Favorite,.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 { position: absolute; top: 0; left: 0; z-index: 2; height: 100%; font-size: 12px; 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 select:not(:placeholder-shown),.Input textarea:not(:placeholder-shown),.modLogin_container_right_area_form_box_input input:not(:placeholder-shown) { padding-top: 16px } .Input input:focus~label,.Input input:not(:placeholder-shown)~label,.Input select:focus~label,.Input select:not(:placeholder-shown)~label,.Input textarea:focus~label,.Input textarea:not(:placeholder-shown)~label { font-size: 11px; color: #7b7b7b; line-height: 18px; padding-left: 0 } .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 { 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: 100; 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,.PopContent[fr=AddBagSuccess] .Closed:hover,.PopContent[fr=AddBankAccount] .Closed:hover,.PopContent[fr=BalancePayment] .BankList [fr=selectedAccount]:hover,.PopContent[fr=BalancePayment] .Closed:hover,.PopupBox.Center .Closed:hover,.PopupBox.RightPop .Closed:hover,.modLogin_container_right_area_form_box_btn:hover,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Btn:hover { opacity: .8 } .Btn.OutLineBlack { background: #fff; color: #000; border: 1px solid #000 } .Btn.Black,.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText:hover,.PopContent[fr=AddBag]>.PriceBox .SalePrice .SpecialText:hover,.ProductItem .Info .PriceBox .SalePrice .SpecialText:hover { background: #000; color: #fff } .Btn.Disabled { background: #f0f0f0; color: #606060; pointer-events: none; border-color: #efefef } section[L=Head] { width: 100%; position: fixed; top: 0; z-index: 2; background: #ffffffe8; transition: .3s; } section[L=Footer],section[L=Breadcrumb],section[L=View] { display: block; width: 100%; position: relative; z-index: 0; } section[L=Breadcrumb]{ margin-bottom: -30px; margin-top: 20px; } 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{ font-weight: 700; } section[L=Breadcrumb] .Breadcrumbs span{ color: #666; } body[Page=Bag] section[L=Head]+section[L=View],body[Page=Payment] section[L=Head]+section[L=View] { padding-top: 75px } 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 } body[Page=View] section[L=Head] { position: fixed; background: 0 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(0.5px); transform:translateX(-50%) translateY(-50%); border-radius:50%; box-shadow:0 3px 6px #48D7927C; } .module-004 .saosmc-successAnimation .saosmcsa-circle5 i { color:#FFFFFF; font-size:25px; font-weight:bold; } @keyframes saosmcsa-greenDots { from { transform:translateX(-50%) translateY(-50%) rotate(0deg); } 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: 10013 } .PopClosed{display:none !important} .PopupBox>.OverFlow { width: 100%; position: fixed; left: 0; top: 0; height: 100%; background: #00000047; z-index: 1 } .PopupBox>.Document { position: relative; z-index: 2; background: #fff; min-width: 320px; min-height: 120px; transition: .1s } .PopupBox.LoginLoad>.Document { width: auto!important; border-radius: 12px; padding: 10px!important; min-width: inherit; margin: 20px; min-height: inherit } .PopupBox.Center>.Document { padding: 60px 20px 40px } .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 } .PopupBox.RightPop.Show .Document { right: 0; transition: .1s } .PopupBox.RightPop .Closed { position: absolute; right: 0; top: 0; cursor: pointer; PADDING: 20PX } .PopContent[fr=AddBagSuccess] .Closed,.PopContent[fr=AddBankAccount] .Closed,.PopContent[fr=BalancePayment] .Closed,.PopupBox.Center .Closed { position: absolute; right: 20px; top: 20px; cursor: pointer } [fr=PhoneChange] { padding: 20px } [fr=PhoneChange] .Title { font-weight: 500 } [fr=PhoneChange] .BtnList { display: flex; gap: 16px; margin-top: 20px; flex-direction: column } [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"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .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,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Photo>img,.ProductItem .Info .Badges>span,.ProductItem .Info .InfoBar03,[fr=OrderDetail] .ProductList .ProductItem .Gallery>img,[fr=RequestDetail] .ProductList .ProductItem .Gallery>img { width: 100%; display: block } .Page[PageType=View] .GalleryBar>.List>.Item { position:relative } .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{ /* height:100vh; */ width: 100%; position:absolute; display: block; width: 100%; 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 } .ProductItem .Info .InfoBar03{/* margin-top:auto; */} .BagInformation .CouponBox .Title,[fr=RequestDetail] .ProductList .ProductItem .Info .Item { width: 100%; margin-bottom: 6px } [PageType=Bulletin] .Container { display: flex; max-width: 840px; margin: 180px auto 40px; flex-direction: column } [PageType=Bulletin] .Title { width: 100%; text-align: center; font-size: 28px; font-weight: 700; margin-bottom: 100px } [PageType=Bulletin] .Content { width: 100%; display: flex; align-items: flex-start; justify-content: space-between; gap: 60px } [PageType=Bulletin] .Content .Box { width: 100%; max-width: 360px } [PageType=Bulletin] .Content .Box .Title { width: 100%; font-size: 18px; text-align: left; max-width: 69%; line-height: 24px; margin: 0 0 35px } [PageType=Bulletin] .Content .Box .Text { width: 100%; font-size: 16px; line-height: 20px } [PageType=Bulletin] .Content .Box .Contrat { width: 100%; display: flex; margin-top: 16px; margin-bottom: 35px; cursor: pointer } [PageType=Bulletin] .Content .Box .InfoText{width:100%;font-size: 12px;height: 14px;margin-bottom: 5px;} [PageType=Bulletin] .Content .Box .InfoText.success{color: #127e16;} [PageType=Bulletin] .Content .Box .InfoText.error{color: #f00;} .PopContent[fr=PaymentAccountForm] .Banks .Bank,[PageType=Bulletin] .Content .Box .Contrat .Check+div,[fr=OrderDetail] .Cargo>span:nth-child(2) { font-size: 12px } .Page[PageType=View] .Information .FeaturesBar .Feature>.Title:hover,.Page[PageType=View] .Information .FeaturesBar .FeaturesBtn:hover,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product>.Name:hover,.PopContent[fr=SaveMember]>.Form .Contract .Text>span:hover,.PopContent[fr=StockNotificationForm]>.Form .Contract .Text>span:hover,.ProductItem.Favorite .Info .Product>.Name:hover,.modLogin_container_right_area_form_box_remember>div: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=Bulletin] .Content .Box .Contrat .Check+div span { text-decoration: underline } [PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Check,[PageType=Bulletin] .Content .Box .Contrat .Check { display: flex; width: 14px; height: 14px; justify-content: flex-start; position: relative; align-items: center; padding-left: 24px; gap: 6px; cursor: pointer } .PopContent[fr=OrderCancel] .List .Check::before,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr .Check::before,[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Information .Check::before,[PageType=Bulletin] .Content .Box .Contrat .Check::before,[PageType=Payment] .InstallmentBox .PosView table tbody tr .Check::before { content: ""; width: 12px; height: 12px; border: 1px solid #000; flex: none; position: absolute; left: 0 } [PageType=Bulletin] .Divider { width: 100%; height: 1px; background: #e3e3e3; margin: 100px 0 60px } [PageType=Bulletin] .AppBox { width: 100%; display: flex; align-items: flex-start; align-content: flex-start; border-bottom: 1px solid #e3e3e3 } [PageType=Bulletin] .AppBox .Box .Title { width: 100%; font-size: 16px; margin-bottom: 18px; text-align: left } [PageType=Bulletin] .AppBox .Box .Text { width: 100%; max-width: 55%; font-size: 16px; margin-bottom: 30px; line-height: 18px } [PageType=Bulletin] .AppBox .Box .Apps { width: 100%; display: flex; gap: 100px } [PageType=Bulletin] .AppBox .Box .Apps .Item { width: 90px } .Page[PageType=Success]>.Container .Icon,[PageType=Bulletin] .AppBox .Box .Apps .Item .Info { width: 100%; display: flex; align-items: center; justify-content: center } [PageType=Bulletin] .AppBox .Box .Apps .Item .Info .Icon { margin-right: 5px } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .Name,.BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .Variation,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product>.Color .Text,.PopContent[fr=BalancePayment] .BankList [fr=selectedAccount]>div:nth-child(2) span:first-child,.PopContent[fr=BalancePayment] .BankList [fr=selectedAccount]>div:nth-child(2) span:nth-child(2),[PageType=Bulletin] .AppBox .Box .Apps .Item .Info .Name,[PageType=Payment] .InstallmentBox .PosList .PosItem span,[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Color .Text { font-size: 11px } [PageType=Bulletin] .AppBox .Box img { width: 296px; display: block } .PopContent[fr=OrderCancel] { width: 100%; padding: 20px 0 0 } .PopContent[fr=OrderCancel] .Title { width: 100%; margin-bottom: 5px; text-align: left } .PopContent[fr=OrderCancel] .List,.PopContent[fr=OrderCancel] .Text { width: 100%; margin-bottom: 20px; text-align: left } .PopContent[fr=OrderCancel] .SelectedItem { cursor: pointer; width: 100%; display: flex; text-align: left; align-items: center; line-height: 26px } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem:last-child,.PopContent[fr=OrderCancel] .SelectedItem>.Text,[PageType=Account] .Container[P=Return] [T=successReturn] .OrderDetail .List .Item:last-child,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Info .Item:last-child { margin-bottom: 0 } .PopContent[fr=OrderCancel] .List .Check,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr .Check,[PageType=Payment] .InstallmentBox .PosView table tbody tr .Check { display: flex; height: 14px; justify-content: flex-start; position: relative; align-items: center; margin-right: 10px; padding-left: 24px; gap: 6px } .PopContent[fr=OrderCancel] .BtnList { display: flex; gap: 16px; flex-direction: column } .PopContent[fr=FeaturesTab],.PopContent[fr=ProductInstallment],.PopContent[fr=SizeTable] { width: 100%; padding: 120px 40px 40px } .PopContent[fr=FeaturesTab] .Title,.PopContent[fr=ProductInstallment] .Title,.PopContent[fr=SizeTable] .Title { width: 100%; margin-bottom: 40px; text-align: left } .PopContent[fr=ProductInstallment] .Pay { width: 100%; display: flex; align-items: stretch; margin-bottom: 30px; gap: 8px; flex-wrap: wrap } .PopContent[fr=ProductInstallment] .Pay .Tab { width: calc(50% - 4px); display: flex; flex-direction: column; border: 1px solid #000; padding: 10px } .PopContent[fr=ProductInstallment] .Pay .Tab .Title { width: 100%; font-weight: 100; font-size: 11px; color: #2b2b2b; margin: 0 } .PopContent[fr=ProductInstallment] .InstallmentArea .Title { display: flex; align-items: center; margin-bottom: 20px } .PopContent[fr=ProductInstallment] .InstallmentBox { display: flex; flex-direction: column; max-width: 450px } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList { display: flex; gap: 12px; overflow: hidden; flex-direction: row; position: relative; align-content: space-around; margin-bottom: 23px } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.Arrow:first-child,[PageType=Payment] .InstallmentBox .PosList>.Arrow:first-child { background: #fff; flex: none; position: absolute; left: 0; top: 0; z-index: 1; height: 95%; width: 20px; flex: none; align-items: center; justify-content: center; cursor: pointer; display: none } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.Arrow:nth-child(3),[PageType=Payment] .InstallmentBox .PosList>.Arrow:nth-child(3) { background: #fff; flex: none; position: absolute; right: 0; top: 0; z-index: 1; height: 95%; width: 20px; flex: none; align-items: center; justify-content: center; cursor: pointer; display: none } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.Arrow>svg[fr=scrollLeft],[PageType=Payment] .InstallmentBox .PosList>.Arrow>svg[fr=scrollLeft] { display: flex; height: 6px; transform: rotate(270deg); flex: none } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.Arrow>svg[fr=scrollRight],[PageType=Payment] .InstallmentBox .PosList>.Arrow>svg[fr=scrollRight] { width: 27px; background: #fff; transform: rotate(90deg); flex: none } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.List { display: flex; align-items: center; gap: 12px; overflow-y: auto; border-top: 1px solid; padding: 12px 0 } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.List::-webkit-scrollbar { height: 1px; background: #000; width: 1px; background: #0000001f } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList>.List::-webkit-scrollbar-thumb { height: 1px; border-radius: 2px; background: #000 } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList .PosItem { width: 100%; display: flex; cursor: pointer; padding: 0 10px 0 0; justify-content: space-between; align-items: flex-end; border-right: 1px solid #000 } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList .PosItem img { display: flex; filter: grayscale(1); height: 23px } .PopContent[fr=ProductInstallment] .InstallmentBox .PosList .PosItem span { margin-left: auto; font-size: 11px } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table,[PageType=Payment] .InstallmentBox .PosView table { width: 100%; border-collapse: collapse } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table thead tr th,[PageType=Payment] .InstallmentBox .PosView table thead tr th { font-weight: 500; line-height: 40px; padding: 0 12px; font-size: 11px } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr td:first-child,.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table thead tr th:first-child,[PageType=Account] .Table table tbody td.tLeft,[PageType=Account] .Table table thead th.tLeft,[PageType=Payment] .InstallmentBox .PosView table tbody tr td:first-child,[PageType=Payment] .InstallmentBox .PosView table thead tr th:first-child,section[Mod=Nav] .SubNav>.NavItem>.Box .Icon.Left { text-align: left } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr td:nth-child(3),.PopContent[fr=ProductInstallment] .InstallmentBox .PosView table thead tr th:nth-child(3),[PageType=Account] .Table table tbody td.tRight,[PageType=Account] .Table table thead th.tRight,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Info .Item span:first-child,[PageType=Payment] .InstallmentBox .PosView table tbody tr td:nth-child(3),[PageType=Payment] .InstallmentBox .PosView table thead tr th:nth-child(3),section[Mod=Nav] .SubNav>.NavItem>.Box .Icon.Right { text-align: right } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr,[PageType=Payment] .InstallmentBox .PosView table tbody tr,section[Mod=Nav] .SubNav>.NavItem { width: 100%; cursor: pointer } section[Mod=Nav] .SubNav>.NavItem {color:#000} section[Mod=Nav] .SubNav>.NavItem[rowb="1"]{margin-bottom:20px} section[Mod=Nav] .SubNav>.NavItem[rowb="2"]{margin-bottom:30px} section[Mod=Nav] .SubNav>.NavItem[rowb="3"]{margin-bottom:40px} section[Mod=Nav] .SubNav>.NavItem[rowb="4"]{margin-bottom:50px} section[Mod=Nav] .SubNav>.NavItem[lasticon="1"] .Icon.Right{display:block} 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; } section[Mod=Nav] .SubNav>.NavItem[firsticon="1"] .Icon.Left{display:block} 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; } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr:hover td,[PageType=Payment] .InstallmentBox .PosView table tbody tr.active td,[PageType=Payment] .InstallmentBox .PosView table tbody tr:hover td { background: #f5f5f5 } .PopContent[fr=ProductInstallment] .InstallmentBox .PosView table tbody tr td,[PageType=Payment] .InstallmentBox .PosView table tbody tr td { font-size: 11px; border-bottom: 1px solid #ededed; line-height: 11px; text-align: center; padding: 15px 12px; width: 33.33%; position: relative } .PopContent[fr=Message] .Title { position: relative; margin: 10px 0 17px; text-align: center; text-transform: uppercase } .PopContent[fr=Message] .Text { position: relative; margin: 0; text-align: center } .PopContent[fr=Sms] .otc label,.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 } .PopContent[fr=Sms] .top-area { position: relative; text-align: center; display: flex; flex-direction: column } .PopContent[fr=Sms] .title { position: relative; margin: 0 0 17px } .PopContent[fr=Sms] .text { position: relative; margin: 0 auto; max-width: 62% } .PopContent[fr=Sms] .otc { position: relative; margin-top: 22px } .PopContent[fr=Sms] .otc .fieldset-sms,.Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content>.otc .fieldset-sms { border: 0; padding: 0; margin: 0 } .PopContent[fr=Sms] .otc .input-group,.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 } .PopContent[fr=Sms] .otc legend.label { font-size: 12px; color: #000; text-align: center; text-transform: uppercase } .PopContent[fr=Sms] .otc.error legend.label { color: red } .PopContent[fr=Sms] .otc .fieldset-sms .input-group>input { width: 41px; height: 46px; line-height: 1; margin-top: 10px; padding: 15px 0 0; font-size: 18px; appearance: textfield; -webkit-appearance: textfield; border: 0; border-bottom: 1px solid #000; color: #000; outline: 0; text-align: center } .PopContent[fr=Sms] .otc .fieldset-sms .input-group>input[type=number].input-code.full { border-color: #000; background-color: #fff } .PopContent[fr=Sms] .otc.error .fieldset-sms .input-group>input[type=number].input-code.full { border-color: red; color: red } .PopContent[fr=Sms] .otc .left-time { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; flex-direction: column-reverse } .PopContent[fr=Sms] .otc .left-time .timekeeper { font-size: 12px; color: #000; cursor: pointer; line-height: 16px; margin: 4px 0 } .PopContent[fr=Sms] .otc .left-time .time-text { font-size: 11px; color: #8b8b8b; line-height: 16px } .PopContent[fr=Sms] .otc .verify-area,[fr=OrderDetail] .Addition>.Item.Grand { margin-top: 8px } .PopContent[fr=Sms] .otc .verify-area .btn-verify { background-color: #efefef; border: 1px solid #e5e5e5; cursor: pointer; display: block; width: 100%; height: 39px; font-size: 12px; text-transform: uppercase; color: #939393; transition: .3s linear } .PopContent[fr=Sms] .otc .verify-area .btn-verify.success { background-color: #000; color: #fff } .PopContent[fr=Contract] { width: 100%; padding: 50px 36px 16px } .PopContent[fr=Contract] .Title,.PopContent[fr=OrderContract] .Title { width: 100%; font-weight: 500; text-transform: uppercase; margin-bottom: 10px } .PopContent[fr=Contract] .Viewer { width: 100%; overflow: auto; padding-bottom: 40px } .PopContent[fr=Contract] .Viewer::-webkit-scrollbar { display: none; width: 2px; background: #b2b2b2 } .PopContent[fr=Contract] .Viewer:hover::-webkit-scrollbar { display: block } .PopContent[fr=Contract] .Viewer::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=Contract] .Viewer::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=Contract] .Btn,.PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Variations { width: 100%; margin-top: auto } .PopupBox.Loading>.OverFlow { background: #ffffff78 } .PopupBox.Loading { display: flex; align-items: flex-start } .PopupBox.Loading>.Document { border: 1px solid #ccc; margin-top: 15% } .PopContent[fr=Loading] { padding: 30px; position: relative; display: flex; align-items: center; justify-content: center } .PopContent[fr=Loading]:before { content: ""; display: flex; background-image: url('/NewWebSites/img/body_loading.svg?v45'); width: 32px; height: 22px; position: absolute; top: 46px; background-size: 32px; z-index: 20 } .PopContent[fr=Loading] .Title { text-transform: uppercase; text-align: center } .PopContent[fr=FeaturesTab] .Viewer { width: 100%; overflow: auto; padding-right: 5px } .PopContent[fr=FeaturesTab] .Viewer::-webkit-scrollbar { width: 2px; background: #fff; display: block } .PopContent[fr=FeaturesTab] .Viewer:hover::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=FeaturesTab] .Viewer::-webkit-scrollbar-thumb { background: #555 } .PopContent[fr=OrderContract] .Viewer,.PopContent[fr=SizeTable] .Viewer,.PopContent[fr=SupportForm] .Form,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar { width: 100%; margin-bottom: 32px } .PopContent[fr=SizeTable] .Viewer .Tab { width: 100%; display: flex; justify-content: flex-end; gap: 20px; align-items: center; margin-bottom: 30px } .PopContent[fr=SizeTable] .Viewer .Tab>.Title { width: inherit; margin: 0 } .PopContent[fr=SizeTable] .Viewer .Tab>.TabItem { color: #909090; cursor: pointer; position: relative } .PopContent[fr=SizeTable] .Viewer .Tab>.TabItem.active::before { content: ""; background: #000; display: block; width: 2px; height: 2px; position: absolute; left: 50%; bottom: -2px } .PopContent[fr=SizeTable] .Viewer .Sizes { display: flex; justify-content: flex-start } .PopContent[fr=SizeTable] .Viewer .Sizes>.Item { min-width: 50px; height: 50px; padding: 0 5px; border: 1px solid #909090; margin-right: -1px; display: flex; align-items: center; justify-content: center; color: #909090; cursor: pointer } .PopContent[fr=SizeTable] .Viewer .Sizes>.Item.active { border-color: #000; color: #000; z-index: 1 } .PopContent[fr=SizeTable] .Viewer .Table { width: 100%; overflow: hidden; overflow-x: scroll; scrollbar-width: none; margin: 20px 0 50px } .PopContent[fr=SizeTable] .Viewer .Table .TableRow { width: 100%; display: flex; position: relative } .PopContent[fr=SizeTable] .Viewer .Table .TableRow>div { display: none; color: #909090; width: 91px; height: 32px; flex: none; text-align: center } .PopContent[fr=SizeTable] .Viewer .Table .TableRow>div select { border: 0; font-size: 12px; padding: 0; text-align: left; outline: 0 } .PopContent[fr=SizeTable] .Viewer .Table .TableRow>div:first-child { display: flex; color: #000; position: fixed; background: #fff; align-items: center; justify-content: flex-start } .PopContent[fr=SizeTable] .Viewer .Table .TableRow>div.show { margin-left: 81px; display: flex; align-items: center; justify-content: center } .PopContent[fr=SizeTable] .Viewer .Table .TableRow>div.show+.show { margin-left: 0 } .Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar .Variation>span,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Quantity>span,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Variation>span,.PopContent[fr=SizeTable] .Viewer .Table .TableRow>div>span:nth-child(2),[fr=OrderDetail] .ProductList .ProductItem .Info .Properties .QuantityBar .Variation>span { margin-left: 4px } .PopContent[fr=SizeTable] .Viewer .Info>.Title { width: 100%; margin-bottom: 12px } .PopContent[fr=SizeTable] .Viewer .Info>.Text >p{ margin-bottom: 7px } .PopContent[fr=SupportForm] { width: 100%; padding-top: 30px } .PopContent[fr=SupportForm] .Title { width: 100%; font-weight: 500; margin-bottom: 30px; text-align: center } .PopContent[fr=SupportForm] .Form textarea { width: 100%; min-height: 180px } .PopContent[fr=OrderContract] .Viewer .ContractTab .ContractTabTitle { width: 100%; border: 1px solid #a3a3a3; padding: 15px; margin-bottom: -1px; display: flex; align-items: center; justify-content: space-between } .FilterBarBottom>.Left .FilterBox .FilterItem.show>.FilterWind,.NotificationBar.show,.Page[PageType=View] .Information .VariationArea .Variations .SizeItem[data-qty="0"]>.Notification,.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox .OldPrice.show,.Page[PageType=View][Load="1"] .Information .InfoBar .Info .PriceBox:not([OldPrice="0"]) .OldPrice,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox:not([OldPrice="0"]) .OldPrice,.PopContent[fr=AddBag]>.PriceBox:not([OldPrice="0"]) .OldPrice,.PopContent[fr=OrderContract] .Viewer .ContractTab .ContractTabTitle>svg,.PopContent[fr=OrderContract] .Viewer .ContractTab.Open .ContractTabTitle>svg[fr=accordionOpen],[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=List] .CategoryTextBox .CategoryTextMore svg[fr=categoryTextMoreOpen],[PageType=List] .CategoryTextBox.show .CategoryTextMore svg[fr=categoryTextMoreClose],[PageType=SupportDetail] .QuestionArea .SearchBox.Load .Closed,[PageType=SupportDetail] .QuestionArea .SearchBox.Loading .Loading { display: block } .PopContent[fr=OrderContract] .Viewer .ContractTab .ContractTabView { width: 100%; overflow: auto; overflow-y: scroll; padding: 24px 24px 40px; border: 1px solid #a3a3a3; border-bottom: 0; display: none } .PopContent[fr=OrderContract] .Viewer .ContractTab:last-child .ContractTabView { border-bottom: 1px solid #a3a3a3 } .PopContent[fr=OrderContract] .Viewer .ContractTab .ContractTabView::-webkit-scrollbar { height: 0; width: 2px; background: #fff; display: block } .PopContent[fr=OrderContract] .Viewer .ContractTab .ContractTabView::-webkit-scrollbar-thumb { background: #555; border-radius: 2px } .PopContent[fr=OrderContract] .Btn { width: 100%; margin-top: auto; position: absolute; left: 0; bottom: 0 } .AddressForm .Title .Text,.MobileAddition .Content,.Page[PageType=Success]>.Container .OrderDetail,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info,.PopContent[fr=StockNotificationForm]>.Form,.PopContent[fr=Support],.modLogin_container_right_area_form_box01,[PageType=Account] .Container[P=Return] [T=historyReturn] .List .Item .Information,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .Title,[PageType=SupportDetail] .QuestionArea .BoxArea { width: 100%; display: flex; flex-direction: column } .PopContent[fr=Support]>.List { width: 100%; height: 100%; margin-bottom: 10px; padding: 50px 10px 10px; display: flex; flex-direction: column; gap: 12px; overflow-y: auto } .PopContent[fr=Support]>.List::-webkit-scrollbar { width: 2px; background: #fff; display: block } .PopContent[fr=Support]>.List::-webkit-scrollbar-thumb { background: #555; border-radius: 2px } .PopContent[fr=Support]>.List .ItemBox .Item { max-width: 90%; background: #efefef; border-radius: 3px; padding: 12px; min-width: 110px } .PopContent[fr=Support]>.List .ItemBox .Item>div>span:first-child,.modLogin_container_right_area_form_box_social_text01 { width: 100%; font-size: 12px } .PopContent[fr=Support]>.List .ItemBox .Item>div>span:nth-child(2),.ProductItem .Info .Colors>div>span:nth-child(2) { width: 100%; font-size: 10px } .PopContent[fr=Support]>.Footer { width: 100%; margin-top: 0; padding: 8px; border-top: 1px solid #ccc } .PopContent[fr=Support]>.Footer .Input { width: 100%; display: flex; margin: 0; gap: 8px } .PopContent[fr=Support]>.Footer .Input input { padding: 12px; border: 1px solid #000 } .PopContent[fr=Support]>.Footer .Input .Btn { position: initial; width: 100px; flex: none } .MobileAddition .Content .Products .ProductItem .Info .PriceBox .OldPrice,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .PriceBox .SalePrice,.PopContent[fr=Support]>.List .ItemBox.M0 { display: flex; justify-content: flex-end; align-items: flex-end; } .PopContent[fr=Support]>.List .ItemBox.M0 .Item { background: #d2f6d3 } .PopContent[fr=Support]>.List .ItemBox.M1 .Item { background: #eee } .PopContent[fr=BagDelete],.PopContent[fr=SaveMemberNotification] { width: 100%; display: flex; flex-direction: column; padding-top: 14px } .PopContent[fr=BagDelete]>.Title,.PopContent[fr=SaveMemberNotification]>.Title { width: 100%; margin-bottom: 17px; text-align: center } .PopContent[fr=SaveMemberNotification]>.Text { width: 100%; margin-bottom: 2px; text-align: center; line-height: 18px } .PopContent[fr=SaveMemberNotification]>.BtnList { width: 100%; display: flex; flex-direction: column; gap: 16px; margin-top: 25px } .PopContent[fr=BagDelete]>.Text { width: 100%; margin-bottom: 21px; text-align: center; line-height: 17px } .PopContent[fr=AddBag]>.Name,.PopContent[fr=AddBag]>.Price { text-align: left; padding-left: 20px; line-height: 17px; width: 100% } .PopContent[fr=BagDelete]>.BtnList { width: 100%; display: flex; flex-direction: column; gap: 16px } .PopContent[fr=AddBag] { width: 100%; padding: 10px 0 0!important } .PopContent[fr=AddBag]>.Name { font-size: 11px } .PopContent[fr=AddBag]>.Price { font-size: 12px; margin-bottom: 18px } .PopContent[fr=AddBag]>.PriceBox { width: 100%; display: flex; flex-direction: column; gap: 4px; position: inherit; padding: 0 20px; margin-bottom: 14px } .PopContent[fr=AddBag]>.PriceBox .OldPrice,.ProductItem .Info .PriceBox .OldPrice { width: fit-content; font-size: 12px; line-height: 17px; position: relative; display: none } .PopContent[fr=AddBag]>.PriceBox .OldPrice:before, .ProductItem .Info .PriceBox .OldPrice:before{ content:""; position: absolute; width: 100%; height: 1px; background: #000; left: 0; top: 7px; } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SalePrice,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SalePrice,.PopContent[fr=AddBag]>.PriceBox .SalePrice,.ProductItem .Info .PriceBox .SalePrice { width: 100%; display: flex; flex-direction: row; font-size: 12px } .PopContent[fr=AddBag]>.PriceBox .SalePrice .Info,.PopContent[fr=mod100Preview] .Products .ProductItem .Info .PriceBox .SalePrice .Info { display: flex; justify-content: flex-start; align-items: center; flex-direction: row; width: initial; padding: 0; height: inherit } .PopContent[fr=AddBag]>.PriceBox:not([OldPrice="0"]) .SalePrice .Info,.ProductItem .Info .PriceBox:not([OldPrice="0"]) .SalePrice .Info { display: flex; justify-content: flex-start; align-items: center; background: #ffeb3b; margin-right: 10px; flex-direction: row; width: fit-content; padding: 0; height: inherit } .PopContent[fr=AddBag]>.PriceBox .SalePrice .Info>.Price { display: flex; justify-content: flex-start; align-items: center; padding: 0x; line-height: 15px } .Page[PageType=View] .Information .InfoBar .Info .PriceBox[DiscountRate="1"] .SalePrice .Info>.Price,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox[DiscountRate="1"] .SalePrice .Info>.Price,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox:not([DiscountRate="0"]) .SalePrice .Info>.Price,.PopContent[fr=AddBag]>.PriceBox:not([OldPrice="0"]) .SalePrice .Info>.Price,.ProductItem .Info .PriceBox:not([OldPrice="0"]) .SalePrice .Info>.Price { padding: 2px 6px 0 } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.DiscountRate,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SalePrice .Info>.DiscountRate,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SalePrice .Info>.DiscountRate,.PopContent[fr=AddBag]>.PriceBox .SalePrice .Info>.DiscountRate,.ProductItem .Info .PriceBox .SalePrice .Info>.DiscountRate { line-height: 15px; padding: 2px 6px 0 0; display: none } .Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .PriceBox .SalePrice>.Info>.DiscountRate:before,.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.DiscountRate:before,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SalePrice .Info>.DiscountRate:before,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SalePrice .Info>.DiscountRate:before,.PopContent[fr=AddBag]>.PriceBox .SalePrice .Info>.DiscountRate:before,.ProductItem .Info .PriceBox .SalePrice .Info>.DiscountRate:before { content: ""; display: flex; border-left: 1px solid #000; height: 10px; width: 1px; margin-top: 2px; padding-right: 4px } .PopContent[fr=AddBag]>.PriceBox .SalePrice .SpecialText,.ProductItem .Info .PriceBox .SalePrice .SpecialText { width: fit-content; border: 1px solid #000; line-height: 14px; padding: 2px 5px 0; cursor: pointer; overflow: hidden; line-height: 12px; height: 17px; } .PopContent[fr=AddBag]>.PriceBox .Campaigns,.ProductItem .Info .PriceBox .Campaigns { width: fit-content; border: 1px solid #000; line-height: 16px; padding: 2px 5px 0; font-size: 12px; min-height: 14px } .PopContent[fr=AddBag]>.PriceBox .Campaigns:empty,.ProductItem .Info .PriceBox .Campaigns:empty { opacity: 0 } .PopContent[fr=AddBag]>.Gallery { width: 100%; display: grid; margin-bottom: 42px } .PopContent[fr=AddBag]>.Gallery .List { overflow: hidden; overflow-x: scroll; width: 100%; display: flex } .PopContent[fr=AddBag]>.Gallery .List::-webkit-scrollbar { height: 2px; background: #fff } .PopContent[fr=AddBag]>.Gallery .List:hover::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=AddBag]>.Gallery .List::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=AddBag]>.Gallery .List .Item { height: 100%; display: inline-block } .PopContent[fr=AddBag]>.Gallery .List .Item>img { width: 90px; display: block } .PopContent[fr=AddBag]>.Title { font-size: 10px; line-height: 14px; width: 100%; margin-top: 20px; margin-bottom: 18px; text-align: center } .PopContent[fr=AddBag]>.Note,.PopContent[fr=AddBag]>.Variations { max-width: 72%; margin: 0 auto 35px; flex-direction: row; gap: 2px 34px; width: 100%; display: flex } .PopContent[fr=AddBag]>.Variations { align-items: center; justify-content: center; flex-wrap: wrap } .PopContent[fr=AddBag]>.Note { align-items: center; justify-content: center; flex-wrap: wrap; color: #727272 } .PopContent[fr=AddBag]>.Variations .SizeItem,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .CheckGroup { display: flex; flex-direction: row; cursor: pointer } .PopContent[fr=AddBag]>.Variations .SizeItem .Size.active,.PopContent[fr=AddBag]>.Variations .SizeItem .Size:hover { font-weight: 900 } .PopContent[fr=AddBag]>.Variations .SizeItem .Size:hover::before { content: ""; display: flex; height: 1px; background: #000; position: absolute; bottom: -5px; width: 60% } .PopContent[fr=AddBag]>.Variations .SizeItem .Size.active::before { content: ""; display: flex; background: #000; position: absolute; bottom: -5px; width: 4px; height: 4px } .PopContent[fr=AddBag]>.Variations .SizeItem .Size { width: 100%; display: flex; margin: 10px 0; position: relative } .PopContent[fr=AddBag]>.Variations .SizeItem[qty="0"] .Size { pointer-events: none; color: #838383 } .PopContent[fr=AddBag]>.Variations .SizeItem .Notification { width: 100%; display: flex; margin: 10px 0 } .PopContent[fr=AddBag]>.Variations .SizeItem .Notification:before { content: ""; width: 13px; height: 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.183' height='9.887' viewBox='0 0 13.183 9.887'%3E%3Cpath id='envelope-sharp-light' d='M.824,66.451l5.768,3.965,5.768-3.965V64.824H.824Zm11.535,1L6.591,71.415.824,67.45v5.613H12.359ZM0,73.063V64H13.183v9.887H0Z' transform='translate(0 -64)'/%3E%3C/svg%3E"); background-size: contain; background-repeat: no-repeat; margin-left: 5px } .PopContent[fr=AddBag]>.Footer { width: 100%; border-top: 1px solid; display: flex; align-items: center; justify-content: center } .PopContent[fr=AddBag]>.Footer>.Btn { width: 50%; line-height: 56px; font-size: 12px } .PopContent[fr=AddBagSuccess] { width: 425px; padding: 60px 24px 0; overflow: auto; height: 100vh } .PopContent[fr=AddBagSuccess]::-webkit-scrollbar { width: 4px; background: #000 } .PopContent[fr=AddBagSuccess]:hover::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=AddBagSuccess]::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=AddBagSuccess] .TabList { width: 100%; display: flex; align-items: center; justify-content: center; margin-bottom: 40px } .PopContent[fr=AddBagSuccess] .TabList .TabItem { width: 33.33%; cursor: pointer; position: relative; text-align: center; padding-bottom: 7px } .PopContent[fr=AddBagSuccess] .TabList .TabItem:hover { opacity: .5 } .PopContent[fr=AddBagSuccess] .TabList .TabItem.active,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox,[Grid=Special] .ProductItem[SubType="1"][data_w="2"],[Grid=Special] .ProductItem[SubType="2"][data_w="1"],[Grid=Special] .ProductItem[SubType="3"] { width: 33.33% } .PopContent[fr=AddBagSuccess] .TabList .TabItem.active::before,[PageType=Bag] .TabList .TabItem.active::before { content: ""; width: 4px; height: 4px; background: #000; display: block; position: absolute; bottom: 0; left: 50%; margin-left: -2.5px } .PopContent[fr=AddBagSuccess] .TabList .TabItem:hover::before,[PageType=Bag] .TabList .TabItem:hover::before { content: ""; width: 5px; height: 5px; margin-left: -2.5px; background: #d5d5d5; display: block; position: absolute; bottom: 0; left: 50% } .PopContent[fr=AddBagSuccess] .TabView { width: 100%; height: 100%; display: none } .AddressForm .Form .Invoice .TypeBoxForm .TabForm.active,.Page[Steps="2"] .BagInformation .Addition .BalanceBar,.PopContent[fr=AddBagSuccess] .TabView.active,.ProductItem.Favorite .Info .Product,.ProductItem.Wait .Info .Product,[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,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Info,[PageType=Payment][Steps="1"] .ContentArea .TabView[T=Address],[PageType=Payment][Steps="2"] .ContentArea .TabView[T=Payment],[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] { display: flex; flex-direction: column } .PopContent[fr=AddBagSuccess] .TabView .Empty { width: 100%; margin: 75px 0 20px; display: flex; flex-direction: column; justify-content: center; align-items: center } .PopContent[fr=AddBagSuccess] .TabView .Empty .Title { display: flex; line-height: 17px; margin-bottom: 17px } .PopContent[fr=AddBagSuccess] .TabView .Empty .Text { width: 100%; display: flex; margin-bottom: 42px; justify-content: center } .PopContent[fr=AddBagSuccess] .TabView .Empty .Btn { width: 100%; margin: 0; display: flex; text-align: center; align-items: center; justify-content: center } .PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product { width: 100%; margin: 40px 0 20px; display: flex } .PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Photo { width: 74px; flex: none; margin-right: 10px; display: block } .PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .Name,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .Name { width: 100%; font-size: 11px; line-height: 16px } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .OldPrice,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .OldPrice,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .OldPrice { width:fit-content; font-size: 12px; line-height: 17px; height: 17px; position: relative; display: none } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .OldPrice:before, .PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .OldPrice:before, .PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .OldPrice:before{ content:""; display: block; width: 100%; height: 1px; background: #000; position: absolute; top: 7px; left: 0px; } .PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox:not([DiscountRate="0"]) .SalePrice .Info { display: flex; justify-content: flex-start; background: #ffeb3b; margin-right: 10px; width: auto; align-items: flex-start; flex-direction: row } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.Price,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SalePrice .Info>.Price,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SalePrice .Info>.Price { display: flex; justify-content: flex-start; align-items: center; padding: 0; line-height: 17px; height: 17px } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .Info>.Price>span,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SalePrice .Info>.Price>span,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SalePrice .Info>.Price>span { margin-left: 3px } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SalePrice .SpecialText,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SalePrice .SpecialText,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SalePrice .SpecialText { width: fit-content; border: 1px solid #000; line-height: 20px; padding: 2px 5px 0 } .PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .Campaigns { width: max-content; border: 1px solid #000; line-height: 16px; padding: 2px 5px 0; font-size: 12px; margin-top: 3px } .PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .Campaigns,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SpecialText,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SpecialText { width: fit-content; border: 1px solid #000; line-height: 16px; padding: 2px 5px 0; font-size: 12px; opacity: 0 } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText:not(:empty),.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox .SpecialText:not(:empty),.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .PriceBox .SpecialText:not(:empty) { display: block; opacity: 1 } .PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .Variation,.PopContent[fr=AddBagSuccess] .TabView[T=Add] .Product .Info .Variation { display: block; opacity: 1; margin-top: auto } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .CargoStatus { width: 100%; margin-top: 10px; background: #f0f0f0; display: flex; padding: 9px; align-items: center; margin-bottom: 12px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .CargoStatus>svg { width: 30px; margin-right: 5px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .CargoStatus>span { width: 100%; font-weight: 100 } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .CargoStatus>span>strong,[PageType=Account] .ViewTab[T="#siparislerim"] .Text>span>strong { font-weight: 100 } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition { width: 100%; margin-top: auto; position: sticky; bottom: 0; background: #fff; padding: 10px 0 16px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items { width: 100%; margin-bottom: 5px; color: #262626 } .BagInformation .Addition .Items .Item,.MobileAddition .Content .Addition .Item,.Page[PageType=Success]>.Container .OrderDetail .Addition .Item,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item { width: 100%; display: flex; align-items: center; justify-content: space-between; line-height: 17px; margin-bottom: 3px } .BagInformation .Addition .Items .Item[PageLoad="1"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item[PageLoad="1"] { width: 100%; display: flex; align-items: center; justify-content: space-between; height: 17px; margin-bottom: 5px } .BagInformation .Addition .Items .Item>span:nth-child(2),.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item>span:nth-child(2),[fr=OrderDetail] .Addition>.Item>span:first-child,[fr=OrderDetail] .Addition>.Item>span:nth-child(2) { line-height: 17px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item.Grand { width: 100%; margin-top: 10px } .BagInformation .Addition .Items .Item.Grand>span:first-child,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Items .Item.Grand>span:first-child { text-transform: math-auto } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition .Btn,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Viewer .Item img { display: block; width: 100% } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts,.PopContent[fr=AddBagSuccess] .TabView[T=Favorite] .ProductList { display: flex; flex-direction: column; width: 100%; padding-right: 5px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts::-webkit-scrollbar { width: 2px; background: #fff } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts:hover::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=AddBagSuccess] .TabView[T=Favorite] .ProductList::-webkit-scrollbar { width: 2px; background: #fff } .PopContent[fr=AddBagSuccess] .TabView[T=Favorite] .ProductList:hover::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=AddBagSuccess] .TabView[T=Favorite] .ProductList::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Photo { width: 74px; flex: none; margin-right: 10px } .Page[PageType=View] .Information .InfoBar .Info .PriceBox:not([DiscountRate="0"]) .SalePrice .Info,.PopContent[fr=AddBagSuccess] .TabView .Preview .List .Product .Info .PriceBox[DiscountRate="1"] .SalePrice .Info { display: flex; justify-content: flex-start; align-items: center; background: #ffeb3b; margin-right: 10px; width: auto } .PopContent[fr=AddBagSuccess] .Preview,.PopContent[fr=StockNotificationForm] .Preview { width: 100%; margin-top: 20px } .PopContent[fr=AddBagSuccess] .Preview .Title { width: 100%; margin: 20px 0 } .PopContent[fr=AddBagSuccess] .List { width: 100%; display: block; padding-right: 5px; flex-wrap: wrap; gap: 8px; } .PopContent[fr=AddBagSuccess] .List::-webkit-scrollbar { width: 2px; background: #b2b2b2 } .PopContent[fr=AddBagSuccess] .List::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=AddBagSuccess] .List::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=SaveMember] { width: 100%; padding: 70px 40px 36px } .PopContent[fr=SaveMember]>.Title,.PopContent[fr=StockNotificationForm]>.Title { width: 100%; margin-bottom: 16px } .PopContent[fr=SaveMember]>.Form { width: 100%; display: flex; flex-direction: column; overflow: auto; padding: 0 15px 0 1px } .PopContent[fr=SaveMember]>.Form::-webkit-scrollbar { height: 1px; background: #000; width: 1px; background: #0000001f } .PopContent[fr=SaveMember]>.Form::-webkit-scrollbar-thumb { height: 1px; border-radius: 2px; background: #000 } .PopContent[fr=SaveMember]>.Form .BtnList,.PopContent[fr=StockNotificationForm]>.Form .BtnList { width: 100%; display: flex; margin: 40px 0 30px } .PopContent[fr=SaveMember]>.Form .Contract { display: flex; margin-top: 20px; align-content: flex-start; align-items: flex-start; cursor: pointer } .PopContent[fr=SaveMember]>.Form .Contract .Text { display: flex; margin: -1px 0 0; padding: 0 } .PopContent[fr=SaveMember]>.Form .Contract .Text>span,.PopContent[fr=StockNotificationForm]>.Form .Contract .Text>span { font-weight: 500; cursor: pointer } .PopContent[fr=SaveMember]>.Form .Check,.PopContent[fr=StockNotificationForm]>.Form .Check { display: flex; width: 11px; height: 11px; justify-content: center; position: relative; align-items: center; margin-right: 8px; flex: none } .PopContent[fr=SaveMember]>.Form .Check+div { margin-top: 3px; margin-bottom: -1px } .PopContent[fr=SaveMember]>.Form .Check::before,.PopContent[fr=StockNotificationForm]>.Form .Check::before { content: ""; width: 11px; height: 11px; border: 1px solid #000; flex: none } .PopContent[fr=SaveMember]>.Form .Check.active::after,.PopContent[fr=StockNotificationForm]>.Form .Check.active::after { content: ""; width: 5px; height: 5px; background: #000; position: absolute; left: 3px; top: 3px; flex: none } .PopContent[fr=StockNotificationForm] { width: 100%; padding: 50px 16px 36px } .PopContent[fr=StockNotificationForm]>.Text { width: 100%; font-size: 13px; line-height: 19px; margin-bottom: 16px } .PopContent[fr=StockNotificationForm] .Preview .Title { width: 100%; margin: 20px 0; text-transform: uppercase } .PopContent[fr=StockNotificationForm] .Preview .List { width: 100%; display: block; padding-right: 5px; overflow: auto } .PopContent[fr=StockNotificationForm] .Preview .List::-webkit-scrollbar { width: 2px; background: #b2b2b2 } .PopContent[fr=StockNotificationForm] .Preview .List::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=StockNotificationForm] .Preview .List::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=AddBagSuccess] .List .ProductItem,.PopContent[fr=StockNotificationForm] .Preview .List .ProductItem { width: calc(50% - 10px); height: initial; display: inline-block; margin: 4px 4px; } .PopContent .Preview .List .ProductItem .Info .PriceBox .SalePrice { display: flex; flex-direction: column; gap: 5px } .PopContent[fr=AddBankAccount],.PopContent[fr=BalancePayment] { width: 100%; padding: 30px 0 0 } .PopContent[fr=AddBankAccount] .Title,.PopContent[fr=BalancePayment] .Title { width: 100%; text-align: center; font-weight: 500; margin-bottom: 18px } .PopContent[fr=AddBankAccount] .Text,.PopContent[fr=BalancePayment] .Text { width: 100%; text-align: center; margin-bottom: 20px } .PopContent[fr=AddBankAccount] .Form { width: 100%; margin: 15px 0; display: block } .PopContent[fr=AddBankAccount] .BtnList { width: 100%; display: flex; gap: 12px; flex-direction: column } .PopContent[fr=BalancePayment] .Info { width: 100%; background: #fff7f7; color: #ef0000; padding: 20px 0; text-align: center; display: none } .PopContent[fr=BalancePayment] .Form { width: 100%; margin: 15px 0; display: none } .PopContent[fr=BalancePayment] .BtnList { width: 100%; gap: 12px; flex-direction: column; display: none } .PopContent[fr=BalancePayment] .BankList { width: 100%; display: flex; flex-direction: column; overflow: auto; max-height: 300px; padding-right: 7px } .PopContent[fr=BalancePayment] .BankList::-webkit-scrollbar { width: 2px; background: #b2b2b2 } .PopContent[fr=BalancePayment] .BankList::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=BalancePayment] .BankList::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=BalancePayment] .Btn[fr=accountList],.PopContent[fr=BalancePayment] .Btn[fr=newAccount] { width: 100%; text-align: left; text-decoration: underline } .PopContent[fr=BalancePayment] .BankList [fr=selectedAccount] { width: 100%; display: flex; align-items: flex-start; justify-content: space-between; border: 1px solid #ccc; border-left: 0; border-right: 0; padding: 16px 0; margin-bottom: -1px; cursor: pointer } .PopContent[fr=BalancePayment] .BankList [fr=selectedAccount]>div:first-child { font-size: 10px; text-transform: uppercase; max-width: 30% } .PopContent[fr=BalancePayment] .BankList [fr=selectedAccount]>div:nth-child(2) { display: flex; flex-direction: column; align-items: flex-end } .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 } .FilterBarBottom>.Left .FilterBox .FilterItem>.Item,[PageType=List] .FilterBar .FilterBarTop .FastNav>.Item { border: 1px solid #707070; padding: 10px 12px 9px; text-transform: uppercase } [PageType=List] .FilterBar { width: 100%; background: #ffffffe8; border-bottom: 1px solid #000; padding-top: 50px; padding-bottom: 24px; min-height: 110px; position: sticky; top: 50px; z-index: 2; transition: .3s; overflow: hidden } body.activeFilter [PageType=List] .FilterBar { overflow: visible } [PageType=List] .FilterBar>.Container { padding: 0 80px; display: flex; flex-direction: column } [PageType=List] .FilterBar .FilterBarTop { width: 100%; margin-bottom: 20px; transition: bottom .4s,opacity .2s; opacity: 1; position: relative; bottom: -125px } [PageType=List] .FilterBar .FilterBarTop .FastNav { width: 100%; display: flex; gap: 12px } .FilterBarBottom { width: 100%; display: flex; justify-content: space-between; align-items: center; transition: bottom .8s,opacity .4s; opacity: 1; position: relative; bottom: -110px } .FilterBarBottom>.Left .FilterBox { width: 100%; display: flex; gap: 12px; position: relative } .FilterBarBottom>.Left .FilterBox .FilterItem.Disabled .Item{ pointer-events:none; border-color:#ccc; color: #a7a7a7; } .FilterBarBottom>.Left .FilterBox .FilterItem>.Item { cursor: pointer } .FilterBarBottom>.Left .FilterBox .FilterItem.show>.Item { font-weight: 500; border-color: #000 } .FilterBarBottom>.Left .FilterBox .FilterItem:not([Q="0"])>.Item>span,.module-login .right-siderbar .siderbar-container .popUp-center-pic .popUp-picture img { display: inline-block } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind { border: 1px solid #b2b2b2; position: absolute; top: 100%; left: 0; background: #fff; width: 540px; margin-top: 15px; display: none } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List { text-transform: uppercase; display: flex; flex-wrap: wrap; overflow: auto; box-sizing: content-box } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div { display: flex; padding: 25px 40px 20px; width: 100%; flex-direction: column } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div .Info { display: flex; flex-direction: row; width: 100%; justify-content: space-between } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div .Info>span:first-child,.FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div .Info>span:nth-child(2) { display: flex; flex-direction: column; font-weight: 500; font-size: 13px } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice { width: 100%; height: 33px; border: 0; background: 0 0 } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice::before { content: ""; position: absolute; height: 1px; background: #ccc; width: 100%; top: 16px } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice>div { background: #000; border: 0; height: 1px; box-shadow: none; top: 16px } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice>span { border: 0; width: 8px; height: 8px; border-radius: 100%; background: #000; top: 11.6px; box-shadow: none } .FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice>span.ui-state-active,.FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice>span.ui-state-focus,.FilterBarBottom>.Left .FilterBox .FilterItem[F=Price]>.FilterWind .List>div #CategoryFilterPrice>span.ui-state-hover { cursor: move; box-shadow: none; text-shadow: none; border: 0; filter: none; outline: 0 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List::-webkit-scrollbar { width: 2px; background: #b2b2b2 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List::-webkit-scrollbar-thumb:hover { background: #555 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item { padding: 17px 12px; text-transform: uppercase; width: 20%; display: flex; flex-direction: column; align-items: center; border-right: 1px solid #000; border-bottom: 1px solid #000; cursor: pointer } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item:nth-child(+5n),.FilterBarBottom>.Left .FilterBox .FilterItem[F=colors]>.FilterWind .List>.Item:nth-child(+4n),.FilterBarBottom>.Left .FilterBox .FilterItem[F=sizes]>.FilterWind .List>.Item:nth-child(+5n) { border-right: 0 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item.active { font-weight: 600; background: #ebebeb; color: #000000; } .FilterBarBottom>.Left .FilterBox .FilterItem[F=colors]>.FilterWind .List>.Item:nth-child(+5n),.FilterBarBottom>.Left .FilterBox .FilterItem[F=sizes]>.FilterWind .List>.Item:nth-child(+4n) { border-right: 1px solid #000 } .FilterBarBottom>.Left .FilterBox .FilterItem[F=sizes]>.FilterWind .List>.Item,[Grid="5"] .ProductItem,[Grid=Special] .ProductItem[SubType="3"][data_w="2"],[Grid=Special] .ProductItem[SubType="4"][data_w="1"],[Grid=Special] .ProductItem[SubType="5"] { width: 20% } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item .Color { width: 24px; height: 24px; display: block; border: 1px solid #dbdbdb } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item.active .Color,.modLogin_container_right_area_tab_box_item.active { border: 1px solid #000 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item .Name { text-align: center; text-transform: uppercase; padding: 9px 0 0; font-size: 13px } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .BtnList { display: flex; flex-direction: row; border-top: 1px solid #000; padding-top: 10px; margin-top: -1px } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .BtnList>.Btn { line-height: 48px; border-top: 1px solid } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .BtnList>.Btn:first-child { border-right: 1px solid #b2b2b2 } .FilterBarBottom>.Right,[Grid="201"] .ProductItem:nth-child(3n+1)>div,[Grid="201f"] .ProductItem:nth-child(3n+1)>div,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .Title>div.Btn,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Extra,[PageType=Payment] .InstallmentBox .PosList .PosItem img+span { margin-left: auto } .FilterBarBottom>.Right .FilterGrid { width: 100%; display: flex; justify-content: flex-end; align-items: center; padding: 8px; } .FilterBarBottom>.Right .FilterGrid>div { display: none; align-items: center; justify-content: center; font-size: 0; cursor: pointer } .FilterBarBottom>.Right .FilterGrid>div[G="1"]::before { content: ""; display: flex; background: url(/NewWebSites/img/list_grid_special.svg); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="1122"]::before{ content: ""; display: flex; background: url(/NewWebSites/img/grid/line/1v2.svg?v23); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="102"]::before{ content: ""; display: flex; background: url(/NewWebSites/img/grid/line/1v2.svg?v23); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="2"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/1v2.svg?v23); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="201"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/2v1.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="3"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/3.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="302"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/3v2.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="4"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/4.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="5"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/5.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="6"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/6.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G="12"]::before { content: ""; display: flex; background: url(/NewWebSites/img/grid/line/12.svg?v3); width: 17px; height: 14px } .FilterBarBottom>.Right .FilterGrid>div[G=Special]::before { content: ""; display: flex; background: url(/NewWebSites/img/list_grid_special.svg); width: 14px; height: 14px } body.ScrollMoved [PageType=List] .FilterBar,body.ScrollMoved[Page=List] section[L=Head] { background: 0 0; transition: .3s } body.ScrollUp [PageType=List] .FilterBar,body.ScrollUp[Page=List] section[L=Head] { background: #fff; transition: .3s } body.Scroll800 [PageType=List] .FilterBar { top: -170px; transition: .3s } body.ScrollUp [PageType=List] .FilterBar { top: 50px; transition: .3s } body.HeaderHover [PageType=List] .FilterBar,body.HeaderHover section[L=Head] { background: #ffffffe8!important; transition: .3s } [PageType=List] .Empty { width: 100%; display: flex; align-items: center; justify-content: flex-start; flex-direction: column; padding: 150px 0 30px; opacity: 0; transition: .3s; } [PageType=List] .Empty>.Text { width: 100%; font-weight: 200; font-size: 12px; } [PageType=List] .Empty>.Name { width: 100%; text-align: center; } [PageType=List] .CategoryName { width: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 90px 0 30px; opacity: 0; transition: .3s } [PageType=List] .CategoryName>.Name { font-size: 13px; font-weight: 100 } [PageType=List] .CategoryName>.Breadcrumbs { display: flex; align-items: center; gap: 4px; color: #aaa; margin: 5px 0; font-size: 10px } [PageType=List] .CategoryName>.Breadcrumbs>span { font-size: 10px } [PageType=List] .ProductList { width: 100%; display: flex; flex-wrap: wrap; opacity: 0; position: relative; bottom: -180px; z-index: 1; min-height: 600px; } [PageType=List].List.Type0 { width: 100%; display: flex; flex-wrap: wrap; position: relative; z-index: 1 } [PageType=List] .List[Grap="0"],[PageType=List] .ProductList { gap: 0 } .Page.Load[PageType=List] .FilterBar .FilterBarTop { animation: .4s cubic-bezier(.22,.61,.36,1) .1s forwards an_filterBarTop } .Page.Load[PageType=List] .FilterBar .FilterBarBottom { animation: .9s .4s forwards an_filterBarBottom } .Page.Load[PageType=List] .ProductList { animation: .8s 1.2s forwards an_productList } [PageType=List] .CategoryTextBox { width: 100%; display: flex; justify-content: center; padding: 0 16%; flex-direction: column; margin: 20px 0 60px } [PageType=List] .CategoryTextBox .CategoryTextBoxTitle { width: 100%; margin-bottom: 18px; text-align: center } [PageType=List] .CategoryTextBox .CategoryTextBoxText { max-height: 57px; text-align: center; overflow: hidden } [PageType=List] .CategoryTextBox.show .CategoryTextBoxText { max-height: 2500px } [PageType=List] .CategoryTextBox .CategoryTextMore { margin-top: 10px; text-decoration: underline; cursor: pointer; display: flex; align-items: center; justify-content: center } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors .ColorItem.active,.modLogin_container_right_area_form_box_social_contract01 strong,.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,[PageType=List] .CategoryTextBox .CategoryTextMore svg { 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 } } [PageType=Bag]>.Container { width: 100%; max-width: 950px; margin: 0 auto 70px } [PageType=Bag] .TabList { width: 100%; display: flex; align-items: center; justify-content: center; margin: 30px 0 50px } [PageType=Bag] .TabList .TabItem { width: 100%; text-align: center; line-height: 30px; position: relative; cursor: pointer; font-size: 12px; color: #000 } [PageType=Bag] .TabList .TabItem>span { margin-left: 5px } [PageType=Bag] .TabView { width: 100%; display: none; align-items: flex-start } .Page.Load+.ProductOtherViewContainer,[PageType=Bag].Load .ProductOtherViewContainer { opacity: 1; top: 0; transition: .4s } [PageType=Bag] .TabView .ProductList { display: flex; flex-direction: column; width: 100%; max-width: 610px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag { display: flex; flex-direction: row; width: 100%; border-bottom: 1px solid #b2b2b2; margin-bottom: 24px; padding-bottom: 24px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag:last-child { border-bottom: 0 } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Gallery { width: 72px; margin-right: 20px; flex: none } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info { width: 100%; position: relative; padding: 0; height: inherit } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Code { color: #888; font-size: 11px; line-height: 15px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties { width: 100%; display: flex; align-items: center; justify-content: space-between; margin-top: 30px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .QuantityBar { width: 100%; display: flex; align-items: center; justify-content: flex-start; gap: 20px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .QuantityBar .Quantity { display: flex; align-items: center; justify-content: flex-start; gap: 12px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .QuantityBar .Quantity select { border: 1px solid #000; line-height: 22px; padding: 1px 4px; cursor: pointer; outline: 0; background: #fff } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .QuantityBar .Variation { align-items: center; justify-content: flex-start; gap: 12px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .Social { width: 100%; display: flex; align-items: center; justify-content: flex-end; gap: 22px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social .Favorite,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social .RemoveBag,[PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .Social .Favorite,[PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .Social .RemoveBag { cursor: pointer; display: block } .Page[PageType=View] .Information .InfoBar .Info .Name .Favorite:before,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social .Favorite:before,.ProductItem .Gallery .VariationBar .Favorite:before,.ProductItem.Wait .Info .Properties .Btn.Favorite:before,[PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .Social .Favorite:before { content: ""; display: flex; background: url(/NewWebSites/img/icon_favorite.svg); width: 10px; height: 14px } .Page[PageType=View] .Information .InfoBar .Info .Name .Favorite.active:before,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social .Favorite.active:before,.ProductItem .Gallery .VariationBar .Favorite.active:before,.ProductItem.Wait .Info .Properties .Btn.Favorite.active:before,[PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .Social .Favorite.active:before { content: ""; display: flex; background: url(/NewWebSites/img/icon_favorite_activ.svg) 0 0/11px; width: 10px; height: 14px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social .RemoveBag:before,[PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .Properties .Social .RemoveBag:before { content: ""; display: flex; background: url(/NewWebSites/img/icon_trash.svg); width: 15px; height: 15px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .PriceBox { position: absolute; right: 0; width: initial; display: flex; align-items: flex-end; flex-direction: column; align-content: flex-end } [PageType=Bag] .TabView .ProductList .ProductItem.Bag .Info .PriceBox .OldPrice { width: initial } [PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Gallery { height: 117px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Info .Name { height: 15px; margin-bottom: 4px } .Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Product>.Code[pageload="1"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product>.Code[pageload="1"],.ProductItem.Favorite .Info .Product>.Code[pageload="1"],.ProductItem.Wait .Info .Product>.Code[pageload="1"],[PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Info .Code,[PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Info .PriceBox,[fr=OrderDetail] .ProductList .ProductItem .Info .Product>.Code[pageload="1"] { height: 15px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Properties .Quantity div { height: 14px; width: 37px } .module-login .signUp-middle-section .product-item img,[PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Properties .Quantity div:nth-child(2) { height: 30px } [PageType=Bag] .TabView .ProductList .ProductItem.Bag.ItemEmpty .Social div { height: 14px; width: 10px } @media only screen and (max-width: 991px) { [PageType=Bag] .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar { padding:14px 10px 16px 7px } [PageType=Bag] .OtherProductView .ProductItem { width: 50% } } .BagInformation { width: 300px; margin-left: 40px; flex: none; display: flex; flex-direction: column; position: sticky; top: 100px; margin-top: 12px } .BagInformation .Addition .Title { width: 100%; margin-bottom: 14px } .BagInformation .Addition .BalanceBar { border: 1px solid red; padding: 16px; margin-bottom: 20px; background: #fcfcfc; display: none } .BagInformation .Addition .BalanceBar.active { border: 1px solid #4caf50 } .BagInformation .Addition .BalanceBar .Text { display: flex; flex-direction: column; gap: 13px } .BagInformation .Addition .BalanceBar .Text span,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Bank { text-transform: uppercase } .BagInformation .Addition .BalanceBar .Text span:last-child { text-transform: none; font-weight: 500 } .BagInformation .Addition .BalanceBar .Btn,.PopContent[fr=PaymentAccountForm] .Btn { margin-top: 20px } .BagInformation .Addition .Items { width: 100%; margin-bottom: 26px; color: #262626 } .BagInformation .Addition .Items .Item.Products { width: 100%; display: none; flex-direction: column } .BagInformation .Addition .Items .Item.Products>.Info { width: 100%; display: flex; align-items: center; justify-content: space-between; cursor: pointer; margin-bottom: 32px } .BagInformation .Addition .Items .Item.Products .Arrow>svg { transition: .2s } .BagInformation .Addition .Items .Item.Products.show .Arrow>svg { transform: rotate(180deg); transition: .2s } .BagInformation .Addition .Items .Item.Products>.Wind { width: 100%; display: none; gap: 12px; flex-direction: column; max-height: 300px; overflow: auto; padding-right: 2px; margin-bottom: 30px } .BagInformation .Addition .Items .Item.Products>.Wind::-webkit-scrollbar { height: 1px; background: #000; width: 1px; background: #0000001f } .BagInformation .Addition .Items .Item.Products>.Wind::-webkit-scrollbar-thumb { height: 1px; border-radius: 2px; background: #000 } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem { width: 100%; display: flex; margin-bottom: 31px } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Gallery { width: 31px; height: inherit; flex: none; margin-right: 10px } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info { height: inherit; width: 100%; padding: 0; color: #000 } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .Color { margin-top: 0 } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .PriceBox { position: absolute; right: 0; top: 0; display: flex; flex-direction: column; align-items: flex-end; align-content: flex-end } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .PriceBox .OldPrice { width: inherit; text-align: right; font-size: 11px } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .PriceBox .SalePrice { width: inherit; text-align: right; display: flex; justify-content: flex-end } .BagInformation .Addition .Items .Item.Products>.Wind .ProductItem .Info .PriceBox .SalePrice>.Info { width: auto; text-align: right; display: flex; justify-content: flex-end; margin: 0; font-size: 11px } .BagInformation .Addition .Items .Item.Grand { width: 100%; margin-top: 10px; display: flex } .BagInformation .CargoStatus { width: 100%; background: #f0f0f0; padding: 12px; margin: 16px 0; display: flex; gap: 12px; align-items: center } .BagInformation .CargoStatus>svg { width: 18px; flex: none } .BagInformation .CargoStatus>span { width: 100%; color: #262626; line-height: 15px } .BagInformation .CouponBox { width: 100%; display: flex; flex-direction: column; margin-top: 10px; position: relative; transition: .3s; top: 150px; opacity: 0 } .Page.Load .BagInformation .CouponBox { top: 0; opacity: 1; transition: .3s } .BagInformation .CouponBox .Inputs { width: 100%; display: flex; justify-content: center; gap: 12px } .BagInformation .CouponBox .Info { width: 100%; text-align: left; line-height: 20px; color: #186e1b; text-transform: uppercase; font-size: 9px } .BagInformation .CouponBox .Inputs input { width: 100%; height: 100%; border: 1px solid #ccc; padding: 6px; outline: 0; font-family: sans-serif; text-transform: uppercase; font-weight: 100; letter-spacing: .4px } [PageType=Payment] .PaymentTabList { width: 100%; border-bottom: 1px solid #444; display: flex; align-items: center; justify-content: center; padding-top: 12px } [PageType=Payment] .PaymentTabList .TabItem { border-bottom: 2px solid transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 130px; opacity: .4; cursor: pointer } [PageType=Payment] .PaymentTabList .TabItem>div:first-child { width: 14px; background: #000; height: 14px; display: flex; color: #fff; align-items: center; justify-content: center; font-size: 10px } [PageType=Payment] .PaymentTabList .TabItem>div:nth-child(2) { text-align: center; line-height: 33px } [PageType=Payment] .ContentArea { width: 100%; margin: 26px 0; position: absolute; top: 500px; opacity: 0; transition: .3s; padding-bottom: 100px } [PageType=Payment].Load .ContentArea { top: 137px; opacity: 1; transition: .3s } [PageType=Payment] .ContentArea .TabView { width: 100%; display: none; position: relative; z-index: 1 } [PageType=Payment] .ContentArea .TabView>.Container { width: 100%; max-width: 790px; margin: 0 auto; display: flex } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .Title,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .Title { width: 100%; display: flex; align-items: center; justify-content: space-between; flex-direction: row } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .Title>div { font-weight: 500; width: initial; line-height: 34px } [PageType=Payment][Steps="1"] .PaymentTabList .TabItem[T=Address],[PageType=Payment][Steps="2"] .PaymentTabList .TabItem[T=Payment],[PageType=Payment][Steps="3"] .PaymentTabList .TabItem[T=Success] { border-bottom: 2px solid; opacity: 1 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box { width: 100%; margin-bottom: 32px; max-width: 434px } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box .Item .Arrow { position: absolute; right: 23px; top: 50%; margin-top: -6px } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box .Item .Arrow>svg { transform: rotate(270deg) } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info { width: 100%; border: 1px solid #a9a9a9 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Delivered { width: 100%; padding: 18px 18px 0 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Date { width: 100%; padding: 6px 18px 0; color: #2d44ab } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Cargo { width: 100%; padding: 3px 18px 0; color: #5c5c5c } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Cargo strong { color: #000; font-weight: 500 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Quantity { width: 100%; padding: 8px 18px; display: flex; align-items: center; gap: 3px; color: #5c5c5c } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Viewer { width: 100%; display: block; overflow: hidden; border-top: 1px solid #a9a9a9 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Viewer .Item { position: relative; display: inline-block; border-right: 1px solid #a9a9a9 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Info .Viewer .Item span { position: absolute; bottom: 0; left: 0; background: #fff; width: 16px; height: 16px; font-size: 11px; text-align: center; display: flex; align-items: center; justify-content: center } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Address .Item .Info,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Payment .Item .Info { width: 100%; cursor: pointer; border: 1px solid #a9a9a9; padding: 18px; display: flex; flex-direction: column; gap: 4px; margin-top: 9px } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem.active,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem.active,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Address .Item .Info:hover,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Payment .Item .Info:hover { border-color: #000 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Address .Item .Info .Name,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Payment .Item .Info .Name { width: 100%; font-weight: 500 } [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Address .Item .Info .Address,[PageType=Payment][Steps="3"] .ContentArea .TabView[T=Preview] .Box.Payment .Item .Info .Address { width: 100%; color: #797979; line-height: 16px } .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 } .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,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Info .Name,[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,.modLogin_container_right_area_form_box_input_content_checkgroup { 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[fr=mod100Preview] .Products .ProductItem>div,.ProductItem .Info .InfoBar02,[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,.PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors .ColorItem .Name,.modLogin_container_right_area_form_box_social_contract02,.modLogin_container_right_area_tab_view,[PageType=Account] .RightArea .ViewTab { width: 100%; display: none } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem { width: 100%; border: 1px solid #a3a3a3; padding: 16px; position: relative; display: flex; margin-bottom: 16px; align-items: center } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem[PageLoad="1"] { width: 100%; height: 75px; border: 0; padding: 0; position: relative; display: flex } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Check,[PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Check,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Check { display: flex; width: 14px; height: 14px; justify-content: center; position: relative; align-items: center; margin-right: 14px; flex: none; cursor: pointer } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Info { width: 100%; display: flex; flex-direction: column; cursor: pointer } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Info .Name { width: 100%; font-weight: 500; line-height: 16px; margin-bottom: 2px } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Info .Address,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Info .Phone { width: 100%; line-height: 18px } [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Btn { position: absolute; right: 16px; top: 16px; width: initial; font-size: 12px; line-height: 18px; text-decoration: underline; font-weight: 500; cursor: pointer } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .Title>div { font-weight: 500; line-height: 34px; width: initial } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem { width: 100%; margin-bottom: 16px; border: 1px solid #a3a3a3; padding: 16px; position: relative; display: flex; align-items: center } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem[PageLoad="1"] { width: 100%; height: 60px; border: 0; padding: 0; position: relative; display: flex } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Info { display: flex; flex-direction: column; cursor: pointer } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Info .Name { width: 100%; font-weight: 500; line-height: 16px; margin-bottom: 3px } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .OldPrice { text-align: right; margin-left: auto; width: auto; text-decoration: line-through; display: none; } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem[data-price="0"] .OldPrice { display: flex; } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem .Price { text-align: right; margin-left: 10px; width: auto; color: #2D44AB; } [PageType=Payment] .ContentArea .TabView .ContentLeft .CargoBar .List .CargoItem:not([data-price="0"]) .Price { margin-left: auto; } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .Title>div { width: 100%; font-weight: 500; line-height: 34px } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem { width: 100%; border: 1px solid #a3a3a3; padding: 16px; position: relative; display: flex; margin-bottom: 16px; align-items: center; cursor: pointer } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem.active { border-color: #000; margin-bottom: 0; display: flex } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem .Info .Desc { width: 100%; font-size: 12px; color: #717171; line-height: 9px } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView { width: 100%; padding: 8px 0 32px; display: none } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayItem.active+.PayView { display: block; border: 1px solid #000; padding: 16px; margin-bottom: 16px; border-top: 0 } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor { width: 100%; display: flex; margin: 12px 0 0; flex-direction: column } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .Title { width: 100%; display: flex; margin: 0 0 12px } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .InputGroup { display: flex; flex-direction: row; margin: 0; gap: 32px } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .CheckGroup .Check { display: flex; width: 14px; height: 14px; justify-content: center; position: relative; align-items: center; margin-right: 10px; flex: none; cursor: pointer } [PageType=Account] .OrderItem>.Area .InfoBar .Content .Info .Date,[PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .PaymentDoor .CheckGroup .Text { width: 100%; font-size: 11px; line-height: 15px } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount { width: 100%; display: flex; margin: 12px 0 0 } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Info { margin-left: auto; display: flex; flex-direction: column; align-content: flex-end } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Info .Item { width: 100%; display: flex; justify-content: flex-end; margin-bottom: 6px } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList .List .PayView .BankAccount .Info .Item span:nth-child(2) { margin-left: 10px; cursor: pointer } [PageType=Payment] .InstallmentArea { display: flex; align-items: center; line-height: 20px; margin: 0 0 10px; flex-direction: column } [PageType=Payment] .InstallmentArea>.Title { display: flex; align-items: center; line-height: 20px; margin: 20px 0 10px; flex-direction: column } [PageType=Payment] .InstallmentArea>.Title>span { background: #efefef; padding: 0 7px; font-size: 11px } [PageType=Payment] .InstallmentBox { display: flex; flex-direction: column; width: 100%; margin-top: 14px } [PageType=Payment] .InstallmentBox .PosList { display: flex; gap: 12px; overflow: hidden; flex-direction: row; position: relative; align-content: space-around } [PageType=Payment] .InstallmentBox .PosList>.List { display: flex; align-items: center; gap: 12px; overflow-y: auto; padding: 8px 0 } [PageType=Payment] .InstallmentBox .PosList>.List::-webkit-scrollbar { height: 2px; background: #000; width: 1px; background: #0000001f } [PageType=Payment] .InstallmentBox .PosList>.List::-webkit-scrollbar-thumb { height: 1px; border-radius: 2px; background: #000 } [PageType=Payment] .InstallmentBox .PosList .PosItem { width: 100%; display: flex; cursor: pointer; padding: 0; justify-content: space-between; align-items: flex-end } [PageType=Payment] .InstallmentBox .PosList .PosItem img { display: flex; height: 20px } [PageType=Payment] .InstallmentBox .PosView.active { display: block; border: 1px solid #000 } .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 } .Page[PageType=View]>.Container { width: 100%; display: flex; justify-content: flex-end } .Page[PageType=View]>.ShadowImageLogo { z-index: 11; position: fixed; top: 50%; left: 50px; transition: .3s } body[Page=View].Scroll500 .ShadowImageLogo { opacity: 0!important; transition: .3s } .Page[PageType=View]>.ShadowImageLogo>div>svg { height: 40px; fill: #000000 } .Page[PageType=View]>.ShadowImageLogo>div:first-child,.Page[PageType=View]>.ShadowImageLogo>div:nth-child(2) { width: 100%; position: absolute; top: 0 } .Page[PageType=View] .GalleryBar { width: 768px; position: relative; } .Page[PageType=View] .GalleryBar .List{ height: calc( 100vh - 0px) !important; } .Page[PageType=View] .GalleryBar>.List,.PopContent[fr=mod100Preview] .Products { width: 100%; display: flex; flex-direction: column; overflow: auto; } .Page[PageType=View] .GalleryBar>.List::-webkit-scrollbar { height: 2px; background: #000; width: 1px; background: #0000001f } .Page[PageType=View] .GalleryBar>.List::-webkit-scrollbar-thumb { height: 1px; border-radius: 2px; background: #000 } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .Campaigns,.Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText { width: fit-content; border: 1px solid #000; line-height: 16px; padding: 2px 5px 0; font-size: 12px } .Page[PageType=View] .Information { width: 768px; flex: none } .Page[PageType=View] .Information .Content { width: 328px; margin: 75px auto 0 auto; position: sticky; top: 90px; display: flex; flex-direction: column; height: calc(100vh - 128px) } .Page[PageType=View] .Information .InfoBar .Info .Badges { width: 100%; font-size: 10px; color: #747474; line-height: 14px; margin-bottom: 4px; text-transform: uppercase; display: flex; align-items: center; gap: 5px; } .Page[PageType=View] .Information .InfoBar .Info .Badges span + span { padding-left: 7px; position: relative; } .Page[PageType=View] .Information .InfoBar .Info .Badges span + span::before { content:""; display: inline-block; width: 2px; height: 2px; border-radius: 100%; background: #000; position: absolute; left: 0; top: 6px; } .Page[PageType=View] .Information .InfoBar .Info .Name { width: 100%; color: #262626; line-height: 17px; margin-bottom: 3px; display: flex; align-items: center; justify-content: space-between; flex-direction: row } .Page[PageType=View] .Information .InfoBar .Info .Name .Favorite { margin-left: auto; cursor: pointer } .Page[PageType=View] .Information .InfoBar .Info .PriceBox { width: 100%; display: flex; flex-direction: column; gap: 4.5px } .Page[PageType=View] .Information .InfoBar .Info .PriceBox .SpecialText { cursor: pointer; opacity: 0 } .Page[PageType=View] .Information .Desc { width: 100%; line-height: 18px; margin-top: 40px; color: #262626 } .Page[PageType=View] .Information .VariationArea .SelectedNote { width: 100%; margin: 40px 0 0; display: block; padding: 1px; line-height: 14px; font-size: 10px; color: #b1b1b1; text-align: center } .Page[PageType=View] .Information .VariationArea .SelectedNote:not(:empty)+.Selected { margin-top: 4px } .Page[PageType=View] .Information .VariationArea .Selected { width: 100%; display: flex; align-items: center; font-size: 10px; color: #000; line-height: 14px; margin: 30px 0 14px; justify-content: center } .Page[PageType=View] .Information .VariationArea .Selected .Color { margin-right: 8px; border-right: 1px solid; padding-right: 7px; line-height: 10px } .Page[PageType=View] .Information .VariationArea .Selected .Code { line-height: 14px } .Page[PageType=View] .Information .VariationArea .Colors { width: 100%; display: flex; gap: 20px; align-items: center; justify-content: center; height: 16px } .Page[PageType=View] .Information .VariationArea .Colors .ColorItem { display: flex; flex-direction: column; position: relative; cursor: pointer; height: 16px } .Page[PageType=View] .Information .VariationArea .Colors .ColorItem[PageLoad="1"]:before { position: relative; border-radius: 0 } .Page[PageType=View] .Information .VariationArea .Colors .ColorItem.active:before,.PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors .ColorItem.active:before { content: ""; display: flex; height: 1px; background: #000; position: absolute; bottom: -5px; width: 100% } .Page[PageType=View] .Information .VariationArea .Colors .ColorItem:not(:empty):hover:before,.PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors .ColorItem.active:not(:empty):hover:before { content: ""; display: flex; height: 1px; background: grey; position: absolute; bottom: -5px; width: 100% } .Page[PageType=View] .Information .VariationArea .Colors .ColorItem>.Color { width: 16px; height: 16px; border: 1px solid #e5e5e5; flex: none } .Page[PageType=View] .Information .VariationArea .Variations { width: 100%; display: flex; align-items: center; justify-content: center; gap: 18px; margin: 45px 0 18px } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem { display: flex; cursor: pointer; position: relative; text-align: center; justify-content: center; align-items: center } .CustomerBox .SenderMessage .Text,.Page[PageType=View] .Information .VariationArea .Variations .SizeItem.active,.Page[PageType=View] .Information .VariationArea .Variations .SizeItem:hover,[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 } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem:not([data-qty="0"]):hover .Size::before { content: ""; display: flex; height: 1px; background: #000; position: absolute; bottom: -5px; left: 5%; width: 90% } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem.active .Size::before { content: ""; display: flex; background: #000; position: absolute; bottom: -5px; left: 50%; margin-left: -2px; width: 4px; height: 4px } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem>.Size { width: 100%; line-height: 17px; position: relative; text-wrap-mode: nowrap } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem[data-qty="0"]>.Size { color: #838383 } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem>.Notification { width: 100%; display: none; font-size: 0; height: 10px; margin-left: 5px; position: relative; margin-bottom: 2px } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem>.Notification::before,.ProductItem .Gallery .VariationBar .List>.SizeItem>div:before { content: ""; display: flex; width: 13.183px; height: 9.887px; background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2213.183%22%20height%3D%229.887%22%20viewBox%3D%220%200%2013.183%209.887%22%3E%3Cpath%20id%3D%22envelope-sharp-light%22%20d%3D%22M.824%2C66.451l5.768%2C3.965%2C5.768-3.965V64.824H.824Zm11.535%2C1L6.591%2C71.415.824%2C67.45v5.613H12.359ZM0%2C73.063V64H13.183v9.887H0Z%22%20transform%3D%22translate(0%20-64)%22/%3E%3C/svg%3E'); background-repeat: no-repeat; background-size: contain } .Page[PageType=View] .Information .VariationArea .Variations .SizeItem.waitstockactive>.Notification::after,.ProductItem .Gallery .VariationBar .List>.SizeItem.waitstockactive>div:after { content: ""; background: 50% no-repeat #4caf50; width: 2px; height: 10px; display: block; position: absolute; top: 0; right: -4px } .Page[PageType=View] .Information .VariationArea .Note { width: 100%; font-size: 11px; color: #727272; text-align: center; border: 0 } .Page[PageType=View] .Information .BtnArea { width: 100%; margin-top: 33px; background: #fff; margin-bottom: 20px } .Page[PageType=View] .Information .Btn { width: 100%; background: #fff; color: #000; border: 1px solid } .Page[PageType=View] .Information .Btn[data-status="0"]{ width: 100%; border: 1px solid; background: #f0f0f0; color: #606060; border-color: #efefef; pointer-events: none; } .Page[PageType=View] .Information .DeliveredText{width:100%;display:flex;margin-top: 12px;gap: 4px;color: #565656;font-size: 11px;} .Page[PageType=View] .Information .DeliveredText > span:nth-child(2){ color : #00CA8D} .Page[PageType=View] .Information .Btn.active { background: #000; color: #fff; cursor: pointer; pointer-events: all; display: flex; align-items: center; justify-content: space-between; padding: 0 20px } .Page[PageType=View] .Information .Btn.active>div:last-child { display: flex; gap: 2px } .Page[PageType=View] .Information .FeaturesBar { width: 100%; margin-top: 40px; } .Page[PageType=View] .Information .FeaturesBar .Feature>.Title { width: 100%; margin-bottom: 15px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; } .Page[PageType=View] .Information .FeaturesBar .Feature>.Title > svg{ height: 12px; width: 14px; transition: 0.4s; } .Page[PageType=View] .Information .FeaturesBar .Feature.show>.Title > svg{ height: 12px; width: 14px; transform: rotate(90deg); transition: 0.4s; } .Page[PageType=View] .Information .FeaturesBar .Feature>.Text { width: 100%; overflow: auto; max-height: 160px; margin-bottom: 20px; padding-right: 5px; padding-bottom: 5px; display: none; } .Page[PageType=View] .Information .FeaturesBar .Feature>.Text::-webkit-scrollbar { width: 2px; background: #b2b2b2 } .Page[PageType=View] .Information .FeaturesBar .Feature>.Text::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .Page[PageType=View] .Information .FeaturesBar .Feature>.Text::-webkit-scrollbar-thumb:hover { background: #555 } .Page[PageType=View] .Information .SizeTable { width: 100%; display: flex; margin: 0 0 20px; align-items: center; justify-content: space-between } .Page[PageType=View] .Information .SizeTable>div { cursor: pointer; font-weight: 500 } .Page[PageType=View] .Information .FeaturesBar .FeaturesBtn { width: 100%; line-height: 17px; margin-bottom: 15px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; } .Page[PageType=View] .Information .FeaturesBar .FeaturesBtn > svg{ height: 12px; width: 14px; } .Page[PageType=View] .Information .Note { width: 100%; border: 1px solid #000; border-left: 0; border-right: 0; margin-top: auto; margin-bottom: 20px; } .Page[PageType=View] .Information .Note>.Text { width: 100%; padding: 10px 0; font-size: 11px } @media(max-width: 1700px) { .Page[PageType=View] .GalleryBar,.Page[PageType=View] .Information { width:50% } .Page[PageType=View]>.ShadowImageLogo { z-index: 11; position: fixed; top: 50%; mix-blend-mode: difference; left: 50px } .Page[PageType=View]>.ShadowImageLogo>div>svg { height: 40px; fill: #fff } .Page[PageType=View]>.ShadowImageLogo>div:first-child { width: 100%; position: absolute; top: 0; mix-blend-mode: difference } .Page[PageType=View]>.ShadowImageLogo>div:nth-child(2) { width: 100%; position: absolute; top: 0; mix-blend-mode: hue } } [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:hover,section[Mod=Nav] .SubNav>.NavItem:hover>.Box .Name { opacity: .6 } [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] .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: 20px; font-weight: 300; display: flex; gap: 5px; align-items: center; display: none; } [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 } .ProductItem .Gallery .VariationBar .List>.SizeItem>span:hover,[PageType=Account] .TabList>.TabItem.active { color: #000; text-decoration: underline } [PageType=Account] .TabView { display: none; width: 100% } [PageType=Account] .ViewTab[T="#sifre"]>.Container { width: 776px } [PageType=Account] .ViewTab[T="#siparislerim"]>.Container { width: 100%; max-width: 797px } [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,[PageType=Support] { 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] .Container[P=Return] [T=successReturn] .OrderDetail .BtnList .Btn { max-width: 100% } [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"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Quantity>div[pageload="1"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Variation[pageload="1"],.ProductItem.Favorite .Info .Properties .Btn[pageload="1"],.ProductItem.Favorite .Info .Properties .Sizes>select[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 } .Page[BagCount="0"] .TabView[T="1"]>.Empty,.Page[FavoriteCount="0"] .TabView[T="2"]>.Empty { display: flex; flex-direction: column; align-items: center; max-width: 320px; margin: 30px auto } .Page:not([FavoriteCount="0"]) .TabView[T="2"] .ProductList { display: flex; margin: 0 auto } .ProductOtherViewContainer { width: 100%; display: flex; flex-direction: column; margin: 140px 0; opacity: 0; position: relative; top: 400px; transition: .4s; z-index: 1 } .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 14px 40px 20px } .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Title { width: -webkit-fill-available } .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows { display: flex; gap: 8px } .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-prev { display: flex; position: inherit; cursor: pointer; margin: 0; height: initial } .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-next>svg,.ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-prev>svg { height: 12px } .ProductOtherViewContainer .OtherProductView>.Container .Group .TitleBar .Arrows .swiper-button-next { display: flex; position: inherit; transform: rotate(180deg); cursor: pointer; margin: 0; height: initial } .PopContent[fr=BagProductDelete],.PopContent[fr=SmsCountdown] { width: 445px; padding: 40px; display: flex; flex-direction: column } .PopContent[fr=BagProductDelete] .Title,.PopContent[fr=PaymentAccountForm] .Title,.PopContent[fr=SmsCountdown] .Title { width: 100%; font-size: 12px; line-height: 17px; text-align: center; margin: 10px 0 18px } .PopContent[fr=SmsCountdown] .Text { width: 60%; text-align: center; margin: 0 auto 20px } .PopContent[fr=SmsCountdown] .Text2 { width: 100%; text-align: center; margin-bottom: 10px } .PopContent[fr=SmsCountdown] .Inputs { width: 100%; gap: 20px } .PopContent[fr=SmsCountdown] .Inputs>.Input input { width: 100%; font-size: 28px; text-align: center; font-family: monospace; font-weight: 700 } .PopContent[fr=PaymentAccountForm] { width: 100%; padding: 30px 0 0; display: flex; flex-direction: column } .PopContent[fr=PaymentAccountForm] .Text { width: 100%; text-align: center; margin: 0 auto 5px } .PopContent[fr=PaymentAccountForm] .Divider { width: 100%; height: 1px; background: #000; margin: 8px 0 } .PopContent[fr=PaymentAccountForm] .Banks { width: 100%; display: flex; flex-direction: column; gap: 6px; padding: 10px 0; align-content: center; align-items: center } .PopContent[fr=PaymentAccountForm] .Banks .Logo { display: flex; margin-bottom: 15px } .PopContent[fr=PaymentAccountForm] .Banks .Iban { font-size: 14px } .PopContent[fr=PaymentAccountForm] .Banks .Account { display: flex; gap: 5px } .PopContent[fr=PaymentAccountForm] .Total { width: 100%; display: flex; align-items: center; justify-content: space-between; font-size: 14px; line-height: 26px; font-weight: 500 } .PopContent[fr=PaymentAccountForm] .Input { width: 100%; margin: 0 } .PopContent[fr=PaymentAccountForm] .Input>textarea { border: 0; min-height: 70px } .PopContent[fr=PaymentAccountForm] .Input .Note { font-size: 9px; color: #444; position: absolute; bottom: 0; left: 5px; text-transform: uppercase; letter-spacing: .8px } .PopContent[fr=BagProductDelete] .Text { width: 90%; text-align: center; margin: 0 auto 20px } .PopContent[fr=BagProductDelete] .BtnList { width: 100%; display: flex; flex-direction: column; gap: 10px } .PopContent[fr=mod100Preview] { width: 100%; padding: 70px 40px 40px; display: flex; flex-direction: column } .PopContent[fr=mod100Preview] .Title { width: 100%; line-height: 17px; margin-bottom: 12px } .PopContent[fr=mod100Preview] .Text { width: 100%; font-size: 11px; margin-bottom: 40px } .PopContent[fr=mod100Preview] .Products::-webkit-scrollbar { width: 2px; background: #b2b2b2 } .PopContent[fr=mod100Preview] .Products::-webkit-scrollbar-thumb { background: #000; border-radius: 2px } .PopContent[fr=mod100Preview] .Products::-webkit-scrollbar-thumb:hover { background: #555 } .PopContent[fr=mod100Preview] .Products .ProductItem { width: 100%; margin-bottom: 45px } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Gallery { width: 97px; margin-right: 7px; flex: none } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info { width: 100%; display: flex; flex-direction: column; height: inherit; padding: 0 10px } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Name { width: 100%; font-size: 11px; line-height: 15px; margin-bottom: 3px; text-wrap: auto } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors { width: 100%; display: flex; justify-content: flex-start; gap: 12px; margin-top: 10px } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors .ColorItem { cursor: pointer; position: relative } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Colors .ColorItem .Color { width: 16px; height: 16px } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Variations>select { width: 100%; border: 0; border-bottom: 1px solid #000; line-height: 24px; padding: 5px 0; font-size: 12px; outline: 0 } .PopContent[fr=mod100Preview] .Products .ProductItem>div .Info .Variations>select>option[value="0"] { color: #707070 } .PopContent[fr=mod100Preview] .Addition { width: 100%; margin-top: auto; margin-bottom: 14px; display: flex; align-items: center; justify-content: space-between } .PopContent[fr=mod100Preview] .Addition>div:first-child { width: 100%; display: flex; flex-direction: column; align-items: flex-start } .PopContent[fr=mod100Preview] .Addition>div:first-child>span:first-child,.PopContent[fr=mod100Preview] .Addition>div:first-child>span:nth-child(2),.PopContent[fr=mod100Preview] .Addition>div:nth-child(2)>span:first-child,.PopContent[fr=mod100Preview] .Addition>div:nth-child(2)>span:nth-child(2) { font-size: 12px; line-height: 17px } .PopContent[fr=mod100Preview] .Addition>div:nth-child(2) { width: 100%; display: flex; flex-direction: column; align-items: flex-end } [PageType=Support] { width: 100%; display: flex; flex-direction: column; position: relative } [PageType=Support]::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: top; z-index: -1; background-image: var(--bg-image); padding: 240px 0 540px } [PageType=Support]>.Container { width: 100%; padding: 0 110px } [PageType=Support] .SearchArea { width: 100%; position: relative; margin: 240px 0 540px } [PageType=Support] .SearchArea .SeachList { width: 100%; display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px } [PageType=Support] .SearchArea .SeachList .Item { background: #fff; padding: 10px; cursor: pointer } [PageType=Support] .SearchArea .SearchBox input { width: 100%; background: #fff; border: 0; line-height: 40px; padding: 0 12px; max-width: 70%; outline: 0 } [PageType=Support] .Content .Title { width: 100%; font-size: 14px; margin-bottom: 32px } [PageType=Support] .Content .PopularQuestion { width: 100%; display: flex; gap: 8px } [PageType=Support] .Content .PopularQuestion .Item { border: 1px solid #000; padding: 10px 10px 8px } [PageType=Support] .Content .Categories { width: 100%; margin-top: 60px } [PageType=Support] .Content .Categories .Title { width: 100%; font-size: 14px; line-height: 19px } [PageType=Support] .Content .Categories>.List { width: 100%; display: flex; flex-wrap: wrap; gap: 22px } [PageType=Support] .Content .Categories .List .Box { border: 1px solid #000; padding: 42px; width: calc(33.33% - 15px); max-width: 490px } [PageType=Support] .Content .Categories .List .Box .Title { width: 100%; font-size: 15px; line-height: 20px; text-transform: uppercase; margin-bottom: 27px } [PageType=SupportDetail] .QuestionArea .Box .List,[PageType=Support] .Content .Categories .List .Box .List { width: 100%; display: flex; flex-direction: column; gap: 14px; margin-bottom: 14px } [PageType=Support] .Content .Categories .List .Box .List .Item { display: block; width: 100%; font-size: 13px; cursor: pointer } [PageType=SupportDetail] .QuestionArea .Box .BtnMore,[PageType=Support] .Content .Categories .List .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 } [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(25% - 7.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] .Input,[PageType=Aboutus] .ContentArea .View .Form[Type=Human] .Input,[PageType=Aboutus] .ContentArea .View .Form[Type=Whosale] .Input { margin-bottom: 30px } [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; cursor: pointer; padding-bottom: 80px } [PageType=Aboutus] .ContentArea .Title { width: 100%; font-size: 14px; text-transform: uppercase; margin-bottom: 17px; } [PageType=Aboutus] .ContentArea .Title:empty {display:none} [PageType=Aboutus] .ContentArea .View { width: 100%; font-size: 14px; border: 1px solid #000; padding: 42px 33px; max-width: 1000px } [PageType=Aboutus] .ContentArea .View p { font-size: 14px; font-family: 'dutti'; margin-bottom: 22px; } [PageType=Aboutus] .ContentArea .View span { font-size: 14px !important; font-family: 'dutti' !important; line-height: 23px; } [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; display: flex; 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"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product>.Name[pageload="1"],.ProductItem.Favorite .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,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .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 { 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: #000000; border-radius: 4px; line-height: 25px; } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="0"] .Btn[fr='commentAdd'] { display:block } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Btn[fr='commentAdd'] { display:none } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="0"] .Comment{ display:none } [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:nth-child(1){ color : #FFEB3B } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="2"]>span:nth-child(1){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="2"]>span:nth-child(2){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="3"]>span:nth-child(1){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="3"]>span:nth-child(2){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="3"]>span:nth-child(3){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(1){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(2){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(3){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="4"]>span:nth-child(4){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(1){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(2){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(3){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(4){ color : #ffee54 } [fr=OrderDetail] .ProductList .ProductItem .Info .CommentArea[s="1"] .Comment .Rate[rate="5"]>span:nth-child(5){ color : #ffee54 } .module-005 {width: 100%;} .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: #000000;} .module-005 .product-section .product-detail .price .new-price > span{font-size: 13px;} .module-005 .product-section .product-detail .price .old-price {padding-left: 8px;text-decoration:line-through;color: #070707;opacity: 0.5;font-size: 13px;display: none;} .module-005 .product-section .product-detail .product-name {padding-top: 3px;color: #000000;opacity: 0.6;color: 15px;font-weight: 400;} .module-005 .comment-section {padding: 10px;} .module-005 .comment-section .comment-intro {font-size: 12px;color: #000000;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{ color:#FF9D00} .module-005 .comment-section .rating-section .rating-item.Active .rating-text{ color:#FF9D00} .module-005 .comment-section .rating-section .rating-item.Selected .icon-ifa{ color:#ff9d00ad} .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: #000000;opacity: 0.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: #000000;opacity: 0.7; } .module-005 .comment-section .select-section { } .module-005 .comment-section .select-section .select-item {display: flex;flex-direction: row;align-items: center;margin-top: 20px; } .module-005 .comment-section .select-section .select-item .select-box { } .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(0deg); } 100% { transform: rotate(360deg); } } .loaderComment { display: flex; align-items: center; justify-content: center; margin: 30px auto 20px auto; width: 22px; height: 22px; border: 2px solid #E8E8E8; border-bottom-color: transparent; border-radius: 50%; box-sizing: border-box; animation: rotation 1s linear infinite !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 0.28s cubic-bezier(0.4, 0, 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 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 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,0.28), 0 0 0 20px rgba(128,128,128,0.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,0.28), 0 0 0 20px rgba(0,150,136,0.2); } .module-005 .evaluation-btn {margin-top: 20px;color: #fff;background-color: #000000;border-radius: 0px;width: calc(100% - 0px);padding: 13px 26px;letter-spacing: 0.5px;transition: .2s;border: 0;font-weight: 100;font-size: 12px;} .module-005 .evaluation-btn:hover {background-color: #48D792;border-color: #48D792;} /* .Popup .Modal.w80{max-width: 460px;} .Popup .Modal.w80::-webkit-scrollbar{width: 0;} */ @media only screen and (max-width: 991px) { .Popup .Modal .Htm .Document .Popup_Close.Outside{ font-size: 9px; } } [fr=OrderDetail] .ProductList .ProductItem .Info .Properties { width: 100%; display: flex; align-items: center; justify-content: flex-start; margin-top: auto; margin-bottom: 10px } .Page[PageType=Success]>.Container .OrderDetail .ProductList .ProductItem .Info .Properties .QuantityBar,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar,.ProductItem .Info .Colors>div,[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"],.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .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.Desktop { display: flex; } .Page[PageType=Success]>.Container .Qr .Content .App.Mobil { display: none; } .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.Bold>.Box .Name{ font-weight:bold } 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,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product>.Name,.ProductItem.Favorite .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,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .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,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .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,.PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .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 { 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=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; font-weight: 100; 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 { width: fit-content; padding: 0 30px; width: 100%; } [PageType=Account] .Container[P=Return] .Select { display: flex; align-items: center; border-bottom: 1px solid #000; padding-bottom: 10px } [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:first-child,[formtype="1"]:not([type=registerform]) [fr="{formMail}"] .modLogin_container_right_area_form_box_input_content input,[fr="{formPhone}"] .modLogin_container_right_area_form_box_input_content input { /* border: 0; */ } [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 .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] .OrderDetail .List .Item[data-status="1"],[PageType=Account] .Container[P=Return] .OrderDetail .List .Item[data-status="99"] { border-bottom: 1px solid #000; padding-bottom: 10px } [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 } .ProductItem { width: 33.33%; border: 0; margin-bottom: 0 } .ProductItem.nonStock { display:none } .ProductItem img { width: 100%; display: block; z-index: 0; position: relative } .ProductItem .Info { width: 100%; display: flex; flex-direction: column; padding: 4px 10px; height: 180px; position: relative } .PopContent[fr=AddBagSuccess] .Preview .ProductItem>div>.Info, .PopContent[fr=StockNotificationForm] .Preview .ProductItem>div>.Info{ height:inherit; min-height: 132px; } .ProductItem .Info .InfoBar01 { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 9px 0 2px } .ProductItem .Info .Name { width: 78%; display: block; font-size: 12px; line-height: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .ProductItem .Info .Colors,.ProductItem .Info .PriceBox:not([OldPrice="0"]) .OldPrice,.ProductItem.Favorite .Gallery>img,.ProductItem.Wait .Info .Properties:not([qty="0"]) .Btn[fr=stockIn],.ProductItem.Wait .Info .Properties[qty="0"] .Btn[fr=stockOut],[Grid=Special] .ProductItem[SubType="1"][INFO="0"] .Info,[Grid=Special] .ProductItem[SubType="2"][INFO="0"] .Info,[Grid=Special] .ProductItem[SubType="3"][INFO="0"] .Info { display: block } .ProductItem .Info .Colors>div>span:first-child { width: 8px; height: 8px; display: block; margin-right: 5px; flex: none } .ProductItem .Info .PriceBox { width: 100%; display: flex; flex-direction: column; gap: 4px; position: inherit } .ProductItem .Info .PriceBox .SalePrice .Info { display: flex; justify-content: flex-start; align-items: center; flex-direction: row; width: initial; padding: 0; height: inherit; margin-right: 10px } .ProductItem .Info .PriceBox .SalePrice .Info>.Price { display: flex; justify-content: flex-start; align-items: center; line-height: 12px; padding-top: 2px } .ProductItem .Info .Badges { width: 100%; display: block; margin-top: 6px; color: #747474; font-size: 9px; text-transform: uppercase } .ProductItem .Gallery { position: relative; overflow: hidden; max-width: inherit; margin: 0; width: 100%; } .ProductItem .Gallery .swiper-button-prev, .ProductItem .Gallery .swiper-rtl .swiper-button-next, .ProductItem .Gallery .swiper-button-next, .ProductItem .Gallery .swiper-rtl .swiper-button-prev { display:none } .ProductItem .Gallery:hover .swiper-button-prev, .ProductItem .Gallery:hover .swiper-rtl .swiper-button-next, .ProductItem .Gallery:hover .swiper-button-next, .ProductItem .Gallery:hover .swiper-rtl .swiper-button-prev { display:block } .ProductItem .Gallery .swiper-button-prev:after, .ProductItem .Gallery .swiper-rtl .swiper-button-next:after { content: "\f053"; font-family: "font awesome 6 pro"; font-weight: 200; font-size: 24px; color: #000000eb; } .ProductItem .Gallery .swiper-button-next:after, .ProductItem .Gallery .swiper-rtl .swiper-button-prev:after { content: "\f054"; font-family: "font awesome 6 pro"; font-weight: 200; font-size: 24px; color: #000000; } .ProductItem .Gallery .swiper-pagination { position: absolute; text-align: center; transition: .3s opacity; transform: translate3d(0, 0, 0); z-index: 10; display: flex; gap: 2px; bottom: 0; margin: 0; bottom: 0; height: inherit; DISPLAY: NONE; } .ProductItem .Gallery .swiper-pagination .swiper-pagination-bullet { width: 100%; height: 3px; display: inline-block; border-radius: 0; background: #000; opacity: .2; margin: 0; } .ProductItem .Gallery .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; background: #000000; } .ProductItem .Gallery .swiper-slide{ position:relative; width: 100% !important; } .ProductItem .Gallery .swiper-slide::before { content: ''; display: block; background: #eee; padding-top: calc((100% / (208 / 313))); } .ProductItem .Gallery .swiper-slide.Video video{ pointer-events: none; } .ProductItem .Gallery .swiper-slide img,.ProductItem .Gallery .swiper-slide video { position:absolute; display: block; width: 100%; position: absolute; left: 0; right: 0; top: 0; bottom: 0; object-fit: cover; width: 100%; height: 100%; } .ProductItem .Gallery .VariationSelect { width: 100%; align-items: center; justify-content: center; position: absolute; bottom: 0; z-index: 1; transition: bottom .4s; padding: 16px 0; display: none } .ProductItem .Gallery .VariationBar { width: 100%; display: flex; align-items: center; justify-content: space-between; background: #fffFFFD6; position: absolute; bottom: -100%; z-index: 1; transition: bottom .4s } .ProductItem:hover .Gallery .VariationBar { bottom: 0; transition: bottom .2s } .ProductItem .Gallery .VariationBar .Favorite { margin-left: auto; padding-right: 19px; cursor: pointer } .ProductItem .Gallery .VariationBar .List { display: flex; gap: 10px 14px; padding: 18px 12px; flex-wrap: wrap } .ProductItem .Gallery .VariationBar .List>.SizeItem { flex: none; cursor: pointer; display: flex; align-items: center } .ProductItem .Gallery .VariationBar .List>.SizeItem>span { display: block; color: #262626; width: max-content; font-size: 13px } .ProductItem .Gallery .VariationBar .List>.SizeItem>div { font-size: 0; height: 10px; margin-left: 3px; position: relative } .ProductItem .Gallery .VariationBar .List>.SizeItem[Qty="0"]>span { color: #838383; pointer-events: none } .ProductItem .Info .Product>.Color { width: 100%; font-size: 11px; color: #262626; display: flex; gap: 7px; align-items: center; margin-top: 4px } .ProductItem .Info .Product>.Variation { width: 100%; font-size: 11px; color: #262626; display: flex; gap: 7px; align-items: center; margin-top: 8px } .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 .Info .Product>.Color .Text { font-size: 11px; color: #000 } [Grid="1"] .ProductItem { width: 100%; margin: auto } [Grid="102"] .ProductItem { width: 51%; margin: auto } [Grid="102"] .ProductItem>div { max-width: 450px; margin: auto } [Grid="1122"] .ProductItem { width: 50%; } [Grid="1122"] .ProductItem:nth-child(6n+1), [Grid="1122"] .ProductItem:nth-child(6n+2) { width: 100%; } [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,[Grid=Special] .ProductItem[SubType="6"] { width: 16.66%; } [Grid="12"] .ProductItem { width: 8.333% } [Grid=Special] { width: 100%; display: flex; align-items: baseline; justify-content: center; grid-template-columns: none; flex-wrap: wrap; grid-gap: initial } [Grid=Special] .ProductItem { width: 20%; display: inline-flex; flex-direction: column; padding: 10px; aspect-ratio: auto } [Grid=Special] .ProductItem[SubType="2"] { width: calc(50% - 0px) } [Grid=Special] .ProductItem[PADDING="1"] { padding: 0 } [Grid=Special] .ProductItem[ListType="1"] { width: 100%; display: flex; flex-direction: column; align-items: center; aspect-ratio: auto } [Grid=Special] .ProductItem[ListType="1"] .Layout.Info { width: 100%; display: flex; flex-direction: column; align-items: center } [Grid=Special] .ProductItem[SubType="4"][data_w="2"],[Grid=Special] .ProductItem[SubType="5"][data_w="1"] { width: 15% } [Grid=Special] .ProductItem[SubType="5"][data_w="2"] { width: 10% } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem { width: 100%; display: flex; border-bottom: 1px solid #b2b2b2; padding-bottom: 24px; margin-bottom: 24px; position: relative; padding-left: 1px; padding-top: 1px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Gallery { width: 100%; max-width: 52px; margin-right: 12px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Gallery:hover,.ProductItem.Favorite .Gallery:hover { box-shadow: 0 0 0 1px #000 } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem>.Info { width: 100%; display: flex; position: relative; height: inherit; padding: 0; margin: 0 } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Product { width: 55% } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .PriceBox { position: absolute; right: 0; top: 0; min-width: 100px; display: flex; justify-content: flex-end; align-items: flex-end; width: auto; text-align: right } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .PriceBox .SalePrice .Info { display: flex; margin-right: 0; justify-content: flex-end; } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Quantity { display: flex; align-items: center; font-size: 11px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Quantity>div { margin-right: 8px; font-size: 11px; color: #262626; min-width: 38px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Variation { display: flex; align-items: center; font-size: 11px; min-width: 65px; margin-left: 8px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .QuantityBar .Variation::before { content: ""; height: 14px; border-left: 1px solid #a2a2a2; padding-left: 6px } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social { display: flex; justify-content: flex-end; align-items: center; gap: 22px; width: 48px; margin-left: auto } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .BagProducts .ProductItem .Info .Properties .Social .RemoveBag[pageload="1"] { width: var(--plw)!important; flex: none; height: 14px; width: var(--plw)!important; flex: none } .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: inline-table; top: -100%; z-index: 1; 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 } .MobileAddition .Content .Products .ProductItem .Info .PriceBox { position: absolute; right: 0; top: 0; width: initial } body.AdditionView .MobileAddition,body.AdditionView .MobileAdditionHead { top: 0; opacity: 1; transition: .4s } .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: initial; opacity: 1; } .Page[PageType=View] .GalleryBar { width: 50%; } .Page[PageType=View] .GalleryBar .List{ height: calc( 100vh - 59px) !important; } .Page[PageType=View] .Information { width: 50%; flex: auto } [Grid="6"] .ProductItem { width: 25% } } @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,[PageType=Bag] .TabView.active,[PageType=Bulletin] .AppBox,[PageType=Bulletin] .AppBox .Box { 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] .Information .Content { position: relative } .Page[PageType=View] .GalleryBar>.List { display: flex; flex-direction: row } .FilterWind .FilterArea .Navigator .Item>span, .Page[PageType=List] .FilterBar .FilterBarTop, .Page[PageType=View]>.ShadowImageLogo, .Page[Steps="2"] .BagInformation .Addition .BalanceBar .Text span:nth-child(2), .PopContent[fr=AddBagSuccess] .TabList .TabItem:not(.active):hover::before, .PopupBox .PopContent[fr=AddBag] .Closed, .ProductItem .Gallery .VariationBar, .system-notification-item>a:not(.Sh1) [PageType=Aboutus] .Nav .SearchBox .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=Bag] .TabView .ProductList .ProductItem .Info .Properties .QuantityBar .Variation, [PageType=List] .CategoryName>.Breadcrumbs, [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .Title>div.Btn, [PageType=Payment] .ContentArea .TabView[T=Address] .Addition .Items, [PageType=Payment] .ContentArea .TabView[T=Address] .Addition .Title, [PageType=Payment] .ContentArea .TabView[T=Payment] .Addition .Items, [PageType=Payment] .ContentArea .TabView[T=Payment] .Addition .Title, [PageType=Payment] .ContentArea .TabView[T=Preview] .Addition .Items, [PageType=Payment] .ContentArea .TabView[T=Preview] .Addition .Title, [PageType=SupportDetail] .QuestionArea .CustomerBox, [PageType=SupportDetail] .QuestionArea .SearchBox, [PageType=Support] .Content .Categories .List .Box .BtnMore { display: none; } .ProductOtherViewContainer,[PageType=Account] .Container[P=Return] .OrderDetail .List .Item .Note,[PageType=Bag] .TabList { margin-top: 20px; margin-bottom: 0px; } [PageType=List] .FilterBar>.Container,section[L=Head] .Mod.StandartHead>.Container { padding: 0 20px } [PageType=Payment] .ContentArea .TabView>.Container { display: flex; flex-direction: column; padding: 0 6px 0 16px } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item .Name,.Page[Steps="2"] .BagInformation .Addition .BalanceBar .Text span:first-child,[PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List .AdresItem .Btn { font-size: 10px } .BagInformation { margin: 0; width: 100% } .BagInformation .Addition { position: static; margin-top: 40px; border-top: 1px solid #b2b2b2; padding-top: 25px } .BagInformation .Addition .BalanceBar { position: fixed; bottom: 90px; box-shadow: 0 0 0 20px #fff; left: 0; margin: 0 20px; width: calc(100% - 40px); z-index: 111111111111 } .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,.ProductItem .Gallery .VariationSelect,[PageType=Aboutus] .SearchArea.Nav .NavList,[PageType=Aboutus] .SearchBox.Nav .NavList,[PageType=Account] .Container[P=Balance] .Table table thead tr { 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;} .BagInformation .Addition .Items .Item.Products{display: none !important} .BagInformation .Addition .Items { margin-bottom: 0 } [PageType=Payment] .ContentArea .TabView[T=Address] .ContentLeft,[PageType=Payment] .ContentArea .TabView[T=Preview] .ContentLeft { height: inherit!important; overflow: visible; padding-bottom: 40px } [PageType=Payment] .ContentArea .TabView[T=Address] .Addition,[PageType=Payment] .ContentArea .TabView[T=Preview] .Addition { border-top: 0; padding: 0; margin: 0 } [PageType=Payment] .ContentArea .TabView .ContentLeft { overflow: auto; margin-bottom: 24px; padding: 0 10px 0 1px } [PageType=Payment] .ContentArea .TabView[T=Payment] .ContentLeft { height: inherit!important; overflow: visible; display: flex; padding-bottom: 200px } [PageType=Payment] .ContentArea .TabView[T=Payment] .Addition,[PageType=Support] .Content .Categories .List .Box+.Box { border-top: 0 } .PopContent[fr=AddBagSuccess] { width: 100%; height: 100vh } .Search [PageType=List] .ProductItem,[Grid="4"] .ProductItem,[Grid="5"] .ProductItem,[Grid="6"] .ProductItem { width: 50% } [PageType=Aboutus] .ContentArea,section[Mod=Search] .Container { padding: 0 } [PageType=Aboutus] .ContentArea .Box { width: 100%; padding: 0px; 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 .FilterGrid { display: none!important } 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 } [PageType=Bag]>.Container { padding: 0 20px; position: relative; z-index: 2 } [PageType=Bag] .TabView .ProductList .ProductItem .Gallery { margin-right: 16px } .NotificationBar>.Container { padding: 7px 16px; overflow: hidden; } .NotificationBar .NotificationBarClosed { right: 16px } [PageType=Aboutus] .ContentArea+.CustomerBox, [PageType=Account] .Container[P=Support] table tr td div>span, [PageType=Account] .LeftArea .Navs .Item>svg, [PageType=Account].show .RightArea, [PageType=Bag] .TabView .ProductList .ProductItem .Info .Product>.Color .Variation, [PageType=Payment] .ContentArea .TabView .ContentLeft .AddressBar .List+[fr=addAddressForm], [PageType=Support] .Content .Categories .List .Box .Title svg { display: block } [PageType="Aboutus"] .SearchArea .MobilNav [fr=Open]{ display: block } [PageType="Aboutus"] .SearchArea .MobilNav [fr=Closed]{ display: none } [PageType="Aboutus"] .SearchArea.Nav .MobilNav [fr=Open]{ display: none } [PageType="Aboutus"] .SearchArea.Nav .MobilNav [fr=Closed]{ display: block } .Page[PageType=View]>.Container { display: grid; width: 100%; grid-template-columns: 1fr; padding: 0 } .Page[PageType=View] .GalleryBar { display: block; width: inherit; height: inherit; overflow: auto } .Page[PageType=View] .GalleryBar>.List>.Item img, .Page[PageType=View] .GalleryBar>.List>.Item video{position: relative;height: 65vh;width: auto;} .Page[PageType=View] .Information { width: 100%; flex: auto } .Page[PageType=View] .GalleryBar>.List { display: flex; height: 65vh!important; flex-direction: row; width: -webkit-fit-content } .Page[PageType=View] .Information .Content { margin: 0; top: 0; width: 100%; padding: 20px; height: auto!important } .Page[PageType=View] .Information .BtnArea { position: sticky; bottom: 0; width: 100%; background: #fff; display: flex; padding: 10px 0 18px } .Page[PageType=View] .GalleryBar>.List>.Item::before{display:none} .Page[PageType=View] .GalleryBar>.List>.Item>img { width: auto; height: 100%; position: inherit; } [Grid="12"] .ProductItem { width: 25% } .ProductItem .Info .PriceBox .SalePrice { display: flex; flex-direction: column; gap: 5px } .PopContent { overflow: auto } .PopContent[fr=OrderContract] .Btn { position: inherit; left: 0; bottom: 0; z-index: 11 } [PageType=List] .FilterBar { padding-bottom: 14px; min-height: inherit; padding-top: 0px; } [PageType=List] .CategoryName { padding: 65px 0 15px; } [PageType=List] .FilterBar .FilterBarBottom>.Left .FilterBox { gap: 16px } [PageType=List] .FilterBar .FilterBarBottom>.Left .FilterBox .FilterItem>.Item { border: 0; font-size: 11px; padding-right: 0; padding-left: 0 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item { font-size: 11px; padding: 14px 10px } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .List>.Item .Color { width: 18px; height: 18px } .FilterBarBottom>.Left .FilterBox .FilterItem.show .FilterWind { position: fixed; left: 0; top: 0; margin: 0; width: 100%; height: 100%; display: flex; align-items: flex-end; justify-content: flex-start; background: 0 0; border: 0; } .FilterBarBottom>.Left .FilterBox .FilterItem.show .FilterWind .FilterOverFlow { position: fixed; left: 0; top: 0; margin: 0; width: 100%; height: 100%; background: #00000000; display: flex; align-items: flex-end; justify-content: flex-start; z-index: 1; } .FilterBarBottom>.Left .FilterBox .FilterItem.show .FilterWind .FilterArea { width: 100%; display: flex; align-items: flex-end; justify-content: flex-start; flex-direction: column; background: #fff; z-index: 2 } .FilterBarBottom>.Left .FilterBox .FilterItem>.FilterWind .BtnList>.Btn,.Page[PageType=Success]>.Container .Qr .Content .TextBox .Text,.ProductItem.Wait .Info .Properties .Btn,[PageType=Bulletin] .AppBox .Box .Apps .Item .Info .Name,[PageType=Support] .Content .PopularQuestion .Item { font-size: 11px } .FilterWind .FilterArea .Navigator { width: 100%; display: flex; padding: 0 20px; gap: 16px; border: 1px solid #000; border-left: 0; border-right: 0 } .FilterWind .FilterArea .Navigator .Item { display: flex; line-height: 38px; font-size: 11px } .FilterWind .FilterArea .Navigator .Item.show { font-weight: 500; border-color: #000 } .FilterWind .FilterArea .Navigator .Item:not([Q="0"])>span { display: inline-block } .FilterBarBottom>.Left .FilterBox .FilterItem.show .FilterWind .List { width: 100%; position: relative; left: 0; margin-bottom: -1px } .FilterBarBottom>.Left .FilterBox .FilterItem.show .FilterWind .BtnList { position: relative; width: 100%; left: 0; bottom: 0; border-top: 1px solid #000; padding-top: 10px; margin-top: 0 } .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,[PageType=Bulletin] .Content .Box .Contrat .Check+div span { 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=Support] .Content .Categories .List .Box { 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] .TheBack{display:flex} [PageType=Account] .Btn,[PageType=Support] .SearchArea .SearchBox input,[PageType=Support] .SearchArea .SearchBox>input { 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,[PageType=Bulletin] .AppBox .Box .Apps .Item .Info .Icon svg,[PageType=Bulletin] .AppBox .Box .Apps .Item img,[PageType=Bulletin] .Content .Box .Contrat .Btn,[PageType=Bulletin] .Content .Box .Input { 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% } [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 } .ProductItem.Wait .Info .Properties .Btn:last-child { margin-right: 0 } .ProductItem.Favorite .Info .Properties .Sizes>select { pointer-events: none } [PageType=Account] [P=Gift] .GiftItem .Info .Left .Text,[PageType=Bulletin] .Content .Box .Contrat .Check+div { 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 } .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 .App.Desktop { display: none; } .Page[PageType=Success]>.Container .Qr .Content .App.Mobil { display: flex; } .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=Support] .Content .Categories>.List { display: flex; flex-direction: column; gap: 0 } .AddressForm .Form .BtnList .Btn { width: 100%; margin: 16px 0 0 } [PageType=Payment] .ContentArea .TabView .ContentLeft .PayList>.List { padding: 0; display: block } [PageType=Payment] .InstallmentBox .PosList .PosItem { display: flex; flex-direction: column; align-items: center; align-content: center; padding: 10px 5px } [PageType=Payment] .InstallmentBox .PosList .PosItem>img { height: 17px; margin-bottom: 4px } [PageType=Payment] .InstallmentBox .PosList .PosItem.active>img { filter: none } [PageType=Payment] .InstallmentBox .PosList .PosItem>span { text-align: center; margin: 0 } [PageType=Payment] .InstallmentBox .PosList .PosItem img+span { margin: auto } [PageType=Payment] .InstallmentBox .PosView table thead tr th { padding-top: 12px; padding-bottom: 5px; line-height: inherit } [PageType=Payment] .InstallmentBox .PosView table tbody tr td { padding: 8px 12px; line-height: inherit } [PageType=Payment].Load .ContentArea { top: 117px; opacity: 1; transition: .3s } .PopContent[fr=AddBagSuccess] .TabList .TabItem:hover { opacity: 1 } .PopContent[fr=AddBagSuccess] .TabList .TabItem.active:hover::before { background: #000 } 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=Support]>.Container { width: 100%; padding: 0 20px } [PageType=Support] .SearchArea { height: 100vh; margin: 0; padding-top: 140px } [PageType=Support]::before { padding: 0; height: 100vh } [PageType=Support] .Content { padding: 30px 0 } [PageType=Support] .Content .PopularQuestion { display: flex; flex-direction: column; align-items: flex-start } [PageType=Support] .Content .Categories .List .Box .Title { margin: 0 0 -3px; font-size: 12px; display: flex; align-items: center; justify-content: space-between; padding: 12px } [PageType=Support] .Content .Categories .List .Box .List { display: none; padding: 0 12px } [PageType=Support] .Content .Categories .List .Box .List .Item { margin-top: 14px } [PageType=Support] .SearchArea .SeachList { gap: 6px } [PageType=Support] .SearchArea .SeachList .Item { font-size: 11px; padding: 6px 12px } [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 { padding: 0; display: none; } [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{display:flex;flex-direction: column;gap: 0;} [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .InputGroup .Input{margin-bottom: 5px;} [PageType=Aboutus] .ContentArea .View .Form[Type=Contact] .Firm{margin-bottom:50px;} [PageType=Aboutus] .Nav .SearchBox { border: 0 solid #000 } [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 } .PopContent[fr=AddBagSuccess] .TabView[T=Bag] .Addition { width: 100%; /* position: fixed; */ } [PageType=Bulletin] .Container { display: flex; max-width: 100%; margin: 100px 0; padding: 0 20px; flex-direction: column } [PageType=Bulletin] .Title { font-size: 23px; margin-bottom: 30px; max-width: 50%; text-align: left; line-height: 28px } [PageType=Bulletin] .Content { align-items: flex-start; justify-content: space-between; gap: 15px; flex-direction: column } [PageType=Bulletin] .Content .Box { width: 100%; max-width: 360px } [PageType=Bulletin] .Content .Box .Title { font-size: 16px; max-width: 80%; margin-bottom: 20px } [PageType=Bulletin] .Content .Box .Text { font-size: 14px; line-height: 18px } [PageType=Bulletin] .Content .Box .Contrat { width: 100%; display: flex; margin-top: 16px; margin-bottom: 35px; cursor: pointer } [PageType=Bulletin] .Content .Box .Contrat .Check { display: flex; width: 14px; height: 14px; justify-content: flex-start; position: relative; align-items: center; padding-left: 24px; gap: 6px; cursor: pointer } [PageType=Bulletin] .Content .Box .Contrat .Check::before { content: ""; width: 12px; height: 12px; border: 1px solid #000; flex: none; position: absolute; left: 0 } [PageType=Bulletin] .Content .Box .Contrat .Check.active::after { content: ""; width: 6px; height: 6px; background: #000; position: absolute; left: 4px; top: 4px; flex: none } [PageType=Bulletin] .Divider { width: 100%; height: 1px; background: #e3e3e3; margin: 10px 0 30px } [PageType=Bulletin] .AppBox .Box:last-child { display: flex; flex-direction: column; align-content: center; justify-content: center; align-items: center } [PageType=Bulletin] .AppBox .Box .Title { width: 100%; font-size: 16px; margin-bottom: 6px; text-align: left } [PageType=Bulletin] .AppBox .Box .Text { width: 100%; max-width: 100%; font-size: 14px; margin-bottom: 30px } [PageType=Bulletin] .AppBox .Box .Apps { width: 100%; display: flex; gap: 100px; justify-content: center; margin-bottom: 30px } [PageType=Bulletin] .AppBox .Box .Apps .Item { width: 90px } [PageType=Bulletin] .AppBox .Box .Apps .Item .Info { width: 100%; display: flex; align-items: center; justify-content: center } [PageType=Bulletin] .AppBox .Box .Apps .Item .Info .Icon { margin-right: 5px } [PageType=Bulletin] .AppBox .Box img { width: 296px; display: block } [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 } } .Container.W1180 { width: 1180px } .Container.W1360 { width: 1360px } .Container.W1440 { width: 1440px } section[L=HEAD] { position: relative; z-index: 2 } section[L=VIEW] { position: relative; z-index: 1 } section[L=FOOTER] { position: relative; z-index: 0 } .module-login.Right,section[Mod=Nav],section[Mod=Nav]>.Container,section[Mod=Nav]>.Overflow { position: fixed; height: 100%; top: 0 } 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 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .tab-content#email,.modLogin_container_right_area_form_box_input.view .passwordViewer>svg[fr="{passwordHide}"],.modLogin_container_right_area_tab_view.active,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content[CD=ErrorBox].Active span.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 29px; } section[Mod=Nav] .SubNav>.NavItem>.Multiple_SubNav:empty{ display: none !important; } 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) { 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 } } .module-login.Right { right: 0; width: 475px; z-index: 99999; -webkit-transform: translateX(100%); transform: translateX(100%); visibility: hidden; -webkit-transition: .3s; transition: .3s; -webkit-box-shadow: -5px 0 6px -2px rgba(43,43,43,.35); -moz-box-shadow: -5px 0 6px -2px rgba(43,43,43,.35); box-shadow: -5px 0 6px -2px rgba(43,43,43,.35) } .module-login.Center,.module-login.TopFull { position: fixed; top: -100%; overflow-x: auto; display: flex; left: 0; visibility: hidden; right: 0 } .module-login.Right.Active { -webkit-transform: translateX(0); transform: translateX(0); visibility: visible } .module-login.Center { height: 100%; width: 100%; background-color: transparent; z-index: 9999999; transition: .3s; justify-content: center } .module-login.Center.Active,.module-login.TopFull.Active { visibility: visible; top: 0 } .module-login.TopFull { width: 100%; z-index: 99999; transition: .3s; justify-content: center } .module-login .ModuleArea { background: #1f272e; height: inherit; width: 100%; position: relative; z-index: 10000 } .module-login .right-siderbar { position: relative; padding: 0 } .module-login.Center .right-siderbar { position: relative; width: 100% } .module-login.Center .ModuleArea { z-index: 111111; width: 100%; text-align: center; max-width: 440px; margin: 30px auto; height: fit-content } .module-login.TopFull .ModuleArea { height: fit-content } .module-login.Center .ModuleArea .Container { padding: 28px } .module-login .right-siderbar .siderbar-container { background: 0 0; width: 100%; position: relative; top: 12px; margin-bottom: 40px; padding: 0; display: inline-block } .module-login .right-siderbar .siderbar-container .siderbar-hader { position: relative; display: flex; justify-content: flex-end; align-items: center } .module-login .right-siderbar .siderbar-container .siderbar-hader>.title { font-size: 14px; color: #000; display: flex; align-items: center; font-weight: 600 } .module-login .right-siderbar .siderbar-container .siderbar-hader>.close { font-size: 18px; padding: 12px; cursor: pointer; color: #000; display: flex; align-items: center; justify-content: flex-end; flex-direction: column; position: relative; z-index: 99 } .module-login .right-siderbar .siderbar-container .siderbar-hader>.close>.icon-text { font-size: 13px; font-weight: 600; position: relative; left: 2px } .module-login .right-siderbar .siderbar-container .siderbar-hader>.close>.icon-ifa { margin-left: 4px; font-size: 18px; margin-bottom: 4px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .top-area,.module-000166 .wrapper .content-area .login-area .top-area,.module-login .right-siderbar .siderbar-container .popUp-center-pic .popUp-picture { text-align: center } .module-login .right-siderbar .siderbar-container .popUp-left-pic { position: absolute; top: 0; left: 0; z-index: -1; transform: translateX(-100%) } .module-login .right-siderbar .siderbar-container .identity-popup-top-header .top-header-buttons { flex: 1; text-align: center; cursor: pointer } .module-login .right-siderbar .siderbar-container .siderbar-body { position: relative; top: 0; text-align: left; padding: 0 35px } .module-login .right-siderbar .siderbar-container .siderbar-body.card-body { max-height: 375px; height: 100%; overflow-y: auto } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content[CD=ErrorBox] span { display: none; background: #fff; padding: 4px; font-size: 13px; border-radius: 4px; margin-top: 8px; border: 1px dashed red; color: red; font-weight: 300; text-align: center } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.PasswordArea { display: flex; align-items: center; justify-content: flex-end } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.SocialArea { display: flex; align-items: center; justify-content: flex-end; flex-direction: column } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.checkbox { text-align: left; padding: 0; margin: 0 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.checkbox strong { color: #000; text-decoration: underline; cursor: pointer } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.input { background: #fff; position: relative; z-index: 1; margin-bottom: 10px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.form-input { width: 100%; transition: .3s; text-indent: 5px; font-size: 16px; z-index: 1; position: relative; background: 0 0; color: #000; border: 0; padding: 20px 13px 8px; border-radius: 2px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.form-input::placeholder { color: #000 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content input { text-indent: 5px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.genderArea { display: flex; align-items: center; margin-bottom: 30px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.genderArea .checkbox-label { margin-right: 20px; cursor: pointer; font-size: 15px; color: #000 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.genderArea .checkbox-label::before { border-radius: 50%; width: 20px; height: 20px; top: -3px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.genderArea input:checked+.checkbox-label::before { background-color: #000; border-color: #000; color: #fff; line-height: 21px } @media only screen and (min-width: 991px) { .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.genderArea .checkbox-label:hover { opacity:.7 } } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.form-input~.label-form { position: absolute } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.Focus .form-input~.label-form { z-index: 2; color: #8c8c8c; top: 6px; left: 14px; font-size: 13px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .form-input~.label-form { position: absolute; top: 16px; left: 14px; z-index: -1; color: #383838; font-size: 15px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.error .form-input,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.error .form-alert,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.error .form-input { border-color: #fc1d1b; color: #fc1d1b; opacity: 1; visibility: visible } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.success .form-input,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.success .label-form { border-color: #43ab45; color: #43ab45!important; opacity: 1; visibility: visible } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.OK .form-input~.label-form { top: 6px; left: 14px; font-size: 13px; transition: .3s } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.success.OK .form-input~.label-form { left: 8px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.success .form-input~.label-form::before { content: "\e93e"; font-family: MissZenne!important; color: #4fca3a; position: relative; z-index: 2; left: 0; margin-right: 5px; top: 0; font-size: 11px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content .form-input~.label-form::before,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .form-input~.label-form::before { content: "" } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.title { font-size: 16px; font-weight: 600; color: #52ffb1 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.icon-ifa { width: 60px; height: 40px; position: absolute; display: flex; justify-content: center; align-items: center; right: -10px; top: 8px; font-size: 22px!important; color: #bbb; transition: .3s; cursor: pointer; opacity: 0; visibility: hidden } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-content>.icon-ifa:hover,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.icon-ifa:hover { color: #000 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.Focus>.icon-ifa { opacity: 1; visibility: visible; z-index: 3 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.Focus.OK>[CD=inputClear].icon-ifa { visibility: hidden } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.form-line { position: relative; color: #fff; font-size: 14px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .form-alert { position: relative; transition: .3s } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .form-alert.Error { animation: .82s cubic-bezier(.36,.07,.19,.97) both shake; transform: translate3d(0,0,0); backface-visibility: hidden; perspective: 1000px; display: block } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .checkbox-label { text-align: left; display: block; padding-left: 30px; position: relative } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .checkbox-label::before { content: ""; position: absolute; left: 0; top: -3px; width: 18px; height: 18px; border: 1px solid #bbb; text-align: center; font-size: 12px; line-height: 18px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content input:checked+.checkbox-label::before { content: "\e93e"; font-family: MissZenne!important } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.form-button.LoadingBtn { pointer-events: none; background-color: #7d7d7d } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content>.form-button.LoadingBtn::before { content: ""; width: 12px; height: 12px; background: 0 0; border: 2px solid #fff; border-radius: 50%; -webkit-clip-path: inset(0 0 50% 0); clip-path: inset(0 0 50% 0); transform: translate(-50%,-50%) rotate(0); -webkit-animation: .6s linear infinite spin; animation: .6s linear infinite spin; margin-right: 10px; position: absolute; left: 12px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .intl-tel-input .country-list { width: 370px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content .intl-tel-input .iti-flag { background-image: url(https://static3.farktor.com/Library/SystemBox/img/q74Xp00ONi5l.png) } .module-login.TopFull .right-siderbar { display: flex; width: 100%; justify-content: center; position: relative; margin: 50px 0 } .module-login.TopFull .right-siderbar>.TopFull { top: 0; padding: 0 0 0 125px; box-shadow: none; margin: 50px 0; border-left: 1px solid #000; width: 50%; max-width: 589px } .module-login.TopFull .right-siderbar .siderbar-container { top: 0; padding: 0; box-shadow: none; width: 50%; max-width: 580px; margin-right: 125px; margin-top: 50px } .module-login .right-siderbar .siderbar-body-right { top: 0; padding: 0; box-shadow: none; max-width: 589px; margin-bottom: 20px } .module-login .signUp-button-section { margin-top: 30px } .module-login .signUp-header-section .signUp-header-text { text-align: start } .module-login .signUp-middle-section .product-item .product-item-text { margin-left: 10px } .module-login .signUp-middle-section .product-item .product-item-text .product-item-bold-text { font-weight: 400; letter-spacing: 1px } .module-login .signUp-button-section .signUp-button-content .signUp-button-element { width: 100%; border-radius: 3px; max-height: 52px; background-color: #fff; border: 1px solid #000 } .module-login .signUp-button-section .signUp-button-content .signUp-button-element .signUp-button-text { color: #000; padding: 16px 0; font-size: 15px; font-weight: 400; text-align: center; letter-spacing: 1px } .module-login .signUp-button-section .signUp-button-content .signUp-button-element:hover { background-color: #000 } .module-000166 .wrapper .content-area .login-area>.form-area.success .btn-area .login-btn>span,.module-login .signUp-button-section .signUp-button-content .signUp-button-element:hover .signUp-button-text { color: #fff } .module-login .right-siderbar .siderbar-hader,.module-login .right-siderbar .siderbar-hader.form { position: absolute; top: 0; right: 50px; z-index: 1 } .module-login .right-siderbar .siderbar-hader.formOut { position: absolute; top: 0; left: -50px; z-index: 1; right: inherit } .module-login .right-siderbar .siderbar-hader.formIn { position: absolute; top: 0; left: -25px; right: inherit; z-index: 1 } .module-login .right-siderbar .siderbar-hader .close { display: flex; flex-direction: column; align-items: center; cursor: pointer; color: inherit } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content>.form-input { border: 0; border-bottom: 1px solid #bbb; font-size: 14px; padding: 13px 3px; width: 100%; transition: .3s; font-weight: 600; color: #000; font-family: inherit } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .tab-content { display: none; padding-top: 18px; position: relative } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-tab-title>.icon-text { color: #000; width: 100%; display: block; text-align: center; margin-bottom: 14px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-tab-title>.icon-text:first-child { font-size: 18px; font-weight: 900 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-tab-title>.icon-text:last-child { font-size: 13px; line-height: 17px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content>.forgot-link .forgot-icon { width: 20px; height: 20px; display: flex; justify-content: center; align-items: center; margin-right: 3px; color: #333; border: 1px solid #e6e6e6; border-radius: 50%; font-size: 15px; font-weight: 900; text-align: right } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content>.forgot-link { font-size: 15px; display: inline-block; text-align: right; margin-bottom: 15px; position: relative; top: -7px; cursor: pointer; color: #408be0; text-decoration: underline } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .forgot-select { display: flex; justify-content: center; align-items: center; margin: 24px 0 9px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .forgot-select>.item { flex: 1; border-bottom: 1px solid transparent; padding: 10px 0; cursor: pointer; color: #333; text-align: center; font-size: 16px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .forgot-select>.item.active { border-color: #333 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-content .form-button.forgot-btn { margin: 18px 0 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-content .form-button { width: 100%; font-size: 14px; font-weight: 600; color: #fff; height: auto; padding: 15px 20px; background-color: #000; border: 0 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-content>.icon-ifa { position: absolute; right: 6px; top: 28px; font-size: 22px!important; color: #bbb; transition: .3s; cursor: pointer; opacity: 0; visibility: hidden } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-content.OK>.icon-ifa,.Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-content.success>.icon-ifa { opacity: 1; visibility: visible } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-button { width: 100%; font-size: 14px; font-weight: 600; color: #000; height: auto; padding: 15px 20px; background-color: #fff; border: 1px solid #333; transition: .3s } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .form-button:hover { background-color: #000; border-color: #fff; color: #fff } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content>.form-input~.label-form { position: absolute; top: 33px; left: 0; color: #000; transition: .3s; font-size: 16px; font-family: inherit; font-weight: 100 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.OK .form-input~.label-form,.Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content:focus .form-input~.label-form,.Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content:hover .form-input~.label-form { top: 8px; left: 0; font-size: 13px; transition: .3s } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content .form-input~.label-form { position: absolute; top: 33px; left: 4px; color: #000; transition: .3s; font-size: 16px; font-family: inherit; font-weight: 100 } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content .form-alert { position: relative; margin-top: 6px; font-size: 13px; transition: .3s; line-height: 19px; display: block; text-align: left } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.error .form-alert { animation: .82s cubic-bezier(.36,.07,.19,.97) both shake; transform: translate3d(0,0,0); backface-visibility: hidden; perspective: 1000px } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.success .form-input,.Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.success .label-form { border-color: #43ab45; color: #43ab45; opacity: 1; visibility: visible } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.success .form-input~.label-form { top: 8px; left: 12px; font-size: 13px; transition: .3s } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.success.OK .form-input~.label-form { left: 20px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content input.contract-checkbox { position: absolute; opacity: 0; visibility: hidden } .Popup .Modal .Htm .Document .Popup_Center .forgot-form .forgot-container .form-content.success .form-input~.label-form::before { content: "\e93e"; font-family: MissZenne!important; color: #4fca3a; position: absolute; z-index: 2; left: -18px; top: 0; font-size: 13px } @media only screen and (max-width: 768px) { .module-login { width:100%; overflow-y: auto } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content:last-child { margin-bottom: 18px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content,.module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.title { padding-top: 0 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form,.module-login.Center .right-siderbar .siderbar-container .siderbar-body { padding: 0 } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.button>.icon-ifa { top: 41px } .module-login .right-siderbar .siderbar-container .siderbar-body .login-form .form-content.input>.icon-ifa { right: -8px; top: 5px } .module-login .right-siderbar .siderbar-container { padding: 0 20px; margin: 0 } .module-login.Center .ModuleArea .Container { height: 100%; overflow-y: auto } .module-login .right-siderbar .siderbar-container .identity-popup-top-header { padding-right: 30px } .module-login.Center .ModuleArea { max-width: 100%; margin: 0; height: 100% } .module-login .right-siderbar .siderbar-container .popUp-left-pic,.module-login.TopFull .right-siderbar>.TopFull .signUp-header-section { display: none } .module-login .right-siderbar .siderbar-container .identity-popup-top-header .top-header-buttons { padding: 12px 6px } .module-login .right-siderbar .siderbar-hader.form { top: 10px; right: 10px; margin: 0; position: fixed; z-index: 15; padding: 15px } .module-login .right-siderbar .siderbar-container .popUp-center-pic .popUp-picture img { width: 100% } .module-login.TopFull.Active { top: 0; bottom: 0; height: 100%; margin: 0 } .module-login.TopFull .ModuleArea { margin: 0 } .module-login.TopFull .right-siderbar { display: block; margin-top: 27px; height: 100% } .module-login.TopFull .right-siderbar .siderbar-container { width: 100%; max-width: 100%; margin: 25px 0 0 } .module-login.TopFull .right-siderbar .siderbar-container .siderbar-body { padding: 0 20px } .module-login.TopFull .right-siderbar .siderbar-body-right { padding: 0 20px 20px } .module-login.TopFull .right-siderbar>.TopFull { width: 100%; max-width: 100%; margin: 0; padding: 0; display: block; border: 0 } } @keyframes shake { 10%,90% { transform: translate3d(-1px,0,0) } 20%,80% { transform: translate3d(2px,0,0) } 30%,50%,70% { transform: translate3d(-4px,0,0) } 40%,60% { transform: translate3d(4px,0,0) } } .pageOverlay.Show { transition: .3s; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 9999!important; cursor: pointer } .module-000166 { background-color: #fff } .module-000166 .wrapper { margin-top: 62px } .module-000166 .wrapper .content-area { display: flex; justify-content: center; position: relative } .module-000166 .wrapper .content-area .bg-img { position: absolute; left: 0; top: 0; background-image: url(./../img/tsbackground47.svg); height: 370px; background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; display: block } .module-000166 .wrapper .content-area .login-area { max-width: 500px; width: 100%; border-radius: 5px; box-shadow: 0 3px 6px #00000029; padding: 35px 60px; background-color: #fff; margin-top: 68px; position: relative } .module-000166 .wrapper .content-area .login-area .top-area .title { font-size: 23px; font-weight: 700; color: #701011 } .module-000166 .wrapper .content-area .login-area .top-area .text { padding-top: 10px; font-size: 16px; color: #000; font-weight: 300 } .module-000166 .wrapper .content-area .login-area>.form-area { margin-top: 28px } .module-000166 .wrapper .content-area .login-area>.form-area .form-group>label { display: block; font-size: 13px; font-weight: 500; color: #434343 } .module-000166 .wrapper .content-area .login-area>.form-area .form-group .tel-number { margin-top: 8px; font-family: inherit; background-color: transparent; border: 1px solid #bebebe; border-radius: 3px; padding: 0 0 0 15px; width: 100%; height: 50px } .module-000166 .wrapper .content-area .login-area>.form-area.warning .form-group .tel-number { border-color: #dc143c } .module-000166 .wrapper .content-area .login-area>.form-area.success .form-group .tel-number { border-color: #5ff59b } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area { padding-top: 32px; position: relative } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area .messg-area { position: absolute; top: 10px; left: 0 } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area .messg-area>.messg-text { font-size: 13px; font-weight: 300; color: #dc143c; white-space: nowrap } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area .login-btn { font-family: inherit; border: none; border-radius: 3px; background-color: #e9eff6; width: 100%; height: 50px; cursor: pointer } .module-000166 .wrapper .content-area .login-area>.form-area.success .btn-area .login-btn { background-color: #701011 } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area .login-btn>span { font-size: 14px; font-weight: 700; color: #777 } .module-000166 .wrapper .content-area .login-area .info-text { margin-top: 35px; font-size: 15px; font-weight: 300; color: #bebebe; text-align: center } .module-000166 .wrapper .content-area .login-area .info-text .sign-in { text-decoration: underline; color: #701011; cursor: pointer } .Popup.B1.module-000166-popUp .Modal.w40 { max-width: 530px } .Popup.B1.module-000166-popUp .PopupOverlay { background: rgba(0,0,0,.36); pointer-events: all } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Close { width: 20px; height: 20px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Close.Outside.close-icon { top: 18px; right: 18px; border-radius: 0; font-size: 18px; font-weight: 500; color: #2e2e2e } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center { padding: 34px 60px; border-radius: 5px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .top-area .title { font-size: 23px; font-weight: 500; color: #52ffb1 } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .top-area .text { margin-top: 13px; font-size: 15px; font-weight: 300; color: #fff } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content>.otc { position: relative; margin-top: 16px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content>.otc legend.label { font-size: 13px; font-weight: 500; color: #434343 } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .fieldset-sms .input-group>input[type=number] { width: 45px; height: 43px; line-height: 1; margin-top: 10px; padding: 8px 0 4px; font-size: 15px; font-weight: 500; text-align: center; appearance: textfield; -webkit-appearance: textfield; border: 1px solid grey; color: #434343; border-radius: 3px; font-family: inherit; outline: 0 } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .fieldset-sms .input-group>input[type=number].input-code.full { border-color: #3f8b07; background-color: #f9fff5 } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .left-time { margin-top: 16px; display: flex; align-items: center; justify-content: space-between } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .left-time .timekeeper { font-size: 15px; color: #52ffb1; font-weight: 500; cursor: pointer } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .left-time .time-text { font-size: 13px; font-weight: 500; color: #b5b5b5 } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .verify-area { margin-top: 24px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .verify-area .btn-verify { font-family: inherit; border: 0; background-color: #e9eff6; border-radius: 3px; cursor: pointer; display: block; width: 100%; height: 50px; font-size: 14px; font-weight: 700; color: #777; transition: .3s linear } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .otc .verify-area .btn-verify.success { background-color: #701011; color: #fff } @media screen and (max-width: 991px) { .module-000166 .wrapper { margin-top:0 } .module-000166 .wrapper .content-area { padding-left: 18px; padding-right: 18px } .module-000166 .wrapper .content-area .bg-img { height: 252px } .module-000166 .wrapper .content-area .login-area { padding: 37px 18px 28px; margin-top: 58px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center .popup-content .top-area .title,.module-000166 .wrapper .content-area .login-area .top-area .title { font-size: 21px } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area { padding-top: 24px } .module-000166 .wrapper .content-area .login-area>.form-area .btn-area .messg-area { top: 6px } .module-000166 .wrapper .content-area .login-area .info-text { margin-top: 28px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Center { padding: 46px 18px 21px } .Popup.B1.module-000166-popUp .Modal.w40 .Htm .Document .Popup_Close.Outside.close-icon { right: 12px } } .modLogin_container_right_area_form_box_input input:disabled~button,.module-login.Center .ModuleArea .Container .SuccessLoad,.popup-content .SuccessLoad { display: flex; align-items: center; justify-content: center } .module-login.Center .ModuleArea .Container .SuccessLoad>img,.popup-content .SuccessLoad>img { height: 0; background: #fff; border-radius: 32px; transition: .3s } .module-login.Center .ModuleArea .Container .SuccessLoad.Active>img,.popup-content .SuccessLoad.Active>img { height: 44px; transition: .3s } .modLoginBox { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background: #fff } .modLogin_container { width: 100%; height: 100%; display: flex; align-items: stretch; justify-content: space-between; position: relative; z-index: 0 } .modLogin_container_left_area { width: 100%; height: 100%; display: block } .modLogin_container_left_area_item_01 { width: 100%; background-image: url('/Library/img/vatkali-login.jpg?v4'); height: 100%; background-size: cover } .modLogin_container_right_area { width: 840px; flex: none; display: flex; align-items: flex-start; padding-top: 100px; padding-bottom: 15px; overflow: auto; } .modLogin_container_right_area_container { width: 360px; margin: 0 auto } .modLogin_container_right_area_tab_box { width: 100%; display: none; align-items: center; gap: 12px; margin-bottom: 20px } .modLogin_container_right_area_tab_box_item { width: 100%; line-height: 28px; background: #fff; padding: 9px; border-radius: 4px; text-align: center; border: 1px solid #ccc; cursor: pointer } .modLogin_container_right_area_title_box_text01 { width: 100%; text-align: center; margin-bottom: 50px; display: none; } .modLogin_container_title { margin-bottom: 8px; position: relative; text-indent: 0; order: -10; font-size: 16px; font-weight: 400; } .modLogin_container_title::before { content: ""; width: 5px; height: 5px; background: #000; position: absolute; left: 0; top: 3px; display: none } .modLogin_container_right_area_form_box_input { width: 100%; position: relative; margin-bottom: 0px; } .modLogin_container_right_area_form_box_input input { display: block; width: 100%; font-size: 12px; font-weight: 500; color: var(--bs-gray-700); appearance: none; background-color: var(--bs-body-bg); border: 1px solid var(--bs-gray-300); transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; border-bottom: 1px solid #000; border-radius: 0; line-height: 20px; padding: 16px 0px 4px 0px; outline: 0; background: 0 0 } .modLogin_container_right_area_form_box_input input+label { color: #5a5a5b; } .modLogin_container_right_area_form_box_input .passwordViewer { position: absolute; right: 9px; bottom: 13px; border: 0; background: 0 0; display: block; line-height: 0; border-radius: 2px; cursor: pointer; padding: 4px } .modLogin_container_right_area_form_box_input .inputClear { position: absolute; right: 9px; bottom: 22px; border: 1px solid #ccc; background: #fff; display: none; line-height: 0; border-radius: 23px; cursor: pointer; padding: 4px; width: 20px; height: 20px } .modLogin_container_right_area_form_box_input .inputClear:hover { background: #000; border-color: #000 } .modLogin_container_right_area_form_box_input .inputClear:hover>svg>path { fill: #fff } .modLogin_container_right_area_form_box_input label { position: absolute; top: 21px; left: 0px; z-index: 2; font-size: 12px; overflow: hidden; text-align: start; border: 1px solid transparent; transition: opacity .1s ease-in-out,transform .1s ease-in-out; color: #5a5a5b; line-height: 18px; } .modLogin_container_right_area_form_box_input input:focus~label,.modLogin_container_right_area_form_box_input input:not(:placeholder-shown)~label { font-size: 10px; line-height: 25px; top: 2px; bottom: initial; } .modLogin_container_right_area_form_box_input_content { width: 100%; display: flex; padding: 2px } [formtype="1"]:not([type=registerform]) [fr="{formMail}"] .modLogin_container_right_area_form_box_input_content,[fr="{formPhone}"] .modLogin_container_right_area_form_box_input_content { /* border: 1px solid #efefef; */ /* background: #f0f0f0; */ } [fr="{formPhone}"] input:-webkit-autofill,[fr="{formPhone}"] select:-webkit-autofill,[fr="{formPhone}"] textarea:-webkit-autofill { /* -webkit-box-shadow: 0 0 0 1000px #f0f0f0 inset!important; */ /* transition: background-color 5000s ease-in-out; */ /* background-color: #f0f0f0!important; */ } [formtype="1"]:not([type=registerform]) [fr="{formMail}"] textarea:-webkit-autofill,[fr="{formMail}"] input:-webkit-autofill,[fr="{formMail}"] select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #f0f0f0 inset!important; transition: background-color 5000s ease-in-out; background-color: #f0f0f0!important } .modLogin_container_right_area_form_box_input_content.d-flex { display: flex; gap: 20px; align-items: center; justify-content: flex-start; margin: 10px 0 6px; background: 0 0; border: 0 } .modLogin_container_right_area_form_box_input_error { width: 100%; color: red; font-size: 11px; font-weight: 100; height: 12px; opacity: 0; display: none; text-decoration: none; } .modLogin_container_right_area_form_box_input_content_checkgroup .Check { display: flex; width: 14px; height: 14px; justify-content: center; position: relative; margin-right: 6px; flex: none; margin-top: 0; align-items: center } .modLogin_container_right_area_form_box_btn[fr="{alternative_login_mail}"],.modLogin_container_right_area_form_box_btn[fr="{alternative_login_phone}"] { background: #fff; color: #000; border: 1px solid; height: 26px; line-height: 24px; display: none } .modLogin_container_right_area_form_box_input.error .modLogin_container_right_area_form_box_input_content_checkgroup .Check::before { content: ""; border-color: red } .modLogin_container_right_area_form_box_remember { width: 100%; margin-bottom: 24px } .modLogin_container_right_area_form_box_remember>div { width: 100%; cursor: pointer; margin-bottom: 24px } .modLogin_container_right_area_form_box_remember_group { width: 100%; display: flex; margin-bottom: 25px; gap: 20px; flex-direction: column } .modLogin_container_right_area_form_box_btn { width: 100%; background: #000; font-size: 12px; color: #fff; display: flex; align-items: center; justify-content: center; line-height: 40px; margin-top: 26px; cursor: pointer } .modLogin_container_right_area_form_box_btn_group .modLogin_container_right_area_form_box_btn[fr="{change_form_btn}"] { background: #fff; color: #000; border: 1px solid; margin-top: 14px; display: none; text-align: center; } .modLogin_container_right_area_form_box_btn[fr="{alternative_login_mail}"] { cursor: pointer } .modLogin_container_right_area_form_box_social_box_container { width: 100%; margin: 50px 0 20px } .modLogin_container_right_area_form_box_social_contract01 { width: 100%; font-size: 12px; line-height: 18px; margin: 17px 0 33px } .modLogin_container_right_area_form_box_social_btn { width: 100%; height: 40px; display: flex; align-items: center; font-size: 12px; border: 1px solid #ccc; margin-bottom: 16px; justify-content: center; position: relative } .modLogin_container_right_area_form_box_social_btn[fr="{social_btn_facebook}"] { background: #3a76f3; border-color: #3a76f3; color: #fff } .modLogin_container_right_area_form_box_social_btn[fr="{social_btn_facebook}"]>i { background: url(/Library/Img/mod_login_icon_05.svg); height: 16px; width: 16px; position: absolute; left: 17px } .modLogin_container_right_area_form_box_social_btn[fr="{social_btn_google}"] { background: #fff; border-color: #000; color: #000 } .modLogin_container_right_area_form_box_social_btn[fr="{social_btn_google}"]>i { background: url(/Library/Img/mod_login_icon_04.svg); height: 16px; width: 16px; position: absolute; left: 17px } .modLogin_closed { background: url(/Library/Img/mod_login_icon_02.svg) 50%/16px no-repeat; height: 11px; width: 16px; position: fixed; left: 0; top: 0; z-index: 11; cursor: pointer; padding: 40px } .modLogin_container_right_area_form_box_contract_box { width: 100%; display: flex; margin-top: 40px; } .modLogin_container_right_area_form_box_contract_contract01 { width: 100%; display: flex; align-items: flex-start; margin-bottom: 15px; } .modLogin_container_right_area_form_box_contract_contract01 .Text { width: 100%; display: flex; font-size: 11px; line-height: 16px; text-decoration: underline; margin-top: -3px; cursor: pointer; flex-direction: column; } .modLogin_container_right_area_form_box_contract_contract01 .Text:hover { color: #000; text-decoration: none } .modLogin_container_right_area_form_box_contract_contract01 .Check { display: flex; width: 14px; height: 14px; justify-content: center; position: relative; align-items: center; margin-right: 14px; flex: none; margin-top: 0 } @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% } } .ProductOtherViewContainer .OtherProductView{margin-bottom:24px} .ModsPop { width: 100%; position: fixed; left: 0; top: 0; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 11111111111; } .ModsPop>.OverFlow { width: 100%; position: fixed; left: 0; top: 0; height: 100%; background: #00000047; z-index: 1 } .ModsPop>.Document { position: relative; z-index: 2; background: #fff; min-width: 320px; min-height: 120px; transition: .1s } .ModsPop.LoginLoad>.Document { width: auto!important; border-radius: 12px; padding: 10px!important; min-width: inherit; margin: 20px; min-height: inherit } .ModsPop.Center>.Document { padding: 60px 20px 40px } .ModsPop.RightPop { display: flex; justify-content: flex-end; align-items: flex-start } .ModsPop.RightPop>.Document { min-width: 420px; min-height: 100%; right: -120%; transition: .1s; flex: none } .ModsPop.RightPop.Show .Document { right: 0; transition: .1s } .ModsPop.RightPop .Closed { position: absolute; right: 0; top: 0; cursor: pointer; PADDING: 20PX } .PopContent[mod='StoreStockView']{width:100%;padding: 50px 0px 0px 0px;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']>.MessageArea{width:100%;font-size: 12px;font-weight: 200;padding: 0 40px;overflow: auto;display: flex;flex-direction: column;} .PopContent[mod='StoreStockView']>.MessageArea .Mitem{width: 100%;display: flex;} .PopContent[mod='StoreStockView']>.MessageArea .Mitem b{margin: 5px 0px;} .PopContent[mod='StoreStockView']>.MessageArea .Mitem br{width: 100%;display: flex;} .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 0px;} .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 0px;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 span:nth-child(2){font-weight: 500;margin-left: 80px;} .PopContent[mod='StoreStockView']>.MessageArea .Mitem .productItem a{font-weight: 500;margin-left: 80px;} .tiyu-pop-container [campaing="true"] .tiyu-price{display: flex;background: #FFEB3B;width: fit-content;padding: 3px 4px 2px 4px;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;} body.compensate-for-scrollbar { overflow: hidden } .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: none; position: fixed; -webkit-tap-highlight-color: transparent; top: 0; -ms-touch-action: manipulation; touch-action: manipulation; transform: translateZ(0); width: 100%; z-index: 99999999 } .fancybox-container * { box-sizing: border-box } .fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage { bottom: 0px; 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 ease,visibility 0s ease .25s; /* visibility:hidden; */ 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 ease 0s,visibility 0s ease 0s; visibility: visible } .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-is-open .fancybox-stage { overflow: hidden } .fancybox-slide { -webkit-backface-visibility: hidden; display: none; height: 100%; left: 0; outline: none; overflow: auto; -webkit-overflow-scrolling: touch; padding: 44px; position: absolute; text-align: center; top: 0; transition-property: transform,opacity; white-space: normal; width: 100%; z-index: 99994 } .fancybox-slide:before { content: ""; display: inline-block; font-size: 0; height: 100%; vertical-align: middle; width: 0 } .fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous { display: block } .fancybox-slide--image { overflow: hidden; padding: 0px 0; } .fancybox-slide--image:before { display: none } .fancybox-slide--html { padding: 6px } .fancybox-content { background: #fff; display: inline-block; margin: 0; max-width: 100%; overflow: auto; -webkit-overflow-scrolling: touch; padding: 44px; position: relative; text-align: left; vertical-align: middle } .fancybox-slide--image .fancybox-content { animation-timing-function: cubic-bezier(.5,0,.14,1); -webkit-backface-visibility: hidden; background: transparent; background-repeat: no-repeat; background-size: 100% 100%; left: 0; max-width: none; overflow: visible; padding: 0; position: absolute; top: 0; transform-origin: top left; transition-property: transform,opacity; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; z-index: 99995 } .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: transparent; border: 0; height: 100%; left: 0; margin: 0; max-height: none; max-width: none; padding: 0; position: absolute; top: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 100% } .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: transparent; 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: transparent; 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:hover { color: #fff } .fancybox-button:focus { outline: none } .fancybox-button.fancybox-focus { outline: 1px dotted } .fancybox-button[disabled],.fancybox-button[disabled]:hover { color: #888; cursor: default; outline: none } .fancybox-button div { height: 100% } .fancybox-button svg { display: block; height: 100%; overflow: visible; position: relative; width: 100% } .fancybox-button svg path { fill: currentColor; stroke-width: 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) { display: none } .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: transparent; 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-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small { display: none } .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: a 1s linear infinite; background: transparent; 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(0deg) } .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: all .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 } .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: transparent; border: 0; border-bottom: 1px solid #d7d7d7; border-radius: 0; color: #5d5b5b; font-size: 14px; margin: 10px 0 0; outline: none; padding: 10px 15px; width: 100% } .fancybox-thumbs { background: transparent; bottom: 0; display: none; margin: 0; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; padding: 2px 2px 4px; position: absolute; right: 0; -webkit-tap-highlight-color: rgba(0,0,0,0); width: 100%; z-index: 99995 } .fancybox-thumbs-x { overflow-x: auto; overflow-y: hidden } .fancybox-show-thumbs .fancybox-thumbs { display: block } .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: absolute; 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: none; overflow: hidden; padding: 0; position: relative; width: 52px; } .fancybox-thumbs__list a:before { border: 2px solid #000000; bottom: 0; content: ""; left: 0; opacity: 0; position: absolute; right: 0; top: 0; transition: all .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) } } [data-fancybox-zoom], [data-fancybox-play], .fancybox-infobar, .fancybox-caption, [data-fancybox-thumbs] { display: none !important } .fancybox-navigation .fancybox-button > div { 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; }