@extends('website.layout.master')

@section('title')
    onlineportal
@endsection

@section('content')
      <link rel="stylesheet" href="{{ URL::asset('website/testimonial.css') }}">

<section class="testimonials">

        <div class="text">
            <h4>Testimonials</h4>
            <h1>What our users think about us!</h1>
            <hr>
            <div class="slider">
                <div class="slider-container">
                    <div class="testimonial">
                        <div class="testimonial-content">
                            <p class="testimonial-text">"Lorem ipsum dolor sit amet, consectetur adipiscing elit."</p>
                            <p class="testimonial-name">John Doe</p>
                        </div>
                        <img class="testimonial-img" src="{{ URL::asset('website/image/5.jpg') }}" alt="Testimonial 1">
                    </div>
                    <div class="testimonial">
                        <div class="testimonial-content">
                            <p class="testimonial-text">"Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."</p>
                            <p class="testimonial-name">Jane Smith</p>
                        </div>
                        <img class="testimonial-img" src="{{ URL::asset('website/image/1.PNG') }}" alt="Testimonial 2">
                    </div>
                    <!-- Add more testimonials as needed -->
                </div>
            
                <button class="prev" onclick="prevSlide()">&#10094;</button>
                <button class="next" onclick="nextSlide()">&#10095;</button>
            
            </div>
            </div>

        <div class="main-img">
            <img src="{{ URL::asset('website/image/main.jpg') }}" alt="">
        </div>
    </section>

    <div class="text">

       <div class="wrapper">
      <h1>Frequently Asked Questions</h1>

      <div class="faq">
        <button class="accordion">
          What is Krushi?
          <i class="fa-solid fa-chevron-down"></i>
        </button>
        <div class="pannel">
          <p>
            Krushi is a Public Charitable Trust designed to carry out farming on
            extensive scale Natural & Sustainable methods.
          </p>
        </div>
      </div>

      <div class="faq">
        <button class="accordion">
          How does it work?
          <i class="fa-solid fa-chevron-down"></i>
        </button>
        <div class="pannel">
          <p>
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Facilis
            saepe molestiae distinctio asperiores cupiditate consequuntur dolor
            ullam, iure eligendi harum eaque hic corporis debitis porro
            consectetur voluptate rem officiis architecto.
          </p>
        </div>
      </div>

      <div class="faq">
        <button class="accordion">
          What are the major challanges of current agriculture?
          <i class="fa-solid fa-chevron-down"></i>
        </button>
        <div class="pannel">
          <p>
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Facilis
            saepe molestiae distinctio asperiores cupiditate consequuntur dolor
            ullam, iure eligendi harum eaque hic corporis debitis porro
            consectetur voluptate rem officiis architecto.
          </p>
        </div>
      </div>

      <div class="faq">
        <button class="accordion">
          How does the Krushi address the above challanges?
          <i class="fa-solid fa-chevron-down"></i>
        </button>
        <div class="pannel">
          <p>
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Facilis
            saepe molestiae distinctio asperiores cupiditate consequuntur dolor
            ullam, iure eligendi harum eaque hic corporis debitis porro
            consectetur voluptate rem officiis architecto.
          </p>
        </div>
      </div>

      <div class="faq">
        <button class="accordion">
          How can I be a part of Krushi?
          <i class="fa-solid fa-chevron-down"></i>
        </button>
        <div class="pannel">
          <p>
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Facilis
            saepe molestiae distinctio asperiores cupiditate consequuntur dolor
            ullam, iure eligendi harum eaque hic corporis debitis porro
            consectetur voluptate rem officiis architecto.
          </p>
        </div>
      </div>

      <div class="faq">
        <button class="accordion">
          How does it work?
          <i class="fa-solid fa-chevron-down"></i>
        </button>
        <div class="pannel">
          <p>
            Lorem ipsum dolor, sit amet consectetur adipisicing elit. Facilis
            saepe molestiae distinctio asperiores cupiditate consequuntur dolor
            ullam, iure eligendi harum eaque hic corporis debitis porro
            consectetur voluptate rem officiis architecto.
          </p>
        </div>
      </div>
    </div>
</div>

    <script src="{{ URL::asset('website/testimonialapp.js') }}"></script>

    <script>
      var acc = document.getElementsByClassName("accordion");
      var i;

      for (i = 0; i < acc.length; i++) {
        acc[i].addEventListener("click", function () {
          this.classList.toggle("active");
          this.parentElement.classList.toggle("active");

          var pannel = this.nextElementSibling;

          if (pannel.style.display === "block") {
            pannel.style.display = "none";
          } else {
            pannel.style.display = "block";
          }
        });
      }
    </script>

  @endsection