<synchronized-carousel>
  <template slot="first">
    <rl-carousel-slide>
      <div
        class="border border-blue p-8 mx-8 mt-8 text-center text-3xl"
        style="width: 20vw;"
      >
        One
      </div>
    </rl-carousel-slide>
    <rl-carousel-slide>
      <div
        class="border border-red p-8 mx-8 mt-8 text-center text-3xl"
        style="width: 20vw;"
      >
        Two
      </div>
    </rl-carousel-slide>
    <rl-carousel-slide>
      <div
        class="border border-green p-8 mx-8 mt-8 text-center text-3xl"
        style="width: 20vw;"
      >
        Three
      </div>
    </rl-carousel-slide>
  </template>
  <template slot="second">
    <rl-carousel-slide>
      <div
        class="border border-blue p-8 mx-8 mt-8 text-center text-3xl"
        style="width: 40vw;"
      >
        One
      </div>
    </rl-carousel-slide>
    <rl-carousel-slide>
      <div
        class="border border-red p-8 mx-8 mt-8 text-center text-3xl"
        style="width: 40vw;"
      >
        Two
      </div>
    </rl-carousel-slide>
    <rl-carousel-slide>
      <div
        class="border border-green p-8 mx-8 mt-8 text-center text-3xl"
        style="width: 40vw;"
      >
        Three
      </div>
    </rl-carousel-slide>
  </template>
</synchronized-carousel>