.container {
  width: 100%;
  display: flex;
  flex-direction: column;
}

@media (min-width: 640px) {
  .container {
      max-width:640px
  }
}

@media (min-width: 768px) {
  .container {
      max-width:768px
  }
}

@media (min-width: 1024px) {
  .container {
      max-width:1024px
  }
}

@media (min-width: 1280px) {
  .container {
      max-width:1280px
  }
}

@media (min-width: 1440px) {
  .container {
      max-width:1440px
  }
}


html .btn-link,html .link,html button[priority=low],html button[variant=link] {
  font-size: .9375rem;
  text-underline-offset: .5rem
}

html .btn-link:hover,html .link:hover,html button[priority=low]:hover,html button[variant=link]:hover {
  text-decoration-thickness: 2px
}

html .btn-link.\!disabled,html .btn-link.disabled,html .link.\!disabled,html .link.disabled,html button[priority=low].\!disabled,html button[priority=low].disabled,html button[variant=link].\!disabled,html button[variant=link].disabled {
  pointer-events: none;
  color: var(--p2);
  opacity: .5
}


.productitem-block.oos .product-price {
  display: none
}

.productitem-block.oos .swatch-item-disabled {
  position: relative
}


.pointer-events-none {
  pointer-events: none
}

.inset-y-0 {
  top: 0;
  bottom: 0
}

.-right-3 {
  right: -.75rem
}

.bottom-0 {
  bottom: 0
}

.left-1\/2 {
  left: 50%
}

.top-1\/2 {
  top: 50%
}

.top-1\/4 {
  top: 25%
}

.top-20 {
  top: 5rem
}

.right-10 {
  right: 2.5rem
}

.right-0 {
  right: 0
}

.left-1 {
  left: .25rem
}

.right-1 {
  right: .25rem
}

.top-1 {
  top: .25rem
}

.top-0 {
  top: 0
}

.top-5 {
  top: 1.25rem
}

.right-5 {
  right: 1.25rem
}

.z-30 {
  z-index: 30
}

.-z-1 {
  z-index: -1
}

.z-2 {
  z-index: 2
}

.z-1 {
  z-index: 1
}

.z-50 {
  z-index: 50
}

.z-10 {
  z-index: 10
}

.order-2 {
  order: 2
}

.float-right {
  float: right
}

.m-auto {
  margin: auto
}

.m-0 {
  margin: 0
}

.mx-auto {
  margin-left: auto;
  margin-right: auto
}

.my-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem
}

.my-1 {
  margin-top: .25rem;
  margin-bottom: .25rem
}

.my-2 {
  margin-top: .5rem;
  margin-bottom: .5rem
}

.-mx-3 {
  margin-left: -.75rem;
  margin-right: -.75rem
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem
}

.mx-5 {
  margin-left: 1.25rem;
  margin-right: 1.25rem
}

.mx-2\.5 {
  margin-left: .625rem;
  margin-right: .625rem
}

.mx-2 {
  margin-left: .5rem;
  margin-right: .5rem
}

.mx-4 {
  margin-left: 1rem;
  margin-right: 1rem
}

.my-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem
}


.ml-3\.5 {
  margin-left: .875rem
}

.ml-3 {
  margin-left: .75rem
}



.mr-2 {
  margin-right: .5rem
}

.mr-1 {
  margin-right: .25rem
}


.mt-2 {
  margin-top: .5rem
}

.mt-8 {
  margin-top: 2rem
}


.mt-5 {
  margin-top: 1.25rem
}

.mt-0 {
  margin-top: 0
}

.mr-\[5px\] {
  margin-right: 5px
}

.mr-\[18px\] {
  margin-right: 18px
}

.mt-4 {
  margin-top: 1rem
}

.-ml-\[122px\] {
  margin-left: -122px
}



.ml-\[7px\] {
  margin-left: 7px
}

.mt-\[1px\] {
  margin-top: 1px
}



.mt-6 {
  margin-top: 1.5rem
}

.mt-6p {
  margin-top: .375rem
}

.mr-3 {
  margin-right: .75rem
}

.ml-auto {
  margin-left: auto
}

.-mr-3\.5 {
  margin-right: -.875rem
}

.-mt-\[5px\] {
  margin-top: -5px
}

.-mr-3 {
  margin-right: -.75rem
}

.mt-3 {
  margin-top: .75rem
}

.mt-1\.5 {
  margin-top: .375rem
}

.mt-1 {
  margin-top: .25rem
}

.mt-\[5px\] {
  margin-top: 5px
}

.-mt-0\.5 {
  margin-top: -.125rem
}

.-mt-0 {
  margin-top: 0
}

.mr-auto {
  margin-right: auto
}

.mr-0 {
  margin-right: 0
}

.mr-\[10px\] {
  margin-right: 10px
}

.ml-\[10px\] {
  margin-left: 10px
}

.-ml-1 {
  margin-left: -.25rem
}


.mt-12 {
  margin-top: 3rem
}

.mt-2\.5,.mt-\[0\.625rem\] {
  margin-top: .625rem
}


.mt-9 {
  margin-top: 2.25rem
}

.mr-3p {
  margin-right: .188rem
}

.ml-1 {
  margin-left: .25rem
}

.mr-2\.5 {
  margin-right: .625rem
}

.ml-4 {
  margin-left: 1rem
}

.ml-12 {
  margin-left: 3rem
}

.ml-5 {
  margin-left: 1.25rem
}

.ml-2 {
  margin-left: .5rem
}

.mr-10 {
  margin-right: 2.5rem
}

.mr-4 {
  margin-right: 1rem
}

.block {
  display: block
}

