@media (max-width: 1400px) {
  .order-proccess .outline-stroke::after,
  .order-proccess .outline-stroke::before {
    width: 220px;
  }
}

@media (max-width: 1199px) {
  .order-proccess .outline-stroke::after,
  .order-proccess .outline-stroke::before {
    width: 170px;
  }
}

@media (max-width: 991px) {
  .order-proccess .outline-stroke::after,
  .order-proccess .outline-stroke::before {
    width: 145px;
  }
  header .hero-area .star-shape {
    display: none;
  }
}

@media (max-width: 767px) {
  header .hero-area .cachershop-img {
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
  }
  header .hero-area {
    overflow: hidden;
  }
  header .hero-area .container {
    position: relative;
    padding-bottom: 240px;
    padding-top: 70px;
  }
  header .hero-area h2 {
    margin-bottom: 70px;
  }
  header {
    padding-top: 20px;
  }
  .order-proccess .outline-stroke::after,
  .order-proccess .outline-stroke::before {
    display: none;
  }
  .order-proccess .outline-stroke-2 {
    position: relative;
  }
  .order-proccess .outline-stroke-2::after,
  .order-proccess .outline-stroke-2::before {
    content: "";
    position: absolute;
    background-color: #b2bdc9;
    z-index: 1;
    width: 1px;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
  }
  .order-proccess .outline-stroke-2::before {
    top: calc(100% - 5px);
    right: inherit;
    bottom: inherit;
  }
  .order-proccess .outline-stroke-2::after {
    bottom: calc(100% + 13px);
    right: inherit;
    top: inherit;
  }
  .order-proccess {
    padding-top: 40px;
    padding-bottom: 56px;
  }
  .food-section {
    padding: 40px 0;
  }
  .food-section .food-name {
    display: none;
  }
}

@media (max-width: 565px) {
  header .hero-area h2::before {
    right: 0;
    top: 102%;
    width: 190px;
    transform: translateX(-50%);
  }
  header .hero-area .container {
    padding-bottom: 205px;
  }
  header .hero-area .cachershop-img {
    width: 150vw;
  }
  header .hero-area h1 {
    font-size: 31px;
  }
  header .hero-area h2 {
    font-size: 28px;
  }
  .theme-btn {
    font-size: 18px;
  }
}
