@media (max-width: 1024px) {
    .bottom-feedback {
    z-index: -1;
    position: relative;
}
    .title-main img, .title-detail-product img {
    display: none;
}
.flex-productTpl {
    flex-wrap: wrap;
}

.productTpl-left {
    width: 100%;
    margin-bottom: 1rem;
    position: relative;
    top: unset;
}

.productTpl-right {
    width: 100%;
}
    .breadCrumbs .wrap-content
 {
    padding: 10px 0;
}
.search-res .icon-search {
    color: var(--color-title) !important;
}
.info-productHot > h3 > a, .info-introPopup > h2, .aboutCatering-center > h2 {
    font-size: 30px;
    margin-bottom: 1rem;
}

.pic-hungry, .info-hungry {
    width: 50%;
}

.info-hungry > span.slogan-hungry {
    font-size: 15px;
    margin-bottom: 10px;
}

.info-hungry > h2 {
    margin-bottom: 1rem;
    font-size: 30px;
}

.btn-oder-now {
    font-size: 14px;
    width: 130px;
    height: 35px;
}

.desc-hungry {
    margin-bottom: 1rem;
}

.footer-title {
    font-size: 25px;
}

.footer-ul li a {
    font-size: 15px;
}
  .contact-input {
      margin-bottom: 15px;
  }

  .flex-cus, .row-video, .row-20 {
      margin-left: -5px;
      margin-right: -5px;
  }

  .mg-cus, .mg-video, .col-20 {
      padding-left: 5px;
      padding-right: 5px;
  }

  .content-text img {
      height: auto !important;
  }

  .padding-top-bottom {
      padding: 2rem 0;
  }

  .pad-top {
      padding-top: 2rem;
  }

  .pad-bottom {
      padding-bottom: 2rem;
  }

  .mg-top {
      margin-top: 2rem;
  }

  .mg-bottom {
      margin-bottom: 2rem;
  }

  .title-detail-main {
      font-size: 20px;
  }

  .cart-fixed {
      bottom: 220px;
  }

  .btn-frame {
      display: none;
  }

  .cart-pro-detail {
      width: 100%;
      margin-top: 10px;
  }

  .pad-bottom {
      padding-bottom: 2rem !important;
  }

  .pad-top {
      padding-top: 2rem !important;
  }

  .padding-top-bottom {
      padding: 2rem 0 !important;
  }

  .menu {
      display: none;
  }

  .menu-res {
      display: block !important;
      background: #fff !important;
  }

  .product-tool {
      opacity: 1;
      visibility: visible;
      position: initial;
  }

  .product-tool a span {
      display: none;
  }
}

@media (max-width: 992px) {
    .contact-left, .contact-right {
    width: 100%;
}

.flex-contact {
    flex-wrap: wrap;
    flex-direction: column-reverse;
}

.contact-right {
    padding: 10px;
}

.contact-right >img {
    margin: 20px 0;
}
  .othernews {
      position: initial;
  }

  .footer-title:after {
      width: 100%;
  }

  #fanpage-facebook {
      width: 300px;
      overflow: hidden;
      margin: auto;
  }

  .footer-news:nth-child(4) {
      width: 100%;
  }

  .footer-news:nth-child(3) {
      width: 100%;
      margin-bottom: 20px;
  }

  .footer-news:nth-child(2) {
      width: 100%;
      margin: 20px 0;
  }

  .footer-news:nth-child(1) {
      width: 100%;
  }

  .time-news {
      display: none;
  }

  .copyright, .statistic {
      width: 100%;
      text-align: center;
  }

  .footer-ul li {
      width: calc(100% / 2 - 5px);
  }

  .footer-ul {
      display: flex;
      flex-flow: row wrap;
      justify-content: space-between;
  }
}

