#shopify-buyer-consent {
  margin-top: 1em;
  display: inline-block;
  width: 100%;
}

#shopify-buyer-consent.hidden {
  display: none;
}

#shopify-subscription-policy-button {
  background: none;
  border: none;
  padding: 0;
  text-decoration: underline;
  font-size: inherit;
  cursor: pointer;
}

#shopify-subscription-policy-button::before {
  box-shadow: none;
}

#storePickupApp .checkoutMethodContainer {
  margin-bottom: 20px;
}

.header-1 {
  font-family: Arial;
  font-weight: 700;
  font-size: 42px;
  font-size: 2.625rem;
  line-height: 1.1;
}

@media only screen and (min-width: 768px) {
  .header-1 {
    font-size: 56px;
    font-size: 3.5rem;
    line-height: 1.1;
  }
}

@media only screen and (min-width: 1024px) {
  .header-1 {
    font-size: 68px;
    font-size: 4.25rem;
    line-height: 1.1;
  }
}

.header-2 {
  font-family: Arial;
  font-weight: 700;
  font-size: 28px;
  font-size: 1.75rem;
  line-height: 1.2;
}

@media only screen and (min-width: 768px) {
  .header-2 {
    font-size: 30px;
    font-size: 1.875rem;
    line-height: 1.2;
  }
}

@media only screen and (min-width: 1024px) {
  .header-2 {
    font-size: 34px;
    font-size: 2.125rem;
    line-height: 1.2;
  }
}

.header-3 {
  font-family: Arial;
  font-weight: 700;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.3;
}

@media only screen and (min-width: 768px) {
  .header-3 {
    font-size: 26px;
    font-size: 1.625rem;
    line-height: 1.3;
  }
}

@media only screen and (min-width: 1024px) {
  .header-3 {
    font-size: 30px;
    font-size: 1.875rem;
    line-height: 1.3;
  }
}

.header-4 {
  font-family: Arial;
  font-weight: 700;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.4;
}

@media only screen and (min-width: 768px) {
  .header-4 {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 1.4;
  }
}

@media only screen and (min-width: 1024px) {
  .header-4 {
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 1.4;
  }
}

.header-5 {
  font-family: Arial;
  font-weight: 700;
  font-size: 15px;
  font-size: 0.9375rem;
  line-height: 1.1;
}

@media only screen and (min-width: 768px) {
  .header-5 {
    font-size: 16px;
    font-size: 1.0rem;
    line-height: 1.1;
  }
}

@media only screen and (min-width: 1024px) {
  .header-5 {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1.1;
  }
}

.header-6 {
  font-family: Arial;
  font-weight: 500;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.4;
}

@media only screen and (min-width: 768px) {
  .header-6 {
    font-size: 16px;
    font-size: 1.0rem;
    line-height: 1.4;
  }
}

@media only screen and (min-width: 1024px) {
  .header-6 {
    font-size: 17px;
    font-size: 1.0625rem;
    line-height: 1.4;
  }
}

.header-7 {
  font-family: Arial;
  font-weight: 700;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1.4;
}

@media only screen and (min-width: 1024px) {
  .header-7 {
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.4;
  }
}

.body-1, body, button, input, textarea, p, div, .rte, .rte p, .rte ul, .rte ol {
  font-family: Arial;
  font-weight: 500;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.5;
}

@media only screen and (min-width: 768px) {
  .body-1, body, button, input, textarea, p, div, .rte, .rte p, .rte ul, .rte ol {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 1.5;
  }
}

@media only screen and (min-width: 1024px) {
  .body-1, body, button, input, textarea, p, div, .rte, .rte p, .rte ul, .rte ol {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 1.5;
  }
}

.body-2 {
  font-family: Arial;
  font-weight: 500;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.4;
}

@media only screen and (min-width: 768px) {
  .body-2 {
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1.4;
  }
}

@media only screen and (min-width: 1024px) {
  .body-2 {
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1.4;
  }
}

