Slider Style - Layered

Sample Slider Code

<div class="slider-layer">
  <li>
  <div class="slider-item">
    <div class="slider-text slider-half">
      <h3 class="layer1">Welcome To Ruhi Pro</h3>
      <h1 class="layer2">We Create <em>Perfect</em> Digital Products To Promote Your <em>Brand</em></h1>
      <p class="layer3">Start growing your business and startup with our amazing digital branding products.</p>
      <p><a class="layer4 button" href="#">read more</a> <a class="layer4 button dark" href="#">contact us</a></p>
    </div><!-- /slider-text  -->
    <div class="slider-image slider-half">
      <img src="/themes/xarapro/images/demo/slider/slide1.svg" alt="slider" />
    </div><!-- /slider-image -->       
  </div><!-- /slider-item -->
  </li>
  <li>
  <div class="slider-item">
    <div class="slider-text slider-half">
      <h3 class="layer1">We Are Best Theme</h3>
      <h1 class="layer2">Your <em>Business</em> Need Perfect Solutions</h1>
      <p class="layer3">Stay on top using simple and easy yet powerful and intelligent artificial tools.</p>
      <p><a class="layer4 button" href="#">read more</a> <a class="layer4 button dark" href="#">contact us</a></p>
    </div><!-- /slider-text  -->
    <div class="slider-image slider-half">
      <img src="/themes/xarapro/images/demo/slider/slide2.svg" alt="slider" />
    </div><!-- /slider-image --> 
  </div><!-- /slider-item -->
  </li>
  <li>
  <div class="slider-item">
    <div class="slider-text slider-half">
      <h3 class="layer1">Unlock Your Potential</h3>
      <h1 class="layer2">We Shape The Future of <em>Technology</em> and <em>Marketing</em></h1>
      <p class="layer3">We believe that designing and branding have real impact on the business. Technology can greatly impact your business growth.</p>
      <p><a class="layer4 button" href="#">read more</a> <a class="layer4 button dark" href="#">contact us</a></p>
    </div><!-- /slider-text  -->
    <div class="slider-image slider-half">
      <img src="/themes/xarapro/images/demo/slider/slide3.svg" alt="slider" />
    </div><!-- /slider-image --> 
  </div><!-- /slider-item -->
  </li>
</div>