﻿@import url(../_external/fonts.googleapis.com/css2__family_Barlow_wght_300_400_500_700_800_900_family_IBM_Plex_Sans_wght_300_400_500.css);

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*, ::after, ::before {
    box-sizing: border-box;
}
 

body {
    margin: 0;
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    color: #3c3c3c;
    text-align: left;

}
.text-primaryHead {
    font-family: 'IBM Plex Sans', sans-serif !important;
    font-weight:700;
}
.txtPara {
    margin: 0;
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: #3c3c3c;
    text-align: left;
}
.txtBodytext {
    margin: 0;
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    color: #3c3c3c;
    text-align: left;
}
 
.Padding1 {
    padding: 1px;
}

.Padding2 {
    padding: 2px;
}

.Padding3 {
    padding: 3px;
}

.Padding4 {
    padding: 4px;
}

.Padding5 {
    padding: 5px;
}

.Padding6 {
    padding: 6px;
}

.Padding7 {
    padding: 7px;
}

.Padding8 {
    padding: 8px;
}

.Padding9 {
    padding: 9px;
}

.Padding10 {
    padding: 10px;
}

.Padding15 {
    padding: 15px;
}

.Padding20 {
    padding: 20px;
}

.Padding25 {
    padding: 25px;
}

.Padding30 {
    padding: 30px;
}

.Padding35 {
    padding: 35px;
}

.Padding40 {
    padding: 40px;
}

.Padding45 {
    padding: 45px;
}

.Padding50 {
    padding: 50px;
}

.Padding55 {
    padding: 55px;
}

.Padding60 {
    padding: 60px;
}

.Padding65 {
    padding: 65px;
}

.Padding70 {
    padding: 70px;
}

.Padding75 {
    padding: 75px;
}

.Padding80 {
    padding: 80px;
}

.Padding85 {
    padding: 85px;
}

.Padding90 {
    padding: 90px;
}

.Padding95 {
    padding: 95px;
}

.Padding100 {
    padding: 100px;
}

.padding5-15 {
    padding: 5% 18%;
}


.Padding5-20 {
    padding: 10px 15px;
    font-weight: 700;
}
.Padding20-20 {
    padding: 20px 15px;
    font-weight: 700;
}
.Padding5-20M15 {
    padding: 10px 30px;
}

.topP0 {
    padding-top: 0px !important;
}

.topP1 {
    padding-top: 1px;
}

.topP2 {
    padding-top: 2px;
}

.topP3 {
    padding-top: 3px;
}

.topP4 {
    padding-top: 4px;
}

.topP5 {
    padding-top: 5px;
}

.topP6 {
    padding-top: 6px;
}

.topP7 {
    padding-top: 7px;
}

.topP8 {
    padding-top: 8px;
}

.topP9 {
    padding-top: 9px;
}

.topP10 {
    padding-top: 10px;
}
.topP13 {
    padding-top: 13px;
}

.topP15 {
    padding-top: 15px;
}

.topP20 {
    padding-top: 20px;
}

.topP25 {
    padding-top: 25px;
}

.topP30 {
    padding-top: 30px;
}

.topP35 {
    padding-top: 35px;
}

.topP40 {
    padding-top: 40px;
}

.topP45 {
    padding-top: 45px;
}

.topP50 {
    padding-top: 50px;
}

.topP55 {
    padding-top: 55px;
}

.topP60 {
    padding-top: 60px;
}

.topP65 {
    padding-top: 65px;
}

.topP70 {
    padding-top: 70px;
}

.topP75 {
    padding-top: 75px;
}

.topP80 {
    padding-top: 80px !important;
}

.topP85 {
    padding-top: 85px;
}

.topP90 {
    padding-top: 90px;
}

.topP95 {
    padding-top: 95px;
}

.topP100 {
    padding-top: 100px;
}

.topP105 {
    padding-top: 105px;
}

.topP110 {
    padding-top: 110px;
}

.topP115 {
    padding-top: 115px;
}

.topP120 {
    padding-top: 120px;
}

.topP125 {
    padding-top: 125px;
}

.topP130 {
    padding-top: 130px;
}

.topP135 {
    padding-top: 135px;
}

.topP140 {
    padding-top: 140px;
}

.topP145 {
    padding-top: 145px;
}

.topP150 {
    padding-top: 150px;
}

.bottomP0 {
    padding-bottom: 0px;
}

.bottomP1 {
    padding-bottom: 1px;
}

.bottomP2 {
    padding-bottom: 2px;
}

.bottomP3 {
    padding-bottom: 3px;
}

.bottomP4 {
    padding-bottom: 4px;
}

.bottomP5 {
    padding-bottom: 5px;
}

.bottomP6 {
    padding-bottom: 6px;
}

.bottomP7 {
    padding-bottom: 7px;
}

.bottomP8 {
    padding-bottom: 8px;
}

.bottomP9 {
    padding-bottom: 9px;
}

.bottomP10 {
    padding-bottom: 10px;
}

.bottomP15 {
    padding-bottom: 15px;
}

.bottomP20 {
    padding-bottom: 20px;
}
.topP17 {
    padding-top: 18px;
}
.bottomP17 {
    padding-bottom: 18px;
}

.bottomP25 {
    padding-bottom: 25px;
}

.bottomP30 {
    padding-bottom: 30px;
}

.bottomP35 {
    padding-bottom: 35px;
}

.bottomP40 {
    padding-bottom: 40px;
}

.bottomP45 {
    padding-bottom: 45px;
}

.bottomP50 {
    padding-bottom: 50px;
}

.bottomP55 {
    padding-bottom: 55px;
}

.bottomP60 {
    padding-bottom: 60px;
}

.bottomP65 {
    padding-bottom: 65px;
}

.bottomP70 {
    padding-bottom: 70px;
}

.bottomP75 {
    padding-bottom: 75px;
}

.bottomP80 {
    padding-bottom: 80px;
}

.bottomP85 {
    padding-bottom: 85px;
}

.bottomP90 {
    padding-bottom: 90px;
}

.bottomP95 {
    padding-bottom: 95px;
}

.bottomP100 {
    padding-bottom: 100px;
}

.bottomP105 {
    padding-bottom: 105px;
}

.bottomP110 {
    padding-bottom: 110px;
}

.bottomP115 {
    padding-bottom: 115px;
}

.bottomP120 {
    padding-bottom: 120px;
}

.bottomP125 {
    padding-bottom: 125px;
}

.bottomP130 {
    padding-bottom: 130px;
}

.bottomP135 {
    padding-bottom: 135px;
}

.bottomP140 {
    padding-bottom: 140px;
}

.bottomP145 {
    padding-bottom: 145px;
}

.bottomP150 {
    padding-bottom: 150px;
}

.leftP0 {
    padding-left: 0px !important;
}

.leftP1 {
    padding-left: 1px;
}

.leftP2 {
    padding-left: 2px;
}

.leftP3 {
    padding-left: 3px !important;
}

.leftP4 {
    padding-left: 4px;
}

.leftP5 {
    padding-left: 5px;
}

.leftP6 {
    padding-left: 6px;
}

.leftP7 {
    padding-left: 7px;
}

.leftP8 {
    padding-left: 8px;
}

.leftP9 {
    padding-left: 9px;
}

.leftP10 {
    padding-left: 10px;
}

.leftP15 {
    padding-left: 15px;
}

.leftP20 {
    padding-left: 20px !important;
}

.leftP20M10 {
    padding-left: 20px !important;
}
.leftP30M20 {
    padding-left: 30px !important;
}

.leftP25 {
    padding-left: 25px;
}

.leftP30 {
    padding-left: 30px;
}

.leftP35 {
    padding-left: 35px;
}

.leftP40 {
    padding-left: 40px;
}

.leftP45 {
    padding-left: 45px;
}
.leftP45M30 {
    padding-left: 30px;
}
.leftP50 {
    padding-left: 50px;
}

.leftP55 {
    padding-left: 55px;
}

.leftP60 {
    padding-left: 60px;
}

.leftP65 {
    padding-left: 65px;
}

.leftP70 {
    padding-left: 70px;
}

