/* Mobile */
@media (min-width: 320px) and (max-width: 375px) {
    .home-header {
        background-image: url(/images/mobile-home-header.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        padding: 58% 0;
    }
    h1, .h1 {
        font-size: 31px;
    }
}
@media (min-width: 376px) and (max-width: 765px) {
    .home-header {
        background-image: url(/images/mobile-home-header.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        padding: 44% 0;
    }
    h1, .h1 {
        font-size: 36px;
    }
}
@media (min-width: 766px) and (max-width: 767px) {
    .home-header {
        background-image: url('/images/header-bg.jpg');
        background-position: center;
        background-size: cover;
        padding: 31% 0;
    }
}


@media (max-width: 767px) {
    .mobi-logo a {
        font-size: 25px;
    }
    .row-cols-5>* {
        -ms-flex: 0 0 20%;
        flex: 100%;
        max-width: 50%;
    }

    .navbar-light .navbar-toggler {
        color: black;
        border: none;
        text-align: right;
    }
    .header .logo a {
        display:none;
    }
    .navbar-collapse {
        position: absolute;
        background-color: #fff; 
        top: 34px;
        width: 100%;
        text-align: center;
        z-index: 99999;
        padding-bottom: 20px;
        margin-top: 20px;
    }
    .nav-link {
        padding-left:0;
        padding-bottom:15px;
    }
    .nav-item i {
        margin-right: 8px;
    }
    .nav-item.header-icons {
        padding-top: 15px;
    }
    .small-header {
        display:none;
    }
    /* .small-header {
        text-align: center;
    }
    .small-header .navbar-nav-header.d-flex.justify-content-end {
        padding-left:0;
        display:block!important;
    }
    .small-header .nav-link {
        padding-left:15px;
        padding-bottom: 5px;
    } */
    .navbar-light .navbar-nav .nav-link {
        padding-top: 15px;
    }
    .navbar.navbar-expand-lg.navbar-light {
        padding-left:0;
    }
    .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
        color: #fff;
        border-bottom: 1px solid #D3B960;
        background-color: #D3B960;
        padding-top: 15px;
    }
    .header .nav-item {
        padding-right:0;
    }
    .mobi-logo {
        padding:0;
    }
    tbody th img {
        width: 100%;
    }
    .table-responsive>.table>tbody>tr>td, .table-responsive>.table>tbody>tr>th, .table-responsive>.table>tfoot>tr>td, .table-responsive>.table>tfoot>tr>th, .table-responsive>.table>thead>tr>td, .table-responsive>.table>thead>tr>th {
        white-space: nowrap;
    }
    td i {
        float: none;
    }
    .btn.btn-default.btn-number {
        padding:6px;
    }
    .table-responsive>.table {
        margin-bottom: 0;
    }
    .cart-products {
        padding: 10px;
    }
    .cart-page .card-body, .checkout-page .card-body {
        padding: 15px 0;
    }
    .cart-page .card .bronze {
        margin-left: 30px;
    }
    .home-header p br {
        display:none;
    }
    .free-delivery i {
        font-size: 20px;
        padding-right: 10px;

    }
    .free-delivery p {
        font-size: 15px;
    }
    h2, .h2 {
        font-size: 22px;
    }
    .h3, h3 {
        font-size: 25px;
    }
    .testimonials {
        padding: 10% 0 20% 0;
    }
    .dropdown-toggle i {
        left: 83%;
    }
    .testimonials h2 {
        font-size:34px;
    }
    .social-section .container::after {
        height:1px;
    }
    .vision-mission .container::after {
        height:1px;
    }
   
    .our-products span, .why-choose-us span, .contact span {
        padding-bottom: 8px;
    }
    .carousel-control-next, .carousel-control-prev {
        width: 91%;
        top: 105%;
    }
    .newsletter {
        padding-left:15px!important;
    }
    .follow {
        padding-bottom:5%;
    }
    .contact .col-md-12 {
        padding-bottom:20px;
    }
    .contact .mt-5 {
        margin-top: 19px!important;
    }
    .contact .mb-4, .my-4 {
        margin-bottom: 10px!important;
    }
    .why-choose-us {
        background:#F3F3F3;
    }
    .pagination {
        justify-content: center;
    }
    .contact h5 {
        font-size: 20px!important;
    }
    .wishlist-page {
        overflow:hidden;
    }
    .wishlist-page .card img {
        width: 90%;
        margin-top: 20px;
        margin-left: 16px;
    }
    .wishlist-page .card {
        flex-direction: column;
        width: 100%;
    }
    .wishlist-page .total-amt {
        padding-left: 20px;
        font-size: 21px;
    }
    .wishlist-btn {
        left: 70%;
        top: -28%;
    }
    .wishlist-page .card.order-summery {
        max-height: 41vh;
        margin-top: 11px;
        margin-left: 15px;
    }
    .wishlist-page .icons i {
        padding-top: 0;
        float: right;
        margin-bottom: 20px;
    }
    .order-history-page {
        overflow: hidden;
    }
    .order-history-page .shopping {
        padding-bottom:0;
    }
    .order-history-page .table th, .order-history-page .table td {
        font-weight: 600!important;
        padding: 8px 0px;
    }
    .order-history-page .btn-primary.green-request {
        width: 158px;
        margin-right: 24%;
        margin-bottom: 20px;
    }
    .order-history-page .card-body {
        padding: 1.25rem;
    }
    /* hide table headings */
    #data.table-responsive table thead {
        display: none;
    }

    /* treat rows like divs */
    #data.table-responsive table tr {
        display: block;
        border-top: none; /* separate row data with thicker line */
        margin-top: 5px;
    }

    /* treat columns like divs */
    #data.table-responsive table td {
        display: block;
        text-align: right; /* text to right */
    }

    /* this part is ugly, but necessary to show label on left */
    #data.table-responsive table td:before {
        content: attr(data-label);
        float: left; /* label to left */
        font-weight: 700;
    }
      /* hide table headings */
    #data-address.table-responsive table thead {
        display: none;
    }

    /* treat rows like divs */
    #data-address.table-responsive table tr {
        display: block;
        border-top: none; /* separate row data with thicker line */
        margin-top: 5px;
    }

    /* treat columns like divs */
    #data-address.table-responsive table td {
        display: block;
        text-align: right; /* text to right */
        border-bottom: none;
        width: auto!important;
    }
    .delivery-addresses-page .table {
        margin-bottom: 0;
    }
    .delivery-addresses-page .shopping .d-flex{
        display: block!important;
    }
    #data-address .table tbody + tbody {
        border-bottom: 3px solid #A9CE46;
        border-top: 3px solid #A9CE46;
    }
    /* this part is ugly, but necessary to show label on left */
    #data-address.table-responsive table td:before {
        content: attr(data-label);
        float: left; /* label to left */
        font-weight: 700;
    }
    .order-history-page .card {
        min-height: auto!important;
        height:auto!important;
        margin-left: 17px;
        margin-right: 17px;
    }
    .order-history-page .btn-primary.bronze {
        margin-bottom: 20px;
    }
    .footer-blk .logo {
        margin-bottom:5%;
    }
    .footer.bg-white {
        padding: 4% 0;
    }
    .copyright {
        font-size:14px;
        text-align:center;
        padding-bottom:2%;
    }
}

