/* @import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100;200;300;400;500;600;700&display=swap'); */

:root {
    --most-prime-color: #6db84e;
    --primary-color   : #048a1b;
    --secondary-color : #212121;
    --light           : #edf0ee;
    --light-gray      : #e4ece9;
    --facebook        : #4267B2;
    --twitter         : #00acee;
    --linkedin        : #0e76a8;
    --youtube         : #FF0000;
    --whatsapp        : #25D366;
    --instagram       : #c92bb7;

    --imgf : {
            {
            url('../img/footer-img.png')
        }
    }

    ;
}



.mission-img{
    width: 25vw;
    margin : auto auto;
}

.vision-img{
    width: 23vw;
    margin : auto auto;
}

.circle-img{
    width: 60vw;
}
.bg-of-text-center-in-img{
    position: relative;
    text-align: center;
    color: white;
}
.text-center-in-img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-54%, -50%);
}
.about-img{
    width:100vw;
    height:30vw;
}
.phi-img{
    width:100vw;
    height:40vw;
}
.page-2-img{
    width:100vw;
    height:50vw;
}

.about-pro-img{
    width:80%;
    margin: 5vw auto;
}



body {
    color     : var(--secondary-color);
    font      : 400 18px "Josefin Sans", sans-serif;
    overflow-x: hidden;
}

.table td,
.table th {
    padding: 1.25rem 1rem 1rem;
}

ul {
    padding-left : 0;
    margin-bottom: 0;
}

a,
a:hover {
    text-decoration: none;
}

.btn.disabled,
.btn:disabled {
    padding    : 1.25rem 10px 1rem;
    border     : none;
    line-height: normal;
}

img,
video,
iframe {
    width  : 100%;
    display: block;
}

.object-cover {
    object-fit: cover;
}

.container-fluid {
    padding-left : 2rem;
    padding-right: 2rem;
}

.filter-white {
    -ms-filter: brightness(70);
    filter    : brightness(70);
}

.filter-dark {
    -ms-filter: grayscale(1) brightness(0.5);
    filter    : grayscale(1) brightness(0.5);
}

.gap-row {
    row-gap: 30px;
}

.gap-form-row {
    row-gap: 10px;
}

/*header*/

.header {
    width           : 90%;
    position        : fixed;
    left            : 5%;
    top             : 0;
    padding         : 1.3rem 0rem;
    text-transform  : uppercase;
    /* border-bottom: 1px solid rgb(255 255 255 / 15%); */
    display         : flex;
    justify-content : space-between;
    align-items     : center;
    z-index         : 999;
    transition      : all 200ms ease-in-out;
}

.header.fixed {
    width           : 100%;
    left            : 0;
    padding         : 15px 20px;
    background-color: rgb(8, 8, 8);
}

.header.menufixed {
    padding         : 0;
    background-color: transparent;
}

.header.fixed.menufixed {
    padding: 5px 20px;
}

.logo {
    width          : 140px;
    position       : relative;
    min-height     : 1px;
    transition     : all 300ms ease-in-out;
    display        : flex;
    align-items    : center;
    justify-content: center;
}

.logo a {
    position: relative;
    z-index : 1;
    padding : 0 10px;
}

.logo a::before {
    content         : '';
    position        : absolute;
    inset           : -2rem 0;
    background-color: #fff;
    clip-path       : polygon(0 0, 100% 0, 100% 88%, 50% 100%, 0 88%);
    z-index         : -1;
    transition      : inset 300ms ease-in-out;
}

.header.fixed .logo a::before {
    inset: -1rem 0;
}

.logo img {
    transition: all 300ms ease-in-out;
}

.header.fixed .logo {
    width: 90px;
}

.topSideMenu {
    display        : flex;
    align-items    : center;
    justify-content: flex-end;
    gap            : 0 10px;
}

.topSideMenu li {
    line-height : .5;
    padding-left: 10px;
    border-left : 1px solid rgb(255 255 255 / 55%);
}

.topSideMenu li:first-of-type {
    padding-left: 0;
    border-left : none;
}

.topSideMenu li a {
    font-size : 13px;
    color     : rgb(243, 243, 235);
    transition: all 300ms ease-in-out;
}

.topSideMenu li a:hover {
    text-decoration: underline;
    color          : #fff;
}

/* .header.fixed .logo img{
  padding: 0 10px;
} */

.menuBtn {
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 10px;
    font-size      : 14px;
    transition     : all 300ms ease-in-out;
    position       : relative;
    cursor         : pointer;
    color          : rgb(253, 253, 253);
    overflow       : hidden;
}

.menuBtn .menuText {
    margin-top: 3px;
}

.menuBtn .menuText span {
    display   : block;
    transition: all 300ms ease-in-out;
}

.menuBtn .menuText::after {
    content   : attr(data-menutext);
    display   : table;
    position  : absolute;
    top       : 100%;
    left      : 0;
    transition: all 300ms ease-in-out;
}

.menuBtn.closeMenuBtn .menuText span {
    transform: translateY(-100%);
}

.menuBtn.closeMenuBtn .menuText::after {
    top: 2px;
}

