html, body {
                          background: #fff;
                      }
.card {
    background-color: #fff;
    padding: 14px;
    border: none
}
.card:hover{
    border: unset;
}
.picxArea {
    width: 100%
}
ul#productSlides {
    list-style: none outside none;
    padding-left: 0;
    margin-bottom: 0
}
#productSlides li img {
    display: block;
    float: left;
    margin-right: 6px;
    cursor: pointer
}
/* Restore list-style in a Bootstrap */
ul.restoreListStyle > li {
  margin-left: 40px;
  list-style-type: disc;
  display: list-item;
}
img.prodetPg23 {
    display: block;
    height: 15.5rem;
    width: auto;
    border-radius: 1rem !important;
}
.prodDetStars i {
    color: #f6d151
}
.prodDetStars span {
    font-size: 13px
}
hr {
    color: #d4d4d4
}
.prodetPgBadge {
    padding: 5px !important;
    padding-bottom: 6px !important;
}
.prodetPgBadge i {
    font-size: 10px !important;
}
.profile-image {
    width: 35px
}
.comment-ratings i {
    font-size: 13px
}
.username {
    font-size: 12px
}
.comment-profile {
    line-height: 17px
}
.date span {
    font-size: 12px
}
.p-ratings i {
    color: #f6d151;
    font-size: 12px
}
.btn-long {
    padding-left: 35px;
    padding-right: 35px
}
.buttons {
    margin-top: 15px
}
.buttons .btn {
    height: 46px
}
.buttons .cart
{border:1px solid #e5e5e5;
    color:#000;background-color:#FFD816FF;
    transition:all .3s;}
.buttons .cart:hover {
    background-color:#099105;box-shadow:0 0 10px rgba(0,0,0,.5);
}
.buttons .buy {
    color: #fff;
    background-color: #ff7676;
    border-color: #ff7676
}
.buttons .buy:focus,
.buy:active {
    color: #fff;
    background-color: #ff7676;
    border-color: #ff7676;
    box-shadow: none
}
.buttons .buy:hover {
    color: #fff;
    background-color: #e86464;
    border-color: #e86464
}
.buttons .wishlist {
    background-color: #fff;
    border-color: #ff7676
}
.buttons .wishlist:hover {
    background-color: #e86464;
    border-color: #e86464;
    color: #fff
}
.buttons .wishlist:hover i {
    color: #fff
}
.buttons .wishlist i {
    color: #ff7676
}
.comment-ratings i {
    color: #f6d151
}
.followers {
    font-size: 9px;
    color: #d6d4d4
}
.store-image {
    width: 42px
}
                  /*
                   div[class^='prod-colorOptions']{
                      margin-top: 10px;
                      margin-bottom: 10px;
                  }
                  div[class^='prod-colorOptions'] > label.radio {
                      cursor: pointer
                  }
                  div[class^='prod-colorOptions'] > label.radio input {
                      position: absolute;
                      top: 0;
                      left: 0;
                      visibility: hidden;
                      pointer-events: none
                  }
                  div[class^='prod-colorOptions'] > label.radio span {
                      border: 2px solid #8f37aa;
                      display: inline-block;
                      color: #8f37aa;
                      border-radius: 50%;
                      width: 25px;
                      height: 25px;
                      text-transform: uppercase;
                      transition: 0.5s all
                  }
                  div[class^='prod-colorOptions'] > label.radio .red {
                      background-color: red;
                      border-color: red
                  }
                  div[class^='prod-colorOptions'] > label.radio .blue {
                      background-color: blue;
                      border-color: blue
                  }
                  div[class^='prod-colorOptions'] > label.radio .green {
                      background-color: green;
                      border-color: green
                  }
                  div[class^='prod-colorOptions'] > label.radio .orange {
                      background-color: orange;
                      border-color: orange
                  }
                  div[class^='prod-colorOptions'] > label.radio input:checked+span {
                      color: #fff;
                      position: relative
                  }
                  div[class^='prod-colorOptions'] > label.radio input:checked+span::before {
                      opacity: 1;
                      content: '\2713';
                      position: absolute;
                      font-size: 13px;
                      font-weight: bold;
                      left: 4px
                  }
               */
  .card-body {
      padding: 0.3rem 0.3rem 0.2rem
  }
.lSSlideOuter {
    overflow: visible;
    border: 1px solid rgba(0, 0, 0, .32) !important;
    border-radius: 1rem !important;
}
.lSAction > .lSPrev {
    left: 50px;
}
.lSAction > .lSNext {
    right: 50px;
}
/* lightslider Custom prev-next controls */
         .lSAction > a {
             /*width: 32px;*/
             /*display: block;*/
             /*top: 50%;*/
             /*height: 32px;*/
             background-image: url('/images/icons/my-lightslider-controls.png');
             /*cursor: pointer;*/
             /*position: absolute;*/
             /*z-index: 99;*/
             /*margin-top: -16px;*/
             /*opacity: 0.5;*/
             /*-webkit-transition: opacity 0.35s linear 0s;*/
             /*transition: opacity 0.35s linear 0s;*/
         }
