@font-face {
  font-family: 'Marmalede';
  src: url('../marmalederegular.html') format('woff2'),
      url('../woff/marmalederegular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/* Globel CSS */
.margin-bottom-30 {
  margin-bottom: 30px;
}
.rounded-lg {
  border-radius: 0.3rem !important;
}
/* Banner */
.banner-slider-wrapper {
  margin: 15px auto 45px;
}
/* desktop timer */
.homepage-slider-countdown.countdown1 {
  position: absolute;
  left: 53.6%;
  bottom: 13.2%;
  display: flex;
  transform: translateX(-50%);
}
.homepage-slider-countdown.countdown2 {
  left: 22.2%;
  bottom: 14.5%;
}
.homepage-slider-countdown .time-ends-in {
  position: absolute;
  display: none;
  font-size: 1rem;
  color: #fff;
  font-weight: 400;
  transform: rotate(0deg);
  top: -35%;
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
}
.homepage-slider-countdown .time-box {
  /* height: auto; */
  /* border-radius: 10px; */
  margin: 0 7px;
  /* position: relative; */
  /* overflow: visible; */
  /* box-shadow: 0 0 0 8px #ffffff00; */
  /* border: none; */
  /* display: flex; */
  /* flex-direction: column; */
  /* align-items: center; */
  /* justify-content: center; */
}
/* .time-box:before {
content: "";
position: absolute;
inset: 0;
border-radius: 0;
padding: 2.5px;
background: url(https://www.heatandplumb.com/acatalog/images/timer-cube.png);
mask-composite: exclude;
padding-bottom: 3px;
padding-right: 3px;
background-size: 100% 100%;
display: none;
} */
.homepage-slider-countdown .time-separator {
  display: none;
}
.homepage-slider-countdown .time-box .time-countdown {
  display: block;
  color: #ffffff;
    font-size: 30px;
    background: #2d2e30;
  font-weight: 700;
  width: 52px;
  height: 52px;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 2;
  /* border: 3px solid #ddd9d0; */
}
body .homepage-slider-countdown.countdown2 .time-box .time-countdown {
  color: #0078ff;
}
.homepage-slider-countdown .time-box .time-countdown-label {
  display: block;
  color: #000000;
  padding: 0px 0;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 13px;
  line-height: 20px;
  margin-top: 5px;

}
/* /desktop timer  */
.carousel-pagination-box {
  width: 100%;
  display: block;
  height: 50px;
  position: relative;
}
.carousel-pagination-box ul.carousel-indicators {
  margin: 0;
  padding: 0;
  position: relative;
  display: flex;
  justify-content: center;
  padding-left: 0;
  list-style: none;
}
.carousel-pagination-box ul.carousel-indicators .active {
  background-color: #253960;
  color: #fff;
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.carousel-pagination-box ul li {
  box-sizing: inherit;
  margin: 0 !important;
  height: 50px;
  position: relative;
  bottom: 0;
  display: inline-block;
  width: 100%;
  border-right: 1px solid #f1f1f1;
  border-bottom: 1px solid #f1f1f1;
  border-top: 0 !important;
  text-align: center;
  padding: 9px 0;
  font-size: 16px;
  cursor: pointer;
  border-radius: 0;
  opacity: 1;
  text-indent: 0;
  overflow: hidden;
}
.carousel-pagination-box ul li .pagination-title {
  display: block;
  width: 100%;
  text-transform: uppercase;
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.1em;
}
.carousel-pagination-box ul li small {
  display: block;
  width: 100%;
  padding: 0 5px;
  overflow: hidden;
}
div#main-slider .carousel-item a {
  display: block;
  padding-top: 28.56%;
  position: relative;
}
/* /Banner */
/* global-services-wrapper */
.global-services-wrapper {
  width: 100%;
  position: relative;
  border-top: 1px solid #f1f1f1;
  border-bottom: 1px solid #f1f1f1;
}

.global-service-box {
  text-align: center;
  color: #253960;
  background-color: #fff;
  padding: 55px 0;
  height: 230px;
  max-width: 230px;
  margin: 0 auto;
  border-radius: 50%;
  box-shadow: 0 1px 2px 0 rgb(90 91 95 / 15%);
  transition: all 0.3s ease-in-out;
  display: block;
}

.global-service-box:hover {
  border-bottom-right-radius: 4px;
  box-shadow: 0 16px 22px 0 rgb(90 91 95 / 30%);
  top: -5px;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  background: linear-gradient(135deg, #c6294c 0, #253960 100%);
}
.global-service-box:hover .global-service-icon,
.global-service-box:hover .global-service-heading,
.global-service-box:hover .global-service-text {
  color: #fff;
}
.global-service-icon {
  color: #253960;
  line-height: 1;
}
.bg-trustpilot_logo_icon {
  width: 45px;
  height: 45px;
  background: url(../png/homepage_brand_logo_sprites_1.png) -290px -89px;
}
.global-service-icon .trustpilot-logo-text {
  font-size: 22px;
  display: inline-block;
  font-weight: 500;
}
.global-service-text {
  font-size: 14px;
  margin-top: 0.625rem;
}
/*  /global-services-wrapper */
/* categories-wrapper  */
.category-banner {
  position: relative;
  overflow: hidden;
}
.category-banner a:not(.btn-promo-banner) {
  padding-top: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}
.category-banner > .category-banner-img img {
  min-width: 100%;
  transform: scale(1);
  transition: all 0.3s ease-out 0s;
}
.category-banner a img {
  height: 100%;
  width: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  z-index: 1;
}
.category-banner > .category-banner-img img:hover {
  transform: scale(1.1);
}
.category-banner-title {
  position: absolute;
  top: 5%;
  left: 15px;
  z-index: 1;
  background-color: #c6294c;
  width: auto;
  color: #fff;
}
h3.category-banner-title {
  margin-bottom: 0;
  font-size: 1rem !important;
  padding: 0.3125rem 1rem;
  background-color: #253960;
  color: #fff !important;
  font-weight: 500 !important;
}
h2.category-banner-title {
  margin-bottom: 0;
  font-size: 2.2rem;
  padding: 0.3125rem 1rem;
}
/* /categories-wrapper  */
/* showering-heating-wrapper  */
.showering-heating-wrapper {
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: #f1f1f1;
}
.bathrooms-round-text {
  width: 100%;
  height: 100%;
  position: relative;
  margin: 0 auto;
  padding: 10px 30px 0;
}
.description {
  margin-bottom: 0px;
}
.bathroom-icon-wrapper {
  margin-top: 20px;
}
.bathroom-icon-box {
  position: relative;
  width: 90%;
  margin: 0 auto;
  background-color: #fff;
  text-align: center;
  padding: 15px 0;
  border-radius: 3px;
  box-shadow: 0 1px 2px 0 rgb(90 91 95 / 15%);
  transition: all 0.3s ease-in-out;
}
.bathroom-icon-box svg {
  width: 70px;
  height: 70px;
  transition: transform 0.2s;
}
.bathroom-icon-box:hover img {
  transform: scale(1.1);
  transition: all 0.3s ease-in-out;
}
.bathroom-icon-box > p {
  margin-bottom: 0;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 600;
  margin-top: 15px;
  letter-spacing: 2px;
}
/* /showering-heating-wrapper  */
/* great-brands-wrapper */
.great-brands-wrapper {
  height: 100%;
  padding: 60px 0;
}
.great-brands-wrapper .section-header {
  margin-bottom: 20px;
}
.great-brands-img {
  width: 100%;
  text-align: center;
  padding: 0 15px;
  float: left;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.brand-img {
  text-align: center;
  margin: 0.25%;
  display: block;
  width: 9%;
  float: left;
  background-color: #fff;
  border-radius: 5px;
  border: 2px solid #253960;
}
.brand-img a {
  display: block;
  padding: 7px;
}
/*/great-brands-wrapper */
/* what-makes-wrapper */
.what-makes-content {
  padding: 40px;
}
.block-text {
  position: relative;
  width: 100%;
}
.what-makes-content .block-text p {
  line-height: 25px;
}
/* /what-makes-wrapper */
/* .extra-service-wrapper */
section.section-block.trustpilot-wrapper.bg-white + section {
  box-shadow: 0 7px 7px #0000004a;
  position: relative;
  z-index: 9;
}
.extra-services-content {
  padding: 60px 40px;
}
.service-box {
  background-color: #fff;
  box-shadow: 0 5px 20px rgb(0 0 0 / 5%);
  position: relative;
}
.service-img {
  overflow: hidden;
  position: relative;
}
.service-img > img {
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
  -webkit-transform: scale(1) translateZ(0) translateY(0);
  -moz-transform: scale(1) translateZ(0) translateY(0);
  -ms-transform: scale(1) translateZ(0) translateY(0);
  transform: scale(1) translateZ(0) translateY(0);
  -webkit-backface-visibility: hidden;
}
.service-box:hover .service-img > img {
  -webkit-transform: scale(1.2) translateZ(0) translateY(5%);
  -moz-transform: scale(1.2) translateZ(0) translateY(5%);
  -ms-transform: scale(1.2) translateZ(0) translateY(5%);
  transform: scale(1.2) translateZ(0) translateY(5%);
}
.service-box:hover .service-icon {
  background-color: #fff;
}
.service-box .service-icon {
  width: 64px;
  height: 64px;
  line-height: 60px;
  padding-top: 0;
  text-align: center;
  position: relative;
  background-color: #c72c4d;
  border-radius: 50%;
  text-align: center;
  border: 4px solid #fff;
  margin: -30px auto 0;
  top: -10%;
  transition: 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
}
p.service-heading {
  margin-top: 0;
  padding: 0 15px;
  margin-bottom: 0;
  text-align: center;
  font-size: 1.25rem;
  font-weight: 400;
}
.service-text {
  margin-bottom: 0;
  padding: 15px;
  text-align: center;
}
.service-content {
  min-height: 160px;
}
.service-icon svg {
  font-size: 24px;
  color: #fff;
}
.service-box:hover .service-icon {
  background-color: #fff;
}
.service-box:hover .service-icon svg {
  color: #c72c4d;
}
.temp-bnr a {
  padding-top: 6.7%;
  display: block;
  position: relative;
  overflow: hidden;
}
.temp-bnr a img {
  height: 100%;
  width: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: contain;
  z-index: 1;
}
div#main-slider .carousel-item a img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.top-ten-product .row.best_seller div.col-xl-3,
.top-ten-product .row.newly_added div.col-xl-3 {
  max-width: 20%;
}
/* /.extra-service-wrapper */
.section-header a svg {
  width: 17px;
  margin-left: 8px;
  fill: #fff;
}
.section-header a {
  background: #c6294c;
  color: #fff;
  width: 100%;
  padding: 9px 0;
  border-radius: 6px;
  max-width: 170px;
  font-size: 17px;
  font-weight: 400;
  display: flex;
  align-items: center;
  justify-content: center;
}
.view-all {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.section-header h3 {
  margin: 0;
}
/* box placeholder loading */
body .product-item-list .placeholder-content {
  overflow: hidden;
  background: #000;
  position: relative;
  -webkit-animation-duration: 1.7s;
  animation-duration: 1.7s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-name: placeholderAnimate;
  animation-name: placeholderAnimate;
  background: #f6f7f8;
  background: linear-gradient(to right, #eee 2%, #ddd 18%, #eee 33%);
  background-size: 1300px;
}
.placeholder-content_item:after,
.placeholder-content_item:before {
  width: inherit;
  height: inherit;
  content: "";
  position: absolute;
}
.placeholder-content {
  height: 30px;
  margin: 0 8px;
  margin-bottom: 5px;
}
@-webkit-keyframes placeholderAnimate {
  0% {
      background-position: -650px 0;
  }
  100% {
      background-position: 650px 0;
  }
}

@keyframes placeholderAnimate {
  0% {
      background-position: -650px 0;
  }
  100% {
      background-position: 650px 0;
  }
}
/* media quary */
@media (max-width: 1024px) {
  .top-ten-product .row.best_seller div.col-xl-3,
  .top-ten-product .row.newly_added div.col-xl-3 {
      max-width: 40%;
  }
}
@media (max-width: 991px) {
  #wrapper > .container {
      padding: 0;
  }

  .global-services-wrapper .global-service-box:nth-child(1) .global-service-icon {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
  }

  .temp-bnr a {
      padding-top: 8%;
  }

  .global-service-icon > svg {
      font-size: 2.5rem;
  }
  .section-header h3 {
      font-size: 1.3rem;
      margin-bottom: 0;
      font-weight: 500;
      margin-top: 0 !important;
  }

  .section-block .section-header h3,
  .extra-service-wrapper .section-header h3 {
      font-size: 1.375rem;
  }

  .bathroom-icon-box img {
      height: 40px;
      width: 40px;
  }
  .service-heading h5 {
      font-size: 16px;
      padding: 0;
  }

  .carousel-indicators li,
  .category-banner > .category-banner-img img {
      transition: none !important;
  }
  .temp-bnr.mt-5 {
      margin-top: 24px !important;
  }
  .global-service-box {
      height: auto;
      width: 100%;
      padding: 0.3125rem;
      border-radius: 0;
      margin-bottom: 0.3125rem;
  }

  .global-services-wrapper .col-6:nth-child(odd) {
      padding-right: 0.125rem;
  }

  .global-services-wrapper .col-6:nth-child(even) {
      padding-left: 0.125rem;
  }

  .global-service-heading h5 {
      font-size: 0.825rem;
      font-weight: 500;
  }

  .global-service-icon {
      margin: 0 !important;
      height: 48px;
  }

  .global-service-text span {
      display: block;
      height: 20px;
  }

  .global-service-text {
      font-size: 12px;
      font-weight: 400;
      margin: 0;
      padding: 0;
  }

  .global-service-icon .trustpilot-logo-text {
      font-size: 1rem;
      top: 13px;
      height: 20px;
  }

  .global-service-heading {
      margin-top: 0 !important;
  }

  body .banner-slider-wrapper {
      height: auto !important;
      margin-bottom: 2px !important;
  }

  .best-product-tab-wrapper {
      display: none;
  }

  h2.category-banner-title,
  h3.category-banner-title {
      padding: 0.3125rem;
      font-size: 0.75rem !important;
      color: #fff !important;
      font-weight: 500;
  }
  .bathrooms-round-text {
      padding: 0 0.3125rem;
  }

  .bathroom-icon-box > p {
      font-size: 12px;
  }

  .bathroom-icon-wrapper .col-4 {
      padding: 0 0.3125rem;
  }
  .great-brands-wrapper {
      min-height: 100%;
      padding: 1rem 0;
  }

  .great-brands-img {
      padding: 1rem 0;
  }

  .great-brands-wrapper .brand-img {
      display: inline-block;
      background-color: transparent;
      border: 1px solid #253960;
      padding: 0;
      width: 18%;
      float: none;
      margin: 0.75%;
      border-radius: 0;
  }

  .great-brands-wrapper .brand-img a {
      padding: 0;
  }

  .section-block {
      padding: 1rem 0;
  }

  .section-header h5 {
      font-size: 1.3rem;
      margin-bottom: 0;
      font-weight: 500;
      margin-top: 0 !important;
  }

  .what-makes-content h3 {
      font-size: 1.3rem;
      margin-bottom: 0;
      font-weight: 500;
      margin-top: 0.875rem !important;
  }
  .what-makes-content {
      padding: 0;
  }

  .what-makes-content h3,
  .what-makes-content .block-text p {
      line-height: inherit;
      margin: 0;
      padding-bottom: 0.5rem;
      padding-top: 0 !important;
  }

  .extra-services-content h3 {
      margin-bottom: 0.5rem;
      padding-bottom: 1rem;
  }
  .section-content .service-box {
      margin-bottom: 2.5rem;
  }

  .extra-services-content {
      padding: 0.5rem 0;
  }

  .section-content .col-12:nth-child(3) .service-box {
      margin-bottom: 0;
  }

  .carousel-pagination-box ul.carousel-indicators {
      margin: 10px !important;
  }

  .carousel-pagination-box ul li {
      height: 10px;
      width: 10px;
      padding: 0;
      font-size: 0;
      padding: 0;
      background-color: #ddd;
      margin: 0 2px !important;
      border: 0 !important;
      border-radius: 30px;
  }

  .carousel-pagination-box ul li .pagination-title {
      font-size: 0;
  }

  .carousel-pagination-box {
      height: auto;
  }
  .categories-wrapper .panel-block-row.col-12 {
      margin-bottom: 0.625rem !important;
  }

  .mobile-header .header-right-side .icon-block {
      width: 50px;
      display: inline-block;
      border-left: 1px solid #f1f1f1;
      text-align: center;
      margin: 0;
      padding: 0;
      height: 50px;
      line-height: 50px;
      font-size: 1.2rem;
  }

  .bathroom-icon-box svg {
      width: 50px;
      height: 40px;
  }

  .bathroom-icon-box {
      padding: 4px 0;
  }

  .great-brands-wrapper .section-header {
      margin-bottom: 0;
  }
  div#main-slider .carousel-item > a {
      padding-top: 53.3%;
      display: block;
      position: relative;
  }
}
@media (max-width: 767px) {
  .homepage-slider-countdown.countdown1 {
    position: absolute;
    left: 50.4%;
    bottom: -3.8%;
    display: flex;
    transform: translateX(-50%);
}
.homepage-slider-countdown .time-box {
  margin: 0px 2px;
}
.homepage-slider-countdown .time-box .time-countdown {
  font-size: 20px;
  font-weight: 500;
  border-radius: 6px;
  height: 27px;
  width: 28px;
  line-height: 1.5;
}

.homepage-slider-countdown .time-box .time-countdown-label {
  transform: translate(0px, -7px);
  padding: 0px 0;
  font-size: 11px;
  font-weight: 600;
}
  #main-slider .carousel-inner {
      margin-top: 3.125rem;
  }
}
@media (max-width: 575px) {
  .categories-wrapper .panel-block-row.col-6:nth-child(odd) {
      padding-right: 0.3125rem;
      margin-bottom: 0.625rem !important;
  }

  .categories-wrapper .panel-block-row.col-6:nth-child(even) {
      padding-left: 0.3125rem;
      margin-bottom: 0.625rem !important;
  }
  .categories-wrapper .panel-block-row.col-6:nth-child(even) h3 {
      left: 6px;
  }
}
