*{
  padding:0;
  margin:0;
  box-sizing: border-box;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

}
#top{
height:100vh;
width:100%;
background-image: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),url(Image/banner.jpg);
background-size: cover;
background-position:70%; 

}
  

.navbar-nav{
margin-left:auto;
}
.nav-link{
color: white;
margin-left: 50px;
text-align: center;
transition:0.5 ease;
cursor: pointer;

}
.nav-link:hover{
background-color: white;
color: black;
}
#ordernow{
  margin-top: 40px;
  background:transparent;
   border:2px solid white;
  color: white;
  padding: 15px 32px;
  text-align: center;
  display: inline-block;
  font-size: 16px;
  border-radius: 25px

}

.word{
margin-top: 70px;
text-align: center;
color:white;

}
/*laptop*/
@media  screen and (min-width:992px){
#ordernow{
  margin-top: 40px;
  background:transparent;
   border:2px solid white;
  color: white; 
  padding: 25px 45px;
  text-align: center;
  display: inline-block;
  font-size: 30px;
  border-radius: 25px;

}
#btns{
  padding-top: 20px;
}
.word h1{
  text-align: center;
  font-size:50px;
  padding-top: 50px;
}
}

#ordernow:hover{
background-color: rgb(255, 255, 255);
color:black;

}
/*tablet*/
@media screen and (min-width:421px){
.word{
  line-height: 40px;
  
}


#ordernow{
  padding:10px;
  margin-top: 10px;
}
#avatar1,#avatar2,#avatar3,#avatar4,#avatar5,#avatar6{
  text-align:center;
  margin-left: 39% !important;
  
  }
}
/*Mobile*/
@media screen and (max-width:420px){
.word h1{
  font-size: 30px;
  padding-top: 40px;
  
}
.nav-link{
  margin-left: 0px;
}
.nav-link:hover{
  margin-left: 0px;
  color: rgb(0, 0, 0);
}
#ordernow{
   padding:10px;
   margin-top: 10px;
}

}
@media  screen and (min-width:767px){
  #ordernow{
    padding:10px;
    margin-top: 40px;
 }
 .word h1{
  font-size: 40px;
  padding-top: 40px;
  
}
#avatar1,#avatar2,#avatar3,#avatar4,#avatar5,#avatar6{
  text-align:center;
  margin-left: 39% !important;
  
  }
}
.card{
box-shadow: 10x 10px 50px #aaaaaa;
}
#buttons{
  background:white;
  
  color: rgb(0, 0, 0);
  padding: 15px 15px;
  text-align: center;
  display: inline-block;
  font-size: 15px;
  border-radius: 25px; 
}
#buttons:hover{
background-color: #430908;
color:white;
border:none;
border:2px solid #430908;
}
#avatar1,#avatar2,#avatar3,#avatar4,#avatar5,#avatar6 {
vertical-align: middle;
margin-left:40%;
width: 100px;
height: 100px;
border-radius: 50%;


}
.avatar img{
text-align:center;

}
.text{
text-align: center ;
justify-content: center; 
margin-bottom: 8px;
}
.comments{
text-align: justify ;
justify-content: center;


}
.star i{
color:#FDBD01;
}
#avatar1,#avatar2,#avatar3,#avatar4,#avatar5,#avatar6{
  text-align:center;
  margin-left: 30%;
  
  }
.footer{  
  text-align: center;
  margin-top:15px ;
line-height: 60px;
 background-color: #430908;
  color: white;
}
 #foot p{
  line-height: 30px;
 }