.inline-block {
  display: inline-block
}

.inline {
  display: inline
}

.flex {
  display: flex
}

.inline-flex {
  display: inline-flex
}

.table {
  display: table
}

.grid {
  display: grid
}

.contents {
  display: contents
}

.\!contents {
  display: contents!important
}

.hidden {
  display: none
}

.aspect-square {
  aspect-ratio: 1/1
}

.h-4 {
  height: 1rem
}

.h-auto {
  height: auto
}

.h-44 {
  height: 11rem
}

.h-310 {
  height: var(--h-310)
}

.h-6 {
  height: 1.5rem
}

.h-full {
  height: 100%
}

.h-\[29px\] {
  height: 29px
}

.h-8 {
  height: 2rem
}

.h-5 {
  height: 1.25rem
}

.h-96 {
  height: 24rem
}

.h-116 {
  height: var(--h-116)
}

.min-h-\[29px\] {
  min-height: 29px
}

.w-4 {
  width: 1rem
}

.w-\[87\%\] {
  width: 87%
}

.w-full {
  width: 100%
}

.w-\[34\%\] {
  width: 34%
}

.w-1\/2 {
  width: 50%
}

.w-auto {
  width: auto
}

.w-0 {
  width: 0
}

.w-7 {
  width: 1.75rem
}

.w-10 {
  width: 2.5rem
}

.w-9 {
  width: 2.25rem
}

.w-14 {
  width: 3.5rem
}

.w-6 {
  width: 1.5rem
}

.w-5 {
  width: 1.25rem
}

.w-4\/12 {
  width: 33.333333%
}

.w-8 {
  width: 2rem
}

.w-5\/6 {
  width: 83.333333%
}

.w-2\/5 {
  width: 40%
}

.w-11\/12 {
  width: 91.666667%
}

.min-w-\[265px\] {
  min-width: 265px
}

.min-w-\[48px\] {
  min-width: 48px
}

.min-w-\[83px\] {
  min-width: 83px
}

.min-w-\[220px\] {
  min-width: 220px
}

.max-w-6xl {
  max-width: 1390px
}

.max-w-xl {
  max-width: 36rem
}

.max-w-screen-xl {
  max-width: 1280px
}

.max-w-\[23\.438rem\] {
  max-width: 23.438rem
}

.max-w-xs {
  max-width: 20rem
}

.max-w-sm {
  max-width: 24rem
}

.max-w-\[1300px\] {
  max-width: 1300px
}

.max-w-\[6\.875rem\] {
  max-width: 6.875rem
}

.max-w-\[83px\] {
  max-width: 83px
}

.max-w-full {
  max-width: 100%
}

.max-w-8xl {
  max-width: 1920px
}

.flex-1 {
  flex: 1 1 0%
}

.flex-grow {
  flex-grow: 1
}

.translate-y-0 {
  --tw-translate-y: 0px
}

.translate-y-0,.translate-y-full {
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-full {
  --tw-translate-y: 100%
}

.-translate-x-1\/2 {
  --tw-translate-x: -50%
}

.-translate-x-1\/2,.-translate-y-1\/2 {
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-1\/2 {
  --tw-translate-y: -50%
}

.-translate-y-full\+ {
  --tw-translate-y: -110%
}

.-translate-y-full\+,.rotate-180 {
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-180 {
  --tw-rotate: 180deg
}

.transform {
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes fade-in-down {
  0% {
      opacity: 0;
      transform: translateY(-10px)
  }

  to {
      opacity: 1;
      transform: translateY(0)
  }
}

.animate-fade-in-down {
  animation: fade-in-down .2s ease-out
}

@keyframes fade-in-left {
  0% {
      opacity: 0;
      transform: translateX(-10px)
  }

  to {
      opacity: 1;
      transform: translateX(0)
  }
}

.animate-fade-in-left {
  animation: fade-in-left .2s ease-out
}

@keyframes fade-in-up {
  0% {
      opacity: 0;
      transform: translateY(10px)
  }

  to {
      opacity: 1;
      transform: translateY(0)
  }
}

.animate-fade-in-up {
  animation: fade-in-up .2s ease-out
}

@keyframes fade-in-right {
  0% {
      opacity: 0;
      transform: translateX(10px)
  }

  to {
      opacity: 1;
      transform: translateX(0)
  }
}

.animate-fade-in-right {
  animation: fade-in-right .2s ease-out
}

.cursor-pointer {
  cursor: pointer
}

.cursor-auto {
  cursor: auto
}

.cursor-default {
  cursor: default
}


.resize {
  resize: both
}

.list-disc {
  list-style-type: disc
}

.list-decimal {
  list-style-type: decimal
}

.list-none {
  list-style-type: none
}

.appearance-none {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none
}

.grid-cols-2 {
  grid-template-columns: repeat(2,minmax(0,1fr))
}

.flex-row {
  flex-direction: row
}

.flex-col {
  flex-direction: column
}

.flex-col-reverse {
  flex-direction: column-reverse
}

.flex-wrap {
  flex-wrap: wrap
}

.flex-nowrap {
  flex-wrap: nowrap
}

.justify-start {
  justify-content: flex-start
}

.justify-end {
  justify-content: flex-end
}

.justify-center {
  justify-content: center
}

.justify-between {
  justify-content: space-between
}


.overflow-hidden {
  overflow: hidden
}


.break-all {
  word-break: break-all
}

.rounded-full {
  border-radius: 9999px
}

.rounded {
  border-radius: .25rem
}

.border-4 {
  border-width: 4px
}

.border {
  border-width: 1px
}

.border-0 {
  border-width: 0
}

.border-2 {
  border-width: 2px
}

.border-b {
  border-bottom-width: 1px
}

.border-t {
  border-top-width: 1px
}

.border-l {
  border-left-width: 1px
}

.border-solid {
  border-style: solid
}

.border-alert-danger {
  border-color: var(--alert-danger)
}

.border-primary {
  border-color: var(--primary)
}

.border-gs-2 {
  border-color: var(--gs2)
}

.border-\[\#01539F\] {
  --tw-border-opacity: 1;
  border-color: rgb(1 83 159/var(--tw-border-opacity))
}

.border-gs-3 {
  border-color: var(--gs3)
}

.border-\[\#E8E9E9\] {
  --tw-border-opacity: 1;
  border-color: rgb(232 233 233/var(--tw-border-opacity))
}

.border-accents-9 {
  border-color: var(--accents-9)
}

.border-white {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255/var(--tw-border-opacity))
}

.border-accents-1 {
  border-color: var(--accents-1)
}

.border-black {
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0/var(--tw-border-opacity))
}

.border-gs-1 {
  border-color: var(--gs1)
}

.object-contain {
  -o-object-fit: contain;
  object-fit: contain
}

.p-3 {
  padding: .75rem
}

.p-1 {
  padding: .25rem
}

.p-2 {
  padding: .5rem
}

.p-10 {
  padding: 2.5rem
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem
}

.py-\[69px\] {
  padding-top: 69px;
  padding-bottom: 69px
}

.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem
}

.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem
}