.leftP75 {
    padding-left: 75px;
}

.leftP80 {
    padding-left: 80px;
}

.leftP85 {
    padding-left: 85px;
}

.leftP90 {
    padding-left: 90px;
}

.topP90I30B30 {
    padding-top: 90px;
}
.leftP95 {
    padding-left: 95px;
}

.leftP100, .leftP100I40 {
    padding-left: 100px;
}
 

.LeftMM80Per {
    margin-left: -80%;
}

.bottomMM15 {
    margin-bottom: -15px;
}

.topM1 {
    margin-top: -1px;
}

.LeftM80Per {
    margin-left: 80%;
}

.rightP0 {
    padding-right: 0px !important;
}

.rightP1 {
    padding-right: 1px;
}

.rightP2 {
    padding-right: 2px;
}

.rightP3 {
    padding-right: 3px !important;
}

.rightP4 {
    padding-right: 4px;
}

.rightP5 {
    padding-right: 5px;
}

.rightP6 {
    padding-right: 6px;
}

.rightP7 {
    padding-right: 7px;
}

.rightP8 {
    padding-right: 8px;
}

.rightP9 {
    padding-right: 9px;
}

.rightP10 {
    padding-right: 10px;
}
.rightP17 {
    padding-right: 17px;
}

.rightP15 {
    padding-right: 15px;
}

.rightP20 {
    padding-right: 20px;
}

.rightP25 {
    padding-right: 25px;
}

.rightP30 {
    padding-right: 30px;
}

.rightP35 {
    padding-right: 35px;
}

.rightP40 {
    padding-right: 40px !important;
}

.rightP45 {
    padding-right: 45px;
}

.rightP50 {
    padding-right: 50px;
}

.rightP55 {
    padding-right: 55px;
}

.rightP60 {
    padding-right: 60px;
}

.rightP65 {
    padding-right: 65px;
}

.rightP70 {
    padding-right: 70px;
}

.rightP75 {
    padding-right: 75px;
}

.rightP80 {
    padding-right: 80px;
}

.rightP85 {
    padding-right: 85px;
}

.rightP90 {
    padding-right: 90px;
}

.rightP95 {
    padding-right: 95px;
}
.valigncen{
    vertical-align:middle;
}
.rightP100, .rightP100I40 {
    padding-right: 100px;
}


.rightM10 {
    margin-right: 10px;
}


.width20px {
    width: 20px;
}

.width30px {
    width: 30px;
}

.width35px {
    width: 35px;
}
.width70px {
    width: 70px;
}
.width110px {
    width: 110px;
}
.width130px {
    width: 130px;
}
.width150px {
    width: 150px;
}

.leftP12Per {
    padding-left: 12%;
}

.width5per {
    width: 5%;
}

.width10per {
    width: 10%;
}

.width15per {
    width: 15%;
}

.width20per {
    width: 20%;
}

.width25per {
    width: 25%;
}

.width30per {
    width: 30%;
}

.width35per {
    width: 35%;
}

.width40per {
    width: 40%;
}

.width45per {
    width: 45%;
}

.width50per {
    width: 50%;
}

.width50px {
    width: 50px;
}

.width70px {
    width: 80px;
    position: relative;
    margin-right: 20px;
}
.width100px {
    width: 100px;
}

.width55per {
    width: 55%;
}

.width60per {
    width: 60%;
}

.width65per {
    width: 65%;
}

.width70per {
    width: 70%;
}

.width75per {
    width: 75%;
}

.width80per {
    width: 80%;
}

.width85per {
    width: 85%;
}

.width90per {
    width: 90%;
}

.width95per {
    width: 95%;
}

.width100per {
    width: 100%;
}


.height5per {
    height: 5%;
}

.height10per {
    height: 10%;
}

.height15per {
    height: 15%;
}

.height20per {
    height: 20%;
}

.height25per {
    height: 25%;
}

.height30per {
    height: 30%;
}

.height35per {
    height: 35%;
}

.height40per {
    height: 40%;
}

.height40px {
    height: 40px;
}


.height45per {
    height: 45%;
}

.height50per {
    height: 50%;
}

.height55per {
    height: 55%;
}

.height60per {
    height: 60%;
}

.height65per {
    height: 65%;
}

.height70per {
    height: 70%;
}

.height75per {
    height: 75%;
}

.height80per {
    height: 80%;
}

.height85per {
    height: 85%;
}

.height90per {
    height: 90%;
}

.height95per {
    height: 95%;
}

.height100per {
    height: 100%;
}

.row{
    margin:0px;
}
 

/********************  Display *************************/
.displayCo {
    display: block;
}

@media(max-width:1025px) {
    .displayCo {
        display: none;
    
        }
}

.displayIp {
    display: none;
}

@media(max-width:1025px) {
    .displayIp {
        display: block;
    }
}

.displayCoMo {
    display: block;
}

@media(max-width:769px) {
    .displayCoMo {
        display: none;
    }
}

@media(max-width:740px) {
    .displayCoMo {
        display: block;
    }
}

.displayIonly {
    display: none;
}
.displayHP {
    display: None;
}
@media(max-width:1025px) {
    .displayIonly {
        display: block;
    }
}

@media(max-width:740px) {
    .displayIonly {
        display: none;
    }
}
@media screen and (min-width: 1360px) and (max-width: 1380px) {
    .displayHP {
        display: block;
    }
}

.displayCoI {
    display: block;
}

@media(max-width:700px) {
    .displayCoI {
        display: none !important;
    }
}

.displayMOnly {
    display: none;
}

@media(max-width:700px) {
    .displayMOnly {
        display: block;
    }
}
.lrP140{
    padding:0px 140px;
}
.lrP155 {
    padding: 0px 155px;
}
.lrP200 {
    padding: 0px 200px;
}
.lrP30 {
    padding: 0px 30px;
}

img 
{
    width:100%;
}

.relative {
    position: relative;
}

.full_header {
    padding: 50px 100px;
}
.Slogo {
    max-width: 245px;
    padding-left:5px;
    width: 100%;
}
.BannerVideo {
    height: 100vh;
    object-fit: cover;
    width: 100%;
    overflow: hidden;
    object-position:center;
}

.BannerOver {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 7;
    opacity: 0.8;
    height: 100%;
    background-size: cover;
}
.side_menu .menu-lang {
    top: 9%;
}
    .side_menu .menu-lang a.active {
        color: #00ffff;
    }
    .side_menu .menu-lang a {
        font-size: 17px;
    }
        .side_menu {
    max-width: 380px;
}
    .side_menu .close-menu {
        right: 100px;
        top: 50px;
    }
        .side_menu .close-menu:hover {
            background: #08baba;
        }
    

.slides:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 7;
    background: linear-gradient(to right,rgb(14 14 14 / 50%),rgb(14 13 13 / 50%));
}

.newSec{
    padding-top:60px;
}


.BorBA {
    padding-top: 10px;
    width: 100px;
    border-bottom: solid 3px #4b4a4a;
}
 
.Prod:hover > div > .BorBA:after {

    transform: scaleX(1);
    transform-origin: 0% 50%;
    width: 100px;
}
 
 

/*Know More Button*/

 

.btn-arrow {
    position: relative;
    text-decoration: none;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #457a28;
}


a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: none;
    color: inherit;
}

/*------------Button-------------*/

.Innerbutton {
    display: inline-block;
    padding: 2px 15px;
    border-radius: 25px;
    color: #fff;
    font-size: 14px;
    letter-spacing: 2px;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin-right: 20px;
    font-weight:500;
    cursor:pointer;
    text-transform:uppercase;
     
}

    .Innerbutton:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #4b4a4a;
        border-radius: 25px;
        z-index: -2;
    }

    .Innerbutton:before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0%;
        height: 100%;
        background-color: #008fb3;
        transition: all 0.3s;
        border-radius: 25px;
        z-index: -1;
    }

    .Innerbutton:hover {
        color: #fff;
    }

        .Innerbutton:hover:before {
            width: 100%;
        }

