body {
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}

nav.navbar.navbar-expand-lg {
    background: #02a2b1;
    padding: 2px;
    border-bottom: 1px solid #fff;
    z-index: 9999
}

li.nav-item {
    padding: 12px;
}

li.nav-item a {
    /*padding: 12px;*/
    color: #ffff;
}

.bg-blue {
    width: 100%;
    background: #13102B;
    height: 100%;
}

li.link {
    color: #fff;
    list-style: none;
    padding: 5px;
}

.banner img {
    /*width: 100%;*/
    height: 100%;
}

.set {
    color: #FECB00;
    padding: 0px 33px;
}

.footer-set {
    padding: 0px;
}

.asets {
    background-image: url(../images/ocean.png);
    height: auto;
    width: 100%;
}

.banners {
    background: #D9E9FF url(../images/bg.png) no-repeat;
    height: auto;
    padding: 31px;
    width: 100%;
}

.bg-white {
    background: #fff;
    width: 100%;
    height: auto;
    padding: 25px;
    /*box-shadow: 0px 0px 7px #ccc;*/
    font-size: 18px;
}

button.our {
    background: #C80339;
    color: #fff;
    position: relative;
    padding: 6px 25px;
    border: 0;
    left: 6%;
    top: -28px;
}

h1.invest {
    font-size: 56px;
    padding: 19px;
    font-weight: bold;
    color: #fff;
}

.blue {
    background: #13102B;
    padding: 12px;
    border-top: 1px solid #cccccc29;
}
.blues {
    background:#02a2b1;
    padding: 12px;
    border-top: 1px solid #cccccc29;
}

h1.innovation {
    color: #fff;
    font-size: 50px;
    font-weight: bold;
    padding: 12px;
    /*margin: 10px 0px 0px 76px;*/
}

.past img {
    width: 100%;
    height: 100%;
    padding: 12px;
    position: relative;
    right: 8%;
    top: 8px;
    margin: 10px;
}

.mission {
    background: #13102B;
    width: 100%;
    position: relative;
    padding: 25px;
    color: #ffff;
    margin: 10px 0px 10px 10px;
    /* box-shadow: -6px 0px 7px #ccc; */
    z-index: 1;
}

i.fa.fa-arrow-circle-right {
    position: relative;
    font-size: 32px;
    left: 34px;
    top: 6px;
}

button.click {
    position: relative;
    /*top: 29px;*/
    /*left: 15%;*/
    padding: 0px 39px 11px;
    border: 0;
    border-radius: 22px;
    background: #13102B;
    color: #fff;
}

h1.why {
    color: #C80339;
    padding: 11px 4px;
    font-size: 50px;
    font-weight: bold;
}

h1.whey {
    color: #C80339;
    padding: 11px 0px;
    font-size: 50px;
    font-weight: bold;
}

span.past {
    color: #13102B;
    padding: 12px;
}

p.simply {
    font-size: 18px;
    font-weight: bold;
    color: #6a6666;
}

.missions {
    background: #271e3d;
    position: relative;
    left: 13%;
    top: 78px;
    padding: 12px;
    color: #fff;
}

h1.about {
    padding: 12px;
    color: #fbd15b;
    font-size: 50px;
    font-weight: bold;
}

span.ift {
    color: #fff;
    padding: 12px;
    font-weight: bold;
}

button.about {
    padding: 6px 42px;
    border: 0;
    margin: 10px;
}

h1.dolor {
    color: #fff;
    font-size: 50px;
    padding: 12px;
}

p.sit {
    color: #fff;
    font-size: 18px;
    padding: 12px;
}

button.more {
    background: #cee6dc;
    border: 0;
    border-radius: 32px;
    padding: 8px 29px;
    margin: 10px;
}

.soler {
    background-image: url(../images/back.png);
}

h1.energy {
    color: #FECB00;
    text-align: center;
    font-size: 50px;
    padding: 52px 23px;
    position: relative;
    z-index: 1000;
}

.pasts {
    background: url(../images/Mask.png);
    background-size: cover;
    background-repeat: no-repeat;
    padding: 12px;
    height: 180px;
    position: relative;
}

