Image Borders
<img class="img-rounded" src="/image.jpg" />
<img class="img-circle" src="/image.jpg" />
<img class="img-polaroid" src="/image.jpg" />
Headings
This is Heading One (h1)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.
This is Heading Two (h2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.
This is Heading Three (h3)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.
This is Heading Four (h4)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.
This is Heading Five (h5)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.
This is Heading Six (h6)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.
Numered blocks
<p class="jm-block"><span class="jm">01</span>Text goes here</p>
01Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.
02Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.
03Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.
<p class="jm-block second"><span class="jm">a</span>Text goes here</p>
aLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.
bLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.
cLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.
Colored Blocks
Icon blocks
<p class="jm-badge" >Text goes here</p>
<p class="jm-calendar" >Text goes here</p>
<p class="jm-chat" >Text goes here</p>
<p class="jm-check" >Text goes here</p>
<p class="jm-cloud" >Text goes here</p>
<p class="jm-direction" >Text goes here</p>
<p class="jm-divide" >Text goes here</p>
<p class="jm-error" >Text goes here</p>
<p class="jm-fire" >Text goes here</p>
<p class="jm-flag" >Text goes here</p>
<p class="jm-heart" >Text goes here</p>
<p class="jm-home" >Text goes here</p>
<p class="jm-info" >Text goes here</p>
<p class="jm-list" >Text goes here</p>
<p class="jm-mail" >Text goes here</p>
<p class="jm-people" >Text goes here</p>
<p class="jm-star" >Text goes here</p>
<p class="jm-stat" >Text goes here</p>
Blockquote
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>John Doe</small>
</blockquote>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
John Doe
<blockquote class="pull-right">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>John Doe</small>
</blockquote>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
John Doe
Unordered lists
<ul>
<-- list goes here -->
</ul>
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
<ul class="jm-color-list">
<-- list goes here -->
</ul>
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
<ul class="jm-light-list">
<-- list goes here -->
</ul>
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
Ordered lists
<ol>
<-- list goes here -->
</ol>
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
<ol class="jm-roman">
<-- list goes here -->
</ol>
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
<ol class="jm-alpha">
<-- list goes here -->
</ol>
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
- Duis tincidunt nunc sit amet ipsum
Read More Button
<p class="readmore"><a class="btn" href="#">Read more</a></p>
Glyphicon Font
<span class="icon-joomla"> </span>
Offcanvas Button Module
Top Contact Module
<ul class="jm-contact-icons">
<li class="jm-direction"><img src="/images/modules/direction.png" alt="Direction" /><a title="Contact" href="/#">Peterborough, UK</a></li>
<li class="jm-email"><img src="/images/modules/email.png" alt="Email" /><a title="Contact" href="/#">Email</a></li>
<li class="jm-phone"><img src="/images/modules/phone.png" alt="Phone" /><a title="Contact" href="/#">+44 7837 383 484</a></li>
</ul>
Residential Solutions Module
<div class="jm-box"> <div class="jm-box-in"> <div class="jm-icon"><img src="/images/modules/icon1.png" alt="" /></div> <div class="jm-column"> <span class="title">Residential Solutions</span> <a href="/#" class="link">www.jm-internet.com</a> <span class="description">Lorem lean startup ipsum product market fit customer development acquihire technical cofounder. User engagement.</span> <span class="contact">call 888-777-888</span> <a href="/#" class="readmore">read more</a></div> <div class="jm-expand"> <div class="expand-in"><span class="subtitle">Services Include</span> <ul> <li>Lorem ipsum</li> <li>Dolor sit amet</li> <li>Vestibulum venenatis</li> <li>Suscipit libero</li> </ul> </div> </div> </div> </div>
Business Solutions Module
<div class="jm-box"> <div class="jm-box-in"> <div class="jm-icon"><img src="/images/modules/icon2.png" alt="" /></div> <div class="jm-column"> <span class="title">Business Solutions</span> <a href="/#" class="link">www.jm-internet.com</a> <span class="description">Lorem lean startup ipsum product market fit customer development acquihire technical cofounder. User engagement.</span> <span class="contact">call 888-777-888</span> <a href="/#" class="readmore">read more</a></div> <div class="jm-expand"> <div class="expand-in"><span class="subtitle">Services Include</span> <ul> <li>Lorem ipsum</li> <li>Dolor sit amet</li> <li>Vestibulum venenatis</li> <li>Suscipit libero</li> </ul> </div> </div> </div> </div>
Header Module
<div class="jm-custom-header"> <div class="title">This is <span>custom</span> html module</div> <div class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt<br /> ut labore et dolore magna aliqua.</div> <a class="btn" href="/#">Check an offer</a></div>
ut labore et dolore magna aliqua.
Social Module
Home Content
<div class="jm-custom-content clearfix"> <div class="jm-icon"> <div class="jm-icon-in"><span class="up">Up to</span> <span class="middle">250</span> <span class="down">Mbps</span></div> </div> <div class="jm-description"><span class="title">High speed internet</span> <p>Proin iaculis purus consequat sem cure digni ssim donec porttitora.<br />In facilisis at augue imperdiet dignissim.</p> <p class="custom-icon1"><span>Lorem ipsum dolor</span>Proin iaculis purus consequat sem cure digni ssim.</p> <p class="custom-icon2"><span>Adipiscing elit</span>Proin iaculis purus consequat sem cure.</p> <p>Proin iaculis purus consequat sem cure digni ssim donec porttitora.<br />In facilisis at augue imperdiet dignissim.</p> <a href="/#" class="readmore">Read more</a></div> </div>
Proin iaculis purus consequat sem cure digni ssim donec porttitora.
In facilisis at augue imperdiet dignissim.
Proin iaculis purus consequat sem cure digni ssim donec porttitora.
In facilisis at augue imperdiet dignissim.
Pricing Table Content
<div class="jm-pricing clearfix col3"> <div class="box"> <div class="box-in"> <div class="price"><span class="up">as low as</span> <span class="middle">29.95</span> <span class="down">month</span></div> <div class="title">Cable Internet</div> <div class="content"> <div class="subtitle">step up to earthlink cable internet at the speed of life</div> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Morbi rhoncus diam quis augue</li> <li>Proin non finibus diam</li> <li>Pellentesque varius</li> <li>Vivamus quis leo</li> <li>Donec ut elit maximus</li> </ul> </div> <div class="bottom"><a class="btn" href="/#">I'm interested</a></div> </div> </div> <div class="box"> <div class="box-in"> <div class="price"><span class="up">as low as</span> <span class="middle">14.85</span> <span class="down">month</span></div> <div class="title">DSL Internet</div> <div class="content"> <div class="subtitle">step up to incredible dsl cable internet</div> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Morbi rhoncus diam quis augue</li> <li>Proin non finibus diam</li> <li>Pellentesque varius</li> <li>Vivamus quis leo</li> <li>Donec ut elit maximus</li> </ul> </div> <div class="bottom"><a class="btn" href="/#">I'm interested</a></div> </div> </div> <div class="box"> <div class="box-in"> <div class="price"><span class="up">as low as</span> <span class="middle">39.95</span> <span class="down">month</span></div> <div class="title">Satellite Internet</div> <div class="content"> <div class="subtitle">No dsl or cable in your area? get satellite internet</div> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Morbi rhoncus diam quis augue</li> <li>Proin non finibus diam</li> <li>Pellentesque varius</li> <li>Vivamus quis leo</li> <li>Donec ut elit maximus</li> </ul> </div> <div class="bottom"><a class="btn" href="/#">I'm interested</a></div> </div> </div> </div>
- Lorem ipsum dolor sit amet
- Morbi rhoncus diam quis augue
- Proin non finibus diam
- Pellentesque varius
- Vivamus quis leo
- Donec ut elit maximus
- Lorem ipsum dolor sit amet
- Morbi rhoncus diam quis augue
- Proin non finibus diam
- Pellentesque varius
- Vivamus quis leo
- Donec ut elit maximus
- Lorem ipsum dolor sit amet
- Morbi rhoncus diam quis augue
- Proin non finibus diam
- Pellentesque varius
- Vivamus quis leo
- Donec ut elit maximus