USNews

Multipurpose News, Magazine and Blog HTML5 Template


Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, please feel free to email via our user page contact form. Thank you so much!


[Note: Need Some Premium Customization Done. Contact Us Via Our User Page Contact Form. ]

INTRODUCTION


USNews is a Multipurpose News, Magazine and Blog HTML5 Template Specially designed for all kinds of News, Magazine and Reviews Websites. It's an HTML5 template based on latest stable bootstrap 3.3.7. Anyone can easily update/edit this template to follow our Well Sorted Documentation.

Main Features of "USNews":

The "USNews" template is a responsive HTML template based on Bootstrap 3.3.7. The structure based on a flexible grid that lets you change HTML pages quickly and logically with a nestable system.

If you would like to edit the layout of any elements in whole template, you would do the following:

Open any '.html' or, '.css', so that is extremely easy to change any html markup and css attributes. Simply find the related and commented heading in the html or, css file and make your magic.

"USNews" using the following CSS files:

css/font-awesome.min.css Font Awesome
css/font-awesome-rtl.css Font Awesome RTL
css/bootstrap.min.css Bootstrap 3 Framework
css/bootstrap-rtl.min.css Bootstrap RTL Theme
css/fontawesome-stars-o.min.css Bar Rating Plugin
style.css Template Main Styles
css/responsive-style.css Template Responsive Styles
css/rtl-style.css Template RTL Styles
css/colors/theme-color-1.css Template Color Scheme Styles
css/custom.css Template Custom Styles
js/jquery-3.2.1.min.js jQuery Library
js/bootstrap.min.js Bootstrap 3 Framework
js/jquery.sticky.min.js Sticky Plugin
js/jquery.marquee.min.js Marquee Plugin
js/jquery.hoverIntent.min.js Hover Intent Plugin
js/jquery.validate.min.js Validation Plugin
js/isotope.min.js Isotope Plugin
js/theia-sticky-sidebar.min.js Theia Sticky Sidebar Plugin
js/resizesensor.min.js Resize Sensor Plugin
js/jquery.zoom.min.js Zoom Plugin
js/jquery.barrating.min.js Bar Rating Plugin
js/jquery.countdown.min.js Countdown Plugin
js/retina.min.js RetinaJS Plugin
js/color-switcher.min.js Color Switcher Plugin
js/main.js Template Main Scripts
Via FTP:

1. Open up your 'FTP Software' of choice and connect to your hosting

2. Browse to required directory (Normally: ./public_html)

3. Extract the '.zip' file and choose which templates to upload.

4. Upload the template to the server.

Once you finished setup successfully, you can customize it as you want. Below are some common frequently asked questions.

Q. How To Change Default Color Schemes?

Q. How To Remove Preloader?

Q. How To Change Header Topbar Text and Links?

Q. How To Change Header Logo?

Q. How To Change Header Ad?

Q. How To Change Header Menu Links?

Q. How To Change Header Dropdown Links?

Q. How To Change Header Megamenu Links?

Q. How To Change News Ticker Contents?

Q. How To Change Breadcrumb Links?

Q. How To Change Post Image and Info?

Q. How To Change Pricing Image and Content?

Q. How To Change FAQ Item Content?

Q. How To Change Product Item Info?

Q. How To Change Product Gallery Images?

Q. How To Change Product Summery Contents?

Q. How To Change Contact Categories?

Q. How To Change Google MAP API Key?

Q. How To Change Contact Page Map?

Q. How To Change Contact Info?

Q. How To Setup Contact Redirect Email?

Q. How To Change Subscribe Widget Mailchimp List?

Q. How To Change Ad Widget?

Q. How To Change Social Widget?

Q. How To Change Poll Widget?

Q. How To Change About Widget?

Q. How To Change Coming Soon Page Content?

Q. How To Change 404 Page Content?

Q. How To Change Footer Copyright Text and Social Links?

Ad Widgets:

  • Ad Widget 01
  • Ad Widget 02
  • Ad Widget 03
  • Ad Widget 04
<!-- Widget Start -->
<div class="widget">
	<!-- Ad Widget Start -->
	<div class="ad--widget">
		<a href="#">
			<img src="img/ads-img/ad-300x250-1.jpg" alt="">
		</a>
	</div>
	<!-- Ad Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Ad Widget Start -->
	<div class="ad--widget">
		<div class="row">
			<div class="col-sm-6">
				<a href="#">
					<img src="img/ads-img/ad-150x150-1.jpg" alt="">
				</a>
			</div>

			<div class="col-sm-6">
				<a href="#">
					<img src="img/ads-img/ad-150x150-2.jpg" alt="">
				</a>
			</div>
		</div>
	</div>
	<!-- Ad Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Ad Widget Start -->
	<div class="ad--widget">
		<div class="row">
			<div class="col-sm-12">
				<a href="#">
					<img src="img/ads-img/ad-300x250-1.jpg" alt="">
				</a>
			</div>

			<div class="col-sm-6">
				<a href="#">
					<img src="img/ads-img/ad-150x150-1.jpg" alt="">
				</a>
			</div>

			<div class="col-sm-6">
				<a href="#">
					<img src="img/ads-img/ad-150x150-2.jpg" alt="">
				</a>
			</div>
		</div>
	</div>
	<!-- Ad Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Ad Widget Start -->
	<div class="ad--widget">
		<a href="#">
			<img src="img/ads-img/ad-300x600-1.jpg" alt="">
		</a>
	</div>
	<!-- Ad Widget End -->
</div>
<!-- Widget End -->

