<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MiqoAgencyDemo</title>
<link href="https://fonts.googleapis.com/css?family=Nunito%7cPoppins:300,400,500,600,700&display=swap"
rel="stylesheet">
<link media="all" rel="stylesheet" href="style.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" defer></script>
<script>window.jQuery || document.write('<script src="js/jquery-3.3.1.min.js" defer><\/script>')</script>
<script src="js/jquery.main.js" defer></script>
<meta name="robots" content="noindex">
</head>
<body>
<div id="wrapper">
<header id="header" class="header">
<div class="container">
<div class="logo">
<a href="#">
<img src="images/logo.png" alt="miqo" width="76" height="25">
</a>
</div>
<nav id="nav">
<a href="#" class="nav-opener"><span></span></a>
<div class="nav-drop font-weight-medium">
<ul>
<li><a href="#home-wrap">home</a></li>
<li><a href="#about-wrap">about us</a></li>
<li>
<a href="#service-wrap">services</a>
<span class="nav-dropdown-opener"><i class="icon-arrow-down"></i></span>
<div class="dropdown-holder">
<ul>
<li><a href="#">sub menu item 1</a></li>
<li><a href="#">sub menu item 2</a></li>
<li><a href="#">sub menu item 3</a></li>
<li><a href="#">sub menu item 4</a></li>
<li><a href="#">sub menu item 5</a></li>
</ul>
</div>
</li>
<li>
<a href="#product-wrap">products</a>
<span class="nav-dropdown-opener"><i class="icon-arrow-down"></i></span>
<div class="dropdown-holder">
<ul>
<li><a href="#">sub menu item 1</a></li>
<li><a href="#">sub menu item 2</a></li>
<li><a href="#">sub menu item 3</a></li>
<li><a href="#">sub menu item 4</a></li>
<li><a href="#">sub menu item 5</a></li>
</ul>
</div>
</li>
<li><a href="#work-wrap">our work</a></li>
<li><a href="#contact-wrap">contacts</a></li>
</ul>
</div>
</nav>
</div>
</header>
<div class="promo-wrap" id="home-wrap">
<div class="container">
<div class="promo-img-wrap hide-below-tablet">
<img src="images/img01.png" alt="image description" width="1020" height="1289">
</div>
<div class="promo-holder">
<ol class="breadcrumb-element font-weight-medium text-uppercase">
<li>Intro</li>
<li class="active">Digital agency</li>
</ol>
<h1 class="font-weight-medium">Meet Our Miqo Agency</h1>
<p>We deliver a personal, passionate & tailored service to each and every one of our clients, big or small from every part of the world.</p>
<ul class="btn-list">
<li><a href="#" class="btn btn-primary font-weight-medium">Get started <i class="icon-right-arrow"></i></a>
</li>
<li>
<a data-fancybox href="https://www.youtube.com/watch?v=-Da8Mf5vg7o" class="btn-video">
<span class="ico-play"></span>
<span class="btn-text font-weight-medium">Watch the intro video</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<main class="main">
<div class="about-wrap" id="about-wrap">
<div class="container">
<div class="about-lt-block">
<img src="images/img02.png" alt="image description" width="568" height="640">
<div class="ico-wrap">
<i class="icon-about"></i>
</div>
</div>
<div class="about-text-holder">
<span class="top-title d-block font-weight-medium text-uppercase">About our company</span>
<h2>Who we are?</h2>
<p>We Plan, Design, Build and Market businesses and digital Products. Whatever your digital needs we’ve your back covered.</p>
<ul class="feature-list">
<li>
<div class="ico-wrap"><img src="images/strategy.png" alt="image description" width="39" height="41">
</div>
<span class="ico-title font-weight-medium">Strategy</span>
</li>
<li>
<div class="ico-wrap"><img src="images/technology.png" alt="image description" width="41" height="39">
</div>
<span class="ico-title font-weight-medium">Technology</span>
</li>
<li>
<div class="ico-wrap"><img src="images/creative.png" alt="image description" width="41" height="41">
</div>
<span class="ico-title font-weight-medium">Creative</span>
</li>
<li>
<div class="ico-wrap"><img src="images/marketing.png" alt="image description" width="42" height="42">
</div>
<span class="ico-title font-weight-medium">Marketing</span>
</li>
</ul>
<div class="btn-wrap">
<a href="#" class="btn btn-primary font-weight-medium">Learn more <i class="icon-right-arrow"></i></a>
</div>
</div>
</div>
</div>
<div class="work-wrap" id="work-wrap">
<div class="grad-shape-wrap hide-below-tablet grad-1"></div>
<div class="container">
<div class="work-text-wrap">
<span class="top-title d-block font-weight-medium text-uppercase">Our work</span>
<h2>Leadership Team</h2>
<ul class="work-navlist">
<li><a class="slick-prev slick-arrow" href="#"><i class="icon-left-arrow"></i></a></li>
<li><a class="slick-next slick-arrow" href="#"><i class="icon-right-arrow"></i></a></li>
</ul>
</div>
<div class="work-slick-slider">
<div>
<ul class="work-logos-list">
<li><a href="#"><img src="images/client-logo-1.png" alt="psd freebies" width="123" height="26"></a></li>
<li><a href="#"><img src="images/client-logo-2.png" alt="xataka" width="123" height="45"></a></li>
<li><a href="#"><img src="images/client-logo-3.png" alt="coliss" width="103" height="34"></a></li>
<li><a href="#"><img src="images/client-logo-4.png" alt="taringa!" width="103" height="19"></a></li>
<li><a href="#"><img src="images/client-logo-5.png" alt="page" width="91" height="20"></a></li>
<li><a href="#"><img src="images/client-logo-6.png" alt="noupe" width="115" height="32"></a></li>
<li><a href="#"><img src="images/client-logo-7.png" alt="creattica" width="102" height="27"></a></li>
<li><a href="#"><img src="images/client-logo-8.png" alt="pixeden" width="140" height="38"></a></li>
</ul>
</div>
<div>
<ul class="work-logos-list">
<li><a href="#"><img src="images/client-logo-3.png" alt="coliss" width="103" height="34"></a></li>
<li><a href="#"><img src="images/client-logo-4.png" alt="taringa!" width="103" height="19"></a></li>
<li><a href="#"><img src="images/client-logo-5.png" alt="page" width="91" height="20"></a></li>
<li><a href="#"><img src="images/client-logo-6.png" alt="noupe" width="115" height="32"></a></li>
<li><a href="#"><img src="images/client-logo-7.png" alt="creattica" width="102" height="27"></a></li>
<li><a href="#"><img src="images/client-logo-8.png" alt="pixeden" width="140" height="38"></a></li>
</ul>
</div>
<div>
<ul class="work-logos-list">
<li><a href="#"><img src="images/client-logo-1.png" alt="psd freebies" width="123" height="26"></a></li>
<li><a href="#"><img src="images/client-logo-2.png" alt="xataka" width="123" height="45"></a></li>
<li><a href="#"><img src="images/client-logo-3.png" alt="coliss" width="103" height="34"></a></li>
<li><a href="#"><img src="images/client-logo-4.png" alt="taringa!" width="103" height="19"></a></li>
<li><a href="#"><img src="images/client-logo-5.png" alt="page" width="91" height="20"></a></li>
<li><a href="#"><img src="images/client-logo-6.png" alt="noupe" width="115" height="32"></a></li>
<li><a href="#"><img src="images/client-logo-7.png" alt="creattica" width="102" height="27"></a></li>
<li><a href="#"><img src="images/client-logo-8.png" alt="pixeden" width="140" height="38"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="service-wrap text-center" id="service-wrap">
<div class="container">
<div class="heading-wrap">
<span class="top-title d-block text-uppercase font-weight-medium">Our Services</span>
<h2>What we do</h2>
</div>
<div class="services-row">
<div class="services-col">
<a href="#" class="service-block">
<div class="img-wrap">
<img src="images/img04.png" alt="image description" width="191" height="192">
</div>
<strong class="service-title d-block font-weight-medium">Digital <br>strategy</strong>
</a>
</div>
<div class="services-col">
<a href="#" class="service-block">
<div class="img-wrap">
<img src="images/img05.png" alt="image description" width="187" height="250">
</div>
<strong class="service-title d-block font-weight-medium">Web design & development</strong>
</a>
</div>
<div class="services-col">
<a href="#" class="service-block">
<div class="img-wrap">
<img src="images/img06.png" alt="image description" width="162" height="190">
</div>
<strong class="service-title d-block font-weight-medium">Branding</strong>
</a>
</div>
<div class="services-col">
<a href="#" class="service-block">
<div class="img-wrap">
<img src="images/img07.png" alt="image description" width="225" height="234">
</div>
<strong class="service-title d-block font-weight-medium">Marketing</strong>
</a>
</div>
<div class="services-col">
<a href="#" class="service-block">
<div class="img-wrap">
<img src="images/img03.png" alt="image description" width="209" height="182">
</div>
<strong class="service-title d-block font-weight-medium">Reporting & analytics</strong>
</a>
</div>
</div>
</div>
</div>
<div class="product-wrap" id="product-wrap">
<div class="grad-shape-wrap hide-below-tablet grad-1"></div>
<div class="container">
<div class="filter-wrap filter-open-close">
<span class="top-title d-block font-weight-medium text-uppercase text-center">Products</span>
<a href="#" class="h2 filter-opener text-center d-inline-block"><span class="d-inline-block">Browse <br class="hide-below-tablet">our products</span></a>
<div class="filter-dropdown">
<ul class="product-type font-weight-medium" data-isotope-filter="true">
<li class="active"><a href="#" data-filter="all">All</a></li>
<li><a href="#" data-filter="technology">Technology</a></li>
<li><a href="#" data-filter="strategy">Strategy</a></li>
<li><a href="#" data-filter="creative">Creative</a></li>
</ul>
</div>
<div class="product-filter-block filter-block">
<ul class="product-listing">
<li class="product-col-item li" data-filter="technology creative">
<div class="product-img-wrap" style="background-image: url(images/img02.jpg);">
<div class="product-info-block">
<div class="btn-wrap">
<a href="#" class="btn btn-yellow font-weight-medium">Technology</a>
</div>
<h3 class="font-weight-medium"><a href="#">Enterprise management</a></h3>
</div>
</div>
</li>
<li class="product-col-item li" data-filter="strategy">
<div class="product-img-wrap" style="background-image: url(images/img01.jpg);">
<div class="product-info-block">
<div class="btn-wrap">
<a href="#" class="btn btn-yellow font-weight-medium">Strategy</a>
</div>
<h3 class="font-weight-medium"><a href="#">Planning and allocation of resources</a></h3>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="contact-wrap" id="contact-wrap">
<div class="grad-shape-wrap hide-below-tablet grad-top"></div>
<div class="grad-shape-wrap hide-below-tablet grad-right-bottom"></div>
<div class="grad-shape-wrap hide-below-tablet grad-bottom"></div>
<div class="container">
<div class="contact-img-wrap">
<img src="images/img08.png" alt="image description" width="1002" height="663">
</div>
<div class="contact-block">
<span class="top-title text-uppercase font-weight-medium d-block">Contact us</span>
<strong class="contact-title h1 d-block">Get <br>in touch</strong>
<form class="contact-form" action="#">
<div class="form-group">
<i class="icon-user"></i>
<label for="name">name</label>
<input type="text" id="name" placeholder="James Williams">
</div>
<div class="form-group">
<i class="icon-email"></i>
<label for="email">e-mail</label>
<input type="email" id="email" placeholder="Please enter your e-mail">
</div>
<div class="form-group">
<i class="icon-subjects"></i>
<label for="subject">subject</label>
<select id="subject">
<option>Select subject </option>
<option>Subject name 1</option>
<option>Subject name 2</option>
<option>Subject name 3</option>
<option>Subject name 4</option>
<option>Subject name 5</option>
<option>Subject name 6</option>
</select>
</div>
<div class="form-meta-info">
<div class="btn-wrap">
<button type="submit" class="btn btn-primary font-weight-medium">submit <i class="icon-right-arrow"></i></button>
</div>
<span class="text-info">What are we doing with your personal data? <a href="#">Read here</a></span>
</div>
</form>
</div>
</div>
</div>
</main>
<footer id="footer">
<div class="container">
<div class="footer-block">
<span class="footer-block-title text-uppercase font-weight-medium d-block">Company</span>
<nav class="add-nav font-weight-medium">
<ul>
<li><a href="#">About us</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Our work</a></li>
<li><a href="#">Contacts</a></li>
<li><a href="#">Privacy Policy</a></li>
</ul>
</nav>
</div>
<div class="footer-block">
<span class="footer-block-title text-uppercase font-weight-medium d-block">Services</span>
<nav class="add-nav font-weight-medium">
<ul>
<li><a href="#">Digital strategy</a></li>
<li><a href="#">Web design</a></li>
<li><a href="#">Branding</a></li>
<li><a href="#">Development</a></li>
<li><a href="#">Reporting & analytics</a></li>
</ul>
</nav>
</div>
<div class="footer-block">
<span class="footer-block-title text-uppercase font-weight-medium d-block">How to find us</span>
<address><i class="icon-flags"></i> Miqo | Dolor Sitamet 33-35 <br>228322 Lipsum</address>
<div class="map-wrap">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d206253.45013612503!2d-115.3150850418082!3d36.1249184510055!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80beb782a4f57dd1%3A0x3accd5e6d5b379a3!2sLas%20Vegas%2C%20NV%2C%20USA!5e0!3m2!1sen!2snp!4v1591268644273!5m2!1sen!2snp" width="270" height="124" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
</div>
</div>
<div class="footer-block">
<span class="footer-block-title text-uppercase font-weight-medium d-block">Get in touch</span>
<div class="footer-contact-block">
<span class="text-email-contact d-block">Feel free to get in touch with us via email</span>
<a href="mailto:contact@mail.com"
class="mail-link font-weight-medium">contact@mail.com</a>
<ul class="social-networks">
<li><a href="#"><i class="icon-linkedin"></i></a></li>
<li><a href="#"><i class="icon-facebook"></i></a></li>
<li><a href="#"><i class="icon-instagram"></i></a></li>
</ul>
<span class="text-copyright d-block">Copyright © 2020 - <a href="#" class="text-uppercase">P2H</a></span>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>