.px-3 {
  padding-left: .75rem;
  padding-right: .75rem
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem
}

.py-3 {
  padding-top: .75rem;
  padding-bottom: .75rem
}

.px-\[26px\] {
  padding-left: 26px;
  padding-right: 26px
}

.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem
}

.py-1 {
  padding-top: .25rem;
  padding-bottom: .25rem
}

.px-10p {
  padding-left: .625rem;
  padding-right: .625rem
}

.py-2\.5 {
  padding-top: .625rem;
  padding-bottom: .625rem
}

.py-2 {
  padding-top: .5rem;
  padding-bottom: .5rem
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem
}

.py-\[30px\] {
  padding-top: 30px;
  padding-bottom: 30px
}

.px-7 {
  padding-left: 1.75rem;
  padding-right: 1.75rem
}

.pt-8 {
  padding-top: 2rem
}

.pt-3 {
  padding-top: .75rem
}

.pb-4 {
  padding-bottom: 1rem
}

.pb-8 {
  padding-bottom: 2rem
}

.pt-6 {
  padding-top: 1.5rem
}

.pt-2 {
  padding-top: .5rem
}

.pb-\[18px\] {
  padding-bottom: 18px
}

.pt-5 {
  padding-top: 1.25rem
}

.pb-5 {
  padding-bottom: 1.25rem
}

.pr-\[24px\] {
  padding-right: 24px
}

.pb-\[14px\] {
  padding-bottom: 14px
}

.pr-6 {
  padding-right: 1.5rem
}

.pt-\[60px\] {
  padding-top: 60px
}

.pb-\[65px\] {
  padding-bottom: 65px
}

.pt-10 {
  padding-top: 2.5rem
}

.pb-2\.5 {
  padding-bottom: .625rem
}

.pb-2 {
  padding-bottom: .5rem
}

.pr-5 {
  padding-right: 1.25rem
}

.pl-2\.5 {
  padding-left: .625rem
}

.pl-2 {
  padding-left: .5rem
}

.pb-0\.5 {
  padding-bottom: .125rem
}

.pb-0 {
  padding-bottom: 0
}

.pb-3 {
  padding-bottom: .75rem
}

.pt-2\.5 {
  padding-top: .625rem
}

.pt-4 {
  padding-top: 1rem
}

.pt-\[32px\] {
  padding-top: 32px
}

.pb-\[30px\] {
  padding-bottom: 30px
}

.pt-7 {
  padding-top: 1.75rem
}

.pt-\[2\.75rem\] {
  padding-top: 2.75rem
}

.pb-10 {
  padding-bottom: 2.5rem
}

.pt-3\.5 {
  padding-top: .875rem
}

.pb-\[28px\] {
  padding-bottom: 28px
}

.pl-4 {
  padding-left: 1rem
}

.pt-\[7px\] {
  padding-top: 7px
}

.pb-7 {
  padding-bottom: 1.75rem
}

.pr-3 {
  padding-right: .75rem
}

.pt-\[14px\] {
  padding-top: 14px
}

.pb-1 {
  padding-bottom: .25rem
}

.pt-\[30px\] {
  padding-top: 30px
}

.pb-\[15px\] {
  padding-bottom: 15px
}

.pr-2\.5 {
  padding-right: .625rem
}

.pr-2 {
  padding-right: .5rem
}

.pl-3 {
  padding-left: .75rem
}

.pr-10 {
  padding-right: 2.5rem
}

.pt-0\.5 {
  padding-top: .125rem
}

.pt-0 {
  padding-top: 0
}

.pl-5 {
  padding-left: 1.25rem
}

.pb-1\.5 {
  padding-bottom: .375rem
}

.pl-\[6px\] {
  padding-left: 6px
}

.pl-\[22px\] {
  padding-left: 22px
}

.pt-12 {
  padding-top: 3rem
}

.pb-20 {
  padding-bottom: 5rem
}

.pb-28 {
  padding-bottom: 7rem
}

.pl-0 {
  padding-left: 0
}

.pr-8 {
  padding-right: 2rem
}

.pb-\[26px\] {
  padding-bottom: 26px
}

.pt-1 {
  padding-top: .25rem
}

.text-left {
  text-align: left
}

