
.sidebar{
    margin: 0;
    padding: 0;
}
@media only screen and (min-width: 1700px) and (max-width: 1890px){


    .banner-section .banner-container .sidebanner-content .sidebanner-item img {
        height: 165px;
    }
    .header-section .navbar .header-select-menu .header-select-btn{
        height: 47px;
    }
}

@media only screen and (max-width: 1700px){
    .product-section .product-content .product-item{
        padding: 10px;
    }
}

@media only screen and (min-width: 1500px) and (max-width: 1699px){
    .header-section .navbar .logo {
        flex-basis: 10%;
        max-width: 10%;
    }
    .sidebar{
        display:none !important;
    }

    .banner-section .banner-container .sidebanner-content .sidebanner-item img {
        height: 143px;
    }
    .header-section .navbar .header-select-menu{
        right: 5%;
    }
    .header-section .navbar .header-select-menu .header-select-btn{
        height: 47px;
    }
    .product-section .product-content{
        row-gap: 25px;

    }
}

@media only screen and (min-width: 1400px) and (max-width: 1499px){
    .sidebar{
        display:none !important;
    }
    .header-section .navbar .logo {
        flex-basis: 10%;
        max-width: 10%;
    }
    .header-section .navbar .search-bar {
        flex-basis: 50%;
        max-width: 50%;
    }
    .header-section .navbar .header-select-menu{
        right: 5.5%;
    }
    .header-section .navbar .header-select-menu .header-select-btn{
        height: 47px;
    }
    .header-section .navbar .header-select-menu img{
        width: 39px;
    }
    .banner-section {
        margin: 10px 0 20px;
    }

    .product-section .product-content{
        row-gap: 21px;
    }
    .product-section .product-content .product-item {
        padding: 10px;
    }
    .banner-section .banner-container .sidebanner-content .sidebanner-item img {
        height: 128px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px){

    .header-section .navbar .logo {
        flex-basis: 10%;
        max-width: 10%;
    }
        .sidebar{
        display:none !important;
    }
    .header-section .navbar .search-bar {
        flex-basis: 48%;
        max-width: 48%;
    }
    .header-section .navbar .header-select-menu .header-select-btn{
        height: 47px;
    }
    .header-section .navbar .header-select-menu img{
        width: 37px;
    }
    .header-section .navbar .header-select-menu{
        right: 5.5%;
    }


    .banner-section {
        margin: 15px 0 20px;
    }
    .banner-section .banner-container .sidebanner-content .sidebanner-item img {
        height: 103px;
    }
    .product-section .product-content{
        row-gap: 18px;
    }
    .product-section .product-content .product-item {
        padding: 10px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px){
    .scroll-top {
        width: 30px;
        height: 30px;
        line-height: 30px;
        border-radius: 4px;
        font-size: 14px;
    }
    .sidebar{
        display:none !important;
    }
    .header-section .navbar .search-bar {
        flex-basis: 44%;
        max-width: 44%;
    }
    .header-section .navbar .logo {
        flex-basis: 12%;
        max-width: 12%;
    }
    .header-section .navbar .search-bar input{
        padding: 10px 26px;
    }
    .header-section .navbar .search-bar .search-btn{
        font-size: 16px;
    }
    .header-section .navbar .user-action-wrapper .user-btn {
        border-radius: 4px;
        width: 35px;
        height: 35px;
        line-height: 35px;
        font-size: 16px;
    }
    .header-section .navbar .user-action-wrapper .cart-btn {
        border-radius: 4px;
        width: 35px;
        height: 35px;
        line-height: 35px;
        font-size: 16px;
    }
    .header-section .navbar .header-select-menu{
        width: 170px;
        right: 6%;
    }
    .header-section .navbar .header-select-menu .header-select-btn{
        height: 42px;
    }
    .header-section .navbar .header-select-menu img{
        width: 34px;
    }
    .header-section .navbar .header-select-menu .header-select-btn h3{
        font-size: 16px;
    }
    .wrapper ul li a{
        font-size: 14px;
    }
    .wrapper ul li a .angle-menu-icon{
        font-size: 10px;
    }


    .banner-section .banner-container .sidebanner-content .sidebanner-item img {
        height: 83px;
    }
    ul li a .icon {
        height: 30px;
        width: 30px;
        margin-right: 13px;
    }
    ul li a .icon span {
        line-height: 30px;
        font-size: 14px;
    }
    .shopping-from-text h2{
        font-size: 16px;
    }
    .shopping-from-section .container {
        padding: 15px;
    }
    .product-section .p-categories-title{
        padding: 15px;
    }
    .product-section .p-categories-title .categories-text h2{
        font-size: 16px;
    }
    .product-section .p-categories-title .categories-btn{
        font-size: 14px;
        padding: 8px 14px;
    }
    .product-section .product-content{
        row-gap: 15px;
    }
    .product-section .product-content .product-item{
        padding: 8px;
    }
    .product-section .product-content .product-item p a{
        font-size: 12px !important;
    }
    .product-section .product-content .product-item ul li p{
        font-size: 12px;
    }
    .product-section .product-content .product-item ul .pricebox{
        margin-top: 4px;
    }
    .product-section .product-content .product-item ul .pricebox .discount{
        padding: 4px 12px;
    }
    .product-section .product-content .product-item-img .product-item-img-link .view-cart-link{
        font-size: 12px !important;
        text-align: center;
    }
    .product-section .product-content .product-item-img .product-item-img-link {
        height: 28px;
    }
    .footer-section .footer-content .footer-item .footer-logo {
        width: 120px;
    }
    .footer-section .footer-content .footer-item .footer-title h3{
        font-size: 16px;
    }
    .footer-section .footer-content .footer-item ul li span{
        font-size: 14px !important;
    }
    .footer-section .footer-content .footer-item ul li p{
        font-size: 14px;
    }
    .footer-section .footer-content .footer-item ul li .footer-menu-link{
        font-size: 14px;
    }
    .footer-section .footer-content .footer-item .footer-apps .f-android, .footer-section .footer-content .footer-item .footer-apps .f-apple {
        width: 130px;
    }
    .footer-section .footer-content .footer-item .footer-social a {
        margin-left: 8px;
        width: 30px;
        height: 30px;
        line-height: 30px;
    }
    .footer-section .footer-copyright p {
        font-size: 12px;
    }
    .footer-section .footer-copyright p a{
        font-size: 12px;
    }
}

/* ----- Max Width: 991 ----- */
@media only screen and (max-width: 991px){
    .scroll-top {
        width: 30px;
        height: 30px;
        line-height: 30px;
        border-radius: 4px;
        font-size: 14px;
        bottom: 10%;
    }
    /* Cart Container */
    .cart-container .cart-content .cart-content-img {
        flex-basis: 25%;
        max-width: 25%;
    }
    .cart-container .cart-content .cart-content-desc {
        flex-basis: 70%;
        max-width: 70%;
    }
    .cart-container .cart-content .cart-content-desc h4 {
        font-size: 12px;
    }
    .cart-container .cart-content .cart-content-desc p {
        margin-top: 4px;
        font-size: 12px;
    }
    .cart-container .cart-content .cart-content-desc .cart-price{
        margin-top: 0;
    }
    .cart-container .cart-total-price .cart-subtotal {
        font-size: 16px;
    }
    .cart-container .cart-link a{
        font-size: 14px;
    }
    .floating{
        opacity: 1;
        visibility: visible;
    }
    .sidebar .sidebar-m-title{
        opacity: 1 !important;
        visibility: visible;
    }
    .sidebar-overlay{
        position: fixed;
        left:0;
        top:0;
        z-index: 10;
        background: rgb(0, 0, 0, 0.6);
        height: 100%;
        width: 100%;
        display:none;
    }
    .sidebar-overlay.open{
        transform: translateX(0%);	
      }
    .sidebar{
        display: block;
        padding-top: 0;
        height: 100%;
        width: 270px !important;
        top: 0;
        z-index: 200;
    }
    .sidebar.open{
        transform: translateX(0px);	
      }

    .banner-section .banner-container .swiper{
        flex-basis: 100%;
        max-width: 100%;
    }
    .banner-section .banner-container .sidebanner-content {
        display: none;
    }
    .product-section .product-content .product-item{
        padding: 6px;
    }
    .header-section{
        display: none;
    }
    .header-m-section{
        display: block;
    }
    .footer-section .footer-content .footer-item .footer-logo {
        width: 120px;
    }
    .footer-section .footer-content .footer-item .footer-title h3{
        font-size: 16px;
        margin-bottom: 0;
    }
    .footer-section .footer-content .footer-item ul li span{
        font-size: 14px !important;
    }
    .footer-section .footer-content .footer-item ul li p{
        font-size: 14px;
    }
    .footer-section .footer-content .footer-item ul li .footer-menu-link{
        font-size: 14px;
    }
    .footer-section .footer-content .footer-item .footer-apps .f-android, .footer-section .footer-content .footer-item .footer-apps .f-apple {
        width: 130px;
    }
    .footer-section .footer-content .footer-item .footer-social a {
        margin-left: 8px;
        width: 30px;
        height: 30px;
        line-height: 30px;
    }
    .footer-section .footer-copyright p {
        font-size: 12px;
    }
    .footer-section .footer-copyright p a{
        font-size: 12px;
    }
}

/* ----- Min-Width 768px To Max-Width 991px ----- */
/* Home Page */
@media only screen and (min-width: 768px) and (max-width: 991px){
    .container{
        padding: 0 2%;
    }
    .shopping-from-section{
        padding: 0 2%;
    }
    .shopping-from-section .container{
        padding: 15px;
    }
    .shopping-from-text h2{
        font-size: 16px;
    }
    .product-section .p-categories-title{
        padding: 15px;
    }
    .product-section .p-categories-title .categories-text h2 {
        font-size: 16px;
    }
    .product-section .p-categories-title .categories-btn{
        padding: 8px 14px;
        font-size: 14px;
    }
    .product-section .product-content{
        row-gap: 20px;
    }
    .product-section .product-content .product-item{
        padding: 8px;
    }
    .product-section .product-content .product-item p a{
        font-size: 12px !important;
    }
    .product-section .product-content .product-item ul li p{
        font-size: 12px;
    }
    .product-section .product-content .product-item ul .pricebox{
        margin-top: 4px;
    }
    .product-section .product-content .product-item-img .product-item-img-link .view-cart-link{
        font-size: 12px !important;
        text-align: center;
    }
    .product-section .product-content .product-item-img .product-item-img-link {
        height: 30px;
    }
}

@media only screen and (max-width: 767px){

    .sidebar{
        /* padding-top: 3%; */
        padding-top: 0;
    }
    #close-popup{
        font-size: 20px !important;
        right: 10px !important;
    }
    .checkout-section .checkout-container .checkout-left-content .checkout-form input:nth-child(1){
        flex-basis: 100% !important; 
        max-width: 100% !important;
      }
    .cart-container{
        width: 280px;
    }
    .cart-container .cart-header{
        padding: 10px 20px;
    }
    .cart-container .cart-content .cart-content-img {
        flex-basis: 26.5%;
        max-width: 26.5%;
    }
    .cart-container .cart-header h2{
        font-size: 18px;
    }
    .cart-content-empty .empty-main-content .cart-empty-icon span{
        font-size: 80px;
    }
    .cart-content-empty .empty-main-content .cart-empty-icon p{
        font-size: 16px;
    }
    .cart-content-empty .empty-main-content .empty-cart-btn a{
        padding: 10px 18px;
    }
    .container{
        padding: 0 2%;
    }
    .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
        margin: 0 var(--swiper-pagination-bullet-horizontal-gap,4px) !important;
    }
    .header-m-section{
        padding: 18px 0;
    }
    .header-m-section .mobile-nav-content .mobile-col-1 .mobile-logo{
        margin-left: 30px;
    }
    .header-m-section .mobile-nav .mobile-search-box form .mobile-search-btn{
        width: 100px;
    }
    .shopping-from-section{
        padding: 0 2%;
    }
    .shopping-from-text h2{
        font-size: 16px;
        margin-bottom: 12px;
    }
    .product-section .product-content {
        row-gap: 10px;
        padding: 10px 0;
    }
    .product-section .product-content .product-item {
        flex-basis: 49.99%;
        max-width: 49.99%;
    }
    .product-section .p-categories-title{
        padding: 14px;
    }
    .product-section .p-categories-title .categories-text h2{
        font-size: 16px;
    }
    .product-section .p-categories-title .categories-btn{
        font-size: 10px;
        padding: 8px 14px;
        width: 100%;
        display: block;
    }
    .product-section .product-content .product-item p a{
        font-size: 14px !important;
    }
    .product-section .product-content .product-item ul li p{
        font-size: 14px;
    }
    .product-section .product-content .product-item .pricebox .discount{
        font-size: 10px;
        margin-left: 11px;
        padding: 4px 10px;
        border-radius: 2px;
    }
    .product-section .product-content .product-item ul .pricebox{
        margin-top: 4px;
    }
    .product-section .product-content .product-item:hover .product-item-img-link{
        bottom: 12%;
        transform: translateY(50%);
    }
    .product-section .product-content .product-item-img .product-item-img-link .view-cart-link{
        font-size: 12px !important;
        text-align: center;
    }
    .product-section .product-content .product-item-img .product-item-img-link {
        height: 36px;
    }
    .footer-section .footer-content{
        row-gap: 30px;
    }
    .footer-section .footer-content .footer-item {
        flex-basis: 100%;
        max-width: 100%;
    }
    .footer-section .footer-content .footer-item .footer-social a {
        font-size: 12px;
        margin-left: 6px;
        width: 25px;
        height: 25px;
        line-height: 25px;
    }
}