@media (max-width: 768px) {
  .item-video1 img {
      height: 250px;
  }

  .right-intro {
      width: 100%;
  }

  .left-intro {
      width: 100%;
      margin-bottom: 20px;
      padding-right: 0;
  }

  .left-pro-detail, .right-pro-detail {
      width: 100%;
      margin: 0px;
  }

  .left-pro-detail, .top-contact .article-contact {
      margin-bottom: 30px;
  }

  .pic-news {
  margin-bottom: 10px;
  }
.info-productHot > h3 > a, .info-introPopup > h2, .aboutCatering-center > h2 {
    font-size: 20px;
    margin-bottom: 10px;
}

.info-productHot > h3 {
    margin: 0;
}

.info-productHot > span, .slogan-introPopup {
    font-size: 15px;
}

.aboutCatering-center > span {
    font-size: 15px;
    margin-bottom: 10px;
}

.aboutCatering-center {
    width: 30%;
    padding: 0;
}

.aboutCatering-left, .aboutCatering-right {
    width: 30%;
    margin: 0;
}

.container-aboutCatering.d-flex.align-items-center.justify-content-betwe {}

.aboutCatering-left img, .aboutCatering-right img {
    margin: -50px 0;
}

.desc-aboutCatering {
    margin-bottom: 10px;
}

.title-blog span {
    margin: 0 10px;
    height: 20px;
}

.title-blog p {
    font-size: 15px;
}
.owl-page-blog {
    padding: 20px ;
    position: relative;
}

.wrap-blog .wrap-content {
    padding: 20px 45px;
}

.item-news {
    padding: 5px;
}
  .info-news {
  }

  .name-news {
      font-size: 15px;
  }

  .desc-news.text-split {
      -webkit-line-clamp: 2;
  }
  .info-hungry > h2 {
    font-size: 20px;
    margin-bottom: 10px;
}

.info-hungry .btn-oder-now {
    height: 40px;
    width: 180px;
}

.pic-hungry {
    margin: -30px 0 0 0;
}
}