.menuBtn .menuLine {
    display       : flex;
    flex-direction: column;
    gap           : 5px;
    position      : relative;
    width         : 20px;
    transition    : all 0.6s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.menuBtn:hover {
    color: rgb(241, 245, 8);
}

.menuBtn .menuLine::before,
.menuBtn .menuLine::after {
    content         : "";
    width           : 100%;
    height          : 2px;
    background      : yellow;
    transform-origin: center center;
    transition      : all 0.6s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.menuBtn:hover .menuLine::before,
.menuBtn:hover .menuLine::after {
    background-color: rgb(255 255 255 / 60%);
}

.menuBtn .menuLine::before {
    width: 100%;
}

.menuBtn .menuLine::after {
    width: 70%;
}

.menuBtn:hover .menuLine::after {
    width: 85%;
}

.menuBtn.closeMenuBtn .menuLine::before {
    -webkit-transform: rotate(45deg) translate(2px, 2px);
    transform        : rotate(45deg) translate(2px, 2px);
}

.menuBtn.closeMenuBtn .menuLine::after {
    width            : 100%;
    -webkit-transform: rotate(-45deg) translate(3px, -3px);
    transform        : rotate(-45deg) translate(3px, -3px);
}

.mbMenuContainer {
    position             : fixed;
    left                 : 0;
    right                : 0;
    top                  : 0;
    bottom               : 0;
    padding-top          : 75px;
    background-color     : #111;
    background           : linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) var(--primary-color);
    background-blend-mode: multiply, multiply;
    z-index              : 99;
    display              : none;
}

.mbMenuContainer .mbMenu {
    color       : #fff;
    position    : relative;
    height      : 100%;
    width       : 100%;
    padding     : 0 2.5rem 2rem;
    margin-right: -1px;
    overflow    : auto;
    display     : flex;
    align-items : center;
}

.mbMenuContainer .mbMenu ul {
    margin: 0;
}

.mbMenuContainer .mbMenu ul li {
    display    : flex;
    align-items: center;
    font-size  : 12px;
    column-gap : 8px;
}

.mbMenuContainer .mbMenu ul li a {
    display   : block;
    color     : #fff;
    padding   : 10px 0;
    transition: all 300ms ease-in-out;
}

.mbMenuContainer .mbMenu ul li.active>a,
.mbMenuContainer .mbMenu ul li:hover>a,
.mbMenuContainer .mbMenu ul li a:focus {
    color: rgb(255 255 255 / 60%);
}

.mbMenuContainer .mbMenu .leftOne ul {
    counter-reset: count;
}

.mbMenuContainer .mbMenu .leftOne ul li {
    display: table;
}

.mbMenuContainer .mbMenu .leftOne ul li a {
    font-size  : 1.5vw;
    font-weight: 300;
    padding    : 8px 0;
    display    : flex;
    align-items: center;
    gap        : 10px;
    position   : relative;
}

.mbMenuContainer .mbMenu .leftOne>.inner>ul>li>a::before {
    content          : '0'counter(count);
    counter-increment: count;
    font-size        : 14px;
    font-weight      : 400;
    margin-right     : 10px;
}

.mbMenuContainer .mbMenu .leftOne ul li a i {
    font-size: 5px;
}

.mbMenuContainer .mbMenu .leftOne ul li a span {
    position: relative;
    padding : 5px 0;
}

.mbMenuContainer .mbMenu .leftOne ul li a span::before {
    content         : '';
    position        : absolute;
    left            : 0;
    bottom          : 0;
    width           : 0;
    height          : 1px;
    background-color: rgb(255 255 255 / 60%);
    transition      : all 300ms ease-in-out;
}

.mbMenuContainer .mbMenu .leftOne ul li:hover>a span::before {
    width: 100%;
}

.mbMenuContainer .mbMenu .leftOne ul li a i {
    transition: all 300ms ease-in-out;
}

.mbMenuContainer .mbMenu ul li.active>a i {
    transform: rotate(180deg);
    color    : #fff;
}

.mbMenuContainer .mbMenu .leftOne ul li .dropdown {
    display: none;
}

.mbMenuContainer .mbMenu .leftOne ul li .dropdown ul {
    padding: 0 0 1rem 2rem;
}

.mbMenuContainer .mbMenu .leftOne ul li .dropdown ul li {
    width: max-content;
}

.mbMenuContainer .mbMenu .leftOne ul li .dropdown ul li a {
    font-size  : 16px;
    font-weight: 400;
}

.mbMenuContainer .mbMenu .leftOne .dropdown ul li a::before {
    content: '-';
}

.mbMenuContainer .mbMenu .rightOne {
    display    : flex;
    align-items: flex-end;
}

.mbMenuContainer .mbMenu .rightOne h6 {
    text-transform: uppercase;
}

.mbMenuContainer .mbMenu .supportBox ul li a {
    font-size: 16px;
    color    : rgba(255, 255, 255, 0.60);
}

.mbMenuContainer .mbMenu .supportBox ul li a:hover {
    color: #fff;
}

.mbMenuContainer .mbMenu .socialBox ul {
    display    : flex;
    align-items: center;
    flex-wrap  : wrap;
    gap        : 10px;
}

.mbMenuContainer .mbMenu .socialBox li a i {
    width          : 50px;
    height         : 50px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-size      : 15px;
    border-radius  : 50%;
    border         : 1px solid rgb(255 255 255 / 30%);
    position       : relative;
    z-index        : 1;
}

.mbMenuContainer .mbMenu .socialBox li a i:hover {
    color: var(--primary-color);
}

.mbMenuContainer .mbMenu .socialBox li a i::after {
    content         : '';
    position        : absolute;
    inset           : 0;
    border-radius   : 50%;
    background-color: #fff;
    transform       : scale(0, 0);
    transition      : all 300ms ease-in-out;
    z-index         : -1;
}

.mbMenuContainer .mbMenu .socialBox li a:hover i::after {
    transform: scale(1, 1);
}

.mbMenuContainer .mbMenu .socialBox li a .fa-facebook-f {
    background-color: var(--facebook);
}

.mbMenuContainer .mbMenu .socialBox li a .fa-linkedin-in {
    background-color: var(--linkedin);
}

.mbMenuContainer .mbMenu .socialBox li a .fa-twitter {
    background-color: var(--twitter);
}

.mbMenuContainer .mbMenu .socialBox li a .fa-youtube {
    background-color: var(--youtube);
}

.mbMenuContainer .mbMenu .socialBox li a .fa-whatsapp {
    background-color: var(--whatsapp);
}

.mbMenuContainer .mbMenu .socialBox li a .fa-instagram {
    background-color: var(--instagram);
}

/*header*/

.hero {
    position   : relative;
    display    : flex;
    align-items: center;
}

.home-hero .heading-xl {
    transition: all 800ms ease-in-out;
}

.home-hero h2.heading-xl {
    opacity : 0;
    position: absolute;
    top     : 0;
}

.banner {
    position     : absolute;
    height       : 100vh;
    /* background: var(--primary-color); */
    z-index      : 1;
}

/* .banner::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 6vw;
    height: 6vw;
    border-top: 3vw solid var(--primary-color);
    border-right: 3vw solid var(--primary-color);
    border-bottom: 3vw solid transparent;
    border-left: 3vw solid transparent;
} */

.typed-cursor {
    font-weight   : 300;
    line-height   : .7;
    vertical-align: top;
}

.banner .carousel-item::before {
    content      : "";
    position     : absolute;
    left         : 0;
    top          : 0;
    height       : 100%;
    width        : 100%;
    background   : rgb(0 0 0 / 20%);
    /* background: linear-gradient(rgb(0 0 0 / 70%), transparent 60%); */
    z-index      : 1;
}

/* .banner img.h-100{
  clip-path: circle(50% at 50% 50%);
} */
#videobg {
    width     : 100%;
    height    : 100vh;
    object-fit: cover;
    position  : relative;
    left      : 0;
    right     : 0;
    top       : 0;
    bottom    : 0;
    z-index   : -1;
}

.bannerText {
    width     : 70%;
    position  : absolute;
    bottom    : 35%;
    left      : 51%;
    transform : translateX(-50%);
    /* opacity: 0; */
    z-index   : 9;
    color     : #fff;
    text-align: center;
    transition: all .3s linear;
}

.bannerText h1 {
    color: rgb(11, 241, 49);
    
    padding-bottom: 2%;
}

.banner .carousel-item.active .bannerText {
    left   : 50%;
    opacity: 1;
}

.bannerText .h1 {
    font-size     : 2.5rem;
    font-weight   : 700;
    text-transform: uppercase;
    position      : relative;
    padding       : 1px 0;

}

.bannerText h5 {
    font-weight: 400;
    font-size  : 2.5rem;
}

.bannerBottom {
    position       : absolute;
    bottom         : 20px;
    right          : 20px;
    display        : flex;
    justify-content: space-between;
    align-items    : center;
    z-index        : 9;
}

.bannerControlsContainer {
    display    : flex;
    align-items: center;
}

.bannerControlsContainer .carousel-indicators {
    position    : static;
    align-items : center;
    margin-right: 0px;
    margin-left : 0;
}

.bannerControlsContainer .carousel-indicators li {
    width           : auto;
    height          : auto;
    background-color: transparent;
    opacity         : 1;
    color           : yellow;
    margin          : 0 20px;
    text-indent     : inherit;
    border-top      : 1px solid transparent;
    border-bottom   : 1px solid transparent;
    font-weight     : 600;
    font-size       : 12px;
    transition      : all 300ms ease-in-out;
}

.bannerControlsContainer .carousel-indicators li:hover,
.bannerControlsContainer .carousel-indicators .active {
    border-bottom-color: yellow;
}

