body{
    margin: 0;
    background-color: #F9F1F0;
    
    }
    .logo{
        margin: 1;
        margin-left: 2rem;
        height: 6rem;
        width: 10rem;
        display: flex;
    }
    header{
        margin-top: -1.4rem;
        
        height: 15vh;
        width: 100%;
        background-color: #000;
    }
    ul a{
  
        position: relative;
        /* top: -1.5rem; */
        left: 25rem;
        font-weight: bold;
        text-decoration: none;
    }
    ul{
        margin-top: -3rem;
    }
    a{
        margin-left: 38rem;
        color: azure;
        font-size: 1.5rem;
    
    }
    a:hover{
        color: goldenrod;
        /* box-shadow: 10px 5px aqua; */
        filter:drop-shadow(0px 0 30px goldenrod) ;
        
    
    }
    .banner{
        /* margin-top: 19vh; */
        /* margin-top: -1.2rem; */
        height: 40vh;
        width: 100%;
        
        background-image: url(https://th.bing.com/th/id/OIP.MPZJ28SRaJ7ranKiHKBmwQHaDt?w=325&h=175&c=7&r=0&o=5&dpr=1.5&pid=1.7);
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        background-size: 240vh 100%;
        object-fit: contain;
        background-position: center center;
       
    }
    *{
      cursor: url(../cursor2.png), auto
  }
    .banner img{
        width: 100%;
        height: 40vh;
        
    }
    .tban h1{
        
        margin-left: 7rem;
        margin-top: -5rem;
        color: whitesmoke;
    }
    
    
    .banner_fade{
        margin-top: -7.5rem;
        height: 7.4rem;
        background: linear-gradient(180deg,transparent,rgba(33, 33, 33, 0.61),#353230);
    }
    
    .ns{
        display: flex;
        justify-content: center;
        text-align: center;
    }
    
.star{
  position: absolute;

    margin-left: 11rem;
    padding: 0 .5rem;
    background-color: #DEB3AD;
    border-radius: .5rem;
    color: #663635;
}
.ns{
  color: #663635;
}
span1{
color:  #663635;  
}










    .container img{
        height: 15rem;
        width: 16rem;
        margin: .5rem;
        
    }
    .product .container{
        height: 35rem;
        width: 20rem;

    }
    p span{
        text-decoration: line-through;
        color:  #E1999F;
    }
    .container{
        
        position: relative;
        justify-content: center;
        
        text-align: center;
        /* flex-direction: column; */
        border: 2px solid black;
        margin: 1rem;
        
    
    }
    .product::-webkit-scrollbar{
      display: none;
    }
    body::-webkit-scrollbar{
      display: none;
    }
.product{
    display: flex;
    align-self: start;
    /* border: 2px solid black; */
    overflow-y: hidden;
    
}














@media (hover: hover) {
    #creditcard {
     
      transform: translateY(110px);
      transition: transform 0.1s ease-in-out;
      
    }
  
    #money {
      
      transform: translateY(180px);
      transition: transform 0.1s ease-in-out;
      
    }
  
    .btnwallet button:hover #creditcard {
      transform: translateY(0px);
      transition: transform 0.2s ease-in-out;
      
    }
  
    .btnwallet button:hover #money {
      transform: translateY(0px);
      transition: transform 0.3s ease-in-out;
      
    }
  }
  
  @keyframes bounce {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-0.25rem);
    }
    100% {
      transform: translateY(0);
    }
  }
  
  .btnwallet .button:hover .btnwallet .button__text span {
    transform: translateY(-0.25rem);
    transition: transform .2s ease-in-out;
  }
  
  
  
  .mrp{
    display: flex;
    text-align: center;
    justify-content: center;
    flex-direction: column;
}
.mrp h2{
    margin: 1rem;
}
.mrp p{
    margin-top: 5rem,;
}
  .btnwallet .button {
    margin-top: 1.5rem;
    border: none;
    outline: none;
    background-color: 
  purple;
    padding: 1rem 90px 1rem 2rem;
    position: relative;
    border-radius: 8px;
    letter-spacing: 0.7px;
    background-color: #663635
    ;
    color: 
  #fff;
    font-size: 21px;
    font-family: "Lato", sans-serif;
    cursor: pointer;
    box-shadow: 
  rgba(0, 9, 61, 0.2) 0px 4px 8px 0px;
  }
  
  .btnwallet .button:active {
    transform: translateY(1px);
  }
  
  .btnwallet .button__svg {
    position: absolute;
    overflow: visible;
    bottom: 6px;
    right: 0.2rem;
    height: 140%;
  }

.description{
  margin-top: 4rem;
width: 95%;
padding: 2rem;
background-color: black;
color: whitesmoke;
}
.description p{
  width: 50%;
}
span2{
  color: goldenrod;
  font-size: larger;
  font-family: "Jaro", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
span3{
  color: goldenrod;
  font-size: larger;
  font-family: "Jaro", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
span4{
  color: goldenrod;
  
  font-size: larger;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
  /* footer{
    height: 20vh;
    width: 100%;
    background-color: #000;
    color: whitesmoke;
  } */
  .detail img{
    height: 10rem;
    width: 14rem;
    
  }
  .detail{
    margin-left: 40rem;
    margin-top: -18rem;

  }
  .detail{
    padding: 1rem;
    
  }
  .detail .box3 pre{
    margin-left: 13rem;
    margin-top: -12rem;
    margin-bottom: 5rem;
    font-size: large;
  }
  .star{
    margin-top: -4rem;
  }