<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Miqo Agency</title>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="style.css">
<script src="https://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="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" crossorigin="anonymous" defer></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous" defer></script>
<script src="js/jquery.main.js" defer></script>
<meta name="robots" content="noindex">
</head>
<body>
<div class="wrapper">
<header class="header">
<div class="container position-relative py-13 pt-lg-31 pb-lg-14">
<nav class="navbar navbar-expand-lg navbar-light text-uppercase align-items-lg-start">
<a class="navbar-brand" href="#"><img src="images/logo.svg" alt="Miqo"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span></span>
<span></span>
<span></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav flex-wrap">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Our work</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Services
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown02" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Products
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown02">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contacts</a>
</li>
</ul>
<a href="#" class="search-opener rounded-circle d-none d-lg-flex flex-wrap align-items-center justify-content-center position-absolute"><span class="icon-search"></span></a>
<form class="form-inline flex-wrap my-10 my-lg-0 px-15 px-md-0 p-lg-15 mt-lg-5">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-primary border-0 my-0 ml-auto text-uppercase pt-11 px-10 pb-10" type="submit">Search</button>
</form>
</div>
</nav>
</div>
</header>
<main class="main">
<div class="container-lg">
<section class="intro text-white position-relative mb-8">
<div class="bg-image position-absolute"><img src="images/img01.jpg" alt="image description"></div>
<div class="container">
<div class="row">
<div class="col-md-9 col-lg-7 col-xl-6">
<div class="intro-content position-relative pt-30 pr-lg-40">
<h1 class="mb-25 mb-xl-45">We are <span class="d-block">a digital agency of change.</span></h1>
<div class="buttons d-flex flex-wrap ml-n20">
<a href="#" class="btn btn-primary border-0 btn-has-arrow position-relative ml-20 mb-18">Start work with us</a>
<a href="#" class="btn btn-secondary btn-has-arrow position-relative border-0 ml-20 mb-18">Case studies</a>
</div>
</div>
</div>
</div>
<div class="btn-explore position-absolute">
<a href="#about" class="btn position-relative btn-light btn-has-arrow mx-auto my-0 py-15 pl-20 pr-34 d-table">Explore</a>
</div>
</div>
</section>
</div>
<section class="about" id="about">
<div class="container">
<div class="row">
<div class="col-md-4 col-lg-3">
<div class="about-content pt-9 mr-12">
<h2 class="mb-23">About Us</h2>
<p>We're a creative digital agency focused on results-driven solutions for companies ranging from start-ups to global organisations.</p>
</div>
<div class="art-image">
<img src="images/art.svg" alt="image description">
</div>
</div>
<div class="col-md-8 col-lg-9">
<div class="row about-list">
<div class="col-sm-6 col-lg-4">
<div class="card position-relative pt-32 pr-20 pb-26 pl-29 mb-31 mb-md-40 px-md-20 pl-lg-32 mb-31 mb-md-31">
<div class="card-body position-relative p-0">
<div class="icon position-relative d-inline-block align-top text-primary mb-6">
<span class="icon-ico"></span>
<span class="icon-ico position-absolute hover"></span>
</div>
<h3 class="mb-45">ICO</h3>
<a href="#" class="more position-relative pb-3">Learn more</a>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="card position-relative pt-32 pr-20 pb-26 pl-29 mb-31 mb-md-40 px-md-20 pl-lg-32 mb-31 mb-md-31">
<div class="card-body position-relative p-0">
<div class="icon position-relative d-inline-block align-top text-primary mb-6">
<span class="icon-crm"></span>
<span class="icon-crm position-absolute hover"></span>
</div>
<h3 class="mb-45">CRM</h3>
<a href="#" class="more position-relative pb-3">Learn more</a>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="card position-relative pt-32 pr-20 pb-26 pl-29 mb-31 mb-md-40 px-md-20 pl-lg-32 mb-31 mb-md-31">
<div class="card-body position-relative p-0">
<div class="icon position-relative d-inline-block align-top text-primary mb-6">
<span class="icon-bag"></span>
<span class="icon-bag position-absolute hover"></span>
</div>
<h3 class="mb-45">Ecommerce</h3>
<a href="#" class="more position-relative pb-3">Learn more</a>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="card position-relative pt-32 pr-20 pb-26 pl-29 mb-31 mb-md-40 px-md-20 pl-lg-32 mb-31 mb-md-31">
<div class="card-body position-relative p-0">
<div class="icon position-relative d-inline-block align-top text-primary mb-6">
<span class="icon-email"></span>
<span class="icon-email position-absolute hover"></span>
</div>
<h3 class="mb-45">Emails</h3>
<a href="#" class="more position-relative pb-3">Learn more</a>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="card position-relative pt-32 pr-20 pb-26 pl-29 mb-31 mb-md-40 px-md-20 pl-lg-32 mb-31 mb-md-31">
<div class="card-body position-relative p-0">
<div class="icon position-relative d-inline-block align-top text-primary mb-6">
<span class="icon-analysis"></span>
<span class="icon-analysis position-absolute hover"></span>
</div>
<h3 class="mb-45">Analytics</h3>
<a href="#" class="more position-relative pb-3">Learn more</a>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="card position-relative pt-32 pr-20 pb-26 pl-29 mb-31 mb-md-40 px-md-20 pl-lg-32 mb-31 mb-md-31">
<div class="card-body position-relative p-0">
<div class="icon position-relative d-inline-block align-top text-primary mb-6">
<span class="icon-seo"></span>
<span class="icon-seo position-absolute hover"></span>
</div>
<h3 class="mb-45">SEO</h3>
<a href="#" class="more position-relative pb-3">Learn more</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="services">
<div class="container">
<div class="row">
<div class="col-md-5 col-lg-4">
<h2 class="mt-n9 mb-30 mr-xl-15 ml-xl-n5">Our Services</h2>
</div>
<div class="col-md-7 col-lg-8">
<blockquote class="blockquote position-relative py-0 pr-0 pl-20 pt-md-5 pl-md-30 ml-xl-n30">
<strong class="h5 d-block mb-20">We can work together to get your ideas off the drawing board and into the real world</strong>
<p>We’re a creative digital agency that helps passionate organizations achieve inspiring results. We are guided by values, driven by purpose, and dedicated to our clients’ success.</p>
</blockquote>
</div>
</div>
<div class="row justify-content-lg-between text-center">
<div class="col-6 col-sm-4 col-md-3 col-lg-2">
<div class="icon d-flex flex-wrap justify-content-center align-items-center text-white rounded-circle mb-20 mx-auto mb-md-45"><span class="icon-strategy"></span></div>
<h3 class="mb-40">Strategy</h3>
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-2">
<div class="icon d-flex flex-wrap justify-content-center align-items-center text-white rounded-circle mb-20 mx-auto mb-md-45"><span class="icon-creative"></span></div>
<h3 class="mb-40">Creative</h3>
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-2">
<div class="icon d-flex flex-wrap justify-content-center align-items-center text-white rounded-circle mb-20 mx-auto mb-md-45"><span class="icon-technology"></span></div>
<h3 class="mb-40">Technology</h3>
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-2">
<div class="icon d-flex flex-wrap justify-content-center align-items-center text-white rounded-circle mb-20 mx-auto mb-md-45"><span class="icon-marketing"></span></div>
<h3 class="mb-40">Marketing</h3>
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-2">
<div class="icon d-flex flex-wrap justify-content-center align-items-center text-white rounded-circle mb-20 mx-auto mb-md-45"><span class="icon-graph"></span></div>
<h3 class="mb-40">Analytics</h3>
</div>
</div>
</div>
</section>
<section class="latest-work text-white position-relative">
<div class="bg-image position-absolute">
<img src="images/patern.svg" alt="image description">
</div>
<div class="container">
<div class="row">
<div class="col-sm-7 mb-30 mb-sm-0">
<h2>Latest work</h2>
</div>
<div class="col-sm-5">
<a href="#" class="more position-relative pb-4 mt-16 d-sm-table ml-sm-auto mt-sm-16">See all works</a>
</div>
</div>
<div class="row">
<div class="col-md-10 offset-md-1 col-lg-8 offset-lg-2 col-xl-6 offset-xl-3">
<div class="slide-wrap position-relative">
<div class="work-slider-prev position-absolute">
<div class="slide">
<div class="bg-image position-relative">
<img src="images/img06.jpg" alt="image description">
</div>
</div>
<div class="slide">
<div class="bg-image position-relative">
<img src="images/img05.jpg" alt="image description">
</div>
</div>
<div class="slide">
<div class="bg-image position-relative">
<img src="images/img07.jpg" alt="image description">
</div>
</div>
</div>
<div class="work-slider">
<div class="slide">
<div class="card rounded-0">
<div class="bg-image position-relative">
<img src="images/img05.jpg" alt="image description">
</div>
<div class="card-body position-relative">
<a href="#">Сommercial website for Miqo team <span class="icon-arrow-right-lg position-absolute mt-n5"></span></a>
</div>
</div>
</div>
<div class="slide">
<div class="card rounded-0">
<div class="bg-image position-relative">
<img src="images/img07.jpg" alt="image description">
</div>
<div class="card-body position-relative">
<a href="#">Сommercial website for Miqo team <span class="icon-arrow-right-lg position-absolute mt-n5"></span></a>
</div>
</div>
</div>
<div class="slide">
<div class="card rounded-0">
<div class="bg-image position-relative">
<img src="images/img06.jpg" alt="image description">
</div>
<div class="card-body position-relative">
<a href="#">Сommercial website for Miqo team <span class="icon-arrow-right-lg position-absolute mt-n5"></span></a>
</div>
</div>
</div>
</div>
<div class="work-slider-next position-absolute">
<div class="slide">
<div class="bg-image position-relative">
<img src="images/img07.jpg" alt="image description">
</div>
</div>
<div class="slide">
<div class="bg-image position-relative">
<img src="images/img06.jpg" alt="image description">
</div>
</div>
<div class="slide">
<div class="bg-image position-relative">
<img src="images/img05.jpg" alt="image description">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="process">
<div class="container">
<div class="row">
<div class="col-md-3 col-lg-4">
<div class="image-wrap">
<div class="image-sm">
<img src="images/img09.jpg" alt="image description">
</div>
<div class="image">
<img src="images/img08.jpg" alt="image description">
</div>
</div>
</div>
<div class="col-md-9 col-lg-8">
<div class="heading-content">
<h2 class="mb-13">Our process</h2>
<p>Having worked on a number of different projects we have been able to gain experience running numerous project delivery methodologies. The key is choosing the most appropriate methodology based on a number of criterias.</p>
</div>
<div class="row masonry">
<div class="col-sm-6 grid-item">
<div class="card d-inline-block w-100 position-relative">
<div class="card-body">
<h3>Discover</h3>
<p>Step into the shoes of your customers and tailor your website to their needs with our strategies. Through our systematic approach, we are able to boost your revenue.</p>
</div>
</div>
</div>
<div class="col-sm-6 grid-item">
<div class="card d-inline-block w-100 position-relative">
<div class="card-body">
<h3>Define</h3>
<p>Delivering a meaningful and relevant experience to your users can improve brand reputation and boost conversions. Our deep understanding of your users allows us to ensure each element of your page is fully optimised.</p>
</div>
</div>
</div>
<div class="col-sm-6 grid-item">
<div class="card d-inline-block w-100 position-relative">
<div class="card-body">
<h3>Create</h3>
<p>A stand-out website design will attract consumers to your brand, enhance perceived trustworthiness and ultimately increase conversions. Our designs achieve just that while remaining multi-device ready and SEO-optimised.</p>
</div>
</div>
</div>
<div class="col-sm-6 grid-item">
<div class="card d-inline-block w-100 position-relative">
<div class="card-body">
<h3>Evolve</h3>
<p>Ensure that your business’s message is seen in the right place, at the right time, by the right audience; with a creative social media strategy designed to spark new conversations and build relationships with the community.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="why-us">
<div class="container">
<div class="row">
<div class="col-md-7">
<div class="frame position-relative">
<div class="heading-content">
<h2>Why us</h2>
<strong class="txt font-weight-bold text-uppercase text-primary position-relative d-block mt-15 mb-26 pl-29"><img class="position-absolute" src="images/quote.svg" alt="image description"> DESIGN DRIVEN RESULTS</strong>
<p>As a full-service digital agency, we’re keen to provide businesses across the globe with the services they require to build their brand and develop as an industry-leader. Check out our wide range of digital marketing services.</p>
</div>
<ul class="list list-unstyled">
<li class="position-relative"><span class="icon rounded-circle d-flex flex-wrap align-items-center justify-content-center position-absolute bg-white icon-best"></span> The <span class="text-primary">best</span> specialists</li>
<li class="position-relative"><span class="icon rounded-circle d-flex flex-wrap align-items-center justify-content-center position-absolute bg-white icon-clock"></span> Creative <span class="text-primary">digital services</span></li>
<li class="position-relative"><span class="icon rounded-circle d-flex flex-wrap align-items-center justify-content-center position-absolute bg-white icon-finance-bar"></span> All the journey we’ll <span class="text-primary">support you</span></li>
<li class="position-relative"><span class="icon rounded-circle d-flex flex-wrap align-items-center justify-content-center position-absolute bg-white icon-solution"></span> Brand <span class="text-primary">management</span></li>
</ul>
<div class="art-image position-absolute">
<img src="images/art02.svg" alt="image description">
</div>
</div>
</div>
<div class="col-md-5">
<div class="img"><img src="images/img04.jpg " alt="image description"></div>
</div>
</div>
</div>
</section>
<section class="contact-block">
<div class="container">
<div class="row">
<div class="col-md-7">
<div class="card position-relative bg-white">
<div class="card-body">
<h2>Contacts</h2>
<ul class="contact-info list-unstyled pt-15 pt-md-35">
<li class="position-relative">
<div class="icon position-absolute"><span class="icon-calendar"></span></div>
<strong class="text-primary d-block mb-9">Working hours:</strong>
<span>Monday - Friday: 9:00 - 18:00</span>
</li>
<li class="position-relative">
<div class="icon position-absolute"><span class="icon-buldings"></span></div>
<strong class="text-primary d-block mb-9">Visit us:</strong>
<address>Lipsum, 61168, SE 228. LA</address>
</li>
</ul>
<div class="buttons d-flex flex-wrap ml-n20">
<a href="#" class="btn btn-primary border-0 btn-has-arrow position-relative ml-20 mb-18">Contact Us</a>
<a href="#" class="btn btn-outline-primary btn-has-arrow position-relative ml-20 mb-18">View direction</a>
</div>
</div>
</div>
</div>
<div class="col-md-5">
<div class="map position-relative">
<img src="images/map.png" alt="image description">
<div class="popup-holder position-absolute ml-n5 ml-md-n10 ml-xl-n5 mt-n5">
<span class="pointer rounded-circle d-block"></span>
<div class="popup position-absolute bg-white rounded py-32 pr-11 pl-76 mb-21">
<span class="icon-map d-flex flex-wrap align-items-center justify-content-center position-absolute bg-primary rounded-circle bg-primary mt-n20"></span>
<span>Lipsum, 61168, SE 228. LA</span>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="get-touch font-weight-normal text-white">
<div class="bg-image position-absolute">
<img src="images/patern.svg" alt="image description">
</div>
<div class="container">
<div class="row align-items-center">
<div class="col-md-8 col-xl-7">
<h2 class="mb-30">Get in touch with us</h2>
<p>Whether you’ve got a quick question or you want to run through the details of your next big project, we can help. Speak to one of our experts.</p>
</div>
<div class="col-md-4 col-xl-3 offset-xl-2 d-flex flex-wrap justify-content-md-end">
<a href="#" class="btn btn-primary border-0 btn-has-arrow position-relative mt-20 mt-md-n15">Contact Us</a>
</div>
</div>
</div>
</section>
</main>
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-md-4 col-xl-3">
<div class="logo-wrap font-weight-normal">
<div class="f-logo mb-15">
<a href="#"><img src="images/logo.svg" alt="miqo"></a>
</div>
<p>We’re not just a digital agency, we’re your partner </p>
</div>
<div class="copyright mb-40 mb-md-0">
<p class="mb-20">Copyright © 2020 - <a href="#">MIQO digital agency</a>.</p>
<div class="f-link mr-n15">
<a class="mr-15 d-inline-block" href="#">Privacy Policy</a>
<a class="mr-15 d-inline-block" href="#">Terms & Conditions</a>
</div>
</div>
</div>
<div class="col-md-8 offset-xl-1">
<div class="row justify-content-between">
<div class="col">
<div class="f-nav-wrap mb-30 mb-md-0 pl-xl-29 mt-xl-n3">
<strong class="h6 text-uppercase d-block mb-20 mb-md-30">Company</strong>
<ul class="f-nav list-unstyled">
<li class="mb-18"><a href="#">About us</a></li>
<li class="mb-18"><a href="#">Our work</a></li>
<li class="mb-18"><a href="#">Services</a></li>
<li class="mb-18"><a href="#">Products</a></li>
<li class="mb-18"><a href="#">Contacts</a></li>
</ul>
</div>
</div>
<div class="col">
<div class="f-nav-wrap mb-30 mb-md-0 pl-xl-34 mt-xl-n3">
<strong class="h6 text-uppercase d-block mb-20 mb-md-30">Our work</strong>
<ul class="f-nav list-unstyled">
<li class="mb-18"><a href="#">ICO</a></li>
<li class="mb-18"><a href="#">CRM</a></li>
<li class="mb-18"><a href="#">Ecommerce</a></li>
<li class="mb-18"><a href="#">Emails</a></li>
<li class="mb-18"><a href="#">Analytics</a></li>
<li class="mb-18"><a href="#">SEO</a></li>
</ul>
</div>
</div>
<div class="col-sm-5">
<div class="contact-wrap mr-sm-n12 ml-sm-n5 mx-md-0 mt-xl-n3 pl-xl-32">
<strong class="h6 text-uppercase d-block mb-20 mb-md-30">Get in touch </strong>
<ul class="contact list-unstyled mb-32">
<li class="position-relative pl-23"><span class="position-absolute icon-map"></span><address class="d-inline mb-0">Lipsum, 61168, SE 228. LA</address></li>
<li class="position-relative pl-23"><span class="position-absolute icon-call"></span><a href="tel:+801236571948">+80 123 657 1948</a></li>
</ul>
<div class="mail mb-25">
<p class="mb-13">Feel free to get in touch <br>with us via email</p>
<a href="mailto:contact@mail.com">contact@mail.com</a>
</div>
<ul class="social-networks d-flex flex-wrap list-unstyled ml-n10">
<li class="ml-10 mb-10"><a href="#" class="d-flex flex-wrap flex align-items-center justify-content-center rounded-circle"><span class="icon-linkedin"></span></a></li>
<li class="ml-10 mb-10"><a href="#" class="d-flex flex-wrap flex align-items-center justify-content-center rounded-circle"><span class="icon-facebook"></span></a></li>
<li class="ml-10 mb-10"><a href="#" class="d-flex flex-wrap flex align-items-center justify-content-center rounded-circle"><span class="icon-instagram"></span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>