@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-bold-straight.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-regular-straight.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-solid-rounded.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-regular-rounded.css');
@import url('https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-rounded/css/uicons-solid-straight.css');

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

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

 .custom-tooltip {
  --bs-tooltip-color: var(--bs-white);
}

a{ color:#abfb4f !important;}

 :root {
     --main: #abfb4f;
     --grad1: #abfb4f;
     --grad2: #88ff003d;
     --bared: var(--white);
     --baredmachitrans: #d5e5ff;
     --baredtext: #0d67fecc;
     --baredbezaf: #fff;
     --white:#ededed;
     --mainback: #fff;
     --balckgrad2: #05050a;
 }

 button:hover {
    background-image: linear-gradient(rgb(255 255 255 / 10%) 0 0) !important;
    box-shadow: 0px 0px 12px -7px #000;

}

input:focus,
textarea:focus {
    border: 1px solid #fff !important;
    outline: none; /* Removes the default outline */
    box-shadow: 0 0 0 .25rem rgb(73 73 73 / 25%) !important;
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus  {
    background-color: black !important;
    -webkit-box-shadow: 0 0 0px 1000px black inset;
    -webkit-text-fill-color: white !important;
    color: white !important;
    transition: background-color 5000s ease-in-out 0s;
}


@media (min-width: 1200px) {
    .h2, h2 {
        font-size: 3rem;
    }
}


 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
    font-family: "Work Sans", sans-serif;
     color: #fff;
 }
 
 ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #a1a1a1 !important;
  opacity: 1; /* Firefox */
}

@keyframes placeHolderShimmer {
  0% {
    background-position: -800px 0
  }
  100% {
    background-position: 800px 0
  }
}

.animated-background {
  animation-duration: 2s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background-color: #f6f7f8;
    background: linear-gradient(to right, #05050a 8%, #2b2b2b 69%, #05050a 33%);
    background-size: 800px 104px;
    position: relative;
}

@media (min-width: 1400px){
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1410px ;
    }   }
    
 .home-logo {
   max-width: 40px;
margin-top: 4px;
    width: 100%;

 }

 body {
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #05050a;
 }


@keyframes smooth-appear {
  from {
    bottom: -450px;
  }
  to {
    bottom: 0px;
  }
}

 @-o-keyframes fadeIt {
     0% {
         background-color: #000;
     }
     50% {
         background-color: var(--main);
     }
     100% {
         background-color: var(--main);
     }
 }

 @keyframes fadeIt {
     0% {
         background-color: #000;
     }
     50% {
         background-color: var(--main);
     }
     100% {
         background-color: var(--main);
     }
 }

 .container-home {
     height: 95vh;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .container-home b {
     font-size: 3rem;
     padding: 0.5rem;
     font-weight: bold;
     letter-spacing: 0.1rem;
     text-align: center;
     overflow: hidden;
 }

 .container-home span.typed-text {
     font-weight: 800;
     color: var(--main);
 }

 .container-home b span.cursor {
     display: inline-block;
     background-color: #ccc;
     margin-left: 0.1rem;
     width: 3px;
     animation: blink 1s infinite;
 }

 .container-home b span.cursor.typing {
     animation: none;
 }

 @keyframes blink {
     0% {
         background-color: #ccc;
     }
     49% {
         background-color: #ccc;
     }
     50% {
         background-color: transparent;
     }
     99% {
         background-color: transparent;
     }
     100% {
         background-color: #ccc;
     }
 }

 .home-best {
     background: #c6c4f326;
     border-radius: 10px;
     padding: 15px 10px 13px 10px;
     margin: 10px 0px;
 }

 .home-best b {
     font-weight: 600;
     font-size: 20px;
     line-height: 28px;
     letter-spacing: .02em;
     color: #262626;
     margin-bottom: 6px;
     margin-left: 10px;
 }

 .home-best t {
     font-weight: 300;
     font-size: 16px;
     line-height: 156%;
     letter-spacing: .03em;
     color: #303030;
     margin-bottom: 10px;
     display: block;
     margin-left: 50px;
 }

 .Question {
           margin-top: 15px;
    padding: 14px 18px;
    font-size: 18px;
    border: 0;
    /* background: #000000; */
    display: block;
    border-radius: 19px;
    cursor: pointer;
    font-weight: 400;
    color: #fff;
    border: 1px solid #d6ebfd30;
 }

 .Question i {
     right: 0 !important;
     float: right;
     margin-right: 10px;
     margin-top: 1px;
     color:#fff;
 }

 .answer {
     padding: 14px 14px;
     background: none;
     border: 0px;
     font-size: 17px;
     font-weight: 300;
     cursor: pointer;
     margin-top: 5px;
     color:#fff;
     display: none;
 }

 .User-area {
     width: 45px;
     height: 45px;
     position: relative;
     cursor: pointer;
 }

 .User-Dropdown {
     display: none;
     position: absolute;
     border-radius: 7px;
     background: #fff;
     box-shadow: 0px 0px 8px rgba(214, 214, 214, 0.78);
     list-style: none;
     padding: 0 20px;
     width: 150px;
     margin: 0;
     top: 50px;
     right: -9%;
 }

 .User-Dropdown:before {
     content: "";
     position: absolute;
     width: 0;
     height: 0;
     margin-left: -0.5em;
     right: 0px;
     box-sizing: border-box;
     border: 7px solid black;
     border-color: transparent transparent #ffffff #ffffff;
     transform-origin: 0 0;
     transform: rotate(135deg);
     box-shadow: -3px 3px 3px -3px rgba(214, 214, 214, 0.78);
 }

 .User-Dropdown.U-open {
     display: block;
 }

 .User-Dropdown>li {
     padding: 0px;
     line-height: 47px;
     border-bottom: 1px solid rgba(0, 0, 0, 0);
 }

 .User-Dropdown>li:last-child {
     border-bottom: 0px;
 }

 .User-Dropdown>li>a {
     font-size: 13px;
     padding: 15px 25px 16px 10px;
     text-decoration: none;
     color: #fff;
     transition: all 0.2s ease-out;
 }

 .User-Dropdown span {
     background: var(--main);
     padding: 3px 10px;
     color: #fff;
     border-radius: 30px;
     font-size: 13px;
 }

 .User-Dropdown>li:before {
     content: "";
     width: 0px;
     height: 40px;
     position: absolute;
     background: #000;
     margin-top: 4px;
     border-radius: 0 1px 1px 0;
     left: 0px;
     transition: all 0.2s ease;
 }

 .User-Dropdown>li:hover:before {
     width: 5px;
     border-radius: 30px;
 }

 .User-Dropdown>li a:hover {
     margin-left: 5px;
 }

 .cta {
     position: relative;
     margin: auto;
     padding: 19px 22px;
     transition: all 0.2s ease;
 }

 .cta:before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     display: block;
     border-radius: 28px;
     background: rgba(255, 171, 157, 0.5);
     width: 56px;
     height: 56px;
     transition: all 0.3s ease;
 }

 .cta span {
     position: relative;
     font-size: 16px;
     line-height: 18px;
     font-weight: 900;
     letter-spacing: 0.25em;
     text-transform: uppercase;
     vertical-align: middle;
 }

 .cta svg {
     position: relative;
     top: 0;
     margin-left: 10px;
     fill: none;
     stroke-linecap: round;
     stroke-linejoin: round;
     stroke: #111;
     stroke-width: 2;
     transform: translateX(-5px);
     transition: all 0.3s ease;
 }

 .cta:hover:before {
     width: 100%;
     background: #ffab9d;
 }

 .cta:hover svg {
     transform: translateX(0);
 }

 .cta:active {
     transform: scale(0.96);
 }

 .button-tostore {
     background: var(--main);
     border: 0;
     padding: 15px 50px;
     margin: 0px 3px;
     font-weight: 500;
     color: #fff;
     border-radius: 25px;
     font-size: 15px;
 }

 .button-tostore:hover {
     background: #000;
     -o-animation: fadeIt 1s ease-in-out;
     animation: fadeIt 1s ease-in-out;
     
 }

 .button-login {
     background: #fff;
     border: 0;
     padding: 6px 30px;
     margin: 0px 3px;
     font-weight: 500;
     color: #fff;
     border-radius: 21px;
     font-size: 14px;
     border: 2px solid #000;
 }

 .button-login:hover {
     -o-animation: fadeIt 1s ease-in-out;
     animation: fadeIt 1s ease-in-out;
     border: 2px solid var(--main);
     background: var(--main);
     color: #fff;
 }

 .button-signup {
     background: var(--main);
     border: 0;
     padding: 6px 30px;
     margin: 0px 3px;
     font-weight: 500;
     color: #fff;
     border-radius: 21px;
     font-size: 14px;
     border: 2px solid var(--main);
 }

 .button-signup:hover {
     border: 2px solid var(--main);
     background: #000;
     -o-animation: fadeIt 1s ease-in-out;
     animation: fadeIt 1s ease-in-out;
 }

 .iconclick {
     margin: 0px 5px 0px 7px;
     font-size: 28px;
     cursor: pointer;
 }

 .iconclick:hover {
     color: var(--main);
 }

 .payment-options {
     background: #ffffff;
     margin: 0 !important;
     border-radius: 9px;
     cursor: pointer;
     box-shadow: 0px 0px 12px -10px #000;
     padding: 10px 6px !important;
     justify-content: center;
 }

 .payment-options:hover {
     border: #c5c2f3 solid 2px;
     padding: 8px 6px !important;
 }

 .payment-options img {
     max-width: 120px;
     width: 100%;
 }

 .payment-div {
     margin: 0 !important;
     height: fit-content;
     padding: 6px 6px !important;
 }

 .next-step-div {
     text-align: right;
     margin: 20px 0px 10px 0px !important;
 }

 .next-step-div t {
     font-weight: 600;
     color: #ccc;
     font-size: 18px;
     cursor: pointer;
 }

 .next-step-div t:hover {
     color: var( --baredtext);
 }

 .prev-step-div {
     text-align: left;
     margin: 20px 0px 10px 0px !important;
 }

 .prev-step-div t {
     font-weight: 600;
     color: #ccc;
     font-size: 18px;
     cursor: pointer;
 }

 .prev-step-div t:hover {
     color: var( --baredtext);
 }

 .order-road {
     background: #c6c4f326;
     border-radius: 10px;
     margin: 0 !important;
     overflow: hidden;
     padding: 16px 4px;
 }

 .done-line {
     display: flex;
     transition: all .4s;
 }

 .done-line inline {
     background: #13b8a7;
     height: 2px;
     width: 100%;
     border-radius: 44px;
     display: inline-grid;
     margin: 16px 0px -5px 5px;
 }

 .done-line step {
     margin-left: 10px;
     color: #13b8a7;
     margin-top: 4px;
 }

 .done-line stepnumber {
     color: #fff;
     background: #13b8a7;
     box-shadow: 0px 0px 11px -6px #000;
     padding: 4px 13px;
     border-radius: 20px;
     height: fit-content;
 }

 .active-line {
     display: flex;
     transition: all .4s;
 }

 .active-line inline {
     background: var(--main);
     height: 2px;
     width: 100%;
     border-radius: 44px;
     display: inline-grid;
     margin: 16px 0px -5px 5px;
 }

 .active-line step {
     margin-left: 10px;
     color: var(--main);
     margin-top: 4px;
 }

 .active-line stepnumber {
     color: #fff;
     background: var(--main);
     box-shadow: 0px 0px 11px -6px #000;
     padding: 4px 13px;
     border-radius: 20px;
     height: fit-content;
 }

 .inactive-line {
     display: flex;
     transition: all .4s;
 }

 .inactive-line inline {
     background: #ccc;
     height: 2px;
     width: 100%;
     border-radius: 44px;
     display: inline-grid;
     margin: 16px 0px -5px 5px;
 }

 .inactive-line step {
     margin-left: 10px;
     margin-top: 4px;
     color: #a39595;
 }

 .inactive-line stepnumber {
     color: #fff;
     background: #fff;
     box-shadow: 0px 0px 11px -6px #000;
     padding: 4px 13px;
     border-radius: 20px;
     height: fit-content;
 }

 .delivry-option-div {
     margin: 0 !important;
     height: fit-content;
     padding: 6px 6px;
 }

 .delivry-option-button {
     background: #ffffff;
     margin: 0 !important;
     border-radius: 9px;
     cursor: pointer;
     padding: 6px 6px;
     text-align: center;
     border: 4px solid var(--baredbezaf);
 }

 .delivry-option-button b {
     display: block;
 }

 .delivry-option-button:hover {
     border: var(--baredtext) solid 2px;
     padding: 8px 6px;
 }

 .product-packages-div {
     margin: 0 !important;
     height: fit-content;
     padding: 6px 6px;
 }

 .product-packages-button {
     margin: 0 !important;
     border-radius: 18px;
     background: var(--baredmachitrans);
     cursor: pointer;
     text-align: center;
     padding: 45px 0px 20px 0px;
     justify-content: center;
 }

 .product-packages-button more {
     color: #939393;
     margin-top: -3px;
     font-size: 14px;
     display: block;
 }

 .product-packages-button promo {
     color: #838383;
     font-size: 14px;
     text-decoration: line-through #000;
     margin-top: -5px;
     display: block;
 }

 .product-packages-button:hover {
     border: #c5c2f3 solid 2px;
     padding: 43px 0px 18px 0px;
     transition: background 0.25s linear;
     -webkit-transition: background 0.25s linear;
 }

 .product-quantity-div {
     margin: 0 !important;
     height: fit-content;
     padding: 6px 6px !important;
 }

 .product-quantity-button {
     background: #ffffff;
     margin: 0 !important;
     border-radius: 9px;
     cursor: pointer;
     box-shadow: 0px 0px 12px -10px #000;
     padding: 6px 6px !important;
 }

 .product-quantity-button b {
     display: block;
 }

 .product-quantity-button more {
     color: #939393;
     margin-top: -3px;
     font-size: 14px;
     display: block;
 }

 .product-quantity-button:hover {
     border: #c5c2f3 solid 2px;
     padding: 4px 6px !important;
 }

 .faq-page {
     border-radius: 10px;
     margin: 10px 0px 0px 0px !important;
     overflow: hidden;
 }

 .page {
     
     overflow: hidden;
 }

 .befor-page {
         margin: 0;
    margin-top: 8px !important;
    z-index: 1;
 }

 .page-title {
     font-weight: 600;
     color: var( --baredtext);
     margin: 0px 0px 0px 0px !important;
 }

 .page-title img {
     width: 30px;
     margin: 6px 0px 8px 0px;
 }

 labeles {
     margin: 0 !important;
     padding: 0 !important;
 }

  .shop-product-row:hover {
 }

 @keyframes jump {
     50% {
         transform: translateY(-10px);
     }
     100% {
         transform: translateY(0);
     }
 }

 .shop-product-row {
     
     border-radius: 16px;
     margin: 0;
     transition: 1s;
     min-width:320px;
 }

 .shop-product-col {
     background: var(--balckgrad2);border-radius: 13px;margin: 0;padding: 25px 15px;position: relative; text-align: left; transition: 1s;
 }

 .shop-product-col:hover img {
     animation-name: jump;
     animation-duration: 0.5s;
     animation-delay: calc(var(--i) * 0.075s);
 }
 
 .shop-product-col rated {
     position: absolute; right: 0; top: 0; margin: 15px 25px 0px 0px;
 }
 
 .shop-product-col start {
     position: absolute; right: 0; bottom: 0; margin: 0px 18px 26px 0px; background: #0d67fe; padding: 5px 10px 3px 10px; border-radius: 11px; font-size: 13px;
 }

 .shop-product-col shoplabel {
     background: #fcfcfc;
     color: #fff;
     border-radius: 14px;
     border: 1px solid #ccc;
     font-size: 14px;
     font-weight: 400;
     margin: 0px 2px;
     box-shadow: 0 1px 7px rgb(0 0 0 / 10%);
     padding: 4px 10px !important;
 }

 .shop-product-col b {
     font-weight: 500;font-size: 24px;color:#fff;margin-top: 14px;display: block;margin-left: 4px; padding:0;
 }
 
 .shop-product-col t {
 font-weight: 400;font-size: 14px;color: #b3afaf;margin-top: -6px;display: block;margin-left: 4px;
}

 .shop-product-main {
     position: relative;
     overflow: hidden;
     padding: 8px 8px;
 }

 .shop-product-main a{
    cursor: pointer;
    text-decoration: none;
 }

 ::placeholder {
     /* Most modern browsers support this now. */
     color: #909;
 }

 thead {
     font-family: 'Poppins', sans-serif;
     font-weight: bolder;
     font-size: 20px;
     color: #666
 }

 .shop-product-icon {
     padding: 7px; border-radius: 26px; backdrop-filter: blur(5px); overflow: hidden; width: fit-content;
 }

 .shop-product-icon img {
     width: 55px !important;
     border-radius: 54px;
 }

 .shop-product-div img {
     width: 40px;
     height: 40px
 }

 .name {
     display: inline-block
 }

 .bg-blue {
     background-color: #EBF5FB;
     border-radius: 8px
 }

 .fa-check,
 .fa-minus {
     color: blue
 }

 .bg-blue:hover {
     background-color: #3e64ff;
     color: #eee !important;
     cursor: pointer
 }

 .bg-blue i {
     font-size: 22px;
     color: var(--main);
     padding: 8px 10px;
     border-radius: 58px;
     vertical-align: middle;
     margin: 0px 7px 0px 4px;
 }

 .bg-blue:hover .fa-check,
 .bg-blue:hover .fa-minus {
     background-color: #3e64ff;
     color: #eee
 }

 .table thead th,
 .table td {
     border: none
 }

 .table tbody td:first-child {
     border-bottom-left-radius: 10px;
     border-top-left-radius: 10px
 }

 .table tbody td:last-child {
     border-bottom-right-radius: 10px;
     border-top-right-radius: 10px
 }

 #spacing-row {
     height: 10px
 }

 @keyframes animateDiv {
     0% {
         bottom: 0px;
         top: 1000px;
     }
 }

 .hover_bkgr_fricc {
   background: rgb(30 30 30 / 59%) !important;
    display: block;
  transition: visibility 0s, opacity 0.5s linear;
    backdrop-filter: blur(3px);
    height: 100%;
    position: fixed;
    text-align: center;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 6;
    
 }

 .hover_bkgr_fricc button {
    background: #000000;
    margin: 60px 0px 0px 0px;
    width: 100%;
    border-radius: 18px;
    padding: 14px 2px;
    font-size: 17px;
    border: 2px solid #d6ebfd30;
 }

