JS слайдер, анимация элементов слайда

Здравствуйте! Очень нужна помощь, помогите пожалуйста!
Задача: При свайпе на следующий слайд, нужно сделать анимацию элементов Текста: "Хотите внедрить новые технологии без лишних затрат?", "Арендуй облачный сервер и запусти рекламу своего проекта!", кнопка "Начать работу". Анимация такая: Сперва уходит бэграунд картинки влево, потом заголовок влево, затем подзаголовок влево и кнопка влево. И также приходит следующий слайд справа. Подскажите пожалуйста как это сделать или если есть сайт где это реализовано отправьте ссылку.

Код слайдера owl carousel:

<div class="owl-carousel offer__list">
  <!-- SLIDE -->
  <section class="first-screen  " id="first-screen" style="background: url(img/first-screen/offer1.jpg)no-repeat center">
    <div class="container">
      <div class="offer animate-list">
        <img src="img/first-screen/offer1-mob.jpg" alt="">
        <h1 class="offer__title animate-list__item animate_fade-right ">Хотите внедрить новые технологии без лишних затрат?</h1>
        <p class="animate-list__item animate_fade-right ">Арендуй облачный сервер<br> и запусти рекламу своего проекта!</p>
        <div class="animate-list__item animate_fade-right">
          <a href="" class="button">Начать работу</a>
        </div>
      </div>
    </div>
  </section>
  <!-- // SLIDE  -->



  <!-- SLIDE 2 -->
  <section class="first-screen" id="first-screen" style="background: url(img/first-screen/offer3.jpg)no-repeat center">
    <div class="container">
      <div class="offer animate-list">
        <img src="img/first-screen/offer3-mob.jpg" alt="">
        <h1 class="offer__title animate-list__item animate_fade-left">Аренда хостинга</h1>
        <p class="animate-list__item animate_fade-left">Частые обновления системы, поиск и отладка уязвимостей. Обновления модулей + анализ нагрузки сервера SSD RAID.</p>
        <div class="animate-list__item animate_fade-left">
          <a href="" class="button">Начать работу</a>
        </div>
      </div>
    </div>
  </section>
  <!-- // SLIDE 2 -->

</div>