button.btn-submit {
    background: #271e3d;
    color: #fff;
    margin: 18px 0px;
    text-align: center;
    width: 100%;
    border-radius: 27px;
    padding: 10px;
}

.upload {
    background-image: url(../images/friend.png);
    height: auto;
    width: 100%;
}

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

input.form-control {
    padding: 12px 20px;
    border-radius: 10px;
    font-size: 18px;
}

textarea.textarea.form-control.submit {
    height: 107px;
    border-radius: 10px;
    padding: 12px 24px;
}

textarea#message {
    border-radius: 10px;
}

.card-body {
    background: #FECB00;
    text-align: center;
}

.card {
    margin: 30px 0px;
}

.maincountainer {
    position: relative;
    width: 100%;
    height: 404px;
    background: none;
    border-radius: 5px;
}

.thecard {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    /*height: 100%;*/
    border-radius: 10px;
    transform-style: preserve-3d;
    transition: all 0.8s ease;
}

.thecard:hover {
    transform: rotateY(180deg);
}

.thefront {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%;*/
    font-size: 3em;
    border-radius: 10px;
    backface-visibility: hidden;
    /*background-image:url(https://th.bing.com/th/id/OIP.pKpkgPzOmjVqDTY1tjBiRgAAAA?pid=ImgDet&rs=1);
  */
    background-size: contain;
    text-align: center;
    font-family: 'lobster', cursive;
    color: white;
}

.theback {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%;*/
    border-radius: 10px;
    backface-visibility: hidden;
    font-family: 'lobster', cursive;
    /* background-image:url(https://th.bing.com/th/id/OIP.r0JOWI8ViDUA79SsxHTp1gAAAA?pid=ImgDet&rs=1);*/
    color: black;
    font-size: 3em;
    text-align: center;
    transform: rotateY(180deg);
}

.ready {
    /*background-image: url(../images/Adobe.png);*/
    background-repeat: no-repeat;
    border: 2px solid;
    height: 69px;
    margin: 11px
}

.green-card {
    /*background-image: url(../images/pink.png);*/
    background-repeat: no-repeat;
    border: 2px solid;
    height: 69px;
    margin: 11px
}

.red-card {
    background-image: url(../images/blur.png);
    /*background-repeat: no-repeat;*/
}

/*.blue-card {
    background-image: url(../images/Stock.png);
    background-repeat: repeat-x;
}*/

p.get {
    padding: 20px;
    text-align: center;
    font-weight: bold;
    color: #fff;
    margin: 13px 0px;
    font-size: 20px;
}

p.gets {
    text-align: center;
    font-weight: bold;
    color: #000;
    margin: 13px 0px;
    font-size: 20px;
}

li.box-2 {
    background: #FECB00;
    text-align: center;
    color: #ffff;
    font-size: 18px;
    box-shadow: 0px 0px 21px #da9011;
}

/*new css*/

.missions {
    background: #ffffff;
    position: relative;
    left: 1%;
    top: -10px !important;
    padding: 26px;
    color: #13102B;
    height: 70%;
    z-index: 1;
}

a {
    color: #fff;
    text-decoration: none;
}

.mission p {
    font-size: 24px;
}

img {
    width: 100%;
}

.bg-blues {
    display: flex;
    justify-content: space-between;
    padding: 0px 82px !important;
    background:#C80339;
}
i.fa.fa-instagram{
    color:#fff !important;
}

i.fa.fa-twitter {
    color: #fff !important;
}
i.fa.fa-facebook {
    color: #fff !important;
    
}
i.fa.fa-envelope {
    color:#fff !important;
}
i.fa.fa-phone{
    color:#fff !important;
}
.donate a{
    color:#fff !important;
}
.Renewable {
    display: flex;
    background: rgb(39 30 61 / 90%);
    padding: 0px 0px;
    width: 43%;
    border-radius: 100px;
    position: absolute;
    top: 58%;
    transform: translateY(-100%);
    left: 120px;
    align-items: center;
}

h6.plan {
    padding: 0px 17px;
    font-size: 18px;
    color: #ffff;
    margin: 0px;
}

img.logos {
    width: 100px;
}

button.navbar-toggler {
    color: #fff;
    border: 1px solid #fff;
}

