blog.html

<!DOCTYPE html>
<html>
	<head>
		<title>Blog</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<meta name="format-detection" content="telephone=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<!-- Fonts-->
		<link rel="stylesheet" type="text/css" href="assets/fonts/fontawesome/font-awesome.min.css">
		<link rel="stylesheet" type="text/css" href="assets/fonts/themify-icons/themify-icons.css">
		<!-- Vendors-->
		<link rel="stylesheet" type="text/css" href="assets/vendors/bootstrap4/bootstrap-grid.min.css">
		<link rel="stylesheet" type="text/css" href="assets/vendors/magnific-popup/magnific-popup.min.css">
		<link rel="stylesheet" type="text/css" href="assets/vendors/owl.carousel/owl.carousel.css">
		<!-- App & fonts-->
		<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i&amp;amp;subset=latin-ext">
		<link rel="stylesheet" type="text/css" href="assets/css/main.css"><!--[if lt IE 9]>
			<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
		<![endif]-->
	</head>
	
	<body>
		<div class="page-wrap">
			
			<!-- header -->
			<header class="header">
				<div class="container">
					<div class="header__logo"><a href="index.html"><img src="assets/img/logo.png" alt=""/></a></div>
					<div class="header__toogleGroup">
						<div class="header__chooseLanguage">
										
										<!-- dropdown -->
										<div class="dropdown" data-init="dropdown"><a class="dropdown__toggle" href="javascript:void(0)">EN <i class="fa fa-angle-down" aria-hidden="true"></i></a>
											<div class="dropdown__content" data-position="right">
												<ul class="list-style-none">
													<li><a href="#">EN</a></li>
													<li><a href="#">DE</a></li>
													<li><a href="#">VI</a></li>
												</ul>
											</div>
										</div><!-- End / dropdown -->
										
						</div>
						<div class="search-form">
							<div class="search-form__toggle"><i class="ti-search"></i></div>
							<div class="search-form__form">
												
												<!-- form-search -->
												<div class="form-search">
													<form>
														<input class="form-control" type="text" placeholder="Hit enter to search or ESC to close"/>
													</form>
												</div><!-- End / form-search -->
												
							</div>
						</div>
					</div>
					
					<!-- consult-nav -->
					<nav class="consult-nav">
						
						<!-- consult-menu -->
						<ul class="consult-menu">
							<li><a href="index.html">Home</a>
							</li>
							<li><a href="about.html">about</a>
							</li>
							<li class="menu-item-has-children"><a href="#">page</a>
								<ul class="sub-menu">
									<li><a href="comming-soon.html">Comming Soon</a>
									</li>
									<li><a href="404.html">404</a>
									</li>
									<li><a href="typography.html">Typography</a>
									</li>
								</ul>
							</li>
							<li><a href="service.html">services</a>
							</li>
							<li class="menu-item-has-children"><a href="project.html">project</a>
								<ul class="sub-menu">
									<li><a href="project-detail.html">Project detail</a>
									</li>
								</ul>
							</li>
							<li class="menu-item-has-children current-menu-item"><a href="blog.html">blog</a>
								<ul class="sub-menu">
									<li><a href="blog-detail.html">Blog detail</a>
									</li>
								</ul>
							</li>
							<li><a href="contact.html">contact</a>
							</li>
						</ul><!-- consult-menu -->
						
						<div class="navbar-toggle"><span></span><span></span><span></span></div>
					</nav><!-- End / consult-nav -->
					
				</div>
			</header><!-- End / header -->
			
			<!-- Content-->
			<div class="md-content">
				
				<!-- page-title -->
				<div class="page-title">
					<div class="container">
						<div class="row">
							<div class="col-lg-8 offset-0 offset-sm-0 offset-md-0 offset-lg-2 ">
								<h2 class="page-title__title">Our blog</h2>
								
								<!--  -->
								<nav><a class="breadcrumb__item" href="#">Home</a><span class="breadcrumb__item active">Blog</span>
								</nav><!-- End /  -->
								
							</div>
						</div>
					</div>
				</div><!-- End / page-title -->
				
				
				<!-- Section -->
				<section class="md-section">
					<div class="container">
						
						<!-- layout-blog sidebar-left -->
						<div class="layout-blog sidebar-left">
							<div class="layout-blog__content">
								
								<!--  -->
								<div class="post-01__style-02 md-text-center">
									<div class="post-01__media"><a href="blog-detail.html"><img src="assets/img/blogs/1.jpg" alt=""/></a>
									</div>
									<div>
										<ul class="post-01__categories">
											<li><a href="#">Business</a></li>
										</ul>
										<h2 class="post-01__title"><a href="blog-detail.html">How To Build A Better Website</a></h2>
										<div class="post-01__time">Nov 20, 2017</div>
										<div class="post-01__note">by Alice Brooks</div>
									</div>
								</div><!-- End /  -->
								
								
								<!--  -->
								<div class="post-01__style-02 md-text-center">
									<div class="post-01__media">
											
											<!-- video -->
											<div class="video" data-init="video">
												<iframe src="https://www.youtube.com/embed/pX6nutvtDnI" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
												<div class="video-content">
													<div class="video-background" style="background-image: url(assets/img/blogs/2.jpg);"></div>
													<div class="video-inner">
														<div class="video-button"><i class="fa fa-play"></i></div>
													</div>
												</div>
											</div><!-- End / video -->
											
									</div>
									<div>
										<ul class="post-01__categories">
											<li><a href="#">Services</a></li>
										</ul>
										<h2 class="post-01__title"><a href="blog-detail.html">Design a Perfect Homepage</a></h2>
										<div class="post-01__time">Oct 28, 2017</div>
										<div class="post-01__note">by Cynthia Aguilar</div>
									</div>
								</div><!-- End /  -->
								
								
								<!--  -->
								<div class="post-01__style-02 md-text-center">
									<div class="post-01__media">
										<div><iframe width="100%" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/308178330&amp;color=%23ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;show_teaser=true&amp;visual=true"></iframe></div>
									</div>
									<div>
										<ul class="post-01__categories">
											<li><a href="#">Business</a></li>
										</ul>
										<h2 class="post-01__title"><a href="blog-detail.html">How to Create and Manage SVG Sprites</a></h2>
										<div class="post-01__time">Oct 28, 2017</div>
										<div class="post-01__note">by Brandon Hanson</div>
									</div>
								</div><!-- End /  -->
								
								
								<!--  -->
								<div class="post-01__style-02 md-text-center">
									<div class="post-01__media">
										
										<!-- carousel__element owl-carousel -->
										<div class="carousel__element owl-carousel" data-options="{items: 1, loop: true, nav: true, dots: false}">
											<div><img src="http://unsplash.it/400/300" alt=""/></div>
											<div><img src="http://unsplash.it/400/300" alt=""/></div>
										</div><!-- End / carousel__element owl-carousel -->
										
									</div>
									<div>
										<ul class="post-01__categories">
											<li><a href="#">Services</a></li>
										</ul>
										<h2 class="post-01__title"><a href="blog-detail.html">Getting Started with Vue.Js</a></h2>
										<div class="post-01__time">Oct 26, 2017</div>
										<div class="post-01__note">by Jose Snyder</div>
									</div>
								</div><!-- End /  -->
								
								
								<!-- pagination -->
								<ul class="pagination"><a class="pagination__item" href="#">1</a><a class="pagination__item" href="#">2</a><a class="pagination__item" href="#">3</a><span class="pagination__item active">4</span>
								</ul><!-- End / pagination -->
								
							</div>
							<aside class="layout-blog__sidebar">
									
									<!--  -->
									<div>
										
										<!-- widget-text__widget -->
										<section class="widget-text__widget widget-text__style-02 widget">
											<h3 class="widget-title">Search</h3>
											<div class="widget-text__content">
												
												<!-- form-search -->
												<div class="form-search">
													<form>
														<input class="form-control" type="text" placeholder="Type and Hit Enter..."/>
													</form>
												</div><!-- End / form-search -->
												
											</div>
										</section><!-- End / widget-text__widget -->
										
										
										<!-- widget-text__widget -->
										<section class="widget-text__widget widget-text__style-02 widget">
											<h3 class="widget-title">categories</h3>
											<div class="widget-text__content">
												<ul>
													<li><a href="#">Accounting</a></li>
													<li><a href="#">Budgets</a></li>
													<li><a href="#">Business</a></li>
													<li><a href="#">Business Plans</a></li>
													<li><a href="#">Commodities</a></li>
													<li><a href="#">Insurance</a></li>
												</ul>
											</div>
										</section><!-- End / widget-text__widget -->
										
										
										<!-- widget-text__widget -->
										<section class="widget-text__widget widget-text__style-04 widget">
											<h3 class="widget-title">recent post</h3>
											<div class="widget-text__content">
												
												<!--  -->
												<div class="post-01__style-03">
													<div>
														<h2 class="post-01__title"><a href="#">Design a Perfect Homepage</a></h2>
														<div class="post-01__time">Oct 26, 2017</div>
														<div class="post-01__note">by Alice Brooks</div>
													</div>
												</div><!-- End /  -->
												
												
												<!--  -->
												<div class="post-01__style-03">
													<div>
														<h2 class="post-01__title"><a href="#">How to Master Microcopy</a></h2>
														<div class="post-01__time">Oct 28, 2017</div>
														<div class="post-01__note">by Ann Fowler</div>
													</div>
												</div><!-- End /  -->
												
												
												<!--  -->
												<div class="post-01__style-03">
													<div>
														<h2 class="post-01__title"><a href="#">How to Master Microcopy</a></h2>
														<div class="post-01__time">Oct 10, 2017</div>
														<div class="post-01__note">by Brandon Hanson</div>
													</div>
												</div><!-- End /  -->
												
												
												<!--  -->
												<div class="post-01__style-03">
													<div>
														<h2 class="post-01__title"><a href="#">Design a Perfect Homepage</a></h2>
														<div class="post-01__time">Oct 19, 2017</div>
														<div class="post-01__note">by Brandon Hanson</div>
													</div>
												</div><!-- End /  -->
												
											</div>
										</section><!-- End / widget-text__widget -->
										
										
										<!-- widget-text__widget -->
										<section class="widget-text__widget widget">
											<h3 class="widget-title">popular tags</h3>
											<div class="widget-text__content">
												
												<!-- tagclould -->
												<div class="tagclould"><a href="#">Accounting</a><a href="#">Budgets</a><a href="#">Business</a><a href="#">Business</a><a href="#">Plans</a><a href="#">Commodities</a><a href="#">Insurance</a><a href="#">Consulting</a>
												</div><!-- End /  tagclould -->
												
											</div>
										</section><!-- End / widget-text__widget -->
										
										
										<!-- widget-text__widget -->
										<section class="widget-text__widget widget-text__style-03 widget">
											<h3 class="widget-title">Archieves</h3>
											<div class="widget-text__content">
												<ul>
													<li><a href="#">June  2017</a></li>
													<li><a href="#">November  2017</a></li>
													<li><a href="#">March  2017</a></li>
													<li><a href="#">July 2017</a></li>
												</ul>
											</div>
										</section><!-- End / widget-text__widget -->
										
									</div><!-- End /  -->
									
							</aside>
						</div><!-- End / layout-blog sidebar-left -->
						
					</div>
				</section>
				<!-- End / Section -->
				
			</div>
			<!-- End / Content-->
			
			<!-- footer -->
			<footer class="footer">
				<div class="footer__main">
					<div class="row row-eq-height">
						<div class="col-8 col-sm-7 col-md-9 col-lg-3 ">
							<div class="footer__item"><a class="consult_logo" href="#"><img src="assets/img/logo.png" alt=""/></a>
								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut laoreet ut lacus a tincidunt.</p>
							</div>
						</div>
						<div class="col-sm-6 col-md-4 col-lg-3 col-xl-2 offset-0 offset-sm-0 offset-md-0 offset-lg-0 offset-xl-1 ">
							<div class="footer__item">
									
									<!-- widget-text__widget -->
									<section class="widget-text__widget widget">
										<div class="widget-text__content">
											<ul>
												<li><a href="#">Term of Services </a></li>
												<li><a href="#">Privacy Policy </a></li>
												<li><a href="#">Sitemap </a></li>
												<li><a href="#">Help</a></li>
											</ul>
										</div>
									</section><!-- End / widget-text__widget -->
									
							</div>
						</div>
						<div class="col-sm-6 col-md-4 col-lg-2 col-xl-2 ">
							<div class="footer__item">
									
									<!-- widget-text__widget -->
									<section class="widget-text__widget widget">
										<div class="widget-text__content">
											<ul>
												<li><a href="#">How It Work </a></li>
												<li><a href="#">Carrier </a></li>
												<li><a href="#">Pricing </a></li>
												<li><a href="#">Support</a></li>
											</ul>
										</div>
									</section><!-- End / widget-text__widget -->
									
							</div>
						</div>
						<div class="col-md-4 col-lg-2 col-xl-2 ">
							<div class="footer__item">
									
									<!-- form-sub -->
									<div class="form-sub">
										<h4 class="form-sub__title">Our Newsletter</h4>
										<form class="form-sub__form">
											<div class="form-item">
												<input class="form-control" type="email" placeholder="Enter Your Email Address..."/>
											</div>
											<div class="form-submit">
												<button class="form-button" type="submit"><i class="fa fa-paper-plane" aria-hidden="true"></i></button>
											</div>
										</form>
									</div><!-- End / form-sub -->
									
							</div>
						</div>
						<div class="col-sm-6 col-md-4 col-lg-2 col-xl-2  consult_backToTop">
							<div class="footer__item"><a href="#" id="back-to-top"> <i class="fa fa-angle-up" aria-hidden="true"> </i><span>Back To Top</span></a></div>
						</div>
					</div>
				</div>
				<div class="footer__copyright">2017 &copy; Copyright Awe7. All rights Reserved.</div>
			</footer><!-- End / footer -->
			
		</div>
		<!-- Vendors-->
		<script type="text/javascript" src="assets/vendors/jquery/jquery.min.js"></script>
		<script type="text/javascript" src="assets/vendors/imagesloaded/imagesloaded.pkgd.js"></script>
		<script type="text/javascript" src="assets/vendors/isotope-layout/isotope.pkgd.js"></script>
		<script type="text/javascript" src="assets/vendors/jquery.countdown/jquery.countdown.min.js"></script>
		<script type="text/javascript" src="assets/vendors/jquery.countTo/jquery.countTo.min.js"></script>
		<script type="text/javascript" src="assets/vendors/jquery.countUp/jquery.countup.min.js"></script>
		<script type="text/javascript" src="assets/vendors/jquery.matchHeight/jquery.matchHeight.min.js"></script>
		<script type="text/javascript" src="assets/vendors/jquery.mb.ytplayer/jquery.mb.YTPlayer.min.js"></script>
		<script type="text/javascript" src="assets/vendors/magnific-popup/jquery.magnific-popup.min.js"></script>
		<script type="text/javascript" src="assets/vendors/masonry-layout/masonry.pkgd.js"></script>
		<script type="text/javascript" src="assets/vendors/owl.carousel/owl.carousel.js"></script>
		<script type="text/javascript" src="assets/vendors/jquery.waypoints/jquery.waypoints.min.js"></script>
		<script type="text/javascript" src="assets/vendors/menu/menu.min.js"></script>
		<script type="text/javascript" src="assets/vendors/smoothscroll/SmoothScroll.min.js"></script>
		<!-- App-->
		<script type="text/javascript" src="assets/js/main.js"></script>
	</body>
</html>