.bannerControlsContainer .bannerControl {
    display        : flex;
    align-items    : center;
    justify-content: center;
}

.bannerControlsContainer .bannerControl>span {
    width: 120px;
}

.bannerControlsContainer .bannerControl .carousel-control-next.banner-next,
.bannerControlsContainer .bannerControl .carousel-control-prev.banner-prev {
    position     : static;
    top          : auto;
    width        : 40px;
    height       : 40px;
    border-radius: 5px;
    margin       : 0 5px;
    opacity      : 1;
    z-index      : 9;
}

.carousel-control-next.banner-next .carousel-control-next-icon,
.carousel-control-prev.banner-prev .carousel-control-prev-icon {
    background-size: 60%;
}

.carousel-control-next.banner-next:hover,
.carousel-control-prev.banner-prev:hover {
    background-color: var(--primary-color);
}

.bannerSocial {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: center;
    position       : absolute;
    left           : 20px;
    bottom         : 20px;
    z-index        : 9;
}

.bannerSocial a {
    font-size: 13px;
    display  : block;
    padding  : 5px;
    margin   : 5px 0;
    color    : yellow;
}

.bannerSocial a:hover {
    color: #fff;
}

.scrollDown {
    position  : absolute;
    left      : calc(50% - 15px);
    bottom    : 20px;
    width     : 30px;
    text-align: center;
    color     : yellow;
    font-size : 1rem;
    cursor    : pointer;
    z-index   : 9;
    animation : bounce 1s alternate infinite;
}

@keyframes bounce {
    100% {
        bottom: 10px;
    }
}

/* .cloud {
    position      : absolute;
    left          : 0;
    right         : 0;
    top           : 0;
    height        : 39%;
    background    : url(public/cloud.png);
    animation     : animateclouds 110s linear infinite;
    pointer-events: none;
    opacity       : 0.7;
} */

/* @keyframes animateclouds {
    0% {
        background-position: 0px;
    }

    100% {
        background-position: -3000px;
    }
} */

/* Sectors */

.circle-wrapper {
    width       : fit-content;
    margin-left : auto;
    margin-right: auto;
}

.circle-logo {
    position        : absolute;
    z-index         : 1;
    top             : 0;
    left            : 0;
    right           : 0;
    bottom          : 0;
    width           : 50%;
    height          : 50%;
    margin          : auto;
    border-radius   : 50%;
    background-color: var(--primary-color);
    display         : flex;
    align-items     : center;
    justify-content : center;
}

.circle-logo img {
    width: 160px;
}

.rotate--circle {
    margin                 : 0 auto;
    position               : relative;
    z-index                : 0;
    display                : flex;
    justify-content        : center;
    align-items            : center;
    width                  : 55vw;
    max-width              : 80vh;
    height                 : 55vw;
    max-height             : 80vh;
    border-radius          : 50%;
    /* background-color    : #63e0c9; */
    /* background-image    : linear-gradient(to top, #c1dfc4 0%, #deecdd 100%); */
    background             : #fff;
    box-shadow             : 0 8px 32px 0 rgb(135 31 31 / 35%);
    backdrop-filter        : blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border                 : 1px solid rgba(255, 255, 255, 0.18);
    animation-duration     : 60s !important;
}

.rotate--circle::before {
    content            : '';
    position           : absolute;
    z-index            : 2;
    left               : 10%;
    top                : 10%;
    width              : 80%;
    height             : 80%;
    border-radius      : 50%;
    /* background      : #389433; */
    /* background-image: linear-gradient(15deg, #13547a 0%, #80d0c7 100%); */
}

.rotate--circle .co2-icon {
    position : absolute;
    z-index  : 2;
    left     : 50%;
    top      : 5%;
    display  : block;
    width    : 72px;
    height   : 72px;
    transform: translate(-50%, -50%);
}

.circle--rotate {
    position     : relative;
    z-index      : 4;
    border-radius: 50%;
    /* border    : 1px solid rgb(255 255 255 / 50%); */
    width        : 100%;
    max-width    : 100%;
    height       : 100%;
    max-height   : 100%;
    margin       : 0 auto 0;
    transform    : rotate(0deg);
    padding      : 0;
}

.circle--rotate>li {
    position     : absolute;
    left         : 0;
    top          : 0;
    width        : 100%;
    height       : 100%;
    display      : block;
    border-radius: 50%;
    z-index      : 10;
    visibility   : hidden;
}

.circle-wrapper .count8 li:nth-child(2) {
    transform: rotate(45deg);
}

.circle-wrapper .count8 li:nth-child(3) {
    transform: rotate(90deg);
}

.circle-wrapper .count8 li:nth-child(4) {
    transform: rotate(135deg);
}

.circle-wrapper .count8 li:nth-child(5) {
    transform: rotate(180deg);
}

.circle-wrapper .count8 li:nth-child(6) {
    transform: rotate(-135deg);
}

.circle-wrapper .count8 li:nth-child(7) {
    transform: rotate(-90deg);
}

.circle-wrapper .count8 li:nth-child(8) {
    transform: rotate(-45deg);
}

.circle--rotate>li .icon {
    display      : block;
    width        : 70px;
    height       : 70px;
    margin       : -35px auto;
    border-radius: 50%;
    background   : var(--most-prime-color);
    box-shadow   : 0 -8px 32px 0 rgb(135 31 31 / 35%);
    border       : 4px solid rgba(255, 255, 255, 1);
    visibility   : visible;
    transition   : all 0.3s ease;
}

.circle--rotate>li .icon img {
    filter: brightness(50);
}

.partnersBox {
    display: none;
}

.display {
    display: block;
}

.partners-tab ul {
    display        : flex;
    justify-content: center;
}

.partners-tab ul li {
    flex-grow: 1;
}

.partners-tab ul li button {
    width           : 100%;
    background-color: transparent;
    color           : var(--secondary-color);
    padding         : 10px 12px;
    cursor          : pointer;
    display         : block;
    text-transform  : uppercase;
    font-size       : 13px;
    font-weight     : 700;
    border          : solid rgb(0 0 0 / 15%);
    border-width    : 1px 1px 1px 0;
    transition      : all 300ms ease-in-out;
}

.partners-tab ul li:first-of-type button {
    border-radius    : 30px 0 0 30px;
    border-left-width: 1px;
}

.partners-tab ul li:last-of-type button {
    border-radius: 0 30px 30px 0;
}

.partners-tab ul li button:hover,
.partners-tab ul li button.viewsBtnActive {
    color     : var(--secondary-color);
    background: var(--most-prime-color);
}

@media only screen and (min-height: 821px) {
    .circle--rotate>li .icon {
        width : 100px;
        height: 100px;
        margin: -50px auto;
    }
}

.circle--rotate>li .icon span {
    position  : absolute;
    z-index   : -1;
    color     : #000;
    text-align: center;
    left      : 50%;
    transform : translateX(-50%);
    width     : 140px;
    margin-top: 25px;
    font-size : 16px;
}

/* Sectors */

.circle-button {
    background-color: var(--primary-color);
    color           : #fff;
    font-weight     : 600;
    display         : flex;
    align-items     : center;
    justify-content : center;
    border-radius   : 50%;
    width           : 25px;
    height          : 25px;
    font-size       : 10px;
    transition      : all 300ms ease-in-out;
}

.circle-button:hover {
    color           : #fff;
    background-color: var(--primary-color);
}