/* Tablet & small screens: */
@media (min-width: 768px) and (max-width: 991px) {
    .mobi-logo a {
        font-size: 25px;
    }
    .row-cols-5>* {
        -ms-flex: 0 0 20%;
        flex: 100%;
        max-width: 50%;
    }
    h1, .h1 {
        font-size: 40px;
    }
    .navbar-light .navbar-toggler {
        color: black;
        border: none;
        text-align: right;
    }
    .logo a {
        display:none;
    }
    /* .small-header {
        text-align: center;
    }
    .small-header .navbar-nav-header.d-flex.justify-content-end {
        padding-left:0;
        display:block!important;
    }
    .small-header .nav-link {
        padding-left:15px;
        padding-bottom: 5px;
    } */
    .small-header {
        display:none;
    }
    .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
        color: #fff;
        border-bottom: 1px solid #D3B960;
        background-color: #D3B960;
        padding-top: 15px;
    }
    .nav-link {
        padding-left:0;
        padding-bottom:15px;
    }
    .navbar-light .navbar-nav .nav-link {
        color: #221F1F;
        padding-top: 15px;
    }
    .nav-item.header-icons {
        padding-top: 15px;
    }
    .navbar-collapse {
        position: absolute;
        background-color: #fff;
        top: 54px;
        width: 50%;
        text-align: center;
        z-index: 99999;
        padding: 20px 0;
        left: 48%;
    }
    .header .nav-item {
        padding-right:0;
    }
    .home-header {
        background-image: url(/images/mobile-home-header.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        padding: 25% 0;
    }
    .nav-link {
        padding-left:0;
        padding-bottom:15px;
    }
    .nav-item i {
        margin-right: 8px;
    }
    .free-delivery i {
        font-size: 30px;
        padding-right: 10px;
    }
    .social-section .container::after {
        height:1px;
    }
    .vision-mission .container::after {
        height:1px;
    }
    .free-delivery p {
        font-size: 20px;
    }
    h2, .h2 {
        font-size: 29px;
    }
    .testimonials {
        padding: 10% 0 14% 0;
    }
    .carousel-control-next, .carousel-control-prev {
        width: 91%
    }
    .contact .col-md-12 {
        padding-bottom:20px;
    }
    .contact .mt-5 {
        margin-top: 19px!important;
    }
    .contact .mb-4, .my-4 {
        margin-bottom: 10px!important;
    }
    .pagination {
        justify-content: center;
    }
    .why-choose-us {
        background: linear-gradient(-136deg, #F3F3F3 50%, #eee 50%);
    }
    .browse-paging {
        text-align: center;
        padding: 0;
    }
    td .input-group {
        width: auto;
    }
    .order-history-page .table .wide {
        width: 37%!important;
    
    }
    .footer-blk .logo a {
        display:block;
    }
    .copyright {
        text-align: center;
    }
   
}

@media (min-width: 992px) and (max-width: 1199px) {
    .header .nav-item {
        padding-right: 34px;
    }
    .home-header {
        padding: 17% 0;
    }
    .logo a, .mobi-logo a {
        font-size: 29px;
    }
    h1, .h1 {
        font-size: 50px;
    }
    .why-choose-us {
        background: linear-gradient(-145deg, #F3F3F3 50%, #eee 50%);
    }
    .testimonials {
        padding: 5% 0 10%;
    }
    .cart-page .row .col-9.col-md-8.col-lg-7.pr-0 {
        padding-left:0!important;
    }
    td .input-group {
        width: 70%;
    }
    .order-history-page .table th, .order-history-page .table td {
        color: #000000!important;
    }
    .delivery-addresses-page .table th, .delivery-addresses-page .table td {
        color:  #000000!important;
    }
    .order-history-page .table th {
        color: #000000!important;
        padding-top: 25px;
    
    }
   
}

/* Laptop: */
@media (min-width: 1200px) and (max-width: 1600px) {
    h1, .h1 {
        font-size: 55px;
    }
    .why-choose-us {
        background: linear-gradient(-149deg, #F3F3F3 50%, #eee 50%);
    }
    .testimonials {
        padding: 5% 0 8%;
    }
    .vision-mission .container::after {
        position: absolute; top:auto; bottom:-26%; left:50%;  /* 3. Position the pseudo-element */
        height:360px;
    }
    .delivery-addresses-page .table th, .delivery-addresses-page .table td {
        color:  #000000!important;
    }
    .order-history-page .card-body {
        padding: 0px 26px 15px 26px;
    }
}

/* 14” HD Laptop and bigger */
@media (min-width: 1391px) and (max-width: 1439px), (min-height: 300px) and (max-height: 650px) and (orientation: landscape){
    .home-header {
        padding: 10% 0!important;
    }
    .why-choose-us {
        background: linear-gradient(-150deg, #F3F3F3 50%, #eee 50%);
    }
    .vision-mission i {
        height: 10vh;
    }
    .vision-mission .container::after {
        position: absolute; top:auto; bottom:-27%; left:50%;  /* 3. Position the pseudo-element */
        height:367px;
    }
    .order-history-page .table th {
        color: #000000!important;
    }
    .delivery-addresses-page .btn-primary.green-request {
        width: 169px;
    }
}

@media (min-width: 1400px) and (max-width: 1600px) {
    .home-header {
        padding: 12% 0;
    }
    .why-choose-us {
        background: linear-gradient(-153deg, #F3F3F3 50%, #eee 50%);
    }
    .vision-mission .container::after {
        position: absolute; top:auto; bottom:-30%; left:50%;  /* 3. Position the pseudo-element */
        height:381px;
    }
    
    .order-history-page .table th {
        padding-top: 22px;
    }
}