.text-center {
  text-align: center
}

.text-right {
  text-align: right
}

.text-start {
  text-align: start
}

.align-top {
  vertical-align: top
}

.align-middle {
  vertical-align: middle
}

.align-bottom {
  vertical-align: bottom
}

.font-sans {
  font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji
}

.font-primary {
  font-family: Inter,sans-serif
}

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem
}

.text-size-11 {
  font-size: .6875rem
}

.text-xs {
  font-size: .75rem;
  line-height: 1rem
}

.text-sm {
  font-size: .875rem;
  line-height: 1.25rem
}

.text-size-40 {
  font-size: 2.5rem
}

.text-size-64 {
  font-size: 4rem
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem
}

.text-6xl {
  font-size: 3.75rem;
  line-height: 1
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem
}

.text-5xl {
  font-size: 3rem;
  line-height: 1
}

.text-base {
  font-size: 1rem;
  line-height: 1.5rem
}

.text-size-10 {
  font-size: .625rem
}

.text-\[10px\] {
  font-size: 10px
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem
}

.text-\[11px\] {
  font-size: 11px
}

.font-extrabold {
  font-weight: 800
}

.font-normal {
  font-weight: 400
}

.font-bold {
  font-weight: 700
}

.font-semibold {
  font-weight: 600
}

.font-medium {
  font-weight: 500
}

.font-light {
  font-weight: 300
}

.uppercase {
  text-transform: uppercase
}

.lowercase {
  text-transform: lowercase
}


.leading-17 {
  line-height: 1.063rem
}


.text-hover-1 {
  color: var(--hover-1)
}

.text-primary {
  color: var(--text-primary)
}

.text-gs-2 {
  color: var(--gs2)
}

.text-red {
  color: var(--red)
}

.text-accents-9 {
  color: var(--accents-9)
}

.text-p-3 {
  color: var(--p3)
}

.text-\[\#01539F\] {
  --tw-text-opacity: 1;
  color: rgb(1 83 159/var(--tw-text-opacity))
}

.text-p-1 {
  color: var(--p1)
}

.text-black {
  --tw-text-opacity: 1;
  color: rgb(0 0 0/var(--tw-text-opacity))
}

.text-alert-danger {
  color: var(--alert-danger)
}

.text-gs-1 {
  color: var(--gs1)
}

.text-\[\#212529\] {
  --tw-text-opacity: 1;
  color: rgb(33 37 41/var(--tw-text-opacity))
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255/var(--tw-text-opacity))
}

.text-basecolor {
  color: var(--text-base)
}

.text-accents-7 {
  color: var(--accents-7)
}

.text-accents-8 {
  color: var(--accents-8)
}

.text-t-1 {
  color: var(--t1)
}

.text-secondary {
  color: var(--text-secondary)
}

.text-gray-800 {
  --tw-text-opacity: 1;
  color: rgb(31 41 55/var(--tw-text-opacity))
}

.text-t-3 {
  color: var(--t3)
}

.text-p-2 {
  color: var(--p2)
}

.underline {
  text-decoration-line: underline
}

.line-through {
  text-decoration-line: line-through
}

.no-underline {
  text-decoration-line: none
}

.underline-offset-\[0\.225rem\] {
  text-underline-offset: .225rem
}

.underline-offset-\[0\.15rem\] {
  text-underline-offset: .15rem
}

.underline-offset-2 {
  text-underline-offset: 2px
}

.opacity-25 {
  opacity: .25
}

.opacity-100 {
  opacity: 1
}

.opacity-0 {
  opacity: 0
}

.opacity-50 {
  opacity: .5
}

.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px
}

.blur {
  --tw-blur: blur(8px)
}

.blur,.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}


.fit {
  min-height: calc(100vh - (5rem + .5rem))
}

:after,:before {
  --tw-content: ""
}


hr {
  height: 0;
  color: inherit;
  border-top-width: 1px
}

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted
}

h1,h2,h3,h4,h5,h6 {
  font-size: inherit;
  font-weight: inherit
}

a {
  color: inherit;
  text-decoration: inherit;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  position: relative;
}

b,strong {
  font-weight: bolder
}

small {
  font-size: 80%
}

sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}




button,select {
  text-transform: none
}

.btn-link.view-all-search-results {
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 800;
  letter-spacing: .44px;
  color: var(--text-primary);
  text-decoration-line: underline;
  text-underline-offset: 4px;
  background-color: inherit;
}


menu,ol,ul {
  list-style: none;
  margin: 0;
  padding: 0
}


[role=button],button {
  cursor: pointer
}

:disabled {
  cursor: default
}

audio,canvas,embed,iframe,img,object,svg,video {
  display: block;
}

img,video {
  max-width: 100%;
  /* height: auto */
  height: 5.675rem
}
.truncate-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}


[hidden] {
  display: none
}

*,:after,:before {
  box-sizing: inherit;
  box-sizing: border-box;
  border: 0 solid #e5e7eb
}

html {
  height: 100%;
  touch-action: manipulation;
  font-feature-settings: "case"1,"rlig"1,"calt"0
}

body,html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
  font-family: Inter,sans-serif;
  font-size: 1rem;
  line-height: 1.5rem;
  color: var(--t4)
}

body {
  position: relative;
  margin: 0;
  min-height: 100%;
  overflow-x: hidden;
  line-height: 1.25rem;
  letter-spacing: .00625rem;

}

a:hover {
  text-decoration-line: none
}

h1 {
  margin-bottom: 1rem;
  font-size: 3rem;
  font-weight: 400;
  line-height: 3.9375rem;
  letter-spacing: .075rem
}

