@media only screen and (max-width:1920px){}

@media only screen and (max-width:1880px){}

@media only screen and (max-width:1800px){}

@media only screen and (max-width:1728px){
    .portSlideWrapper {max-width: 1627px;width: 100%;}
}

@media only screen and (max-width:1680px){.portSlideWrapper {max-width: 1600px;width: 100%;}}

@media only screen and (max-width:1600px){.portSlideWrapper {max-width: 1560px;width: 100%;}}

@media only screen and (max-width:1536px){.portSlideWrapper {max-width: 1525px;width: 100%;}}

@media only screen and (max-width:1500px){}

@media only screen and (max-width:1440px){
    :root{
        --fs-base: 16px; /* Base Value: 16 */

        --fs-h1: 64px;
        --fs-56: 56px;
        --fs-48: 48px;
        --fs-40: 40px;
        --fs-32: 32px;
        --fs-24: 24px;
        --fs-body: 16px;
        --fs-body-sub: 14px;
        --fs-body-subSub: 12px;
        --fs-10: 10px;
    }

    .main-wrapper{max-width: calc(1340px - 60px);width:100%;margin:0 auto;}
    .wrapper1188{max-width: 1188px;width:100%;margin:0 auto;}
    .wrapper902{max-width: 902px;width:100%;margin:0 auto;}
    

    .header{padding: 1.13em 0;}
    .siteLogo{max-width: 112px;}
    .headMenu > nav > ul{display: flex; gap: 28px;}
    .headMenu > nav > ul > li a{color: var(--primary-05);font-size: var(--fs-body-subSub); text-transform: uppercase;}
    .comBtn{width: max-content; display: flex; gap: 8px; padding: 8px 16px; font-size: var(--fs-body-sub); background: var(--primary-gadient); float: left; font-family: var(--primary-font);transition: all .3s; line-height: 1.71; border-radius: 8px; color: var(--primary-02);}



    .psFooter{padding-top: 31px;}
    .psFooteBox1{max-width: 341px;width: 100%;}
    .psFooteBox2{max-width: 123px;width: 100%;}
    .psFootBox > h3{font-size: var(--fs-body-subSub); line-height: 2;}
    .psFootBox > ul > li > a{font-size: var(--fs-body-sub); }
    .psFootBox > ul > li:not(:last-child) {margin-bottom: 12px;}
    .psFooteBox3{max-width: 165px; width: 100%;}
    .psFooteBox3 .psCompanyLinks > li{display: flex; gap: 9px; align-items: center;}
    .psFootBox > .psCompanyLinks > li:not(:last-child) {margin-bottom: 16px;}
    .psFooteBox3 .psCompanyLinks > li > span{min-width: 10px;}
    .psFooteBox3 .psCompanyLinks > li > p{font-size: var(--fs-body-sub);}
    .psFooteBox4{max-width: 345px; width: 100%; height: max-content; padding: 21px 0 21px 24px;}
    .psFooteBox4 > h3{font-size: var(--fs-32); line-height: normal; margin-bottom: 0;}
    .psBottomFooter{border-top: 1px solid #5E5E5E; padding: 1.8em 0 2.37em; margin-top: 2.63em;}
    .psBottomFooter > p{text-align: center; color: var(--primary-02); font-size: var(--fs-10); line-height: 2.4;}

    .psHeroTxtInfo{padding-top: 5.125em;}
    .psHeroTxt{max-width: 639px; padding-top: 2.81em; padding-bottom: 2.625em;}
    .psHeroTxt > p{max-width: 442px; line-height: 25px;}
    .psHeroLogo{padding: 17px 0;}
    .heroLogoMarquee {padding: 0 0; max-width: 1280px; margin: auto;}

    .psEnergyInnov{padding: 58px 0;}
    .energyInnovHead {max-width: 418px;}

    .grid-wrapper{grid-template-columns: repeat(auto-fit, minmax(143px, 2fr));}

    .powerDevCardItem{max-width: 447px;width: 100%;}
    .powerDevCardItem:first-child .powerDevCardText {padding-right: 72px;}
    .powerDevCardText h3{padding-right: 25px;}

    .contactTxtBox{max-width: 550px;}
    .contactFormBox{max-width: 612px;}
    .psContactBtn{padding: 8px 33px;}

    .psAboutHeroSec .psHeroTxt{padding: 2.096em 0 3.21em;}

    .foundPartItemLogo{margin-bottom: 1em;}
    .foundPartText h3{margin-bottom: 24px;}
    .foundPartItemLogo{max-width: 80px;}
    .foundPartItem:last-child > .foundPartItemLogo{max-width: 99px;}
    .psEnergyAssetHead {margin: 1.857em auto 2.5em;}
    .psEnergyAssetHead h2{line-height: 1.25;}
    .energyFlowPic h3{font-size: 20px;}


    .solutionHeroSec .psHeroTxt{padding: 3.75em 0 4.81em;}

    .solProHead h2{line-height: 60px;}
    .projectInfoBOx ul li:hover .ourProImg img {scale: 1.4;opacity: 1;bottom: 20px;}

    .portSlideWrapper{max-width: 1360px;}
    
}

@media only screen and (max-width:1400px){}

@media only screen and (max-width:1366px){
    .psFooteBox1 {max-width: 300px; width: 100%;}
    .psFooteBox2 {max-width: 137px;width: 100%;}

    .powerDevCardItem:first-child .powerDevCardText {padding-right: 0px;}

    .portSlideWrapper {max-width: 1330px;}
}

@media only screen and (max-width:1365px){}

@media only screen and (max-width:1280px){
    .main-wrapper{padding: 0 30px;}

    .projectInfoBOx ul li:hover .ourProImg img { scale: 1.2; opacity: 1; bottom: 20px;}
    .proHeadDesk .proHeadLine {max-width: 260px;width: 100%;}

    .portSlideWrapper {max-width: 1260px;}
    .psPortSliderBox {margin-top: 3em;}
}

@media only screen and (max-width:1200px){
    :root {
        --fs-base: 16px; /* Base Value: 16 */

        --fs-h1: 58px;
        --fs-56: 52px;
        --fs-48: 44px;
        --fs-40: 36px;
        --fs-32: 30px;
        --fs-24: 22px;

        --fs-body: 16px;
        --fs-body-sub: 14px;
        --fs-body-subSub: 12px;
        --fs-10: 10px;
    }

    .psHeroTxt > p {max-width: 475px;}

    .techGallInfo{padding: 1.5em;}
    .grid-wrapper .middle .techGallInfo .psBottomTxt{padding: 0 20px;}

    .contactTxtBox {max-width: 40%;}
    .contactFormBox {max-width: 55%;}
}

@media only screen and (max-width:1180px){
    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(107px, 2fr));}

    .proHeadDesk{max-width: 700px;}
    .proHeadDesk .proHeadLine {max-width: 235px;width: 100%;}
    .ourProImg{max-width: 230px;}
    .projectInfoBOx ul li:not(:last-child) {margin-bottom: 30px;}

    .portSlideWrapper {max-width: 98%;}
}