.body-3 {
  font-family: Arial;
  font-weight: 500;
  font-size: 11px;
  font-size: 0.6875rem;
  line-height: 1.3;
}

@media only screen and (min-width: 768px) {
  .body-3 {
    font-size: 11px;
    font-size: 0.6875rem;
    line-height: 1.3;
  }
}

@media only screen and (min-width: 1024px) {
  .body-3 {
    font-size: 11px;
    font-size: 0.6875rem;
    line-height: 1.3;
  }
}

</style></div><div id="shopify-section-colors"class="shopify-section"><style>.color-black, body, a {
  color: #191919;
}

.hover-black:hover {
  color: #191919;
}

.border-black {
  border-color: #191919;
}

.fill-black svg {
  fill: #191919;
}

.stroke-black svg {
  stroke: #191919;
}

.background-black {
  background-color: #191919;
}

.color-white {
  color: #ffffff;
}

.hover-white:hover {
  color: #ffffff;
}

.border-white {
  border-color: #ffffff;
}

.fill-white svg {
  fill: #ffffff;
}

.stroke-white svg {
  stroke: #ffffff;
}

.background-white {
  background-color: #ffffff;
}

.color-grey {
  color: #cccccc;
}

.hover-grey:hover {
  color: #cccccc;
}

.border-grey {
  border-color: #cccccc;
}

.fill-grey svg {
  fill: #cccccc;
}

.stroke-grey svg {
  stroke: #cccccc;
}

.background-grey {
  background-color: #cccccc;
}

.color-darkgrey {
  color: #6f6f6f;
}

.hover-darkgrey:hover {
  color: #6f6f6f;
}

.border-darkgrey {
  border-color: #6f6f6f;
}

.fill-darkgrey svg {
  fill: #6f6f6f;
}

.stroke-darkgrey svg {
  stroke: #6f6f6f;
}

.background-darkgrey {
  background-color: #6f6f6f;
}

.color-darkgrey2 {
  color: #646766;
}

.hover-darkgrey2:hover {
  color: #646766;
}

.border-darkgrey2 {
  border-color: #646766;
}

.fill-darkgrey2 svg {
  fill: #646766;
}

.stroke-darkgrey2 svg {
  stroke: #646766;
}

.background-darkgrey2 {
  background-color: #646766;
}

.color-lightgrey {
  color: #a3a3a3;
}

.hover-lightgrey:hover {
  color: #a3a3a3;
}

.border-lightgrey {
  border-color: #a3a3a3;
}

.fill-lightgrey svg {
  fill: #a3a3a3;
}

.stroke-lightgrey svg {
  stroke: #a3a3a3;
}

.background-lightgrey {
  background-color: #a3a3a3;
}

.color-lightgrey2 {
  color: #f6f6f6;
}

.hover-lightgrey2:hover {
  color: #f6f6f6;
}

.border-lightgrey2 {
  border-color: #f6f6f6;
}

.fill-lightgrey2 svg {
  fill: #f6f6f6;
}

.stroke-lightgrey2 svg {
  stroke: #f6f6f6;
}

.background-lightgrey2 {
  background-color: #f6f6f6;
}

.color-border {
  color: #e3e3e3;
}

.hover-border:hover {
  color: #e3e3e3;
}

.border-border {
  border-color: #e3e3e3;
}

.fill-border svg {
  fill: #e3e3e3;
}

.stroke-border svg {
  stroke: #e3e3e3;
}

.background-border {
  background-color: #e3e3e3;
}

.color-blue {
  color: #266de8;
}

.hover-blue:hover {
  color: #266de8;
}

.border-blue {
  border-color: #266de8;
}

.fill-blue svg {
  fill: #266de8;
}

.stroke-blue svg {
  stroke: #266de8;
}

.background-blue {
  background-color: #266de8;
}

.color-danger {
  color: #ff2b2b;
}

.hover-danger:hover {
  color: #ff2b2b;
}

.border-danger {
  border-color: #ff2b2b;
}

.fill-danger svg {
  fill: #ff2b2b;
}

.stroke-danger svg {
  stroke: #ff2b2b;
}

