

h1{
    font-family: "Montserrat", sans-serif;
    font-weight: 600 !important;
    font-size: 45px !important;
}
h2{
    font-family: "Montserrat", sans-serif;
    font-weight: 600 !important;
    font-size: 40px !important;
}
h3{
    font-family: "Montserrat", sans-serif;
    font-weight: 600 !important;
    font-size: 35px !important;
}
h4{
    font-family: "Montserrat", sans-serif;
    font-weight: 600 !important;
    font-size: 30px !important;
}
h5{
    font-family: "Montserrat", sans-serif;
    font-weight: 600 !important;
    font-size: 25px !important;
}
h6{
    font-family: "Montserrat", sans-serif;
    font-weight: 600 !important;
    font-size: 20px !important;
}
p{
    font-family: "Montserrat", sans-serif;
    font-weight: 400 !important;
    font-size: 15px;
}
@keyframes gradientBG {
      0%   { background-position: 0% 50%; }
      50%  { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }
.bg-gr{
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    /* background: linear-gradient(-45deg, #ff6b6b, #feca57, #48dbfb, #5f27cd); */
    animation: gradientBG 10s ease infinite;
    background-size: 300% 300%
}
.container{
    width: 100%;
    max-width: 1200px !important;
    margin: 0 auto;
}
.inner{
    font-family: "Montserrat", sans-serif;
}
.top-bar{
    display: flex;
    justify-content: space-between;
    color: #ffffff;
    padding: 5px 0;
}
ul.top-bar-contect{
    display: flex;
    padding: 0;
    list-style: none;
    gap: 40px;
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 15px;
}
ul.top-bar-contect li i{
    font-size: 14px;
    color: #ffffff70;
    margin-right: 10px;
}
.container-fluid{
    padding-left: 0;
    padding-right: 0;
}
.nav-item{
    font-weight: 500;
}
.nav-link{
    color: #000000 !important;
    margin: 0 10px;
}
.nav-link:hover{
    /* background: linear-gradient(90deg, #ff6b6b,#feca57,#48dbfb,#5f27cd); */
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    background-size: 600% 600%;
    animation: gradientText 15s ease infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.txt-gdt {
    /* background: linear-gradient(90deg, #ff6b6b,#feca57,#48dbfb,#5f27cd); */
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    background-size: 600% 600%;
    animation: gradientText 5s ease infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
    @keyframes gradientText {
      0%   { background-position: 0% 50%; }
      50%  { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }
.button-primary{
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    /* background: linear-gradient(-45deg, #ff6b6b, #feca57, #48dbfb, #5f27cd); */
    animation: gradientBG 15s ease infinite;
    background-size: 200% 200%;
    border: none;
    border-radius: 10px;
    padding: 10px 20px;
    color: #ffffff;
    font-weight: 500;
}
.bdr{
    border: solid 1px #ffffff;
}
.bgi{
    background-image: url(Images/hero-image.png);
    background-position: center;
    background-size: cover
}
.slider-heading{
    text-align: center;
    color: #ffffff;
    padding: 50px 200px;
}
.slider-heading h1{
    font-family: "Squada One", sans-serif;
    text-transform: uppercase;
    text-transform: uppercase;
    font-size: 60px;
    text-shadow: 0px 8px 10px #0000004a;
}
.hero-cont{
    background-color: #00000050;
    padding: 20px;
    backdrop-filter: blur(5px);
    border-radius: 10px;
    color: #ffffff;
    height: 100%;
    
}
.button-secondery{
    background-color: #00000010;
    border: solid 1px #ffffff;
    padding: 7px 15px;
    border-radius: 10px;
    color: #ffffff;
    font-weight: 500;
    transition: .5s;
}
.button-secondery:hover{
    background-color: #ffffff;
    color: #000000;

}
ul.hero-cta{
    padding: 0;
    list-style: none;
    display: flex;
    gap: 20px;
    margin: 0;
}
ul.hero-cta li img{
    width: 100%;
}
ul.hero-cta li:first-child{
    width: 90%;
}
.hero-cont-icon{
    width: 60px;
    height: 60px;
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 10px;
}
.instalation{
    padding: 25px;
    border-radius: 10px;
    height: 100%;
}
.hero-last-icon{
    background-color: #ffffff;
    border-radius: 10px;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: flex-end;
    margin-left: auto;
    padding: 10px;
}
.hero-last-container{
    padding: 20px 0;
    color: #ffffff;
}


.outer-bg{
    background-image: url(Images/image\ 9.png);
    background-position: center;
    background-size: cover;
    /* opacity: .5; */
}
.bg3{
    background: linear-gradient(#6dde4470, #6dde4400)
}
.psp-outer{
    padding: 2px;
    border-radius: 10px;
    box-shadow: 0px 10px 20px #00000050;

}
.psp-inner{
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    background-color: #ededed;
}
.psp-image img{
    width: 100%;
    border-radius: 10px;
    border: solid 2px #ffffff;
    margin-top: 20px;
}
.automation{
    padding: 20px;
    color: #ffffff;
    text-align: center;
    border-radius: 10px;
}
.automation i{
    font-size: 40px;
    margin-bottom: 20px;
}
.google-rating{
    display: flex;
    align-items: center;
}
.g-logo{
    padding: 10px;
    background-color: #ffffff;
    border-radius: 50%;
    z-index: 99;
}
.g-logo img{
    width: 80px;
}
.g-rating{
    background: #ffffff;
    padding: 10px 30px;
    display: inline-block;
    margin-left: -20px;
    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;
}
.g-rating h6{
    line-height: 24px;
    margin: 0;
    font-weight: 500 !important;
}
.monitoring{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}
.monitoring-icon{
    padding: 5px;
    border-radius: 50%;
}
.monitoring-icon img{
    width: 30px;
}
.monitoring h5{
    margin: 0;
}
.industrial{
    padding: 20px;
    border-radius: 20px;
    color: #ffffff;
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
}
.industrial-right-icon{
    background-color: #ffffff;
    color: #44952b;
    font-size: 20px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.pannl-circle{
    width: 300px;
    height: 300px;
    background-color: #6DDE44;
    border: solid 4px #ffffff;
    box-shadow: 1px 20px 20px 0px #00000030;
    border-radius: 50%;
    position: absolute;
    right: 50px;
    top: -170%;
    background-image: url(https://gb.solar/wp-content/uploads/2024/12/Harnessing-the-Sun_-How-Solar-Energy-is-Revolutionizing-Sustainable-Living.jpg);
    background-size: cover;
    background-position: center;
}
.user-number-image{
    background-image: url(https://img.freepik.com/premium-photo/happy-family-near-solar-panels-alternative-energy-source_255667-70096.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 10px;
    height: 100%;
    min-height: 300px;
}
.user-number-content h1{
    margin-bottom: 20px;
}
.user-number-content h6{
    margin-bottom: 20px;
}
.user-number-unit{
    background-color: #ededed;
    padding: 20px;
    border: solid 1px #44952b;
    display: inline-block;
    border-radius: 10px;
}
ul.user-number{
    list-style: none;
    padding: 0;
    display: flex;
    gap: 30px;
    margin: 0;
}
.user-number-inner h6{
    margin-bottom: 0;
}
.bg-lgt-grd{
    background: linear-gradient(#f2f2f2, #ffffff);
}
ul.service-cta{
    display: flex;
    list-style: none;
    padding: 0;
    gap: 20px;
    justify-content: space-between;
}
ul.service-cta li{
    width: 100%;
    background-color: #ffffff;
    padding: 20px;
    border: solid 1px #ededed;
    border-radius: 10px;
    transition: .3s;
}
ul.service-cta li:hover{
    border-color: #44952b;
    /* box-shadow: 0 0 20px #ededed; */
    background-color: #fafdf9;
}
.service-cta-photo img{
    width: 100%;
    margin-bottom: 25px;
}
ul.work-process{
    display: flex;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    gap: 20px;
}
ul.work-process li{
    background-color: #ffffff;
    padding: 20px;
    border: solid 1px #44952b;
    width: 100%;
}
.step-number{
    font-size: 60px;
    font-weight: 700;
    color: #ffffff;
    -webkit-text-stroke: 1px #44952b;
}
.separator{
    width: 50px;
    height: 3px;
    border-radius: 10px;
}
.tm-card{
    display: flex;
    gap: 10px;
    width: 400px;
    padding: 10px;
    border-radius: 10px;
    border: solid 1px #ededed;
    background-color: #ffffff;
}
.slide-container{
    overflow: hidden;
}
.slick-slider{
    display: flex;
    gap: 20px;
    width: 2000px;
}
ul.slider-card{
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 20px;
}
ul.slider-card li{
    background-color: #ffffff00;
  backdrop-filter: blur(3px);
    border: solid 1px #00000020;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    gap: 20px;
    width: 100%;
}
.profile img{
    width: 50px;
    border-radius: 50%;
    border: solid 1px #ededed;
}
.testimonial-quots i{
    font-size: 50px;
}
.profile{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.bg-map{
    background-image: url(Images/image\ 19\ \(1\).png);
    background-position: center;
    background-size: cover;
}
.bg-lt{
    background-color: #fafafa;
}
.bg-black{
    background-color: #000000;
}
.footer-logo p{
    color: #ffffff;
}
ul.social-icons{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 10px;
}
ul.social-icons li{
    background-color: #ffffff20;
    color: #ffffff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .3s;
}
ul.social-icons li a{
    color: #ffffff;
}
ul.social-icons li:hover{
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    background-size: 600% 600%;
    animation: gradientText 5s ease infinite;
    color: #000000;
    /* -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; */
  
}
.footer-devider{
    width: 100px;
    height: 3px;
    border-radius: 10px;
    margin-bottom: 30px;
}
.compamy-info h5{
    color: #ffffff;
}
.compamy-info ul{
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
}
.compamy-info ul li{
    margin-bottom: 10px;
}
.compamy-info ul li a{
    color: #ffffff;
    text-decoration: none;
}
.compamy-info ul li a:hover{
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    background-size: 600% 600%;
    animation: gradientText 5s ease infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.compamy-info ul li::before{
    content: "⬤";
    width: 10px;
    height: 10px;
    /* color: #6DDE44; */
    font-size: 10px;
    margin-right: 10px;
    background: linear-gradient(90deg, #44952b, #6DDE44, #44952b);
    background-size: 600% 600%;
    animation: gradientText 5s ease infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.footer-gallery h5{
    color: #ffffff;
}
.footer-gallery ul{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    /* justify-content: space-between; */
    flex-wrap: wrap;
    gap: 10px;
}
.footer-gallery ul li a img{
    width: 100%;
    transition: .2s;
}
.footer-gallery ul li a img:hover{
    scale: 1.1;
}
.footer-gallery ul li{
    width: 30%;
}
.bg-gr-gr{
    background: linear-gradient(#44952b20, #ffffff00);
}
.hero-banner-offering{
    background-image: url(Images/offeringHero.png);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
    overflow: hidden;
}
.hero-banner-offering-inner{
    padding: 50px;
    background-color: #000000bd;
    text-align: center;
}
.hero-top h1{
    color: #ffffff;
    margin-bottom: 30px;
}
.hero-top p{
    color: #ffffff;
    margin-bottom: 30px;
}
.button-stylish{
    color: #000000;
    display: inline-flex;
    gap: 10px;
    background-color: #fff;
    padding: 3px 3px 3px 20px;
    border-radius: 50px;
    font-weight: 600;
    align-items: center;
    transition: .3s;
    text-decoration: none;
    /* box-shadow: 0px 0px 20px #0000000d; */
    border: solid 1px #ededed;
}
.button-stylish:hover{
    background-color: #d9d9d9;
    color: #000000;
}
.go-next{
    border-radius: 50px;
    width: 40px;
    height: 40px;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.hero-users{
    display: flex;
    justify-content: space-between;
    color: #ffffff;
    align-items: flex-end;
}
.hero-users-inner{
    background-color: #ffffffba;
    padding: 10px;
    border-radius: 10px;
    border: solid 1px #ffffff20;
    display: inline-flex;
    align-items: center;
    gap: 30px;
}
.hero-users-inner ul{
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}
.hero-users-inner ul li{
    width: 40px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: -10px;
    border: solid 1.5px #ffffff;
}
.hero-users-inner ul li img{
    width: 100%;
}
.user-count{
    color: #000000;
    text-align: left;
}
.user-count p{
    margin-bottom: 0;
}
.elec-chart{
    max-width: 1000px;
    margin: 0 auto;
}
.elec-chart img{
    width: 100%;
}
.Service-image-right img{
    width: 100%;
    border-radius: 20px;
}
.service-content h2{
    font-weight: 700 !important;
    margin-bottom: 30px;
}
.bg-lgt{
    background-color: #f2f2f2;
}
.Shading-cells img{
    width: 100%;
    border-radius: 20px;
}
.features{

}
ul.featureStrip{
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px;
    display: flex;
    flex-direction: column;
}
ul.featureStrip li{
    background-color: #f2f2f2;
    border-radius: 5px;
    border: solid 1px #00000005;
    display: flex;
    padding: 5px;
    gap: 15px;
    align-items: center;
}
ul.featureStrip li p{
    margin-bottom: 0;
}
.featureBadge{
    font-size: 20px;
    color: #ffffff;
    font-weight: 700;
    line-height: normal;
    border-radius: 5px;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;

}
.solarFeatureImage{
    width: 100%;
    height: 100%;
    min-height: 200px;
    background-image: url(https://www.iraq-businessnews.com/wp-content/uploads/2022/07/xsolar-panels-3-Pixabay.jpg.pagespeed.ic.QBht0pcTfV.jpg);
    background-position: center;
    background-size: cover;
    border-radius: 20px;
}
.cellCutting-card{
    background-color: #f2f2f2;
    border: solid 1px #00000010;
    border-radius: 10px;
    overflow: hidden;
}
.cellCutting-card img{
    width: 100%;
}
.cutting-info{
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
}
.cutting-info p{
    margin-bottom: 0;
}
.cutting-info i{
    font-size: 20px;
}
.in-touch{
    background: linear-gradient(#ededed, #ffffff);
    outline: solid 1px #00000010;
    border-radius: 10px;
    padding: 30px;
}
.bg-5{
    background: linear-gradient(to bottom, #ffffff 50%, #44952b 50%);
}
.quot-contect{
    background-color: #ededed;
    padding: 10px 20px; 
    margin-bottom: 10px;
    border-radius: 20px;
}
.quot-contect p{
    margin: 0;
}
.quot-contect h6{
    margin: 0;
}
.in-touchimage{
    height: 250px;
    background-image: url('./Images/Group162.png');
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    background-position: center;
    background-size: cover;
    margin-bottom: 20px;
}
.qout-form-outer{
    background-color: #edf5ea;
    padding: 30px;
    border: solid 1px #44952b;
    border-radius: 20px;
    min-height: 100%;
}
ul.qout-form{
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
}
ul.qout-form li{
    width: 48%;
}
.quot-input{
    width: 100%;
    padding: 10px 15px;
    font-size: 14px;
    border-radius: 10px;
    border: solid 1px #44952b;
}
.quot-input:focus-visible{
    outline: none;
    outline: solid 5px #44952b40;
}
.form-select{
    padding: 10px 15px !important;
    font-size: 14px !important;
    border-radius: 10px !important;
    border: solid 1px #44952b !important;
}
.form-select:focus{
    outline: none;
    outline: solid 5px #44952b40 !important;
    box-shadow: none !important;
}
.textarea-input{
    width: 100%;
    padding: 10px 15px;
    font-size: 14px;
    border-radius: 10px;
    border: solid 1px #44952b;
    color: #00000094;
    margin-top: 20px;
    height: 200px;
}
.textarea-input:focus-visible{
    outline: solid 5px #44952b40;
}
.check-box{
    padding-top: 20px;
}
.form-check-input:checked{
    background-color: #44952b !important;
    border-color: #44952b !important;
}
.form-check-input:focus{
    border-color: #44952b;
    outline: solid 5px #44952b40 !important;
    box-shadow: none !important;
}
.check-box label{
    font-size: 15px;
    font-weight: 500;
}
.form-check{
    margin-bottom: 15px !important;
}
