h1,h2,h3,h4,h5,h6{text-transform:uppercase;}
.mp0 {margin:0px !important;padding:0px !important;}
.m0 {margin:0px !important;}
.mt0 {margin-top:0px !important;}
.mt2 {margin-top:2px !important;}
.mt3 {margin-top:3px !important;}
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt25 {margin-top:25px !important;}
.mt30 {margin-top:30px !important;}
.mt40 {margin-top:40px !important;}
.mt50 {margin-top:50px !important;}
.mt60 {margin-top:60px !important;}
.mt70 {margin-top:70px !important;}
.mt80 {margin-top:80px !important;}
.mt90 {margin-top:90px !important;}
.mt100 {margin-top:100px !important;}
.mt110 {margin-top:110px !important;}
.mt120 {margin-top:120px !important;}
.mt130 {margin-top:130px !important;}
.mt140 {margin-top:140px !important;}
.mt150 {margin-top:150px !important;}
.mb0 {margin-bottom:0px !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}
.p0 {padding:0px !important;}
.p5 {padding:5px !important;}
.p10 {padding:15px !important;}
.p15 {padding:15px !important;}
.p20 {padding:20px !important;}
.p25 {padding:25px !important;}
.p30 {padding:30px !important;}
.pt0 {padding-top:0px !important;}
.pb0 {padding-bottom:0px !important;}
.pl0 {padding-left:0px !important;}
.pr0 {padding-right:0px !important;}
.text14 {font-size:14px !important;}
.text16 {font-size:16px !important;}
.text18 {font-size:18px !important;}
.text20 {font-size:20px !important;}
.text22 {font-size:22px !important;}
.text24 {font-size:24px !important;}
.text26 {font-size:26px !important;}
.text28 {font-size:28px !important;}
.text30 {font-size:30px !important;}
.width98 {width:98% !important;}
.width96 {width:96% !important;}
.width94 {width:94% !important;}
.width92 {width:92% !important;}
.width100 {width:100% !important;}
.productPart{background:url(../images/home-product-bg.webp) #f0f3f9 no-repeat left bottom;background-size:37%;}
.bulleList{margin:0px;padding:0px;list-style:none;}
.bulleList li{padding-bottom:5px;font-weight:600;}

/*.bulleList li:before{padding-right:10px;content:"\f046";font-family:'FontAwesome';color:#246af4;font-weight:300;}*/
.bulleList li:before{margin-right:10px;content:'';background-image:url(../images/list-bullet.webp);width:15px;height:15px;background-size:100%;display:inline-block;background-repeat:no-repeat;vertical-align:middle;}


.service_box .image_box{position:relative;transition:all 1s ease-in-out;}
.service_box .image_box .tagLine{position:absolute;color:#fff;bottom:30%;opacity:0;transition:all 1s ease-in-out;font-size:18px;}
.service_box:hover .image_box .tagLine{opacity:1;transition:all 1s ease-in-out;text-align:center;display:block;width:100%;}
.modal-content{border-radius:0.5rem;border:2px solid #000;box-shadow:0px 16px 24px #000000;}
.modal .modal-body{padding:25px 25px 80px 25px;background:url('../images/modal-bg.jpg') no-repeat center bottom;background-size:100%;position:relative;border-radius:0.3rem;}
.modal .modal-body::before{content:'';background:url('../images/fittings.webp') no-repeat left bottom;background-size:100%;position:absolute;left:-30px;bottom:0;width:94px;height:110px;}
.table-hover>tbody>tr:hover>*{transition:all .5s ease-in-out;background:#cddeff;}

.distributor-sec h4 {font-size: 18px !important;line-height: 50px;font-weight: 500;}
.whatsappBx {bottom: 75px;left: 15px;z-index: 9;opacity: 1;position: fixed;background: #fff;width: 45px;height: 45px;text-align: center;line-height: 44px;border-radius: 100%;}
.listBx {margin-top:20px;padding-left:30px;}
.listBx li {list-style:square;margin-bottom:12px;font-size: 15px;line-height: 26px;text-align:justify;}
.listBx li b {font-weight: 500 !important;color: #444444;}
.imgBx img {width: 100%;height: 100%;object-fit: cover;border-radius:5px;margin-bottom:20px;}


.aboutPageBx{}
.aboutPageBx .left{position:relative;text-align:right;}
.aboutPageBx .left img.dDv{position:absolute;right:-34%;bottom:0;}
.aboutPageBx .left img.dSv{display:none;}
.aboutPageBx .left .textBx{padding-top:40px;}
.aboutPageBx .center{padding:70px;background:url(../images/about-circel.png) no-repeat center center;background-size:320px;text-align:center;max-height:320px;}
.aboutPageBx .center h2{padding-top:50px;padding-bottom:60px;font-size:28px;}
.aboutPageBx .right{position:relative;}
.aboutPageBx .right img.dDv{position:absolute;left:-31%;}
.aboutPageBx .right img.dSv{display:none;}
.aboutPageBx .right .textBx{padding-top:110px;}
.aboutPageBx .left .textBx h4,.aboutPageBx .right .textBx h4{padding-bottom:9px;}


@media screen and (max-width:767px) {
  .modal .modal-body{padding-bottom:40px;}
  .image_boxes.style_two .authour_quotes{display:none;}
  .aboutPageBx .left{text-align:center;}
  .aboutPageBx .center{background-size:290px;}
  .aboutPageBx .center h2{padding-top:35px;padding-bottom:35px;font-size:24px;}
  .aboutPageBx .left img.dDv,.aboutPageBx .right img.dDv{display:none;}
  .aboutPageBx .left img.dSv{margin:0 auto -35px;display:block;}
  .aboutPageBx .right img.dSv{margin:-35px auto 15px;display:block;}
  .aboutPageBx .right .textBx{padding-top:0px;text-align:center;}
  .aboutPageBx br{display:block;}
}

/********* animation css style work start *********/
@media screen and (max-width:650px) {
  .scroll-container,.scroll-container:nth-of-type(2n){flex-direction:column;align-content:inherit}
  .scroll-element{height:100%}
  .scroll-caption,.scroll-element{width:100%}
}
.js-scroll{opacity:0;transition:opacity .5s}
.js-scroll.scrolled{opacity:1}
.scrolled.fade-in{animation:1s ease-in-out both fade-in}
.scrolled.fade-in-top{animation:1s ease-in-out both fade-in-top}
.scrolled.fade-in-bottom{animation:1s ease-in-out both fade-in-bottom}
.scrolled.slide-left{animation:1s ease-in-out both slide-in-left}
.scrolled.slide-right{animation:1s ease-in-out both slide-in-right}

@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/********* animation css style work end *********/

/* home page after banner 3 about box {services} design start here */
ul.ul-cards>li,ul.ul-cards>li>.icon{background-color:var(--bg-color);display:grid}ul.ul-cards{width:100%;margin-inline:auto;display:flex;flex-wrap:wrap;gap:2rem;list-style:none;justify-content:center}ul.ul-cards>li{--bg-color:#F2F2F2;--text-color:#333;--padding:1rem;--circle-size:7rem;--circle-expand:1rem;--flap-height:1.25rem;--flap-offset:0.5rem;max-width:22rem;margin-top:calc(var(--circle-size)/ 2 + var(--circle-expand));margin-bottom:var(--flap-offset);background-image:linear-gradient(to bottom left,transparent 50%,rgba(0 0 0 / .125));border-radius:var(--padding);padding:var(--padding);--bs-rim:inset -0.1rem 0.1rem 0.1rem rgb(255 255 255 / .5);--bs-card-spread:0.25rem;--bs-card-color:rgb(0 0 0 / 0.02);--bs-card:-0.1rem 0.1rem var(--bs-card-spread) var(--bs-card-color),-0.2rem 0.2rem var(--bs-card-spread) var(--bs-card-color),-0.3rem 0.3rem var(--bs-card-spread) var(--bs-card-color),-0.4rem 0.4rem var(--bs-card-spread) var(--bs-card-color),-0.5rem 0.5rem var(--bs-card-spread) var(--bs-card-color),-0.6rem 0.6rem var(--bs-card-spread) var(--bs-card-color),-0.7rem 0.7rem var(--bs-card-spread) var(--bs-card-color),-0.8rem 0.8rem var(--bs-card-spread) var(--bs-card-color),-0.9rem 0.9rem var(--bs-card-spread) var(--bs-card-color),-1.0rem 1.0rem var(--bs-card-spread) var(--bs-card-color),-1.1rem 1.1rem var(--bs-card-spread) var(--bs-card-color),-1.2rem 1.2rem var(--bs-card-spread) var(--bs-card-color),-1.3rem 1.3rem var(--bs-card-spread) var(--bs-card-color),-1.4rem 1.4rem var(--bs-card-spread) var(--bs-card-color),-1.5rem 1.5rem var(--bs-card-spread) var(--bs-card-color),-1.6rem 1.6rem var(--bs-card-spread) var(--bs-card-color),-1.7rem 1.7rem var(--bs-card-spread) var(--bs-card-color),-1.8rem 1.8rem var(--bs-card-spread) var(--bs-card-color),-1.9rem 1.9rem var(--bs-card-spread) var(--bs-card-color);box-shadow:var(--bs-rim),var(--bs-card);grid-template-rows:max-content max-content auto;justify-items:center;text-align:center;gap:.75rem;position:relative}ul.ul-cards>li>.icon{width:var(--circle-size);margin-top:calc(var(--circle-size)/ -2 - var(--padding));aspect-ratio:1;justify-self:center;border-radius:50%;place-items:center;box-shadow:var(--bs-rim),-.1rem .1rem .25rem rgb(0 0 0 / .25)}ul.ul-cards>li>.icon>i{font-size:calc(var(--circle-size) / 3);color:var(--accent-color)}ul.ul-cards>li>.title{margin-top:.5rem;color:var(--accent-color);font-weight:600}ul.ul-cards>li>.content{font-size:16px;margin-bottom:1rem;color:var(--text-color)}ul.ul-cards>li::before,ul>li::after{content:"";position:absolute}ul.ul-cards>li::before{top:calc(var(--circle-size)/ -2 - var(--circle-expand));width:calc(var(--circle-size) * 1 + var(--circle-expand) * 2);height:calc(100% + var(--circle-size)/ 2 + var(--padding) + var(--flap-offset));background-color:var(--accent-color);background-image:linear-gradient(transparent 50%,rgb(0 0 0 / .25) 0);border-top-left-radius:calc(var(--circle-size)/ 2 + var(--circle-expand));border-top-right-radius:calc(var(--circle-size)/ 2 + var(--circle-expand));clip-path:polygon(0 0,100% 0,100% calc(100% - var(--flap-offset)),calc(100% - var(--flap-offset)) 100%,var(--flap-offset) 100%,0 calc(100% - var(--flap-offset)));z-index:-1}ul.ul-cards>li .moreBtn{width:calc(var(--circle-size) * 1 + var(--circle-expand) * 2 - var(--flap-offset) * 2);height:var(--flap-height);bottom:calc(var(--flap-offset) * -1);border-top-left-radius:var(--flap-height);border-top-right-radius:var(--flap-height);background-color:var(--accent-color);position:absolute;left:0;right:0;margin:0 auto;color:#fff;height:30px;line-height:30px;font-weight:600}
/* home page after banner 3 about box {services} design end here */