.image{
    width: 150px;
    margin-left: 120px;
}
.list {
    gap: 30px;
    color: black;
}
.icons{
  margin-right: 300px;
} 

.button{
   color: white;
}
.client{
    background-image: url(images/coffee.jpg);
    height: 600px;   
}
.client1{
    text-align: center;
}
.client2{

}
.hero{
    background-image:url(images/bgimage.webp);
   height: 700px;
}
.head{
    color: white;
    font-size: 70px;
    font-family: "DM Sans", sans-serif;
    font-weight: bold;
    color: white;
    text-align: start;
    line-height: 90px;
}
.time{
    color: white;

  
}   
button{
    background-color: #17a2b8;
    color: white;
    border-radius: 30px;
    border: none;
    line-height: 40px;
  
    
} 
.center{
  line-height: 40px;
  padding-top: 160px;
}
.card{
    height: 100px;
    width: 300px;
}
.row{
 padding: 100px;

  
}
p{
    font-family: "DM Sans", sans-serif ;
    font-size: 20px;
    color: dark grey;
}
.heading{
    gap: 20px;
  
    }
.center-sec{
    height: 700px;
background-color:#72daba;
}

 .headed{
    color: white;
        font-family: "DM Sans", sans-serif;
      
 }  
 .icon2{
    color: white;
 }
 .lead{
    color: white;
 }
 .lead1{
    color: white;
 }
 .icon3{
    color: pink;
 }
 .header{
    font-family: "DM Sans", sans-serif;
    color: darkslategrey;
   
 }
 
.images{
    width: 130px;
    height: 130px;
    border-radius: 70px;
     font-family: "DM Sans", sans-serif;
}
.center1-sec{
    height: 700px;
background-color:pink;
}
.colour{
    background-image: url(images/coffee.jpg);
   color:black;
        height: 700px;
        margin-top: 100px;
}

.text{
    background-color: rgba(240, 233, 233, 0.89);
    width: 1350px;
    height:700px ;
    border-radius: 10px;
}
.girl{
    border-radius: 60px;
}
.profile1{
    position: relative;
    top: 350px;
    right: 450px;
}
.profile2{
    position: relative;
    top: 350px;
     right: 150px;
}
.profile3{
    position: relative;
   
    left: 200px;
}
.profile4{
    position: relative;
  
     left: 400px;
}

.center-sec1{
   height: 700px;
background-color:grey;
color: black;
}
.cup{
    border-radius: 50px;
}
.icecream{
    border-radius: 50px;
}
.toffes{
    border-radius: 50px;
}
.boxes1{
  color: black;
}
.img2{
   margin-left: 50px;
}
.img4{
  margin-left: 50px;
}
.part1{
    margin-left: 30px;
}
.part2{
    margin-left: 30px;
}
.part3{
    margin-left: 30px;
}
.part4{
    margin-left: 30px;
}
.anna{
    line-height: 40px;
}
.nav{
    font-family: "DM Sans", sans-serif;
    font-size: 20px;
}
.good{
    color: lightgrey;
}
.heading1{
    font-family:  "DM Sans", sans-serif;
    font-size: 60px;
    line-height: 140px;
}
.last{
background-color:rgb(243, 239, 239);
height: 300px;
width: 100px;
border-radius: 20px;

}

.ques{
    font-family: "DM Sans", sans-serif ;
}

.crown{
     background-image: url(images/black3.jpg);
     height: 700px;
    
  
}
.black{
    font-family: "DM Sans", sans-serif;
    font-size: 80px;
    line-height: 100px;
  
}
.follow{
    line-height: 100px;
}
.input{
    width: 300px;
    height: 60px;
    border-radius: 30px;
    background-color: black;
    border-color: white;
    border-style: solid;


}
.button1{
    width: 150px;
    height: 60px;
    border-radius: 30px;
    font-size: 20px;
    margin-left: 20px;
}
.icons1{
 font-size: 30px;
 color: white;
}
.lasted{
   margin-left: 600px;

}

@media screen and (min-width:0px) and (max-width:480px) {
   .listed{
    display: block;
    flex-direction: column;
    row-gap: 50px;
   }
   .colour{
    display: block;
    flex-direction: column;
   }
.headed{
    display: flex;
    flex-direction: column;
}
.client1{
    display: block;
    flex-direction: column;
}
.client2{
    display: block;
    flex-direction: column;
}
.client{
    height: 1200px;
    
}
.img1{
    margin-left: 40px;
}
.img3{
    margin-left: 40px;
}
.button1{
    margin-top: 20px;
}
.lasted{
    margin-left: 200px;
    
}
.image{
    width: 120px;
}
.hero{
    padding-left: 20px;
} 

 

}