{Theme} comes with 7 types of dividers. We designed one for each template style, but feel free to use theme wherever you want.
To add Divider use the following HTML markup:
1 2 3 4 5 6 7 8 9 10 11 |
<div class="row"> <div class="ct-header-text col-md-12 text-center ct-js-animationDynamic"> <h1 class="ct-js-animation--item" data-when="span" data-from="0" data-to="0.5" data-opacity="0" data-translatey="-100">Hello<br><span class="ct-u-hdr2 ct-js-animation--item">I'M ELLEN HOLGATE<br>& I SEW STUFF</span></h1> <div class="ct-divider ct-divider--type1 ct-js-animation--item" data-when="span" data-from="0" data-to="0.5" data-opacity="0" data-translatey="100"> <div class="ct-line ct-line--left"></div> <i class="icon-button"></i> <div class="ct-line ct-line--right"></div> </div> <a href="#prices" class="btn btn-default ct-js-btnScroll btn--radius ct-js-animation--item" data-when="span" data-from="0" data-to="0.5" data-opacity="0" data-translatey="100">SEE WHAT I CAN OFFER YOU</a> </div> </div> |
You can adjust divider style with the following CSS classes:
- .ct-divider–type1,
- .ct-divider–type2,
- .ct-divider–type3,
- .ct-divider–type4,
- .ct-divider–type5,
- .ct-divider–type6,
- .ct-divider–type7