#container{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    gap: 20px;
   margin: auto;
   margin-top: 20px;
    margin-left: -90px;
  
  }

  #sortbybrand{
    display: flex;
    flex-wrap: nowrap;
    margin-left: 150px;
    
}

#loadmore{
  margin-top: 20px;
  margin-left: -150px;
  margin-bottom: 50px;
  height: 40px;
  width: 250px;
  font-size: 20px;
  font-weight: bold;
  background-color: #00263e;
  color: white;
  border: none;
}

#loadmore:hover{
    color: #00263e;
    background-color: white;
    cursor: pointer;
    border: 1px solid #00263e;
}

#s1{
  color: grey;
}
#s2{
  color: grey;
}
#s3{
  color: grey;
}
#s4{
  color: grey;
}
#s6{
   
  color: grey;
}

.head3-1 {
  display: flex;
  
  justify-content: space-around;
  align-items: center;
}

.head3-2{
  display: flex;
  width: 40%;
  justify-content: flex-end;
  align-items: center;
  
}


  h1{
      color:#418993;
      margin-top: 30px;
      margin-left: 100px;
  }
  #front{
      color: grey;
     
      margin-left: 100px;
  }

  #photo:hover{
     height: 330px;
     width: 330px;
  }
  #photo{
      height: 300px;
      width: 300px;
    
      
  }
 #head3rd{
   margin-left: 150px;
 }

 #btn {
  display: flex;
  justify-content: center;
  align-items: baseline;
}
#btn > button {
  background-color: white;
  color: #be6274;
  border: 0px;
  border-radius: 3px;
  margin: 5px;
  width: 40px;
  height: 40px;
}
#btn > button:hover {
  background-color: #be6274;
  color: white;
}

  .Adjust{
      display: flex;
      justify-content: center;
      margin: auto;
      line-height: 35px;
      width: 300px;
      
  }

  
  #sticky{
    position: -webkit-sticky; /* Safari */
    position: sticky;
       top: 0;
       background-color: #fff;
  }



.AnimationPart {
     height: 40px;
     width: 100%;
     margin-top: 0px;
     overflow: hidden;
     font-family: "Poppins", sans-serif;
     background-color: teal;
   }
   .AnimationPart {
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 17px;
     font-weight: 550;
     color: rgb(226, 215, 215);
    
   }
   .AnimationPart::after {
     content: " ";
     color: white;
     background-color: teal;
     animation: textrotate 2s linear infinite;
     -webkit-animation: textrotate 2s linear infinite;
   }
   @keyframes textrotate {
     0% {
       content: "In-Store and Online Use Card: CLEAN10 For 10% OFF 1st purchase || details ";
     }
     100% {
       content: "Free Shiping over $50 | Refer a freind and get $10";
     }
    }

    .NavigationBar {
    width: 100%;
    height: 110px;
    border: 3 px solid red;
  }
  #upper1 {
    display: grid;
    grid-template-columns: 2fr 4fr 2fr;

    justify-content: center;
    align-items: center;
    width: 100%;
    height: 75px;

    
  } 

  #lefttext {
    display: flex;
    justify-content: space-around;
    align-items: center;
  }

  #lefttext > div:hover {
    color: brown;
    border-bottom: 2px solid brown;
  }
  #lefttext > div {
    padding: 8px;
  }
  #righttext {
    margin: 6px;
    color: gray;
  }
  #righttext > button {
    border: 2px;
  }
  #middle1 {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #lower {
    width: 100%;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    justify-content: space-around;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
  }
  #lower > div {
    padding: 10px;
    font-weight: 650;
  }
  #lower > div:last-child {
    color: teal;
  }
  #lower > div:hover {
    color: brown;
    border-bottom: 2px solid brown;
  }
  #logocenter {
    height: 72px;
  }

  i{
     margin-left: 12px;
      cursor: pointer;
  }


  #lowerhead{
    height: 40px;
    background-color: #be6274;
    color: white;
    display: flex;
    justify-content: center;
    padding-top: 15px;
   margin-left: -150px;
    font-size: 25px;
    font-weight: bold;
    margin-top: 45px;
}
#para{
    width: 80%;
    margin: auto;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    margin-top: 30px;
    font-size: 18px;
}