@media (min-width: 768px) {
  h1 {
      font-size:3.75rem;
      line-height: 1;
      line-height: 4.8125rem;
      letter-spacing: .03125rem
  }
}

h2 {
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 3rem;
  letter-spacing: .04375rem
}

@media (min-width: 768px) {
  h2 {
      font-size:3.25rem;
      line-height: 3.9375rem
  }
}

h3 {
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 2.75rem;
  letter-spacing: .04375rem
}

@media (min-width: 768px) {
  h3 {
      font-size:2.5rem;
      font-weight: 600;
      line-height: 3rem
  }
}

h4 {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.75rem;
  letter-spacing: .035625rem
}

@media (min-width: 768px) {
  h4 {
      font-size:2rem;
      line-height: 2.5rem
  }
}

h5 {
  font-size: 1.125rem;
  font-weight: 800;
  line-height: 1.375rem;
  letter-spacing: .0275rem
}

@media (min-width: 768px) {
  h5 {
      font-size:1.5rem;
      line-height: 1.875rem
  }
}

h6 {
  font-size: .875rem;
  font-weight: 800;
  line-height: 1rem;
  letter-spacing: .021875rem
}

@media (min-width: 768px) {
  h6 {
      font-size:1.125rem;
      line-height: 1.875rem
  }
}
.btn-sm {
  padding-top: .375rem!important;
  padding-bottom: .375rem!important
}

.link {
  text-decoration-line: underline
}

.link.\!disabled,.link.disabled {
  pointer-events: none;
  opacity: .5
}



.btn-link svg path {
  fill: var(--hover-1)
}

@media (min-width: 1024px) {
  .btn-link svg path {
      fill:#fff
  }
}

.btn-link.search-btns svg {
  height: 18px;
  width: 18px
}

@media (min-width: 768px) {
  .btn-link.search-btns svg {
      height:1.5rem;
      width: 1.5rem
  }
}

@media (min-width: 640px) {
  .sm\:block {
      display:block
  }

  .sm\:hidden {
      display: none
  }
}