@media only screen and (max-width: 320px){
    input::placeholder{
        font-size: 12px;
    }
}
.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  padding:0 !important;
  padding-top: 2%;
  padding-left: 0;
  height: 100%;
  width: 15%;
  z-index: 10;
  background: white;
  overflow-x: hidden;
  scrollbar-color: black gray;
  scrollbar-width: thin;
}

.sidebar .sidebar-m-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px;
  background: black;
}

.sidebar .sidebar-m-title h3{
  font-size: 18px;
  color: white;
  font-weight: var(--weight-500);
}

.sidebar .sidebar-m-title .close-sidebar{
  font-size: 18px;
  color: white;
  cursor: pointer;
}

nav .wrapper {
  display: flex;
  width: 100%;
  overflow: hidden;
  border-radius: 5px;
  background: white;
  transition: all 0.3s ease;
}

nav .wrapper.show {
  display: none;
  display: flex;
}

.wrapper ul {
  width: 100%;
  list-style: none;
  padding: 10px 10px 0;
  transition: all 0.3s ease;
}

.wrapper ul li {
  display: block;
  line-height: 55px;
  border-bottom: 1px solid gray;
  position: relative;
}

.wrapper ul li a {
  color: var(--black);
  font-size: 16px;
  font-weight: 400;
  padding: 0 10px;
  display: flex;
  border-radius: 8px;
  align-items: center;
  text-decoration: none;
}

.wrapper ul li a .angle-menu-icon {
  position: absolute;
  right: 6px;
  top: 1px;
  font-size: 14px;
}

ul li a .icon {
  height: 40px;
  width: 40px;
  margin-right: 13px;
  background: rgba(204, 18, 21, 0.068);
  display: flex;
  justify-content: center;
  text-align: center;
  border-radius: 50%;
}

ul li a .icon span {
  line-height: 40px;
  font-size: 20px;
  color: black;
}

ul li span.right-icon {
  position: absolute;
  top: 20px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  right: 14px;
  font-size: 14px;
  cursor: pointer;
}

.wrapper ul.shoes-drop,
.wrapper ul.clothing-drop,
.wrapper ul.bag-drop,
.wrapper ul.baby-drop,
.wrapper ul.h-appliance-drop,
.wrapper ul.automobile-drop,
.wrapper ul.watches-drop,
.wrapper ul.gadget-drop,
.wrapper ul.beauty-drop {
  display: none;
}

.wrapper .arrow {
  padding-left: 10px;
  font-size: 16px;
  font-weight: 500;
  color: var(--black);
  cursor: pointer;
}

.wrapper .arrow .fa-arrow-left {
  margin-right: 10px;
}