/*google fonts*/

@import url('https://fonts.googleapis.com/css2?family=Bona+Nova:ital@1&family=Noto+Sans:ital@1&family=Sniglet&display=swap');
*{
    box-sizing: border-box;
}

header,section
{overflow: hidden;

}
:root{
    --Single-font:"Singlet",cursive;
    --Noto:"Noto Sans",cursive;
    --Bona:"Bona Nova",cursive;
    --light-black:#2e2c2caf;
    --bggradient:linear-gradient(to bottom,#dd2476,#ff512f);
    --light-gray:rgba(241, 236, 236, 0.726);
}
.nav-link{
    color:whitesmoke;
}
.header a{
    font-family:var(--Single-font);
    font-size:0.9em;
    color:rgb(179, 243, 179);
}
header{
    background: linear-gradient(to bottom,#0f0f0ffd,#383737);;
    color:rgb(240, 235, 235);/*smart investments*/
    border-bottom-left-radius: 30%;
}
.dropdown-content{
    display:none;
    position:absolute;
    background: white;
    width:160px;
    box-shadow: 2px 15px 0px rgba(0,0,0,.2);
    z-index: 1;
}
.dropdown-content a{
    color:black;
    padding:12px 16px;
    text-decoration: none;
    display:block;
}
.dropdown-content a:hover{
    background: #ddd;

}
.dropdown:hover .dropdown-content{ /*to display the nested items*/
    display:block;
}
header .nav-items:last-child{
    padding-right:10.5em;
}
header .nav-item{
    padding:.0em;
}
header .nav-brand{
    padding-left: 8rem;
}
header .nav-link:hover{
    color:rgb(27, 47, 226);
    background: #bec1df;
    border-radius: 8px;
    transition: all .5s ease 0s;
}
header .row .col-md-5{
    padding: 4.2em 1vmin;
}
header .row .col-md-7{
    padding: 22vim 1vmin;
    padding-bottom: 35vmin;
    font-family: var(--Noto);
}
header .row .col-md-5 img{
    width:100%;
}
header .container .col-md-7 h6{
    padding: 1vmin;
    letter-spacing: 4px;
}
header .container .col-md-7 h1{
    font-size: 8vmin;
    font-weight: bold;
    padding:0.1em 0em;
}
header .container .col-md-7 p{
    padding: 1vmin 5vmin;
}
header .container .col-md-7 button{
    border-radius: 30px;
    font-weight:bold;
}
header .container .col-md-7 button:hover{
    border: 1px solid #010308;
    background: #3b45c9;
    transition: 0.5s;
}
/*section-1*/
.section-1{
    padding: 20vmin 0;
}
.section-1 .row .col-md-6 .pray img{
    opacity:o.8;
    width:100%;
    border-radius:0.2em;
}
.section-1 .row .col-md-6:last-child{
    position: relative;
    margin-bottom: 5vmin;
}
.section-1 .row .col-md-6 .panel{
    position:relative;
    top:7vmin;
    left:-18vmin;
    background:white;
    border-radius: 3px;
    text-align: left;
    padding: 13vmin 5vmin 20vmin 10vmin;
    box-shadow: 0px 25px 42px rgba(0,0,0,.2);
    font-family: var(--Bona);
}
.section-1 .row .col-md-6 .panel h1{
    font-weight: bold;
    padding:0.4em 0;
    font-size:2em;
}
.section-1 .row .col-md-6 .panel p{
    font-size: 0.9em;
    color:rgba(0,0,0,1);
}
/*section 2*/
.cover{
    width:100%;
    height:55vmin;
    background: url();
    background-position: -24rem -19rem;
    background-size:150% ;
    position: relative;
}
.cover .content{
    background:rgba(0,0,0,.7);
    height:100%;
    width:100%;
    padding-top: 19vmin;
    border-top-right-radius: 40%;
}
.cover .content>h1{
    font-family: var(--Noto);
    font-size: 6vmin;
    color:whitesmoke;
}
.cover .content>p{
    font-family: var(--Noto);
    font-size: 2vmin;
    color:#e5e5e5;

}
.numbers .rect{
    position: relative;
    z-index: 1;
    background: white;
    width:17rem;
    height: 12rem;
    padding-top: 3.5vmin;
    margin:1rem;
    border-radius: .5em;
    box-shadow: 1px 2px 50px 0px rgba(225,0,0,.5);
}
.numbers{
    margin-top: -15vmin;
}
.numbers react h1{
    font-size: 5rem;
    color:tomato;
}
.numbers .rect p{
    font-family: var(--Noto);
    font-size: 4vmin;
}
/* .section-2*/
.initiatives>h1{
    padding-top: 15vmin;
    padding-bottom: 0.1em;
    font-family: var(--Noto);
}
.initiatives>p{
    color:var(--light-black);
    font-size: 2.5vmin;
    padding: 10vmin;
}
.initiatives .cards .card{
    width:22rem;
    margin:3vmin;
}

.cards .title{
    background: rgba(208,241,241,0.199);
    padding:1.4rem 2.5rem;
    font-size: 2vmin;
}
.card .card-text{
    padding: 2.5rem 3rem;
    color:var(--light-black);
    position: relative;
}
.card .card-text one{
    
        position: absolute;
        background-image: url(https://cdn5.vectorstock.com/i/1000x1000/71/94/industrial-background-vector-997194.jpg);
        background-size: cover;
        opacity:0.25;
}



.card-body .info{
    background: rgba(208, 241, 241, .299);
    border-top-right-radius: 190px;
    border-top-left-radius: 190px;
}
.card-body .pray>h1{
    font-size: 10vmin;
    padding: 1em .5em;
}
/*section3*/
.section-3{
    height:120vmin;
    margin-top:15vmin;
    background:var(--bggradient);
}
.section-3 .col-md-12>h1{
    padding:2em 0 .5em 0;
    color:whitesmoke;
    font-size: 6vmin;
}
.section-3 .col-md-12>p{
    padding: 0 4em;
    padding-bottom: 2em;
    color:var(--light-gray);
    font-size: 3vmin;  /*button view*/
}
.section-3 .desktop{
    background: white;
    display: inline-block;
    border: 3em;
    padding: 2vmin 4.5vmin;
    margin:1em;
}
.section-3 .desktop h3{
    font-size:4vmin;
}
.section-3 .desktop p{
    font-size: 2vmin;
}
/*******/
.section-3 .col-md-4 .card{
    height:50%;

}
/****/
/*section4*/
.section-4 .container h1{
    font-size: 6vmin;
    padding-top: 14vmin;
}
.section-4 .team{
    padding: 10vmin 4vmin;
}
.section-4 .card{
    width:22rem;
    margin-top: 10vmin;
}
.section-4 .card .card-text{
    padding: .5em;
}
.section-4 .card-body>a{
    font-size: 1.5em;
}
.section-4 .carousel-item{
    padding-left: 3rem;
}
.border-radius{
    border-radius: 340px;
    width:60%;
}
/*footer*/
footer{
    background: rgba(0,0,0,.8);
    overflow-x: hidden;/*removes h-scrollbar*/
    padding:14vmin 18vmin;
}
footer p>span{
    color:#ff512f;
}
footer input:hover{
    border:none !important;
    color:#e5e5e5 !important;
}
footer input::placeholder{
    color:white !important;
}
footer .input-group .input-group-text{
    background: var(--bggradient);
    border:none;
}
/**/
footer .column a{
    justify-content: center;
    display: inline-flex;
    text-align: center;
    background: rgba(255, 255, 255, 0.1);
    text-decoration: none;
    margin-right: 8px;
    border-radius: 50%;
    width: 40px;
    flex-direction: column;
    height: 40px;
}
footer .column a:hover{
    background: #18d26e;
}
/**/
footer .column a i{
    color:#dd2476;
}
footer .column a i+i{
    padding:0 0.5em;
}
/**/
.sticky{
    position: fixed;
    top:0;
    width: 100%;
    background: rgba(0,0,0,.815);
    z-index: 9999;
    transition: all 1.5s ease-in-out;
}