<!DOCTYPE html>
<html lang="zxx">
<head>
<meta charset="UTF-8">
<meta name="description" content="Hazze Template">
<meta name="keywords" content="Hazze, unica, creative, html">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Hazze | Template</title>
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css?family=Libre+Franklin:400,500,600,700,800,900&display=swap"
rel="stylesheet">
<!-- Css Styles -->
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="css/themify-icons.css" type="text/css">
<link rel="stylesheet" href="css/owl.carousel.min.css" type="text/css">
<link rel="stylesheet" href="css/magnific-popup.css" type="text/css">
<link rel="stylesheet" href="css/slicknav.min.css" type="text/css">
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<!-- Page Preloder -->
<div id="preloder">
<div class="loader"></div>
</div>
<!-- Header Section Begin -->
<header class="header-section">
<div class="container">
<div class="row">
<div class="col-lg-2 col-md-2">
<div class="logo">
<a href="#">
<img src="img/logo.png" alt="">
</a>
</div>
</div>
<div class="col-lg-10 col-md-10">
<div class="main-menu mobile-menu">
<ul>
<li class="active"><a href="./index.html">Home</a></li>
<li><a href="./about-us.html">About Us</a></li>
<li><a href="./blog.html">Blog</a></li>
<li><a href="./gallery.html">Gallery</a>
<ul class="dropdown">
<li><a href="#">Naoh</a></li>
<li><a href="#">Padis</a></li>
<li><a href="#">Jacob</a></li>
<li><a href="#">Gomez</a></li>
</ul>
</li>
<li><a href="./contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
<div id="mobile-menu-wrap"></div>
</div>
</header>
<!-- Header End -->
<!-- Hero Section Begin -->
<section class="hero-section set-bg" data-setbg="img/hero-bg.jpg">
<div class="container">
<div class="row">
<div class="col-lg-5">
<div class="hs-text">
<span>Office Fashion</span>
<h2>New Fashion</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua.</p>
<a href="#" class="primary-btn">Read More</a>
</div>
</div>
</div>
</div>
</section>
<!-- Hero Section End -->
<!-- About Us Section Begin -->
<section class="about-us-section spad">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="as-pic">
<img src="img/about-us.jpg" alt="">
</div>
</div>
<div class="col-lg-6">
<div class="as-text">
<div class="section-title">
<span>About us</span>
<h2>About Story</h2>
</div>
<p class="f-para">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. </p>
<p class="s-para">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
<a href="#" class="primary-btn">Read More</a>
</div>
</div>
</div>
</div>
</section>
<!-- About Us Section End -->
<!-- Services Section Begin -->
<section class="services-section spad">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title">
<span>Our Services</span>
<h2>Best Services Save The World</h2>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="service-item">
<img src="img/services/service-1.png" alt="">
<h4>Modern Design</h4>
<p>Brook embraces a modern look with various enhanced pre-defined page elements.</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="service-item">
<img src="img/services/service-2.png" alt="">
<h4>Content</h4>
<p>Brook embraces a modern look with various enhanced pre-defined page elements.</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="service-item">
<img src="img/services/service-3.png" alt="">
<h4>Make Up</h4>
<p>Brook embraces a modern look with various enhanced pre-defined page elements.</p>
</div>
</div>
</div>
</div>
</section>
<!-- Services Section End -->
<!-- Portfolio Section Begin -->
<section class="portfolio-section spad">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title">
<span>Our Portfolio</span>
<h2>Turn Your Dream Into Reality</h2>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="portfolio-item set-bg large-item" data-setbg="img/portfolio/portfolio-1.jpg">
<div class="pi-hover">
<a href="#" class="chain-icon"><i class="fa fa-chain"></i></a>
<a href="img/portfolio/portfolio-1.jpg" class="search-icon image-popup"><i
class="fa fa-search"></i></a>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="portfolio-item set-bg" data-setbg="img/portfolio/portfolio-2.jpg">
<div class="pi-hover">
<a href="#" class="chain-icon"><i class="fa fa-chain"></i></a>
<a href="img/portfolio/portfolio-2.jpg" class="search-icon image-popup"><i
class="fa fa-search"></i></a>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="portfolio-item set-bg" data-setbg="img/portfolio/portfolio-3.jpg">
<div class="pi-hover">
<a href="#" class="chain-icon"><i class="fa fa-chain"></i></a>
<a href="img/portfolio/portfolio-3.jpg" class="search-icon image-popup"><i
class="fa fa-search"></i></a>
</div>
</div>
</div>
<div class="col-md-6">
<div class="portfolio-item set-bg" data-setbg="img/portfolio/portfolio-4.jpg">
<div class="pi-hover">
<a href="#" class="chain-icon"><i class="fa fa-chain"></i></a>
<a href="img/portfolio/portfolio-4.jpg" class="search-icon image-popup"><i
class="fa fa-search"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Portfolio Section End -->
<!-- Counter Section Begin -->
<section class="counter-section spad">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="counter-text">
<div class="section-title">
<span>Number Speaks</span>
<h2>We have a lot of <br />experience</h2>
</div>
<a href="#" class="primary-btn">Read More</a>
</div>
</div>
<div class="col-lg-6">
<div class="counter-item">
<div class="ci-number count">
2034
</div>
<div class="ci-text">
<h4>Successful projects</h4>
<p>Since its establishment in 2005, Fashion has been focusing on project management &
implementation through cooperation.</p>
</div>
</div>
<div class="counter-item">
<div class="ci-number count">
1054
</div>
<div class="ci-text">
<h4>Events</h4>
<p>Since its establishment in 2005, Fashion has been focusing on project management &
implementation through cooperation.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Counter Section End -->
<!-- Testimonial Section Begin -->
<section class="testimonial-section spad">
<div class="container">
<div class="row testimonial-slider owl-carousel">
<div class="col-lg-6">
<div class="testimonial-item">
<div class="ti-pic">
<img src="img/testimonial/testimonial-1.jpg" alt="">
</div>
<div class="ti-text">
<div class="ti-title">
<h4>Travis Crawford</h4>
<span>Designer</span>
</div>
<p>Adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem.</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="testimonial-item">
<div class="ti-pic">
<img src="img/testimonial/testimonial-2.jpg" alt="">
</div>
<div class="ti-text">
<div class="ti-title">
<h4>Noah Padilla</h4>
<span>Designer</span>
</div>
<p>Adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem.</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="testimonial-item">
<div class="ti-pic">
<img src="img/testimonial/testimonial-3.jpg" alt="">
</div>
<div class="ti-text">
<div class="ti-title">
<h4>Noah Padilla</h4>
<span>Designer</span>
</div>
<p>Adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem.</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="testimonial-item">
<div class="ti-pic">
<img src="img/testimonial/testimonial-4.jpg" alt="">
</div>
<div class="ti-text">
<div class="ti-title">
<h4>Noah Padilla</h4>
<span>Designer</span>
</div>
<p>Adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Testimonial Section End -->
<!-- Call To Action Section Begin -->
<section class="callto-section set-bg" data-setbg="img/ctc-bg.jpg">
<div class="container">
<div class="row">
<div class="col-lg-10 m-auto">
<div class="ctc-text">
<h2>We Create Trends For The World</h2>
<p>Donec faucibus consequat ante. Mauris eget mi sed ex efficitur porta id non quam. Cras
aliquam turpis tellus, quis laoreet lacus congue sed. Nullam at est quis urna vestibulum
interdum. Praesent auctor leo ut massa ultrices tempor.</p>
<a href="#" class="primary-btn ctc-btn">Work With Us</a>
</div>
</div>
</div>
</div>
</section>
<!-- Call To Action Section End -->
<!-- Member Section Begin -->
<section class="member-section spad">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title">
<span>Our Team</span>
<h2>Top Designers</h2>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="member-item set-bg" data-setbg="img/member/member-1.jpg">
<div class="mi-text">
<p>Quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora
incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
<div class="mt-title">
<h4>Jacob Gomez</h4>
<span>Designer</span>
</div>
<div class="mt-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-pinterest"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="member-item set-bg" data-setbg="img/member/member-2.jpg">
<div class="mi-text">
<p>Quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora
incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
<div class="mt-title">
<h4>Jacob Gomez</h4>
<span>Designer</span>
</div>
<div class="mt-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-pinterest"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="member-item set-bg" data-setbg="img/member/member-3.jpg">
<div class="mi-text">
<p>Quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora
incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
<div class="mt-title">
<h4>Jacob Gomez</h4>
<span>Designer</span>
</div>
<div class="mt-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-pinterest"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Member Section End -->
<!-- Blog Section Begin -->
<div class="blog-section latest-blog spad">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title">
<span>Latest Blog</span>
<h2>From Our Blog</h2>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="blog-item">
<div class="row">
<div class="col-lg-6">
<div class="bi-pic set-bg" data-setbg="img/blog/blog-1.jpg"></div>
</div>
<div class="col-lg-6">
<div class="bi-text">
<ul>
<li><i class="fa fa-calendar-o"></i> August 9, 2019</li>
<li><i class="fa fa-commenting-o"></i> 0</li>
</ul>
<h4><a href="#">Every Single Way You Can Wear Pastel Makeup This Spring</a></h4>
<p>Never ever think of giving up. Winners never quit and</p>
<div class="bt-author">
<div class="ba-pic">
<img src="img/blog/author-1.jpg" alt="">
</div>
<div class="ba-text">
<h5>Jeff Rodriguez</h5>
<span>Designer</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="blog-item">
<div class="row">
<div class="col-lg-6">
<div class="bi-pic set-bg" data-setbg="img/blog/blog-2.jpg"></div>
</div>
<div class="col-lg-6">
<div class="bi-text">
<ul>
<li><i class="fa fa-calendar-o"></i> August 9, 2019</li>
<li><i class="fa fa-commenting-o"></i> 0</li>
</ul>
<h4><a href="#">Everything Coming to Netflix Canada in May 2019</a></h4>
<p>Never ever think of giving up. Winners never quit and</p>
<div class="bt-author">
<div class="ba-pic">
<img src="img/blog/author-1.jpg" alt="">
</div>
<div class="ba-text">
<h5>Aaron Russell</h5>
<span>Content</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Blog Section End -->
<!-- Footer Section Begin -->
<section class="footer-section">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="footer-option">
<div class="fo-logo">
<a href="#">
<img src="img/logo.png" alt="">
</a>
</div>
<ul>
<li>Address: 60-49 Road 11378 New York</li>
<li>Phone: +65 11.188.888</li>
<li>Email: hello.colorlib@gmail.com</li>
</ul>
<div class="fo-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-pinterest"></i></a>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="footer-widget fw-links">
<h5>Useful Links</h5>
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">Model</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Serivius</a></li>
</ul>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="footer-widget">
<h5>Join The Newsletter</h5>
<p>Get E-mail updates about our latest shop and special offers.</p>
<form action="#" class="news-form">
<input type="text" placeholder="Enter your mail">
<button type="submit">Subscribe</button>
</form>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="footer-widget">
<h5>Instagram</h5>
<div class="insta-pic">
<img src="img/instagram/instagram-1.jpg" alt="">
<img src="img/instagram/instagram-2.jpg" alt="">
<img src="img/instagram/instagram-3.jpg" alt="">
<img src="img/instagram/instagram-4.jpg" alt="">
<img src="img/instagram/instagram-5.jpg" alt="">
<img src="img/instagram/instagram-6.jpg" alt="">
</div>
</div>
</div>
</div>
<div class="copyright-text"><p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="ti-heart" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p></div>
</div>
</section>
<!-- Footer Section End -->
<!-- Js Plugins -->
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/mixitup.min.js"></script>
<script src="js/jquery.slicknav.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>