header{
    position: sticky;
    top: 0;
    z-index: 999999999999;
    }

.site-head{
    background-color:white;
    width: 1220px;
    height: 65px;
    display: flex;
    align-items: center;
    margin: 0 auto;
    margin-top: 53px;
    
}

.nav-ul{
    display: flex;
    align-items: center;
    width: 601px;
    justify-content: space-between;
    margin-left: 195px;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
    
}
.nav-li{
color: #37393F;
font-size: 18px;
}

.menu{
    margin-left: 40px;
    width: 190px;
    height: 65px;
    background-color: #6B77E5;

    display: flex;
    align-items: center;
    justify-content: center;

    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
    color: #FFFFFF;
}

/* section-one */

.section-one{
     width: 1220px;
     height: 510px;
     margin: 0 auto;
     margin-top: 136px;
}
.section-title{
     width: 283px;
     height: 86px;
     margin: 0 auto;
     text-align: center;
     
}
.title-one{
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
  color: #37393F;
}
.title-two{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-size: 40px;
    margin-top: 16px;
}
.icon1{
    width: 72px;
    height: 72px;
    background-color: #40DDB6;
    border-radius: 50%;
    margin-left: 157px;
}
.image{
    margin: 14.5px 14.5px 14.5px 14.5px;

}
.section-div1{
    width: 386px;
    height: 383px;
    background-color: #F4F4F4;
    text-align: center;
}

.div-title{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto; 
    font-weight: 600;
    font-style: normal;
    font-size: 25px;
    color: #37393F;
    margin-bottom: 12px;
    padding-top: 58px;

}
.div-paragraph{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font: weight 400px;;
    font-style: normal;
    font-size: 18px;
    color: #7D7D7D;
    margin-left: 43px;
    margin-right: 43px;
    margin-bottom: 37px;
}
.image-title{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    font-size: 18px;
    color: #6B77E5;
    margin-bottom: 10px;
}


.section-fix{
    display: flex;
    justify-content: space-between;
    margin-top: 41px;
}
.icon2{
    width: 72px;
    height: 72px;
    background-color: #6B77E5;
    border-radius: 50%;
    margin-left: 157px;
}

    .icon3{
    width: 72px;
    height: 72px;
    background-color: #40DDB6;
    border-radius: 50%;
    margin-left: 157px;
}
/* section two */

.banner-png{
    width: 100%;
    display: block;
    margin-top: 60px;
}

   
.section-two{
    position: relative;
}
.text-box{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    
}
.title1{
    color: #37393F;
    font-size: 20px;
    margin-bottom: 16px;
}
.title2{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-size: 40px;
    color: #37393F;
    margin-bottom: 21px;

}
.title3{
    font-size: 18px;
    color: #37393F;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    width: 511px;
    height: 52px;
}
/* section-three */

.section-three{
    width: 1220px;
    margin: 0 auto;
    margin-top: 130px;
    margin-bottom: 131px;
}
.section-box{
    width: 348px;
    height: 86px;
    margin-bottom: 41px;
    text-align: center;
    margin: 0 auto;
}
.box-title1{
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
  color:#37393F;
  font-size: 18px;

}
.box-title2{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-size: 40px;
    color: #37393F;
    margin-top: 16px;
}

.section-box2{
    display: flex;
    justify-content: space-between;
}


.section-box3{
     position: relative;
     display: inline-block;
     margin-top: 41px;
     overflow: hidden;
}


.box-title3{
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translate(-50%);
    background-color: white;
    padding: 15px 30px;
    text-align: center;
    width: max-content;
    
}

.section-box3 img{
    display: block;
    opacity: 0.8;
    transition: 0.3s;
}

.section-box3 img:hover{
    opacity: 1;
}

.title-wraper{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto; 
    font-weight: 600;
    font-style: normal;
    font-size: 25px;
    color: #37393F;
    font-size: 25px;

}
.title-wraper2{
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font: weight 400px;;
    font-style: normal;
    font-size: 18px;
    color: #7D7D7D;
    font-size: 18px;
    margin-top: 4px;

}