#masai{
    height:510px;
    width:auto;
    background-color:black;
    padding: 15px;
    padding-top: 20px;
    margin-top: 20px;
    
    margin-left: -150px;
    
  }
  .i{
      color:white;
      margin-left:40px;
      margin-top:50px;
      padding:20px;
      font-weight:bold;
  }
  #footer{
      color:white;
      width:60%;
      height:40vh;
      display:flex;
      justify-content:center;
      flex-wrap:wrap;
      margin-left:370px;
  }
  #footer-1{
      display:flex;
      flex-direction:column;
      margin-right:20px;
      margin-top:-50px;
      
  }
  #footer-1 h3{
      margin-bottom: 15px;

  }
  #footer-1 a{
      color:white;
      text-decoration:none;
      margin-bottom:12px;
      font-size:15px;
  }
  #footer-2{
      display:flex;
      flex-direction:column;
      margin-right:20px;
      margin-top:-50px;
  }
  #footer-2 h3{
      margin-bottom: 15px;

  }
  #footer-2 a{
      color:white;
      text-decoration:none;
      margin-bottom:12px;
      font-size:15px;
  }
  #footer-3{
      display:flex;
      flex-direction:column;
      margin-right:20px;
      margin-top:-50px;
      
  }
  #footer-3 h3{
      margin-bottom: 15px;

  }
  #footer-3 a{
      color:white;
      text-decoration:none;
      margin-bottom:12px;
      font-size:15px;
  }
  #footer-4{
      display:flex;
      flex-direction:column;
      margin-top:-270px;
      margin-left:560px;
  }
  #footer-4 h4{
      margin-bottom: 15px;

  }
  #footer-4 a{
      color:white;
      text-decoration:none;
      margin-bottom:10px;
      font-size:15px;
  }
  #pkhaja{
      color:white;
      margin-top:40px;
      font-weight:bold;
      margin-left:105px;
      font-size:15px;
  }
  .skhaja{
      color:rgb(29, 134, 29);
  }
  #footer-5{
      margin-top:140px;
      margin-left:520px;
      display:flex;
      flex-direction:row;
      margin-right:10px;
      
  }
  .fa-cc-amex{
      padding:10px;
      color:aqua;
      font-size:32px;
      width:10px;
      border:none;
      margin-top:-100px;
      
      
  }
  .fa-apple-pay{
     background-color:white;
     font-size:20px;
     height:18px;
     margin-left:35px;
     padding:5px;
     margin-top:-88px;
     border-radius:2px;
  }
  .fa-cc-discover{
      color:orange;
     font-size:30px;
     height:40px;
     margin-left:18px;
     margin-top:-88px;
     border-radius:2px;
  }
  .fa-vimeo-v{
      background-color:rgb(21, 103, 226);
      color:white;
      margin-left:17px;
      width:30px;
      height:17px;
      text-align:center;
      padding:5px;
      border-radius:2px;
      margin-top:-86px;
  }
  .fa-pied-piper-pp{
      color:white;
      margin-left:17px;
      width:50px;
      font-size:30px;
      margin-top:-88px;
  }
  .fa-cc-visa{
      color:white;
      width:35px;
      font-size:31px;
      margin-left:-8px;
      margin-top:-88px;
  }
  #ikhaja{
      
      background-color:black;
      margin-left:10px;
      border:none;
      font-weight:bold;
      
  }
  #ikhaja::placeholder{
      color:white;
  }
  .fa-solid{
      color:white;
      font-size:12px;
  }
  hr{
      width:16%;
      margin-left:250px;
  }
  .fa-instagram{
      color:white;
      margin-top:20px;
      margin-left:160px;
  }
  .fa-facebook-f{
      color:white;
      margin-left:15px;
  }
  .fa-twitter{
      color:white;
      margin-left:15px;
  }
  .fa-youtube{
      color:white;
      margin-left:14px;
  }
  .imgkhaja{
      margin-top:-50rem;
      padding-bottom:230px;
      padding-left:35px;
  }      
  #footer-1 a:hover{
      color:red;
      transition:0.3s ease-out;
  } 
  #footer-2 a:hover{
      color:red;
      transition:0.3s ease-out;
  } 
  #footer-3 a:hover{
      color:red;
      transition:0.3s ease-out;
  } 
  #footer-4 a:hover{
      color:red;
      transition:0.3s ease-out;
  }