@media (min-width: 768px) {
  .md\:relative {
      position:relative
  }

  .md\:my-0 {
      margin-top: 0;
      margin-bottom: 0
  }

  .md\:mx-\[12px\] {
      margin-left: 12px;
      margin-right: 12px
  }

  .md\:mx-6 {
      margin-right: 1.5rem
  }

  .md\:ml-6,.md\:mx-6 {
      margin-left: 1.5rem
  }

  .md\:mt-3 {
      margin-top: .75rem
  }


  .md\:ml-0 {
      margin-left: 0
  }

  .md\:ml-3 {
      margin-left: .75rem
  }

  .md\:mt-2 {
      margin-top: .5rem
  }

  .md\:mt-5 {
      margin-top: 1.25rem
  }

  .md\:ml-2 {
      margin-left: .5rem
  }

  .md\:mt-9 {
      margin-top: 2.25rem
  }

  .md\:mt-0 {
      margin-top: 0
  }

  .md\:mr-\[17px\] {
      margin-right: 17px
  }

  .md\:ml-\[47px\] {
      margin-left: 47px
  }

  .md\:mr-6 {
      margin-right: 1.5rem
  }

  .md\:block {
      display: block
  }

  .md\:inline-block {
      display: inline-block
  }

  .md\:inline {
      display: inline
  }

  .md\:flex {
      display: flex
  }

  .md\:hidden {
      display: none
  }

  .md\:h-10 {
      height: 2.5rem
  }

  .md\:h-\[45\.625rem\] {
      height: 45.625rem
  }

  .md\:min-h-\[70px\] {
      min-height: 70px
  }

  .md\:w-5\/6 {
      width: 83.333333%
  }

  .md\:w-\[56\.25\%\] {
      width: 56.25%
  }

  .md\:w-full {
      width: 100%
  }

  .md\:w-\[177px\] {
      width: 177px
  }

  .md\:w-8\/12 {
      width: 66.666667%
  }

  .md\:w-4\/12 {
      width: 33.333333%
  }

  .md\:w-\[53\%\] {
      width: 53%
  }

  .md\:w-auto {
      width: auto
  }

  .md\:w-1\/2 {
      width: 50%
  }

  .md\:min-w-\[74px\] {
      min-width: 74px
  }

  .md\:max-w-\[21\.25rem\] {
      max-width: 21.25rem
  }

  .md\:max-w-\[362px\] {
      max-width: 362px
  }

  .md\:max-w-\[12\.1875rem\] {
      max-width: 12.1875rem
  }

  @keyframes fade-in-down {
      0% {
          opacity: 0;
          transform: translateY(-10px)
      }

      to {
          opacity: 1;
          transform: translateY(0)
      }
  }

  .md\:animate-fade-in-down {
      animation: fade-in-down .2s ease-out
  }

  .md\:flex-row {
      flex-direction: row
  }

  .md\:flex-col {
      flex-direction: column
  }

  .md\:flex-col-reverse {
      flex-direction: column-reverse
  }

  .md\:flex-wrap {
      flex-wrap: wrap
  }

  .md\:flex-nowrap {
      flex-wrap: nowrap
  }

  .md\:items-end {
      align-items: flex-end
  }

  .md\:items-center {
      align-items: center
  }

  .md\:justify-between {
      justify-content: space-between
  }

  .md\:space-x-5>:not([hidden])~:not([hidden]) {
      --tw-space-x-reverse: 0;
      margin-right: calc(1.25rem * var(--tw-space-x-reverse));
      margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse)))
  }

  .md\:whitespace-nowrap {
      white-space: nowrap
  }

  .md\:border {
      border-width: 1px
  }

  .md\:border-0 {
      border-width: 0
  }

  .md\:border-t {
      border-top-width: 1px
  }

  .md\:border-none {
      border-style: none
  }

  .md\:border-gs-3 {
      border-color: var(--gs3)
  }

  .md\:px-10 {
      padding-left: 2.5rem;
      padding-right: 2.5rem
  }

  .md\:px-0 {
      padding-left: 0;
      padding-right: 0
  }

  .md\:py-0 {
      padding-top: 0;
      padding-bottom: 0
  }

  .md\:px-5 {
      padding-left: 1.25rem;
      padding-right: 1.25rem
  }

  .md\:py-9 {
      padding-top: 2.25rem;
      padding-bottom: 2.25rem
  }

  .md\:px-9 {
      padding-left: 2.25rem;
      padding-right: 2.25rem
  }

  .md\:px-6 {
      padding-left: 1.5rem;
      padding-right: 1.5rem
  }

  .md\:py-8 {
      padding-top: 2rem;
      padding-bottom: 2rem
  }

  .md\:py-\[18px\] {
      padding-top: 18px;
      padding-bottom: 18px
  }

  .md\:px-\[33px\] {
      padding-left: 33px;
      padding-right: 33px
  }

  .md\:px-11 {
      padding-left: 2.75rem;
      padding-right: 2.75rem
  }

  .md\:px-8 {
      padding-left: 2rem;
      padding-right: 2rem
  }

  .md\:pb-16 {
      padding-bottom: 4rem
  }

  .md\:pt-0 {
      padding-top: 0
  }

  .md\:pt-10 {
      padding-top: 2.5rem
  }

  .md\:pt-12 {
      padding-top: 3rem
  }

  .md\:pl-3 {
      padding-left: .75rem
  }

  .md\:pb-\[9px\] {
      padding-bottom: 9px
  }

  .md\:pt-11 {
      padding-top: 2.75rem
  }

  .md\:pl-5 {
      padding-left: 1.25rem
  }

  .md\:pb-5 {
      padding-bottom: 1.25rem
  }

  .md\:pr-1 {
      padding-right: .25rem
  }

  .md\:pl-8 {
      padding-left: 2rem
  }

  .md\:pb-\[5px\] {
      padding-bottom: 5px
  }

  .md\:pl-6 {
      padding-left: 1.5rem
  }

  .md\:pr-\[21px\] {
      padding-right: 21px
  }

  .md\:pb-\[46px\] {
      padding-bottom: 46px
  }

  .md\:pt-\[22px\] {
      padding-top: 22px
  }

  .md\:pb-\[18px\] {
      padding-bottom: 18px
  }

  .md\:pl-0 {
      padding-left: 0
  }

  .md\:pr-3 {
      padding-right: .75rem
  }

  .md\:pb-11 {
      padding-bottom: 2.75rem
  }

  .md\:pb-9 {
      padding-bottom: 2.25rem
  }

  .md\:pb-0 {
      padding-bottom: 0
  }

  .md\:pb-3 {
      padding-bottom: .75rem
  }

  .md\:pt-\[18px\] {
      padding-top: 18px
  }

  .md\:pb-\[38px\] {
      padding-bottom: 38px
  }

  .md\:pt-\[14px\] {
      padding-top: 14px
  }

  .md\:pb-\[70px\] {
      padding-bottom: 70px
  }

  .md\:pt-3 {
      padding-top: .75rem
  }

  .md\:pl-\[35px\] {
      padding-left: 35px
  }

  .md\:pr-2\.5 {
      padding-right: .625rem
  }

  .md\:pr-2 {
      padding-right: .5rem
  }

  .md\:pb-10 {
      padding-bottom: 2.5rem
  }

  .md\:text-left {
      text-align: left
  }

  .md\:text-size-40 {
      font-size: 2.5rem
  }

  .md\:text-base {
      font-size: 1rem;
      line-height: 1.5rem
  }

  .md\:text-size-64 {
      font-size: 4rem
  }

  .md\:text-xl {
      font-size: 1.25rem;
      line-height: 1.75rem
  }

  .md\:text-lg {
      font-size: 1.125rem;
      line-height: 1.75rem
  }

  .md\:text-size-32 {
      font-size: 2rem
  }

  .md\:text-6xl {
      font-size: 3.75rem;
      line-height: 1
  }

  .md\:text-xs {
      font-size: .75rem;
      line-height: 1rem
  }

  .md\:text-\[32px\] {
      font-size: 32px
  }

  .md\:text-3xl {
      font-size: 1.875rem;
      line-height: 2.25rem
  }

 


  .md\:leading-17 {
      line-height: 1.063rem
  }

}

