body{
  width :1500px;
  
}
*{
  margin:0px;
  font-family: arial;
  border :border-box;
  
}
.navar{
  height :60px;
 background-color: black;
 color: white;
 position: sticky;
 top:0px;
 display: flex;
 justify-content: space-evenly;
 align-items: center;
 z-index: 999;
 
}
.nav-logo{
  height :50px;
  width :100px;
}
.logo{
  background-image: url("amazon_logo.png");
  background-size:cover;
  height: 50px;
  width :100px;
}
.border{
  border:1.5px solid transparent;
}
.border:hover{
  border:1.5px solid white;
}
/*box2*/
.add-icon{
  display: flex;
  align-items: center;
}
.add-first{
  margin-left:15px;
  font-size: 0.85rem;
}
.add-second{
  font-size: 1.2rem;
  margin-left:3px;
}
/*box3*/
.add-search{
  display :flex;
  justify-content: space-evenly;
  background-color: pink;
  width:620px;
  height :40px;
  border-radius: 4px;
  
 
}
.add-search:hover{
  border:2px solid orange;
}
.search-select{
  background-color: #f3f3f3;
  width:50px;
  border-top-left-radius: 4px;
  border-bottom-right-radius: 4px;
  text-align: center;
  border:none;
}
.input-search{
  width :100%;
  border :none;
  font-size: 1rem;
}
.search-icon{
  width :45px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.2rem;
  background-color: #c79624;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border:none;
  
}
/*box4*/
.add-lang{
  background-color: black ;
  font-size:1.2rem;
  color:white;
  border:none;
}
/*box5*/
span{
  font-size:0.7rem;
}
.nav-second{
  font-size:0.85rem;
  font-weight:700;
}
/*box6*/


.nav-cart i{
  font-size: 30px;
}
.nav-cart{
  font-size:0.85rem;
  font-weight: 700;
  
}
/*start panel*/
.panel{
  height: 40px;
  background-color: #222f3d;
  display :flex;
  color: white;
  justify-content: space-evenly;
  align-items: center;
}
.panel-ops p{
  display : inline;
  margin-left:15px;
}
.panel-ops{
  width :70%;
  font-size: 0.85rem;
}
.panel-deals{
  font-size: 0.9rem;
  font-weight: 700;
}
/*hero section*/
.hero-section{
  background-image: url("hero.jpg");
  height:400px;
  background-size: cover;
  animation: heroanimation 15s ease-in 0s infinite normal;
  display: flex;
  justify-content: center;
  align-items:flex-end;
  
}
@keyframes heroanimation{
  0%{
    background-image: url("hero.jpg");
  }
  50%{
    background-image: url("hero3.jpg");
  }
  100%{
    background-image: url("hero2.jpg");
  }
}
.hero-msg{
  color: black;
  background-color: white;
  height:40px;
  display: flex;
  align-items: center;
  justify-content: center;
  width :80%;
  font-size: 0.85rem;
  margin-bottom:20px;
  
}
.hero-msg a{
  color:#007185;
}
/* shop section*/
.shop-section{
  display :flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  background-color:#e2e7e6;
}
.box{
  
  height :400px;
  width :23%;
  background-color: white;
  padding: 20px 0px 15px;
  margin-top:15px;
  
  
  
  
}
.box1-img{
  background-image: url("box1_image.jpg");
  height :300px;
  margin-top :1rem;
  margin-bottom: 1rem;
 
  background-size: cover;
}
.box-content{
  margin-left: 1rem;
  margin-right: 1rem;
}
.box-content p{
  color:#007185;
}
.box2-img{
  background-image: url("box2_image.jpg");
  height :300px;
  margin-top :1rem;
  margin-bottom: 1rem;
 
  background-size: cover;
}
.box3-img {
  background-image: url("box3_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box4-img {
  background-image: url("box4_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box5-img {
  background-image: url("box5_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box6-img {
  background-image: url("box6_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box7-img {
  background-image: url("box7_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box8-img {
  background-image: url("box8_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box9-img{
  background-image: url("box9_image.png");
  height :300px;
  margin-top :1rem;
  margin-bottom: 1rem;
 
  background-size: cover;
}
.box10-img {
  background-image: url("box10_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box11-img {
  background-image: url("box11_image.png");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box12-img {
  background-image: url("box12_image.png");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box13-img {
  background-image: url("box13_image.png");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box14-img {
  background-image: url("box14_image.png");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box15-img {
  background-image: url("box15_image.png");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.box16-img {
  background-image: url("box16_image.jpg");
  height: 300px;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
  background-size: cover;
}
.add-image{
  background-image: url("box17.png");
  height :400px;
  background-size:cover;
  margin-bottom: 10px;
  
}
/*footer */
footer{
  margin :20px;
}
.f-panel1{
  background-color: #37475a;
  color:white;
  height :50px;
  font-size:0.85rem;
  display :flex;
  justify-content: center;
  align-items: center;
}
.f-panel2{
  background-color:#222f3d;
  color: white;
  height :300px;
  display :flex;
  justify-content: space-evenly;
}
ul{
  margin-top: 20px;
}
ul a{
  display: block;
  font-size:0.85rem;
  margin-top: 10px;
  color:#dddddd;
}
ul p{
  font-size:1rem;
  font-weight: 700;
}
.f-logo{
  background-image: url("amazon_logo.png");
  background-size:cover;
  height: 50px;
  width :100px;
  
}
.f-panel3{
  height: 70px;
  background-color:#222f3d;
  border-top :0.85px solid white;
  display : flex;
  justify-content: center;
  align-items: center;
  
}
.f-lang{
  
  margin-left :70px;
  border: 0.7px solid white;
  border-radius: 2px;
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 0.6rem;
  width: 120px;
}
.f-lang select{
  background-color: #222f3d;
  color: white;
  border:none;
}
.f-panel4{
  background-color:#0f1111;
  color: white;
  height :80px;
  font-size:0.7rem;
  text-align: center;
}
.pages{
padding-top:25px;
  
}
.copyrite{
padding-top:5px;
}
.image{
  background-image: url("box15_image.png");
}