@media only screen and (max-width:1100px){  
    .psFooteBox1{max-width: 25%;}
    .psFooteBox4{max-width: 35%;}


    .projectInfoBOx ul li{padding: 30px;}
    .proHeadDesk {max-width: 640px;}
    .ourProImg {max-width: 200px;}
    .driveEnergyHead {max-width: 363px;width: 100%;}
}

@media only screen and (max-width:1024px){
    :root {
        --fs-base: 16px; /* Base Value: 16 */

        --fs-h1: 52px;
        --fs-56: 46px;
        --fs-48: 38px;
        --fs-40: 32px;
        --fs-32: 26px;
        --fs-24: 18px;

        --fs-body: 16px;
        --fs-body-sub: 14px;
        --fs-body-subSub: 12px;
        --fs-10: 10px;
    }

    .energyInnovHead {max-width: 36%;}

    .powerDevCardItem:nth-child(1){padding-right: 35px;}
    .powerDevCardItem:nth-child(2){padding: 0 35px;}
    .powerDevCardItem:nth-child(3){padding-left: 53px;}

    .contactTxtBox {max-width: 45%;}
    .contactFormBox {max-width: 50%;}

    .proHeadDesk .proHeadLine {max-width: 196px;width: 100%;}
    .OurSolCardItem:not(:last-child) {padding-right: 30px;margin-right: 30px;}

    .grid-wrapper .textLogo, .grid-wrapper .wide .psBottomTxt, .grid-wrapper .tall .psBottomTxt{opacity: 1;}
}

