@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
 
:root {
 --ewcl-0: #8dc63f;
 --ewcl-0-transparent: rgba(141, 198, 63, 0.55);
 --ewcl-0-transparent-dark: rgba(141, 198, 63, 0.95);
 --ewcl-1: #4d8e5c;
 --ewcl-3: #cde4d2;
 --ewcl-4: #3b7700;
}

:root {
 --bs-blue:var(--ewcl-0);
 --bs-indigo:#6610f2;
 --bs-purple:#6f42c1;
 --bs-pink:#d63384;
 --bs-red:#dc3545;
 --bs-orange:#fd7e14;
 --bs-yellow:#ffc107;
 --bs-green:#198754;
 --bs-teal:#20c997;
 --bs-cyan:#0dcaf0;
 --bs-black:#000;
 --bs-white:#fff;
 --bs-gray:#6c757d;
 --bs-gray-dark:#343a40;
 --bs-gray-100:#f8f9fa;
 --bs-gray-200:#e9ecef;
 --bs-gray-300:#dee2e6;
 --bs-gray-400:#ced4da;
 --bs-gray-500:#adb5bd;
 --bs-gray-600:#6c757d;
 --bs-gray-700:#495057;
 --bs-gray-800:#343a40;
 --bs-gray-900:#212529;
 --bs-primary:var(--ewcl-0);
 --bs-secondary:#6c757d;
 --bs-success:#198754;
 --bs-info:#0dcaf0;
 --bs-warning:#ffc107;
 --bs-danger:#dc3545;
 --bs-light:#f8f9fa;
 --bs-dark:#212529;
 --bs-primary-rgb:13,110,253;
 --bs-secondary-rgb:108,117,125;
 --bs-success-rgb:25,135,84;
 --bs-info-rgb:13,202,240;
 --bs-warning-rgb:255,193,7;
 --bs-danger-rgb:220,53,69;
 --bs-light-rgb:248,249,250;
 --bs-dark-rgb:33,37,41;
 --bs-white-rgb:255,255,255;
 --bs-black-rgb:0,0,0;
 --bs-body-color-rgb:33,37,41;
 --bs-body-bg-rgb:255,255,255;
 --bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
 --bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
 --bs-gradient:linear-gradient(180deg,rgba(255,255,255,0.15),rgba(255,255,255,0));
 --bs-body-font-family:var(--bs-font-sans-serif);
 --bs-body-font-size:1rem;
 --bs-body-font-weight:400;
 --bs-body-line-height:1.5;
 --bs-body-color:#212529;
 --bs-body-bg:#fff;
 --bs-border-width:1px;
 --bs-border-style:solid;
 --bs-border-color:#dee2e6;
 --bs-border-color-translucent:rgba(0,0,0,0.175);
 --bs-border-radius:0.375rem;
 --bs-border-radius-sm:0.25rem;
 --bs-border-radius-lg:0.5rem;
 --bs-border-radius-xl:1rem;
 --bs-border-radius-2xl:2rem;
 --bs-border-radius-pill:50rem;
 --bs-link-color:var(--ewcl-0);
 --bs-link-hover-color:var(--ewcl-1);
 --bs-code-color:#d63384;
 --bs-highlight-bg:#fff3cd;
 --bs-border-color-translucent: var(--ewcl-0-transparent);
}

nav{
    background-color: #fff;
}

body{
    font-size: 14px;
    font-family: "Inter", Helvetica, Arial, sans-serif;
    color: var(--bs-gray);
}

.nav-item{
    letter-spacing: 0.08em;    
    padding-inline: 0.5rem;
}
.nav-link{
    color: var(--bs-gray-dark);
}
.nav-link:hover{
    color: var(--ewcl-0);
}

