<template>
  <section id="intro">
    <div class="container">
      <div class="row">
        <div align="left" class="col-sm-12 col-md-8">
          <div class="intro-content box">
            <h2>About Us</h2>
            <p>
              Uni-Vate Properties began in 2013 in Pretoria East with various properties in their
              portfolio. Led by our Director, Delia O' Conner, who has over 25 years of experience
              in the timeshare industry, the move to conventional property sales and rentals was an
              easy transition for the Uni-Vate team.
            </p>
          </div>
        </div>
      </div>
    </div>

    <carousel
      :nav="false"
      :dots="false"
      :items="1"
      :autoplay="true"
      :loop="true"
      id="intro-carousel"
      style="margin-top:-50px"
      :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
    >
      <img class="item" src="/img/intro-carousel/home-1.jpg" style="object-fit: cover" alt="" />
      <img class="item" src="/img/intro-carousel/home-2.jpg" style="object-fit: cover" alt="" />
      <img class="item" src="/img/intro-carousel/home-3.jpg" style="object-fit: cover" alt="" />
      <img class="item" src="/img/intro-carousel/home-4.jpg" style="object-fit: cover" alt="" />
      <img class="item" src="/img/intro-carousel/home-5.jpg" style="object-fit: cover" alt="" />
      <img class="item" src="/img/intro-carousel/home-6.jpg" style="object-fit: cover" alt="" />
    </carousel>

    <div id="intro-carousel" class="owl-carousel"></div>
  </section>
</template>

<script>
/* eslint-disable */

import carousel from "vue-owl-carousel";
export default {
  components: {
    carousel
  }
};
</script>

<style lang="scss" scoped></style>