@media only screen and (max-width:991px){
    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(80px, 2fr));}

    .projectInfoBOx ul{display: flex; justify-content: start; flex-wrap: wrap; gap: 30px;}
    .projectInfoBOx ul li {max-width: calc(50% - 20px); height: 100%; display: flex; flex-wrap: wrap; padding: 30px;}
    .projectInfoBOx ul li:not(:last-child) {margin-bottom: 0px;}
    .proHeadDesk{flex-wrap: wrap;}
    .proHeadDesk .proHeadText{padding: 10px 0 10px 0;border-left: none;}
    .ourProImg {max-width: 100%; margin-top: 20px;}
    .ourProImg img{opacity: 1; position: relative;}
    .ourProBtn{margin-left: 0;}
    .projectInfoBOx ul li:hover .ourProImg img { scale: 1; opacity: 1; bottom: 0px;}
    .ourProBtn { margin-left: 0; text-align: center; max-width: 100%; width: 100%; display: flex;justify-content: end; order: -3;}
    .ourProBtn a svg{max-width: 20px; height: auto;}
    .OurSolCardBox{flex-wrap: wrap; justify-content: space-between; gap: 15px;}
    .OurSolCardItem{max-width: calc(50% - 20px); width: 100%;}
    .OurSolCardItem{margin-right: 0; border:none; }
    .OurSolCardItem:not(:last-child) {padding-right: 0px; margin-right: 0px; border-right: none;}
    .OurSolCardItem:not(:nth-of-type(even)) {padding-right: 30px;margin-right: 0; border-right: 1px solid var(--border);}

    .driveEnergyHead {max-width: 306px;width: 100%;}
    .driveEnergyDisc{padding-left: 40px;}

   .proSlideText {bottom: 2em;opacity: 1;}
   .psProSlideItem:hover .proSlideText {bottom: 2em;opacity: 1;}
}

@media only screen and (max-width:950px){}

@media only screen and (max-width: 915px) {}