.background-danger {
  background-color: #ff2b2b;
}

</style></div><div id="shopify-section-color-swatch"class="shopify-section"><style>.swatch-meshback-3d-microknit-licorice-seat-fabric-otto-charcoal-frame-black {
  background-size: auto;
  background-position: center;
  background-color: #000000;
}

.swatch-meshback-3d-microknit-nickel-seat-fabric-otto-ash-frame-seagull {
  background-size: auto;
  background-position: center;
  background-color: #dfdfdf;
}

.swatch-meshback-3d-microknit-nickel-seat-fabric-otto-coral-frame-seagull {
  background-size: auto;
  background-position: center;
  background-color: #ffabab;
}

.swatch-meshback-3d-microknit-royal-blue-seat-fabric-cogent-royal-blue-frame-seagull {
  background-size: auto;
  background-position: center;
  background-color: #004676;
}

.swatch-meshback-3d-microknit-scarlet-seat-fabric-cogent-scarlet-frame-seagull {
  background-size: auto;
  background-position: center;
  background-color: #e20000;
}

.swatch-meshback-nickel-seat-fabric-cogent-royal-blue-frame-seagull {
  background-size: auto;
  background-position: center;
  background-color: #123661;
}

.swatch-airback-otto-peacock {
  background-size: auto;
  background-position: center;
  background-color: ;
}

.swatch-airback-new-black-jack {
  background-size: auto;
  background-position: center;
  background-color: ;
}

.swatch-3d-knit-otto-iron {
  background-size: auto;
  background-position: center;
  background-color: ;
}

.swatch-3d-knit-otto-coral {
  background-size: auto;
  background-position: center;
  background-color: ;
}

.swatch-3d-knit-cogent-lipstick {
  background-size: auto;
  background-position: center;
  background-color: ;
}

</style></div><div id="shopify-section-buttons"class="shopify-section"><style>.button-1 {
  display: inline-block;
  transition: all 0.3s linear;
  padding-top: 16px;
  padding-bottom: 15px;
  padding-left: 40px;
  padding-right: 40px;
  border-top: 0px solid;
  border-bottom: 0px solid;
  border-left: 0px solid;
  border-right: 0px solid;
  color: #ffffff;
  background-color: #266de8;
  border-color: rgba(0, 0, 0, 0);
  font-family: Arial;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: .5px;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1;
}

.button-1:hover {
  color: #ffffff;
}

.button-1:hover {
  background-color: #2163d4;
}

.button-1:hover {
  border-color: rgba(0, 0, 0, 0);
}

@media only screen and (min-width: 768px) {
  .button-1 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1;
  }
}

@media only screen and (min-width: 1024px) {
  .button-1 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1;
  }
}

.button-2 {
  display: inline-block;
  transition: all 0.3s linear;
  padding-top: 15px;
  padding-bottom: 12px;
  padding-left: 18px;
  padding-right: 18px;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  color: #646766;
  background-color: #ffffff;
  border-color: #e3e3e3;
  font-family: Arial;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1px;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.1;
}

.button-2:hover {
  color: #191919;
}

.button-2:hover {
  background-color: rgba(0, 0, 0, 0);
}

.button-2:hover {
  border-color: #191919;
}

@media only screen and (min-width: 768px) {
  .button-2 {
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1.1;
  }
}

@media only screen and (min-width: 1024px) {
  .button-2 {
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1.1;
  }
}

.button-3 {
  display: inline-block;
  transition: all 0.3s linear;
  padding-top: 18px;
  padding-bottom: 15px;
  padding-left: 40px;
  padding-right: 40px;
  border-top: 0px solid;
  border-bottom: 0px solid;
  border-left: 0px solid;
  border-right: 0px solid;
  color: #ffffff;
  background-color: #191919;
  border-color: rgba(0, 0, 0, 0);
  font-family: Arial;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: 0.5px;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1;
}

.button-3:hover {
  color: #ffffff;
}

.button-3:hover {
  background-color: #000000;
}

