*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    font-family: 'Lobster', cursive;
font-family: 'Poppins', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Shippori Mincho', serif;

}
/*header section start*/
header{
width: 100%;
display: flex;
justify-content: space-around;
margin-top: 40px;
}
.logo{

}
.logo img{

}
nav{

}
ul{
display: flex;
}
ul li{
list-style: none;
margin-left: 40px;
}
ul li a{
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    color: #3a3434;
    font-weight: 600;
}
/*header section end*/
/*section 1 start*/
.section1{
    width: 100%;
    height: 85vh;
    background-image: linear-gradient( 206.8deg,  rgba(73,168,255,1) 19.1%, rgba(0,48,249,1) 109.8% );

    
}
svg{
    position: absolute;
    bottom: 0;
}
svg path{
    fill:#fff
}
.box1{
    display: flex;
    justify-content: space-around;
    
}
.content1{

font-family: Arial, Helvetica, sans-serif;
color: #fff;
line-height: 40px;
font-size: 23px;
position: relative;
top: 200px;
left: 200px;
}
.content1 h1{
    line-height: 50px;
}
.btn{
    padding: 15px 20px;
    background-color: #3A8FFE;
    color: #fff;
    font-size: 14px;
    border: none;
    box-shadow: 2px 2px 2px rgb(48, 46, 46);
}
.btn:hover{
    background-color: #0f36a1;
}
.image1{
position: relative;
top: 70px;
right: 150px;
animation-name: rasel;
animation-duration: 4s;
animation-delay: 0.1s;
}
@keyframes rasel{
    0%{transform: translateX(250%);}
}
/*section1 end*/
/*section2 start*/
.section2{
 width: 100%;
 
 background-color: ;
 position: absolute;
    
}
.card{
    margin-top:-100px;
    display: flex;
    justify-content: center;
    z-index: 1;
    background-color:#fff;
    width: 60%;
    margin-left: 300px;
    box-shadow: 2px 2px 7px #000;
    padding: 20px;
    margin-top: -240px;
    border-radius: 0px;
    
    
}
.con{
text-align: center;
font-family: Arial, Helvetica, sans-serif;
margin-left: 60px;
margin-right: 30px;
line-height: 20px;
color: #999292;

}
.con h3{
    color:#000;
}
/* section2 end */
/* section3 start */
.section3{
display: flex;
margin-bottom: 150px;
}
.box3{
    width: 50%;
position: relative;




}
.box4{
width: 50%;


}
.content3{
    position: relative;
    top: 200px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 30px;
}
#heading{
    line-height: 40px;
    font-weight: 400;
}
#pp{
    color: #5e5959;
}
#hhh{
    font-weight: 400;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
.image3{
    position: relative;
    top: 100px;
    left: 290px;
}
.image3 img{
    width: 55%;
}
.image4{

}
.image4 img{
    width: 40px;
    margin-top: 15px;
}
span{
    color: #797777;
    position: relative;
    top: -10px;
}
/* section3 end */
/* section4 start */
.section4{
    display: flex;
    margin-top: 200px;
    
}
.image5 img{
    width: 55%;
}
.box5{
    width: 50%;
}
.box6{
    width: 50%;
    animation-name: fahim;
    animation-duration: 2s;
    animation-delay: 0.1s;
}
@keyframes fahim{
    0%{transform: translateX(-150%);}
    100%{transform: translateX(150%);}
}
.content4{
    position: relative;
    left: 300px;
    top: 100px;
}
/* section4 end */
/* section5 start */
.section5{
display: flex;
margin-top: 200px;
background-color: #faf5f5;
}
.box7{
animation-name: pavel;
animation-duration: 2s;
animation-delay: 0.1s;
animation-direction: alternate;
}
@keyframes pavel{
0%{transform: translateX(-150%);}
50%{transform: translateX(150%);}

}
.box77{
    height: 400px;
    margin-top: 100px;
    margin-left: 20px;
    
display: flex;
background-color:#fff;
box-shadow: 1px 2px 6px black;

}
.card2{
margin-top: 50px;
margin-left: 40px;
padding: 0px 20px;

}
.content10{
text-align: center;
margin-top: 50px;
}
#h5{
font-family: Arial, Helvetica, sans-serif;
line-height: 30px;
}
#plan{
    font-size: 16px;
    color: #5f5d5d;
    font-family: Arial, Helvetica, sans-serif;
    font-family: 10px;
}
/* section5end */
/* section6 start */
.section6{
width: 100%;
height: 400px;
margin-top: 100px;
background-color: #2E7EED;
}
.box8{
margin-left: 620px;
line-height: 300px;
}
button{
margin-left: 30px;
}
.bbb{
    padding: 15px 50px;
    border-radius: 70px;
    border: 1px solid blue;
    box-shadow: 1px 1px 1px blue;
    
}
.bbb:hover{
    background-color: #3A8FFE;
}
#he{
text-align: center;
font-family: Arial, Helvetica, sans-serif;
line-height: 70px;
font-weight: 500;
color: #fff;
padding-top: 40px;
}
#per{
text-align: center;
font-family: Arial, Helvetica, sans-serif;
color: #fff;
}
/* section6 end */
/* section7 start */
.section7{
width: 100%;
height: 400px;
background-color: #1A1B1F;
display: flex;
justify-content:space-around;
}
#box1{
margin-top: 200px;
}
.bol{
    font-size: 30px;
    background-color:#fff;
    border-radius:50% ;
    color: #0f36a1;
}
#box2{
margin-top: 150px;

}
.footer1{
display: flex;

}
.foter-list{
margin-left: 50px;
}
#hi{
font-family: Arial, Helvetica, sans-serif;
color: white;
line-height: 30px;
}
#pppp{
font-family: Arial, Helvetica, sans-serif;
color: #d2d2d2;
line-height: 30px;
}
/* section7 end */
/* section8 start */
.section8{
width: 100%;
height: 80px;
background-color: #343A40;
}
#footer{

}
#fahim{
text-align: center;
line-height: 80px;
color: #d2d2d2;

}
/* section8 end */
/* Simple App Website All Compleat */