.row{
    --bs-gutter-x: 0;
}
.ewcl-cta{
    border-top: 4px solid var(--ewcl-0-transparent);
}
.ewcl-cta i{
    color: var(--ewcl-0);
}
.ewcl-cta strong{
    text-transform: uppercase;
    letter-spacing: 0.08em;    
    color: var(--bs-gray-dark);
    font-size: 1.2em;
}
.ewcl-cta section{
    padding-top: 0.8rem !important;
}
nav{
    border-bottom: var(--bs-border-width) var(--bs-border-style) var(--ewcl-0-transparent);
}
.navbar-toggler{
    color: var(--ewcl-0-transparent);
}
.navbar {
 --bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28141, 198, 63, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
 --bs-navbar-toggler-border-color:var(--ewcl-0-transparent);
}
#introCarousel{
    background: url('/static/img/background/0.png') left center;
    background-size: cover;
}
#introCarousel .carousel-inner{
    background-color: var(--ewcl-0-transparent-dark);
}
#introCarousel .carousel-item > div{
    height: 400px;
}
#introCarousel img{
    height: 100%;
    width: 100%;
    object-fit: contain;
}
#introCarousel .carousel-item{
    color: #fff;
}
#introCarousel .carousel-item >div>div{
    padding-inline: 6vw;
    padding-block: 2vh;
}
#introCarousel .carousel-text h1{
    padding-top: 2rem;
    text-transform: uppercase;
    letter-spacing: 0.01em;    
    font-size: 2.6em;
    line-height: 0.9em;
    font-weight: 700;
}

#introCarousel .carouselImageContainer{
    height: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
}

#introCarousel .carousel-text p{
    font-size: 1.2rem;
}

@media (max-width: 767px) { 
    
    #introCarousel .carouselImageContainer{
        height: 50vw;
    }
    #introCarousel .carousel-item > div > div {
      padding-inline: 2rem;
      padding-block: 2rem;
    }
    #introCarousel .carousel-text h1{
        padding-top: 0;
        font-size: 2em;
        text-align: center;
    }
    #introCarousel .carousel-text p{
        font-size: 1rem;
    }
    #introCarousel .carousel-item > div{
        height: 500px;
    }
}

.bkg-wallpaper{
    background: url('/static/img/background/wallpaper.png');
    background-attachment: fixed;
    background-repeat: repeat;
    background-size: 401px;
    background-position: center;
}
.card-body{
    color: var(--bs-gray-dark);
}
.card-text hr{
    color: var(--ewcl-0-transparent);
    opacity: 1;
}
.card-title{
    font-weight: 600;
}
.form-control{
    border: 1px solid var(--ewcl-0-transparent);
}
.form-control:focus{
    border-color: var(--ewcl-0);
    outline: 0;
    box-shadow: 0 0 0 .25rem var(--ewcl-0-transparent);
}
.btn-primary {
 --bs-btn-color:#fff;
 --bs-btn-bg:var(--ewcl-0);
 --bs-btn-border-color:var(--ewcl-0);
 --bs-btn-hover-color:#fff;
 --bs-btn-hover-bg:var(--ewcl-4);
 --bs-btn-hover-border-color:var(--ewcl-4);
 --bs-btn-focus-shadow-rgb:49,132,253;
 --bs-btn-active-color:#fff;
 --bs-btn-active-bg:var(--ewcl-0-transparent);
 --bs-btn-active-border-color:var(--ewcl-0-transparent);
 --bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);
 --bs-btn-disabled-color:#fff;
 --bs-btn-disabled-bg:var(--ewcl-0);
 --bs-btn-disabled-border-color:var(--ewcl-0)
}