.button-3:hover {
  border-color: rgba(0, 0, 0, 0);
}

@media only screen and (min-width: 768px) {
  .button-3 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1;
  }
}

@media only screen and (min-width: 1024px) {
  .button-3 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1;
  }
}

.button-4 {
  display: inline-block;
  transition: all 0.3s linear;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 12px;
  padding-right: 12px;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  color: #191919;
  background-color: #ffffff;
  border-color: #e3e3e3;
  font-family: Arial;
  font-weight: 400;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1.1;
}

.button-4:hover {
  border-color: #000000;
}

@media only screen and (min-width: 768px) {
  .button-4 {
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1.1;
  }
}

@media only screen and (min-width: 1024px) {
  .button-4 {
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 1.1;
  }
}

.button-5 {
  display: inline-block;
  transition: all 0.3s linear;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 12px;
  padding-right: 12px;
  border-top: 2px solid;
  border-bottom: 2px solid;
  border-left: 2px solid;
  border-right: 2px solid;
  color: #000000;
  background-color: #ffffff;
  border-color: #cccccc;
  font-family: Arial;
  font-weight: 400;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.button-5:hover {
  border-color: #266de8;
}

@media only screen and (min-width: 768px) {
  .button-5 {
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.4;
  }
}

@media only screen and (min-width: 1024px) {
  .button-5 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1.4;
  }
}

.button-6 {
  display: inline-block;
  transition: all 0.3s linear;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 40px;
  padding-right: 40px;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  color: #266de8;
  background-color: #ffffff;
  border-color: #266de8;
  font-family: Arial;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: .5px;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1;
}

@media only screen and (min-width: 768px) {
  .button-6 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1;
  }
}

@media only screen and (min-width: 1024px) {
  .button-6 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1;
  }
}

</style></div><div id="shopify-section-links"class="shopify-section"><style>.link-1 {
  display: inline-block;
  transition: all 1s linear;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  border-top: 0px solid;
  border-bottom: 1px solid;
  border-left: 0px solid;
  border-right: 0px solid;
  color: #2163d4;
  border-color: #2163d4;
  font-family: Arial;
  font-weight: 500;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.link-1:hover {
  color: #2163d4;
}

.link-1:hover {
  border-color: #2163d4;
}

@media only screen and (min-width: 768px) {
  .link-1 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1.4;
  }
}

@media only screen and (min-width: 1024px) {
  .link-1 {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 1.4;
  }
}

.link-2 {
  display: inline-block;
  transition: all 1s linear;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  border-top: 0px solid;
  border-bottom: 0px solid;
  border-left: 0px solid;
  border-right: 0px solid;
  color: #2163d4;
  font-family: Arial;
  font-weight: 400;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.link-2:hover {
  color: #2163d4;
}

@media only screen and (min-width: 768px) {
  .link-2 {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 1.4;
  }
}

@media only screen and (min-width: 1024px) {
  .link-2 {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 1.3;
  }
}

</style></div><div class="global-overlay"></div><div class="global-notification"><div class="rte"><p id="global-notification-msg"class="text-center"></p></div></div><div class="global-loading"id="global-loading"><div class="global-ring"><div></div><div></div><div></div><div></div></div></div><div class="header-cart"id="header-cart"><div class="relative pl-20 pr-20 header-cart-top"><div class="pt-20 pb-20 text-left bb-1 border-border"><h5 class="header-4">Cart</h5><div class="header-cart-close"><svg xmlns="http://www.w3.org/2000/svg"viewbox="0 0 40.98 40.98"><polygon points="40.98 1.41 39.57 0 20.49 19.08 1.41 0 0 1.41 19.08 20.49 0 39.57 1.41 40.99 20.49 21.91 39.57 40.99 40.98 39.57 21.91 20.49 40.98 1.41"></polygon></svg></div></div></div><div class="mb-20 header-5 mt-30">Your shopping cart is currently empty</div><a href="../index.html"class="button-1">Shop Now</a></div><div id="shopify-section-header"class="shopify-section"><style>

/* overwrite */
.switcher-btn {
  padding: 5px 10px;
  font-size: 12px;
}

.switcher-cn,
.switcher-en {
  display: none;
}

.header-left {
  left: 10px;
}

.header-left .li.header-mobile-menu {
  margin-left: 0;
}

.header-left .li.header-mobile-wishlist {
  margin-left: 20px;
}

.each-msg {
  display: flex;
  justify-content: center;
  align-items: center;
  height: inherit;
}

.glide__slide--active {
  z-index: 3;
}

@media screen and (min-width: 768px) {
  .header-left {
    left: 10px;
  }
}

@media (min-width: 1024px) {
  .header-desktop-top {
    overflow: unset;
  }
}

/* end overwrite */
</style><header class="header-site bb-1 border-border background-white fixed "><style>body.have-bar header.fixed.hide {
  top: -79px;
}

@media screen and (min-width:768px) {
  body.have-bar header.fixed.hide {
    top: -59px;
  }

  .header-new-bar .header-bar-new-left {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 20px;
  }

  .header-new-bar .header-bar-new-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
  }
}

