File size: 49.38Kb
<!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>Structura | HTML Multipurpose and one page Template</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="icon" href="../images/favicon.png">
<link rel="stylesheet" href="../skin.css">
</head>
<body>
<div id="preloader"></div>
<div class="footer-parallax-container overflow-hidden">
<header class="fixed-top scroll-change" data-menu-anima="fade-in">
<div class="navbar navbar-default mega-menu-fullwidth navbar-fixed-top" role="navigation">
<div class="navbar navbar-main">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle">
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">
<img class="logo-default" src="../images/logo.png" alt="logo" />
<img class="logo-retina" src="../images/logo-retina.png" alt="logo" />
</a>
</div>
<div class="collapse navbar-collapse">
<div class="nav navbar-nav navbar-right">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Home <span class="caret"></span></a>
<ul class="dropdown-menu multi-level">
<li><a href="index-square.html">Square</a></li>
<li><a href="index-cube.html">Cube</a></li>
<li><a href="index-parallelogram.html">Parallelogram</a></li>
<li><a href="index-ellipse.html">Ellipse</a></li>
<li><a href="index-rectangle.html">Rectangle</a></li>
<li><a href="index-circle.html">Circle</a></li>
<li><a href="index-triangle.html">Triangle</a></li>
<li><a href="index-hexagon.html">Hexagon</a></li>
<li><a href="index-pentagon.html">Pentagon</a></li>
<li><a href="index-line.html">Line</a></li>
<li><a href="index-fullpage.html">Fullpage</a></li>
<li><a href="index.html">Intro</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Pages <span class="caret"></span></a>
<ul class="dropdown-menu multi-level">
<li class="dropdown dropdown-submenu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Niche</a>
<ul class="dropdown-menu">
<li><a href="pricing.html">Pricing</a></li>
<li><a href="gallery.html">Photo & video</a></li>
<li><a href="faq.html">Faq</a></li>
<li><a href="history.html">History</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="coming-soon.html">Coming soon</a></li>
<li><a href="404.html">404</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">About</a>
<ul class="dropdown-menu">
<li><a href="about-us-1.html">About us one</a></li>
<li><a href="about-us-2.html">About us two</a></li>
<li><a href="about-us-3.html">About us three</a></li>
<li><a href="about-us-4.html">About us four</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Contacts</a>
<ul class="dropdown-menu">
<li><a href="contacts-1.html">Contacts one</a></li>
<li><a href="contacts-2.html">Contacts two</a></li>
<li><a href="contacts-3.html">Contacts three</a></li>
<li><a href="contacts-4.html">Contacts four</a></li>
</ul>
</li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Portfolio <span class="caret"></span></a>
<ul class="dropdown-menu multi-level">
<li><a href="portfolio-1.html">Portfolio one</a></li>
<li><a href="portfolio-2.html">Portfolio two</a></li>
<li><a href="portfolio-3.html">Portfolio three</a></li>
<li><a href="portfolio-4.html">Portfolio four</a></li>
<li><a href="portfolio-5.html">Portfolio five</a></li>
<li class="dropdown dropdown-submenu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Single item</a>
<ul class="dropdown-menu">
<li><a href="portfolio-single-1.html">Single one</a></li>
<li><a href="portfolio-single-2.html">Single two</a></li>
<li><a href="portfolio-single-3.html">Single three</a></li>
</ul>
</li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Blog <span class="caret"></span></a>
<ul class="dropdown-menu multi-level">
<li><a href="blog-grid.html">Grid</a></li>
<li><a href="blog-masonry.html">Masonry</a></li>
<li><a href="blog-classic.html">Classic</a></li>
<li class="dropdown dropdown-submenu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Single post</a>
<ul class="dropdown-menu">
<li><a href="blog-single-1.html">Single one</a></li>
<li><a href="blog-single-2.html">Single two</a></li>
<li><a href="blog-single-3.html">Single three</a></li>
</ul>
</li>
</ul>
</li>
<li class="dropdown mega-dropdown mega-tabs">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Elements <span class="caret"></span></a>
<div class="mega-menu dropdown-menu multi-level row bg-menu">
<div class="tab-box" data-tab-anima="fade-in">
<ul class="nav nav-tabs">
<li class="active"><a href="#">Components</a></li>
<li><a href="#">Headers</a></li>
<li><a href="#">Titles</a></li>
</ul>
<div class="panel active">
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-posterous"></i> <a href="features/components/icons.html">Icons</a></li>
<li><i class="fa-li im-secound"></i> <a href="features/components/counters-countdown.html">Counters</a></li>
<li><i class="fa-li im-clock-back"></i> <a href="features/components/counters-countdown.html">Countdowns</a></li>
<li><i class="fa-li im-libra"></i> <a href="features/components/progress-bars.html">Progress bars</a></li>
<li><i class="fa-li im-arrow-refresh2"></i> <a href="features/components/progress-bars.html">Circle progress bars</a></li>
<li><i class="fa-li im-calendar-4"></i> <a href="features/components/timeline.html">Timeline</a></li>
<li><i class="fa-li im-arrow-outside"></i> <a href="features/containers/section-slider.html">Slider</a></li>
<li><i class="fa-li im-speach-bubbles"></i> <a href="features/components/php-contact-form.html">Contact form</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-hand-touch"></i> <a href="features/components/buttons.html">Buttons</a></li>
<li><i class="fa-li im-old-camera"></i> <a href="features/components/image-boxes.html">Image boxes</a></li>
<li><i class="fa-li im-old-camera"></i> <a href="features/components/image-boxes-advanced.html">Advanced image boxes</a></li>
<li><i class="fa-li im-id-2"></i> <a href="features/components/content-box.html">Content boxes</a></li>
<li><i class="fa-li im-facebook"></i> <a href="features/components/social-media.html">Social media</a></li>
<li><i class="fa-li im-numbering-list"></i> <a href="features/components/lists.html">Lists</a></li>
<li><i class="fa-li im-map2"></i> <a href="features/components/maps.html">Google maps</a></li>
<li><i class="fa-li im-bold-text"></i> <a href="features/components/typography.html">Typography</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-split-horizontal2window"></i> <a href="features/components/tables.html">Advanced table</a></li>
<li><i class="fa-li im-maximize"></i> <a href="features/containers/lightbox.html">Lightbox and popups</a></li>
<li><i class="fa-li im-arrow-outside"></i> <a href="features/containers/sliders.html">Sliders and carousels</a></li>
<li><i class="fa-li im-scroll-fast"></i> <a href="features/containers/scroll-box-collapse.html">Scroll box</a></li>
<li><i class="fa-li im-download-2"></i> <a href="features/containers/scroll-box-collapse.html">Collapse box</a></li>
<li><i class="fa-li im-new-tab"></i> <a href="features/containers/tabs.html">Tabs</a></li>
<li><i class="fa-li im-new-tab"></i> <a href="features/containers/accordions.html">Accordions</a></li>
<li><i class="fa-li im-split-foursquarewindow"></i> <a href="features/containers/list-grid.html">Grid</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-split-foursquarewindow"></i> <a href="features/containers/list-masonry.html">Masonry</a></li>
<li><i class="fa-li im-panorama"></i> <a href="features/containers/section-background-image.html">Background image</a></li>
<li><i class="fa-li im-panorama"></i> <a href="features/containers/section-background-image-parallax.html">Background parallax</a></li>
<li><i class="fa-li im-film-strip"></i> <a href="features/containers/section-background-video.html">Background video</a></li>
<li><i class="fa-li im-clouds"></i> <a href="features/containers/section-animations.html">Bg animations</a></li>
<li><i class="fa-li im-go-bottom"></i> <a href="features/footers/parallax.html">Footer parallax</a></li>
<li><i class="fa-li im-go-bottom"></i> <a href="features/footers/minimal.html">Footer minimal</a></li>
<li><i class="fa-li im-go-bottom"></i> <a href="features/footers/base.html">Footer base</a></li>
</ul>
</div>
</div>
<div class="panel">
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-road"></i> <a href="features/menus/classic.html">Menu classic</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/classic-transparent.html">Menu classic transparent</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/big-logo.html">Menu big logo</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/subline.html">Menu subline</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/subtitle.html">Menu subtitle</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-road"></i> <a href="features/menus/middle-logo.html">Menu middle logo</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/middle-logo-top.html">Menu middle logo top</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/middle-box.html">Menu middle box</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/icons.html">Menu icons</a></li>
<li><i class="fa-li im-road"></i> <a href="features/menus/icons-top.html">Menu icons top</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-road-2"></i> <a href="features/menus/side.html">Side classic</a></li>
<li><i class="fa-li im-road-2"></i> <a href="features/menus/side-lateral.html">Side lateral</a></li>
<li><i class="fa-li im-road-2"></i> <a href="features/menus/side-simple.html">Side simple</a></li>
</ul>
</div>
</div>
<div class="panel">
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-old-camera"></i> <a href="features/titles/image.html">Image background</a></li>
<li><i class="fa-li im-old-camera"></i> <a href="features/titles/image-fullscreen.html">Image full-screen</a></li>
<li><i class="fa-li im-old-camera"></i> <a href="features/titles/image-fullscreen-parallax.html">Image full-screen parallax</a></li>
<li><i class="fa-li im-old-camera"></i> <a href="features/titles/image-parallax.html">Image parallax</a></li>
<li><i class="fa-li im-old-camera"></i> <a href="features/titles/image-parallax-ken-burn.html">Image parallax ken-burn</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-film-board"></i> <a href="features/titles/video-mp4.html">Video background MP4</a></li>
<li><i class="fa-li im-film-board"></i> <a href="features/titles/video-youtube.html">Video background Youtube</a></li>
<li><i class="fa-li im-film-board"></i> <a href="features/titles/video-fullscreen.html">Video full-screen</a></li>
<li><i class="fa-li im-film-board"></i> <a href="features/titles/video-fullscreen-parallax.html">Video full-screen parallax</a></li>
<li><i class="fa-li im-film-board"></i> <a href="features/titles/video-parallax.html">Video parallax</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-panorama"></i> <a href="features/titles/base-1.html">Title base 1</a></li>
<li><i class="fa-li im-panorama"></i> <a href="features/titles/base-2.html">Title base 2</a></li>
<li><i class="fa-li im-clouds"></i> <a href="features/titles/animation.html">Animation background</a></li>
<li><i class="fa-li im-clouds"></i> <a href="features/titles/animation-parallax.html">Animation parallax</a></li>
</ul>
</div>
<div class="col">
<ul class="fa-ul text-s">
<li><i class="fa-li im-arrow-outside"></i> <a href="features/titles/slider.html">Slider background</a></li>
<li><i class="fa-li im-arrow-outside"></i> <a href="features/titles/slider-fullscreen.html">Slider full-screen</a></li>
<li><i class="fa-li im-arrow-outside"></i> <a href="features/titles/slider-fullscreen-parallax.html">Slider full-screen parallax</a></li>
<li><i class="fa-li im-arrow-outside"></i> <a href="features/titles/slider-parallax.html">Slider parallax</a></li>
</ul>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</header>
<div class="section-bg-image parallax-window background-lines-3 ken-burn-center" data-position="top" data-natural-height="1000" data-natural-width="1920" data-parallax="scroll" data-image-src="../images/bg-15.jpg">
<div class="container content" data-anima="fade-bottom" data-time="1000" data-timeline="desc" data-timeline-time="500">
<div class="row">
<div class="col-md-7">
<h1 class="text-xxl text-black font-1 anima">
Call me Structura
</h1>
<hr class="space m" />
<h2 class="text-s font-1 text-uppercase anima">
Minimal one page and multipurpose template based on Bootstrap.
Ready to use by just copy and paste the code blocks of the docs. Enjoy an extreme customization with thousands of options and stunning features
</h2>
<hr class="space m" />
<a href="https://themeforest.net/item/structura-one-page-multipurpose-template/22350778?ref=Schiocco" class="btn btn-sm anima">Purchase</a>
<hr class="space m visible-xs" />
</div>
<div class="col-md-5">
</div>
</div>
</div>
</div>
<div class="section-empty background-lines z-index overflow-visble">
<div class="container content">
<div class="row">
<div class="col-md-8">
</div>
<div class="col-md-4">
<img src="../images/crew-1.png" class="abs-image" style="top: -621px;" alt="" />
</div>
</div>
<div class="grid-list grid-30 z-index">
<div class="grid-box row">
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-square.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/square.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Square</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-cube.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/cube.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Cube</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-parallelogram.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/parallelogram.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Parallelogram</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-ellipse.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/ellipse.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Ellipse</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-rectangle.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/rectangle.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Rectangle</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-circle.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/circle.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Circle</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-triangle.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/triangle.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Triangle</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-hexagon.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/hexagon.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Hexagon</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-pentagon.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/pentagon.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Pentagon</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-line.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/line.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Line</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index-fullpage.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/fullpage.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Fullpage</a></h2>
</div>
</div>
</div>
<div class="grid-item col-md-4">
<div class="img-box adv-img adv-img-down-text">
<a target="_blank" class="img-box i-center" href="index.html">
<div class="caption">
<i class="fa fa-plus"></i>
</div>
<img src="../images/home/intro.jpg" alt="">
</a>
<div class="caption-bottom">
<h2><a href="#">Intro</a></h2>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="features" class="section-empty background-lines-2 z-index overflow-visble">
<div class="container content">
<div class="row ">
<div class="col-md-4 col-sm-12">
<img src="../images/crew-2.png" class="abs-image" style="left: -200px;" alt="" />
</div>
<div class="col-md-4 col-sm-12" data-anima="fade-bottom">
<h3 class="text-s">Just copy and paste</h3>
<h2>Very easy to use</h2>
<p>
Maybe the most easy to use template on the market. You can build your website by just copy and paste the snippets of the documentation.
If you need some customization, it should be already available.
Every Javascript\JQuery plugin is automatically initialized and the options are inserted directly into the HTML without the need to write custom codes.
</p>
<hr class="space s" />
<a href="https://themeforest.net/item/structura-one-page-multipurpose-template/22350778?ref=Schiocco" class="btn-text">Purchase now</a>
</div>
<div class="col-md-4 col-sm-12" data-anima="fade-bottom">
<h3 class="text-s">The lighter and the faster</h3>
<h2>Superior perfomance</h2>
<p>
Speed is everything, the template is built to develop high performance websites. Avarage CSS filesize, gzipped, only 70KB, Javascript files only 80KB.
Every page load only the required script and css files built for modularity. Only lightweight, focus on performance, plugins. Modular CSS, HTML and JS codes minimize redundancy and code size.
</p>
<hr class="space s" />
<a href="https://tools.pingdom.com/#!/bedtJc/http://templates.framework-y.com/structura/pages/index.html" target="_blank" class="btn-text">Check Pingdom score</a>
</div>
</div>
</div>
</div>
<div class="section-bg-image parallax-window background-lines-3" data-position="top" data-natural-height="1000" data-natural-width="1920" data-parallax="scroll" data-image-src="../images/bg-15b.jpg">
<div class="container content">
<div class="row">
<div class="col-md-7 col-center text-center">
<h2>Flexibility, productivity, simplicity</h2>
<p class="text-center">
This template is built with HTWF a mobile, productivity oriented framework with an awesome flexibility. It contain 1000+ options and it's really easy to use.
You can build your website by just copy and paste the code of the documentation.
</p>
<a href="http://html.framework-y.com/" target="_blank" class="btn-border btn btn-sm">Explore the framework</a>
</div>
</div>
</div>
</div>
<div class="section-empty background-lines-2 z-index overflow-visble">
<div class="container content">
<div class="row">
<div class="row">
<div class="col-md-4" data-anima="fade-bottom">
<h3 class="text-s">Your best friend for your website developing</h3>
<h2>Awesome docs</h2>
<p>
Inspired to Bootstrap documentation, it's not a simple guide but a powerful tool for build your website faster and better.
You have a full access to 100+ documentation pages, hundreds of code snippets for every single component and option,
complete list of settings, live examples of everything and really much more.
</p>
<hr class="space s" />
<a href="http://html.framework-y.com/docs/" target="_blank" class="btn-text">Go to documentation</a>
</div>
<div class="col-md-4" data-anima="fade-bottom">
<h3 class="text-s">Infinite options set ready to use</h3>
<h2>Extreme flexibility</h2>
<p>
The is template based on the concept of modularity.
Small, independent code blocks are linked together to create the website.
Each module has generic and the low-level functionalities that ensure the maximum flexibility and give you an extreme customization power
without the need to lost hours.
</p>
<hr class="space s" />
<a href="https://themeforest.net/item/structura-one-page-multipurpose-template/22350778?ref=Schiocco" class="btn-text">Purchase now</a>
</div>
<div class="col-md-4">
<img src="../images/crew-3.png" class="abs-image" style="left: auto; right: 150px;" alt="" />
</div>
</div>
</div>
</div>
</div>
<div class="section-empty background-lines text-center">
<div class="container content">
<div class="title-base">
<hr />
<h2>12 header types</h2>
<p>All header types can be fixed, transparent, side and hidden. Ready to use components like language and shop menus, social icons, search and more.</p>
</div>
<div class="row">
<div class="col-md-2">
<img src="../images/home/header-classic.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Classic</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-transparent.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Transparent</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-icons.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Icons</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-icons-top.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Top icons</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-big-logo.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Big logo</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-middle-box.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Middle box</h4>
</div>
</div>
<hr class="space m" />
<div class="row">
<div class="col-md-2">
<img src="../images/home/header-middle-logo.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Middle logo</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-top-logo.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Top logo</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-side-hidden.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Side hidden</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-side.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Side</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-subline.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Subline</h4>
</div>
<div class="col-md-2">
<img src="../images/home/header-subtitle.png" alt="" />
<hr class="space xs" />
<h4 class="text-center text-s text-normal">Subtitle</h4>
</div>
</div>
<hr class="space m" />
<a href="http://html.framework-y.com/menus/" target="_blank" class="btn btn-sm">Header features</a>
</div>
</div>
<div class="section-bg-image parallax-window" data-position="top" data-natural-height="1000" data-natural-width="1920" data-parallax="scroll" data-image-src="../images/bg-15.jpg">
<div class="container content">
<table class="grid-table border-table grid-table-xs-12">
<tbody>
<tr>
<td>
<div class="counter-box-simple counter-box-vertical">
<span class="counter text-xl" data-to="100">100</span>
<span class="text-m">Components</span>
</div>
</td>
<td>
<div class="counter-box-simple counter-box-vertical">
<span class="counter text-xl" data-to="12"></span>
<span class="text-m">Menu</span>
</div>
</td>
<td>
<div class="counter-box-simple counter-box-vertical">
<span class="counter text-xl" data-to="85"></span>
<span class="text-m">Pages</span>
</div>
</td>
<td>
<div class="counter-box-simple counter-box-vertical">
<span class="counter text-xl" data-separator="" data-to="1000"></span>
<span class="text-m">Options</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="section-empty background-lines-2 text-center">
<div class="container content">
<div class="row" data-anima="fade-bottom" data-timeline="asc">
<div class="col-md-3 boxed-inverse anima">
<h4>Copy & paste</h4>
<p class="text-s">Build your site is simple thanks to the docs</p>
</div>
<div class="col-md-3 boxed-inverse anima">
<h4>Fully responsive</h4>
<p class="text-s">Notebook, tablets, smartphones</p>
</div>
<div class="col-md-3 boxed-inverse anima">
<h4>Only html, css, js</h4>
<p class="text-s">Built only with the languages you love and know</p>
</div>
<div class="col-md-3 boxed-inverse anima">
<h4>WordPress</h4>
<p class="text-s">WordPress version available to purchase</p>
</div>
</div>
</div>
</div>
</div>
<i class="scroll-top scroll-top-mobile show fa fa-sort-asc"></i>
<footer class="footer-parallax bg-white">
<div class="content">
<hr class="space hidden-sm" />
<div class="row copy-row">
<div class="col-md-12 copy-text">
© 2018 Structura- Multipurpose & Modern Html Template Handmade by <a href="http://schiocco.com/">schiocco.com</a>
</div>
</div>
</div>
<script src="../HTWF/scripts/jquery.min.js"></script>
<script src="../HTWF/scripts/parallax.min.js"></script>
<script src="../HTWF/scripts/script.js"></script>
<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/jquery.progress-counter.js"></script>
<script src="../HTWF/scripts/jquery.tab-accordion.js"></script>
<script src="../HTWF/scripts/smooth.scroll.min.js"></script>
</footer>
</body>
</html>