@media (min-width: 1024px) {
  .lg\:static {
      position:static
  }

  .lg\:right-0 {
      right: 0
  }

  .lg\:mr-5 {
      margin-right: 1.25rem
  }

  .lg\:mt-0 {
      margin-top: 0
  }

  .lg\:mr-4 {
      margin-right: 1rem
  }

  .lg\:ml-0 {
      margin-left: 0
  }

  .lg\:mt-14 {
      margin-top: 3.5rem
  }


  .lg\:mr-16 {
      margin-right: 4rem
  }

  .lg\:mr-3 {
      margin-right: .75rem
  }

  .lg\:mt-12 {
      margin-top: 3rem
  }

  .lg\:block {
      display: block
  }

  .lg\:flex {
      display: flex
  }

  .lg\:hidden {
      display: none
  }

  .lg\:h-7 {
      height: 1.75rem
  }

  .lg\:h-full {
      height: 100%
  }

  .lg\:h-\[40\.625rem\] {
      height: 40.625rem
  }

  .lg\:max-h-\[25\.75rem\] {
      max-height: 25.75rem
  }

  .lg\:min-h-\[99px\] {
      min-height: 99px
  }

  .lg\:w-\[46\.25\%\] {
      width: 46.25%
  }

  .lg\:w-\[846px\] {
      width: 846px
  }

  .lg\:w-\[286px\] {
      width: 286px
  }

  .lg\:w-\[235px\] {
      width: 235px
  }

  .lg\:w-2\/5 {
      width: 40%
  }

  .lg\:w-1\/3 {
      width: 33.333333%
  }

  .lg\:w-\[150\%\] {
      width: 150%
  }

  .lg\:w-5\/12 {
      width: 41.666667%
  }

  .lg\:w-7\/12 {
      width: 58.333333%
  }

  .lg\:w-\[362px\] {
      width: 362px
  }

  .lg\:w-full {
      width: 100%
  }

  .lg\:w-1\/2 {
      width: 50%
  }

  .lg\:min-w-\[220px\] {
      min-width: 220px
  }

  .lg\:max-w-\[362px\] {
      max-width: 362px
  }

  .lg\:max-w-\[240px\] {
      max-width: 240px
  }

  .lg\:flex-row {
      flex-direction: row
  }

  .lg\:flex-row-reverse {
      flex-direction: row-reverse
  }

  .lg\:items-start {
      align-items: flex-start
  }

  .lg\:justify-between {
      justify-content: space-between
  }

  .lg\:overflow-x-auto {
      overflow-x: auto
  }

  .lg\:overflow-y-hidden {
      overflow-y: hidden
  }

  .lg\:whitespace-nowrap {
      white-space: nowrap
  }

  .lg\:border-t-0 {
      border-top-width: 0
  }

  .lg\:border-l {
      border-left-width: 1px
  }

  .lg\:border-r {
      border-right-width: 1px
  }

  .lg\:border-\[\#C8CACD\] {
      --tw-border-opacity: 1;
      border-color: rgb(200 202 205/var(--tw-border-opacity))
  }

  .lg\:border-gs-1 {
      border-color: var(--gs1)
  }


  .lg\:px-5 {
      padding-left: 1.25rem;
      padding-right: 1.25rem
  }

  .lg\:px-0 {
      padding-left: 0;
      padding-right: 0
  }

  .lg\:py-5 {
      padding-top: 1.25rem;
      padding-bottom: 1.25rem
  }

  .lg\:px-3 {
      padding-left: .75rem;
      padding-right: .75rem
  }

  .lg\:pb-2\.5 {
      padding-bottom: .625rem
  }

  .lg\:pb-2 {
      padding-bottom: .5rem
  }

  .lg\:pl-10 {
      padding-left: 2.5rem
  }

  .lg\:pb-8 {
      padding-bottom: 2rem
  }

  .lg\:pl-5 {
      padding-left: 1.25rem
  }

  .lg\:pr-2\.5 {
      padding-right: .625rem
  }

  .lg\:pr-2 {
      padding-right: .5rem
  }

  .lg\:pt-0 {
      padding-top: 0
  }

  .lg\:pl-\[26px\] {
      padding-left: 26px
  }

  .lg\:pt-1 {
      padding-top: .25rem
  }

  .lg\:text-left {
      text-align: left
  }

  .lg\:text-xs {
      font-size: .75rem;
      line-height: 1rem
  }

  .lg\:text-base {
      font-size: 1rem;
      line-height: 1.5rem
  }

  .lg\:text-\[2rem\] {
      font-size: 2rem
  }

  .lg\:leading-5 {
      line-height: 1.25rem
  }

  .lg\:leading-3 {
      line-height: .75rem
  }
}

@media (min-width: 1280px) {
  .xl\:static {
      position:static
  }

  .xl\:-right-6 {
      right: -1.5rem
  }

  .xl\:mx-\[34px\] {
      margin-left: 34px;
      margin-right: 34px
  }

  .xl\:mr-16 {
      margin-right: 4rem
  }

  .xl\:w-2\/3 {
      width: 66.666667%
  }

  .xl\:w-1\/2,.xl\:w-2\/4 {
      width: 50%
  }

  .xl\:max-w-\[435px\] {
      max-width: 435px
  }

  .xl\:max-w-\[32\.25rem\] {
      max-width: 32.25rem
  }

  .xl\:max-w-\[624px\] {
      max-width: 624px
  }

  .xl\:max-w-\[853px\] {
      max-width: 853px
  }

  .xl\:max-w-\[363px\] {
      max-width: 363px
  }

  .xl\:flex-row {
      flex-direction: row
  }

  .xl\:flex-nowrap {
      flex-wrap: nowrap
  }

  .xl\:justify-between {
      justify-content: space-between
  }

  .xl\:space-x-4>:not([hidden])~:not([hidden]) {
      --tw-space-x-reverse: 0;
      margin-right: calc(1rem * var(--tw-space-x-reverse));
      margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)))
  }

  .xl\:px-0 {
      padding-left: 0;
      padding-right: 0
  }

  .xl\:px-11 {
      padding-left: 2.75rem;
      padding-right: 2.75rem
  }

  .xl\:pt-10 {
      padding-top: 2.5rem
  }

  .xl\:pr-\[27px\] {
      padding-right: 27px
  }

  .xl\:pl-\[6\.5rem\] {
      padding-left: 6.5rem
  }

  .xl\:pt-\[70px\] {
      padding-top: 70px
  }

  .xl\:pb-8 {
      padding-bottom: 2rem
  }

  .xl\:pr-\[18px\] {
      padding-right: 18px
  }

  .xl\:pb-\[25px\] {
      padding-bottom: 25px
  }

  .xl\:pt-3\.5 {
      padding-top: .875rem
  }

  .xl\:pt-3 {
      padding-top: .75rem
  }

  .xl\:pt-0 {
      padding-top: 0
  }

  .xl\:pl-\[90px\] {
      padding-left: 90px
  }

  .xl\:pl-\[50px\] {
      padding-left: 50px
  }
}