@media screen and (min-width:960px) {
  body.have-bar header.fixed.hide {
    top: -51px;
  }

  .header-new-bar .header-bar-new-center-right {
    padding-left: 10px;
    margin-left: 10px;
    border-left: 1px solid;
  }

  .header-new-bar .header-bar-new-center {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

.btn-pt-15-pb-15 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.color-black-0 {
  color: #000;
}

.color-grey-6f {
  color: #6f6f6f;
}

.no-uppercase {
  text-transform: none;
}

/* overwrite */
.collection-products .product-each-wrapper:hover .product-each {
  box-shadow: unset;
}

.for-mobile {
  display: block;
}

.for-tablet {
  display: none;
}

.for-desktop {
  display: none;
}

.glide__arrow svg {
  width: 10px;
  height: 10px;
}

.glide__arrow.newpdp {
  padding: 15px 15px;
}

.no-mb {
  margin-bottom: 0;
}

.no-scroll-xy {
  overflow: hidden;
}

.scroll-y {
  height: auto;
  max-height: 85vh;
  overflow-y: scroll;
}

.no-scroll-y {
  height: unset;
  overflow-y: unset;
}

.button-2 {
  padding-bottom: 15px;
}

.button-1.body-2,
.button-2.body-2,
.button-3.body-2 {
  font-size: 12px;
  font-weight: 700;
}

.product-info__color-swatch {
  margin-right: 10px;
  margin-bottom: 10px;
}

.global-select-div {
  height: auto;
}

.global-select-div .text {
  padding: 9px 15px 11px 15px;
}

.collection-bpl__image {
  height: 200px;
}

.collection-bpl__text-wrapper {
  padding: 20px 25px;
}

/* end overwrite */
.quickv-box {
  position: relative;
  display: block;
}

.quickv-box button:hover {
  background-color: rgba(255, 255, 255, 1);
}

/* quick view popup */
.product-each-popup {
  width: calc(100% - 40px);
  max-width: 900px;
  max-width: 56.25rem;
  position: relative;
  margin: auto 20px;
  background: #fff;
  box-shadow: 0 1px 10px #0000001a;
}

.pdp-popup-box-main {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.pdp-popup-box-main .inner-box {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  row-gap: 0;
}

.pdp-popup-box-main .inner-box .header {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 20px;
  position: relative;
}

.pdp-popup-box-main .inner-box .header .lbox {
  width: calc(60% - 10px);
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.pdp-popup-box-main .inner-box .header .rbox {
  width: calc(40% - 10px);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.pdp-popup-box-main .inner-box .header .rbox .iclose {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.pdp-popup-box-main .inner-box .header .rbox .iclose svg {
  width: 15px;
  height: 15px;
}

.pdp-popup-box-main .inner-box .body-ctn {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-direction: column;
  column-gap: 40px;
  row-gap: 20px;
}

.pdp-popup-box-main .inner-box .body-ctn .lbox {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.pdp-popup-box-main .inner-box .body-ctn .lbox .img-box {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  row-gap: 20px;
}

.pdp-popup-box-main .inner-box .body-ctn .lbox .img-box .slide-box {
  width: calc(100% - 2px);
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #e3e3e3;
}

.pdp-popup-box-main .inner-box .body-ctn .lbox .img-box .thumb-box {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: row;
  column-gap: 10px;
}

.pdp-popup-box-main .inner-box .body-ctn .rbox {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.pdp-popup-box-main .inner-box .body-ctn .rbox .pdbox {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  row-gap: 20px;
}

.feat-slides {
  position: relative;
}

.feat-slides .glide__arrows--bg .glide__arrow {
  background-color: #e3e3e3;
  padding: 10px;
}

.feat-slides .glide__arrows--bg .glide__arrow.glide__arrow--left {
  margin-left: 20px;
}

.feat-slides .glide__arrows--bg .glide__arrow.glide__arrow--right {
  margin-right: 20px;
}

.feat-slides-item-box {
  position: relative;
  text-align: center;
}

.feat-slides-item {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.feat-slides-item .txtbox {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.feat-slides-item .txtbox .tagline {
  display: flex;
}

.feat-slides-item .txtbox .title {
  display: flex;
}

.feat-slides-item .txtbox .body {
  display: flex;
}

.feat-slides-item .imgbox {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.feat-slides-item .imgbox .imgctn {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* end slide */
/* stock info */
.stock-info {
  list-style: none;
}

.stock-info li {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #4f8e71;
}

.stock-info li.oos {
  color: #f00;
}

.stock-info li::before {
  content: "";
  background-color: #4f8e71;
  border-radius: 50%;
  margin-right: 10px;
  display: inline-block;
  width: 10px;
  height: 10px;
}

.stock-info li.oos::before {
  background-color: #f00;
}

/* end stock info */
/* end quick view popup */
/* color swatches */
.color-swatches-box-inlist {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 10px;
}

.color-swatches-box-inlist .lbox {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.color-swatches-box-inlist .lbox ul {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  column-gap: 5px;
}

.color-swatches-box-inlist .lbox ul li {
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border: 1px solid #e3e3e3;
  border-radius: 50%;
  padding: 2px;
  cursor: pointer;
}

.color-swatches-box-inlist .lbox ul li.active {
  border: 1px solid #266de8;
}

.color-swatches-box-inlist .lbox ul li.hide {
  display: none;
}

.color-swatches-box-inlist .lbox ul li button,
.color-swatches-box-inlist .lbox ul li div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.color-swatches-box-inlist .rbox {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* end color swatches */
/* certification in product card */
.cert-pdp-card-wrapper {
  display: flex;
  justify-content: start;
  align-items: start;
  column-gap: 20px;
}

.cert-pdp-card-wrapper .cert-item {
  width: calc(20% - 16px);
}

/* END certification in product card */
@media screen and (min-width: 768px) {
  .for-mobile {
    display: none;
  }

  .for-tablet {
    display: block;
  }

  .for-desktop {
    display: none;
  }

  .button-2 {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .button-1.body-2,
  .button-2.body-2,
  .button-3.body-2 {
    font-size: 12px;
    font-weight: 700;
  }

  .product-info__color-swatch {
    margin-right: 8px;
    margin-bottom: 8px;
  }

  .product-each__title {
    min-height: 44px;
  }

  .collection-products {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .quickv-box {
    display: block;
  }

  .product-each.with-hover:hover .primary {
    display: none;
  }

  .product-each.with-hover:hover .secondary,
  .product-each.with-hover:hover .quickv-box {
    display: block;
  }

  .pdp-popup-box-main .inner-box {
    row-gap: 10px;
  }

  .pdp-popup-box-main .inner-box .header {
    position: absolute;
    top: -30px;
    right: -30px;
  }

  .pdp-popup-box-main .inner-box .body-ctn {
    flex-direction: row;
  }

  .pdp-popup-box-main .inner-box .body-ctn .lbox {
    width: calc(50% - 10px);
  }

  .pdp-popup-box-main .inner-box .body-ctn .rbox {
    width: calc(50% - 10px);
  }

  .scroll-y {
    height: auto;
    max-height: 90vh;
    overflow-y: scroll;
  }

  .product-each-popup {
    margin: auto auto;
  }

  .collection-bpl__text-wrapper {
    height: 20%;
    padding: 20px 20px;
  }

  .collection-bpl__image {
    height: 80%;
  }

  .collection-products .product-each-wrapper:hover .product-each {
    box-shadow: unset;
  }
}

@media screen and (min-width: 1024px) {
  .for-mobile {
    display: none;
  }

  .for-tablet {
    display: block;
  }

  .for-desktop {
    display: block;
  }

  .button-1.body-2,
  .button-2.body-2,
  .button-3.body-2 {
    font-size: 12px;
    font-weight: 700;
  }

  .product-info__color-swatch {
    margin-right: 8px;
    margin-bottom: 8px;
  }

  .product-each__title {
    min-height: 44px;
  }

  .collection-products {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .quickv-box {
    position: absolute;
    display: none;
    bottom: 0;
  }

  .product-each.with-hover:hover .primary {
    display: block;
  }

  .product-each.with-hover:hover .secondary {
    display: none;
  }

  .product-each.with-hover .image-link:hover .primary {
    display: none;
  }

  .product-each.with-hover .image-link:hover .secondary {
    display: block;
  }

  .product-each.with-hover:hover .quickv-box {
    display: block;
  }

  .pdp-popup-box-main .inner-box {
    row-gap: 10px;
  }

  .pdp-popup-box-main .inner-box .header {
    position: absolute;
    top: -30px;
    right: -30px;
  }

  .pdp-popup-box-main .inner-box .body-ctn {
    flex-direction: row;
  }

  .pdp-popup-box-main .inner-box .body-ctn .lbox {
    width: calc(50% - 10px);
  }

  .pdp-popup-box-main .inner-box .body-ctn .rbox {
    width: calc(50% - 10px);
  }

  .scroll-y {
    height: auto;
    max-height: 90vh;
    overflow-y: scroll;
  }

  .product-each-popup {
    margin: auto auto;
  }

  .collection-bpl__text-wrapper {
    height: 20%;
    padding: 20px 20px;
  }

  .collection-bpl__image {
    height: 80%;
  }

  .collection-products .product-each-wrapper:hover .product-each {
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  }
}

@media screen and (min-width: 1600px) {
  .scroll-y {
    height: auto;
    max-height: 75vh;
    overflow-y: scroll;
  }
}

@media screen and (min-width: 1920px) {
  .scroll-y {
    height: auto;
    max-height: 75vh;
    overflow-y: scroll;
  }
}

</style><section class="collection-con relative"><div class="container"><h1 class="mt-20 mb-20 tablet-mt-60 tablet-mb-30 header-2">Accessories</h1></div><div class="container"><style>.button-2.selected {
  border-color: #191919;
}

.btn-sort {
  padding: 10px 15px;
  font-size: 12px;
  cursor: pointer;
  letter-spacing: 0px;
}

.collection-header-box {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.collection-header-box .lbox {
  width: 30%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
}

.collection-header-box .rbox {
  width: 70%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex-direction: column;
}

.sortby-box {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-direction: row;
  column-gap: 20px;
}

.sortby-box .info {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.sortby-box .sort-items {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.sortby-box .sort-items ul {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: row;
  column-gap: 10px;
}

.sortby-box .sort-items ul li {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

@media screen and (min-width: 768px) {
  .collection-header-box .lbox {
    width: 20%;
  }

  .collection-header-box .rbox {
    width: 80%;
  }

  .btn-sort {
    padding: 12px 15px;
  }
}

@media screen and (min-width: 1024px) {
  .collection-header-box .lbox {
    width: 20%;
  }

  .collection-header-box .rbox {
    width: 80%;
  }

  .btn-sort {
    padding: 12px 15px;
  }
}