<template>
  <div class="section">
    <div class="container">
      <!--Title-->
      <div class="section-title has-text-centered py-6">
        <h2 class="title is-2">
          About Us
        </h2>
        <h4>Let us tell you the hole story.</h4>
      </div>

      <div class="video-section py-12">
        <div class="columns is-vcentered">
          <div class="column is-6 is-relative is-centered-portrait">
            <!--Video PLayer-->
            <VPlyr
              ratio="square"
              title="Lorem ipsum dolor sit amet"
              source="https://www.youtube.com/embed/lE5VNpP8JqA?modestbranding=1&rel=0&showinfo=0"
              poster="/video/poster-1c.jpg"
              reversed
              embed
            />
          </div>
          <div class="column is-6">
            <!--Content-->
            <div class="columns is-multiline b-columns-half-tablet-p">
              <div class="column is-6">
                <div class="py-2 medium:py-4">
                  <h4 class="title is-5 is-narrow">
                    How we started
                  </h4>
                  <p class="pt-2 max-w-3 text-medium">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed
                    videbimus.
                  </p>
                </div>
              </div>
              <div class="column is-6">
                <div class="py-2 medium:py-4">
                  <h4 class="title is-5 is-narrow">
                    Who we are
                  </h4>
                  <p class="pt-2 max-w-3 text-medium">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed
                    videbimus.
                  </p>
                </div>
              </div>
              <div class="column is-6">
                <div class="py-2 medium:py-4">
                  <h4 class="title is-5 is-narrow">
                    What we do
                  </h4>
                  <p class="pt-2 max-w-3 text-medium">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed
                    videbimus.
                  </p>
                </div>
              </div>
              <div class="column is-6">
                <div class="py-2 medium:py-4">
                  <h4 class="title is-5 is-narrow">
                    Our values
                  </h4>
                  <p class="pt-2 max-w-3 text-medium">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed
                    videbimus.
                  </p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
