File size: 30.64Kb
<!DOCTYPE html>
<!--[if lt IE 10]> <html lang="en" class="iex"> <![endif]-->
<!--[if (gt IE 10)|!(IE)]><!-->
<html lang="en">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Square | Home | Structura</title>
<meta name="description" content="Multipurpose HTML template.">
<link rel="stylesheet" href="../HTWF/scripts/bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="../HTWF/style.css">
<link rel="stylesheet" href="../HTWF/css/content-box.css">
<link rel="stylesheet" href="../HTWF/css/image-box.css">
<link rel="stylesheet" href="../HTWF/css/animations.css">
<link rel="stylesheet" href="../HTWF/css/components.css">
<link rel="stylesheet" href="../HTWF/scripts/flexslider/flexslider.css">
<link rel="stylesheet" href="../HTWF/scripts/magnific-popup.css">
<link rel="stylesheet" href="../HTWF/scripts/php/contact-form.css">
<link rel="stylesheet" href="../HTWF/scripts/social.stream.css">
<link rel="stylesheet" href="../skin.css">
<link rel="icon" href="../images/favicon.png">
</head>
<body class="background-lines" data-spy="scroll" data-target="#menu" data-offset="250">
<div id="preloader"></div>
<div id="home" class="section-bg-image parallax-window" data-natural-height="1000" data-natural-width="1920" data-parallax="scroll" data-image-src="../images/bg-5.png">
<div class="container content">
<div class="navbar navbar-inner scroll-change menu-inner-side">
<div class="navbar-toggle"><i class="fa fa-bars"></i><span>Menu</span><i class="fa fa-angle-down"></i></div>
<div class="collapse navbar-collapse">
<ul id="menu" class="nav navbar-nav inner ms-minimal">
<li class="current-active active"><a href="#home">Home</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#skills">Skills</a></li>
<li><a href="#team">Team</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#contacts">Contacts</a></li>
</ul>
</div>
</div>
<hr class="space" />
<div class="row" data-anima="fade-bottom">
<div class="col-md-4">
<h2 class="text-xxl font-1">
Do things that matter
</h2>
</div>
<div class="col-md-4">
<p>
Lorem ipsum dolor sit amet consectetur adipiscing elitsed do eiusmod tempor incididunt utlabore et dolore magna aliqua.
Utenim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariature.
</p>
<hr class="space m" />
<a href="#" class="btn-bor der btn btn-sm">Get promotions</a>
</div>
<div class="col-md-4">
</div>
</div>
<hr class="space m" />
<hr class="space" />
<div class="row">
<div class="col-md-8">
<h2 class="text-xl" data-anima="fade-bottom">
Start think<br />different
</h2>
<hr class="space m" />
<div class="row" data-anima="fade-bottom">
<div class="col-md-6">
<p class="text-s">
Lorem ipsum dolor sit amet consectetur adipiscing elitsed do eiusmod tempor incididunt utlabore et dolore magna aliqua.
Utenim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum.
</p>
</div>
<div class="col-md-6">
<p class="text-s">
Lorem ipsum dolor sit amet consectetur adipiscing elitsed do eiusmod tempor incididunt utlabore et dolore magna aliqua.
Utenim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate.
</p>
</div>
</div>
<hr class="space m" />
<a href="#" class="btn-border btn btn-sm">Explore now</a>
</div>
<div class="col-md-4">
</div>
</div>
</div>
</div>
<div class="section-empty">
<div class="container content">
<div class="flexslider carousel outer-navs" data-options="minWidth:200,itemMargin:60,numItems:3,controlNav:false,directionNav:true">
<ul class="slides">
<li>
<a class="img-box lightbox" data-lightbox-anima="fade-top" href="http://via.placeholder.com/800x600">
<img src="http://via.placeholder.com/800x600" alt="">
</a>
</li>
<li>
<a class="img-box lightbox" data-lightbox-anima="fade-top" href="http://via.placeholder.com/800x600">
<img src="http://via.placeholder.com/800x600" alt="">
</a>
</li>
<li>
<a class="img-box lightbox" data-lightbox-anima="fade-top" href="http://via.placeholder.com/800x600">
<img src="http://via.placeholder.com/800x600" alt="">
</a>
</li>
<li>
<a class="img-box lightbox" data-lightbox-anima="fade-top" href="http://via.placeholder.com/800x600">
<img src="http://via.placeholder.com/800x600" alt="">
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="services" class="section-bg-image parallax-window" data-natural-height="1000" data-natural-width="1920" data-parallax="scroll" data-image-src="../images/bg-6.png">
<div class="container content">
<div class="row" data-anima="fade-bottom">
<div class="col-md-4 hidden-sm"></div>
<div class="col-md-4 col-sm-12">
<h2 class="text-xl">Services ready for you</h2>
</div>
<div class="col-md-4 col-sm-12">
<p>
Lorem ipsum dolor sit amet consectetur adipiscing elitsed exercia atation ullamco laboris eiusmod tempor incididunt utlabore
et dolore magna aliqunisi aboris nisi ut aliquipo.
</p>
</div>
</div>
<hr class="space l" />
<div class="row proporzional-row" data-anima="fade-bottom">
<div class="col-md-4 hidden-sm"></div>
<div class="col-md-4 background-dots background-white boxed-inverse col-sm-12">
<div class="icon-box">
<div class="icon-box-cell">
<i class="im-leafs text-l"></i>
</div>
<div class="icon-box-cell">
<label class="text-m">Hard work</label>
<p class="text-s">Lorem ipsum dolore exercia atation ullamco labori</p>
</div>
</div>
<hr class="space m" />
<div class="icon-box ">
<div class="icon-box-cell">
<i class="im-laptop-3 text-l"></i>
</div>
<div class="icon-box-cell">
<label class="text-m">Passion</label>
<p class="text-s">Arnila ipsume exercia atation ullamco labori marcio coloso</p>
</div>
</div>
</div>
<div class="col-md-4 middle-content middle-bottom-left col-sm-12">
<a href="#" class="btn btn-sm">See all services</a>
</div>
</div>
<hr class="space l" />
<div class="row" data-anima="fade-bottom">
<div class="col-md-4 hidden-sm"></div>
<div class="col-md-4 col-sm-12">
<p>
Lorem ipsum dolor sit amet consectetur adipiscing elitsed exercia atation ullamco laboris eiusmod tempor incididunt utlabore
et dolore magna labiro artono nisi ut aliquip exeao commodo. Aipsum dolor sit amet consectetur adipiscing elitsed exercia atation ullamco.
</p>
</div>
<div class="col-md-4 col-sm-12">
<table class="table text-s">
<thead>
<tr>
<th>#</th>
<th>Service</th>
<th>Description</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Travel tips</td>
<td>Lorem ipsumo</td>
<td>$60</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Freelancing</td>
<td>Lorem consecte</td>
<td>$20</td>
</tr>
<tr>
<th scope="row">3</th>
<td>Ensurance</td>
<td>Ariele artosio</td>
<td>$50</td>
</tr>
<tr>
<th scope="row">4</th>
<td>Investments</td>
<td>Perio maestro</td>
<td>$20</td>
</tr>
<tr>
<th scope="row">5</th>
<td>Networking</td>
<td>Rebecco ipsum</td>
<td>$20</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div id="skills" class="section-empty">
<div class="container content">
<h2 class="text-center text-xl" data-anima="fade-bottom">Skills</h2>
<hr class="space s" />
<p class="text-center" data-anima="fade-bottom">What we do, we are to do well or not at all.</p>
<hr class="space l" />
<div class="row" data-anima="fade-bottom" data-timeline="asc">
<div class="col-md-4 anima">
<h3 class="text-black">Web</h3>
<hr class="space s" />
<p>
Wordpress Theme Development<br>
PHP/MySQL<br>
SASS/LESS<br>
Bower, Composer, Gulp, Grunt<br>
Laravel<br>
Angular
</p>
</div>
<div class="col-md-4 anima">
<h3 class="text-black">Design & Print</h3>
<hr class="space s" />
<p>
UX/UI Design<br>
Photoshop<br>
Illustrator<br>
Brand Collateral<br>
Label/Packaging<br>
Traditional arts
</p>
</div>
<div class="col-md-4 anima">
<h3 class="text-black">Misc</h3>
<hr class="space s" />
<p>
Drawing<br>
Making sandwiches<br>
Problem Solving<br>
Unsolicited Criticism (Receiving and Giving)<br>
Complicating my own life<br>
Talk to the strangers
</p>
</div>
</div>
</div>
</div>
<div class="section-bg-image parallax-window" data-bleed="0" data-natural-height="601" data-natural-width="1920" data-parallax="scroll" data-image-src="http://via.placeholder.com/1920x601">
<div class="container content">
<hr class="space m" />
<div class="flexslider carousel png-over outer-navs" data-options="minWidth:200,itemMargin:30,numItems:5,controlNav:false,directionNav:true">
<ul class="slides">
<li>
<img src="../images/logos/logo_1b.png" alt="logo" />
</li>
<li>
<img src="../images/logos/logo_2b.png" alt="logo" />
</li>
<li>
<img src="../images/logos/logo_3b.png" alt="logo" />
</li>
<li>
<img src="../images/logos/logo_4b.png" alt="logo" />
</li>
<li>
<img src="../images/logos/logo_5b.png" alt="logo" />
</li>
<li>
<img src="../images/logos/logo_1b.png" alt="logo" />
</li>
</ul>
</div>
<hr class="space m" />
</div>
</div>
<div id="team" class="section-empty bg-transparent">
<div class="container content">
<div class="row">
<div class="col-md-4 col-sm-12">
<h2 class="text-xl">Amazing team</h2>
<hr class="space hidden-sm" />
<a href="#" class="btn btn-sm">All members</a>
<hr class="space m visible-sm" />
</div>
<div class="col-md-4 col-sm-6">
<a data-anima="fade-in" class="img-box lightbox adv-circle circle adv-circle-center-2" href="#">
<i class="fa fa-scissors"></i>
<img src="http://via.placeholder.com/250x250" alt="" />
<div class="caption anima">
<div class="inner">
<h2>Malissa Rodrigue</h2>
<p>Sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
</a>
<hr class="space l" />
<h2 class="text-xxl font-1">
Join the team
</h2>
</div>
<div class="col-md-4 col-sm-6">
<hr class="space hidden-sm" />
<hr class="space" />
<a data-anima="fade-in" class="img-box lightbox adv-circle circle adv-circle-center-2" href="#">
<i class="fa fa-scissors"></i>
<img src="http://via.placeholder.com/250x250" alt="" />
<div class="caption anima">
<div class="inner">
<h2>Jessica Swarosky</h2>
<p>Sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
<div id="portfolio" class="section-empty bg-transparent">
<div class="container content">
<div class="row">
<div class="col-md-8">
<div class="maso-list gallery">
<div class="navbar navbar-inner">
<div class="navbar-toggle"><i class="fa fa-bars"></i><span>Menu</span><i class="fa fa-angle-down"></i></div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav over ms-minimal inner maso-filters">
<li class="current-active active"><a data-filter="maso-item">All</a></li>
<li><a data-filter="cat1">Arts</a></li>
<li><a data-filter="cat2">Urban</a></li>
<li><a data-filter="cat3">Creative</a></li>
<li><a class="maso-order" data-sort="asc"><i class="fa fa-arrow-down"></i></a></li>
</ul>
</div>
</div>
<div class="maso-box row">
<div data-sort="1" class="maso-item col-md-6 cat1 cat2">
<div class="advs-box advs-box-top-icon-img boxed-inverse">
<a class="img-box lightbox img-scale-up" href="#">
<span><img src="../images/gallery/image-1.jpg" alt=""></span>
</a>
<div class="advs-box-content">
<h3>Retro artisans</h3>
<p>
Lorem ipsum dolor sit amet consectetur adipiscing elitsed do eiusmod tempo.
</p>
</div>
</div>
</div>
<div data-sort="1" class="maso-item col-md-6 cat2">
<div class="advs-box advs-box-top-icon-img boxed-inverse">
<a class="img-box lightbox img-scale-up" href="#">
<span><img src="http://via.placeholder.com/800x600" alt=""></span>
</a>
<div class="advs-box-content">
<h3>Performance lights</h3>
<p>
Interdum iusto pulvinar consequuntur augue optio, repellat fuga! Purus expedita fusco.
</p>
</div>
</div>
</div>
<div data-sort="1" class="maso-item col-md-6 cat1 cat3">
<div class="advs-box advs-box-top-icon-img boxed-inverse">
<a class="img-box lightbox img-scale-up" href="#">
<span><img src="http://via.placeholder.com/800x600" alt=""></span>
</a>
<div class="advs-box-content">
<h3>The lighting start</h3>
<p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia.
</p>
</div>
</div>
</div>
<div data-sort="1" class="maso-item col-md-6 cat1 cat2">
<div class="advs-box advs-box-top-icon-img boxed-inverse">
<a class="img-box lightbox img-scale-up" href="#">
<span><img src="http://via.placeholder.com/800x600" alt=""></span>
</a>
<div class="advs-box-content">
<h3>Secret decors</h3>
<p>
Interdum iusto pulvinar consequuntur augue optio, repellat fuga! Purus expedita fusco.
</p>
</div>
</div>
</div>
<div data-sort="1" class="maso-item col-md-6 cat2">
<div class="advs-box advs-box-top-icon-img boxed-inverse">
<a class="img-box lightbox img-scale-up" href="#">
<span><img src="http://via.placeholder.com/800x600" alt=""></span>
</a>
<div class="advs-box-content">
<h3>Queens and hourses</h3>
<p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia.
</p>
</div>
</div>
</div>
<div data-sort="1" class="maso-item col-md-6 cat2 cat3">
<div class="advs-box advs-box-top-icon-img boxed-inverse">
<a class="img-box lightbox img-scale-up" href="#">
<span><img src="http://via.placeholder.com/800x600" alt=""></span>
</a>
<div class="advs-box-content">
<h3>Old fashion celebration</h3>
<p>
Interdum iusto pulvinar consequuntur augue optio, repellat fuga! Purus expedita fusco.
</p>
</div>
</div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<div class="col-md-4">
<hr class="space m visible-xs" />
<h2 class="text-xl">Portfolio</h2>
<hr class="space m" />
<p>
Lorem ipsum dolor sit amet consectetur adipiscing elitsed do eiusmod tempor incididunt utlabore et dolore magna aliqua.
Utenim ad minim veniam quis nostrud exercitation ullamco.
</p>
<hr class="space m" />
<div class="counter-box-simple"><span class="counter text-xl" data-to="520"></span><span class="text-m"> Works</span></div>
<div class="counter-box-simple"><span class="counter text-xl" data-to="700"></span><span class="text-m"> Clients</span></div>
<hr class="space" />
<a href="#" class="btn btn-sm">All projects</a>
</div>
</div>
</div>
</div>
<div class="section-empty no-paddings">
<div class="content">
<div class="google-map row-13 shadow" data-marker-pos-top="50" data-coords="40.741895,-73.989308" data-skin="gray" data-marker="http://templates.framework-y.com/structura/images/marker-map-4.png"></div>
</div>
</div>
<div id="contacts" class="section-empty background-lines">
<div class="container content">
<div class="row" data-anima="fade-bottom">
<div class="col-md-4">
<h2 class="text-xl">We're friendly & lovely pets</h2>
<hr class="space m" />
<ul class="fa-ul">
<li>
<i class="fa-li im-home"></i>
Sturlly, PO 16122, Collins Street West
</li>
<li><i class="fa-li im-phone"></i> (123) 0 123 455669</li>
<li><i class="fa-li im-envelope"></i> example@company.com</li>
<li><i class="fa-li im-envelope"></i> example@company.com</li>
</ul>
</div>
<div class="col-md-2">
</div>
<div class="col-md-6">
<hr class="space s" />
<form action="http://www.framework-y.com/scripts/php/contact-form.php" class="form-box form-ajax" method="post">
<div class="row">
<div class="col-md-4">
<p>Your name</p>
<input id="name" name="name" placeholder="" type="text" class="form-control form-value" required>
</div>
<div class="col-md-4">
<p>Email</p>
<input id="email" name="email" placeholder="" type="email" class="form-control form-value" required>
</div>
<div class="col-md-4">
<p>Phone number</p>
<input id="phone" name="phone" placeholder="" type="text" class="form-control form-value">
</div>
</div>
<hr class="space xs" />
<p>Your message</p>
<textarea id="messagge" name="messagge" placeholder="" class="form-control form-value" required></textarea>
<hr class="space s" />
<a class="btn-sm btn">Send messagge</a>
<div class="success-box">
<div class="alert alert-success">Congratulations. Your message has been sent successfully</div>
</div>
<div class="error-box">
<div class="alert alert-warning">Error, please retry. Your message has not been sent</div>
</div>
</form>
</div>
</div>
</div>
</div>
<i class="scroll-top scroll-top-mobile show fa fa-sort-asc"></i>
<footer class="footer-base">
<div class="content">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="tag-row icon-row icon-row-square">
<span><a>About</a></span>
<span><a>Services</a></span>
<span><a>Support</a></span>
<span><a>Contacts</a></span>
</div>
</div>
<div class="col-md-6 text-right text-center-sm">
<div class="btn-group social-group btn-group-icons">
<a target="_blank" href="#" data-social="share-facebook" data-toggle="tooltip" data-placement="top" title="Facebook">
<i class="fa fa-facebook text-s"></i>
</a>
<a target="_blank" href="#" data-social="share-twitter" data-toggle="tooltip" data-placement="top" title="Twitter">
<i class="fa fa-twitter text-s"></i>
</a>
<a target="_blank" href="#" data-social="share-google" data-toggle="tooltip" data-placement="top" title="Google+">
<i class="fa fa-google-plus text-s"></i>
</a>
<a target="_blank" href="#" data-social="share-linkedin" data-toggle="tooltip" data-placement="top" title="LinkedIn">
<i class="fa fa-linkedin text-s"></i>
</a>
</div>
</div>
</div>
<div class="row copy-row">
<div class="col-md-12 copy-text">
© 2018 Structura - One page minimal template <span>Handmade by <a href="http://schiocco.com/">schiocco.com</a></span>
</div>
</div>
</div>
</div>
<script src="../HTWF/scripts/jquery.min.js"></script>
<script src="../HTWF/scripts/script.js"></script>
<link rel="stylesheet" href="../HTWF/scripts/iconsmind/line-icons.min.css">
<script src="../HTWF/scripts/bootstrap/js/bootstrap.min.js"></script>
<script src="../HTWF/scripts/imagesloaded.min.js"></script>
<script src="../HTWF/scripts/parallax.min.js"></script>
<script src="../HTWF/scripts/flexslider/jquery.flexslider-min.js"></script>
<script src="../HTWF/scripts/isotope.min.js"></script>
<script src="../HTWF/scripts/php/contact-form.js"></script>
<script src="../HTWF/scripts/jquery.progress-counter.js"></script>
<script src="../HTWF/scripts/jquery.tab-accordion.js"></script>
<script src="../HTWF/scripts/bootstrap/js/bootstrap.popover.min.js"></script>
<script src="../HTWF/scripts/jquery.magnific-popup.min.js"></script>
<script src="../HTWF/scripts/social.stream.min.js"></script>
<script src="../HTWF/scripts/jquery.slimscroll.min.js"></script>
<script src="../HTWF/scripts/google.maps.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script src="../HTWF/scripts/smooth.scroll.min.js"></script>
</footer>
</body>
</html>