Separators

Separator

Default Sepatrator

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<div class="title-separator mb-60">
  <span class="text-uppercase font-26"> Separator</span>
</div>
<h4>.........</h4>
<p>.........</p>
<div class="separator"></div>

Separator Left Align

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator left">
  <i class="fa fa-camera"></i>
</div>

Right Align

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator right">
  <i class="fa fa-graduation-cap"></i>
</div>

Separator Center Align

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator">
  <i class="pe-7s-drop"></i>
</div>

Separator Icon (animated)

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator">
  <i class="fa fa-cog fa-spin"></i>
</div>

Separator Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.

Separator Title

<h4>.........</h4>
<p>.........</p>
<div class="separator">
  <span>Separator Title</span>
</div>

Separator Medium Line

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-medium-line"> </div>

Separator Small Line

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-small-line"> </div>

Separator Round Icon

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-rouned">
  <i class="fa fa-cog"></i>
</div>

Separator Round Icon (Left)

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-rouned separator-rouned-left">
  <i class="fa fa-cog"></i>
</div>

Separator Round Icon (Right)

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-rouned separator-rouned-right">
  <i class="fa fa-cog"></i>
</div>

Separator Border Icon (Center)

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-border-rouned">
  <i class="fa fa-cog"></i>
</div>

Separator Center Aligned

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator separator-small-line separator-rouned">
  <i class="fa fa-pencil"></i>
</div>

Separator Border Dotted

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate laborum cum qui, dolores natus veniam. Delectus neque temporibus quae ex dolorum repellat labore ipsum veniam. Labore deserunt sed asperiores temporibus quo similique totam odio, repellat adipisci assumenda id non earum dolore accusantium libero atque consequuntur corporis nesciunt aliquam, minima iure.


<h4>.........</h4>
<p>.........</p>
<div class="separator dotted separator-medium-line"> </div>