.spiral-pattern {
    position  : absolute;
    height    : 100%;
    top       : 0;
    background: url(../img/bg1.jpg) center repeat;
    width     : 100%;
    opacity   : .075;
    transition: all 300ms linear;
    z-index   : -1;
}

/* overview */

.overview-container {
    background: #fffcf2;
    /* background-blend-mode: darken; */
}

.overview-heading {
    font-weight  : 400;
    font-size    : 1.75rem;
    margin-bottom: .5em;
    line-height  : 1.1;
}

/* overview */

/* Glory */

.glory-section {
    background: linear-gradient(#fffcf2, #fff);
}

.glory-section .glory-text {
    width    : 80%;
    position : absolute;
    top      : 4rem;
    left     : 50%;
    transform: translateX(-50%);
}

.glory-section .glory-text .recycle-img {
    width  : 18vw;
    margin : 4vw auto 0;
    opacity: 0.6;
}
/* .recycle-img1 {
    width  : 13vw;
    margin : 20vw auto 0;
    opacity: 0.6;
} */



.bg-cloud {
    background-color: #fff;
}


/* #wing1{
  animation: spin 10s linear infinite;
}

@keyframes spin{
  100%{
    transform: rotate(10deg);
  }
} */

#boat {
    animation: boat 5s linear alternate infinite;
}

@keyframes boat {
    100% {
        transform: translateX(15px);
    }
}

#balloon1,
#balloon2,
#balloon-shade1 {
    animation: balloon1 15s linear infinite;
}

@keyframes balloon1 {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    100% {
        transform: translateY(-120px);
        opacity  : 0;
    }
}

#truck {
    animation: truck 8s linear infinite;
}

@keyframes truck {
    0% {
        transform: translateX(-300px);
    }

    100% {
        transform: translateX(150px);
    }
}

.smoke {
    animation: blink 1s linear alternate infinite;
}

#smoke2 {
    animation-delay: .7s;
}

@keyframes blink {
    100% {
        opacity: 0.2;
    }
}

/* csr */

.csr-container.bg-image {
    background-attachment: unset;
}

.csr-container.bg-image::before {
    background-color: rgba(18, 54, 40, 0.65);
}

/* csr */

.stats {
    display    : flex;
    align-items: center;
    gap        : 0 20px;
    margin-top : 2rem;
    padding-top: 2rem;
    border-top : 1px dashed rgb(0 0 0 / 15%);
}

.stats li {
    flex: 1 0 0;
}

.stats li h2 {
    font-weight: 700;
}

.stats li i {
    font-size: 1.25rem;
}

/* Video and growth */

.modal-title {
    font-weight: 700;
    color      : var(--primary-color);
}

.videoth {
    translate: 0 15%;
    position : relative;
    z-index  : 1;
}

.videoth::before {
    content         : '';
    position        : absolute;
    inset           : 0;
    background-color: rgb(0 0 0 / 50%);
}

.videoth img {
    height    : 440px;
    object-fit: cover;
}

.videoBtn {
    position        : absolute;
    left            : 50%;
    top             : 50%;
    translate       : -50% -50%;
    width           : 40px;
    height          : 40px;
    border          : none;
    border-radius   : 50%;
    background-color: var(--primary-color);
    color           : #fff;
    transition      : all 300ms ease-in-out;
    animation       : breathe 800ms alternate infinite;
}

.videoBtn::before {
    content         : '';
    position        : absolute;
    inset           : -10px;
    border-radius   : 50%;
    border          : 1px solid rgb(255 255 255 / 30%);
    z-index         : -1;
    transition      : all 300ms ease-in-out;
    transition-delay: 100ms;
    animation       : breathe 800ms alternate infinite;
}

@keyframes breathe {
    100% {
        scale: 1.2;
    }
}

.videoBtn:hover {
    scale: 1.2;
}

.videoBtn:hover::before {
    scale       : 1.2;
    border-color: #fff;
}

/* Clientele */

.brand-logos {
    height          : 120px;
    background-color: #fff;
    position        : relative;
    overflow        : hidden;
    transition      : all 300ms ease-in-out;
}

.brand-logos img {
    width     : auto;
    position  : absolute;
    left      : 50%;
    top       : 50%;
    transform : translate(-50%, -50%);
    max-width : 90%;
    max-height: 90%;
    transition: all 300ms ease-in-out;
}

.brand-logos img:hover {
    filter: grayscale(1);
}

/* Clientele */

.viewmore {
    width     : 100%;
    margin-top: 30px;
}

.viewmore a {
    text-transform: uppercase;
    color         : var(--primary-color);
    letter-spacing: 3px;
    font-size     : 11px;
    font-weight   : 600;
}

.viewmore a span {
    font-size   : 18px;
    padding-left: 10px;
}

.newsBox section article h4 a:hover,
.viewmore a:hover {
    color: var(--primary-color);
}

p {
    line-height: 1.2;
}

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

.hollow-us {
    justify-content: center;
    display        : flex;
    margin-top     : 14px;
}

.hollow-us h3 {
    display    : flex;
    align-items: center;
    gap        : 12px;
}

.hollow-us img {
    width        : 40px;
    border-radius: 50%;
}

@media (min-width: 768px) {
    .padding {
        padding-top   : 7.5vw;
        padding-bottom: 7.5vw;
    }
}

.heading-xl {
    margin-bottom : 0;
    font-weight   : 200;
    font-size     : 3rem;
    line-height   : 1;
    text-transform: uppercase;
}

.heading {
    display      : table;
    position     : relative;
    margin-bottom: 30px;
    z-index      : 1;
}

.heading h2,
.heading h4,
.heading h5,
.heading h6 {
    display: block;
}

.heading h2 {
    font-weight   : 500;
    font-size     : 2rem;
    text-transform: uppercase;
    color         : var(--primary-color);
}

.heading h2 strong {
    font-weight: 800;
}

.font3vw {
    font-size: 3vw !important;
}

.heading h3 {
    font-weight: 500;
}

.heading h4 {
    font-weight: 500;
}

.heading h6 {
    font-weight   : 400;
    letter-spacing: 2px;
}

.heading-md {
    margin     : 0;
    font-size  : 22px;
    line-height: 1.5;
}

@media (min-width: 768px) {
    .heading-md {
        font-size: 24px;
    }
}

@media (min-width: 1200px) {
    .heading-md {
        font-size: 26px;
    }
}

.text-gradient {
    background-image       : linear-gradient(45deg, #ff0844 0%, #ffb199 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-primary {
    color: var(--primary-color) !important;
}

.bg-primary {
    background-color: var(--primary-color) !important;
    color           : #fff;
}

.bg-primary-gradient {
    background           : linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) var(--primary-color);
    background-blend-mode: multiply, multiply;
    color                : #fff;
}

.bg-gradient1 {
    background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
}