@media only screen and (max-width:820px){
    :root {
        --fs-base: 16px; /* Base Value: 16 */

        --fs-h1: 48px;
        --fs-56: 42px;
        --fs-48: 36px;
        --fs-40: 30px;
        --fs-32: 26px;
        --fs-24: 18px;

        --fs-body: 16px;
        --fs-body-sub: 14px;
        --fs-body-subSub: 12px;
        --fs-10: 10px;

        --secGap: 50px;
    }

    .wrapper902{padding: 0 30px;}

    .psFooterInfo {flex-wrap: wrap; row-gap: 20px;}
    .psFooteBox1, .psFooteBox2, .psFooteBox3{max-width: 32%;}
    .psFooteBox2{padding-left: 6%;}
    .psFooteBox4{max-width: 100%; border: none; padding-left: 0;}
    
    .psEnergyInnov {padding: 50px 0;}

    .energyInnovInfo{flex-wrap: wrap;}
    .energyInnovHead {max-width: 100%;}
    .energyInnovDesc {max-width: 100%; padding: 0; margin: 0; margin-top: 1.5em; border: none;}

    .grid-wrapper{grid-template-columns: repeat(auto-fit, minmax(90px, 2fr));}

    .powerDevCardBox {flex-wrap: wrap;}
    .powerDevCardBox{ row-gap: 30px;}
    .powerDevCardItem {max-width: calc(50% - 20px);width: 100%;}
    .powerDevCardItem:nth-child(1) {padding-right: 0px;}
    .powerDevCardItem:nth-child(2) {padding: 0px; border: none;}
    .powerDevCardItem:nth-child(3) {padding: 0px;}
    .powerDevCardImg{margin-bottom: 1.5em;}

    .psContactInfoBox{flex-wrap: wrap; gap: 30px;}
    .contactTxtBox{max-width: 53%;}
    .contactFormBox{max-width: 100%;}

    .psFoundPartInfo{padding: 50px 0;}
    .foundPartItem{padding: 1.5em;}
    .psEnergyAssetHead p{padding: 0;}
    .psEnergyAssetsItem{padding: 1.5em;}
    .foundPartItem{max-width: 100%;}
    .foundPartItem:not(:last-child){margin-bottom: 2em;}
    .psEnergyAssetsItem{max-width: 100%;}
    .psEnergyAssetsItem:not(:last-child){margin-bottom: 2em;}
    .energyFlowPic h3 {font-size: 18px;}
    .absliderImg {margin-bottom: 10px;}
    .aboutSliderItem h3{margin-bottom: 10px;}

    .projectInfoBOx ul li {padding: 20px;}

    .psOurSolCardSec {padding: 50px 0;}
    .psDriveEnergy{padding: 50px 0;}

    .psPortHeadBox h2{line-height: 50px;}
    .proSlideText{max-width: 95%; bottom: 1em;}
}


@media only screen and (max-width: 810px){
    .grid-wrapper .tall{grid-column: span 3; grid-row: span 1;}
    .grid-wrapper .wide{grid-column: span 4;}
    .grid-wrapper .middle{grid-column: span 7 !important;}
    .grid-wrapper .middle .techGallInfo{padding: 0;}
    .grid-wrapper .middle .techGallInfo .psBottomTxt{height: 100%;}
}

@media only screen and (max-width:768px){
    .psFooter{padding-top: 3.125em;}

    .OurSolCardBox{row-gap: 35px;}
    .driveEnergyInfoBox{flex-wrap: wrap;}
    .driveEnergyHead { max-width: 103%; width: 100%;}
    .driveEnergyDisc{padding-left: 0; margin-left: 0; margin-top: 35px; border: none;}
}

@media only screen and (max-width: 720px){}

@media only screen and (max-width: 700px){}


@media only screen and (max-width:610px){
    .main-wrapper{padding: 0 15px;}
    .wrapper902{padding: 0 15px;}

    .menuIcon,.menuClose,.showInHamMenu{display: block;}
    .menuIcon{margin: 0;}
    .hideInHamMenu{display: none;}
    .menuCont{opacity: 0;align-items: start;position: fixed;z-index: 99;background-color: #02171f;box-shadow: rgba(255, 255, 255, 0.24) 0px 3px 8px;top: 0;right: -9999px;flex-direction: column;height: 100%; min-height: 100vh; width: 100%;max-width: 300px;padding: 1em 1em 1em 2em; transition: all 0.5s;}
    .menuCont.active{opacity:1;right:0;}
    .menuSec{justify-content:end;display:flex;align-items:center;gap:2em;}
    .headMenu > nav > ul{flex-direction:column;margin-bottom:2em;margin-top:3em;}
    .headRgt{flex-flow:row wrap;}
    .headMenu > nav{margin: 0;}
    .headMenu > nav > ul {display: flex;gap: 15px; margin: 2em 0;}
    /* .headMenu > nav > ul > .active a{color: var(--primary-01);} */
    .menu-overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); z-index: 95;}

    .heroHomeVdo {z-index: -1; width: 155%; top: 50%; transform: translateY(-50%); right: 0;}

    .psFooterInfo > *{max-width: 100%;}
    .psFooteBox1,.psFooteBox2, .psFooteBox3{max-width: calc(49% - 1em);}
    .psFooteBox2{padding-left: 0;}
    .psFooteBox4{padding: 20px; max-width: calc(49% - 1em); border-left: 1px solid var(--border);}
    .psFooteBox3 .psCompanyLinks > li > span {padding-top: 0px;}

    .energyInnovHead h2{line-height: 50px;}

    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(80px, 2fr));}
    .grid-wrapper .tall {grid-column: span 7;grid-row: span 2;}
    .grid-wrapper .wide {grid-column: span 7;}

    .powerDevCardItem {max-width: 100%;width: 100%;}
    .contactTxtBox {max-width: 100%;}

    .psEcoText {margin-top: 1.5em;}

    .driveEnergyHead h2{line-height: 50px;}
    .psSolPortfolio{background-position: left;}
}

