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="jmbadge" >Text goes here</p>
<p class="jmcalendar" >Text goes here</p>
<p class="jmchat" >Text goes here</p>
<p class="jmcheck" >Text goes here</p>
<p class="jmcloud" >Text goes here</p>
<p class="jmdirection" >Text goes here</p>
<p class="jmdivide" >Text goes here</p>
<p class="jmerror" >Text goes here</p>
<p class="jmfire" >Text goes here</p>
<p class="jmflag" >Text goes here</p>
<p class="jmheart" >Text goes here</p>
<p class="jmhome" >Text goes here</p>
<p class="jminfo" >Text goes here</p>
<p class="jmlist" >Text goes here</p>
<p class="jmmail" >Text goes here</p>
<p class="jmpeople" >Text goes here</p>
<p class="jmstar" >Text goes here</p>
<p class="jmstat" >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-arrow">
<-- 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-arrow2">
<-- 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" href="#">Read more</a>
<a class="btn" href="#">Button</a>
Glyphicon Font
<span class="icon-joomla"> </span>
Front page header
<div class="jm-presentation"> <span class="jm-subtitle">fc bulldogs Symphony, a concert of whistles for fc soccer</span> <h1 class="jm-title-big">Willis & Jolie deliver again <br>to show Wejherowo are <br>THRIVING without Clarke</h1> <a class="readmore" href="#" title="Read More">Read More</a> </div>
Willis & Jolie deliver again
to show Wejherowo are
THRIVING without Clarke
Read MoreNext Match
This is custom HTML code if you want to use it instead of DJ-League modules.
<div class="jm-next-match">
<div class="jm-date-counts" data-enddate="may,28,2016,12:15:00">
<span><span class="days"></span></span>
<span><span class="hours"></span></span>
<span><span class="mins"></span></span>
<span><span class="secs"></span></span>
</div>
<div class="jm-match">
<img src="/images/modules/fc-soccer.png" alt=""/><span>FC SOCCER : FC BULLDOGS</span><img src="/images/modules/fc-bulldogs.png" alt=""/>
</div>
<a href="#" class="jm-see">See schedule</a>
</div>Worth to mention
In the purpose of this article counter is not displayed dynamically. Running counter you can see on the home page.
Last Match
This is custom HTML code if you want to use it instead of DJ-League modules.
<div class="jm-last-match">
<div><img src="/images/modules/fc-soccer.png" alt=""/>
<div>FC SOCCER</div>
</div>
<div class="jm-score">0 : 4</div>
<div> <img src="/images/modules/fc-bulldogs.png" alt=""/>
<div>FC BULLDOGS</div>
</div>
<a href="#" class="jm-see">See all</a>
</div>League Table
This is custom HTML code if you want to use it instead of DJ-League modules.
<div class="jm-league-table">
<table>
<thead>
<tr>
<td>Team</td>
<td>M</td>
<td>G</td>
<td>Pts</td>
</tr>
</thead>
<tbody>
<tr>
<td>1. FC Bulldogs</td>
<td>13</td>
<td>+21</td>
<td>33</td>
</tr>
<tr>
<td>2. FC Soccer</td>
<td>13</td>
<td>+12</td>
<td>29</td>
</tr>
<tr>
<td>3. Kapino</td>
<td>13</td>
<td>+17</td>
<td>27</td>
</tr>
<tr>
<td>4. Reda</td>
<td>13</td>
<td>+3</td>
<td>24</td>
</tr>
<tr>
<td>5. Bolszewo</td>
<td>13</td>
<td>+7</td>
<td>21</td>
</tr>
<tr>
<td>6. Orle</td>
<td>13</td>
<td>+2</td>
<td>21</td>
</tr>
</tbody>
</table>
<a href="#" class="jm-see">See all</a>
</div>League Table
| Team | M | G | Pts |
| 1. FC Bulldogs | 13 | +21 | 33 |
| 2. FC Soccer | 13 | +12 | 29 |
| 3. Kapino | 13 | +17 | 27 |
| 4. Reda | 13 | +3 | 24 |
| 5. Bolszewo | 13 | +7 | 21 |
| 6. Orle | 13 | +2 | 21 |
All time trophies
<div class="jm-trophies">
<div class="jm-col5">
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/01-champions.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="4">4</div>
<div class="jm-subtitle">Champions League</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/02-uefa.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="3">3</div>
<div class="jm-subtitle">UEFA Cup</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/03-world.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="2">2</div>
<div class="jm-subtitle">Club World Cup</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/04-uefa-super.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="4">4</div>
<div class="jm-subtitle">UEFA Super Cup</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/05-uefa-winners.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="4">4</div>
<div class="jm-subtitle">UEFA Cup Winners Cup</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/06-copa-del.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="26">26</div>
<div class="jm-subtitle">Copa Del Rey</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/07-la-liga.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="21">21</div>
<div class="jm-subtitle">La Liga</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/08-spanish.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="14">14</div>
<div class="jm-subtitle">Spanish Super Cup</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/09-latin.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="2">2</div>
<div class="jm-subtitle">Latin Cup</div>
</div>
<div class="jm-trophy">
<div class="jm-img"><img src="/images/trophies-counter/10-copa-liga.png" alt=""/></div>
<div class="jm-count" data-from="0" data-to="2">2</div>
<div class="jm-subtitle">Copa De La Liga</div>
</div>
</div>
</div>
Players
<div class="jm-players-wrapper">
<div class="jm-col4">
<div class="jm-player-wrapper">
<div class="jm-player">
<div class="jm-player-image">
<img src="/images/modules/players/01.jpg" alt=""/>
</div>
<div class="jm-player-description">
<span class="jm-player-number">10</span>
<span class="jm-player-info">
<span class="jm-player-name">John Willis</span>
<span class="jm-player-position">Defender</span>
</span>
</div>
</div>
</div>
<div class="jm-player-wrapper">
<div class="jm-player">
<div class="jm-player-image">
<img src="/images/modules/players/02.jpg" alt=""/>
</div>
<div class="jm-player-description">
<span class="jm-player-number">11</span>
<span class="jm-player-info">
<span class="jm-player-name">Luis Jolie</span>
<span class="jm-player-position">Defender</span>
</span>
</div>
</div>
</div>
<div class="jm-player-wrapper">
<div class="jm-player">
<div class="jm-player-image">
<img src="/images/modules/players/03.jpg" alt=""/>
</div>
<div class="jm-player-description">
<span class="jm-player-number">9</span>
<span class="jm-player-info">
<span class="jm-player-name">Andres Clear</span>
<span class="jm-player-position">Goalkeeper</span>
</span>
</div>
</div>
</div>
<div class="jm-player-wrapper">
<div class="jm-player">
<div class="jm-player-image">
<img src="/images/modules/players/04.jpg" alt=""/>
</div>
<div class="jm-player-description">
<span class="jm-player-number">8</span>
<span class="jm-player-info">
<span class="jm-player-name">Bruce Doe</span>
<span class="jm-player-position">Goalkeeper</span>
</span>
</div>
</div>
</div>
</div>
<a href="#" class="jm-see-all">See the whole FC kickers Squad</a>
</div>
Match table
This is custom HTML code if you want to use it instead of DJ-League modules.
<div class="jm-match-table clearfix">
<div class="jm-next-match">
<div class="jm-date-counts" data-enddate="may,28,2016,12:15:00">
<span><span class="days"></span></span>
<span><span class="hours"></span></span>
<span><span class="mins"></span></span>
<span><span class="secs"></span></span>
</div>
<div class="jm-match">
<img src="/images/modules/fc-soccer.png" alt=""/><span>FC SOCCER : FC BULLDOGS</span><img src="/images/modules/fc-bulldogs.png" alt=""/>
</div>
<a href="#" class="jm-see">October 9, 20177:00 pm | Cambridgeshire UK</a>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">25</span><br/>APR</div>
<div class="rivals span5"><img src="/images/modules/teams/03.png" alt=""/>Kapino <span class="vs">vs</span> Reda<img src="/images/modules/teams/04.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">08</span><br/>SEP</div>
<div class="rivals span5"><img src="/images/modules/teams/08.png" alt=""/>Nanice <span class="vs">vs</span> Pieleszewo<img src="/images/modules/teams/09.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">10</span><br/>OCT</div>
<div class="rivals span5"><img src="/images/modules/teams/06.png" alt=""/>Orle <span class="vs">vs</span> Kapino<img src="/images/modules/teams/03.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">06</span><br/>DEC</div>
<div class="rivals span5"><img src="/images/modules/teams/04.png" alt=""/>Reda <span class="vs">vs</span> Ustarbowo<img src="/images/modules/teams/10.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">15</span><br/>FEB</div>
<div class="rivals span5"><img src="/images/modules/teams/05.png" alt=""/>Bolszewo <span class="vs">vs</span> Gowino<img src="/images/modules/teams/07.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">30</span><br/>OCT</div>
<div class="rivals span5"><img src="/images/modules/teams/03.png" alt=""/>Kapino <span class="vs">vs</span> Nanice<img src="/images/modules/teams/08.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">03</span><br/>JAN</div>
<div class="rivals span5"><img src="/images/modules/teams/07.png" alt=""/>Gowino <span class="vs">vs</span> Orle<img src="/images/modules/teams/06.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
<div class="jm-match-table-row">
<div class="jm-table-row clearfix">
<div class="date span1"><span class="day">12</span><br/>DEC</div>
<div class="rivals span5"><img src="/images/modules/teams/10.png" alt=""/>Ustarbowo <span class="vs">vs</span> Bolszewo<img src="/images/modules/teams/05.png" alt=""/></div>
<div class="location span3"><img src="/images/modules/location.png" alt=""/>London, UK</div>
<div class="read span3"><a href="#" class="readmore">Read more</a></div>
</div>
</div>
</div>Worth to mention
In the purpose of this article counter is not displayed dynamically. Running counter you can see on the home page.
Kapino 
London, UK
Nanice 
Orle 
Bolszewo 