.left-switch-button{border: 0; padding: 8px 18px;  width: 49%; font-weight: 500; margin: 0 !important; border-radius: 20px 0px 0px 20px; z-index: 2;}
                                .right-switch-button{ border: 0; padding: 8px 18px;  width: 49%; font-weight: 500; margin: 0 !important; border-radius: 0px 20px 20px 0px; z-index: 2; }
                                .switch-button-active{background: var(--main); color: #fff;}
                                .switch-button-inactive{background: var(--bared); color: #6c6969;}

 .hover_bkgr_fricc .helper{
    display:inline-block;
    height:100%;
    vertical-align:middle;
}

 .hover_bkgr_fricc .in {
      padding: 14px 32px 10px 32px;
     color: var(--main);
     text-align: left;
     border-radius: 20px 20px 0px 0px;
 }

 .hover_bkgr_fricc .payme {
     text-align: center;
     padding: 25px;
 }

 .hover_bkgr_fricc t {
     text-decoration: none;
     margin-bottom: 8px;
     margin-top: 12px;
     display: block;
     font-size: 18px;
 }

  @-webkit-keyframes fadeOut {
            0% {opacity: 1;}
            100% {opacity: 0;}
         }

         @keyframes fadeOut {
            0% {opacity: 1;}
            100% {opacity: 0;}
         }


 .hover_bkgr_fricc>div {
     display: inline-block;
     border: 1px solid #d6ebfd30;
    background-color: #000;
     height: auto;
     max-width: 550px;
     vertical-align: middle;
     width: 60%;
     position: relative;
     border-radius: 35px;
     padding: 15px 0px;
     animation: smooth-appear 1s ease forwards;
     color:#fff;
 }

 .popupCloseButton {
    cursor: pointer;
    display: inline-block;
    position: absolute;
    top: -41px;
    right: 2px;
    font-size: 16px;
    line-height: 30px;
    color: #ffffff !important;
    width: 100px;
    background: #ffffff26;
    border-radius: 18px;
    padding: 2px 1px;
 }

.order-q {    margin-top: 3px;
    padding: 0px 14px;
    font-size: 16px;
    border: 0;
    display: block;
    border-radius: 9px;
    cursor: pointer;
    color: #ffffff;
}

.order-q i {
    font-size: 20px;
    margin-bottom: 8px;
    position: absolute;
    margin-left: 0px;
}

.order-q t { margin-left: 28px; }

.q-div-order {
    background: #000;
    padding: 10px 0px;
    border-radius: 12px;
    margin-top: 7px;
    display: block;
}

.rotated-image-90d {
  -webkit-transform: rotate(90deg);
    margin-top: -2px;
    margin-left: -3px !important;
    transition: 0.5s;
}

 .order-a {        padding: 6px 14px;
    background: none;
    border: 0px;
    font-size: 16px;
    font-weight: 300;
    display: none;
    cursor: pointer;
    margin-top: 5px;
    color: #d7d7d7;
}

 .popupCloseButton:hover {
     color: #1c10ff;
 }

 .trigger_popup_fricc {
     cursor: pointer;
     font-size: 20px;
     margin: 20px;
     display: inline-block;
     font-weight: bold;
 }

 .hh-grayBox {
    margin-bottom: 0px;
    padding: 26px 6px;
 }

 .pt45 {
     padding-top: 28px;
 }

 .order-tracking {
     text-align: center;
     width: 33.33%;
     position: relative;
     display: block;
 }

 .order-tracking {
     text-align: center;
     width: 33.33%;
     position: relative;
     display: block;
 }

 .order-tracking .is-complete {
        color: #ccc;
    display: block;
    position: relative;
    border-radius: 50%;
    height: 25px;
    width: 25px;
    border: 0px solid #AFAFAF;
    background-color: #575757;
    margin: 0 auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
    z-index: 2;
 }

 .order-tracking .is-complete:after {
     display: block;
     position: absolute;
     content: '';
     height: 11px;
     width: 7px;
     top: -2px;
     bottom: 0;
     left: 5px;
     margin: auto 0;
     border: 0px solid #AFAFAF;
     border-width: 0px 2px 2px 0;
     transform: rotate(45deg);
     opacity: 0;
 }

 .order-tracking.completed .is-complete {
     border-color: #fff;
     border-width: 0px;
     background-color: #fff;
     color:#000;
     font-weight: 700;
 }

 .is-not-complete {
     display: block;
     position: relative;
     border-radius: 50%;
     height: 25px;
     width: 25px;
     border: 0px solid #AFAFAF;
     background-color: #c7c7c7;
     margin: 0 auto;
     transition: background 0.25s linear;
     -webkit-transition: background 0.25s linear;
     z-index: 2;
 }

 .order-tracking p {
     color: #A4A4A4;
     font-size: 14px;
     margin-top: 8px;
     margin-bottom: 0;
     line-height: 20px;
 }

 .order-tracking p span {
     font-size: 14px;
 }

 .order-tracking.completed p {
     color: #fff;
 }

.past-completed::before {
     content: '';
     display: block;
     height: 3px;
     width: calc(100% - 40px);
     background-color: var(--main) !important;
     top: 12px;
     position: absolute;
     left: calc(-50% + 20px);
     z-index: 0;
    border-radius: 16px;
 }

 .order-tracking::before {
     content: '';
     display: block;
     height: 3px;
     width: calc(100% - 40px);
     background-color: #757272;
     top: 12px;
     position: absolute;
     left: calc(-50% + 20px);
     z-index: 0;
    border-radius: 16px;
 }

 .order-tracking:first-child:before {
     display: none;
 }

 .order-tracking.completed:before {
     background-color: #fff;
 }

 .breadcrumb a {
     text-decoration: none !important;
 }
    
    .order-details { 
            margin: 0 !important;
   height: fit-content;
    top: 5rem;
    z-index: 2;
    border-radius: 0px 18px 18px 0px ;
    }
    
 .header-product-div {
     margin-bottom: 100px;
    padding: 0;
    border-radius: 18px;
    position: relative;
    padding: 7px 10px;
 }
 
  .header-product-div-not-order {
    padding: 0px 8px;
    border-radius: 16px ;
    position: relative;
 }

 .header-product {
     border-radius: 16px;
     margin: 0 !important;
     overflow: hidden;
     background-size: cover !important;
     color: #fff;
    background: var(--balckgrad2);
    box-shadow: 0px 12px 47px -37px #000;
 }
 
 

 .header-product product {
     font-size: 28px;
     font-weight: 900;
     margin-bottom: 8px;
     display: block;
     margin-left: 12px;
 }

 .header-product p {
     margin-left: 12px;
 }


 .titlilaria {
    background: var(--balckgrad2);
    border-radius: 18px;
    margin: 0 !important;
    color: #fff;
    box-shadow: 0px 12px 47px -37px #000;
    padding: 15px 15px;
 }

.titlilaria-v2 {
    border-radius: 18px;
    margin: 0 !important;
    color: #fff;
    padding: 15px 15px;
}

.titlilaria-v2 h1{
    display: block; margin-bottom: 11px; font-weight: 700;
}

 .titlilaria rating {
     color: #ffc107;
     font-weight: 400;
     font-size: 18px;
     margin: 0px 0px 30px 5px;
 }
  
  
  .invalid-feedback {color: #ea5455 !important;}
  
 .titlilaria dic {
     font-size: 17px;background: #ea5455;color: #fff;font-weight: 500;padding: 4px 6px 3px 6px;margin: 8px 0px 0px 8px;border-radius: 10px;display: inline;position: absolute;
 }
reviwes i {color: #0d67fe; }
reviwesdis i {color: #2a5197; }
.disc-option {font-weight: 600;color: #fff;background: #ea5455;padding: 5px 10px;border-radius: 12px;margin: -15px 18px 0px 0px;font-size: 14px;position: absolute;right: 0;/* border: #0e67ff 1px solid; */}
.rate-option {font-weight: 600;color: #0074ff;background: #131720;padding: 5px 10px;border-radius: 12px;margin: -15px 0px 0px 18px;font-size: 14px;position: absolute;left: 0;border: 1px solid #0074ff; }
                            
 .titlilaria h1 {
     font-weight: 800;
     margin-bottom: 0px;
     display: inline;
     margin-left: 12px !important;
 }

 .titlilaria h2 {
     margin-left: 12px !important;
     font-weight: 300;
     line-height: 1.3;
     font-size: 1.15rem;
 }

 .titlilaria shoplabel {
     background: #fff;
     color: #fff;
     padding: 4px 10px;
     border-radius: 12px;
     font-weight: 500;
     margin: 0px 4px 0px 0px;
     display: inline;
     font-size: 14px;
 }

 .optagsdivs {
     margin: 18px 0px 0px 8px;
     display: block;
 }

 .optags {
     display: inline-block;
     padding: 3px 12px 3px 0px;
     background: #a1c4ff66;
     border: 2px solid #fff;
     border-radius: 22px;
     margin: 2px 0px 2px 0px;
 }

 .optags i {
     font-size: 18px;
     border: 2px solid #fff;
     border-radius: 40px;
     padding: 2px 5px 2px 5px;
     margin-left: 2px;
     background: #ffffff;
     color: #0e67ff;
 }

 .optags t {
     font-size: 16px;
     display: inline-block;
     font-weight: 400;
 }

 @media only screen and (max-width: 768px) {
     .mobiliana {
         padding: 0px 10px;
     }

     .befor-page {
         padding: 0 0px !important;
     }
     .animation-card_content{
        width: 485px;
     }
 }

 .noupnodown input[type=number] {
     -moz-appearance: textfield;
 }

 .noupnodown input::-webkit-outer-spin-button,
 .noupnodown input::-webkit-inner-spin-button {
     -webkit-appearance: none;
     margin: 0;
 }

 .order-info-rab .form-label {
     color: #fff;
     display: block;
     margin-bottom: -2px !important;
     font-weight: 400;
 }

 .order-info-rab .input-group span {
     border-radius: 0px 15px 15px 0px !important;
     background: #000 !important;
     padding-right: 20px;
 }

 .order-info-rab .input-group input {
     border-radius: 15px;
    padding: 16px 20px;
    
 }

 .order-info-rab .input-group input:hover {
     border-color: #fff !important;
 }

 .order-info-rab .button-info {
    font-weight: 300;
    border: 0;
    background: none;
    margin-top: 12px;
    color: #a1a1a1 !important;
    font-size: 16px;
    margin-bottom: 12px;
 }

 .order-info-rab .button-next {
     font-weight: 500;
     border: 0;
     background: var(--main);
     padding: 12px 70px;
     margin: 30px 5px 6px 5px;
     border-radius: 6px;
     color: #fff;
     min-width: 230px;
     font-size: 16px;
 }

 .order-info-rab .no-border {
     border-right: none !important;
 }

 .order-info-rab .yes-border-radius {
     border-radius: 15px !important;
 }

 .order-info-rab .input-group {
     margin: 0px 0px 20px 0px;
 }

 .order-info-rab .input-group-text {
     color: #c4c4c4;
 }

 input::-webkit-outer-spin-button,
 input::-webkit-inner-spin-button {
     -webkit-appearance: none;
     margin: 0;
 }

 input[type=number] {
     -moz-appearance: textfield;
 }

 textarea {
     width: 100%;
     border: 1px solid #ccc;
     border-radius: 12px !important;
     padding: 10px 14px;
 }

 textarea:hover {
     border-color: var(--main)
 }

 .payment-tab {
     padding: 0px 8px;
     margin: 10px 0px 0px 0px;
     display: none;
     text-align: center;
 }

 .payment-tab info {
     border-radius: 22px;
     padding: 6px 14px;
     margin-bottom: 6px;
     text-align: left;
     color: #0a58ca;
     width: 100%;
     text-align: center;
 }

 .payment-tab item {
     margin: 10px 0px;
     display: block;
 }

 .payment-tab cost {
     margin: 10px 0px;
     display: block;
     float: right;
 }

 .payment-tab .button-back {
     font-weight: 500;
     border: 0;
     background: var(--bared);
     padding: 12px 70px;
     margin: 30px 5px 6px 5px;
     border-radius: 6px;
     color: #fff;
     min-width: 230px;
     font-size: 16px;
 }

 .payment-tab .button-check {
     font-weight: 500;
     border: 0;
     background: var(--main);
     padding: 12px 70px;
     margin: 30px 5px 6px 5px;
     border-radius: 6px;
     color: #fff;
     min-width: 230px;
     font-size: 16px;
 }

 .payment-div input[type="radio"]:checked+.payment-methodes-button {
    border: 1px solid #ffffffcf !important;
    background: linear-gradient(rgb(255 255 255 / 10%) 0 0) !important;
 }

 .payment-methodes-button {
cursor: pointer;
    text-align: left;
    width: 100%;
    border-radius: 18px;
    padding: 10px 9px 13px 16px;
    background: #000;
    border: 1px solid #d6ebfd30;
 }
    
    .payment-methodes-button t { 
        color: #000000; font-weight: 400;
    }

 .switcher-div {
    padding: 0 4px !important;
 }

 .switcher-div input[type="radio"]:checked+.switches-buttons {
    border: solid var(--baredtext) 2px;
    border-radius: 16px;
    padding: 6px 0px;
    background: #0d67fe12 !important;
 }

 .switches-buttons {
     border-radius: 5px;
     cursor: pointer;
     padding: 8px 0px;
     text-align: left;
     width: 100%;
     margin: 4px 0px;
 }

notice{
    margin-top: 14px !important; display: block; color: var(--bs-gray-500); text-align: left;
}

 .switches-buttons:hover {
     border: var(--baredtext) solid 2px;
     padding: 6px 0px;
      border-radius: 16px !important;
 }


 .payment-methodes-button img {width: 24px; float:right;}

 .payment-methodes-button:hover {
     background-image: linear-gradient(rgb(255 255 255 / 10%) 0 0) !important;
 }

 .product-quantity-div input[type="radio"]:checked+.product-quantity-button {
     border: solid #0d67fe33 2px;
     padding: 4px 6px !important;
     background: #ebeaff;
 }

 .product-packages-div badge {
     background: linear-gradient(153deg, var(--grad1) 18%, var(--grad2) 89%);
     width: auto;
     color: #ffffff;
     padding: 4px 17px;
     border-radius: 10px;
     font-size: 14px;
     margin: 10px 0px 0px 0px;
 }

 .product-packages-div tag {
     color: #fff;
     background: var(--main);
     width: auto;
     border-radius: 14px;
     font-size: 12px;
     font-weight: 400;
     padding: 2px 10px;
     margin: -4px 3px 0px 3px;
 }

 #breatch::-webkit-scrollbar {
     background-color: #000000;
     width: 4px;
     cursor: pointer;
 }

 /* background of the scrollbar except button or resizer */

 #breatch::-webkit-scrollbar-track {
     background-color: #EBF5FB;
     cursor: pointer;
 }

 /* scrollbar itself */

 #breatch::-webkit-scrollbar-thumb {
     background-color: #000000;
     border-radius: 16px;
     border: 0px solid #fff;
     cursor: pointer;
 }

 /* set button(top and bottom of the scrollbar) */

 #breatch::-webkit-scrollbar-button {
     display: none;
     cursor: pointer;
 }

 .order-canceled {
     background: #ffd8d5;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #f44336;
     font-weight: 400;
 }

 .order-anonymous {
     background: #cfcfcf;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #607d8b;
     font-weight: 400;
 }

 .order-waiting-payment {
     background: #cbe8ff;
     padding: 4px 10px;
     border-radius: 12px;
     font-size: 14px;
     color: #2196f3;
     font-weight: 400;
 }

 .order-verification {
     background: #6c43b529;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #673ab7;
     font-weight: 400;
 }

 .order-processing {
     background: #00bcd429;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #00bcd4;
     font-weight: 400;
 }

 .order-finished {
     background: #4caf5040;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #4caf50;
     font-weight: 400;
 }

 .order-expired {
     background: #cfcfcf;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #607d8b;
     font-weight: 400;
 }

 .order-refunded {
     background: #ff980047;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #ff9800;
     font-weight: 400;
 }

 .order-delivery-info {
     background: #c0d8ff;
     padding: 4px 9px;
     border-radius: 12px;
     font-size: 14px;
     color: #0060ff;
     font-weight: 400;
 }
 
 .invoice-waiting {
    background: #008eff38;
    padding: 4px 12px 2px 10px;
    border-radius: 12px;
    font-size: 13px;
    color: #2196f3;
    font-weight: 400;
    margin: 0px 11px 0px 9px;
    display: inline-grid;
    position: absolute;
 }
 
 .invoice-paid {
    background: #7cff8129;
    padding: 4px 12px 2px 10px;
    border-radius: 12px;
    font-size: 13px;
    color: #4CAF50;
    font-weight: 400;
    margin: 0px 11px 0px 9px;
    display: inline-grid;
    position: absolute;
 }
 
 .invoice-cancled {
    background: #ff665b3d;
    padding: 4px 12px 2px 10px;
    border-radius: 12px;
    font-size: 13px;
    color: #ff5b4f;
    font-weight: 400;
    margin: 0px 11px 0px 9px;
    display: inline-grid;
    position: absolute;
 }
 
 .invoice-verefication {
        background: #7f7f7f3d;
    padding: 4px 12px 2px 10px;
    border-radius: 12px;
    font-size: 13px;
    color: #494949;
    font-weight: 400;
    margin: 0px 11px 0px 9px;
    display: inline-grid;
    position: absolute;
 }
 
 
 
 
 .invoice-order-state {
    border-radius: 13px; font-size: 12px;  font-weight: 500; margin: 0px 0px 0px 4px; display: inline-grid;    
 }
 
 .invoice-order-canceled { color: #f44336; } 
 .invoice-order-waiting-payment { color: #2196f3; } 
 .invoice-order-processing { color: #00bcd4; } 
 .invoice-order-finished { color: #4caf50; } 
 .invoice-order-refunded { color: #ff9800; } 
 .invoice-order-delivery-info { color: #0060ff; }
 
 .invoice-order-canceled-dote { background: #f44336; height: 10px; width: 10px; display: inline-grid; border-radius: 31px; margin: 0px -3px 0px 0px;} 
 .invoice-order-waiting-payment-dote { background: #2196f3; height: 10px; width: 10px; display: inline-grid; border-radius: 31px; margin: 0px -3px 0px 0px;} 
 .invoice-order-processing-dote { background: #00bcd4; height: 10px; width: 10px; display: inline-grid; border-radius: 31px; margin: 0px -3px 0px 0px;} 
 .invoice-order-finished-dote { background: #4caf50; height: 10px; width: 10px; display: inline-grid; border-radius: 31px; margin: 0px -3px 0px 0px;} 
 .invoice-order-refunded-dote { background: #ff9800; height: 10px; width: 10px; display: inline-grid; border-radius: 31px; margin: 0px -3px 0px 0px;} 
 .invoice-order-delivery-info-dote { background: #0060ff; height: 10px; width: 10px; display: inline-grid; border-radius: 31px; margin: 0px -3px 0px 0px;}
 
 

 .spinner {
     -webkit-animation: rotator 1.4s linear infinite;
     animation: rotator 1.4s linear infinite;
 }

 @-webkit-keyframes rotator {
     0% {
         transform: rotate(0deg);
     }
     100% {
         transform: rotate(270deg);
     }
 }

 @keyframes rotator {
     0% {
         transform: rotate(0deg);
     }
     100% {
         transform: rotate(270deg);
     }
 }

 .path {
     stroke-dasharray: 187;
     stroke-dashoffset: 0;
     transform-origin: center;
     -webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
     animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
 }

 @-webkit-keyframes colors {
     0% {
         stroke: #0d67fe;
     }
     25% {
         stroke: #0d67fe;
     }
     50% {
         stroke: #0d67fe;
     }
     75% {
         stroke: #0d67fe;
     }
     100% {
         stroke: #0d67fe;
     }
 }

 @keyframes colors {
     0% {
         stroke: #0d67fe;
     }
     25% {
         stroke: #0d67fe;
     }
     50% {
         stroke: #0d67fe;
     }
     75% {
         stroke: #0d67fe;
     }
     100% {
         stroke: #0d67fe;
     }
 }

 @-webkit-keyframes dash {
     0% {
         stroke-dashoffset: 187;
     }
     50% {
         stroke-dashoffset: 46.75;
         transform: rotate(135deg);
     }
     100% {
         stroke-dashoffset: 187;
         transform: rotate(450deg);
     }
 }

 @keyframes dash {
     0% {
         stroke-dashoffset: 187;
     }
     50% {
         stroke-dashoffset: 46.75;
         transform: rotate(135deg);
     }
     100% {
         stroke-dashoffset: 187;
         transform: rotate(450deg);
     }
 }

 .pack-icon i {
     color: var(--main);
     font-size: 40px;
     background: #ffffff;
     border-radius: 50px;
     padding: 5px 16px;
     width: auto;
     box-shadow: 0px 0px 10px -6px #000;
     margin-bottom: 18px;
 }

 .floating {
     animation-name: floating;
     animation-duration: 3s;
     animation-iteration-count: infinite;
     animation-timing-function: ease-in-out;
     margin-left: 30px;
     margin-top: 5px;
 }

 @keyframes floating {
     from {
         transform: translate(0, 0px);
     }
     65% {
         transform: translate(0, 15px);
     }
     to {
         transform: translate(0, -0px);
     }
 }



 .container-home-icon-floating {
     padding: 20px; background: rgb(255 255 255 / 9%); border-radius: 48px; backdrop-filter: blur(5px); overflow: hidden;
 }

 .container-home-icon-floating img {
     width: 70px;
     border-radius: 291px;
 }

 .home-containers {
     margin-top: 40px;
 }

.home-row {
    border: 1px solid #d6ebfd30;
    border-radius: 25px;
    padding: 25px 10px 30px 10px !important;
    overflow: hidden;
    opacity: 0;
    transform: translateY(80px);
    transition: opacity 1.2s ease-out, transform 1.2s ease-out;
}

.home-row.show {
    opacity: 1;
    transform: translateY(0);
}


 .why-div-col {
     padding: 15px 15px;
 }

 .why-div-col-sq {
    border-radius: 28px;
    padding: 15px 10px;
    backdrop-filter: blur(5px);
    text-align: -webkit-center;
    color: #fff;
    border: 1px solid #d6ebfd30;
 }

 .why-div-col-sq img {
     display: block;
     width: 90px;
 }

 .why-div-col-sq b {
     margin-top: 21px;
     display: block;
     font-size: 18px;
     font-weight: 400;
 }

 .way-to-pay-div {
     width: auto;
     margin: 10px 0px;
     height: fit-content;
 } 

 .way-to-pay-icon {
     padding: 16px;
     background: rgb(121 121 121 / 11%);
     border-radius: 42px;
     backdrop-filter: blur(5px);
     overflow: hidden;
 }

 .way-to-pay-icon img {
     width: 71px;
     border-radius: 290px;
 }

 .way-to-pay-icon b {
     font-size: 32px;
     margin-top: 11px;
     display: block;
 }

 .col-step {
     text-align: -webkit-center;
 }

 .col-step b {
     display: block;
     margin-top: 31px;
     font-size: 24px
 }

 .order-step {
     width: fit-content;
     margin: 10px 0px;
     height: fit-content;
 }

 .order-step-img-div {
    padding: 11px;
    background: radial-gradient(135% 78% at center 98%, rgb(255 255 255 / 11%) 15%, rgba(98, 255, 179, 0) 81%, rgba(98, 255, 179, 0) 107%);
    border-radius: 42px;
    backdrop-filter: blur(5px);
    overflow: hidden;
    border: 1px solid #d6ebfd30;
    width: 110px;
 }

 .order-step-img-div img {
        width: 90px;
    
    border-radius: 290px;
 }

 .hometyping b {
     font-weight: 700;
     font-size: 4rem;
     color:#fff;
 }

 .picanto {
     padding-bottom: 50px !important;
 }

 .whyus {
     padding: 45px 35px;
     position: relative;
 }

 .whyus h2 {
     font-weight: 800;
     display: block;
     margin-bottom: 15px;
     color:#fff;
 }

 .whyus h3 {
     font-weight: 300;
     font-size: 20px;
     color:#a3a3a3;
 }

 .whyus a {
     font-weight: 600;
     font-size: 18px;
     display: block;
     position: absolute;
     bottom: 0%;
     color:#fff;
    transition: color 0.5s ease; /* Smooth transition */
 }

 button {
    transition: color 0.5s ease;
 }
 
  .whyus a:hover {
     color:#696969;
 }
 
.div-header-orderpage-button-area .sharebutton {border: 0; padding: 8px 12px 8px 11px; border-radius: 8px; margin: 0px -2px; background: #ffffff1c; backdrop-filter: blur(8px);}
    .div-header-orderpage-button-area .sharebutton i {font-size: 16px;position: initial;margin: 0px 0px 3px 0px;}
    .div-header-orderpage-button-area .addtofavoritbutton {background: #ffffff1c; backdrop-filter: blur(8px); border: 0; padding: 8px 12px 8px 11px; border-radius: 8px; margin: 0px 3px;}
.onlyph{display: none !important ;}
.faqdiv{ padding: 50px 0px 0px 70px !important; }

body{zoom: 0.9;}

.onlyphinline{display: none!important;}
.onlyphx{display: none !important;}

.home-go-next{text-align: center;
    font-size: 18px;
    color: #fff;
    text-decoration: 0;
    margin: 100px 0px 10px 0px;
    font-weight: 600;
cursor: pointer;}

.rev-home-go-next{text-align: center;
    font-size: 18px;
    color: #656565;
    text-decoration: 0;
    margin: 31px 0px 10px 0px;
    font-weight: 400;
    cursor: pointer;
    display: block;}

.rev-home-go-next a:hover { color: #fff !important;}

.faqtitle{    margin-top: 20px;
    z-index: 2;
    margin-bottom: 10px;}
.faqtitle h2{font-weight: 800; display: block; margin-bottom: 0px; color:#fff;}
                .faqtitle p{    font-size: 21px;
    color: #959595;}
 .finish_payment_orders  {background: var(--main);color: #fff;font-weight: 300;border: 0;padding: 6px 11px 4px 10px;font-size: 14px;border-radius: 9px;margin-top: -4px;box-shadow: 0px 0px 16px -7px #000;}
    .track_order_orders  {background: #000;color: #fff;font-weight: 300;border: 0;padding: 6px 11px 4px 10px;font-size: 14px;border-radius: 9px;margin-top: -4px;box-shadow: 0px 0px 16px -7px #000;}

.pay-secure-page { background: #0d67fe;margin: 0px;padding: 9px;border-radius: 16px 16px 0px 0px;color: #fff;text-align: center; }

 .shop-shadow-left {width: 110px; height: 200px; position: absolute; z-index: 2; background: linear-gradient(271deg, rgba(255,255,255,0) 0%, rgba(19,23,32,1) 90%);}
                .shop-shadow-right {width: 110px;height: 200px;position: absolute;z-index: 2;background: linear-gradient(91deg, rgba(255,255,255,0) 0%, rgba(19,23,32,1) 90%); right: 290px;}
                .breadcrumb-item.active {color:#fff !important;}
                .breadcrumb a:hover {color:#151f30;}
                
  @media only screen and (min-width: 601px)
 {      
     .opttions-product-div .product-div .gradient-div .pricing .price b { font-size: 24px; }
     .pricebuttondiv{width: fit-content; display: inline-block;}
     .opttions-product-div .product-div .gradient-div .pricing .price {text-align: left; padding-left: 14px; position: absolute;top: 50%;-ms-transform: translateY(-50%);transform: translateY(-50%);width: fit-content; }
     .opttions-product-div .product-div .gradient-div .pricing .buttongo button {background: var(--main); border: 0; padding: 6px 10px 0px 10px; border-radius: 30px; margin: -1px 0 0 14px;}
     .opttions-product-div .product-div .gradient-div .pricing  { text-align: center; padding: 0; }

    .m1{padding: 25px 10px 0px 10px !important;margin: 0;overflow: hidden;border-radius: 30px;height: fit-content;margin: 0;}
    .m1 h1 {font-weight: 700; font-size: 54px; line-height: 49px; letter-spacing: -0.02em;}
    .m1 h1 t {background: linear-gradient(to right, #a5a5a5 0%, #757575 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    .m1 a {text-align: left; border-radius: 7px;width: fit-content;color: #fff !important;font-size: 14px;position: relative; margin-top: 160px;}
    .arated {font-size: 14px;color: #979797;font-weight: 400;text-align: left;display: block; margin-top: 4px;}
 }

 @media only screen and (max-width: 600px) {
     
    .m1{ overflow: hidden; border-radius: 30px; height: fit-content; margin: 0; text-align: center;}
    .m1 h1 {padding: 0; font-weight: 900; font-size: 48px; line-height: 62px; letter-spacing: -.02em;}
    .m1 h1 t {background: linear-gradient(to right, #a5a5a5 0%, #757575 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    .m1 h3 {display: none !important;}
    .m1 a {text-align: center !important; border-radius: 7px; width: fit-content; color: #fff !important; font-size: 14px; position: relative; width: 100%;}
    .arated {font-size: 14px; color: #979797; font-weight: 400; text-align: center; /* display: block; */ margin-top: 3px; display: block; margin-bottom: 40px; margin-top: 4px; }

     .normal-product-div .product-div .gradient-div .div-icon { padding: 16px 0px 17px 0px !important; }
     .normal-product-div .product-div .gradient-div .pricing { margin: 32px 0px 20px 0px !important;}
     .opttions-product-div .product-div .gradient-div .titling {margin: 8px 0 0 6px !important;}
     .pricebuttondiv{width: fit-content; display: inline-block; background: #ffffff2b; padding: 5px 12px 3px 12px; border-radius: 12px; }
     .opttions-product-div .product-div .gradient-div .pricing .price b { font-size: 19px; }
     .opttions-product-div .product-div .gradient-div .pricing .buttongo button { background: var(--main); border: 0; padding: 6px 10px 0px 10px; border-radius: 30px; margin: -5px 0 0 14px; right: 7%; position: absolute; }
     .opttions-product-div .product-div .gradient-div .pricing  { text-align: center; padding: 0; margin-top: 8px;}
     .opttions-product-div .product-div .gradient-div { padding: 12px 2px 18px 2px !important;}
     
     .shop-shadow-right{right:5px;}
     
     body{zoom: 0.75;}
    .pay-secure-page{border-radius: 0 !important;}
    .container-mobile {padding: 0 !important;}
    .payment-tab .button-check {margin: 10px 5px 6px 5px !important; width: 100% !important;}
    .payment-tab .button-back  {margin: 10px 5px 6px 5px !important; width: 100% !important;}
    .order-info-rab .button-info {margin: 10px 5px 6px 5px !important; width: 100% !important;}
    .finish_payment_orders { width: 100% !important; padding: 8px 10px; font-size: 16px;  }
    .track_order_orders {width: 100% !important; padding: 8px 10px; font-size: 16px;  }

.faqtitle h2{font-weight: 800; display: block; margin-bottom: 0px; color:#fff;}
				.faqtitle p{font-size: 24px; color:#fff;}
				
    .faqtitle p {
    font-size: 18px !important; 
     color:#fff;
}

.faqtitle{
    margin-top: 50px;
    color:#fff;
}
   
    
    .page{
        padding: 0px 0px;
    }

    .container{
        padding: 0px 20px;
    }

     .hover_bkgr_fricc .helper {
     display: none;
     width: 0;
     height: 0;
     position: absolute;
 }


    .whyus h2 {
    text-align: center;
     font-weight: 800;
     display: block;
     margin-bottom: 15px;
    }
    .whyus h3 {
    display: block;
    text-align: center;
     font-weight: 300;
     font-size: 22px;
     margin-top: 6px;
    }
    .onlypc{
        display: none !important;
    }
    
  
  
    .header-product-div-not-order{
        padding: 0px 0px;
    }
    
    .titlilaria dic{
        font-size: 14px !important;
        padding: 5px 8px 3px 8px !important;
        margin: 1px 0px 0px 8px !important;
    }
    
    .shop-product-main{padding: 8px 0px !important;}
    .header-product-div{border-radius: 16px 16px 0px 0px !important;}
    .order-details { border-radius:  0px 0px 18px 18px !important;}
    
     .commentsal img {width:115px !important; border-radius: 50px; background:var(--balckgrad2); }
    .animation-card_content{
        width: 270px !important;
     }

    .curecyswitcher {margin: 6px -14px 0px 0px !important; }
    .langswitcher {margin: 6px 6px 0px 8px !important; }
    
    .titlilaria h2 {
    font-size: 1.1rem;  
    }
    .page{margin-top: -35px;}

 .hover_bkgr_fricc>div { 
            position: fixed !important;
            left: 0% !important;
            height: auto !important;
            border-radius: 30px 30px 0px 0px !important;
            animation: smooth-appear 1s ease forwards;
        }
    
     .User-area { width: 25px !important; height: 0 !important;}
     
     
     
    .onlyph{display: block !important;}
    
     .faqdiv{ padding: 30px 30px 0px 30px !important; }
     
    .onlyphinline{display: inline !important;}
    
    .opttions-product-div .product-div .gradient-div .titling { position: initial !important; } 
    .opttions-product-div .product-div .gradient-div .pricing .price r { display: contents !important; }
    .opttions-product-div .product-div .gradient-div .pricing .price { text-align: left; padding-left: 28px; }
    
    .onlyphx{display: flex !important;}
    
     .why-div-col-sq b {
         font-size: 16px;
     }
     .whyus a {
         font-weight: 600;
         font-size: 18px;
         display: block;
         position: initial;
         bottom: 10%;
         margin: 20px 0px 2px 0px;
     }
     .hometyping b {
         font-weight: 700;
         font-size: 2.7rem;
     }
     .container-home-icon-floating img {
         width: 60px !important;
     }
     .container-home {
        height: auto !important;
        display: block !important;
        padding: 110px 0px !important;
     }
     
     .container-home-icon-floating {
         padding: 10px;
         border-radius: 35px;
     }
     .home-containers {
         padding: 0px 25px;
     }
     .whyus {
         padding: 20px 15px;
     }
     .why-div-col {
         padding: 15px;
     }

     .way-to-pay-icon img {
         width: 40px;
     }
     .home-containers {
         padding: 0px 35px;
     }
     .way-to-pay-icon b {
         font-size: 22px;
         margin-top: 6px;
         display: block;
     }
     .footer-links-icon {
         text-align: center;
     }
     .home-row {
         padding: 0px 0px 13px 0px !important;
     }
     h3 {
         font-size: 20px !important;
     }
     .home-floating-icons {
         display: none;
     }
     .hover_bkgr_fricc>div {
        background: #000;
         display: inline-block;
         height: inherit;
         vertical-align: middle;
         padding: 0px 0px 10px 0px!important;
         width: 100%;
         position: relative;
         border-radius: 40px;
         animation: smooth-appear 1s ease forwards;
     }
     .why-div-col {
         padding: 5px;
     }
     .col-step {
         margin: 10px 0px;
     }
     .contmobile {
        padding: 15px !important;
        margin: 0 !important;
     }
 }

 @media screen and (min-width: 800px) {
    .cherry{min-height: 350px;}
 }

 .home-ico-map0 {
     position: absolute;
     left: 0;
     margin-left: 14%;
     top: 18%;
 }

 .home-ico-map1 {
     position: absolute;
     left: 0;
     margin-left: 5%;
     top: 36%;
 }

 .home-ico-map2 {
     position: absolute;
     left: 0;
     margin-left: 3%;
     top: 63%;
 }

 .home-ico-map3 {
     position: absolute;
     right: 0;
     margin-right: 19%;
     top: 33%;
 }

 .home-ico-map4 {
     position: absolute;
     right: 0;
     margin-right: 49%;
     top: 20%;
 }

 .home-ico-map5 {
     position: absolute;
     right: 0;
     margin-right: 31%;
     top: 16%;
 }

 .home-ico-map6 {
     position: absolute;
     right: 0;
     margin-right: 11%;
     top: 79%;
 }

 .home-ico-map7 {
     position: absolute;
     left: 0;
     margin-left: 18%;
     top: 58%;
 }

 .home-ico-map8 {
     position: absolute;
     left: 0;
     margin-left: 29%;
     top: 11%;
 }

 .home-ico-map9 {
     position: absolute;
     left: 0;
     margin-left: 23%;
     top: 32%
 }

 .home-ico-map10 {
     position: absolute;
     left: 0;
     margin-left: 41%;
     top: 80%;
 }

 .home-ico-map11 {
     position: absolute;
     left: 0;
     margin-left: 30%;
     top: 64%;
 }

 .home-ico-map12 {
     position: absolute;
     right: -3px;
     margin-right: 23%;
     top: 62%;
 }

 .home-ico-map13 {
     position: absolute;
     right: -3px;
     margin-right: 38%;
     top: 76%;
 }

 .home-ico-map14 {
     position: absolute;
     right: 0;
     margin-right: 6%;
     top: 18%;
 }

 .home-ico-map15 {
     position: absolute;
     left: 0;
     margin-left: 14%;
     top: 82%;
 }

 .home-ico-map16 {
     position: absolute;
     right: 0;
     margin-right: 3%;
     top: 58%;
 }


@-webkit-keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 11));
  }
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 11));
  }
}
.slider {
      background: #010101;
    height: 100px;
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.slider::before, .slider::after {
  background: linear-gradient(to right, #000 0%, rgba(255, 255, 255, 0) 100%);
  content: "";
  height: 100px;
  position: absolute;
  width: 200px;
  z-index: 2;
}

.slider img {
    width: auto;
    border-radius: 241px;
    height: 55px;
    background: #242429;
    padding: 6px;
}

.slider::after {
  right: 0;
  top: 0;
  transform: rotateZ(180deg);
}
.slider::before {
  left: 0;
  top: 0;
}
.slider .slide-track {
  -webkit-animation: scroll 10s linear infinite;
          animation: scroll 10s linear infinite;
  display: flex;
  width: calc(250px * 22);
}
.slider .slide {
  height: 100px;
  width: 250px;
}

::selection{
  color: #fff;
  background: var(--grad2);
}


/* Place the navbar at the bottom of the page, and make it stick */
.navbarx {
    background: var(--balckgrad2);
    overflow: hidden;
    position: fixed;
    bottom: 0;
    width: 100%;
    box-shadow: 0px 0px 16px -12px #000;
    margin: 0;
    padding: 12px 0px 6px 0px;
    z-index: 10 !important;
}

.navbarx i {
        display: block;
    margin-bottom: -8px;
    font-size: 22px;
}

/* navbarx the links inside the navigation bar */
.navbarx a {
      float: left;
    display: block;
    color: #727272;
    text-align: center;
    padding: 0px;
    text-decoration: none;
    font-weight: 400;
    font-size: 15px;
}

/* Change the color of links on hover */
.navbarx a:hover {  #ccc
}

/* Add a color to the active/current link */
.navbarx a.active {
  color: #0d6efd;
}

.curecyswitcher {background: #fff; margin: 4px -14px 0px 10px; font-size: 18px; z-index: 10; height: fit-content; border-radius: 20px; padding: 2px 10px; box-shadow: 0px 0px 4px -1px #aca8a8; cursor: pointer; color:#fff;}
.langswitcher {width: 28px; margin: 4px 6px 0px 8px; height: fit-content; max-height:30px; box-shadow: 0px 0px 4px -1px #797878; border-radius: 13px; cursor: pointer;}

.success-checkmark {
  width: 80px;
  height: 115px;
  margin: 0 auto;
}
.success-checkmark .check-icon {
  width: 80px;
  height: 80px;
  position: relative;
  border-radius: 50%;
  box-sizing: content-box;
  border: 4px solid #fff;
}
.success-checkmark .check-icon::before {
  top: 3px;
  left: -2px;
  width: 30px;
  transform-origin: 100% 50%;
  border-radius: 100px 0 0 100px;
}
.success-checkmark .check-icon::after {
  top: 0;
  left: 30px;
  width: 60px;
  transform-origin: 0 50%;
  border-radius: 0 100px 100px 0;
  animation: rotate-circle 4.25s ease-in;
}
.success-checkmark .check-icon::before, .success-checkmark .check-icon::after {
  content: "";
  height: 100px;
  position: absolute;
  transform: rotate(-45deg);
}
.success-checkmark .check-icon .icon-line {
  height: 5px;
  background-color: #fff;
  display: block;
  border-radius: 2px;
  position: absolute;
  z-index: 10;
}
.success-checkmark .check-icon .icon-line.line-tip {
  top: 46px;
  left: 14px;
  width: 25px;
  transform: rotate(45deg);
  animation: icon-line-tip 0.75s;
}
.success-checkmark .check-icon .icon-line.line-long {
  top: 38px;
  right: 8px;
  width: 47px;
  transform: rotate(-45deg);
  animation: icon-line-long 0.75s;
}
.success-checkmark .check-icon .icon-circle {
  top: -4px;
  left: -4px;
  z-index: 10;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  position: absolute;
  box-sizing: content-box;
}
.success-checkmark .check-icon .icon-fix {
  top: 8px;
  width: 5px;
  left: 26px;
  z-index: 1;
  height: 85px;
  position: absolute;
  transform: rotate(-45deg);
}

@keyframes rotate-circle {
  0% {
    transform: rotate(-45deg);
  }
  5% {
    transform: rotate(-45deg);
  }
  12% {
    transform: rotate(-405deg);
  }
  100% {
    transform: rotate(-405deg);
  }
}
@keyframes icon-line-tip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }
  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }
  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}
@keyframes icon-line-long {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  84% {
    width: 55px;
    right: 0px;
    top: 35px;
  }
  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}

.commentsal {    padding: 20px 20px 6px 20px; margin: 10px 0px; border-radius: 20px; height: 160px; /* box-shadow: 0px 0px 15px -12px #000; */ overflow: hidden; border: 1px solid #ffffff30;}
.commentsal img {width:70px; border-radius: 50px;  background: #d4e4ff;}
.commentsal name {font-size: 18px; font-weight:600;display: block;}
.commentsal name t {float: right;font-size: 14px;color: #818181;font-weight: 400;}
.commentsal time {font-size: 14px; font-weight: 600; color: #b5b5b5;}
.commentsal time img {border-radius: 0px; width: 95px; background: none;}
.commentsal p    {margin-top:10px;}
            
.form-control { 
    color: #fff !important;
    background-color: #000000 !important;
    border: 1px solid #252525 !important;
}

.add-to-cart{
    color: #fff !important;
}
.added {
    color: #fff !important;
}

.text-muted{
    color: #b5b5b5 !important;
    margin: 6px 0px 0px 4px !important;
    display: block !important;
}

.form-control:disabled, .form-control[readonly] {
    background-color: #000  !important;
}

.input-group-text {
    border: 1px solid #252525 !important;
}


.cart-button {
	    padding: 12px 70px;
    margin: 7px 5px 6px 5px;
    border-radius: 6px;
    
    font-size: 14px;
    position: relative;
    
    border: 0;
    
    outline: none;
    cursor: pointer;
    color: #fff;
    transition: .3s ease-in-out;
    width: 100%;
    overflow: hidden;
    font-weight: 500;
}
.cart-button:hover {
	background-color: #fff;
}
.cart-button:hover span{
	color: #000;
}

.cart-button:active {
	transform: scale(.9);
}

.cart-button .fi-sr-shopping-cart {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: -10%;
	font-size: 2em;
	transform: translate(-50%,-50%);
	color: #fff;
}
.cart-button .fi-sr-box {
	position: absolute;
	z-index: 3;
	top: -20%;
	left: 52%;
	font-size: 1.2em;
	transform: translate(-50%,-50%);
	color: #ffffffa3;
}
.cart-button span {
	position: absolute;
	z-index: 3;
	left: 50%;
	top: 50%;
	font-size: 1.2em;
	transform: translate(-50%,-50%);
	
}
.cart-button span.add-to-cart {
	opacity: 1;
}
.cart-button span.added {
	opacity: 0;
}

.cart-button.clicked .fi-sr-shopping-cart {
	animation: cart 1.5s ease-in-out forwards;
}
.cart-button.clicked .fi-sr-box {
	animation: box 1.5s ease-in-out forwards;
}
.cart-button.clicked span.add-to-cart {
	animation: txt1 1.5s ease-in-out forwards;
}
.cart-button.clicked span.added {
	animation: txt2 1.5s ease-in-out forwards;
}
@keyframes cart {
	0% {
		left: -10%;
	}
	40%, 60% {
		left: 50%;
	}
	100% {
		left: 110%;
	}
}
@keyframes box {
	0%, 40% {
		top: -20%;
	}
	60% {
		top: 40%;
		left: 52%;
	}
	100% {
		top: 40%;
		left: 112%;
	}
}
@keyframes txt1 {
	0% {
		opacity: 1;
	}
	20%, 100% {
		opacity: 0;
	}
}
@keyframes txt2 {
	0%, 80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes shakeit {
  25% {
    transform:translateX(8px)
  }
  50% {
    transform:translateX(-6px);
  }
  75% {
    transform:translateX(4px);
  }
  100% {
    transform:translateX(0);
  }
}

.shake{animation: shakeit 0.5s;}




.icon-svg--color-silver{
    fill:#ccc;
    color:#ccc
    
}
.icon-svg--color-blue{
    fill:var(--main);
    color:var(--main)
}
.icon-svg{
    display:inline-block;
    vertical-align:middle;
    height:16px;
    width:16px;
    margin-top: -3px;
}
.heart-full{
    position:absolute;
    left:0;
    top:0;
    opacity:0
}
.btn__effect{
    display:inline-block;
    position:relative
}
.effect-group{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    transform:rotate(25deg)
}
.effect-group .effect{
    display:block;
    position:absolute;
    top:38%;
    left:50%;
    width:20px;
    transform-origin:0 2px
}
.effect-group .effect:nth-child(2){
    transform:rotate(72deg)
}
.effect-group .effect:nth-child(3){
    transform:rotate(144deg)
}
.effect-group .effect:nth-child(4){
    transform:rotate(216deg)
}
.effect-group .effect:nth-child(5){
    transform:rotate(288deg)
}
.effect-group .effect:before{
    content:"";
    display:block;
    position:absolute;
    right:0;
    border-radius:1.5px;
    height:3px;
    background:var(--main)
}
.effect-group .effect:after{
    content:"";
    display:block;
    position:absolute;
    top:10px;
    right:10%;
    border-radius:50%;
    width:3px;
    height:3px;
    background:#f60;
    transform:scale(0,0)
}
.active .heart-stroke{
    opacity:0
}
.active .heart-full{
    opacity:1
}
.active .icon-svg{
    -webkit-animation:bounceIn .5s linear;
    animation:bounceIn .5s linear;
    margin-top: 4px;
}
.active .effect:before{
    -webkit-animation:fireworkLine .5s linear .1s;
    animation:fireworkLine .5s linear .1s
}
.active .effect:after{
    -webkit-animation:fireworkPoint .5s linear .1s;
    animation:fireworkPoint .5s linear .1s
}
.broken-heart{
    position:absolute;
    left:-16px;
    top:0;
    opacity:0
}
.broken-heart--left{
    transform:rotate(0);
    transform-origin:60% 200%
}
.broken-heart--right{
    transform:rotate(0);
    transform-origin:63% 200%
}
.broken-heart--crack{
    stroke-dasharray:15;
    stroke-dashoffset:15
}
.deactivate .broken-heart{
    opacity:1
}
.deactivate .broken-heart--left{
    -webkit-animation:crackLeft .35s cubic-bezier(.68,-.55,.265,2.85) .15s forwards,hide .25s ease-in .55s forwards;
    animation:crackLeft .35s cubic-bezier(.68,-.55,.265,2.85) .15s forwards,hide .25s ease-in .55s forwards
}
.deactivate .broken-heart--right{
    -webkit-animation:crackRight .35s cubic-bezier(.68,-.55,.265,2.85) .15s forwards,hide .25s ease-in .55s forwards;
    animation:crackRight .35s cubic-bezier(.68,-.55,.265,2.85) .15s forwards,hide .25s ease-in .55s forwards
}
.deactivate .broken-heart--crack{
    -webkit-animation:crack .2s ease-in forwards;
    animation:crack .2s ease-in forwards
}
@-webkit-keyframes pulse{
    0%{
        opacity:1;
        transform-origin:center center;
        transform:scale(1)
    }
    50%{
        opacity:.6;
        transform:scale(1.15)
    }
    100%{
        opacity:1;
        transform:scale(1)
    }
}
@keyframes pulse{
    0%{
        opacity:1;
        transform-origin:center center;
        transform:scale(1)
    }
    50%{
        opacity:.6;
        transform:scale(1.15)
    }
    100%{
        opacity:1;
        transform:scale(1)
    }
}
@-webkit-keyframes pulseBlue{
    0%{
        transform-origin:center center;
        transform:scale(1);
        fill:#ccc
    }
    50%{
        transform:scale(1.15);
        fill:var(--main)
    }
    100%{
        transform:scale(1);
        fill:#ccc
    }
}
@keyframes pulseBlue{
    0%{
        transform-origin:center center;
        transform:scale(1);
        fill:#ccc
    }
    50%{
        transform:scale(1.15);
        fill:var(--main)
    }
    100%{
        transform:scale(1);
        fill:#ccc
    }
}
@-webkit-keyframes fireworkLine{
    0%{
        right:20%;
        transform:scale(0,0)
    }
    25%{
        right:20%;
        width:6px;
        transform:scale(1,1)
    }
    35%{
        right:0;
        width:35%
    }
    70%{
        right:0;
        width:4px;
        transform:scale(1,1)
    }
    100%{
        right:0;
        transform:scale(0,0)
    }
}
@keyframes fireworkLine{
    0%{
        right:20%;
        transform:scale(0,0)
    }
    25%{
        right:20%;
        width:6px;
        transform:scale(1,1)
    }
    35%{
        right:0;
        width:35%
    }
    70%{
        right:0;
        width:4px;
        transform:scale(1,1)
    }
    100%{
        right:0;
        transform:scale(0,0)
    }
}
@-webkit-keyframes fireworkPoint{
    30%{
        transform:scale(0,0)
    }
    60%{
        transform:scale(1,1)
    }
    100%{
        transform:scale(0,0)
    }
}
@keyframes fireworkPoint{
    30%{
        transform:scale(0,0)
    }
    60%{
        transform:scale(1,1)
    }
    100%{
        transform:scale(0,0)
    }
}
@-webkit-keyframes bounceIn{
    0%{
        transform:scale(0)
    }
    30%{
        transform:scale(1.25)
    }
    50%{
        transform:scale(.9)
    }
    70%{
        transform:scale(1.1)
    }
    80%{
        transform:scale(1)
    }
}
@keyframes bounceIn{
    0%{
        transform:scale(0)
    }
    30%{
        transform:scale(1.25)
    }
    50%{
        transform:scale(.9)
    }
    70%{
        transform:scale(1.1)
    }
    80%{
        transform:scale(1)
    }
}
@-webkit-keyframes crackLeft{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(-45deg)
    }
}
@keyframes crackLeft{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(-45deg)
    }
}
@-webkit-keyframes crackRight{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(45deg)
    }
}
@keyframes crackRight{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(45deg)
    }
}
@-webkit-keyframes crack{
    0%{
        stroke-dasharray:15;
        stroke-dashoffset:15
    }
    80%{
        stroke-dasharray:15;
        stroke-dashoffset:0;
        opacity:1
    }
    100%{
        opacity:0
    }
}
@keyframes crack{
    0%{
        stroke-dasharray:15;
        stroke-dashoffset:15
    }
    80%{
        stroke-dasharray:15;
        stroke-dashoffset:0;
        opacity:1
    }
    100%{
        opacity:0
    }
}
@-webkit-keyframes hide{
    0%{
        opacity:1
    }
    100%{
        opacity:0
    }
}
@keyframes hide{
    0%{
        opacity:1
    }
    100%{
        opacity:0
    }
}

 .imgshopbackimgl1{
            width: 100%;height: 540px;background-size: cover;position: absolute;
        }
        .imgshopbackimgl2{
             background: linear-gradient(178deg, rgb(255 255 255 / 0%) -53%, var(--mainback) 87%); height: 540px; top: 0; position: relative; right: 0; 
        }
        .vidshopbackimgl1{
            width: 100%;height: 540px;background-size: cover;position: absolute;overflow: hidden;
        }
        .vidshopbackimgl1 iframe{
            width: 100vw; height: 120vh; position: absolute; z-index: 0; top: -310px;
        }
        .vidshopbackimgl2{
             background: linear-gradient(178deg, rgb(255 255 255 / 0%) -53%, var(--mainback) 87%);height: 540px;position: absolute;right: 0;z-index: 0;width: 100%;backdrop-filter: blur(4px);
        }
        
        .header-product-div {
               margin-top: 120px; 
            }
            
             .vidshopbackimgl1 video {width: 200vw; object-fit: cover; position: absolute; top: -360px;}
        
        
        @media only screen and (max-width: 600px) { 

            .h2, h2 { font-size: calc(1.95rem + .9vw) !important; }

            .div-header-orderpage-button-area .addtofavoritbutton {background: #ffffff1c; backdrop-filter: blur(8px); border: 0; padding: 17px 16px 15px 15px; border-radius: 8px; margin: 0px 3px;}
            
             .vidshopbackimgl1 video {width: 380vw !important;  top: -240px !important;}
             
            .icon-svg {
                height: 26px !important;
                width: 26px !important;
            }
            
            .div-header-orderpage-button-area .sharebutton {
               border: 0;
    padding: 34px 44px 23px 16px;
    border-radius: 8px;
    margin: 0px -2px;
    background: #ffffff1c;
    backdrop-filter: blur(8px);
            }
            
            .div-header-orderpage-button-area .sharebutton  i {
                font-size: 24px !important;
                margin-top: -19px; position: absolute;
                color:#ccc;
            }
            
            .imgshopbackimgl1{
            width: 100%;height: 540px;background-size: cover;position: absolute;
            }
            .imgshopbackimgl2{
                 background: linear-gradient(178deg, rgb(255 255 255 / 0%) -53%, var(--mainback) 87%); height: 540px; top: 0; position: relative; right: 0; 
            }
            .vidshopbackimgl1{
                width: 100%;height: 540px;background-size: cover;position: absolute;overflow: hidden;
            }
            .vidshopbackimgl1 iframe{
               width: 250%; height: 135vh; position: absolute; z-index: 0; top: -340px; left: -30%;
            }
            .vidshopbackimgl2{
                 background: linear-gradient(178deg, rgb(255 255 255 / 0%) -53%,  var(--mainback) 87%); height: 540px; position: absolute; right: 0; z-index: 0; width: 100%;backdrop-filter: blur(4px);
            }
            
            .div-header-orderpage {
                text-align: -webkit-center;
                padding:  15px !important;
            }
            
            .header-product-div {
               margin-top: 100px; 
            }
            
            .div-icon-logo-orderpage {
                padding: 16px 9px !important;
            }
            
            .mam-div-icon-logo-orderpage{
                padding: 15px 15px !important;
            }
            
            .div-header-orderpage-button-area .createorderbutton {
                padding: 12px 38px !important; border-radius: 8px; width: 70%; font-size: 19px !important;
            }
            
            .header-product-div-ma {
           margin-top: 20px !important; 
            }
            
            .active .icon-svg {
                margin-top: -1px;
            }
            
            .div-header-orderpage h1 {
                margin-bottom: 30px !important; 
            }
            
            
            
        }
        
        
        .mam-div-icon-logo-orderpage { text-align: -webkit-center;     padding: 0;}
                    .div-icon-logo-orderpage { text-align: -webkit-center; background: #ffffff1c;  height: fit-content; margin-top:13px !important; padding: 10px ; width: fit-content; border-radius: 30px; }
                    .div-icon-logo-orderpage img { width: 91%; max-width: 120px; border-radius: 27px; display: block; }
                    .div-icon-logo-orderpage b {margin-top: 12px; display: block; font-weight: 600;   text-align:center;  font-size: 16px; }
                    .div-icon-logo-orderpage t { margin-top: -3px; display: block; font-weight: 500; color: #9aa0a6; text-align:center; font-size: 16px; text-decoration: line-through; }
                    
                    .div-icon-logo-optionpage { text-align: -webkit-center; background: #ffffff1c;  height: fit-content; margin-top:13px !important; padding: 14px 10px ; width: fit-content; border-radius: 30px; }
                    .div-icon-logo-optionpage img {width: 91%; max-width: 120px; border-radius: 27px; display: block; }
                    .div-icon-logo-optionpage b {margin-top: 12px;display: block;font-weight: 400; font-size: 16px; color: #ccc; }
                    .div-icon-logo-optionpage t {margin-top: 0px;display: block;font-weight: 500;color: #ffffff;font-size: 16px;/* text-decoration: line-through; */ }
                    
                    
                    .div-header-orderpage-v-line { display: inline-block; margin: 0px 14px 0px 21px; background: #868686; height: 32px; width: 1px; }
                    
                    .div-header-orderpage { box-shadow: none;  margin: 0 !important; color: #fff;  padding: 15px 15px 15px 30px;}
                    .div-header-orderpage h1 { display: block; margin-bottom: 11px; font-weight: 600; margin-left: 0 !important; }
                    
                    .div-header-orderpage .reviewdiv {display: inline-block;}
                    .div-header-orderpage .reviewdiv r {font-size: 13px; color: #9aa0a6; font-weight: 400; margin-top: -1px; display: block;}
                    .div-header-orderpage .reviewdiv t {display: block; text-align: center; font-size: 14px;}
                    
                    .div-header-orderpage .categorydiv {display: inline-block;}
                    .div-header-orderpage .categorydiv t {display: block; text-align: center; font-size: 14px;}
                    .div-header-orderpage .categorydiv r {font-size: 13px; color: #9aa0a6; font-weight: 400; margin-top: -1px; display: block; }
                    
                    .div-header-orderpage .delivreddiv {display: inline-block;}
                    .div-header-orderpage .delivreddiv t {display: block; text-align: center; font-size: 14px;}
                    .div-header-orderpage .delivreddiv r {font-size: 13px; color: #9aa0a6; font-weight: 400; margin-top: -1px; display: block;}
                    
                    .div-header-orderpage-button-area {display: block; margin-top: 22px;}
                    .div-header-orderpage-button-area .createorderbutton {border: 0; background: var(--main); padding: 8px 38px; border-radius: 8px;}
                    
                    

.normal-product-div {position: relative; overflow: hidden; padding: 10px 10px !important;}
.normal-product-div a {text-decoration:none;}
.normal-product-div .product-div { max-width: 255px; min-width:0; margin: 0; padding: 0; border-radius: 28px; transition: 1s; }
.normal-product-div .product-div .gradient-div { background: var(--balckgrad2); border-radius: 20px; margin: 0; padding-top: 1px; }
.normal-product-div .product-div .gradient-div .top-banner { padding: 16px 8px; margin: 5px 0px 5px 0px; }
.normal-product-div .product-div .gradient-div .top-banner .part1 { padding: 0; font-weight: 500; }
.normal-product-div .product-div .gradient-div .top-banner .part2 { text-align: right; margin: 0; padding: 0; }
.normal-product-div .product-div .gradient-div .div-icon { text-align: -webkit-center;padding: 40px 0px 17px 0px; }
.normal-product-div .product-div .gradient-div .div-icon .shop-product-icon { padding: 7px; border-radius: 26px; backdrop-filter: blur(5px); overflow: hidden; width: fit-content; }
.normal-product-div .product-div .gradient-div .titling {text-align: center; padding: 0 !important;}
.normal-product-div .product-div .gradient-div .titling b {display: block; font-size: 22px;}
.normal-product-div .product-div .gradient-div .titling t {display: block; color: #939393; font-size: 14px; margin-top: -1px;}
.normal-product-div .product-div .gradient-div .pricing  {margin: 50px 0px 20px 0px; text-align: center; padding: 0; }
.normal-product-div .product-div .gradient-div .pricing .startfrom {text-align: left; padding-left: 14px; }
.normal-product-div .product-div .gradient-div .pricing .startfrom b {font-size: 24px;}
.normal-product-div .product-div .gradient-div .pricing .startfrom r {color: #ccc; margin-top: -8px; display: block; }

.normal-product-div .product-div .gradient-div .pricing .price {text-align: left; padding-left: 14px; }
.normal-product-div .product-div .gradient-div .pricing .price b {font-size: 24px;}
.normal-product-div .product-div .gradient-div .pricing .price r {color: #ccc; text-decoration: line-through; margin-top: -8px; display: block; }

.normal-product-div .product-div .gradient-div .pricing .buttongo {align-items: center; }
.normal-product-div .product-div .gradient-div .pricing .buttongo button {background: var(--main); border: 0; padding: 6px 10px 0px 10px; border-radius: 30px; margin-top: 7px;}
.normal-product-div .product-div .gradient-div .pricing .buttongo button i {font-size: 24px;}

.opttions-product-div {position: relative; overflow: hidden; padding: 10px 10px !important;}
.opttions-product-div a {text-decoration:none;}
.opttions-product-div .product-div { margin: 0; padding: 0; border-radius: 28px;  }
.opttions-product-div .product-div .gradient-div { background: var(--balckgrad2); border-radius: 20px; margin: 0; padding: 12px 2px; }

.opttions-product-div .product-div .gradient-div .div-icon { text-align: left; }
.opttions-product-div .product-div .gradient-div .div-icon .shop-product-icon { padding: 7px; border-radius: 26px; backdrop-filter: blur(5px); overflow: hidden; width: fit-content; display: inline-flex; }
.opttions-product-div .product-div .gradient-div .titling {text-align: left; padding: 0px 0 0 0 !important; display: inline-block; margin: 8px 0 0 18px; position: absolute; ;}
.opttions-product-div .product-div .gradient-div .titling b {display: block; font-size: 22px;}
.opttions-product-div .product-div .gradient-div .titling rated {font-size: 14px; font-weight: 400; background: #ffffff33; padding: 5px 10px 3px 9px; border-radius: 6px; color: #ffffff;}
.opttions-product-div .product-div .gradient-div .titling t {display: block; color: #939393 !important; font-size: 14px; margin-top: -1px;}

.opttions-product-div .product-div .gradient-div .pricing .startfrom {text-align: left; padding-left: 14px; }
.opttions-product-div .product-div .gradient-div .pricing .startfrom b {font-size: 24px;}
.opttions-product-div .product-div .gradient-div .pricing .startfrom r {color: #ccc; margin-top: -8px; display: block; }

.opttions-product-div .product-div .gradient-div .pricing .price r {color: #ccc; text-decoration: line-through; margin-top: -8px; display: block; }

.opttions-product-div .product-div .gradient-div .pricing .buttongo {align-items: center; }
.opttions-product-div .product-div .gradient-div .pricing .buttongo button i {font-size: 24px;}

/* width */
::-webkit-scrollbar {
  width: 6px;
}

/* Track */
::-webkit-scrollbar-track {
  background: none ;
  
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
  border-radius:40px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #fff;
}

.dropdown-menu .dropdown-item  a { 
    padding: 12px 16px !important; 
} 

.setting-description {
  background-color: #000; 
  border-radius: 15px 15px 0px 0px;
  min-width: 231.5px;
  width: 100% !important;
  border: 1px solid #252525 !important;
  border-bottom: none !important;
}

h10 {
  font-size: 12px;
  margin-left: 5px !important;
  letter-spacing: 0.8px;
  font-family: Arial !important;
}

.setting-description-text {
  padding-top: 18px !important;
  color: #81828b;
  font-family: Gilroy-Regular !important;
}

/* the code below is for the dropdown menu */
.wrapper-dropdown {
  position: relative;
  display: inline-block;
  min-width: 231.5px;
  width: 100% !important;
 
  padding: 0px 0px 0px 0px;
  min-height: 44px;
  border-radius: 0px 0px 15px 15px;
  background: #000;
  text-align: left;
  color: #fff;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-bottom: 20px;
  font-family: Arial;
  border: 1px solid #252525 !important;
    border-top: none !important;
}


.scrollable-menu {
  height: auto;
  max-height: 200px;
  overflow-x: hidden;
}

.arrow {
  margin-left: 10px;
  margin-right: 10px;
  float: right;
  rotate: 180deg;
}

.selected-display {
  margin-left: 20px;
}

svg {
  transition: all 0.3s;
}

.wrapper-dropdown::before {
  position: absolute;
  top: 50%;
  right: 16px;

  margin-top: -2px;

  border-width: 6px 6px 0 6px;
  border-style: solid;
  border-color: #fff transparent;
}

.rotated {
  transform: rotate(-180deg);
}

.wrapper-dropdown .dropdown {
    
  max-height: 255px; overflow: scroll; overflow-x: hidden;
  transition: 0.3s;

  position: absolute;
  top: 120%;
  right: 0;
  left: 0;

  margin: 0;
  padding: 0;

  list-style: none;

  z-index: 99;

  border-radius: 15px;
  box-shadow: inherit;
  background: inherit;

  -webkit-transform-origin: top;
  -moz-transform-origin: top;
  -ms-transform-origin: top;
  transform-origin: top;

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  opacity: 0;
  visibility: hidden;
}

.wrapper-dropdown .dropdown li {
  padding: 3px 15px;
  line-height: 45px;
  overflow: hidden;
}

.wrapper-dropdown .dropdown li:last-child {
  border-bottom: none;
}

.dropdown {
  padding: 0.5rem !important;
}

.dropdown .item a{
  text-decoration: none; color: #fff; 
  width: 100% !important; display: block;
}

.selected-display a{
  text-decoration: none; color: #fff; width:100%;
}

.wrapper-dropdown .dropdown li:hover {
  background-image: linear-gradient(rgb(255 255 255 / 10%) 0 0) !important;
  border-radius: 10px;
}

.dropdown-item:hover{
    background-color: rgb(65 65 65);
}

.wrapper-dropdown.active .dropdown {
  box-shadow: 0px 0px 45px -26px #000000;
    opacity: 1;
    visibility: visible;
    border-radius: 15px;
    border: 1px solid #d7d7d729;
}

button { color:#fff !important; }

.opttions-product-div .product-div .gradient-div .titling { text-align: left; padding: 0 0 0!important; display: inline-block; margin: 8px 0 0 9px; position: absolute; }
.opttions-product-div .product-div .gradient-div .titling b { display: block; font-size: 19px; margin-bottom: -1px; }
.opttions-product-div .product-div .gradient-div .titling t { display: inline; color: #dbdada!important; font-size: 14px; margin-top: -4px; margin-right: 5px; background: #494c4f; padding: 2px 8px; border-radius: 9px; font-weight: 300; }
.opttions-product-div .product-div .gradient-div { background: var(--balckgrad2); border-radius: 20px; margin: 0; padding: 10px 0px; }
.opttions-product-div .product-div .gradient-div .titling .new { font-size: 14px; font-weight: 400; background: #0d67fe59; padding: 2px 6px; border-radius: 6px; color: #81b0ff !important; }
.opttions-product-div .product-div .gradient-div .titling .good { font-size: 14px; font-weight: 400; background: #00b67a3d; padding: 2px 6px; border-radius: 6px; color: #00b67a !important; }
.opttions-product-div .product-div .gradient-div .titling .bad { font-size: 14px; font-weight: 400; background: #ff483a5c; padding: 2px 6px; border-radius: 6px; color: #ff483a !important ; }
.opttions-product-div .product-div .gradient-div .titling .mid { font-size: 14px; font-weight: 400; background: #ff980061; padding: 2px 6px; border-radius: 6px; color: #FF9800 !important; }


time i {color: #04da8d;}
.revbadg{cursor: pointer; margin-top: 20px; text-align: -webkit-center; background: #ffffff70; border: 2px solid #ebebeb; border-radius: 16px; padding: 18px 0px; backdrop-filter: blur(3px);}
.revbadg:hover{background: #bdbdbd70;}

.discounted {background: #f443363d; color: #F44336; font-size: 14px; padding: 2px 4px; border-radius: 5px;}

.icn-spinner {
    animation: spin-animation 1s infinite;
    animation-timing-function: linear;
}

@keyframes spin-animation {
    0% {
        transform: rotate(0deg);
    }

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

.cookie-banner {
    position: fixed; bottom: 40px; left: 10%; right: 10%; width: 80%; padding: 15px 21px; display: flex; align-items: center; justify-content: space-between; border-radius: 20px; box-shadow: 0px 0px 10px -7px #000000bf; background: rgb(255 255 255 / 29%); backdrop-filter: blur(10px);
}


.payment-methodes-button img {margin-top: -3px !important; float: right; margin-left: 11px; width: 34px !important; border-radius: 10px;}
            .payment-methodes-button label {font-weight: 400; display: inline-block; margin-left: -4px; padding: 3px 8px; margin-top: -4px; border-radius: 12px; font-size: 12px; margin-right: 2px;}
            .payment-methodes-button label i {font-size: 12px; margin-right: 2px;}


.__digit_scroller_digit {
  position: relative;
  display: inline-block;
  transform: translateY(0);
  width: .68em; }
  .__digit_scroller_digit._digit_up {
    transform: translateY(-100%); }

.__digit_scroller_next_digit {
  position: absolute;
  top: 100%;
  left: 0; }

.__digit_scroller_wrap {
  display: inline-block;
  overflow: hidden; }
  
 
.sidebar{
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 84px;
  border-right: 1px solid #d6ebfd30;
  background: #000000;
  padding: 6px 14px;
  z-index: 99;
  transition: all 0.5s ease;
}
.sidebar.open{
  width: 250px;
}
.sidebar .logo-details{
  height: 60px;
  display: flex;
  align-items: center;
  position: relative;
}
.sidebar .logo-details .icon{
  opacity: 0;
  transition: all 0.5s ease;
}
.sidebar .logo-details .logo_name{
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  opacity: 0;
  transition: all 0.5s ease;
}
.sidebar.open .logo-details .icon,
.sidebar.open .logo-details .logo_name{
  opacity: 1;
}
.sidebar .logo-details #btn{
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  font-size: 22px;
  transition: all 0.4s ease;
  font-size: 23px;
  text-align: center;
  cursor: pointer;
  transition: all 0.5s ease;
}
.sidebar.open .logo-details #btn{
  text-align: right;
}
.sidebar i{
  color: #fff;
  height: 60px;
  min-width: 50px;
  font-size: 28px;
  text-align: center;
  line-height: 60px;
}
.sidebar .nav-list{
  margin-top: 20px;
  height: 100%;
  padding-left:0px;
}
.sidebar li{
  position: relative;
  margin: 8px 0;
  list-style: none;
}
.sidebar li .tooltip{
  position: absolute;
  top: -20px;
  left: calc(100% + 15px);
  z-index: 3;
  background: #242429;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 400;
  opacity: 0;
  white-space: nowrap;
  pointer-events: none;
  transition: 0s;
}
.sidebar li:hover .tooltip{
  opacity: 1;
  pointer-events: auto;
  transition: all 0.4s ease;
  top: 50%;
  transform: translateY(-50%);
}
.sidebar.open li .tooltip{
  display: none;
}
.sidebar input{
  font-size: 15px;
  color: #FFF;
  font-weight: 400;
  outline: none;
  height: 50px;
  width: 100%;
  width: 50px;
  border: none;
  border-radius: 12px;
  transition: all 0.5s ease;
  background: #1d1b31;
}
.sidebar.open input{
  padding: 0 20px 0 50px;
  width: 100%;
}
.sidebar .bx-search{
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  font-size: 22px;
  background: #1d1b31;
  color: #FFF;
}
.sidebar.open .bx-search:hover{
  background: #1d1b31;
  color: #FFF;
}
.sidebar .bx-search:hover{
  background: #FFF;
  color: #11101d;
}
.sidebar li a{
  display: flex;
  height: 100%;
  width: 100%;
  border-radius: 12px;
  align-items: center;
  text-decoration: none;
  transition: all 0.4s ease;
  background: #242429;
}
.sidebar li a:hover{
  background: #FFF;
}
.sidebar li a .links_name{
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: 0.4s;
}
.sidebar.open li a .links_name{
  opacity: 1;
  pointer-events: auto;
}
.sidebar li a:hover .links_name,
.sidebar li a:hover i{
  transition: all 0.5s ease;
  color: #11101D;
}
.sidebar li i{
  height: 50px;
  line-height: 50px;
  font-size: 18px;
  border-radius: 12px;
}
.sidebar li.profile{
  position: fixed;
  height: 60px;
  width: 78px;
  left: 0;
  bottom: -8px;
  padding: 10px 14px;
  background: #1d1b31;
  transition: all 0.5s ease;
  overflow: hidden;
}
.sidebar.open li.profile{
  width: 250px;
}
.sidebar li .profile-details{
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}
.sidebar li img{
  height: 45px;
  width: 45px;
  object-fit: cover;
  border-radius: 6px;
  margin-right: 10px;
}
.sidebar li.profile .name,
.sidebar li.profile .job{
  font-size: 15px;
  font-weight: 400;
  color: #fff;
  white-space: nowrap;
}
.sidebar li.profile .job{
  font-size: 12px;
}
.sidebar .profile #log_out{
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  background: #1d1b31;
  width: 100%;
  height: 60px;
  line-height: 60px;
  border-radius: 0px;
  transition: all 0.5s ease;
}
.sidebar.open .profile #log_out{
  width: 50px;
  background: none;
}
.home-section{
  position: relative;
  background: #E4E9F7;
  min-height: 100vh;
  top: 0;
  left: 78px;
  width: calc(100% - 78px);
  transition: all 0.5s ease;
  z-index: 2;
}
.sidebar.open ~ .home-section{
  left: 250px;
  width: calc(100% - 250px);
}

@media (max-width: 420px) {
  .sidebar li .tooltip{
    display: none;
  }
}