.ewcl-doonaWash{
  color: #fff;
  background: url('/static/img/background/2.png') center top no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
.ewcl-doonaWash >div{
    background-color: rgba(0, 0, 0, 0.508);
}
.ewcl-doonaWash p{
   margin-bottom: 0;
   text-align: left;
}
.ewcl-doonaWash h3{
    text-transform: uppercase;
    letter-spacing: 0.01em;    
    font-size: 1.8em;
    line-height: 0.9em;
    font-weight: 700;
}

.ewcl-washerSection{
  color: #333333;
  background: #d1e891;
}
.ewcl-washerSection p strong{
    font-size: 1.2em;
}
.ewcl-washerSection p{
   margin-bottom: 0;
   text-align: left;
}
.ewcl-washerSection h3{
    text-transform: uppercase;
    letter-spacing: 0.01em;    
    font-size: 1.8em;
    line-height: 0.9em;
    font-weight: 700;
}
.washContainer {
  background-color: #fff;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 1.5fr 0.5fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "washerInfo"
    "tempPrices";
}

.tempPrices {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 0.9fr 1.1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "coldLabel warmLabel hotLabel"
    "coldPrice warmPrice hotPrice";
  grid-area: tempPrices;
}

.coldLabel {
  grid-area: coldLabel;
}

.coldPrice {
  grid-area: coldPrice;
}

.warmLabel {
  grid-area: warmLabel;
}

.warmPrice {
  grid-area: warmPrice;
}

.hotLabel {
  grid-area: hotLabel;
}

.hotPrice {
  grid-area: hotPrice;
}

.washerInfo {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 0.7fr 1fr 1.3fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "washerName"
    "washerCapacity"
    "washerDescription";
  grid-area: washerInfo;
}

.washerName {
  grid-area: washerName;
}

.washerCapacity {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1.4fr 0.6fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "washerCapacityImage"
    "washerCapacityDescription";
  grid-area: washerCapacity;
}

.washerCapacityImage {
  grid-area: washerCapacityImage;
}

.washerCapacityDescription {
  grid-area: washerCapacityDescription;
}

.washerDescription {
  grid-area: washerDescription;
}
.coldwashContainer {
  grid-area: 1 / 1 / 3 / 2;
}

.priceSeparators {
  grid-area: 1 / 2 / 3 / 3;
}

.hotwashContainer {
  grid-area: 1 / 3 / 3 / 4;
}

.washContainer * p {
  text-align: center;
  width: 100%;
  height: 100%;
  margin: 0;
  display: grid;
  align-items: center;
  justify-content: center;
}

.washContainer {
  border: 4px solid #fff;
  border-radius: 10px;
  width: 300px;
  height: 280px;
}

.washerCapacityImage {
  background-origin: border-box;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 70%;
}

.washerName p {
  font-weight: bold;
  font-size: 1.3em;
}

.washerCapacityDescription p {
  font-weight: 200;
  font-size: 0.8em;
  color: #686C73;
}

.washerDescription p {
  font-weight: 200;
  font-size: 0.9em;
  color: #000;
}

.coldLabel,
.warmLabel,
.hotLabel {
  font-weight: bold;
}

.coldLabel,
.warmLabel,
.hotLabel,
.coldPrice,
.warmPrice,
.hotPrice {
  margin: 0;
}

.coldLabel {
  color: #7287D1;
}

.warmLabel {
  color: #EDAB00;
}

.hotLabel {
  color: #E97878;
}

.washerDescription {
  margin-inline: 5px;
  padding-inline: 5px;
}
.priceSeparators{
  transform: scaleY(0.8);
  border-left: 1px solid #686C73;
  border-right: 1px solid #686C73;
}
.ewclWashers{
    display: grid;
      grid-auto-flow: column dense;
      gap: 10px;
      overflow: scroll;
      justify-items: center;
}

.dryerPriceLabel { grid-area: 1 / 1 / 2 / 4; }
.dryerPriceAmount { grid-area: 2 / 1 / 3 / 4; }

.coldLabel,
.warmLabel,
.hotLabel,
.dryerPriceLabel {
  font-weight: bold;
}

.coldLabel,
.warmLabel,
.hotLabel,
.coldPrice,
.warmPrice,
.hotPrice,
.dryerPriceLabel,
.dryerPriceAmount {
  margin: 0;
}

.dryerPriceAmount {
  font-size: 1.5em;
  transform: translateY(-2.5px);
}
.ewcl-dryers{
  background: url('/static/img/background/5.png') center center no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
.ewcl-dryers >div{
    background-color: rgba(141, 198, 63, 0.9);
}
.dryerCapacityImage {
  background-size: contain;
  margin-inline: 10px;
}
.dryContainer{
    width: 45vw;
}

.ewclDryerContainerNoFlex{
    max-width: unset;
}
.dryerDescription p{
    font-size: calc(0.3vw + 0.8em);
}

footer{
  background: #555555;
}
footer p{
  color: #929292;
}
footer h4{
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.google_map {
  height: 300px;
}

.ewcl-header p{
   margin-bottom: 0;
   text-align: left;
   color: var(--bs-gray-dark);
}
.ewcl-header h3{
  color: var(--bs-gray-dark);
  text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.01em;    
    font-size: 1.8em;
    line-height: 0.9em;
    font-weight: 700;
}

.accordion {
 --bs-accordion-border-color:var(--ewcl-0-transparent);
 --bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
 --bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%238cc53f'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
 --bs-accordion-btn-focus-border-color:var(--ewcl-0-transparent);
 --bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem var(--ewcl-0-transparent);
 --bs-accordion-active-color:#000;
 --bs-accordion-active-bg:#f3fde7
}