/************************************/
/***      Responsive css      ***/
/************************************/
@media (min-width: 992px) {
  .product-gallery-container {
    display: flex;
    flex-direction: row;
    gap: 20px;
    position: sticky;
    top: 120px;
  }
  .product-thumbnails-wrapper {
    flex: 0 0 100px;
    order: 1;
  }
  .main-product-wrapper {
    flex: 1;
    order: 2;
  }
  .product-thumbnails {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow-y: auto;
    max-height: 600px;
    padding: 5px 0;
  }
}
@media only screen and (min-width: 1700px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 620px 0 0;
  }
}
@media only screen and (min-width: 1900px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 700px 0 0;
  }
.why-choose-us::before {
  bottom: -240px;
  left: -0px;
  width: 700px;
  height:700px;
}
}
@media only screen and (min-width: 2000px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 750px 0 0;
  }
.why-choose-us::before {
  bottom: -270px;
  left: 5%;
  width: 730px;
  height: 730px;
}
.page-container {
  min-height: 80vh;
}
}
@media only screen and (min-width: 2500px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 920px 0 0;
  }
   .page-header {
        padding: 380px 0 280px;
    }
.why-choose-us::before {
  bottom: -240px;
  left: 16%;
  width: 700px;
  height: 700px;
}

}
@media only screen and (min-width: 2800px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 1020px 0 0;
  }