@media (max-width: 576px) {
  .toast-cus {
      left: 5px;
      width: calc(100% - 10px);
  }

  .box-readmore {
      width: calc(100% - 5px);
  }

  .newshome-scroll {
      width: 100%;
  }

  .newshome-intro {
      width: 100%;
      margin-bottom: 20px;
  }

  .top-contact .form-contact .button-contact .file-contact span b {
      max-width: 105px;
  }

  .cart-pro-detail {
      flex-wrap: wrap;
  }

  .cart-pro-detail a {
      width: 100%;
      text-align: center;
      margin: 0px !important;
  }
.logo-mobile {
    max-width: 150px;
}

.views-more-slide {
    width: 120px;
    font-size: 14px;
    height: 35px;
}

.info-slide {
    margin: 10px 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.slide-productHot .slick-prev {
    left: 5px;
}

.slide-productHot .slick-dots {
    width: 100%;
    bottom: 10px;
}

.info-productHot > span, .slogan-introPopup {
    font-size: 14px;
    margin-bottom: 5px;
}
  .cart-pro-detail a:first-child {
      margin-bottom: 5px !important;
  }
    .aboutCatering-center {
    width: 50%;
    padding: 0;
}

.aboutCatering-left, .aboutCatering-right {
    width: 20%;
    margin: 0;
    height: 200px;
}
    .aboutCatering-left img, .aboutCatering-right img {
    margin: -20px 0;
}
    .aboutCatering-center > span {
    font-size: 12px;
    margin-bottom: 5px;
}

.aboutCatering-center > h2 {
    font-size: 15px;
    margin-bottom: 5px;
}

.aboutCatering-center a {
    width: 70%;
    height: 35px;
}
    .owl-page-blog {
    padding: 0px ;
}
.wrap-blog {
    background: #EFEBE5;
}
.wrap-blog .wrap-content {
    padding: 0;
}
    .title-blog {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    margin-bottom: 1rem;
}

.title-blog span {
    display: none;
}

.title-blog h2 {
    font-size: 30px;
    margin: 0;
}

.wrap-blog .control-owl button.owl-next {
    right: -20px;
}.wrap-blog .control-owl button.owl-prev {
    left: -20px;
}
    .pic-hungry, .info-hungry {
    width: 100%;
    margin: 0;
}
    .box-hungry {
    flex-wrap: wrap;
    display: flex;
    flex-direction: column-reverse;
}

.info-hungry {
    padding: 20px 10px;
}

.wrap-hungry {
    padding-top: 2rem;
    overflow: hidden;
    margin: 0;
}

.info-hungry > span.slogan-hungry {
    margin-bottom: 5px;
}

.footer-title {
    font-size: 20px;
    margin-bottom: 5px;
}

.footer-ul li a {
    font-size: 14px;
}

.footer-ul li {
    margin-bottom: 5px;
}
.title-main h2, .title-main h1, .title-detail-product span {
    font-size: 22px;
}

.title-main {
    margin-bottom: 10px;
}

.title-detail h2 {
    font-size: 26px;
    padding-bottom: 5px;
}
.ul-productTpl li a {
    font-size: 15px;
}

.ul-productTpl li a:hover, .ul-productTpl li a.active {
    border-left: 3px solid var(--color-red);
    padding-left: 10px;
}

.productTpl-right .title-detail h2 {
    padding: 5px;
    font-size: 20px;
}

.owl-page-productList {
    padding: 0;
}

.name-product {
    font-size: 14px;
    margin-bottom: 0;
}

.price-product {
    margin-bottom: 5px;
}

.info-product {
    padding: 0 5px 5px 5px;
}

.pic-product {
    margin-bottom: 5px;
}

.price-product .price-new {
    font-size: 14px;
}
.owl-page-productList .box-product {margin: 10px 5px 20px 5px;}
.phanloai-product {
    position: absolute;
    top: -5px;
    right: 5px;
    font-size: 10px;
    padding: 2px 10px;
}

.seen-product .btn-oder-now {
    width: 100%;
    height: 30px;
    margin-bottom: 5px;
}

.seen-product {
    flex-wrap: wrap;
    justify-content: center !important;
}
.pagination-home .pagination .page-item {
    margin: 0 2px;
}
.address-footer {
    font-size: 14px;
    margin-bottom: 5px;
}
.title-pro-detail {
    font-size: 22px;
}

.attr-label-pro-detail {
    font-size: 16px;
}

.attr-content-pro-detail {
    font-size: 20px;
}

.price-new-pro-detail {
    font-size: 18px;
}

.desc-pro-detail.content-text {
    font-size: 15px;
}

.grid-pro-detail {
    margin-bottom: 1rem;
}

.content-main {
    margin-bottom: 1rem;
}
.title-newsDetail h1 {
    font-size: 22px;
}
.title-product-detail h2 {
    font-size: 22px;
    padding: 0;
}
.title-detail-product {
    margin-bottom: 10px;
}
.control-owl button.owl-next, .control-owl button.owl-prev {
    transform: scale(.6);
}

.pad-bottom-42 {
    padding-bottom: 20px;
}
.title-reserve h1 {
    font-size: 25px;
    margin: 0;
}
.title-reserve p {
    font-size: 14px;
}
.title-reserve{
    margin-bottom: 1rem;
}

.newsletter-reserve > b {
    font-size: 15px;
}

.form-reserve .newsletter-button input, .form-catering .newsletter-button input {
    margin: 0 5px;
}
.form-floating.form-floating-cus > label {
    padding-left: 10px;
}

.title-form-catering {
    padding: 0;
    font-size: 22px;
}

.title-feedback h2 {
    font-size: 22px;
    margin: 5px 0;
}

.title-feedback span {
    font-size: 14px;
}

.bottom-feedback {
    margin: 0;
}
.back-arrow-feed, .go-arrow-feed {
    bottom: -55px;
}
.wrap-form-feedback {
    background-size: cover;
}

.desc-feedback {
    margin-bottom: 10px;
}
.hotline-footer, .hotline-footer:hover {
    width: 61%;
    margin: 0 10px 0 0 !important;
}

.social-footer li a {
    margin-right: 10px !important;
}

.footer-bottom {
    flex-wrap: wrap;
    margin: 2rem 0 1rem 0;
}
.contact-right > span, .contact-right > h1 {
    font-size: 25px;
}

.contact-right >img {
    margin: 5px 0;
}

.contact-text {
    margin-bottom: 1rem;
}

.contact-right .title-social {
    font-size: 15px;
}
.container-followus-modal p {
    font-size: 22px;
}

.modal-content {
    width: 95%;
    margin: auto;
}
.container-menuPopup-modal > span{
font-size: 14px;
    margin-bottom: 5px;
}
.container-menuPopup-modal > p{
    font-size: 22px;
    margin-bottom: 10px;
}

.seen-menuPopup-modal a {
    font-size: 10px;
    height: 35px;
    width: 49%;
}
    .contact-right .form-newsletter {
    width: 100%;
}
.contact-right > ul {
    margin-bottom: 10px;
}
.menuPopup .modal-body {
    padding: 10px;  
    margin: 10px;
}
.social-modal li a {
    margin-right: 10px !important;
}
.contact-right .social li {
    margin: 0;
    max-width: 40px;
}
}