.cta {
    position: relative;
    margin: auto;
    padding: 10px 15px;
    transition: all 0.2s ease;
    cursor:pointer;
}

    .cta:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        border-radius: 28px;
        background: rgba(0, 255, 255, 1);
        width: 30px;
        height: 30px;
        transition: all 0.3s ease;
    }

    .cta span {
        position: relative;
        font-size: 1.5vh;
        line-height: 1.5vh;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        vertical-align: top;
    }

    .cta svg {
        position: relative;
        top: -9px;
        margin-left: 10px;
        fill: none;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke: #111;
        stroke-width: 1;
        transform: translateX(-5px);
        transition: all 0.3s ease;
        width: 15px;
        height: 15px;
    }
  
.cta:hover:before {
    width: 100%;
    background: #00ffff;
}

    .cta:hover svg {
        transform: translateX(0);
    }

    .cta:active {
        transform: scale(0.96);
    }




.ctaBlack {
    position: relative;
    margin: auto;
    padding: 10px 15px;
    transition: all 0.2s ease;
    cursor: pointer;
}

    .ctaBlack:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        border-radius: 28px;
        background: #FFF;
        width: 30px;
        height: 28px;
        transition: all 0.3s ease;
    }

    .ctaBlack span {
        position: relative;
        font-size: 1.5vh;
        line-height: 1.5vh;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        vertical-align: top;
    }

    .ctaBlack svg {
        position: relative;
        top: -9px;
        margin-left: 10px;
        fill: none;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke: #111;
        stroke-width: 1;
        transform: translateX(-5px);
        transition: all 0.3s ease;
        width: 15px;
        height: 15px;
    }
 

.ctaBlack:hover:before {
    width: 100%;
    background: #FFF;
}

.ctaBlack:hover svg {
    transform: translateX(0);
}

.ctaBlack:active {
    transform: scale(0.96);
}




    .Newbtn {
        margin-top: 30px;
        position: relative;
        display: inline-block;
        width: 277px;
        height: 50px;
        font-size: 1em;
        font-weight: 500;
        line-height: 60px;
        text-align: center;
        background-color: transparent;
        cursor: pointer;
        text-decoration: none;
        font-weight: 900;
        font-size: 18px;
        letter-spacing: 0.045em;
    }

    .Newbtn svg {
        position: absolute;
        top: 0;
        left: 0;
    }

        .Newbtn svg rect {
            stroke-width: 2;
            stroke-dasharray: 353, 0;
            stroke-dashoffset: 0;
            -webkit-transition: all 600ms ease;
            transition: all 600ms ease;
        }

    .Newbtn span {
        background: #00ffff;
        background: #00ffff;
        background: #00ffff;
        background: #00ffff;
        filter: #00ffff;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: 500;
    }

    .Newbtn:hover svg rect {
        stroke-width: 2;
        stroke-dasharray: 196, 543;
        stroke-dashoffset: 437;
    }

/*font-face Weight*/

.weigh400 {
    font-weight: 400;
}

.weigh500 {
    font-weight: 500;
}

.weigh600 {
    font-weight: 600;
}

.weigh700 {
    font-weight: 700;
}

.weigh800 {
    font-weight: 800;
}

.weigh900 {
    font-weight: 900;
}


/*line Height*/
.line1{
    line-height:1rem;
}
.line12rem {
    line-height: 1.2rem;
}
.line14rem {
    line-height: 1.4rem;
}
.line15rem {
    line-height: 1.5rem;
}
.line16rem {
    line-height: 1.6rem;
}
.line17rem {
    line-height: 1.7rem;
}
.line1rem {
    line-height: 1rem;
}


.line0 {
    line-height: 0;
}

.line2rem {
    line-height: 2rem;
}
.line24px {
    line-height: 24px;
}

.line25rem {
    line-height: 2.5rem;
}

.line3rem {
    line-height: 3rem;
}

.line35rem {
    line-height: 3.5rem;
}

.line38rem {
    line-height: 3.8rem;
}

.line4rem {
    line-height: 4rem;
}

.line45rem {
    line-height: 4.5rem;
}

.line5rem {
    line-height: 5rem;
}

.line55rem {
    line-height: 5.5rem;
}

.line6rem {
    line-height: 6rem;
}

.line65rem {
    line-height: 6.5rem;
}

.line7rem {
    line-height: 7rem;
}


/*------------------TEXT CSS-------------------------*/
.BannerTit {
    position: absolute;
    bottom: 70px;
    font-family: 'Barlow', sans-serif;
    font-size: 2.1rem;
    font-weight: 600;
    line-height: 3.1rem;
    color: #ffffff;
    z-index: 8;
    letter-spacing: 5px;
    text-transform: uppercase;
    width: 100%;
    text-align: center;
}

.BannerTitLeft {
    position: absolute;
    bottom: 70px;
    font-family: 'Barlow', sans-serif;
    font-size: 5rem;
    font-weight: 600;
    line-height: 3.1rem;
    color: #ffffff;
    z-index: 8;
    letter-spacing: 5px;
    width: 100%;
    text-align: left;
    left:100px;
}

.txtmed {
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 1.49rem;
    font-weight: 400;
    line-height: 2.8rem;
    color: #4b4a4a;
    text-align: left;
}

.txtProdDesc {
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.2rem;
    color: #4b4a4a;
    text-align: left;
}


.HeadTit {
    position: relative;
    font-size: 6.5vh;
    font-weight: 600;
    line-height: 7.0vh;
    color: #4b4a4a;
    font-family: 'Barlow', sans-serif;
    text-transform: uppercase;
}

.HeadTitInnerPage {
    font-size: 2.1rem;
    font-weight: 500;
    line-height: 2.5rem;
    color: #4b4a4a;
    font-family: 'Barlow', sans-serif;
}


.font15px {
    font-size: 14px;
    line-height: 23px;
}
.font12px {
    font-size: 12px;
    line-height: 18px;
}
.font18px {
    font-size: 18px;
}
.font19px {
    font-size: 19px;
}

.colorOffWhite {
    color: #cacaca;
}


.txtDes {
    line-height: 18px;
    font-size: 12px;
}
 
.font1rem {
    font-size: 1rem;
}

.font13rem {
    font-size: 1.3rem;
}

.font15rem {
    font-size: 1.5rem;
}

.font18rem {
    font-size: 1.8rem;
}

.font2rem {
    font-size: 2rem;
}

.font23rem {
    font-size: 2.3rem;
}

.font25rem {
    font-size: 2.5rem;
}

.font28rem {
    font-size: 2.8rem;
}

.font3rem {
    font-size: 3rem;
}

.font35rem {
    font-size: 3.5rem;
}

.font4rem {
    font-size: 4rem;
}
   
.font45rem {
    font-size: 4.5rem;
}

.font5rem {
    font-size: 5rem;
}

.font55rem {
    font-size: 5.5rem;
}

.font6rem {
    font-size: 6rem;
}
.smallItalic {
    margin: 0;
    font-family: montserrat, sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    color: #3c3c3c;
    text-align: left;
    font-style: italic;
}
/*---------------------------*/

.line1rem {
    line-height: 1rem;
}
/*Alignment */

.text-right{
    text-align:right;
}
.text-center {
    text-align: center;
}

.text-centerMLeft {
    text-align: center;
}
@media(max-width:500px) {
    .text-centerMLeft {
        text-align: left;
    }
}
/*---------------------------*/


