.star-section-food{
  background-color: #fafafa;
    padding: 1% 0;
    margin-bottom: 7%;
    margin-top: 6.5%;
  }
  .box-food-content{
      width: 50%;
  }
  .guide-food {
    margin-top: 18%;
    margin-bottom: 8%;
  }
  .engineer-food-image{
      width: 100%;
  }
  .img-video-mobile, .box-desc-food{
      display: none;
  }
  .box-desc-food.active{
      display: block;
      /*padding-left: 0%;*/
      /*padding-left: 5%;*/
      margin-top: 2%;;
  }
  
  .banner-food {
      margin: 4% 0 0 0;
  }
  .title-quotes-food {
  margin-top: 5%;
    width: 87%;
  }
  .title-banner-food {
      padding: 5.5% 0 8.5%;
  }
  
  .title-banner-food h2{
      line-height: 1.2;
  }
  
  .title-banner-food p{
    margin-top: 3%;
    width: 47%;
    font-weight: 300;
  }
  
  .food-text{
      width: 50%;
  }
  
  .top-minus-content-food{
      margin-top: -6%;
  }
  
  .food-content-title{
      margin-bottom: 9%;    
  }
  
  /*.food-section {*/
  /*    margin-top: 17%;*/
  /*}*/
  
  .food-data {
    margin: 10% 0 15% 11%;
    display: grid;
    grid-template-columns: repeat(4, 27%);
    justify-content: center; /* Untuk menyusun konten secara horizontal di tengah */
    align-items: center; /* Untuk menyusun konten secara vertikal di tengah */
  }
  
  .banner-block-food {
      padding: 18% 0 17% 0;
      background-color: rgba(255, 255, 255, 0.6);
      margin-top: -32%;
      width: 50%;
      position: relative;
      z-index: 100;
  }
  
  .food-content {
      margin-top: 3%;
      margin-bottom: 8%;
      display: flex;
      justify-content: space-between;
      gap: 7%;
  }
  
  .content-food {
      display: flex;
      padding-left: 2.5%;
      gap: 3%;
      margin-top: 3%;
      padding-bottom: 3%;
  }
  
  .star-content-title{
      margin-bottom: 8%;
  }
  
  .star-content-subtitle {
      margin-top: 1%;
  }
  
  .star-content {
margin-top: 10%;
    margin-bottom: 8%;
    display: flex;
    justify-content: space-between;
    gap: 10%;
  }
  
  }
  
  .star-section {
      background-color: #fafafa;
      padding-top: 4px;
      padding-bottom: 4px;
      margin-bottom: 7%;
  }
  
  .star-sectors-btn {
      padding: 2% 1% 2% 2%;
      margin-top: 5%;
      background-color: #ED4F18;
      color: white;
      border: none;
  }
  
  .star-sectors-arrow {
      width: 10%;
      color: white;
      margin-left: 11%;
  }
  
  .star-content-img {
      width: 103%;
  }
  
  .content-food-reverse {
      display: flex;
      padding-left: 2.5%;
      gap: 3%;
      margin-top: 3%;
      padding-bottom: 3%;
  }
  
  
  /* Sustainability Section */
  .sus-food-page{
      margin-bottom: 7%;
  }
  .sus-food-page-icon{
display: flex;
  gap: 11%;
  width: 65%;
  }
  
  /* Engineer Section */
  .engineer-food-page-container{
      width: 100%;
    background-color: #283948;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 7%;
    display: flex;
    padding: 5.7% 0% 2.7%
  }
  .engineer-food-content{
  display: flex;
    padding: 2% 0;
  }
  .engineer-food-left-content{
  margin-left: 10%;
    width: 74%;
    margin-top: -5%;
  }
  .engineer-food-right-content{
    width: 68%;
    margin-top: -6%;
    margin-bottom: -2%;
  }
  
  /*Food Service*/
  .title-food-service-box, .desc-food-service-box{
      margin-bottom: 3%;
  }
  
  .food-service-content{
      display: flex;
      width  : 100%;
  }
  .food-service-left-content{
      width: 50%;
  }
  
  .food-service-left-content h3{
      width: 70%;
  }
  
  .food-service-right-content{
      width: 50%;
  }
  /* --------------- */
  /* Active // Hover */
  /* --------------- */
  
  .content-food-reverse.active .content-title {
      color: #ED4F18;
  }
  
  .content-food-reverse.active .arrow-sus img {
      margin-top: 25%;
      display: block;
  }
  
  /*Qoutes */
  .quotes-food-page{
      margin-top: 7%;
  }
  .quotes-food-page img{
      width  : 100%;
  }
  .quotes-food-content{
      margin-top: -34.2%;
      margin-right: 2%;
      float: right;
      position: relative;
      z-index: 100000;
      width: 50%;
  }
  
  .quotes-food-block{
      padding: 5%;
      background-color: rgba(255, 255, 255);
      margin-top: -30.3%;
      width: 35%;
      position: relative;
      z-index: 100;
      float: right;
      margin-right: 9%;
      height: 13.2vw;
  }
  
  /*FAQ*/
  .faq-section-food-page{
      display: flex;
      justify-content: space-between;
      gap: 8%;
  }
  
  .faq-food-desc{
      margin-top: 8%;
  }
  
  /*CTA*/
  .call-to-action-food{
      margin-top: 6%;
      background-image: url('/wp-content/themes/Aden%20services/assets/FoodPage/CTAFood.webp');
      background-repeat: no-repeat;
      background-size: cover;
      height: 33vw;
      position: relative;
  }
  .cta-content-food{
    align-self: center;
      width: 50%;
      height: auto;
  }
  
  .star-content-img-mobile, .img-cliere-mobile, .sus-food-page-icon-mobile{
      display: none;
  }
  /* --------------- */
  /* Media tablet */
  /* --------------- */
  
  @media(min-width: 640px) and (max-width: 1024px){
      
      /*.food-data {*/
      /*  margin: 15% 0 15% 13%;*/
      /*  margin-left: 5%;*/
      /*  grid-template-columns: repeat(2, 40%);*/
      /*  gap: 30px;*/
      /*}*/
      .banner-block-food {
    padding: 18% 0 17% 0;
    background-color: rgba(255, 255, 255, 0.6);
    margin-top: -34%;
    width: 51%;
    position: relative;
    z-index: 100;
  }
  .title-quotes-food {
    margin-top: 5%;
    width: 92%;
  }
  
  .guide-food {
    margin-top: 16%;
    margin-bottom: 8%;
  }
  }
  
  /* Media mobile */
  
  @media(min-width: 360px) and (max-width: 640px){
      .guide-food {
    margin-top: 17%;
  }
    .call-to-action-food {
      background-image: url('/wp-content/themes/Aden%20services/assets/FoodPage/call-to-action-food-bg.webp');
      height: 50vw;
      padding: 6% 0;
    }
       #cta-food-mobile {
      width: 25%;
      margin-top: 5.8%;
    }
      .engineer-food-left-content {
    margin-left: 0%;
    width: 100%;
    margin-top: -5%;
  }
      .food-data {
        margin:1.25% 0 26% 13%;
        margin-left: 5%;
        grid-template-columns: repeat(2, 40%);
        gap: 30px;
      }
      
      .food-text, .sus-food-page-icon {
          width: 100%;
      }
      .food-content {
          display: none;
      }
      .img-video-mobile{
      display: block;
      width: 100%;
      margin-bottom: 10%;
      }
      .star-section{
          margin-top: 30%;
      }
     .star-content-title, .star-content-subtitle, .star-sectors-btn, .banner-block-food{
          display: none;
      }
      
     .engineer-food-right-content, .title-banner-food p {
        width: 100%;  
      }
      .engineer-food-page-container{
        padding: 8% 0;
        margin-bottom: 20%;
        margin-top: 11%;
      }
      /*Star Content*/
      .star-content{
          display: block;
      }
      .star-content-img, .img-cliere, .engineer-food-image{
          display: none;
      }
      .star-content-img-mobile{
          display: block;
          margin-bottom: 8%;
      }
    .box-food-content {
      width: 100%;
      margin-top: 10%;
  
      .box-desc-food {
          width: 100%;
      }
      .box-desc-food p{
          width: 100%;
      }
      
      .img-cliere-mobile{
          display: block;
          width: 100%;
      }
      .sus-food-page-icon-mobile{
          display: flex;
          width: 100%;
          gap: 11%;
          margin-left: 8%;
          
      }
      .engineer-title{
          width : 93%;
      }
      .engineer-food-left-content p{
          width: 100%;
      }
      .engineer-food-left-content {
          margin-left: 0%;
      }
      .engineer-food-content{
          display: block;
      }
      
      .engineer-food-image-mobile{
          display: block;
          width: 100%;
      }
      
      .engineer-food-right-content {
          width: 100%;
      }
      
      .food-service-content {
          display: block;
          width: 100%;
      }
      .food-service-left-content {
          width: 100%;
      }
      .food-service-right-content {
          display: block;
          width: 100%;
      }
      .food-service{
          margin-top: 5%;
      }
  }