.bg-gradient2 {
    background-image: linear-gradient(to top, #a8edea 0%, #fed6e3 100%);
}

.bg-gradient3 {
    background-image: linear-gradient(45deg, #a18cd1 0%, #fbc2eb 100%);
}

.bg-light {
    background-color: #fff !important;
}

.bg-light-gray {
    background-color: var(--light-gray) !important;
}

.bg-image {
    color     : #fff;
    background: center / cover no-repeat fixed;
}

.bg-image::before {
    content         : '';
    position        : absolute;
    inset           : 0;
    background-color: rgb(124 0 0 / 70%);
    z-index         : -1;
}

.bg-image.bg-image-dark::before {
    background-color: rgb(0 0 0 / 70%);
}

.scroller {
    overflow: auto;
}

.scroller::-webkit-scrollbar {
    width: 5px;
}

/* Track */

.scroller::-webkit-scrollbar-track {
    box-shadow   : inset 0 0 5px #fff;
    border-radius: 10px;
}

/* Handle */

.scroller::-webkit-scrollbar-thumb {
    background   : var(--secondary-color);
    border-radius: 10px;
}

/* Handle on hover */

.scroller::-webkit-scrollbar-thumb:hover {
    background: #000;
}

.readmore {
    width     : 100%;
    margin-top: 2rem;
}

.readmore .button {
    position        : relative;
    z-index         : 1;
    display         : table;
    padding         : 13px 20px 10px;
    min-width       : 130px;
    border-radius   : 40px;
    color           : var(--primary-color);
    background-color: transparent;
    border          : 1px solid var(--primary-color);
    font-size       : 14px;
    font-weight     : 600;
    letter-spacing  : 1px;
    text-align      : center;
    text-transform  : uppercase;
    transition      : all ease-in-out 0.3s;
}

.readmore button {
    width     : 100%;
    background: none;
}

.readmore .button:hover {
    color       : #fff;
    background  : var(--primary-color);
    border-color: transparent;
}

.readmore .button.text-white {
    color       : #fff !important;
    border-color: #fff;
}

.readmore .button.text-white:hover {
    color       : var(--primary-color) !important;
    background  : #fff;
    border-color: transparent;
}

.readmore .button.solid.white:hover,
.readmore .button.solid {
    background-color: var(--primary-color);
    color           : #fff;
    border          : none;
}

.readmore .button.solid:hover {
    background-color: var(--secondary-color);
}

.readmore .button.solid.white {
    background-color: #fff;
    color           : var(--primary-color);
    border          : none;
}

.controls {
    position: absolute;
    width   : 110px;
    height  : 40px;
    right   : 10px;
    bottom  : 10px;
    z-index : 9;
}

.controls a {
    position     : static;
    display      : table;
    width        : 100%;
    height       : 50px;
    line-height  : 50px;
    cursor       : pointer;
    text-align   : center;
    color        : var(--primary-color);
    font-size    : 13px;
    border-bottom: 1px solid rgb(0 0 0 / 20%);
    opacity      : 1;
}

.controls a:last-child {
    border-bottom: none;
}

.controls a:focus,
.controls a:hover {
    color  : var(--primary-color) !important;
    opacity: 1;
}

.multiply {
    mix-blend-mode: multiply;
}

/* key points */

.key-points .inner {
    padding: 0 25% 12.5vw 10%;
}

.benefits-list {
    width      : 100%;
    max-width  : 600px;
    margin     : 0;
    padding    : 0;
    list-style : none;
    line-height: 1.2;
}

.heading-md+.benefits-list {
    margin-top: 23px;
}

.benefits-list li {
    position     : relative;
    padding      : 10px 0 10px 15px;
    border-bottom: 1px solid rgb(0 0 0 / 7%);
}

.bg-primary .benefits-list li {
    border-bottom: 1px solid rgb(255 255 255 / 15%);
}

.benefits-list li::before {
    content            : '';
    position           : absolute;
    left               : 0;
    top                : 18px;
    display            : block;
    width              : 6px;
    height             : 12px;
    background-image   : url(../img/bullet.svg);
    background-position: center;
    background-repeat  : no-repeat;
    background-size    : contain;
}

.bg-primary .benefits-list li::before {
    filter: brightness(50) grayscale(1);
}

/* key points */

/* benefits */

.benefitBox .inner {
    display         : block;
    color           : inherit;
    border-radius   : 5px;
    height          : 100%;
    padding         : 2rem;
    background-color: #fff;
    color           : var(--secondary-color);
    box-shadow      : 0px 2px 6px #e8e6e6;
    text-align      : center;
    transition      : all 300ms ease-in-out;
}

.inner.myBox {
    padding: 1rem;
}

.benefitBox .inner.d-flex {
    text-align: left;
    gap       : 10px;
    box-shadow: none;
}

.benefitBox .inner:hover {
    color           : #fff;
    background-image: linear-gradient(45deg, var(--most-prime-color) 0%, #94e771 100%);
}

.benefitBox .inner.d-flex .img-fluid {
    max-width: 70px;
    flex     : 0 0 70px;
    margin   : 0;
}

.benefitBox .inner .img-fluid {
    width        : 60px;
    margin       : 0rem auto 1rem;
    padding      : 10px;
    border-radius: 50%;
    background   : linear-gradient(to bottom right, #eff0f3, #ffffff);
    box-shadow   : 3px 3px 3px #e8e6e6, -3px -3px 3px #ffffff;
    transition   : all 300ms ease-in-out;
}

.benefitBox .inner:hover .img-fluid {
    /* background: linear-gradient(to bottom right,#eff0f3,#ffffff); */
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15), -3px -3px 3px rgba(255, 255, 255, 0.188);
}

.inner.myBox .img-fluid {
    width  : 80px;
    margin : 0rem auto 1rem;
    padding: 1rem;
}

.benefitBox .inner:hover h5 {
    color: #fff !important;
}

.benefitBox .inner p {
    margin-bottom: 0px;
}

/* benefits */

.position-relative {
    z-index: 1;
}

/* Success */

.successContainer {
    position      : relative;
    padding-bottom: 4rem;
}

.successContainer .swiper-button-next {
    right: calc(50% - 45px);
}

.successContainer .swiper-button-prev {
    left: calc(50% - 45px);
}

.successContainer .swiper-button-next,
.successContainer .swiper-button-prev {
    width          : 40px;
    height         : 40px;
    margin-top     : 0;
    top            : auto;
    bottom         : 10px;
    background-size: 16px;
}

.successBox {
    height    : auto;
    width     : 25%;
    text-align: center;
    padding   : 0 15px;
}

.successBox .inner {
    height          : 100%;
    border-radius   : 0 0 5px 5px;
    background-color: #fff;
    box-shadow      : 3px 3px 3px rgb(0 0 0 / 10%), -3px -3px 3px rgb(0 0 0 / 6%);
}

.successBox .success_connector {
    width          : 100%;
    display        : flex;
    justify-content: flex-end;
    align-items    : center;
    position       : absolute;
    top            : 2.5rem;
    z-index        : 1;
}

.success_connector::after {
    content      : '';
    position     : absolute;
    border-radius: 6px;
    z-index      : -1;
}

.success_connector::after {
    left            : 0;
    top             : calc(50% - 1px);
    width           : calc(100% + 15px);
    height          : 2px;
    background-color: var(--primary-color);
}

.successBox .success_connector span {
    width           : 6px;
    height          : 6px;
    border-radius   : 50%;
    background-color: #fff;
    margin-right    : 13px;
    outline         : 2px solid var(--primary-color);
}

.successBox .inner {
    position: relative;
    z-index : 2;
}

.success_Text .success_year {
    letter-spacing       : 2px;
    font-weight          : 800;
    border-radius        : 5px 5px 0 0;
    color                : #fff;
    background           : linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) var(--primary-color);
    background-blend-mode: multiply, multiply;
    margin               : 0 auto;
    font-size            : 1.5em;
    padding              : 10px;
    position             : relative;
    z-index              : 1;
}

.success_Text .success_Stuff {
    padding   : 2rem 1rem;
    transition: all 300ms ease-in-out;
}

.success_Stuff h5 {
    font-weight   : 700;
    border-bottom : 1px solid rgb(0 0 0 / 10%);
    padding-bottom: 8px;
    margin-bottom : 1rem;
}

.success_Stuff h4 {
    font-weight  : 800;
    font-size    : 2.25rem;
    margin-bottom: 0;
    line-height  : 1;
    padding-top  : 3px;
    color        : var(--primary-color);
}

.success_Stuff h6 {
    font-size    : 14px;
    margin-bottom: 0;
}

/* Success */

.wasteSlider .swiper-slide {
    width : 30%;
    height: auto;
}

.wasteSlider .swiper-slide.newsBox .inner {
    height: 100%;
}

.wasteSlider .swiper-slide.newsBox .inner:hover {
    background-color: var(--secondary-color);
}

.wasteSlider .swiper-slide.newsBox .inner .img-fluid img {
    height: auto;
}

/* custom swiper controls */

.swiper-button-next,
.swiper-button-prev {
    width        : 40px;
    height       : 40px;
    margin-top   : -20px;
    border-radius: 50%;
    background   : url("../img/arrow-left.png") center / 15px no-repeat var(--secondary-color);
    transition   : all 300ms ease-in-out;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    scale           : 1.2;
    background-color: var(--primary-color);
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
    transform: rotate(-180deg);
}

.swiper-button-next:after,
.swiper-button-prev:after {
    display: none;
}

.bottom-control {
    top: calc(100% - 1.5rem);
}

.bottom-control.swiper-button-next {
    right: 13%;
}

.bottom-control.swiper-button-prev {
    left: 13%;
}

.swiper-pagination {
    bottom: 0 !important;
}

.swiper-pagination-bullet-active {
    background-color: var(--primary-color);
    width           : 20px;
    border-radius   : 10px;
}

.bar-controls {
    display        : flex;
    position       : relative;
    align-items    : center;
    justify-content: space-between;
    padding        : 10px;
}

.bar-controls .bar-arrows {
    position   : relative;
    width      : 100px;
    display    : flex;
    align-items: center;
    gap        : 10px;
}

.bar-controls .bar-arrows>div {
    position       : static !important;
    margin-top     : 0 !important;
    width          : 40px;
    height         : 40px;
    background-size: 22px;
}

.bar-controls .swiper-horizontal>.swiper-pagination-progressbar,
.bar-controls .swiper-pagination-progressbar.swiper-pagination-horizontal {
    position: static;
    width   : calc(100% - 120px);
}

.bar-controls .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: linear-gradient(45deg, var(--secondary-color), var(--primary-color), var(--secondary-color));
}

/* custom swiper controls */

.certified {
    padding: 3rem 0;
}

.certified-seal .img-fluid {
    text-align   : center;
    font-weight  : 700;
    font-size    : 14px;
    border-radius: 5px;
}

.certified-seal .img-fluid img {
    margin: 0 auto 10px;
}

.certified-seal:not(:first-of-type) .img-fluid img {
    width: 100px;
}

.certified-seal:not(:first-of-type) .img-fluid {
    padding-top   : 1rem;
    padding-bottom: 1rem;
    border        : 1px solid rgb(255 255 255 / 12%);
    transition    : all 300ms ease-in-out;
}

.certified-seal:not(:first-of-type) .img-fluid:hover {
    background-color: #fff;
    box-shadow      : 0 1rem 3rem rgb(0 0 0 / 15%);
    color           : var(--secondary-color);
}

/*Footer*/

.footer-area {
    /* background-image: {{asset("/images/background.jpg")}}; */

    /* background-image: url({{URL('/')}}/public/assets/landing/images/images/footer-img.png); */
    background-image   : url('./img/footer-img.png');
    background-repeat  : no-repeat;
    background-position: bottom center 100%;
    background-image   : linear-gradient(to top, #eaffcd 0%, #c4ffde 100%);
    /* background      : url('') bottom center / 100% no-repeat, linear-gradient(to top, #eaffcd 0%, #c4ffde 100%);*/
    position           : relative;
    z-index            : 1;
}

/* .footer-area::before{
  content: '';
  position: absolute;
  inset: 0;
  background: rgb(0 0 0 / 92%);
  backdrop-filter: grayscale(1);
  z-index: -1;
} */

.footer-area a {
    color: var(--secondary-color);
}

.footer-area a:hover {
    color: var(--primary-color);
}

.mainFooter {
    margin-bottom: 12vw;
}

.footerAbout {
    font-size: 1rem;
}

.footerAbout .footer-title {
    font-size     : 15px;
    font-weight   : 800;
    text-transform: uppercase;
    margin-bottom : .75rem;
    color         : var(--most-prime-color);
}

.footerAbout .footerSocial {
    display    : flex;
    flex-wrap  : wrap;
    align-items: center;
    gap        : 20px;
}

.footerAbout .footerSocial li a {
    color     : #fff;
    font-size : 14px;
    text-align: center;
}

.footerAbout .footerSocial li a i {
    display      : block;
    width        : 35px;
    height       : 35px;
    line-height  : 33px;
    border       : 1px solid rgb(255 255 255 / 15%);
    border-radius: 50%;
    transition   : all 300ms ease-in-out;
}

.footerSocial li a .fa-facebook-f {
    background-color: var(--facebook);
}

.footerSocial li a .fa-linkedin-in {
    background-color: var(--linkedin);
}

.footerSocial li a .fa-twitter {
    background-color: var(--twitter);
}

.footerSocial li a .fa-youtube {
    background-color: var(--youtube);
}

.footerSocial li a .fa-whatsapp {
    background-color: var(--whatsapp);
}

.footerSocial li a .fa-instagram {
    background-color: var(--instagram);
}

.footerSocial li a:hover .fa-facebook-f {
    color: var(--facebook);
}

.footerSocial li a:hover .fa-linkedin-in {
    color: var(--linkedin);
}

.footerSocial li a:hover .fa-twitter {
    color: var(--twitter);
}

.footerSocial li a:hover .fa-youtube {
    color: var(--youtube);
}

.footerSocial li a:hover .fa-whatsapp {
    color: var(--whatsapp);
}

.footerSocial li a:hover .fa-instagram {
    color: var(--instagram);
}

.footerAbout .footerSocial li a:hover i {
    background-color: #fff !important;
    box-shadow      : 0 10px 20px rgb(0 0 0 / 25%);
}

.footerBox ul li {
    margin: 8px 0;
}

.footerBox ul li a {
    position      : relative;
    padding-bottom: 5px;
    display       : inline-block;
    transition    : all 300ms ease-in-out;
}

.footerBox .footerLinks li a:before {
    content      : "";
    position     : absolute;
    bottom       : 0;
    left         : 0;
    width        : 0;
    border-bottom: 1px solid;
    transition   : all 300ms ease-in-out;
}

.footerBox .footerLinks li a:hover:before {
    width: 100%;
}

.footerAddress {
    margin-bottom: 2rem;
}

.footerAddress p {
    display      : flex;
    gap          : 0 10px;
    margin-bottom: 8px;
}

.footerAddress p i {
    font-size : 13px;
    margin-top: 4px;
    color     : var(--most-prime-color);
}

.footer-area .bottom {
    display        : flex;
    justify-content: space-between;
    align-items    : center;
    padding-top    : 3rem;
    color          : #fff;
}

.footer-area .bottom ul {
    display        : flex;
    justify-content: flex-end;
    flex-basis     : 0;
    flex-grow      : 1;
}

.footer-area .bottom li {
    font-size  : 12px;
    display    : flex;
    margin     : 0 10px;
    line-height: 1;
}

.footer-area .bottom li a {
    color: #fff;
}

.footer-area .bottom li a:hover {
    color: yellow;
}

.footer-area .bottom p {
    display      : flex;
    font-size    : 12px;
    align-items  : center;
    margin-bottom: 0;
    flex-basis   : 0;
    flex-grow    : 1;
}

.footer-area .bottom p:last-child {
    justify-content: flex-end;
}

.footer-area .bottom p img {
    width: 20px;
}

.button-top {
    background   : rgba(0, 0, 0, 0.32);
    position     : fixed;
    right        : 20px;
    bottom       : 40px;
    color        : #ffffff;
    font-size    : 13px;
    opacity      : 0;
    width        : 40px;
    height       : 40px;
    line-height  : 40px;
    border-radius: 50%;
    text-align   : center;
    z-index      : 8;
    cursor       : pointer;
}

.button-top:hover {
    background: var(--primary-color);
}

/*Footer*/

/* Inside page */

.insideBanner {
    height  : calc(100vh - 59px);
    position: relative;
    overflow: hidden;
    color   : var(--secondary-color);
}

.insideBanner::before {
    content      : '';
    position     : absolute;
    inset        : 0;
    /* background: linear-gradient(rgba(179, 0, 0, 0.25), rgb(0 0 0 / 75%)); */
    z-index      : 1;
}

.pageHead {
    position        : absolute;
    left            : 0%;
    bottom          : 0%;
    width           : 100%;
    display         : flex;
    align-items     : center;
    justify-content : space-between;
    background-color: #011915;
    border-top      : 1px solid rgb(255 255 255 / 30%);
    padding         : 10px 2rem;
    opacity         : 0;
    transition      : opacity 1s linear;
    z-index         : 1;
    text-align      : center;
}

.page-title {
    font-size  : 24px;
    font-weight: 700;
    color      : var(--most-prime-color);
}

.breadcrumb {
    background-color: transparent;
    margin-bottom   : 0;
    border-radius   : 0;
    padding-left    : 0;
    padding-right   : 0;
    font-size       : 12px;
    justify-content : center;
}

.breadcrumb li,
.breadcrumb li a,
.breadcrumb-item+.breadcrumb-item::before {
    color      : rgb(255 255 255 / 60%);
    font-weight: 600;
}

.breadcrumb li a:hover,
.breadcrumb li.active {
    color: #fff;
}

.pageLink a {
    text-align: center;
    display   : block;
    padding   : 1.25rem 10px 1rem;
    color     : #fff;
    transition: all 300ms ease-in-out;
    position  : relative;
    z-index   : 2;
}

.pageLink a::before {
    content         : '';
    position        : absolute;
    inset           : -10px 0;
    background-color: #fff;
    box-shadow      : 0 10px 30px rgb(0 0 0 / 15%);
    z-index         : -1;
    border-radius   : 5px;
    transform       : scaleY(0);
    transition      : all 300ms ease-in-out;
}

.pageLink a:hover {
    color: rgb(255 255 255 / 60%);
}

.pageLink a.active {
    color: var(--primary-color);
}

.pageLink a.active::before {
    transform: scaleY(1);
}

.operationContainer .benefitBox section {
    /* border-radius: 5px;
  height: 100%;
  padding: 20px 1rem;
  background-image: linear-gradient(45deg, #a18cd1 0%, #fbc2eb 100%); */
}

.operationContainer .benefitBox section .img-fluid {
    width  : 60px;
    padding: 8px;
    margin : 0 auto 1rem;
}

.operationContainer .benefitBox section p {
    letter-spacing: normal;
    text-transform: none;
}

.hazardous-waste-handling {
    height: calc(95vh - (4vw + 1rem));
}

.handleBox .benefits-list li {
    padding: .5em 0 0.4em 1em;
}

.handleBox .benefits-list li:last-of-type {
    padding-bottom: 0;
    border-bottom : none;
}

.handleBox .benefits-list li::before {
    top: 1em;
}

/* csr start */

.boxContainer {
    border-radius: 5px;
}

.boxContainer>.row>div>.inner {
    padding: 2.5rem;
}

.imgBox .inner iframe {
    outline      : 2px solid var(--light-gray);
    overflow     : hidden;
    border-radius: 5px;
}

.newsBox .inner {
    height          : 100%;
    color           : var(--primary-color);
    display         : block;
    background-color: #fff;
    transition      : all 300ms ease-in-out;
    border-radius   : 5px;
    overflow        : hidden;
}

.newsBox .inner:hover {
    background-color: var(--primary-color);
    color           : #fff;
}

.newsBox .inner .img-fluid img {
    height    : 300px;
    object-fit: cover;
}

.newsBox .inner article {
    padding : 2.25rem 1.6rem 2rem;
    position: relative;
    z-index : 1;
}

.newsBox .inner article h4 {
    font-weight: 800;
}

.newsBox .inner article p {
    font-weight  : 500;
    margin-bottom: 0px;
    color        : var(--secondary-color);
}

.newsBox .inner:hover article p {
    color: #fff;
}

/* csr end */

/* testimonials start */

.testimonial-slider {
    border-radius: 5px;
}

.testim-card {
    width : 100%;
    height: auto;
}

.testim-card .inner {
    color                : inherit;
    outline              : none;
    height               : 100%;
    padding              : 2.5rem;
    border-radius        : 5px;
    background           : linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) var(--primary-color);
    background-blend-mode: multiply, multiply;
    color                : #fff;
    display              : flex;
    flex-direction       : column;
    justify-content      : space-between;
}

@media only screen and (min-width: 1920px) {
    .testim-card .inner {
        padding-left : 4rem;
        padding-right: 4rem;
    }
}

@media only screen and (max-width: 360px) {
    .testim-card .inner {
        padding: 20px 10px;
    }
}

.testim-card .inner::before {
    content: '\f10d';
    font   : 900 4em 'Font Awesome 5 Free';
}

.testim-card .inner p {
    margin-bottom: 2rem;
}

@media only screen and (max-width: 640px) {
    .testim-card .inner p {
        font-size: 1.1rem;
    }
}

.testim-card .inner .testim-footer {
    display    : flex;
    align-items: center;
    gap        : 0px 1rem;
}

.testim-card .inner .client-img {
    width           : 90px;
    height          : 90px;
    position        : relative;
    border-radius   : 50%;
    background-color: #fff;
    overflow        : auto;
}

.testim-card .inner .client-img img {
    position  : absolute;
    left      : 50%;
    top       : 50%;
    max-width : 90%;
    max-height: 90%;
    width     : auto;
    transform : translate(-50%, -50%);
}

.testim-card .inner .client-name {
    font-weight: 600;
    font-size  : 1.15em;
}

/* testimonials end */

/* Awards start */

.awards-card .award-card .card {
    text-align      : center;
    border-radius   : 5px;
    background-image: linear-gradient(45deg, #a18cd1 0%, #fbc2eb 100%);
    height          : 100%;
    border          : none;
    padding         : 2rem 5rem;
    flex-direction  : row;
    justify-content : space-between;
    align-items     : center;
}

.awards-card .award-card .card .icon {
    position: absolute;
    width   : 5rem;
}

@media only screen and (min-width: 1920px) {
    .awards-card .award-card .card .icon {
        width: 6rem;
    }
}

.awards-card .award-card .card .icon:first-child {
    left: 1rem;
}

.awards-card .award-card .card .icon:last-child {
    right: 1rem;
}

.awards-card .award-card .card .card-body {
    padding: 0;
}

@media only screen and (max-width: 640px) {
    .awards-card .award-card .card .card-body br {
        display: none;
    }
}

.awards-card .award-card .card .card-body .award-title {
    font-weight: 700;
    color      : var(--primary-color);
}

@media only screen and (min-width: 1920px) {
    .awards-card .award-card .card .card-body .award-title {
        font-size: 20px;
    }
}

.awards-card .award-card .card .card-body p {
    color      : var(--secondary-color);
    font-weight: 500;
}

.awards-card .award-card .card .award-yr {
    font-weight: 600;
}

/* Awards end */

/* industries start */

.benefitBox.indusBox .inner {
    padding: 30px 10px;
}

/* industries end */

/* Inside page */

.form-group {
    margin-bottom: 20px;
}

.form-group>div {
    margin-top: 15px;
}

.form-group label {
    margin-bottom: 0;
    font-size    : 13px;
    font-weight  : 500;
}

.form-control {
    border-radius: 0;
    border       : none;
    border-bottom: 1px solid rgb(0 0 0 / 16%);
    background   : none;
    outline      : none;
    padding-left : 0;
    padding-top  : 0;
}

.form-control[readonly] {
    background: none;
}

.form-control.form-control-dark {
    border-bottom-color: rgb(255 255 255 / 15%);
    color              : #fff;
}

select.form-control.form-control-dark {
    background-color: var(--primary-color);
}

.form-control.form-control-dark::placeholder {
    color: #8f8f8f;
}

.form-control:focus {
    box-shadow         : none;
    border-bottom-color: var(--primary-color);
    background         : none;
}

/* Contact */

.testim-card.contactBox .inner::before {
    display: none;
}

.contactBox .inner {
    background           : var(--primary-color);
    background           : linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) var(--primary-color);
    background-blend-mode: multiply, multiply;
    color                : #fff;
}

.contactList h3 {
    position     : relative;
    padding-left : 35px;
    margin-bottom: 1.5rem;
}

.contactList h3:before {
    content    : "\f277";
    position   : absolute;
    top        : 2px;
    left       : -2px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

.contactList li {
    margin-bottom: 12px;
    display      : flex;
    align-items  : center;
    gap          : 10px;
}

.contactList li:first-of-type {
    align-items: flex-start;
}

.contactList li:last-of-type {
    margin-bottom: 0px;
}

.contactList li a {
    color: #fff;
}

.contactList li i {
    max-width       : 30px;
    flex            : 0 0 30px;
    height          : 30px;
    border-radius   : 50%;
    font-size       : 14px;
    display         : flex;
    align-items     : center;
    justify-content : center;
    text-align      : center;
    color           : var(--primary-color);
    background-color: #fff;
}

.contactList li a:hover {
    color: rgb(255 255 255 / 60%);
}

.contactFormContainer {
    margin-top   : 3rem;
    border-radius: 5px;
}

.contactFormContainer section {
    padding: 2.5rem
}

/* customize modal */

.modal-backdrop.show {
    opacity        : 1;
    background     : rgb(0 0 0 / 90%);
    background     : linear-gradient(-42deg, rgb(153 19 19 / 90%), rgb(35 66 96 / 95%));
    backdrop-filter: blur(5px);
}

/* customize modal */

/*transformation Animation*/

.leftTranslate {
    -webkit-transform : translate(-200px, 0);
    transform         : translate(-200px, 0);
    opacity           : 0;
    -webkit-transition: all 1000ms;
    transition        : all 1000ms;
}

.rightTranslate {
    -webkit-transform : translate(200px, 0);
    transform         : translate(200px, 0);
    opacity           : 0;
    -webkit-transition: all 1000ms;
    transition        : all 1000ms;
}

.topTranslate {
    -webkit-transform : translate(0, -200px);
    transform         : translate(0, -200px);
    opacity           : 0;
    -webkit-transition: all 1000ms;
    transition        : all 1000ms;
}

.bottomTranslate {
    -webkit-transform : translate(0, 200px);
    transform         : translate(0, 200px);
    opacity           : 0;
    -webkit-transition: all 1000ms;
    transition        : all 1000ms;
}

.doneTranslate {
    -webkit-transform: translate(0, 0);
    transform        : translate(0, 0);
    opacity          : 1;
}

.fadeOut {
    opacity           : 0;
    visibility        : hidden;
    pointer-events    : none;
    -webkit-transition: all 1000ms ease-in-out;
    transition        : all 1000ms ease-in-out;
}

.fadeIn {
    opacity           : 1;
    visibility        : visible;
    pointer-events    : auto;
    -webkit-transition: all 1000ms;
    transition        : all 1000ms;
}

.zoomOut {
    transform : scale(0);
    transition: all 1s linear;
}

.zoomIn {
    transform: scale(1);
}

/*transformation Animation*/

.list li {
    margin-bottom: 10px;
}

.list li::marker {
    color: var(--primary-color);
}

.list,
.list {
    padding-left: 20px;
}

.mytextbox {
    position: absolute;
    width   : 100%;
    height  : auto;
}

.mytext {
    color    : rgb(95, 6, 6);
    font-size: .6em;
    width    : 100%;
    top      : 73%;
    left     : 77%;
}

.mytext-1 {
    color    : rgb(15, 15, 15);
    font-size: .7em;
    width    : 100%;
    top      : 70%;
    left     : 77%;
}


#myVideo {
    position  : relative;
    right     : 0;
    bottom    : 0;
    min-width : 100%;
    min-height: 100%;
}
.swiper-wrapper{
    height: auto;
}





.windturbine{
    scale: .2;
}

.pole{
    z-index: -1;
    background-color: aquamarine;
}

.blade1{
    transform: rotate(0deg);
    transform-box: fill-box;
    transform-origin: 45% 104%;
    animation: rotate1 8s linear infinite;
}
 .blade2{
    transform: rotate(120deg);
    transform-box: fill-box;
    transform-origin: 45% 104%;
    animation: rotate2 8s linear infinite
}
.blade3{
    transform: rotate(240deg);
    transform-box: fill-box;
    transform-origin: 45% 104%;
    animation: rotate3 8s linear infinite
} 
@keyframes rotate1 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes rotate2 {
    from {
        transform: rotate(120deg);
    }
    to {
        transform: rotate(480deg);
    }
  }
@keyframes rotate3 {
    from {
        transform: rotate(240deg);
    }
    to {
        transform: rotate(600deg);
    }
  } 

.name_text{
    padding-left: 1.4rem;
}






        .gallery {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 16px;
            padding: 20px;
            background-color: #f9f9f9;
        }

        .gallery img {
            width: 100%;
            height: auto;
            border-radius: 8px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease;
        }

        .gallery img:hover {
            transform: scale(1.05);
        }

        @media (max-width: 768px) {
            .gallery {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 480px) {
            .gallery {
                grid-template-columns: 1fr;
            }
        }