Social Widgets:

  • Social Widget 01
  • Social Widget 02
  • Social Widget 03
  • Social Widget 04
  • Social Widget 05
  • Social Widget 06
  • Social Widget 07
  • Social Widget 08
  • Social Widget 09
  • Social Widget 10
  • Social Widget 11
  • Social Widget 12
  • Social Widget 13
  • Social Widget 14
  • Social Widget 15
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--1">
		<ul class="nav">
			<li class="facebook">
				<a href="#">
					<span class="icon"><i class="fa fa-facebook-f"></i></span>
					<span class="count">521</span>
					<span class="title">Likes</span>
				</a>
			</li>
			<li class="twitter">
				<a href="#">
					<span class="icon"><i class="fa fa-twitter"></i></span>
					<span class="count">3297</span>
					<span class="title">Followers</span>
				</a>
			</li>
			<li class="google-plus">
				<a href="#">
					<span class="icon"><i class="fa fa-google-plus"></i></span>
					<span class="count">596282</span>
					<span class="title">Followers</span>
				</a>
			</li>
			<li class="rss">
				<a href="#">
					<span class="icon"><i class="fa fa-rss"></i></span>
					<span class="count">521</span>
					<span class="title">Subscriber</span>
				</a>
			</li>
			<li class="vimeo">
				<a href="#">
					<span class="icon"><i class="fa fa-vimeo"></i></span>
					<span class="count">3297</span>
					<span class="title">Followers</span>
				</a>
			</li>
			<li class="youtube">
				<a href="#">
					<span class="icon"><i class="fa fa-youtube-square"></i></span>
					<span class="count">596282</span>
					<span class="title">Subscriber</span>
				</a>
			</li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--2">
		<ul class="nav row gutter--20">
			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 facebook">
				<a href="#">
					<span class="icon">
						<i class="fa fa-facebook"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>Facebook</span>
						<span>3.12 k</span>
					</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 twitter">
				<a href="#">
					<span class="icon">
						<i class="fa fa-twitter"></i>
						<span>Tweet</span>
					</span>

					<span class="text">
						<span>Twitter</span>
						<span>869</span>
					</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 google-plus">
				<a href="#">
					<span class="icon">
						<i class="fa fa-google-plus"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>Google+</span>
						<span>639</span>
					</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 dribbble">
				<a href="#">
					<span class="icon">
						<i class="fa fa-dribbble"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>Dribbble</span>
						<span>483</span>
					</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 linkedin">
				<a href="#">
					<span class="icon">
						<i class="fa fa-linkedin"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>LinkedIn</span>
						<span>2.2 K</span>
					</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 pinterest">
				<a href="#">
					<span class="icon">
						<i class="fa fa-pinterest-p"></i>
						<span>Pin it</span>
					</span>

					<span class="text">
						<span>Pinterest</span>
						<span>493</span>
					</span>
				</a>
			</li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--2">
		<ul class="nav row gutter--20">
			<li class="col-md-12 facebook">
				<a href="#">
					<span class="icon">
						<i class="fa fa-facebook"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>Facebook</span>
						<span>3.12 k</span>
					</span>
				</a>
			</li>

			<li class="col-md-12 twitter">
				<a href="#">
					<span class="icon">
						<i class="fa fa-twitter"></i>
						<span>Tweet</span>
					</span>

					<span class="text">
						<span>Twitter</span>
						<span>869</span>
					</span>
				</a>
			</li>

			<li class="col-md-12 google-plus">
				<a href="#">
					<span class="icon">
						<i class="fa fa-google-plus"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>Google+</span>
						<span>639</span>
					</span>
				</a>
			</li>

			<li class="col-md-12 dribbble">
				<a href="#">
					<span class="icon">
						<i class="fa fa-dribbble"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>Dribbble</span>
						<span>483</span>
					</span>
				</a>
			</li>

			<li class="col-md-12 linkedin">
				<a href="#">
					<span class="icon">
						<i class="fa fa-linkedin"></i>
						<span>Share</span>
					</span>

					<span class="text">
						<span>LinkedIn</span>
						<span>2.2 K</span>
					</span>
				</a>
			</li>

			<li class="col-md-12 pinterest">
				<a href="#">
					<span class="icon">
						<i class="fa fa-pinterest-p"></i>
						<span>Pin it</span>
					</span>

					<span class="text">
						<span>Pinterest</span>
						<span>493</span>
					</span>
				</a>
			</li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--3">
		<ul class="nav">
			<li><a href="#"><i class="fa fa-facebook"></i></a></li>
			<li><a href="#"><i class="fa fa-twitter"></i></a></li>
			<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
			<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
			<li><a href="#"><i class="fa fa-rss"></i></a></li>
			<li><a href="#"><i class="fa fa-youtube-play"></i></a></li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--4">
		<ul class="nav">
			<li><a href="#"><i class="fa fa-facebook"></i></a></li>
			<li><a href="#"><i class="fa fa-twitter"></i></a></li>
			<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
			<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
			<li><a href="#"><i class="fa fa-rss"></i></a></li>
			<li><a href="#"><i class="fa fa-youtube-play"></i></a></li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--5">
		<ul class="nav">
			<li class="facebook">
				<a href="#"><i class="fa fa-facebook"></i></a>
			</li>
			
			<li class="twitter">
				<a href="#"><i class="fa fa-twitter"></i></a>
			</li>
			
			<li class="google-plus">
				<a href="#"><i class="fa fa-google-plus"></i></a>
			</li>
			
			<li class="linkedin">
				<a href="#"><i class="fa fa-linkedin"></i></a>
			</li>
			
			<li class="rss">
				<a href="#"><i class="fa fa-rss"></i></a>
			</li>

			<li class="youtube">
				<a href="#"><i class="fa fa-youtube"></i></a>
			</li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--6">
		<ul class="nav row gutter--20">
			<li class="col-xs-6 col-xxs-12 facebook">
				<a href="#">
					<span class="icon">
						<i class="fa fa-facebook"></i>
					</span>

					<span class="text">
						<i class="fa fa-facebook"></i>
						<span>Facebook</span>
					</span>
				</a>
			</li>

			<li class="col-xs-6 col-xxs-12 twitter">
				<a href="#">
					<span class="icon">
						<i class="fa fa-twitter"></i>
					</span>

					<span class="text">
						<i class="fa fa-twitter"></i>
						<span>Twitter</span>
					</span>
				</a>
			</li>

			<li class="col-xs-6 col-xxs-12 google-plus">
				<a href="#">
					<span class="icon">
						<i class="fa fa-google-plus"></i>
					</span>

					<span class="text">
						<i class="fa fa-google-plus"></i>
						<span>Google Plus</span>
					</span>
				</a>
			</li>

			<li class="col-xs-6 col-xxs-12 pinterest">
				<a href="#">
					<span class="icon">
						<i class="fa fa-pinterest-p"></i>
					</span>

					<span class="text">
						<i class="fa fa-pinterest-p"></i>
						<span>Pinterest</span>
					</span>
				</a>
			</li>

			<li class="col-xs-6 col-xxs-12 dribbble">
				<a href="#">
					<span class="icon">
						<i class="fa fa-dribbble"></i>
					</span>

					<span class="text">
						<i class="fa fa-dribbble"></i>
						<span>Dribbble</span>
					</span>
				</a>
			</li>

			<li class="col-xs-6 col-xxs-12 linkedin">
				<a href="#">
					<span class="icon">
						<i class="fa fa-linkedin"></i>
					</span>

					<span class="text">
						<i class="fa fa-linkedin"></i>
						<span>Pinterest</span>
					</span>
				</a>
			</li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Stay Connected</h2>
		<i class="icon fa fa-share-alt"></i>
	</div>

	<!-- Social Widget Start -->
	<div class="social--widget style--7">
		<ul class="nav row">
			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 facebook">
				<a href="#">
					<i class="fa fa-facebook"></i>
					<span>Facebook</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 twitter">
				<a href="#">
					<i class="fa fa-twitter"></i>
					<span>Twitter</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 google-plus">
				<a href="#">
					<i class="fa fa-google-plus"></i>
					<span>Google Plus</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 youtube">
				<a href="#">
					<i class="fa fa-youtube-play"></i>
					<span>Youtube</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 rss">
				<a href="#">
					<i class="fa fa-rss"></i>
					<span>RSS</span>
				</a>
			</li>

			<li class="col-md-6 col-sm-12 col-xs-6 col-xxs-12 linkedin">
				<a href="#">
					<i class="fa fa-linkedin"></i>
					<span>Linkedin</span>
				</a>
			</li>
		</ul>
	</div>
	<!-- Social Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- FB Widget Start -->
	<div class="fb--widget">
		<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fthemelooks&tabs&width=340&height=214&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="340" height="214" style="border:none;overflow:hidden"></iframe>
	</div>
	<!-- FB Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- FB Widget Start -->
	<div class="fb--widget">
		<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fthemelooks&tabs=timeline&width=340&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=false&appId=1859100401072493" width="340" height="500" style="border:none;overflow:hidden"></iframe>
	</div>
	<!-- FB Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- FB Widget Start -->
	<div class="fb--widget">
		<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fthemelooks&tabs=events&width=340&height=244&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=false&appId=1859100401072493" width="340" height="244" style="border:none;overflow:hidden"></iframe>
	</div>
	<!-- FB Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Twitter Widget Start -->
	<div class="twitter--widget">
		<a class="twitter-timeline" data-height="380" data-theme="light" href="https://twitter.com/ThemeLooks">Tweets by ThemeLooks</a> <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
	</div>
	<!-- Twitter Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Google Plus Widget Start -->
	<div class="google-plus--widget">
		<script src="https://apis.google.com/js/platform.js" async defer>
		  {parsetags: 'explicit'}
		</script>
		<div class="g-page" data-width="323" data-href="https://plus.google.com/108458806077634977267" data-layout="landscape" data-rel="publisher"></div>
	</div>
	<!-- Google Plus Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Google Plus Widget Start -->
	<div class="google-plus--widget">
		<script src="https://apis.google.com/js/platform.js" async defer>
		  {parsetags: 'explicit'}
		</script>
		<div class="g-page" data-width="323" data-href="https://plus.google.com/108458806077634977267" data-rel="publisher"></div>
	</div>
	<!-- Google Plus Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Flicker Widget Start -->
	<div class="flicker--widget">
		<style type="text/css"> 
		.flickrimg {border: 0px solid #666666 !important; padding:0px; margin:5px;}
		#flickr_badge_wrapper {width:360px;text-align:left}
		</style><div id="flickr_badge_wrapper"><script type="text/javascript" src="http://www.flickr.com/badge_code.gne?count=12&display=latest&size=square&nsid=64801217@N07&raw=1"></script><center><small>create with <a href="http://www.flickrbadge.com">flickr badge</a>.</small></center></div>
	</div>
	<!-- Flicker Widget End -->
</div>
<!-- Widget End -->

Subscribe Widgets:

  • Subscribe Widget 01
  • Subscribe Widget 02
  • Subscribe Widget 03
  • Subscribe Widget 04
  • Subscribe Widget 05
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Get Newsletter</h2>
		<i class="icon fa fa-envelope-open-o"></i>
	</div>

	<!-- Subscribe Widget Start -->
	<div class="subscribe--widget">
		<div class="content">
			<img src="img/widgets-img/mailchimp-logo.png" alt="">
			<p>Subscribe to our newsletter to get  latest news, popular news and exclusive updates.</p>
		</div>

		<form action="https://themelooks.us13.list-manage.com/subscribe/post?u=79f0b132ec25ee223bb41835f&id=f4e0e93d1d" method="post" name="mc-embedded-subscribe-form" target="_blank" data-form="mailchimpAjax" novalidate="novalidate">
			<div class="input-group">
				<input type="email" name="EMAIL" placeholder="E-mail address" class="form-control" autocomplete="off" required>

				<div class="input-group-btn">
					<button type="submit" class="btn btn-lg btn-default active"><i class="fa fa-paper-plane-o"></i></button>
				</div>
			</div>

			<div class="status"></div>
		</form>
	</div>
	<!-- Subscribe Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Get Newsletter</h2>
		<i class="icon fa fa-envelope-open-o"></i>
	</div>

	<!-- Subscribe Widget Start -->
	<div class="subscribe--widget">
		<div class="content">
			<p>Subscribe to our newsletter to get  latest news, popular news and exclusive updates.</p>
		</div>

		<form action="https://themelooks.us13.list-manage.com/subscribe/post?u=79f0b132ec25ee223bb41835f&id=f4e0e93d1d" method="post" name="mc-embedded-subscribe-form" target="_blank" data-form="mailchimpAjax" novalidate="novalidate">
			<div class="input-group">
				<input type="email" name="EMAIL" placeholder="E-mail address" class="form-control" autocomplete="off" required>

				<div class="input-group-btn">
					<button type="submit" class="btn btn-lg btn-default active"><i class="fa fa-paper-plane-o"></i></button>
				</div>
			</div>

			<div class="status"></div>
		</form>
	</div>
	<!-- Subscribe Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Get Newsletter</h2>
		<i class="icon fa fa-envelope-open-o"></i>
	</div>

	<!-- Subscribe Widget Start -->
	<div class="subscribe--widget">
		<div class="content">
			<p>Subscribe to our newsletter to get  latest news, popular news and exclusive updates.</p>
		</div>

		<form action="https://themelooks.us13.list-manage.com/subscribe/post?u=79f0b132ec25ee223bb41835f&id=f4e0e93d1d" method="post" name="mc-embedded-subscribe-form" target="_blank" data-form="mailchimpAjax" novalidate="novalidate">
			<input type="email" name="EMAIL" placeholder="E-mail address" class="form-control" autocomplete="off" required>
			
			<button type="submit" class="btn btn-lg btn-block btn-default active">Subscribe</button>

			<div class="status"></div>
		</form>
	</div>
	<!-- Subscribe Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Get Newsletter</h2>
		<i class="icon fa fa-envelope-open-o"></i>
	</div>

	<!-- Subscribe Widget Start -->
	<div class="subscribe--widget">
		<div class="content">
			<p>Subscribe to our newsletter to get  latest news, popular news and exclusive updates.</p>
		</div>

		<form action="https://themelooks.us13.list-manage.com/subscribe/post?u=79f0b132ec25ee223bb41835f&id=f4e0e93d1d" method="post" name="mc-embedded-subscribe-form" target="_blank" data-form="mailchimpAjax" novalidate="novalidate">
			<input type="text" name="MERGE1" placeholder="First Name" class="form-control" autocomplete="off" required>

			<input type="email" name="EMAIL" placeholder="E-mail address" class="form-control" autocomplete="off" required>
			
			<button type="submit" class="btn btn-lg btn-block btn-default active">Subscribe</button>

			<div class="status"></div>
		</form>
	</div>
	<!-- Subscribe Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Get Newsletter</h2>
		<i class="icon fa fa-envelope-open-o"></i>
	</div>

	<!-- Subscribe Widget Start -->
	<div class="subscribe--widget">
		<form action="https://themelooks.us13.list-manage.com/subscribe/post?u=79f0b132ec25ee223bb41835f&id=f4e0e93d1d" method="post" name="mc-embedded-subscribe-form" target="_blank" data-form="mailchimpAjax" novalidate="novalidate">
			<input type="text" name="MERGE1" placeholder="First Name" class="form-control" autocomplete="off" required>

			<input type="text" name="MERGE2" placeholder="Last Name" class="form-control" autocomplete="off" required>

			<input type="email" name="EMAIL" placeholder="E-mail address" class="form-control" autocomplete="off" required>
			
			<button type="submit" class="btn btn-lg btn-block btn-default active">Subscribe</button>

			<div class="status"></div>
		</form>
	</div>
	<!-- Subscribe Widget End -->
</div>
<!-- Widget End -->

Featured News Widget:

<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Featured News</h2>
		<i class="icon fa fa-newspaper-o"></i>
	</div>

	<!-- List Widgets Start -->
	<div class="list--widget list--widget-1">
		<div class="list--widget-nav" data-ajax="tab">
			<ul class="nav nav-justified">
				<li>
					<a href="#" data-ajax-action="load_widget_hot_news">Hot News</a>
				</li>
				<li class="active">
					<a href="#" data-ajax-action="load_widget_trendy_news">Trendy News</a>
				</li>
				<li>
					<a href="#" data-ajax-action="load_widget_most_watched">Most Watched</a>
				</li>
			</ul>
		</div>

		<!-- Post Items Start -->
		<div class="post--items post--items-3" data-ajax-content="outer">
			<ul class="nav" data-ajax-content="inner">
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/news-widget-01.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Ninurta</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/news-widget-02.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Orcus</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/news-widget-03.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Rahab</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/news-widget-04.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Tannin</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
			</ul>

			<!-- Preloader Start -->
			<div class="preloader bg--color-0--b" data-preloader="1">
				<div class="preloader--inner"></div>
			</div>
			<!-- Preloader End -->
		</div>
		<!-- Post Items End -->
	</div>
	<!-- List Widgets End -->
</div>
<!-- Widget End -->

Readers Opinion Widget:

<!-- Widget Start -->
<div class="widget">
	<div class="widget--title" data-ajax="tab">
		<h2 class="h4">Readers Opinion</h2>

		<div class="nav">
			<a href="#" class="prev btn-link" data-ajax-action="load_prev_readers_opinion_widget">
				<i class="fa fa-long-arrow-left"></i>
			</a>

			<span class="divider">/</span>

			<a href="#" class="next btn-link" data-ajax-action="load_next_readers_opinion_widget">
				<i class="fa fa-long-arrow-right"></i>
			</a>
		</div>
	</div>

	<!-- List Widgets Start -->
	<div class="list--widget list--widget-2" data-ajax-content="outer">
		<!-- Post Items Start -->
		<div class="post--items post--items-3">
			<ul class="nav" data-ajax-content="inner">
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<span class="thumb"><img src="img/widgets-img/readers-opinion-01.png" alt="" data-rjs="2"></span>

							<div class="post--info">
								<div class="title">
									<h3 class="h4">Long established fact that a reader will be distracted</h3>
								</div>

								<ul class="nav meta">
									<li><span>by Ninurta</span></li>
									<li><span>16 April 2017</span></li>
								</ul>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<span class="thumb"><img src="img/widgets-img/readers-opinion-02.png" alt="" data-rjs="2"></span>

							<div class="post--info">
								<div class="title">
									<h3 class="h4">Long established fact that a reader will be distracted</h3>
								</div>

								<ul class="nav meta">
									<li><span>by Ninurta</span></li>
									<li><span>16 April 2017</span></li>
								</ul>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<span class="thumb"><img src="img/widgets-img/readers-opinion-03.png" alt="" data-rjs="2"></span>

							<div class="post--info">
								<div class="title">
									<h3 class="h4">Long established fact that a reader will be distracted</h3>
								</div>

								<ul class="nav meta">
									<li><span>by Ninurta</span></li>
									<li><span>16 April 2017</span></li>
								</ul>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
			</ul>

			<!-- Preloader Start -->
			<div class="preloader bg--color-0--b" data-preloader="1">
				<div class="preloader--inner"></div>
			</div>
			<!-- Preloader End -->
		</div>
		<!-- Post Items End -->
	</div>
	<!-- List Widgets End -->
</div>
<!-- Widget End -->

Editors Choice Widget:

<!-- Widget Start -->
<div class="widget">
	<div class="widget--title" data-ajax="tab">
		<h2 class="h4">Editors Choice</h2>

		<div class="nav">
			<a href="#" class="prev btn-link" data-ajax-action="load_prev_editors_choice_widget">
				<i class="fa fa-long-arrow-left"></i>
			</a>

			<span class="divider">/</span>

			<a href="#" class="next btn-link" data-ajax-action="load_next_editors_choice_widget">
				<i class="fa fa-long-arrow-right"></i>
			</a>
		</div>
	</div>

	<!-- List Widgets Start -->
	<div class="list--widget list--widget-1" data-ajax-content="outer">
		<!-- Post Items Start -->
		<div class="post--items post--items-3">
			<ul class="nav" data-ajax-content="inner">
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/editors-choice-01.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Ninurta</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/editors-choice-02.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Orcus</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/editors-choice-03.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Rahab</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/widgets-img/editors-choice-04.jpg" alt="" data-rjs="2"></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Tannin</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
			</ul>

			<!-- Preloader Start -->
			<div class="preloader bg--color-0--b" data-preloader="1">
				<div class="preloader--inner"></div>
			</div>
			<!-- Preloader End -->
		</div>
		<!-- Post Items End -->
	</div>
	<!-- List Widgets End -->
</div>
<!-- Widget End -->

Poll Widgets:

  • Checkbox
  • Radio
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title" data-ajax="tab">
		<h2 class="h4">Voting Poll (Checkbox)</h2>

		<div class="nav">
			<a href="#" class="prev btn-link" data-ajax-action="load_prev_poll_widget">
				<i class="fa fa-long-arrow-left"></i>
			</a>

			<span class="divider">/</span>

			<a href="#" class="next btn-link" data-ajax-action="load_next_poll_widget">
				<i class="fa fa-long-arrow-right"></i>
			</a>
		</div>
	</div>

	<!-- Poll Widget Start -->
	<div class="poll--widget" data-ajax-content="outer">
		<ul class="nav" data-ajax-content="inner">
			<li class="title">
				<h3 class="h4">Which was the best Football World Cup ever in your opinion?</h3>
			</li>

			<li class="options">
				<form action="#">
					<div class="checkbox">
						<label>
							<input type="checkbox" name="option-1">
							<span>Brazil 2014</span>
						</label>

						<p>65%<span style="width: 65%;"></span></p>
					</div>

					<div class="checkbox">
						<label>
							<input type="checkbox" name="option-2">
							<span>South Africa 2010</span>
						</label>

						<p>28%<span style="width: 28%;"></span></p>
					</div>

					<div class="checkbox">
						<label>
							<input type="checkbox" name="option-2">
							<span>Germany 2006</span>
						</label>

						<p>07%<span style="width: 07%;"></span></p>
					</div>

					<button type="submit" class="btn btn-primary">Vote Now</button>
				</form>
			</li>
		</ul>

		<!-- Preloader Start -->
		<div class="preloader bg--color-0--b" data-preloader="1">
			<div class="preloader--inner"></div>
		</div>
		<!-- Preloader End -->
	</div>
	<!-- Poll Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title" data-ajax="tab">
		<h2 class="h4">Voting Poll (Radio)</h2>

		<div class="nav">
			<a href="#" class="prev btn-link" data-ajax-action="load_prev_poll_widget">
				<i class="fa fa-long-arrow-left"></i>
			</a>

			<span class="divider">/</span>

			<a href="#" class="next btn-link" data-ajax-action="load_next_poll_widget">
				<i class="fa fa-long-arrow-right"></i>
			</a>
		</div>
	</div>

	<!-- Poll Widget Start -->
	<div class="poll--widget" data-ajax-content="outer">
		<ul class="nav" data-ajax-content="inner">
			<li class="title">
				<h3 class="h4">Do you think the cost of sending money to mobile phone should be reduced?</h3>
			</li>

			<li class="options">
				<form action="#">
					<div class="radio">
						<label>
							<input type="radio" name="option-1">
							<span>Yes</span>
						</label>

						<p>65%<span style="width: 65%;"></span></p>
					</div>

					<div class="radio">
						<label>
							<input type="radio" name="option-1">
							<span>No</span>
						</label>

						<p>28%<span style="width: 28%;"></span></p>
					</div>

					<div class="radio">
						<label>
							<input type="radio" name="option-1">
							<span>Average</span>
						</label>

						<p>07%<span style="width: 07%;"></span></p>
					</div>

					<button type="submit" class="btn btn-primary">Vote Now</button>
				</form>
			</li>
		</ul>

		<!-- Preloader Start -->
		<div class="preloader bg--color-0--b" data-preloader="1">
			<div class="preloader--inner"></div>
		</div>
		<!-- Preloader End -->
	</div>
	<!-- Poll Widget End -->
</div>
<!-- Widget End -->

Search Widgets:

  • Search Widget 01
  • Search Widget 02
  • Search Widget 03
  • Search Widget 04
<!-- Widget Start -->
<div class="widget">
	<!-- Search Widget Start -->
	<div class="search--widget">
		<form action="#" data-form="validate" novalidate="novalidate">
			<div class="input-group">
				<input type="search" name="search" placeholder="Search..." class="form-control" required="" aria-required="true">

				<div class="input-group-btn">
					<button type="submit" class="btn-link"><i class="fa fa-search"></i></button>
				</div>
			</div>
		</form>
	</div>
	<!-- Search Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Search Widget Start -->
	<div class="search--widget">
		<form action="#" data-form="validate" novalidate="novalidate">
			<div class="input-group">
				<input type="search" name="search" placeholder="Search..." class="form-control" required="" aria-required="true">

				<div class="input-group-btn">
					<button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>
				</div>
			</div>
		</form>
	</div>
	<!-- Search Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Search Widget Start -->
	<div class="search--widget">
		<form action="#" data-form="validate" novalidate="novalidate">
			<div class="input-group">
				<div class="input-group-btn dropdown">
					<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>

					<ul class="dropdown-menu">
						<li>
							<label for="searchType01">
								<input type="radio" name="searchType" id="searchType01" checked>
								<span>News</span>
							</label>
						</li>
						<li>
							<label for="searchType02">
								<input type="radio" name="searchType" id="searchType02">
								<span>Posts</span>
							</label>
						</li>
						<li>
							<label for="searchType03">
								<input type="radio" name="searchType" id="searchType03">
								<span>Products</span>
							</label>
						</li>
					</ul>
				</div>

				<input type="search" name="search" placeholder="Search..." class="form-control" required="" aria-required="true">

				<div class="input-group-btn">
					<button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>
				</div>
			</div>
		</form>
	</div>
	<!-- Search Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<!-- Search Widget Start -->
	<div class="search--widget">
		<form action="#" data-form="validate" novalidate="novalidate">
			<input type="search" name="search" placeholder="Search..." class="form-control" required="" aria-required="true">

			<button type="submit" class="btn btn-block btn-primary">Subscribe</button>
		</form>
	</div>
	<!-- Search Widget End -->
</div>
<!-- Widget End -->

Links Widget 01:

<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Catagory</h2>
		<i class="icon fa fa-folder-open-o"></i>
	</div>

	<!-- Nav Widget Start -->
	<div class="nav--widget">
		<ul class="nav">
			<li><a href="#"><span>Fashion</span><span>(22)</span></a></li>
			<li><a href="#"><span>Winter</span><span>(16)</span></a></li>
			<li><a href="#"><span>Exclusive</span><span>(84)</span></a></li>
			<li><a href="#"><span>Summer</span><span>(11)</span></a></li>
			<li><a href="#"><span>Heavy Style</span><span>(19)</span></a></li>
		</ul>
	</div>
	<!-- Nav Widget End -->
</div>
<!-- Widget End -->

Links Widget 02:

<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Usefull Info Links</h2>

		<i class="icon fa fa-expand"></i>
	</div>

	<!-- Links Widget Start -->
	<div class="links--widget">
		<ul class="nav">
			<li><a href="#" class="fa-angle-right">Gadgets</a></li>
			<li><a href="#" class="fa-angle-right">Shop</a></li>
			<li><a href="#" class="fa-angle-right">Term and Conditions</a></li>
			<li><a href="#" class="fa-angle-right">Forums</a></li>
			<li><a href="#" class="fa-angle-right">Top News of This Week</a></li>
			<li><a href="#" class="fa-angle-right">Special Recipes</a></li>
			<li><a href="#" class="fa-angle-right">Sign Up</a></li>
		</ul>
	</div>
	<!-- Links Widget End -->
</div>
<!-- Widget End -->

Tag Widgets:

  • Tag Widget 01
  • Tag Widget 02
  • Tag Widget 03
  • Tag Widget 04
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Tags</h2>
		<i class="icon fa fa-tags"></i>
	</div>

	<!-- Tags Widget Start -->
	<div class="tags--widget style--1">
		<ul class="nav">
			<li><a href="#">News</a></li>
			<li><a href="#">Image</a></li>
			<li><a href="#">Music</a></li>
			<li><a href="#">Video</a></li>
			<li><a href="#">Audio</a></li>
			<li><a href="#">Fashion</a></li>
			<li><a href="#">Latest</a></li>
			<li><a href="#">Trendy</a></li>
			<li><a href="#">Special</a></li>
			<li><a href="#">Recipe</a></li>
			<li><a href="#">Sports</a></li>
		</ul>
	</div>
	<!-- Tags Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Tags</h2>
		<i class="icon fa fa-tags"></i>
	</div>

	<!-- Tags Widget Start -->
	<div class="tags--widget style--2">
		<ul class="nav">
			<li><a href="#" class="btn-primary">News</a></li>
			<li><a href="#" class="btn-primary">Image</a></li>
			<li><a href="#" class="btn-primary">Music</a></li>
			<li><a href="#" class="btn-primary">Video</a></li>
			<li><a href="#" class="btn-primary">Audio</a></li>
			<li><a href="#" class="btn-primary">Fashion</a></li>
			<li><a href="#" class="btn-primary">Latest</a></li>
			<li><a href="#" class="btn-primary">Trendy</a></li>
			<li><a href="#" class="btn-primary">Special</a></li>
			<li><a href="#" class="btn-primary">Recipe</a></li>
			<li><a href="#" class="btn-primary">Sports</a></li>
		</ul>
	</div>
	<!-- Tags Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Tags</h2>
		<i class="icon fa fa-tags"></i>
	</div>

	<!-- Tags Widget Start -->
	<div class="tags--widget style--3">
		<ul class="nav">
			<li><a href="#">News<span>11</span></a></li>
			<li><a href="#">Image<span>12</span></a></li>
			<li><a href="#">Music<span>13</span></a></li>
			<li><a href="#">Video<span>08</span></a></li>
			<li><a href="#">Audio<span>06</span></a></li>
			<li><a href="#">Fashion<span>23</span></a></li>
			<li><a href="#">Latest<span>46</span></a></li>
			<li><a href="#">Trendy<span>20</span></a></li>
			<li><a href="#">Special<span>17</span></a></li>
			<li><a href="#">Recipe<span>24</span></a></li>
			<li><a href="#">Sports<span>09</span></a></li>
		</ul>
	</div>
	<!-- Tags Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">Tags</h2>
		<i class="icon fa fa-tags"></i>
	</div>

	<!-- Tags Widget Start -->
	<div class="tags--widget style--4">
		<ul class="nav">
			<li><a href="#">News</a></li>
			<li><a href="#">Image</a></li>
			<li><a href="#">Music</a></li>
			<li><a href="#">Video</a></li>
			<li><a href="#">Audio</a></li>
			<li><a href="#">Fashion</a></li>
			<li><a href="#">Latest</a></li>
			<li><a href="#">Trendy</a></li>
			<li><a href="#">Special</a></li>
			<li><a href="#">Recipe</a></li>
			<li><a href="#">Sports</a></li>
		</ul>
	</div>
	<!-- Tags Widget End -->
</div>
<!-- Widget End -->

Profile Widget 01:

<!-- Widget Start -->
<div class="widget">
	<!-- Profile Widget Start -->
	<div class="profile--widget">
		<div class="contributor--item style--1">
			<div class="img">
				<img src="img/contributors-img/avatar-01.jpg" alt="" data-rjs="2">
			</div>

			<div class="name">
				<h3 class="h4"><a href="author.html" class="btn-link">Karla Gleichauf</a></h3>
			</div>

			<div class="desc">
				<p>That is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
			</div>

			<ul class="social nav">
				<li><a href="#"><i class="fa fa-facebook"></i></a></li>
				<li><a href="#"><i class="fa fa-twitter"></i></a></li>
				<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
				<li><a href="#"><i class="fa fa-rss"></i></a></li>
			</ul>
		</div>
	</div>
	<!-- Profile Widget End -->
</div>
<!-- Widget End -->

Profile Widget 02:

<!-- Widget Start -->
<div class="widget">
	<!-- Profile Widget Start -->
	<div class="profile--widget">
		<div class="contributor--item style--1">
			<div class="img">
				<img src="img/contributors-img/avatar-01.jpg" alt="" data-rjs="2">
			</div>

			<div class="name">
				<h3 class="h4"><a href="author.html" class="btn-link">Karla Gleichauf</a></h3>
			</div>

			<div class="desc">
				<p>That is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
			</div>

			<div class="action">
				<a href="author.html" class="btn btn-default">Author Posts</a>
			</div>
		</div>
	</div>
	<!-- Profile Widget End -->
</div>
<!-- Widget End -->

Cart Widgets:

  • Cart Widget 01
  • Cart Widget 02
  • Cart Widget 03
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">My Cart</h2>
		<i class="icon fa fa-shopping-cart"></i>
	</div>

	<!-- Cart Widget Start -->
	<div class="cart--widget">
		<ul class="nav">
			<li class="clearfix">
				<div class="img">
					<a href="#" class="btn-link"><img src="img/shop-img/cart-item-01.jpg" alt="" data-rjs="2"></a>
				</div>

				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>

			<li class="clearfix">
				<div class="img">
					<a href="#" class="btn-link"><img src="img/shop-img/cart-item-02.jpg" alt="" data-rjs="2"></a>
				</div>

				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>

			<li class="clearfix">
				<div class="img">
					<a href="#" class="btn-link"><img src="img/shop-img/cart-item-03.jpg" alt="" data-rjs="2"></a>
				</div>

				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>
		</ul>
	</div>
	<!-- Cart Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">My Cart</h2>
		<i class="icon fa fa-shopping-cart"></i>
	</div>

	<!-- Cart Widget Start -->
	<div class="cart--widget">
		<ul class="nav">
			<li class="clearfix">
				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>

			<li class="clearfix">
				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>

			<li class="clearfix">
				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>
		</ul>
	</div>
	<!-- Cart Widget End -->
</div>
<!-- Widget End -->
<!-- Widget Start -->
<div class="widget">
	<div class="widget--title">
		<h2 class="h4">My Cart</h2>
		<i class="icon fa fa-shopping-cart"></i>
	</div>

	<!-- Cart Widget Start -->
	<div class="cart--widget">
		<ul class="nav">
			<li class="clearfix">
				<div class="img">
					<a href="#" class="btn-link"><img src="img/shop-img/cart-item-01.jpg" alt="" data-rjs="2"></a>
				</div>

				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>

			<li class="clearfix">
				<div class="img">
					<a href="#" class="btn-link"><img src="img/shop-img/cart-item-02.jpg" alt="" data-rjs="2"></a>
				</div>

				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>

			<li class="clearfix">
				<div class="img">
					<a href="#" class="btn-link"><img src="img/shop-img/cart-item-03.jpg" alt="" data-rjs="2"></a>
				</div>

				<div class="info">
					<h3 class="h4"><a href="#" class="btn-link">Lorem ipsum dolor sit amet quam ipsum</a></h3>

					<p class="text--color-1">$69.99 * 2</p>
				</div>

				<a href="#" class="remove"><i class="fa fa-remove"></i></a>
			</li>
		</ul>

		<div class="footer">
			<div class="amount clearfix">
				<p>Amount</p>
				<p>$209.97</p>
			</div>
			
			<div class="actions clearfix">
				<a href="#" class="btn btn-default">View Cart</a>
				<a href="#" class="btn btn-primary">Checkout</a>
			</div>
		</div>
	</div>
	<!-- Cart Widget End -->
</div>
<!-- Widget End -->

USNews Supports 10 Different CSS Preloaders. Also an Image Preloader.

  • Preloader Style 01
  • Preloader Style 02
  • Preloader Style 03
  • Preloader Style 04
  • Preloader Style 05
  • Preloader Style 06
  • Preloader Style 07
  • Preloader Style 08
  • Preloader Style 09
  • Preloader Style 10
  • Preloader Style 11

Preloader Style 01:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="1">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 02:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="2">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 03:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="3">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 04:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="4">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 05:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="5">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 06:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="6">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 07:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="7">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 08:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="8">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 09:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="9">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 10:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="10">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

Preloader Style 11:

<!-- Preloader Start -->
<div class="preloader bg--color-0--b" data-preloader="img" data-preloader-img="img/preloader-img/preloader-surrounded.gif">
	<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->

News Ticker Options:

  • Direction Left
  • Direction Right
  • Direction Up
  • Direction Down
<!-- News Updates Bar Start -->
<div class="news-updates--bar" data-direction="left" data-duration="20000">
	<div class="title">
		<h2>News Updates</h2>
		<span>(Update 12 minutes ago)</span>
	</div>

	<div class="news-updates--list" data-marquee="true">
		<ul class="nav">
			<li>
				<h3 class="h3"><a href="#">Contrary to popular belief Lorem Ipsum is not simply random text.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Education to popular belief Lorem Ipsum is not simply</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Corporis repellendus perspiciatis reprehenderit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Deleniti consequatur laudantium sit aspernatur?</a></h3>
			</li>
		</ul>
	</div>
</div>
<!-- News Updates Bar End -->
<!-- News Updates Bar Start -->
<div class="news-updates--bar" data-direction="right" data-duration="8000">
	<div class="title">
		<h2>News Updates</h2>
		<span>(Update 12 minutes ago)</span>
	</div>

	<div class="news-updates--list" data-marquee="true">
		<ul class="nav">
			<li>
				<h3 class="h3"><a href="#">Contrary to popular belief Lorem Ipsum is not simply random text.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Education to popular belief Lorem Ipsum is not simply</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Corporis repellendus perspiciatis reprehenderit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Deleniti consequatur laudantium sit aspernatur?</a></h3>
			</li>
		</ul>
	</div>
</div>
<!-- News Updates Bar End -->
<!-- News Updates Bar Start -->
<div class="news-updates--bar" data-direction="up" data-duration="3000">
	<div class="title">
		<h2>News Updates</h2>
		<span>(Update 12 minutes ago)</span>
	</div>

	<div class="news-updates--list" data-marquee="true">
		<ul class="nav">
			<li>
				<h3 class="h3"><a href="#">Contrary to popular belief Lorem Ipsum is not simply random text.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Education to popular belief Lorem Ipsum is not simply</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Corporis repellendus perspiciatis reprehenderit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Deleniti consequatur laudantium sit aspernatur?</a></h3>
			</li>
		</ul>
	</div>
</div>
<!-- News Updates Bar End -->
<!-- News Updates Bar Start -->
<div class="news-updates--bar" data-direction="down" data-duration="2000">
	<div class="title">
		<h2>News Updates</h2>
		<span>(Update 12 minutes ago)</span>
	</div>

	<div class="news-updates--list" data-marquee="true">
		<ul class="nav">
			<li>
				<h3 class="h3"><a href="#">Contrary to popular belief Lorem Ipsum is not simply random text.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Education to popular belief Lorem Ipsum is not simply</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Corporis repellendus perspiciatis reprehenderit.</a></h3>
			</li>
			<li>
				<h3 class="h3"><a href="#">Deleniti consequatur laudantium sit aspernatur?</a></h3>
			</li>
		</ul>
	</div>
</div>
<!-- News Updates Bar End -->
  • Style 01
  • Style 02
  • Style 03
  • Style 04
  • Style 05

Post Filter Bar Style 01:

<!-- Posts Filter Bar Start -->
<div class="posts--filter-bar style--1 hidden-xs">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-star-o"></i>
				<span>Featured News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-heart-o"></i>
				<span>Most Popular</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-fire"></i>
				<span>Hot News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-flash"></i>
				<span>Trending News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-eye"></i>
				<span>Most Watched</span>
			</a>
		</li>
	</ul>
</div>
<!-- Posts Filter Bar End -->

Post Filter Bar Style 02:

<!-- Posts Filter Bar Start -->
<div class="posts--filter-bar style--2 hidden-xs">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-star-o"></i>
				<span>Featured News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-heart-o"></i>
				<span>Most Popular</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-fire"></i>
				<span>Hot News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-flash"></i>
				<span>Trending News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-eye"></i>
				<span>Most Watched</span>
			</a>
		</li>
	</ul>
</div>
<!-- Posts Filter Bar End -->

Post Filter Bar Style 03:

<!-- Posts Filter Bar Start -->
<div class="posts--filter-bar style--3 hidden-xs">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-star-o"></i>
				<span>Featured News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-heart-o"></i>
				<span>Most Popular</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-fire"></i>
				<span>Hot News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-flash"></i>
				<span>Trending News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-eye"></i>
				<span>Most Watched</span>
			</a>
		</li>
	</ul>
</div>
<!-- Posts Filter Bar End -->

Post Filter Bar Style 04:

<!-- Posts Filter Bar Start -->
<div class="posts--filter-bar style--4 hidden-xs">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-star-o"></i>
				<span>Featured News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-heart-o"></i>
				<span>Most Popular</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-fire"></i>
				<span>Hot News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-flash"></i>
				<span>Trending News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-eye"></i>
				<span>Most Watched</span>
			</a>
		</li>
	</ul>
</div>
<!-- Posts Filter Bar End -->

Post Filter Bar Style 05:

<!-- Posts Filter Bar Start -->
<div class="posts--filter-bar style--5 hidden-xs">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-star-o"></i>
				<span>Featured News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-heart-o"></i>
				<span>Most Popular</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-fire"></i>
				<span>Hot News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-flash"></i>
				<span>Trending News</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-eye"></i>
				<span>Most Watched</span>
			</a>
		</li>
	</ul>
</div>
<!-- Posts Filter Bar End -->

Post Layout Style 01:

<!-- Post Items Start -->
<div class="post--items post--items-1 pd--30-0">
	<div class="row gutter--15">
		<div class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1 post--title-larger">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/banner-01.jpg" alt=""></a>
					<a href="#" class="cat">Politics</a>
					<a href="#" class="icon"><i class="fa fa-flash"></i></a>

					<div class="post--map">
						<p class="btn-link"><i class="fa fa-map-o"></i>Location in Google Map</p>

						<div class="map--wrapper">
							<div data-map-latitude="23.790546" data-map-longitude="90.375583" data-map-zoom="6" data-map-marker="[[23.790546, 90.375583]]"></div>
						</div>
					</div>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Norma R. Hogan</a></li>
							<li><a href="#">20 April 2017</a></li>
						</ul>

						<div class="title">
							<h2 class="h4"><a href="news-single.html" class="btn-link">Siriyan civil war getting righteous indignation and dislike men who are so beguiled and demoralized by the sure.</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</div>

		<div class="col-md-6">
			<div class="row gutter--15">
				<div class="col-xs-6 col-xss-12">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-large">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/banner-02.jpg" alt=""></a>
							<a href="#" class="cat">Travel</a>
							<a href="#" class="icon"><i class="fa fa-flash"></i></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Corey I. Dean</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">Lorem Ipsum is simply dummy text of the printing</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>

				<div class="col-xs-6 hidden-xss">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-large">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/banner-03.jpg" alt=""></a>
							<a href="#" class="cat">Education</a>
							<a href="#" class="icon"><i class="fa fa-flash"></i></a>

							<div class="post--map">
								<p class="btn-link"><i class="fa fa-map-o"></i>Location in Google Map</p>

								<div class="map--wrapper">
									<div data-map-latitude="23.790546" data-map-longitude="90.375583" data-map-zoom="6" data-map-marker="[[23.790546, 90.375583]]"></div>
								</div>
							</div>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Leraje</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">Lorem Ipsum is simply dummy text of the printing</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>

				<div class="col-sm-12 hidden-sm hidden-xs">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-larger">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/banner-04.jpg" alt=""></a>
							<a href="#" class="cat">Politics</a>
							<a href="#" class="icon"><i class="fa fa-fire"></i></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Balam</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the sure.</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>
			</div>
		</div>
	</div>
</div>
<!-- Post Items End -->

Post Layout Style 02:

<!-- Post Items Start -->
<div class="post--items post--items-1 pd--30-0">
	<div class="row gutter--15">
		<div class="col-md-3">
			<div class="row gutter--15">
				<div class="col-md-12 col-xs-6 col-xxs-12">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-large">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/world-news-img/banner-01.jpg" alt=""></a>
							<a href="#" class="cat">Animal Planet</a>
							<a href="#" class="icon"><i class="fa fa-flash"></i></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Corey I. Dean</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">Lorem Ipsum is simply dummy text of the printing</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>

				<div class="col-md-12 col-xs-6 hidden-xxs">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-large">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/world-news-img/banner-02.jpg" alt=""></a>
							<a href="#" class="cat">Accident</a>
							<a href="#" class="icon"><i class="fa fa-support"></i></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Corey I. Dean</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">Lorem Ipsum is simply dummy text of the printing</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>
			</div>
		</div>

		<div class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1 post--title-larger">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/banner-03.jpg" alt=""></a>
					<a href="#" class="cat">Peace</a>
					<a href="#" class="icon"><i class="fa fa-star-o"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Norma R. Hogan</a></li>
							<li><a href="#">20 April 2017</a></li>
						</ul>

						<div class="title">
							<h2 class="h4"><a href="news-single.html" class="btn-link">Siriyan civil war getting righteous indignation and dislike men who are so beguiled and demoralized by the sure.</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</div>

		<div class="col-md-3">
			<div class="row gutter--15">
				<div class="col-md-12 col-xs-6 col-xxs-12">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-large">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/world-news-img/banner-04.jpg" alt=""></a>
							<a href="#" class="cat">Discover</a>
							<a href="#" class="icon"><i class="fa fa-flash"></i></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Leraje</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">Lorem Ipsum is simply dummy text of the printing</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>

				<div class="col-md-12 col-xs-6 hidden-xxs">
					<!-- Post Item Start -->
					<div class="post--item post--layout-1 post--title-large">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/world-news-img/banner-05.jpg" alt=""></a>
							<a href="#" class="cat">Education</a>
							<a href="#" class="icon"><i class="fa fa-book"></i></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Balam</a></li>
									<li><a href="#">20 April 2017</a></li>
								</ul>

								<div class="title">
									<h2 class="h4"><a href="news-single.html" class="btn-link">On the other hand, we denounce with righteous and deby</a></h2>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</div>
			</div>
		</div>
	</div>
</div>
<!-- Post Items End -->

Post Layout Style 03:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Worlds News</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_world_news_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_world_news_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-2" data-ajax-content="outer">
	<ul class="nav row gutter--15" data-ajax-content="inner">
		<li class="col-xs-12">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/world-news-01.jpg" alt=""></a>
					<a href="#" class="cat">War</a>
					<a href="#" class="icon"><i class="fa fa-flash"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">Siriya attaced by a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-xs-12">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>
		<li class="col-xs-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-2">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/world-news-02.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Hantu Raya</a></li>
							<li><a href="#">17 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will done</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-xs-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-2">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/world-news-03.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">17 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will done</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-xs-12">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>
		<li class="col-xs-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-2">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/world-news-04.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">17 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will done</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-xs-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-2">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/world-news-05.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Hantu Raya</a></li>
							<li><a href="#">17 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will done</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 04:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Latin America</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_latin_america_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_latin_america_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-2" data-ajax-content="outer">
	<ul class="nav" data-ajax-content="inner">
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/latin-america-01.jpg" alt=""></a>
					<a href="#" class="cat">Study Tour</a>
					<a href="#" class="icon"><i class="fa fa-flash"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">On the other hand, we denounce with righteous indignation and dislike demoralized</a></h3>
						</div>
					</div>
				</div>

				<div class="post--content">
					<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos mollitia animi, id est laborum et dolorum fuga.</p>
				</div>

				<div class="post--action">
					<a href="news-single.html">Continue Reading... </a>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li>
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/latin-america-02.jpg" alt=""></a>
					<a href="#" class="cat">Study Tour</a>
					<a href="#" class="icon"><i class="fa fa-flash"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Famous</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">On the other hand, we denounce with righteous indignation and dislike demoralized</a></h3>
						</div>
					</div>
				</div>

				<div class="post--content">
					<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos mollitia animi, id est laborum et dolorum fuga.</p>
				</div>

				<div class="post--action">
					<a href="news-single.html">Continue Reading... </a>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 05:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Technology</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_technology_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_technology_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-3" data-ajax-content="outer">
	<ul class="nav" data-ajax-content="inner">
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/technology-01.jpg" alt=""></a>
					<a href="#" class="cat">Computer</a>
					<a href="#" class="icon"><i class="fa fa-heart-o"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Bathin</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-3">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/technology-02.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Bune</a></li>
							<li><a href="#">16 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-3">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/technology-03.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Bune</a></li>
							<li><a href="#">16 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-3">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/technology-04.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Bune</a></li>
							<li><a href="#">16 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li>
			<!-- Post Item Start -->
			<div class="post--item post--layout-3">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/technology-05.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Bune</a></li>
							<li><a href="#">16 April 2017</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 06:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Finance</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_finance_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_finance_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-2" data-ajax-content="outer">
	<ul class="nav row" data-ajax-content="inner">
		<li class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-2">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/finance-01.jpg" alt=""></a>
					<a href="#" class="cat">Business</a>
					<a href="#" class="icon"><i class="fa fa-star-o"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Vassago</a></li>
							<li><a href="#">Today 03:30 am</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas.</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li class="col-md-6">
			<ul class="nav row">
				<li class="col-xs-12 hidden-md hidden-lg">
					<!-- Divider Start -->
					<hr class="divider">
					<!-- Divider End -->
				</li>

				<li class="col-xs-6">
					<!-- Post Item Start -->
					<div class="post--item post--layout-2">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/finance-02.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Zepar</a></li>
									<li><a href="#">Today 03:52 pm</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>

				<li class="col-xs-6">
					<!-- Post Item Start -->
					<div class="post--item post--layout-2">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/finance-03.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Demiurge</a></li>
									<li><a href="#">Today 03:02 pm</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>

				<li class="col-xs-12">
					<!-- Divider Start -->
					<hr class="divider">
					<!-- Divider End -->
				</li>

				<li class="col-xs-6">
					<!-- Post Item Start -->
					<div class="post--item post--layout-2">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/finance-04.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Demiurge</a></li>
									<li><a href="#">Today 02:05 am</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>

				<li class="col-xs-6">
					<!-- Post Item Start -->
					<div class="post--item post--layout-2">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/finance-05.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Zepar</a></li>
									<li><a href="#">Today 12:35 am</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
			</ul>
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 07:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Syrian News</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_syrian_news_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_syrian_news_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-2" data-ajax-content="outer">
	<ul class="nav row" data-ajax-content="inner">
		<li class="col-md-12">
			<!-- Post Item Start -->
			<div class="post--item">
				<div class="row">
					<div class="col-md-6">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/world-news-img/syria-01.jpg" alt=""></a>
							<a href="#" class="cat">War</a>
							<a href="#" class="icon"><i class="fa fa-star-o"></i></a>
						</div>
					</div>

					<div class="col-md-6">
						<div class="post--info">
							<ul class="nav meta">
								<li><a href="#">Vassago</a></li>
								<li><a href="#">Today 03:30 am</a></li>
							</ul>

							<div class="title">
								<h3 class="h4"><a href="news-single.html" class="btn-link">At vero eos et accusamus et iusto odio dignissimos uniti atque corrupti quos dolores et quas.</a></h3>
							</div>
						</div>

						<div class="post--content">
							<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos mollitia animi, id est laborum et dolorum fuga.</p>
						</div>

						<div class="post--action">
							<a href="news-single.html">Continue Reading...</a>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li class="col-md-12">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>

		<li class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-4">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/syria-02.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Demiurge</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li class="col-md-12 hidden-md hidden-lg">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>

		<li class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-4">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/syria-03.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Demiurge</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li class="col-md-12">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>

		<li class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-4">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/syria-04.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Demiurge</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li class="col-md-12 hidden-md hidden-lg">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>

		<li class="col-md-6">
			<!-- Post Item Start -->
			<div class="post--item post--layout-4">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/world-news-img/syria-05.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Demiurge</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 08:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Election</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_election_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_election_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-2" data-ajax-content="outer">
	<ul class="nav" data-ajax-content="inner">
		<li>
			<!-- Post Item Start -->
			<div class="post--item">
				<div class="row">
					<div class="col-md-6">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/national-img/election-01.jpg" alt=""></a>
							<a href="#" class="cat">News</a>
							<a href="#" class="icon"><i class="fa fa-star-o"></i></a>
						</div>
					</div>

					<div class="col-md-6">
						<div class="post--info">
							<ul class="nav meta">
								<li><a href="#">Vassago</a></li>
								<li><a href="#">Today 03:30 am</a></li>
							</ul>

							<div class="title">
								<h3 class="h4"><a href="#" class="btn-link">At vero eos et accusamus et iusto odio dignissimos uniti atque corrupti quos dolores et quas.</a></h3>
							</div>
						</div>

						<div class="post--content">
							<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos mollitia animi, id est laborum et dolorum fuga.</p>
						</div>

						<div class="post--action">
							<a href="news-single.html">Continue Reading...</a>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li>
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>

		<li>
			<!-- Post Item Start -->
			<div class="post--item">
				<div class="row">
					<div class="col-md-6">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/national-img/election-02.jpg" alt=""></a>
							<a href="#" class="cat">News</a>
							<a href="#" class="icon"><i class="fa fa-flash"></i></a>
						</div>
					</div>

					<div class="col-md-6">
						<div class="post--info">
							<ul class="nav meta">
								<li><a href="#">Vassago</a></li>
								<li><a href="#">Today 03:30 am</a></li>
							</ul>

							<div class="title">
								<h3 class="h4"><a href="news-single.html" class="btn-link">At vero eos et accusamus et iusto odio dignissimos uniti atque corrupti quos dolores et quas.</a></h3>
							</div>
						</div>

						<div class="post--content">
							<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos mollitia animi, id est laborum et dolorum fuga.</p>
						</div>

						<div class="post--action">
							<a href="news-single.html">Continue Reading...</a>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>

		<li>
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>

		<li>
			<!-- Post Item Start -->
			<div class="post--item">
				<div class="row">
					<div class="col-md-6">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/national-img/election-03.jpg" alt=""></a>
							<a href="#" class="cat">News</a>
							<a href="#" class="icon"><i class="fa fa-heart-o"></i></a>
						</div>
					</div>

					<div class="col-md-6">
						<div class="post--info">
							<ul class="nav meta">
								<li><a href="#">Vassago</a></li>
								<li><a href="#">Today 03:30 am</a></li>
							</ul>

							<div class="title">
								<h3 class="h4"><a href="news-single.html" class="btn-link">At vero eos et accusamus et iusto odio dignissimos uniti atque corrupti quos dolores et quas.</a></h3>
							</div>
						</div>

						<div class="post--content">
							<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos mollitia animi, id est laborum et dolorum fuga.</p>
						</div>

						<div class="post--action">
							<a href="news-single.html">Continue Reading...</a>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 09:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Audio & Videos</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_audio_video_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_audio_video_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-4" data-ajax-content="outer">
	<ul class="nav row" data-ajax-content="inner">
		<li class="col-md-8">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1 post--type-video post--title-large">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/audio-video-01.jpg" alt=""></a>
					<a href="#" class="cat">Wave</a>
					<a href="#" class="icon"><i class="fa fa-eye"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Succubus</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h2 class="h4"><a href="news-single.html" class="btn-link">Standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->

			<!-- Divider Start -->
			<hr class="divider hidden-md hidden-lg">
			<!-- Divider End -->
		</li>

		<li class="col-md-4">
			<ul class="nav">
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--type-audio post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/audio-video-02.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Maclaan John</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--type-video post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/audio-video-03.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Maclaan John</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--type-video post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/audio-video-04.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Maclaan John</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
				<li>
					<!-- Post Item Start -->
					<div class="post--item post--type-audio post--layout-3">
						<div class="post--img">
							<a href="news-single.html" class="thumb"><img src="img/home-img/audio-video-05.jpg" alt=""></a>

							<div class="post--info">
								<ul class="nav meta">
									<li><a href="#">Maclaan John</a></li>
									<li><a href="#">16 April 2017</a></li>
								</ul>

								<div class="title">
									<h3 class="h4"><a href="news-single.html" class="btn-link">Long established fact that a reader will be distracted by the readable</a></h3>
								</div>
							</div>
						</div>
					</div>
					<!-- Post Item End -->
				</li>
			</ul>
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 10:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Foods & Recipes</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_food_resturent_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_food_resturent_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items" data-ajax-content="outer">
	<ul class="nav row gutter--15" data-ajax-content="inner">
		<li class="col-md-4 col-xs-6 col-xxs-12">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/food-and-resturent-01.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-xs-12 hidden shown-xxs">
			<!-- Divider Start -->
			<hr class="divider">
			<!-- Divider End -->
		</li>
		<li class="col-md-4 col-xs-6 col-xxs-12">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/food-and-resturent-02.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-md-4 hidden-sm hidden-xs">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/food-and-resturent-03.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Yeasterday 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h3 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h3>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Post Layout Style 11:

<!-- Post Items Title Start -->
<div class="post--items-title" data-ajax="tab">
	<h2 class="h4">Photo Gallery</h2>

	<div class="nav">
		<a href="#" class="prev btn-link" data-ajax-action="load_prev_photo_gallery_posts">
			<i class="fa fa-long-arrow-left"></i>
		</a>

		<span class="divider">/</span>

		<a href="#" class="next btn-link" data-ajax-action="load_next_photo_gallery_posts">
			<i class="fa fa-long-arrow-right"></i>
		</a>
	</div>
</div>
<!-- Post Items Title End -->

<!-- Post Items Start -->
<div class="post--items post--items-1" data-ajax-content="outer">
	<ul class="nav row gutter--15" data-ajax-content="inner">
		<li class="col-md-12">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1 post--title-large">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/photo-gallery-01.jpg" alt=""></a>
					<a href="#" class="cat">Serfer</a>
					<a href="#" class="icon"><i class="fa fa-eye"></i></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Today 05:52 pm</a></li>
						</ul>

						<div class="title text-xxs-ellipsis">
							<h2 class="h4"><a href="news-single.html" class="btn-link">Standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-md-4 col-xs-6 col-xxs-12">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/photo-gallery-02.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h2 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-md-4 col-xs-6 col-xxs-12">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/photo-gallery-03.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h2 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
		<li class="col-md-4 hidden-sm hidden-xs">
			<!-- Post Item Start -->
			<div class="post--item post--layout-1">
				<div class="post--img">
					<a href="news-single.html" class="thumb"><img src="img/home-img/photo-gallery-04.jpg" alt=""></a>

					<div class="post--info">
						<ul class="nav meta">
							<li><a href="#">Astaroth</a></li>
							<li><a href="#">Today 03:52 pm</a></li>
						</ul>

						<div class="title">
							<h2 class="h4"><a href="news-single.html" class="btn-link">It is a long established fact that a reader will be distracted by</a></h2>
						</div>
					</div>
				</div>
			</div>
			<!-- Post Item End -->
		</li>
	</ul>

	<!-- Preloader Start -->
	<div class="preloader bg--color-0--b" data-preloader="1">
		<div class="preloader--inner"></div>
	</div>
	<!-- Preloader End -->
</div>
<!-- Post Items End -->

Pricing Image Styles:

  • Style 01
  • Style 02
  • Style 03
  • Style 04
<!-- Pricing Image Start -->
<div class="pricing--img layout--1">
	<img src="img/pricing-img/01.jpg" alt="" class="center-block">
</div>
<!-- Pricing Image End -->
<!-- Pricing Image Start -->
<div class="pricing--img layout--2">
	<img src="img/pricing-img/01.jpg" alt="" class="center-block">
	<img src="img/pricing-img/01-small-top.jpg" alt="" class="center-block">
	<img src="img/pricing-img/01-small-bottom.jpg" alt="" class="center-block">
</div>
<!-- Pricing Image End -->
<!-- Pricing Image Start -->
<div class="pricing--img layout--3">
	<div class="row gutter--20 row--md-vc">
		<div class="col-xs-6">
			<img src="img/pricing-img/02-left.jpg" alt="" class="center-block">
		</div>

		<div class="col-xs-6">
			<img src="img/pricing-img/02-right-top.jpg" alt="" class="center-block">
			<img src="img/pricing-img/02-right-bottom.jpg" alt="" class="center-block">
		</div>
	</div>
</div>
<!-- Pricing Image End -->
<!-- Pricing Image Start -->
<div class="pricing--img layout--4">
	<img src="img/pricing-img/03.jpg" alt="" class="center-block">
	<img src="img/pricing-img/03-top-left.jpg" alt="" class="center-block">
	<img src="img/pricing-img/03-top-right.jpg" alt="" class="center-block">
	<img src="img/pricing-img/03-bottom-right.jpg" alt="" class="center-block">
	<img src="img/pricing-img/03-bottom-center.jpg" alt="" class="center-block">
</div>
<!-- Pricing Image End -->

Contributor Styles:

  • Style 01
  • Style 02
  • Style 03
  • Style 04
<!-- Contributor Item Start -->
<div class="contributor--item style--1">
	<div class="img">
		<img src="img/contributors-img/avatar-01.jpg" alt="">
	</div>

	<div class="name">
		<h3 class="h4">Karla Gleichauf</h3>
	</div>

	<div class="desc">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
	</div>

	<ul class="social nav">
		<li><a href="#"><i class="fa fa-facebook"></i></a></li>
		<li><a href="#"><i class="fa fa-twitter"></i></a></li>
		<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
		<li><a href="#"><i class="fa fa-rss"></i></a></li>
	</ul>

	<div class="action">
		<a href="author.html" class="btn btn-default">Author Posts</a>
	</div>
</div>
<!-- Contributor Item End -->
<!-- Contributor Item Start -->
<div class="contributor--item style--2">
	<div class="img">
		<img src="img/contributors-img/avatar-09.jpg" alt="">

		<ul class="social nav bg--color-1--b">
			<li><a href="#"><i class="fa fa-facebook"></i></a></li>
			<li><a href="#"><i class="fa fa-twitter"></i></a></li>
			<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
			<li><a href="#"><i class="fa fa-rss"></i></a></li>
		</ul>
	</div>

	<div class="name">
		<h3 class="h4">Mary Schneider</h3>
	</div>

	<div class="desc">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
	</div>

	<div class="action">
		<a href="author.html" class="btn btn-default">Author Posts</a>
	</div>
</div>
<!-- Contributor Item End -->
<!-- Contributor Item Start -->
<div class="contributor--item style--3">
	<div class="img">
		<img src="img/contributors-img/avatar-09.jpg" alt="">
	</div>

	<div class="info bg--color-1 bd--color-1">
		<div class="name">
			<h3 class="h4">Karla Gleichauf</h3>
		</div>

		<div class="desc">
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
		</div>

		<ul class="social nav">
			<li><a href="#"><i class="fa fa-facebook"></i></a></li>
			<li><a href="#"><i class="fa fa-twitter"></i></a></li>
			<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
			<li><a href="#"><i class="fa fa-rss"></i></a></li>
		</ul>

		<div class="action">
			<a href="author.html" class="btn btn-default">Author Posts</a>
		</div>
	</div>
</div>
<!-- Contributor Item End -->
<!-- Contributor Item Start -->
<div class="contributor--item style--4">
	<div class="img">
		<img src="img/contributors-img/avatar-09.jpg" alt="">
	</div>

	<div class="info">
		<div class="vc--parent">
			<div class="vc--child">
				<div class="name">
					<h3 class="h4">Mary Schneider</h3>
				</div>

				<div class="desc">
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
				</div>

				<ul class="social nav">
					<li><a href="#"><i class="fa fa-facebook"></i></a></li>
					<li><a href="#"><i class="fa fa-twitter"></i></a></li>
					<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
					<li><a href="#"><i class="fa fa-rss"></i></a></li>
				</ul>

				<div class="action">
					<a href="author.html" class="btn btn-default">Author Posts</a>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- Contributor Item End -->

Sticky Social Options:

  • Left
  • Right
<!-- Sticky Social Start -->
<div id="stickySocial" class="sticky--left">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-facebook"></i>
				<span>Follow Us On Facebook</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-twitter"></i>
				<span>Follow Us On Twitter</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-google-plus"></i>
				<span>Follow Us On Google Plus</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-rss"></i>
				<span>Follow Us On RSS</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-vimeo"></i>
				<span>Follow Us On Vimeo</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-youtube-play"></i>
				<span>Follow Us On Youtube Play</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-linkedin"></i>
				<span>Follow Us On LinkedIn</span>
			</a>
		</li>
	</ul>
</div>
<!-- Sticky Social End -->
<!-- Sticky Social Start -->
<div id="stickySocial" class="sticky--right">
	<ul class="nav">
		<li>
			<a href="#">
				<i class="fa fa-facebook"></i>
				<span>Follow Us On Facebook</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-twitter"></i>
				<span>Follow Us On Twitter</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-google-plus"></i>
				<span>Follow Us On Google Plus</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-rss"></i>
				<span>Follow Us On RSS</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-vimeo"></i>
				<span>Follow Us On Vimeo</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-youtube-play"></i>
				<span>Follow Us On Youtube Play</span>
			</a>
		</li>
		<li>
			<a href="#">
				<i class="fa fa-linkedin"></i>
				<span>Follow Us On LinkedIn</span>
			</a>
		</li>
	</ul>
</div>
<!-- Sticky Social End -->

Photo Credits:

Fonts Used:

Frameworks / Libraries:

Plugins Used:

09 September, 2017 - Version 1.1 (Changelog)

// # List of updates
// ------------------------------

*. Fixed Scroll Social Menu Overlapping Content On Mobile/Small Devices