@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

body {
   padding: 0;
   margin: 0;
   font-family: "DM Sans", serif;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
   font-size: 14px;
   -webkit-overflow-scrolling: touch;
   -ms-overflow-style: -ms-autohiding-scrollba;
   -webkit-text-size-adjust: none;
   -webkit-appearance: none;
   background: #f7f7f7;
   width: 100%;
   height: 100%
}

body.disable {
   overflow: hidden
}

* {
   box-sizing: border-box
}

* {
   margin: 0;
   padding: 0;
   border: 0;
   background: 0;
   -webkit-text-size-adjust: 100%;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-kerning: auto;
   outline: none;
   z-index: 0
}

h1 {
   font-size: inherit;
   display: inherit;
   margin: inherit;
   font-weight: inherit
}

h2 {
   font-size: inherit;
   display: inherit;
   margin: inherit;
   font-weight: inherit
}

h3 {
   font-size: inherit;
   display: inherit;
   margin: inherit;
   font-weight: inherit
}

.ui-datepicker td.nonSale {
   background-color: #eaeaea
}

.ui-datepicker td.nonSale>a {
   color: #ccc
}

.ui-datepicker td.nonSale::before {
   content: "";
   background-color: red;
   width: 4px;
   height: 4px;
   display: block;
   position: absolute
}

body .pageOverlay.Show {
   transition: .3s;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   z-index: 100!important;
   background-color: rgba(255,255,255,.8);
   cursor: pointer
}

body .pageOverlayDark.Show {
   transition: .3s;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   z-index: 999;
   background-color: rgba(0,0,0,.76);
   cursor: pointer
}

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

.row.Fle {
   display: flex
}

.row::before,.row::after {
   display: table;
   content: " "
}

.row::after {
   clear: both
}

.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;
   padding-right: 8px;
   padding-left: 8px;
   padding-top: 0;
   padding-bottom: 0
}

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

.col-12 {
   width: 100%
}

.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 {
   width: 50%
}

.col-5 {
   width: 41.66666667%
}

.col-4 {
   width: 33.33333333%
}

.col-3 {
   width: 25%
}

.col-2 {
   width: 16.66666667%
}

.col-1 {
   width: 8.33333333%
}

.TopBar {
   display: none !important;
}
.Head:last-child {
   z-index: 5;
   background: #ffffff !important;
}
.HeadArea .Nav .MenuList .MenuTab>a {
   font-size: 16px;
   color: #000;
   cursor: pointer;
   text-decoration: none;
   display: flex;
   border: 1px solid transparent;
   padding: 10px;
   text-transform: uppercase;
   font-size: 14px !important;!i;!;
}
.toast-bs-container {
   position: fixed;
   right: 10px;
   top: 10px;
   z-index: 9000;
   width: 320px
}

.toast-bs-container .toast-position {
   background: #fff;
   min-width: 220px;
   max-width: 420px;
   border-radius: 4px;
   margin-bottom: 10px
}

.toast-bs-container .toast-position.Error {
   border-left: 8px solid #d35a5a;
   background-color: #fee0e0
}

.toast-bs-container .toast-position.Success {
   border-left: 8px solid #5ad363;
   background-color: #ebf9ec
}

.toast-bs-container .toast-position .toast {
   display: flex;
   align-items: center;
   width: 100%;
   padding: 16px 12px 16px 16px
}

.toast-bs-container .toast-position .toast i.fa-warning {
   background: #f44336;
   color: #fff;
   width: 29px;
   height: 29px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 100%;
   flex: none
}

.toast-bs-container .toast-position .toast i.fa-check {
   background: #4caf50;
   color: #fff;
   width: 29px;
   height: 29px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 100%;
   flex: none
}

.toast-bs-container .toast-position .toast .toast-body {
   display: flex;
   flex-direction: column;
   margin: 0 8px 0 16px;
   color: #484848;
   font-stretch: normal;
   font-style: normal;
   line-height: 1.5;
   overflow: hidden;
   text-overflow: ellipsis
}

.toast-bs-container .toast-position .toast button {
   align-items: center;
   align-self: flex-start;
   cursor: pointer;
   display: flex;
   flex-direction: row;
   height: 24px;
   justify-content: center;
   margin-right: 12px;
   text-align: center;
   width: 24px;
   margin-left: auto
}

.toast-bs-container .toast-position .toast button i {
   color: #828282;
   align-items: center;
   justify-content: center;
   border-radius: 100%;
   flex: none
}

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

img {
}

.Loading {
}

.Loading.Pop {
   background: #f6f6f6;
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   z-index: 1
}

.Loading.All {
   background: #ffffff1c
}

.Loading.White {
   background: #fff
}

.Loading svg {
   width: 50px;
   height: 50px;
   display: inline-block;
   position: absolute;
   left: 50%;
   top: 50%;
   margin-left: -25px;
   margin-top: -25px
}

.Loading.Content {
   position: absolute;
   z-index: 19;
   width: 100%;
   height: 100%;
   background: #ffffffbf;
   left: 0;
   top: 0;
   bottom: 0;
   right: 0
}

.Loading.Content svg {
   width: 50px;
   height: 50px;
   display: inline-block;
   position: absolute;
   left: 28px;
   top: 28px;
   margin-left: -25px;
   margin-top: -25px
}

.Desktop1.Mobil0 {
   display: block
}

.Desktop1.Mobil1 {
   display: block
}

.Desktop0.Mobil1 {
   display: none
}

.Desktop0.Mobil0 {
   display: none
}

.Layout_01 {
   display: flex;
   flex-direction: row;
   align-content: flex-start;
   align-items: flex-start;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   left: 0;
   width: 100%
}

.Layout_01 .Layout_01_Center {
}

.Layout_01 .Layout_01_Center .LayoutHead {
   margin-bottom: 0;
   position: relative;
   z-index: 10
}

.Layout_01 .Layout_01_Center .LayoutHome {
   margin-bottom: 30px;
   z-index: 2;
   position: relative
}

.Layout_01.Active .Layout_01_Center .LayoutHead {
   background: #135379
}

.LayoutFooter {
   position: relative
}

.Nod003 {
   float: left;
   margin-bottom: 14px;
   width: 100%;
   padding: 0 15px
}

.Nod003 .List {
   float: left;
   height: 140px
}

.Nod003 .List .owl-nav {
   display: none
}

.Nod003 .List .owl-dots {
   display: none
}

.Nod003 .item {
   width: 120px;
   text-align: center
}

.Nod003 .item a {
   width: 120px;
   margin: 10px 0;
   text-decoration: none;
   color: #000
}

.Nod003 .item a img {
   display: inline-block;
   width: 120px;
   height: 120px;
   border-radius: 100px
}

.Nod003 .item a .Info span {
   line-height: 32px
}

.DayView {
   position: fixed;
   z-index: 1;
   bottom: 80px;
   left: -100%;
   background: #000;
   width: 320px;
   border-radius: 0 8px 8px 0;
   color: #fff;
   padding: 10px;
   font-size: 14px;
   text-align: center;
   transition: all .3s ease-in
}

.DayView.Show {
   left: 0;
   transition: all .3s ease-in
}

.DayView .Text {
   width: 100%
}

.DayView .Closed {
   width: 10px
}

.ProductList {
}

.ProductList.Grid4 .ProductItem {
   width: 25%;
   text-decoration: none;
   color: #000;
   position: relative
}

.ProductList.Grid3 .ProductItem {
   width: 33.33%
}

.ProductListMore {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   align-content: center
}

.ProductListMore .Btn {
   background: #efefef;
   padding: 12px 20px;
   border-radius: 4px;
   margin: 20px 0;
   cursor: pointer;
   position: relative
}

.ProductListMore .Btn.Active {
   padding-left: 55px;
   background: #dbe3e7
}

.ProductListMore .Btn.Active::before {
   content: "";
   background: #a0b4bd url(/Library/Img/Loading.svg?);
   width: 43px;
   height: 100%;
   background-size: 41px;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11
}

.ProductList .ProductItem.item_001 {
   padding: 5px;
   position: relative
}

.ProductList .ProductItem.item_001:hover {
   z-index: 1
}

.ProductList .ProductItem.item_001 .Gallery {
   width: 100%;
   border-radius: 4px;
   overflow: hidden;
   position: relative
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite {
   width: 20px;
   height: 20px;
   flex: none;
   cursor: pointer;
   position: absolute;
   right: 6px;
   top: 6px
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #5656569c;
   background: #fff;
   border-radius: 100%;
   width: 22px;
   height: 22px;
   text-align: center;
   line-height: 22px
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite:hover::before {
   color: #edcce1
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductList .ProductItem.item_001.item_001 .Gallery img {
   width: 100%
}

.ProductList .ProductItem.item_001 .Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   color: #000
}

.ProductList .ProductItem.item_001:hover .Info {
   box-shadow: 0 16px 11px -3px #00000029
}

.ProductList .ProductItem.item_001 .Info .Slogan {
   margin-top: 2px;
   font-size: 14px;
   color: #ba127d
}

.ProductList .ProductItem.item_001 .Info .Name {
   margin: 4px 0;
   min-height: 30px;
   font-weight: 400;
   font-size: 16px;
   display: flex;
   align-items: flex-start;
   justify-content: center;
   text-align: center
}

.ProductList .ProductItem.item_001 .Info .Name span {
   width: 100%;
   font-size: 14px
}

.ProductList .ProductItem.item_001 .Info .Price {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center
}

.ProductList .ProductItem.item_001 .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 14px;
   font-weight: 500
}

.ProductList .ProductItem.item_001 .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   margin-left: 10px;
   color: #243a4e
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B1 {
   display: flex;
   font-size: 22px;
   font-weight: 600
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-weight: 600;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px;
   font-weight: 600
}

.ProductList .ProductItem.item_001 .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #bfbfbf;
   margin-left: 10px
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B1 {
   display: flex;
   font-size: 18px;
   font-weight: 500
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 11px
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .OtherInfo {
   display: none;
   position: absolute;
   height: 70px;
   background: rgb(255 255 255);
   text-align: center;
   align-items: center;
   box-shadow: 0 16px 11px -3px #00000029;
   z-index: 2;
   left: 5px;
   right: 5px;
   border-radius: 0 0 6px 6px
}

.ProductList .ProductItem.item_001:hover .OtherInfo {
   display: flex
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate {
   width: 100%;
   margin-bottom: 2px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   align-content: center;
   flex-direction: column;
   padding: 20px 0
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate span {
   width: 100%;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point {
   display: flex
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Total {
   font-size: 12px;
   cursor: pointer;
   color: #2196f3;
   padding: 2px 5px;
   border-radius: 2px;
   font-weight: 500
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Total span {
   font-weight: 400
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Total:hover {
   text-decoration: underline
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star {
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}

.Nod001 {
   padding: 15px;
   display: flex;
   justify-content: space-between;
   margin-bottom: 30px;
   padding-top: 0
}

.Nod001 .SearchBar {
   display: flex;
   flex-direction: column
}

.Nod001 .SearchBar .Search {
   padding: 10px;
   width: 420px;
   position: relative;
   padding-bottom: 0
}

.Nod001 .SearchBar .Search input {
   width: 100%;
   border: 0;
   border-bottom: 1px solid #e2e7e9;
   padding: 8px;
   outline: none;
   padding-left: 0
}

.Nod001 .SearchBar .Search .BtnSearch {
   padding: 10px;
   position: absolute;
   right: 0;
   top: 0
}

.Nod001 .SearchBar .SearchKeyList {
   display: flex;
   flex-direction: row;
   padding: 0 10px
}

.Nod001 .SearchBar .SearchKeyList span {
   padding: 4px 0
}

.Nod001 .SearchBar .SearchKeyList a {
   padding: 4px 3px;
   color: #8a8a8a;
   cursor: pointer;
   font-size: 13px
}

.Nod001 .SearchBar .SearchKeyList a:hover {
   padding: 4px 3px;
   color: #ba127d;
   cursor: pointer
}

.Nod001 .UserNav {
   display: flex;
   flex-direction: row;
   align-content: center;
   justify-content: center;
   align-items: center
}

.Nod001 .UserNav .Btn {
   display: flex;
   padding: 5px;
   align-items: center;
   align-content: stretch;
   justify-content: flex-start;
   margin: 0 0 0 10px;
   cursor: pointer
}

.Nod001 .UserNav .Btn .Icon {
   font-size: 28px;
   display: none
}

.Nod001 .UserNav .Btn .Icon i {
   padding: 10px
}

.Nod001 .UserNav .Btn .Text {
   padding: 1px;
   display: flex;
   flex-direction: row;
   font-size: 15px;
   align-items: center;
   text-transform: uppercase
}

.Nod001 .UserNav .Btn .Text span {
   padding: 0
}

.Nod001 .UserNav .Btn.BtnFavorite .Icon {
   color: #f44336
}

.Nod001 .UserNav .Btn.BtnFollow .Icon {
   color: #673ab7
}

.Nod001 .UserNav .Btn.BtnAccount .Icon {
   color: #ff9800
}

.Nod001 .UserNav .Btn.BtnBag .Icon {
   color: #c31181
}

.Nod001 .UserNav .Btn.BtnBag .Text span.Count {
   width: 100%;
   font-weight: 400;
   margin-left: 10px;
   font-size: 13px;
   text-transform: capitalize
}

.sub-item.dropdown-item.Active .menu-link::before {
   content: "";
   position: absolute;
   width: 6px;
   height: 6px;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.menu-link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 600;
   font-size: 21px;
   padding: 10px 0;
   opacity: .9;
   cursor: pointer;
   text-decoration: none
}

.item.dropdown-item .dropdown-content {
   padding-left: 15px;
   padding-bottom: 10px;
   padding-top: 8px;
   display: none
}

.item.dropdown-item .dropdown-content .link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 100;
   font-size: 16px;
   padding: 7px 0;
   opacity: .9
}

.item.dropdown-item .dropdown-content .link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.item.dropdown-item .dropdown-content .link:hover::before {
   width: 6px;
   height: 6px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item {
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 100;
   font-size: 16px;
   padding: 7px 0;
   opacity: .9
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link:hover::before {
   width: 6px;
   height: 6px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link:hover {
   opacity: 1
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content {
   padding-left: 15px;
   display: none
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content .menu-link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 600;
   font-size: 16px;
   padding: 7px 0;
   opacity: .9;
   cursor: pointer
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content .menu-link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content .menu-link:hover::before {
   width: 6px;
   height: 6px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item.Active .menu-link::before {
   content: "";
   position: absolute;
   width: 6px;
   height: 6px;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.company-nav {
   margin-top: 20px
}

.company-nav .info-text {
   display: flex;
   align-items: center;
   color: #000;
   font-size: 18px;
   padding: 8px 0;
   font-weight: 500;
   cursor: pointer
}

.company-nav .info-text::before {
   content: "\f067";
   font-size: 11px;
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

.company-nav .info-detail {
   padding-left: 15px;
   display: none
}

.company-nav .info-detail .link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 100;
   font-size: 15px;
   opacity: .9;
   margin-bottom: 3px;
   padding: 2px 0;
   text-decoration: none
}

.company-nav .info-detail .link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.company-nav .info-detail .link:hover::before {
   width: 6px;
   height: 6px
}

header-nav-container .company-nav .info-detail .link:hover {
   opacity: .7
}

.Nod002 {
   display: flex;
   margin-bottom: 30px;
   padding: 15px
}

.Nod002 .Banner:nth-child(1) {
   display: flex;
   height: 380px;
   width: 100%
}

.Nod002 .Banner:nth-child(2) {
   display: flex;
   height: 380px;
   width: 420px;
   flex: none;
   margin-left: 15px
}

.Nod002 .Banner img {
   width: 100%
}

.Mod004 {
   display: block;
   padding: 15px;
   padding-bottom: 5px
}

.Mod004 .breadcrumb {
   margin: 0;
   padding: 0;
   font-size: 13px;
   display: flex;
   flex-direction: row;
   align-content: center;
   justify-content: flex-start;
   align-items: center;
   margin-bottom: 15px
}

.Mod004 .breadcrumb li {
   list-style: none;
   color: #666
}

.Mod004 .breadcrumb li:before {
   content: "\f054";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #ba1e7d;
   margin: 0 5px;
   font-weight: 100;
   font-size: 9px
}

.Mod004 .breadcrumb li:nth-child(1):before {
   content: "\f015";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #c31281;
   margin: 0;
   font-size: 16px
}

.Mod004 .breadcrumb li a {
   color: #333;
   text-decoration: none;
   font-family: inherit;
   font-size: 13px
}

.Mod004 .breadcrumb li a:hover {
   color: #000
}

.Mod004 .breadcrumb li a span {
   padding: 0 5px;
   color: #4d4d4d;
   text-decoration: none;
   font-family: inherit
}

.Mod004 .breadcrumb li a span.home {
   float: left;
   padding: 0
}

.Mod004 .breadcrumb li.active {
   float: left
}

.Mod004 .breadcrumb li.active span {
   padding: 0 5px
}

.Category {
   width: 100%;
   display: block;
   padding: 0 15px
}

.Category .Info {
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-content: center;
   align-items: center;
   margin-bottom: 15px;
   position: relative;
   z-index: 6
}

.Category .Info .Title {
}

.Category .Info .Title span {
   width: 100%;
   font-size: 12px;
   font-weight: 500;
   color: #999;
   letter-spacing: -.08px
}

.Category .Info .SortArea {
   width: 100%;
   display: flex;
   justify-content: flex-end
}

.Category .Info .SortArea .Sort {
   position: relative;
   z-index: 1
}

.Category .Info .SortArea .SortOverFlow {
   background: 0 0;
   position: fixed;
   left: 0;
   top: 0;
   bottom: 0;
   width: 100%;
   height: 0;
   z-index: 0;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in
}

.Category .Info .SortArea.Active .SortOverFlow {
   background: #00000082;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   height: 100%
}

.Category .Info .SortArea .Sort .Selected {
   width: 100%;
   padding: 5px 10px 7px;
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   box-shadow: 0 0 0 0 #000;
   cursor: pointer;
   display: flex;
   align-content: center;
   justify-content: space-between;
   align-items: center
}

.Category .Info .SortArea .Sort .Selected::after {
   content: "\f078";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #000;
   padding-left: 15px
}

.Category .Info .SortArea .Sort .Wind {
   width: 100%;
   display: none;
   position: absolute;
   right: 0;
   top: 0;
   background: #fff;
   padding: 5px;
   border: 1px solid #e2e7e969;
   border-radius: 4px;
   box-shadow: -2px 17px 37px -10px #00000059;
   width: 200px
}

.Category .Info .SortArea .Sort:hover .Wind {
   display: block
}

.Category .Info .SortArea .Sort .Wind div {
   width: 100%;
   line-height: 30px;
   cursor: pointer;
   padding: 0 8px;
   border-radius: 4px;
   display: flex;
   align-content: center;
   justify-content: space-between;
   align-items: center
}

.Category .Info .SortArea .Sort .Wind div:hover {
   background: #efefef70
}

.Category .Info .SortArea .Sort .Wind div.Active::after {
   content: "\f00c";
   font-size: 11px;
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #4caf50
}

.Category .Text {
}

.Category .FilterAreaMobile {
   display: none
}

.Category .FilterArea {
   position: relative;
   z-index: 4
}

.Category .FilterArea .Filter {
   width: 100%;
   margin-bottom: 15px;
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   box-shadow: 0 0 0 0 #000;
   display: flex;
   align-content: center;
   justify-content: flex-start;
   align-items: center
}

.Category .FilterArea .FilterBox {
   position: relative
}

.Category .FilterArea .FilterApply {
   position: absolute;
   bottom: 65px;
   background: #4caf50;
   color: #fff;
   width: 80%;
   margin: 0 10%;
   box-shadow: 0 100px 0 120px #fff,0 42px 0 62px #000;
   padding: 12px;
   text-align: center;
   font-size: 15px;
   border-radius: 6px;
   z-index: 3;
   display: none
}

.Category .FilterArea .FilterBox .Selected {
   width: 100%;
   padding: 12px 14px 12px 10px;
   border-right: 1px solid #e2e7e9;
   box-shadow: 0 0 0 0 #000;
   cursor: pointer;
   display: flex;
   align-content: center;
   justify-content: space-between;
   align-items: center
}

.Category .FilterArea .FilterBox .Selected span {
   color: #c32081;
   padding-left: 5px;
   font-size: 12px
}

.Category .FilterArea .FilterBox.Active .Selected {
   box-shadow: 0 1px 0 0 #fff;
   position: relative;
   z-index: 2
}

.Category .FilterArea .FilterBox .Selected::after {
   content: "\f078";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #000;
   padding-left: 15px;
   font-size: 9px
}

.Category .FilterArea .FilterBox .Wind {
   width: 100%;
   display: none;
   position: absolute;
   left: -1px;
   top: calc( 100% - -1px );
   background: #fff;
   padding: 7px 12px;
   border: 1px solid #e2e7e9;
   border-top: 1px solid #fff;
   border-radius: 0 0 4px 4px;
   box-shadow: -2px 25px 37px -10px #00000059;
   width: 200px;
   overflow: auto;
   max-height: 340px
}

.Category .FilterArea .FilterBox.Active .Wind {
   display: block
}

.Category .FilterArea .FilterBox.Active .Selected::after {
   color: #c52082
}

.Category .FilterArea .FilterBox .Wind>span {
   width: 100%;
   line-height: 24px
}

.Category .FilterArea .FilterBox.Active .Wind .BtnClear {
   color: #c52082;
   font-size: 11px;
   cursor: pointer;
   display: flex;
   align-items: center;
   margin-bottom: 2px
}

.Category .FilterArea .FilterBox.Active .Wind .BtnClear:hover {
   text-decoration: underline
}

.Category .FilterArea .FilterBox.Active .Wind .BtnClear::before {
   content: "\f056";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   padding-right: 4px
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea {
   display: flex;
   flex-direction: row;
   align-items: stretch;
   justify-content: center
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea input {
   width: 40%;
   outline: none;
   border: 1px solid #ccc;
   padding: 4px;
   margin-right: 10px;
   border-radius: 2px;
   font-size: 12px
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea .Btn {
   width: 20%;
   background: #34495e;
   color: #fff;
   padding: 10px;
   border-radius: 2px;
   text-align: center;
   cursor: pointer
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea .Btn:hover {
   background: #283c50
}

.ProductView {
   width: 100%;
   display: flex;
   padding-bottom: 30px
}

.ProductView .Gallery {
   /* width: 50%; */
   padding-left: 15px;
   padding-right: 15px;
   display: flex
}

.ProductView .Gallery .SmallList {
   width: 100px;
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   flex: none
}

.ProductView .Gallery .SmallList .gallery-item .zoom-gallery2 img {
}

.ProductView .Gallery .SmallList .gallery-item:hover .zoom-gallery2 img {
   width: 100%;
   box-shadow: 0 0 0 1px #41c346;
   border-color: #41c346
}

.ProductView .Gallery .SmallList .gallery-item .zoom-gallery2.Active img {
}

.ProductView .Gallery .Big {
   width: 100%;
   margin-left: 30px
}

.ProductView .Gallery .Big [T=Prew] {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   display: none;
   align-items: center;
   width: 60px;
   justify-content: center;
   font-size: 18px
}

.ProductView .Gallery .Big:hover [T=Prew] {
   display: flex
}

.ProductView .Gallery .Big [T=Prew]>i {
   background: #6666665e;
   color: #fff;
   width: 30px;
   height: 30px;
   border-radius: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer
}

.ProductView .Gallery .Big [T=Next] {
   position: absolute;
   top: 0;
   right: 0;
   height: 100%;
   display: none;
   align-items: center;
   width: 60px;
   justify-content: center;
   font-size: 18px
}

.ProductView .Gallery .Big:hover [T=Next] {
   display: flex
}

.ProductView .Gallery .Big [T=Next]>i {
   background: #6666665e;
   color: #fff;
   width: 30px;
   height: 30px;
   border-radius: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer
}

.ProductView .Gallery .Big img {
   width: 100%;
   border-radius: 6px;
   cursor: zoom-in
}

.ProductView .InfoBox {
   width: 50%;
   padding-left: 15px;
   padding-right: 15px
}

.ProductView .InfoBox .Info {
}

.ProductView .InfoBox .Info .Name {
}

.ProductView .InfoBox .Info .Code {
}

.ProductView .InfoBox .Info .Rate {
}

.ProductView .InfoBox .Info .Rate span {
   width: 100%;
   font-size: 14px
}

.ProductView .InfoBox .Info .Rate .Point {
}

.ProductView .InfoBox .Info .Rate .Total {
}

.ProductView .InfoBox .Info .Rate .Total span {
   font-weight: 400
}

.ProductView .InfoBox .Info .Rate .Total:hover {
   text-decoration: underline
}

.ProductView .InfoBox .Info .Rate .Point .Star {
}

.ProductView .InfoBox .Info .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductView .InfoBox .Info .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductView .InfoBox .Info .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1;
   color: #ccc
}

.ProductView .InfoBox .Info .Price {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center
}

.ProductView .InfoBox .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 16px;
   border: 0;
   margin-right: 10px
}

.ProductView .InfoBox .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #34495e;
   font-weight: 600
}

.ProductView .InfoBox .Info .Price .Sale .B1 {
   display: flex;
   font-size: 26px
}

.ProductView .InfoBox .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 19px
}

.ProductView .InfoBox .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex
}

.ProductView .InfoBox .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 11px
}

.ProductView .InfoBox .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #a9a9a9;
   margin-right: 10px;
   font-weight: 500;
   text-decoration: line-through
}

.ProductView .InfoBox .Info .Price .Old .B1 {
   display: flex;
   font-size: 20px
}

.ProductView .InfoBox .Info .Price .Old .B2 {
   font-size: 14px;
   display: flex
}

.ProductView .InfoBox .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex
}

.ProductView .InfoBox .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 11px
}

.ProductView .InfoBox .Desc {
}

.ProductView .InfoBox .BtnList {
}

.ProductView .InfoBox .BtnList .BtnAdd {
   font-size: 18px;
   background: 0 0;
   padding: 13px 30px;
   border-radius: 5px;
   color: #41c347;
   text-align: center;
   cursor: pointer;
   position: relative;
   z-index: 0;
   box-shadow: inset 0 0 0 1px #41c347
}

.ProductView .InfoBox .BtnList .BtnAdd i {
   margin-right: 5px;
   color: #41c347
}

.ProductView .InfoBox .BtnList .BtnAdd:hover {
   background: #41c3470f
}

.ProductView .InfoBox .BtnList .BtnAdd.Disabled {
   opacity: .7;
   color: #bcc7cb;
   pointer-events: none
}

.ProductView .InfoBox .BtnList .BtnAdd.Disabled i {
   opacity: .3
}

.ProductView .InfoBox .BtnList .BtnAdd.Active {
   background: #d8e1e5;
   pointer-events: none;
   padding-left: 36px
}

.ProductView .InfoBox .BtnList .BtnAdd.Active::before {
   content: "";
   background: #a0b4bd url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 100%;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11;
   background-size: 39px;
   position: absolute;
   left: 0;
   background-position: 50%
}

.ProductView .InfoBox .MobilArea {
   display: none
}

.ProductView .InfoBox .MobilArea .Btn-Whatsap {
   float: left;
   border-radius: 4px;
   border: 1px solid #4caf50;
   cursor: pointer;
   text-align: center;
   color: #368c39;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.ProductView .InfoBox .MobilArea .Btn-Phone {
   float: left;
   border-radius: 4px;
   border: 1px solid #ff5722;
   cursor: pointer;
   text-align: center;
   color: #ff5722;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.ProductView .InfoBox .BtnList .BtnComplete {
}

.ProductView .InfoBox .BtnList .BtnComplete:hover {
}

.ProductView .InfoBox .BtnList .BtnComplete.Active {
   background: #34a93a;
   pointer-events: none;
   padding-left: 40px
}

.ProductView .InfoBox .BtnList .BtnComplete.Active::before {
   content: "";
   background: #18641c url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 100%;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11;
   background-size: 39px;
   position: absolute;
   left: 0;
   background-position: 50%
}

.ProductView .InfoBox .BtnList .BtnComplete.Disabled {
   opacity: .7;
   background: #e8edef;
   color: #bcc7cb;
   pointer-events: none
}

.ProductView .InfoBox .BtnList .BtnComplete.Disabled i {
   opacity: .3
}

.ProductView .InfoBox .BtnList .BtnFavorite {
}

.ProductView .InfoBox .BtnList .BtnFavorite:hover {
   background: #fff
}

.ProductView .InfoBox .BtnList .BtnFavorite.Active {
   color: #e3279d;
   box-shadow: inset 0 0 0 1px #e3279d
}


.ProductView .InfoBox .BtnList .BtnFavorite:hover::before {
   color: #e3279d94
}

.ProductView .InfoBox .BtnList .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductView .InfoBox .BtnList .Pricebox {
   display: none
}

.ProductView .InfoBox .nonLocation {
   width: 100%;
   position: relative;
   margin: 15px 0;
   z-index: 1;
   color: #000;
   font-size: 12px;
   background: #f9f4e6;
   padding: 6px;
   border-radius: 2px
}

.ProductView .InfoBox .nonLocation a {
   color: #000;
   font-weight: 700;
   text-decoration: underline
}

.ProductView .InfoBox .LocationArea {
   width: 100%;
   position: relative;
   margin: 15px 0;
   z-index: 2
}

.ProductView .InfoBox .LocationArea .LocationInput {
}

.ProductView .InfoBox .LocationArea .LocationInput::before {
   content: "\f041";
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 30px;
   position: absolute;
   left: 15px;
   top: 9px;
   color: #d5e0e5
}

.ProductView .InfoBox .LocationArea .LocationInput.Active::before {
   color: #41a245
}

.ProductView .InfoBox .LocationArea .LocationInput.Active {
   border-color: #4fc954
}

.ProductView .InfoBox .LocationArea .LocationInput input {
}

.ProductView .InfoBox .LocationArea .LocationInput input.Active {
}

.ProductView .InfoBox .LocationArea.Error .LocationInput input {
   border: 1px solid #ff000047;
   color: #d51010
}

.ProductView .InfoBox .LocationArea.Error .LocationInput::before {
   color: #d51010
}

.ProductView .InfoBox .LocationArea.Error .ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block
}

.ProductView .InfoBox .LocationArea .ErrorText {
   display: none
}

.ProductView .InfoBox .LocationArea .LocationInput .ClosedIcon {
}

.ProductView .InfoBox .LocationArea .LocationInput.Active .ClosedIcon {
}

.ProductView .InfoBox .LocationArea .list-group {
   width: calc(100% - 16px);
   position: absolute;
   left: 8px;
   z-index: 2;
   top: calc(100% - 10px);
   background: #fff;
   max-height: 180px;
   overflow: auto;
   padding: 0 10px 0 35px;
   border-radius: 0 0 4px 4px;
   border: 1px solid #e8edef73;
   border-top: 1px solid #fff;
   box-shadow: -7px 29px 38px -11px #00000057;
   margin: 0;
   display: none
}

.ProductView .InfoBox .LocationArea .list-group .list-group-item {
   width: 100%;
   padding: 5px 10px;
   cursor: pointer;
   box-shadow: inset 0 0 0 1px #e2e7e947;
   margin-bottom: 5px;
   border-radius: 16px;
   list-style: none;
   font-size: 13px
}

.ProductView .InfoBox .LocationArea .list-group .list-group-item:hover {
   width: 100%;
   background: #e8f5e9;
   box-shadow: inset 0 0 0 1px #4bae4f6b
}

.ProductView .InfoBox .LocationArea .list-group .list-group-item::before {
   content: "\f041";
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 17px;
   position: absolute;
   left: 16px;
   color: #4bae4f
}

.ProductView .InfoBox .DayArea {
   width: 100%;
   margin: 15px 0;
   display: none;
   position: relative;
   z-index: 0
}

.ProductView .InfoBox .DayArea.Active {
   display: flex;
   flex-direction: row;
   align-items: revert;
   flex-wrap: wrap;
   align-content: flex-start
}

.ProductView .InfoBox .DayArea .DayItemArea {
   width: calc(25% - 8px);
   position: relative;
   margin-right: 10px;
   z-index: 1;
   height: auto;
   display: flex;
   flex-direction: column;
   justify-content: stretch;
   align-items: stretch
}

.ProductView .InfoBox .DayArea .DayItem {
}

.ProductView .InfoBox .DayArea .DayItemArea:last-child {
   margin-right: 0
}

.ProductView .InfoBox .DayArea .DayItem input {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   z-index: 999;
   font-size: 0;
   cursor: pointer
}

.ProductView .InfoBox .DayArea .DayItem span:nth-child(1) {
   position: relative;
   z-index: 1;
   font-size: 13px;
   font-weight: 600;
   line-height: 20px
}

.ProductView .InfoBox .DayArea .DayItem span:nth-child(2) {
   font-size: 14px;
   font-weight: 400;
   text-align: center
}

.ProductView .InfoBox .DayArea .DayItem span:nth-child(3) {
   font-size: 14px;
   font-weight: 400
}

.ProductView .InfoBox .DayArea .DayItem:hover {
}

.ProductView .InfoBox .DayArea .DayItem.Active {
}

.ProductView .InfoBox .DayArea .DayItem.Disabled {
   border: 1px solid #c6cfd3;
   background: #d6dce0;
   color: #999;
   pointer-events: none
}

.ProductView .InfoBox .DayArea .DayItem.clickDisabled {
   border: 1px solid #c6cfd3;
   background: #d6dce0;
   color: #999
}

.ProductView .InfoBox .DayArea.Error .DayItemArea>.DayItem {
   border: 1px solid red;
   color: red
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select {
   background-size: 14px;
   -webkit-appearance: none;
   -moz-appearance: none
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea {
   margin-top: 10px;
   height: 0;
   display: block;
   overflow: hidden;
   transition: all .2s ease-in
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Show {
   height: 32px;
   transition: all .2s ease-in
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Show.Multiple {
   display: flex;
   gap: 7px
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Show.Multiple select {
   text-align: left
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select {
   background-color: #51b549!important;
   color: #fff;
   -webkit-border-radius: 4px;
   -webkit-background-clip: padding-box;
   -moz-border-radius: 4px;
   -moz-background-clip: padding;
   border-radius: 4px;
   background-clip: padding-box;
   width: 100%;
   height: 32px;
   border: none;
   padding: 5px;
   font-size: 12px;
   text-align: center
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Error select {
   background-color: red!important;
   border: 1px solid #e64e41
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select:focus {
   outline: none
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select option {
   padding: 5px 0
}

.ProductView .InfoBox .DayArea .ErrorText {
   display: none
}

.ProductView .InfoBox .DayArea.Error .ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block
}

.ProductView .InfoBox .HourArea {
   width: 100%;
   margin-bottom: 5px;
   display: none;
   position: relative;
   z-index: 0
}

.ProductView .InfoBox .HourArea.Active {
   display: inline-block
}

.ProductView .InfoBox .HourArea .HourItem {
}

.ProductView .InfoBox .HourArea .HourItem:hover {
}

.ProductView .InfoBox .HourArea .HourItem.Active {
}

.ProductView .InfoBox .HourArea .HourItem:nth-child(+4n) {
   margin-right: 0
}

.ProductView .InfoBox .HourArea.Error .HourItem {
   border: 1px solid red;
   color: red
}

.ProductView .InfoBox .HourArea .ErrorText {
   display: none
}

.ProductView .InfoBox .HourArea.Error .ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block
}

.ProductView .InfoBox .LastHourArea {
   width: 100%;
   position: relative;
   z-index: 0;
   padding: 8px;
   background: #fffbda;
   border: 1px solid #f5f2d0;
   border-radius: 4px;
   margin-bottom: 15px
}

.ProductView .InfoBox .LastHourArea .Timer {
   width: 100%;
   z-index: 0
}

.ProductView .InfoBox .LastHourArea .Timer .Text {
   width: 100%;
   margin-bottom: 5px;
   z-index: 0;
   display: flex;
   align-items: center;
   justify-content: center
}

.ProductView .InfoBox .LastHourArea .Timer svg {
   width: 28px;
   margin-bottom: 5px;
   position: relative;
   z-index: 0;
   margin-right: 10px
}

.ProductView .InfoBox .LastHourArea .Timer span {
   width: 100%;
   position: relative;
   z-index: 0;
   font-size: 14px
}

.ProductView .InfoBox .LastHourArea .Proggress {
   width: 100%;
   position: relative;
   background: #ddd9af;
   height: 10px;
   border-radius: 12px
}

.ProductView .InfoBox .LastHourArea .Proggress span {
   background: red;
   height: 10px;
   position: absolute;
   left: 0;
   top: 0;
   border-radius: 12px;
   width: initial
}

.ProductView .InfoBox .Design {
   width: 100%;
   margin: 12px 0;
   display: block
}

.ProductView .InfoBox .Design .InputItem {
   width: 100%;
   margin-bottom: 14px
}

.ProductView .InfoBox .Design .InputItem .Title {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center
}

.ProductView .InfoBox .Design .InputItem .Title i {
   width: 20px;
   font-size: 20px;
   margin-right: 5px;
   text-align: center
}

.ProductView .InfoBox .Design .InputItem .Title span {
   width: 100%;
   font-size: 16px
}

.ProductView .InfoBox .Design .InputItem .Info {
   width: 100%;
   padding: 0;
   border: 0;
   font-size: 13px;
   color: #5f6b70;
   margin-top: 4px;
   margin-bottom: 5px
}

.ProductView .InfoBox .Design .InputItem .Input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 4px;
   position: relative
}

.ProductView .InfoBox .Design .InputItem .Input input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 10px;
   outline: none
}

.ProductView .InfoBox .Design .InputItem .Input.Error input {
   border: 1px solid #ff11003d
}

.ProductView .InfoBox .Design .InputItem .Input .ErrorText {
   display: none;
   width: initial;
   color: red;
   font-size: 12px
}

.ProductView .InfoBox .Design .InputItem .Input.Error .ErrorText {
   display: flex;
   justify-content: flex-start
}

.ProductView .InfoBox .Design .InputItem .Input span {
   width: initial;
   font-size: 12px;
   text-align: right;
   color: #585858;
   padding: 2px 0 0;
   justify-content: flex-end
}

.ProductView .InfoBox .CaseList {
   width: 100%;
   margin: 12px 0;
   display: flex;
   flex-direction: column;
   position: relative;
   padding: 0 20px
}

.ProductView .InfoBox .CaseList .owl-nav {
   width: 100%;
   display: flex;
   position: absolute;
   justify-content: space-between;
   margin: 0 -20px;
   height: 100%;
   align-items: center;
   z-index: -1
}

.ProductView .InfoBox .CaseList .owl-nav .owl-prev {
   width: 20px;
   font-size: 28px;
   text-align: left
}

.ProductView .InfoBox .CaseList .owl-nav .owl-next {
   width: 20px;
   font-size: 28px;
   text-align: right
}

.ProductView .InfoBox .CaseList .owl-dots {
   width: 100%;
   display: flex;
   flex-direction: row;
   gap: 2px
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot {
   width: 100%;
   background: #ccc;
   height: 1px
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot span {
   width: 100%
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot.active {
   background: #000
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot.active span {
   width: 100%;
   margin: 12px 0;
   display: flex
}

.ProductView .InfoBox .CaseList .Item {
   width: 100%;
   display: flex;
   align-items: center;
   margin-bottom: 5px;
   background: #e8edef;
   border: 1px solid #e8edef;
   padding: 5px;
   border-radius: 2px;
   cursor: pointer;
   margin-right: 8px;
   position: relative;
   flex-direction: column
}

.ProductView .InfoBox .CaseList .Item:hover {
   border-color: #c7d4d9
}

.ProductView .InfoBox .CaseList .Item.Active {
   border-color: #d5e0e5;
   background: #d5e0e5
}

.ProductView .InfoBox .CaseList .Item.Active::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 26px;
   color: #41c346;
   position: absolute;
   right: 10px;
   top: 10px
}

.ProductView .InfoBox .CaseList .Item:last-child {
   margin-right: 0
}

.ProductView .InfoBox .CaseList .Item .Btn {
   width: 100%;
   background: #b7c9d1;
   text-align: center;
   font-size: 13px;
   padding: 4px 0;
   border-radius: 2px;
   margin-top: 5px;
   cursor: pointer
}

.ProductView .InfoBox .CaseList .Item.Active .Btn {
   background: #42c347;
   color: #fff
}

.ProductView .InfoBox .CaseList .Item .Product {
   display: flex;
   width: 100%;
   flex-direction: row;
   align-content: center;
   justify-content: center;
   align-items: flex-start
}

.ProductView .InfoBox .CaseList .Item .Product .Photo {
   width: 35px;
   float: left;
   margin-right: 10px;
   flex: none
}

.ProductView .InfoBox .CaseList .Item .Product .Photo img {
   height: 40px;
   border-radius: 2px;
   display: block
}

.ProductView .InfoBox .CaseList .Item .Product .Info {
   width: 100%;
   display: flex;
   line-height: 22px;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
   align-content: center;
   padding: 4px;
   margin: 0
}

.ProductView .InfoBox .CaseList .Item .Product .Info span:nth-child(1) {
   width: 100%;
   line-height: 16px;
   font-size: 12px;
   font-weight: 600
}

.ProductView .InfoBox .CaseList .Item .Product .Info span:nth-child(2) {
   font-weight: 600;
   color: #00bcd4;
   font-size: 11px;
   line-height: 13px
}

.ProductView .InfoBox .PayInformation {
}

.ProductView .InfoBox .PayInformation .IconList {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

.ProductView .InfoBox .PayInformation .IconList .Item {
   display: flex;
   width: 10%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   overflow: hidden;
   margin-right: 5px;
   padding: 1px
}

.ProductView .InfoBox .PayInformation .IconList .Item img {
   width: 100%
}

.ProductView .InfoBox .PayInformation .Info {
   display: flex;
   align-content: center;
   align-items: center;
   border: 0
}

.ProductView .InfoBox .PayInformation .Info i {
   display: flex;
   font-size: 14px;
   margin-right: 5px
}

.ProductView .InfoBox .PayInformation .Info span {
   display: flex;
   font-size: 13px
}

.ProductViewFeatures {
}

.ProductViewFeatures .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   margin-bottom: 20px
}

.ProductViewSuggets {
   width: 100%;
   display: flex;
   border: 1px solid #f2ecec;
   border-left: 0;
   border-right: 0;
   padding: 20px 0;
   margin-bottom: -1px;
   position: relative;
   z-index: 1
}

.ProductViewSuggets .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   margin-bottom: 20px
}

.ProductViewSuggets .View {
   width: 100%;
   padding: 0;
   margin: 0px -16px 0px -16px;
}

.ProductViewSuggets .View .ProductItem {
   width: 20%
}

.ProductViewComment {
   width: 100%;
   display: flex;
   padding: 20px 0;
   margin-bottom: -1px;
   z-index: 1;
   position: relative
}

.ProductViewComment .Container {
   width: 890px!important;
   margin: 0 auto
}

.ProductViewComment .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   text-align: center
}

.ProductViewComment .Star {
   display: flex;
   justify-content: center;
   align-items: center;
   margin-bottom: 10px;
   flex-direction: column
}

.ProductViewComment .Star .Btn {
   background: #ff5722;
   color: #fff;
   padding: 6px 20px;
   border-radius: 4px
}

.ProductViewComment .Star .Point {
   display: flex
}

.ProductViewComment .Star .Point .Star {
   color: #ccc
}

.ProductViewComment .Star .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductViewComment .Star .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductViewComment .Star .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1
}

.ProductViewComment .View {
   width: 100%;
   border: 1px solid #f2ecec;
   padding: 15px
}

.ProductViewComment .View .Blank {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   padding: 10px 0;
   cursor: pointer
}

.ProductViewComment .View .Blank span {
   width: 100%;
   text-align: center
}

.ProductViewComment .View .Blank .Btn {
   background: #ff5722;
   color: #fff;
   padding: 8px 30px;
   border-radius: 4px;
   margin-top: 7px
}

.ProductViewComment .View .Blank .Btn:hover {
   background: #ff7347
}

.ProductViewComment .View .Item {
   width: 100%;
   border-bottom: 1px solid #f2ecec;
   margin-bottom: 20px
}

.ProductViewComment .View .Item:last-child {
   border-bottom: 0;
   margin-bottom: 0
}

.ProductViewComment .View .Item .Info {
   width: 100%
}

.ProductViewComment .View .Item .Info .Name {
   width: 100%
}

.ProductViewComment .View .Item .Info .Date {
   width: 100%;
   font-size: 12px;
   margin-bottom: 4px
}

.ProductViewComment .View .Item .Info .Point {
   width: 100%;
   display: flex
}

.ProductViewComment .View .Item .Info .Point .Star {
   color: #919191
}

.ProductViewComment .View .Item .Info .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductViewComment .View .Item .Info .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #ffc107
}

.ProductViewComment .View .Item .Info .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ccc;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1
}

.ProductViewComment .View .Item .Comment {
   width: 100%;
   font-size: 14px
}

.ProductViewLast {
   width: 100%;
   display: flex;
   border: 1px solid #f2ecec;
   border-left: 0;
   border-right: 0;
   padding: 20px 0;
   margin-bottom: -1px;
   display: none;
   position: relative;
   z-index: 1
}

.ProductViewLast .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   margin-bottom: 20px
}

.ProductViewLast .View {
   width: 100%;
   padding: 0;
}

.ProductViewLast .View .ProductItem {
   width: 20%
}

.special-select {
}

.special-select li {
}

.special-select li:nth-child(+2n) {
}

.special-select>li:last-child {
   margin-right: 0
}

.special-select li .ico2 {
}

.special-select li>.special-text {
   font-size: 14px;
   width: 100%
}

.BagView {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   padding: 15px 0
}

.BagView .nonBag {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   padding: 15px 0;
   margin: 40px 0;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.BagView .nonBag svg {
   height: 150px;
   fill: #4caf50;
   width: 100%
}

.BagView .nonBag span {
   width: 100%;
   padding: 15px 0;
   text-align: center;
   font-size: 22px
}

.BagView .nonBag .Btn {
   background: #4caf50;
   color: #fff;
   padding: 10px 20px;
   border-radius: 4px;
   margin-top: 40px;
   cursor: pointer
}

.BagView>.Title {
   width: 100%;
   margin-bottom: 20px
}

.BagView>.Title .Text {
   width: 100%;
   font-size: 18px;
   font-weight: 500
}

.BagView>.Title .SubText {
   width: 100%;
   font-size: 14px
}

.BagView>.Title .SubText span {
   width: 100%
}

.BagView .List {
   display: flex;
   flex-direction: column;
   width: 70%
}

.BagView .List .nonDelivered {
   display: flex;
   background: #ff98002e;
   color: #000;
   padding: 20px;
   flex-direction: column;
   margin-bottom: 15px
}

.BagView .List .nonDelivered .Text {
   display: flex;
   margin-bottom: 7px
}

.BagView .List .nonDelivered .Product {
   display: flex;
   flex-direction: column;
   margin-bottom: 10px
}

.BagView .List .nonDelivered .Product span {
   display: flex;
   font-weight: 600
}

.BagView .List .nonDelivered .Btn {
   display: flex;
   cursor: pointer;
   text-decoration: underline
}

.BagView .List .productItem.Extra {
   display: none
}

.BagView .List .productItem {
   width: 100%;
   background: #eaeeefcc;
   border: 1px solid #e7edef;
   padding: 16px;
   border-radius: 4px;
   margin-bottom: 15px;
   position: relative
}

.BagView .List .productItem.ExtraPro {
   z-index: 10
}

.BagView .List .productItem .Name {
   width: 100%;
   font-size: 16px;
   margin-bottom: 10px;
   cursor: pointer;
   color: #000;
   display: flex;
   font-weight: 700
}

.BagView .List .productItem .Btn.ProductDelete {
   position: absolute;
   right: 7px;
   top: 12px;
   font-size: 18px;
   cursor: pointer
}

.BagView .List .productItem .Btn.ProductDelete:hover {
   color: #ba1e7d
}

.BagView .List .productItem .Product {
   width: 100%;
   display: flex
}

.BagView .List .productItem .Product .ProductArea {
   width: 60%;
   display: flex;
   flex: none
}

.BagView .List .productItem .Product .Alert {
   width: 100%;
   border: 1px solid red;
   color: red;
   padding: 4px;
   margin: 5px;
   border-radius: 4px;
   font-size: 13px;
   text-align: center;
   display: none
}

.BagView .List .productItem .Product .Photo {
   width: 120px;
   margin-right: 15px
}

.BagView .List .productItem .Product .Photo img {
   width: 100%
}

.BagView .List .productItem .Product .Info {
   width: 90%;
   display: flex
}

.BagView .List .productItem .Product .Info .Item {
   width: 100%;
   font-size: 13px;
   display: flex;
   justify-content: flex-start;
   align-items: flex-start;
   flex-direction: column
}

.BagView .List .productItem .Product .Info .Item span:nth-child(1) {
   font-weight: 500;
   display: flex
}

.BagView .List .productItem .Product .Info .Item span:nth-child(2) {
   display: flex;
   font-size: 14px
}

.BagView .List .productItem .Product .Info .Item span .Delivery {
   background: #41c346;
   color: #fff;
   border-radius: 2px;
   padding: 2px 4px;
   font-size: 14px;
   display: none
}

.BagView .List .productItem .Product .Info .Item.Case {
   width: 100%
}

.BagView .List .productItem .Product .Info .Item.Case span {
   width: 100%;
   font-size: 12px;
   color: #ff5722
}

.BagView .List .productItem .Product .Info .Btn.Design {
   background: #b7cdd5;
   display: flex;
   color: #175f78;
   padding: 2px 4px;
   border-radius: 3px;
   align-items: center;
   justify-content: flex-start;
   cursor: pointer;
   margin-top: 8px;
   width: fit-content
}

.BagView .List .productItem .Product .Info .Btn.Design i {
   margin-right: 4px
}

.BagView .List .productItem .Product .Info .Btn.Design:hover {
   background: #1b6e8d;
   color: #fff
}

.BagView .List .productItem .Product .Info .Item.Price {
   width: 100%;
   margin-top: 5px;
   display: flex;
   flex-direction: column
}

.BagView .List .productItem .Product .Info .Item.Price .OldPrice {
   width: 100%;
   font-size: 16px;
   color: #707070;
   text-decoration: line-through
}

.BagView .List .productItem .Product .Info .Item.Price .OldPrice kr {
   width: 100%;
   font-size: 11px
}

.BagView .List .productItem .Product .Info .Item.Price .SalePrice {
   width: 100%;
   font-size: 18px;
   font-weight: 600;
   color: #34495e
}

.BagView .List .productItem .Product .Info .Item.Price .SalePrice kr {
   width: 100%;
   font-size: 12px
}

.BagView .List .productItem .Product .InfoArea {
   width: 100%
}

.BagView .List .productItem .Product .Other {
   width: 40%;
   flex: none;
   display: flex;
   gap: 15px
}

.BagView .List .productItem .Product .ExtraProduct {
   width: 100%;
   display: flex;
   margin: 0
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center;
   padding: 10px 5px
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct.Active {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct .Item {
   width: fit-content;
   margin: 2px;
   border-radius: 2px;
   border: 1px solid #eef1f2;
   padding: 2px
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct .Item img {
   height: 35px
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct:hover {
   box-shadow: 0 0 0 1px #0000007a
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct span {
   width: 100%;
   padding: 0 20px;
   font-size: 12px;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct span img {
   width: 14%
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct.Active span {
   display: none
}

.BagView .List .productItem .Product .CardMessage {
   width: 50%;
   display: flex;
   margin: 0 10px
}

.BagView .List .productItem .Product .CardMessage .AddMessage {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center
}

.BagView .List .productItem .Product .CardMessage .AddMessage.nonMessage {
   display: flex
}

.BagView .List .productItem .Product .CardMessage .AddMessage.Message {
   display: none
}

.BagView .List .productItem .Product .CardMessage.Active .AddMessage.nonMessage {
   display: none
}

.BagView .List .productItem .Product .CardMessage.Active .AddMessage.Message {
   display: flex
}

.BagView .List .productItem .Product .CardMessage .AddMessage:hover {
   box-shadow: 0 0 0 1px #0000007a
}

.BagView .List .productItem .Product .CardMessage .AddMessage span {
   width: 100%;
   padding: 0 20px;
   font-size: 14px;
   display: flex;
   justify-content: center;
   align-items: center
}

.BagView .List .productItem .Product .CardMessage .AddMessage span img {
   width: 30%
}

.BagView .List .productItem .Product .CardMessage .AddMessage .Icon {
   font-size: 22px;
   color: #25a12a
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList {
   display: flex;
   align-items: center;
   justify-content: center;
   margin-top: 15px
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit {
   font-size: 14px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 4px 0 0 4px;
   padding: 5px 10px;
   width: 50%
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit:hover {
   background: #c1cfd3;
   color: #000
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete {
   font-size: 14px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 0 4px 4px 0;
   padding: 5px 10px;
   width: 50%;
   margin-left: 1px
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete:hover {
   background: red;
   color: #fff
}

.BagView .List .productItem .CommentArea {
   width: 100%;
   display: flex;
   flex-direction: column;
   padding: 24px;
   background: #ffffffc2;
   border: 1px solid #d0dce0;
   margin: 10px 0;
   border-radius: 4px
}

.BagView .List .productItem .CommentArea .FormGroup {
   width: 100%;
   margin-bottom: 8px;
   position: relative
}

.BagView .List .productItem .CommentArea .FormGroup:last-child() {
   width: 100%;
   margin-bottom: 0;
   position: relative
}

.BagView .List .productItem .CommentArea .FormGroup svg {
   position: absolute;
   height: 20px;
   top: 12px;
   left: 10px;
   fill: #4caf50
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow {
   margin: 0;
   cursor: pointer;
   display: none
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage.Active .MessageArrow {
   display: block
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow.fa-chevron-left {
   position: absolute;
   left: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow.fa-chevron-right {
   position: absolute;
   right: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow.Disabled {
   color: #ababab
}

.BagView .List .productItem .CommentArea .FormGroup select {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   background: #fff;
   font-size: 16px
}

.BagView .List .productItem .CommentArea .FormGroup textarea {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   min-height: 120px;
   resize: none;
   background: #fff;
   font-size: 16px;
   font-family: inherit;
   line-height: 22px
}

.BagView .List .productItem .CommentArea .FormGroup input {
   width: 100%;
   border: 1px solid #ddd;
   padding: 12px 10px;
   border-radius: 4px;
   outline: none;
   font-size: 16px;
   background: #fff
}

.BagView .List .productItem .CommentArea .FormGroup .Btn {
   border: 0;
   background: #4caf50;
   color: #fff;
   padding: 10px 20px;
   border-radius: 4px;
   margin: 10px 0;
   cursor: pointer;
   font-size: 16px
}

.BagView .List .productItem .CommentArea .FormGroup .Btn:hover {
   background: #3c9f40
}

.BagView .List .productItem .ExtraProductList {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   height: 0;
   opacity: 0;
   overflow: hidden;
   transition: all .2s
}

.BagView .List .productItem .ExtraProductList .Title {
   display: none
}

.BagView .List .productItem .ExtraProductList .List {
   width: 100%;
   display: flex;
   flex-direction: row;
   padding-top: 60px;
   flex-wrap: wrap;
   align-content: flex-start
}

.BagView .List .productItem .ExtraProductList.Active {
   height: 100%;
   opacity: 1;
   overflow: visible;
   transition: all .2s;
   padding: 20px 0
}

.BagView .List .productItem .ExtraProductList .SubProduct {
   width: calc( 20% - 8px);
   display: flex;
   padding: 10px;
   background: #fff;
   border-radius: 4px;
   margin-right: 10px;
   margin-bottom: 10px;
   border: 1px solid #dee0e0;
   flex-direction: column;
   align-items: center;
   position: relative;
   justify-content: space-between
}

.BagView .List .productItem .ExtraProductList .SubProduct:nth-child(+5n) {
   margin-right: 0
}

.BagView .List .productItem .ExtraProductList .SubProduct img {
   width: 100%;
   display: flex;
   line-height: 200px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Name {
   width: 100%;
   display: inline-block;
   font-size: 14px;
   font-weight: 500;
   text-align: center;
   text-decoration: none;
   margin: 10px 0;
   height: 28px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Price {
   width: 100%;
   display: block;
   text-align: center;
   font-weight: 600;
   color: #34495e;
   margin-bottom: 10px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Btn.AddExtra {
   background: #34495e;
   color: #fff;
   padding: 4px 5px;
   border-radius: 2px;
   font-size: 16px;
   cursor: pointer
}

.BagView .List .productItem .ExtraProductList .SubProduct .Btn.AddExtra:hover {
   background: #26394c
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan {
   font-size: 12px;
   cursor: pointer;
   display: none
}

.BagView .List .productItem .ExtraProductList .SubProduct.Active .Quan {
   display: flex
}

.BagView .List .productItem .ExtraProductList .SubProduct.Active .Btn.AddExtra {
   display: none
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan .BtnMinus {
   line-height: 30px;
   width: 30px;
   text-align: center;
   cursor: pointer
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan .BtnValue {
   padding: 3px;
   border: 1px solid #ccc;
   width: 25px;
   text-align: center;
   border-radius: 3px;
   position: relative;
   font-size: 18px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan .BtnPlus {
   line-height: 30px;
   width: 30px;
   text-align: center;
   cursor: pointer
}

.BagView .List .productItem .ExtraProductList .SubProduct.Loading {
   pointer-events: none
}

.BagView .List .productItem .ExtraProductList .SubProduct.Loading .Quan .BtnValue::before {
   content: "";
   background: #34495e url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 30px;
   border-radius: 4px;
   position: absolute;
   left: -1px;
   bottom: -1px;
   z-index: 11;
   background-position: 50%;
   background-size: cover
}

.BagView .List .AddressItem {
   width: 100%;
   background: #eaeeefcc;
   border: 1px solid #e7edef;
   padding: 16px;
   border-radius: 4px;
   margin-bottom: 15px
}

.BagView .List .AddressItem .OtherSelect {
   width: 100%;
   display: flex
}

.BagView .List .AddressItem .OtherSelect .Address {
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   background: #fff;
   padding: 3px 8px 3px 3px;
   font-size: 16px;
   cursor: pointer;
   display: flex;
   margin-right: 5px;
   align-items: center
}

.BagView .List .AddressItem .OtherSelect .Address::before {
   content: "";
   margin-right: 5px;
   width: 12px;
   height: 12px;
   border-radius: 100px;
   background: #d5d5d5;
   text-align: center;
   line-height: 17px
}

.BagView .List .AddressItem .OtherSelect .Address:hover {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .AddressItem .OtherSelect .Address.Active {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .AddressItem .OtherSelect .Address.Active::before {
   background: #4caf50
}

.BagView .List .AddressItem .Title {
   width: 100%;
   border-bottom: 1px solid #dfdfdf;
   padding-bottom: 10px;
   margin-bottom: 10px;
   display: flex;
   justify-content: space-between
}

.BagView .List .AddressItem .Title .Location {
   width: 100%;
   display: flex;
   flex-direction: column
}

.BagView .List .AddressItem .Title .Location span:nth-child(1) {
   width: 100%
}

.BagView .List .AddressItem .Title .Location span:nth-child(2) {
   width: 100%;
   font-size: 13px;
   color: #208b24
}

.BagView .List .AddressItem .Title .Productlist {
   width: max-content;
   display: flex;
   justify-content: flex-end
}

.BagView .List .AddressItem .Title .Productlist span {
   display: flex;
   background: #fff;
   padding: 2px;
   margin-left: 5px
}

.BagView .List .AddressItem .Title .Productlist span img {
   width: 30px;
   height: initial
}

.BagView .List .AddressItem .Form {
   width: 100%;
   display: flex;
   padding: 10px 0;
   justify-content: space-between
}

.BagView .List .AddressItem .Form .Left {
   width: 50%;
   padding-right: 10px
}

.BagView .List .AddressItem .Form .Right {
   width: 50%;
   padding-left: 10px
}

.BagView .List .AddressItem .Form .FormGroup {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.BagView .List .AddressItem .Form .FormGroup i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .AddressItem .Form .FormGroup span.Text {
   display: flex;
   position: absolute;
   left: 45px;
   top: 23px;
   z-index: 0;
   font-size: 16px;
   font-weight: 400;
   color: #727272
}

.BagView .List .AddressItem .Form .FormGroup .InputArea {
   background: #fff
}

.BagView .List .AddressItem .Form .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 20px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .AddressItem .Form .FormGroup textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 22px 14px 0 43px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 16px;
   font-weight: 400;
   font-family: inherit
}

.BagView .List .AddressItem .Form .FormGroup span.ErrorText {
   display: none
}

.BagView .List .AddressItem .Form .FormGroup.Ok i {
   color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Ok input {
   border-color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Ok textarea {
   border-color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px;
   color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px
}

.BagView .List .AddressItem .Form .FormGroup.Error i {
   color: red
}

.BagView .List .AddressItem .Form .FormGroup.Error input {
   border-color: red
}

.BagView .List .AddressItem .Form .FormGroup.Error textarea {
   border-color: red
}

.BagView .List .AddressItem .Form .FormGroup.Error span.Text {
   color: red
}

.BagView .List .AddressItem .Form .FormGroup.Error span.ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #eef1f2
}

.BagView .List .Invoice {
   width: 100%;
   background: #eaeeefcc;
   border: 1px solid #e7edef;
   padding: 16px;
   border-radius: 4px;
   margin-bottom: 15px
}

.BagView .List .Invoice .OtherSelect {
   width: 100%;
   display: flex
}

.BagView .List .Invoice .OtherSelect .Address {
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   background: #fff;
   padding: 3px 8px 3px 3px;
   font-size: 11px;
   cursor: pointer;
   display: flex;
   margin-right: 5px;
   align-items: center
}

.BagView .List .Invoice .OtherSelect .Address::before {
   content: "";
   margin-right: 5px;
   width: 12px;
   height: 12px;
   border-radius: 100px;
   background: #d5d5d5;
   text-align: center;
   line-height: 17px
}

.BagView .List .Invoice .OtherSelect .Address:hover {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .OtherSelect .Address.Active {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .OtherSelect .Address.Active::before {
   background: #4caf50
}

.BagView .List .Invoice .Btn.BtnLogin {
   color: #227625;
   font-weight: 500;
   position: relative;
   width: fit-content;
   border-radius: 30px;
   border: 1px solid #4bae4f;
   padding: 5px 10px;
   background: #fff;
   cursor: pointer
}

.BagView .List .Invoice .Btn.BtnLogin>i {
   margin-right: 6px;
   font-size: 16px
}

.BagView .List .Invoice .Btn.BtnLogin:hover {
   background: #4bae4f;
   color: #fff
}

.BagView .List .Invoice .Btn.BtnLogin:hover .Wind {
   display: block
}

.BagView .List .Invoice .Title {
   width: 100%;
   border-bottom: 1px solid #dfdfdf;
   padding-bottom: 10px;
   margin-bottom: 10px
}

.BagView .List .Invoice .Title .Location {
   width: 100%;
   display: flex;
   flex-direction: column
}

.BagView .List .Invoice .Title .Location span:nth-child(1) {
   width: 100%;
   font-weight: 500;
   color: #000
}

.BagView .List .Invoice .Title .Location span:nth-child(2) {
   width: 100%;
   font-size: 14px;
   color: #444
}

.BagView .List .Invoice .Title .Productlist {
   width: 100%
}

.BagView .List .Invoice .Form {
   width: 100%;
   display: flex;
   padding: 10px 0;
   justify-content: space-between;
   flex-direction: column
}

.BagView .List .Invoice .Form .Left {
   width: 50%;
   padding-right: 10px
}

.BagView .List .Invoice .Form .Right {
   width: 50%;
   padding-left: 10px
}

.BagView .List .Invoice .Form .BtnList {
   width: 100%
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice {
   background: 0 0;
   border: 0;
   margin: 0;
   padding: 0;
   text-decoration: underline;
   cursor: pointer;
   margin-top: 10px;
   margin-bottom: 10px;
   font-size: 14px
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice:hover {
   text-decoration: none
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice:after {
   content: "\f078";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #464646
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice.Active:after {
   content: "\f077";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

.BagView .List .Invoice .Form .InvoiceInfo {
   width: 100%;
   display: none
}

.BagView .List .Invoice .Form .InvoiceInfo.Active {
   display: block
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected {
   width: 100%;
   display: flex;
   margin-bottom: 20px
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType {
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   background: #fff;
   padding: 6px 12px;
   font-size: 16px;
   cursor: pointer;
   display: flex;
   margin-right: 5px;
   align-items: center
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType::before {
   content: "";
   margin-right: 5px;
   width: 12px;
   height: 12px;
   border-radius: 100px;
   background: #d5d5d5;
   text-align: center;
   line-height: 17px
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType:hover {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType.Active {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType.Active::before {
   background: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice {
   width: 65%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.BagView .List .Invoice .Form .FormInvoice i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .Invoice .Form .FormInvoice span.Text {
   display: flex;
   position: absolute;
   left: 16px;
   top: 23px;
   z-index: 0;
   font-size: 16px;
   font-weight: 400;
   color: #727272
}

.BagView .List .Invoice .Form .FormInvoice .InputArea {
   background: #fff
}

.BagView .List .Invoice .Form .FormInvoice input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 0;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Invoice .Form .FormInvoice textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 22px 14px 0;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 16px;
   font-weight: 400;
   font-family: inherit
}

.BagView .List .Invoice .Form .FormInvoice span.ErrorText {
   display: none
}

.BagView .List .Invoice .Form .FormInvoice.Ok i {
   color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Ok input {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Ok textarea {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px;
   color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px
}

.BagView .List .Invoice .Form .FormGroup.Error i {
   color: red
}

.BagView .List .Invoice .Form .FormGroup.Error input {
   border-color: red
}

.BagView .List .Invoice .Form .FormGroup.Error textarea {
   border-color: red
}

.BagView .List .Invoice .Form .FormGroup.Error span.Text {
   color: red
}

.BagView .List .Invoice .Form .FormGroup.Error span.ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #eef1f2
}

.BagView .List .Invoice .Form .FormGroup {
   width: 65%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.BagView .List .Invoice .Form .FormGroup i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .Invoice .Form .FormGroup span.Text {
   display: flex;
   position: absolute;
   left: 45px;
   top: 23px;
   z-index: 0;
   font-size: 16px;
   font-weight: 400;
   color: #727272
}

.BagView .List .Invoice .Form .FormGroup .InputArea {
   background: #fff
}

.BagView .List .Invoice .Form .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 20px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Invoice .Form .FormGroup textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 22px 14px 0 43px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 16px;
   font-weight: 400;
   font-family: inherit
}

.BagView .List .Invoice .Form .FormGroup span.ErrorText {
   display: none
}

.BagView .List .Invoice .Form .FormGroup.Ok i {
   color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Ok input {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Ok textarea {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px;
   color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px
}

.BagView .List .Pay {
   width: 100%;
   border-radius: 4px;
   margin-bottom: 15px
}

.BagView .List .Pay .PayList {
   width: 100%;
   display: flex;
   align-content: flex-start
}

.BagView .List .Pay .PayList .PayItem {
   background: #ededed;
   padding: 10px;
   border: 2px solid #e1e1e1;
   border-radius: 4px 4px 0 0;
   margin-right: 2px;
   font-weight: 400;
   position: relative;
   z-index: 0;
   border-bottom: 0;
   cursor: pointer
}

.BagView .List .Pay .PayList .PayItem:hover {
   background: #ededed91
}

.BagView .List .Pay .PayList .PayItem.Active {
   background: #fff;
   color: #41c346;
   border-color: #41c346;
   border-bottom-color: #fff;
   box-shadow: 0 2px 0 0 #fff;
   z-index: 1
}

.BagView .List .Pay .Form {
   width: 100%;
   position: relative;
   z-index: 0;
   margin-top: -2px
}

.BagView .List .Pay .Form .PayView {
   display: none;
   width: 100%
}

.BagView .List .Pay .Form .PayView.Active {
   display: block;
   border-top: 2px solid #41c346;
   padding: 25px 0;
   display: flex
}

.BagView .List .Pay .Form .PayView .FormArea {
   width: 100%
}

.BagView .List .Pay .Form .PayView .FormGroup {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff;
   display: flex
}

.BagView .List .Pay .Form .PayView .FormGroup i {
   position: absolute;
   left: 13px;
   top: 13px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .Pay .Form .PayView .FormGroup span.Text {
   width: 40%;
   display: flex;
   font-weight: 500;
   color: #484848;
   flex: none;
   align-items: center
}

.BagView .List .Pay .Form .PayView .FormGroup .InputArea {
   background: #fff
}

.BagView .List .Pay .Form .PayView .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 10px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 1px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Pay .Form .PayView .FormGroup.Small input {
   width: 140px
}

.BagView .List .Pay .Form .PayView .FormGroup.Small select {
   width: 140px
}

.BagView .List .Pay .Form .PayView .FormGroup.Small select:nth-child(2) {
   margin-right: 10px
}

.BagView .List .Pay .Form .PayView .FormGroup select {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 10px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 1px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Pay .Form .PayView .FormGroup span.ErrorText {
   display: none
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok i {
   color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok input {
   border-color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok textarea {
   border-color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 11px;
   color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 11px
}

.BagView .List .Pay .Form .PayView .FormGroup.Error i {
   color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error input {
   border-color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error select {
   border-color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error textarea {
   border-color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error span.Text {
   color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error span.ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #f5f5f5
}

.BagView .List .Pay .Form .PayView .Account {
   width: 100%;
   padding: 15px;
   border: 1px solid #eaeeef;
   border-radius: 4px;
   display: none
}

.BagView .List .Pay .Form .PayView .Account.Active {
   display: block
}

.BagView .List .Pay .Form .PayView .Account .Item {
   width: 100%;
   display: flex;
   margin-bottom: 8px;
   align-items: center
}

.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(1) {
   width: 100px;
   flex: none;
   font-weight: 500;
   font-size: 11px
}

.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(2) {
   width: 5px;
   flex: none
}

.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(3) {
   width: 80%;
   font-size: 14px
}

.BagView .List .Pay .Form .PayView .PayInfo {
   width: 100%;
   display: flex;
   flex-direction: column
}

.BagView .List .Pay .Form .PayView .PayInfo .Text {
   width: 100%;
   margin-top: 20px
}

.BagView .List .Pay .Form .PayView .InstallmentArea {
   width: 40%;
   display: none
}

.BagView .List .Pay .Form .BtnList {
   width: 100%
}

.BagView .List .Pay .Form .BtnList .Contract {
   width: 100%;
   font-size: 14px
}

.BagView .List .Pay .Form .BtnList .Contract span {
   font-weight: 700
}

.BagView .List .Pay .Form .BtnList .Btn.PayBtn {
   font-weight: 500;
   background: #41c346;
   padding: 11px 26px;
   font-size: 16px;
   color: #fff;
   border-radius: 7px;
   margin: 10px 0;
   width: fit-content;
   cursor: pointer
}

.BagView .List .Pay .Form .BtnList .Btn.PayBtn:hover {
   background: #2c9b30
}

.BagView .Addition {
   width: 30%;
   padding-left: 30px;
   display: flex;
   align-items: center;
   flex-direction: column
}

.BagView .Addition .BagTotalMobile {
   display: none
}

.BagView .Addition .Title {
   width: 100%;
   background: #e2e7e9b5;
   border-radius: 4px;
   padding-bottom: 12px
}

.BagView .Addition .Title .Text {
   width: 100%;
   font-weight: 600;
   text-align: center;
   padding: 10px 0
}

.BagView .Addition .Title .Item {
   width: calc(100% - 20px);
   padding: 6px;
   background: #fff;
   margin: 3px 10px;
   border-radius: 3px;
   display: flex;
   justify-content: space-between
}

.BagView .Addition .Title .Item span:nth-child(1) {
   width: 100%;
   color: #5c5c5c
}

.BagView .Addition .Title .Item span:nth-child(2) {
   width: 100%;
   text-align: right;
   font-weight: 500;
   font-size: 16px
}

.BagView .Addition .Title .Item.Total {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   border-bottom: 2px solid #41c346
}

.BagView .Addition .Title .Item.Total span:nth-child(1) {
   width: 100%;
   text-align: center;
   font-size: 22px;
   font-weight: 700
}

.BagView .Addition .Title .Item.Total span:nth-child(1) kr {
   font-size: 14px;
   font-weight: 700
}

.BagView .Addition .Title .Item.Total span:nth-child(2) {
   width: 100%;
   text-align: center
}

.BagView .Addition .Btn.BagResume {
   font-weight: 500;
   background: #41c346;
   padding: 11px 26px;
   font-size: 16px;
   color: #fff;
   border-radius: 4px;
   margin: 10px 0;
   width: fit-content;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%
}

.BagView .Addition .Btn.BagResume:hover {
   background: #2c9b30
}

.BagView .Addition .Btn.BagResume.Disabled {
   background: #f2f2f2;
   color: #919191;
   pointer-event: none
}

.BagView .Navi {
   width: 620px;
   display: flex;
   flex-direction: column;
   padding: 70px 0
}

.BagView .Navi .Line {
   height: 3px;
   background: #e9eeef;
   width: calc(100% - 105px);
   left: 35px;
   position: absolute;
   top: 10px;
   border-radius: 4px;
   margin-left: 20px;
   margin-right: 0
}

.BagView .Navi .Point {
   width: 100%;
   text-align: center
}

.BagView .Navi .Point:before {
   content: "";
   height: 22px;
   width: 22px;
   background: #e9eeef;
   border-radius: 100px;
   position: absolute;
   margin-left: -11px
}

.BagView .Navi .Point.Active:before {
   content: "\f192";
   background: #fff;
   color: #42c346;
   font-family: "font awesome 5 free";
   font-weight: 900;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1;
   font-size: 23px
}

.BagView .Navi .Point span {
   display: flex;
   font-size: 13px;
   width: 100%;
   align-items: center;
   justify-content: center;
   align-content: center;
   margin-top: 22px
}

.BagView .Area {
   padding: 0 28px;
   width: calc( 100% - 320px);
   margin: 70px 0
}

.BagView .Area .Title {
   width: 100%;
   display: flex;
   margin-bottom: 20px;
   font-size: 22px;
   font-weight: 500
}

.StatisView .Area .FaqSearch {
   width: 100%;
   display: flex;
   align-items: center;
   align-content: center;
   justify-content: center;
   margin-top: 30px;
   margin-bottom: 30px
}

.StatisView .Area .FaqSearch input {
   min-width: 420px;
   background: #fff;
   padding: 10px;
   border: 2px solid #f8f8f8;
   box-shadow: 0 0 0 4px #ededed;
   border-radius: 2px
}

.StatisView .Area .FaqTabList {
   width: 100%;
   display: flex;
   margin-bottom: 40px;
   justify-content: center
}

.StatisView .Area .FaqTabList .FaqTabItem {
   padding: 10px;
   border-radius: 2px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 2px;
   border: 1px solid #000;
   color: #000;
   cursor: pointer;
   font-weight: 600
}

.StatisView .Area .FaqTabList .FaqTabItem:hover {
   background: #efefef69
}

.StatisView .Area .FaqTabList .FaqTabItem.Active {
   border-color: #4caf50;
   color: #4caf50
}

.StatisView .Area .FaqQuestion {
   width: 100%;
   display: none;
   flex-direction: column;
   border-bottom: 1px solid #e9e9e9;
   color: #000
}

.StatisView .Area .FaqQuestion.Show {
   display: flex
}

.StatisView .Area .FaqQuestion:hover {
   width: 100%;
   color: #2a812d
}

.StatisView .Area .FaqQuestion.Active {
   width: 100%;
   color: #2a812d
}

.StatisView .Area .FaqQuestion .Title {
   width: 100%;
   padding: 6px;
   font-size: 14px;
   cursor: pointer;
   display: flex;
   margin-bottom: 2px;
   align-items: center;
   border-radius: 3px;
   border: 0
}

.StatisView .Area .FaqQuestion .Title::before {
   content: "\f067";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 11px;
   color: #000;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px
}

.StatisView .Area .FaqQuestion.Active .Title::before {
   content: "\f068";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #4caf50;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

.StatisView .Area .FaqQuestion .Answer {
   width: 100%;
   font-size: 14px;
   padding-left: 40px;
   display: none;
   transition: all .2s ease-in-out;
   overflow: auto;
   color: #000
}

.StatisView .Area .FaqQuestion.Active .Answer {
   display: block;
   height: auto;
   padding: 0 12px 10px;
   transition: all .6s ease-in-out
}

.StatusBar {
   display: flex;
   width: 100%;
   overflow: hidden;
   border-radius: 60px;
   padding: 1px
}

.StatusBar .Item {
   display: flex;
   flex-direction: column;
   position: relative;
   padding: 2px;
   -webkit-transform: skewX(-40deg);
   transform: skewX(-40deg);
   background: #cccfd7;
   border-radius: 3px;
   margin-right: 10px;
   width: 100%;
   text-align: center;
   overflow: hidden;
   cursor: pointer
}

.StatusBar .Item:hover {
   background: #b1b5c5
}

.StatusBar .Item:first-child {
   margin-left: -10px
}

.StatusBar .Item:last-child {
   margin-right: -9px
}

.StatusBar .Item span {
   padding: 5px;
   font-size: 13px;
   -webkit-transform: skewX(40deg);
   transform: skewX(40deg)
}

.Box {
   float: left;
   width: 100%;
   padding: 16px;
   border: 1px solid #e8e9e9;
   margin-bottom: 16px;
   border-radius: 6px;
   box-shadow: 1px 4px 45px -24px #00000059;
   position: relative;
   z-index: 1;
   background: #fff
}

.Box .BoxTitle {
   float: left;
   width: 100%;
   font-size: 19px;
   margin-bottom: 8px;
   font-weight: 400;
   color: #000
}

[Page=Errors] {
   background: #fbf3f2
}

[Page=Errors] .Container {
   display: flex;
   height: 100%;
   align-content: center;
   align-items: center
}

[Page=Errors] .Container .LeftArea {
   width: 100%;
   height: 620px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start
}

[Page=Errors] .Container .LeftArea .Title {
   width: 100%;
   font-size: 26px;
   font-weight: 700;
   color: red
}

[Page=Errors] .Container .LeftArea .Text {
   width: 80%;
   font-size: 14px;
   color: #444;
   margin-bottom: 30px
}

[Page=Errors] .Container .LeftArea .Navigator {
   width: 60%;
   display: flex;
   justify-content: space-between
}

[Page=Errors] .Container .LeftArea .Navigator .Step {
   width: 100%;
   height: 12px;
   background: #eddad7;
   position: relative
}

[Page=Errors] .Container .LeftArea .Navigator .Step .Point {
   width: 26px;
   height: 26px;
   border-radius: 100px;
   background: #e9ceca;
   margin-top: -8px;
   margin-left: -6px;
   display: flex
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Left .Point {
   left: 0
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Center .Point {
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Right {
   display: flex;
   width: 0;
   flex-direction: column
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Right .Point {
   flex: none
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Right .Name {
}

[Page=Errors] .Container .LeftArea .Navigator .Step .Name {
   width: 220px;
   font-size: 14px;
   font-weight: 600;
   padding-top: 8px;
   margin-left: -5px;
   flex: none;
   text-align: left
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Active {
   background: #4caf50
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Active .Point {
   background: #37913b
}

[Page=Errors] .Container .LeftArea .Navigator .Step.NextStep .Point {
   background: #ed3923
}

[Page=Errors] .Container .LeftArea .Navigator .Step .Point::before {
   content: "\f0d1";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #c99f98;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Active .Point::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Errors] .Container .LeftArea .Navigator .Step.NextStep .Point::before {
   content: "\f00d";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Errors] .Container .LeftArea .BtnList {
   width: 100%;
   margin-top: 70px;
   display: flex;
   justify-content: flex-start
}

[Page=Errors] .Container .LeftArea .BtnList .Btn {
   background: #ccc;
   padding: 8px 12px;
   border-radius: 3px;
   font-size: 16px;
   text-align: center;
   margin-right: 20px;
   cursor: pointer
}

[Page=Errors] .Container .LeftArea .BtnList .Btn.Resume {
   background: #4caf50;
   color: #fff
}

[Page=Errors] .Container .LeftArea .BtnList .Btn.Order {
   background: 0 0;
   color: #f10;
   border: 1px solid #f10
}

[Page=Errors] .Container .LeftArea .Payment {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   margin-top: 30px
}

[Page=Errors] .Container .LeftArea .Payment .Btn.Payment {
   background: red;
   color: #fff;
   padding: 2px 13px;
   border-radius: 3px;
   font-size: 13px;
   text-align: center;
   cursor: pointer;
   margin: 0;
   width: initial
}

[Page=Errors] .Container .LeftArea .Account {
   display: flex;
   justify-content: flex-start;
   margin-top: 5px;
   flex-direction: column;
   border: 1px solid #d3f1d6;
   border-radius: 4px;
   background: #e1f5e3;
   padding: 10px
}

[Page=Errors] .Container .LeftArea .Account .Item {
   width: 100%;
   display: flex;
   align-items: center
}

[Page=Errors] .Container .LeftArea .Account .Item span:nth-child(1) {
   width: 100px;
   flex: none;
   font-weight: 700;
   font-size: 11px;
   color: #37913b
}

[Page=Errors] .Container .LeftArea .Account .Item span:nth-child(2) {
   width: 5px;
   flex: none
}

[Page=Errors] .Container .LeftArea .Account .Item span:nth-child(3) {
   width: 80%;
   font-size: 13px
}

[Page=Errors] .Container .RightArea {
   width: 60%;
   display: flex;
   flex-direction: column;
   overflow: auto;
   padding: 20px 0;
   padding-right: 10px
}

[Page=Success] {
}

[Page=Success] .Container {
   display: flex;
   height: 100%;
   align-content: center;
   align-items: center
}

[Page=Success] .Container .LeftArea {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
   padding: 20px 0 120px
}

[Page=Success] .Container .LeftArea .Title {
   width: 100%;
   font-size: 26px;
   font-weight: 700
}

[Page=Success] .Container .LeftArea .Text {
   width: 80%;
   color: #444;
   margin-bottom: 30px
}

[Page=Success] .Container .LeftArea .Navigator {
   width: 60%;
   display: flex;
   justify-content: space-between
}

[Page=Success] .Container .LeftArea .Navigator .Step {
   width: 100%;
   height: 12px;
   background: #b7dfb8;
   position: relative
}

[Page=Success] .Container .LeftArea .Navigator .Step .Point {
   width: 26px;
   height: 26px;
   border-radius: 100px;
   background: #b7dfb8;
   margin-top: -8px;
   margin-left: -6px;
   display: flex
}

[Page=Success] .Container .LeftArea .Navigator .Step.Left .Point {
   left: 0
}

[Page=Success] .Container .LeftArea .Navigator .Step.Center .Point {
}

[Page=Success] .Container .LeftArea .Navigator .Step.Right {
   display: flex;
   width: 0;
   flex-direction: column
}

[Page=Success] .Container .LeftArea .Navigator .Step.Right .Point {
   flex: none
}

[Page=Success] .Container .LeftArea .Navigator .Step.Right .Name {
}

[Page=Success] .Container .LeftArea .Navigator .Step .Name {
   width: 220px;
   font-size: 14px;
   font-weight: 600;
   padding-top: 8px;
   margin-left: -5px;
   flex: none;
   text-align: left
}

[Page=Success] .Container .LeftArea .Navigator .Step.Active {
   background: #4caf50
}

[Page=Success] .Container .LeftArea .Navigator .Step.Active .Point {
   background: #37913b
}

[Page=Success] .Container .LeftArea .Navigator .Step.NextStep .Point {
   background: #37913b
}

[Page=Success] .Container .LeftArea .Navigator .Step .Point::before {
   content: "\f0d1";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #69a16b;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Success] .Container .LeftArea .Navigator .Step.Active .Point::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Success] .Container .LeftArea .Navigator .Step.NextStep .Point::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Success] .Container .LeftArea .BtnList {
   width: 100%;
   margin-top: 70px;
   display: flex;
   justify-content: flex-start
}

[Page=Success] .Container .LeftArea .BtnList .Btn {
   background: #ccc;
   padding: 8px 12px;
   border-radius: 3px;
   font-size: 16px;
   text-align: center;
   margin-right: 20px;
   cursor: pointer
}

[Page=Success] .Container .LeftArea .BtnList .Btn.Resume {
   background: #4caf50;
   color: #fff
}

[Page=Success] .Container .LeftArea .BtnList .Btn.Order {
   background: 0 0;
   color: #4caf50;
   border: 1px solid #4caf50
}

[Page=Success] .Container .LeftArea .Payment {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   margin-top: 30px
}

[Page=Success] .Container .LeftArea .Payment .Btn.Payment {
   background: red;
   color: #fff;
   padding: 2px 13px;
   border-radius: 3px;
   text-align: center;
   cursor: pointer;
   margin: 0;
   width: initial
}

[Page=Success] .Container .LeftArea .Account {
   display: flex;
   justify-content: flex-start;
   margin-top: 5px;
   flex-direction: column;
   border: 1px solid #d3f1d6;
   border-radius: 4px;
   background: #e1f5e3;
   padding: 10px
}

[Page=Success] .Container .LeftArea .Account .Item {
   width: 100%;
   display: flex;
   align-items: center;
   padding: 5px 0
}

[Page=Success] .Container .LeftArea .Account .Item span:nth-child(1) {
   width: 100px;
   flex: none;
   font-weight: 400;
   color: #37913b
}

[Page=Success] .Container .LeftArea .Account .Item span:nth-child(2) {
   width: 5px;
   flex: none
}

[Page=Success] .Container .LeftArea .Account .Item span:nth-child(3) {
   width: 80%
}

[Page=Success] .Container .RightArea {
   width: 60%;
   display: flex;
   flex-direction: column;
   padding: 20px 0;
   padding-right: 10px
}

[Page=Success] .Container .RightArea::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

[Page=Success] .Container .RightArea::-webkit-scrollbar-thumb {
   background-color: rgb(183 223 184)
}

[Page=Success] .Container .RightArea::-webkit-scrollbar-track {
   background: rgb(183 223 184/35%)
}

[Page=Success] .Container .RightArea .productItem {
   width: 100%;
   background: #a2cea333;
   border: 1px solid #f2fff2;
   padding: 8px;
   border-radius: 10px;
   margin: 8px 0;
   position: relative
}

[Page=Success] .Container .RightArea .productItem .Name {
   width: 100%;
   font-size: 16px;
   margin-bottom: 6px;
   text-decoration: none;
   cursor: pointer;
   color: #4caf50;
   font-weight: 600;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Btn.ProductDelete {
   position: absolute;
   right: 7px;
   top: 12px;
   font-size: 18px;
   cursor: pointer;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Btn.ProductDelete:hover {
   color: #ba1e7d
}

[Page=Success] .Container .RightArea .productItem .Product {
   width: 100%;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .ProductArea {
   width: 100%;
   display: flex;
   flex: none
}

[Page=Success] .Container .RightArea .productItem .Product .Photo {
   width: 50px;
   margin-right: 8px;
   flex: none
}

[Page=Success] .Container .RightArea .productItem .Product .Photo img {
   width: 100%;
   border-radius: 8px
}

[Page=Success] .Container .RightArea .productItem .Product .Info {
   width: 100%;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item {
   width: 100%;
   font-size: 16px;
   display: flex;
   justify-content: flex-start;
   align-items: flex-start;
   flex-direction: column
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item span:nth-child(1) {
   font-weight: 500;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item span:nth-child(2) {
   display: flex;
   font-size: 12px
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item span .Delivery {
   margin-left: 10px;
   background: #41c346;
   color: #082e0a;
   border-radius: 2px;
   padding: 1px 10px;
   font-size: 11px;
   display: block
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Case {
   width: 100%
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Case span {
   width: 100%;
   font-size: 12px;
   color: #ff5722
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Btn.Design {
   background: #b7cdd5;
   display: flex;
   color: #175f78;
   padding: 2px 4px;
   border-radius: 3px;
   align-items: center;
   justify-content: flex-start;
   cursor: pointer;
   margin-top: 8px;
   width: fit-content;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Btn.Design i {
   margin-right: 4px
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Btn.Design:hover {
   background: #1b6e8d;
   color: #fff
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price {
   width: 100%;
   margin-top: 0;
   display: flex;
   flex-direction: row;
   justify-content: flex-start
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .OldPrice {
   font-size: 18px;
   color: #c0cbc1;
   text-decoration: line-through;
   margin-right: 10px;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .OldPrice kr {
   width: 100%;
   font-size: 11px
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .SalePrice {
   font-size: 18px;
   font-weight: 600;
   color: #000
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .SalePrice kr {
   width: 100%;
   font-size: 12px
}

[Page=Success] .Container .RightArea .productItem .Product .InfoArea {
   width: 100%
}

[Page=Success] .Container .RightArea .productItem .Product .Other {
   width: 40%;
   flex: none;
   display: flex;
   margin: 0 -5px;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct {
   width: 50%;
   display: flex;
   margin: 0 10px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center;
   padding: 10px 5px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct.Active {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct .Item {
   width: fit-content;
   margin: 2px;
   border-radius: 2px;
   border: 1px solid #eef1f2;
   padding: 2px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct .Item img {
   height: 35px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct:hover {
   box-shadow: 0 0 0 1px #0000007a
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct span {
   width: 100%;
   padding: 0 20px;
   font-size: 12px;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct span img {
   width: 32%
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct.Active span {
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage {
   width: 50%;
   display: flex;
   margin: 0 10px
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage.nonMessage {
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage.Message {
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage.Active .AddMessage.nonMessage {
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage.Active .AddMessage.Message {
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage:hover {
   box-shadow: 0 0 0 1px #0000007a
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage span {
   width: 100%;
   padding: 0 20px;
   font-size: 12px;
   display: flex;
   justify-content: center;
   align-items: center
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage span img {
   width: 30%
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .Icon {
   font-size: 22px;
   color: #25a12a
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList {
   display: flex;
   align-items: center;
   justify-content: center;
   margin-top: 15px
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit {
   font-size: 11px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 4px 0 0 4px;
   padding: 5px 10px;
   width: 50%
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit:hover {
   background: #c1cfd3;
   color: #000
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete {
   font-size: 11px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 0 4px 4px 0;
   padding: 5px 10px;
   width: 50%;
   margin-left: 1px
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete:hover {
   background: red;
   color: #fff
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   height: 0;
   opacity: 0;
   overflow: hidden;
   transition: all .2s
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .Title {
   display: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .List {
   width: 100%;
   display: flex;
   flex-direction: row;
   padding-top: 60px;
   flex-wrap: wrap;
   align-content: flex-start
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList.Active {
   height: 100%;
   opacity: 1;
   overflow: visible;
   transition: all .2s;
   padding: 20px 0
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct {
   width: calc( 20% - 8px);
   display: flex;
   padding: 10px;
   background: #fff;
   border-radius: 4px;
   margin-right: 10px;
   margin-bottom: 10px;
   border: 1px solid #dee0e0;
   flex-direction: column;
   align-items: center;
   position: relative
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct:nth-child(+5n) {
   margin-right: 0
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct img {
   width: 100%;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Name {
   width: 100%;
   display: inline-block;
   font-size: 12px;
   font-weight: 500;
   text-align: center;
   text-decoration: none;
   margin: 10px 0;
   height: 28px
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Price {
   width: 100%;
   display: block;
   text-align: center;
   font-weight: 600;
   color: #34495e;
   margin-bottom: 10px
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Btn.AddExtra {
   background: #34495e;
   color: #fff;
   padding: 4px 5px;
   border-radius: 2px;
   font-size: 12px;
   cursor: pointer
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Btn.AddExtra:hover {
   background: #26394c
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan {
   font-size: 12px;
   cursor: pointer;
   display: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Active .Quan {
   display: flex
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Active .Btn.AddExtra {
   display: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan .BtnMinus {
   line-height: 23px;
   width: 25px;
   text-align: center;
   cursor: pointer
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan .BtnValue {
   padding: 3px;
   border: 1px solid #ccc;
   width: 25px;
   text-align: center;
   border-radius: 3px;
   position: relative
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan .BtnPlus {
   line-height: 23px;
   width: 25px;
   text-align: center;
   cursor: pointer
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Loading {
   pointer-events: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Loading .Quan .BtnValue::before {
   content: "";
   background: #34495e url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 30px;
   border-radius: 4px;
   position: absolute;
   left: -1px;
   bottom: -1px;
   z-index: 11;
   background-position: 50%;
   background-size: cover
}

[Page=Profil] .Btn {
   padding: 10px 20px;
   background: #efefef;
   color: #000;
   width: fit-content;
   border-radius: 4px;
   cursor: pointer
}

[Page=Profil] .Btn.BtnRed {
   background: #f10;
   color: #fff
}

[Page=Profil] .Btn.BtnGreen {
   background: #4caf50;
   color: #fff
}

[Page=Profil] .Btn:hover {
   opacity: .7
}

.MobilNav {
   display: none;
   height: 0;
   border: 0;
   top: 0;
   flex: none;
   width: 45px;
   height: 54px;
   padding: 0 4px;
   position: relative
}

.MobilNavArea {
   position: fixed;
   z-index: 3;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: #fff;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   padding: 20px
}

.MobilNavArea.Active {
   left: 0;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   display: block
}

.MobilNavArea .IconBar {
   font-size: 16px;
   color: #000;
   cursor: pointer;
   text-decoration: none;
   border: 1px solid transparent;
   border-radius: 4px;
   margin: 0 2px 15px;
   justify-content: flex-start;
   display: inline-block;
   align-items: center;
   width: 100%
}

.MobilNavArea .IconBar .Item {
   cursor: pointer;
   padding: 2px;
   margin: 0 2px;
   float: left;
   position: relative
}

.MobilNavArea .IconBar .Item svg {
   width: 30px;
   height: 30px
}

.MobilNavArea .IconBar .Item.Closed {
   float: right;
   cursor: pointer;
   flex: none;
   width: 40px;
   display: flex;
   justify-content: flex-end
}

.MobilNavArea .IconBar .Item span {
   position: absolute;
   left: 27px;
   top: -5px;
   background: #f10;
   color: #fff;
   font-size: 14px;
   width: 18px;
   height: 18px;
   text-align: center;
   z-index: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 12px;
   line-height: 18px;
   display: none
}

.MobilNavArea .SearchArea {
   position: relative;
   margin-bottom: 15px
}

.MobilNavArea .SearchArea svg {
   width: 19px;
   height: 19px;
   position: absolute;
   left: 10px;
   top: 10px
}

.MobilNavArea .SearchArea input {
   width: 100%;
   border: 1px solid #dcdcdc;
   padding: 10px;
   border-radius: 10px;
   font-size: 16px;
   background: #f8f8f8;
   text-indent: 32px
}

.MobilNavArea .MenuTab>a {
   font-size: 16px;
   color: #000;
   cursor: pointer;
   text-decoration: none;
   border: 1px solid transparent;
   padding: 5px;
   border-radius: 4px;
   margin: 0 2px;
   justify-content: flex-start;
   display: flex;
   align-items: center
}

.MobilNavArea .MenuTab>a .Img {
   width: 32px;
   height: 32px;
   border-radius: 100px;
   overflow: hidden;
   margin-right: 14px;
   flex: none
}

.MobilNavArea .MenuTab>a .hm {
   line-height: 32px;
   width: 100%
}

.MobilNavArea .MenuTab>a i {
   line-height: 32px;
   float: right;
   flex: none;
   width: 30px
}

.MobilNavArea .MenuTab.Active .Penc {
   left: 0
}

.MobilNavArea .MenuTab .Penc {
   position: fixed;
   top: 0;
   left: -100%;
   width: 100%;
   background: #fff;
   z-index: 2;
   height: 100%;
   padding: 20px;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in
}

.MobilNavArea .MenuTab .Penc.Active {
   left: 0;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in
}

.MobilNavArea .MenuTab>.Penc>.Overlow {
   overflow: auto;
   max-height: 400px
}

.MobilNavArea .MenuTab>.Penc>a {
   font-size: 16px;
   color: #000;
   cursor: pointer;
   text-decoration: none;
   display: flex;
   padding: 16px 14px;
   border-radius: 4px;
   margin: 0 2px;
   font-weight: 600;
   width: 100%;
   justify-content: space-between
}

.MobilNavArea .MenuTab>.Penc>a .Img {
   width: 32px;
   height: 32px;
   border-radius: 100px;
   overflow: hidden;
   margin-right: 14px;
   flex: none
}

.MobilNavArea .MenuTab>.Penc>a .hm {
   line-height: 32px;
   width: 100%
}

.MobilNavArea .MenuTab>.Penc>a i {
   line-height: 32px;
   float: right;
   flex: none;
   width: 30px
}

.MobilNavArea .MenuTab .Penc .Sub {
   width: 100%;
   display: flex;
   flex-direction: column
}

.MobilNavArea .MenuTab .Penc .Sub a.SutunAdi {
   border-bottom: 1px solid #ffffff1f;
   border-top: 1px solid #ffffff1f;
   font-weight: 500;
   text-indent: 10px
}

.MobilNavArea .MenuTab .Penc .Sub a {
   float: left;
   padding: 10px;
   font-weight: 400;
   width: 100%;
   text-indent: 18px;
   color: #000
}

.MobilNavArea .MenuTab .Penc .Sub a .Badge {
   font-size: 11px;
   border-radius: 4px;
   padding: 0 4px;
   text-indent: 0;
   display: none
}

.MobilNavArea .MenuTab .Penc .Sub a::before {
   font-family: "font awesome 5 free";
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   content: "\f111";
   margin-right: 4px;
   font-size: 6px
}

.MobilNavArea .MenuTab .Penc .Sub .SutunAdi::before {
   display: none
}

.MobilNavArea .Info {
   display: flex;
   gap: 10px;
   flex-direction: column;
   margin-bottom: 20px;
   border-top: 1px solid #ccc;
   padding-top: 10px
}

.MobilNavArea .Info a {
   display: flex;
   gap: 10px;
   border: 1px solid #000;
   border-radius: 4px;
   padding: 6px;
   background: #f8f8f869
}

.MobilNavArea .Help {
   display: flex;
   gap: 10px;
   margin-bottom: 30px
}

.MobilNavArea .Help .Btn-Whatsap {
   float: left;
   border-radius: 4px;
   border: 1px solid #4caf50;
   cursor: pointer;
   text-align: center;
   color: #368c39;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.MobilNavArea .Help .Btn-Phone {
   float: left;
   border-radius: 4px;
   border: 1px solid #ff5722;
   cursor: pointer;
   text-align: center;
   color: #ff5722;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.MobilNavArea .PayInformation {
   display: flex;
   flex-direction: column;
   margin-top: 15px
}

.MobilNavArea .PayInformation .IconList {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   gap: 10px
}

.MobilNavArea .PayInformation .IconList .Item {
   display: flex;
   width: 16%;
   overflow: hidden
}

.MobilNavArea .PayInformation .IconList .Item img {
   width: 100%
}

.MobilNavArea .PayInformation .Info {
   display: flex;
   align-content: center;
   align-items: flex-start;
   border: 0;
   flex-direction: row
}

.MobilNavArea .PayInformation .Info i {
   display: flex;
   font-size: 20px;
   margin-right: 5px;
   color: #ff5722
}

.MobilNavArea .PayInformation .Info span {
   display: flex;
   font-size: 13px
}

.MobilNavArea .MobilNavUserArea {
   margin-top: 40px;
   border-top: 1px solid #ccc;
   padding-top: 10px;
   display: flex;
   flex-direction: column
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin {
   border: 1px solid #4caf50;
   padding: 6px;
   border-radius: 4px;
   margin-bottom: 10px
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder {
   border: 1px solid #673ab7;
   background: #673ab7;
   padding: 6px;
   border-radius: 4px;
   margin-bottom: 10px
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder {
   cursor: pointer;
   color: #fff;
   display: flex;
   flex: none;
   align-items: center
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder svg {
   margin-right: 8px;
   font-size: 22px;
   height: 27px;
   width: 29px;
   fill: #fff
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder:hover {
   border-color: #4bae4f;
   color: #4bae4f
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin {
   cursor: pointer;
   color: #4caf50;
   display: flex;
   flex: none;
   align-items: center
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin svg {
   margin-right: 5px;
   font-size: 22px;
   height: 27px;
   width: 32px;
   fill: #4caf50
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin:hover {
   border-color: #4bae4f;
   color: #4bae4f
}

table {
   width: 100%!important;
   margin: 0 auto;
   clear: both;
   border-collapse: separate;
   border-spacing: 0;
   display: table
}

table tbody tr.sH {
   font-weight: 400
}

table tbody tr.sH th {
   font-weight: 400;
   color: #c39789;
   text-align: left;
   padding: 10px 10px 5px;
   text-transform: uppercase;
   font-size: 14px
}

table tbody tr {
}

table tbody tr:hover td {
   box-shadow: inset 0 1px 0 0 #d1afa4,inset 0 -1px 0 0 #d1afa4
}

table tbody tr:hover td:nth-child(1) {
   border-radius: 6px 0 0 6px;
   box-shadow: inset 0 1px 0 0 #d1afa4,inset 0 -1px 0 0 #d1afa4,inset 1px 0 0 0 #d1afa4
}

table tbody tr:hover td:last-child {
   border-radius: 0 6px 6px 0;
   box-shadow: inset 0 1px 0 0 #d1afa4,inset 0 -1px 0 0 #d1afa4,inset -1px 0 0 0 #d1afa4
}

table tbody td {
   line-height: 15px;
   padding: 8px 10px;
   border: 4px solid #fff;
   color: #5e6165;
   border-right: 0;
   border-left: 0;
   font-size: 14px;
   position: relative;
   box-shadow: inset 0 1px 0 0 #dbe0e9,inset 0 -1px 0 0 #dbe0e9;
   font-weight: 500;
   text-align: left
}

table tbody tr.nonLine td {
   box-shadow: inset 0 1px 0 0 #2d333600,inset 0 -1px 0 0 #2d333659!important;
   border-radius: 0!important;
   border: 0;
   padding-bottom: 10px;
   padding-top: 10px
}

table tbody td.Price:before {
   content: attr(curr);
   position: absolute;
   left: 10px;
   top: 9px;
   height: 39px;
   background: #d3d9e2;
   color: #000;
   display: flex;
   align-items: center;
   width: 30px;
   text-align: center;
   justify-content: center;
   font-size: 12px
}

table tbody td .BoxPrice {
   display: flex;
   align-items: center
}

table tbody td .ImgBox {
   width: 120px;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   align-content: center
}

table tbody td .ImgBox img {
   height: 30px
}

table tbody td .UploadPhoto {
   width: 40px;
   border: 1px solid #ccc;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer
}

table tbody td .UploadPhoto img {
   height: 30px
}

table tbody td span.ImgIcon {
   font-size: 26px;
   color: #97a2b3;
   display: inline-block;
   margin: 2px 0 0 5px
}

table tbody td span.ImgIcon.Active {
   color: #4caf50
}

table tbody td span.Time {
   line-height: 0;
   font-size: 11px;
   font-weight: 400;
   background: #e0e7ea;
   padding: 2px 3px;
   border-radius: 4px
}

table tbody td:nth-child(1) {
   border-radius: 6px 0 0 6px;
   box-shadow: inset 0 1px 0 0 #dbe0e9,inset 0 -1px 0 0 #dbe0e9,inset 1px 0 0 0 #dbe0e9
}

table tbody tr.nonLine td:nth-child(1) {
   border-radius: 0;
   box-shadow: inset 0 1px 0 0 #2d333600,inset 0 -1px 0 0 #2d333659,inset 1px 0 0 0 #2d333600
}

table thead th:first-child {
   display: none
}

table tbody td:first-child {
}

table tbody td:last-child {
   border-radius: 0 6px 6px 0;
   box-shadow: inset 0 1px 0 0 #dbe0e9,inset 0 -1px 0 0 #dbe0e9,inset -1px 0 0 0 #dbe0e9
}

table tbody td i.move {
   padding: 0;
   width: 25px;
   text-align: center;
   background: #e0e7ea;
   border-radius: 4px;
   margin-left: 1px;
   font-size: 16px;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   line-height: 46px;
   cursor: move;
   display: flex;
   align-items: center;
   justify-content: center
}

table tbody tr:hover td i.move {
   background: #ff9800;
   color: #fff
}

table tbody td img.Icon {
   padding: 3px 4px;
   margin: 4px 0;
   float: left
}

table tbody td .contentLang {
   display: none;
   background: #c8cfe170;
   color: #000;
   width: 36px;
   height: 36px;
   border-radius: 3px;
   position: absolute;
   right: 5px;
   top: 12px;
   text-indent: 0;
   line-height: 36px;
   text-align: center;
   font-size: 22px
}

table tbody tr:hover .contentLang {
   display: block
}

table tbody tr span.Name {
   padding: 8px 15px;
   line-height: 28px;
   float: left
}

table tbody tr div.LongText {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   width: 320px
}

table tbody tr div.BtnList {
   display: flex;
   justify-content: flex-end
}

table tbody tr div.BtnList .Btn {
   margin-left: 5px;
   padding: 5px 7px;
   background: 0 0;
   font-size: 12px
}

table tbody tr th.textL {
   text-align: left
}

table tbody tr th.textR {
   text-align: right
}

table tbody tr th.textC {
   text-align: center
}

table tbody tr td.textL {
   text-align: left
}

table tbody tr td.textR {
   text-align: right
}

table tbody tr td.textC {
   text-align: center
}

table tbody tr td.textb {
   font-weight: 700
}

table tbody tr td.Icon img {
   border-radius: 100px
}

table tbody tr td input {
   float: left;
   width: 100%;
   font-weight: 400;
   font-size: 12px;
   line-height: 19px;
   border: 1px solid #ccc;
   padding: 5px;
   outline: none
}

table tbody tr td.Price input {
   text-indent: 28px
}

table tbody tr td .TwoRow {
   width: 100%
}

table tbody tr td .TwoRow span:nth-child(1) {
   width: 100%;
   float: left;
   color: #000
}

table tbody tr td .TwoRow span:nth-child(2) {
   width: 100%;
   float: left;
   color: #248b2b;
   font-size: 12px;
   font-weight: 500
}

table tbody td .Order_Product {
   display: flex;
   width: 100%;
   flex-direction: row;
   align-content: center;
   justify-content: center;
   align-items: flex-start
}

table tbody td .Order_Product .Photo {
   width: 75px;
   float: left;
   margin-right: 10px
}

table tbody td .Order_Product .Photo img {
   height: 76px;
   border-radius: 2px
}

table tbody td .Order_Product .Info {
   width: 100%;
   display: flex;
   float: left;
   line-height: 22px;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
   align-content: center
}

table tbody td .Order_Product .Info span {
   width: 100%;
   line-height: 16px;
   font-size: 12px
}

table tbody td .Order_Product .Info span strong {
   font-weight: 600;
   color: #000;
   margin-left: 5px
}

table tbody td .Order_Extra {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: center;
   justify-content: center;
   border: 1px solid #cccccc47;
   padding: 10px;
   border-radius: 4px;
   background: #f3f4f633
}

table tbody td .Order_Extra span {
   width: 100%;
   float: left;
   line-height: 22px
}

table tbody td .Order_Extra span strong {
   float: right;
   font-weight: 600;
   color: #000
}

table tbody td .Order_Packet {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: center;
   justify-content: center
}

table tbody td .Order_Packet span {
   width: 100%;
   float: left;
   line-height: 19px;
   font-size: 12px
}

table tbody td .Order_Packet span strong {
   float: right;
   font-weight: 600;
   color: #000
}

table tbody td .Order_Extra {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: center;
   justify-content: center;
   border: 1px solid #cccccc47;
   padding: 10px;
   border-radius: 4px;
   background: #f3f4f633
}

table tbody td .Order_Extra span {
   width: 100%;
   float: left;
   line-height: 22px
}

table tbody td .Order_Extra span strong {
   float: right;
   font-weight: 600;
   color: #000
}

table tbody td .Order_Status {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: flex-start;
   justify-content: center;
   align-items: flex-start
}

table tbody td .Order_Status span {
   width: 100%;
   float: left;
   line-height: 16px;
   text-align: left;
   font-size: 12px
}

table tbody td .Order_Status span strong {
   float: right;
   font-weight: 600;
   color: #000;
   font-size: 11px
}

td .BoxArea {
   background: #f1f2f4;
   color: #61615e;
   padding: 6px 8px;
   border-radius: 4px;
   font-size: 14px;
   font-weight: 400;
   text-align: center;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center
}

td .BoxArea.Default {
   background: #d1afa4;
   color: #fff
}

td .BoxArea.Green {
   background: #92ca94;
   color: #fff
}

td .BoxArea.Black {
   background: #000;
   color: #fff
}

td .BoxArea.Red {
   background: red;
   color: #fff
}

td .BoxArea.Blue {
   background: #2196f3;
   color: #fff
}

.PopupDesign {
   position: fixed;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 1022;
   outline: 0;
   overflow-y: auto;
   height: 100%;
   top: auto;
   padding-right: 0;
   display: flex;
   align-self: center;
   justify-items: center;
   align-items: flex-start
}

.PopupDesign>.Modal {
   -ms-transform: translate(0,75%);
   -ms-transform: translate(0,0);
   position: relative;
   width: auto;
   margin: 10px;
   transition: all .2s!important;
   margin: 0 auto;
   transform: translate3d(0,0,0);
   width: 30%;
   z-index: 1;
   display: block;
   height: initial
}

.PopupDesign>.Modal.w40 {
   width: 40%
}

.PopupDesign>.Modal.w50 {
   width: 50%
}

.PopupDesign>.Modal.w60 {
   width: 60%
}

.PopupDesign>.Modal.w70 {
   width: 70%
}

.PopupDesign>.Modal.w80 {
   width: 80%
}

.PopupDesign>.Modal.w100 {
   width: 95%
}

.PopupDesign>.PopupOver {
   position: fixed;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 0;
   outline: 0;
   overflow-y: auto;
   height: 100%;
   top: auto;
   padding-right: 0;
   background: #00000099
}

.PopupDesign.Login>.Modal {
   -ms-transform: translate(0,75%);
   -ms-transform: translate(0,0);
   position: relative;
   margin: 10px;
   transition: all .2s!important;
   margin: 0 auto;
   transform: translate3d(0,0,0);
   z-index: 1;
   display: block;
   height: initial;
   min-width: 320px
}

.PopupDesign>.Modal>.Htm {
   width: 100%;
   text-align: center;
   margin-top: 30px;
   margin-bottom: 30px
}

.PopupDesign>.Modal>.Htm>.Document {
   position: relative;
   outline: 0;
   background: #f6f6f6;
   display: inline-block;
   width: 100%;
   box-shadow: 0 11px 46px -51px #000;
   border-radius: 6px;
   overflow: hidden;
   min-height: 120px
}

.PopupDesign.Login>.Modal>.Htm>.Document h4 {
   margin: 0
}

.PopupDesign.Login>.Modal>.Htm>.Document p {
   margin: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Title {
   position: relative;
   z-index: 3
}

.PopupDesign>.Modal>.Htm>.Document>.Title .Close {
   float: left;
   position: absolute;
   right: 20px;
   top: 0;
   font-size: 25px;
   height: 73px;
   line-height: 44px;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center {
   text-align: left;
   padding: 40px;
   line-height: 23px;
   float: left;
   width: 100%;
   overflow: auto;
   position: relative;
   z-index: 1
}

.PopupDesign.Conract>.Modal>.Htm>.Document>.Center {
   text-align: left;
   padding: 40px;
   line-height: 23px;
   float: left;
   width: 100%;
   overflow: auto;
   position: relative;
   z-index: 1
}

.PopupDesign>.Modal>.Htm>.Document>.Loading {
   text-align: left;
   padding: 30px
}

.PopupDesign.CampaingPopup>.Modal {
   width: inherit
}

.PopupDesign.CampaingPopup>.Modal>.Htm>.Document>.Center {
   padding: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem {
   display: flex;
   width: 100%
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Code {
   border: 1px dashed #ccc;
   padding: 10px;
   text-align: center;
   width: 150px;
   flex: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info {
   padding: 5px;
   display: flex;
   width: 100%;
   flex-direction: column
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Name {
   line-height: 23px;
   width: 100%
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Text {
   line-height: 23px;
   width: 100%
}


* {
   box-sizing: border-box
}

* {
   margin: 0;
   padding: 0;
   border: 0;
   background: 0;
   -webkit-text-size-adjust: 100%;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-kerning: auto;
   outline: none;
   z-index: 0
}

h1 {
   font-size: inherit;
   display: inherit;
   margin: inherit;
   font-weight: inherit
}

h2 {
   font-size: inherit;
   display: inherit;
   margin: inherit;
   font-weight: inherit
}

h3 {
   font-size: inherit;
   display: inherit;
   margin: inherit;
   font-weight: inherit
}

body .pageOverlay.Show {
   transition: .3s;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   z-index: 100!important;
   background-color: rgba(255,255,255,.8);
   cursor: pointer
}

body .pageOverlayDark.Show {
   transition: .3s;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   z-index: 999;
   background-color: rgba(0,0,0,.76);
   cursor: pointer
}

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

.row.Fle {
   display: flex
}

.row::before,.row::after {
   display: table;
   content: " "
}

.row::after {
   clear: both
}

.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;
   padding-right: 8px;
   padding-left: 8px;
   padding-top: 0;
   padding-bottom: 0
}

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

.col-12 {
   width: 100%
}

.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 {
   width: 50%
}

.col-5 {
   width: 41.66666667%
}

.col-4 {
   width: 33.33333333%
}

.col-3 {
   width: 25%
}

.col-2 {
   width: 16.66666667%
}

.col-1 {
   width: 8.33333333%
}

.toast-bs-container {
}

.toast-bs-container .toast-position {
   right: 10px;
   top: 10px;
   display: block;
   z-index: 999999;
   position: relative;
   max-width: calc(100% - 12px);
   max-height: 100%;
   overflow: hidden;
   font-family: -apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
   padding: 10px;
   -webkit-animation-name: hbToastSlideIn;
   animation-name: hbToastSlideIn;
   width: 324px;
   background: #fff;
   border-radius: 8px;
   box-shadow: 0 2px 16px 0 rgb(0 0 0/8%);
   overflow: hidden;
   margin: 10px 0;
   max-height: 2000px;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

.toast-bs-container .toast-position.Error {
}

.toast-bs-container .toast-position.Success {
}

.toast-bs-container .toast-position .toast {
}

.toast-bs-container .toast-position .toast .toast-header {
   width: 100%
}

.toast-bs-container .toast-position .toast .toast-body {
}

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

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

.Loading {
}

.Loading.Pop {
   background: #f6f6f6;
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   z-index: 1
}

.Loading.All {
   background: #ffffff1c
}

.Loading.White {
   background: #fff
}

.Loading svg {
   width: 50px;
   height: 50px;
   display: inline-block;
   position: absolute;
   left: 50%;
   top: 50%;
   margin-left: -25px;
   margin-top: -25px
}

.Loading.Content {
   position: absolute;
   z-index: 19;
   width: 100%;
   height: 100%;
   background: #ffffffbf;
   left: 0;
   top: 0;
   bottom: 0;
   right: 0
}

.Loading.Content svg {
   width: 50px;
   height: 50px;
   display: inline-block;
   position: absolute;
   left: 28px;
   top: 28px;
   margin-left: -25px;
   margin-top: -25px
}

.Desktop1.Mobil0 {
   display: block
}

.Desktop1.Mobil1 {
   display: block
}

.Desktop0.Mobil1 {
   display: none
}

.Desktop0.Mobil0 {
   display: none
}

.Layout_01 {
   display: flex;
   flex-direction: row;
   align-content: flex-start;
   align-items: flex-start;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   left: 0;
   width: 100%
}

.Layout_01 .Layout_01_Center {
   margin: 0 auto;
   width: 100%;
}

.Layout_01 .Layout_01_Center .LayoutHead {
   margin-bottom: 0;
   position: relative;
   z-index: 10
}
body.FilterActive .Layout_01 .Layout_01_Center .LayoutHead{z-index:0}

.Layout_01 .Layout_01_Center .LayoutHome {
   margin-bottom: 30px;
   z-index: 2;
   position: relative;
   padding-top: 10px;
}

.Layout_01.Active .Layout_01_Center .LayoutHead {
   background: #135379
}

.LayoutFooter {
   position: relative;
}

.Nod003 {
   float: left;
   margin-bottom: 14px;
   width: 100%;
   padding: 0 15px
}

.Nod003 .List {
   float: left;
   height: 140px
}

.Nod003 .List .owl-nav {
   display: none
}

.Nod003 .List .owl-dots {
   display: none
}

.Nod003 .item {
   width: 120px;
   text-align: center
}

.Nod003 .item a {
   width: 120px;
   margin: 10px 0;
   text-decoration: none;
   color: #000
}

.Nod003 .item a img {
   display: inline-block;
   width: 120px;
   height: 120px;
   border-radius: 100px
}

.Nod003 .item a .Info span {
   line-height: 32px
}

.DayView {
   position: fixed;
   z-index: 1;
   bottom: 80px;
   left: -100%;
   background: #000;
   width: 320px;
   border-radius: 0 8px 8px 0;
   color: #fff;
   padding: 10px;
   font-size: 14px;
   text-align: center;
   transition: all .3s ease-in
}

.DayView.Show {
   left: 0;
   transition: all .3s ease-in
}

.DayView .Text {
   width: 100%
}

.DayView .Closed {
   width: 10px
}

.ProductList {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
}

.ProductList.Grid4 .ProductItem {
   width: 25%;
   text-decoration: none;
   color: #000;
   position: relative
}

.ProductList.Grid3 .ProductItem {
   width: 33.33%
}

.ProductListMore {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   align-content: center
}

.ProductListMore .Btn {
   background: #efefef;
   padding: 12px 20px;
   border-radius: 4px;
   margin: 20px 0;
   cursor: pointer;
   position: relative
}

.ProductListMore .Btn.Active {
   padding-left: 55px;
   background: #dbe3e7
}

.ProductListMore .Btn.Active::before {
   content: "";
   background: #a0b4bd url(/Library/Img/Loading.svg?);
   width: 43px;
   height: 100%;
   background-size: 41px;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11
}

.ProductList .ProductItem.item_001 {
   padding: 5px;
   position: relative
}

.ProductList .ProductItem.item_001:hover {
   z-index: 1
}

.ProductList .ProductItem.item_001 .Gallery {
   width: 100%;
   border-radius: 4px;
   overflow: hidden;
   position: relative
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite {
   width: 20px;
   height: 20px;
   flex: none;
   cursor: pointer;
   position: absolute;
   right: 6px;
   top: 6px
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #5656569c;
   background: #fff;
   border-radius: 100%;
   width: 22px;
   height: 22px;
   text-align: center;
   line-height: 22px
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite:hover::before {
   color: #edcce1
}

.ProductList .ProductItem.item_001 .Gallery .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductList .ProductItem.item_001.item_001 .Gallery img {
   width: 100%
}

.ProductList .ProductItem.item_001 .Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   align-items: center;
   color: #000;
   padding-bottom: 24px;
   height: 130px
}

.ProductList .ProductItem.item_001:hover .Info {
   box-shadow: 0 16px 11px -3px #00000029
}

.ProductList .ProductItem.item_001 .Info .Slogan {
   margin-top: 2px;
   font-size: 14px;
   color: #ba127d
}

.ProductList .ProductItem.item_001 .Info .Name {
   margin: 4px 0;
   min-height: 30px;
   font-weight: 400;
   font-size: 16px;
   display: flex;
   align-items: flex-start;
   justify-content: center;
   text-align: center
}

.ProductList .ProductItem.item_001 .Info .Name span {
   width: 100%;
   font-size: 14px
}

.ProductList .ProductItem.item_001 .Info .CampaingPrice {
   display: flex;
   align-items: center;
   border: 1px solid #e91e63;
   border-radius: 3px;
   justify-content: space-between;
   padding: 0 7px
}

.ProductList .ProductItem.item_001 .Info .CampaingPrice>span:nth-child(1) {
   color: #e91e63;
   font-size: 13px
}

.ProductList .ProductItem.item_001 .Info .CampaingPrice>span:nth-child(2) {
   color: #e91e63;
   font-weight: 600;
   padding-left: 10px;
   width: 72px;
   flex: none;
   text-align: center
}

.ProductList .ProductItem.item_001 .Info .Price {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-bottom: 6px
}

.ProductList .ProductItem.item_001 .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 14px;
   font-weight: 500
}

.ProductList .ProductItem.item_001 .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   margin-left: 10px;
   color: #243a4e
}

.ProductList .ProductItem.item_001 .Info .Price .Sale.Campaing {
   color: #bfbfbf;
   text-decoration: line-through
}

.ProductList .ProductItem.item_001 .Info .Price .Sale.Campaing .B1 {
   font-size: 18px;
   font-weight: 400
}

.ProductList .ProductItem.item_001 .Info .Price .Sale.Campaing .B2 {
   font-size: 18px;
   font-weight: 400
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B1 {
   display: flex;
   font-size: 22px;
   font-weight: 600
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-weight: 600;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px;
   font-weight: 600
}

.ProductList .ProductItem.item_001 .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #bfbfbf;
   margin-left: 10px;
   text-decoration: line-through
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B1 {
   display: flex;
   font-size: 18px;
   font-weight: 500
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 11px
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .OtherInfo {
   display: none;
   position: absolute;
   height: 70px;
   background: rgb(255 255 255);
   text-align: center;
   align-items: center;
   box-shadow: 0 16px 11px -3px #00000029;
   z-index: 2;
   left: 5px;
   right: 5px;
   border-radius: 0 0 6px 6px
}

.ProductList .ProductItem.item_001:hover .OtherInfo {
   display: flex
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate {
   width: 100%;
   margin-bottom: 2px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   align-content: center;
   flex-direction: column;
   padding: 20px 0
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate span {
   width: 100%;
   font-size: 12px
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point {
   display: flex
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Total {
   font-size: 12px;
   cursor: pointer;
   color: #2196f3;
   padding: 2px 5px;
   border-radius: 2px;
   font-weight: 500
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Total span {
   font-weight: 400
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Total:hover {
   text-decoration: underline
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star {
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductList .ProductItem.item_001 .OtherInfo .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}

.ProductList .ProductItem.item_002 {
   padding: 5px;
   position: relative
}

.ProductList .ProductItem.item_002:hover {
   z-index: 1
}

.ProductList .ProductItem.item_002 .Gallery {
   width: 100%;
   border-radius: 4px;
   overflow: hidden;
   position: relative;
   border: 1px dashed #ccc
}

.ProductList .ProductItem.item_002 .Gallery .BtnFavorite {
   width: 20px;
   height: 20px;
   flex: none;
   cursor: pointer;
   position: absolute;
   right: 6px;
   top: 6px
}

.ProductList .ProductItem.item_002 .Gallery .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_002 .Gallery .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #5656569c;
   background: #fff;
   border-radius: 100%;
   width: 22px;
   height: 22px;
   text-align: center;
   line-height: 22px
}

.ProductList .ProductItem.item_002 .Gallery .BtnFavorite:hover::before {
   color: #edcce1
}

.ProductList .ProductItem.item_002 .Gallery .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductList .ProductItem.item_002 .Gallery img {
   width: 100%
}

.ProductList .ProductItem.item_002 .Info {
   width: 100%;
   display: flex;
   flex-direction: column-reverse;
   justify-content: flex-start;
   align-items: flex-start;
   color: #000;
   height: 85px
}

.ProductList .ProductItem.item_002:hover .Gallery {
   border-color: #ff5722
}

.ProductList .ProductItem.item_002 .Info .Slogan {
   margin-top: 2px;
   font-size: 14px;
   color: #ba127d
}

.ProductList .ProductItem.item_002 .Info .Name {
   margin: 0;
   min-height: 30px;
   font-weight: 400;
   font-size: 16px;
   display: flex;
   align-items: flex-start;
   justify-content: left;
   text-align: left;
   width: 100%
}

.ProductList .ProductItem.item_002 .Info .Name span {
   width: 100%;
   font-size: 14px
}

.ProductList .ProductItem.item_002 .Info .CampaingPrice {
   display: flex;
   align-items: center;
   border: 1px solid #e91e63;
   border-radius: 3px;
   justify-content: space-between;
   padding: 0 7px
}

.ProductList .ProductItem.item_002 .Info .CampaingPrice>span:nth-child(1) {
   color: #e91e63;
   font-size: 13px
}

.ProductList .ProductItem.item_002 .Info .CampaingPrice>span:nth-child(2) {
   color: #e91e63;
   font-weight: 600;
   padding-left: 10px;
   width: 72px;
   flex: none;
   text-align: center
}

.ProductList .ProductItem.item_002 .Info .Price {
   width: 100%;
   display: flex;
   justify-content: flex-end;
   align-items: center;
   flex-direction: row-reverse
}

.ProductList .ProductItem.item_002 .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 14px;
   font-weight: 500;
   display: none
}

.ProductList .ProductItem.item_002 .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #243a4e
}

.ProductList .ProductItem.item_002 .Info .Price .Sale.Campaing {
   color: #bfbfbf;
   text-decoration: line-through
}

.ProductList .ProductItem.item_002 .Info .Price .Sale.Campaing .B1 {
   font-size: 18px;
   font-weight: 400
}

.ProductList .ProductItem.item_002 .Info .Price .Sale.Campaing .B2 {
   font-size: 18px;
   font-weight: 400
}

.ProductList .ProductItem.item_002 .Info .Price .Sale .B1 {
   display: flex;
   font-size: 22px;
   font-weight: 600
}

.ProductList .ProductItem.item_002 .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch
}

.ProductList .ProductItem.item_002 .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-weight: 600;
   font-size: 15px
}

.ProductList .ProductItem.item_002 .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 15px;
   font-weight: 600
}

.ProductList .ProductItem.item_002 .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #bfbfbf;
   margin-left: 10px;
   text-decoration: line-through
}

.ProductList .ProductItem.item_002 .Info .Price .Old .B1 {
   display: flex;
   font-size: 18px;
   font-weight: 500
}

.ProductList .ProductItem.item_002 .Info .Price .Old .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 14px
}

.ProductList .ProductItem.item_002 .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-size: 12px
}

.ProductList .ProductItem.item_002 .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px
}

.ProductList .ProductItem.item_002 .OtherInfo {
   text-align: center
}

.ProductList .ProductItem.item_002:hover .OtherInfo {
   display: flex
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate {
   width: 100%;
   margin-bottom: 2px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   align-content: center;
   flex-direction: row
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate span {
   width: 100%;
   font-size: 12px
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Point {
   display: flex
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Total {
   font-size: 12px;
   cursor: pointer;
   color: #2196f3;
   padding: 2px 5px;
   border-radius: 2px;
   font-weight: 500
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Total span {
   font-weight: 400
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Total:hover {
   text-decoration: underline
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Point .Star {
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductList .ProductItem.item_002 .OtherInfo .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}

.ProductList .ProductItem.item_003 {
   padding: 14px;
   position: relative;
   border-radius: 16px;
   box-shadow: 0 0 0 1px #f7f7f7;
   width: calc(25% - 12px);
   margin-right: 16px;
   margin-bottom: 16px;
   display: flex;
   flex-direction: column;
   justify-content: space-between
}

.ProductList .ProductItem.item_003:hover {
   z-index: 1;
   box-shadow: 0 0 0 1px #0000001c
}

.ProductList .ProductItem.item_003 .Gallery {
   width: 100%;
   border-radius: 14px;
   overflow: hidden;
   position: relative;
   margin-bottom: 14px
}

.ProductList .ProductItem.item_003 .Gallery .BtnFavorite {
   width: 20px;
   height: 20px;
   flex: none;
   cursor: pointer;
   position: absolute;
   right: 6px;
   top: 6px
}

.ProductList .ProductItem.item_003 .Gallery .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_003 .Gallery .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #5656569c;
   background: #fff;
   border-radius: 100%;
   width: 22px;
   height: 22px;
   text-align: center;
   line-height: 22px
}

.ProductList .ProductItem.item_003 .Gallery .BtnFavorite:hover::before {
   color: #edcce1
}

.ProductList .ProductItem.item_003 .Gallery .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductList .ProductItem.item_003 .Gallery img {
   width: 100%
}

.ProductList .ProductItem.item_003 .Gallery img.image-hover {
   position: absolute;
   z-index: 4;
   top: 0;
   left: 0;
   visibility: hidden;
   -webkit-transition-duration: .7s;
   -o-transition-duration: .7s;
   transition-duration: .7s;
   -webkit-transform: scale(1.1);
   -ms-transform: scale(1.1);
   transform: scale(1.1);
   opacity: 0
}

.ProductList .ProductItem.item_003:hover .Gallery img.image-hover {
   z-index: 1;
   visibility: visible;
   -webkit-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   opacity: 1
}

.ProductList .ProductItem.item_003 .Info {
   width: 100%;
   display: flex;
   flex-direction: column-reverse;
   align-items: center;
   color: #000;
   min-height: 100px
}

.ProductList .ProductItem.item_003:hover .Gallery {
   border-color: #ff5722
}

.ProductList .ProductItem.item_003 .Info .Slogan {
   margin-top: 2px;
   font-size: 14px;
   color: #ba127d
}

.ProductList .ProductItem.item_003 .Info .Name {
   margin: 0;
   min-height: 30px;
   font-weight: 400;
   font-size: 16px;
   display: flex;
   align-items: flex-start;
   justify-content: center;
   text-align: center;
   width: 100%
}

.ProductList .ProductItem.item_003 .Info .Name span {
   width: 100%;
   font-size: 14px
}

.ProductList .ProductItem.item_003 .Info .CampaingPrice {
   display: flex;
   align-items: center;
   border: 1px solid #e91e63;
   border-radius: 3px;
   justify-content: space-between;
   padding: 0 7px
}

.ProductList .ProductItem.item_003 .Info .CampaingPrice>span:nth-child(1) {
   color: #e91e63;
   font-size: 13px
}

.ProductList .ProductItem.item_003 .Info .CampaingPrice>span:nth-child(2) {
   color: #e91e63;
   font-weight: 600;
   padding-left: 10px;
   flex: none;
   text-align: center
}

.ProductList .ProductItem.item_003 .Info .Price {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: row-reverse
}

.ProductList .ProductItem.item_003 .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 14px;
   font-weight: 500;
   display: none
}

.ProductList .ProductItem.item_003 .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #243a4e;
   font-size: 19px;
   font-weight: 600
}

.ProductList .ProductItem.item_003 .Info .Price .Sale.Campaing {
   color: #bfbfbf;
   text-decoration: line-through;
   font-size: 16px
}

.ProductList .ProductItem.item_003 .Info .Price .Sale.Campaing .B1 {
   font-weight: 400
}

.ProductList .ProductItem.item_003 .Info .Price .Sale.Campaing .B2 {
   font-weight: 400
}

.ProductList .ProductItem.item_003 .Info .Price .Sale .B1 {
   display: flex;
   font-weight: 600
}

.ProductList .ProductItem.item_003 .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 11px
}

.ProductList .ProductItem.item_003 .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex
}

.ProductList .ProductItem.item_003 .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px
}

.ProductList .ProductItem.item_003 .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #bfbfbf;
   margin-left: 10px;
   text-decoration: line-through
}

.ProductList .ProductItem.item_003 .Info .Price .Old .B1 {
   display: flex;
   font-size: 18px;
   font-weight: 500
}

.ProductList .ProductItem.item_003 .Info .Price .Old .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 14px
}

.ProductList .ProductItem.item_003 .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-size: 12px
}

.ProductList .ProductItem.item_003 .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px
}

.ProductList .ProductItem.item_003 .OtherInfo {
   text-align: center;
   display: flex
}

.ProductList .ProductItem.item_003:hover .OtherInfo {
   display: flex
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate {
   width: 100%;
   margin-bottom: 2px;
   display: flex;
   justify-content: center;
   align-content: center;
   flex-direction: row;
   align-items: center
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate span {
   width: 100%;
   font-size: 12px
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Point {
   display: flex
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Total {
   font-size: 12px;
   cursor: pointer;
   color: #2196f3;
   padding: 2px 5px;
   border-radius: 2px;
   font-weight: 500;
   display: none
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Total span {
   font-weight: 400
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Total:hover {
   text-decoration: underline
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Point .Star {
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductList .ProductItem.item_003 .OtherInfo .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}

.ProductList .ProductItem.item_003:nth-child(+4n) {
   margin-right: 0
}

.ProductList .ProductItem.item_003 .product-buttons {
   position: absolute;
   z-index: 5;
   bottom: 52px;
   right: 0;
   left: 0;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   visibility: hidden;
   -webkit-box-align: center;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   -webkit-box-pack: center;
   -webkit-justify-content: center;
   -ms-flex-pack: center;
   justify-content: center;
   -webkit-transition: all .5s ease 0s;
   -o-transition: all .5s ease 0s;
   transition: all .5s ease 0s;
   -webkit-transform: translateY(50%);
   -ms-transform: translateY(50%);
   transform: translateY(50%);
   opacity: 0
}

.ProductList .ProductItem.item_003 .product-buttons .btnProductGonder {
   padding: 14px;
   margin: 0 5px;
   text-align: center;
   color: #fff;
   border-radius: 30px;
   background-color: #f33f3e;
   min-width: 120px;
   border: 1px solid transparent
}

.ProductList .ProductItem.item_003 .product-buttons .btnProductGonder i {
   font-size: 16px;
   line-height: 38px
}

.ProductList .ProductItem.item_003 .product-buttons .btnProductGonder:hover {
   background-color: #fff;
   color: #f33f3e;
   border-color: #f33f3e!important
}

.ProductList .ProductItem.item_003:hover .product-buttons {
   visibility: visible;
   -webkit-transform: translateY(0);
   -ms-transform: translateY(0);
   transform: translateY(0);
   opacity: 1
}

.ProductList .ProductItem.item_003 .Info,.ProductList .ProductItem.item_003 .OtherInfo {
   -webkit-transition: all .5s ease 0s;
   -o-transition: all .5s ease 0s;
   transition: all .5s ease 0s
}

.ProductList .ProductItem.item_003:hover .Info,.ProductList .ProductItem.item_003:hover .OtherInfo {
   visibility: hidden;
   -webkit-transform: translateY(-20px);
   -ms-transform: translateY(-20px);
   transform: translateY(-20px);
   opacity: 0
}

.ProductList .ProductItem.item_003 .product-buttons .BtnFavorite {
   flex: none;
   cursor: pointer;
   border: 1px solid #ccc;
   border-radius: 100%;
   padding: 8px
}

.ProductList .ProductItem.item_003 .product-buttons .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_003 .product-buttons .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #5656569c;
   background: #fff;
   border-radius: 100%;
   width: 22px;
   height: 22px;
   text-align: center;
   line-height: 22px
}

.ProductList .ProductItem.item_003 .product-buttons .BtnFavorite:hover::before {
   color: #edcce1
}

.ProductList .ProductItem.item_003 .product-buttons .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductList .ProductItem.item_004 {
   padding: 14px;
   position: relative;
   border-radius: 16px;
   box-shadow: 0 0 0 1px #f7f7f7;
   width: calc(25% - 0px);
   margin-right: 0px;
   margin-bottom: 0px;
   display: flex;
   flex-direction: column;
   justify-content: flex-start
}

.ProductList .ProductItem.item_004:hover {
}

.ProductList .ProductItem.item_004 .Gallery {
   width: 100%;
   border-radius: 14px 14px 0px 0px;
   overflow: hidden;
   position: relative;
}

.ProductList .ProductItem.item_004 .Gallery .BtnFavorite {
   width: 30px;
   height: 28px;
   flex: none;
   cursor: pointer;
   position: absolute;
   right: 10px;
   top: 10px;
   z-index: 11;
}
.ProductList .ProductItem.item_004 .Gallery .CampaingPrice {
   position: absolute;
   left: 10px;
   bottom: 10px;
   background: #f5e3e7;
   color: #1b1b1b;
   border-radius: 4px;
   padding: 0px 12px;
   height: 28px;
   font-size: 12px;
   display: flex;
   align-items: center;
   z-index: 11;
}

.ProductList .ProductItem.item_004 .Gallery .Discount {
   position: absolute;
   left: 10px;
   top: 10px;
   background: #c62a32;
   color: #fff;
   border-radius: 4px;
   padding: 0px 12px;
   height: 28px;
   font-size: 12px;
   display: flex;
   align-items: center;
   z-index: 11;
}

.ProductList .ProductItem.item_004 .Gallery .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_004 .Gallery .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 17px;
   color: #5656569c;
   background: #fff;
   border-radius: 5px;
   width: 28px;
   height: 28px;
   text-align: center;
   line-height: 28px;
}

.ProductList .ProductItem.item_004 .Gallery .BtnFavorite:hover::before {
   color: #ffffff;
   background: #797979;
}

.ProductList .ProductItem.item_004 .Gallery .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductList .ProductItem.item_004 .Gallery img {
   width: 100%
}

.ProductList .ProductItem.item_004 .Gallery img.image-hover {
   position: absolute;
   z-index: 4;
   top: 0;
   left: 0;
   visibility: hidden;
   -webkit-transition-duration: .7s;
   -o-transition-duration: .7s;
   transition-duration: .7s;
   -webkit-transform: scale(1.1);
   -ms-transform: scale(1.1);
   transform: scale(1.1);
   opacity: 0
}

.ProductList .ProductItem.item_004:hover .Gallery img.image-hover {
   z-index: 1;
   visibility: visible;
   -webkit-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   opacity: 1
}

.ProductList .ProductItem.item_004 .Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   color: #000;
   min-height: 100px;
   background: #fff;
   box-shadow: 0 4px 6px #00000014;
   padding: 14px;
}

.ProductList .ProductItem.item_004:hover .Gallery {
   border-color: #ff5722
}

.ProductList .ProductItem.item_004 .Info .Slogan {
   margin-top: 0px;
   font-size: 14px;
   color: #ba1212;
   line-height: 18px;
   height: 18px;
}

.ProductList .ProductItem.item_004 .Info .Name {
   margin: 0;
   min-height: 42px;
   font-weight: 400;
   display: flex;
   align-items: flex-start;
   justify-content: flex-start;
   text-align: left;
   width: 100%;
   font-size: 14px;
   margin-top: 5px;
}

.ProductList .ProductItem.item_004 .Info .Name span {
   width: 100%;
   font-size: 14px
}

.ProductList .ProductItem.item_004 .Info .CampaingPrice {
   display: flex;
   align-items: center;
   border: 1px solid #e91e63;
   border-radius: 3px;
   justify-content: space-between;
   padding: 4px 7px;
   width: 100%
}

.ProductList .ProductItem.item_004 .Info .CampaingPrice>span:nth-child(1) {
   color: #e91e63;
   font-size: 14px
}

.ProductList .ProductItem.item_004 .Info .CampaingPrice>span:nth-child(2) {
   color: #e91e63;
   font-weight: 600;
   padding-left: 10px;
   flex: none;
   text-align: center;
   font-size: 18px
}

.ProductList .ProductItem.item_004 .Info .Price {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   flex-direction: row;
   gap: 12px;
}

.ProductList .ProductItem.item_004 .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 14px;
   font-weight: 500;
   display: none
}

.ProductList .ProductItem.item_004 .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #ee3b45;
   font-size: 22px;
   font-weight: 400;
   font-size: 16px;
}

.ProductList .ProductItem.item_004 .Info .Price .Sale.Campaing {
   color: #858585;
   text-decoration: line-through;
   font-size: 22px
}

.ProductList .ProductItem.item_004 .Info .Price .Sale.Campaing .B1 {
   font-weight: 400
}

.ProductList .ProductItem.item_004 .Info .Price .Sale.Campaing .B2 {
   font-weight: 400
}

.ProductList .ProductItem.item_004 .Info .Price .Sale .B1 {
   display: flex;
   font-weight: 600
}

.ProductList .ProductItem.item_004 .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 11px
}

.ProductList .ProductItem.item_004 .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex
}

.ProductList .ProductItem.item_004 .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px
}

.ProductList .ProductItem.item_004 .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #2c2d2e;
   text-decoration: line-through;
   font-size: 16px;
}

.ProductList .ProductItem.item_004 .Info .Price .Old .B1 {
   display: flex;
   font-size: 18px;
   font-weight: 500
}

.ProductList .ProductItem.item_004 .Info .Price .Old .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 14px
}

.ProductList .ProductItem.item_004 .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-size: 12px
}

.ProductList .ProductItem.item_004 .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px
}

.ProductList .ProductItem.item_004 .OtherInfo {
   text-align: center;
   display: flex
}

.ProductList .ProductItem.item_004:hover .OtherInfo {
   display: flex
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate {
   width: 100%;
   margin-bottom: 2px;
   display: flex;
   justify-content: center;
   align-content: center;
   flex-direction: row;
   align-items: center
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate span {
   width: 100%
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Point {
   display: flex;
   gap: 1px;
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Total {
   font-size: 14px;
   cursor: pointer;
   color: #333333;
   padding: 0 5px;
   border-radius: 2px;
   font-weight: 500;
   font-size: 12px;
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Total span {
   font-weight: 400
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Total:hover {
   text-decoration: underline
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Point .Star {
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #ffc107
}

.ProductList .ProductItem.item_004 .OtherInfo .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 13px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}

.ProductList .ProductItem.item_004:nth-child(+4n) {
   margin-right: 0
}

.ProductList .ProductItem.item_004 .product-buttons {
   position: absolute;
   z-index: 5;
   bottom: 52px;
   right: 0;
   left: 0;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   visibility: hidden;
   -webkit-box-align: center;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   -webkit-box-pack: center;
   -webkit-justify-content: center;
   -ms-flex-pack: center;
   justify-content: center;
   -webkit-transition: all .5s ease 0s;
   -o-transition: all .5s ease 0s;
   transition: all .5s ease 0s;
   -webkit-transform: translateY(50%);
   -ms-transform: translateY(50%);
   transform: translateY(50%);
   opacity: 0
}

.ProductList .ProductItem.item_004 .product-buttons .btnProductGonder {
   padding: 14px;
   margin: 0 5px;
   text-align: center;
   color: #fff;
   border-radius: 30px;
   background-color: #f33f3e;
   min-width: 120px;
   border: 1px solid transparent
}

.ProductList .ProductItem.item_004 .product-buttons .btnProductGonder i {
   font-size: 16px;
   line-height: 38px
}

.ProductList .ProductItem.item_004 .product-buttons .btnProductGonder:hover {
   background-color: #fff;
   color: #f33f3e;
   border-color: #f33f3e!important
}

.ProductList .ProductItem.item_004:hover .product-buttons {
   visibility: visible;
   -webkit-transform: translateY(0);
   -ms-transform: translateY(0);
   transform: translateY(0);
   opacity: 1
}

.ProductList .ProductItem.item_004 .Info,.ProductList .ProductItem.item_004 .OtherInfo {
   -webkit-transition: all .5s ease 0s;
   -o-transition: all .5s ease 0s;
   transition: all .5s ease 0s
}

.ProductList .ProductItem.item_004:hover .Info,.ProductList .ProductItem.item_004:hover .OtherInfo {
}

.ProductList .ProductItem.item_004 .product-buttons .BtnFavorite {
   flex: none;
   cursor: pointer;
   border: 1px solid #ccc;
   border-radius: 100%;
   padding: 8px
}

.ProductList .ProductItem.item_004 .product-buttons .BtnFavorite.Active {
   color: #e3279d
}

.ProductList .ProductItem.item_004 .product-buttons .BtnFavorite::before {
   content: "\f004";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #5656569c;
   background: #fff;
   border-radius: 100%;
   width: 22px;
   height: 22px;
   text-align: center;
   line-height: 22px
}

.ProductList .ProductItem.item_004 .product-buttons .BtnFavorite:hover::before {
   color: #edcce1
}

.ProductList .ProductItem.item_004 .product-buttons .BtnFavorite.Active::before {
   color: #e3279d
}

.Nod001 {
   padding: 15px;
   display: flex;
   justify-content: space-between;
   margin-bottom: 30px;
   padding-top: 0
}

.Nod001 .SearchBar {
   display: flex;
   flex-direction: column
}

.Nod001 .SearchBar .Search {
   padding: 10px;
   width: 420px;
   position: relative;
   padding-bottom: 0
}

.Nod001 .SearchBar .Search input {
   width: 100%;
   border: 0;
   border-bottom: 1px solid #e2e7e9;
   padding: 8px;
   outline: none;
   padding-left: 0
}

.Nod001 .SearchBar .Search .BtnSearch {
   padding: 10px;
   position: absolute;
   right: 0;
   top: 0
}

.Nod001 .SearchBar .SearchKeyList {
   display: flex;
   flex-direction: row;
   padding: 0 10px
}

.Nod001 .SearchBar .SearchKeyList span {
   padding: 4px 0
}

.Nod001 .SearchBar .SearchKeyList a {
   padding: 4px 3px;
   color: #8a8a8a;
   cursor: pointer;
   font-size: 13px
}

.Nod001 .SearchBar .SearchKeyList a:hover {
   padding: 4px 3px;
   color: #ba127d;
   cursor: pointer
}

.Nod001 .UserNav {
   display: flex;
   flex-direction: row;
   align-content: center;
   justify-content: center;
   align-items: center
}

.Nod001 .UserNav .Btn {
   display: flex;
   padding: 5px;
   align-items: center;
   align-content: stretch;
   justify-content: flex-start;
   margin: 0 0 0 10px;
   cursor: pointer
}

.Nod001 .UserNav .Btn .Icon {
   font-size: 28px;
   display: none
}

.Nod001 .UserNav .Btn .Icon i {
   padding: 10px
}

.Nod001 .UserNav .Btn .Text {
   padding: 1px;
   display: flex;
   flex-direction: row;
   font-size: 15px;
   align-items: center;
   text-transform: uppercase
}

.Nod001 .UserNav .Btn .Text span {
   padding: 0
}

.Nod001 .UserNav .Btn.BtnFavorite .Icon {
   color: #f44336
}

.Nod001 .UserNav .Btn.BtnFollow .Icon {
   color: #673ab7
}

.Nod001 .UserNav .Btn.BtnAccount .Icon {
   color: #ff9800
}

.Nod001 .UserNav .Btn.BtnBag .Icon {
   color: #c31181
}

.Nod001 .UserNav .Btn.BtnBag .Text span.Count {
   width: 100%;
   font-weight: 400;
   margin-left: 10px;
   font-size: 13px;
   text-transform: capitalize
}

.sub-item.dropdown-item.Active .menu-link::before {
   content: "";
   position: absolute;
   width: 6px;
   height: 6px;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.menu-link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 600;
   font-size: 21px;
   padding: 10px 0;
   opacity: .9;
   cursor: pointer;
   text-decoration: none
}

.item.dropdown-item .dropdown-content {
   padding-left: 15px;
   padding-bottom: 10px;
   padding-top: 8px;
   display: none
}

.item.dropdown-item .dropdown-content .link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 100;
   font-size: 16px;
   padding: 7px 0;
   opacity: .9
}

.item.dropdown-item .dropdown-content .link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.item.dropdown-item .dropdown-content .link:hover::before {
   width: 6px;
   height: 6px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item {
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 100;
   font-size: 16px;
   padding: 7px 0;
   opacity: .9
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link:hover::before {
   width: 6px;
   height: 6px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .menu-link:hover {
   opacity: 1
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content {
   padding-left: 15px;
   display: none
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content .menu-link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 600;
   font-size: 16px;
   padding: 7px 0;
   opacity: .9;
   cursor: pointer
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content .menu-link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item .dropdown-content .menu-link:hover::before {
   width: 6px;
   height: 6px
}

.item.dropdown-item .dropdown-content .sub-item.dropdown-item.Active .menu-link::before {
   content: "";
   position: absolute;
   width: 6px;
   height: 6px;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.company-nav {
   margin-top: 20px
}

.company-nav .info-text {
   display: flex;
   align-items: center;
   color: #000;
   font-size: 18px;
   padding: 8px 0;
   font-weight: 500;
   cursor: pointer
}

.company-nav .info-text::before {
   content: "\f067";
   font-size: 11px;
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

.company-nav .info-detail {
   padding-left: 15px;
   display: none
}

.company-nav .info-detail .link {
   position: relative;
   display: block;
   color: #000;
   font-weight: 100;
   font-size: 15px;
   opacity: .9;
   margin-bottom: 3px;
   padding: 2px 0;
   text-decoration: none
}

.company-nav .info-detail .link::before {
   content: "";
   position: absolute;
   width: 0;
   height: 0;
   background-color: #000;
   border-radius: 50%;
   transition: .3s;
   transform: translateX(-15px);
   top: 12px
}

.company-nav .info-detail .link:hover::before {
   width: 6px;
   height: 6px
}

header-nav-container .company-nav .info-detail .link:hover {
   opacity: .7
}

.Nod002 {
   display: flex;
   margin-bottom: 30px;
   padding: 15px
}

.Nod002 .Banner:nth-child(1) {
   display: flex;
   height: 380px;
   width: 100%
}

.Nod002 .Banner:nth-child(2) {
   display: flex;
   height: 380px;
   width: 420px;
   flex: none;
   margin-left: 15px
}

.Nod002 .Banner img {
   width: 100%
}

.Mod004 {
   display: block;
   padding: 15px;
   padding-bottom: 5px
}

.Mod004 .breadcrumb {
   margin: 0;
   padding: 0;
   font-size: 13px;
   display: flex;
   flex-direction: row;
   align-content: center;
   justify-content: flex-start;
   align-items: center;
   margin-bottom: 15px
}

.Mod004 .breadcrumb li {
   list-style: none;
   color: #666
}

.Mod004 .breadcrumb li:before {
   content: "\f054";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #ba1e7d;
   margin: 0 5px;
   font-weight: 100;
   font-size: 9px
}

.Mod004 .breadcrumb li:nth-child(1):before {
   content: "\f015";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #c31281;
   margin: 0;
   font-size: 16px
}

.Mod004 .breadcrumb li a {
   color: #333;
   text-decoration: none;
   font-family: inherit;
   font-size: 13px
}

.Mod004 .breadcrumb li a:hover {
   color: #000
}

.Mod004 .breadcrumb li a span {
   padding: 0 5px;
   color: #4d4d4d;
   text-decoration: none;
   font-family: inherit
}

.Mod004 .breadcrumb li a span.home {
   float: left;
   padding: 0
}

.Mod004 .breadcrumb li.active {
   float: left
}

.Mod004 .breadcrumb li.active span {
   padding: 0 5px
}

.ProductListContainer {
   width: 100%;
   display: flex;
   padding: 0 15px
}
.ProductListContainer .FilterArea{
   width: 300px;
   flex: none;
}
.ProductListContainer .FilterArea .Filter{
   width: 100%;
   display:flex;
   flex-direction: column;
   gap: 10px;
   overflow: auto;
}

.ProductListContainer .FilterArea .Title{
   display:none;
}
.ProductListContainer .FilterArea .Filter .FilterBox{
   width: 100%;
   border-bottom: 1px solid #acacac;
   padding-bottom: 15px;
}
.ProductListContainer .FilterArea .Filter .Selected{
   width: 100%;
   font-weight: 700;
   font-size: 14px;
   text-transform: uppercase;
   margin-bottom: 12px;
}
.ProductListContainer .FilterArea .Filter .Wind{
   display: flex;
   flex-direction: column;
   gap: 5px;
}
.Category {
   width: 100%;
   display: block;
   padding: 0 15px
}

.Category .Info {
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-content: center;
   align-items: center;
   margin-bottom: 15px;
   margin-top: 15px;
   position: relative;
   z-index: 6
}

.Category .Info .Title {
   width: 100%;
   font-size: 26px;
   color: #333;
   line-height: 26px;
   font-weight: 500;
}

.Category .Info .Title span {
   width: 100%;
   font-size: 12px;
   font-weight: 500;
   color: #999;
   letter-spacing: -.08px
}

.Category .Info .SortArea {
   width: 100%;
   display: flex;
   justify-content: flex-end
}

.Category .Info .SortArea .Sort {
   position: relative;
   z-index: 1
}

.Category .Info .SortArea .SortOverFlow {
   background: 0 0;
   position: fixed;
   left: 0;
   top: 0;
   bottom: 0;
   width: 100%;
   height: 0;
   z-index: 0;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in
}

.Category .Info .SortArea.Active .SortOverFlow {
   background: #00000082;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   height: 100%
}

.Category .Info .SortArea .Sort .Selected {
   width: 100%;
   padding: 5px 10px 7px;
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   box-shadow: 0 0 0 0 #000;
   cursor: pointer;
   display: flex;
   align-content: center;
   justify-content: space-between;
   align-items: center
}

.Category .Info .SortArea .Sort .Selected::after {
   content: "\f078";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #000;
   padding-left: 15px
}

.Category .Info .SortArea .Sort .Wind {
   width: 100%;
   display: none;
   position: absolute;
   right: 0;
   top: 0;
   background: #fff;
   padding: 5px;
   border: 1px solid #e2e7e969;
   border-radius: 4px;
   box-shadow: -2px 17px 37px -10px #00000059;
   width: 200px
}

.Category .Info .SortArea .Sort:hover .Wind {
   display: block
}

.Category .Info .SortArea .Sort .Wind div {
   width: 100%;
   line-height: 30px;
   cursor: pointer;
   padding: 0 8px;
   border-radius: 4px;
   display: flex;
   align-content: center;
   justify-content: space-between;
   align-items: center
}

.Category .Info .SortArea .Sort .Wind div:hover {
   background: #efefef70
}

.Category .Info .SortArea .Sort .Wind div.Active::after {
   content: "\f00c";
   font-size: 11px;
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #4caf50
}

.Category .Text {
   width: 100%;
   padding: 16px;
   font-size: 13px;
   font-weight: 300;
   background: #fff;
   border: 1px solid #e9e9e9;
   margin-bottom: 25px;
}

.Category .FilterAreaMobile {
   display: none
}

.Category .FilterArea {
   position: relative;
   z-index: 4
}

.Category .FilterArea .Filter {
   width: 100%;
   margin-bottom: 15px;
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   box-shadow: 0 0 0 0 #000;
   display: flex;
   align-content: center;
   justify-content: flex-start;
   align-items: center
}

.Category .FilterArea .FilterBox {
   position: relative
}

.Category .FilterArea .FilterApply {
   position: absolute;
   bottom: 65px;
   background: #4caf50;
   color: #fff;
   width: 80%;
   margin: 0 10%;
   box-shadow: 0 100px 0 120px #fff,0 42px 0 62px #000;
   padding: 12px;
   text-align: center;
   font-size: 15px;
   border-radius: 6px;
   z-index: 3;
   display: none
}

.Category .FilterArea .FilterBox .Selected {
   width: 100%;
   padding: 12px 14px 12px 10px;
   border-right: 1px solid #e2e7e9;
   box-shadow: 0 0 0 0 #000;
   cursor: pointer;
   display: flex;
   align-content: center;
   justify-content: space-between;
   align-items: center
}

.Category .FilterArea .FilterBox .Selected span {
   color: #c32081;
   padding-left: 5px;
   font-size: 12px
}

.Category .FilterArea .FilterBox.Active .Selected {
   box-shadow: 0 1px 0 0 #fff;
   position: relative;
   z-index: 2
}

.Category .FilterArea .FilterBox .Selected::after {
   content: "\f078";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #000;
   padding-left: 15px;
   font-size: 9px
}

.Category .FilterArea .FilterBox .Wind {
   width: 100%;
   display: none;
   position: absolute;
   left: -1px;
   top: calc( 100% - -1px );
   background: #fff;
   padding: 7px 12px;
   border: 1px solid #e2e7e9;
   border-top: 1px solid #fff;
   border-radius: 0 0 4px 4px;
   box-shadow: -2px 25px 37px -10px #00000059;
   width: 200px;
   overflow: auto;
   max-height: 340px
}

.Category .FilterArea .FilterBox.Active .Wind {
   display: block
}

.Category .FilterArea .FilterBox.Active .Selected::after {
   color: #c52082
}

.Category .FilterArea .FilterBox .Wind>span {
   width: 100%;
   line-height: 24px
}

.Category .FilterArea .FilterBox.Active .Wind .BtnClear {
   color: #c52082;
   font-size: 11px;
   cursor: pointer;
   display: flex;
   align-items: center;
   margin-bottom: 2px
}

.Category .FilterArea .FilterBox.Active .Wind .BtnClear:hover {
   text-decoration: underline
}

.Category .FilterArea .FilterBox.Active .Wind .BtnClear::before {
   content: "\f056";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   padding-right: 4px
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea {
   display: flex;
   flex-direction: row;
   align-items: stretch;
   justify-content: center
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea input {
   width: 40%;
   outline: none;
   border: 1px solid #ccc;
   padding: 4px;
   margin-right: 10px;
   border-radius: 2px;
   font-size: 12px
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea .Btn {
   width: 20%;
   background: #34495e;
   color: #fff;
   padding: 10px;
   border-radius: 2px;
   text-align: center;
   cursor: pointer
}

.Category .FilterArea .FilterBox.Active .Wind .InputArea .Btn:hover {
   background: #283c50
}

.ProductView {
   width: 100%;
   display: flex;
   padding-bottom: 30px;
   padding-left: 16px;
   padding-right: 16px;
}

.ProductView .Gallery {
   /* width: 50%; */
   padding-left: 0;
   padding-right: 15px;
   display: flex
}

.ProductView .Gallery .SmallList {
   width: 80px;
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   flex: none;
   gap: 8px;
}

.ProductView .Gallery .SmallList .gallery-item .zoom-gallery2 img {
   width: 100%;
   border-radius: 4px;
   cursor: pointer;
   border: 1px solid transparent;
   overflow: hidden;
}

.ProductView .Gallery .SmallList .gallery-item:hover .zoom-gallery2 img {
   width: 100%;
   box-shadow: 0 0 0 1px #41c346;
   border-color: #41c346
}

.ProductView .Gallery .SmallList .gallery-item .zoom-gallery2.Active img {
   box-shadow: 0 0 0 1px #000000;
   border-color: #fff;
}

.ProductView .Gallery .Big {
   /* width: 100%; */
   min-width: 560px;
   margin-left: 30px;
   position: relative
}

.ProductView .Gallery .Big img {
   width: 100%;
   border-radius: 6px;
   cursor: zoom-in
}

.ProductView .InfoBox {
   width: 50%;
   padding-left: 15px;
   padding-right: 0
}

.ProductView .InfoBox .Info {
   width: 100%;
}

.ProductView .InfoBox .Info .Name {
   width: 100%;
   font-size: 24px;
   font-weight: 600;
}

.ProductView .InfoBox .Info .Code {
   width: 100%;
   font-size: 14px;
   margin-bottom: 20px;
}

.ProductView .InfoBox .Info .Rate {
   width: 100%;
   margin-bottom: 2px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   align-content: center;
   gap: 13px;
}

.ProductView .InfoBox .Info .Rate span {
   width: 100%;
   font-size: 14px
}

.ProductView .InfoBox .Info .Rate .Point {
   display: flex;
   gap: 3px;
}

.ProductView .InfoBox .Info .Rate .Total {
   font-size: 14px;
   cursor: pointer;
   color: #242424;
   font-weight: 400;
   display: flex;
   gap: 6px;
}

.ProductView .InfoBox .Info .Rate .Total span {
   font-weight: 400
}

.ProductView .InfoBox .Info .Rate .Total:hover {
   text-decoration: underline
}

.ProductView .InfoBox .Info .Rate .Point .Star {
}

.ProductView .InfoBox .Info .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductView .InfoBox .Info .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   color: #ffc107
}

.ProductView .InfoBox .Info .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1;
   color: #ccc
}

.ProductView .InfoBox .Info .Price {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   display: none;
}

.ProductView .InfoBox .Info .Price .Discount {
   background: red;
   color: #fff;
   border-radius: 3px;
   flex: none;
   padding: 2px 4px;
   font-size: 16px;
   border: 0;
   margin-right: 10px
}

.ProductView .InfoBox .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #34495e;
   font-weight: 600
}

.ProductView .InfoBox .Info .Price .Sale .B1 {
   display: flex;
   font-size: 26px
}

.ProductView .InfoBox .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 19px
}

.ProductView .InfoBox .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex
}

.ProductView .InfoBox .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 11px
}

.ProductView .InfoBox .Info .Price .Sale.Campaing {
   display: none;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #a9a9a9;
   margin-right: 10px;
   font-weight: 500;
   text-decoration: line-through
}

.ProductView .InfoBox .Info .Price .Sale.Campaing .B1 {
   display: flex;
   font-size: 20px
}

.ProductView .InfoBox .Info .Price .Sale.Campaing .B2 {
   font-size: 14px;
   display: flex
}

.ProductView .InfoBox .Info .Price .Old {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   color: #a9a9a9;
   margin-right: 10px;
   font-weight: 500;
   text-decoration: line-through
}

.ProductView .InfoBox .Info .Price .Old .B1 {
   display: flex;
   font-size: 20px
}

.ProductView .InfoBox .Info .Price .Old .B2 {
   font-size: 14px;
   display: flex
}

.ProductView .InfoBox .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex
}

.ProductView .InfoBox .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 11px
}

.ProductView .InfoBox .Info .CampaingPrice {
   display: flex;
   border: 1px solid #e91e63;
   border-radius: 3px;
   padding: 3px 7px;
   align-items: center;
   width: fit-content;
   margin-top: 5px;
   font-size: 16px;
   display: none;
}

.ProductView .InfoBox .Info .CampaingPrice>span:nth-child(1) {
   color: #e91e63
}

.ProductView .InfoBox .Info .CampaingPrice>span:nth-child(2) {
   color: #e91e63;
   font-weight: 600;
   padding-left: 10px
}

.ProductView .InfoBox .VariantList {
   width: 100%;
   display: flex;
   flex-direction: column;
   background: #e8edef73;
   padding: 14px;
   border-radius: 6px;
   margin-bottom: 18px
}

.ProductView .InfoBox .VariantList .VariantItem {
   width: 100%;
   display: flex;
   border: 2px solid #f4f6f6;
   padding: 8px;
   border-radius: 4px;
   margin-bottom: 4px;
   cursor: pointer;
   background: #fff
}

.ProductView .InfoBox .VariantList .VariantItem>.Icon {
   width: 40px;
   margin-right: 10px
}

.ProductView .InfoBox .VariantList .VariantItem>.Icon:before {
   content: "\f111";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #cfdade;
   margin: 0;
   font-size: 16px
}

.ProductView .InfoBox .VariantList .VariantItem>.Name {
   width: 100%;
   display: flex
}

.ProductView .InfoBox .VariantList .VariantItem>.Price {
   text-align: center;
   display: flex;
   width: inherit;
   justify-content: flex-end;
   font-weight: 600
}

.ProductView .InfoBox .VariantList .VariantItem.Active {
   border-color: #41c346
}

.ProductView .InfoBox .VariantList .VariantItem.Active>.Icon:before {
   content: "\f111";
   color: #41c346
}

.ProductView .InfoBox .Variants{width:100%;display: flex;flex-direction: row;gap: 10px;margin-top: 20px;}
.ProductView .InfoBox .Variants .VariantItem{width:100%;background: #fff;display: flex;align-items: center;justify-content: flex-start;padding: 8px;cursor: pointer;border-radius: 4px;border: 1px solid #cfcfcf;transition: .3s allease-in-out;flex-direction: column;}
.ProductView .InfoBox .Variants .VariantItem:hover{
   border-color: #6a6a6a;
}
.ProductView .InfoBox .Variants .VariantItem .Photo{width: 54px;height: 54px;background: #fff;border: 1px solid #e3e3e3;overflow: hidden;border-radius: 100%;background-size: cover;margin: 4px 0px 12px 0px;}
.ProductView .InfoBox .Variants .VariantItem .Photo>img{height: 100%;}
.ProductView .InfoBox .Variants .VariantItem .Check{width: 14px;height: 14px;border: 1px solid #41a345;flex: none;margin-right: 12px;border-radius: 100%;display: none;}
.ProductView .InfoBox .Variants .VariantItem.Active{border-color: #6a6a6a;}
.ProductView .InfoBox .Variants .VariantItem.Active .Check{background: #41a345;box-shadow: inset 0px 0px 0px 4px #fff;}
.ProductView .InfoBox .Variants .VariantItem .Name{font-size: 12px;color: #000;max-width: 90%;line-height: 15px;text-align: center;font-weight: 400;}
.ProductView .InfoBox .Variants .VariantItem .Campaing{background: #f5e3e7;width: 100%;border-radius: 4px;padding: 2px 12px;font-size: 12px;margin: 5px 0px;}
.ProductView .InfoBox .Variants .VariantItem .Price{font-size: 15px;font-weight: 700;margin-left: auto;display: flex;align-items: center;justify-content: center;margin-top: auto;order: 1;}
.ProductView .InfoBox .Variants .VariantItem .Price>.Old{display: none;}
.ProductView .InfoBox .Desc {
}
.ProductView .InfoBox .Desc {
   display: inline-block;
   margin: 20px 20px 0px 0;
   padding: 10px;
   border-radius: 24px;
   background-color: #f5e3e7;
   font-weight: 300;
   font-size: 13px;
   line-height: 1;
}
.ProductView .InfoBox .Desc:empty{
   display: none;
}

.ProductView .Information{display: none !important;!i;!;}
.ProductView .InfoBox .BtnList {
   width: 100%;
   display: flex;
   flex-direction: column;
   gap: 10px;
}
.ProductView .InfoBox .BtnList .CampaingPrice{
   align-items: center;
   display: inline-block;
   margin: 20px 0px 0px 0;
   padding: 10px;
   border-radius: 4px;
   background-color: #c62a32;
   color: #fff;
   font-size: 13px;
   line-height: 1;
   width: fit-content;
   font-weight: 400;
}
.ProductView .InfoBox .BtnList .Price{
   width: 100%;
   display: flex;
   flex-direction: row;
   gap: 16px;
   justify-content: flex-start;
   margin: 20px 0px;
   align-items: center;
}
.ProductView .InfoBox .BtnList .CampaingPrice + .Price{
   margin-top:0
}
.ProductView .InfoBox .BtnList .Price .Old{
   display: flex;
   flex-direction: row;
   gap: 10px;
   font-size: 18px;
   text-decoration: line-through;
   color: #2c2d2e;
}
.ProductView .InfoBox .BtnList .Price .Sale{
   display: flex;
   flex-direction: row;
   gap: 10px;
   font-size: 18px;
   color: #c62a32;
}
.ProductView .InfoBox .BtnList .Price .Discount{
   background: #c62a32;
   color: #fff;
   padding: 0 11px;
   line-height: 28px;
   border-radius: 6px;
   font-size: 11px;
}
.ProductView .InfoBox .BtnList .Stock{
   width: 100%;
   display: flex;
   gap: 10px;
   align-items: center;
   border-top: 1px solid #e2e2e2;
   padding-top: 8px;
}
.ProductView .InfoBox .BtnList .Stock>span:nth-child(1){
   width: 8px;
   height: 8px;
   background: #0f834d;
   border-radius: 100%;
   flex: none;
}
.ProductView .InfoBox .BtnList .Stock>span:nth-child(2){
   color: #0f834d;
}

.ProductView .InfoBox .BtnList .BtnAdd {
   font-size: 18px;
   background: 0 0;
   padding: 13px 30px;
   border-radius: 5px;
   color: #41c347;
   text-align: center;
   cursor: pointer;
   position: relative;
   z-index: 0;
   box-shadow: inset 0 0 0 1px #41c347
}

.ProductView .InfoBox .BtnList .BtnAdd i {
   margin-right: 5px;
   color: #41c347
}

.ProductView .InfoBox .BtnList .BtnAdd:hover {
   background: #41c3470f
}

.ProductView .InfoBox .BtnList .BtnAdd.Disabled {
   opacity: .7;
   color: #bcc7cb;
   pointer-events: none
}

.ProductView .InfoBox .BtnList .BtnAdd.Disabled i {
   opacity: .3
}

.ProductView .InfoBox .BtnList .BtnAdd.Active {
   background: #d8e1e5;
   pointer-events: none;
   padding-left: 36px
}

.ProductView .InfoBox .BtnList .BtnAdd.Active::before {
   content: "";
   background: #a0b4bd url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 100%;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11;
   background-size: 39px;
   position: absolute;
   left: 0;
   background-position: 50%
}

.ProductView .InfoBox .MobilArea {
   display: none
}

.ProductView .InfoBox .MobilArea .Btn-Whatsap {
   float: left;
   border-radius: 4px;
   border: 1px solid #4caf50;
   cursor: pointer;
   text-align: center;
   color: #368c39;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.ProductView .InfoBox .MobilArea .Btn-Phone {
   float: left;
   border-radius: 4px;
   border: 1px solid #ff5722;
   cursor: pointer;
   text-align: center;
   color: #ff5722;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.ProductView .InfoBox .BtnList .BtnComplete {
   font-size: 18px;
   background: #21ba6a;
   padding: 8px 30px;
   border-radius: 5px;
   color: #fff;
   text-align: center;
   cursor: pointer;
   position: relative;
   z-index: 0;
   line-height: 40px;
   margin-bottom: 12px;
}

.ProductView .InfoBox .BtnList .BtnComplete:hover {
   background: #315fc6;
}

.ProductView .InfoBox .BtnList .BtnComplete.Active {
   background: #34a93a;
   pointer-events: none;
   padding-left: 40px
}

.ProductView .InfoBox .BtnList .BtnComplete.Active::before {
   content: "";
   background: #18641c url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 100%;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11;
   background-size: 39px;
   position: absolute;
   left: 0;
   background-position: 50%
}

.ProductView .InfoBox .BtnList .BtnComplete.Disabled {
   opacity: .7;
   background: #e8edef;
   color: #bcc7cb;
   pointer-events: none
}

.ProductView .InfoBox .BtnList .BtnComplete.Disabled i {
   opacity: .3
}

.ProductView .InfoBox .BtnList .BtnFavorite {
   width: 100%;
   line-height: 45px;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid #000;
   box-shadow: 3px 3px 0 1px #0000004a;
   border-radius: 4px;
   gap: 10px;
   font-weight: 400;
}

.ProductView .InfoBox .BtnList .BtnFavorite:hover {
   background: #fff
}

.ProductView .InfoBox .BtnList .BtnFavorite.Active {
   color: #e3279d;
   box-shadow: inset 0 0 0 1px #e3279d
}


.ProductView .InfoBox .BtnList .BtnFavorite:hover::before {
   color: #e3279d94
}

.ProductView .InfoBox .BtnList .BtnFavorite.Active::before {
   color: #e3279d
}

.ProductView .InfoBox .BtnList .Pricebox {
   display: none
}

.ProductView .InfoBox .nonLocation {
   width: 100%;
   position: relative;
   margin: 15px 0;
   z-index: 1;
   color: #000;
   font-size: 12px;
   background: #f9f4e6;
   padding: 6px;
   border-radius: 2px
}

.ProductView .InfoBox .nonLocation a {
   color: #000;
   font-weight: 700;
   text-decoration: underline
}

.ProductView .InfoBox .LocationArea {
   width: 100%;
   position: relative;
   margin: 15px 0;
   z-index: 2
}

.ProductView .InfoBox .LocationArea .LocationInput {
   width: 100%;
   background: #e9e9e9;
   padding: 10px;
   border-radius: 4px;
   font-size: 12px;
   position: relative;
   z-index: 1
}

.ProductView .InfoBox .LocationArea .LocationInput::before {
   content: "\f041";
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 30px;
   position: absolute;
   left: 22px;
   top: 14px;
   color: #78a18c;
}

.ProductView .InfoBox .LocationArea .LocationInput.Active::before {
   color: #41a245
}

.ProductView .InfoBox .LocationArea .LocationInput.Active {
   border-color: #4fc954
}

.ProductView .InfoBox .LocationArea .LocationInput input {
   width: 100%;
   background: #fff;
   padding: 12px 35px;
   border: 1px solid #cfcfcf;
   border-radius: 4px;
   font-size: 14px;
   outline: none;
   text-indent: 6px
}
.ProductView .InfoBox .LocationArea .LocationInput input::placeholder {
   font-size:14px
}
.ProductView .InfoBox .LocationArea .LocationInput input.Active {
   border: 1px solid transparent;
   color: #216424
}

.ProductView .InfoBox .LocationArea.Error .LocationInput input {
   border: 1px solid #ff000047;
   color: #d51010
}

.ProductView .InfoBox .LocationArea.Error .LocationInput::before {
   color: #d51010
}

.ProductView .InfoBox .LocationArea.Error .ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block
}

.ProductView .InfoBox .LocationArea .ErrorText {
   display: none
}

.ProductView .InfoBox .LocationArea .LocationInput .ClosedIcon {
   position: absolute;
   right: 21px;
   top: 19px;
   display: none;
   font-size: 22px;
   color: #41a245;
   cursor: pointer
}

.ProductView .InfoBox .LocationArea .LocationInput.Active .ClosedIcon {
   display: block
}

.ProductView .InfoBox .LocationArea .list-group {
   width: calc(100% - 16px);
   position: absolute;
   left: 8px;
   z-index: 2;
   top: calc(100% - 10px);
   background: #fff;
   max-height: 180px;
   overflow: auto;
   padding: 0 10px 0 35px;
   border-radius: 0 0 4px 4px;
   border: 1px solid #e8edef73;
   border-top: 1px solid #fff;
   box-shadow: -7px 29px 38px -11px #00000057;
   margin: 0;
   display: none
}
.LocationSelectedBar{
   width: 100%;
}
.LocationSelectedBar>.List{
   position: absolute;
   top: 100%;
   background: #fff;
   padding: 12px;
   width: 100%;
   border-radius: 4px;
   border: 1px solid #e8edef;
   box-shadow: 0px 6px 7px -3px #00000030;
   overflow: auto;
   margin-top: 10px;
   max-height: 200px;
}
.LocationSelectedBar>.List .LocationItem{
   width: 100%;
   cursor: pointer;
}
.LocationSelectedBar>.List .LocationItem>div:hover{
   background: #f4f6f6bf;
}
.LocationSelectedBar>.List .LocationItem>div{
   width: 100%;
   padding: 0px 6px;
   border-radius: 8px;
}
.LocationSelectedBar>.List .LocationItem>div>span{
   line-height: 30px;
   font-size: 14px;
   font-weight: 600;
}
.LocationSelectedBar>.List .LocationItem>div>span:nth-child(1){
   width: 100%;
}
.LocationSelectedBar>.List .LocationItem>div>span:nth-child(2){
   width: 100%;
}
.LocationSelectedBar>.List .LocationItem>div>span:nth-child(3){
   width: 100%;
}

.ProductView .InfoBox .LocationArea .list-group .list-group-item {
   width: 100%;
   padding: 5px 10px;
   cursor: pointer;
   box-shadow: inset 0 0 0 1px #e2e7e947;
   margin-bottom: 5px;
   border-radius: 16px;
   list-style: none;
   font-size: 13px
}

.ProductView .InfoBox .LocationArea .list-group .list-group-item:hover {
   width: 100%;
   background: #e8f5e9;
   box-shadow: inset 0 0 0 1px #4bae4f6b
}

.ProductView .InfoBox .LocationArea .list-group .list-group-item::before {
   content: "\f041";
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 17px;
   position: absolute;
   left: 16px;
   color: #4bae4f
}

.ProductView .InfoBox .CargoViewArea {
   width: 100%;
   margin: 15px 0;
   display: none;
   position: relative;
   z-index: 0
}

.ProductView .InfoBox .CargoViewArea.Active {
   display: flex;
   flex-direction: row;
   align-items: revert;
   flex-wrap: wrap;
   align-content: flex-start;
   border: 1px solid #fff;
   background: #e8edef;
   padding: 9px;
   border-radius: 4px
}

.ProductView .InfoBox .DayArea {
   width: 100%;
   margin: 15px 0;
   display: none;
   position: relative;
   z-index: 0
}

.ProductView .InfoBox .DayArea.Active {
   display: flex;
   flex-direction: row;
   align-items: revert;
   flex-wrap: wrap;
   align-content: flex-start
}

.ProductView .InfoBox .DayArea .DayItemArea {
   width: calc(25% - 8px);
   position: relative;
   margin-right: 10px;
   z-index: 1;
   height: auto;
   display: flex;
   flex-direction: column;
   justify-content: stretch;
   align-items: stretch
}

.ProductView .InfoBox .DayArea .DayItem {
   width: 100%;
   border: 1px solid #cfcfcf;
   border-radius: 4px;
   background: #ffffff;
   padding: 5px;
   display: flex;
   flex-direction: column;
   cursor: pointer;
   position: relative;
   height: auto;
   align-items: center;
   min-height: 78px;
   justify-content: center;
   font-size: 14px;
}

.ProductView .InfoBox .DayArea .DayItemArea:last-child {
   margin-right: 0
}

.ProductView .InfoBox .DayArea .DayItem input {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   z-index: 999;
   font-size: 0;
   cursor: pointer
}

.ProductView .InfoBox .DayArea .DayItem span:nth-child(1) {
   position: relative;
   z-index: 1;
   font-size: 13px;
   font-weight: 600;
   line-height: 20px
}

.ProductView .InfoBox .DayArea .DayItem span:nth-child(2) {
   font-size: 14px;
   font-weight: 400;
   text-align: center
}

.ProductView .InfoBox .DayArea .DayItem span:nth-child(3) {
   font-size: 14px;
   font-weight: 400
}

.ProductView .InfoBox .DayArea .DayItem:hover {
   border-color: #6a6a6a;
   background: #ffffff;
}

.ProductView .InfoBox .DayArea .DayItem.Active {
   border: 1px solid #24834d;
   background: #24834d;
   color: #fff;
}

.ProductView .InfoBox .DayArea .DayItem.Disabled {
   border: 1px solid #c6cfd3;
   background: #d6dce0;
   color: #999;
   pointer-events: none
}

.ProductView .InfoBox .DayArea .DayItem.clickDisabled {
   border: 1px solid #c6cfd3;
   background: #d6dce0;
   color: #999
}

.ProductView .InfoBox .DayArea.Error .DayItemArea>.DayItem {
   border: 1px solid red;
   color: red
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select {
   background-size: 14px;
   -webkit-appearance: none;
   -moz-appearance: none
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea {
   margin-top: 10px;
   height: 0;
   display: block;
   overflow: hidden;
   transition: all .2s ease-in
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Show {
   height: 32px;
   transition: all .2s ease-in
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Show.Multiple {
   display: flex;
   gap: 7px
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Show.Multiple select {
   text-align: left
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select {
   background-color: #51b549!important;
   color: #fff;
   -webkit-border-radius: 4px;
   -webkit-background-clip: padding-box;
   -moz-border-radius: 4px;
   -moz-background-clip: padding;
   border-radius: 4px;
   background-clip: padding-box;
   width: 100%;
   height: 32px;
   border: none;
   padding: 5px;
   font-size: 12px;
   text-align: center
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea.Error select {
   background-color: red!important;
   border: 1px solid #e64e41
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select:focus {
   outline: none
}

.ProductView .InfoBox .DayArea .DayItemArea .HourSelectArea select option {
   padding: 5px 0
}

.ProductView .InfoBox .DayArea .ErrorText {
   display: none
}

.ProductView .InfoBox .DayArea.Error .ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block
}

.ProductView .InfoBox .HourArea {
   width: 100%;
   margin-bottom: 5px;
   display: none;
   position: relative;
   z-index: 0;
}

.ProductView .InfoBox .HourArea.Active {
   display: inline-block;
}

.ProductView .InfoBox .HourArea .HourItem {
   width: calc(25% - 8px);
   position: relative;
   margin-right: 10px;
   margin-bottom: 10px;
   z-index: 1;
   border: 1px solid #cfcfcf;
   border-radius: 4px;
   background: #ffffff;
   padding: 5px;
   display: flex;
   float: left;
   justify-content: center;
   align-items: center;
   cursor: pointer;
   font-size: 14px;
}

.ProductView .InfoBox .HourArea .HourItem:hover {
   border-color: #6a6a6a;
}

.ProductView .InfoBox .HourArea .HourItem.Active {
   border: 1px solid #24834d;
   background: #24834d;
   color: #fff
}

.ProductView .InfoBox .HourArea .HourItem:nth-child(+4n) {
   margin-right: 0
}

.ProductView .InfoBox .HourArea.Error .HourItem {
   border: 1px solid red;
   color: red
}

.ProductView .InfoBox .HourArea .ErrorText {
   display: none
}

.ProductView .InfoBox .HourArea.Error .ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block
}

.ProductView .InfoBox .LastHourArea {
   width: 100%;
   position: relative;
   z-index: 0;
   padding: 8px;
   background: #fffbda;
   border: 1px solid #f5f2d0;
   border-radius: 4px;
   margin-bottom: 15px
}

.ProductView .InfoBox .LastHourArea .Timer {
   width: 100%;
   z-index: 0
}

.ProductView .InfoBox .LastHourArea .Timer .Text {
   width: 100%;
   margin-bottom: 5px;
   z-index: 0;
   display: flex;
   align-items: center;
   justify-content: center
}

.ProductView .InfoBox .LastHourArea .Timer svg {
   width: 28px;
   margin-bottom: 5px;
   position: relative;
   z-index: 0;
   margin-right: 10px
}

.ProductView .InfoBox .LastHourArea .Timer span {
   width: 100%;
   position: relative;
   z-index: 0;
   font-size: 14px
}

.ProductView .InfoBox .LastHourArea .Proggress {
   width: 100%;
   position: relative;
   background: #ddd9af;
   height: 10px;
   border-radius: 12px
}

.ProductView .InfoBox .LastHourArea .Proggress span {
   background: red;
   height: 10px;
   position: absolute;
   left: 0;
   top: 0;
   border-radius: 12px;
   width: initial
}

.ProductView .InfoBox .Design {
   width: 100%;
   margin: 12px 0;
   display: block
}

.ProductView .InfoBox .Design .InputItem {
   width: 100%;
   margin-bottom: 14px
}

.ProductView .InfoBox .Design .InputItem .Title {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center
}

.ProductView .InfoBox .Design .InputItem .Title i {
   width: 20px;
   font-size: 20px;
   margin-right: 5px;
   text-align: center
}

.ProductView .InfoBox .Design .InputItem .Title span {
   width: 100%;
   font-size: 16px
}

.ProductView .InfoBox .Design .InputItem .Info {
   width: 100%;
   padding: 0;
   border: 0;
   font-size: 13px;
   color: #5f6b70;
   margin-top: 4px;
   margin-bottom: 5px
}

.ProductView .InfoBox .Design .InputItem .Input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 4px;
   position: relative
}

.ProductView .InfoBox .Design .InputItem .Input input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 10px;
   outline: none
}

.ProductView .InfoBox .Design .InputItem .Input.Error input {
   border: 1px solid #ff11003d
}

.ProductView .InfoBox .Design .InputItem .Input .ErrorText {
   display: none;
   width: initial;
   color: red;
   font-size: 12px
}

.ProductView .InfoBox .Design .InputItem .Input.Error .ErrorText {
   display: flex;
   justify-content: flex-start
}

.ProductView .InfoBox .Design .InputItem .Input span {
   width: initial;
   font-size: 12px;
   text-align: right;
   color: #585858;
   padding: 2px 0 0;
   justify-content: flex-end
}

.ProductView .InfoBox .CaseList {
   width: 100%;
   margin: 12px 0;
   display: flex;
   flex-direction: column;
   position: relative;
   padding: 0 20px
}

.ProductView .InfoBox .CaseList .owl-nav {
   width: 100%;
   display: flex;
   position: absolute;
   justify-content: space-between;
   margin: 0 -20px;
   height: 100%;
   align-items: center;
   z-index: -1
}

.ProductView .InfoBox .CaseList .owl-nav .owl-prev {
   width: 20px;
   font-size: 28px;
   text-align: left
}

.ProductView .InfoBox .CaseList .owl-nav .owl-next {
   width: 20px;
   font-size: 28px;
   text-align: right
}

.ProductView .InfoBox .CaseList .owl-dots {
   width: 100%;
   display: flex;
   flex-direction: row;
   gap: 2px
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot {
   width: 100%;
   background: #ccc;
   height: 1px
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot span {
   width: 100%
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot.active {
   background: #000
}

.ProductView .InfoBox .CaseList .owl-dots .owl-dot.active span {
   width: 100%;
   margin: 12px 0;
   display: flex
}

.ProductView .InfoBox .CaseList .Item {
   width: 100%;
   display: flex;
   align-items: center;
   margin-bottom: 5px;
   background: #e8edef;
   border: 1px solid #e8edef;
   padding: 5px;
   border-radius: 2px;
   cursor: pointer;
   margin-right: 8px;
   position: relative;
   flex-direction: column
}

.ProductView .InfoBox .CaseList .Item:hover {
   border-color: #c7d4d9
}

.ProductView .InfoBox .CaseList .Item.Active {
   border-color: #d5e0e5;
   background: #d5e0e5
}

.ProductView .InfoBox .CaseList .Item.Active::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 26px;
   color: #41c346;
   position: absolute;
   right: 10px;
   top: 10px
}

.ProductView .InfoBox .CaseList .Item:last-child {
   margin-right: 0
}

.ProductView .InfoBox .CaseList .Item .Btn {
   width: 100%;
   background: #b7c9d1;
   text-align: center;
   font-size: 13px;
   padding: 4px 0;
   border-radius: 2px;
   margin-top: 5px;
   cursor: pointer
}

.ProductView .InfoBox .CaseList .Item.Active .Btn {
   background: #42c347;
   color: #fff
}

.ProductView .InfoBox .CaseList .Item .Product {
   display: flex;
   width: 100%;
   flex-direction: row;
   align-content: center;
   justify-content: center;
   align-items: flex-start
}

.ProductView .InfoBox .CaseList .Item .Product .Photo {
   width: 35px;
   float: left;
   margin-right: 10px;
   flex: none
}

.ProductView .InfoBox .CaseList .Item .Product .Photo img {
   height: 40px;
   border-radius: 2px;
   display: block
}

.ProductView .InfoBox .CaseList .Item .Product .Info {
   width: 100%;
   display: flex;
   line-height: 22px;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
   align-content: center;
   padding: 4px;
   margin: 0
}

.ProductView .InfoBox .CaseList .Item .Product .Info span:nth-child(1) {
   width: 100%;
   line-height: 16px;
   font-size: 12px;
   font-weight: 600
}

.ProductView .InfoBox .CaseList .Item .Product .Info span:nth-child(2) {
   font-weight: 600;
   color: #00bcd4;
   font-size: 11px;
   line-height: 13px
}

.ProductView .InfoBox .PayInformation {
   display: none;
}

.ProductView .InfoBox .PayInformation .IconList {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

.ProductView .InfoBox .PayInformation .IconList .Item {
   display: flex;
   width: 10%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   overflow: hidden;
   margin-right: 5px;
   padding: 1px
}

.ProductView .InfoBox .PayInformation .IconList .Item img {
   width: 100%
}

.ProductView .InfoBox .PayInformation .Info {
   display: flex;
   align-content: center;
   align-items: center;
   border: 0;
   padding: 0;
   margin-top: 10px
}

.ProductView .InfoBox .PayInformation .Info i {
   display: flex;
   font-size: 14px;
   margin-right: 5px
}

.ProductView .InfoBox .PayInformation .Info span {
   display: flex;
   font-size: 13px
}

.CommentArea {
   width: 100%;
   display: flex;
   border: 1px solid #bcbcbc38;
   border-left: 0;
   border-right: 0;
   z-index: 1;
   position: relative;
   padding: 20px 0px;
}
.ProductViewFeatures {
   width: 100%;
   display: flex;
   border: 1px solid #bcbcbc38;
   border-left: 0;
   border-right: 0;
   padding: 20px 0;
   z-index: 1;
   position: relative;
   background: #e6e6e659;
}
.ProductViewFeatures .Desc h2{
   font-size: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-family: sans-serif;
   margin-bottom: 20px;
}
.ProductViewFeatures .Desc h3{
   font-size: 14px;
   font-weight: 700;
   font-family: sans-serif;
   margin-bottom: 10px;
   letter-spacing: 0.6px;
}
.ProductViewFeatures .Desc p{
   font-size: 15px;
   font-family: sans-serif;
   margin-bottom: 20px;
   font-weight: 300;
}
.ProductViewFeatures .Desc ul{
   font-size: 15px;
   font-family: sans-serif;
   margin-bottom: 20px;
   padding-left: 35px;
}
.ProductViewFeatures .Desc li{
   font-size: 14px;
   font-family: sans-serif;
   margin-bottom: 8px;
   list-style: circle;
}
.ProductViewFeatures .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   margin-bottom: 20px
}

.ProductViewSuggets {
   width: 100%;
   display: flex;
   border: 1px solid #f2ecec;
   border-left: 0;
   border-right: 0;
   padding: 20px 0;
   margin-bottom: -1px;
   position: relative;
   z-index: 1
}

.ProductViewSuggets .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   margin-bottom: 20px;
   font-size: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-family: sans-serif;
   margin-bottom: 20px;
}

.ProductViewSuggets .View {
   width: 100%
}

.ProductViewSuggets .View .ProductItem {
   width: calc(20% - 0px);
}

.ProductViewSuggets .View .ProductItem.item_004:nth-child(+4n) {
   margin-right: 0;
}

.ProductViewSuggets .View .ProductItem.item_004:nth-child(+5n) {
   margin-right: 0
}

.ProductViewComment {
   width: 100%;
   display: flex;
   padding: 20px 0;
   margin-bottom: -1px;
   z-index: 1;
   position: relative
}

.ProductViewComment .Container {
   width: 890px!important;
   margin: 0 auto
}

.ProductViewComment .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   text-align: center
}

.ProductViewComment .Star {
   display: flex;
   justify-content: center;
   align-items: center;
   margin-bottom: 10px;
   flex-direction: column
}

.ProductViewComment .Star .Btn {
   background: #ff5722;
   color: #fff;
   padding: 6px 20px;
   border-radius: 4px
}

.ProductViewComment .Star .Point {
   display: flex
}

.ProductViewComment .Star .Point .Star {
   color: #ccc
}

.ProductViewComment .Star .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductViewComment .Star .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.ProductViewComment .Star .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1
}

.ProductViewComment .View {
   width: 100%;
   border: 1px solid #f2ecec;
   padding: 15px
}

.ProductViewComment .View .Blank {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   padding: 10px 0;
   cursor: pointer
}

.ProductViewComment .View .Blank span {
   width: 100%;
   text-align: center
}

.ProductViewComment .View .Blank .Btn {
   background: #ff5722;
   color: #fff;
   padding: 8px 30px;
   border-radius: 4px;
   margin-top: 7px
}

.ProductViewComment .View .Blank .Btn:hover {
   background: #ff7347
}

.ProductViewComment .View .Item {
   width: 100%;
   border-bottom: 1px solid #f2ecec;
   margin-bottom: 20px
}

.ProductViewComment .View .Item:last-child {
   border-bottom: 0;
   margin-bottom: 0
}

.ProductViewComment .View .Item .Info {
   width: 100%
}

.ProductViewComment .View .Item .Info .Name {
   width: 100%
}

.ProductViewComment .View .Item .Info .Date {
   width: 100%;
   font-size: 12px;
   margin-bottom: 4px
}

.ProductViewComment .View .Item .Info .Point {
   width: 100%;
   display: flex
}

.ProductViewComment .View .Item .Info .Point .Star {
   color: #919191
}

.ProductViewComment .View .Item .Info .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

.ProductViewComment .View .Item .Info .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #ffc107
}

.ProductViewComment .View .Item .Info .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ccc;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1
}

.ProductViewComment .View .Item .Comment {
   width: 100%;
   font-size: 14px
}

.ProductViewLast {
   width: 100%;
   display: flex;
   border: 1px solid #f2ecec;
   border-left: 0;
   border-right: 0;
   padding: 20px 0;
   margin-bottom: -1px;
   display: none;
   position: relative;
   z-index: 1
}

.ProductViewLast .Title {
   width: 100%;
   font-weight: 600;
   font-size: 20px;
   margin-bottom: 20px;
   text-transform: uppercase;
   font-size: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-family: sans-serif;
   margin-bottom: 20px;
}

.ProductViewLast .View {
   width: 100%
}

.ProductViewLast .View .ProductItem {
   width: calc(20% - 0px);
}
.ProductViewLast .View .ProductItem.item_004:nth-child(+4n){margin-right: 0;}
.ProductViewLast .View .ProductItem.item_004:nth-child(+5n){margin-right: 0px;}
.special-select {
   margin-top: 40px;
   padding: 0;
   width: 100%;
   display: flex;
   list-style: none;
   flex-direction: column;
}

.special-select li {
   width: 100%;
   border-bottom: 2px solid #e7e7e7;
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   align-items: center;
   padding: 16px 0;
}
.special-select li:last-child {
   border-bottom:0;
}

.special-select li:nth-child(+2n) {
}

.special-select>li:last-child {
   margin-right: 0
}

.special-select li .ico2 {
   width: 65px;
   flex: none;
   font-size: 26px;
   text-align: center
}
.special-select li>div {
   display: flex;
   flex-direction: column;
   gap: 5px;
}
.special-select li>div span:nth-child(1) {
   width: 100%;
   font-size: 14px;
   font-weight: 500;
}
.special-select li>div span:nth-child(2) {
   width: 100%;
   font-size: 12px;
   font-weight: 300;
}

.special-select li>.special-text {
   font-size: 14px;
   width: 100%
}

.BagView {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   padding: 15px 0
}

.BagView .nonBag {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   padding: 15px 0;
   margin: 40px 0;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.BagView .nonBag svg {
   height: 150px;
   fill: #4caf50;
   width: 100%
}

.BagView .nonBag span {
   width: 100%;
   padding: 15px 0;
   text-align: center;
   font-size: 22px
}

.BagView .nonBag .Btn {
   background: #4caf50;
   color: #fff;
   padding: 10px 20px;
   border-radius: 4px;
   margin-top: 40px;
   cursor: pointer
}

.BagView>.Title {
   width: 100%;
   margin-bottom: 20px
}

.BagView>.Title .Text {
   width: 100%;
   font-size: 18px;
   font-weight: 500
}

.BagView>.Title .SubText {
   width: 100%;
   font-size: 14px
}

.BagView>.Title .SubText span {
   width: 100%
}

.BagView .List {
   display: flex;
   flex-direction: column;
   width: 70%
}

.BagView .List .nonDelivered {
   display: flex;
   background: #ff98002e;
   color: #000;
   padding: 20px;
   flex-direction: column;
   margin-bottom: 15px
}

.BagView .List .nonDelivered .Text {
   display: flex;
   margin-bottom: 7px
}

.BagView .List .nonDelivered .Product {
   display: flex;
   flex-direction: column;
   margin-bottom: 10px
}

.BagView .List .nonDelivered .Product span {
   display: flex;
   font-weight: 600
}

.BagView .List .nonDelivered .Btn {
   display: flex;
   cursor: pointer;
   text-decoration: underline
}

.BagView .List .productItem.Extra {
   display: none
}

.BagView .List .productItem {
   width: 100%;
   background: #eaeeefcc;
   border: 1px solid #e7edef;
   padding: 16px;
   border-radius: 4px;
   margin-bottom: 15px;
   position: relative
}

.BagView .List .productItem.ExtraPro {
   z-index: 10
}

.BagView .List .productItem .Name {
   width: 100%;
   font-size: 16px;
   margin-bottom: 10px;
   cursor: pointer;
   color: #000;
   display: flex;
   font-weight: 700
}

.BagView .List .productItem .Btn.ProductDelete {
   position: absolute;
   right: 7px;
   top: 12px;
   font-size: 18px;
   cursor: pointer
}

.BagView .List .productItem .Btn.ProductDelete:hover {
   color: #ba1e7d
}

.BagView .List .productItem .Product {
   width: 100%;
   display: flex
}

.BagView .List .productItem .Product .ProductArea {
   width: 60%;
   display: flex;
   flex: none
}

.BagView .List .productItem .Product .Alert {
   width: 100%;
   border: 1px solid red;
   color: red;
   padding: 4px;
   margin: 5px;
   border-radius: 4px;
   font-size: 13px;
   text-align: center;
   display: none
}

.BagView .List .productItem .Product .Photo {
   width: 120px;
   margin-right: 15px
}

.BagView .List .productItem .Product .Photo img {
   width: 100%
}

.BagView .List .productItem .Product .Info {
   width: 90%;
   display: flex
}

.BagView .List .productItem .Product .Info .Item {
   width: 100%;
   font-size: 13px;
   display: flex;
   justify-content: flex-start;
   align-items: flex-start;
   flex-direction: column
}

.BagView .List .productItem .Product .Info .Item span:nth-child(1) {
   font-weight: 500;
   display: flex
}

.BagView .List .productItem .Product .Info .Item span:nth-child(2) {
   display: flex;
   font-size: 14px
}

.BagView .List .productItem .Product .Info .Item span .Delivery {
   background: #41c346;
   color: #fff;
   border-radius: 2px;
   padding: 2px 4px;
   font-size: 14px;
   display: none
}

.BagView .List .productItem .Product .Info .Item.Case {
   width: 100%
}

.BagView .List .productItem .Product .Info .Item.Case span {
   width: 100%;
   font-size: 12px;
   color: #ff5722
}

.BagView .List .productItem .Product .Info .Btn.Design {
   background: #b7cdd5;
   display: flex;
   color: #175f78;
   padding: 2px 4px;
   border-radius: 3px;
   align-items: center;
   justify-content: flex-start;
   cursor: pointer;
   margin-top: 8px;
   width: fit-content
}

.BagView .List .productItem .Product .Info .Btn.Design i {
   margin-right: 4px
}

.BagView .List .productItem .Product .Info .Btn.Design:hover {
   background: #1b6e8d;
   color: #fff
}

.BagView .List .productItem .Product .Info .Item.Price {
   width: 100%;
   margin-top: 5px;
   display: flex;
   flex-direction: column
}

.BagView .List .productItem .Product .Info .Item.Price .OldPrice {
   width: 100%;
   font-size: 16px;
   color: #707070;
   text-decoration: line-through
}

.BagView .List .productItem .Product .Info .Item.Price .OldPrice kr {
   width: 100%;
   font-size: 11px
}

.BagView .List .productItem .Product .Info .Item.Price .SalePrice {
   width: 100%;
   font-size: 18px;
   font-weight: 600;
   color: #34495e
}

.BagView .List .productItem .Product .Info .Item.Price .SalePrice kr {
   width: 100%;
   font-size: 12px
}

.BagView .List .productItem .Product .InfoArea {
   width: 100%
}

.BagView .List .productItem .Product .Other {
   width: 40%;
   flex: none;
   display: flex;
   gap: 15px
}

.BagView .List .productItem .Product .ExtraProduct {
   width: 100%;
   display: flex;
   margin: 0
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center;
   padding: 10px 5px
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct.Active {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct .Item {
   width: fit-content;
   margin: 2px;
   border-radius: 2px;
   border: 1px solid #eef1f2;
   padding: 2px
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct .Item img {
   height: 35px
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct:hover {
   box-shadow: 0 0 0 1px #0000007a
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct span {
   width: 100%;
   padding: 0 20px;
   font-size: 12px;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct span img {
   width: 14%
}

.BagView .List .productItem .Product .ExtraProduct .AddProduct.Active span {
   display: none
}

.BagView .List .productItem .Product .CardMessage {
   width: 50%;
   display: flex;
   margin: 0 10px
}

.BagView .List .productItem .Product .CardMessage .AddMessage {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center
}

.BagView .List .productItem .Product .CardMessage .AddMessage.nonMessage {
   display: flex
}

.BagView .List .productItem .Product .CardMessage .AddMessage.Message {
   display: none
}

.BagView .List .productItem .Product .CardMessage.Active .AddMessage.nonMessage {
   display: none
}

.BagView .List .productItem .Product .CardMessage.Active .AddMessage.Message {
   display: flex
}

.BagView .List .productItem .Product .CardMessage .AddMessage:hover {
   box-shadow: 0 0 0 1px #0000007a
}

.BagView .List .productItem .Product .CardMessage .AddMessage span {
   width: 100%;
   padding: 0 20px;
   font-size: 14px;
   display: flex;
   justify-content: center;
   align-items: center
}

.BagView .List .productItem .Product .CardMessage .AddMessage span img {
   width: 30%
}

.BagView .List .productItem .Product .CardMessage .AddMessage .Icon {
   font-size: 22px;
   color: #25a12a
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList {
   display: flex;
   align-items: center;
   justify-content: center;
   margin-top: 15px
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit {
   font-size: 14px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 4px 0 0 4px;
   padding: 5px 10px;
   width: 50%
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit:hover {
   background: #c1cfd3;
   color: #000
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete {
   font-size: 14px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 0 4px 4px 0;
   padding: 5px 10px;
   width: 50%;
   margin-left: 1px
}

.BagView .List .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete:hover {
   background: red;
   color: #fff
}

.BagView .List .productItem .CommentArea {
   width: 100%;
   display: flex;
   flex-direction: column;
   padding: 24px;
   background: #ffffffc2;
   border: 1px solid #d0dce0;
   margin: 10px 0;
   border-radius: 4px
}

.BagView .List .productItem .CommentArea .FormGroup {
   width: 100%;
   margin-bottom: 8px;
   position: relative
}

.BagView .List .productItem .CommentArea .FormGroup:last-child() {
   width: 100%;
   margin-bottom: 0;
   position: relative
}

.BagView .List .productItem .CommentArea .FormGroup svg {
   position: absolute;
   height: 20px;
   top: 12px;
   left: 10px;
   fill: #4caf50
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow {
   margin: 0;
   cursor: pointer;
   display: none
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage.Active .MessageArrow {
   display: block
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow.fa-chevron-left {
   position: absolute;
   left: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow.fa-chevron-right {
   position: absolute;
   right: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.BagView .List .productItem .CommentArea .FormGroup.CardMessage .MessageArrow.Disabled {
   color: #ababab
}

.BagView .List .productItem .CommentArea .FormGroup select {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   background: #fff;
   font-size: 16px
}

.BagView .List .productItem .CommentArea .FormGroup textarea {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   min-height: 120px;
   resize: none;
   background: #fff;
   font-size: 16px;
   font-family: inherit;
   line-height: 22px
}

.BagView .List .productItem .CommentArea .FormGroup input {
   width: 100%;
   border: 1px solid #ddd;
   padding: 12px 10px;
   border-radius: 4px;
   outline: none;
   font-size: 16px;
   background: #fff
}

.BagView .List .productItem .CommentArea .FormGroup .Btn {
   border: 0;
   background: #4caf50;
   color: #fff;
   padding: 10px 20px;
   border-radius: 4px;
   margin: 10px 0;
   cursor: pointer;
   font-size: 16px
}

.BagView .List .productItem .CommentArea .FormGroup .Btn:hover {
   background: #3c9f40
}

.BagView .List .productItem .ExtraProductList {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   height: 0;
   opacity: 0;
   overflow: hidden;
   transition: all .2s
}

.BagView .List .productItem .ExtraProductList .Title {
   display: none
}

.BagView .List .productItem .ExtraProductList .List {
   width: 100%;
   display: flex;
   flex-direction: row;
   padding-top: 60px;
   flex-wrap: wrap;
   align-content: flex-start
}

.BagView .List .productItem .ExtraProductList.Active {
   height: 100%;
   opacity: 1;
   overflow: visible;
   transition: all .2s;
   padding: 20px 0
}

.BagView .List .productItem .ExtraProductList .SubProduct {
   width: calc( 20% - 8px);
   display: flex;
   padding: 10px;
   background: #fff;
   border-radius: 4px;
   margin-right: 10px;
   margin-bottom: 10px;
   border: 1px solid #dee0e0;
   flex-direction: column;
   align-items: center;
   position: relative;
   justify-content: space-between
}

.BagView .List .productItem .ExtraProductList .SubProduct:nth-child(+5n) {
   margin-right: 0
}

.BagView .List .productItem .ExtraProductList .SubProduct img {
   width: 100%;
   display: flex;
   line-height: 200px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Name {
   width: 100%;
   display: inline-block;
   font-size: 14px;
   font-weight: 500;
   text-align: center;
   text-decoration: none;
   margin: 10px 0;
   height: 28px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Price {
   width: 100%;
   display: block;
   text-align: center;
   font-weight: 600;
   color: #34495e;
   margin-bottom: 10px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Btn.AddExtra {
   background: #34495e;
   color: #fff;
   padding: 4px 5px;
   border-radius: 2px;
   font-size: 16px;
   cursor: pointer
}

.BagView .List .productItem .ExtraProductList .SubProduct .Btn.AddExtra:hover {
   background: #26394c
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan {
   font-size: 12px;
   cursor: pointer;
   display: none
}

.BagView .List .productItem .ExtraProductList .SubProduct.Active .Quan {
   display: flex
}

.BagView .List .productItem .ExtraProductList .SubProduct.Active .Btn.AddExtra {
   display: none
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan .BtnMinus {
   line-height: 30px;
   width: 30px;
   text-align: center;
   cursor: pointer
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan .BtnValue {
   padding: 3px;
   border: 1px solid #ccc;
   width: 25px;
   text-align: center;
   border-radius: 3px;
   position: relative;
   font-size: 18px
}

.BagView .List .productItem .ExtraProductList .SubProduct .Quan .BtnPlus {
   line-height: 30px;
   width: 30px;
   text-align: center;
   cursor: pointer
}

.BagView .List .productItem .ExtraProductList .SubProduct.Loading {
   pointer-events: none
}

.BagView .List .productItem .ExtraProductList .SubProduct.Loading .Quan .BtnValue::before {
   content: "";
   background: #34495e url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 30px;
   border-radius: 4px;
   position: absolute;
   left: -1px;
   bottom: -1px;
   z-index: 11;
   background-position: 50%;
   background-size: cover
}

.BagView .List .AddressItem {
   width: 100%;
   background: #eaeeefcc;
   border: 1px solid #e7edef;
   padding: 16px;
   border-radius: 4px;
   margin-bottom: 15px
}

.BagView .List .AddressItem .OtherSelect {
   width: 100%;
   display: flex
}

.BagView .List .AddressItem .OtherSelect .Address {
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   background: #fff;
   padding: 3px 8px 3px 3px;
   font-size: 16px;
   cursor: pointer;
   display: flex;
   margin-right: 5px;
   align-items: center
}

.BagView .List .AddressItem .OtherSelect .Address::before {
   content: "";
   margin-right: 5px;
   width: 12px;
   height: 12px;
   border-radius: 100px;
   background: #d5d5d5;
   text-align: center;
   line-height: 17px
}

.BagView .List .AddressItem .OtherSelect .Address:hover {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .AddressItem .OtherSelect .Address.Active {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .AddressItem .OtherSelect .Address.Active::before {
   background: #4caf50
}

.BagView .List .AddressItem .Title {
   width: 100%;
   border-bottom: 1px solid #dfdfdf;
   padding-bottom: 10px;
   margin-bottom: 10px;
   display: flex;
   justify-content: space-between
}

.BagView .List .AddressItem .Title .Location {
   width: 100%;
   display: flex;
   flex-direction: column
}

.BagView .List .AddressItem .Title .Location span:nth-child(1) {
   width: 100%
}

.BagView .List .AddressItem .Title .Location span:nth-child(2) {
   width: 100%;
   font-size: 13px;
   color: #208b24
}

.BagView .List .AddressItem .Title .Productlist {
   width: max-content;
   display: flex;
   justify-content: flex-end
}

.BagView .List .AddressItem .Title .Productlist span {
   display: flex;
   background: #fff;
   padding: 2px;
   margin-left: 5px
}

.BagView .List .AddressItem .Title .Productlist span img {
   width: 30px;
   height: initial
}

.BagView .List .AddressItem .Form {
   width: 100%;
   display: flex;
   padding: 10px 0;
   justify-content: space-between
}

.BagView .List .AddressItem .Form .Left {
   width: 50%;
   padding-right: 10px
}

.BagView .List .AddressItem .Form .Right {
   width: 50%;
   padding-left: 10px
}

.BagView .List .AddressItem .Form .FormGroup {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.BagView .List .AddressItem .Form .FormGroup i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .AddressItem .Form .FormGroup span.Text {
   display: flex;
   position: absolute;
   left: 45px;
   top: 23px;
   z-index: 0;
   font-size: 16px;
   font-weight: 400;
   color: #727272
}

.BagView .List .AddressItem .Form .FormGroup .InputArea {
   background: #fff
}

.BagView .List .AddressItem .Form .FormGroup select {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 20px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .AddressItem .Form .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 20px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .AddressItem .Form .FormGroup textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 22px 14px 0 43px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 16px;
   font-weight: 400;
   font-family: inherit
}

.BagView .List .AddressItem .Form .FormGroup span.ErrorText {
   display: none
}

.BagView .List .AddressItem .Form .FormGroup.Ok i {
   color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Ok input {
   border-color: #4caf50 !important;!i;!;
}

.BagView .List .AddressItem .Form .FormGroup.Ok select {
   border-color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Ok textarea {
   border-color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px;
   color: #4caf50
}

.BagView .List .AddressItem .Form .FormGroup.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px
}

.BagView .List .AddressItem .Form .FormGroup.Error i {
   color: red
}
.BagView .List .AddressItem .Form .FormGroup.Info i {
   color: #FF9800;
}
.BagView .List .AddressItem .Form .FormGroup.Error input {
   border-color: red
}
.BagView .List .AddressItem .Form .FormGroup.Info input {
   border-color: #FF9800 !important;!i;!;
}

.BagView .List .AddressItem .Form .FormGroup.Error select {
   border-color: red
}
.BagView .List .AddressItem .Form .FormGroup.Info select {
   border-color: red
}
.BagView .List .AddressItem .Form .FormGroup.Error textarea {
   border-color: red
}
.BagView .List .AddressItem .Form .FormGroup.Info textarea {
   border-color: red
}
.BagView .List .AddressItem .Form .FormGroup.Error span.Text {
   color: red;
}
.BagView .List .AddressItem .Form .FormGroup.Info span.Text {
   color: #FF9800 !important;!i;!;
}
.BagView .List .AddressItem .Form .FormGroup.Error span.ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #eef1f2
}
.BagView .List .AddressItem .Form .FormGroup.Info span.ErrorText {
   color: #FF9800 !important;!i;!;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #eef1f2
}
.BagView .List .Invoice {
   width: 100%;
   background: #eaeeefcc;
   border: 1px solid #e7edef;
   padding: 16px;
   border-radius: 4px;
   margin-bottom: 15px
}

.BagView .List .Invoice .OtherSelect {
   width: 100%;
   display: flex
}

.BagView .List .Invoice .OtherSelect .Address {
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   background: #fff;
   padding: 3px 8px 3px 3px;
   font-size: 11px;
   cursor: pointer;
   display: flex;
   margin-right: 5px;
   align-items: center
}

.BagView .List .Invoice .OtherSelect .Address::before {
   content: "";
   margin-right: 5px;
   width: 12px;
   height: 12px;
   border-radius: 100px;
   background: #d5d5d5;
   text-align: center;
   line-height: 17px
}

.BagView .List .Invoice .OtherSelect .Address:hover {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .OtherSelect .Address.Active {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .OtherSelect .Address.Active::before {
   background: #4caf50
}

.BagView .List .Invoice .Btn.BtnLogin {
   color: #227625;
   font-weight: 500;
   position: relative;
   width: fit-content;
   border-radius: 30px;
   border: 1px solid #4bae4f;
   padding: 5px 10px;
   background: #fff;
   cursor: pointer
}

.BagView .List .Invoice .Btn.BtnLogin>i {
   margin-right: 6px;
   font-size: 16px
}

.BagView .List .Invoice .Btn.BtnLogin:hover {
   background: #4bae4f;
   color: #fff
}

.BagView .List .Invoice .Btn.BtnLogin:hover .Wind {
   display: block
}

.BagView .List .Invoice .Title {
   width: 100%;
   border-bottom: 1px solid #dfdfdf;
   padding-bottom: 10px;
   margin-bottom: 10px
}

.BagView .List .Invoice .Title .Location {
   width: 100%;
   display: flex;
   flex-direction: column
}

.BagView .List .Invoice .Title .Location span:nth-child(1) {
   width: 100%;
   font-weight: 500;
   color: #000
}

.BagView .List .Invoice .Title .Location span:nth-child(2) {
   width: 100%;
   font-size: 14px;
   color: #444
}

.BagView .List .Invoice .Title .Productlist {
   width: 100%
}

.BagView .List .Invoice .Form {
   width: 100%;
   display: flex;
   padding: 10px 0;
   justify-content: space-between;
   flex-direction: column
}

.BagView .List .Invoice .Form .Left {
   width: 50%;
   padding-right: 10px
}

.BagView .List .Invoice .Form .Right {
   width: 50%;
   padding-left: 10px
}

.BagView .List .Invoice .Form .BtnList {
   width: 100%
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice {
   background: 0 0;
   border: 0;
   margin: 0;
   padding: 0;
   text-decoration: underline;
   cursor: pointer;
   margin-top: 10px;
   margin-bottom: 10px;
   font-size: 14px
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice:hover {
   text-decoration: none
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice:after {
   content: "\f078";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #464646
}

.BagView .List .Invoice .Form .BtnList .Btn.Invoice.Active:after {
   content: "\f077";
   font-size: 11px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

.BagView .List .Invoice .Form .InvoiceInfo {
   width: 100%;
   display: none
}

.BagView .List .Invoice .Form .InvoiceInfo.Active {
   display: block
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected {
   width: 100%;
   display: flex;
   margin-bottom: 20px
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType {
   border: 1px solid #e2e7e9;
   border-radius: 2px;
   background: #fff;
   padding: 6px 7px;
   font-size: 14px;
   text-transform: uppercase;
   cursor: pointer;
   display: flex;
   margin-right: 8px;
   align-items: center;
   font-weight: 600;
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType::before {
   content: "";
   margin-right: 5px;
   width: 12px;
   height: 12px;
   border-radius: 100px;
   background: #d5d5d5;
   text-align: center;
   line-height: 17px
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType:hover {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType.Active {
   border-color: #4caf50;
   color: #4caf50
}

.BagView .List .Invoice .Form .InvoiceInfo .InvoiceSelected .InoviceType.Active::before {
   background: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice {
   width: 65%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.BagView .List .Invoice .Form .FormInvoice i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .Invoice .Form .FormInvoice span.Text {
   display: flex;
   position: absolute;
   left: 16px;
   top: 23px;
   z-index: 0;
   font-size: 16px;
   font-weight: 400;
   color: #727272
}

.BagView .List .Invoice .Form .FormInvoice .InputArea {
   background: #fff
}

.BagView .List .Invoice .Form .FormInvoice input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 0;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Invoice .Form .FormInvoice textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 22px 14px 0;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 16px;
   font-weight: 400;
   font-family: inherit
}

.BagView .List .Invoice .Form .FormInvoice span.ErrorText {
   display: none
}

.BagView .List .Invoice .Form .FormInvoice.Ok i {
   color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Ok input {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Ok textarea {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px;
   color: #4caf50
}

.BagView .List .Invoice .Form .FormInvoice.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px
}

.BagView .List .Invoice .Form .FormGroup.Error i {
   color: red
}
.BagView .List .Invoice .Form .FormGroup.Info i {
   color: #FFC107;
}
.BagView .List .Invoice .Form .FormGroup.Error input {
   border-color: red
}
.BagView .List .Invoice .Form .FormGroup.Info input {
   border-color: #FF9800 !important;!i;!;
}
.BagView .List .Invoice .Form .FormGroup.Error textarea {
   border-color: red
}
.BagView .List .Invoice .Form .FormGroup.Info textarea {
   border-color: red
}

.BagView .List .Invoice .Form .FormGroup.Error span.Text {
   color: red
}
.BagView .List .Invoice .Form .FormGroup.Info span.Text {
   color: #FF9800;
}
.BagView .List .Invoice .Form .FormGroup.Error span.ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #eef1f2
}
.BagView .List .Invoice .Form .FormGroup.Info span.ErrorText {
   color: #FF9800 !important;!i;!;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #eef1f2
}
.BagView .List .Invoice .Form .FormGroup {
   width: 65%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.BagView .List .Invoice .Form .FormGroup i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .Invoice .Form .FormGroup span.Text {
   display: flex;
   position: absolute;
   left: 45px;
   top: 23px;
   z-index: 0;
   font-size: 16px;
   font-weight: 400;
   color: #727272
}

.BagView .List .Invoice .Form .FormGroup .InputArea {
   background: #fff
}

.BagView .List .Invoice .Form .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 23px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 20px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Invoice .Form .FormGroup textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 22px 14px 0 43px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 16px;
   font-weight: 400;
   font-family: inherit
}

.BagView .List .Invoice .Form .FormGroup span.ErrorText {
   display: none
}

.BagView .List .Invoice .Form .FormGroup.Ok i {
   color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Ok input {
   border-color: #4caf50 !important;!i;!;
}

.BagView .List .Invoice .Form .FormGroup.Ok textarea {
   border-color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px;
   color: #4caf50
}

.BagView .List .Invoice .Form .FormGroup.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 14px
}

.BagView .List .Pay {
   width: 100%;
   border-radius: 4px;
   margin-bottom: 15px
}

.BagView .List .Pay .PayList {
   width: 100%;
   display: flex;
   align-content: flex-start
}

.BagView .List .Pay .PayList .PayItem {
   background: #ededed;
   padding: 10px;
   border: 2px solid #e1e1e1;
   border-radius: 4px 4px 0 0;
   margin-right: 2px;
   font-weight: 400;
   position: relative;
   z-index: 0;
   border-bottom: 0;
   cursor: pointer
}

.BagView .List .Pay .PayList .PayItem:hover {
   background: #ededed91
}

.BagView .List .Pay .PayList .PayItem.Active {
   background: #fff;
   color: #41c346;
   border-color: #41c346 !important;!i;!;
   border-bottom-color: #fff;
   box-shadow: 0 2px 0 0 #fff;
   z-index: 1
}

.BagView .List .Pay .Form {
   width: 100%;
   position: relative;
   z-index: 0;
   margin-top: -2px
}

.BagView .List .Pay .Form .PayView {
   display: none;
   width: 100%
}

.BagView .List .Pay .Form .PayView.Active {
   display: block;
   border-top: 2px solid #41c346;
   padding: 25px 0;
   display: flex
}

.BagView .List .Pay .Form .PayView .FormArea {
   width: 100%
}

.BagView .List .Pay .Form .PayView .FormGroup {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff;
   display: flex
}

.BagView .List .Pay .Form .PayView .FormGroup i {
   position: absolute;
   left: 13px;
   top: 13px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.BagView .List .Pay .Form .PayView .FormGroup span.Text {
   width: 40%;
   display: flex;
   font-weight: 500;
   color: #484848;
   flex: none;
   align-items: center
}

.BagView .List .Pay .Form .PayView .FormGroup .InputArea {
   background: #fff
}

.BagView .List .Pay .Form .PayView .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 10px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 1px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Pay .Form .PayView .FormGroup.Small input {
   width: 140px
}

.BagView .List .Pay .Form .PayView .FormGroup.Small select {
   width: 140px
}

.BagView .List .Pay .Form .PayView .FormGroup.Small select:nth-child(2) {
   margin-right: 10px
}

.BagView .List .Pay .Form .PayView .FormGroup select {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 10px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 1px;
   font-size: 16px;
   font-weight: 400
}

.BagView .List .Pay .Form .PayView .FormGroup span.ErrorText {
   display: none
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok i {
   color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok input {
   border-color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok textarea {
   border-color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Ok span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 11px;
   color: #4caf50
}

.BagView .List .Pay .Form .PayView .FormGroup.Focus span.Text {
   left: inherit;
   right: 8px;
   top: 4px;
   z-index: 0;
   font-size: 11px
}

.BagView .List .Pay .Form .PayView .FormGroup.Error i {
   color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error input {
   border-color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error select {
   border-color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error textarea {
   border-color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error span.Text {
   color: red
}

.BagView .List .Pay .Form .PayView .FormGroup.Error span.ErrorText {
   color: red;
   font-size: 12px;
   line-height: 30px;
   display: block;
   background: #f5f5f5
}

.BagView .List .Pay .Form .PayView .Account {
   width: 100%;
   padding: 15px;
   border: 1px solid #eaeeef;
   border-radius: 4px;
   display: none
}

.BagView .List .Pay .Form .PayView .Account.Active {
   display: block
}

.BagView .List .Pay .Form .PayView .Account .Item {
   width: 100%;
   display: flex;
   margin-bottom: 8px;
   align-items: center
}

.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(1) {
   width: 100px;
   flex: none;
   font-weight: 500;
   font-size: 11px
}

.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(2) {
   width: 5px;
   flex: none
}

.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(3) {
   width: 80%;
   font-size: 14px
}

.BagView .List .Pay .Form .PayView .PayInfo {
   width: 100%;
   display: flex;
   flex-direction: column
}

.BagView .List .Pay .Form .PayView .PayInfo .Text {
   width: 100%;
   margin-top: 20px
}

.BagView .List .Pay .Form .PayView .InstallmentArea {
   width: 40%;
   display: none
}

.BagView .List .Pay .Form .BtnList {
   width: 100%
}

.BagView .List .Pay .Form .BtnList .Contract {
   width: 100%;
   font-size: 14px
}

.BagView .List .Pay .Form .BtnList .Contract span {
   font-weight: 700
}

.BagView .List .Pay .Form .BtnList .Btn.PayBtn {
   font-weight: 500;
   background: #41c346;
   padding: 11px 26px;
   font-size: 16px;
   color: #fff;
   border-radius: 7px;
   margin: 10px 0;
   width: fit-content;
   cursor: pointer
}

.BagView .List .Pay .Form .BtnList .Btn.PayBtn:hover {
   background: #2c9b30
}

.BagView .Addition {
   width: 30%;
   padding-left: 30px;
   display: flex;
   align-items: center;
   flex-direction: column
}

.BagView .Addition .BagTotalMobile {
   display: none
}

.BagView .Addition .Title {
   width: 100%;
   background: #e2e7e9b5;
   border-radius: 4px;
   padding-bottom: 12px
}

.BagView .Addition .Title .Text {
   width: 100%;
   font-weight: 600;
   text-align: center;
   padding: 10px 0
}

.BagView .Addition .Title .Item {
   width: calc(100% - 20px);
   padding: 6px;
   background: #fff;
   margin: 3px 10px;
   border-radius: 3px;
   display: flex;
   justify-content: space-between
}

.BagView .Addition .Title a {
   width: calc(100% - 20px);
   padding: 6px;
   margin: 3px 10px;
   border-radius: 3px;
   display: flex;
   justify-content: space-between;
   color: #1065a9;
   text-decoration: underline
}

.BagView .Addition .Title .Item span:nth-child(1) {
   width: 100%;
   color: #5c5c5c
}

.BagView .Addition .Title .Item span:nth-child(2) {
   width: 100%;
   text-align: right;
   font-weight: 500;
   font-size: 16px
}

.BagView .Addition .Title .Item.Total {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   border-bottom: 2px solid #41c346
}

.BagView .Addition .Title .Item.Total span:nth-child(1) {
   width: 100%;
   text-align: center;
   font-size: 22px;
   font-weight: 700
}

.BagView .Addition .Title .Item.Total span:nth-child(1) kr {
   font-size: 14px;
   font-weight: 700
}

.BagView .Addition .Title .Item.Total span:nth-child(2) {
   width: 100%;
   text-align: center
}

.BagView .Addition .Btn.BagResume {
   font-weight: 500;
   background: #41c346;
   padding: 11px 26px;
   font-size: 16px;
   color: #fff;
   border-radius: 4px;
   margin: 10px 0;
   width: fit-content;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%
}

.BagView .Addition .Btn.BagResume:hover {
   background: #2c9b30
}

.BagView .Addition .Btn.BagResume.Disabled {
   background: #f2f2f2;
   color: #919191;
   pointer-event: none
}

.BagView .Navi {
   width: 620px;
   display: flex;
   flex-direction: column;
   padding: 70px 0
}

.BagView .Navi .Line {
   height: 3px;
   background: #e9eeef;
   width: calc(100% - 105px);
   left: 35px;
   position: absolute;
   top: 10px;
   border-radius: 4px;
   margin-left: 20px;
   margin-right: 0
}

.BagView .Navi .Point {
   width: 100%;
   text-align: center
}

.BagView .Navi .Point:before {
   content: "";
   height: 22px;
   width: 22px;
   background: #e9eeef;
   border-radius: 100px;
   position: absolute;
   margin-left: -11px
}

.BagView .Navi .Point.Active:before {
   content: "\f192";
   background: #fff;
   color: #42c346;
   font-family: "font awesome 5 free";
   font-weight: 900;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1;
   font-size: 23px
}

.BagView .Navi .Point span {
   display: flex;
   font-size: 13px;
   width: 100%;
   align-items: center;
   justify-content: center;
   align-content: center;
   margin-top: 22px
}

.BagView .Area {
   padding: 0 28px;
   width: calc( 100% - 320px);
   margin: 70px 0
}

.BagView .Area .Title {
   width: 100%;
   display: flex;
   margin-bottom: 20px;
   font-size: 22px;
   font-weight: 500
}

.BagView .Area .FaqSearch {
   width: 100%;
   display: flex;
   align-items: center;
   align-content: center;
   justify-content: center;
   margin-bottom: 60px
}

.BagView .Area .FaqSearch input {
   min-width: 420px;
   background: #fff;
   padding: 10px;
   border: 2px solid #f8f8f8;
   box-shadow: 0 0 0 4px #ededed;
   border-radius: 2px
}

.BagView .Area .FaqTabList {
   width: 100%;
   display: flex;
   margin-bottom: 40px;
   justify-content: center
}

.BagView .Area .FaqTabList .FaqTabItem {
   padding: 10px;
   border-radius: 2px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 2px;
   background: #ff9859;
   color: #fff;
   cursor: pointer
}

.BagView .Area .FaqTabList .FaqTabItem:hover {
   background: #cf743c;
   color: #fff
}

.BagView .Area .FaqTabList .FaqTabItem.Active {
   background: #cf743c;
   color: #fff
}

.BagView .Area .FaqQuestion {
   width: 100%;
   display: none;
   flex-direction: column;
   border-bottom: 1px solid #e9e9e9;
   color: #000
}

.BagView .Area .FaqQuestion.Show {
   display: flex
}

.BagView .Area .FaqQuestion:hover {
   width: 100%;
   color: #2a812d
}

.BagView .Area .FaqQuestion.Active {
   width: 100%;
   color: #2a812d
}

.BagView .Area .FaqQuestion .Title {
   width: 100%;
   padding: 10px;
   font-size: 16px;
   cursor: pointer;
   display: flex;
   margin-bottom: 0
}

.BagView .Area .FaqQuestion .Title::before {
   content: "\f067";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #000;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

.BagView .Area .FaqQuestion.Active .Title::before {
   content: "\f068";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #4caf50;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

.BagView .Area .FaqQuestion .Answer {
   width: 100%;
   font-size: 14px;
   padding-left: 40px;
   display: none;
   transition: all .2s ease-in-out;
   overflow: auto;
   color: #000
}

.BagView .Area .FaqQuestion.Active .Answer {
   display: block;
   height: auto;
   padding: 10px 0 10px 40px;
   transition: all .6s ease-in-out
}

.MemberView {
   width: 100%;
   display: flex;
   flex-wrap: wrap
}

.MemberView .Navi .Profil {
   width: 100%;
   display: flex;
   flex-direction: row;
   gap: 10px;
   margin-bottom: 40px
}

.MemberView .Navi .Profil>.Photo {
   background-color: #eee;
   min-width: 56px;
   height: 56px;
   border-radius: 56px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   font-size: 16px;
   font-weight: 600
}

.MemberView .Navi .Profil>.Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center
}

.MemberView .Navi .Profil>.Info>span:nth-child(1) {
   font-weight: 600;
   font-size: 16px;
   line-height: 1.13;
   letter-spacing: -.32px;
   color: #484848;
   text-transform: lowercase
}

.MemberView .Navi .Profil>.Info>span:nth-child(2) {
   width: 100%;
   color: #2196f3;
   font-size: 12px;
   line-height: 11px
}

.MemberView .Navi {
   width: 240px;
   display: flex;
   flex-direction: column;
   padding: 70px 0
}

.MemberView .Navi .Item {
   width: 100%;
   line-height: 10px;
   padding: 10px 0;
   border-radius: 8px;
   margin-bottom: 5px;
   cursor: pointer;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   font-size: 14px;
   font-weight: 400;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important
}

.MemberView .Navi .Item.Sub {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center
}

.MemberView .Navi .Item.Sub>div {
   display: flex;
   flex-direction: row;
   align-items: center
}

.MemberView .Navi .Item.Sub .Wind {
   width: 100%;
   display: flex;
   flex-direction: column;
   border-left: 4px solid #c6c6c6;
   margin-left: 18px;
   margin-top: 10px;
   padding-left: 25px;
   align-items: flex-start
}

.MemberView .Navi .Item.Sub .Wind>a {
   line-height: 24px;
   margin-bottom: 5px;
   cursor: pointer;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   color: #000;
   font-size: 13px;
   border-radius: 4px;
   padding: 0 12px
}

.MemberView .Navi .Item.Sub .Wind>a.Active {
   background: #fff1e6;
   color: #ab4b2d
}

.MemberView .Navi .Item svg {
   height: 22px;
   width: 40px;
   flex: none;
   text-align: center
}

.MemberView .Navi .Item:hover {
   fill: #ff5722;
   color: #ff5722
}

.MemberView .Navi .Item.Active {
   fill: #ff5722;
   color: #ff5722
}

.MemberView .Navi .Item.Active svg {
   fill: #ff5722
}

.MemberView .Area {
   padding: 0 28px;
   width: calc( 100% - 240px);
   margin: 0px 0 70px 0;
}

.MemberView .Area .FormGroup {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.MemberView .Area .FormGroup i {
   position: absolute;
   left: 13px;
   top: 13px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.MemberView .Area .FormGroup span.Text {
   display: flex;
   z-index: 0;
   font-size: 14px;
   font-weight: 400;
   margin-bottom: 5px
}

.MemberView .Area .FormGroup .InputArea {
   background: #fff
}

.MemberView .Area .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 14px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 14px;
   font-weight: 400
}

.MemberView .Area .FormGroup textarea {
   width: 100%;
   outline: none;
   min-height: 90px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 14px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 26px;
   font-size: 14px;
   font-weight: 400;
   font-family: inherit
}

.MemberView .Area .FormGroup span.ErrorText {
   display: none
}

.MemberView .Blank {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   margin-top: 140px
}

.MemberView .Blank span:nth-child(1) {
   width: 100%;
   margin-bottom: 10px;
   text-align: center;
   font-weight: 600
}

.MemberView .Blank span:nth-child(2) {
   width: 100%;
   text-align: center;
   font-size: 13px
}

.StatusBar {
   display: flex;
   width: 100%;
   overflow: hidden;
   border-radius: 60px;
   padding: 1px
}

.StatusBar .Item {
   display: flex;
   flex-direction: column;
   position: relative;
   padding: 2px;
   -webkit-transform: skewX(-40deg);
   transform: skewX(-40deg);
   background: #cccfd7;
   border-radius: 3px;
   margin-right: 10px;
   width: 100%;
   text-align: center;
   overflow: hidden;
   cursor: pointer
}

.StatusBar .Item:hover {
   background: #b1b5c5
}

.StatusBar .Item:first-child {
   margin-left: -10px
}

.StatusBar .Item:last-child {
   margin-right: -9px
}

.StatusBar .Item span {
   padding: 5px;
   font-size: 13px;
   -webkit-transform: skewX(40deg);
   transform: skewX(40deg)
}

.Box {
   float: left;
   width: 100%;
   padding: 16px;
   border: 1px solid #e8e9e9;
   margin-bottom: 16px;
   border-radius: 6px;
   box-shadow: 1px 4px 45px -24px #00000059;
   position: relative;
   z-index: 1;
   background: #fff
}

.Box .BoxTitle {
   float: left;
   width: 100%;
   font-size: 19px;
   margin-bottom: 8px;
   font-weight: 400;
   color: #000
}

.StatisView {
   width: 100%;
   display: flex;
   flex-wrap: wrap
}

.StatisView .Navi .Profil {
   width: 100%;
   display: flex;
   flex-direction: row;
   gap: 10px;
   margin-bottom: 40px
}

.StatisView .Navi .Profil>.Photo {
   background-color: #eee;
   min-width: 56px;
   height: 56px;
   border-radius: 56px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   font-size: 16px;
   font-weight: 600
}

.StatisView .Navi .Profil>.Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center
}

.StatisView .Navi .Profil>.Info>span:nth-child(1) {
   font-weight: 600;
   font-size: 16px;
   line-height: 1.13;
   letter-spacing: -.32px;
   color: #484848;
   text-transform: lowercase
}

.StatisView .Navi .Profil>.Info>span:nth-child(2) {
   width: 100%;
   color: #2196f3;
   font-size: 12px;
   line-height: 11px
}

.StatisView .Navi {
   width: 240px;
   display: flex;
   flex-direction: column;
   padding: 70px 0
}

.StatisView .Navi .Item {
   width: 100%;
   line-height: 10px;
   padding: 10px 0;
   border-radius: 8px;
   cursor: pointer;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   font-size: 14px;
   font-weight: 400;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important;
   border-radius: 4px;
   height: 36px;
   line-height: 36px;
   padding: 0 12px;
   cursor: pointer
}

.StatisView .Navi .Item.Sub {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
   height: inherit
}

.StatisView .Navi .Item.Sub:hover {
   background: 0 0
}

.StatisView .Navi .Item.Sub>div {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-weight: 600;
   color: #000;
   font-size: 13px
}

.StatisView .Navi .Item.Sub .Wind {
   width: 100%;
   display: flex;
   flex-direction: column;
   border-left: 2px solid #c6c6c6;
   margin-left: 0;
   margin-top: 10px;
   padding-left: 8px;
   align-items: flex-start;
   position: relative
}

.StatisView .Navi .Item.Sub .Wind>a {
   line-height: 24px;
   margin-bottom: 5px;
   cursor: pointer;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   color: #000;
   font-size: 14px;
   border-radius: 4px;
   padding: 0 12px
}

.StatisView .Navi .Item.Sub .Wind>a::before {
   content: "";
   height: 1px;
   background: #dcdcdc;
   position: absolute;
   left: 0;
   width: 10px;
   color: #000
}

.StatisView .Navi .Item.Sub .Wind>a.Active {
   background: #ff57222e;
   color: #ff5722
}

.StatisView .Navi .Item svg {
   height: 22px;
   width: 40px;
   flex: none;
   text-align: center
}

.StatisView .Navi .Item:hover {
   background: #f3f3f3
}

.StatisView .Navi .Item.Active {
   background-color: #fff1e6;
   color: #ff5722
}

.StatisView .Navi .Item.Active svg {
   fill: #ff5722
}

.StatisView .Area {
   padding: 0 28px;
   width: calc( 100% - 240px);
   margin: 70px 0
}

.StatisView .Area .Title {
   border: 1px solid #e6e6e6;
   border-radius: 8px;
   font-weight: 600;
   font-size: 18px;
   color: #333;
   padding: 20px;
   margin-bottom: 20px;
   position: relative;
   z-index: 3;
   background: #fff
}

.StatisView .Area .Title>.StaticNav {
   position: absolute;
   right: 12px;
   top: 10px;
   width: 38px;
   height: 38px;
   background: #efefef;
   border: 1px solid #ccc;
   border-radius: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: none
}

.StatisView .Area .Title>.StaticNav>img {
   margin: 0;
   display: block;
   height: 23px
}

.StatisView .Area .Content {
   max-width: 100%;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   padding: 20px;
   background: #fff;
   border: 1px solid #e6e6e6;
   border-radius: 8px
}

[Page=Errors] {
   background: #fbf3f2
}

[Page=Errors] .Container {
   display: flex;
   height: 100%;
   align-content: center;
   align-items: center
}

[Page=Errors] .Container .LeftArea {
   width: 100%;
   height: 620px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start
}

[Page=Errors] .Container .LeftArea .Title {
   width: 100%;
   font-size: 26px;
   font-weight: 700;
   color: red
}

[Page=Errors] .Container .LeftArea .Text {
   width: 80%;
   font-size: 14px;
   color: #444;
   margin-bottom: 30px
}

[Page=Errors] .Container .LeftArea .Navigator {
   width: 60%;
   display: flex;
   justify-content: space-between
}

[Page=Errors] .Container .LeftArea .Navigator .Step {
   width: 100%;
   height: 12px;
   background: #eddad7;
   position: relative
}

[Page=Errors] .Container .LeftArea .Navigator .Step .Point {
   width: 26px;
   height: 26px;
   border-radius: 100px;
   background: #e9ceca;
   margin-top: -8px;
   margin-left: -6px;
   display: flex
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Left .Point {
   left: 0
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Center .Point {
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Right {
   display: flex;
   width: 0;
   flex-direction: column
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Right .Point {
   flex: none
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Right .Name {
}

[Page=Errors] .Container .LeftArea .Navigator .Step .Name {
   width: 220px;
   font-size: 14px;
   font-weight: 600;
   padding-top: 8px;
   margin-left: -5px;
   flex: none;
   text-align: left
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Active {
   background: #4caf50
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Active .Point {
   background: #37913b
}

[Page=Errors] .Container .LeftArea .Navigator .Step.NextStep .Point {
   background: #ed3923
}

[Page=Errors] .Container .LeftArea .Navigator .Step .Point::before {
   content: "\f0d1";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #c99f98;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Errors] .Container .LeftArea .Navigator .Step.Active .Point::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Errors] .Container .LeftArea .Navigator .Step.NextStep .Point::before {
   content: "\f00d";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Errors] .Container .LeftArea .BtnList {
   width: 100%;
   margin-top: 70px;
   display: flex;
   justify-content: flex-start
}

[Page=Errors] .Container .LeftArea .BtnList .Btn {
   background: #ccc;
   padding: 8px 12px;
   border-radius: 3px;
   font-size: 16px;
   text-align: center;
   margin-right: 20px;
   cursor: pointer
}

[Page=Errors] .Container .LeftArea .BtnList .Btn.Resume {
   background: #4caf50;
   color: #fff
}

[Page=Errors] .Container .LeftArea .BtnList .Btn.Order {
   background: 0 0;
   color: #f10;
   border: 1px solid #f10
}

[Page=Errors] .Container .LeftArea .Payment {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   margin-top: 30px
}

[Page=Errors] .Container .LeftArea .Payment .Btn.Payment {
   background: red;
   color: #fff;
   padding: 2px 13px;
   border-radius: 3px;
   font-size: 13px;
   text-align: center;
   cursor: pointer;
   margin: 0;
   width: initial
}

[Page=Errors] .Container .LeftArea .Account {
   display: flex;
   justify-content: flex-start;
   margin-top: 5px;
   flex-direction: column;
   border: 1px solid #d3f1d6;
   border-radius: 4px;
   background: #e1f5e3;
   padding: 10px
}

[Page=Errors] .Container .LeftArea .Account .Item {
   width: 100%;
   display: flex;
   align-items: center
}

[Page=Errors] .Container .LeftArea .Account .Item span:nth-child(1) {
   width: 100px;
   flex: none;
   font-weight: 700;
   font-size: 11px;
   color: #37913b
}

[Page=Errors] .Container .LeftArea .Account .Item span:nth-child(2) {
   width: 5px;
   flex: none
}

[Page=Errors] .Container .LeftArea .Account .Item span:nth-child(3) {
   width: 80%;
   font-size: 13px
}

[Page=Errors] .Container .RightArea {
   width: 60%;
   display: flex;
   flex-direction: column;
   overflow: auto;
   padding: 20px 0;
   padding-right: 10px
}

[Page=Success] {
}

[Page=Success] .Container {
   display: flex;
   height: 100%;
   align-content: center;
   align-items: center
}

[Page=Success] .Container .LeftArea {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
   padding: 60px 0 120px
}

[Page=Success] .Container .LeftArea .Title {
   width: 100%;
   font-size: 26px;
   font-weight: 700;
   text-align: center;
   margin-bottom: 22px
}

[Page=Success] .Container .LeftArea .Text {
   width: 100%;
   color: #444;
   margin-bottom: 30px;
   text-align: center
}

[Page=Success] .Container .LeftArea .Navigator {
   width: 60%;
   display: flex;
   justify-content: space-between;
   margin: 0 auto
}

[Page=Success] .Container .LeftArea .Navigator .Step {
   width: 100%;
   height: 12px;
   background: #b7dfb8;
   position: relative
}

[Page=Success] .Container .LeftArea .Navigator .Step .Point {
   width: 26px;
   height: 26px;
   border-radius: 100px;
   background: #b7dfb8;
   margin-top: -8px;
   margin-left: -6px;
   display: flex
}

[Page=Success] .Container .LeftArea .Navigator .Step.Left .Point {
   left: 0
}

[Page=Success] .Container .LeftArea .Navigator .Step.Center .Point {
}

[Page=Success] .Container .LeftArea .Navigator .Step.Right {
   display: flex;
   width: 0;
   flex-direction: column
}

[Page=Success] .Container .LeftArea .Navigator .Step.Right .Point {
   flex: none
}

[Page=Success] .Container .LeftArea .Navigator .Step.Right .Name {
}

[Page=Success] .Container .LeftArea .Navigator .Step .Name {
   width: 220px;
   font-size: 14px;
   font-weight: 600;
   padding-top: 8px;
   margin-left: -102px;
   flex: none;
   text-align: center
}

[Page=Success] .Container .LeftArea .Navigator .Step.Active {
   background: #4caf50
}

[Page=Success] .Container .LeftArea .Navigator .Step.Active .Point {
   background: #37913b
}

[Page=Success] .Container .LeftArea .Navigator .Step.NextStep .Point {
   background: #37913b
}

[Page=Success] .Container .LeftArea .Navigator .Step .Point::before {
   content: "\f0d1";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 15px;
   color: #878787;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Success] .Container .LeftArea .Navigator .Step.Active .Point::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Success] .Container .LeftArea .Navigator .Step.NextStep .Point::before {
   content: "\f00c";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 26px;
   height: 26px
}

[Page=Success] .Container .LeftArea .BtnList {
   width: 100%;
   margin-top: 70px;
   display: flex;
   justify-content: center;
   align-items: center
}

[Page=Success] .Container .LeftArea .BtnList .Btn {
   background: #ccc;
   padding: 8px 12px;
   border-radius: 3px;
   font-size: 16px;
   text-align: center;
   margin-right: 20px;
   cursor: pointer;
   width: 35%
}

[Page=Success] .Container .LeftArea .BtnList .Btn.Resume {
   background: #4caf50;
   color: #fff
}

[Page=Success] .Container .LeftArea .BtnList .Btn.Order {
   background: 0 0;
   color: #4caf50;
   border: 1px solid #4caf50
}

[Page=Success] .Container .LeftArea .Payment {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   margin-top: 30px
}

[Page=Success] .Container .LeftArea .Payment .Btn.Payment {
   background: red;
   color: #fff;
   padding: 2px 13px;
   border-radius: 3px;
   text-align: center;
   cursor: pointer;
   margin: 0;
   width: initial
}

[Page=Success] .Container .LeftArea .Account {
   display: flex;
   justify-content: flex-start;
   margin-top: 5px;
   flex-direction: column;
   border: 1px solid #d3f1d6;
   border-radius: 4px;
   background: #e1f5e3;
   padding: 10px
}

[Page=Success] .Container .LeftArea .Account .Item {
   width: 100%;
   display: flex;
   align-items: center;
   padding: 5px 0
}

[Page=Success] .Container .LeftArea .Account .Item span:nth-child(1) {
   width: 100px;
   flex: none;
   font-weight: 400;
   color: #37913b
}

[Page=Success] .Container .LeftArea .Account .Item span:nth-child(2) {
   width: 5px;
   flex: none
}

[Page=Success] .Container .LeftArea .Account .Item span:nth-child(3) {
   width: 80%
}

[Page=Success] .Container .RightArea {
   width: 100%;
   display: flex;
   flex-direction: column;
   padding: 20px 0;
   padding-right: 0;
   margin-top: 60px
}

[Page=Success] .Container .RightArea::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

[Page=Success] .Container .RightArea::-webkit-scrollbar-thumb {
   background-color: rgb(183 223 184)
}

[Page=Success] .Container .RightArea::-webkit-scrollbar-track {
   background: rgb(183 223 184/35%)
}

[Page=Success] .Container .RightArea .productItem {
   width: 100%;
   background: #a2cea333;
   border: 1px solid #f2fff2;
   padding: 8px;
   border-radius: 10px;
   margin: 8px 0;
   position: relative
}

[Page=Success] .Container .RightArea .productItem .Name {
   width: 100%;
   font-size: 16px;
   margin-bottom: 6px;
   text-decoration: none;
   cursor: pointer;
   color: #4caf50;
   font-weight: 600;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Btn.ProductDelete {
   position: absolute;
   right: 7px;
   top: 12px;
   font-size: 18px;
   cursor: pointer;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Btn.ProductDelete:hover {
   color: #ba1e7d
}

[Page=Success] .Container .RightArea .productItem .Product {
   width: 100%;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .ProductArea {
   width: 100%;
   display: flex;
   flex: none
}

[Page=Success] .Container .RightArea .productItem .Product .Photo {
   width: 50px;
   margin-right: 8px;
   flex: none
}

[Page=Success] .Container .RightArea .productItem .Product .Photo img {
   width: 100%;
   border-radius: 8px
}

[Page=Success] .Container .RightArea .productItem .Product .Info {
   width: 100%;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item {
   width: 100%;
   font-size: 16px;
   display: flex;
   justify-content: flex-start;
   align-items: flex-start;
   flex-direction: column
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item span:nth-child(1) {
   font-weight: 500;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item span:nth-child(2) {
   display: flex;
   font-size: 12px
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item span .Delivery {
   margin-left: 10px;
   background: #41c346;
   color: #082e0a;
   border-radius: 2px;
   padding: 1px 10px;
   font-size: 11px;
   display: block
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Case {
   width: 100%
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Case span {
   width: 100%;
   font-size: 12px;
   color: #ff5722
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Btn.Design {
   background: #b7cdd5;
   display: flex;
   color: #175f78;
   padding: 2px 4px;
   border-radius: 3px;
   align-items: center;
   justify-content: flex-start;
   cursor: pointer;
   margin-top: 8px;
   width: fit-content;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Btn.Design i {
   margin-right: 4px
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Btn.Design:hover {
   background: #1b6e8d;
   color: #fff
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price {
   width: 100%;
   margin-top: 0;
   display: flex;
   flex-direction: row;
   justify-content: flex-start
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .OldPrice {
   font-size: 18px;
   color: #c0cbc1;
   text-decoration: line-through;
   margin-right: 10px;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .OldPrice kr {
   width: 100%;
   font-size: 11px
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .SalePrice {
   font-size: 18px;
   font-weight: 600;
   color: #000
}

[Page=Success] .Container .RightArea .productItem .Product .Info .Item.Price .SalePrice kr {
   width: 100%;
   font-size: 12px
}

[Page=Success] .Container .RightArea .productItem .Product .InfoArea {
   width: 100%
}

[Page=Success] .Container .RightArea .productItem .Product .Other {
   width: 40%;
   flex: none;
   display: flex;
   margin: 0 -5px;
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct {
   width: 50%;
   display: flex;
   margin: 0 10px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center;
   padding: 10px 5px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct.Active {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct .Item {
   width: fit-content;
   margin: 2px;
   border-radius: 2px;
   border: 1px solid #eef1f2;
   padding: 2px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct .Item img {
   height: 35px
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct:hover {
   box-shadow: 0 0 0 1px #0000007a
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct span {
   width: 100%;
   padding: 0 20px;
   font-size: 12px;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct span img {
   width: 32%
}

[Page=Success] .Container .RightArea .productItem .Product .ExtraProduct .AddProduct.Active span {
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage {
   width: 50%;
   display: flex;
   margin: 0 10px
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: flex;
   box-shadow: 0 0 0 1px #cccccc7a;
   border-radius: 4px;
   background: #fff;
   flex-direction: column;
   text-align: center;
   align-content: center
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage.nonMessage {
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage.Message {
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage.Active .AddMessage.nonMessage {
   display: none
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage.Active .AddMessage.Message {
   display: flex
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage:hover {
   box-shadow: 0 0 0 1px #0000007a
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage span {
   width: 100%;
   padding: 0 20px;
   font-size: 12px;
   display: flex;
   justify-content: center;
   align-items: center
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage span img {
   width: 30%
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .Icon {
   font-size: 22px;
   color: #25a12a
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList {
   display: flex;
   align-items: center;
   justify-content: center;
   margin-top: 15px
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit {
   font-size: 11px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 4px 0 0 4px;
   padding: 5px 10px;
   width: 50%
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageEdit:hover {
   background: #c1cfd3;
   color: #000
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete {
   font-size: 11px;
   background: #d6dddf;
   color: #4c4c4c;
   border-radius: 0 4px 4px 0;
   padding: 5px 10px;
   width: 50%;
   margin-left: 1px
}

[Page=Success] .Container .RightArea .productItem .Product .CardMessage .AddMessage .BtnList .Btn.MessageDelete:hover {
   background: red;
   color: #fff
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   height: 0;
   opacity: 0;
   overflow: hidden;
   transition: all .2s
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .Title {
   display: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .List {
   width: 100%;
   display: flex;
   flex-direction: row;
   padding-top: 60px;
   flex-wrap: wrap;
   align-content: flex-start
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList.Active {
   height: 100%;
   opacity: 1;
   overflow: visible;
   transition: all .2s;
   padding: 20px 0
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct {
   width: calc( 20% - 8px);
   display: flex;
   padding: 10px;
   background: #fff;
   border-radius: 4px;
   margin-right: 10px;
   margin-bottom: 10px;
   border: 1px solid #dee0e0;
   flex-direction: column;
   align-items: center;
   position: relative
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct:nth-child(+5n) {
   margin-right: 0
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct img {
   width: 100%;
   display: flex
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Name {
   width: 100%;
   display: inline-block;
   font-size: 12px;
   font-weight: 500;
   text-align: center;
   text-decoration: none;
   margin: 10px 0;
   height: 28px
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Price {
   width: 100%;
   display: block;
   text-align: center;
   font-weight: 600;
   color: #34495e;
   margin-bottom: 10px
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Btn.AddExtra {
   background: #34495e;
   color: #fff;
   padding: 4px 5px;
   border-radius: 2px;
   font-size: 12px;
   cursor: pointer
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Btn.AddExtra:hover {
   background: #26394c
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan {
   font-size: 12px;
   cursor: pointer;
   display: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Active .Quan {
   display: flex
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Active .Btn.AddExtra {
   display: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan .BtnMinus {
   line-height: 23px;
   width: 25px;
   text-align: center;
   cursor: pointer
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan .BtnValue {
   padding: 3px;
   border: 1px solid #ccc;
   width: 25px;
   text-align: center;
   border-radius: 3px;
   position: relative
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct .Quan .BtnPlus {
   line-height: 23px;
   width: 25px;
   text-align: center;
   cursor: pointer
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Loading {
   pointer-events: none
}

[Page=Success] .Container .RightArea .productItem .ExtraProductList .SubProduct.Loading .Quan .BtnValue::before {
   content: "";
   background: #34495e url(/Library/Img/Loading.svg?);
   width: 30px;
   height: 30px;
   border-radius: 4px;
   position: absolute;
   left: -1px;
   bottom: -1px;
   z-index: 11;
   background-position: 50%;
   background-size: cover
}

[Page=Profil] .Btn {
   padding: 10px 20px;
   background: #efefef;
   color: #000;
   width: fit-content;
   border-radius: 4px;
   cursor: pointer
}

[Page=Profil] .Btn.BtnRed {
   background: #f10;
   color: #fff
}

[Page=Profil] .Btn.BtnGreen {
   background: #4caf50;
   color: #fff
}

[Page=Profil] .Btn:hover {
   opacity: .7
}

.MobilNavArea .Info {
   display: flex;
   gap: 10px;
   flex-direction: column;
   margin-bottom: 20px;
   border-top: 1px solid #ccc;
   padding-top: 10px
}

.MobilNavArea .Info a {
   display: flex;
   gap: 10px;
   border: 1px solid #000;
   border-radius: 4px;
   padding: 6px;
   background: #f8f8f869
}

.MobilNavArea .Help {
   display: flex;
   gap: 10px;
   margin-bottom: 30px
}

.MobilNavArea .Help .Btn-Whatsap {
   float: left;
   border-radius: 4px;
   border: 1px solid #4caf50;
   cursor: pointer;
   text-align: center;
   color: #368c39;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.MobilNavArea .Help .Btn-Phone {
   float: left;
   border-radius: 4px;
   border: 1px solid #ff5722;
   cursor: pointer;
   text-align: center;
   color: #ff5722;
   font-size: 14px;
   text-indent: 0;
   padding: 7px 0;
   width: 96%;
   text-decoration: none
}

.MobilNavArea .PayInformation {
   display: flex;
   flex-direction: column;
   margin-top: 15px
}

.MobilNavArea .PayInformation .IconList {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   gap: 10px
}

.MobilNavArea .PayInformation .IconList .Item {
   display: flex;
   width: 16%;
   overflow: hidden
}

.MobilNavArea .PayInformation .IconList .Item img {
   width: 100%
}

.MobilNavArea .PayInformation .Info {
   display: flex;
   align-content: center;
   align-items: flex-start;
   border: 0;
   flex-direction: row
}

.MobilNavArea .PayInformation .Info i {
   display: flex;
   font-size: 20px;
   margin-right: 5px;
   color: #ff5722
}

.MobilNavArea .PayInformation .Info span {
   display: flex;
   font-size: 13px
}

.MobilNavArea .MobilNavUserArea {
   margin-top: 40px;
   border-top: 1px solid #ccc;
   padding-top: 10px;
   display: flex;
   flex-direction: column
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin {
   border: 1px solid #4caf50;
   padding: 6px;
   border-radius: 4px;
   margin-bottom: 10px
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder {
   border: 1px solid #673ab7;
   background: #673ab7;
   padding: 6px;
   border-radius: 4px;
   margin-bottom: 10px
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder {
   cursor: pointer;
   color: #fff;
   display: flex;
   flex: none;
   align-items: center
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder svg {
   margin-right: 8px;
   font-size: 22px;
   height: 27px;
   width: 29px;
   fill: #fff
}

.MobilNavArea .MobilNavUserArea .Btn.BtnFollowOrder:hover {
   border-color: #4bae4f;
   color: #4bae4f
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin {
   cursor: pointer;
   color: #4caf50;
   display: flex;
   flex: none;
   align-items: center
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin svg {
   margin-right: 5px;
   font-size: 22px;
   height: 27px;
   width: 32px;
   fill: #4caf50
}

.MobilNavArea .MobilNavUserArea .Btn.BtnLogin:hover {
   border-color: #4bae4f;
   color: #4bae4f
}

table {
   width: 100%!important;
   margin: 0 auto;
   clear: both;
   border-collapse: separate;
   border-spacing: 0;
   display: table
}

table tbody tr.sH {
   font-weight: 400
}

table tbody tr.sH th {
   font-weight: 400;
   color: #c39789;
   text-align: left;
   padding: 10px 10px 5px;
   text-transform: uppercase;
   font-size: 14px
}

table tbody tr {
}

table tbody tr:hover td {
   box-shadow: inset 0 1px 0 0 #d1afa4,inset 0 -1px 0 0 #d1afa4
}

table tbody tr:hover td:nth-child(1) {
   border-radius: 6px 0 0 6px;
   box-shadow: inset 0 1px 0 0 #d1afa4,inset 0 -1px 0 0 #d1afa4,inset 1px 0 0 0 #d1afa4
}

table tbody tr:hover td:last-child {
   border-radius: 0 6px 6px 0;
   box-shadow: inset 0 1px 0 0 #d1afa4,inset 0 -1px 0 0 #d1afa4,inset -1px 0 0 0 #d1afa4
}

table tbody td {
   line-height: 15px;
   padding: 8px 10px;
   border: 4px solid #fff;
   color: #5e6165;
   border-right: 0;
   border-left: 0;
   font-size: 14px;
   position: relative;
   box-shadow: inset 0 1px 0 0 #dbe0e9,inset 0 -1px 0 0 #dbe0e9;
   font-weight: 500;
   text-align: left
}

table tbody tr.nonLine td {
   box-shadow: inset 0 1px 0 0 #2d333600,inset 0 -1px 0 0 #2d333659!important;
   border-radius: 0!important;
   border: 0;
   padding-bottom: 10px;
   padding-top: 10px
}

table tbody td.Price:before {
   content: attr(curr);
   position: absolute;
   left: 10px;
   top: 9px;
   height: 39px;
   background: #d3d9e2;
   color: #000;
   display: flex;
   align-items: center;
   width: 30px;
   text-align: center;
   justify-content: center;
   font-size: 12px
}

table tbody td .BoxPrice {
   display: flex;
   align-items: center
}

table tbody td .ImgBox {
   width: 120px;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   align-content: center
}

table tbody td .ImgBox img {
   height: 30px
}

table tbody td .UploadPhoto {
   width: 40px;
   border: 1px solid #ccc;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer
}

table tbody td .UploadPhoto img {
   height: 30px
}

table tbody td span.ImgIcon {
   font-size: 26px;
   color: #97a2b3;
   display: inline-block;
   margin: 2px 0 0 5px
}

table tbody td span.ImgIcon.Active {
   color: #4caf50
}

table tbody td span.Time {
   line-height: 0;
   font-size: 11px;
   font-weight: 400;
   background: #e0e7ea;
   padding: 2px 3px;
   border-radius: 4px
}

table tbody td:nth-child(1) {
   border-radius: 6px 0 0 6px;
   box-shadow: inset 0 1px 0 0 #dbe0e9,inset 0 -1px 0 0 #dbe0e9,inset 1px 0 0 0 #dbe0e9
}

table tbody tr.nonLine td:nth-child(1) {
   border-radius: 0;
   box-shadow: inset 0 1px 0 0 #2d333600,inset 0 -1px 0 0 #2d333659,inset 1px 0 0 0 #2d333600
}

table thead th:first-child {
   display: none
}

table tbody td:first-child {
}

table tbody td:last-child {
   border-radius: 0 6px 6px 0;
   box-shadow: inset 0 1px 0 0 #dbe0e9,inset 0 -1px 0 0 #dbe0e9,inset -1px 0 0 0 #dbe0e9
}

table tbody td i.move {
   padding: 0;
   width: 25px;
   text-align: center;
   background: #e0e7ea;
   border-radius: 4px;
   margin-left: 1px;
   font-size: 16px;
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   line-height: 46px;
   cursor: move;
   display: flex;
   align-items: center;
   justify-content: center
}

table tbody tr:hover td i.move {
   background: #ff9800;
   color: #fff
}

table tbody td img.Icon {
   padding: 3px 4px;
   margin: 4px 0;
   float: left
}

table tbody td .contentLang {
   display: none;
   background: #c8cfe170;
   color: #000;
   width: 36px;
   height: 36px;
   border-radius: 3px;
   position: absolute;
   right: 5px;
   top: 12px;
   text-indent: 0;
   line-height: 36px;
   text-align: center;
   font-size: 22px
}

table tbody tr:hover .contentLang {
   display: block
}

table tbody tr span.Name {
   padding: 8px 15px;
   line-height: 28px;
   float: left
}

table tbody tr div.LongText {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   width: 320px
}

table tbody tr div.BtnList {
   display: flex;
   justify-content: flex-end
}

table tbody tr div.BtnList .Btn {
   margin-left: 5px;
   padding: 5px 7px;
   background: 0 0;
   font-size: 12px
}

table tbody tr th.textL {
   text-align: left
}

table tbody tr th.textR {
   text-align: right
}

table tbody tr th.textC {
   text-align: center
}

table tbody tr td.textL {
   text-align: left
}

table tbody tr td.textR {
   text-align: right
}

table tbody tr td.textC {
   text-align: center
}

table tbody tr td.textb {
   font-weight: 700
}

table tbody tr td.Icon img {
   border-radius: 100px
}

table tbody tr td input {
   float: left;
   width: 100%;
   font-weight: 400;
   font-size: 12px;
   line-height: 19px;
   border: 1px solid #ccc;
   padding: 5px;
   outline: none
}

table tbody tr td.Price input {
   text-indent: 28px
}

table tbody tr td .TwoRow {
   width: 100%
}

table tbody tr td .TwoRow span:nth-child(1) {
   width: 100%;
   float: left;
   color: #000
}

table tbody tr td .TwoRow span:nth-child(2) {
   width: 100%;
   float: left;
   color: #248b2b;
   font-size: 12px;
   font-weight: 500
}

table tbody td .Order_Product {
   display: flex;
   width: 100%;
   flex-direction: row;
   align-content: center;
   justify-content: center;
   align-items: flex-start
}

table tbody td .Order_Product .Photo {
   width: 75px;
   float: left;
   margin-right: 10px
}

table tbody td .Order_Product .Photo img {
   height: 76px;
   border-radius: 2px
}

table tbody td .Order_Product .Info {
   width: 100%;
   display: flex;
   float: left;
   line-height: 22px;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center;
   align-content: center
}

table tbody td .Order_Product .Info span {
   width: 100%;
   line-height: 16px;
   font-size: 12px
}

table tbody td .Order_Product .Info span strong {
   font-weight: 600;
   color: #000;
   margin-left: 5px
}

table tbody td .Order_Extra {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: center;
   justify-content: center;
   border: 1px solid #cccccc47;
   padding: 10px;
   border-radius: 4px;
   background: #f3f4f633
}

table tbody td .Order_Extra span {
   width: 100%;
   float: left;
   line-height: 22px
}

table tbody td .Order_Extra span strong {
   float: right;
   font-weight: 600;
   color: #000
}

table tbody td .Order_Packet {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: center;
   justify-content: center
}

table tbody td .Order_Packet span {
   width: 100%;
   float: left;
   line-height: 19px;
   font-size: 12px
}

table tbody td .Order_Packet span strong {
   float: right;
   font-weight: 600;
   color: #000
}

table tbody td .Order_Extra {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: center;
   justify-content: center;
   border: 1px solid #cccccc47;
   padding: 10px;
   border-radius: 4px;
   background: #f3f4f633
}

table tbody td .Order_Extra span {
   width: 100%;
   float: left;
   line-height: 22px
}

table tbody td .Order_Extra span strong {
   float: right;
   font-weight: 600;
   color: #000
}

table tbody td .Order_Status {
   display: flex;
   width: 100%;
   flex-direction: column;
   align-content: flex-start;
   justify-content: center;
   align-items: flex-start
}

table tbody td .Order_Status span {
   width: 100%;
   float: left;
   line-height: 16px;
   text-align: left;
   font-size: 12px
}

table tbody td .Order_Status span strong {
   float: right;
   font-weight: 600;
   color: #000;
   font-size: 11px
}

td .BoxArea {
   background: #f1f2f4;
   color: #61615e;
   padding: 6px 8px;
   border-radius: 4px;
   font-size: 14px;
   font-weight: 400;
   text-align: center;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center
}

td .BoxArea.Default {
   background: #d1afa4;
   color: #fff
}

td .BoxArea.Green {
   background: #92ca94;
   color: #fff
}

td .BoxArea.Black {
   background: #000;
   color: #fff
}

td .BoxArea.Red {
   background: red;
   color: #fff
}

td .BoxArea.Blue {
   background: #2196f3;
   color: #fff
}

.PopupDesign {
   position: fixed;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 1022;
   outline: 0;
   overflow-y: auto;
   height: 100%;
   top: auto;
   padding-right: 0;
   display: flex;
   align-self: center;
   justify-items: center;
   align-items: flex-start
}

.PopupDesign>.Modal {
   -ms-transform: translate(0,75%);
   -ms-transform: translate(0,0);
   position: relative;
   width: auto;
   margin: 10px;
   transition: all .2s!important;
   margin: 0 auto;
   transform: translate3d(0,0,0);
   width: 30%;
   z-index: 1;
   display: block;
   height: initial
}

.PopupDesign>.Modal.w40 {
   width: 40%
}

.PopupDesign>.Modal.w50 {
   width: 50%
}

.PopupDesign>.Modal.w60 {
   width: 60%
}

.PopupDesign>.Modal.w70 {
   width: 70%
}

.PopupDesign>.Modal.w80 {
   width: 80%
}

.PopupDesign>.Modal.w100 {
   width: 95%
}

.PopupDesign>.PopupOver {
   position: fixed;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: 0;
   outline: 0;
   overflow-y: auto;
   height: 100%;
   top: auto;
   padding-right: 0;
   background: #00000099
}

.PopupDesign.Login>.Modal {
   -ms-transform: translate(0,75%);
   -ms-transform: translate(0,0);
   position: relative;
   margin: 10px;
   transition: all .2s!important;
   margin: 0 auto;
   transform: translate3d(0,0,0);
   z-index: 1;
   display: block;
   height: initial;
   min-width: 320px
}

.PopupDesign>.Modal>.Htm {
   width: 100%;
   text-align: center;
   margin-top: 30px;
   margin-bottom: 30px
}

.PopupDesign>.Modal>.Htm>.Document {
   position: relative;
   outline: 0;
   background: #fff;
   display: inline-block;
   width: 100%;
   box-shadow: 0 11px 46px -51px #000;
   border-radius: 6px;
   overflow: hidden;
   min-height: 120px
}

.PopupDesign.Login>.Modal>.Htm>.Document h4 {
   margin: 0
}

.PopupDesign.Login>.Modal>.Htm>.Document p {
   margin: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Title {
   position: relative;
   z-index: 3
}

.PopupDesign>.Modal>.Htm>.Document>.Title .Close {
   position: absolute;
   right: 10px;
   top: 10px;
   font-size: 15px;
   width: 30px;
   height: 30px;
   line-height: 44px;
   cursor: pointer;
   background: #efefef;
   border-radius: 100%;
   flex: none;
   display: flex;
   align-items: center;
   justify-content: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center {
   text-align: left;
   padding: 40px;
   line-height: 23px;
   float: left;
   width: 100%;
   overflow: auto;
   position: relative;
   z-index: 1
}

.PopupDesign>.Modal>.Htm>.Document>.Loading {
   text-align: left;
   padding: 30px
}

.PopupDesign.CampaingPopup>.Modal {
   width: inherit
}

.PopupDesign.CampaingPopup>.Modal>.Htm>.Document>.Center {
   padding: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .GiftPopupTitle {
   display: flex;
   width: 100%;
   font-size: 20px;
   margin-bottom: 25px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .GiftPopupTabList {
   display: flex;
   width: 100%;
   gap: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .GiftPopupTabList>.TabItem {
   align-items: flex-start;
   padding: 8px;
   border: 1px solid #e4e4e4;
   background: #e5e5e5bf;
   border-radius: 4px;
   margin-bottom: 6px;
   cursor: pointer;
   font-size: 14px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .GiftPopupTabList>.TabItem.Active {
   padding: 8px;
   width: initial;
   background: #4caf50;
   color: #fff
}

.PopupDesign>.Modal>.Htm>.Document>.Center .GiftPopupTabView {
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .GiftPopupTabView.Active {
   display: flex
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.Title {
   text-align: center;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-size: 28px;
   font-weight: 600;
   font-style: normal;
   font-stretch: normal;
   line-height: 1.29;
   letter-spacing: -1px;
   color: #484848;
   margin-bottom: 16px
}


.PopupDesign>.Modal>.Htm>.Document>.Center>.Text {
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-size: 14px;
   font-weight: 400;
   font-style: normal;
   font-stretch: normal;
   line-height: 18px;
   letter-spacing: -.32px;
   text-align: center;
   color: #7b7b7b;
   margin-bottom: 23px;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label, 
.PopupDesign>.Modal>.Htm>.Document>.Center .checkboxElements input.checkbox-input:checked+label.checkbox-label{font-size:12px}
.PopupDesign>.Modal>.Htm>.Document>.Center .TitleText {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   border: 0;
   display: flex;
   font-size: 12px;
   margin-top: 25px;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   margin-top: 8px;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input.Starts {
   width: 100%;
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-top: 0px;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input.Starts>div {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-top: 14px;
   justify-content: center;
   gap: 4px;
   align-content: center;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input.Starts>div>div:nth-child(1) {
   font-size: 22px;
   color: #9d9d9d;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input.Starts>div>div:nth-child(2) {
   width: 100%;
   font-size: 12px;
   text-align: center;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input.Starts>div.selected {
   color: #ec9109;
}
.PopupDesign>.Modal>.Htm>.Document>.Center .Input.Starts>div.selected>div:nth-child(1) {
   color: #ffc109;
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Input input {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Input textarea {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   min-height: 110px;
   font-family: system-ui;
   line-height: 19px
}



.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList {
   display: flex;
   width: 100%;
   gap: 10px;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   text-align: center;
   justify-content: center;
   flex-direction: row;
   align-items: center;
   margin-top: 20px;
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList>.Btn {
   padding: 3px;
   line-height: 38px;
   width: initial;
   overflow: auto;
   position: relative;
   background: 0 0;
   border: 2px solid silver;
   color: #000;
   border-radius: 6px;
   font-size: 15px;
   min-width: 120px;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList.Full>.Btn {
   width: 100%
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList>.Btn.Cancel {
   color: #616161
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList>.Btn.BtnOrange {
   background: #ff5722;
   color: #fff;
   border-color: #ff5722
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList>.Btn.BtnRed {
   background: red;
   color: #fff;
   border-color: red
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList>.Btn.BtnGreen {
   background: #4caf50;
   color: #fff;
   border-color: #4caf50
}

.PopupDesign>.Modal>.Htm>.Document>.Center>.BtnList>.Btn.Disabled {
   background: #d8d8d8;
   color: #a3a3a3;
   border-color: #d9d9d9
}

.PopupDesign>.Modal>.Htm>.Document>.Center .fieldset-sms {
   display: flex;
   width: 100%;
   flex-direction: column
}

.PopupDesign>.Modal>.Htm>.Document>.Center .fieldset-sms>.label {
   display: flex;
   width: 100%;
   justify-content: space-between;
   margin-bottom: 6px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .fieldset-sms>.label>.timekeeper {
   color: #ff5722;
   font-weight: 700
}

.PopupDesign>.Modal>.Htm>.Document>.Center .input-group {
   display: flex;
   width: 100%;
   margin-bottom: 22px
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code {
   background-color: #eee;
   border: 2px solid #eee;
   border-radius: 8px;
   box-sizing: border-box;
   color: #9b9b9b;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif;
   font-size: 22px;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -.32px;
   line-height: 1.5;
   outline: 0;
   padding: 0;
   width: 100%;
   height: 56px;
   display: flex;
   text-align: center;
   -webkit-box-pack: center;
   justify-content: center;
   margin-right: 2%
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code:not(:focus) {
   border-color: #ddd;
   color: #484848;
   background-color: #fff
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code:focus {
   background-color: #fff;
   border-color: #ff6000;
   color: #484848;
   transition: all 250ms ease 0s
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code:not(:focus):not(:disabled):hover {
   background-color: #f5f5f5
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code.Err {
   border: 2px solid #fb6f6f;
   border-radius: 8px;
   box-sizing: border-box;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -.32px;
   line-height: 1.5;
   outline: 0;
   padding: 10px 56px 10px 14px;
   width: 100%;
   background: #fef2f2;
   color: #fa3f3f
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code.Err::placeholder {
   color: red
}

.PopupDesign>.Modal>.Htm>.Document>.Center input.input-code:last-child {
   margin-right: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Blank {
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Blank.Active {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   width: 100%;
   margin: 30px;
   border: 1px solid #cccccc8c;
   padding: 20px;
   border-radius: 4px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem {
   display: flex;
   width: 100%;
   align-items: flex-start;
   padding: 8px;
   border: 1px solid #e4e4e4;
   background: #edededbf;
   border-radius: 6px;
   margin-bottom: 6px;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem:last-child {
   margin: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem:hover {
   background: #fff;
   border-color: #4caf50
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem.Disabled {
   background: #f2f2f2;
   border-color: #d6d6d6;
   cursor: default
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Code {
   border: 1px dashed #ccc;
   padding: 10px;
   text-align: center;
   width: 150px;
   flex: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info {
   padding: 0 5px;
   display: flex;
   width: 100%;
   flex-direction: column
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Name {
   line-height: 14px;
   width: 100%;
   font-weight: 600;
   margin-bottom: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Text {
   line-height: 16px;
   width: 100%;
   font-size: 13px;
   color: #888
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Date {
   line-height: 15px;
   width: 100%;
   font-size: 13px;
   color: #f44336
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Statu {
   line-height: 21px;
   background: red;
   color: #fff;
   width: fit-content;
   font-size: 14px;
   padding: 0 12px;
   border-radius: 4px;
   margin-top: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Btn {
   text-align: left;
   padding: 40px;
   line-height: 23px;
   float: left;
   width: 100%;
   overflow: auto;
   position: relative;
   z-index: 1
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem.Disabled .Info>.Btn {
   pointer-events: none;
   border-color: #ccc;
   color: #aaa
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem.Disabled .Info>.Name {
   pointer-events: none;
   border-color: #ccc;
   color: #aaa
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem.Disabled .Info>.Text {
   pointer-events: none;
   border-color: #ccc;
   color: #aaa
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem.Disabled .Info>.Date {
   pointer-events: none;
   border-color: #ccc;
   color: #aaa
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem.Disabled .Info>.Statu {
   pointer-events: none;
   background-color: #ccc;
   color: #707070
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design {
   width: 100%;
   margin: 12px 0;
   display: block
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem {
   width: 100%;
   margin-bottom: 14px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Title {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   color: #000;
   margin: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Title i {
   width: 20px;
   font-size: 20px;
   margin-right: 5px;
   text-align: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Title span {
   width: 100%;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Info {
   width: 100%;
   padding: 0;
   border: 0;
   font-size: 12px;
   color: #5f6b70;
   margin-top: 4px;
   margin-bottom: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 4px;
   position: relative;
   background: #fdfeff
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 10px;
   outline: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input.Error input {
   border: 1px solid #ff11003d
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input .ErrorText {
   display: none;
   width: initial;
   color: red;
   font-size: 12px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input.Error .ErrorText {
   display: flex;
   justify-content: flex-start
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input span {
   width: initial;
   font-size: 12px;
   text-align: right;
   color: #585858;
   padding: 2px 0 0;
   justify-content: flex-end
}

.PopupDesign>.Modal>.Htm>.Document>.Center .popTitle {
   line-height: 14px;
   font-size: 18px;
   font-weight: 500
}

.PopupDesign>.Modal>.Htm>.Document>.Center .DeleteItem {
   width: 100%;
   display: flex;
   flex-direction: column;
   margin-top: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .DeleteItem span:nth-child(1) {
   width: 100%;
   font-weight: 600;
   color: red;
   line-height: 16px;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .DeleteItem span:nth-child(2) {
   width: 100%;
   line-height: 18px;
   font-size: 16px;
   font-weight: 600
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom {
   padding: 18px 40px;
   width: 100%;
   display: flex;
   justify-content: flex-end;
   align-items: center;
   align-content: center
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Cancel {
   line-height: 20px;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Cancel:hover {
   color: #000;
   text-decoration: underline
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume {
   cursor: pointer;
   line-height: 20px;
   background: #4bae4f;
   color: #fff;
   border-radius: 2px;
   padding: 4px 10px;
   margin-left: 15px;
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume.Full {
   width: 100%;
   margin: 0;
   padding: 12px;
   font-size: 19px
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume:hover {
   background: #34a93a
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume.Active {
   padding: 4px 10px 4px 32px;
   background: #34a93a;
   pointer-events: none
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume.Active::before {
   content: "";
   background: #18641c url(/Library/Img/Loading.svg?);
   width: 29px;
   height: 100%;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11;
   background-position: 50%;
   background-size: cover
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Logo {
   margin-bottom: 15px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle {
   width: 100%;
   margin-bottom: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle h4 {
   width: 100%;
   line-height: 14px;
   margin-bottom: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle .Text {
   width: 100%;
   font-size: 14px;
   line-height: 18px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle img {
   margin: 10px 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup {
   width: 100%;
   margin-bottom: 8px;
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup svg {
   position: absolute;
   height: 20px;
   top: 12px;
   left: 10px;
   fill: #4caf50
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow {
   margin: 0;
   cursor: pointer;
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage.Active .MessageArrow {
   display: block
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow.fa-chevron-left {
   position: absolute;
   left: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow.fa-chevron-right {
   position: absolute;
   right: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow.Disabled {
   color: #ababab
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup select {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   background: #fff;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup textarea {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   min-height: 120px;
   resize: none;
   background: #fff;
   font-size: 16px;
   font-family: inherit;
   line-height: 22px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup input {
   width: 100%;
   border: 1px solid #ddd;
   padding: 12px 10px;
   border-radius: 4px;
   outline: none;
   font-size: 16px;
   background: #fff
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .Btn {
   border: 0;
   background: #4caf50;
   color: #fff;
   padding: 10px 20px;
   border-radius: 4px;
   margin: 10px 0;
   cursor: pointer;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .Btn:hover {
   background: #3c9f40
}

.PopupDesign>.Modal>.Htm>.Document>.Center .OtherText {
   width: 100%;
   font-weight: 400
}

.PopupDesign>.Modal>.Htm>.Document>.Center .OtherText span {
   font-weight: 700;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Contract {
   width: 100%;
   text-align: left;
   line-height: 18px;
   font-size: 13px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Contract span {
   font-weight: 600;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea {
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area {
   display: flex
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area img {
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area .Info {
   width: 100%;
   margin-left: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .ClosedIcon {
   position: absolute;
   right: 7px;
   top: 5px;
   display: none;
   font-size: 22px;
   color: #4caf50;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea.Active .ClosedIcon {
   display: block
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea.Active input {
   border-color: #3c9f40;
   color: #3c9f40;
   pointer-events: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group {
   width: 100%;
   position: relative;
   left: 0;
   right: 0;
   z-index: 2;
   max-height: 180px;
   overflow: auto;
   padding: 10px;
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group .list-group-item {
   width: 100%;
   padding: 4px 20px;
   cursor: pointer;
   box-shadow: inset 0 0 0 1px #e2e7e947;
   margin-bottom: 1px;
   border-radius: 2px;
   list-style: none;
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group .list-group-item:hover {
   width: 100%;
   background: #e8f5e9;
   box-shadow: inset 0 0 0 1px #4bae4f6b
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group .list-group-item::before {
   content: "\f041";
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   position: absolute;
   left: 6px;
   top: 8px;
   color: #4bae4f
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea.Loading .FormGroup::before {
   content: "";
   background: #bfbfbf url(/Library/Img/Loading.svg?);
   width: 26px;
   height: 26px;
   background-size: 26px;
   border-radius: 16px;
   position: absolute;
   right: 4px;
   top: 4px;
   z-index: 11
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group::-webkit-scrollbar-thumb {
   background-color: rgb(180 185 191);
   border-radius: 25px;
   overflow: hidden
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group::-webkit-scrollbar-track {
   background: rgb(221 221 221);
   border-radius: 12px;
   overflow: hidden
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point {
   width: 100%;
   margin-bottom: 20px;
   display: flex;
   justify-content: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star {
   color: #919191;
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 82px;
   padding: 10px;
   border-radius: 2px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star i {
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star span {
   font-size: 14px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star.Selected {
   color: #ff9800
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star.Active {
   color: #ff9800
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star.Active i::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 24px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star i::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 24px;
   font-family: "font awesome 5 free";
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   align-content: center;
   flex-direction: column
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage .Title {
   width: 100%;
   font-weight: 500;
   color: red;
   text-align: center;
   margin-bottom: 3px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage .Text {
   width: 100%;
   text-align: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage .Btn {
   margin: 0;
   margin-top: 18px;
   text-align: center;
   font-size: 18px;
   padding: 12px 20px;
   background: #ff9800;
   color: #fff;
   border: 0;
   border-radius: 6px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar {
   display: flex;
   width: 100%;
   overflow: hidden;
   border-radius: 60px;
   padding: 1px;
   margin-top: 12px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item {
   display: flex;
   flex-direction: column;
   position: relative;
   padding: 2px;
   -webkit-transform: skewX(-40deg);
   transform: skewX(-40deg);
   background: #cccfd7;
   border-radius: 3px;
   margin-right: 10px;
   width: 100%;
   text-align: center;
   overflow: hidden;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item:hover {
   background: #b1b5c5
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item:first-child {
   margin-left: -10px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item:last-child {
   margin-right: -9px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item span {
   padding: 5px;
   font-size: 13px;
   -webkit-transform: skewX(40deg);
   transform: skewX(40deg)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Btn {
   padding: 12px 30px;
   width: 100%;
   text-align: center;
   font-size: 18px;
   background: #4caf50;
   color: #fff;
   border-radius: 4px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements {
   margin-bottom: 5px;
   display: flex;
   align-items: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked),.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked {
   left: 0;
   top: 0;
   opacity: 0;
   visibility: hidden;
   z-index: -9999;
   width: inherit;
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label,.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label {
   position: relative;
   padding-left: 30px;
   cursor: pointer;
   font-weight: 500;
   color: #000;
   min-height: 20px;
   min-width: 20px;
   margin: 0;
   line-height: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:before,.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label:before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 20px;
   height: 20px;
   border: 1px solid #ccc;
   background: #fff;
   border-radius: 3px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:after,.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label:after {
   content: "";
   position: absolute;
   left: 5px;
   font-size: 12px;
   line-height: .8;
   transition: all .2s;
   top: 5px;
   font-weight: 700;
   width: 12px;
   height: 12px;
   background: #4caf50
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:after {
   opacity: 0;
   transform: scale(0)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label:after {
   opacity: 1;
   transform: scale(1)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup input.Error {
   border: 1px solid #ff00002b;
   background: #ff000003
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Title {
   float: left;
   width: 100%;
   color: #000;
   margin-bottom: 10px;
   font-size: 19px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product {
   display: flex;
   flex-direction: row;
   width: 100%
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Photo {
   width: 65px;
   flex: none;
   padding: 5px;
   border: 1px solid #e7e7e7;
   border-radius: 4px;
   margin-right: 10px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Photo img {
   width: 100%
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Name {
   width: 100%;
   font-weight: 500;
   display: flex;
   flex-direction: column
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Name>span:nth-child(1) {
   width: 100%;
   font-weight: 700
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Name>span:nth-child(2) {
   width: 100%;
   font-size: 18px;
   line-height: 19px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList {
   float: left;
   width: 100%;
   overflow: auto;
   display: flex;
   margin-top: 10px;
   border-top: 1px solid #e9e9e9;
   padding-top: 10px;
   align-items: center;
   justify-content: center;
   align-content: center;
   flex-direction: row;
   gap: 10px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn {
   margin: 0 10px;
   padding: 8px 10px;
   font-size: 17px;
   font-weight: 500;
   margin: 0
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn.cancel-btn {
   color: #444;
   background: 0 0;
   padding: 0;
   cursor: pointer
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn.Complete {
   border: 1px solid #4caf50;
   color: #277a2a;
   border-radius: 4px;
   text-align: center;
   background: 0 0
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Bottom {
   display: none
}

.ProductView .Gallery .Head {
   display: none
}

.product-image-zoom {
   position: fixed;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   overflow: hidden;
   z-index: 99999
}

.product-image-zoom .close-zoom {
   position: fixed;
   right: 15px;
   top: 60px;
   z-index: 5;
   font-size: 24px;
   color: #4c4c4c;
   padding: 10px;
   cursor: pointer
}

.product-image-zoom>.image-thumbs {
   position: absolute;
   bottom: 0;
   height: 100%;
   overflow-y: hidden;
   overflow-x: auto;
   white-space: nowrap;
   z-index: 5;
   width: 100%;
   padding: 10px 20px;
   height: 111px;
   background-color: #fbfbfb;
   text-align: center
}

.product-image-zoom>.image-thumbs::-webkit-scrollbar {
   width: 0;
   height: 0
}

.product-image-zoom>.image-thumbs>.item {
   width: 60px;
   margin: 0 6px;
   opacity: .5;
   display: inline-block
}

.product-image-zoom>.image-thumbs>.item.Selected {
   opacity: 1
}

.product-image-zoom>.big-image-container {
   position: fixed;
   right: 0;
   top: 0;
   bottom: 0;
   left: 0;
   width: 100%;
   height: calc(100% - 111px);
   overflow-y: auto;
   background-color: #fbfbfb
}

.product-image-zoom>.big-image-container::-webkit-scrollbar {
   width: 0;
   height: 0
}

.product-image-zoom>.big-image-container>img {
   margin: 0 auto;
   height: 100%;
   cursor: url(/Library/Img/cursor-zooom.png),auto
}

.product-image-zoom>.big-image-container>img.zoomImg {
   height: auto;
   cursor: url(/Library/Img/cursor-zoom-out.png),auto
}

.product-image-zoom .zoom-loading {
   position: fixed;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   width: 100%;
   height: 100%;
   background-color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 5
}

.product-image-zoom .zoom-loading>.loading-icon {
   border-radius: 50%;
   width: 24px;
   height: 24px;
   border: 2px solid rgb(197 197 197/62%);
   border-top-color: #a7a7a7;
   -webkit-animation: zoomSpin 1s infinite linear;
   animation: zoomSpin 1s infinite linear
}

@-webkit-keyframes zoomSpin {
   0% {
       -webkit-transform: rotate(0deg);
       transform: rotate(0deg)
   }

   100% {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

@keyframes zoomSpin {
   0% {
       -webkit-transform: rotate(0deg);
       transform: rotate(0deg)
   }

   100% {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

.Head .MobilNav img {
   height: 48px
}

.Container.Wsmall {
   width: 1320px;
   margin: 0 auto
}

.scroll-to-up-none {
   visibility: hidden;
   opacity: 0;
   transition: visibility 0s 2s,opacity 2s linear;
   display: none
}

.scroll-to-up {
   backface-visibility: hidden;
   background-color: #fff;
   border: 1px solid #dcdcdc;
   border-bottom-width: 2px;
   bottom: 75px;
   cursor: pointer;
   height: 40px;
   line-height: 42px;
   margin: 5px;
   position: fixed;
   right: 5px;
   width: 110px;
   will-change: scroll-position;
   z-index: 1000;
   -webkit-transition: opacity 500ms ease-in-out;
   -moz-transition: opacity 500ms ease-in-out;
   -ms-transition: opacity 500ms ease-in-out;
   -o-transition: opacity 500ms ease-in-out;
   opacity: 1;
   box-shadow: 0 1px 4px 0 rgba(0,0,0,.05);
   border-radius: 20px
}

.scroll-to-up:hover {
   border-color: #4caf50
}

.scroll-to-up:hover span {
   -moz-transition-property: all;
   -o-transition-property: all;
   -webkit-transition-duration: .4s;
   -webkit-transition-property: all;
   -webkit-transition-timing-function: linear;
   color: #4caf50;
   transition-duration: .4s;
   transition-property: all;
   transition-timing-function: linear
}

.scroll-to-up:hover i {
   -moz-transition-property: all;
   -o-transition-property: all;
   -webkit-transition-duration: .4s;
   -webkit-transition-property: all;
   -webkit-transition-timing-function: linear;
   background-position: 0 -18px;
   transition-duration: .4s;
   transition-property: all;
   transition-timing-function: linear
}

.scroll-to-up i {
   display: block;
   float: left;
   height: 12px;
   margin: 14px 0 0 15px;
   opacity: .8;
   overflow: hidden;
   width: 12px
}

.scroll-to-up span {
   color: #666;
   float: left;
   font-size: 14px;
   font-weight: 600;
   margin-left: 7px;
   text-align: center
}

.scroll-to-up i::before {
   content: "\f062";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 13px;
   color: #adadad
}

.scroll-to-up:hover i::before {
   color: #4caf50
}

.q-scroll-to-top {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 46px;
   width: 46px;
   border-radius: 50%;
   background: rgb(255 255 255/70%);
   font-size: 1.5rem;
   position: fixed;
   bottom: -100px;
   right: 70px;
   text-align: center;
   z-index: 1;
   transition: .5s;
   box-shadow: 0 0 0 1px #000000ba
}

.q-scroll-to-top.hide {
   bottom: -100px
}

.q-scroll-to-top .q-icon::before {
   content: "\f062";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 16px;
   color: #000
}

.wp-support-button {
   position: fixed;
   bottom: 130px;
   right: 15px;
   z-index: 999
}

body[userpage=ProductView] .wp-support-button {
   bottom: 70px
}

.wp-support-button>img {
   width: 55px
}

body[fcode=Fr-5500154] .wp-support-button {
   bottom: 154px
}

.AllPagePhoneSale {
   position: fixed;
   right: 15px;
   bottom: 70px;
   z-index: 15;
   border-radius: 50%;
   width: 46px;
   height: 46px;
   line-height: 50px;
   text-align: center;
   font-size: 22px;
   color: #fff;
   background-image: url(/Library/Img/900032105_b27Iym3XXs0V.png);
   background-size: cover;
   transition: .3s;
   display: none
}

.AllPagePhoneSale.nav-hide {
   right: -100px
}

.AllPagePhoneSaleModal {
   position: fixed;
   z-index: 9992;
   bottom: 0;
   left: 0;
   right: 0;
   padding: 10px;
   transition: .3s;
   transform: translateY(200%);
   opacity: 0
}

.AllPagePhoneSaleModal.Show {
   transform: translateY(0);
   opacity: 1
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop {
   background-color: #fff;
   border-radius: 10px;
   text-align: center
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>.product-code {
   padding: 0 10px;
   display: inline-block;
   border-bottom: 1px solid #777;
   padding-bottom: 4px;
   margin-bottom: 10px
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>p {
   display: block;
   padding: 0 15px;
   font-size: 13px;
   line-height: 17px;
   color: #505050;
   margin-bottom: 15px
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>.modalList>.item .item-link {
   width: 100%;
   display: block;
   padding: 16px 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   color: #000
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>.modalList>.item .item-link>.Icon {
   font-size: 21px;
   margin-right: 8px
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.phoneSaleClose {
   background-color: #fff;
   border-radius: 10px;
   padding: 15px;
   text-align: center;
   margin-top: 10px
}

.SearchPop {
   position: fixed;
   z-index: 9992;
   bottom: 0;
   left: 0;
   right: 0;
   top: 0;
   padding: 20px;
   transition: all .3s;
   transform: translateY(200%);
   background: #fff;
   opacity: 0
}

.SearchPop.Show {
   transform: translateY(0);
   opacity: 1;
   transition: all .3s
}

.SearchPop>.Modal .TopArea {
   display: flex;
   justify-content: space-between;
   margin-bottom: 30px
}

.SearchPop>.Modal .TopArea .Closed {
   display: flex;
   align-items: center;
   font-size: 16px
}

.SearchPop>.Modal .TopArea .Closed i {
   font-size: 22px;
   margin-right: 10px
}

.SearchPop>.Modal .TopArea .Home {
   width: 30px
}

.SearchPop>.Modal .CenterAra {
   width: 100%;
   overflow: auto;
   padding-right: 10px
}

.SearchPop>.Modal .CenterAra>.Title {
   width: 100%;
   font-size: 18px;
   font-weight: 500;
   margin-bottom: 20px
}

.SearchPop>.Modal .CenterAra .Input {
   width: 100%;
   position: relative;
   margin-bottom: 30px
}

.SearchPop>.Modal .CenterAra .Input svg {
   position: absolute;
   left: 0;
   top: 8px;
   width: 24px
}

.SearchPop>.Modal .CenterAra .Input input {
   width: 100%;
   border: 0;
   border-bottom: 3px solid #000;
   font-size: 16px;
   font-weight: 700;
   padding: 10px;
   text-indent: 30px;
   -webkit-appearance: none;
   border-radius: 0
}

.SearchPop>.Modal .CenterAra .Suggets {
   width: 100%;
   margin-bottom: 20px
}

.SearchPop>.Modal .CenterAra .Suggets .Title {
   width: 100%;
   font-size: 14px;
   font-weight: 500;
   margin-bottom: 15px
}

.SearchPop>.Modal .CenterAra .Suggets .List {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
   gap: 5px
}

.SearchPop>.Modal .CenterAra .Suggets .List>a {
   border: 1px solid #000;
   border-radius: 14px;
   padding: 4px 10px;
   font-size: 13px
}

.SearchPop>.Modal .CenterAra .LastView {
   width: 100%
}

.SearchPop>.Modal .CenterAra .LastView .Title {
   width: 100%;
   font-size: 14px;
   font-weight: 500
}

.SearchPop>.Modal .CenterAra .LastView .View {
   width: 100%
}

.SearchPop>.Modal .CenterAra .Result {
   width: 100%
}

.SearchPop>.Modal .CenterAra::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

.SearchPop>.Modal .CenterAra::-webkit-scrollbar-thumb {
   background-color: rgb(183 223 184)
}

.SearchPop>.Modal .CenterAra::-webkit-scrollbar-track {
   background: rgb(183 223 184/35%)
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem {
   width: 25%;
   padding: 5px
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem .OtherInfo {
   left: 5px;
   right: 5px
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem .Slogan {
   display: none
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem .BtnFavorite {
   display: none
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem {
   width: 25%;
   padding: 5px
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .OtherInfo {
   left: 5px;
   right: 5px
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Slogan {
   display: none
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .BtnFavorite {
   display: none
}

.AccountPagePopup {
   position: fixed;
   z-index: 9992;
   bottom: 0;
   left: 0;
   right: 0;
   top: 0;
   padding: 20px;
   transition: .3s;
   transform: translateY(200%);
   background: #fff;
   opacity: 0
}

.AccountPagePopup.Show {
   transform: translateY(0);
   opacity: 1;
   display: block!important
}

.AccountPagePopup>.Modal .TopArea {
   display: flex;
   justify-content: space-between;
   margin-bottom: 30px
}

.AccountPagePopup>.Modal .TopArea .Closed {
   display: flex;
   align-items: center;
   font-size: 16px
}

.AccountPagePopup>.Modal .TopArea .Closed i {
   font-size: 22px;
   margin-right: 10px
}

.AccountPagePopup>.Modal .TopArea .Home {
   width: 30px
}

.AccountPagePopup>.Modal .CenterAra {
   width: 100%;
   overflow: auto;
   padding-right: 10px
}

.AccountPagePopup>.Modal .CenterAra .User {
   width: 100%;
   position: relative;
   margin-bottom: 30px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   margin-top: 30px
}

.AccountPagePopup>.Modal .CenterAra .User span:nth-child(2) {
   width: 100%;
   position: relative;
   text-align: center;
   margin-top: 10px;
   margin-bottom: 5px
}

.AccountPagePopup>.Modal .CenterAra .User span:nth-child(3) {
   position: relative;
   margin-bottom: 30px;
   text-align: center;
   background: #cccccc61;
   border-radius: 22px;
   padding: 4px 20px;
   font-size: 13px
}

.AccountPagePopup>.Modal .CenterAra .User svg {
   height: 82px;
   border: 2px solid #000;
   padding: 10px;
   border-radius: 100px;
   width: initial
}

.AccountPagePopup>.Modal .CenterAra .AccountArea {
   width: 100%;
   border: 0;
   font-size: 16px;
   font-weight: 700;
   padding: 10px;
   text-indent: 30px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center
}

.AccountPagePopup>.Modal .CenterAra .AccountArea a {
   width: 100%;
   margin-bottom: 3px;
   padding: 10px 0
}

.AccountPagePopup>.Modal .CenterAra .AccountArea a i {
   margin-right: 10px
}

.MK .Top {
   width: 100%;
   display: flex;
   justify-content: space-between;
   background: #efefef;
   padding: 6px 0
}

.MK .Top .Left {
   width: 100%
}

.MK .Top .Right {
   width: 100%
}

.MK .Top .Right .Item {
   width: 100%
}

.MK .Head {
   width: 100%;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   padding: 20px 0
}

.MK .Head .Container {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   padding: 20px 0;
   gap: 20px
}

.MK .Head .Logo {
   width: 100%
}

.MK .Head .Search {
   width: 100%
}

.MK .Head .Search .Input {
   width: 100%
}

.MK .Head .Search .Input input {
   width: 100%;
   padding: 8px;
   border: 2px solid #ccc;
   border-radius: 4px
}

.MK .Head .User {
   width: 100%;
   display: flex;
   gap: 10px;
   justify-content: flex-end;
   align-items: center
}

.MK .Head .User .BtnLogin {
   border-radius: 25px;
   background: #c8e6fd;
   color: #1965a2;
   padding: 10px 20px;
   font-weight: 600;
   font-size: 14px;
   cursor: pointer;
   text-align: center
}

.MK .Head .User .Bag {
   display: flex;
   gap: 5px;
   flex-direction: row;
   align-items: stretch;
   border: 1px solid #e1e1e1;
   border-radius: 6px;
   padding: 0 10px;
   align-content: center
}

.MK .Head .User .Bag svg {
   width: 24px;
   flex: none
}

.MK .Head .User .Bag .Info {
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   width: max-content;
   margin-left: 20px
}

.MK .Head .User .Bag .Info span:nth-child(1) {
   font-weight: 600;
   font-size: 13px;
   text-align: right
}

.MK .Head .User .Bag .Info span:nth-child(2) {
   font-weight: 600;
   font-size: 13px;
   text-align: right;
   color: #e91e63
}

.MK .Nav {
   width: 100%
}

.MK .Nav .Categories {
   width: 100%
}

.MK .Nav .BtnList {
   width: 100%
}

.MK .Nav .BtnList .Item {
   width: 100%
}

.GiftArea {
   background: #fff;
   padding: 10px;
   border: 1px solid #e9eeef;
   border-radius: 4px;
   margin-top: 10px;
   width: 100%
}

.Addition .GiftArea {
   display: block
}

.GiftArea>span {
   width: 100%;
   font-size: 13px;
   font-weight: 600;
   margin-bottom: 5px;
   display: block
}

.GiftArea>.BtnText {
   width: 100%;
   font-size: 13px;
   font-weight: 600;
   margin-bottom: 5px;
   display: block;
   cursor: pointer;
   color: #2196f3;
   text-decoration: underline
}

.GiftArea>.BtnText:hover {
   color: #124e7d;
   text-decoration: none
}

.GiftArea>div {
   display: flex;
   gap: 10px;
   align-items: center
}

.GiftArea>div>input {
   border: 1px solid #ccc;
   padding: 9px;
   border-radius: 2px;
   width: 100%
}

.GiftArea>div>.Btn {
   padding: 8px 14px;
   border-radius: 3px;
   font-size: 14px;
   flex: none;
   cursor: pointer
}

.GiftArea>div>.Btn.COUPON_CODE_SEND {
   background: #42c346;
   color: #fff
}

.GiftArea>div>.Btn.COUPON_CODE_REMOVE {
   background: red;
   color: #fff;
   display: none
}

.GiftArea>div>.Btn.BTN_COUPON_CODE_SEND {
   background: #42c346;
   color: #fff
}

.GiftArea>div>.Btn.BTN_COUPON_CODE_REMOVE {
   background: red;
   color: #fff;
   display: none
}

.GiftArea>.Statu {
   width: 100%;
   font-size: 12px;
   font-weight: 400;
   margin-top: 5px;
   display: block
}

.GiftArea>.Statu.Ok {
   color: #42c346
}

.GiftArea>.Statu.Err {
   color: red
}

.GiftArea.Disabled>div>.Btn.COUPON_CODE_SEND {
   display: none
}
.GiftArea.Disabled>div>.Btn.BTN_COUPON_CODE_SEND {
   display: none
}

.GiftArea.Disabled>div>.Btn.COUPON_CODE_REMOVE {
   display: block
}
.GiftArea.Disabled>div>.Btn.BTN_COUPON_CODE_REMOVE {
   display: block
}

.GiftArea.Disabled>.Statu {
   color: #42c346
}

.GiftArea>div>input:disabled {
   border: 1px solid #4caf50;
   background: #4caf500d
}

[Page=Success] .Information {
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-items: stretch;
   margin-top: 40px;
   gap: 20px
}

[Page=Success] .Information>.Table {
   border: 1px solid #e3e3e3;
   border-radius: 4px;
   padding: 10px;
   width: 100%
}

[Page=Success] .Information>.Table>.TableTitle {
   border-bottom: 1px solid #ccc;
   font-weight: 600;
   font-size: 15px;
   text-transform: uppercase
}

[Page=Success] .Information>.Table>.TableTitle.mb50 {
   margin-bottom: 50px
}

[Page=Success] .Information>.Table>.Info {
   display: flex;
   flex-direction: column
}

[Page=Success] .Information>.Table>.Info>.Title {
   font-size: 14px;
   text-align: left;
   background: #f2f2f2;
   color: #4caf50;
   padding: 4px;
   border-radius: 4px;
   margin-top: 2px
}

[Page=Success] .Information>.Table>.Info>.Item {
   display: flex;
   justify-content: space-between;
   gap: 10px;
   border-bottom: 1px solid #ededed;
   padding: 4px 0
}

[Page=Success] .Information>.Table>.Info>.Item>span:nth-child(1) {
   font-size: 13px
}

[Page=Success] .Information>.Table>.Info>.Item>span:nth-child(2) {
   font-weight: 600;
   font-size: 14px
}

[Page=Success] .Information>.Table>.Info>.Item.Total {
   display: flex;
   justify-content: space-between;
   gap: 0;
   border-bottom: 0;
   padding: 8px 0 0;
   flex-direction: column;
   align-items: center
}

[Page=Success] .Information>.Table>.Info>.Item.Total>span:nth-child(1) {
   font-size: 15px
}

[Page=Success] .Information>.Table>.Info>.Item.Total>span:nth-child(2) {
   font-weight: 700;
   font-size: 22px;
   line-height: 20px
}

@media(max-width: 1540px) {

}

@media(max-width: 1280px) {
   .Container.Wsmall {
       width:96%;
       margin: 0 auto
   }

   .SearchBox {
       display: none
   }

   .ProductView .Gallery .SmallList {
       display: none
   }

   .ProductView .Gallery .Big {
       margin: 0 0 15px
   }
}

@media(max-width: 980px) {
   .Head .Nav .MenuList {
       display:none
   }

   .ProductList.Grid4 .ProductItem {
       width: 33.33%
   }
}

@media(max-width: 920px) {
   .Container.Wsmall {
       width:98%;
       margin: 0 auto
   }

   .Head .Search .SearchBox {
       display: none
   }

   body.ExtraPro {
       overflow: hidden
   }

   body.ExtraPro .BagView .Addition {
       display: none
   }

   .BagView .Addition {
       position: fixed;
       bottom: 0;
       left: 0;
       width: 100%;
       background: #fff;
       padding: 0 10px;
       border-top: 1px solid #0000001a;
       justify-content: center;
       display: flex;
       flex-direction: row;
       z-index: 5
   }

   .BagView .Addition.nonFixed {
       position: relative
   }

   .BagView .Addition .Title {
       display: none
   }

   .BagView .Addition .BagTotalMobile {
       display: flex;
       flex-direction: column;
       padding-left: 20px;
       width: 180px;
       align-items: flex-end
   }

   .BagView .Addition .BagTotalMobile span:nth-child(1) {
       width: 100%;
       font-weight: 500;
       text-align: right;
       font-size: 12px
   }

   .BagView .Addition .BagTotalMobile span:nth-child(2) {
       width: 100%;
       font-weight: 700;
       font-size: 16px;
       text-align: right
   }

   .BagView .List {
       width: 100%
   }

   .BagView .Addition.Active .Title {
       position: absolute;
       display: block;
       bottom: 100%;
       background: #fff;
       padding: 0;
       box-shadow: 0 -95px 221px 19px #00000075
   }

   .BagView .Addition.Active .Item.Total {
       display: none
   }

   .MobilAddition {
       position: fixed;
       bottom: -200px;
       background: #fff;
       padding: 10px;
       width: 100%;
       border-bottom: 1px solid #f1f1f1;
       transition: all .3s ease-in;
       left: 0
   }

   .MobilAddition.Active {
       bottom: 62px;
       z-index: 1;
       transition: all .3s ease-in
   }

   .MobilAddition .Title {
       width: 100%;
       background: #fff;
       border-radius: 4px;
       padding-bottom: 12px
   }

   .MobilAddition .Title .Text {
       width: 100%;
       font-weight: 600;
       text-align: center;
       padding: 10px 0
   }

   .MobilAddition .Title .Item {
       width: calc(100% - 20px);
       padding: 6px;
       background: #fff;
       margin: 3px 10px;
       border-radius: 3px;
       display: flex;
       justify-content: space-between
   }

   .MobilAddition .Title .Item span:nth-child(1) {
       width: 100%;
       color: #5c5c5c
   }

   .MobilAddition .Title .Item span:nth-child(2) {
       width: 100%;
       text-align: right;
       font-weight: 500;
       font-size: 16px
   }

   .MobilAddition .Item.Total {
       display: none
   }

   .MobilAddition .BagTotalMobile {
       display: none
   }

   .MobilAddition .BagResume {
       display: none
   }

   .MobilAdditionBg {
       position: fixed;
       background: #00000082;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       z-index: 0
   }

   .BagView .List .productItem .Product .Info .Item {
       display: flex;
       flex-direction: column
   }

   .BagView .List .productItem .Product .Info {
       display: flex;
       flex-direction: column
   }

   .BagView .List .productItem .Product .ExtraProduct {
       margin: 0;
       width: 100%
   }

   .BagView .List .productItem .Product .CardMessage {
       margin: 0;
       width: 100%
   }

   .BagView .List .productItem .Product .InfoArea {
       width: 100%;
       display: flex;
       flex-direction: column
   }

   .BagView .List .productItem .Product .Info .Item.Price {
       display: flex;
       flex-direction: row
   }

   .BagView .List .productItem .Product .Info .Item.Price .OldPrice {
       width: initial;
       margin-right: 10px;
       display: flex
   }

   .BagView .List .productItem .Product .Info .Item.Price .SalePrice {
       width: initial;
       margin-right: 10px;
       display: flex
   }

   .special-select {
   }

   .special-select li {
   }

   .special-select li:nth-child(+2n) {
       margin-right: 0
   }

   .ProductView .InfoBox .PayInformation .IconList .Item {
       width: 12.838%
   }

   .ProductView .InfoBox .MobilArea {
       display: flex;
       gap: 10px
   }

   .scroll-to-up {
       display: none
   }

   .q-scroll-to-top {
       bottom: 70px;
       transition: .5s
   }

   .wp-support-button {
       transition: .5s
   }

   body[fcode=Fr-5500119] .wp-support-button {
       bottom: 150px
   }

   .wp-support-button.nav-hide {
       right: -150px
   }

   .AllPagePhoneSale {
       display: block
   }

   .SearchPop>.Modal .CenterAra .Result>.ProductItem {
       width: 33%;
       padding: 5px
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem {
       width: 33%;
       padding: 5px
   }

   .PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area img {
       display: none
   }

   .PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area .Info {
       margin-left: 0
   }

   .ui-widget.ui-widget-content {
       position: fixed!important;
       left: 0!important;
       bottom: 0!important;
       justify-content: center;
       align-items: center;
       flex-direction: column;
       padding: 10px;
       width: 100%;
       top: inherit!important;
       padding-bottom: 130px;
       box-shadow: 0 -1200px 0 1200px #0000009e!important;
       z-index: 999999
   }

   .ui-widget.ui-widget-content::before {
       display: none!important
   }

   .ui-datepicker td span,.ui-datepicker td a {
       font-size: 16px;
       padding: 8px!important;
       border: 0!important
   }

   .ui-datepicker th {
       padding: 12px!important
   }
}

@media(max-width: 780px) {
   [Page=Success] .Container .LeftArea .Navigator {
       display:none
   }

   [Page=Success] .Container .LeftArea {
       padding: 30px;
       height: inherit!important
   }

   [Page=Success] .Container .LeftArea .Text {
       width: 100%
   }

   [Page=Success] .Container .RightArea {
       width: 100%;
       padding-right: 0
   }

   [Page=Success] .Container .LeftArea .BtnList {
       width: 100%!important;
       margin-top: 20px
   }

   .Desktop1.Mobil0 {
       display: none
   }

   .Desktop1.Mobil1 {
       display: block
   }

   .Desktop0.Mobil1 {
       display: block
   }

   .PopupDesign>.Modal.w60 {
       width: 100%
   }

   .BagView .List .GiftArea {
       display: block
   }

   .MobilBottomBar {
       width: 100%
   }

   .ProductList.Grid4 .ProductItem {
       width: 50%
   }

   .ProductList.Grid3 .ProductItem {
       width: 50%
   }

   .ProductList .ProductItem.item_001 .OtherInfo {
       display: none!important
   }

   .ProductList .ProductItem.item_001:hover .Info {
       box-shadow: none
   }

   .PopupDesign>.Modal.Active {
       width: 100%;
       bottom: 0;
       position: fixed;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .PopupDesign>.Modal>.Htm {
       margin: 0
   }

   .PopupDesign>.Modal>.Htm>.Document {
       border-radius: 0;
       position: absolute;
       bottom: -100%;
       left: 0;
       height: 0;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .PaymentPage .PopupDesign>.Modal>.Htm>.Document {
       position: inherit;
       bottom: inherit
   }

   .PopupDesign>.Modal.Active>.Htm>.Document {
       height: auto;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .PopupDesign>.Modal.Active>.Htm>.Document>.Title {
       z-index: 2;
       width: 100%;
       position: relative
   }

   .Container.Wsmall {
       width: 100%;
       z-index: 2;
       position: relative;
       height: inherit!important
   }

   .PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn {
       font-size: 14px
   }

   .ProductViewFeatures {
       padding: 20px
   }

   .ProductViewFeatures .Title {
       font-size: 16px
   }

   .ProductViewSuggets .Title {
       padding: 0 20px;
       font-size: 16px;
       margin-bottom: 5px
   }

   .ProductViewLast .Title {
       padding: 0 20px;
       font-size: 16px;
       margin-bottom: 5px
   }

   .Head .Search .But-Sepet:hover .Wind {
       display: none!important
   }

   .Head {
   }

   .Mod004 {
       display: none
   }

   .ProductView {
       display: flex;
       flex-direction: column
   }

   .ProductView .Gallery {
       width: 100%;
       padding: 0;
       display: flex;
       flex-direction: column
   }

   .ProductView .InfoBox {
       width: 100%;
       padding-bottom: 50px;
       padding-left: 0;
       padding: 16px
   }

   .ProductView .InfoBox .Info .Name {
       font-size: 16px;
       font-weight: 600
   }

   .ProductView .InfoBox .Info .Price {
       /* display: none; */
   }

   .ProductView .InfoBox .Desc {
   }

   .ProductView .InfoBox .BtnList {
   }

   .ProductView .InfoBox .BtnList.nonFixed {
       bottom: -100%
   }

   .ProductView .InfoBox .BtnList .BtnComplete {
   }

   .ProductView .InfoBox .BtnList .BtnComplete.Active::before {
       width: 30px;
       background-size: 30px
   }

   .ProductView .InfoBox .BtnList .BtnComplete.Active {
       padding-left: 30px
   }

   .ProductView .InfoBox .BtnList .BtnAdd {
       padding: 10px 5px;
       font-size: 14px;
       border-radius: 4px;
       width: 100%;
       background: 0 0;
       box-shadow: inset 0 0 0 1px #4caf50;
       color: #4caf50
   }

   .ProductView .InfoBox .BtnList .BtnAdd.Active {
       padding-left: 30px
   }

   .ProductView .InfoBox .BtnList .BtnAdd.Active::before {
       width: 30px;
       background-size: 30px
   }

   .ProductView .InfoBox .BtnList .BtnAdd.Active i {
       display: none
   }

   .ProductView .InfoBox .BtnList .BtnFavorite {
   }

   .ProductView .InfoBox .BtnList .Pricebox {
   }

   .ProductView .InfoBox .BtnList .Pricebox .Old {
       display: flex;
       color: #7a7a7a;
       text-decoration: line-through;
       font-size: 13px;
       align-items: baseline;
       justify-content: flex-end
   }

   .ProductView .InfoBox .BtnList .Pricebox .Old span {
       font-size: 10px;
       padding-left: 2px
   }

   .ProductView .InfoBox .BtnList .Pricebox .Sale {
       display: flex;
       font-size: 18px;
       font-weight: 700;
       color: #000;
       align-items: baseline;
       justify-content: flex-end
   }

   .ProductView .InfoBox .BtnList .Pricebox .Sale span {
       font-size: 12px;
       padding-left: 2px
   }

   .BagView .List .productItem .Product {
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center
   }

   .BagView .List .productItem .Product .Info {
       width: 70%
   }

   .BagView .List .productItem .Product .ProductArea {
       width: 100%;
       flex: none
   }

   .BagView .List .productItem[nonDELIVERED_PRODUCT="1"] .Product .Alert {
       display: block
   }

   .BagView .List .productItem .CommentArea {
       padding: 5px
   }

   [Page=ProductDetail] .MobilBottomBar {
       display: none!important
   }

   [Page=ProductDetail] .Layout_01_Center .LayoutHead {
   }

   .ProductView .Gallery .Big img {
       border-radius: 0
   }

   .Modul_189484 .PayList {
       display: none
   }

   .ProductViewSuggets .View .ProductItem {
       width: 50%
   }

   .ProductViewLast .View .ProductItem {
       width: 50%
   }

   .ProductView .Gallery .Head {
       display: flex;
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       padding: 10px;
       padding-top: 0;
       border: 0;
       background: 0 0
   }

   .ProductView .Gallery .Head::before {
       content: '';
       position: absolute;
       right: 0;
       left: 0;
       width: 100%;
       height: 116px;
       z-index: -1;
       background: linear-gradient(180deg,#00000094,#4a4a4a70,#f3f3f300);
       pointer-events: none
   }

   .ProductView .Gallery .Head .BtnFavorite {
       flex: none;
       margin-left: 5px;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       width: 40px;
       height: 40px;
       position: absolute;
       right: 47px;
       top: 10px
   }

   .ProductView .Gallery .Head .BtnFavorite::before {
       content: "\f004";
       display: inline-block;
       font: normal normal normal 14px/1 FontAwesome;
       text-rendering: auto;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       width: 24px;
       height: 24px;
       line-height: 24px;
       text-align: center;
       border-radius: 100%;
       font-size: 14px;
       background: #fff;
       color: #5656569c
   }

   .ProductView .Gallery .Head .BtnFavorite.Active::before {
       color: #e3279d
   }

   .ProductView .Gallery .Head .BtnBack {
       flex: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       width: 40px;
       height: 55px
   }

   .ProductView .Gallery .Head .BtnBack::before {
       content: "\f104";
       display: inline-block;
       font: normal normal normal 14px/1 FontAwesome;
       text-rendering: auto;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       font-size: 28px;
       color: #fff
   }

   .ProductView .Gallery .Head .BtnHome {
       flex: none;
       margin-left: 5px;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       width: 40px;
       height: 55px;
       flex: none
   }

   .ProductView .Gallery .Head .BtnHome::before {
       content: "\f015";
       display: inline-block;
       font: normal normal normal 14px/1 FontAwesome;
       text-rendering: auto;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       font-size: 28px;
       color: #fff
   }

   .ProductView .Gallery .Head .But-Sepet {
       flex: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 24px;
       height: 24px;
       line-height: 24px;
       border-radius: 100%;
       position: absolute;
       top: 18px;
       right: 18px;
       background: #fff
   }

   .ProductView .Gallery .Head svg {
       fill: #000;
       height: 14px
   }

   .ProductView .Gallery .Head .Info {
       float: left;
       display: flex;
       flex-direction: row;
       justify-content: center;
       align-items: center;
       align-content: center;
       display: none
   }

   .ProductView .Gallery .Head .Info span:nth-child(1) {
       font-weight: 400;
       font-size: 18px;
       line-height: 18px;
       width: 100%;
       display: block;
       text-align: left;
       color: #383838
   }

   .ProductView .Gallery .Head .Info span:nth-child(2) {
       float: left;
       font-size: 16px;
       line-height: 18px;
       width: 100%;
       display: flex;
       text-align: left;
       font-weight: 600;
       color: #000;
       margin-left: 10px
   }

   .ProductView .Gallery .Head .BagCount {
       position: absolute;
       left: 21px;
       top: 5px;
       background: #f10;
       color: #fff;
       font-size: 11px;
       width: 14px;
       height: 14px;
       text-align: center;
       z-index: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 12px;
       line-height: 14px;
       display: none
   }

   [Page=Bag] .MobilBottomBar {
       display: none!important
   }

   [Page=Address] .MobilBottomBar {
       display: none!important
   }

   [Page=Invoice] .MobilBottomBar {
       display: none!important
   }

   .BagView .List .productItem .Product .Other {
       width: 100%;
       margin-top: 10px
   }

   .BagView {
       padding: 16px
   }

   .BagView>.Title {
       display: none
   }

   .BagView .List .productItem {
       background: 0 0;
       margin-bottom: -1px;
       border-color: #0000001c;
       border-radius: 0
   }

   .BagView .List .productItem:nth-child(1) {
       border-color: transparent;
       padding: 16px 0
   }

   .GiftArea {
       width: 100%
   }

   .BagView .List .productItem .ExtraProductList {
       position: fixed;
       left: 0;
       top: 0
   }

   .BagView .List .productItem .ExtraProductList.Active {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: #fff;
       padding: 20px;
       padding-top: 71px;
       z-index: 20;
       overflow: auto
   }

   .BagView .List .productItem .ExtraProductList.Active .SubProduct {
       width: 48.5%;
       margin-right: 10px
   }

   .BagView .List .productItem .ExtraProductList .SubProduct:nth-child(+2n) {
       margin-right: 0
   }

   .BagView .List .productItem .ExtraProductList .Title {
       width: 100%;
       display: flex;
       flex-direction: column;
       margin-bottom: 20px;
       position: fixed;
       z-index: 1;
       background: #fff;
       box-shadow: 0 13px 18px 13px #fff;
       top: 50px;
       left: 0;
       padding: 20px;
       padding-bottom: 0
   }

   .BagView .List .productItem .ExtraProductList .Title span:nth-child(1) {
       width: 100%;
       font-weight: 500
   }

   .BagView .List .productItem .ExtraProductList .Title span:nth-child(2) {
       width: 100%;
       font-size: 11px
   }

   .BagView .List .productItem .ExtraProductList .Title .BtnClosed {
       position: absolute;
       right: 20px;
       top: 20px;
       background: #efefef;
       border: 1px solid #cccccc38;
       padding: 2px 6px;
       border-radius: 2px;
       font-size: 11px
   }

   .BagView .List .AddressItem .Form {
       display: flex;
       flex-direction: column
   }

   .BagView .List .AddressItem .Form .Left {
       width: 100%;
       padding: 0
   }

   .BagView .List .AddressItem .Form .Right {
       width: 100%;
       padding: 0
   }

   .BagView .List .AddressItem {
       margin-bottom: -1px;
       border-color: #0000001c;
       border-radius: 0;
       background: #fff
   }

   .BagView .List .AddressItem:nth-child(1) {
       margin-bottom: 20px
   }

   .BagView .List .Invoice {
       margin-bottom: -1px;
       border-color: #0000001c;
       border-radius: 0;
       background: #fff
   }

   .BagView .List .Invoice:nth-child(1) {
       border-color: transparent
   }

   .BagView .List .Invoice .Form .FormGroup {
       width: 100%
   }

   .BagView .List .Invoice .Form .FormInvoice {
       width: 100%
   }

   .Category .Info {
       margin-top: 10px
   }

   .Category .Info .Title>span {
       width: 100%;
       display: block
   }

   .Category .Info .SortArea {
       display: none
   }

   .Category .Info .SortArea.Active {
       display: block
   }

   .Category .Info .SortArea .Sort {
       display: block;
       height: 0;
       position: fixed;
       bottom: 0;
       z-index: 22;
       background: #fff;
       left: 0;
       box-shadow: 0 0 64px 27px #00000057;
       width: 100%;
       padding: 15px;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .Category .Info .SortArea.Active .Sort {
       height: 220px;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .Category .Info .SortArea.Active .Selected {
       display: none
   }

   .Category .Info .SortArea.Active .Wind {
       display: block;
       position: relative;
       width: 100%;
       box-shadow: none;
       border: 0
   }

   .Category .FilterArea {
       display: none
   }

   .Category .FilterArea.Active {
       display: block
   }

   .Category .Text {
       display: none
   }

   .Category .FilterAreaMobile {
       display: flex;
       flex-direction: row;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 0;
       border-bottom: 1px solid #ccc;
       padding-bottom: 15px
   }

   .Category .FilterAreaMobile .Btn {
       width: 48%;
       border: 1px solid #404040;
       padding: 6px;
       border-radius: 4px;
       display: flex;
       justify-content: center;
       align-items: center
   }

   .Category .FilterAreaMobile .Btn i {
       margin-right: 10px;
       font-size: 14px
   }

   .Category .FilterArea .FilterApply {
       display: block
   }

   .Category .FilterArea.Active .Filter {
       display: flex;
       position: fixed;
       left: 0;
       bottom: 0;
       width: 100%;
       background: #fff;
       z-index: 20;
       height: 70%;
       flex-direction: column;
       border: 0;
       padding: 10px 0;
       margin: 0
   }

   .Category .FilterArea.Active .FilterBox {
       position: initial;
       width: 100%
   }

   .Category .FilterArea.Active .FilterBox.Active {
       z-index: 3
   }

   .Category .FilterArea.Active .FilterBox .Selected {
       width: 45%;
       float: left;
       box-shadow: none;
       border: 0;
       padding: 12px 6px;
       font-size: 12px
   }

   .Category .FilterArea.Active .FilterBox.Active .Selected {
       width: 45%;
       float: left;
       background: #c62585;
       color: #fff
   }

   .Category .FilterArea.Active .FilterBox.Active .Selected span {
       color: #fff
   }

   .Category .FilterArea .FilterBox.Active .Selected::after {
       color: #fff
   }

   .Category .FilterArea.Active .FilterBox .Wind {
       width: 55%;
       position: absolute;
       right: 0;
       top: 0;
       left: inherit;
       box-shadow: none;
       max-height: inherit;
       overflow: auto;
       height: 100%;
       padding: 10px 10px 140px
   }

   .Category .FilterArea .FilterBox.Active .Wind .BtnClear {
       padding: 10px 0
   }

   .Category .FilterArea.Active .FilterBox .Wind span {
       width: 100%;
       padding: 2px 0
   }

   .Category .FilterArea .FilterOverFlow {
       background: 0 0;
       position: fixed;
       left: 0;
       top: 0;
       bottom: 0;
       width: 100%;
       height: 0;
       z-index: 0;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .Category .FilterArea.Active .FilterOverFlow {
       background: #00000082;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in;
       height: 100%
   }

   .ProductList .ProductItem.item_001 .Info .Slogan {
       font-size: 11px
   }

   .ProductList .ProductItem.item_001 .Info .Name {
       font-size: 12px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Discount {
       font-size: 10px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Sale {
       margin-left: 5px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Sale .B1 {
       font-size: 16px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Sale .B2 {
       font-size: 11px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old {
       display: flex;
       align-items: center;
       justify-content: center;
       align-content: flex-end;
       color: #bfbfbf;
       margin-left: 10px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old .B1 {
       font-size: 14px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(1) {
       font-size: 10px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(2) {
       font-size: 10px
   }

   .SearchPop>.Modal .CenterAra .Result>.ProductItem {
       width: 50%;
       padding: 5px
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem {
       width: 100%;
       display: flex;
       align-items: center;
       margin-bottom: 5px;
       border-bottom: 1px solid #eee;
       justify-content: flex-start;
       text-align: left
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Gallery {
       width: 55px;
       margin-right: 10px;
       flex: none
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Info {
       width: 100%;
       display: flex;
       align-content: flex-start;
       align-items: flex-start
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Info .Name {
       line-height: 20px;
       width: 100%;
       min-height: inherit;
       font-size: 14px;
       display: flex;
       justify-content: flex-start
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Info .Price {
       display: flex;
       justify-content: flex-start
   }

   .DayView {
       position: fixed;
       z-index: 1;
       top: -100px;
       background: #0000008f;
       width: 100%;
       border-radius: 4px;
       color: #fff;
       padding: 10px;
       font-size: 14px;
       text-align: center;
       padding-top: 65px;
       transition: all .3s ease-in
   }

   .DayView.Show {
       top: 0;
       bottom: inherit;
       left: inherit;
       width: 100%;
       transition: all .3s ease-in
   }

   .DayView .Text {
       width: 100%
   }

   .DayView .Closed {
       width: 10px
   }
}

.FilterItemLabel span {
   font-size: 14px;
   line-height: 26px
}

.FilterItemLabel {
   position: relative;
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start
}

.FilterItemLabel:before {
}

@media only screen and (min-width: 768px) {
   .FilterItemLabel:hover {
       opacity:.5
   }
}

.FilterItem {
   position: absolute;
   visibility: hidden
}

.FilterItem:disabled+.FilterItemLabel {
   color: #ddd;
   text-decoration: line-through
}

input[type=checkbox].FilterItem:checked+.FilterItemLabel {
   color: #000
}

input[type=checkbox].FilterItem:checked+.FilterItemLabel::after {
   content: "";
   position: absolute;
   left: -20px;
   width: 11px;
   height: 11px;
   background: #000;
   top: 50%;
   transform: translateY(-50%)
}

input[type=checkbox].FilterItem:checked+.FilterItemLabel::after {
   content: "";
   position: absolute;
   left: 3px;
   width: 11px;
   height: 11px;
   background: #000;
   top: 50%;
   transform: translateY(-50%)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .CouponItem .Info>.Btn {
   line-height: 23px;
   width: fit-content;
   padding: 1px 10px;
   font-size: 14px;
   margin-top: 13px;
   border: 1px solid #4caf50;
   color: #4caf50;
   background: 0 0;
   border-radius: 3px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design {
   width: 100%;
   margin: 12px 0;
   display: block
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem {
   width: 100%;
   margin-bottom: 14px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Title {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   color: #000;
   margin: 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Title i {
   width: 20px;
   font-size: 20px;
   margin-right: 5px;
   text-align: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Title span {
   width: 100%;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Info {
   width: 100%;
   padding: 0;
   border: 0;
   font-size: 12px;
   color: #5f6b70;
   margin-top: 4px;
   margin-bottom: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 4px;
   position: relative;
   background: #fdfeff
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input input {
   width: 100%;
   border: 1px solid #e8edef;
   border-radius: 4px;
   padding: 10px;
   outline: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input.Error input {
   border: 1px solid #ff11003d
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input .ErrorText {
   display: none;
   width: initial;
   color: red;
   font-size: 12px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input.Error .ErrorText {
   display: flex;
   justify-content: flex-start
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Design .InputItem .Input span {
   width: initial;
   font-size: 12px;
   text-align: right;
   color: #585858;
   padding: 2px 0 0;
   justify-content: flex-end
}

.PopupDesign>.Modal>.Htm>.Document>.Center .popTitle {
   line-height: 14px;
   font-size: 18px;
   font-weight: 500
}

.PopupDesign>.Modal>.Htm>.Document>.Center .DeleteItem {
   width: 100%;
   display: flex;
   flex-direction: column;
   margin-top: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .DeleteItem span:nth-child(1) {
   width: 100%;
   font-weight: 600;
   color: red;
   line-height: 16px;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .DeleteItem span:nth-child(2) {
   width: 100%;
   line-height: 18px;
   font-size: 16px;
   font-weight: 600
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom {
   padding: 18px 40px;
   width: 100%;
   display: flex;
   justify-content: flex-end;
   align-items: center;
   align-content: center
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Cancel {
   line-height: 20px;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Cancel:hover {
   color: #000;
   text-decoration: underline
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume {
   cursor: pointer;
   line-height: 20px;
   background: #4bae4f;
   color: #fff;
   border-radius: 2px;
   padding: 4px 10px;
   margin-left: 15px;
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume.Full {
   width: 100%;
   margin: 0;
   padding: 12px;
   font-size: 19px
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume:hover {
   background: #34a93a
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume.Active {
   padding: 4px 10px 4px 32px;
   background: #34a93a;
   pointer-events: none
}

.PopupDesign>.Modal>.Htm>.Document>.Bottom .Btn.Resume.Active::before {
   content: "";
   background: #18641c url(/Library/Img/Loading.svg?);
   width: 29px;
   height: 100%;
   border-radius: 5px 0 0 5px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 11;
   background-position: 50%;
   background-size: cover
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Logo {
   margin-bottom: 15px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle {
   width: 100%;
   margin-bottom: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle h4 {
   width: 100%;
   line-height: 14px;
   margin-bottom: 5px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle .Text {
   width: 100%;
   font-size: 14px;
   line-height: 18px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .LoginTitle img {
   margin: 10px 0
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup {
   width: 100%;
   margin-bottom: 8px;
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup svg {
   position: absolute;
   height: 20px;
   top: 12px;
   left: 10px;
   fill: #4caf50
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow {
   margin: 0;
   cursor: pointer;
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage.Active .MessageArrow {
   display: block
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow.fa-chevron-left {
   position: absolute;
   left: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow.fa-chevron-right {
   position: absolute;
   right: -22px;
   top: 50%;
   margin-top: -11px;
   font-size: 28px;
   color: #323232
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup.CardMessage .MessageArrow.Disabled {
   color: #ababab
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup select {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   background: #fff;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup textarea {
   width: 100%;
   border: 1px solid #ddd;
   padding: 8px 10px;
   border-radius: 4px;
   outline: none;
   min-height: 120px;
   resize: none;
   background: #fff;
   font-size: 16px;
   font-family: inherit;
   line-height: 22px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup input {
   width: 100%;
   border: 1px solid #ddd;
   padding: 12px 10px;
   border-radius: 4px;
   outline: none;
   font-size: 16px;
   background: #fff
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .Btn {
   border: 0;
   background: #4caf50;
   color: #fff;
   padding: 10px 20px;
   border-radius: 4px;
   margin: 10px 0;
   cursor: pointer;
   font-size: 16px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .Btn:hover {
   background: #3c9f40
}

.PopupDesign>.Modal>.Htm>.Document>.Center .OtherText {
   width: 100%;
   font-weight: 400
}

.PopupDesign>.Modal>.Htm>.Document>.Center .OtherText span {
   font-weight: 700;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Contract {
   width: 100%;
   text-align: left;
   line-height: 18px;
   font-size: 13px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Contract span {
   font-weight: 600;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea {
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area {
   display: flex
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area img {
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area .Info {
   width: 100%;
   margin-left: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .ClosedIcon {
   position: absolute;
   right: 7px;
   top: 5px;
   display: none;
   font-size: 22px;
   color: #4caf50;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea.Active .ClosedIcon {
   display: block
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea.Active input {
   border-color: #3c9f40;
   color: #3c9f40;
   pointer-events: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group {
   width: 100%;
   position: relative;
   left: 0;
   right: 0;
   z-index: 2;
   max-height: 180px;
   overflow: auto;
   padding: 10px;
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group .list-group-item {
   width: 100%;
   padding: 4px 20px;
   cursor: pointer;
   box-shadow: inset 0 0 0 1px #e2e7e947;
   margin-bottom: 1px;
   border-radius: 2px;
   list-style: none;
   position: relative
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group .list-group-item:hover {
   width: 100%;
   background: #e8f5e9;
   box-shadow: inset 0 0 0 1px #4bae4f6b
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group .list-group-item::before {
   content: "\f041";
   margin-right: 5px;
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 14px;
   position: absolute;
   left: 6px;
   top: 8px;
   color: #4bae4f
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea.Loading .FormGroup::before {
   content: "";
   background: #bfbfbf url(/Library/Img/Loading.svg?);
   width: 26px;
   height: 26px;
   background-size: 26px;
   border-radius: 16px;
   position: absolute;
   right: 4px;
   top: 4px;
   z-index: 11
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group::-webkit-scrollbar-thumb {
   background-color: rgb(180 185 191);
   border-radius: 25px;
   overflow: hidden
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .list-group::-webkit-scrollbar-track {
   background: rgb(221 221 221);
   border-radius: 12px;
   overflow: hidden
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point {
   width: 100%;
   margin-bottom: 20px;
   display: flex;
   justify-content: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star {
   color: #919191;
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 82px;
   padding: 10px;
   border-radius: 2px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star i {
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star span {
   font-size: 14px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star.Selected {
   color: #ff9800
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star.Active {
   color: #ff9800
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star.Active i::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 24px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Point .Star i::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 24px;
   font-family: "font awesome 5 free";
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   line-height: 1
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   align-content: center;
   flex-direction: column
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage .Title {
   width: 100%;
   font-weight: 500;
   color: red;
   text-align: center;
   margin-bottom: 3px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage .Text {
   width: 100%;
   text-align: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .BankMessage .Btn {
   margin: 0;
   margin-top: 18px;
   text-align: center;
   font-size: 18px;
   padding: 12px 20px;
   background: #ff9800;
   color: #fff;
   border: 0;
   border-radius: 6px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar {
   display: flex;
   width: 100%;
   overflow: hidden;
   border-radius: 60px;
   padding: 1px;
   margin-top: 12px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item {
   display: flex;
   flex-direction: column;
   position: relative;
   padding: 2px;
   -webkit-transform: skewX(-40deg);
   transform: skewX(-40deg);
   background: #cccfd7;
   border-radius: 3px;
   margin-right: 10px;
   width: 100%;
   text-align: center;
   overflow: hidden;
   cursor: pointer
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item:hover {
   background: #b1b5c5
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item:first-child {
   margin-left: -10px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item:last-child {
   margin-right: -9px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .StatusBar .Item span {
   padding: 5px;
   font-size: 13px;
   -webkit-transform: skewX(40deg);
   transform: skewX(40deg)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .Btn {
   padding: 12px 30px;
   width: 100%;
   text-align: center;
   font-size: 18px;
   background: #4caf50;
   color: #fff;
   border-radius: 4px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements {
   margin-bottom: 5px;
   display: flex;
   align-items: center
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked),.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked {
   left: 0;
   top: 0;
   opacity: 0;
   visibility: hidden;
   z-index: -9999;
   width: inherit;
   display: none
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label,.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label {
   position: relative;
   padding-left: 30px;
   cursor: pointer;
   font-weight: 500;
   color: #000;
   min-height: 20px;
   min-width: 20px;
   margin: 0;
   line-height: 20px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:before,.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label:before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 20px;
   height: 20px;
   border: 1px solid #ccc;
   background: #fff;
   border-radius: 3px
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:after,.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label:after {
   content: "";
   position: absolute;
   left: 5px;
   font-size: 12px;
   line-height: .8;
   transition: all .2s;
   top: 5px;
   font-weight: 700;
   width: 12px;
   height: 12px;
   background: #4caf50
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:after {
   opacity: 0;
   transform: scale(0)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup .checkboxElements input.checkbox-input:checked+label.checkbox-label:after {
   opacity: 1;
   transform: scale(1)
}

.PopupDesign>.Modal>.Htm>.Document>.Center .FormGroup input.Error {
   border: 1px solid #ff00002b;
   background: #ff000003
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Title {
   float: left;
   width: 100%;
   color: #000;
   margin-bottom: 10px;
   font-size: 19px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product {
   display: flex;
   flex-direction: row;
   width: 100%
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Photo {
   width: 65px;
   flex: none;
   padding: 5px;
   border: 1px solid #e7e7e7;
   border-radius: 4px;
   margin-right: 10px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Photo img {
   width: 100%
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Name {
   width: 100%;
   font-weight: 500;
   display: flex;
   flex-direction: column
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Name>span:nth-child(1) {
   width: 100%;
   font-weight: 700
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .Product .Name>span:nth-child(2) {
   width: 100%;
   font-size: 18px;
   line-height: 19px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList {
   float: left;
   width: 100%;
   overflow: auto;
   display: flex;
   margin-top: 10px;
   border-top: 1px solid #e9e9e9;
   padding-top: 10px;
   align-items: center;
   justify-content: center;
   align-content: center;
   flex-direction: row;
   gap: 10px
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn {
   margin: 0 10px;
   padding: 8px 10px;
   font-size: 17px;
   font-weight: 500;
   margin: 0
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn.cancel-btn {
   color: #444;
   background: 0 0;
   padding: 0;
   cursor: pointer
}
.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn.cancel-btn {
   border: 1px solid #4caf50;
   background: #4caf50 !important;!i;!;
   color: #fff;
   border-radius: 4px;
   text-align: center;
   padding: 8px 10px;
   line-height: 36px;
}
.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn.Complete {
   border: 1px solid #4caf50;
   color: #277a2a;
   border-radius: 4px;
   text-align: center;
   background: 0 0
}

.PopupDesign>.Modal.BagComplete>.Htm>.Document>.Bottom {
   display: none
}

.StaticNavi {
   position: fixed;
   top: 130px;
   left: 12px;
   width: calc(100% - 24px);
   height: 0;
   overflow: hidden;
   padding: 0 30px;
   background: #fff;
   flex-direction: column;
   border: 1px solid transparent;
   border-top: 1px solid transparent;
   border-radius: 8px;
   -webkit-transition: all .3s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .3s ease-in;
   opacity: 0;
   z-index: -1
}

.StaticNavBg {
   position: fixed;
   top: -100%;
   left: 0;
   background: #00000000;
   width: 100%;
   height: 100%;
   -webkit-transition: all .2s ease-in;
   -moz-transition: all .3s ease-in;
   -khtml-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   transition: all .2s ease-in
}

.ProductView .Gallery .Head {
   display: none
}

.product-image-zoom {
   position: fixed;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   overflow: hidden;
   z-index: 99999
}

.product-image-zoom .close-zoom {
   position: fixed;
   right: 15px;
   top: 60px;
   z-index: 5;
   font-size: 24px;
   color: #4c4c4c;
   padding: 10px;
   cursor: pointer
}

.product-image-zoom>.image-thumbs {
   position: absolute;
   bottom: 0;
   height: 100%;
   overflow-y: hidden;
   overflow-x: auto;
   white-space: nowrap;
   z-index: 5;
   width: 100%;
   padding: 10px 20px;
   height: 111px;
   background-color: #fbfbfb;
   text-align: center
}

.product-image-zoom>.image-thumbs::-webkit-scrollbar {
   width: 0;
   height: 0
}

.product-image-zoom>.image-thumbs>.item {
   width: 60px;
   margin: 0 6px;
   opacity: .5;
   display: inline-block
}

.product-image-zoom>.image-thumbs>.item.Selected {
   opacity: 1
}

.product-image-zoom>.big-image-container {
   position: fixed;
   right: 0;
   top: 0;
   bottom: 0;
   left: 0;
   width: 100%;
   height: calc(100% - 111px);
   overflow-y: auto;
   background-color: #fbfbfb
}

.product-image-zoom>.big-image-container::-webkit-scrollbar {
   width: 0;
   height: 0
}

.product-image-zoom>.big-image-container>img {
   margin: 0 auto;
   height: 100%;
   cursor: url(/Library/Img/cursor-zooom.png),auto
}

.product-image-zoom>.big-image-container>img.zoomImg {
   height: auto;
   cursor: url(/Library/Img/cursor-zoom-out.png),auto
}

.product-image-zoom .zoom-loading {
   position: fixed;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   width: 100%;
   height: 100%;
   background-color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 5
}

.product-image-zoom .zoom-loading>.loading-icon {
   border-radius: 50%;
   width: 24px;
   height: 24px;
   border: 2px solid rgb(197 197 197/62%);
   border-top-color: #a7a7a7;
   -webkit-animation: zoomSpin 1s infinite linear;
   animation: zoomSpin 1s infinite linear
}

@-webkit-keyframes zoomSpin {
   0% {
       -webkit-transform: rotate(0deg);
       transform: rotate(0deg)
   }

   100% {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

@keyframes zoomSpin {
   0% {
       -webkit-transform: rotate(0deg);
       transform: rotate(0deg)
   }

   100% {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

.Head .MobilNav img {
   height: 48px
}

.Container.Wsmall {
   width: 96%;
   margin: 0 auto
}

.scroll-to-up-none {
   visibility: hidden;
   opacity: 0;
   transition: visibility 0s 2s,opacity 2s linear;
   display: none
}

.scroll-to-up {
   backface-visibility: hidden;
   background-color: #fff;
   border: 1px solid #dcdcdc;
   border-bottom-width: 2px;
   bottom: 75px;
   cursor: pointer;
   height: 40px;
   line-height: 42px;
   margin: 5px;
   position: fixed;
   right: 5px;
   width: 110px;
   will-change: scroll-position;
   z-index: 1000;
   -webkit-transition: opacity 500ms ease-in-out;
   -moz-transition: opacity 500ms ease-in-out;
   -ms-transition: opacity 500ms ease-in-out;
   -o-transition: opacity 500ms ease-in-out;
   opacity: 1;
   box-shadow: 0 1px 4px 0 rgba(0,0,0,.05);
   border-radius: 20px
}

.scroll-to-up:hover {
   border-color: #4caf50
}

.scroll-to-up:hover span {
   -moz-transition-property: all;
   -o-transition-property: all;
   -webkit-transition-duration: .4s;
   -webkit-transition-property: all;
   -webkit-transition-timing-function: linear;
   color: #4caf50;
   transition-duration: .4s;
   transition-property: all;
   transition-timing-function: linear
}

.scroll-to-up:hover i {
   -moz-transition-property: all;
   -o-transition-property: all;
   -webkit-transition-duration: .4s;
   -webkit-transition-property: all;
   -webkit-transition-timing-function: linear;
   background-position: 0 -18px;
   transition-duration: .4s;
   transition-property: all;
   transition-timing-function: linear
}

.scroll-to-up i {
   display: block;
   float: left;
   height: 12px;
   margin: 14px 0 0 15px;
   opacity: .8;
   overflow: hidden;
   width: 12px
}

.scroll-to-up span {
   color: #666;
   float: left;
   font-size: 14px;
   font-weight: 600;
   margin-left: 7px;
   text-align: center
}

.scroll-to-up i::before {
   content: "\f062";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 13px;
   color: #adadad
}

.scroll-to-up:hover i::before {
   color: #4caf50
}

.q-scroll-to-top {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 46px;
   width: 46px;
   border-radius: 50%;
   background: rgb(255 255 255/70%);
   font-size: 1.5rem;
   position: fixed;
   bottom: -100px;
   right: 70px;
   text-align: center;
   z-index: 1;
   transition: .5s;
   box-shadow: 0 0 0 1px #000000ba
}

.q-scroll-to-top.hide {
   bottom: -100px
}

.q-scroll-to-top .q-icon::before {
   content: "\f062";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 16px;
   color: #000
}

.wp-support-button {
   position: fixed;
   bottom: 130px;
   right: 15px;
   z-index: 999
}

body[userpage=ProductView] .wp-support-button {
   bottom: 70px
}

.wp-support-button>img {
   width: 55px
}

body[fcode=Fr-5500154] .wp-support-button {
   bottom: 154px
}

.AllPagePhoneSale {
   position: fixed;
   right: 15px;
   bottom: 70px;
   z-index: 15;
   border-radius: 50%;
   width: 46px;
   height: 46px;
   line-height: 50px;
   text-align: center;
   font-size: 22px;
   color: #fff;
   background-image: url(/Library/Img/900032105_b27Iym3XXs0V.png);
   background-size: cover;
   transition: .3s;
   display: none
}

.AllPagePhoneSale.nav-hide {
   right: -100px
}

.AllPagePhoneSaleModal {
   position: fixed;
   z-index: 9992;
   bottom: 0;
   left: 0;
   right: 0;
   padding: 10px;
   transition: .3s;
   transform: translateY(200%);
   opacity: 0
}

.AllPagePhoneSaleModal.Show {
   transform: translateY(0);
   opacity: 1
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop {
   background-color: #fff;
   border-radius: 10px;
   text-align: center
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>.product-code {
   padding: 0 10px;
   display: inline-block;
   border-bottom: 1px solid #777;
   padding-bottom: 4px;
   margin-bottom: 10px
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>p {
   display: block;
   padding: 0 15px;
   font-size: 13px;
   line-height: 17px;
   color: #505050;
   margin-bottom: 15px
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>.modalList>.item .item-link {
   width: 100%;
   display: block;
   padding: 16px 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   color: #000
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.ModalTop>.modalList>.item .item-link>.Icon {
   font-size: 21px;
   margin-right: 8px
}

.AllPagePhoneSaleModal>.phoneSaleModalContainer>.phoneSaleClose {
   background-color: #fff;
   border-radius: 10px;
   padding: 15px;
   text-align: center;
   margin-top: 10px
}

.SearchPop {
   position: fixed;
   z-index: 9992;
   bottom: 0;
   left: 0;
   right: 0;
   top: 0;
   padding: 20px;
   transition: all .3s;
   transform: translateY(200%);
   background: #fff;
   opacity: 0
}

.SearchPop.Show {
   transform: translateY(0);
   opacity: 1;
   transition: all .3s
}

.SearchPop>.Modal .TopArea {
   display: flex;
   justify-content: space-between;
   margin-bottom: 30px
}

.SearchPop>.Modal .TopArea .Closed {
   display: flex;
   align-items: center;
   font-size: 16px
}

.SearchPop>.Modal .TopArea .Closed i {
   font-size: 22px;
   margin-right: 10px
}

.SearchPop>.Modal .TopArea .Home {
   width: 30px
}

.SearchPop>.Modal .CenterAra {
   width: 100%;
   overflow: auto;
   padding-right: 10px
}

.SearchPop>.Modal .CenterAra>.Title {
   width: 100%;
   font-size: 18px;
   font-weight: 500;
   margin-bottom: 20px
}

.SearchPop>.Modal .CenterAra .Input {
   width: 100%;
   position: relative;
   margin-bottom: 30px
}

.SearchPop>.Modal .CenterAra .Input svg {
   position: absolute;
   left: 0;
   top: 8px;
   width: 24px
}

.SearchPop>.Modal .CenterAra .Input input {
   width: 100%;
   border: 0;
   border-bottom: 3px solid #000;
   font-size: 16px;
   font-weight: 700;
   padding: 10px;
   text-indent: 30px;
   -webkit-appearance: none;
   border-radius: 0
}

.SearchPop>.Modal .CenterAra .Suggets {
   width: 100%;
   margin-bottom: 20px
}

.SearchPop>.Modal .CenterAra .Suggets .Title {
   width: 100%;
   font-size: 14px;
   font-weight: 500;
   margin-bottom: 15px
}

.SearchPop>.Modal .CenterAra .Suggets .List {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
   gap: 5px
}

.SearchPop>.Modal .CenterAra .Suggets .List>a {
   border: 1px solid #000;
   border-radius: 14px;
   padding: 4px 10px;
   font-size: 13px
}

.SearchPop>.Modal .CenterAra .LastView {
   width: 100%
}

.SearchPop>.Modal .CenterAra .LastView .Title {
   width: 100%;
   font-size: 14px;
   font-weight: 500
}

.SearchPop>.Modal .CenterAra .LastView .View {
   width: 100%
}

.SearchPop>.Modal .CenterAra .Result {
   width: 100%
}

.SearchPop>.Modal .CenterAra::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

.SearchPop>.Modal .CenterAra::-webkit-scrollbar-thumb {
   background-color: rgb(183 223 184)
}

.SearchPop>.Modal .CenterAra::-webkit-scrollbar-track {
   background: rgb(183 223 184/35%)
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem {
   width: 24%;
   padding: 5px
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem .OtherInfo {
   left: 5px;
   right: 5px
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem .Slogan {
   display: none
}

.SearchPop>.Modal .CenterAra .Result>.ProductItem .BtnFavorite {
   display: none
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem {
   width: 24%;
   padding: 5px
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .OtherInfo {
   left: 5px;
   right: 5px
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Slogan {
   display: none
}

.SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .BtnFavorite {
   display: none
}

.AccountPagePopup {
   position: fixed;
   z-index: 9992;
   bottom: 0;
   left: 0;
   right: 0;
   top: 0;
   padding: 20px;
   transition: .3s;
   transform: translateY(200%);
   background: #fff;
   opacity: 0
}

.AccountPagePopup.Show {
   transform: translateY(0);
   opacity: 1;
   display: block!important
}

.AccountPagePopup>.Modal .TopArea {
   display: flex;
   justify-content: space-between;
   margin-bottom: 30px
}

.AccountPagePopup>.Modal .TopArea .Closed {
   display: flex;
   align-items: center;
   font-size: 16px
}

.AccountPagePopup>.Modal .TopArea .Closed i {
   font-size: 22px;
   margin-right: 10px
}

.AccountPagePopup>.Modal .TopArea .Home {
   width: 30px
}

.AccountPagePopup>.Modal .CenterAra {
   width: 100%;
   overflow: auto;
   padding-right: 10px
}

.AccountPagePopup>.Modal .CenterAra .User {
   width: 100%;
   position: relative;
   margin-bottom: 30px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   margin-top: 30px
}

.AccountPagePopup>.Modal .CenterAra .User span:nth-child(2) {
   width: 100%;
   position: relative;
   text-align: center;
   margin-top: 10px;
   margin-bottom: 5px
}

.AccountPagePopup>.Modal .CenterAra .User span:nth-child(3) {
   position: relative;
   margin-bottom: 30px;
   text-align: center;
   background: #cccccc61;
   border-radius: 22px;
   padding: 4px 20px;
   font-size: 13px
}

.AccountPagePopup>.Modal .CenterAra .User svg {
   height: 82px;
   border: 2px solid #000;
   padding: 10px;
   border-radius: 100px;
   width: initial
}

.AccountPagePopup>.Modal .CenterAra .AccountArea {
   width: 100%;
   border: 0;
   font-size: 16px;
   font-weight: 700;
   padding: 10px;
   text-indent: 30px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center
}

.AccountPagePopup>.Modal .CenterAra .AccountArea a {
   width: 100%;
   margin-bottom: 3px;
   padding: 10px 0
}

.AccountPagePopup>.Modal .CenterAra .AccountArea a i {
   margin-right: 10px
}

.MK .Top {
   width: 100%;
   display: flex;
   justify-content: space-between;
   background: #efefef;
   padding: 6px 0
}

.MK .Top .Left {
   width: 100%
}

.MK .Top .Right {
   width: 100%
}

.MK .Top .Right .Item {
   width: 100%
}

.MK .Head {
   width: 100%;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   padding: 20px 0
}

.MK .Head .Container {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   padding: 20px 0;
   gap: 20px
}

.MK .Head .Logo {
   width: 100%
}

.MK .Head .Search {
   width: 100%
}

.MK .Head .Search .Input {
   width: 100%
}

.MK .Head .Search .Input input {
   width: 100%;
   padding: 8px;
   border: 2px solid #ccc;
   border-radius: 4px
}

.MK .Head .User {
   width: 100%;
   display: flex;
   gap: 10px;
   justify-content: flex-end;
   align-items: center
}

.MK .Head .User .BtnLogin {
   border-radius: 25px;
   background: #c8e6fd;
   color: #1965a2;
   padding: 10px 20px;
   font-weight: 600;
   font-size: 14px;
   cursor: pointer;
   text-align: center
}

.MK .Head .User .Bag {
   display: flex;
   gap: 5px;
   flex-direction: row;
   align-items: stretch;
   border: 1px solid #e1e1e1;
   border-radius: 6px;
   padding: 0 10px;
   align-content: center
}

.MK .Head .User .Bag svg {
   width: 24px;
   flex: none
}

.MK .Head .User .Bag .Info {
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   width: max-content;
   margin-left: 20px
}

.MK .Head .User .Bag .Info span:nth-child(1) {
   font-weight: 600;
   font-size: 13px;
   text-align: right
}

.MK .Head .User .Bag .Info span:nth-child(2) {
   font-weight: 600;
   font-size: 13px;
   text-align: right;
   color: #e91e63
}

.MK .Nav {
   width: 100%
}

.MK .Nav .Categories {
   width: 100%
}

.MK .Nav .BtnList {
   width: 100%
}

.MK .Nav .BtnList .Item {
   width: 100%
}

.GiftArea {
   background: #fff;
   padding: 10px;
   border: 1px solid #e9eeef;
   border-radius: 4px;
   margin-top: 10px;
   width: 100%;
   display: none;
   position: relative
}

.GiftArea>span {
   width: 100%;
   font-size: 13px;
   font-weight: 600;
   margin-bottom: 5px;
   display: block
}

.GiftArea>.BtnText {
   width: 100%;
   font-size: 13px;
   font-weight: 600;
   margin-bottom: 5px;
   display: block;
   cursor: pointer;
   color: #2196f3;
   text-decoration: underline;
   display: flex;
   justify-content: space-between
}

.GiftArea>.BtnText:hover {
   color: #124e7d;
   text-decoration: none
}

.GiftArea>div {
   display: flex;
   gap: 10px;
   align-items: center
}

.GiftArea>div>input {
   border: 1px solid #ccc;
   padding: 9px;
   border-radius: 2px;
   width: 100%
}

.GiftArea>div>.Btn {
   padding: 8px 14px;
   border-radius: 3px;
   font-size: 14px;
   flex: none;
   cursor: pointer
}

.GiftArea>div>.Btn.COUPON_CODE_SEND {
   background: #42c346;
   color: #fff
}

.GiftArea>div>.Btn.COUPON_CODE_REMOVE {
   background: red;
   color: #fff;
   display: none
}

.GiftArea>div>.Btn.BTN_COUPON_CODE_SEND {
   background: #42c346;
   color: #fff
}

.GiftArea>div>.Btn.BTN_COUPON_CODE_REMOVE {
   background: red;
   color: #fff;
   display: none
}

.GiftArea>.Statu {
   width: 100%;
   font-size: 12px;
   font-weight: 400;
   margin-top: 5px;
   display: block
}

.GiftArea>.Statu.Ok {
   color: #42c346
}

.GiftArea>.Statu.Err {
   color: red
}

.GiftArea.Disabled>div>.Btn.COUPON_CODE_SEND {
   display: none
}

.GiftArea.Disabled>div>.Btn.COUPON_CODE_REMOVE {
   display: block
}

.GiftArea.Disabled>div>.Btn.BTN_COUPON_CODE_SEND {
   display: none
}

.GiftArea.Disabled>div>.Btn.BTN_COUPON_CODE_REMOVE {
   display: block
}

.GiftArea.Disabled>.Statu {
   color: #42c346
}

.GiftArea>div>input:disabled {
   border: 1px solid #4caf50;
   background: #4caf500d
}

.OrderItem {
   width: 100%;
   display: flex;
   flex-direction: column;
   border: 1px solid #ccc;
   border-radius: 8px;
   padding: 20px;
   margin-bottom: 20px;
   box-shadow: 0 1px 2px 0 rgb(72 72 72/8%);
   border: 1px solid #eee;
   cursor: pointer;
   background: #fff;
}

.OrderItem .OrderInfo {
   width: 100%;
   display: flex
}

.OrderItem .OrderInfo .Products {
   display: flex;
   flex: 1;
   max-width: 100px
}

.OrderItem .OrderInfo .Products>div:first-child {
   width: 42px;
   margin-left: 0;
   box-shadow: none
}

.OrderItem .OrderInfo .Products>div {
   width: 40px;
   height: 40px;
   margin-left: -20px;
   box-shadow: -2px 0 0 0 rgb(0 0 0/8%);
   border-radius: 100%;
   background-position: 50%;
   background-size: contain;
   border: 1px solid #ccc
}

.OrderItem .OrderInfo .Products>div>img {
   width: 42px;
   height: 42px;
   border-radius: 100%
}

.OrderItem .OrderInfo .Record {
   display: flex;
   flex-direction: column;
   gap: 4px;
   flex: 1;
   margin: 0 15px
}

.OrderItem .OrderInfo .Record .Number {
   width: 100%;
   display: flex;
   align-items: center;
   flex-direction: row;
   justify-content: flex-start;
   gap: 10px
}

.OrderItem .OrderInfo .Record .Number span:nth-child(1) {
   font-size: 13px;
   color: #444
}

.OrderItem .OrderInfo .Record .Number span:nth-child(2) {
   font-weight: 600;
   font-size: 16px
}

.OrderItem .OrderInfo .Record .Date {
   width: 100%;
   font-size: 13px;
   color: #444
}

.OrderItem .OrderInfo .Status {
   width: 100%;
   flex: 1;
   gap: 4px;
   display: flex;
   flex-direction: column
}

.OrderItem .OrderInfo .Status .Statu {
   width: 100%
}

.OrderItem .OrderInfo .Status .Statu>i {
   width: 100%
}

.OrderItem .OrderInfo .Status .Statu>span {
   width: 100%
}

.OrderItem .OrderInfo .Status .Desc {
   width: 100%;
   font-size: 12px;
   color: #444
}

.OrderItem .OrderInfo .Price {
   flex: 1;
   text-align: right;
   display: flex;
   gap: 4px;
   flex-direction: column
}

.OrderItem .OrderInfo .Price>.Item {
   width: 100%;
   font-weight: 600;
   color: #4caf50;
   font-size: 14px
}

.OrderItem .OrderInfo .Price>.Pay {
   width: 100%;
   font-size: 13px;
   color: #444
}

.OrderItem .OrderInfo .BtnView {
   width: 32px;
   height: 32px;
   flex: none;
   margin-left: 24px;
   background: rgba(0,0,0,.06);
   border-radius: 100%;
   display: flex;
   align-items: center;
   justify-content: center
}

.OrderItem.Active {
   background-color: #fff;
   border-color: #eee;
   -webkit-box-shadow: 0 8px 32px rgb(72 72 72/16%);
   box-shadow: 0 8px 32pxrgba(72,72,72,.16);
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   margin-bottom: 30px;
   margin-left: -16px;
   -webkit-transform: translateY(15px);
   -ms-transform: translateY(15px);
   transform: translateY(15px);
   width: calc(100% + 32px)
}

.OrderItem .OrderDetail {
   width: 100%;
   min-height: 230px;
   display: none
}

.OrderItem.Active .OrderDetail {
   display: flex;
   flex-direction: column
}

.OrderItem .OrderDetail>svg {
   height: 49px
}

.OrderItem .OrderDetail .ProductBox {
   width: 100%;
   border: 1px solid #e5e5e5;
   border-radius: 4px;
   margin: 20px 0
}

.OrderItem .OrderDetail .ProductBox .Address {
   width: 100%;
   border-bottom: 1px solid #e5e5e5;
   display: flex;
   flex-direction: column;
   padding: 10px
}

.OrderItem .OrderDetail .ProductBox .Address .Text {
   width: 100%;
   font-weight: 600
}

.OrderItem .OrderDetail .ProductBox .Address .Date {
   width: 100%
}

.OrderItem .OrderDetail .ProductBox .ProductItem {
   width: 100%;
   display: flex
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info {
   width: 100%;
   padding: 20px
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product {
   width: 100%;
   display: flex;
   gap: 10px;
   margin-bottom: 20px
}




.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .ProductComment {
   width: 100%;
   position: relative;
   display: none
}
.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .ProductComment {
   display: flex;
   flex-direction: column;
   border: 1px solid #e3e3e3;
   padding: 8px;
   border-radius: 3px;
   background: #eeeeee;
}
.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .ProductComment .Btn {
   width: 100%;
   display: flex;
   gap: 4px;
   align-items: center;
}
.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .ProductComment .Btn > span:nth-child(1){
   font-size: 12px;
   color: #ccc;
}
.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .ProductComment .Btn > span:nth-child(2){
   font-size: 12px;
   font-weight: 400;
   color: #000;
}

.OrderItem .OrderDetail .ProductBox[comment="1"] .ProductItem>.Info .ProductComment {
   background: #c6ffc9;
   border-color: #83e086;
}
.OrderItem .OrderDetail .ProductBox[comment="1"] .ProductItem>.Info .ProductComment .Btn > span:nth-child(1){
   font-size: 16px;
   color: #ffd045;
}
.OrderItem .OrderDetail .ProductBox[comment="1"] .ProductItem>.Info .ProductComment .Btn > span:nth-child(2){
   font-weight: bold;
   color: #054108;
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product .Photo {
   width: 46px
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product .Photo img {
   width: 46px
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product .Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   gap: 1px;
   align-items: flex-start
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product .Info>span:nth-child(1) {
   width: 100%;
   font-weight: 300
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product .Info>span:nth-child(2) {
   width: 100%;
   color: #4caf50
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Product .Info>span:nth-child(3) {
   width: 100%
}

.OrderItem .OrderDetail .ProductBox .ProductItem>.Detail {
   width: 100%;
   background: #fffaf3;
   padding: 20px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo {
   width: 100%;
   display: flex;
   gap: 20px;
   align-items: flex-start;
   flex-direction: row;
   justify-content: space-between
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice {
   width: 100%
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Title {
   width: 100%;
   font-size: 17px;
   font-weight: 600
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info {
   width: 100%
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Item {
   width: 100%;
   display: none;
   align-items: center;
   flex-direction: column;
   margin-top: 10px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info[T="1"]>.Item.T1 {
   display: flex
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info[T="2"]>.Item.T2 {
   display: flex
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Item>span:nth-child(1) {
   width: 100%;
   font-size: 12px;
   color: #000;
   font-weight: 500
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Item>span:nth-child(2) {
   width: 100%;
   font-size: 12px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.inTitle {
   width: 100%;
   font-size: 12px;
   color: #000;
   font-weight: 500;
   margin-top: 20px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Text {
   width: 75%;
   font-size: 12px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Name {
   width: 100%;
   display: flex;
   gap: 10px;
   justify-content: flex-start;
   margin-top: 8px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Name>span:nth-child(1) {
   font-size: 12px;
   color: #000;
   font-weight: 500
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice .Info>.Name>span:nth-child(2) {
   font-size: 12px;
   color: #000;
   font-weight: 500
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition {
   width: 100%
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Title {
   width: 100%;
   font-size: 17px;
   font-weight: 600
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .GiftCard {
   width: 100%
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .GiftCard .Coupon {
   width: 100%;
   border-radius: 4px;
   background: #fefaf3;
   display: flex;
   flex-direction: row;
   align-items: center;
   padding: 12px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .GiftCard .Coupon .CouponCode {
   margin: 2px 0;
   border-radius: 4px;
   padding: 6px;
   border: 1px dashed #000;
   margin-right: 16px;
   font-weight: 700;
   font-size: 12px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .GiftCard .Coupon .Text {
   width: 100%;
   font-size: 12px;
   line-height: 13px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankInfo {
   background: #fff;
   width: 100%;
   padding: 6px 12px;
   margin-bottom: 14px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankInfo .Item {
   display: flex;
   width: 100%;
   justify-content: space-between;
   align-items: center
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankInfo .Item>span:nth-child(1) {
   width: 220px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankInfo .Item>span:nth-child(2) {
   font-size: 13px;
   font-weight: 500
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .Text {
   font-size: 12px;
   width: 100%;
   color: red;
   line-height: 15px;
   margin-bottom: 24px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .Btn {
   background: #000;
   color: #fff;
   padding: 6px 12px;
   margin-bottom: 14px;
   border-radius: 4px;
   cursor: pointer
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox {
   width: 100%;
   margin: 12px 0;
   border-radius: 4px;
   background: #efefef94;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox.P0 {
   background: #ff00000d
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo {
   background: #fff;
   border-radius: 5px;
   padding: 7px;
   margin-bottom: 9px;
   width: 160px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Bonus]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_bonus.svg);
   background-size: 110px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Axess]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_axsess.svg);
   background-size: 58px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Advantage]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_advantage.svg);
   background-size: 120px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Cardfinans]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_cardfinans.svg);
   background-size: 110px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Maximum]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_maximum.svg);
   background-size: 84px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Miles]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_miles.svg);
   background-size: 84px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=paraf]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_paraf.svg);
   background-size: 34px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=Paraf]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_paraf.svg);
   background-size: 34px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .BankLogo[B=World]:before {
   content: "";
   background: #fff url(/Library/Img/Bank/icon_world.svg);
   background-size: 116px;
   height: 18px;
   display: block;
   background-repeat: no-repeat
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .CardInfo {
   width: 100%
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .CardInfo .CardNum {
   width: 100%;
   font-weight: 600
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .CardInfo .Installment {
   width: 100%;
   font-size: 12px
}
.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .CardInfo .Btn {
   background: #f00;
   color: #fff;
   font-size: 12px;
   width: fit-content;
   margin-top: 8px;
   margin-bottom: 0px;
}
.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .PaymentBox .CardInfo .Btn[S="1"] {
   background: #4CAF50;
   color: #fff;
}
.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info {
   width: 100%;
   margin-top: 24px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item {
   width: 100%;
   display: flex;
   align-items: center;
   padding: 4px 0
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item.Red {
   color: red
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item[P="0.00"] {
   display: none
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item[P="0"] {
   display: none
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item>span:nth-child(1) {
   width: 100%;
   color: #868686;
   font-weight: 500;
   font-size: 12px
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item>span:nth-child(2) {
   width: 100%;
   text-align: right;
   font-size: 14px;
   font-weight: 600
}

.MemberView .View .OrderItem .OrderDetail .OrderInfo .Addition .Info>.Item.Total>span:nth-child(1) {
   color: #000;
   font-size: 14px
}

[Page=Profil] .MemberView>.Area .PageView .Title {
   font-size: 20px;
   line-height: 30px;
   letter-spacing: -.17px;
   color: #484848;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-weight: 600
}

[Page=Profil] .MemberView>.Area .PageView .Text {
   margin-top: 8px;
   font-size: 13px;
   color: #484848;
   max-width: 734px;
   line-height: 1.38;
   margin-bottom: 40px
}

[Page=Profil] .MemberView>.Area .PageView .TabList {
   background-color: #eee;
   display: flex;
   flex-direction: row;
   padding: 3px;
   border-radius: 4px;
   max-width: 339px;
   width: 100%;
   margin-bottom: 16px
}

[Page=Profil] .MemberView>.Area .PageView .TabList>.TabItem {
   max-width: 165px;
   width: 100%;
   padding: 13px;
   font-weight: 600;
   text-align: center;
   color: #919191;
   text-decoration: none;
   border-radius: 4px;
   margin: 0
}

[Page=Profil] .MemberView>.Area .PageView .TabList>.TabItem.Active {
   background-color: #fff;
   color: #484848
}

[Page=Profil] .MemberView>.Area .PageView .TabList>.TabItem.Active:after {
   display: none
}

[Page=Profil] .MemberView>.Area .PageView .TabView {
   width: 100%
}

[Page=Profil] .MemberView>.Area .PageView .TabView .Title {
   font-size: 17px;
   color: #484848;
   margin-bottom: 16px
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List {
   width: 100%
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List>.Item {
   display: flex;
   flex-direction: row;
   align-items: center;
   max-width: 405px;
   width: 100%;
   min-height: 134px;
   border-radius: 4px;
   border: 1px solid #e5e5e5;
   position: relative
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List>.Item>.Info {
   display: flex;
   flex-direction: column;
   flex: 1;
   padding: 32px 24px
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List>.Item>.Info>span:nth-child(1) {
   font-size: 17px;
   font-weight: 600;
   color: #919191
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List>.Item>.Info>span:nth-child(2) {
   font-size: 15px;
   color: #484848;
   margin-top: 8px
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List>.Item>.Btn {
   width: 87px;
   border-left: 1px solid #e5e5e5;
   padding: 32px 24px;
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   background: 0 0;
   color: #929292;
   border-radius: 0;
   height: inherit;
   min-width: inherit;
   text-align: center
}

[Page=Profil] .MemberView>.Area .PageView .TabView .List>.Item>.Btn>i {
   width: 100%
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup_ {
   background: 0 0;
   width: 100%;
   height: 44px;
   border-radius: 4px;
   border: 2px solid #bfbfbf;
   position: relative;
   box-sizing: border-box
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup_>span {
   background-color: #fff;
   position: absolute;
   top: 0;
   left: 0;
   z-index: -1;
   padding: 11px 16px;
   font-size: 13px;
   font-weight: 600;
   color: #919191;
   transition: all 200ms ease;
   margin: 0;
   line-height: inherit;
   letter-spacing: normal;
   max-width: inherit
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup_>input {
   width: 100%;
   border: none;
   box-sizing: border-box;
   height: 40px;
   padding: 14px 16px;
   background-color: transparent;
   transition: all 200ms ease
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup_>input:focus+span {
   color: #bfbfbf;
   font-size: 12px;
   padding: 8px;
   margin-top: -16px;
   margin-left: 8px;
   z-index: initial;
   transition: all 200ms ease
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup_:not(:first-child) {
   margin-top: 22px
}

[Page=Profil] .MemberView>.Area .FilterArea {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   border-bottom: 1px solid #e5e5e5;
   padding-bottom: 8px;
   margin-bottom: 20px
}

[Page=Profil] .MemberView>.Area .FilterArea>.Filter {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   padding-bottom: 8px;
   margin-bottom: 6px;
   align-items: center
}

[Page=Profil] .MemberView>.Area .FilterArea>.Filter>.Item {
   font-size: 14px;
   color: #484848;
   text-decoration: none;
   border: 1px solid #ccc;
   padding: 8px 14px;
   cursor: pointer;
   margin-right: 12px;
   border-radius: 2px
}

[Page=Profil] .MemberView>.Area .FilterArea>.Filter>.Item.Active {
   color: #000;
   border-color: #ff5722
}

[Page=Profil] .MemberView>.Area .FilterArea>.Right {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   padding-bottom: 8px;
   margin-bottom: 6px;
   align-items: center
}

[Page=Profil] .MemberView>.Area .FilterArea>.Right>.BtnList {
   width: 100%;
   display: flex;
   justify-content: flex-end;
   align-items: center;
   margin-right: 10px;
   gap: 10px
}

[Page=Profil] .MemberView>.Area .FilterArea>.Right>.BtnList>.Text {
   align-items: center;
   font-family: Inter,-apple-system,SFProText,Helvetica Neue,sans-serif;
   display: inline-block;
   font-size: 16px;
   color: #919191;
   margin: 0 7px
}

[Page=Profil] .MemberView>.Area .FilterArea>.Right>.BtnList>.Text>span {
}

[Page=Profil] .MemberView>.Area .FilterArea>.Right>.BtnList>.Btn {
   display: flex;
   justify-content: flex-start;
   border: 1px solid #e5e5e5;
   background: 0 0;
   gap: 5px;
   align-items: center
}

[Page=Profil] .MemberView>.Area .FilterArea>.Right>.Btn {
   display: flex;
   justify-content: flex-start;
   border: 1px solid #e5e5e5;
   background: 0 0
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 {
   padding: 5px;
   position: relative;
   border-radius: 8px;
   cursor: pointer;
   text-decoration: none;
   box-shadow: rgb(0 0 0/16%) 0 1px 3px 0;
   border: 2px solid #fff;
   margin-right: 18px;
   margin-bottom: 18px;
   width: calc( 32% - 2px)
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001:nth-child(+3n) {
   margin-right: 0
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001:hover {
   z-index: 1
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Gallery {
   width: 100%;
   border-radius: 4px;
   overflow: hidden;
   position: relative
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Gallery .BtnFavorite {
   display: none!important
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info {
   display: flex;
   align-items: flex-start;
   padding: 0;
   height: inherit
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001:hover .Info {
   box-shadow: none
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Slogan {
   display: none!important
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Name {
   display: flex;
   font-size: 14px;
   width: 100%;
   text-align: left;
   justify-content: flex-start
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Name span {
   width: 100%;
   font-size: 14px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .CampaingPrice {
   display: flex;
   align-items: center;
   border: 1px solid #e91e63;
   border-radius: 3px;
   justify-content: space-between;
   padding: 0 7px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .CampaingPrice>span:nth-child(1) {
   color: #e91e63;
   font-size: 13px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .CampaingPrice>span:nth-child(2) {
   color: #e91e63;
   font-weight: 600;
   padding-left: 10px;
   width: 72px;
   flex: none;
   text-align: center
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price {
   display: flex;
   justify-content: flex-start
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Discount {
   display: none
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale {
   display: flex;
   align-items: center;
   justify-content: center;
   align-content: flex-end;
   margin: 0;
   color: #243a4e
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale.Campaing {
   color: #bfbfbf;
   text-decoration: line-through
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale.Campaing .B1 {
   font-size: 18px;
   font-weight: 400
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale.Campaing .B2 {
   font-size: 18px;
   font-weight: 400
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale .B1 {
   display: flex;
   font-size: 22px;
   font-weight: 600
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-weight: 600;
   font-size: 12px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Sale .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px;
   font-weight: 600
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Old {
   margin: 0;
   margin-right: 10px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Old .B1 {
   display: flex;
   font-size: 18px;
   font-weight: 500
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Old .B2 {
   display: flex;
   align-content: flex-end;
   align-items: stretch;
   font-size: 11px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(1) {
   width: 100%;
   display: flex;
   font-size: 12px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(2) {
   width: 100%;
   display: flex;
   padding-left: 2px;
   font-size: 12px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo {
   display: block;
   position: relative;
   height: inherit;
   background: 0 0;
   box-shadow: none;
   border-radius: 0;
   left: 0;
   right: 0
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001:hover .OtherInfo {
   display: flex
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   flex-direction: row;
   padding: 0
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate span {
   width: 100%;
   font-size: 12px
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Point {
   display: flex
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Total {
   font-size: 12px;
   cursor: pointer;
   color: #2196f3;
   padding: 2px 5px;
   border-radius: 2px;
   font-weight: 500
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Total span {
   font-weight: 400
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Total:hover {
   text-decoration: underline
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Point .Star {
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Point .Star.Selected {
   color: #ffc107;
   opacity: .8
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Point .Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

[Page=Profil] .ProductList.Favorite .ProductItem.item_001 .OtherInfo .Rate .Point .Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}

[Page=Profil] .MemberView>.Area h2 {
   font-size: 28px;
   line-height: 36px;
   font-weight: 600;
   letter-spacing: .33px;
   color: #484848;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   margin-bottom: 32px
}

[Page=Profil] .MemberView>.Area .TabList {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   border-bottom: 1px solid #e5e5e5;
   padding-bottom: 8px;
   margin-bottom: 20px
}

[Page=Profil] .MemberView>.Area .TabList>.TabItem {
   font-size: 15px;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   line-height: 1.71;
   letter-spacing: -.15px;
   color: #484848;
   cursor: pointer;
   text-decoration: none;
   padding: 0 14px;
   cursor: pointer;
   display: flex
}

[Page=Profil] .MemberView>.Area .TabList>.TabItem.Active {
   color: #000;
   position: relative;
   font-weight: 500
}

[Page=Profil] .MemberView>.Area .TabList>.TabItem.Active:after {
   content: "";
   background: -webkit-linear-gradient(left,#4caf50,#00cd08);
   display: block;
   height: 3px;
   width: 100%;
   position: absolute;
   bottom: -10px;
   border-radius: 2px;
   left: 50%;
   transform: translate(-50%,-50%)
}

[Page=Profil] .MemberView>.Area .TabList>.TabItem>span.Count {
   width: 29px;
   height: 24px;
   margin: 0 0 0 8px;
   padding: 3px 8px 4px;
   border-radius: 12px;
   border: solid 1px #e5e5e5;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-align: center;
   align-items: center;
   -ms-flex-pack: center;
   justify-content: center
}

[Page=Profil] .MemberView>.Area .TabView {
   width: 500px;
   display: none;
   margin: 20px auto
}

[Page=Profil] .MemberView>.Area .TabView.Full {
   width: 100%
}

[Page=Profil] .MemberView>.Area .TabView.Full.Active {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

[Page=Profil] .MemberView>.Area .TabView.Active {
   display: block
}

[Page=Profil] .MemberView>.Area .TabView .Title {
   font-size: 20px;
   line-height: 30px;
   letter-spacing: -.17px;
   color: #484848;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-weight: 600
}

[Page=Profil] .MemberView>.Area .TabView .Text {
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   margin-top: 8px;
   font-size: 14px;
   line-height: 21px;
   letter-spacing: -.28px;
   color: #484848
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup {
   background: 0 0
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>span {
   display: flex;
   height: 24px;
   font-size: 14px;
   line-height: 1.71;
   letter-spacing: -.25px;
   color: #484848;
   margin: 12px 8px 4px
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   gap: 30px;
   position: relative
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input {
   background-color: #eee;
   border: 2px solid #eee;
   border-radius: 8px;
   box-sizing: border-box;
   color: #9b9b9b;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -.32px;
   line-height: 1.5;
   outline: 0;
   padding: 10px 56px 10px 14px;
   width: 100%
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>.PasswordView {
   position: absolute;
   right: 10px;
   top: 14px;
   z-index: 5;
   cursor: pointer
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>.PasswordView>svg {
   height: 18px
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input[type=date] {
   display: flex;
   flex-direction: row-reverse;
   text-indent: 3px
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input:not(:focus) {
   border-color: #ddd;
   color: #484848;
   background-color: #fff
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input:focus {
   background-color: #fff;
   border-color: #ff6000;
   color: #484848;
   transition: all 250ms ease 0s
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input:not(:focus):not(:disabled):hover {
   background-color: #f5f5f5
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input.Err {
   border: 2px solid #fb6f6f;
   border-radius: 8px;
   box-sizing: border-box;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -.32px;
   line-height: 1.5;
   outline: 0;
   padding: 10px 56px 10px 14px;
   width: 100%;
   background: #fef2f2;
   color: #fa3f3f
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.InputArea>input.Err::placeholder {
   color: red
}

[Page=Profil] .MemberView>.Area .TabView .FormGroup>.ErrorText {
   width: 100%;
   height: inherit;
   color: #fb6f6f;
   font-size: 12px;
   letter-spacing: -.24px;
   line-height: 1.5;
   margin: 7px 0 7px 8px
}

[Page=Profil] .MemberView>.Area .TabView .Btn {
   -webkit-box-align: center;
   align-items: center;
   border: none;
   border-radius: 8px;
   box-sizing: border-box;
   cursor: pointer;
   display: flex;
   font-stretch: normal;
   font-style: normal;
   font-weight: 600;
   -webkit-box-pack: center;
   justify-content: center;
   outline: none;
   padding: 8px;
   position: relative;
   text-decoration: none;
   font-size: 16px;
   height: 48px;
   min-width: 160px;
   width: 100%
}

[Page=Profil] .MemberView>.Area .TabView .Btn.Disabled {
   background-color: #ccc!important;
   color: #919191!important;
   cursor: not-allowed;
   user-select: none;
   pointer-events: none
}

[Page=Profil] .MemberView>.Area .TabView .Btn.BtnGreen {
   background-color: rgb(0 255 10/13%);
   color: rgb(35 117 38)
}

[Page=Profil] .MemberView>.Area .TabView .Btn.BtnOrange {
   background-color: rgb(255 87 34/11%);
   color: #ff5722
}

[Page=Profil] .MemberView>.Area .TabView .ConnectBox {
   padding: 32px;
   background-color: rgba(0,0,0,.04);
   border-radius: 8px;
   margin-top: 31px
}

[Page=Profil] .MemberView>.Area .TabView .ConnectBox .Divider {
   height: 1px;
   background-color: rgb(0 0 0/11%);
   border-radius: 8px;
   margin: 30px 0 10px
}

[Page=Profil] .MemberView>.Area .TabView .Text>a {
   color: #2196f3
}

[Page=Profil] .MemberView>.Area .TabView .Box {
   border: 1px solid #e5e5e5;
   border-radius: 8px;
   padding: 32px;
   margin-top: 40px;
   margin-bottom: 40px;
   background: 0 0
}

[Page=Profil] .MemberView>.Area .TabView .Box .CheckGroup {
   display: flex;
   justify-content: space-between;
   align-items: center
}

[Page=Profil] .MemberView>.Area .TabView .Box .CheckGroup:not(:first-child) {
   margin-top: 14px
}

[Page=Profil] .MemberView>.Area .TabView .Box .CheckGroup .Text {
   display: flex;
   flex-direction: column
}

[Page=Profil] .MemberView>.Area .TabView .Box .CheckGroup .Text>span:nth-child(1) {
   font-size: 14px;
   font-weight: 700;
   line-height: 1.5;
   letter-spacing: -.28px;
   color: #484848
}

[Page=Profil] .MemberView>.Area .TabView .Box .CheckGroup .Text>span:nth-child(2) {
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-size: 14px;
   line-height: 1.5;
   letter-spacing: -.28px;
   color: #646464;
   margin-top: 13px;
   margin-right: 16px
}

[Page=Profil] .MemberView>.Area .TabView .Box .CheckGroup .Check {
   position: relative;
   display: inline-block;
   width: 60px;
   height: 34px
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem {
   display: flex;
   height: 150px;
   width: calc(50% - 20px);
   align-items: center;
   justify-content: space-between;
   margin: 0 10px 16px;
   padding: 10px 12px;
   border-radius: 8px;
   position: relative;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important;
   letter-spacing: -.025em;
   border: 1px solid #cdcdcd;
   background-color: #fff
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem.S1 {
   border: 1px solid #ffbf99
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem.My.S1 {
   background: #ffbf991c
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Left {
   display: flex;
   flex-direction: column;
   flex: none;
   width: 60%
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Left>.Name {
   width: 100%;
   font-weight: 600;
   font-size: 16px;
   line-height: 18px;
   color: #484848;
   word-break: break-word;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   flex: 1
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Left>.Text {
   width: 100%;
   font-weight: 600;
   font-size: 16px;
   line-height: 18px;
   color: #484848;
   word-break: break-word;
   margin-bottom: 4px;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   flex: 1
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Left>.Date {
   display: flex;
   font-weight: 500;
   font-size: 11px;
   line-height: 16px;
   color: #666;
   margin-right: 8px;
   margin-bottom: 8px
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Left>.Status {
   width: 100%
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Center {
   display: flex;
   flex-direction: column;
   flex: 1;
   width: 16px;
   flex: none
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Center>span:nth-child(1) {
   height: 8px;
   width: 16px;
   border: 1px solid #bcbcbc;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
   border-bottom: 0;
   background-color: #fff;
   box-sizing: border-box;
   position: absolute;
   box-shadow: 0 1px 0 0 #fff;
   bottom: -1px
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem.S1>.Center>span:nth-child(1) {
   border-color: #ffbf99
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Center>span:nth-child(2) {
   margin-top: auto;
   margin-bottom: auto;
   height: 105px;
   padding-left: 7.75px;
   fill: #ccc
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Center>span:nth-child(2)>svg {
   stroke: #ccc
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem.S1>.Center>span:nth-child(2)>svg {
   stroke: #ffbf99
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Center>span:nth-child(3) {
   height: 8px;
   width: 16px;
   border: 1px solid #bcbcbc;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
   border-bottom: 0;
   background-color: #fff;
   box-sizing: border-box;
   position: absolute;
   box-shadow: 0 1px 0 0 #fff;
   top: -1px;
   transform: rotate(180deg)
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem.S1>.Center>span:nth-child(3) {
   border-color: #ffbf99
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Right {
   display: flex;
   flex-direction: column;
   width: 40%;
   padding: 0 20px
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Right>.Discount {
   width: 100%;
   text-align: center;
   font-size: 22px;
   font-weight: 700
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Right>.Code {
   width: 100%;
   border: 1px dashed #ccc;
   padding: 12px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 4px;
   margin: 5px 0
}

[Page=Profil] .MemberView>.Area .TabView .CouponItem>.Right>.BtnCopy {
   width: 100%;
   background: #009688;
   color: #fff;
   border-radius: 4px;
   text-align: center;
   padding: 7px;
   cursor: pointer
}

.checkboxElements {
   margin-bottom: 5px;
   display: flex;
   align-items: center
}

.checkboxElements input.checkbox-input:not(:checked),.checkboxElements input.checkbox-input:checked {
   left: 0;
   top: 0;
   opacity: 0;
   visibility: hidden;
   z-index: -9999;
   width: inherit;
   display: none
}

.checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label,.checkboxElements input.checkbox-input:checked+label.checkbox-label {
   position: relative;
   cursor: pointer;
   font-weight: 500;
   min-height: 20px;
   min-width: 20px;
   margin: 0;
   display: flex;
   font-size: 16px;
   letter-spacing: -.32px;
   line-height: 1.5;
   padding: 0 10px;
   padding-left: 34px
}

.checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:before,.checkboxElements input.checkbox-input:checked+label.checkbox-label:before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 20px;
   height: 20px;
   border: 2px solid #aaa;
   background: 0 0;
   border-radius: 7px
}

.checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:after,.checkboxElements input.checkbox-input:checked+label.checkbox-label:after {
   content: "";
   position: absolute;
   left: 4px;
   font-size: 12px;
   line-height: .8;
   transition: all .2s;
   top: 4px;
   font-weight: 700;
   width: 16px;
   height: 16px;
   background: #4caf50;
   border-radius: 10px
}

.checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label:after {
   opacity: 0;
   transform: scale(0)
}

.checkboxElements input.checkbox-input:checked+label.checkbox-label:after {
   opacity: 1;
   transform: scale(1)
}

.checkboxElements input.checkbox-input:disabled:not(:checked)+label.checkbox-label:before,.checkboxElements input.checkbox-input:disabled:checked+label.checkbox-label:before {
   box-shadow: none;
   border-color: #bbb!important;
   background-color: transparent!important
}

.checkboxElements input.checkbox-input:disabled:checked+label.checkbox-label:after {
   color: #999!important
}

.checkboxElements input.checkbox-input:disabled+label.checkbox-label {
   color: #5b5b5b
}

.checkboxElements.dark-style input.checkbox-input:checked+label.checkbox-label:before {
   border-color: #a9a9a9;
   background-color: #a9a9a9
}

.checkboxElements.dark-style input.checkbox-input:checked+label.checkbox-label:after {
   color: #fff
}

.checkboxElements.green-style input.checkbox-input:checked+label.checkbox-label:before {
   border-color: #43cb83;
   background-color: #43cb83
}

.checkboxElements.green-style input.checkbox-input:checked+label.checkbox-label:after {
   color: #fff
}

.checkboxElements.blue-style input.checkbox-input:checked+label.checkbox-label:before {
   border-color: #317aff;
   background-color: #317aff
}

.checkboxElements.blue-style input.checkbox-input:checked+label.checkbox-label:after {
   color: #fff
}

.checkboxElements.orange-style input.checkbox-input:checked+label.checkbox-label:before {
   border-color: #f9b954;
   background-color: #f9b954
}

.checkboxElements.orange-style input.checkbox-input:checked+label.checkbox-label:after {
   color: #fff
}

.checkboxElements.red-style input.checkbox-input:checked+label.checkbox-label:before {
   border-color: red;
   background-color: red
}

.checkboxElements.red-style input.checkbox-input:checked+label.checkbox-label:after {
   color: #fff
}

.switch_checkbox label,.switch_radio label {
   padding: 0;
   margin: 0
}

.switch_checkbox label *,.switch_radio label * {
   vertical-align: middle
}

.switch_checkbox label input,.switch_radio label input {
   display: none
}

.switch_checkbox label input+span,.switch_radio label input+span {
   position: relative;
   width: 60px;
   height: 24px;
   background: #dedede;
   border: 1px solid #b8b8b866;
   border-radius: 69px;
   transition: all .3s ease-in-out;
   display: inline-block;
   padding: 2px;
   cursor: pointer
}

.switch_checkbox label input+span small,.switch_radio label input+span small {
   position: absolute;
   display: block;
   width: 18px;
   height: 18px;
   background: #fff;
   border-radius: 18px;
   transition: all .3s ease-in-out;
   left: 0;
   top: 2px;
   bottom: 1px;
   cursor: pointer
}

.switch_checkbox label input:checked+span,.switch_radio label input:checked+span {
   background: #4caf50;
   border-color: #318f35
}

.switch_checkbox label input:checked+span small,.switch_radio label input:checked+span small {
   left: calc(100% - 20px)
}

.switch_checkbox.switch-green label input:checked+span,.switch_radio.switch-green label input:checked+span {
   background: #43cb83;
   border-color: #43cb83
}

.switch_checkbox.switch-dark label input:checked+span,.switch_radio.switch-dark label input:checked+span {
   background: #313131;
   border-color: #313131
}

.switch_checkbox.switch-orange label input:checked+span,.switch_radio.switch-orange label input:checked+span {
   background: #f9b954;
   border-color: #f9b954
}

.switch_checkbox.switch-red label input:checked+span,.switch_radio.switch-red label input:checked+span {
   background: red;
   border-color: red
}

@media(max-width: 1540px) {

}

@media(max-width: 1280px) {
   .Container.Wsmall {
       width:96%;
       margin: 0 auto
   }

   .SearchBox {
       display: none
   }

   .ProductView .Gallery .SmallList {
       display: block;
       overflow: auto;
       width: 100%;
       overflow-x: auto;
       overflow-y: hidden;
       white-space: nowrap;
       text-align: center;
       height: auto!important;
       display: none;
   }

   .ProductView .Gallery .Big {
       margin: 0 0 15px;
       min-width: 100%;
   }

   .ProductView .Gallery .SmallList .gallery-item {
       display: inline-block;
       height: auto!important;
       position: relative;
       margin: 0
   }

   .ProductView .Gallery .SmallList .gallery-item .zoom-gallery2 img {
       width: initial!important;
       margin: 0;
       border: 0;
       box-shadow: none!important;
       padding: 0;
       height: 400px
   }

   .product-image-zoom>.big-image-container>img {
       margin: 0 auto;
       height: initial;
       cursor: url(/Library/Img/cursor-zooom.png),auto
   }

   .product-image-zoom>.big-image-container {
       display: flex;
       align-items: center
   }
}

@media(max-width: 980px) {
   .Head .Nav .MenuList {
       display:none
   }

   .ProductList.Grid4 .ProductItem {
       width: 33.33%
   }
   .OrderItem .OrderDetail .ProductBox .ProductItem{
       display: flex;
       flex-direction: column-reverse;
   }
   .OrderItem .OrderDetail .ProductBox .ProductItem>.Detail {
      width: 100%;
      background: #fffaf3;
      padding: 8px;
   }
   .OrderItem .OrderDetail .ProductBox .ProductItem>.Detail .Statu>.Info{
      width: 100%;
      font-size: 11px;
      font-weight: bold;
      text-transform: uppercase;
      margin-bottom: 5px;
   }
   .AddItem{
    padding: 5px 0 !important;
    font-size: 12px !important;
    line-height: 16px !important;
}
}

@media(max-width: 920px) {
   .Container.Wsmall {
       width:98%;
       margin: 0 auto
   }

   .Head .Search .SearchBox {
       display: none
   }

   body.ExtraPro {
       overflow: hidden
   }

   body.ExtraPro .BagView .Addition {
       display: none
   }

   .BagView .Addition {
       position: fixed;
       bottom: 0;
       left: 0;
       width: 100%;
       background: #fff;
       padding: 0 10px;
       border-top: 1px solid #0000001a;
       justify-content: center;
       display: flex;
       flex-direction: row;
       z-index: 5
   }

   .BagView .Addition.nonFixed {
       position: relative
   }

   .BagView .Addition .Title {
       display: none
   }

   .BagView .Addition .BagTotalMobile {
       display: flex;
       flex-direction: column;
       padding-left: 20px;
       width: 180px;
       align-items: flex-end
   }

   .BagView .Addition .BagTotalMobile span:nth-child(1) {
       width: 100%;
       font-weight: 500;
       text-align: right;
       font-size: 12px;
       padding-right: 16px
   }

   .BagView .Addition .BagTotalMobile span:nth-child(2) {
       width: 100%;
       font-weight: 700;
       font-size: 16px;
       text-align: right
   }

   .BagView .Addition .BagTotalMobile:before {
       font-family: "font awesome 5 free";
       font-weight: 900;
       -moz-osx-font-smoothing: grayscale;
       -webkit-font-smoothing: antialiased;
       display: inline-block;
       font-style: normal;
       font-variant: normal;
       text-rendering: auto;
       line-height: 1;
       content: "\f106";
       position: absolute;
       right: 10px;
       top: 14px
   }

   .BagView .List {
       width: 100%
   }

   .BagView .Addition.Active .Title {
       position: absolute;
       display: block;
       bottom: 100%;
       background: #fff;
       padding: 0;
       box-shadow: 0 -95px 221px 19px #00000075
   }

   .BagView .Addition.Active .Item.Total {
       display: none
   }

   .MobilAddition {
       position: fixed;
       bottom: -200px;
       background: #fff;
       padding: 10px;
       width: 100%;
       border-bottom: 1px solid #f1f1f1;
       transition: all .3s ease-in;
       left: 0
   }

   .MobilAddition.Active {
       bottom: 62px;
       z-index: 1;
       transition: all .3s ease-in
   }

   .MobilAddition .Title {
       width: 100%;
       background: #fff;
       border-radius: 4px;
       padding-bottom: 12px
   }

   .MobilAddition .Title .Text {
       width: 100%;
       font-weight: 600;
       text-align: center;
       padding: 10px 0
   }

   .MobilAddition .Title .Item {
       width: calc(100% - 20px);
       padding: 6px;
       background: #fff;
       margin: 3px 10px;
       border-radius: 3px;
       display: flex;
       justify-content: space-between
   }

   .MobilAddition .Title a {
       width: calc(100% - 20px);
       padding: 6px;
       background: #fff;
       margin: 3px 10px;
       border-radius: 3px;
       display: flex;
       justify-content: space-between;
       display: none
   }

   .MobilAddition .Title .Item span:nth-child(1) {
       width: 100%;
       color: #5c5c5c
   }

   .MobilAddition .Title .Item span:nth-child(2) {
       width: 100%;
       text-align: right;
       font-weight: 500;
       font-size: 16px
   }

   .MobilAddition .Item.Total {
       display: none
   }

   .MobilAddition .BagTotalMobile {
       display: none
   }

   .MobilAddition .BagResume {
       display: none
   }

   .MobilAdditionBg {
       position: fixed;
       background: #00000082;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       z-index: 0
   }

   .BagView .List .productItem .Product .Info .Item {
       display: flex;
       flex-direction: column
   }

   .BagView .List .productItem .Product .Info {
       display: flex;
       flex-direction: column
   }

   .BagView .List .productItem .Product .ExtraProduct {
       margin: 0;
       width: 100%
   }

   .BagView .List .productItem .Product .CardMessage {
       margin: 0;
       width: 100%
   }

   .BagView .List .productItem .Product .InfoArea {
       width: 100%;
       display: flex;
       flex-direction: column
   }

   .BagView .List .productItem .Product .Info .Item.Price {
       display: flex;
       flex-direction: row
   }

   .BagView .List .productItem .Product .Info .Item.Price .OldPrice {
       width: initial;
       margin-right: 10px;
       display: flex
   }

   .BagView .List .productItem .Product .Info .Item.Price .SalePrice {
       width: initial;
       margin-right: 10px;
       display: flex
   }

   .special-select {
       display: flex;
       margin-top: 10px;
       flex-direction: column;
   }

   .special-select li {
   }

   .special-select li:nth-child(+2n) {
       margin-right: 0
   }

   .ProductView .InfoBox .PayInformation .IconList .Item {
       width: 12.838%
   }

   .ProductView .InfoBox .MobilArea {
       display: flex;
       gap: 10px;
       margin-top: 20px;
   }

   .scroll-to-up {
       display: none
   }

   .q-scroll-to-top {
       bottom: 70px;
       transition: .5s
   }

   .wp-support-button {
       transition: .5s
   }

   body[fcode=Fr-5500119] .wp-support-button {
       bottom: 150px
   }

   .wp-support-button.nav-hide {
       right: -150px
   }

   .AllPagePhoneSale {
       display: block
   }

   .SearchPop>.Modal .CenterAra .Result>.ProductItem {
       width: 33%;
       padding: 5px
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem {
       width: 33%;
       padding: 5px
   }

   .PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area img {
       display: none
   }

   .PopupDesign>.Modal>.Htm>.Document>.Center .FormLocationArea .Area .Info {
       margin-left: 0
   }

   .ui-widget.ui-widget-content {
       position: fixed!important;
       left: 0!important;
       bottom: 0!important;
       justify-content: center;
       align-items: center;
       flex-direction: column;
       padding: 10px;
       width: 100%;
       top: inherit!important;
       padding-bottom: 130px;
       box-shadow: 0 -1200px 0 1200px #0000009e!important;
       z-index: 999999
   }

   .ui-widget.ui-widget-content::before {
       display: none!important
   }

   .ui-datepicker td span,.ui-datepicker td a {
       font-size: 16px;
       padding: 8px!important;
       border: 0!important
   }

   .ui-datepicker th {
       padding: 12px!important
   }
}

@media(max-width: 780px) {
   [Page=Success] .Container .LeftArea .Navigator {
       display:none
   }

   [Page=Success] .Container .LeftArea {
       padding: 30px;
       height: inherit!important
   }

   [Page=Success] .Container .LeftArea .Text {
       width: 100%
   }

   [Page=Success] .Container .RightArea {
       width: 100%;
       padding-right: 0
   }

   [Page=Success] .Container .LeftArea .BtnList {
       width: 100%!important;
       margin-top: 20px
   }

   [Page=Success] .Information {
       width: 100%;
       margin-top: 5px;
       gap: 10px;
       flex-direction: column
   }

   .MobilNavArea {
       overflow: auto
   }

   .Desktop1.Mobil0 {
       display: none
   }

   .Desktop1.Mobil1 {
       display: block
   }

   .Desktop0.Mobil1 {
       display: block
   }

   .StatisView .Area {
       width: 100%;
       margin: 20px 0;
       padding: 0 12px
   }

   .StatisView .Navi {
       display: none
   }

   .StatisView .Area .Title>.StaticNav {
       display: flex
   }

   .StaticNavi.Active {
       height: calc(100% - 155px);
       opacity: 1;
       padding-top: 20px;
       border-color: #ebebeb;
       border-top-color: #fff;
       z-index: 1
   }

   .StaticNavBg.Active {
       top: 0;
       background: #00000099
   }

   .StaticNavi .Profil {
       width: 100%;
       display: flex;
       flex-direction: row;
       gap: 10px;
       margin-bottom: 40px
   }

   .StaticNavi .Profil>.Photo {
       background-color: #eee;
       min-width: 56px;
       height: 56px;
       border-radius: 56px;
       display: -webkit-box;
       display: -ms-flexbox;
       display: flex;
       -webkit-box-align: center;
       -ms-flex-align: center;
       align-items: center;
       -webkit-box-pack: center;
       -ms-flex-pack: center;
       justify-content: center;
       font-size: 16px;
       font-weight: 600
   }

   .StaticNavi .Profil>.Info {
       width: 100%;
       display: flex;
       flex-direction: column;
       justify-content: center
   }

   .StaticNavi .Profil>.Info>span:nth-child(1) {
       font-weight: 600;
       font-size: 16px;
       line-height: 1.13;
       letter-spacing: -.32px;
       color: #484848;
       text-transform: lowercase
   }

   .StaticNavi .Profil>.Info>span:nth-child(2) {
       width: 100%;
       color: #2196f3;
       font-size: 12px;
       line-height: 11px
   }

   .StaticNavi .Item {
       width: 100%;
       line-height: 10px;
       padding: 10px 0;
       border-radius: 8px;
       cursor: pointer;
       display: flex;
       justify-content: flex-start;
       align-items: center;
       font-size: 14px;
       font-weight: 400;
       font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important;
       border-radius: 4px;
       height: 36px;
       line-height: 36px;
       padding: 0 12px;
       cursor: pointer
   }

   .StaticNavi .Item.Sub {
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       justify-content: flex-start;
       height: inherit
   }

   .StaticNavi .Item.Sub:hover {
       background: 0 0
   }

   .StaticNavi .Item.Sub>div {
       display: flex;
       flex-direction: row;
       align-items: center;
       font-weight: 600;
       color: #000;
       font-size: 13px
   }

   .StaticNavi .Item.Sub .Wind {
       width: 100%;
       display: flex;
       flex-direction: column;
       border-left: 2px solid #c6c6c6;
       margin-left: 0;
       margin-top: 10px;
       padding-left: 8px;
       align-items: flex-start;
       position: relative
   }

   .StaticNavi .Item.Sub .Wind>a {
       line-height: 24px;
       margin-bottom: 5px;
       cursor: pointer;
       display: flex;
       justify-content: flex-start;
       align-items: center;
       color: #000;
       font-size: 14px;
       border-radius: 4px;
       padding: 0 12px
   }

   .StaticNavi .Item.Sub .Wind>a::before {
       content: "";
       height: 1px;
       background: #dcdcdc;
       position: absolute;
       left: 0;
       width: 10px;
       color: #000
   }

   .StaticNavi .Item.Sub .Wind>a.Active {
       background: #ff57222e;
       color: #ff5722
   }

   .StaticNavi .Item svg {
       height: 22px;
       width: 40px;
       flex: none;
       text-align: center
   }

   .StaticNavi .Item:hover {
       background: #f3f3f3
   }

   .StaticNavi .Item.Active {
       background-color: #fff1e6;
       color: #ff5722
   }

   .StaticNavi .Item.Active svg {
       fill: #ff5722
   }

   .MobilBottomBar {
       width: 100%
   }

   .ProductList.Grid4 .ProductItem {
       width: 50%;
       margin-right: 0;
   }

   .ProductList.Grid3 .ProductItem {
       width: 50%
   }

   .ProductList .ProductItem.item_001 .OtherInfo {
       display: none!important
   }

   .ProductList .ProductItem.item_001:hover .Info {
       box-shadow: none
   }

   .ProductList .ProductItem.item_003 {
       width: calc(50% - 8px);
       padding: 4px;
       box-shadow: 0 0 0 1px #ededed;
       border-radius: 0
   }

   .ProductList .ProductItem.item_003 .Gallery {
       border-radius: 0
   }

   .ProductList .ProductItem.item_003 .OtherInfo .Rate {
       display: flex;
       flex-direction: column;
       align-items: center
   }

   .ProductList .ProductItem.item_003:nth-child(+2n) {
       margin-right: 0
   }

   .ProductList .ProductItem.item_003 .Info .Name {
       font-size: 13px
   }

   .ProductList .ProductItem.item_003 .Info .Slogan {
       font-size: 12px
   }

   .ProductList .ProductItem.item_003 .Info .Price .Sale.Campaing {
       font-size: 14px;
       margin-top: 6px
   }

   .ProductList .ProductItem.item_003 .Info .CampaingPrice {
       padding: 5px;
       width: 100%;
       margin-bottom: 5px
   }

   .ProductList .ProductItem.item_003 .Info .CampaingPrice>span:nth-child(1) {
       font-size: 11px
   }

   .ProductList .ProductItem.item_003 .Info .CampaingPrice>span:nth-child(2) {
       font-size: 13px
   }

   .ProductList .ProductItem.item_004 {
       width: calc(50% - 0px);
       padding: 4px;
       border-radius: 0
   }
   .ProductList .ProductItem.item_004 .Gallery .BtnFavorite{right:4px;top:5px}
   .ProductList .ProductItem.item_004 .Gallery .Discount{font-size:11px;height: 18px;left: 6px;top: 6px;border-radius: 3px;}
   .ProductList .ProductItem.item_004 .Gallery .CampaingPrice{font-size: 11px;height: 17px;width: 100%;left: 0;bottom: 0;border-radius: 0;}
   .ProductList .ProductItem.item_004 .Gallery {
       border-radius: 0
   }

   .ProductList .ProductItem.item_004 .OtherInfo .Rate {
       display: flex;
       flex-direction: row;
       align-items: center
   }

   .ProductList .ProductItem.item_004:nth-child(+2n) {
       margin-right: 0!important
   }

   .ProductList .ProductItem.item_004 .Info .Name {
       font-size: 13px
   }

   .ProductList .ProductItem.item_004 .Info .Slogan {
       font-size: 12px
   }
   .ProductList .ProductItem.item_004 .Info{padding:8px}
   .ProductList .ProductItem.item_004 .Info .Price{gap: 4px;}

   .ProductList .ProductItem.item_004 .Info .Price .Old {
       font-size: 14px;
       margin-top: 6px
   }
   .ProductList .ProductItem.item_004 .Info .Price .Sale {
       font-size: 14px;
       margin-top: 6px
   }

   .ProductList .ProductItem.item_004 .Info .Price .Sale.Campaing {
       font-size: 16px;
       margin-top: 6px
   }

   .ProductList .ProductItem.item_004 .Info .CampaingPrice {
       padding: 5px;
       width: 100%;
       margin-bottom: 5px
   }

   .ProductList .ProductItem.item_004 .Info .CampaingPrice>span:nth-child(1) {
       font-size: 11px
   }

   .ProductList .ProductItem.item_004 .Info .CampaingPrice>span:nth-child(2) {
       font-size: 13px
   }

   .PopupDesign>.Modal.w40 {
       width: 100%;
       bottom: 0;
       position: fixed;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .PopupDesign>.Modal>.Htm {
       margin: 0
   }

   .PopupDesign>.Modal>.Htm>.Document {
       border-radius: 0;
       position: absolute;
       bottom: -100%;
       left: 0;
       height: 0;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .PaymentPage .PopupDesign>.Modal>.Htm>.Document {
       position: inherit;
       bottom: inherit
   }

   .PopupDesign>.Modal.Active>.Htm>.Document {
       height: auto;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }
   .M196016{display:none !important}
   .PopupDesign>.Modal.Active>.Htm>.Document>.Title {
       z-index: 2;
       width: 100%;
       position: relative
   }

   .Container.Wsmall {
       width: 100% !important;!i;!;
       z-index: 2;
       position: relative;
       height: inherit!important
   }

   .PopupDesign>.Modal.BagComplete>.Htm>.Document>.Center .BtnList .Btn {
       font-size: 14px
   }

   .ProductViewFeatures {
       padding: 20px
   }

   .ProductViewFeatures .Title {
       font-size: 16px
   }

   .ProductViewSuggets .Title {
       padding: 0 20px;
       font-size: 12px;
       margin-bottom: 5px;
       font-weight: 400;
   }

   .ProductViewLast .Title {
       padding: 0 20px;
       font-size: 16px;
       margin-bottom: 5px;
       padding: 0 20px;
       font-size: 12px;
       margin-bottom: 5px;
       font-weight: 400;
   }

   .Head .Search .But-Sepet:hover .Wind {
       display: none!important
   }

   .Head {
   }

   .Mod004 {
       display: none
   }
   .ProductListContainer .FilterArea .Filter>.Btn{
      background: #000;
      color: #fff;
      padding: 12px;
      position: absolute;
      bottom: 16px;
      right: 22px;
      left: 26px;
      border-radius: 4px;
      text-align: center;
      text-transform: uppercase;
   }
   .ProductListContainer .FilterArea{display:none;position: fixed;left: 0;top: 0;background: #fff;z-index: 999;border-radius: 4px;width: 91%;height: 100%;padding: 30px;box-shadow: 0px 0px 0px 100px #00000082;}
   .ProductListContainer .FilterArea.Active{display:flex;flex-direction: column;}
   .ProductListContainer .FilterArea .Title{
      display:flex;
      flex-direction: column;
      border-bottom: 1px solid #ccc;
      margin-bottom: 20px;
   }
   .ProductListContainer .FilterArea .Title span:nth-child(1){
      display:flex;
      font-size: 18px;
      margin-bottom: 2px;
   }
   .ProductListContainer .FilterArea .Title span:nth-child(2){
      display:flex;
      font-size: 12px;
      gap: 5px;
   }
   .ProductListContainer .FilterArea .Title span:nth-child(2)>span{
      display:flex;
      font-size: 12px;
      margin-bottom: 20px;
   }
   .ProductListContainer .FilterArea .Title svg{
      position: absolute;
      right: 24px;
      top: 24px;
      stroke: #000;
   }

   .ProductView {
       display: flex;
       flex-direction: column
   }

   .ProductView .Gallery {
       width: 100%;
       padding: 0;
       display: flex;
       flex-direction: column
   }

   .ProductView .InfoBox {
       width: 100%;
       padding: 0;
       padding-bottom: 50px;
       padding-top: 10px;
   }

   .ProductView .InfoBox .Info .Name {
       font-size: 16px;
       font-weight: 600
   }

   .ProductView .InfoBox .Info .Price {
       /* display: none; */
   }

   .ProductView .InfoBox .Desc {
   /* display: none; */
   width: 100%;
   text-align: center;
   border-radius: 8px;
   margin: 0px;
   }
   .ProductView .InfoBox .Variants{width: 100%;display: flex;overflow-y: scroll;gap: 12px;}
   .ProductView .InfoBox .Variants .VariantItem{display: flex;flex: none;width: 60%;}
   .ProductView .InfoBox .BtnList {
       /* position: fixed; */
   }
   .ProductView .InfoBox .HourArea.Active {
       display: inline-block;
   }
   
   .ProductView .InfoBox .HourArea .HourItem {
       width: calc(50% - 5px);
   }
   .ProductView .InfoBox .HourArea .HourItem:nth-child(+2n){
       margin-right: 0;
   }
   .ProductView .InfoBox .BtnList.nonFixed {
       bottom: -100%
   }

   .ProductView .InfoBox .BtnList .BtnComplete {
       padding: 10px 5px;
       font-size: 14px;
       border-radius: 4px;
       width: 100%;
       position: sticky;
       bottom: 14px;
   }

   .ProductView .InfoBox .BtnList .BtnComplete.Active::before {
       width: 30px;
       background-size: 30px
   }

   .ProductView .InfoBox .BtnList .BtnComplete.Active {
       padding-left: 30px
   }

   .ProductView .InfoBox .BtnList .BtnAdd {
       padding: 10px 5px;
       font-size: 14px;
       border-radius: 4px;
       width: 100%;
       background: 0 0;
       box-shadow: inset 0 0 0 1px #4caf50;
       color: #4caf50
   }

   .ProductView .InfoBox .BtnList .BtnAdd.Active {
       padding-left: 30px
   }

   .ProductView .InfoBox .BtnList .BtnAdd.Active::before {
       width: 30px;
       background-size: 30px
   }

   .ProductView .InfoBox .BtnList .BtnAdd.Active i {
       display: none
   }

   .ProductView .InfoBox .BtnList .BtnFavorite {
       /* display: none; */
   }

   .ProductView .InfoBox .BtnList .Pricebox {
       display: none;
       flex-direction: column;
       padding-left: 10px;
       padding-right: 0;
       flex: none;
       align-content: flex-end;
       justify-content: center;
       align-items: flex-end
   }

   .ProductView .InfoBox .BtnList .Pricebox .Old {
       display: flex;
       color: #7a7a7a;
       text-decoration: line-through;
       font-size: 13px;
       align-items: baseline;
       justify-content: flex-end;
       line-height: 8px
   }

   .ProductView .InfoBox .BtnList .Pricebox .Old span {
       font-size: 10px;
       padding-left: 2px
   }

   .ProductView .InfoBox .BtnList .Pricebox .Sale {
       display: flex;
       font-size: 18px;
       font-weight: 700;
       color: #000;
       align-items: baseline;
       justify-content: flex-end
   }

   .ProductView .InfoBox .BtnList .Pricebox .Sale span {
       font-size: 12px;
       padding-left: 2px
   }

   .BagView .List .productItem .Product {
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center
   }

   .BagView .List .productItem .Product .Info {
       width: 70%
   }

   .BagView .List .productItem .Product .ProductArea {
       width: 100%;
       flex: none
   }

   .BagView .List .productItem[nonDELIVERED_PRODUCT="1"] .Product .Alert {
       display: block
   }

   .BagView .List .productItem .CommentArea {
       padding: 5px
   }

   [Page=ProductDetail] .MobilBottomBar {
       display: none!important
   }

   [Page=ProductDetail] .Layout_01_Center .LayoutHead {
   }

   .ProductView .Gallery .Big img {
       border-radius: 0
   }

   .Modul_189484 .PayList {
       display: none
   }

   .ProductViewSuggets .View{margin:0;padding: 0 0px;}
   .ProductViewSuggets .View .ProductItem {
       margin-right: 0;
   }

   .ProductViewLast .View .ProductItem {
   }

   .ProductView .Gallery .Head {
       display: flex;
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       padding: 10px;
       padding-top: 0;
       border: 0;
       background: 0 0
   }

   .ProductView .Gallery .Head::before {
       content: '';
       position: absolute;
       right: 0;
       left: 0;
       width: 100%;
       height: 116px;
       z-index: -1;
       background: linear-gradient(180deg,#00000042,#4a4a4a00,#f3f3f300);
       pointer-events: none
   }

   .ProductView .Gallery .Head .BtnFavorite {
       flex: none;
       margin-left: 5px;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       width: 40px;
       height: 40px;
       position: absolute;
       right: 47px;
       top: 10px
   }

   .ProductView .Gallery .Head .BtnFavorite::before {
       content: "\f004";
       display: inline-block;
       font: normal normal normal 14px/1 FontAwesome;
       text-rendering: auto;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       width: 24px;
       height: 24px;
       line-height: 24px;
       text-align: center;
       border-radius: 100%;
       font-size: 14px;
       background: #fff;
       color: #5656569c
   }

   .ProductView .Gallery .Head .BtnFavorite.Active::before {
       color: #e3279d
   }

   .ProductView .Gallery .Head .BtnBack {
       flex: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       width: 40px;
       height: 55px
   }

   .ProductView .Gallery .Head .BtnBack::before {
       content: "\f104";
       display: inline-block;
       font: normal normal normal 14px/1 FontAwesome;
       text-rendering: auto;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       font-size: 28px;
       color: #fff
   }

   .ProductView .Gallery .Head .BtnHome {
       flex: none;
       margin-left: 5px;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       width: 40px;
       height: 55px;
       flex: none
   }

   .ProductView .Gallery .Head .BtnHome::before {
       content: "\f015";
       display: inline-block;
       font: normal normal normal 14px/1 FontAwesome;
       text-rendering: auto;
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
       font-size: 28px;
       color: #fff
   }

   .ProductView .Gallery .Head .But-Sepet {
       flex: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 24px;
       height: 24px;
       line-height: 24px;
       border-radius: 100%;
       position: absolute;
       top: 18px;
       right: 18px;
       background: #fff
   }

   .ProductView .Gallery .Head svg {
       fill: #000;
       height: 14px
   }

   .ProductView .Gallery .Head .Info {
       float: left;
       display: flex;
       flex-direction: row;
       justify-content: center;
       align-items: center;
       align-content: center;
       display: none
   }

   .ProductView .Gallery .Head .Info span:nth-child(1) {
       font-weight: 400;
       font-size: 18px;
       line-height: 18px;
       width: 100%;
       display: block;
       text-align: left;
       color: #383838
   }

   .ProductView .Gallery .Head .Info span:nth-child(2) {
       float: left;
       font-size: 16px;
       line-height: 18px;
       width: 100%;
       display: flex;
       text-align: left;
       font-weight: 600;
       color: #000;
       margin-left: 10px
   }

   .ProductView .Gallery .Head .BagCount {
       position: absolute;
       left: 21px;
       top: 5px;
       background: #f10;
       color: #fff;
       font-size: 11px;
       width: 14px;
       height: 14px;
       text-align: center;
       z-index: 1;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 12px;
       line-height: 14px;
       display: none
   }

   [Page=Bag] .MobilBottomBar {
       display: none!important
   }

   [Page=Address] .MobilBottomBar {
       display: none!important
   }

   [Page=Invoice] .MobilBottomBar {
       display: none!important
   }

   .BagView .List .productItem .Product .Other {
       width: 100%;
       margin-top: 10px
   }

   .BagView {
       padding: 16px
   }

   .BagView>.Title {
       display: none
   }

   .BagView .List .productItem {
       background: 0 0;
       margin-bottom: -1px;
       border-color: #0000001c;
       border-radius: 0
   }

   .BagView .List .productItem:nth-child(1) {
       border-color: transparent;
       padding: 16px 0
   }

   .Addition .GiftArea {
       width: 100%;
       display: none
   }

   .BagView .List .productItem .ExtraProductList {
       position: fixed;
       left: 0;
       top: 0
   }

   .BagView .List .productItem .ExtraProductList.Active {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: #fff;
       padding: 20px;
       padding-top: 71px;
       z-index: 20;
       overflow: auto
   }

   .BagView .List .productItem .ExtraProductList.Active .SubProduct {
       width: 48.5%;
       margin-right: 10px
   }

   .BagView .List .productItem .ExtraProductList .SubProduct:nth-child(+2n) {
       margin-right: 0
   }

   .BagView .List .productItem .ExtraProductList .Title {
       width: 100%;
       display: flex;
       flex-direction: column;
       margin-bottom: 20px;
       position: fixed;
       z-index: 1;
       background: #fff;
       box-shadow: 0 13px 18px 13px #fff;
       top: 50px;
       left: 0;
       padding: 20px;
       padding-bottom: 0
   }

   .BagView .List .productItem .ExtraProductList .Title span:nth-child(1) {
       width: 100%;
       font-weight: 500
   }

   .BagView .List .productItem .ExtraProductList .Title span:nth-child(2) {
       width: 100%;
       font-size: 11px
   }

   .BagView .List .productItem .ExtraProductList .Title .BtnClosed {
       position: absolute;
       right: 20px;
       top: 20px;
       background: #efefef;
       border: 1px solid #cccccc38;
       padding: 2px 6px;
       border-radius: 2px;
       font-size: 11px
   }

   .BagView .List .AddressItem .Form {
       display: flex;
       flex-direction: column
   }

   .BagView .List .AddressItem .Form .Left {
       width: 100%;
       padding: 0
   }

   .BagView .List .AddressItem .Form .Right {
       width: 100%;
       padding: 0
   }

   .BagView .List .AddressItem {
       margin-bottom: -1px;
       border-color: #0000001c;
       border-radius: 0;
       background: #fff
   }

   .BagView .List .AddressItem:nth-child(1) {
       margin-bottom: 20px
   }

   .BagView .List .Invoice {
       margin-bottom: -1px;
       border-color: #0000001c;
       border-radius: 0;
       background: #fff
   }

   .BagView .List .Invoice:nth-child(1) {
       border-color: transparent
   }

   .BagView .List .Invoice .Form .FormGroup {
       width: 100%
   }

   .BagView .List .Invoice .Form .FormInvoice {
       width: 100%
   }

   .Category .Info {
       margin-top: 10px
   }

   .Category .Info .Title>span {
       width: 100%;
       display: block
   }

   .Category .Info .SortArea {
       display: none
   }

   .Category .Info .SortArea.Active {
       display: block
   }

   .Category .Info .SortArea .Sort {
       display: block;
       height: 0;
       position: fixed;
       bottom: 0;
       z-index: 22;
       background: #fff;
       left: 0;
       box-shadow: 0 0 64px 27px #00000057;
       width: 100%;
       padding: 15px;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .Category .Info .SortArea.Active .Sort {
       height: 220px;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .Category .Info .SortArea.Active .Selected {
       display: none
   }

   .Category .Info .SortArea.Active .Wind {
       display: block;
       position: relative;
       width: 100%;
       box-shadow: none;
       border: 0
   }

   .Category .FilterArea {
       display: none
   }

   .Category .FilterArea.Active {
       display: block
   }

   .Category .Text {
       display: none
   }

   .Category .FilterAreaMobile {
       display: flex;
       flex-direction: row;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 0;
       border-bottom: 1px solid #ccc;
       padding-bottom: 15px
   }

   .Category .FilterAreaMobile .Btn {
       width: 48%;
       border: 1px solid #404040;
       padding: 6px;
       border-radius: 4px;
       display: flex;
       justify-content: center;
       align-items: center
   }

   .Category .FilterAreaMobile .Btn i {
       margin-right: 10px;
       font-size: 14px
   }

   .Category .FilterArea .FilterApply {
       display: block
   }

   .Category .FilterArea.Active .Filter {
       display: flex;
       position: fixed;
       left: 0;
       bottom: 0;
       width: 100%;
       background: #fff;
       z-index: 20;
       height: 70%;
       flex-direction: column;
       border: 0;
       padding: 10px 0;
       margin: 0
   }

   .Category .FilterArea.Active .FilterBox {
       position: initial;
       width: 100%
   }

   .Category .FilterArea.Active .FilterBox.Active {
       z-index: 3
   }

   .Category .FilterArea.Active .FilterBox .Selected {
       width: 45%;
       float: left;
       box-shadow: none;
       border: 0;
       padding: 12px 6px;
       font-size: 12px
   }

   .Category .FilterArea.Active .FilterBox.Active .Selected {
       width: 45%;
       float: left;
       background: #c62585;
       color: #fff
   }

   .Category .FilterArea.Active .FilterBox.Active .Selected span {
       color: #fff
   }

   .Category .FilterArea .FilterBox.Active .Selected::after {
       color: #fff
   }

   .Category .FilterArea.Active .FilterBox .Wind {
       width: 55%;
       position: absolute;
       right: 0;
       top: 0;
       left: inherit;
       box-shadow: none;
       max-height: inherit;
       overflow: auto;
       height: 100%;
       padding: 10px 10px 140px
   }

   .Category .FilterArea .FilterBox.Active .Wind .BtnClear {
       padding: 10px 0
   }

   .Category .FilterArea.Active .FilterBox .Wind span {
       width: 100%;
       padding: 2px 0
   }

   .Category .FilterArea .FilterOverFlow {
       background: 0 0;
       position: fixed;
       left: 0;
       top: 0;
       bottom: 0;
       width: 100%;
       height: 0;
       z-index: 0;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in
   }

   .Category .FilterArea.Active .FilterOverFlow {
       background: #00000082;
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -khtml-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in;
       height: 100%
   }

   .ProductList .ProductItem.item_001 .Info .Slogan {
       font-size: 11px
   }

   .ProductList .ProductItem.item_001 .Info .Name {
       font-size: 12px
   }

   .ProductList .ProductItem.item_001 .Info {
       height: 118px
   }

   .ProductList .ProductItem.item_001 .Info .CampaingPrice {
       display: flex;
       flex-direction: row;
       justify-content: space-between;
       font-size: 12px;
       padding: 0 3px
   }

   .ProductList .ProductItem.item_001 .Info .CampaingPrice>span:nth-child(1) {
       width: 100%
   }

   .ProductList .ProductItem.item_001 .Info .CampaingPrice>span:nth-child(2) {
       font-weight: 700;
       font-size: 14px;
       padding-left: 2px;
       text-align: right
   }

   .ProductList .ProductItem.item_001 .Info .Price .Discount {
       font-size: 10px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Sale {
       margin-left: 5px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Sale .B1 {
       font-size: 16px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Sale .B2 {
       font-size: 11px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old {
       display: flex;
       align-items: center;
       justify-content: center;
       align-content: flex-end;
       color: #bfbfbf;
       margin-left: 10px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old .B1 {
       font-size: 14px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(1) {
       font-size: 10px
   }

   .ProductList .ProductItem.item_001 .Info .Price .Old .B2 span:nth-child(2) {
       font-size: 10px
   }

   .SearchPop>.Modal .CenterAra .Result>.ProductItem {
       width: 50%;
       padding: 5px
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem {
       width: 100%;
       display: flex;
       align-items: center;
       margin-bottom: 5px;
       border-bottom: 1px solid #eee;
       justify-content: flex-start;
       text-align: left
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Gallery {
       width: 55px;
       margin-right: 10px;
       flex: none
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Info {
       width: 100%;
       display: flex;
       align-content: flex-start;
       align-items: flex-start
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Info .Name {
       line-height: 20px;
       width: 100%;
       min-height: inherit;
       font-size: 14px;
       display: flex;
       justify-content: flex-start
   }

   .SearchPop>.Modal .CenterAra .LastView .View>.ProductItem .Info .Price {
       display: flex;
       justify-content: flex-start
   }

   .DayView {
       position: fixed;
       z-index: 1;
       top: -100px;
       background: #0000008f;
       width: 100%;
       border-radius: 4px;
       color: #fff;
       padding: 10px;
       font-size: 14px;
       text-align: center;
       padding-top: 65px;
       transition: all .3s ease-in
   }

   .DayView.Show {
       top: 0;
       bottom: inherit;
       left: inherit;
       width: 100%;
       transition: all .3s ease-in
   }

   .DayView .Text {
       width: 100%
   }

   .DayView .Closed {
       width: 10px
   }
}

.FilterItemLabel span {
   font-size: 14px;
   line-height: 26px
}

.FilterItemLabel {
   position: relative;
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start
}

.FilterItemLabel:before {
   content: "";
   width: 20px;
   height: 20px;
   border: 1px solid #00000024;
   margin-right: 10px;
   background: #fff;
   border-radius: 4px;
}

@media only screen and (min-width: 768px) {
   .FilterItemLabel:hover {
       opacity:.5
   }
}

.FilterItem {
   position: absolute;
   visibility: hidden
}

.FilterItem:disabled+.FilterItemLabel {
   color: #ddd;
   text-decoration: line-through
}

input[type=checkbox].FilterItem:checked+.FilterItemLabel {
   color: #000
}

input[type=checkbox].FilterItem:checked+.FilterItemLabel::after {
}

input[type=checkbox].FilterItem:checked+.FilterItemLabel::after {
   content: "";
   position: absolute;
   left: 4px;
   width: 14px;
   height: 13px;
   background: #328835;
   top: 13px;
   transform: translateY(-50%);
   border-radius: 2px;
   flex: none;
}

.SluietItem {
}

.SluietItem.s0001 {
   width: 100%;
   height: 110px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-bottom: 10px
}

.SluietItem.s0001>i {
   font-size: 44px;
   color: #fff
}

.SluietItem.s0002 {
   width: 100%;
   height: 520px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-bottom: 10px
}

.SluietItem.s0002>i {
   font-size: 144px;
   color: #fff
}

.SluietItem.s0003 {
   width: 220px;
   height: 28px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0004 {
   width: 120px;
   height: 15px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0005 {
   width: 10px;
   height: 12px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-right: 2px
}

.SluietItem.s0006 {
   width: 28px;
   height: 12px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-right: 5px
}

.SluietItem.s0007 {
   width: 90px;
   height: 12px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0008 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0009 {
   width: 100%;
   height: 45px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0010 {
   width: 100%;
   height: 60px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0011 {
   width: 80%;
   height: 15px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0012 {
   width: 130px;
   height: 50px;
   margin-right: 10px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0013 {
   width: 160px;
   height: 50px;
   margin-right: 10px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0014 {
   width: 50px;
   height: 50px;
   margin-right: 10px;
   background: #e1e9eeb0;
   border-radius: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0015 {
   width: 100%;
   height: 14px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0016 {
   width: 100%;
   height: 14px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0017 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0018 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0019 {
   width: 25%;
   height: 24px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-right: 4px
}

.SluietItem.s0020 {
   width: 62px;
   height: 44px;
   margin-right: 4px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0021 {
   width: 100%;
   height: 16px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0022 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0023 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0024 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.SluietItem.s0026 {
   width: 90px;
   height: 25px;
   background: #e1e9eeb0;
   border-radius: 4px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center
}

.bell-icon {
   position: relative;
   height: 38px;
   background: #fff;
   border-radius: 50%;
   display: flex;
   padding: 0
}

.bell-icon svg {
   margin: auto;
   position: relative;
   right: 2%;
   width: 100%;
   height: 100%;
   stroke: rgba(0,0,0,.75)
}

.bell-icon .bell-icon__group {
   transform-origin: 50% 2px;
   transform: rotate(-8deg);
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
   -webkit-animation-iteration-count: 1;
   animation-iteration-count: 1;
   -webkit-animation-timing-function: ease-in-out;
   animation-timing-function: ease-in-out
}

.bell-icon .bell-icon__ball {
   transform-origin: 50% 2px;
   transform: translateX(-6.5%);
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
   -webkit-animation-iteration-count: 1;
   animation-iteration-count: 1;
   -webkit-animation-timing-function: ease-in-out;
   animation-timing-function: ease-in-out
}

.bell-icon,.bell-icon:hover {
   outline: none;
   position: absolute;
   right: 6px;
   bottom: 6px
}

.bell-icon .bell-icon__group,.bell-icon:hover .bell-icon__group {
   -webkit-animation: animateGroup 2.3s;
   animation: animateGroup 2.3s
}

.bell-icon .bell-icon__ball,.bell-icon:hover .bell-icon__ball {
   -webkit-animation: animateBall 2.3s;
   animation: animateBall 2.3s
}

.bell-icon .notification-amount,.bell-icon:hover .notification-amount {
   opacity: 1;
   visibility: visible
}

.bell-icon .notification-amount::before,.bell-icon:hover .notification-amount::before {
   -webkit-animation-name: bounce;
   animation-name: bounce;
   -webkit-animation-delay: 450ms;
   animation-delay: 450ms
}

.notification-amount {
   opacity: 0;
   visibility: hidden;
   position: absolute;
   top: 1%;
   right: -1%;
   width: 20px;
   height: 20px;
   color: #fff;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-family: sans-serif;
   font-size: 12px
}

.notification-amount span {
   position: relative
}

.notification-amount::before {
   content: "";
   position: absolute;
   width: 100%;
   height: 100%;
   background-color: #f72918;
   border-radius: 50%;
   z-index: 0;
   transform: scale(0);
   -webkit-animation-duration: 800ms;
   animation-duration: 800ms;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both
}

@-webkit-keyframes animateGroup {
   0%,100% {
       transform: rotate(-8deg)
   }

   17.542% {
       transform: rotate(0deg)
   }

   35.084% {
       transform: rotate(-20deg)
   }

   48.2405% {
       transform: rotate(20deg)
   }

   57.0115% {
       transform: rotate(-20deg)
   }

   64.9054% {
       transform: rotate(8deg)
   }

   74.5535% {
       transform: rotate(-15deg)
   }

   78.939% {
       transform: rotate(-7deg)
   }
}

@keyframes animateGroup {
   0%,100% {
       transform: rotate(-8deg)
   }

   17.542% {
       transform: rotate(0deg)
   }

   35.084% {
       transform: rotate(-20deg)
   }

   48.2405% {
       transform: rotate(20deg)
   }

   57.0115% {
       transform: rotate(-20deg)
   }

   64.9054% {
       transform: rotate(8deg)
   }

   74.5535% {
       transform: rotate(-15deg)
   }

   78.939% {
       transform: rotate(-7deg)
   }
}

@-webkit-keyframes animateBall {
   0%,100% {
       transform: translateX(-6.5%)
   }

   17.542% {
       transform: translateX(0%)
   }

   21.9275% {
       transform: translateX(-1%)
   }

   35.084% {
       transform: translateX(11%)
   }

   48.2405% {
       transform: translateX(-11%)
   }

   52.626% {
       transform: translateX(0%)
   }

   59.6428% {
       transform: translateX(10%)
   }

   68.4138% {
       transform: translateX(-11%)
   }

   78.939% {
       transform: translateX(11%)
   }

   85.9558% {
       transform: translateX(-11%)
   }
}

@keyframes animateBall {
   0%,100% {
       transform: translateX(-6.5%)
   }

   17.542% {
       transform: translateX(0%)
   }

   21.9275% {
       transform: translateX(-1%)
   }

   35.084% {
       transform: translateX(11%)
   }

   48.2405% {
       transform: translateX(-11%)
   }

   52.626% {
       transform: translateX(0%)
   }

   59.6428% {
       transform: translateX(10%)
   }

   68.4138% {
       transform: translateX(-11%)
   }

   78.939% {
       transform: translateX(11%)
   }

   85.9558% {
       transform: translateX(-11%)
   }
}

@-webkit-keyframes bounce {
   0% {
       transform: scale(0)
   }

   14% {
       transform: scale(1.15)
   }

   28% {
       transform: scale(1)
   }

   42% {
       transform: scale(1.15)
   }

   70% {
       transform: scale(1)
   }

   100% {
       transform: scale(1)
   }
}

@keyframes bounce {
   0% {
       transform: scale(0)
   }

   14% {
       transform: scale(1.15)
   }

   28% {
       transform: scale(1)
   }

   42% {
       transform: scale(1.15)
   }

   70% {
       transform: scale(1)
   }

   100% {
       transform: scale(1)
   }
}

.PageView.reklamAlanlari .siluet-item>.item {
   text-align: center;
   background-size: inherit;
   background-position: 50%;
   background-repeat: no-repeat
}

.PageView.reklamAlanlari .siluet-item>.item>img {
   display: inline-block
}

.PageView.reklamAlanlari .siluet-item>.item.two-column {
   display: flex;
   justify-content: center
}

.PageView.reklamAlanlari .rk-upload {
   background-image: url(https://panel.ciceksiparisi.net/Library/Img/rk-text.png);
   background-size: auto;
   background-repeat: no-repeat;
   background-position: center;
   min-height: 58px;
   width: 100%;
   position: relative;
   overflow: hidden;
   background-color: #a1d205;
   display: flex;
   align-items: center;
   justify-content: center
}

.PageView.reklamAlanlari .rk-upload img {
   width: 100%
}

.PageView.reklamAlanlari .rk-upload:hover input.upload {
   display: block
}

.PageView.reklamAlanlari .rk-upload:hover .hvr-rk-img {
   display: inline-block
}

.PageView.reklamAlanlari .rk-upload:hover .hvr-rk-img::before {
   content: "";
   position: absolute;
   left: 7px;
   right: 7px;
   top: 7px;
   bottom: 7px;
   border: 1px solid #fff
}

.PageView.reklamAlanlari .rk-upload input.upload {
   z-index: 1;
   left: 0;
   margin: 0;
   bottom: 0;
   top: 0;
   padding: 0;
   opacity: 0;
   outline: none;
   cursor: pointer;
   position: absolute;
   background: #ccc;
   width: 100%;
   display: none
}

.PageView.reklamAlanlari .rk-upload .hvr-rk-img {
   width: 100%;
   height: 100%;
   display: none;
   position: absolute;
   left: 0;
   vertical-align: middle;
   background: 0 0;
   right: 0;
   top: 0;
   bottom: 0
}

.PageView.reklamAlanlari .mobile-tabs {
   max-width: 575px;
   margin: 0
}

.PageView.reklamAlanlari .mobile-tabs .rk-upload {
   height: 98px
}

.MemberView {
   width: 100%;
   display: flex;
   flex-wrap: wrap
}

.MemberView .Container {
   display: flex;
   margin: 0 auto;
   width: 100%
}

.MemberView .Navi .Profil {
   width: 100%;
   display: flex;
   flex-direction: row;
   gap: 10px;
   margin-bottom: 40px;
   background: #d1f5d2;
   padding: 10px;
   border-radius: 5px
}

.MemberView .Navi .Profil>.Photo {
   background-color: #1c8f16;
   min-width: 38px;
   height: 38px;
   border-radius: 56px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   font-size: 16px;
   font-weight: 600;
   color: #fff
}

.MemberView .Navi .Profil>.Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center
}

.MemberView .Navi .Profil>.Info>span:nth-child(1) {
   font-weight: 600;
   font-size: 16px;
   line-height: 1.13;
   letter-spacing: -.32px;
   color: #166319;
   text-transform: lowercase
}

.MemberView .Navi .Profil>.Info>span:nth-child(2) {
   width: 100%;
   color: #0c6310;
   font-size: 11px;
   line-height: 11px
}

.MemberView .Navi {
   width: 240px;
   display: flex;
   flex-direction: column;
   padding: 45px 0;
   flex: none
}

.MemberView .Navi .Item {
   width: 100%;
   line-height: 10px;
   padding: 10px 0;
   border-radius: 8px;
   margin-bottom: 5px;
   cursor: pointer;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   font-size: 14px;
   font-weight: 400;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important
}

.MemberView .Navi .Item.Sub {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: center
}

.MemberView .Navi .Item.Sub>div {
   display: flex;
   flex-direction: row;
   align-items: center
}

.MemberView .Navi .Item.Sub>div:first-child {
   fill: #ff5722;
   color: #000;
   font-weight: 500
}

.MemberView .Navi .Item.Sub .Wind {
   width: 100%;
   display: flex;
   flex-direction: column;
   border-left: 4px solid #c6c6c6;
   margin-left: 18px;
   margin-top: 10px;
   padding-left: 25px;
   align-items: flex-start
}

.MemberView .Navi .Item.Sub .Wind>div {
   line-height: 24px;
   margin-bottom: 5px;
   cursor: pointer;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   color: #000;
   font-size: 13px;
   border-radius: 4px;
   padding: 0 12px
}

.MemberView .Navi .Item.Sub .Wind>div:hover {
   background: #f6c9ba;
   color: #5f1b06
}

.MemberView .Navi .Item.Sub .Wind>div.Active {
   background: #f6c9ba;
   color: #5f1b06
}

.MemberView .Navi .Item svg {
   height: 22px;
   width: 40px;
   flex: none;
   text-align: center
}

.MemberView .Navi .Item:hover {
   fill: #ff5722;
   color: #ff5722
}

.MemberView .Navi .Item.Active {
   fill: #ff5722;
   color: #ff5722
}

.MemberView .Navi .Item.Active svg {
   fill: #ff5722
}

.MemberView .View {
   padding: 0 28px;
   width: calc( 100% - 240px);
   margin: 42px 0
}

.MemberView .View .Area {
   display: none;
   width: 100%
}

.MemberView .View .Area.Active {
   display: block
}

.MemberView .Area .FormGroup {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

.MemberView .Area .FormGroup i {
   position: absolute;
   left: 13px;
   top: 13px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

.MemberView .Area .FormGroup span.Text {
   display: flex;
   z-index: 0;
   font-size: 14px;
   font-weight: 400;
   margin-bottom: 5px
}

.MemberView .Area .FormGroup .InputArea {
   background: #fff
}

.MemberView .Area .FormGroup input {
   width: 100%;
   outline: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 14px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 14px;
   font-weight: 400
}

.MemberView .Area .FormGroup textarea {
   width: 100%;
   outline: none;
   min-height: 90px;
   resize: none;
   border: 2px solid #e2e7e9;
   border-radius: 4px;
   padding: 14px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 26px;
   font-size: 14px;
   font-weight: 400;
   font-family: inherit
}

.MemberView .Area .FormGroup span.ErrorText {
   display: none
}

.MemberView .Blank {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   margin-top: 140px
}

.MemberView .Blank span:nth-child(1) {
   width: 100%;
   margin-bottom: 10px;
   text-align: center;
   font-weight: 600
}

.MemberView .Blank span:nth-child(2) {
   width: 100%;
   text-align: center;
   font-size: 13px
}

.MemberView .View .Area .PageView .Title {
   font-size: 20px;
   line-height: 30px;
   letter-spacing: -.17px;
   color: #484848;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-weight: 600
}

.MemberView .View .Area .PageView .Text {
   margin-top: 8px;
   font-size: 13px;
   color: #484848;
   max-width: 734px;
   line-height: 1.38;
   margin-bottom: 40px
}

.MemberView .View .Area .PageView .TabList {
   background-color: #eee;
   display: flex;
   flex-direction: row;
   padding: 3px;
   border-radius: 4px;
   max-width: 339px;
   width: 100%;
   margin-bottom: 16px
}

.MemberView .View .Area .PageView .TabList>.TabItem {
   max-width: 165px;
   width: 100%;
   padding: 13px;
   font-weight: 600;
   text-align: center;
   color: #919191;
   text-decoration: none;
   border-radius: 4px;
   margin: 0;
   display: flex;
   align-items: center;
   justify-content: center
}

.MemberView .View .Area .PageView .TabList>.TabItem.Active {
   background-color: #fff;
   color: #484848
}

.MemberView .View .Area .PageView .TabList>.TabItem.Active:after {
   display: none
}

.MemberView .View .Area .PageView .TabView {
   width: 100%
}

.MemberView .View .Area .PageView .TabView .Title {
   font-size: 17px;
   color: #484848;
   margin-bottom: 16px
}

.MemberView .View .Area .PageView .TabView .List {
   width: 100%
}

.MemberView .View .Area .PageView .TabView .List>.Item {
   display: flex;
   flex-direction: row;
   align-items: center;
   max-width: 405px;
   width: 100%;
   min-height: 134px;
   border-radius: 4px;
   border: 1px solid #e5e5e5;
   position: relative
}

.MemberView .View .Area .PageView .TabView .List>.Item>.Info {
   display: flex;
   flex-direction: column;
   flex: 1;
   padding: 32px 24px
}

.MemberView .View .Area .PageView .TabView .List>.Item>.Info>span:nth-child(1) {
   font-size: 17px;
   font-weight: 600;
   color: #919191
}

.MemberView .View .Area .PageView .TabView .List>.Item>.Info>span:nth-child(2) {
   font-size: 15px;
   color: #484848;
   margin-top: 8px
}

.MemberView .View .Area .PageView .TabView .List>.Item>.Btn {
   width: 87px;
   border-left: 1px solid #e5e5e5;
   padding: 32px 24px;
   box-sizing: border-box;
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   background: 0 0;
   color: #929292;
   border-radius: 0;
   height: inherit;
   min-width: inherit;
   text-align: center
}

.MemberView .View .Area .PageView .TabView .List>.Item>.Btn>i {
   width: 100%
}

.MemberView .View .Area .TabView .FormGroup_ {
   background: 0 0;
   width: 100%;
   height: 44px;
   border-radius: 4px;
   border: 2px solid #bfbfbf;
   position: relative;
   box-sizing: border-box
}

.MemberView .View .Area .TabView .FormGroup_>kr {
   position: absolute;
   top: 0;
   left: 0;
   z-index: -1;
   padding: 10px 17px;
   font-size: 14px;
   font-weight: 600;
   color: #000;
   transition: all 200ms ease;
   margin: 0;
   line-height: inherit;
   letter-spacing: normal;
   max-width: inherit
}

.MemberView .View .Area .TabView .FormGroup_>span {
   background-color: #fff;
   position: absolute;
   top: 0;
   left: 0;
   z-index: -1;
   padding: 11px 16px;
   font-size: 13px;
   font-weight: 600;
   color: #919191;
   transition: all 200ms ease;
   margin: 0;
   line-height: inherit;
   letter-spacing: normal;
   max-width: inherit
}

.MemberView .View .Area .TabView .FormGroup_>input {
   width: 100%;
   border: none;
   box-sizing: border-box;
   height: 40px;
   padding: 14px 16px;
   background-color: transparent;
   transition: all 200ms ease
}

.MemberView .View .Area .TabView .FormGroup_>input:focus+span {
   color: #bfbfbf;
   font-size: 12px;
   padding: 8px;
   margin-top: -16px;
   margin-left: 8px;
   z-index: initial;
   transition: all 200ms ease
}

.MemberView .View .Area .TabView .FormGroup_:not(:first-child) {
   margin-top: 22px
}

.MemberView .View .Area .FilterArea {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   border-bottom: 1px solid #e5e5e5;
   padding-bottom: 8px;
   margin-bottom: 20px
}

.MemberView .View .Area .FilterArea>.Filter {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   padding-bottom: 8px;
   margin-bottom: 6px;
   align-items: center
}

.MemberView .View .Area .FilterArea>.Filter>.Item {
   font-size: 14px;
   color: #484848;
   text-decoration: none;
   border: 1px solid #ccc;
   padding: 8px 14px;
   cursor: pointer;
   margin-right: 12px;
   border-radius: 2px
}

.MemberView .View .Area .FilterArea>.Filter>.Item.Active {
   color: #000;
   border-color: #ff5722
}

.MemberView .View .Area .FilterArea>.Right {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   padding-bottom: 8px;
   margin-bottom: 6px;
   align-items: center
}

.MemberView .View .Area .FilterArea>.Right>.BtnList {
   width: 100%;
   display: flex;
   justify-content: flex-end;
   align-items: center;
   margin-right: 10px;
   gap: 10px
}

.MemberView .View .Area .FilterArea>.Right>.BtnList>.Text {
   align-items: center;
   font-family: Inter,-apple-system,SFProText,Helvetica Neue,sans-serif;
   display: inline-block;
   font-size: 16px;
   color: #919191;
   margin: 0 7px
}

.MemberView .View .Area .FilterArea>.Right>.BtnList>.Text>span {
}

.MemberView .View .Area .FilterArea>.Right>.BtnList>.Btn {
   display: flex;
   justify-content: flex-start;
   border: 1px solid #e5e5e5;
   background: 0 0;
   gap: 5px;
   align-items: center
}

.MemberView .View .Area .FilterArea>.Right>.Btn {
   display: flex;
   justify-content: flex-start;
   border: 1px solid #e5e5e5;
   background: 0 0
}

.MemberView .View .Area .TitleArea {
   width: 100%;
   display: flex;
   align-items: center;
   margin-bottom: 24px
}

.MemberView .View .Area .TitleArea .Back {
   margin-right: 10px;
   width: 32px;
   height: 32px;
   background: #efefef;
   border-radius: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   display: none
}

.MemberView .View .Area .TitleArea .Back>svg {
   height: 20px
}

.MemberView .View .Area h2 {
   font-size: 18px;
   font-weight: 500;
   letter-spacing: .33px;
   color: #484848;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   margin: 0
}

.MemberView .View .Area .TabList {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   border-bottom: 1px solid #e5e5e5;
   padding-bottom: 8px;
   margin-bottom: 20px
}

.MemberView .View .Area .TabList>.TabItem {
   font-size: 15px;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   color: #484848;
   padding: 16px 14px 2px;
   cursor: pointer;
   text-decoration: none;
   cursor: pointer;
   display: flex
}

.MemberView .View .Area .TabList>.TabItem.Active {
   color: #000;
   position: relative;
   font-weight: 500
}

.MemberView .View .Area .TabList>.TabItem.Active:after {
   content: "";
   background: -webkit-linear-gradient(left,#4caf50,#00cd08);
   display: block;
   height: 3px;
   width: 100%;
   position: absolute;
   bottom: -10px;
   border-radius: 2px;
   left: 50%;
   transform: translate(-50%,-50%)
}

.MemberView .View .Area .TabList>.TabItem>span.Count {
   width: 29px;
   height: 24px;
   margin: 0 0 0 8px;
   padding: 3px 8px 4px;
   border-radius: 12px;
   border: solid 1px #e5e5e5;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-align: center;
   align-items: center;
   -ms-flex-pack: center;
   justify-content: center
}

.MemberView .View .Area .TabView {
   width: 500px;
   display: none;
   margin: 20px auto
}

.MemberView .View .Area .TabView.Full {
   width: 100%
}

.MemberView .View .Area .TabView.Full.Active {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap
}

.MemberView .View .Area .TabView.Active {
   display: block
}

.MemberView .View .Area .TabView .Title {
   font-size: 20px;
   line-height: 30px;
   letter-spacing: -.17px;
   color: #484848;
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-weight: 600
}

.MemberView .View .Area .TabView .Text {
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   margin-top: 8px;
   font-size: 14px;
   line-height: 21px;
   letter-spacing: -.28px;
   color: #484848
}

.MemberView .View .Area .TabView .FormGroup {
   background: 0 0
}

.MemberView .View .Area .TabView .FormGroup>span {
   display: flex;
   height: 24px;
   font-size: 14px;
   line-height: 1.71;
   letter-spacing: -.25px;
   color: #484848;
   margin: 12px 8px 4px;
   justify-content: space-between
}

.MemberView .View .Area .TabView .FormGroup>span>div {
   display: flex;
   font-size: 14px;
   color: #ff5722;
   font-weight: 500;
   cursor: pointer
}

.MemberView .View .Area .TabView .FormGroup>.InputArea {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   gap: 30px;
   position: relative
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input {
   background-color: #eee;
   border: 2px solid #eee;
   border-radius: 8px;
   box-sizing: border-box;
   color: #9b9b9b;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -.32px;
   line-height: 1.5;
   outline: 0;
   padding: 10px 56px 10px 14px;
   width: 100%
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>.PasswordView {
   position: absolute;
   right: 10px;
   top: 14px;
   z-index: 5;
   cursor: pointer
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>.PasswordView>svg {
   height: 18px
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input[type=date] {
   display: flex;
   flex-direction: row-reverse;
   text-indent: 3px
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input:disabled {
   cursor: not-allowed
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input:not(:focus) {
   border-color: #ddd;
   color: #484848;
   background-color: #fff
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input:focus {
   background-color: #fff;
   border-color: #ff6000;
   color: #484848;
   transition: all 250ms ease 0s
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input:not(:focus):not(:disabled):hover {
   background-color: #f5f5f5
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input.Err {
   border: 2px solid #fb6f6f;
   border-radius: 8px;
   box-sizing: border-box;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -.32px;
   line-height: 1.5;
   outline: 0;
   padding: 10px 56px 10px 14px;
   width: 100%;
   background: #fef2f2;
   color: #fa3f3f
}

.MemberView .View .Area .TabView .FormGroup>.InputArea>input.Err::placeholder {
   color: red
}

.MemberView .View .Area .TabView .FormGroup>.ErrorText {
   width: 100%;
   height: inherit;
   color: #fb6f6f;
   font-size: 12px;
   letter-spacing: -.24px;
   line-height: 1.5;
   margin: 7px 0 7px 8px
}

.MemberView .View .Area .TabView .Btn {
   -webkit-box-align: center;
   align-items: center;
   border: none;
   border-radius: 8px;
   box-sizing: border-box;
   cursor: pointer;
   display: flex;
   font-stretch: normal;
   font-style: normal;
   font-weight: 600;
   -webkit-box-pack: center;
   justify-content: center;
   outline: none;
   padding: 8px;
   position: relative;
   text-decoration: none;
   font-size: 16px;
   height: 48px;
   min-width: 160px;
   width: 100%
}

.MemberView .View .Area .TabView .Btn.Disabled {
   background-color: #ccc!important;
   color: #919191!important;
   cursor: not-allowed;
   user-select: none;
   pointer-events: none
}

.MemberView .View .Area .TabView .Btn.BtnGreen {
   background-color: rgb(0 255 10/13%);
   color: rgb(35 117 38)
}

.MemberView .View .Area .TabView .Btn.BtnOrange {
   background-color: rgb(255 87 34/11%);
   color: #ff5722
}

.MemberView .View .Area .TabView .ConnectBox {
   padding: 32px;
   background-color: rgba(0,0,0,.04);
   border-radius: 8px;
   margin-top: 31px
}

.MemberView .View .Area .TabView .ConnectBox .Divider {
   height: 1px;
   background-color: rgb(0 0 0/11%);
   border-radius: 8px;
   margin: 30px 0 10px
}

.MemberView .View .Area .TabView .Text>a {
   color: #2196f3
}

.MemberView .View .Area .TabView .Box {
   border: 1px solid #e5e5e5;
   border-radius: 8px;
   padding: 32px;
   margin-top: 40px;
   margin-bottom: 40px;
   background: 0 0
}

.MemberView .View .Area .TabView .Box .CheckGroup {
   display: flex;
   justify-content: space-between;
   align-items: center
}

.MemberView .View .Area .TabView .Box .CheckGroup:not(:first-child) {
   margin-top: 14px
}

.MemberView .View .Area .TabView .Box .CheckGroup .Text {
   display: flex;
   flex-direction: column
}

.MemberView .View .Area .TabView .Box .CheckGroup .Text>span:nth-child(1) {
   font-size: 14px;
   font-weight: 700;
   line-height: 1.5;
   letter-spacing: -.28px;
   color: #484848
}

.MemberView .View .Area .TabView .Box .CheckGroup .Text>span:nth-child(2) {
   font-family: Inter,-apple-system,Helvetica Neue,sans-serif;
   font-size: 14px;
   line-height: 1.5;
   letter-spacing: -.28px;
   color: #646464;
   margin-top: 13px;
   margin-right: 16px
}

.MemberView .View .Area .TabView .Box .CheckGroup .Check {
   position: relative;
   display: inline-block;
   width: 60px;
   height: 34px
}

.MemberView .View .Area .TabView .CouponItem {
   display: flex;
   height: 150px;
   width: calc(50% - 20px);
   align-items: center;
   justify-content: space-between;
   margin: 0 10px 16px;
   padding: 10px 12px;
   border-radius: 8px;
   position: relative;
   font-family: Inter,-apple-system,BlinkMacSystemFont,Arial,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif!important;
   letter-spacing: -.025em;
   border: 1px solid #cdcdcd;
   background-color: #fff
}

.MemberView .View .Area .TabView .CouponItem.S1 {
   border: 1px solid #ffbf99
}

.MemberView .View .Area .TabView .CouponItem.My.S1 {
   background: #ffbf991c
}

.MemberView .View .Area .TabView .CouponItem>.Left {
   display: flex;
   flex-direction: column;
   flex: none;
   width: 60%
}

.MemberView .View .Area .TabView .CouponItem>.Left>.Name {
   width: 100%;
   font-weight: 600;
   font-size: 16px;
   line-height: 18px;
   color: #484848;
   word-break: break-word;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   flex: 1
}

.MemberView .View .Area .TabView .CouponItem>.Left>.Text {
   width: 100%;
   font-weight: 600;
   font-size: 16px;
   line-height: 18px;
   color: #484848;
   word-break: break-word;
   margin-bottom: 4px;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   flex: 1
}

.MemberView .View .Area .TabView .CouponItem>.Left>.Date {
   display: flex;
   font-weight: 500;
   font-size: 11px;
   line-height: 16px;
   color: #666;
   margin-right: 8px;
   margin-bottom: 8px
}

.MemberView .View .Area .TabView .CouponItem>.Left>.Status {
   width: 100%
}

.MemberView .View .Area .TabView .CouponItem>.Center {
   display: flex;
   flex-direction: column;
   flex: 1;
   width: 16px;
   flex: none
}

.MemberView .View .Area .TabView .CouponItem>.Center>span:nth-child(1) {
   height: 8px;
   width: 16px;
   border: 1px solid #bcbcbc;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
   border-bottom: 0;
   background-color: #fff;
   box-sizing: border-box;
   position: absolute;
   box-shadow: 0 1px 0 0 #fff;
   bottom: -1px
}

.MemberView .View .Area .TabView .CouponItem.S1>.Center>span:nth-child(1) {
   border-color: #ffbf99
}

.MemberView .View .Area .TabView .CouponItem>.Center>span:nth-child(2) {
   margin-top: auto;
   margin-bottom: auto;
   height: 105px;
   padding-left: 7.75px;
   fill: #ccc
}

.MemberView .View .Area .TabView .CouponItem>.Center>span:nth-child(2)>svg {
   stroke: #ccc
}

.MemberView .View .Area .TabView .CouponItem.S1>.Center>span:nth-child(2)>svg {
   stroke: #ffbf99
}

.MemberView .View .Area .TabView .CouponItem>.Center>span:nth-child(3) {
   height: 8px;
   width: 16px;
   border: 1px solid #bcbcbc;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
   border-bottom: 0;
   background-color: #fff;
   box-sizing: border-box;
   position: absolute;
   box-shadow: 0 1px 0 0 #fff;
   top: -1px;
   transform: rotate(180deg)
}

.MemberView .View .Area .TabView .CouponItem.S1>.Center>span:nth-child(3) {
   border-color: #ffbf99
}

.MemberView .View .Area .TabView .CouponItem>.Right {
   display: flex;
   flex-direction: column;
   width: 40%;
   padding: 0 20px
}

.MemberView .View .Area .TabView .CouponItem>.Right>.Discount {
   width: 100%;
   text-align: center;
   font-size: 22px;
   font-weight: 700
}

.MemberView .View .Area .TabView .CouponItem>.Right>.Code {
   width: 100%;
   border: 1px dashed #ccc;
   padding: 12px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 4px;
   margin: 5px 0
}

.MemberView .View .Area .TabView .CouponItem>.Right>.BtnCopy {
   width: 100%;
   background: #009688;
   color: #fff;
   border-radius: 4px;
   text-align: center;
   padding: 7px;
   cursor: pointer
}

@media only screen and (max-width: 991px) {
   .MobilNav {
       display:block
   }

   .MemberView .View .Area .TitleArea .Back {
       display: flex;
   }

   .col-6 {
       width: 100%
   }

   .MemberView .View .Area .PageView .TabView .Title {
       font-size: 14px;
       line-height: 15px
   }

   .MemberView .View .Area .PageView .TabList>.TabItem {
       max-width: 50%
   }

   .MemberView .View .Area {
       padding: 0 0px;
       padding-bottom: 80px;
   }
   .MemberView .View .Area .TitleArea{
       margin-bottom: 10px;
       padding: 0 14px;
   }
   .OrderItem.Active .OrderInfo .Status,.OrderItem.Active .OrderInfo .Products{
       display: none;
   }
   .OrderItem.Active{
       margin: 0 24px;
       width: calc(100% - 48px);
       transform: none;
       margin-bottom: 20px;
   }
   .MemberView .View .OrderItem .OrderDetail .OrderInfo{
       display: flex;
       flex-direction: column-reverse;
   }
   .MemberView .View .OrderItem .OrderDetail .OrderInfo .Invoice{
       border-top: 1px solid #ccc;
       padding-top: 10px;
   }
   .OrderItem .OrderDetail .ProductBox .ProductItem>.Info{
       padding: 8px;
   }
   .OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Box{
       padding: 3px;
       border-radius: 4px;
   }
   .OrderItem .OrderDetail .ProductBox .ProductItem>.Info .Box .textL{
       border-radius: 4px !important;
   }

   .MemberView .View .Area .TabView .Box {
       padding: 18px;
       margin: 14px 0
   }

   .MemberView .View .Area .TabView .Box .CheckGroup .Text>span:nth-child(1) {
       font-size: 13px
   }

   .MemberView .View .Area .TabView .Box .CheckGroup .Text>span:nth-child(2) {
       font-size: 12px;
       margin-top: 0
   }

   .MemberView .View .Area .TabView .Box .CheckGroup .Text {
       margin-bottom: 8px
   }

   .MemberView .View .Area .TabView .ConnectBox {
       padding: 18px
   }

   .row.TabListRow {
       position: sticky;
       top: 16px;
       z-index: 1
   }

   .checkboxElements input.checkbox-input:not(:checked)+label.checkbox-label,.checkboxElements input.checkbox-input:checked+label.checkbox-label {
       font-size: 13px
   }

   .MemberView .View .Area .TabView .FormGroup>span {
       font-size: 12px;
       font-weight: 700;
       height: inherit;
       margin-top: 0;
       margin-bottom: 0
   }

   .MemberView .Area .FormGroup {
       margin-bottom: 0
   }

   .MemberView .View .Area .TabView .Text {
       margin-top: 0;
       font-size: 13px;
       line-height: 14px;
       margin-bottom: 8px
   }

   .MemberView .View .Area .TabView .Title {
       font-size: 14px
   }

   .MemberView .View .Area .TabView {
       margin-top: 0
   }

   .MemberView .View .Area .TabList>.TabItem {
       font-size: 13px
   }

   .MemberView .View .Area .TabView {
       width: 100%;
       padding: 0 16px;
   }

   body {
       height: 100%;
       position: absolute!important
   }

   body.ScrollMove {
       height: 100%;
       position: relative!important
   }

   body.viewBag {
       right: 80%
   }

   .HeadBagArea {
       max-width: 80%
   }

   .MemberView .Navi .Item {
       margin-bottom: 0;
       padding: 8px 0
   }

   .MemberView .Navi .Profil {
       margin-bottom: 16px
   }

   .MemberView .View .Area .TabList {
       overflow-x: auto;
       overflow-y: hidden;
       white-space: nowrap;
       position: sticky;
       top: 40px;
       background: #ffff
   }

   .MemberView .Container {
       width: 100%;
       padding: 0 0px;
   }

   .MemberView .Navi {
       width: 100%;
       padding-top: 16px
   }

   .MemberView.View .Navi {
       display: none
   }

   .MemberView .View {
       display: none;
       width: 100%;
       margin: 24px 0;
       padding: 0
   }

   .MemberView.View .View {
       display: block;
       margin-top: 5px;
   }
   .OrderItem {
   width: calc(100% - 48px);
   margin: 0 24px;
}
}

.MobilBottomBar {
   position: fixed;
   box-shadow: 0 0 0 1px #cccccc7d;
   z-index: 1;
   padding: 10px;
   width: 86%;
   justify-content: center;
   align-items: center;
   align-content: center;
   bottom: 15px;
   border-radius: 32px;
   left: 7%;
   background: #fff;
   transition: .3s;
   display: none
}

.MobilBottomBar .Btn {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center
}

.MobilBottomBar .Btn span {
   font-size: 13px
}

.MobilBottomBar .Btn img {
   height: 30px
}

.MobilBottomBar .Btn.Active {
   background: #cccccc63;
   border-radius: 25px
}

@media(max-width: 980px) {
   .MobilBottomBar {
       width:100%;
       left: 0;
       bottom: 0;
       border-radius: 0;
       display: flex
   }

   .Layout_01.Active .MobilBottomBar {
       transform: translateY(100px)
   }

   .Layout_01 .MobilBottomBar.NavHide {
       transform: translateY(100px)
   }
}

@media(max-width: 520px) {
   .MobilBottomBar {
       width:100%;
       left: 0;
       bottom: 0;
       border-radius: 0;
       display: flex
   }

   .Layout_01.Active .MobilBottomBar {
       transform: translateY(100px)
   }

   .Layout_01 .MobilBottomBar.NavHide {
       transform: translateY(100px)
   }
}

.Mod.M100034 {
   display: flex;
   flex-direction: column;
   background: #f6f6f6;
   border-bottom: 40px solid #fff;
   position: relative;
   z-index: 1
}

.Mod.M100034 .TopBar {
   width: 100%;
   background: 0 0
}

.Mod.M100034 .TopBar .Container {
   width: 100%;
   max-width: 1320px;
   margin: 0 auto;
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-bottom: 1px solid #e0e0e0;
   line-height: 36px
}

.Mod.M100034 .TopBar .Container .Left {
   display: flex;
   flex-direction: row;
   gap: 30px
}

.Mod.M100034 .TopBar .Container .Left .Notification {
   width: 100%
}

.Mod.M100034 .TopBar .Container .Left .BtnList {
   display: flex;
   gap: 12px
}

.Mod.M100034 .TopBar .Container .Left .Btn {
   width: max-content
}

.Mod.M100034 .TopBar .Container .Right {
   display: flex;
   gap: 25px;
   align-items: center
}

.Mod.M100034 .TopBar .Container .Right .Btn {
   width: max-content;
   cursor: pointer
}

.Mod.M100034 .TopBar .Container .Right .Btn:hover {
   text-decoration: underline
}

.Mod.M100034 .TopBar .Container .Right .Btn.BtnFollowOrder {
   background: #00000078;
   padding: 0 15px;
   line-height: 22px;
   border-radius: 4px;
   color: #fff
}

.Mod.M100034 .Head {
   background: 0 0;
   border: 0;
   z-index: 1
}

.Mod.M100034 .Head .Container {
   width: 100%;
   max-width: 1320px;
   margin: 0 auto;
   display: flex;
   align-items: center;
   justify-content: space-between;
   line-height: 34px;
   padding: 14px 0
}

.Mod.M100034 .Head .Container .LogoBar {
   margin-right: 30px;
   flex: none;
   cursor: pointer
}

.Mod.M100034 .Head .Container .LocationBar {
   display: flex;
   align-items: center;
   cursor: pointer
}

.Mod.M100034 .Head .Container .LocationBar>svg {
   height: 18px
}

.Mod.M100034 .Head .Container .LocationBar>span {
   border-bottom: 1px dashed;
   font-weight: 600;
   line-height: 16px;
   margin-left: 4px
}

.Mod.M100034 .Head .Container .LocationBar:hover>svg {
   height: 22px
}

.Mod.M100034 .Head .Container .LocationBar:hover>span {
   color: #c93273
}

.Mod.M100034 .Head .Container .BtnList {
   margin-left: auto;
   display: flex
}

.Mod.M100034 .Head .Container .BtnList .Favorite {
   position: relative;
   cursor: pointer
}

.Mod.M100034 .Head .Container .BtnList .Favorite>svg {
   width: 100%;
   position: relative
}

.Mod.M100034 .Head .Container .BtnList .Favorite>span {
   position: absolute;
   text-align: center;
   left: 0;
   top: 0;
   width: 100%
}

.Mod.M100034 .Head .Container .BtnList .Favorite:hover>svg>path {
   fill: #c93273
}

.Mod.M100034 .Head .Container .BtnList .Login {
   position: relative;
   color: #fff;
   padding: 0 12px;
   border-radius: 4px;
   box-shadow: 0 0 0 transparent;
   background-color: #d93c82;
   border-color: #d93c82;
   cursor: pointer;
   margin-left: 24px
}

.Mod.M100034 .Head .Container .BtnList .Bag {
   position: relative;
   margin-left: 24px
}

.Mod.M100034 .Head .Container .BtnList .Bag>a {
   display: block;
   width: 100%;
   position: relative
}

.Mod.M100034 .Head .Container .BtnList .Bag>a>svg {
   width: 100%
}

.Mod.M100034 .Head .Container .BtnList .Bag>a>span {
   position: absolute;
   text-align: center;
   left: 4px;
   top: -8px;
   width: 100%
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind {
   display: none;
   width: 100%;
   position: relative;
   line-height: 15px
}

.Mod.M100034 .Head .Container .BtnList .Bag:hover>a>svg>path {
   fill: #c93273
}

.Mod.M100034 .Head .Container .BtnList .Bag:hover>.Wind {
   display: block
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind>i {
   position: absolute;
   top: 0;
   right: 2px;
   width: 380px;
   display: flex;
   text-align: right;
   font-size: 30px;
   color: #ba1e7d;
   justify-content: flex-end;
   padding-top: 14px;
   padding-right: 6px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea {
   display: flex;
   position: absolute;
   top: 26px;
   background: #fff;
   border: 1px solid #cccccc47;
   border-radius: 6px;
   width: 380px;
   right: 0;
   flex-direction: column;
   box-shadow: -16px 18px 32px -8px #0000006b;
   display: none
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemList {
   max-height: 300px;
   overflow: auto
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem {
   display: flex;
   align-items: flex-start;
   padding: 16px 28px;
   border-bottom: 1px solid #ededed;
   color: #444;
   margin-right: 5px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Photo {
   float: left;
   margin-right: 12px;
   border: 1px solid #ccc
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Photo img {
   height: 80px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info {
   display: flex;
   flex-direction: column;
   width: 100%;
   align-items: flex-start
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Name {
   font-weight: 600;
   margin-bottom: 0;
   font-size: 14px;
   color: #000
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Code {
   display: flex;
   font-size: 12px;
   width: 100%;
   align-items: center
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Code>span {
   flex: none;
   width: initial;
   font-weight: 500;
   padding-left: 5px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Price {
   display: flex;
   justify-content: flex-start;
   font-size: 15px;
   font-weight: 600;
   margin-top: 10px;
   color: #000
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Price kr {
   margin-left: 3px;
   font-size: 13px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Button {
   width: 100%;
   display: flex;
   margin-top: 2px;
   justify-content: flex-end
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Button .Btn {
   font-size: 14px;
   padding: 4px;
   border-radius: 2px;
   cursor: pointer;
   width: initial
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Button .Btn:hover {
   background: #efefef
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItem .Info .Button .Btn.Favorite.Active {
   background: #41a245;
   color: #fff;
   border-color: #41a245
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemTotal {
   display: flex;
   width: 100%;
   justify-content: space-between;
   align-items: center;
   color: #444;
   padding: 14px 30px;
   font-size: 16px;
   border-top: 1px solid #e1e1e1;
   padding-bottom: 0
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemTotal>span:nth-child(1) {
   float: left;
   font-weight: 700
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemTotal>span:nth-child(2) {
   font-weight: 700;
   color: #ba1e7d;
   font-size: 18px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BtnList {
   display: flex;
   padding: 10px 20px;
   padding-top: 0;
   align-items: center;
   justify-content: center;
   width: 100%;
   position: relative;
   z-index: 2;
   background: #fff
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BtnList .Btn {
   padding: 15px;
   text-decoration: none;
   border-radius: 4px;
   margin: 10px;
   font-size: 17px;
   cursor: pointer;
   width: 100%;
   text-align: center
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BtnList .Btn.Bag {
   background: #ba1e7d;
   color: #fff;
   border: 0
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BtnList .Btn.Complete {
   background: #41a245;
   color: #fff;
   border: 0
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadNon {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   position: absolute;
   top: 44px;
   background: #fff;
   border: 1px solid #cccccc47;
   border-radius: 6px;
   padding: 26px;
   width: 300px;
   right: 0;
   box-shadow: -16px 18px 32px -8px #0000006b
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadNon i {
   font-size: 44px;
   color: #ccc;
   margin-bottom: 20px
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadNon span {
   font-size: 14px;
   text-align: center;
   color: #444
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemList::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemList::-webkit-scrollbar-thumb {
   background-color: #9f9f9f8c
}

.Mod.M100034 .Head .Container .BtnList .Bag>.Wind .BagHeadArea .BagItemList::-webkit-scrollbar-track {
   background: #bdbdbd8c
}

.Mod.M100034 .Bottom {
   width: 100%;
   background: 0 0
}

.Mod.M100034 .Bottom .Container {
   width: 100%;
   max-width: 1320px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   line-height: 36px;
   margin: 75px auto
}

.Mod.M100034 .Bottom .Container .LocationBars {
   width: 100%
}

.Mod.M100034 .Bottom .Container .LocationBars .Title {
   width: 100%;
   font-size: 34px;
   max-width: 500px;
   line-height: 50px
}

.Mod.M100034 .Bottom .Container .LocationBars .Text {
   width: 100%;
   font-weight: 600;
   font-size: 14px;
   margin-top: 28px
}

.Mod.M100034 .Bottom .Container .LocationBars .Input {
   width: 70%;
   position: relative
}

.Mod.M100034 .Bottom .Container .LocationBars .Input>input {
   width: 100%;
   border: 1px solid #ccc;
   background: #fff;
   padding: 16px;
   border-radius: 4px
}

.Mod.M100034 .Bottom .Container .LocationBars .Input>svg {
   position: absolute;
   right: 11px;
   top: 11px;
   height: 26px
}

.Mod.M100034 .Bottom .Container .Sliders {
   width: 430px;
   flex: none;
   padding: 0
}

.Mod.M100034 .Bottom .Container .Sliders .Box {
   width: 100%;
   padding: 0;
   background: 0 0;
   border: 0
}

.Mod.M100034 .Bottom .Container .Sliders .Box .Item {
   background: #c93273bd;
   padding: 42px;
   display: none
}

.Mod.M100034 .Bottom .Container .Sliders .Box .Item.Active {
   display: block
}

.Mod.M100034 .Bottom .Container .Sliders .Box .Item .SmallText {
   width: 100%;
   font-size: 14px;
   color: #fff;
   text-transform: uppercase;
   font-weight: 600
}

.Mod.M100034 .Bottom .Container .Sliders .Box .Item .Title {
   width: 100%;
   font-size: 34px;
   color: #fff
}

.Mod.M100034 .Bottom .Container .Sliders .Box .Item .Text {
   width: 100%;
   color: #fff;
   font-size: 22px;
   line-height: 26px;
   margin-top: 20px
}

.nonHomePage .Mod.M100034 .Bottom {
   display: none
}

.nonHomePage .Mod.M100034::before {
   display: none
}

.Mod.M100034 .Navs {
   width: 100%;
   border-bottom: 1px solid #e7e7e7;
   background: #fff;
   border-top: 1px solid #e7e7e7
}

.Mod.M100034 .Navs .Container {
   width: 100%;
   max-width: 1320px;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   line-height: 36px;
   margin: 0 auto;
   flex-direction: row
}

.Mod.M100034 .Navs .BtnSearch {
   margin-right: 20px;
   cursor: pointer
}

.Mod.M100034 .Navs .BtnSearch>svg {
   height: 24px
}

.Mod.M100034 .Navs .BtnSearch>svg>path {
   color: #919191
}

.Mod.M100034 .Navs .BtnSearch:hover>svg>path {
   color: #c93273
}

.Mod.M100034 .Navs .BtnSearch>span {
   display: none
}

.Mod.M100034 .Navs .MenuList {
   display: flex;
   gap: 14px
}

.Mod.M100034 .Navs .MenuList .MenuTab {
   position: relative
}

.Mod.M100034 .Navs .MenuList .MenuTab:first-child {
}

.Mod.M100034 .Navs .MenuList .MenuTab:last-child {
   border-right: 0
}

.Mod.M100034 .Navs .MenuList .MenuTab i {
   margin-left: 10px;
   font-size: 16px;
   line-height: 18px
}

.Mod.M100034 .Navs .MenuList .MenuTab.BtnHome {
   padding: 0 8px;
   float: left;
   line-height: 32px;
   background: #fff;
   cursor: pointer;
   color: #000;
   font-size: 29px;
   border-left: 0;
   text-decoration: none;
   display: none
}

.Mod.M100034 .Navs .MenuList .MenuTab.BtnHome:hover {
   background: #014d71;
   border-bottom: 0;
   height: 52px;
   color: #fff
}

.Mod.M100034 .Navs .MenuList .MenuTab>a {
   font-size: 15px;
   color: #000;
   cursor: pointer;
   text-decoration: none;
   display: flex;
   border: 1px solid transparent;
   padding: 4px 10px;
   align-items: center;
   font-weight: 600
}

.Mod.M100034 .Navs .MenuList .MenuTab>a .Icon {
   width: 39px;
   height: 40px;
   display: block;
   float: left;
   margin: 7px 3px 10px -9px
}

.Mod.M100034 .Navs .MenuList .MenuTab:hover>a {
   z-index: 2;
   position: relative;
   display: flex
}

.Mod.M100034 .Navs .MenuList .MenuTab.SubNav:hover>a {
   background: #ededed
}

.Mod.M100034 .Navs .MenuList .MenuTab:hover .Penc {
   display: flex
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc {
   display: none;
   position: absolute;
   top: 100%;
   left: 2px;
   width: inherit;
   min-height: 290px;
   box-shadow: 0 10000px 0 10000px #0000008f;
   border-radius: 0 0 2px 2px;
   z-index: 1
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB1 {
   width: 210px;
   float: left;
   padding: 10px 2px;
   background: #fff;
   min-height: 290px;
   box-shadow: -1px 0 0 0 #cccccc42
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB1 a {
   width: 100%
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB2 {
   width: 420px;
   float: left;
   padding: 10px 2px;
   background: #fff;
   box-shadow: -1px 0 0 0 #cccccc42
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB2 a {
   width: 50%
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB3 {
   width: 630px;
   float: left;
   padding: 10px 2px;
   background: #fff;
   box-shadow: -1px 0 0 0 #cccccc42
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB3 a {
   width: 33.33%
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB4 {
   width: 850px;
   float: left;
   padding: 10px 2px;
   background: #fff;
   box-shadow: -1px 0 0 0 #cccccc42
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB4 a {
   width: 25%
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB5 {
   width: 1060px;
   float: left;
   padding: 10px 2px;
   background: #fff;
   box-shadow: -1px 0 0 0 #cccccc42
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub.SB5 a {
   width: 20%
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a {
   float: left;
   font-weight: 400;
   cursor: pointer;
   text-align: left;
   font-size: 13px;
   margin-bottom: 0;
   line-height: initial;
   text-decoration: none
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a:hover {
   background: #f5f5f5
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub>a.Img {
   padding: 10px;
   text-indent: 0;
   background: 0 0
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub>a.Img img {
   width: 100%
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub>a.Img .Name {
   width: 100%;
   text-align: left;
   padding: 5px 2px 10px;
   font-weight: 600
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub>a.Img .Desc {
   width: 100%;
   text-align: left;
   font-size: 14px
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub .SutunAdi {
   width: 100%!important;
   float: left;
   text-align: left;
   font-weight: 600;
   padding: 4px 0 0;
   border-radius: 3px;
   font-size: 16px;
   color: #050505;
   text-indent: 10px;
   margin-bottom: 10px
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub .SutunAdi:hover {
   text-decoration: underline
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a {
   float: left;
   padding: 3px 0 2px;
   font-weight: 400;
   width: 25%;
   text-align: left
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a {
   border-radius: 3px;
   text-indent: 10px;
   padding: 4px 0;
   color: #444;
   font-size: 16px;
   line-height: 17px
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a {
   text-decoration: none;
   cursor: pointer
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a .Badge {
   font-size: 12px;
   border-radius: 4px;
   padding: 0 4px;
   text-indent: 0
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub a:hover::before {
   font-family: "font awesome 5 free";
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   content: "\f111";
   margin-right: 4px;
   font-size: 6px;
   display: none
}

.Mod.M100034 .Navs .MenuList .MenuTab .Penc .Sub .SutunAdi:hover::before {
   display: none
}

.Mod.M100034 .Navs .NavList {
   display: flex;
   gap: 28px
}

.Mod.M100034 .Navs .NavList .NavItem {
   width: max-content
}

.Mod.M100034 .Navs .NavList .NavItem>a {
   font-weight: 500;
   text-transform: uppercase;
   line-height: 48px
}

.Mod.M100034:before {
   animation: fadeIn 3s forwards;
   content: "";
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0
}

.Mod.M100034::before {
   box-shadow: inset 0 0 5px 0 #e5e5e5;
   background: url(https://myglobalflowers.com/img/flower-1.jpg) no-repeat 0 0,url(https://myglobalflowers.com/img/flower-2.jpg) no-repeat 100% 0;
   background-attachment: fixed!important
}

@media(max-width: 1919.98px) {
   .Mod.M100034::before {
       background-position:-6% 0,122% 0
   }
}

@media(max-width: 1679.98px) {
   .Mod.M100034::before {
       background-position:-14% 0,160% 0
   }
}

@media(max-width: 1439.98px) {
   .Mod.M100034::before {
       background:url(https://myglobalflowers.com/img/flower-2.jpg) no-repeat 232% 0
   }
}

@media(max-width: 1279.98px) {
   .Mod.M100034::before {
       background-position:350% 0
   }
}

@media(max-width: 1199.98px) {
   .Mod.M100034::before {
       background-position:448px 0
   }
}

@media(max-width: 1400px) {
   .Mod.M100034 .Head .Container {
       max-width:1180px
   }

   .Mod.M100034 .Bottom .Container {
       width: 100%;
       max-width: 1180px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       line-height: 36px;
       margin: 5px auto
   }
}

@media(max-width: 980px) {
   .Mod.M100034 .TopBar {
       display:none
   }

   .Mod.M100034 .TopBar,.Mod.M100034 .Head .Container .BtnList .Bag>.Wind,.Mod.M100034 .Navs .MenuList,.Mod.M100034 .Bottom .Container .Sliders,.Mod.M100034 .Head .Container .LocationBar,.Mod.M100034 .Head .Container .BtnList .Login {
       display: none!important
   }

   .Mod.M100034 .Head .Container {
       padding: 6px 14px
   }

   .Mod.M100034 .Bottom .Container {
       padding: 16px 28px;
       margin: 0
   }

   .Mod.M100034 .Bottom .Container .LocationBars .Title {
       font-size: 16px;
       line-height: 20px
   }

   .Mod.M100034 .Bottom .Container .LocationBars .Text {
       font-size: 13px;
       margin: 0;
       line-height: 21px;
       margin-bottom: 9px
   }

   .Mod.M100034 .Bottom .Container .LocationBars .Input {
       width: 100%
   }

   .Mod.M100034 .Navs .BtnSearch {
       width: 100%;
       padding: 6px 14px;
       display: flex;
       align-items: center
   }

   .Mod.M100034 .Navs .BtnSearch>span {
       display: flex;
       margin-left: 10px
   }

   .Mod.M100034 {
       border-bottom: 10px solid #fff
   }
}

body.OrderView {
   background: #edf0f3
}

body.OrderView .NotificationTopBar,body.OrderView #scrollToUp {
   display: none!important
}

body.OrderView .PhotoSuccessInfoError {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #ff5722;
   margin: 16px;
   background: #fff;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 1px;
   overflow: hidden;
   padding: 16px;
   font-size: 12px;
   border-radius: 5px
}

body.OrderView .PhotoSuccessInfoError .Title {
   width: 100%;
   font-weight: 600;
   color: red
}

body.OrderView .PhotoSuccessInfoError .Text {
   width: 100%;
   font-size: 11px
}

body.OrderView .PhotoSuccessInfoSuccess {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #4caf50;
   margin: 16px;
   background: #bbe7bd;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 1px;
   overflow: hidden;
   padding: 16px;
   font-size: 12px;
   border-radius: 5px
}

body.OrderView .PhotoSuccessInfoSuccess .Title {
   width: 100%;
   font-weight: 600;
   color: #114d13
}

body.OrderView .PhotoSuccessInfoSuccess .Text {
   width: 100%;
   font-size: 11px;
   color: #09380b;
   line-height: 14px
}

body.OrderView .PhotoSuccessInfo {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #ff5722;
   margin: 16px;
   background: #fff;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 1px;
   overflow: hidden;
   padding: 16px;
   font-size: 12px;
   border-radius: 5px
}

body.OrderView .PhotoSuccessInfo .Title {
   width: 100%;
   font-weight: 600
}

body.OrderView .PhotoSuccessInfo .Text {
   width: 100%;
   font-size: 12px;
   margin-bottom: 10px
}

body.OrderView .PhotoSuccessInfo .Info {
   width: 100%;
   font-size: 10px;
   margin-bottom: 8px
}

body.OrderView .PhotoSuccessInfo .Counter {
   margin-bottom: 8px;
   width: 100%;
   font-weight: 700
}

body.OrderView .PhotoSuccessInfo .Btn {
   background: #36943a;
   color: #fff;
   padding: 10px;
   border-radius: 3px;
   width: fit-content;
   font-size: 11px;
   font-weight: 600;
   cursor: pointer
}

body.OrderView .PhotoSuccessInfo .Btn.Line {
   background: 0 0;
   color: #2196f3;
   text-decoration: underline;
   padding: 0;
   border-radius: 3px;
   width: fit-content;
   font-size: 11px;
   font-weight: 600;
   cursor: pointer
}

body.OrderView .Gallery {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #fff;
   margin: 16px;
   background: #fff;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 14px;
   overflow: hidden
}

body.OrderView .Gallery {
   width: 100%;
   border-radius: 0;
   height: 420px;
   margin: 0;
   background-position: 50%;
   background-size: 200%
}

body.OrderView .BankAccount {
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   background: #fff;
   height: 100%;
   padding: 14px;
   display: none
}

body.OrderView .BankAccount.Active {
   display: block
}

body.OrderView .BankAccount .Head {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   padding: 6px;
   border-radius: 0;
   background: #fff;
   border: 0;
   display: flex;
   border-bottom: 1px solid #ccc
}

body.OrderView .BankAccount .Head .BtnBack {
   display: flex;
   font-size: 12px;
   align-items: center;
   flex: none;
   width: 80px;
   border-right: 1px solid #ccc;
   padding-right: 5px
}

body.OrderView .BankAccount .Head .BtnBack>svg {
   display: flex;
   font-size: 12px;
   transform: rotate(180deg);
   margin-right: 6px;
   width: 20px
}

body.OrderView .BankAccount .Head .BtnBack>span {
   font-size: 11px;
   width: 100%
}

body.OrderView .BankAccount .Head .Name {
   display: flex;
   font-size: 12px;
   flex-direction: column;
   padding-left: 10px
}

body.OrderView .BankAccount .Head .Name>span:nth-child(1) {
   font-weight: 700;
   font-size: 14px;
   line-height: 15px
}

body.OrderView .BankAccount .Head .Name>span:nth-child(2) {
   font-weight: 400;
   font-size: 10px
}

body.OrderView .BankAccount .List {
   width: 100%;
   padding: 20px 0
}

body.OrderView .BankAccount .List .BankItem {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   background: #efefef
}

body.OrderView .BankAccount .List .BankItem>div {
   width: 100%;
   display: flex;
   flex-direction: column;
   margin-top: 7px
}

body.OrderView .BankAccount .List .BankItem>div>span:nth-child(1) {
   width: 100px;
   flex: none;
   font-size: 12px
}

body.OrderView .BankAccount .List .BankItem>div>span:nth-child(2) {
   width: 100%;
   text-align: left;
   flex: none;
   font-weight: 700;
   font-size: 12px
}

body.OrderView .BankAccount .List .BankItem>div>span:nth-child(3) {
   width: 100%;
   font-size: 12px
}

body.OrderView .BankAccount .List .BankItem>div>span:nth-child(3)>span:nth-child(1) {
   width: 100%
}

body.OrderView .BankAccount .List .BankItem>div>span:nth-child(3)>span:nth-child(2) {
   width: 100%
}

body.OrderView .Note {
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   background: #fff;
   height: 100%;
   padding: 14px;
   display: none;
   z-index: 11
}

body.OrderView .Note.Active {
   display: block
}

body.OrderView .Note .Head {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   padding: 6px;
   border-radius: 0;
   background: #fff;
   border: 0;
   display: flex;
   border-bottom: 1px solid #ccc
}

body.OrderView .Note .Head .BtnBack {
   display: flex;
   font-size: 12px;
   align-items: center;
   flex: none;
   width: 80px;
   border-right: 1px solid #ccc;
   padding-right: 5px
}

body.OrderView .Note .Head .BtnBack>svg {
   display: flex;
   font-size: 12px;
   transform: rotate(180deg);
   margin-right: 6px;
   width: 20px
}

body.OrderView .Note .Head .BtnBack>span {
   font-size: 11px;
   width: 100%
}

body.OrderView .Note .Head .Name {
   display: flex;
   font-size: 12px;
   flex-direction: column;
   padding-left: 10px
}

body.OrderView .Note .Head .Name>span:nth-child(1) {
   font-weight: 700;
   font-size: 14px;
   line-height: 15px
}

body.OrderView .Note .Head .Name>span:nth-child(2) {
   font-weight: 400;
   font-size: 10px
}

body.OrderView .Note .Btn.BtnNote {
   width: 100%;
   background: #4caf50;
   color: #fff;
   padding: 9px;
   text-align: center;
   border-radius: 2px;
   border: 1px solid #40a544;
   margin-top: 20px;
   position: sticky;
   bottom: 5px
}

body.OrderView .Note .Input {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   margin-top: 14px
}

body.OrderView .Note .Input input {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start
}

body.OrderView .Note .Input textarea {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   min-height: 160px;
   font-family: system-ui;
   line-height: 19px
}








body.OrderView .Comment {
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   background: #fff;
   height: 100%;
   padding: 14px;
   display: none;
   z-index: 11
}

body.OrderView .Comment.Active {
   display: block
}

body.OrderView .Comment .Head {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   padding: 6px;
   border-radius: 0;
   background: #fff;
   border: 0;
   display: flex;
   border-bottom: 1px solid #ccc
}
body.OrderView .Comment .TitleText {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   border: 0;
   display: flex;
   font-size: 12px;
   margin-top: 25px;
}
body.OrderView .Comment .Head .BtnBack {
   display: flex;
   font-size: 12px;
   align-items: center;
   flex: none;
   width: 80px;
   border-right: 1px solid #ccc;
   padding-right: 5px
}

body.OrderView .Comment .Head .BtnBack>svg {
   display: flex;
   font-size: 12px;
   transform: rotate(180deg);
   margin-right: 6px;
   width: 20px
}

body.OrderView .Comment .Head .BtnBack>span {
   font-size: 11px;
   width: 100%
}

body.OrderView .Comment .Head .Name {
   display: flex;
   font-size: 12px;
   flex-direction: column;
   padding-left: 10px
}

body.OrderView .Comment .Head .Name>span:nth-child(1) {
   font-weight: 700;
   font-size: 14px;
   line-height: 15px
}

body.OrderView .Comment .Head .Name>span:nth-child(2) {
   font-weight: 400;
   font-size: 10px
}

body.OrderView .Comment .Btn.BtnProductComment {
   width: 100%;
   background: #4caf50;
   color: #fff;
   padding: 9px;
   text-align: center;
   border-radius: 2px;
   border: 1px solid #40a544;
   margin-top: 20px;
   position: sticky;
   bottom: 5px
}

body.OrderView .Comment .Input {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   margin-top: 8px;
}
body.OrderView .Comment .Input.Starts {
   width: 100%;
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-top: 0px;
}
body.OrderView .Comment .Input.Starts>div {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-top: 14px;
   justify-content: center;
   gap: 4px;
   align-content: center;
}
body.OrderView .Comment .Input.Starts>div>div:nth-child(1) {
   font-size: 22px;
   color: #9d9d9d;
}
body.OrderView .Comment .Input.Starts>div>div:nth-child(2) {
   width: 100%;
   font-size: 12px;
   text-align: center;
}
body.OrderView .Comment .Input.Starts>div.selected {
   color: #ec9109;
}
body.OrderView .Comment .Input.Starts>div.selected>div:nth-child(1) {
   color: #ffc109;
}

body.OrderView .Comment .Input input {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start
}

body.OrderView .Comment .Input textarea {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   min-height: 160px;
   font-family: system-ui;
   line-height: 19px
}









body.OrderView .OrderInfo {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #fff;
   margin: 16px;
   background: #fff;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 1px;
   overflow: hidden
}

body.OrderView .ProductTitle {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   margin: 24px 16px 0;
   border-radius: 14px;
   overflow: hidden;
   font-weight: 600
}

body.OrderView .OrderInfo .Title {
   width: 100%;
   font-size: 14px;
   font-weight: 500;
   color: #000;
   padding: 6px 14px;
   background: #edf0f3
}

body.OrderView .OrderInfo .Item {
   width: 100%;
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: flex-start;
   line-height: 22px;
   padding: 0 14px;
   background: #efefef4d
}

body.OrderView .OrderInfo .Item>svg {
   height: 26px;
   flex: none;
   margin-right: 4px
}

body.OrderView .OrderInfo .Item>span:nth-child(1) {
   font-weight: 400;
   width: 120px;
   flex: none;
   font-size: 12px
}

body.OrderView .OrderInfo .Item>span:nth-child(2) {
   font-weight: 400;
   width: 10px;
   flex: none
}

body.OrderView .OrderInfo .Item>span:nth-child(3) {
   margin-left: auto;
   color: #000;
   font-size: 12px;
   font-weight: 500
}

body.OrderView .PacketItem>.Item {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid #eaeaea;
   padding: 24px 14px;
   border-radius: 0;
   background: #fff
}

body.OrderView .PacketItem.Active>.Item {
   width: 100%;
   display: flex;
   flex-direction: column;
   border: 0;
   padding: 0;
   overflow: auto
}

body.OrderView .PacketItem.Active>.Item>.Photo {
   width: 100%;
   flex: auto;
   margin: 0;
   margin-bottom: 16px;
   border-bottom: 1px solid #f1f1f1;
   margin-top: 40px;
   display: flex;
   justify-content: center
}

body.OrderView .PacketItem.Active>.Item>.Photo>img {
   height: inherit;
   width: initial;
   max-height: 270px
}

body.OrderView .ProductList {
   padding: 14px;
   border-radius: 12px;
   overflow: hidden;
   padding-top: 0
}

body.OrderView .PacketItem {
   margin-bottom: -1px;
   box-shadow: 0 2px 9px -8px #000;
   width: 100%
}

body.OrderView .PacketItem .Head {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   border-bottom: 1px solid #d5d5d5;
   padding: 6px;
   border-radius: 0;
   background: #fff;
   border: 0;
   display: none
}

body.OrderView .PacketItem.Active .Head {
   display: flex;
   border-bottom: 1px solid #ccc
}

body.OrderView .PacketItem .Head .BtnBack {
   display: flex;
   font-size: 12px;
   align-items: center;
   flex: none;
   width: 80px;
   border-right: 1px solid #ccc
}

body.OrderView .PacketItem .Head .BtnBack>svg {
   display: flex;
   font-size: 12px;
   transform: rotate(180deg);
   margin-right: 6px;
   width: 20px
}

body.OrderView .PacketItem .Head .BtnBack>span {
   font-size: 11px;
   width: 100%
}

body.OrderView .PacketItem .Head .Name {
   display: flex;
   font-size: 12px;
   flex-direction: column;
   padding-left: 10px
}

body.OrderView .PacketItem .Head .Name>span:nth-child(1) {
   font-weight: 700;
   font-size: 14px;
   line-height: 15px
}

body.OrderView .PacketItem .Head .Name>span:nth-child(2) {
   font-weight: 400;
   font-size: 10px
}

body.OrderView .PacketItem.Active {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   border: 1px solid #eaeaea;
   padding: 14px;
   background: #fff;
   position: fixed;
   top: 0;
   bottom: 0;
   z-index: 1;
   flex-direction: column;
   left: 0
}

body.OrderView .PacketItem>.Item>.Photo {
   width: 80px;
   flex: none;
   text-align: center;
   margin-right: 10px
}

body.OrderView .PacketItem>.Item>.Photo>img {
   height: 88px
}

body.OrderView .PacketItem>.Item>.Info {
   width: 100%;
   display: flex;
   flex-direction: column;
   position: relative;
   padding-left: 15px
}

body.OrderView .PacketItem>.Item>.Info:before {
   content: "";
   width: 1px;
   height: 80%;
   border-left: 1px dotted #dbdbdb;
   position: absolute;
   left: 7px;
   top: 5px
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredName {
   width: 100%;
   position: relative;
   font-weight: 600;
   font-size: 13px;
   line-height: 26px;
   z-index: 1
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredName:before {
   content: "";
   width: 5px;
   height: 10px;
   border-radius: 9px;
   background: #ff5722;
   position: absolute;
   left: -10px;
   top: 7px;
   z-index: 1
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredDate {
   width: 100%;
   position: relative;
   line-height: 26px;
   font-size: 12px
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredDate:before {
   content: "";
   width: 5px;
   height: 10px;
   border-radius: 9px;
   background: #03a9f4;
   position: absolute;
   left: -10px;
   top: 8px
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredAddress {
   width: 100%;
   position: relative;
   display: none;
   font-size: 12px
}

body.OrderView .PacketItem.Active .Item>.Info>.DeliveredAddress {
   display: flex
}

body.OrderView .PacketItem.Active .Item>.Info>.Comment {
   display: flex;
   flex-direction: column;
   border: 1px solid #ffe79d;
   padding: 12px;
   margin-top: 30px;
   margin-bottom: 13px;
   border-radius: 3px;
   background: #fffaea
}

body.OrderView .PacketItem.Active .Item>.Info>.Comment .CommentHead {
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-bottom: 1px solid #fce79d;
   padding-bottom: 8px;
   margin-bottom: 10px
}

body.OrderView .PacketItem.Active .Item>.Info>.Comment .CommentHead>span {
   font-size: 12px;
   font-weight: 700
}

body.OrderView .PacketItem.Active .Item>.Info>.Comment .CommentHead>.Btn {
   background: #fff;
   border: 1px solid #ccc;
   padding: 4px 8px;
   border-radius: 2px;
   font-size: 11px;
   font-weight: 600
}
body.OrderView .PacketItem[S="3"] .Item>.Info>.Comment .CommentHead>.Btn,
body.OrderView .PacketItem[S="4"] .Item>.Info>.Comment .CommentHead>.Btn,
body.OrderView .PacketItem[S="5"] .Item>.Info>.Comment .CommentHead>.Btn,
body.OrderView .PacketItem[S="6"] .Item>.Info>.Comment .CommentHead>.Btn
{
   display:none
}
body.OrderView .PacketItem.Active .Item>.Info>.Comment .CommentBody {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   flex-direction: column
}

body.OrderView .PacketItem.Active .Item>.Info>.Comment .CommentBody>div:nth-child(1) {
   font-size: 11px
}

body.OrderView .PacketItem.Active .Item>.Info>.Comment .CommentBody>div:nth-child(2) {
   font-size: 12px;
   font-weight: 700
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredAddress:before {
   content: "";
   width: 5px;
   height: 10px;
   border-radius: 9px;
   background: #03a9f4;
   position: absolute;
   left: -10px;
   top: 5px
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredCity {
   width: 100%;
   position: relative;
   font-size: 12px;
   line-height: 26px
}

body.OrderView .PacketItem>.Item>.Info>.DeliveredCity:before {
   content: "";
   width: 5px;
   height: 10px;
   border-radius: 9px;
   background: #03a9f4;
   position: absolute;
   left: -10px;
   top: 7px
}
body.OrderView .PacketItem>.Item>.Info>.Comment {
   width: 100%;
   position: relative;
   display: none
}


body.OrderView .PacketItem>.Item>.Info>.ProductComment {
   width: 100%;
   position: relative;
   display: none
}
body.OrderView .PacketItem.Active .Item>.Info>.ProductComment {
   display: flex;
   flex-direction: column;
   border: 1px solid #e3e3e3;
   padding: 8px;
   border-radius: 3px;
   background: #eeeeee;
}
body.OrderView .PacketItem>.Item>.Info>.ProductComment .Btn {
   width: 100%;
   display: flex;
   gap: 4px;
   align-items: center;
}
body.OrderView .PacketItem>.Item>.Info>.ProductComment .Btn > span:nth-child(1){
   font-size: 12px;
   color: #ccc;
}
body.OrderView .PacketItem>.Item>.Info>.ProductComment .Btn > span:nth-child(2){
   font-size: 12px;
   font-weight: 400;
   color: #000;
}

body.OrderView .PacketItem[comment="1"]>.Item>.Info>.ProductComment {
   background: #c6ffc9;
   border-color: #83e086;
}
body.OrderView .PacketItem[comment="1"]>.Item>.Info>.ProductComment .Btn > span:nth-child(1){
   font-size: 16px;
   color: #ffd045;
}
body.OrderView .PacketItem[comment="1"]>.Item>.Info>.ProductComment .Btn > span:nth-child(2){
   font-weight: bold;
   color: #054108;
}
body.OrderView .PacketItem>.Item>.Info>.OrderStatus {
   position: relative;
   background: #2969b1;
   color: #fff;
   font-size: 12px;
   padding: 1px 12px;
   border-radius: 4px;
   width: fit-content;
   margin-left: 10px
}

body.OrderView .PacketItem>.Item>.Info>.OrderStatus:before {
   content: "";
   width: 10px;
   height: 10px;
   border-radius: 100%;
   background: #0e69b1;
   position: absolute;
   left: -22px;
   bottom: 5px
}

body.OrderView .PacketItem>.Item>.Info>.OrderStatus:after {
   content: "";
   width: 18px;
   height: 2px;
   border-radius: 100%;
   background: #0e69b1;
   position: absolute;
   left: -15px;
   bottom: 9px
}

body.OrderView .PacketItem>.Item>.Arrow {
   width: 20px;
   flex: none
}

body.OrderView .PacketItem.Active>.Item>.Arrow {
   display: none
}

body.OrderView .PacketItem>.Item>.Arrow>svg {
   height: 20px
}

body.OrderView .BankPaymentsWait {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #4caf50;
   margin: 16px;
   background: #bbe7bd;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 1px;
   overflow: hidden;
   padding: 16px;
   font-size: 12px;
   border-radius: 5px
}

body.OrderView .BankPaymentsWait .Title {
   width: 100%;
   font-weight: 600;
   color: #114d13
}

body.OrderView .BankPaymentsWait .Text {
   width: 100%;
   font-size: 11px;
   color: #09380b;
   line-height: 14px
}

body.OrderView .BankPayments {
   width: calc(100% - 32px);
   display: flex;
   flex-direction: column;
   border: 1px solid #ff5722;
   margin: 16px;
   background: #fff;
   box-shadow: 0 2px 9px -8px #000;
   border-radius: 1px;
   overflow: hidden;
   padding: 16px;
   font-size: 12px;
   border-radius: 5px
}

body.OrderView .BankPayments .Title {
   width: 100%;
   font-weight: 600
}

body.OrderView .BankPayments .Text {
   width: 100%;
   font-size: 12px;
   margin-bottom: 10px
}

body.OrderView .BankPayments .Info {
   width: 100%;
   font-size: 10px;
   margin-bottom: 20px
}

body.OrderView .BankPayments .Btn {
   background: #ff5722;
   color: #fff;
   padding: 10px;
   border-radius: 3px;
   width: fit-content;
   font-size: 11px;
   font-weight: 600;
   cursor: pointer
}

body.OrderView .BankPayments .Btn.Line {
   background: 0 0;
   color: #2196f3;
   text-decoration: underline;
   padding: 0;
   border-radius: 3px;
   width: fit-content;
   font-size: 11px;
   font-weight: 600;
   cursor: pointer
}

body.OrderView .ErrorPhoto {
   width: 100%;
   position: fixed;
   top: 0;
   left: 0;
   background: #fff;
   height: 100%;
   padding: 14px;
   display: none;
   z-index: 11
}

body.OrderView .ErrorPhoto.Active {
   display: block
}

body.OrderView .ErrorPhoto .Head {
   width: 100%;
   align-items: center;
   justify-content: flex-start;
   padding: 6px;
   border-radius: 0;
   background: #fff;
   border: 0;
   display: flex;
   border-bottom: 1px solid #ccc
}

body.OrderView .ErrorPhoto .Head .BtnBack {
   display: flex;
   font-size: 12px;
   align-items: center;
   flex: none;
   width: 80px;
   border-right: 1px solid #ccc;
   padding-right: 5px
}

body.OrderView .ErrorPhoto .Head .BtnBack>svg {
   display: flex;
   font-size: 12px;
   transform: rotate(180deg);
   margin-right: 6px;
   width: 20px
}

body.OrderView .ErrorPhoto .Head .BtnBack>span {
   font-size: 11px;
   width: 100%
}

body.OrderView .ErrorPhoto .Head .Name {
   display: flex;
   font-size: 12px;
   flex-direction: column;
   padding-left: 10px
}

body.OrderView .ErrorPhoto .Head .Name>span:nth-child(1) {
   font-weight: 700;
   font-size: 14px;
   line-height: 15px
}

body.OrderView .ErrorPhoto .Head .Name>span:nth-child(2) {
   font-weight: 400;
   font-size: 10px
}

body.OrderView .ErrorPhoto .Btn.BtnNote {
   width: 100%;
   background: #f10;
   color: #fff;
   padding: 9px;
   text-align: center;
   border-radius: 2px;
   border: 1px solid #c61104;
   margin-top: 20px;
   position: sticky;
   bottom: 5px
}

body.OrderView .ErrorPhoto .Input {
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   margin-top: 14px
}

body.OrderView .ErrorPhoto .Input input {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start
}

body.OrderView .ErrorPhoto .Input textarea {
   width: 100%;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 14px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   min-height: 160px;
   font-family: system-ui;
   line-height: 19px
}

.MemberView .View .Area[T='/degerlendirmelerim'] .TabView {
   width:100%
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item{
   width:100%;
   border: 1px solid #efefef;
   border-radius: 4px;
   display: flex;
   padding: 12px;
   background: #fff;
   border-radius: 4px;
   margin-bottom: 10px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item .Product{
   width:100%;
   display: flex;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item .Product .Photo{
   margin-right: 20px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item .Product .Photo>img{
   height: 120px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item .Product>.Info{
   width:100%
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item .Product>.Info .Name{
   width:100%;
   font-size: 13px;
   font-weight: 600;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item .Product>.Info .Price{
   width:100%;
   font-size: 14px;
   font-weight: 600;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info{
   width:100%;
   display: flex;
   flex-direction: column;
   max-width: 520px;
   flex: none;
   border-left: 1px dashed #ccc;
   padding-left: 12px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Name{
   width:100%;
   font-size: 14px;
   margin-bottom: 0px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Date{
   width:100%;
   font-weight: 600;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Point{
   width:100%;
   display: flex;
   margin-top: 4px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Point>div.Star{
   margin-right: 4px;
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Point>div.Star.Selected {
   color: #ffc107;
   opacity: .8
}

.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Point>div.Star.Active::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   color: #ffc107
}

.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Point>div.Star::before {
   content: "\f005";
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-size: 12px;
   font-weight: 400;
   -webkit-font-smoothing: antialiased;
   display: inline-block;
   font-style: normal;
   font-variant: normal;
   text-rendering: auto;
   color: #ccc;
   line-height: 1
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Point>div.Star.Active{
}
.MemberView .View .Area[T='/degerlendirmelerim'] .TabView .Item>.Info .Comment{
   width:100%;
   font-size: 14px;
   line-height: 16px;
   padding-top: 10px;
}
  
     
.NotificationTopBar{background: #f5e3e7;display: flex;justify-content: center;align-items: center;}
.NotificationTopBar .Text{color: #2c2d2e;line-height: 28px;text-align: center;font-weight: 500;font-size: 12px;}


.CookiesBar{
   position: fixed;
   left: 10px;
   right: 10px;
   bottom: 10px;
   width: calc( 100% - 20px );
   background: rgb(34 34 34 / 88%);
   border-radius: 4px;
   padding: 12px;
   color: #fff;
   line-height: 20px;
   display: none;
   z-index: 1111;
}
.CookiesBar.Show,.CookiesBar.show{
   display: block;
}
.CookiesBar .CookieText{
   max-width: 90%;
}
.CookiesBar a{
   text-decoration:underline;
   cursor:pointer
}
.CookiesBar>.CookieClosed{
   position: absolute;
   right: 10px;
   top: 13px;
   cursor: pointer;
   color: #fff;
   font-size: 22px;
   padding: 2px 10px;
}








section[L=Head] {
   width: 100%;
   position: fixed;
   top: 0;
   z-index: 2;
   background: #ffffffe8;
   transition: .3s;
}

section[L=Footer],section[L=View] {
   width: 100%;
   position: relative;
   z-index: 0
}

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: 42px;
}

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


[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
}
.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{
   width: 100%;
   display: flex
;
   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
}

.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
}

[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>.Container {
   width: 100%;
   max-width: 990px;
   margin: 0 auto;
   display: flex;
}
body[Page=Bag] section[L=Head]+section[L=View], body[Page=Payment] section[L=Head]+section[L=View] {
   padding-top: 75px;
}
body[Page=Payment] .NotificationTopBar{display: none;}
[src="/Library/Img/floLogo.jpg?v3"]{display: none;}


body[Page=Payment] section[L="View"] .BagView .List .Form {
   width: 100%;
   display: flex;
   justify-content: space-between;
   flex-direction: column;
   gap: 18px;
   padding: 0;
   padding-top: 20px;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .Left{
   width: 100%;
   display: flex;
   padding: 0;
   gap: 14px;
   justify-content: space-between;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .Right{
   width: 100%;
   display: flex;
   padding: 0px 0;
   justify-content: space-between;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .Center{
   width: 100%;
   display: flex;
   padding: 0px 0;
   justify-content: space-between;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup {
   padding:0;
   margin: 0;
   background: transparent;
   width: 100%;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup.Focus input{
   border-color: #c3c3c3;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup.Focus textarea{
   border-color:#000
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup i{
   padding:0;
   top: 37px;
   font-size: 18px;
   left: 10px;
   width: 20px;
   z-index: 2;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup span{
   padding:0;
   position: relative;
   left: 0 !important;
   top: 0 !important;
   color: #000;
   font-size: 14px;
   font-weight: 500;
   margin-bottom: 4px;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup .InputArea{
   padding:0
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup .InputArea input{
   line-height: 48px;
   padding: 0;
   font-size: 15px;
   text-indent: 38px;
   border-width: 1px;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup .InputArea input{
   line-height: 48px;
   padding: 0;
   font-size: 15px;
   text-indent: 38px;
   border-width: 1px;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup .InputArea textarea{
   line-height: 48px;
   padding: 0;
   font-size: 15px;
   text-indent: 38px;
   border-width: 1px;
}
body[Page=Payment] section[L="View"] .BagView .List .Form .FormGroup .ErrorText{
   padding:0;
   background: transparent;
   color: #f00;
}

body[Page=Payment] section[L="View"] .BagView .List  .AddressItem{background:#fff}
body[Page=Payment] section[L="View"] .BagView .List  .Invoice{background:#fff}


body[Page=Payment] section[L="View"] .Addition {
   width: 35%;
   padding-left: 30px;
   flex: none;
   display: flex;
   align-items: center;
   flex-direction: column
}

body[Page=Payment] section[L="View"] .Addition .BagTotalMobile {
   display: none
}

body[Page=Payment] section[L="View"] .Addition .Title {
   width: 100%;
   background: #e2e7e9b5;
   border-radius: 4px;
   padding-bottom: 12px
}

body[Page=Payment] section[L="View"] .Addition .Title .Text {
   width: 100%;
   font-weight: 600;
   text-align: center;
   padding: 10px 0
}

body[Page=Payment] section[L="View"] .Addition .Title .Item {
   width: calc(100% - 20px);
   padding: 6px;
   background: #fff;
   margin: 3px 10px;
   border-radius: 3px;
   display: flex;
   justify-content: space-between
}

body[Page=Payment] section[L="View"] .Addition .Title .Item span:nth-child(1) {
   width: 100%;
   color: #5c5c5c
}

body[Page=Payment] section[L="View"] .Addition .Title .Item span:nth-child(2) {
   width: 100%;
   text-align: right;
   font-weight: 500;
   font-size: 16px
}

body[Page=Payment] section[L="View"] .Addition .Title .Item.Total {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   border-bottom: 2px solid #41c346
}

body[Page=Payment] section[L="View"] .Addition .Title .Item.Total span:nth-child(1) {
   width: 100%;
   text-align: center;
   font-size: 22px;
   font-weight: 700
}

body[Page=Payment] section[L="View"] .Addition .Title .Item.Total span:nth-child(1) kr {
   font-size: 14px;
   font-weight: 700
}

body[Page=Payment] section[L="View"] .Addition .Title .Item.Total span:nth-child(2) {
   width: 100%;
   text-align: center
}

body[Page=Payment] section[L="View"] .Addition .Btn.BagResume {
   font-weight: 500;
   background: #41c346;
   padding: 11px 26px;
   font-size: 16px;
   color: #fff;
   border-radius: 4px;
   margin: 10px 0;
   width: fit-content;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%
}

body[Page=Payment] section[L="View"] .Addition .Btn.BagResume:hover {
   background: #2c9b30
}

body[Page=Payment] section[L="View"] .Addition .Btn.BagResume.Disabled {
   background: #f2f2f2;
   color: #919191;
   pointer-event: none
}

body[Page=Payment] section[L="View"] .BagView .List {
   display: flex;
   flex-direction: column;
   width: 100%;
}
body[Page=Payment] section[L="View"] .Addition .Title{background:#fff}
body[Page=Payment] section[L="View"] .Addition .Title .Text{background:#fff;text-align: left;text-transform: uppercase;font-weight: 600;}
body[Page=Payment] section[L="View"] .Addition .Title .Item{padding: 0;margin: 0;width: 100%;display: flex;align-items: center;margin-bottom: 7px;}
body[Page=Payment] section[L="View"] .Addition .Title .Item[P="0"]{display: none;}
body[Page=Payment] section[L="View"] .Addition .GiftArea{border-color: #e7edef;border-radius: 2px;}
body[Page=Payment] section[L="View"] .Addition .Btn.BagResume{background: #000000;border-radius: 1px;margin-top: 20px;}
body[Page=Payment] section[L="View"] .Addition .Title .Item.Total{
   display: flex;
   flex-direction: row-reverse;
   padding: 0;
   margin: 0;
   width: 100%;
   border-radius: 0;
   border-bottom: 2px solid #000;
   padding-bottom: 5px;
   margin-top: 16px;
}
body[Page=Payment] section[L="View"] .Addition .Title .Item.Total span:nth-child(1){
   text-align: right;
   font-family: sans-serif;
   font-size: 16px;
   color: #000;
}
body[Page=Payment] section[L="View"] .Addition .Title .Item.Total span:nth-child(2){
   text-align: left;
   text-transform: uppercase;
}
body[Page=Payment] section[L="View"] .GiftArea>div>.Btn.COUPON_CODE_SEND {
   background: #000;
   color: #fff
}
body[Page=Payment] section[L="View"] .GiftArea>div>.Btn.BTN_COUPON_CODE_SEND {
   background: #000;
   color: #fff
}
[PageType=Payment] .ContentArea .TabView {
   width: 100%;
   display: none;
   position: relative;
   z-index: 1;
}
[PageType=Payment][Steps="1"] .ContentArea .TabView[T=Address], [PageType=Payment][Steps="2"] .ContentArea .TabView[T=Invoice], [PageType=Payment][Steps="3"] .ContentArea .TabView[T=Payment] {
   display: flex;
   flex-direction: column
}

[PageType=Payment][Steps="1"] .PaymentTabList .TabItem[T=Address], [PageType=Payment][Steps="2"] .PaymentTabList .TabItem[T=Invoice], [PageType=Payment][Steps="3"] .PaymentTabList .TabItem[T=Payment] {
   border-bottom: 2px solid;
   opacity: 1;
}

input:-internal-autofill-selected {
   box-shadow: inset 0px 0px 0px 30px #fff;
}


body[Page=Payment] section[L="View"] .BagView .List .Invoice .Form .FormInvoice {
   width: 100%;
   position: relative;
   margin-bottom: 12px;
   background: #fff
}

body[Page=Payment] section[L="View"] .BagView .List .Invoice .Form .FormInvoice i {
   position: absolute;
   left: 15px;
   top: 23px;
   font-size: 22px;
   color: #e2e7e9;
   text-align: center;
   width: 20px
}

body[Page=Payment] section[L="View"] .BagView .List .Invoice .Form .FormInvoice span.Text {
   display: flex;
   position: relative;
   left: 0;
   top: 0;
   z-index: 0;
   font-size: 14px;
   color: #000000;
   font-weight: 500;
   margin-bottom: 4px;
}

body[Page=Payment] section[L="View"] .BagView .List .Invoice .Form .FormInvoice .InputArea {
   background: #fff
}

body[Page=Payment] section[L="View"] .BagView .List .Invoice .Form .FormInvoice input {
   width: 100%;
   outline: none;
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   padding: 8px;
   background: 0 0;
   position: relative;
   z-index: 1;
   text-indent: 0;
   font-size: 14px;
   font-weight: 500;
}

body[Page=Payment] section[L="View"] .BagView .List .Invoice .Form .FormInvoice textarea {
   width: 100%;
   outline: none;
   min-height: 68px;
   resize: none;
   border: 1px solid #e2e7e9;
   border-radius: 4px;
   padding: 8px 8px 8px;
   background: 0 0;
   position: relative;
   z-index: 1;
   font-size: 14px;
   font-weight: 400;
   font-family: inherit
}
body[Page=Payment] section[L="View"] .BagView .List .Pay .PayList .PayItem{background: #fff;margin-right: 7px;border-color: #e2e7e9;font-weight: 600;}
body[Page=Payment] section[L="View"] [T='Payment'] .BagView .List .Form{padding-top: 0;}
body[Page=Payment] section[L="View"] .BagView .List .Pay .Form .PayView .FormArea{display: flex;gap: 10px;flex-direction: column;}
body[Page=Payment] section[L="View"] .BagView .List .Pay .Form .PayView .FormGroup input{background: #fff;border-width: 1px;}
body[Page=Payment] section[L="View"] .BagView .List .Pay .Form .PayView .FormGroup select{background: #fff;border-width: 1px;}
body[Page=Payment] section[L="View"] .BagView .List .Pay .Form .PayView .FormGroup.Focus span.Text{font-size: 14px;color: #000;font-weight: 600;}
.BagView .List .Pay .Form .PayView .FormGroup span.Text:empty{display:none}
.BagView .List .Pay .Form .BtnList .Contract strong{cursor: pointer;text-decoration: underline;}
.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(1){font-size:13px;}
.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(2){font-size:13px;}
.BagView .List .Pay .Form .PayView .Account .Item span:nth-child(3){font-size:13px;font-weight: bold;}


@media (max-width: 1140px) {
   [PageType=Payment].Load .ContentArea {
       top: 117px;
       opacity: 1;
       transition: .3s;
   }
   [PageType=Payment] .ContentArea .Container {
       display: flex;
       flex-direction: column;
       padding: 0 6px 0 16px;
   }
   body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container {
       display: flex;
       justify-content: flex-start;
   }
   body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container .BagCounter {
       opacity: 1;
       margin-left: auto;
   }
   section[L=Head] .Mod.StandartHead>.Container .TheBack {
       height: 54px;
   }
   body[Page=Payment] section[L=Head] .Mod.StandartHead>.Container .Logo {
       position: inherit;
       width: initial;
   }
   body[Page=Bag] section[L=Head]+section[L=View], body[Page=Payment] section[L=Head]+section[L=View] {
       padding-top: 55px;
   }
}




.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: -100%;
   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: 40px 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']>.Step{width:100%;margin-top: 30px;display: none;}
.PopContent[mod='StoreStockView']>.Step.active{display: flex;flex-direction: column;}


.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;!i;!;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;}

.PopContent[mod='StoreStockView']>.Step[S="0"]{padding: 0 40px;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .Text{width:100%;font-size: 12px;font-weight: 300;margin-bottom: 32px;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .SizeList{width:100%;display: flex;gap: 12px;margin-bottom: 30px;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .SizeList .Item{width:100%;border: 1px solid rgb(153 153 153 / 100%);line-height: 40px;text-align: center;font-weight: 300;font-size: 11px;max-width: 80px;cursor: pointer;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .SizeList .Item:hover{border-color: #b7b7b7;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .SizeList .Item.active{border-color: #000;font-weight: bold;}

.PopContent[mod='StoreStockView']>.Step[S="0"] .SizeList .Btn{width:100%}
.PopContent[mod='StoreStockView']>.Step[S="0"] .Btn{width:100%;border: 1px solid #000;line-height: 40px;text-align: center;font-size: 12px;cursor: pointer;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .Btn.Disabled{pointer-events: none;color: #919191;}
.PopContent[mod='StoreStockView']>.Step[S="0"] .Btn:hover{border-color: #b7b7b7;}


.PopContent[mod='StoreStockView']>.Step[S="1"] .SearchBox{width: calc(100% - 80px);border: 1px solid #000;position: relative;display: flex;margin: 0px 40px 30px 40px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .SearchBox input{width:100%;border: 0;outline: none;padding: 12px;font-size: 12px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .SearchBox .Btn{width: 70px;line-height: 40px;font-size: 13px;border-left: 1px solid #000;text-align: center;cursor: pointer;}


.PopContent[mod='StoreStockView']>.Step[S="1"] .BtnText{width: calc(100% - 80px);font-size: 12px;text-decoration: underline;font-weight: 300;line-height: 22px;margin: 0 40px;cursor: pointer;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .BtnText:hover{text-decoration:none}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabList{width:100%;display: flex;align-items: center;justify-content: space-between;margin-top: 30px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabList .TabItem{border-bottom: 1px solid #000000;border-top: 1px solid #000000;width: 100%;text-align: center;line-height: 40px;font-size: 13px;color: #939393;font-weight: 400;cursor: pointer;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabList .TabItem:nth-child(1){border-right: 1px solid #000;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabList .TabItem:nth-child(2){border-right: 1px solid #000;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabList .TabItem.active{color: #000;}

.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView{display: none;width: 100%;overflow: auto;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView::-webkit-scrollbar {
    width: 3px!important;
    height: 3px!important
}

.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView *::-webkit-scrollbar {
    width: 3px!important;
    height: 3px!important
}

.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView::-webkit-scrollbar-thumb {
    background-color: #000000
}

.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView::-webkit-scrollbar-track {
    background: rgb(228 228 228 / 41%)
}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView.active{display: flex;flex-direction: column;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Blank{width:100%;display: none;flex-direction: column;padding: 36px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Blank svg{display: flex;flex-direction: column;margin-bottom: 23px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Blank span:nth-child(1){width:100%;display: flex;flex-direction: row;font-size: 13px;font-weight: 200;line-height: 22px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Blank span:nth-child(2){width:100%;display: flex;flex-direction: row;font-size: 12px;font-weight: 200;line-height: 24px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Blank span:nth-child(3){width:100%;display: flex;flex-direction: row;font-size: 12px;font-weight: 200;line-height: 24px;}

.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List{width:100%;display: flex;flex-direction: column;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item{width:100%;display: flex;border-bottom: 1px solid #000;padding: 20px 40px;justify-content: flex-start;align-items: flex-start;cursor: pointer;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Check{width: 40px;position: relative;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Check:before{content:"";width: 14px;height: 14px;display: block;border: 1px solid #707070;border-radius: 100%;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item.active .Check:after{content:"";display: block;width: 10px;height: 10px;background: #000;border-radius: 100%;position: absolute;top: 3px;left: 3px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info{display: flex;width:100%;flex-direction: column;align-items: flex-start;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .Name{width:100%;font-size: 13px;font-weight: 600;margin-bottom: 4px;text-transform: uppercase;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .Desc{width:100%;font-size: 13px;font-weight: 300;margin-bottom: 4px;color: #575757;margin-bottom: 12px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .Sizes{width:100%;font-size: 12px;color: #575757;font-weight: 300;line-height: 20px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .Address{width:100%;font-size: 12px;color: #575757;font-weight: 300;line-height: 20px;/* display: none; */margin-top: 10px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .BtnText{text-align: left;width: initial;margin: 0;/* display: none; */margin-top: 5px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item.active .Info .Address{display:block}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .Hour{display:none;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item .Info .Maps{display:none}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .List .Item.active .Info .BtnText[S='1']{display:block}


.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Empty{width:100%;display: flex;align-items: flex-start;padding: 50px 40px;text-align: left;align-content: flex-start;flex-direction: column;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Empty svg{height: 34px;}
.PopContent[mod='StoreStockView']>.Step[S="1"] .TabView .Empty div{width:100%;display: flex;flex-direction: column;font-weight: 200;font-size: 12px;margin-top: 8px;}





























[Mod=fr_comment] {
   width: 100%;
   margin: 0 auto;
   font-family: system-ui
}

[Mod=fr_comment] .fr_comment_title {
   display: flex;
   width: 100%;
   align-items: center;
   justify-content: space-between;
   color: #000000;
   font-weight: 400;
   font-size: 20px;
   padding: 0px 0 0px 0;
   text-transform: uppercase;
   font-size: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-family: sans-serif;
   margin-bottom: 20px;
}

[Mod=fr_comment] .fr_comment_arrows {
   display: none;
   align-items: center;
   gap: 14px
}

[Mod=fr_comment] .fr_comment_arrows.show {
   display: flex
}

[Mod=fr_comment] .fr_comment_arrows_prev,[Mod=fr_comment] .fr_comment_arrows_next {
   border-radius: 50%!important;
   background: #fff;
   width: 40px;
   height: 40px;
   display: flex;
   justify-content: center;
   align-items: center;
   flex: none;
   box-shadow: #00000021 0 3px 6px
}

[Mod=fr_comment] .fr_comment_arrows_prev>svg,[Mod=fr_comment] .fr_comment_arrows_next>svg {
   height: 26px;
   fill: #000;
}

[Mod=fr_comment] .fr_comment_empty {
   gap: 7px;
   display: flex;
   width: 100%;
   align-items: center;
   justify-content: center;
   font-size: 14px;
   color: #5c5932
}

[Mod=fr_comment] .fr_comment_empty svg {
   height: 22px;
   fill: #c5c18d
}

[Mod=fr_comment] .fr_comment_ratingBar {
   display: flex;
   width: 100%;
   padding: 16px;
   background: #fffce4;
   border-radius: 9px;
   align-items: center;
   margin: 14px 0
}

[Mod=fr_comment] .fr_comment_starBar {
   display: flex;
   align-items: center;
   margin-right: 20px
}

[Mod=fr_comment] .fr_comment_starBar svg {
   height: 16px;
   fill: #ccc
}

[Mod=fr_comment] .fr_comment_starBar[Rate="1"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="2"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="2"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="3"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="3"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="3"] span:nth-child(3)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-child(3)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="4"] span:nth-child(4)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-child(3)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-child(4)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_starBar[Rate="5"] span:nth-child(5)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_startBar_star {
}

[Mod=fr_comment] .fr_comment_rating {
   max-width: 150px;
   margin-right: 40px
}

[Mod=fr_comment] .fr_comment_rating>span {
   font-size: 22px;
   font-weight: 600
}

[Mod=fr_comment] .fr_comment_rating>i {
   width: 100%
}

[Mod=fr_comment] .fr_comment_all {
   font-size: 14px;
   margin-right: 26px
}

[Mod=fr_comment] .fr_comment_total {
   font-size: 14px
}

[Mod=fr_comment] .fr_comment_sizeText {
   margin-left: auto;
   display: flex;
   font-size: 14px;
   align-items: center
}

[Mod=fr_comment] .fr_comment_sizeText[data=''] {
   display: none
}

[Mod=fr_comment] .fr_comment_sizeText>img {
   margin-right: 26px;
   height: 32px
}

[Mod=fr_comment] .fr_comment_list {
   width: 100%
}

[Mod=fr_comment] .fr_comment_list .flickity-viewport {
   min-height: initial
}

[Mod=fr_comment] .fr_comment_footer {
   width: 100%;
   height: 1px;
   background: #efefef;
   margin: 35px 0 20px;
   display: flex;
   align-items: center;
   justify-content: center;
   display: none
}

[Mod=fr_comment] .fr_comment_footer.show {
   display: flex
}

[Mod=fr_comment] .fr_comment_footer_btn {
   background: #efefef;
   padding: 9px 30px;
   border-radius: 8px;
   font-size: 14px;
   cursor: pointer;
   border: 1px solid transparent
}

[Mod=fr_comment] .fr_comment_footer_btn:hover {
   background: #fff;
   border-color: #efefef
}

[Mod=fr_comment] .fr_comment_list_item {
   background: #fff;
   border: 1px solid #e3e3e3;
   padding: 10px;
   border-radius: 5px;
   width: 320px;
   height: 186px;
   margin-right: 20px;
   display: flex;
   flex-direction: column;
   justify-content: flex-start
}

[Mod=fr_comment] .fr_comment_list_item_stars {
   width: 100%;
   display: flex;
   margin-bottom: 5px
}
[Mod=fr_comment] .fr_comment_list_item_stars>div {
   line-height: 12px;
   margin-right: 5px;
   font-size: 12px;
   font-weight: 600;
}
[Mod=fr_comment] .fr_comment_list_item_stars>span {
   line-height: 12px
}

[Mod=fr_comment] .fr_comment_list_item_stars svg {
   height: 12px;
   fill: #ccc
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="1"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="2"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="2"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="3"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="3"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="3"] span:nth-child(3)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-child(3)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="4"] span:nth-child(4)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-child(1)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-child(2)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-child(3)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-child(4)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_stars[Rate="5"] span:nth-child(5)>svg {
   fill: #f9d602
}

[Mod=fr_comment] .fr_comment_list_item_user {
   width: 100%;
   display: flex;
   margin-bottom: 10px;
   align-items: center
}

[Mod=fr_comment] .fr_comment_list_item_user>div:nth-child(1) {
   font-size: 12px;
   color: #737373;
   margin-right: 18px;
   display: flex;
   align-items: center;
}

[Mod=fr_comment] .fr_comment_list_item_user>div:nth-child(2) {
   font-size: 12px;
   color: #6e6e6e
}

[Mod=fr_comment] .fr_comment_list_item_text {
   width: 100%;
   font-size: 13px;
   line-height: 17px;
   font-weight: 300;
   height: 86px;
   overflow: hidden
}

[Mod=fr_comment] .fr_comment_list_item_text_more {
   position: absolute;
   left: 4px;
   bottom: 27px;
   font-size: 13px;
   line-height: 17px;
   font-weight: 300;
   display: flex;
   align-items: center;
   background: #fff;
   padding: 2px 6px;
   cursor: pointer;
   display: none
}

[Mod=fr_comment] .fr_comment_list_item_text_more.show {
   display: flex
}

[Mod=fr_comment] .fr_comment_list_item_text_more:hover {
   text-decoration: underline
}

[Mod=fr_comment] .fr_comment_list_item_text_more>span {
   width: 100%;
   font-size: 12px;
   line-height: 16px;
   font-weight: 500
}

[Mod=fr_comment] .fr_comment_list_item_text_more>svg {
   height: 15px
}

[Mod=fr_comment] .fr_comment_list_item_foot {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-top: auto
}

[Mod=fr_comment] .fr_comment_list_item_size {
   gap: 3px;
   display: none
}

[Mod=fr_comment] .fr_comment_list_item_size.show {
   display: flex
}

[Mod=fr_comment] .fr_comment_list_item_size>span:nth-child(1) {
   font-size: 12px;
   font-weight: 300
}

[Mod=fr_comment] .fr_comment_list_item_size>span:nth-child(2) {
   font-size: 12px;
   font-weight: 600
}
[Mod=fr_comment] .fr_comment_list_item_source{
   display: flex;
   gap: 5px;
   justify-content: flex-start;
   align-items: center;
   font-size: 12px;
}
[Mod=fr_comment] .fr_comment_list_item_source span:nth-child(1){
   color: #777777;
   font-size: 10px;
}
[Mod=fr_comment] .fr_comment_list_item_source span:nth-child(2){
   display: flex;
   gap: 4px;
   margin-left: auto
}
[Mod=fr_comment] .fr_comment_list_item_like {
   display: flex;
   gap: 4px;
   margin-left: auto
}

[Mod=fr_comment] .fr_comment_list_item_like>i::before {
   content: "";
   display: block;
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   width: 15px;
   height: 14px;
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNC4yNSA5Ljc4NGExIDEgMCAwIDEgMSAxdjExYTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xdi0xMWExIDEgMCAwIDEgMS0xem04LjQxNC04LjU1Yy45NzQtLjEzNSAyLjIyLjQ2NSAyLjgwOCAyLjU2NWE4LjY4NiA4LjY4NiAwIDAgMS0uNTIgNC40MDcuMjUuMjUgMCAwIDAgLjIzNy4zMjhIMjEuNWEyLjUgMi41IDAgMCAxIDEuMjI4IDQuNjc4IDIuMjQ5IDIuMjQ5IDAgMCAxLS45NTkgMy4wNzggMi4yNTEgMi4yNTEgMCAwIDEtMSAzYy4xNTIuMzEuMjMxLjY1LjIzMS45OTUgMCAuNjUtLjI5MiAxLjc1LTIuMjUgMS43NWgtNi41YTE3LjMyOCAxNy4zMjggMCAwIDEtNC4xMDgtLjQ3MWMtLjMwNi0uMDY1LS42My0uMTMyLS45ODctLjJhLjUuNSAwIDAgMS0uNDA1LS40OTFWMTAuNzU3YzAtLjE2NS4wOC0uMzE5LjIxNi0uNDEyQzguODcxIDkuMDMgMTEgNi4wMyAxMSAzLjI4NGEyIDIgMCAwIDEgMS42NjQtMi4wNXpNMyAxOS4yODRhLjc1Ljc1IDAgMSAwIDAgMS41Ljc1Ljc1IDAgMCAwIDAtMS41eiIgZmlsbD0iI0NDQyIvPjwvc3ZnPg==)
}

[Mod=fr_comment] .fr_comment_list_item_like>i {
   height: 15px
}

[Mod=fr_comment] .fr_comment_list_item_like>span {
   font-size: 12px;
   color: #949494
}






.fr_comment_CommentArea {
   position: fixed;
   top: 0;
   width: 100%;
   height: 100%;
   background: #fff;
   z-index: 9999
}

.fr_comment_CommentAreaHeader {
   background: #fff;
   display: flex;
   padding: 20px;
   justify-content: space-between;
   position: absolute;
   top: 0;
   z-index: 10;
   align-items: center
}

.fr_comment_CommentAreaHeaderBtn {
   display: flex;
   align-items: center;
   gap: 10px;
   color: #374151;
   padding: 4px 8px;
   border-radius: 5px;
   cursor: pointer;
   margin-left: 8px;
   position: relative
}

.fr_comment_CommentAreaHeaderBtn.Active {
   background: #f4f4f4;
   color: red
}

.fr_comment_CommentAreaHeaderBtn:hover {
   color: #000
}

.fr_comment_CommentAreaHeaderBtn.BtnBack {
   margin-right: auto
}

.fr_comment_CommentAreaHeaderBtn.BtnBack>i {
   width: 38px;
   height: 38px;
   border-radius: 100%;
   background: #d1d5e4;
   border: 1px solid #ccc;
   flex: none;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-right: 14px;
   cursor: pointer
}

.fr_comment_CommentAreaBody {
   width: 60%;
   margin: 0 auto;
   padding: 25px 0;
   display: flex;
   gap: 0;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   border: 0;
   padding-bottom: 50px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn {
   border: 1px solid #efefef;
   border-radius: 4px;
   padding: 6px;
   display: flex;
   align-items: center;
   font-size: 13px;
   cursor: pointer;
   margin-right: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn:hover {
   border: 1px solid #000
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn.active {
   border: 1px solid #4caf50;
   color: #308a34
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn>span:nth-child(1) {
   line-height: 14px;
   margin-right: 10px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Tags .fr_comment_CommentArea_FilterBtn>span:nth-child(2) {
   line-height: 14px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   border: 0;
   padding-bottom: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn {
   border: 1px solid #efefef;
   border-radius: 4px;
   padding: 6px;
   display: flex;
   align-items: center;
   cursor: pointer;
   margin-right: 12px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn:hover {
   border: 1px solid #000
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn.active {
   border: 1px solid #4caf50;
   color: #308a34
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div {
   display: flex;
   align-items: center;
   margin-right: 20px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div>span {
   line-height: 14px
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div>span>svg {
   height: 12px;
   fill: #ccc
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="1"] span:nth-child(1) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="2"] span:nth-child(1) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="2"] span:nth-child(2) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="3"] span:nth-child(1) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="3"] span:nth-child(2) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="3"] span:nth-child(3) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(1) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(2) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(3) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="4"] span:nth-child(4) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(1) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(2) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(3) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(4) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>div[Rate="5"] span:nth-child(5) svg {
   fill: #f9d602
}

.fr_comment_CommentAreaBody .CommentFilterArea.Ratings .fr_comment_CommentArea_FilterBtn>span {
   font-size: 13px;
   margin-left: auto
}

.fr_comment_CommentAreaBody .CommentFilterArea {
   width: 100%;
   display: flex;
   align-items: center;
   padding-bottom: 14px
}

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

.fr_comment_CommentAreaBody .CommentFilterArea .Searchbox>svg {
   height: 18px;
   position: absolute;
   right: 10px;
   top: 10px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Searchbox>input {
   width: 100%;
   background: #fff;
   border: 1px solid #e7e7e7;
   padding: 12px;
   border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Filterbox {
   width: 100%;
   display: flex;
   align-items: center
}

.fr_comment_CommentAreaBody .CommentFilterArea .Filterbox>span {
   margin-right: 6px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Filterbox>select {
   width: 100%;
   background: #fff;
   border: 1px solid #e7e7e7;
   padding: 11px;
   border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox {
   width: 100%;
   max-width: 340px;
   display: flex;
   align-items: center;
   margin-left: 20px
}

.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>span {
   margin-right: 6px;
   font-size: 14px;
   font-weight: 200
}

.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>svg {
   display: none
}

.fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>select {
   width: 100%;
   background: #fff;
   border: 1px solid #e7e7e7;
   padding: 11px;
   border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentCounter {
   width: 100%;
   margin-bottom: 14px
}

.fr_comment_CommentAreaBody .CommentCounter>.Title {
   width: 100%;
   font-size: 20px;
   font-weight: 600
}

.fr_comment_CommentAreaBody .CommentCounter>.Text {
   width: 100%;
   font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList {
   width: 100%;
   overflow: auto;
   padding-right: 14px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item {
   background: #fff;
   border: 1px solid #e3e3e3;
   padding: 18px;
   border-radius: 5px;
   width: 100%;
   margin-bottom: 16px;
   display: flex;
   flex-direction: column
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_text {
   width: 100%;
   display: flex;
   margin-bottom: 5px;
   font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user {
   width: 100%;
   display: flex;
   margin-top: 15px;
   margin-bottom: 5px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user>div:nth-child(1) {
   font-size: 12px;
   color: #737373;
   margin-right: 18px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user>div:nth-child(2) {
   font-size: 12px;
   color: #6e6e6e
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_user>div:nth-child(3) {
   font-size: 12px;
   color: #2ebf34;
   margin-left: 12px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer {
   width: 100%;
   font-size: 13px;
   line-height: 16px;
   font-weight: 300;
   padding: 11px;
   background: #f5f5f5;
   border-radius: 4px;
   box-sizing: border-box;
   flex: 1
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user {
   width: 100%;
   font-size: 13px;
   line-height: 17px;
   font-weight: 300
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user>div:nth-child(1) {
   width: 100%;
   font-size: 13px;
   line-height: 17px;
   font-weight: 300
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user>div:nth-child(1)>strong {
   font-weight: 600;
   font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_user>div:nth-child(2) {
   width: 100%;
   font-size: 10px;
   line-height: 20px;
   font-weight: 400
}

.fr_comment_CommentAreaBody .CommentList .fr_question_list_item_answer_text {
   width: 100%;
   font-size: 13px;
   line-height: 17px;
   font-weight: 400;
   margin-top: 8px;
   overflow: hidden
}

.fr_comment_CommentAreaBody .CommentMoreBtn {
   margin-top: 24px;
   background: #efefef;
   padding: 12px 30px;
   border-radius: 3px;
   border: 1px solid transparent;
   cursor: pointer;
   /* furkan */
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   position: relative;
}
/* furkan start */
.fr_comment_CommentAreaBody .CommentMoreBtn.loading {
   pointer-events: none;
   opacity: 0.7;
}

.fr_comment_CommentAreaBody .CommentMoreBtn .spinner {
   display: none;
   width: 20px;
   height: 20px;
   border: 2px solid rgba(0, 0, 0, 0.1);
   border-left-color:  #00FFB1;
   border-radius: 50%;
   animation: modsspin 1s linear infinite;
}

.fr_comment_CommentAreaBody .CommentMoreBtn.loading .spinner {
   display: inline-block;
}
/* furkan end */

.fr_comment_CommentAreaBody .CommentMoreBtn:hover {
   background: #fff;
   border-color:  #00FFB1;
   color:  #00FFB1;
}

.fr_comment_CommentAreaBody .CommentList::-webkit-scrollbar {
   width: 6px!important;
   height: 6px!important
}

.fr_comment_CommentAreaBody .CommentList *::-webkit-scrollbar {
   width: 8px!important;
   height: 8px!important
}

.fr_comment_CommentAreaBody .CommentList::-webkit-scrollbar-thumb {
   background-color: #000;
   border-radius: 4px
}

.fr_comment_CommentAreaBody .CommentList::-webkit-scrollbar-track {
   background: rgb(241 241 241/41%)
}

.fr_comment_CommentAreaBody .CommentList .CommentItem {
   width: 100%;
   border-bottom: 1px solid #f2f2f2;
   padding-bottom: 26px;
   margin-bottom: 26px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info {
   width: 100%;
   display: flex;
   justify-content: flex-start
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates {
   display: flex;
   align-items: center;
   margin-right: 12px;
   border-right: 1px solid #ccc;
   padding-right: 12px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates>svg {
   height: 12px;
   fill: #ccc
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="1"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="2"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="2"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="3"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="3"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="3"]>svg:nth-child(3) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(3) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="4"]>svg:nth-child(4) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(3) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(4) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Rates[P="5"]>svg:nth-child(5) {
   fill: #f9c10a
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Date {
   font-size: 12px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Name {
   font-size: 12px;
   margin-right: 12px;
   border-right: 1px solid #ccc;
   padding-right: 12px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Size {
   font-size: 12px;
   margin-left: auto;
   margin-right: 14px;
   border-right: 1px solid #ccc;
   padding-right: 10px;
   display: none
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Size.show {
   display: flex
}
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.fr_comment_list_item_source {
   font-size: 12px;
   display: flex;
   align-items: center;
   margin-left: auto;
   color: #d7d7d7;
   gap: 6px;
}
.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.fr_comment_list_item_source span:nth-child(1) {
   color: #626262;
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Possitive {
   font-size: 12px;
   display: flex;
   align-items: center;
   margin-left: 10px;
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Size.show+.Possitive {
   margin-left: inherit
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Info>.Possitive>i::before {
   content: "";
   display: block;
   background-repeat: no-repeat;
   background-position: center;
   width: 14px;
   height: 14px;
   background-size: 14px;
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNC4yNSA5Ljc4NGExIDEgMCAwIDEgMSAxdjExYTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xdi0xMWExIDEgMCAwIDEgMS0xem04LjQxNC04LjU1Yy45NzQtLjEzNSAyLjIyLjQ2NSAyLjgwOCAyLjU2NWE4LjY4NiA4LjY4NiAwIDAgMS0uNTIgNC40MDcuMjUuMjUgMCAwIDAgLjIzNy4zMjhIMjEuNWEyLjUgMi41IDAgMCAxIDEuMjI4IDQuNjc4IDIuMjQ5IDIuMjQ5IDAgMCAxLS45NTkgMy4wNzggMi4yNTEgMi4yNTEgMCAwIDEtMSAzYy4xNTIuMzEuMjMxLjY1LjIzMS45OTUgMCAuNjUtLjI5MiAxLjc1LTIuMjUgMS43NWgtNi41YTE3LjMyOCAxNy4zMjggMCAwIDEtNC4xMDgtLjQ3MWMtLjMwNi0uMDY1LS42My0uMTMyLS45ODctLjJhLjUuNSAwIDAgMS0uNDA1LS40OTFWMTAuNzU3YzAtLjE2NS4wOC0uMzE5LjIxNi0uNDEyQzguODcxIDkuMDMgMTEgNi4wMyAxMSAzLjI4NGEyIDIgMCAwIDEgMS42NjQtMi4wNXpNMyAxOS4yODRhLjc1Ljc1IDAgMSAwIDAgMS41Ljc1Ljc1IDAgMCAwIDAtMS41eiIgZmlsbD0iI0NDQyIvPjwvc3ZnPg==);
   margin-right: 5px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment {
   background: #efefef;
   padding: 25px;
   border-radius: 10px;
   margin-top: 5px;
   font-size: 14px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment span {
   width: 100%;
   display: flex
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment div {
   border-radius: 6px;
   width: 68px;
   height: 68px;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   cursor: pointer;
   margin-top: 9px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment div+div {
   margin-left: 8px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer {
   width: 100%;
   display: flex;
   margin-top: 24px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>span {
   font-size: 12px;
   margin-right: 40px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>.BtnList {
   display: flex;
   gap: 24px;
   align-items: center;
   font-size: 12px;
   margin-top: -9px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>.BtnList>.Btn {
   cursor: pointer;
   width: 100%;
   display: flex;
   align-items: center;
   gap: 8px
}

.fr_comment_CommentAreaBody .CommentList .CommentItem>.Answer>.BtnList>.Btn>span {
   width: 100%
}

.fr_comment_image_popup {
   position: fixed;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: #00000045;
   z-index: 9999;
   display: flex;
   align-items: center;
   justify-content: center
}

.fr_comment_image_popup_area {
   display: flex;
   width: 900px;
   height: 625px;
   background: #fff;
   border-radius: 8px;
   align-items: flex-start;
   overflow: hidden
}

.fr_comment_image_area_content {
   width: 100%
}

.fr_comment_image_area_content .Counter {
   display: none
}

.fr_comment_image_area_content .List {
   width: 100%
}

.fr_comment_image_area_content .List>.Item {
   display: none;
   align-items: flex-start
}

.fr_comment_image_area_content .List>.Item.show {
   display: flex;
   align-items: flex-start;
   width: 100%
}

.fr_comment_image_area_content .List>.Item>div:nth-child(1) {
   display: flex;
   background: #000;
   height: 625px;
   width: 470px;
   position: relative;
   flex: none;
   align-items: center;
   justify-content: center
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>img {
   width: 470px!important;
   width: fit-content;
   margin: 0;
   padding: 0;
   transform-origin: 0% 0%
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows {
   display: flex;
   gap: 14px;
   z-index: 10;
   position: absolute;
   top: 0;
   bottom: 0;
   margin: auto 0;
   width: 100%;
   padding: 0 14px;
   height: 40px;
   border-radius: 100%;
   display: flex;
   justify-content: space-between;
   align-items: center;
   box-shadow: 0 4px 4px rgba(51,51,51,.16);
   cursor: pointer
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.prev,.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.next {
   border-radius: 50%!important;
   background: #fff!important;
   width: 40px;
   height: 40px;
   display: flex;
   justify-content: center;
   align-items: center;
   flex: none;
   box-shadow: #00000021 0 3px 6px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.prev.Disabled,.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.next.Disabled {
   background: #cbcbcb!important;
   pointer-events: none
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.prev>svg,.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.next>svg {
   height: 26px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2) {
   width: calc(100% - 470px);
   display: flex;
   flex-direction: column;
   position: relative
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Closed {
   position: absolute;
   right: 0;
   color: #757575;
   padding: 6px 13px;
   font-size: 21px;
   cursor: pointer
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   padding: 24px;
   flex-direction: column
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates {
   display: flex;
   align-items: center
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates>svg {
   height: 15px;
   fill: #ccc
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="1"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(3) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(3) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(4) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(1) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(2) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(3) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(4) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(5) {
   fill: #f9c10a
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Date {
   font-size: 12px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Name {
   font-size: 14px;
   margin-top: 10px;
   margin-bottom: 16px;
   font-weight: 100
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size {
   font-size: 13px;
   margin-right: 14px;
   display: none;
   margin: 8px 0;
   font-weight: 100;
   background: #efefef;
   padding: 6px;
   border-radius: 4px;
   width: fit-content
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show {
   display: flex
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size>span:nth-child(1) {
   font-weight: 300;
   margin-right: 5px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive {
   font-size: 12px;
   display: flex;
   align-items: center;
   margin-left: auto
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show+.Possitive {
   margin-left: inherit
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive>i::before {
   content: "";
   display: block;
   background-repeat: no-repeat;
   background-position: center;
   width: 14px;
   height: 14px;
   background-size: 14px;
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNC4yNSA5Ljc4NGExIDEgMCAwIDEgMSAxdjExYTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xdi0xMWExIDEgMCAwIDEgMS0xem04LjQxNC04LjU1Yy45NzQtLjEzNSAyLjIyLjQ2NSAyLjgwOCAyLjU2NWE4LjY4NiA4LjY4NiAwIDAgMS0uNTIgNC40MDcuMjUuMjUgMCAwIDAgLjIzNy4zMjhIMjEuNWEyLjUgMi41IDAgMCAxIDEuMjI4IDQuNjc4IDIuMjQ5IDIuMjQ5IDAgMCAxLS45NTkgMy4wNzggMi4yNTEgMi4yNTEgMCAwIDEtMSAzYy4xNTIuMzEuMjMxLjY1LjIzMS45OTUgMCAuNjUtLjI5MiAxLjc1LTIuMjUgMS43NWgtNi41YTE3LjMyOCAxNy4zMjggMCAwIDEtNC4xMDgtLjQ3MWMtLjMwNi0uMDY1LS42My0uMTMyLS45ODctLjJhLjUuNSAwIDAgMS0uNDA1LS40OTFWMTAuNzU3YzAtLjE2NS4wOC0uMzE5LjIxNi0uNDEyQzguODcxIDkuMDMgMTEgNi4wMyAxMSAzLjI4NGEyIDIgMCAwIDEgMS42NjQtMi4wNXpNMyAxOS4yODRhLjc1Ljc1IDAgMSAwIDAgMS41Ljc1Ljc1IDAgMCAwIDAtMS41eiIgZmlsbD0iI0NDQyIvPjwvc3ZnPg==);
   margin-right: 5px
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment {
   width: 100%;
   margin-top: 12px;
   font-size: 14px;
   font-weight: 100
}

.fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment span {
   width: 100%;
   display: flex
}

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

   .ModsPop.RightPop>.Document{
      width:100%;
      min-width:100%;
   }
   [Mod=fr_question] {
       padding:16px
   }

   [Mod=fr_question] .fr_question_title {
       font-size: 14px
   }

   [Mod=fr_size_suggets] {
       margin-top: 16px!important
   }

   [Mod=fr_best_comment] {
       display: none
   }

   [Mod=fr_comment] .fr_comment_ratingBar {
       display: flex;
       align-items: center;
       justify-content: flex-end;
       padding: 10px
   }

   [Mod=fr_comment] .fr_comment_starBar {
       margin-right: 5px
   }

   [Mod=fr_comment] .fr_comment_starBar svg {
       height: 10px
   }

   [Mod=fr_comment] .fr_comment_rating>span {
       font-size: 14px
   }

   [Mod=fr_comment] .fr_comment_all {
       font-size: 11px
   }

   [Mod=fr_comment] .fr_comment_total {
       font-size: 11px;
       margin-left: 18px
   }

   [Mod=fr_comment] .fr_comment_rating {
       margin-right: auto
   }

   [Mod=fr_comment] .fr_comment_all {
       margin-right: 0
   }

   [Mod=fr_comment] {
       padding: 16px
   }

   [Mod=fr_comment] .fr_comment_title {
       font-size: 14px;
       padding: 0 20px;
       font-size: 12px;
       margin-bottom: 5px;
       font-weight: 400;
   }

   [Mod=fr_comment] .fr_comment_arrows {
       display: none
   }

   [Mod=fr_comment] .fr_comment_sizeText {
       display: none
   }

   .fr_comment_CommentAreaHeader {
       background: 0 0;
       padding: 16px
   }

   .fr_comment_CommentAreaHeaderBtn {
       margin: 0;
       padding: 0
   }

   .fr_comment_CommentAreaHeaderBtn.BtnBack>i {
       width: 28px;
       height: 28px;
       margin: 0
   }

   .fr_comment_CommentAreaHeaderBtn.BtnBack>span {
       display: none
   }

   .fr_comment_CommentAreaBody {
       width: 100%;
       padding: 16px
   }

   .fr_comment_CommentAreaBody .CommentCounter {
       margin-left: 80px
   }

   .fr_comment_CommentAreaBody .CommentCounter>.Title {
       font-size: 14px
   }

   .fr_comment_CommentAreaBody .CommentCounter>.Text {
       font-size: 11px
   }

   .fr_comment_CommentAreaBody .CommentFilterArea.Ratings {
       overflow: auto;
       scrollbar-width: none
   }

   .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox {
       display: flex;
       flex-direction: column;
       align-items: flex-end;
       width: 60px;
       margin-left: 20px;
       position: relative
   }

   .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>span {
       display: none
   }

   .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>svg {
       height: calc(100% - 4px);
       position: absolute;
       bottom: 2px;
       right: 2px;
       top: 3px;
       padding: 5px;
       background: #fff;
       width: calc(100% - 2px);
       display: flex;
       align-items: center;
       justify-content: center;
       margin-right: -1px;
       margin-top: -1px;
       z-index: -1
   }

   .fr_comment_CommentAreaBody .CommentFilterArea .Searchbox>input {
       font-size: 12px
   }

   .fr_comment_CommentAreaBody .CommentFilterArea .Sortbox>select {
       font-size: 0;
       line-height: 16px;
       background: 0 0
   }

   .fr_comment_CommentAreaBody .CommentList .CommentItem>.Comment {
       padding: 16px
   }

   .fr_comment_image_popup {
       background: #000;
       display: flex;
       align-items: stretch;
       z-index: 99999
   }

   .fr_comment_image_popup_area {
       display: flex;
       width: 100%;
       height: 100%;
       background: #fff;
       border-radius: 8px;
       align-items: flex-start;
       overflow: hidden
   }

   .fr_comment_image_area_content {
       display: flex;
       flex-direction: column;
       height: 100%;
       width: 100%
   }

   .fr_comment_image_area_content .Counter {
       display: flex;
       flex-direction: row;
       width: 100%;
       color: #fff;
       background: #0000006e;
       text-align: center;
       font-size: 12px;
       line-height: 34px;
       font-weight: 100;
       position: absolute;
       top: 0;
       left: 0;
       z-index: 2;
       justify-content: space-between;
       padding: 0 16px;
       align-items: center
   }

   .fr_comment_image_area_content .Counter>div:nth-child(2) {
       font-size: 23px;
       cursor: pointer;
       color: #c7c7c7
   }

   .fr_comment_image_area_content .List {
       display: flex;
       width: 100%;
       height: 100%;
       background: #000;
       flex-direction: column;
       justify-content: center;
       align-items: center
   }

   .fr_comment_image_area_content>.List>.Item {
       display: none;
       align-items: flex-start
   }

   .fr_comment_image_area_content>.List>.Item.show {
       display: flex;
       flex-direction: column;
       height: 100%;
       justify-content: flex-start;
       width: 100%;
       background: #000
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(1) {
       display: flex;
       background: #000;
       width: 100%;
       position: relative;
       height: 100%;
       justify-content: center;
       align-items: center
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(1)>img {
       width: auto!important;
       width: 100%!important;
       height: auto!important;
       margin: 0;
       padding: 0;
       transform-origin: 0% 0%
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows {
       display: flex;
       gap: 14px;
       z-index: 10;
       position: absolute;
       top: 0;
       bottom: 0;
       margin: auto 0;
       width: 100%;
       padding: 0 14px;
       height: 40px;
       border-radius: 100%;
       display: flex;
       justify-content: space-between;
       align-items: center;
       box-shadow: 0 4px 4px rgba(51,51,51,.16);
       cursor: pointer
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.prev,.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.next {
       border-radius: 50%!important;
       background: #fff!important;
       width: 40px;
       height: 40px;
       display: flex;
       justify-content: center;
       align-items: center;
       flex: none;
       box-shadow: #00000021 0 3px 6px
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.prev.Disabled,.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.next.Disabled {
       background: #cbcbcb!important;
       pointer-events: none
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.prev>svg,.fr_comment_image_area_content>.List>.Item>div:nth-child(1)>.Arrows>.next>svg {
       height: 26px
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2) {
       width: 100%;
       display: flex;
       flex-direction: column;
       background: 0 0;
       color: #fff;
       position: absolute;
       bottom: 0
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Closed {
       display: none
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info {
       width: 100%;
       display: flex;
       justify-content: flex-start;
       padding: 24px;
       flex-direction: column;
       align-items: flex-start
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info:before {
       content: "";
       box-shadow: 0 102px 100px 68px #000
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates {
       display: flex;
       align-items: center
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates>svg {
       height: 15px;
       fill: #ccc
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="1"]>svg:nth-child(1) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:nth-child(1) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="2"]>svg:nth-child(2) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(1) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(2) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="3"]>svg:nth-child(3) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(1) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(2) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(3) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="4"]>svg:nth-child(4) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(1) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(2) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(3) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(4) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Rates[P="5"]>svg:nth-child(5) {
       fill: #f9c10a
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Date {
       font-size: 12px
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Name {
       font-size: 14px;
       margin-top: 10px;
       margin-bottom: 16px;
       font-weight: 100
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size {
       font-size: 13px;
       margin-right: 14px;
       display: none;
       margin: 8px 0;
       font-weight: 100;
       background: #efefef;
       color: #000;
       padding: 6px;
       border-radius: 4px;
       width: fit-content
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show {
       display: flex
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size>span:nth-child(1) {
       font-weight: 300;
       margin-right: 5px
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive {
       font-size: 12px;
       display: flex;
       align-items: center;
       margin-left: auto
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Size.show+.Possitive {
       margin-left: inherit
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Possitive>i::before {
       content: "";
       display: block;
       background-repeat: no-repeat;
       background-position: center;
       width: 14px;
       height: 14px;
       background-size: 14px;
       background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNC4yNSA5Ljc4NGExIDEgMCAwIDEgMSAxdjExYTEgMSAwIDAgMS0xIDFIMWExIDEgMCAwIDEtMS0xdi0xMWExIDEgMCAwIDEgMS0xem04LjQxNC04LjU1Yy45NzQtLjEzNSAyLjIyLjQ2NSAyLjgwOCAyLjU2NWE4LjY4NiA4LjY4NiAwIDAgMS0uNTIgNC40MDcuMjUuMjUgMCAwIDAgLjIzNy4zMjhIMjEuNWEyLjUgMi41IDAgMCAxIDEuMjI4IDQuNjc4IDIuMjQ5IDIuMjQ5IDAgMCAxLS45NTkgMy4wNzggMi4yNTEgMi4yNTEgMCAwIDEtMSAzYy4xNTIuMzEuMjMxLjY1LjIzMS45OTUgMCAuNjUtLjI5MiAxLjc1LTIuMjUgMS43NWgtNi41YTE3LjMyOCAxNy4zMjggMCAwIDEtNC4xMDgtLjQ3MWMtLjMwNi0uMDY1LS42My0uMTMyLS45ODctLjJhLjUuNSAwIDAgMS0uNDA1LS40OTFWMTAuNzU3YzAtLjE2NS4wOC0uMzE5LjIxNi0uNDEyQzguODcxIDkuMDMgMTEgNi4wMyAxMSAzLjI4NGEyIDIgMCAwIDEgMS42NjQtMi4wNXpNMyAxOS4yODRhLjc1Ljc1IDAgMSAwIDAgMS41Ljc1Ljc1IDAgMCAwIDAtMS41eiIgZmlsbD0iI0NDQyIvPjwvc3ZnPg==);
       margin-right: 5px
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment {
       width: 100%;
       margin-top: 12px;
       font-size: 14px;
       font-weight: 100;
       text-align: left
   }

   .fr_comment_image_area_content>.List>.Item>div:nth-child(2)>.Info>.Comment span {
       width: 100%;
       display: flex
   }
}

.comment-loading {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 40px;
}

.comment-loading .spinner {
   width: 40px;
   height: 40px;
   border: 2px solid rgba(0, 0, 0, 0.1);
   border-top: 3px solid #00FFB1;
   border-radius: 50%;
   animation: modsspinsecondSpin 1s linear infinite;
}

@keyframes modsspinsecondSpin {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
}


@keyframes modsspin {
   to {
      transform: rotate(360deg);
   }
}