/*.banners p {*/

/*    padding: 0px 31px;*/

/*}*/

img.tree {
    margin: 10px 0px;
}

h1.us {
    font-size: 54px;
    font-weight: bold;
    margin: 10px;
    color: #271e3d;
}

/**
 *  Demo Styles from the Slick Slider
 *  website
 */

/*body {
  background-color: #3498db;
}
*/

.content {
    margin: auto;
    padding: 20px;
    width: 85%;
}

.slider {
    margin: 30px auto 50px;
}

.slick-slide img {
    display: block;
    width: 100%;
    height: 218px;
    object-fit: cover;
}

.maroon {
    background: maroon;
    padding: 4px 12px;
    width: 100%;
    color: #fff;
}

.image {
    padding: 10px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.map {
    margin: 10px;
    padding: 12px;
}

p.simply {
    font-size: 18px;
    font-weight: bold;
    color: #6a6666;
}

.flip-card {
    background-color: transparent;
    width: 300px;
    height: 300px;
    perspective: 1000px;
    /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

/* Position the front and back side */

.flip-card-front,
.flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */

.flip-card-front {
    background-color: #bbb;
    color: black;
}

/* Style the back side */

.flip-card-back {
    background-color: dodgerblue;
    color: white;
    transform: rotateY(180deg);
}

.tablinks {
    font-size: 20px;
    font-weight: 600;
    border: 2px solid #000;
    background-color: #fff;
    padding: 15px;
    border-radius: 3px;
}

.tablinks:hover {
    background-color: #fbd15b;
    border-color: #FBD15B;
}

.tablinks.active {
    background-color: #fbd15b;
    border-color: #FBD15B;
}

@media (max-width: 768px) {
    .bg-blues {
        display: block;
        /* justify-content: space-between; */
        padding: 12px !important;
    }
    .Renewable {
        display: flex;
        background: #271e3d;
        padding: 0px;
        margin: 45px 0px 0px;
        width: 85%;
        top: 50%;
        left: 24px;
    }
    .missions {
        position: relative;
        left: 0%;
		height: auto;
    padding: 0;
    background: transparent;
    color: #fff;
    }
    img.parking {
        display: none;
    }
    element.style {}
    .maroon {
        width: 255px;
        color: #fff;
    }
    .image img {
        padding: 10px 107px;
        width: 100%;
    }
    .mission {
        left: 0%;
    }
    img.logos {
        width: 100px;
    }
	button.our {
    top: -10px !important;
    left: 20px !important;
}
}

.discraption p {
    color: #2D2D2D;
    font-weight: 500;
}

.item12 {
    position: relative;
    height: 19rem;
    background-color: #fff;
    overflow-y: hidden;
    box-shadow: 0.1rem 0.1rem 1rem rgba(0, 0, 0, 0.1);
}

.item12 h3 {
    margin: 0;
    display: block;
    background-color: #590C38;
    padding: 1rem;
    color: #fff;
    border-bottom: 1px solid #fff;
}

.item12 a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.item12 a:hover~.item__overlay,
.item a:focus~.item__overlay {
    transform: translate3d(0, 0, 0);
}

.item__overlay {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    position: absolute;
    width: 100%;
    top: 0;
    transition: transform 300ms;
    background-color: #590C38;
    transform: translate3d(0, calc(100% - -1rem), 0);
    color: #fff;
}

.item__body {
    flex-grow: 1;
    padding: 1rem;
}

.item__body p {
    margin: 0;
}

.stack {
    background: #fff;
    display: flex;
    align-items: center;
    padding: 8px;
    font-size: 18px;
    font-weight: 500;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

.arrowdiv {
    color: #13102B;
    font-size: 32px;
}

.slick-slide {
    margin: 10px;
}

.Renewable img {
    width: 75px !important;
}

.header-topswp .dropdown-menu {
    padding: 0px;
}

.pasts:after {
    content: "";
    position: absolute;
    left: 0px;
    right: 0px;
    background: rgb(16 10 64);
    z-index: 111;
    top: 0;
    mix-blend-mode: multiply;
    height: 100%;
}

.team-item {
    position: relative;
    height: 19rem;
    background-color:#FBD15B;
    overflow-y: hidden;
    box-shadow: 0.1rem 0.1rem 1rem rgba(0, 0, 0, 0.1);
        margin-top: 29px;
}

.team-item h3 {
    margin: 0;
    display: block;
    background-color: #FBD15B;
    padding: 1rem;
    color: #13102B;
    font-size: 1.25rem;
}

.team-item a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.team-item a:hover~.item__overlay12,
.team-item a:focus~.item__overlay12 {
    transform: translate3d(0, 0, 0);
}

.item__overlay12 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    position: absolute;
    width: 100%;
    color:rgb(251 209 91);
    top: 0;
    transition: transform 300ms;
    background-color:#13102B ;
    /* transform: translate3d(0, calc(100% - -1rem), 0); */
    z-index: 9999999;
}

.item__body12 {
    flex-grow: 1;
    padding: 1rem;
}

.item__body12 p {
    margin: 0;
}

.title-team {
    position: absolute;
    width: 100%;
    bottom: 0;
    text-align: center;
    left: 0;
}

.social-icon {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.social-icon li {
    display: inline-block;
}

.social-icon li span {
    display: inline-flex;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    border: 1px solid #000;
    align-items: center;
    justify-content: center;
    margin: 0px 5px;
}

.bg-blue-main {
    background: #02a2b1 !important;
    width: 100%;
    height: auto;
    padding: 25px;
    font-size: 18px;
}

.social-icon li span i {
    margin: 0px !important;
    font-size: 18px !important;
    color: #13102B !important;
}

@media (max-width: 769px) {
    .banner img {
        height: 160px !important;
    }
    .item__overlay {
        transform: translate3d(0, calc(100% - -4rem), 0);
    }
    h1.invest {
        font-size: 45px;
    }
    h1.innovation {
        font-size: 40px;
    }
    .mission {
        top: 0;
        height: auto;
        margin: 0px;
    }
    .banners {
        padding-left: 5px;
        padding-right: 5px;
    }
    button.click {
        top: 0px !important;
        left: 0px !important;
    }
    .Processs {
        margin-top: 40px;
    }
    h1.dolor {
        font-size: 36px;
    }
    h1.why {
        font-size: 36px;
    }
    h1.whey {
        font-size: 36px;
    }
    .missions {
        height: auto;
    }
    .set {
        padding: 0px;
    }
    ul {
        padding: 0px;
    }
    h1.about {
        padding-top: 0;
        font-size: 36px;
    }
    .blue .row.mt-5 {
        margin-top: 0px !important;
    }
    .past img {
        right: 0px !important;
        margin: 0px !important;
        padding: 0px !important;
    }
    h1.invest br {
        display: none;
    }
    h1.energy {
        padding: 15px;
        font-size: 40px;
    }
    .banner .Renewable img {
        height: auto !important;
    }
    .banner {
        position: relative;
    }
    h6.plan {
        font-size: 15px;
    }
    .asets {
        padding-bottom: 30px;
    }
    .upload .invest {
        top: 0px !important;
    }
    h1.us {
        font-size: 40px !important;
    }
    .map {
        margin: 0px !important;
        padding: 0px !important;
    }
    .gmap_canvas {
        width: 100% !important;
    }
    .Renewable.abs {
        margin-top: -6px;
    }
    .donate a {
        display: block;
    }
    .toggle-box {
        display: inline-block !important;
    }
    .toggleboxc {
        display: none;
    }
    .droptoggle {
        display: block;
    }
    button.our {
    /*top: 14px !important;*/
    left: 2px !important;
}
span.t_designation {
    position: relative;
    left: 0% !important;
    top: 29px!important;
}
}

html {
    overflow-x: hidden;
}
span.t_designation {
    position: relative;
    color: #fff;
    left: 30%;
    top: -119px;
}

.toggle-box {
    display: inline-block;
    float: right;
    margin-top: 9px;
    cursor: pointer;
}

.toggle-box {
    display: none;
}
a span.t_designation {
    display: block;
}
button.clickhere {
    background: none;
    border: none;
    color:rgb(251 209 91);
}
/*img.stave {*/
/*    background: yellow;*/
/*    opacity: 0;*/
/*}*/