Responsive Layout

 

JomSocial Theme

 

Buy Now

 

Our Community
Latest Photos
Latest Videos
Our Blog
Forum
Latest Events
CLOSE
Pulvinar tempor cras amet ac turpis tristique tristique ... (read more)close
SERVICES
 

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

UNLIMITED COLORS

READ MORE

GREAT FEATURES

READ MORE

RICH TYPOGRAPHY

READ MORE
 
GET CODE
<div class="jf_services" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-rocket"></i>
			<h3>UNLIMITED COLORS</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-magic"></i>
			<h3>GREAT FEATURES</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-star"></i>
			<h3>RICH TYPOGRAPHY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>

With Different (Fluid) Columns

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE
 
GET CODE
<div class="jf_services jf_fluid no_paddings">
	<div class="col-1-3">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="col-1-3">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="col-1-3">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

UNLIMITED COLORS

READ MORE

GREAT FEATURES

READ MORE

RICH TYPOGRAPHY

READ MORE
 
GET CODE
<div class="jf_services colorHover" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-rocket"></i>
			<h3>UNLIMITED COLORS</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-magic"></i>
			<h3>GREAT FEATURES</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-star"></i>
			<h3>RICH TYPOGRAPHY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

UNLIMITED COLORS

READ MORE

GREAT FEATURES

READ MORE

RICH TYPOGRAPHY

READ MORE
 
GET CODE
<div class="jf_services filled" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-rocket"></i>
			<h3>UNLIMITED COLORS</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-magic"></i>
			<h3>GREAT FEATURES</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-star"></i>
			<h3>RICH TYPOGRAPHY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE
 
GET CODE
<div class="jf_services rotate" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>
<div class="jf_services rotate colorHover" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>
<div class="jf_services rotate filled" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE

HIGH QUALITY

READ MORE

RESPONSIVE LAYOUT

READ MORE

EASY SETUP

READ MORE
 
GET CODE
<div class="jf_services noborder colorHover" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>
<div class="jf_services noborder rotate colorHover" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>
<div class="jf_services noborder rotate filled" style="width:90%">
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-check"></i>
			<h3>HIGH QUALITY</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4">
		<div class="wrapper">
			<i class="fa fa-desktop"></i>
			<h3>RESPONSIVE LAYOUT</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
	<div class="jf_col grid_4 last-column">
		<div class="wrapper">
			<i class="fa fa-cogs"></i>
			<h3>EASY SETUP</h3>
			<a class="readmore" href="#" target="_self">READ MORE</a>
		</div>
	</div>
</div>

Icons you can get from Lists Typography

Columns you can get from Columns Typography

 
Layouts
Colors