.blockquote {
    position: relative;
    font-size: 100%;
}
.blockquote:before {
    position: absolute;
    content: open-quote;
    font-size: 2em;
    margin-left: -0.3em;
    margin-top: -0.3em;
}
.blockquote:after {
    position: absolute;
    content: close-quote;
    font-size: 2em;
    bottom: 0;
    /*right: 0;*/
    margin-right: -0.3em;
    margin-bottom: -0.4em;
}
.blockquote p {
    display: inline;
}
.vidContainer
{
    padding-bottom: 56.25%;
    position: relative;
}
.vidCarousel
{
    margin-bottom: 0;
}
.carousel-item.active, .carousel-item-next, .carousel-item-prev {
    display: block;
    height: 15.5rem;
}
/*Smartphone*/
@media (max-width:640px){
    .carousel-item.active, .carousel-item-next, .carousel-item-prev {
        display: block;
        height: 0rem;
    }
    div.cusWrtRvs
    {
        background-color: #0b9207;
        border-radius: 0.25em;
        overflow-wrap:break-word;
        font-size: 0.7rem;
    }
}
.freeShippingRanges
{
    font-size: 0.9em;
}
/*Smartphone*/
@media only screen and (max-width : 320px) {
    #prodAdd2CartI1{
        margin-bottom: 0.3rem;
    }
}
@media only screen and (max-width : 300px) {
    #prodAdd2CartI1{
        margin-bottom: 0.3rem;
    }
}
/*
 * change the order of the divs for mobile devices to put picture on top of text
 * On screens less or equal to 768px (desktop/tablet): Normal order with csProd2025_mainSec_rt, csProd2025_pad_rt_0, csProd2025_img_rt
 * On screens <768px (mobile): Use mainSec_lt, pad_lt_0, img_lt, and swap column order without reordering HTML
 */
/* Define mobile-specific styles using media queries - you don't need to change the class names, just style them differently depending on screen size. */
/* Default (desktop) styles */
.csProd2025_mainSec_rt {
    text-align: right;
}
.csProd2025_pad_rt_0 {
    padding-right: 0;
}
.csProd2025_img_rt {
    float: right;
}
/* Mobile-first override (screens <768px) */
@media (max-width: 767.98px) {
    .csProd2025_mainSec_rt {
        text-align: left; /* acts like mainSec_lt */
    }
    .csProd2025_pad_rt_0 {
        padding-right: initial;
        padding-left: 0; /* acts like pad_lt_0 */
    }
    .csProd2025_img_rt {
        float: none;
        text-align: left; /* or any lt-specific styling */
    }
    /* Responsive reordering */
    @media (max-width: 767.98px) {
        .csProd2025_mainSec_rt .row {
            display: flex;
            flex-direction: column;
        }
        .csProd2025_mainSec_rt .row > div:nth-child(1) {
            order: 2;
        }
        .csProd2025_mainSec_rt .row > div:nth-child(2) {
            order: 1;
        }
    }
}
/*
 * Handling the Visual Order Change (Image First on Mobile)
This is exactly what CSS Flexbox with order is for:
You do not need to rearrange the HTML
Just apply order in a media query
 */
@media (max-width: 767.98px) {
    .csProd2025_mainSec_rt .row {
        display: flex;
        flex-direction: column;
    }
    .csProd2025_mainSec_rt .row > .col-md-6:nth-child(1) {
        order: 2;
    }
    .csProd2025_mainSec_rt .row > .col-md-6:nth-child(2) {
        order: 1;
    }
}
/* END: change the order of the divs for mobile devices to put picture on top of text */
/* color swatch for ms drop down */
  /* ==========================================================================
     TARGETED ACTIONS ONLY FOR ROWS WITH CUSTOM COLOR SWATCHES
     ========================================================================== */
  /* 1. Select the content flex container row ONLY if it holds a swatch container */
  li[data-description*="dd-v4-container"] .ms-dd-option-content {
      display: flex !important;
      flex-direction: row !important; /* Locks graphics next to text labels */
      align-items: center !important;
      gap: 15px !important; /* Balance spatial gap distance evenly */
  }
  /* 2. Position the graphic swatch cell cleanly on the LEFT */
  li[data-description*="dd-v4-container"] .ms-dd-desc {
      display: inline-block !important;
      order: 1 !important;
      margin: 0 !important;
      padding: 0 !important;
      line-height: normal !important;
  }
  /* 3. Position the option title label cleanly on the RIGHT */
  li[data-description*="dd-v4-container"] .ms-dd-label {
      display: inline-block !important;
      order: 2 !important;
      white-space: nowrap !important;
      margin: 0 !important;
  }
  /* 4. SAFE SPACER HIDER: Only vaporize the 1x1 image cell if a swatch is active */
  li[data-description*="dd-v4-container"] .ms-dd-option-image {
      display: none !important;
      width: 0 !important;
      height: 0 !important;
  }
  /* ==========================================================================
     GRAPHIC UNIT FRAMING RULES
     ========================================================================== */
  .dd-v4-container {
      display: flex !important;
      flex-direction: column !important; /* Stack picture over stripe block */
      width: 60px !important;
      align-items: stretch !important;
  }
  .dd-v4-img {
      width: 60px !important;
      height: auto !important;
      display: block !important;
      object-fit: contain !important;
  }
  .dd-v4-swatch {
      display: block !important;
      width: 60px !important;
      height: 16px !important;
      border: 1px solid #333333 !important;
      box-sizing: border-box !important;
  }
  /* ==========================================================================
     CONDITION 3 FALLBACK: STANDALONE NATIVE IMAGES (NO SWATCH)
     ========================================================================== */
  /* Protects your standard product photo options and respects ms-Dropdown native styling presets */
  .ms-list-option:not([data-description*="dd-v4-container"]) {
      display: block;
  }
  .ms-list-option:not([data-description*="dd-v4-container"]) .ms-dd-option-image {
      display: inline-block !important;
      vertical-align: middle !important;
      width: 60px !important; /* Match layout sizing parameters across variants */
      height: auto !important;
  }
/* END: color swatch for ms drop down */