.product-page-header {
  border: 1px solid transparent;
  width: 100wi;
  height: 250px;
  display: block;
}
.header-offer-banner {
  border: 1px solid transparent;
  background-color: black;
  width: 100%;
  height: 48px;
}
.header-page-info {
  border: 1px solid transparent;
  width: 100%;
  height: 50px;
}
.header-product-category {
  border: 1px solid transparent;
  width: 100%;
  height: 149px;
}
.header-offer-msg {
  color: white;
  font-family: sans-serif;
  font-weight: bold;
  font-size: 14px;
  margin-top: 17px;
  text-align: center;
}
.header-page-ul-list {
  display: flex;
  margin-left: 20px;
  font-family: sans-serif;
  font-size: 12px;
  margin-top: 18px;
}
.header-page-ul-list-2,
.header-page-ul-list-3 {
  margin-left: 15px;
  color: gray;
}
.header-product-category-h1 {
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-weight: bolder;
  font-size: 60px;
  text-align: center;
  margin-top: 44px;
}

/* Product list main start */

#product-items {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 420px;
  grid-gap: 20px;
}


/* product-list-css */


        .prod-container{
            display: grid;
            grid-template-columns: repeat(4 , 1fr);

            /* grid-template-rows: 100px 100px 100px 100px; */
            border:1px solid transparent;
            grid-gap: 3% ;
            width:95%;
            margin: auto;
        }
        .prod-container>div{
            /* background-color: aqua;  */
            border: 1px solid transparent;
        }
        .prod-container>div:hover{
          box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
          cursor: pointer;
        }
        .prod-container>div>img{
            height:400px;
            width:100%;
            border-radius: 1%;
        }
        .prod-container>div>p{
            color:red;
            font-weight: bold;
            font-size: 15px;
            margin-bottom: 5px;
            margin-top: 0px;
        }
        #usd{
            display: flex;
            justify-content: space-between;
            margin-top: 5%;
        }
        #usd1{
            text-decoration: line-through;
        }
        #usd2{
            color:red;
        }
        .prod-container>div>button{
          width:70%;
          height:8%;
          background-color: black;
          color: white;
          font-weight: bolder;
          font-size: 16px;
          font-family: sans-serif;
          border-radius: 50px;
          margin-left: 15%;
          margin-top: 5px;
          border: none;

        }
        .prod-container>div>button:hover{
          background-color: rgb(58, 57, 57);
          cursor: pointer;
        }