@media only screen and (max-width:575px){
    :root{
        --fs-base: 16px; /* Base Value: 16 */

        --fs-h1: 34px;
        --fs-56: 32px;
        --fs-48: 28px;
        --fs-40: 24px;
        --fs-32: 22px;
        --fs-24: 18px;
        --fs-body: 16px;
        --fs-body-sub: 14px;
        --fs-body-subSub: 12px;
        --fs-10: 10px;
    }

    .psFooterInfo {row-gap: 30px;}
    .psFooteBox1,.psFooteBox2, .psFooteBox3, .psFooteBox4{max-width: calc(50% - 1em);}
    .psFooteBox4{border-left: 1px solid var(--primary-02);}
    .psFootBox > .psCompanyLinks > li:not(:last-child) {margin-bottom: 12px;}
    .psBottomFooter{margin-top: 2em; padding: 1.5em 0;}

    .contactTxtBox h2{line-height: 40px;}

    .psFoundingHead {margin-bottom: 1.5em;}
}

@media only screen and (max-width:550px){
    .projectInfoBOx ul li{max-width: 100%;}
}

@media only screen and (max-width:500px){
    .psHeroBtn{flex-wrap: wrap; justify-content: center; gap: 20px;}
    .psFootLogo {max-width: 150px;}
    .psFooteBox1, .psFooteBox2, .psFooteBox3{max-width: 100%;}
    .psFooteBox4 {max-width: 100%; padding: 20px 0; border: none;}

    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(62px, 2fr));}
}

@media only screen and (max-width: 430px) {.grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(51px, 2fr));}}

@media only screen and (max-width:410px){
    
}

@media only screen and (max-width:400px){
    .psFooteBox1, .psFooteBox2, .psFooteBox3, .psFooteBox4 {max-width: 100%;}
    .psFootLogo {max-width: 160px;}
    .psFooteBox4{border: none; padding: 0;}

    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(26px, 2fr));}

    .contactFormBox{padding: 1.5em;}

    .solProHead h2 {line-height: 45px;}
    .ourProBtn a svg {max-width: 18px;height: auto;}
    .driveEnergyHead h2 {line-height: 40px;}
    .psPortHeadBox h2{line-height: 40px;}
}

@media only screen and (max-width:380px){
    
}


@media only screen and (max-width:360px){
    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(40px, 2fr));}

    .OurSolCardBox{flex-wrap: wrap;}
    .OurSolCardItem {max-width: 100%;width: 100%;}
    .OurSolCardItem:not(:nth-of-type(even)) {padding-right: 0px;margin-right: 0;border-right: none;}
}

@media only screen and (max-width:330px){
    .grid-wrapper {grid-template-columns: repeat(auto-fit, minmax(28px, 2fr));}
}