.why-choose-us::before {
  bottom: -240px;
  left: 20%;
  width: 700px;
  height: 700px;
}
}
@media only screen and (min-width: 2900px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 1040px 0 0;
  }
}
/************************************/
@media only screen and (max-width: 1400px) {
.bg-ad {
  background-size: cover!important;
}
.why-choose-us::before {
  bottom: -150px;
  left: -80px;
  width: 600px;
  height: 600px;
}
}
@media only screen and (max-width: 1280px) {
  .interactive-process-layout .interactive-inner-process {
    padding: 480px 0 0;
  }
.opening-time-box3 {
    left: 24%;
  } 
  .page-blog {
    padding-left: 10px;
    padding-right: 10px;
  }
.why-choose-us::before {
  bottom: -150px;
  left: -100px;
  width: 600px;
  height: 600px;
}
}
@media only screen and (max-width: 1180px) {
   .member-container .section-content {
        padding: 0px 0px 50px;
    }
.about-us {
  padding: 80px 20px 100px;
}
    .our-pricing {
        padding: 80px 20px 100px;
    }
.opening-time-box2 {
    left: 35%;
  }  
.opening-time-box3 {
    left: 22%;
  } 
.why-choose-us::before {
  bottom: -130px;
  left: -200px;
  width: 600px;
  height: 600px;
}
}
@media only screen and (max-width: 1024px) {
 .cart-page {
    background-position: -350px 100px;
  }
  .page-single-post {
    padding-left: 10px;
    padding-right: 10px;
  }
  .opening-time-box2 {
    left: 33%;
  }
  .opening-time-box3 {
    left: 18%;
  }
  .interactive-process-layout .interactive-inner-process {
    padding: 340px 0 0;
  }
  .main-menu ul li.nav-item a {
    letter-spacing: 0em;
    padding: 15px 10px !important;
  }
  .process-content-wap h2 {
    font-size: 22px;
  }
  .cart-layout {
    grid-template-columns: 1fr;
  }
  .order-summary {
    position: relative;
    top: auto;
  }
  .bottom-section {
    grid-template-columns: 1fr;
  }
  .order-summary {
    position: relative;
    top: auto;
  }
 .section-title h2.big {
    font-size: 48px;
  }
}
@media (max-width: 992px) {
  .wishlist-item {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .wishlist-item .product-actions {
    min-width: auto;
    flex-direction: row;
  }
  .wishlist-item .wishlist-date {
    position: static;
    text-align: left;
    margin-top: 10px;
  }
}
@media only screen and (max-width: 991px) {

    .wishlist-item .product-title {
        padding-top: 0px;
    }
    .wishlist-item .product-info {
        margin-top: 0px;
    }
    .why-choose-us::before {
       bottom:0;
       top:100px;
       left: -10px;
       width: 400px;
       height: 400px;
    }
 .opening-time-box2 {
    left: 39%;
  }
 .opening-time-box3 {
    left: 25%;
  }
    .cart-page .section-content.policy-content {
        padding: 40px 28px 40px;
    }
.bottom-section2 {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  margin: 0 auto;
}
.accordion-button {
    font-size: 1rem;
    font-weight: 500;
    color: var(--heading-color);
    background-color: #fdfaf6;
    border: none;
    box-shadow: none;
    line-height: 1.6;
}
    .accordion-body {
        padding: 15px 18px 18px;
        font-size: 15px;
    }
  .product-title {
    padding-top: 30px;
  }
  .carousel.phone-slider {
    display: block;
  }
  .interactive {
    display: none;
  }
  .our-menu-list {
    margin-top: 40px;
  }
  .culture-overlay {
    opacity: 1;
  }
  .content-in {
    padding: 60px 0 60px;
  }
  .header-button-box {
    display: flex;
  }
  .top-link-phone {
    width: auto;
    margin-left: 0px;
    display: inline-flex;
  }
  .top-link-phone a {
    position: relative;
    display: inline-block;
    margin-left: 0px;
    margin-right: 12px;
    letter-spacing: 0em;
    padding: 0 !important;
  }
  .top-link-phone img {
    width: 24px;
    height: 24px;
    vertical-align: middle;
  }
  .header-sidebar-btn .offcanvas .btn-close {
    background-image: url("../images/icon-close2.svg");
    background-repeat: no-repeat;
    background-size: 26px auto;
  }
  header.main-header .header-sticky.hide {
    transform: translateY(0);
    transition: transform 0.4s ease;
  }
  .navbar-brand img {
    height: 42px;
  }
  .btn-default {
    padding: 15px 20px;
  }
  .btn-default.btn-highlighted {
    padding: 14px 20px;
  }
  .topbar-contact-info ul {
    gap: 15px;
  }
  .topbar-contact-info ul li img {
    margin-right: 5px;
  }
  .topbar-social-links ul li {
    padding-right: 10px;
    margin-right: 10px;
  }
  .topbar-social-links ul li a i {
    font-size: 16px;
  }
  .navbar {
    padding: 12px 0;
  }
  .main-menu ul li.highlighted-menu {
    display: block;
  }
  .slicknav_nav li, .slicknav_nav ul {
    display: block;
  }
  .responsive-menu, .navbar-toggle {
    display: block;
  }
  .section-row {
    margin-bottom: 40px;
  }
  .section-row .section-title {
    max-width: 100%;
  }
  .section-title h3 {
    padding-left: 25px;
  }
  .section-title h3::before {
    width: 18px;
    height: 18px;
  }
  .section-title h1 {
    font-size: 50px;
  }
  .section-title h2 {
    font-size: 34px;
  }
  .section-title p {
    margin-top: 15px;
  }
  .section-title-content {
    margin-left: 0;
    margin-top: 15px;
  }
  .section-btn {
    text-align: left;
    margin-top: 15px;
  }
  .hero {
    padding: 100px 0;
  }
  .hero.hero-slider-layout .hero-slide {
    padding: 100px 0;
  }
  .hero.hero-slider-layout .hero-pagination {
    bottom: 30px;
    padding-left: 15px;
  }
  .our-scrolling-ticker {
    padding: 15px 0;
  }
  .scrolling-ticker-box {
    --gap: 20px;
  }
  .scrolling-content span {
    font-size: 34px;
  }
  .scrolling-content span img {
    margin-right: 20px;
  }
  .about-us {
    padding:80px 20px;
  }
  .about-us-content {
    margin-right: 0;
    margin-bottom: 0px;
  }

  .about-body-item {
    margin-bottom: 20px;
  }
  .about-body-item .icon-box {
    width: 50px;
    height: 50px;
    margin-right: 15px;
  }
  .about-body-item .icon-box img {
    max-width: 25px;
  }
  .about-body-list-content {
    width: calc(100% - 65px);
  }
  .about-body-list-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .about-us-footer {
    margin-top: 40px;
  }
  .about-us-image {
    width: 100%;
    max-width: 75%;
    margin: 0 auto;
    padding-left: 90px;
  }
  .opening-time-box {
    max-width: 290px;
    border-radius: 16px;
    padding: 20px;
  }
  .opening-time-box .icon-box {
    width: 40px;
    height: 40px;
  }
  .opening-time-box .icon-box i {
    font-size: 20px;
  }
  .opening-time-content h3 {
    font-size: 20px;
    margin-bottom: 15px;
  }
  .why-choose-content {
    position: static;
    top: 0;
    margin-right: 0;
    margin-bottom: 30px;
  }
  .why-choose-item {
    padding: 20px 20px 20px 0;
  }
  .why-choose-item:nth-of-type(2n + 2) {
    padding: 20px 0 20px 20px;
  }
  .why-choose-item:nth-last-child(-n + 2) {
    padding-bottom: 0;
    border-bottom: none;
  }
  .why-choose-item:nth-child(-n + 2) {
    padding-top: 0;
  }
  .why-choose-item .icon-box {
    width: 50px;
    height: 50px;
  }
  .why-choose-item .icon-box img {
    max-width: 25px;
  }
  .why-choose-item-content h3 {
    font-size: 20px;
  }
  .intro-video {
    padding: 100px 0 50px;
  }
  .intro-video-box.about-intro-video .video-play-button p {
    font-size: 18px;
  }
  .intro-video-counters {
    gap: 15px;
    margin-top: 100px;
    padding-top: 20px;
  }
  .video-counter-item {
    width: calc(25% - 11.25px);
  }
  .video-counter-item .icon-box {
    width: 50px;
    height: 50px;
    margin-right: 8px;
  }
  .video-counter-item .icon-box img {
    max-width: 25px;
  }
  .video-counter-content {
    width: calc(100% - 58px);
  }
  .video-counter-content h2 {
    font-size: 34px;
  }
  .video-counter-content p {
    font-size: 16px;
  }
  .our-pricing {
    padding: 60px 20px;
  }
  .our-support-nav {
    margin-bottom: 30px;
  }
  .our-pricing-box .nav-tabs {
    gap: 20px;
  }
  .pricing-image {
    width: 100%;
    max-width: 65%;
    margin: 0 auto 30px;
  }
  .menu-list-item {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
  .menu-list-image {
    margin-right: 20px;
  }
  .menu-list-image figure {
    max-width: 80px;
  }
  .menu-item-body {
    width: calc(100% - 100px);
  }
  .menu-item-title {
    margin-bottom: 5px;
  }
  .menu-item-title h3 {
    font-size: 20px;
  }
  .section-footer-text {
    margin-top: 30px;
  }
  .interactive-process-layout .interactive-process-item:nth-child(2n + 2) {
    border-right: none;
  }
  .interactive-process-layout .interactive-inner-process {
    padding: 300px 0 0;
  }
  .process-content-wap {
    padding: 30px 20px 20px;
    text-align: center;
  }
  .process-content-wap h2 {
    font-size: 30px;
  }
  .our-offers {
    padding: 50px 0;
  }
  .our-offers-content {
    margin-bottom: 30px;
  }
  .offers-accordion .accordion-item {
    padding-bottom: 20px;
    margin-bottom: 20px;
  }
  .offers-accordion .accordion-header .accordion-button {
    font-size: 20px;
  }
  .offers-accordion .accordion-item .accordion-button::after, .offers-accordion .accordion-item .accordion-button.collapsed::after {
    font-size: 18px;
  }
  .offer-button {
    margin-top: 30px;
  }
  .our-offers-images {
    width: 100%;
    max-width: 80%;
    margin: 0 auto;
  }
  .offer-circle-image-1 img, .offer-circle-image-2 img {
    max-width: 130px;
  }
  .about-restaurant {
    padding: 50px 0;
  }
  .about-restaurant .container .row {
    align-items: start;
  }
  .about-restaurant-image {
    width: 100%;
    max-width: 80%;
    margin: 0 auto;
    margin-top: 30px;
  }
  .about-restaurant-image img {
    aspect-ratio: 1 / 1.1;
  }
  .about-restaurant-info {
    padding-top: 30px;
    margin-bottom: 30px;
  }
  .about-restaurant-info h3 {
    margin-bottom: 20px;
  }
  .about-restaurant-info p {
    margin-bottom: 15px;
  }
  .restaurant-time-body {
    padding-top: 30px;
  }
  .restaurant-time-body h3 {
    margin-bottom: 20px;
  }
  .restaurant-time-body ul {
    margin: 0 0 20px 0;
    padding: 0 0 20px 0;
  }
  .restaurant-time-body ul li {
    margin-bottom: 10px;
  }
  .our-testimonials {
    padding: 50px 0;
  }
  .testimonial-slider .swiper {
    margin: 0 50px;
  }
  .testimonial-content p {
    font-size: 26px;
  }
  .author-info {
    margin-top: 15px;
  }
  .testimonial-btn-prev, .testimonial-btn-next {
    width: 45px;
    height: 45px;
  }
  .testimonial-btn-prev::before, .testimonial-btn-next::before {
    font-size: 18px;
  }
  .cta-box {
    padding: 50px 0;
  }
  .cta-box::before {
    height: 290px;
    width: 175px;
    opacity: 10%;
  }
  .cta-box-content .section-title {
    margin-bottom: 30px;
  }
  .cta-box-buttons .btn-default {
    padding: 13px 22px;
  }
  .main-footer {
    padding: 50px 0 0;
  }
  .footer-contact-list {
    gap: 15px 10px;
  }
  .footer-contact-item {
    width: calc(33.33% - 6.67px);
    padding-right: 10px;
  }
  .footer-contact-item .icon-box, .footer-contact-detail {
    margin-bottom: 15px;
  }
  .footer-contact-item .icon-box img {
    max-width: 50px;
  }
  .footer-contact-detail h3 {
    font-size: 24px;
  }
  .footer-contact-detail p {
    font-size: 18px;
  }
  .footer-copyright {
    padding: 40px 0 50px;
    margin-top: 40px;
  }
  .footer-logo img {
    max-width: 165px;
  }
  .footer-social-links ul li {
    margin-right: 10px;
  }
  .footer-social-links ul li a {
    width: 40px;
    height: 40px;
  }
  .footer-social-links ul li a i {
    font-size: 20px;
  }
  .page-header {
    padding: 130px 0 70px;
  }
  .page-header-box h1 {
    font-size: 50px;
  }
  .our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span {
    font-size: 22px;
  }
  .our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span img {
    max-width: 18px;
  }
  .our-approach {
    padding: 50px 0;
  }
  .our-approach-content {
    margin-bottom: 30px;
    margin-top: 30px;
  }
  .mission-vision-item {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
  .mission-vision-item .icon-box {
    width: 50px;
    height: 50px;
    margin-right: 15px;
  }
  .mission-vision-item .icon-box img {
    max-width: 25px;
  }
  .mission-vision-content {
    width: calc(100% - 65px);
  }
  .mission-vision-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .our-approach-image {
    max-width: 70%;
    margin: 0 auto;
  }
  .our-team {
    padding: 50px 0 20px;
  }
  .team-item:hover .team-social-icon {
    margin-bottom: 20px;
  }
  .team-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .our-story {
    padding: 50px 0;
  }
  .our-story-image {
    max-width: 70%;
    margin: 0 auto;
    margin-bottom: 30px;
  }
  .our-story-image img {
    aspect-ratio: 1 / 1.25;
  }
  .story-item {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
  .story-item .icon-box {
    width: 50px;
    height: 50px;
    margin-right: 15px;
  }
  .story-item .icon-box img {
    max-width: 25px;
  }
  .story-item-content {
    width: calc(100% - 65px);
  }
  .story-item-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .our-story-btn {
    margin-top: 30px;
  }
  .our-faqs {
    padding: 50px 0;
  }
  .faqs-content {
    margin-bottom: 30px;
  }
  .faq-accordion .accordion-header .accordion-button {
    font-size: 20px;
    padding: 12px 45px 12px 12px;
  }
  .faq-accordion .accordion-item .accordion-button::after, .faq-accordion .accordion-item .accordion-button.collapsed::after {
    right: 12px;
    font-size: 12px;
    width: 22px;
    height: 22px;
  }
  .faq-accordion .accordion-item .accordion-body {
    padding: 0 45px 12px 12px;
  }
  .faqs-image {
    max-width: 70%;
    margin: 0 auto;
  }
  .page-services {
    padding: 50px 0 20px;
  }
  .service-item {
    border-radius: 16px;
    padding: 30px;
  }
  .service-item .icon-box {
    width: 50px;
    height: 50px;
    margin-bottom: 30px;
  }
  .service-item .icon-box img {
    max-width: 25px;
  }
  .service-content {
    margin-bottom: 20px;
  }
  .service-content h3 {
    font-size: 20px;
  }
  .page-service-single {
    padding: 50px 0;
  }
  .page-single-sidebar {
    position: initial;
    margin: 0 0 30px 0;
  }
  .page-category-list {
    border-radius: 999px;
    margin-bottom: 0px;
  }
  .page-category-list h3 {
    font-size: 20px;
    padding: 20px;
  }
  .page-category-list ul {
    padding: 20px;
  }
  .member-sidebar .main-content {
    padding: 20px 0 10px;
    margin-bottom: 40px;
    margin-left: 10px;
    margin-right: 10px;
  }
  .member-container .main-content {
    padding: 10px 10px 10px;
  }
  .security-tips {
    padding: 20px 15px;
  }
  .sidebar-cta-box {
    border-radius: 16px;
    padding: 20px;
  }
  .sidebar-cta-body {
    margin-bottom: 20px;
  }
  .sidebar-cta-body h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .sidebar-cta-footer ul li {
    margin-bottom: 10px;
  }
  .sidebar-cta-footer ul li img {
    max-width: 24px;
    margin-right: 15px;
  }
  .service-feature-image figure, .service-feature-image img {
    border-radius: 16px;
  }
  .service-entry {
    margin-bottom: 40px;
  }
  .service-entry p {
    margin-bottom: 15px;
  }
  .service-entry h2 {
    font-size: 34px;
    margin-bottom: 15px;
  }
  .service-entry ul li {
    padding-left: 25px;
    margin-bottom: 10px;
  }
  .service-entry ul li::before {
    font-size: 18px;
  }
  .coffee-industry-info {
    margin-top: 40px;
  }
  .service-entry-box {
    padding: 30px 0;
    margin: 30px 0;
  }
  .service-entry-item .icon-box {
    width: 50px;
    height: 50px;
    margin-bottom: 30px;
  }
  .service-entry-item .icon-box img {
    max-width: 25px;
  }
  .page-menu {
    padding: 50px 0;
  }
  .page-menu-box {
    gap: 50px;
  }
  .page-menu-image {
    margin-bottom: 30px;
  }
  .page-menu-image figure, .page-menu-image img {
    border-radius: 16px;
  }
  .page-menu-list {
    gap: 20px;
  }
  .page-menu-list .our-menu-list {
    width: 100%;
    padding-bottom: 20px;
    border-bottom: 1px dashed var(--divider-color);
  }
  .page-menu-list .our-menu-list:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
  .post-item {
    height: calc(100% - 30px);
    margin-bottom: 30px;
  }
  .post-featured-image, .post-item-content {
    margin-bottom: 15px;
  }
  .post-featured-image figure {
    border-radius: 0px;
  }
  .post-featured-image img {
    aspect-ratio: 1 / 0.75;
    border-radius: 0px;
  }
  .post-item-content h2 {
    font-size: 20px;
  }
  .post-item-content p {
    font-size: 15px;
    line-height: 1.7;
  }
  .page-pagination {
    margin: 0;
  }
  .post-single-meta ol li {
    font-size: 16px;
  }
  .post-single-meta ol li i {
    font-size: 16px;
  }
  .post-image {
    margin-bottom: 20px;
  }
  .post-image figure, .post-image img {
    border-radius: 16px;
  }
  .post-entry h1, .post-entry h2, .post-entry h3, .post-entry h4, .post-entry h5, .post-entry h6 {
    margin: 0 0 0.417em;
  }
  .post-entry h2 {
    font-size: 34px;
  }
  .post-entry p {
    margin-bottom: 15px;
  }
  .post-entry ul li {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .post-entry blockquote {
    background-position: 20px 20px;
    background-size: 45px;
    padding: 20px 20px 20px 80px;
    margin-bottom: 20px;
  }
  .post-entry blockquote p {
    font-size: 18px;
  }
  .post-tags {
    margin-bottom: 20px;
  }
  .post-social-sharing ul {
    text-align: left;
  }
  .page-projects {
    padding: 50px 0 20px;
  }
  .our-Project-nav {
    margin-bottom: 50px;
  }
  .our-Project-nav ul {
    gap: 10px 40px;
  }
  .our-Project-nav ul li a::before {
    right: -25px;
  }
  .project-content {
    right: 30px;
    bottom: 30px;
    left: 30px;
  }
  .project-image a {
    border-radius: 16px;
  }
  .project-image img {
    aspect-ratio: 1 / 0.78;
  }
  .project-content h3 {
    font-size: 20px;
  }
  .page-project-single {
    padding: 50px 0;
  }
  .project-detail-box {
    border-radius: 16px;
    padding: 20px;
    margin-bottom: 30px;
  }
  .project-detail-item {
    margin-bottom: 20px;
  }
  .project-detail-item .icon-box img {
    max-width: 40px;
  }
  .project-detail-item .icon-box {
    margin-right: 15px;
  }
  .project-detail-item-content {
    width: calc(100% - 55px);
  }
  .project-detail-item-content h3 {
    font-size: 20px;
  }
  .project-featured-image figure, .project-featured-image img {
    border-radius: 16px;
  }
  .project-entry {
    margin-bottom: 40px;
  }
  .project-entry p {
    margin-bottom: 15px;
  }
  .project-entry h2 {
    font-size: 34px;
    margin-bottom: 15px;
  }
  .project-entry ul {
    margin: 30px 0;
    gap: 15px;
  }
  .project-entry ul li {
    width: calc(50% - 7.5px);
    font-size: 16px;
    padding-left: 25px;
  }
  .project-entry ul li::before {
    font-size: 18px;
  }
  .project-connection-box {
    margin-top: 40px;
  }
  .page-team {
    padding: 50px 0 20px;
  }
  .page-team-single {
    padding: 50px 0;
  }
  .team-sidebar-image {
    margin-bottom: 30px;
  }
  .team-sidebar-image figure {
    border-radius: 16px;
  }
  .team-sidebar-image img {
    aspect-ratio: 1 / 0.8;
    border-radius: 16px;
  }
  .team-single-entry {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
  .member-content-body ul li {
    margin-bottom: 20px;
  }
  .member-content-body ul li span {
    width: 32%;
    font-size: 20px;
  }
  .member-content-body ul li img {
    max-width: 22px;
    margin-right: 10px;
  }
  .member-social-links {
    margin-top: 30px;
  }
  .page-gallery {
    padding: 50px 0 20px;
  }
  .page-gallery-box .photo-gallery figure, .page-gallery-box .photo-gallery img {
    border-radius: 16px;
  }
  .page-video-gallery {
    padding: 50px 0 20px;
  }
  .video-gallery-image a::before, .video-gallery-image img {
    border-radius: 16px;
  }
  .page-faqs {
    padding: 50px 0;
  }
  .faq-accordion.page-faq-accordion {
    margin-bottom: 40px;
  }
  .page-contact-us {
    padding: 50px 0 25px;
  }
  .contact-information {
    margin-bottom: 30px;
  }
  .contact-info-body {
    gap: 30px;
  }
  .contact-info-box-1, .contact-info-box-2 {
    padding: 20px 30px;
    border-radius: 16px;
  }
  .contact-info-item .icon-box {
    width: 50px;
    height: 50px;
    margin-bottom: 15px;
  }
  .contact-info-item .icon-box img {
    max-width: 25px;
  }
  .contact-item-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .contact-us-form {
    padding: 30px;
    border-radius: 16px;
  }
  .contact-form-content {
    margin-bottom: 30px;
  }
  .contact-form-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .contact-us-form .form-control {
    padding: 0 0 10px 0;
  }
  .google-map {
    padding: 25px 0 50px;
  }
  .google-map-iframe, .google-map-iframe iframe {
    height: 450px;
    border-radius: 16px;
  }
  .page-book-table {
    padding: 50px 0;
  }
  .book-table-image {
    width: 100%;
    max-width: 65%;
    margin: 0 auto 30px;
  }
  .error-page {
    padding: 50px 0;
  }
  .error-page-image {
    margin-bottom: 30px;
  }
  .error-page-image img {
    max-width: 80%;
  }
  .record-toggle {
    align-self: flex-end;
    margin-top: 10px;
  }
  .order-filters {
    flex-direction: column;
    align-items: stretch;
  }
  .order-actions {
    justify-content: center;
    width: 100%;
  }
  .story-card-alt {
    width: calc(50% - 15px);
  }
  .product-gallery-container {
    display: flex;
    flex-direction: column;
  }
  .product-thumbnails-wrapper {
    order: 2;
  }
  .main-product-wrapper {
    order: 1;
  }
  .product-thumbnails {
    display: flex;
    flex-direction: row;
    gap: 10px;
    overflow-x: auto;
    padding: 5px 0;
  }
  .bg-ad {
    background-size: cover !important;
  }
  .post-tags .tag-links a {
    font-size: 15px;
  }
  .section-title h2.big {
    font-size: 40px;
  }
  .intro-video-content .section-title {
    margin-bottom: 40px;
    text-align: center;
  }
  .story-card-alt .card-content-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 80px 25px 20px;
    z-index: 2;
    background: var(--story-overlay-bg);
    transform: translateY(0%);
    opacity: 1;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
  }
  .stories-page-container {
    padding-bottom: 60px;
  }
  .login-image {
    display: none;
  }
  .process-content-wap p {
    font-size: 16px;
    font-weight: 500;
    color: var(--primary-color);
    margin-bottom: 5px;
  }
  .phone-slider .carousel-caption {
    position: absolute;
    bottom: 0%;
    left: 0%;
    z-index: 10;
    text-align: center;
    padding: 60px 10px 15px;
    width: 100%;
  }
  .phone-slider .carousel-caption::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(0deg, var(--secondary-color) 30%, transparent 100%);
    z-index: -1;
    border-radius: 0px;
  }
}

@media (max-width: 820px) {
    .why-choose-us::before {
       bottom:0;
       top:100px;
       left: -80px;
       width: 400px;
       height: 400px;
    }
   }
@media (max-width: 768px) {
.product-detail-section {
  padding: 60px 10px 0;
}
 .opening-time-box2 {
    left: 37%;
  }
 .opening-time-box3 {
    left: 22%;
  }
  .wishlist-actions .btn-highlighted {
    margin-bottom: 0;
  }
  .wishlist-actions .form-select {
    width: 100%;
    margin-bottom: 10px;
  }
  .wishlist-item {
    padding: 15px;
  }
  .wishlist-item .product-image img {
    height: 150px;
  }
  .wishlist-item .product-actions .btn-sm {
    flex: 1;
  }
  .message-content {
    max-width: 90%;
  }
  .login-page {
    padding: 100px 15px 20px;
  }
  .login-form-container {
    padding: 40px 0px 60px;
  }
  .social-login {
    grid-template-columns: 1fr;
  }
  .related-culture {
    padding: 80px 0;
    background-attachment: scroll;
    background-position: center center;
    background-size: cover;
  }
  .culture-image {
    height: 300px;
  }
  .immersive-hero .hero-title {
    font-size: 48px;
  }
  .product-info {
    padding-left: 0;
    margin-top: 30px;
  }
  .product-title {
    font-size: 26px;
  }
  .current-price {
    font-size: 26px;
    margin-right: 2px;
  }
  .product-actions {
    flex-direction: column;
  }
  .btn-wishlist {
    margin: 10px auto 0;
  }
  .btn-add-cart, .btn-buy-now {
    flex: 1;
  }
  .product-features {
    flex-direction: column;
  }
  .related-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
  }
  .cart-item {
    display: block;
    flex-direction: column;
    align-items: flex-start;
  }
  .item-box2 {
    margin-top: 15px;
  }
  .item-actions {
    width: 60%;
    justify-content: space-between;
    display: inline-flex
  }
  .cart-page .section-header {
    padding: 30px 22px 20px;
  }
  .cart-page .quantity-input {
    width: 30px;
  }
  .item-box2 .item-btn {
    margin: 0;
  }
  .item-total {
    width: 38%;
    display: inline-flex;
    order: 2;
    margin-left: 10px;
  }
  .item-btn {
    order: 3;
    margin: 0;
  }
  .coupon-section {
    padding: 20px 20px 30px;
  }
  .coupon-input {
    width: 160px;
  }
  .date-time-section {
    grid-template-columns: 1fr;
  }
  .payment-methods {
    grid-template-columns: 1fr;
  }
  .invoice-options {
    grid-template-columns: 1fr;
  }
  .delivery-info-grid {
    grid-template-columns: 1fr;
  }
  .checkout-steps::before {
    display: none;
  }
  .terms-links {
    flex-direction: column;
    gap: 10px;
  }
  .success-title {
    font-size: 28px;
  }
  .success-subtitle {
    font-size: 18px;
  }
  .order-number {
    font-size: 20px;
    padding: 15px;
  }
  .order-content {
    padding: 25px 20px;
  }
  .order-info-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .action-buttons {
    grid-template-columns: 1fr;
  }
  .success-title {
    font-size: 28px;
  }
  .success-subtitle {
    font-size: 18px;
  }
  .order-number {
    font-size: 20px;
    padding: 15px;
  }
  .order-content {
    padding: 25px 20px;
  }
  .order-info-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .action-buttons {
    grid-template-columns: 1fr;
  }
  .form-row {
    flex-direction: column;
    gap: 0;
  }
  .forgot-password-page {
    padding: 100px 15px 20px;
  }
  .forgot-password-image {
    display: none;
  }
  .forgot-password-form-container {
    padding: 40px 0px;
  }
  .member-container .section-content {
    padding: 0px;
  }
  .form-actions {
    margin-top: 5px;
  }
}
@media only screen and (max-width: 767px) {
.on-load-modal .modal-dialog {
    max-width: 92%; /* 視窗最大寬度 */
    margin: 1.75rem auto;
}
.product-detail-section {
  padding: 30px 0px 0;
}
.footer-info-1 {
    margin: 0 0 30px 0;
    padding: 0;
  }
  .footer-info-1:before {
    display: none;
  }
  .footer-info-2 {
    margin: 0;
    padding: 0;
  }
  .footer-info-2:before {
    display: none;
  }
  .main-footer .section-title h2 {
    font-size: 28px;
    text-align: center;
  }
  .logo-footer {
    width: 300px;
    margin: 0 auto 20px auto;
  }
  .main-footer {
    padding: 60px 0 20px;
  }

  .main-footer p {
    text-align: center;
  }
  .footer-social {
    text-align: center;
  }
  .content-in .about-us-content {
    margin-top: 280px;
    margin-bottom: 0px;
    margin-right: 0px;
    padding-left: 10px;
    padding-right: 10px;
  }
 .opening-time-box2 {
    left: 32%;
  }
 .opening-time-box3 {
    left: 27%;
  }
  body {
    font-size: 16px;
  }
  .topbar-social-links {
    display: none;
  }
  .topbar-contact-info ul {
    gap: 5px;
    flex-direction: column;
    align-items: center;
  }
  .section-title h1 {
    font-size: 30px;
  }
  .section-title h2 {
    font-size: 24px;
  }
  .scrolling-content span {
    font-size: 26px;
  }
  .scrolling-ticker-box {
    --gap: 15px;
  }
  .scrolling-content span img {
    max-width: 24px;
    margin-right: 15px;
  }
  .about-body-list-content h3 {
    font-size: 18px;
  }
  .about-us-footer {
    gap: 20px;
    justify-content: space-between;
    margin-top: 30px;
  }
  .video-play-button a {
    margin-right: 20px;
  }
  .about-us-image {
    max-width: 100%;
    padding-left: 25px;
    padding-right: 20px;
  }
  .opening-time-box {
    max-width: 245px;
    bottom: 20px;
    padding: 15px;
  }
  .opening-time-content h3 {
    font-size: 18px;
  }
  .opening-time-content ul li {
    margin-bottom: 10px;
  }
  .opening-time-content ul li span {
    width: 47%;
  }
  .why-choose-us::before {
    width: 90%;
    height: 280px;
    top: 130px;
  }
  .why-choose-us {
    padding: 0;
  }
  .why-choose-item {
    width: 100%;
    border-bottom: 1px solid var(--divider-color);
    border-right: none;
    margin-bottom: 20px;
    padding: 0 0 20px 0;
  }
  .why-choose-item:nth-of-type(2n + 2) {
    padding: 0 0 20px 0;
  }
  .why-choose-item:nth-last-child(-n + 2) {
    border-bottom: 1px solid var(--divider-color);
    padding-bottom: 20px;
  }
  .why-choose-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .why-choose-item-content h3 {
    font-size: 18px;
  }
  .intro-video {
    padding: 50px 0;
  }
  .intro-video-content {
    text-align: center;
  }
  .intro-video-box.about-intro-video {
    text-align: center;
    margin-top: 40px;
  }
  .intro-video-box.about-intro-video .video-play-button p {
    font-size: 16px;
  }
  .intro-video-counters {
    margin-top: 50px;
    gap: 25px 10px;
  }
  .video-counter-item {
    width: calc(50% - 5px);
  }
  .video-counter-item .icon-box {
    width: 45px;
    height: 45px;
    margin-right: 8px;
  }
  .video-counter-content {
    width: calc(100% - 53px);
  }
  .video-counter-content h2 {
    font-size: 26px;
  }
  .our-pricing-box .nav-tabs {
    gap: 8px;
  }
  .our-pricing-box ul li .btn-default.btn-highlighted {
    padding: 10px 12px;
    font-size: 12px;
  }
  .pricing-image {
    max-width: 100%;
  }
  .menu-list-image {
    margin-right: 10px;
  }
  .menu-list-image figure {
    max-width: 70px;
  }
  .menu-item-body {
    width: calc(100% - 80px);
  }
  .menu-item-title {
    gap: 8px;
  }
  .menu-item-title h3 {
    font-size: 16px;
  }
  .menu-item-title hr {
    width: 22%;
  }
  .menu-item-title span {
    font-size: 14px;
  }
  .interactive-process-layout .interactive-process-item {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid var(--dark-divider-color);
  }
  .interactive-process-layout .interactive-process-item:last-child {
    border-bottom: none;
  }
  .interactive-process-layout .interactive-inner-process {
    padding: 180px 0 0;
  }
  .process-content-wap h2 {
    font-size: 20px;
  }
  .offers-accordion .accordion-header .accordion-button {
    font-size: 18px;
    padding-left: 25px;
  }
  .offers-accordion .accordion-item .accordion-button::after, .offers-accordion .accordion-item .accordion-button.collapsed::after {
    font-size: 16px;
  }
  .our-offers-images {
    max-width: 100%;
    padding: 0 40px;
  }
  .offer-circle-image-1, .offer-circle-image-2 {
    border-width: 5px;
  }
  .offer-circle-image-1 {
    top: 30px;
  }
  .offer-circle-image-2 {
    bottom: 30px;
  }
  .offer-circle-image-1 img, .offer-circle-image-2 img {
    max-width: 90px;
  }
  .restaurant-timing-box .section-title, .about-restaurant-content .section-title {
    margin-bottom: 20px;
  }
  .about-restaurant-info {
    padding-top: 20px;
    margin-bottom: 20px;
  }
  .about-restaurant-info h3, .about-author-box h3 {
    font-size: 18px;
  }
  .about-restaurant-image {
    max-width: 100%;
    margin: 30px 0;
  }
  .restaurant-time-body {
    padding-top: 20px;
  }
  .restaurant-time-body h3 {
    font-size: 18px;
  }
  .testimonial-slider .swiper {
    margin: 0px;
    padding-bottom: 70px;
  }
  .testimonial-content p {
    font-size: 18px;
  }
  .testimonial-btn-prev, .testimonial-btn-next {
    top: auto;
    transform: translateY(0);
    bottom: 0px;
    width: 40px;
    height: 40px;
  }
  .testimonial-btn-prev {
    left: calc(50% - 25px);
    transform: translateX(-50%);
  }
  .testimonial-btn-next {
    right: calc(50% - 25px);
    transform: translateX(50%);
  }
  .testimonial-btn-prev::before, .testimonial-btn-next::before {
    font-size: 16px;
  }
  .cta-box-buttons .btn-default {
    margin-right: 10px;
  }
  .footer-contact-list {
    gap: 15px 10px;
  }
  .footer-contact-item {
    width: 100%;
    border-bottom: 1px solid var(--divider-color);
    padding: 0 0 15px 0;
    border-right: none;
  }
  .footer-contact-item:last-child {
    border-bottom: none;
  }
  .footer-contact-item .icon-box, .footer-contact-detail {
    margin-bottom: 15px;
  }
  .footer-contact-item .icon-box img {
    max-width: 40px;
  }
  .footer-contact-detail h3 {
    font-size: 18px;
  }
  .footer-copyright {
    gap: 20px;
    flex-direction: column;
    padding: 30px 0 15px;
    margin-top: 30px;
  }
  .page-header-box h1 {
    font-size: 32px;
    margin-bottom: 5px;
  }
  .page-header-box ol li.breadcrumb-item {
    font-size: 15px;
  }
  .mission-vision-content h3 {
    font-size: 18px;
  }
  .our-approach-image {
    max-width: 90%;
  }
  .team-body {
    right: 20px;
    bottom: 20px;
    left: 20px;
  }
  .team-item:hover .team-social-icon {
    margin-bottom: 15px;
  }
  .our-story-image {
    max-width: 100%;
  }
  .story-item-content h3 {
    font-size: 18px;
  }
  .faq-accordion .accordion-header .accordion-button {
    font-size: 18px;
    padding: 12px 35px 12px 12px;
  }
  .faq-accordion .accordion-item .accordion-button::after, .faq-accordion .accordion-item .accordion-button.collapsed::after {
    width: 20px;
    height: 20px;
    font-size: 10px;
  }
  .faq-accordion .accordion-item .accordion-body {
    padding: 0 12px 12px 12px;
  }
  .faqs-image {
    max-width: 100%;
  }
  .service-item {
    padding: 20px;
  }
  .service-item .icon-box {
    margin-bottom: 20px;
  }
  .service-content h3 {
    font-size: 18px;
    margin-bottom: 5px;
  }
  .page-category-list h3 {
    font-size: 18px;
    padding: 15px 20px;
  }
  .sidebar-cta-body h3 {
    font-size: 18px;
  }
  .service-feature-image {
    margin-bottom: 15px;
  }
  .service-feature-image img {
    aspect-ratio: 1 / 0.6;
  }
  .service-entry {
    margin-bottom: 30px;
  }
  .service-entry h2 {
    font-size: 26px;
  }
  .coffee-industry-info {
    margin-top: 30px;
  }
  .service-entry-box {
    padding: 20px 0;
    margin: 20px 0;
  }
  .service-entry-item {
    width: 100%
  }
  .service-entry-item .icon-box {
    margin-bottom: 20px;
  }
  .service-entry-item-content h3 {
    font-size: 18px;
    margin-bottom: 5px;
  }
  .page-menu-image img {
    aspect-ratio: 1 / 0.52;
  }
  .post-image img {
    aspect-ratio: 1 / 0.7;
  }
  .post-entry blockquote {
    background-position: 15px 12px;
    padding: 60px 15px 15px 15px;
  }
  .post-entry blockquote p {
    font-size: 18px;
  }
  .post-entry h2 {
    font-size: 26px;
  }
  .tag-links {
    font-size: 20px;
  }
  .our-Project-nav {
    margin-bottom: 30px;
  }
  .project-content {
    right: 20px;
    bottom: 20px;
    left: 20px;
  }
  .project-content h3 {
    font-size: 18px;
  }
  .project-detail-item-content h3 {
    font-size: 18px;
  }
  .project-featured-image img {
    aspect-ratio: 1 / 0.6;
  }
  .project-entry {
    margin-bottom: 30px;
  }
  .project-entry h2 {
    font-size: 26px;
  }
  .project-entry ul {
    margin: 20px 0;
  }
  .project-entry ul li {
    width: 100%;
  }
  .project-connection-box {
    margin-top: 30px;
  }
  .team-sidebar-image img {
    aspect-ratio: 1 / 1.1;
  }
  .member-content-body ul li {
    font-size: 16px;
  }
  .member-content-body ul li span {
    width: 42%;
    font-size: 16px;
  }
  .member-content-body ul li img {
    max-width: 18px;
    margin-right: 5px;
  }
  .contact-info-box-1, .contact-info-box-2 {
    padding: 20px;
    gap: 40px;
  }
  .contact-info-box-1 .contact-info-item::before {
    top: auto;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 20px);
    height: 1px;
    width: 100%;
  }
  .contact-info-box-1 .contact-info-item:nth-child(2n + 2):before {
    display: block;
  }
  .contact-info-box-1 .contact-info-item:last-child:before {
    display: none;
  }
  .contact-info-body .contact-info-box-1 .contact-info-item {
    display: flex;
    width: 100%;
  }
  .contact-info-body .contact-info-box-1 .icon-box, .contact-info-body .contact-info-box-2 .icon-box {
    margin: 0 15px 0 0;
  }
  .contact-info-box-1 .contact-item-content, .contact-info-box-2 .contact-item-content {
    width: calc(100% - 65px);
  }
  .contact-item-content h3 {
    font-size: 18px;
  }
  .contact-us-form {
    padding: 20px;
  }
  .contact-form-content h3 {
    font-size: 18px;
  }
  .contact-us-form .form-control {
    font-size: 16px;
  }
  .google-map-iframe, .google-map-iframe iframe {
    height: 350px;
  }
  .book-table-image {
    max-width: 100%;
  }
  .error-page-image {
    margin-bottom: 20px;
  }
  .interactive-process-layout .interactive-inner-process {
    padding: 80px 0 0;
  }
  .info-grid {
    grid-template-columns: 1fr;
  }
  .product-list-detailed .product-subtotal {
    display: none;
  }
  .story-card-alt {
    width: 100%;
  }
  .hero-title {
    font-size: 36px;
  }
  .section-content.qa-section {
    padding: 15px;
  }
  .policy-content {
    padding: 15px;
  }
}
@media only screen and (max-width: 576px) {
    .why-choose-us::before {
       left: -10px;
    }
 .opening-time-box2 {
    left: 28%;
  }
 .opening-time-box3 {
    left: 28%;
  }
  .immersive-hero .hero-subtitle {
    margin-bottom: 15px;
  }
  .section-title {
    margin-bottom: 30px;
  }
  .about-us {
    background-position: left top;
  }

  .title-1 {
    letter-spacing: 0rem;
  }

  .footer-bottom {
    padding: 70px 0 0;
  }
  .about-body-list-content {
    width: calc(100% - 0px);
  }
  .opening-time-box {
    max-width: 150px;
    top: 100px;
    left: -26px;
    padding: 15px;
  }
  .opening-time-box4 {
    max-width: 150px;
    top: 100px;
    left: -26px;
    padding: 15px;
  }
  .about-us-footer {
    justify-content: center;
    padding-bottom: 40px;
  }
  .page-team {
    padding: 50px 15px 70px;
  }
  .about-us-image.news-image {
    padding-right: 20px;
    padding-left: 25px;
    margin-top: 20px;
    margin-bottom: 15px;
  }
  .menu-list-item, .menu-list-item:last-child {
    flex-direction: column;
    border-bottom: 1px solid rgba(137, 101, 70, .4);
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
  .menu-list-image figure {
    max-width: 100%;
    width: 200px;
    margin: 0 auto 15px;
  }
  .menu-item-body {
    width: calc(100% - 15px);
  }
  .menu-item-title h3 {
    font-size: 19px;
    line-height: 1.5;
  }
  .section-footer-text {
    margin-top: 10px;
    margin-bottom: 20px;
  }
  .about-us {
    background: url(../images/bg-about-phone.jpg) no-repeat;
    background-position: top center;
    background-size: cover;
    padding: 85px 0 70px;
  }
  .copyright-line {
    display: none;
  }
  .our-menu-list {
    padding-left: 8px;
    padding-right: 8px;
  }
  .about-us-content {
    padding-left: 10px;
    padding-right: 10px;
  }
  .about-us-content {
    padding-left: 10px;
    padding-right: 10px;
  }
  .immersive-hero .hero-title {
    font-size: 36px;
  }
  .immersive-hero .hero-description {
    font-size: 14px;
    line-height: 1.7;
  }
  .current-price {
    display: inline-block;
    margin-bottom: 15px
  }
  .egg-badge {
    padding: 6px 12px 9px;
    font-size: 14px;
  }
  .option-group.d-flex {
    display: block !important;
  }
  .option-label {
    margin-bottom: 15px;
  }
  .flavor-options {
    gap: 5px;
  }
  .nav-tabs .nav-link {
    padding: 20px 0px;
    font-size: 1.1rem;
    line-height: 1.4
  }
  .product-tabs {
    margin-top: 0px;
  }
  .tab-section h4 {
    font-size: 18px;
  }
  .scroll-indicator {
    left: 43%;
  }
  .stories-hero {
    padding: 0px 10px;
    text-align: center;
    margin-bottom: 60px;
    position: relative;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center center
  }
  .stories-page-container {
    background-size: auto 300px;
  }
  .filter-btn {
    margin-bottom: 5px;
    padding: 10px 22px;
  }
  .story-filter-alt {
    margin-bottom: 30px;
  }


  .post-entry {
    margin-bottom: 10px;
  }
  .content-in .about-us-footer {
    padding-bottom: 0;
  }
  .stories-page-container-in {
    padding: 140px 0 0;
    background-size: auto 80px;
  }
  .info-item {
    margin-bottom: 0px;
  }
  .order-info {
    gap: 5px;
  }
  .order-card .order-items2 {
    padding-top: 12px;
  }
  .order-detail-card {
    padding: 40px 20px 45px;
  }
  .detail-header .order-date {
    display: block
  }
  .order-detail-card .order-status {
    display: inline-flex;
    margin-top: 8px;
  }
  .product-list-detailed .product-info {
    margin-top: 0px;
  }
  .wishlist-item .product-price {
    margin-bottom: 0px;
  }
  .wishlist-item .product-actions {
    margin: 0;
  }
  .wishlist-item .quantity-selector {
    margin-bottom: 10px;
  }
  .empty-state {
    padding: 0px 20px;
  }
  .cart-page {
    background-size: 460px auto;
    background-position: -160px 100px;
  }
  .cart-layout {
    display: block;
  }
  .cart-page .section-content {
    padding: 30px 20px 35px;
  }
  .cart-page .section-content.car-1 {
    padding: 10px 20px 10px;
  }
  .summary-content .item-total {
    width: 100%;
    display: block;
    margin-top: 5px;
    margin-right: 5px;
  }
  .summary-content .order-item {
    display: block;
  }
  .custom-popup {
    font-size: 15px;
    gap: 10px;
    width: 70%;
  }
  .info-section {
    line-height: 1.8;
    padding: 15px 25px 20px;
  }
  .info-title {
    margin-bottom: 5px;
  }
  .purchased-items .item-details {
    display: block;
  }
  .purchased-items .item-quantity-price {
    text-align: left;
  }
  .order-details .order-summary {
    padding: 15px 20px;
    margin-bottom: 20px;
  }
  .order-details .summary-row {
    margin-bottom: 0;
  }
  .success-content {
    margin-bottom: 0;
  }
  .order-number {
    margin-bottom: 30px;
  }
  .success-subtitle {
    margin-bottom: 0;
  }
  .title-search h3 {
    font-size: 16px !important;
    line-height: 1.6;
    margin-bottom: 30px;
  }
  .title-search br {
    display: block;
  }
  .product-info {
    padding: 0px 10px;
  }
  .quantity-input {
    width: 100px;
  }
  .product-title {
    padding-top: 0px;
  }
  .item-details {
    display: block;
  }
  .summary-content {
    padding: 30px 22px;
  }
  .purchased-items .item-name {
    font-size: 15px;
  }
  .wishlist-item .wishlist-date {
    margin-top: 0;
  }
}
@media (max-width: 480px) {
 .opening-time-box2 {
    left: 13%;
  }
 .opening-time-box3 {
    left: 13%;
  }
  .success-icon {
    width: 100px;
    height: 100px;
  }
  .success-circle {
    width: 100px;
    height: 100px;
  }
  .success-circle::before {
    width: 120px;
    height: 120px;
  }
  .success-checkmark {
    font-size: 40px;
  }
  .purchased-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .item-quantity-price {
    text-align: left;
    width: 100%;
  }
}
@media (max-width: 430px) {
 .opening-time-box2 {
    left: 20%;
  }
 .opening-time-box3 {
    left: 19%;
  }
}
@media (max-width: 390px) {
 .opening-time-box2 {
    left:18%;
  }
 .opening-time-box3 {
    left:13%;
  }
}
@media (max-width: 360px) {
 .opening-time-box2 {
    left:16%;
  }
 .opening-time-box3 {
    left:12%;
  }
    .filter-btn {
        width: 100%;
    }
}