input:focus-visible {
 outline:unset !important;
}

.brand-carousel .item{
 
   display:flex;
   justify-content:center;
   
}
.pagination .active a{
  color:#e31e24 !important
}

.pagination  a{
  color:#000 !important
}

.pagination{
    gap:10px;
}

.banner_title {
  font-size: 40px;
  background: #00000040;
  color: #fff;
  padding: 10px 60px 10px 20px;
}

.inside-banner-content {
  position: absolute;
  left: 0;
  top: 40%;
}

.side-navbar {
  width: 350px;
  /* height: 100%; */
  position: relative;
  margin-left: -350px;
  background-color: #fff;
  box-shadow: 0px 8px 8px 0px #0000001a;
  transition: 0.5s;
  overflow-y: auto;
  z-index:1;
}

.my-container {
  transition: 0.4s;
}

.active-nav {
  margin-left: 0;
}

/* for main section */
/* .active-cont {
  margin-left: 250px;
} */

.product-search-input-box {
  border: none;
  padding: 5px;
  background-color: transparent;
}
.product-search-input-box:focus-visible {
  outline: none !important;
  border: none !important;
}

.product-search {
  box-shadow: 0px 2px 10px 0px #0000001a;
  border: 0.4px solid #cfd8dd;
  border-radius: 25px;
  height: 48px;
  width: 224px;
  margin: auto;
}

.product-search-button {
  border: none;
  background-color: transparent;
  right: 12px;
}

#menu-btn,
#menu-btn-two
 {
  background-color: var(--theme-color8);
  color: #fff;
  margin-left: -55px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#menu-btn
 {
  background-color: var(--theme-color8);
  color: #fff;
  margin-left: -58px;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.active-cont #menu-btn svg{
    transform: rotate(0deg) !important;
}

#menu-btn svg{
    transform: rotate(180deg);
}

.my-container input {
  border-radius: 2rem;
/*  padding: 2px 20px; */
}

.filter-hr {
  height: 3px;
  width: 66px;
  background: #e31e24;
  opacity: 1;
  border: none;
}

.boxed label {
  display: inline-block;
  padding: 10px;
  width: 28px;
  height: 28px;
  /* border: solid 2px #ccc; */
  transition: all 0.3s;
  background: #f9f9f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 300;
  font-family: Inter !important;
}

.boxed input[type="checkbox"] {
  display: none;
}

.boxed input[type="checkbox"]:checked + label {
  background: #e31e24;
  color: #fff;
}

.boxedtwo label {
  display: inline-block;
  padding: 5px;
  transition: all 0.3s;
  background: #f9f9f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 300;
  font-family: Inter !important;
}

.boxedtwo input[type="checkbox"] {
  display: none;
}

.boxedtwo input[type="checkbox"]:checked + label {
  background: #e31e24;
  color: #fff;
}

.filter-buttons {
  display: flex;
  /* margin-bottom: 20px; */
}

.list-view-button,
.grid-view-button {
  color: white;
  border: 1px solid white;
  padding: 5px;
  font-size: 14px;
  cursor: pointer;
  border-radius: 3px;
}

.list-view-button:hover,
.grid-view-button:hover {
  background: white;
  color: #0e2439;
}

.list-view-button {
  margin-right: 10px;
}

.list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
}



.list li {
  /* background-color: #1f364d; */
  /* color: white; */
  /* border-radius: 3px; */
  margin-bottom: 10px;
  transition: 0.3s;
}

.list.list-view-filter {
  flex-direction: column;
}

.list.list-view-filter li {
  padding: 10px;
}

.list.grid-view-filter {
  flex-flow: row wrap;
  gap: 40px;
}

.list.grid-view-filter li {
  /* width: calc(50% - 210px);
  padding: 100px; */
  margin-right: 10px;
  text-align: center;
}
.add-cart-product-list{
    bottom: 4px;
    position: relative;
}
.grid-view-button.active svg path {
  fill: red;
  
}

.list-view-button.active svg path {
  fill: red;
}

.percentage {
  position: absolute;
  left: -44px;
  top: 10px;
  width: 150px;
  background-color: #ea526b;
  padding: 5px;
  transform: rotate(-45deg);
  text-align: center;
}
.deal-card {
  overflow: hidden;
  /*width:370px;*/
  /*height:203px;*/
}
.close-side-button {
  position: fixed;
  left: 50%;
  cursor: pointer;
}

.side-nav-close {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgb(255, 255, 255);
  color: rgb(13, 17, 54);
  border: 0px;
  outline: 0px;
  box-shadow: none;
  border-radius: 50%;
  position: absolute;
  top: -55px;
  left: 50%;
  transform: translateX(-50%);
  cursor: pointer;
}

.ellipse{
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
   width:150px;
}


 .grid-view-filter .product-title-three{
  /*text-overflow: ellipsis;*/
  /*overflow: hidden; */
  width: 280px; 
  /*white-space: nowrap;*/
}

 .list-view-filter .product-title-three{
  /*text-overflow: ellipsis;*/
  /*overflow: hidden; */
  width: 245px; 
  /*white-space: nowrap;*/
}



@media only screen and (min-width: 1630px){
  .list-view-filter .list-width{
     width:450px !important;
  }
}


@media only screen and (min-width: 1200px){
  .list-view-filter .list-width{
     width:200px;
  }

 .list-view-filter .price-card{
     width:210px;
  }

 .list-view-filter .list-image-width{
     width:75px !important;
     height:75px !important;
  }
}


@media only screen and (max-width: 991px) {
    .pt-8 {
    padding-top: 105px;
  }
}

@media only screen and (max-width: 500px) {
  .banner_title {
    font-size: 28px;
  }

  .deal-card{
    padding-top:40px !important;
  }

  .inside-banner-img {
    height: 30vh;
    object-fit: cover;
  }
  .pt-8 {
    padding-top: 105px;
  }
  .product-search {
    width: 100%;
  }

  .price-card {
    width:100%;
  }

  .side-navbar {
    position: fixed;
    margin: 0 !important;
    bottom: 0px !important;
    width: 100% !important;
    height: calc(100vh - 300px);
    z-index: 9;
    border-radius: 30px 30px 0px 0px;
  }
  .active-nav {
    margin-left: 0 !important;
    bottom: -100% !important;
    z-index: 9;
  }
  .active-cont {
    margin: 0px !important;
  }
 /* .side-navbar:not(.active-nav):before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0000005d;
  } */

.body-bg:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0000005d;
    z-index: 9;
}

.grid-view-filter .product-title-three{
    width:auto !important;
}

  #menu-btn {
    width: fit-content;
  }

  #menu-btn-two {
    width: fit-content;
  }
}