@media (min-width: 1440px) {
  .\32xl\:-right-\[45px\] {
      right:-45px
  }

  .\32xl\:w-\[303px\] {
      width: 303px
  }

  .\32xl\:w-\[550px\] {
      width: 550px
  }

  .\32xl\:min-w-\[118px\] {
      min-width: 118px
  }

  .\32xl\:max-w-\[118px\] {
      max-width: 118px
  }

  .\32xl\:py-3\.5 {
      padding-top: .875rem;
      padding-bottom: .875rem
  }

  .\32xl\:py-3 {
      padding-top: .75rem;
      padding-bottom: .75rem
  }

  .\32xl\:pb-\[95px\] {
      padding-bottom: 95px
  }

  .\32xl\:pl-\[22px\] {
      padding-left: 22px
  }

  .\32xl\:pl-6 {
      padding-left: 1.5rem
  }

  .\32xl\:pb-2\.5 {
      padding-bottom: .625rem
  }

  .\32xl\:pb-2 {
      padding-bottom: .5rem
  }

  .\32xl\:pb-\[22px\] {
      padding-bottom: 22px
  }

  .\32xl\:text-\[18px\] {
      font-size: 18px
  }
}

@media (hover: none) {
  .touch\:text-base {
      font-size:1rem;
      line-height: 1.5rem
  }
}

.SearchAutocomplete_autocomplete__1ISXa {
  position: absolute;
  /* margin-top: .75rem; */
  display: flex;
  height: auto;
  overflow-y: auto;
  padding: /* 1rem */ .5rem;
  max-height: 80vh
}

@media (min-width: 768px) {
  .SearchAutocomplete_autocomplete__1ISXa {
      margin-top:0.625rem /*Updates from 1.25rem to 0.625rem for the gap of search dropdown from input box*/
  }
}

@media (min-width: 1024px) {
  .SearchAutocomplete_autocomplete__1ISXa {
      padding:0
  }
}

.SearchAutocomplete_autocomplete__1ISXa img {
  aspect-ratio: 1/1;
  -o-object-fit: contain;
  object-fit: contain
}

@media (min-width: 768px) and (max-width: 1024px) {
  .SearchAutocomplete_autocomplete__1ISXa {
    max-height: 60vh;
  }
}
@media (min-width: 1025px) {
  .SearchAutocomplete_autocomplete__1ISXa {
    max-height: 555px;
  }
}




@media (min-width: 768px) {
  .SearchAutocomplete_search-container__9sV_7 {
      margin-top:1.25rem
  }
}

.SearchAutocomplete_search-info__Sqrc3 {
  display: none
}

.SearchAutocomplete_autocomplete-total__Ao_dw {
  width: 100%
}

.SearchAutocomplete_autocomplete-product-tiny__YRyRT {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  /* padding-top: 11px;
  padding-bottom: 11px */
}

.SearchAutocomplete_autocomplete-product-tiny__YRyRT .product-price {
  font-weight: 600
}

.SearchAutocomplete_autocomplete-product-tiny-name__GbqnK {
  padding-left: 1.25rem;
  padding-right: .625rem;
  padding-top: 1.25rem;
}

.SearchAutocomplete_autocomplete-product-tiny-name__GbqnK .product-price {
  font-size: .875rem;
  line-height: 1.25rem;
  font-weight: 800;
  letter-spacing: .51px;
  --tw-text-opacity: 1;
  color: rgb(33 37 41/var(--tw-text-opacity))
}

.SearchAutocomplete_autocomplete-product-tiny-name__GbqnK .product-price .old-price {
  color: var(--gs2)
}

.SearchAutocomplete_autocomplete-product-tiny-name__GbqnK .product-price .old-price+.price {
  color: var(--p1)
}

.SearchAutocomplete_search-category__YU1ec a,.SearchAutocomplete_search-term__OrGdL a {
  margin-bottom: 15px;
  display: block;
  --tw-text-opacity: 1;
  color: rgb(33 37 41/var(--tw-text-opacity))
}

@media (min-width: 1440px) {
  .SearchAutocomplete_search-category__YU1ec a,.SearchAutocomplete_search-term__OrGdL a {
      margin-bottom:1.25rem
  }
}

  /* Define the class for larger screens */
  .border-right-non-mobile {
    border-right: 0.0625rem solid #ccc !important;
  }
  
  /* Remove the border on smaller screens (mobile devices) */
  @media (max-width: 767px) {
    .border-right-non-mobile {
      border-right: none !important;
    }
  }
  
  /* Base styles for the container and divs */
  
  .div1,
  .div2 {
    /* padding: 20px; */
    /* border: 1px solid #000; */
    margin: 10px;
  }
  
  /* Media query for larger screens */
  @media (min-width: 768px) {
    .container {
      flex-direction: row;
    }
  
    .div1 {
      order: 1;
      /* Default order for larger screens */
    }
  
    .div2 {
      order: 2;
      /* Default order for larger screens */
    }
  }
  
  /* Media query for smaller screens */
  @media (max-width: 767px) {
    .div1 {
      order: 2;
      /* Switch order for smaller screens */
    }
  
    .div2 {
      order: 1;
      /* Switch order for smaller screens */
    }
  }