*{
    /* border: solid 1px;     */
    font-family: 'Noto Sans', sans-serif;
}

.h-100vh{
    height: 100vh;
}
.mt-100px{
    margin-top: 100px;
}
.pt-60px{
    padding-top: 60px;
}

/* postion-center */
.center{
    display: flex;
    justify-content: center;
    align-items: center; 
}
/* postion-left */
.left{
    display: flex;
    justify-content: flex-start;
    align-items: center; 
}
/* postion-right */
.right{
    top:-15px;
    position: fixed;
    right: 5%;
}
.back{
    z-index: -2;
}
/* all-style */

.all-style{
    /* background-color: #403C3C; */
    height: 100%;
    width: 100%;
}

.container{
    width: 100%;
    text-align: center;
}

h2, h3, h4, h5,p{
    letter-spacing: 2px;
    font-family: 'Noto Sans', sans-serif;
}
h5{
    padding-top: 40px;
    text-align: center;
    font-style: normal;
    font-weight: bold;
}
p{
    text-align: left;
    padding-top: 10px;
}

.nu-green{
    /* background: #50C9C3; */
    color: #50C9C3;
}
.big-title{
/* font-family: 'Overpass Mono', monospace; */
text-align: center;
padding: 40px;
margin: auto;

}
.big-title-e{
    font-style: normal;
    font-weight: normal;
    font-size: 60px;
    line-height: 73px;
    letter-spacing: 0.458333px;
    text-align: center; 
}
.big-title-c{

font-style: normal;
font-weight: bold;
font-size: 36px;
line-height: 37px;
letter-spacing: 0.1em;
margin-top: 20px;

}
.m-title-c{
 
   font-style: normal;
   font-weight: bold;
   font-size: 32px;
   line-height: 40px;
   letter-spacing: 0.1em;
   /* color: #50C9C3; */
   /* margin-top: 24px; */
   }
.m-title-e{
    font-style: normal;
    font-weight: normal;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: 1px;
    margin-top: 30px;

}

.hr{
width: 33px;
height: 4px;
}

/* nav */
.nav-bar{
width: 100%;
 position: absolute;
 left:50%;
 transform: translateX(-50%);
 text-align: center;
}
.nav-item{
    color: #000;
    /* width: px; */
    height: 29px;
    width: 80px;
    font-family: Overlock SC;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 29px;
    letter-spacing: 0.458333px;
    margin-top: 20px;
    padding: 5px;
    
}
.nav-item:hover{
    color: #50C9C3;
    /* text-decoration: underline; */
    transition: 1s;

}
/* header */
#home{
    height: 100vh;
    width: 100vw;
    overflow:hidden;
}
.header-logo{
    margin-top: 40px;
    height: 100px;
}
.app-img{
    width: 150%;
    
}
.transaction{
    position: absolute;
    left: 35px;
    top: 10%;
    color: rgb(102, 102, 102);
}

.muckup-3-img{
    height: 100%;
    width: 100%;
    /* position: relative; */
    /* top: 50%;
    left: 50%;
    transform: translate(-50%,-50%); */
}
.green-box{
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top:0px;
    /* background-color: rgba(20,20,20,0.5); */
}

.green-box-soild{
    position: absolute;
    width: 744px;
    height: 1435px;
    left: 40%;
    top: -2%;
    background: #50C9C3;
    /* nu-green */
    border: 1px solid #50C9C3;
    box-sizing: border-box;
    border-radius: 106px;
    transform: rotate(58.31deg);
    z-index: -1;
}
.green-box-line-2{
    position: absolute;
width: 744px;
height: 1435px;
left: 25%;
top: -285px;
border: 2px solid #50C9C3;
box-sizing: border-box;
border-radius: 106px;
transform: rotate(58.31deg);
z-index: -1;

}
.green-box-line-1{
    position: absolute;
    width: 744px;
    height: 1435px;
left: 20%;
top: -319.78px;
z-index: -1;
transform: rotate(58.31deg);



/* nu-green */

border: 1px solid #50C9C3;
box-sizing: border-box;
border-radius: 106px;
transform: rotate(58.31deg);
}
@keyframes sky{
0%{
    top: 0px
}
100%{
    top:-500px;
}
}

/* top nav */
.top-bar{
    position: fixed;
    height: 60px;
    width: 100%;
    z-index: 1;
    background: #fff;
    /* border-bottom:solid 1px #E5E5E5 ; */
}
.logo{
    position: fixed;
    height: 7%;
    padding: 10px;

}
.top-nav-bar{
    padding: 10px;
    text-align: center;
}

/* brand-style */

h3{
    margin-top: 40px;
}
.bar-p{
    width: 50%;
    text-align: right;
    margin-right: 20px;
}
.bar{
    width: 100%;
    display:flex;
    justify-content: flex-start;
    margin-top: 30px;
}
.bar-1{
    background: #50C9C3;
    height: 100%;
    width: 45.5%;
    border-radius: 10px;
}
.bar-2{
    background: #F2994A;
    height: 100%;
    width: 21.5%;
    border-radius: 10px;
}
.bar-3{
    background: #EB5757;
    height: 100%;
    width: 16%;
    border-radius: 10px;
}
.number{
    color: #fff;
    padding-left: 20px;
}
.rectangle{
  height: 39%;
}
.rectangle1{
    height: 100%;
}
.rectangle2{
    height: 100%;
}
.row{
    height: px;
}
.col-sm-7{
    height: 600px;
}
.col-sm-5{
    height: 600px;
}
/* Introduction */
.m-title-intr-c{
 font-family: Roboto Mono;
font-style: normal;
font-weight: bold;
font-size: 40px;
line-height: 47px;
letter-spacing: 0.1em;
color: #50C9C3;
margin-top: 24px;
}
.white{
    color: #fff;
}
.introduction-log{
    margin-top: 5%;
    width: 20%;

}
.introduction{
    background-color: #50C9C3;
    width: 100vw;
    height: 600px;
    position: absolute;
    left: 0px;
    z-index: -1;
}
.word-img{
    height: 40%;
    width: 40%;
}
h4.sm-title{
    color:#fff;
    padding: 10px;  
}
.num-img{
    width: 8%;
    margin: 10px;

}
.ui-img{
    width: 100%;
}

.intro-icon{
    width: 25%;
    margin-top: 16%;

}
.green-box-soild-2{
    position: absolute;
width: 818px;
height: 1217px;
left: 40%;
top: -5%;
background: #50C9C3;
border-radius: 106px;
transform: rotate(58.31deg);
z-index: -1;
}
.green-box-2{
    height: 200%;
    width: 100%;
    /* overflow: hidden; */
    position: absolute;
    left: 0px;
    top:300%;
}
.video{
    width: 100%;
    height: 100%;
}
/* research-style */
#research{
    margin: 60px;
}
.research-img{
    height: 150px;
    width: 150px;
    border-radius: 5px;
    overflow: hidden;
    margin: auto;
}
.research-img img{
    height: 100%;
}

.btn{
   margin-left: 40px;
 
}