Footers
Different style of footer layouts.
Footer #1
<!-- ========== FOOTER ========== -->
<footer>
<!-- Lists -->
<div class="border-bottom">
<div class="container space-2">
<div class="row justify-content-md-between">
<div class="col-sm-4 col-lg-2 mb-4 mb-lg-0">
<h4 class="h6 font-weight-semi-bold">About</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-4 col-lg-2 mb-4 mb-lg-0">
<h4 class="h6 font-weight-semi-bold">Account</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-4 col-lg-2 mb-4 mb-lg-0">
<h4 class="h6 font-weight-semi-bold">Resources</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/terms.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-md-6 col-lg-4">
<h4 class="h6 font-weight-semi-bold mb-4">We are driven to deliver results for all your businesses.</h4>
<!-- Button -->
<button type="button" class="btn btn-xs btn-dark btn-wide transition-3d-hover text-left mb-2 mr-1">
<span class="media align-items-center">
<span class="fab fa-apple fa-2x mr-3"></span>
<span class="media-body">
<span class="d-block">Download on the</span>
<strong class="font-size-1">App Store</strong>
</span>
</span>
</button>
<!-- End Button -->
<!-- Button -->
<button type="button" class="btn btn-xs btn-dark btn-wide transition-3d-hover text-left mb-2">
<span class="media align-items-center">
<span class="fab fa-google-play fa-2x mr-3"></span>
<span class="media-body">
<span class="d-block">Get it on</span>
<strong class="font-size-1">Google Play</strong>
</span>
</span>
</button>
<!-- End Button -->
</div>
</div>
</div>
</div>
<!-- End Lists -->
<!-- Copyright -->
<div class="container text-center space-1">
<a class="d-inline-flex align-items-center mb-2" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<p class="small text-muted">© Front. 2018 Htmlstream. All rights reserved.</p>
</div>
<!-- End Copyright -->
</footer>
<!-- ========== END FOOTER ========== -->
Footer #2
<!-- ========== FOOTER ========== -->
<footer class="container">
<div class="row space-2">
<div class="col-md-4 mb-7 mb-md-0">
<!-- Contacts -->
<div class="media">
<span class="btn btn-icon btn-soft-primary rounded-circle mr-3">
<span class="fas fa-phone btn-icon__inner"></span>
</span>
<div class="media-body">
<h4 class="h6 text-secondary font-weight-normal mb-0">Call us</h4>
<span class="d-block font-size-1">+1 (062) 109-9222</span>
</div>
</div>
<!-- End Contacts -->
</div>
<div class="col-md-4 mb-7 mb-md-0">
<!-- Contacts -->
<div class="media">
<span class="btn btn-icon btn-soft-primary rounded-circle mr-3">
<span class="fas fa-envelope btn-icon__inner"></span>
</span>
<div class="media-body">
<h4 class="h6 text-secondary font-weight-normal mb-0">Email us</h4>
<span class="d-block font-size-1">support@htmlstream.com</span>
</div>
</div>
<!-- End Contacts -->
</div>
<div class="col-md-4">
<!-- Contacts -->
<div class="media">
<span class="btn btn-icon btn-soft-primary rounded-circle mr-3">
<span class="fas fa-map-marker-alt btn-icon__inner"></span>
</span>
<div class="media-body">
<h4 class="h6 text-secondary font-weight-normal mb-0">Address</h4>
<span class="d-block font-size-1">153 Williamson Plaza, Maggieberg</span>
</div>
</div>
<!-- End Contacts -->
</div>
</div>
<hr class="my-0">
<div class="row space-2">
<div class="col-6 col-lg-3 mb-7 mb-lg-0">
<!-- Logo -->
<a class="d-inline-flex align-items-center mb-3" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
<!-- Copyright -->
<p class="small text-muted">© Front. All rights reserved.</p>
<!-- End Copyright -->
</div>
<div class="col-6 col-lg-3 mb-7 mb-lg-0">
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/grid-right-sidebar.html">Blog</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-lg-3 mb-7 mb-lg-0">
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/terms.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-lg-3 mb-7 mb-lg-0">
<h4 class="font-size-1 font-weight-normal text-secondary">Connect</h4>
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item mb-3">
<a class="btn btn-sm btn-icon btn-soft-primary rounded" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mb-3">
<a class="btn btn-sm btn-icon btn-soft-primary rounded" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mb-3">
<a class="btn btn-sm btn-icon btn-soft-primary rounded" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mb-3">
<a class="btn btn-sm btn-icon btn-soft-primary rounded" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #3
<!-- ========== FOOTER ========== -->
<footer class="container space-top-1">
<div class="border-bottom">
<div class="row mb-7">
<div class="col-lg-3 mb-7 mb-lg-0">
<div class="d-flex align-self-start flex-column h-100">
<!-- Logo -->
<a class="d-flex align-items-center mb-3" href="../home/index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
<!-- Country -->
<div class="position-relative">
<a id="footerCountryInvokerExample3" class="dropdown-nav-link" href="javascript:;" role="button"
aria-controls="footer-country-example-1"
aria-haspopup="true"
aria-expanded="false"
data-toggle="dropdown"
data-unfold-event="click"
data-unfold-target="#footer-country-example-1"
data-unfold-type="css-animation"
data-unfold-duration="300"
data-unfold-delay="300"
data-unfold-hide-on-scroll="false"
data-unfold-animation-in="slideInUp"
data-unfold-animation-out="fadeOut">
<img class="dropdown-item-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/us.svg" alt="United States Flag">
<span>United States</span>
</a>
<div id="footer-country-example-1" class="dropdown-menu dropdown-unfold dropdown-card dropdown-menu-bottom" aria-labelledby="footerCountryInvokerExample3">
<div class="card">
<!-- Body -->
<div class="card-body list-group list-group-flush list-group-borderless p-5">
<h4 class="h6 font-weight-semi-bold">Front available in</h4>
<div class="row">
<div class="col-6">
<!-- List Group -->
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/au.svg" alt="Australia Flag">
Australia
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/at.svg" alt="Austria Flag">
Austria
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/be.svg" alt="Belgium Flag">
Belgium
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/ca.svg" alt="Canada Flag">
Canada
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/dk.svg" alt="Denmark Flag">
Denmark
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/fi.svg" alt="Finland Flag">
Finland
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/fr.svg" alt="France Flag">
France
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/de.svg" alt="Germany Flag">
Germany
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/nl.svg" alt="Netherlands Flag">
Netherlands
</a>
<!-- End List Group -->
</div>
<div class="col-6">
<!-- List Group -->
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/nz.svg" alt="New Zealand Flag">
New Zealand
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/no.svg" alt="Norway Flag">
Norway
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/pt.svg" alt="PortugalPREVIEW Flag">
Portugal
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/sg.svg" alt="Singapore Flag">
Singapore
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/es.svg" alt="Spain Flag">
Spain
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/se.svg" alt="Sweden Flag">
Sweden
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/ch.svg" alt="Switzerland Flag">
Switzerland
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/gb.svg" alt="United Kingdom Flag">
UK
</a>
<a class="list-group-item list-group-item-action active " href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/us.svg" alt="United States Flag">
US
</a>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Body -->
<!-- Footer -->
<a class="card-footer card-bg-light p-5" href="#">
<span class="d-block text-muted mb-1">More countries coming soon.</span>
<small class="d-block">Signup to get notified <span class="fas fa-arrow-right small"></span></small>
</a>
<!-- End Footer -->
</div>
</div>
</div>
<!-- End Country -->
</div>
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 mb-md-0">
<h4 class="h6 font-weight-semi-bold">Account</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 mb-md-0">
<h4 class="h6 font-weight-semi-bold">Company</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/grid-right-sidebar.html">Blog</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-4 col-md-3 col-lg-2 mb-4 mb-md-0">
<h4 class="h6 font-weight-semi-bold">Resources</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/contacts-agency.html">Contacts</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/terms.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-md-3 col-lg-2">
<h4 class="h6 font-weight-semi-bold">Contact</h4>
<!-- Address -->
<address>
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li class="list-group-item">+1 (062) 109-9222</li>
<li class="list-group-item">
<a href="mailto:support@htmlstream.com">support@htmlstream.com</a>
</li>
<li class="list-group-item">153 Williamson Plaza, Maggieberg, MT 09514</li>
</ul>
</address>
<!-- End Address -->
</div>
</div>
</div>
<div class="d-flex justify-content-between align-items-center py-7">
<!-- Copyright -->
<p class="small text-muted mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</footer>
<!-- ========== END FOOTER ========== -->|
<!-- JS Front -->
<script src="../../assets/js/components/hs.unfold.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of unfold component
$.HSCore.components.HSUnfold.init($('[data-unfold-target]'));
});
</script>
Footer #4
<!-- ========== FOOTER ========== -->
<footer class="container space-2">
<div class="text-center">
<!-- Button -->
<button type="button" class="btn btn-xs btn-primary btn-wide btn-pill text-left mb-2 mb-sm-0 mr-1">
<span class="media align-items-center">
<span class="fab fa-apple font-size-2 mr-3"></span>
<span class="media-body">
<span class="d-block">Download on the</span>
<strong class="font-size-1">App Store</strong>
</span>
</span>
</button>
<!-- End Button -->
<!-- Button -->
<button type="button" class="btn btn-xs btn-primary btn-wide btn-pill text-left mb-2 mb-sm-0 ml-1">
<span class="media align-items-center">
<span class="fab fa-google-play font-size-2 mr-3"></span>
<span class="media-body">
<span class="d-block">Get it on</span>
<strong class="font-size-1">Google Play</strong>
</span>
</span>
</button>
<!-- End Button -->
</div>
<hr class="my-7">
<div class="row align-items-md-center">
<div class="col-md-4 mb-4 mb-md-0">
<div class="d-flex align-items-center">
<!-- Logo -->
<!-- End Logo -->
<p class="small mb-0">© Front. 2018 Htmlstream.<br>All rights reserved.</p>
</div>
</div>
<div class="col-sm-6 col-md-4 mb-4 mb-sm-0">
<!-- List -->
<ul class="list-inline list-group-flush list-group-borderless text-md-center mb-0">
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/help.html">Help</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/contacts.html">Terms</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/privacy.html">Privacy</a>
</li>
</ul>
<!-- End List -->
</div>
<div class="col-sm-6 col-md-4">
<!-- Social Networks -->
<ul class="list-inline text-sm-right mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent rounded-circle" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent rounded-circle" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent rounded-circle" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent rounded-circle" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #5
<!-- ========== FOOTER ========== -->
<footer id="SVGcurvedShape" class="svg-preloader">
<!-- SVG Shape -->
<figure>
<img class="js-svg-injector" src="../../assets/svg/components/curved-2.svg" alt="Image Description"
data-parent="#SVGcurvedShape">
</figure>
<!-- End SVG Shape -->
<!-- Content -->
<div class="bg-dark">
<div class="container space-2 space-md-3">
<div class="row justify-content-lg-between">
<div class="col-lg-4 d-flex align-items-start flex-column mb-7 mb-lg-0">
<!-- Logo -->
<a class="d-flex align-items-center mb-lg-auto" href="../home/index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#E1E4EA" opacity=".65" d="M23,41.1L23,41.1c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C41,33,32.9,41.1,23,41.1z"/>
<path class="fill-white" opacity=".5" d="M28,36L28,36c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3C43,0.1,46,3.1,46,6.7v11.4C46,28,38,36,28,36z"/>
<path class="fill-white" opacity=".7" d="M18,46.1L18,46.1c-10,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C35.9,38.1,27.9,46.1,18,46.1z"/>
<path class="fill-primary" d="M17.4,34.1V18.4h10.2v2.9h-6.4v3.4H26v2.9h-4.8v6.5H17.4z"/>
</svg>
<span class="brand brand-light">Front</span>
</a>
<!-- End Logo -->
<p class="small text-white-50 mb-0">© Front. 2018 Htmlstream.<br>All rights reserved.</p>
</div>
<div class="col-6 col-md-4 col-lg-2 mb-7 mb-md-0">
<h3 class="h6 text-white">About</h3>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/grid-right-sidebar.html">Blog</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-md-4 col-lg-2 mb-7 mb-md-0">
<h3 class="h6 text-white">Account</h3>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-md-4 col-lg-3">
<h3 class="h6 text-white">Contacts</h3>
<!-- Address -->
<address class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<a class="list-group-item list-group-item-action" href="#">+1 (062) 109-9222</a>
<a class="list-group-item list-group-item-action" href="mailto:support@htmlstream.com">support@htmlstream.com</a>
<a class="list-group-item list-group-item-action" href="#">153 Williamson Plaza, Maggieberg, MT 09514</a>
</address>
<!-- End Address -->
</div>
</div>
</div>
</div>
<!-- End Content -->
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
</script>
Footer #6
<!-- ========== FOOTER ========== -->
<footer class="gradient-half-primary-v1">
<div class="container space-top-2 space-bottom-1">
<div class="row justify-content-lg-start mb-7">
<div class="col-sm-9 col-lg-4 mb-7">
<!-- Logo -->
<a class="d-inline-flex align-items-center mb-3" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#E1E4EA" opacity=".65" d="M23,41.1L23,41.1c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C41,33,32.9,41.1,23,41.1z"/>
<path class="fill-white" opacity=".5" d="M28,36L28,36c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3C43,0.1,46,3.1,46,6.7v11.4C46,28,38,36,28,36z"/>
<path class="fill-white" opacity=".7" d="M18,46.1L18,46.1c-10,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C35.9,38.1,27.9,46.1,18,46.1z"/>
<path class="fill-primary" d="M17.4,34.1V18.4h10.2v2.9h-6.4v3.4H26v2.9h-4.8v6.5H17.4z"/>
</svg>
<span class="brand brand-light">Front</span>
</a>
<!-- End Logo -->
<p class="small text-white-70">Front is a responsive website template. We will help to Attract more visitors, and win more business with Front template.</p>
</div>
<div class="col-6 col-sm-4 col-lg-2 ml-lg-auto mb-4">
<h3 class="h6 text-white">Account</h3>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-sm-4 col-lg-2 mb-4">
<h3 class="h6 text-white">Company</h3>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers-listing.html">Careers</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-sm-4 col-lg-2 mb-4">
<h3 class="h6 text-white">Resources</h3>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/contacts.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
</div>
<div class="row align-items-center">
<div class="col-sm-6 mb-3 mb-sm-0">
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
<div class="col-sm-6 text-sm-right">
<!-- Copyright -->
<p class="small text-white-70 mb-0">© Front. 2018 Htmlstream. All rights reserved.</p>
<!-- End Copyright -->
</div>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #7
<!-- ========== FOOTER ========== -->
<footer class="bg-dark">
<div class="container space-top-2">
<div class="row justify-content-lg-between mb-7">
<div class="col-6 col-md-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6 text-white">About</h4>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers-listing.html">Careers</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-md-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6 text-white">Account</h4>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-md-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6 text-white">Contacts</h4>
<!-- Address -->
<address class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<a class="list-group-item list-group-item-action" href="#">+1 (062) 109-9222</a>
<a class="list-group-item list-group-item-action" href="mailto:support@htmlstream.com">support@htmlstream.com</a>
<a class="list-group-item list-group-item-action" href="#">153 Williamson Plaza, Maggieberg, MT 09514</a>
</address>
<!-- End Address -->
</div>
<div class="col-sm-6 col-md-5 col-lg-3 col-lg-3">
<div class="mb-4">
<h4 class="h6 text-white mb-3">Subscribe</h4>
<!-- Subscribe Form -->
<form class="js-validate js-form-message">
<label class="sr-only" for="subscribeSrEmailExample2">Your email</label>
<div class="input-group">
<input type="email" class="form-control" name="email" id="subscribeSrEmailExample2" placeholder="Your email" aria-label="Your email" aria-describedby="subscribeButtonExample2" required
data-msg="Please enter a valid email address.">
<div class="input-group-append">
<button class="btn btn-primary" type="button" id="subscribeButtonExample2">
<span class="fas fa-paper-plane"></span>
</button>
</div>
</div>
</form>
<!-- End Subscribe Form -->
</div>
<h4 class="h6 text-white-70 mb-3">Stay in touch</h4>
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
<div class="row justify-content-between align-items-center space-1">
<div class="col-5">
<!-- Logo -->
<a class="d-inline-flex align-items-center mb-3" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#E1E4EA" opacity=".65" d="M23,41.1L23,41.1c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C41,33,32.9,41.1,23,41.1z"/>
<path class="fill-white" opacity=".5" d="M28,36L28,36c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3C43,0.1,46,3.1,46,6.7v11.4C46,28,38,36,28,36z"/>
<path class="fill-white" opacity=".7" d="M18,46.1L18,46.1c-10,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C35.9,38.1,27.9,46.1,18,46.1z"/>
<path class="fill-primary" d="M17.4,34.1V18.4h10.2v2.9h-6.4v3.4H26v2.9h-4.8v6.5H17.4z"/>
</svg>
<span class="brand brand-light">Front</span>
</a>
<!-- End Logo -->
</div>
<div class="col-6 text-right">
<p class="small mb-0">© Front. 2018 Htmlstream.</p>
</div>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/jquery-validation/dist/jquery.validate.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.validation.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of form validation
$.HSCore.components.HSValidation.init('.js-validate');
});
</script>
Footer #8
<!-- ========== FOOTER ========== -->
<footer class="container text-center space-2">
<!-- Logo -->
<a class="d-inline-flex align-items-center mb-3" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
<!-- List -->
<ul class="list-inline list-group-flush list-group-borderless">
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/about-agency.html">About</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/services-agency.html">Services</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/careers-listing.html">Careers</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../blog/classic-right-sidebar.html">Blog</a>
</li>
</ul>
<!-- End List -->
<!-- Copyright -->
<p class="small text-muted mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
</footer>
<!-- ========== END FOOTER ========== -->
Footer #9
<!-- ========== FOOTER ========== -->
<footer class="bg-dark">
<div class="container text-center space-2">
<a class="d-inline-flex align-items-center mb-3" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#E1E4EA" opacity=".65" d="M23,41.1L23,41.1c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C41,33,32.9,41.1,23,41.1z"/>
<path class="fill-white" opacity=".5" d="M28,36L28,36c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3C43,0.1,46,3.1,46,6.7v11.4C46,28,38,36,28,36z"/>
<path class="fill-white" opacity=".7" d="M18,46.1L18,46.1c-10,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C35.9,38.1,27.9,46.1,18,46.1z"/>
<path class="fill-primary" d="M17.4,34.1V18.4h10.2v2.9h-6.4v3.4H26v2.9h-4.8v6.5H17.4z"/>
</svg>
<span class="brand brand-light">Front</span>
</a>
<p class="small text-secondary">© Front. 2018 Htmlstream. All rights reserved.</p>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #10
<!-- ========== FOOTER ========== -->
<footer class="position-relative text-center mx-auto">
<!-- Go To Top -->
<a class="js-go-to" href="javascript:;"
data-type="absolute"
data-position='{
"bottom": 86,
"right": 0,
"left": 0
}'
data-compensation="#header"
data-show-effect="slideInUp"
data-hide-effect="slideOutDown">
<!-- SVG Wave Shape -->
<figure class="u-go-to-wave ie-go-to-wave">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 208 44" style="margin-bottom: -32px; enable-background:new 0 0 208 44;" xml:space="preserve">
<path class="fill-primary" d="M0,43c0,0,22.9,2.2,54-18.7S95.1,1.5,95.1,1.5s11.2-3.5,20.1,0.1s10.4,3.7,19.2,9.3c7.7,4.8,15,10.1,22.8,14.9
c10.1,6.2,21.5,11.7,33,14.8C191.6,41,208,44,208,43c0,0,0,1,0,1H0V43z"/>
</svg>
<span class="fas fa-angle-double-up text-white u-go-to-wave__icon"></span>
</figure>
<!-- End SVG Wave Shape -->
</a>
<!-- End Go To Top -->
<div class="bg-primary">
<div class="container space-1">
<p class="small text-white-70 mb-0">© Front. 2018 Htmlstream. All rights reserved.</p>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Front -->
<script src="../../assets/js/components/hs.go-to.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of go to
$.HSCore.components.HSGoTo.init('.js-go-to');
});
</script>
Footer #11
<!-- ========== END FOOTER ========== -->
<footer class="container text-center space-2">
<ul class="list-inline mb-4">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<p class="small text-muted mb-0">© Front. 2018 Htmlstream. All rights reserved.</p>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #12
<!-- ========== FOOTER ========== -->
<footer class="border-top">
<div class="container border-top space-1">
<div class="row justify-content-sm-between">
<div class="col-sm-6 mb-4 mb-sm-0">
<!-- List -->
<ul class="list-inline list-group-flush list-group-borderless">
<li class="list-inline-item pl-0">
<a class="list-group-item-action" href="../pages/help.html">Help</a>
</li>
<li class="list-inline-item pl-3">
<a class="list-group-item-action" href="../pages/contacts.html">Terms</a>
</li>
<li class="list-inline-item pl-3">
<a class="list-group-item-action" href="../pages/privacy.html">Privacy</a>
</li>
</ul>
<!-- End List -->
<!-- Copyright -->
<p class="small text-muted mb-0">© Front. 2018 Htmlstream. All rights reserved.</p>
<!-- End Copyright -->
</div>
<div class="col-sm-6 align-self-sm-end text-sm-right mb-4 mb-sm-0">
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #13
<!-- ========== FOOTER ========== -->
<footer class="bg-primary">
<div class="container space-1">
<div class="row justify-content-between align-items-center">
<div class="col-sm-5 mb-3 mb-sm-0">
<!-- Copyright -->
<p class="small text-white-70 mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
</div>
<div class="col-sm-6 text-sm-right">
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #14
<!-- ========== FOOTER ========== -->
<footer class="container">
<div class="d-flex justify-content-between align-items-center space-1">
<!-- Copyright -->
<p class="small text-muted mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</footer>
<!-- ========== END FOOTER ========== -->
Footer #15
<!-- ========== FOOTER ========== -->
<footer class="container">
<div class="row justify-content-lg-between space-2">
<div class="col-6 col-md-4 col-lg-3 order-lg-2 ml-lg-auto mb-7 mb-lg-0">
<h3 class="h6 font-weight-semi-bold">Account</h3>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="#">Placing an order</a></li>
<li><a class="list-group-item list-group-item-action" href="#">Shipping options</a></li>
<li><a class="list-group-item list-group-item-action" href="#">Tracking a package</a></li>
<li><a class="list-group-item list-group-item-action" href="#">Country availability</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-md-4 col-lg-3 order-lg-3 mb-7 mb-lg-0">
<h3 class="h6 font-weight-semi-bold">Company</h3>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="#">Financing</a></li>
<li><a class="list-group-item list-group-item-action" href="#">Recycling</a></li>
<li><a class="list-group-item list-group-item-action" href="#">Return policy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-md-4 col-lg-2 order-lg-4 mb-7 mb-lg-0">
<h3 class="h6 font-weight-semi-bold">Our Location</h3>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li>
<a class="list-group-item list-group-item-action" href="../pages/help.html">
<span class="media align-items-center">
<span class="fas fa-info-circle mr-3"></span>
<span class="media-body">Help</span>
</span>
</a>
</li>
<li>
<a class="list-group-item list-group-item-action" href="#">
<span class="media align-items-center">
<span class="fas fa-user-circle mr-3"></span>
<span class="media-body">Your Account</span>
</span>
</a>
</li>
<li class="position-relative">
<!-- Country -->
<a id="footerCountryInvokerExample1" class="list-group-item list-group-item-action" href="javascript:;" role="button"
aria-controls="footer-country-example-2"
aria-haspopup="true"
aria-expanded="false"
data-toggle="dropdown"
data-unfold-event="click"
data-unfold-target="#footer-country-example-2"
data-unfold-type="css-animation"
data-unfold-duration="300"
data-unfold-delay="300"
data-unfold-hide-on-scroll="false"
data-unfold-animation-in="slideInUp"
data-unfold-animation-out="fadeOut">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/us.svg" alt="United States Flag">
<span>United States</span>
</a>
<div id="footer-country-example-2" class="dropdown-menu dropdown-unfold dropdown-card dropdown-menu-md-right dropdown-menu-bottom" aria-labelledby="footerCountryInvokerExample1">
<div class="card">
<!-- Body -->
<div class="card-body p-5">
<h4 class="h6 font-weight-semi-bold">Front available in</h4>
<div class="row">
<div class="col-6">
<!-- List Group -->
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/au.svg" alt="Australia Flag">
Australia
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/at.svg" alt="Austria Flag">
Austria
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/be.svg" alt="Belgium Flag">
Belgium
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/ca.svg" alt="Canada Flag">
Canada
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/dk.svg" alt="Denmark Flag">
Denmark
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/fi.svg" alt="Finland Flag">
Finland
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/fr.svg" alt="France Flag">
France
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/de.svg" alt="Germany Flag">
Germany
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/nl.svg" alt="Netherlands Flag">
Netherlands
</a>
<!-- End List Group -->
</div>
<div class="col-6">
<!-- List Group -->
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/nz.svg" alt="New Zealand Flag">
New Zealand
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/no.svg" alt="Norway Flag">
Norway
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/pt.svg" alt="PortugalPREVIEW Flag">
Portugal
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/sg.svg" alt="Singapore Flag">
Singapore
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/es.svg" alt="Spain Flag">
Spain
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/se.svg" alt="Sweden Flag">
Sweden
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/ch.svg" alt="Switzerland Flag">
Switzerland
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/gb.svg" alt="United Kingdom Flag">
UK
</a>
<a class="list-group-item list-group-item-action active " href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/us.svg" alt="United States Flag">
US
</a>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Body -->
<!-- Footer -->
<a class="card-footer card-bg-light p-5" href="#">
<span class="d-block text-muted mb-1">More countries coming soon.</span>
<small class="d-block">Signup to get notified <span class="fas fa-arrow-right small"></span></small>
</a>
<!-- End Footer -->
</div>
</div>
<!-- End Country -->
</li>
</ul>
<!-- End List Group -->
</div>
<div class="col-lg-3 order-lg-1">
<div class="d-flex align-items-start flex-column h-100">
<!-- Logo -->
<a class="d-flex align-items-center mb-lg-auto" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
<!-- Copyright -->
<p class="small text-muted mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
</div>
</div>
</div>
<hr class="my-0">
<div class="row align-items-md-center space-1">
<div class="col-md-4 mb-4 mb-lg-0">
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
<div class="col-md-8 text-md-right">
<!-- Links -->
<ul class="list-inline list-group-flush list-group-borderless mb-0">
<li class="list-inline-item pl-3">
<a class="list-group-item-action font-size-1" href="../pages/privacy.html">Privacy & policy</a>
</li>
<li class="list-inline-item pl-3">
<a class="list-group-item-action font-size-1" href="../pages/terms.html">Terms & conditions</a>
</li>
<li class="list-inline-item pl-3">
<a class="list-group-item-action font-size-1" href="../pages/careers.html">Careers</a>
</li>
</ul>
<!-- End Links -->
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Front -->
<script src="../../assets/js/components/hs.unfold.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of unfold component
$.HSCore.components.HSUnfold.init($('[data-unfold-target]'));
});
</script>
Footer #16
<!-- ========== FOOTER ========== -->
<footer class="gradient-half-primary-v4">
<div class="container">
<!-- CTA -->
<div class="row justify-content-lg-between align-items-md-center space-2">
<div class="col-md-6 col-lg-5 mb-5 mb-md-0">
<h3 class="text-white font-weight-medium mb-1">Ready to get started?</h3>
<p class="text-white-70 mb-0">Create your account and find your dream job.</p>
</div>
<div class="col-md-6 col-lg-5 text-md-right">
<a class="btn btn-success btn-wide transition-3d-hover mb-1 mb-sm-0 mr-sm-1" href="../pages/signup-simple.html">Sign Up</a>
<a class="btn text-primary btn-white btn-wide transition-3d-hover mb-1 mb-sm-0" href="#">Learn More</a>
</div>
</div>
<!-- End CTA -->
<hr class="opacity-md my-0">
<div class="row justify-content-md-between space-2">
<div class="col-6 col-sm-4 col-lg-2 order-lg-2 mb-7 mb-lg-0">
<h4 class="h6 text-white">Account</h4>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/html/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/html/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/html/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/html/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-sm-4 col-lg-2 order-lg-3 mb-7 mb-lg-0">
<h4 class="h6 text-white">Company</h4>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/html/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/html/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/html/careers.html">Careers</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/html/grid-right-sidebar.html">Blog</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-4 col-lg-2 order-lg-4 mb-7 mb-lg-0">
<h4 class="h6 text-white">Resources</h4>
<!-- List Group -->
<ul class="list-group list-group-transparent list-group-white list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/html/contacts-agency.html">Contacts</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/html/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/html/terms.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/html/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-6 col-md-5 col-lg-3 order-lg-5 mb-6 mb-sm-0">
<h4 class="h6 text-white">Events</h4>
<!-- Events Group -->
<ul class="list-unstyled mt-3 mb-0">
<li class="mb-3">
<a class="d-block bg-primary text-white shadow-primary-lg rounded-pill p-1" href="#">
<div class="media align-items-center">
<span class="u-label u-label--sm u-label--white font-weight-semi-bold mr-2">23/05</span>
<div class="media-body">
<span class="font-size-1">Technical Hiring</span>
</div>
</div>
</a>
</li>
<li class="mb-3">
<a class="d-block bg-primary text-white shadow-primary-lg rounded-pill p-1" href="#">
<div class="media align-items-center">
<span class="u-label u-label--sm u-label--white font-weight-semi-bold mr-2">01/06</span>
<div class="media-body">
<span class="font-size-1">Networking Event</span>
</div>
</div>
</a>
</li>
</ul>
<!-- End Events -->
</div>
<div class="col-sm-6 col-md-5 col-lg-3 order-lg-1">
<div class="d-flex align-self-start flex-column h-100">
<!-- Logo -->
<a class="d-flex align-items-center mb-3" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#E1E4EA" opacity=".65" d="M23,41.1L23,41.1c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C41,33,32.9,41.1,23,41.1z"/>
<path class="fill-white" opacity=".5" d="M28,36L28,36c-9.9,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3C43,0.1,46,3.1,46,6.7v11.4C46,28,38,36,28,36z"/>
<path class="fill-white" opacity=".7" d="M18,46.1L18,46.1c-10,0-18-8-18-18l0,0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6v11.4C35.9,38.1,27.9,46.1,18,46.1z"/>
<path class="fill-primary" d="M17.4,34.1V18.4h10.2v2.9h-6.4v3.4H26v2.9h-4.8v6.5H17.4z"/>
</svg>
<span class="brand brand-light">Front</span>
</a>
<!-- End Logo -->
<!-- Country -->
<div class="position-relative">
<a id="footerCountryInvokerExample2" class="dropdown-nav-link text-white-70" href="javascript:;" role="button"
aria-controls="footer-country-example-3"
aria-haspopup="true"
aria-expanded="false"
data-toggle="dropdown"
data-unfold-event="click"
data-unfold-target="#footer-country-example-3"
data-unfold-type="css-animation"
data-unfold-duration="300"
data-unfold-delay="300"
data-unfold-hide-on-scroll="false"
data-unfold-animation-in="slideInUp"
data-unfold-animation-out="fadeOut">
<img class="dropdown-item-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/us.svg" alt="United States Flag">
<span>United States</span>
</a>
<div id="footer-country-example-3" class="dropdown-menu dropdown-unfold dropdown-card dropdown-menu-bottom" aria-labelledby="footerCountryInvokerExample2">
<div class="card">
<!-- Body -->
<div class="card-body list-group list-group-flush list-group-borderless p-5">
<h4 class="h6 font-weight-semi-bold">Front available in</h4>
<div class="row">
<div class="col-6">
<!-- List Group -->
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/au.svg" alt="Australia Flag">
Australia
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/at.svg" alt="Austria Flag">
Austria
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/be.svg" alt="Belgium Flag">
Belgium
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/ca.svg" alt="Canada Flag">
Canada
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/dk.svg" alt="Denmark Flag">
Denmark
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/fi.svg" alt="Finland Flag">
Finland
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/fr.svg" alt="France Flag">
France
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/de.svg" alt="Germany Flag">
Germany
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/nl.svg" alt="Netherlands Flag">
Netherlands
</a>
<!-- End List Group -->
</div>
<div class="col-6">
<!-- List Group -->
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/nz.svg" alt="New Zealand Flag">
New Zealand
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/no.svg" alt="Norway Flag">
Norway
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/pt.svg" alt="PortugalPREVIEW Flag">
Portugal
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/sg.svg" alt="Singapore Flag">
Singapore
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/es.svg" alt="Spain Flag">
Spain
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/se.svg" alt="Sweden Flag">
Sweden
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/ch.svg" alt="Switzerland Flag">
Switzerland
</a>
<a class="list-group-item list-group-item-action" href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/gb.svg" alt="United Kingdom Flag">
UK
</a>
<a class="list-group-item list-group-item-action active " href="#">
<img class="list-group-icon" src="../../assets/vendor/flag-icon-css/flags/4x3/us.svg" alt="United States Flag">
US
</a>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Body -->
<!-- Footer -->
<a class="card-footer card-bg-light p-5" href="#">
<span class="d-block text-muted mb-1">More countries coming soon.</span>
<small class="d-block">Signup to get notified <span class="fas fa-arrow-right small"></span></small>
</a>
<!-- End Footer -->
</div>
</div>
</div>
<!-- End Country -->
<!-- Copyright -->
<p class="small text-white-70 mt-lg-auto mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
</div>
</div>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Front -->
<script src="../../assets/js/components/hs.unfold.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of unfold component
$.HSCore.components.HSUnfold.init($('[data-unfold-target]'));
});
</script>
Footer #17
<!-- ========== FOOTER ========== -->
<footer class="border-top">
<div class="container">
<div class="border-bottom">
<div class="row justify-content-lg-between space-2">
<div class="col-6 col-sm-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6">Account</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-sm-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6">Company</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/grid-right-sidebar.html">Blog</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6">Resources</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/contacts-agency.html">Contacts</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/terms.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-md-7 col-lg-5">
<div class="mb-4">
<h4 class="h6">Get latest news in your box!</h4>
<p class="font-size-1">Get special offers and deals. Never spam.</p>
</div>
<!-- Subscribe Form -->
<form class="js-validate js-focus-state js-form-message">
<label class="sr-only" for="subscribeSrEmailExample1">Your email address</label>
<div class="input-group">
<input type="email" class="form-control" name="email" id="subscribeSrEmailExample1" placeholder="Your email address" aria-label="Your email address" aria-describedby="subscribeButtonExample3" required
data-msg="Please enter a valid email address."
data-error-class="u-has-error"
data-success-class="u-has-success">
<div class="input-group-append">
<button class="btn btn-primary" type="button" id="subscribeButtonExample3">Subscribe</button>
</div>
</div>
</form>
<!-- End Subscribe Form -->
</div>
</div>
</div>
<div class="text-center py-7">
<!-- Copyright -->
<p class="small text-muted mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/jquery-validation/dist/jquery.validate.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.validation.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of form validation
$.HSCore.components.HSValidation.init('.js-validate');
});
</script>
Footer #18
<!-- ========== FOOTER ========== -->
<footer id="SVGfooterTopShape" class="svg-preloader position-relative gradient-half-primary-v5">
<div class="container space-top-4 space-bottom-2">
<!-- Title -->
<div class="w-md-80 w-lg-50 text-center mx-md-auto mb-5">
<h2 class="text-white">Ready to <strong class="font-weight-semi-bold">get started?</strong></h2>
<p class="text-white-70 mb-0">Want to see Front in action? Get started with Front for instant experience:</p>
</div>
<!-- End Title -->
<!-- Form -->
<form class="js-validate w-lg-80 mx-lg-auto">
<div class="row mx-gutters-2">
<div class="col-6 col-sm mb-2">
<div class="js-form-message">
<label class="sr-only" for="signupSrName">Name</label>
<div class="input-group input-group-borderless">
<input type="text" class="form-control" name="name" id="signupSrName" placeholder="Name" aria-label="Name" required
data-msg="Name must contain only letters.">
</div>
</div>
</div>
<div class="col-6 col-sm mb-2">
<div class="js-form-message">
<label class="sr-only" for="signupSrEmail">Email</label>
<div class="input-group input-group-borderless">
<input type="email" class="form-control" name="email" id="signupSrEmail" placeholder="Email" aria-label="Email" required
data-msg="Please enter a valid email address.">
</div>
</div>
</div>
<div class="col-sm mb-2">
<button type="submit" class="btn btn-block btn-success transition-3d-hover">Get Started</button>
</div>
</div>
</form>
<!-- End Form -->
<hr class="opacity-md my-7">
<div class="row align-items-lg-center">
<div class="col-lg-3 mb-4 mb-lg-0">
<!-- Copyright -->
<p class="small text-white-70 mb-0">© Front. 2018 Htmlstream.</p>
<!-- End Copyright -->
</div>
<div class="col-md-8 col-lg-6 mb-4 mb-md-0">
<!-- List -->
<ul class="list-inline list-group-transparent list-group-white list-group-flush list-group-borderless text-lg-center mb-0">
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/about-agency.html">About</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/services-agency.html">Services</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../pages/careers-listing.html">Careers</a>
</li>
<li class="list-inline-item px-2">
<a class="list-group-item-action" href="../blog/classic-right-sidebar.html">Blog</a>
</li>
</ul>
<!-- End List -->
</div>
<div class="col-md-4 col-lg-3">
<!-- Social Networks -->
<ul class="list-inline text-md-right mb-0">
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light rounded" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light rounded" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light rounded" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-sm btn-icon btn-soft-light rounded" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
</div>
<!-- SVG Wave Shape -->
<figure class="position-absolute top-0 right-0 left-0">
<img class="js-svg-injector" src="../../assets/svg/components/wave-1-top-sm.svg" alt="Image Description"
data-parent="#SVGfooterTopShape">
</figure>
<!-- End SVG Wave Shape -->
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<script src="../../assets/vendor/jquery-validation/dist/jquery.validate.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<script src="../../assets/js/components/hs.validation.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
// initialization of form validation
$.HSCore.components.HSValidation.init('.js-validate');
});
</script>
Footer #19
<!-- ========== FOOTER ========== -->
<footer id="SVGwave7BottomShape" class="svg-preloader position-relative border-top">
<!-- Lists -->
<div class="container space-2">
<!-- Logo -->
<a class="d-inline-flex align-items-center mb-5" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
<div class="row">
<div class="col-sm-6 col-lg-4 mb-7 mb-sm-0">
<div class="mb-4">
<h2>Ready to make<br><strong class="text-primary">something amazing?</strong></h2>
</div>
<a class="btn btn-primary btn-sm transition-3d-hover" href="https://themes.getbootstrap.com/product/front-multipurpose-responsive-template/" target="_blank">Start a New Project</a>
</div>
<div class="col-sm-3 col-lg-2 mb-4 mb-sm-0 ml-lg-auto">
<h4 class="h6 font-weight-semi-bold">About</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers <span class="badge badge-success badge-pill ml-1">We're hiring</span></a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/hire-us.html">Hire us</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-3 col-lg-2">
<h4 class="h6 font-weight-semi-bold">Resources</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Help</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/terms.html">Terms</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy</a></li>
</ul>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Lists -->
<!-- Social Networks -->
<div class="container space-1">
<div class="row justify-content-end">
<div class="col-md-5 text-right">
<ul class="list-inline mb-0">
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-instagram btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-behance btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary btn-bg-transparent" href="#">
<span class="fab fa-dribbble btn-icon__inner"></span>
</a>
</li>
</ul>
</div>
</div>
</div>
<!-- End Social Networks -->
<!-- SVG Shape -->
<figure class="ie-wave-7-bottom w-80 w-md-65 w-lg-50 position-absolute bottom-0 left-0 z-index-n1">
<img class="js-svg-injector" src="../../assets/svg/components/wave-7-bottom.svg" alt="Image Description"
data-parent="#SVGwave7BottomShape">
</figure>
<!-- End SVG Shape -->
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
</script>
Footer #20
<!-- ========== FOOTER ========== -->
<footer class="container">
<div class="border-bottom space-2">
<div class="row justify-content-lg-between">
<div class="col-6 col-sm-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6">Account</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../account/dashboard.html">Account</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/my-tasks.html">My tasks</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/projects.html">Projects</a></li>
<li><a class="list-group-item list-group-item-action" href="../account/invite-friends.html">Invite friends</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-6 col-sm-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6">Company</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/services-agency.html">Services</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers <span class="badge badge-success badge-pill ml-1">We're hiring</span></a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-4 col-lg-2 mb-7 mb-lg-0">
<h4 class="h6">Community</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="#">Meetups</a></li>
<li>
<a class="list-group-item list-group-item-action" href="#">
<span class="fab fa-facebook text-primary mr-2"></span>
Facebook
</a>
</li>
<li>
<a class="list-group-item list-group-item-action" href="#">
<span class="fab fa-twitter text-primary mr-2"></span>
Twitter
</a>
</li>
<li>
<a class="list-group-item list-group-item-action" href="#">
<span class="fab fa-behance text-primary mr-2"></span>
Behance
</a>
</li>
</ul>
<!-- End List Group -->
</div>
<div class="col-lg-5 text-right">
<!-- Contacts -->
<div class="mb-7">
<span class="h1 font-weight-semi-bold">contact us</span>
<small class="d-block font-weight-medium">call us: <span class="text-secondary font-weight-normal">+1 (062) 109-9222</span></small>
<small class="d-block font-weight-medium">email us: <a class="font-weight-normal" href="mailto:support@htmlstream.com">support@htmlstream.com</a></small>
</div>
<!-- End Contacts -->
<!-- Subscribe Form -->
<form class="js-validate js-focus-state js-form-message mb-2">
<label class="sr-only" for="subscribeSrEmailExample3">Your email address</label>
<div class="input-group">
<input type="email" class="form-control" name="email" id="subscribeSrEmailExample3" placeholder="Your email address" aria-label="Your email address" aria-describedby="subscribeButtonExample1" required
data-msg="Please enter a valid email address."
data-error-class="u-has-error"
data-success-class="u-has-success">
<div class="input-group-append">
<button class="btn btn-primary" type="button" id="subscribeButtonExample1">Subscribe</button>
</div>
</div>
</form>
<!-- End Subscribe Form -->
<p class="font-size-1 mb-0">Get special offers and deals. Never spam.</p>
</div>
</div>
</div>
<div class="row justify-content-sm-between align-items-md-center py-7">
<div class="col-sm-8 mb-4 mb-sm-0">
<!-- List -->
<ul class="list-inline list-group-flush list-group-borderless font-size-1 mb-0">
<li class="list-inline-item pl-0">
© Front. 2018 Htmlstream.
</li>
<li class="list-inline-item">
<a class="link-muted" href="../pages/help.html">Help</a>
</li>
<li class="list-inline-item">
<a class="link-muted" href="../pages/contacts.html">Terms</a>
</li>
<li class="list-inline-item">
<a class="link-muted" href="../pages/privacy.html">Privacy</a>
</li>
</ul>
<!-- End List -->
</div>
<div class="col-sm-4 text-sm-right">
<!-- Logo -->
<a class="d-inline-flex align-items-center" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<script src="../../assets/vendor/jquery-validation/dist/jquery.validate.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<script src="../../assets/js/components/hs.validation.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
// initialization of form validation
$.HSCore.components.HSValidation.init('.js-validate');
});
</script>
Footer #21
<!-- ========== FOOTER ========== -->
<footer class="border-top">
<div class="container space-2">
<div class="row">
<div class="col-sm-3 col-lg-2 order-sm-2 mb-4 mb-sm-0 ml-lg-auto">
<h4 class="h6 font-weight-semi-bold">About</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/about-agency.html">About</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/careers.html">Careers <span class="badge badge-success badge-pill ml-1">We're hiring</span></a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-3 col-lg-2 order-sm-3 mb-4 mb-sm-0">
<h4 class="h6 font-weight-semi-bold">Resources</h4>
<!-- List Group -->
<ul class="list-group list-group-flush list-group-borderless mb-0">
<li><a class="list-group-item list-group-item-action" href="../pages/help.html">Need help?</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/terms.html">Terms of Service</a></li>
<li><a class="list-group-item list-group-item-action" href="../pages/privacy.html">Privacy Policy</a></li>
</ul>
<!-- End List Group -->
</div>
<div class="col-sm-6 col-lg-4 order-sm-1">
<!-- Logo -->
<a class="d-inline-flex align-items-center mb-2" href="index.html" aria-label="Front">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="36px" height="36px" viewBox="0 0 46 46" xml:space="preserve" style="margin-bottom: 0;">
<path fill="#3F7DE0" opacity=".65" d="M23,41L23,41c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18h11.3C38,5,41,8,41,11.7V23C41,32.9,32.9,41,23,41z"/>
<path class="fill-info" opacity=".5" d="M28,35.9L28,35.9c-9.9,0-18-8-18-18v0c0-9.9,8-18,18-18l11.3,0C43,0,46,3,46,6.6V18C46,27.9,38,35.9,28,35.9z"/>
<path class="fill-primary" opacity=".7" d="M18,46L18,46C8,46,0,38,0,28v0c0-9.9,8-18,18-18h11.3c3.7,0,6.6,3,6.6,6.6V28C35.9,38,27.9,46,18,46z"/>
<path class="fill-white" d="M17.4,34V18.3h10.2v2.9h-6.4v3.4h4.8v2.9h-4.8V34H17.4z"/>
</svg>
<span class="brand brand-primary">Front</span>
</a>
<!-- End Logo -->
<div class="mb-4">
<p class="small text-muted">© Front. 2018 Htmlstream. All rights reserved.</p>
</div>
<!-- Social Networks -->
<ul class="list-inline mb-0">
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary rounded-circle" href="#">
<span class="fab fa-facebook-f btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary rounded-circle" href="#">
<span class="fab fa-google btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary rounded-circle" href="#">
<span class="fab fa-twitter btn-icon__inner"></span>
</a>
</li>
<li class="list-inline-item mx-0">
<a class="btn btn-sm btn-icon btn-soft-secondary rounded-circle" href="#">
<span class="fab fa-github btn-icon__inner"></span>
</a>
</li>
</ul>
<!-- End Social Networks -->
</div>
</div>
</div>
</footer>
<!-- ========== END FOOTER ========== -->