/*Max line */
.max5line {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.max3line {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.max2line {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.max7line {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
}

/*------------------------------------*/


/*Radius CSS*/
 
.radiusTLR10 {
    border-radius:10px 10px 0px 0px;
}
.radiusBLR10 {
    border-radius: 0px 0px 10px 10px;
}
.radiusTBL10 {
    border-radius: 10px 0px 0px 10px;
}

.radiusTL10R50 {
    border-radius: 10px 50px 0px 0px;
}

.radiusBL10R50 {
    border-radius: 0px 0px 50px 10px;
}

.radius10 {
    border-radius: 10px;
}

/*-------------------BG Color----------*/
.bgGrey {
    background: radial-gradient(circle at center center, #ffff, #ededed);
}
.bgimg {
    background:#e5e9e8;
}

.bgBlack {
    background: #272626;
}
.bgDarkGrey {
    background: #ededed;
}

.bgFGrey {
    background-color: #f5f5f5;
}

.bgYellow {
    background-color: #ffcb0a;
}

.bgHowWeHelp {
    position: relative;
    min-height: 500px;
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 50%); /* Adjust the opacity by changing the last value (0.5) */
    z-index: 1; /* Adjust the z-index if needed */
}

.bg-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
    opacity: 0.7;
}

.content-overlay {
    position: relative;
    z-index: 1;
}
/*-------------------Font Color----------*/
 
.FontBlack {
    color: #3c3c3c;
}
.ColorW, .FontWhite {
    color: #fff;
}


.colorGray {
    color: #808080;
}





.col-5th,
.col-sm-5th,
.col-md-5th,
.col-lg-5th,
.col-xl-5th {
    position: relative;
    width: 100%;
    min-height: 1px;
    text-align: left;
    padding:30px 15px;
}


@media (max-width: 540px) {
    .col-sm-5th {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50% !important;
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
}
@media (min-width: 720px) {
    .col-md-5th {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33%;
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }
}


@media (min-width: 960px) {
    .col-lg-5th {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (min-width: 1140px) {
    .col-xl-5th {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        max-width: 20%;
    }
}
 
.grayscale img {
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}
.grayscale:hover img {
    filter: none;
    -webkit-filter: grayscale(0%);
}

.readmore {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.text-uppercase{
    text-transform:uppercase;
}
.col-centered {
    float: none;
    margin: 0 auto;
}

/*-------Border------------*/
.borLGray1 {
    border-left: 1px solid #cccccc;
    height: 85%;
}

.borRGray1 {
    border-right: 1px solid #cccccc;
    height: 85%;
}
.borBlkR1 {
    border-right: 1px solid #457a28;
    height: 85%;
}
.radiusTL10R10 {
    border-radius: 10px 10px 0px 0px;
}
   
a {
    text-decoration: none !important;
    cursor:pointer !important;
}
     
.preloader-container {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    overflow-y: scroll;
    position: fixed;
    z-index: 9000;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #000;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    -webkit-transition: all 1s linear;
    -o-transition: all 1s linear;
    transition: all 1s linear;
}

    .preloader-container .animation {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        .preloader-container .animation #skip {
            color: #20495a;
            cursor: pointer;
            font-family: montserrat, sans-serif;
            font-size: 1.75em;
            position: absolute;
            margin: 0 auto;
            bottom: 20vh;
        }

.hidden {
    display: none;
}

.visuallyhidden {
    opacity: 0;
}
 

 
.card {
     
    text-align: center;
    background-color: #fff;
    border-radius: 10px;
    cursor: pointer;
}

  

    .card .content {
        width: 100%;
        height: 100%;
        position: relative;
        overflow: hidden;
    }

        .card .content .back {
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: #fff;
            transition: 0.5s;
            z-index: 1;
            padding: 30px 20px;
            border-radius: 10px;
        }
.from-right {
    top: 0%;
    right: -100%;
}

 

.card:hover .content .from-right {
    right: 0;
}
.width20vh {
    width: 17vh;
}

.zeroBG {
    background: #404040;
    background-repeat: no-repeat;
    background-size: cover;
} 
  
.box {
    background-color: #efefef;
    border-radius: 10px;
    border: 1px solid #cecdcd;
}


.box:hover {
    background-color: #70b928;
    color: #fff;
    transition: 0.5s;
}
        .box:hover .borTG5 {
            border-color: #ffcb0a;
            transition: 0.5s;

        }
        .box:hover .anch {
            color: #fff;
        }



.Testbox {
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #cecdcd;
    transition: box-shadow .3s;
    height: 100%;
}
 
.TestTit {
   /* filter: url(filters.svg#grayscale);
    filter: gray;
    -webkit-filter: grayscale(1);*/
}
.Testbox:hover .TestTit {
    filter: none;
    -webkit-filter: none;
}
.Testbox:hover {
    box-shadow: 0 0 11px rgba(33,33,33,.2);
}
.quotIcon {
    filter: url(filters.svg#grayscale);
    filter: gray;
    -webkit-filter: grayscale(1);
}
.Testbox:hover .quotIcon {
        filter: none;
        -webkit-filter: none;
    }

    .Testbox:hover .TestTit .icon {
        transition: all 1.5s ease;
        transform: scale(1.4);
         
    }

    .Testbox .TestTit .icon {
        transition: all 1.5s ease;
        transform: scale(1);
    }
 
.TestboxShadow {
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #cecdcd;
    transition: box-shadow .3s;
}
   
    .TestboxShadow:hover .TestTit {
        filter: none;
        -webkit-filter: none;
    }
    .TestboxShadow:hover {
        box-shadow: inset gray 0px 0px 25px -12px;
    }
      
         
 
.borBGrey1 {
    border-bottom: 1px solid #cccccc;
}

.borBlk5 {
    border: 5px solid #000;
}
 

.borBGrey1 {
    border-bottom: 1px solid #cccccc;
}

.borBlk5 {
    border: 5px solid #000;
}
.botRIcon > img {
    text-align: right;
    width: 70px;
    margin-right: 30px;
    margin-top: -40px;
}
.ImgReach {
    background-image: url('../img/ReachUs/Work_with_us.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;  
    min-height: 400px;
}
.ImgVision {
    background-image: url('../img/GetToKnowUs/Vision_&_Mission.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Parallax Effect for DIV 3 */
    min-height: 400px;
}
.ImgAccolades {
    background-image: url('../img/GetToKnowUs/Accolades_bg.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Parallax Effect for DIV 3 */
    min-height: 400px;
}
.height400{
    height:400px;
}
.borTWhite {
    border-top: 3px solid #fff;
}
 

.letter5px {
    letter-spacing: 5px;
}
.letter1px {
    letter-spacing: 1px;
}
 

.bgDarkGrey {
    background-color: #ededed
}

.borTBlitGreen2 {
    border-bottom: 2px solid #70b928;
    border-top: 2px solid #70b928;
}
.waterSer {
    background-image: url('../../assets/img/GetToKnowUs/Distinct_bg.svg');
    background-size: 30%;
    background-position: bottom right;
    background-repeat: no-repeat;
    /*//background-attachment: fixed;*/
}
.nogrey {
    filter: none !important;
    -webkit-filter: grayscale(0) !important;
}
   

.card-body {
    padding:0px 0px 30px 35px;
}
.side_menu .menu-list li ul li a {
    font-size: 2vh;
    padding-left:15px;
    line-height:2.5vh;
    padding:3px 0px;
    padding-left:10px;
}
.side_menu .menu-list {
    max-height: 80vh;
    top: 15vh;
}
    .side_menu .menu-list li {
        margin-top: 3vh;
    }
.side_menu.dark_s_menu .menu-list li:hover > a, .side_menu.dark_s_menu .menu-list li.active > a, .side_menu.dark_s_menu .menu-list li ul li a:hover {
    color: #08baba;
}
    .side_menu.dark_s_menu .menu-list li:hover > a i, .side_menu.dark_s_menu .menu-list li.active > a i {
        color: #08baba;
    }

.boxiconzoom img {
    transition: all 1.5s ease;
    transform: scale(1);
}


.boxiconzoom:hover img {
    transition: all 1.5s ease;
    transform: scale(1.2);
}
.topM0{
    margin-top:0px;
}
.type1{
    margin-top:15px;
}
.topM-1 {
    margin-top: -1%;
}
select.form-control:not([size]):not([multiple]){
    height:40px;
}

.buttonBtn {
    display: inline-block;
    padding: 0.5rem 1.5rem;
    border-radius: 10rem;
    color: #fff;
    text-transform: uppercase;
    font-size: 1rem;
    letter-spacing: 0.15rem;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

    .buttonBtn:after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #70b928;
        border-radius: 10rem;
        z-index: -2;
        color: #757575;
    }

    .buttonBtn:before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0%;
        height: 100%;
        background-color: #ffcb0a;
        transition: all 0.3s;
        border-radius: 10rem;
        z-index: -1;
    }

    .buttonBtn:hover {
        color: #fff;
    }

        .buttonBtn:hover:before {
            width: 100%;
        }

.textbox {
    background: #efefef none repeat scroll 0 0;
    border: 2px solid #dbdbdb;
    margin-bottom: 10px;
    padding: 7px 16px;
    width: 100%;
    border-radius: 10px;
}

.boxPro {
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #cecdcd;
}
   
 
.close-container {
    cursor: pointer;
} 

.close {
    position: absolute;
    right: 6vh;
    top: 0;
}

    /*.close:hover .leftright {
        transform: rotate(-45deg);
        background-color: #426835;
    }

.close:hover .rightleft {
    transform: rotate(45deg);
    background-color: #426835;
}

    .close:hover label {
        opacity: 1;
    }*/
/**/
.close-btn {
    position: absolute;
    transition: transform .25s, opacity .25s;
    opacity: .7;
    cursor: pointer;
    font-size: 2em;
    font-family: serif;
    line-height: 1;
    right: 1.8vh;
    top: 0.47vh;
    z-index:9;
}

    .close-btn:before {
        content: "\d7";
    }

    .close-btn:hover {
        opacity: 1;
        transform: rotate(90deg);
        overflow:hidden;
    }
.cursor{
    cursor:pointer;
}
.SameerImg, .JigishImg, .JaxayImg .RuchiImg {
    transition: ease-in all 0.5s;
}
.SameerImg:hover img {
    content: url(../_external/www.savvygreens.in/assets/img/GetToKnowUs/Sameer_Sinha_1.png);
    transition: background-image 3s;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    transition: ease-in all 0.5s;
}
.JigishImg:hover img {
    content: url(../_external/www.savvygreens.in/assets/img/GetToKnowUs/Jigish_Shah_1.png);
    transition: background-image 3s;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    transition: ease-in all 0.5s;
}
.JaxayImg:hover img {
    content: url(../_external/www.savvygreens.in/assets/img/GetToKnowUs/Jaxay_Shah_1.png);
    transition: background-image 3s;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    transition: ease-in all 0.5s;
}
.RuchiImg:hover img {
    content: url(../_external/www.savvygreens.in/assets/img/GetToKnowUs/Ruchi_GandhiA.png);
    transition: background-image 3s;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    transition: ease-in all 0.5s;
}
.viewProf {
    transition: color .3s ease-in-out, box-shadow .3s ease-in-out;
}

.SameerImg:hover .viewProf, .JigishImg:hover .viewProf, .JaxayImg:hover .viewProf, .RuchiImg:hover .viewProf {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding-left: 20px;
    transition: ease-in all 0.5s;
    box-shadow: inset 500px 0 0 0 #70b928;
    color: white;
}
.w3-modal {
    z-index: 3;
    padding-top: 20px;
    position: fixed;
    width: 100%;
    margin: 0;
    height: 100%;
    overflow: hidden
}
.w3-btn, .w3-button {
    padding: 0px 22px;
    color: #fff;
    background: #457a28;
}
.w3-xlarge {
    font-size: 40px !important;
}
.w3-hover-red:hover {
    padding: 0px 22px;
    color: #fff;
    background: #ffcb0a !important;
}
@media (min-width: 993px) {
    .w3-modal-content {
        height: 100%;
        width: max-content;
        width: fit-content;
        background-color: rgba(255,255,255,0);
    }
}


.circle-btn.effect-2 .icon {
    display: block;
    position: relative;
    transition: all 0.4s 0.1s;
    transform-origin: 50% 0%;
    transform-style: preserve-3d;
}

    .circle-btn.effect-2 .icon::after {
        content: "";
        font-family: FontAwesome;
        color: #457a28;
        display: block;
        position: absolute;
        left: 0;
        height: 100%;
        width: 100%;
        top: 0;
        transform-origin: 50% 0;
        transform: translate3d(0px, 105%, 0px) rotateX(-90deg);
    }

.circle-btn.effect-2:hover .icon {
    transform: translate3d(0px, 0px, -30px) rotateX(90deg);
}

.circle-btn:hover .icon {
    color: #70b928;
}
.leftBottom {
    position: fixed;
    left: 25px;
    bottom: 50px;
    z-index: 99999;
}

.rightBottom {
    position: fixed;
    right: 25px;
    bottom: 50px;
    z-index: 99999;
}

.circle-btn {
    cursor: pointer;
    display: block;
    position: relative;
    width: 50px;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
}
.circle-bg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.circle-btn>.icon {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    font-size: 20px;
    width: 100%;
    height: 100%;
    color: #028a8a;
    text-align: center;
    line-height: 50px;
    transition: color 0.2s ease-in;
}

.circle-btn.effect-2 .icon {
    display: block;
    position: relative;
    transition: all 0.4s 0.1s;
    transform-origin: 50% 0%;
    transform-style: preserve-3d;
}

    .circle-btn.effect-2 .icon::after {
        content: "";
        font-family: FontAwesome;
        color: #2196f3;
        display: block;
        position: absolute;
        left: 0;
        height: 100%;
        width: 100%;
        top: 0;
        transform-origin: 50% 0;
        transform: translate3d(0px, 105%, 0px) rotateX(-90deg);
    }

.circle-btn.effect-2:hover .icon {
    transform: translate3d(0px, 0px, -30px) rotateX(90deg);
}

.circle-btn:hover .icon {
    color: #028a8a;
}

.circle-bg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    display: block;
}
 

/* CIRCLE BTN 1 */
.circle-btn.btn-1 .circle-bg {
    border-radius: 50%;
    transition: background 0.5s linear;
    border: 2px solid #028a8a;
    backface-visibility: hidden;
}

.circle-btn.btn-1:hover .circle-bg {
    border-color: transparent;
    background: transparent;
    animation: circleround cubic-bezier(0.17, 0.13, 0.28, 1) 1s;
    animation-fill-mode: forwards;
    border-right-color: #028a8a;
    border-bottom-color: #028a8a;
}

/* CIRCLE BTN 2 */
.circle-btn.btn-2 .icon {
    color: #70b928;
}

.circle-btn.btn-2:hover .icon {
    animation: arrowmove 0.75s ease-in-out;
    animation-fill-mode: forwards;
}

.circle-btn.btn-2 .circle-bg::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 76px;
    height: 76px;
    border-radius: 100%;
    background: #70b928;
}

.circle-btn.btn-2 .circle-bg span {
    position: absolute;
    width: 50%;
    height: 100%;
    overflow: hidden;
}

    .circle-btn.btn-2 .circle-bg span em {
        position: absolute;
        border-radius: 999px;
        width: 100%;
        height: 100%;
        background: #70b928;
        transition: transform 0.25s linear;
    }

    .circle-btn.btn-2 .circle-bg span:first-child {
        left: 0%;
    }

        .circle-btn.btn-2 .circle-bg span:first-child em {
            left: 100%;
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
            transform-origin: 0% 50%;
        }

    .circle-btn.btn-2 .circle-bg span:last-child {
        left: 50%;
    }

        .circle-btn.btn-2 .circle-bg span:last-child em {
            left: -100%;
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
            transform-origin: 100% 50%;
            transition-delay: 0.25s;
        }

.circle-btn.btn-2:hover .circle1 span:first-child em,
.circle-btn.btn-2:hover .circle-bg span:first-child em {
    transform: rotate(-180deg);
    transition: transform 0.5s ease-out;
    transition-delay: 0.25s;
}

.circle-btn.btn-2:hover .circle1 span:last-child em,
.circle-btn.btn-2:hover .circle-bg span:last-child em {
    transform: rotate(-180deg);
    transition: transform 0.25s ease-in-out;
    
}

@keyframes circleround {
    0% {
        transform: rotate(-90deg);
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    100% {
        transform: rotate(360deg);
        opacity: 0;
    }
}

@keyframes arrowmove {
    0% {
        top: 2px;
    }

    100% {
        top: -3px;
    }
}
#back-to-top{
    display:none;
}
.disnone {
    display: none;
}
#WhatsappClose{
    position:absolute;
    right:10px;
    top:10px;
}
.bgPdf {
    background-image: url(../../assets/img/Projects/Residential.svg);
    background-size: contain;
    background-position: center;
    height: 150%;
    background-repeat: no-repeat;
    margin-top: -10%;
    margin-bottom: -10%;
}

.bgPdfind {
    background-image: url(../../assets/img/Projects/Industrial.svg);
    background-size: contain;
    background-position: center;
    height: 150%;
    background-repeat: no-repeat;
    margin-top: -10%;
    margin-bottom: -10%;
}

.bgPdfCom {
    background-image: url(../../assets/img/Projects/Commercial.svg);
    background-size: contain;
    background-position: center;
    height: 150%;
    background-repeat: no-repeat;
    margin-top: -10%;
    margin-bottom: -10%;
}

.read:hover .arrow {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    filter: none;
    -webkit-filter: grayscale(0%);
    -webkit-transition: opacity 1s, -webkit-transform 1s;
    transition: opacity 1s, transform 1s;
}
.read .arrow {
     -webkit-transform: scale(1);
    transform: scale(1);
    filter: gray;
    -webkit-filter: grayscale(100%);
    -webkit-transition: opacity 1s, -webkit-transform 1s;
    transition: opacity 1s, transform 1s;
    
}
.topP20I0{
    padding-top:20px;
}
.width100perM60{
    width:100%;
}
.full_header .float-right .bar_menu {
   background: #00ffff;
    opacity: 1;
}
    .full_header .float-right .bar_menu i {
        color: #000;
        font-size: 22px;
        line-height: 38px;
        display: inline-block;
    }
    .full_header .float-right .bar_menu:hover {
        background: #08baba;
    }


.fa-user:before {
    font-size:22px;
}

.topP60I0{
    padding-top:60px;
}
.leftP100I45{
    padding-left:100px;
}
.bottomP30I10{
    padding-bottom:30px;
}
.leftP30I0{
    padding-left:30px;
}
.topP0I20{
    padding-top:0px;
}
.width100perI30{
    width:100%;
}
.height80pxI200{
    height:80px;
}
.topP80I20{
   padding-top:60px;
}
.ArightILeft{
    text-align:right;
}
.ArightMLeft {
    text-align: right;
}
.bottomP20I0{
    padding-bottom:20px;
}
.topP20M10{
    padding-top:20px;
}
.topP60M0{
    padding-top:60px;
}

.leftP8M0 {
    padding-left: 8px !important;
}
.rightP20M0{
    padding-right:20px;
}
.bottomP0M20{
    padding-bottom:20px;
}
.leftP15I0{
    padding-left:15px;
}
.topP80M20{
    padding-top:80px;
}
.bottomP80M20 {
    padding-bottom: 80px;
}
.Padding20I10{
    padding:20px;
}
.marginP0M60 {
    margin-top: 0px;
}
.leftP0M15
{
    padding-left:0px;
}
.rightP0M15 {
    padding-right: 0px;
}
.leftP30I0 {
    padding-left: 30px;
}
.bottomP100I60 {
    padding-bottom: 100px;
}

.topP6030{
    padding-top:60px;
}
.rightP30I0{
    padding-right:30px;
}
.Padding10I0{
    padding:10px;
}
.leftP60M15{
    padding-left:60px;
}
.marLM15{
    margin-left:0px;
}
.topP0I30{
    padding-top:0px;
}
.leftP40M0{
    padding-left:40px;
}
.leftP50M20
{
    padding-left:50px;
}
.rightP50M20 {
    padding-right: 50px;
}
.Padding30M10{
    padding:30px;
}
.bottomP20M10{
    padding-bottom:20px;
}
.leftP50M30{
    padding-left:50px;
}
 
.TestboxShadow:hover .borTRLY5 {
    width: 80%;
    opacity: 1;
}
.ACentILeft{
    text-align:center;
}
.rightP15I0{
    padding-right:15px;
}
.topP50I0{
    padding-top:50px;
}
.leftP50I0 {
    padding-left: 50px;
}
.bottomP50I0 {
    padding-bottom: 50px;
}
.width70perI50Per{
    width:70%;
}
.topP30I0{
    padding-top:30px;
}
.topP30M15 {
    padding-top: 30px;
}
.topP60I30{
    padding-top:60px;
}
.leftP20I10{
    padding-left:20px;
}
.topP30M0 {
    padding-top:30px;
}


.dis {
    display: block !important;
    -webkit-animation: translate-left-out 0.5s 1 cubic-bezier(0.7, 0, 0.3, 1);
    animation: translate-left-out 0.5s 1 cubic-bezier(0.7, 0, 0.3, 1);
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
}

@-webkit-keyframes translate-left-out {
    0% {
        -webkit-transform: translateX(-5%);
    }

    100% {
        -webkit-transform: translateX(0%);
    }
}

@keyframes translate-left-out {
    0% {
        transform: translateX(-5%);
    }

    100% {
        transform: translateX(0%);
    }
}
.topP0M30{
    padding-top:0px;
}
.width50I100{
    width:50%;
}
.leftP0I20{
padding-left:0px;
}
 
.topP5I15{
    padding-top:5px;
}
.bottomP5I15 {
    padding-bottom: 5px;
}
.topP5I0{
    padding-top:5px;
}
.leftP0I15{
    padding-left:0px;
}
.width35perI50{
    width:35%;
}
.topP20I10{
    padding-top:20px;
}
.bottomP20I10 {
    padding-bottom: 20px;
}
.leftP15I30{
    padding-left:0px;
}
.leftM-15I15 {
    margin-left: -15px;
}
.topP10M30{
    padding-top:10px;
}
.Mar-T1I15{
    margin-top:-1%;
}

.leftP20M0{
    padding-left:20px;
}
.marT20I0{
    margin-bottom:20px;
}
.topP10I30{
    padding-top:10px;
}
.width94M100Per{
    width:94%;
}
.borRGray1I0MB1 {
    border-right: 1px solid #cccccc;
}
.borLGray1MT1 {
    border-left: 1px solid #cccccc;
}
.topP0M10{
    padding-top:0px;
}
.topP0I30M10{
    padding-top:0px;
}
.bgWhite {
    background: #fff;
}
 
.topP30I20{
    padding-top:30px;
}
.aboutimg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 85%;
}
.width80perI100 {
    width: 80%;
}
 

/*Tabbed*/
#collapse-A, #collapse-B, #collapse-C {
    background: #fff;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


@media(min-width:768px) {
    .card1 {
        border: none;
    }

         .card1 .card-header {
            display: none;
        }

       .card1 .collapse {
            display: block;
        }
}

@media(max-width:767px) {

    .nav-tabs {
        display: none;
    }

    .tab-content > .tab-pane {
        display: block !important;
        opacity: 1;
    }
}
.noradis{
    border-radius:0px;
}
.nav-tabs .nav-link{
    border:0px solid;
}
.bortRad10 {
    border: 2px solid #70b928;
    border-top: 4px solid #70b928;
    border-bottom-left-radius: 10px; 
    border-bottom-right-radius: 10px;
}
#pane-A, #pane-B, #pane-C {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.nav-item {
    border: 1px solid #70b928;
    width: 23%;
}
    .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active  {
        border: 0px solid #70b928;
        background-color: #70b928 !important;
        color: #fff;
        border-radius: 0px;
    }
    .text-left{
        text-align:left;
    }
    .leftP0T{
        padding-left:0px !important;
    }
 
.marginminP5M5I10px {
    margin-top: -3px;
}
.lrP60I0 {
    padding: 0px 60px;
}
.lrP80I0 {
    padding: 0px 80px;
}
.lrP20 {
    padding: 0px 20px;
}
 
.colorlitGreen {
    color: #70b928;
}
.colorbodyFont {
    color: #3c3c3c;
}
 
.width25px{
    width:25px
}

.width250px {
    max-width: 350px
}



.width50px {
    width: 50px
}

/*button CSS*/
 
 
.Inpop{
    text-align:justify;
}
.bwtocolor {
    -webkit-transition: all .2s ease-in-out;
    border: 1px solid #909090;
}

    .bwtocolor:hover {
        /* border: 0px solid #909090 !important; */
        -webkit-transform: scale(1.20);
    }
.coloraqua {
    color:#00ffff
}
.colordarkaqua {
    color: #08baba
}
.bgaqua {
    background: #00ffff;
}

.bgMembership {
    /*background-image: url(../img/Home/Membership.jpg);*/
    min-height: 420px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background: #0f0f0f;
}
.bgLogin {
    background-image: url(../img/Home/LAB_TESTING.jpg);
    min-height: 430px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.bgLabMembership {
    background-image: url(../img/Lab-Membership/bgImg.jpg);
    min-height: 350px;
    background-attachment: fixed;
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
}

.bgAbout {
    background-image: url(../img/AboutUs/OurValueBg.jpg);
    min-height: 400px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: multiply;
}
.bgOurvalue {
    background-image: url(../img/AboutUs/OurValueBg.jpg);
    min-height: 500px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.width30px {
    width: 25px;
    margin-top: -6px;
}
.borTB{
    border-top:1px solid #000;
}
.borTGrey1 {
    border-top: 1px solid #cccccc;
}
.TestLogo {
    width: 140px;
    margin-left: -4px;
    padding-bottom:15px;
}
.icon2 {
    position: absolute;
    top: 0;
    left: -25px;
    z-index: 2;
    font-size: 20px;
    width: 60px;
    height: 100%;
    color: #028a8a;
    text-align: left;
    line-height: 50px;
    transition: color 0.2s ease-in;
    transform: rotate(180deg);
}
.FooterLink {
    background-image: linear-gradient(to right, #005574, #005574 50%, #000 50%);
    background-size: 200% 100%;
    background-position: -100%;
    display: inline-block;
    padding: 0px 0;
    position: relative;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: all 0.3s ease-in-out;
    margin-bottom: 2px;
    font-size: 15px;
    line-height: 24px;
    font-weight:400;
}

.FooterLink:before {
    content: "";
    background: #54b3d6;
    display: block;
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 3px;
    transition: all 0.3s ease-in-out;
}

    .FooterLink:hover {
        background-position: 0;
    }

        .FooterLink:hover::before {
            width: 100%;
        }

 h1{
     margin:0px;
 }
.Footertext {
    font-weight: 400;
    font-size: 3.5rem;
    line-height:4.5rem;
    font-family: 'Monoton', serif;
    text-align: center;
    background-color: transparent;
    background-image: linear-gradient(180deg, rgba(0, 199, 200, 1) 19%,rgba(48, 144, 179, 1) 30%, rgba(48, 102, 165, 1) 39%, rgba(49, 66, 154, 1) 49%, rgba(134, 56, 134, 1) 75%, rgba(185, 51, 123, 1) 100%, rgba(229, 47, 114, 1) 110%);
    background-repeat: 'no-repeat';
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: all 0.3s ease-in;
}
.imgcontainer1 {
    position: relative;
    text-align: center;
    color: white;
    background: black;
}
    .imgcontainer1 > img {
        object-fit: cover;
        opacity: 0.6;
    }
    .imgcontainer1 > video {
        opacity: 0.3;
    }
    .imgcontainer1> p {
        opacity: 0.3;
    }
     


.bgGovermet {
    background-color: #FBB917 !important;
}
.colorGovermet {
    color: #FBB917 !important;
}
.bgDefence {
    background-color: #5B7742 !important;
}
.colorDefence {
    color: #5B7742 !important;
}
.bgAero-Space {
    background-color: #8784db !important;
}
.colorAero-Space {
    color: #8784db !important;
}

.bgOil {
    background-color: #EB5E00 !important;
}
.colorOil {
    color: #EB5E00 !important;
}
.bgAir {
    background-color: #707070 !important;
}
.colorAir {
    color: #707070 !important;
}

.bgWater {
    background-color: #00c7c8 !important;
}
.colorWater {
    color: #00c7c8 !important;
}

.bgPharma {
    background-color: #BB2693 !important;
}
.colorPharma {
    color: #BB2693 !important;
}

.bgTextile {
    background-color: #EE779D !important;
}
.colorTextile {
    color: #EE779D !important;
}

.bgEnergy {
    background-color: #3EA055 !important;
}
.colorEnergy {
    color: #3EA055 !important;
}


.bgChemical {
    background-color: #8833AA !important;
}
.colorChemical {
    color: #8833AA !important;
}

.bgPacking {
    background-color: #cb8962 !important;
}
.colorPacking {
    color: #cb8962 !important;
}

.bgHygin {
    background-color: #F97272 !important;
}
.colorHygin {
    color: #F97272 !important;
}



.Gov.ctaBlack:before {
    background: #FBB917;
}

.Gov.ctaBlack:hover:before {
    background: #FBB917;
}

.Def.ctaBlack:before {
    background: #5B7742;
}

.Def.ctaBlack:hover:before {
    background: #5B7742;
}

.Aero.ctaBlack:before {
    background: #8784db;
}

.Aero.ctaBlack:hover:before {
    background: #8784db;
}

.Oil.ctaBlack:before {
    background: #EB5E00;
}

.Oil.ctaBlack:hover:before {
    background: #EB5E00;
}

.Air.ctaBlack:before {
    background: #707070;
}

.Air.ctaBlack:hover:before {
    background: #707070;
}

.Water.ctaBlack:before {
    background: #00c7c8;
}

.Water.ctaBlack:hover:before {
    background: #00c7c8;
}

.Pharma.ctaBlack:before {
    background: #BB2693;
}

.Pharma.ctaBlack:hover:before {
    background: #BB2693;
}

.Tech.ctaBlack:before {
    background: #EE779D;
}

.Tech.ctaBlack:hover:before {
    background: #EE779D;
}

.Energy.ctaBlack:before {
    background: #3EA055;
}

.Energy.ctaBlack:hover:before {
    background: #3EA055;
}

.Chemical.ctaBlack:before {
    background: #b15ad6;
}

.Chemical.ctaBlack:hover:before {
    background: #b15ad6;
}

.Pack.ctaBlack:before {
    background: #cb8962;
}

.Pack.ctaBlack:hover:before {
    background: #cb8962;
}

.Hygin.ctaBlack:before {
    background: #F97272;
}

.Hygin.ctaBlack:hover:before {
    background: #F97272;
}


.colorW {
    color: #f1f1f1;
}
 
.row.divide [class*='col-']:not(:last-child):after {
    background: #ccc;
    width: 1px;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
}
.lrP25 {
    padding:0px 50px;
}
.BottomShadow {
    -webkit-box-shadow: 0px 10px 16px -7px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 10px 16px -7px rgba(0,0,0,0.425);
    box-shadow: 0px 10px 16px -7px rgba(0,0,0,0.35);
}
.iconcontainerSustainability {
    position: relative;
    text-align: center;
    color: white;
    min-height: 430px;
    height:100%;
}
.icontxt {
    font-size: 15px !important;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 24px;
}

.accordion_container {
    width: 100%;
}

.accordion_head {
    background-color: #f0f0f0;
    color: #404040;
    cursor: pointer;
    font-size: 18px;
    font-family: Montserrat;
    margin: 0 0 5px 0;
    padding: 7px 25px;
    font-weight: 500;
    border: 1px solid #08baba;
    border-radius: 20px;
}

.accordion_body {
    background: #fff;
    width: calc(100% - 80px);
    margin:0px 40px;
    margin-top: -3px;
}

    .accordion_body p {
        padding: 18px 5px;
        margin: 0px;
    }

.plusminus {
    float: right;
    color: #404040;
    font-size: 27px;
    margin-top: -5px;
    background: #00ffff;
    margin-right: -25px;
    margin-top: -6.8px;
    padding: 7.5px 15px 6.4px 15px;
    width: 46px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.Padding5070 {
    padding: 40px 30px 30px 30px;
}
/*table {
    table-layout: auto;
    word-wrap: break-word;
    margin-top: auto;
    margin-bottom: auto;
}

.text-sm {
    font-size: 12px;
}

.price {
    font-size: 3em;
}*/
.form-control{
    border-radius:10px;
}
.marRight1{
    margin-right:1px;
    margin-top:25px;
}
.modal-content {
    border: 3px solid #08baba;
}
.modal-body > img{
    border-radius:3px;
}
.form-control:focus {
    border-color: #08baba;
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(0,123,255,0);
}
.center-left {
    position: fixed;
    top: 45%;
    left: 0px;
    z-index: 999;
    font-weight: 800;
}
.font30 {
    font-size: 30px;
    color: #fff;
}
nav {
    position: fixed;
    width: 55px;
    margin-top: 50px;
    transition: all 0.3s linear;
}
    nav ul {
        margin: 0px;
        list-style-type: none;
        padding-inline-start: 0px;
    }
    nav li {
        height: 55px;
        position: relative;
    }

        nav li a {
            color: white;
            display: block;
            height: 100%;
            width: 100%;
            line-height: 55px;
            padding-left: 25%;
            transition: all .3s linear;
        }

        nav li:nth-child(1) a {
            background: #646464;
            border-radius: 0px 10px 10px 0px;
        }
         
        nav li a i {
            position: absolute;
            top: 13px;
            left: 15px;
            font-size: 30px;
        }

ul li a span {
    display: none;
    font-weight: bold;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #fff;
}

nav ul li a:hover {
    z-index: 1;
    width: 150px;
}

ul li:hover a span {
    padding-left: 25%;
    display: block;
}
.shake {
  animation: shake-animation 4.72s ease infinite;
  transform-origin: 50% 50%;
}
 
@keyframes shake-animation {
   0% { transform:translate(0,0) }
  1.78571% { transform:translate(5px,0) }
  3.57143% { transform:translate(0,0) }
  5.35714% { transform:translate(5px,0) }
  7.14286% { transform:translate(0,0) }
  8.92857% { transform:translate(5px,0) }
  10.71429% { transform:translate(0,0) }
  100% { transform:translate(0,0) }
}
.BannerVideoBlog {
    height: auto;
}

.BlogBannerTit {
    position: absolute;
    bottom: 70px;
    font-family: 'Barlow', sans-serif;
    font-size: 2.1rem;
    font-weight: 600;
    line-height: 2.5rem;
    color: #ffffff;
    z-index: 8;
    letter-spacing: 1px;
    width: 100%;
    text-align: left;
    left: 100px;
    text-transform: uppercase;
}


.topP50M10{
    padding-top:50px;
}
.blogthumb {
    width: 100%;
    height: 300px;
    object-fit: cover;
    width: 100%;
    border-radius: 10px 10px 0px 0px;
    transition: 0.3s;
    -webkit-transition: all .5s ease-in-out;
    overflow: hidden;
}

  
.cardCareer {
    border-radius: 10px;
    width: 100%;
    height: 260px;
    background-color: #ffffff;
    padding: 10px 0px 40px;
}

    .cardCareer h3 {
        font-size: 22px;
        font-weight: 600;
    }

.drop_box {
    /*margin: 10px 0;
    padding: 30px;*/
    display: flex;
    align-items: flex-start;
    justify-content: left;
    flex-direction: column;
  /*  border: 3px dotted #a3a3a3;
    border-radius: 5px;*/
}

    .drop_box h4 {
        font-size: 16px;
        font-weight: 400;
        color: #2e2e2e;
    }

    .drop_box p {
        margin-top: 10px;
        margin-bottom: 20px;
        font-size: 12px;
        color: #a3a3a3;
    }

.btnCareer {
    text-decoration: none;
    background-color: #005af0;
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    outline: none;
    transition: 0.3s;
}

    .btnCareer:hover {
        text-decoration: none;
        background-color: #ffffff;
        color: #005af0;
        padding: 10px 20px;
        border: none;
        outline: 1px solid #010101;
    }

.form input {
    margin: 10px 0;
    width: 100%;
    background-color: #e2e2e2;
    border: none;
    outline: none;
    padding: 12px 20px;
    border-radius: 4px;
}
.radius0 {
    border-radius: 0px;
}


.btnProd {
    background: #00ffff;
    color: #303030;
    text-transform: uppercase;
    font-weight: 500;
}

    .btnProd:hover,.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show > .btn-secondary.dropdown-toggle {
        background: #08baba;
        color: #fff;
    }
.ProdDet {
    padding: 20px 17px;
    width: 210px;
    padding-left: 30px;
}
/*ecommerce CSS*/
.dropdown-menu {
    padding: 0px;
}
.menu-container {
    width: 100%;
    margin: 0 auto;
    padding: 20px 0;
}

.menu {
    width: 200px;
    font-weight: 400;
    font-size: 15px;
    line-height: 15px;
    position: relative;
    padding: 20px 4px;
    margin: 0;
    background-color: #08baba;
}

    .menu a, .menu a:link,  .menu a:focus {
        color: #fff;
        text-decoration: none;
    }
        .menu a:visited {
            color: #303030;
            text-decoration: none;
        }
        .menu a:hover {
            color: #227087;
            text-decoration: none;
        }
#list {
    color: green;
    background: white;
    font-size: 30px;
} 

li::before {
    <!-- Unicode for >> character -->
    content: "\00BB";
} 

    .menu > li {
        display: block;
        text-align: center;
        margin-left: -4px;
        border-left: 1px solid rgba(255, 255, 255, 0.11);
        box-shadow: -1px 0 0 rgba(0, 0, 0, 0.1);
    }

        .menu > li > a {
            padding: 10px 18px;
            display: block;
            text-align: left;
            color:#fff !important;
        }


.menu > li:hover > a {
    color: #227087 !important;
}

        .menu > li:hover {
            background-color: #fff;
        }
        /* Megadrop width dropdown */
    .menu > li > .megadrop {
            opacity: 0;
            visibility: hidden;
            position: absolute;
            list-style: none;
            top: 0px;
            right: 200px;
            width: 400px;
            min-height: 100%;
            text-align: left;
            margin-top: 30px;
            padding: 0;
            z-index: 99;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
            overflow: hidden;
            border-top: 2px solid #227087;
            border-left: 2px solid #227087;
            border-bottom: 2px solid #227087;
            background:#fff;
            padding:20px;
        }

        .menu > li:hover .megadrop {
            opacity: 1;
            visibility: visible;
            margin-top: 0px;
        }

    .menu ul li:hover:after {
        color: #227087;
    }

    .menu .col {
        width: 14.1%;
        float: left;
        color: white;
        margin: 0 0 0 2.2%;
    }

        .menu .col ul {
            padding: 0;
            margin: 0;
        }

            .menu .col ul li {
                padding: 0;
                list-style: none;
                font-size: 11px;
            }

        .menu .col h3 {
            font-size: 16px;
            padding: 10px 0;
            font-weight: bold;
            margin: 5px 0 5px 0;
            color: #227087;
            background: #eee;
        }

        .menu .col ul li a {
            display: block;
            padding: 0 0 15px 0;
            color: #227087;
        }

            .menu .col ul li a:hover {
                color: #111;
                text-decoration: underline;
            }

    .menu > li > ul li ul, .menu li > ul li, .menu > li > .megadrop, .menu > li > ul, .menu > li {
        transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -webkit-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-outs;
    }

.ProdName {
    list-style-type: none; /* Remove default bullet points */

}

    .ProdName li {
        position: relative; /* Required for absolute positioning of the pseudo-element */
    }

        .ProdName li::before {
            content: "\1F816"; /* Content of the pseudo-element (right arrow) */
            position: absolute; /* Position the arrow */
            left: -20px; /* Adjust as needed for spacing */
        }
    .ProdName > li > a {
        color: #303030 !important;
    }
    .ProdName > li:hover > a {
        color: #227087 !important;
        font-weight:500;
    }
.industryTit {
    text-align: left !important;
    padding-left: 20px;
    padding-bottom: 10px;
    font-weight: 900;
    color: #ffffff;
    text-decoration: none;
}
.industryTit:hover{
    background:#08baba !important;
}
#myExibitionLeft {
    width: 20px;
    margin-left: -50px;
}

#myExibitionRight {
    width: 20px;
    margin-right: -50px;
}

label {
   margin-top: 0px; 
}