View file Structura/Template/pages/features/components/content-box.html

File size: 77.98Kb
<!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>Content boxes | Components | Structura</title>
    <meta name="description" content="HTML5/CSS3 template components for Framework Y and business industries, based on Framework Y.">
    <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/components.css">
    <link rel="stylesheet" href="../../../HTWF/scripts/php/contact-form.css">
    <link rel="icon" href="../../../images/favicon.png">
    <link rel="stylesheet" href="../../../skin.css">
</head>
<body>
    <div id="preloader"></div>
    <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 active">
                                    <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="header-base">
        <div class="container">
            <div class="row">
                <div class="col-md-9">
                    <div class="title-base text-left">
                        <h1>Content boxes</h1>
                        <p>This template come with lot of innovative features and an awesome and extensive documentation ready to be used to build your website.</p>
                    </div>
                </div>
                <div class="col-md-3">
                    <ol class="breadcrumb b white">
                        <li><a href="#">Home</a></li>
                        <li class="active">Features</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <div class="section-empty section-item text-center">
        <div class="container content">
            <h5>SIDE IMAGE</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-6">
                    <div class="advs-box advs-box-side" data-anima="fade-left" data-trigger="hover">
                        <div class="row">
                            <div class="col-md-4">
                                <div class="img-box"><img src="../../../images/gallery/image-1.jpg" alt=""></div>
                            </div>
                            <div class="col-md-8">
                                <h3>Stay hungry</h3>
                                <hr class="anima">
                                <p>
                                    Quis nonummy wisi taciti Dictumst sapiente aliquet elementum eveniet loremi. 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>
                                <a class="btn btn-xs" href="#">Read more</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="advs-box advs-box-side" data-anima="fade-left" data-trigger="hover">
                        <div class="row">
                            <div class="col-md-4">
                                <div class="img-box"><img src="../../../images/gallery/image-2.jpg" alt=""></div>
                            </div>
                            <div class="col-md-8">
                                <h3>Stay foolish</h3>
                                <hr class="anima">
                                <p>
                                    Quis nonummy wisi taciti Dictumst sapiente aliquet elementum eveniet loremi. 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>
                                <a class="btn btn-xs" href="#">Read more</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>TOP IMAGE</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img boxed-inverse">
                        <a class="img-box img-scale-up" href="#">
                            <span><img src="../../../images/gallery/image-1.jpg" alt=""></span>
                        </a>
                        <div class="advs-box-content">
                            <h3>Stay hungry</h3>
                            <p>
                                L'orem ipsum dolor sitamet, consectetur adipisicing elit, sed do eiusmod incididunt
                                ut labore etaliqua ...
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img boxed-inverse">
                        <a class="img-box img-scale-up" href="#">
                            <span><img src="../../../images/gallery/image-2.jpg" alt=""></span>
                        </a>
                        <div class="advs-box-content">
                            <h3>Stay foolish</h3>
                            <p>
                                L'orem ipsum dolor sitamet, consectetur adipisicing elit, sed do eiusmod incididunt
                                ut labore etaliqua ...
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img boxed-inverse">
                        <a class="img-box img-scale-up" href="#">
                            <span><img src="../../../images/gallery/image-3.jpg" alt=""></span>
                        </a>
                        <div class="advs-box-content">
                            <h3>Be happy</h3>
                            <p>
                                L'orem ipsum dolor sitamet, consectetur adipisicing elit, sed do eiusmod incididunt
                                ut labore etaliqua ...
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <i class="im-libra icon anima-scale-up anima"></i>
                        <a class="img-box img-scale-up" href="#">
                            <span><img src="../../../images/gallery/image-1.jpg" alt=""></span>
                        </a>
                        <div class="advs-box-content">
                            <h3>Stay hungry</h3>
                            <p>
                                Deserunt adipisci sapien magnis ea nunc placerat fames proin placerat aptent ultricies condimentum rerum perferendis, luctus.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <i class="im-secound icon anima-scale-up anima"></i>
                        <a class="img-box img-scale-up" href="#">
                            <span><img src="../../../images/gallery/image-2.jpg" alt=""></span>
                        </a>
                        <div class="advs-box-content">
                            <h3>Stay foolish</h3>
                            <p>
                                Deserunt adipisci sapien magnis ea nunc placerat fames proin placerat aptent ultricies condimentum rerum perferendis, luctus.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <i class="im-scroll-fast icon anima-scale-up anima"></i>
                        <a class="img-box img-scale-up" href="#">
                            <span><img src="../../../images/gallery/image-3.jpg" alt=""></span>
                        </a>
                        <div class="advs-box-content">
                            <h3>Be happy</h3>
                            <p>
                                Deserunt adipisci sapien magnis ea nunc placerat fames proin placerat aptent ultricies condimentum rerum perferendis, luctus.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>TOP ICON</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-posterous anima icon text-xl"></i>
                        <h3>Stay hungry</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-film-strip anima icon text-xl"></i>
                        <h3>Stay foolish</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon" data-anima="rotate-20" data-trigger="hover">
                        <i class="fa fa-eject anima icon text-xl"></i>
                        <h3>Be happy</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
            </div>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon boxed white" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-id-2 icon circle anima"></i>
                        <h3>Stay hungry</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon boxed white" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-new-tab icon circle anima"></i>
                        <h3>Stay foolish</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon boxed white" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-film-strip icon circle anima"></i>
                        <h3>Be happy</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
            </div>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon boxed-inverse" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-panorama icon circle anima"></i>
                        <h3>Stay hungry</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon boxed-inverse" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-posterous icon circle anima"></i>
                        <h3>Stay foolish</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon boxed-inverse" data-anima="rotate-20" data-trigger="hover">
                        <i class="im-scroll-fast icon circle anima"></i>
                        <h3>Be happy</h3>
                        <p>
                            Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                        </p>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>SIDE ICON</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-side-icon" data-anima="pulse-fast" data-trigger="hover">
                        <div class="icon-box">
                            <i class="anima icon im-road-2 text-l"></i>
                        </div>
                        <div class="caption-box">
                            <h3>Stay hungry</h3>
                            <p>
                                Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-side-icon" data-anima="pulse-fast" data-trigger="hover">
                        <div class="icon-box">
                            <i class="anima icon im-clock-back text-l"></i>
                        </div>
                        <div class="caption-box">
                            <h3>Stay foolish</h3>
                            <p>
                                Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-side-icon" data-anima="pulse-fast" data-trigger="hover">
                        <div class="icon-box">
                            <i class="anima icon im-arrow-outside text-l"></i>
                        </div>
                        <div class="caption-box">
                            <h3>Be happy</h3>
                            <p>
                                Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-side-icon boxed-inverse" data-anima="pulse-fast" data-trigger="hover">
                        <div class="icon-box">
                            <i class="anima icon im-go-bottom text-l"></i>
                        </div>
                        <div class="caption-box">
                            <h3>Stay hungry</h3>
                            <p>
                                Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-side-icon boxed-inverse" data-anima="pulse-fast" data-trigger="hover">
                        <div class="icon-box">
                            <i class="anima icon im-film-board text-l"></i>
                        </div>
                        <div class="caption-box">
                            <h3>Stay foolish</h3>
                            <p>
                                Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-side-icon boxed white" data-anima="pulse-fast" data-trigger="hover">
                        <div class="icon-box">
                            <i class="anima icon im-id-2 text-l"></i>
                        </div>
                        <div class="caption-box">
                            <h3>Be happy</h3>
                            <p>
                                Euismod beatae mollit hymenaeos pharetra senectus perspiciatis esse nostra quama riatur pariaturorci quibusdam animi.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>MULTIPLE BOX</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-multiple boxed-inverse" data-anima="scale-rotate" data-trigger="hover">
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-1.jpg" alt="" /> </a>
                        <div class="circle anima-rotate-20 anima"><i class="im-film-strip"></i></div>
                        <div class="advs-box-content">
                            <h3>Stay hungry</h3>
                            <p>
                                Sed. Hic iaculis ullamco platea molestiae, tincidunt minima aperiam vivamus, sollicitudin ante morbi aliqua? Fermentum lacus.
                            </p>
                            <a class="btn btn-sm" href="about.html">Enter now </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-multiple boxed-inverse" data-anima="scale-rotate" data-trigger="hover">
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-2.jpg" alt="" /> </a>
                        <div class="circle anima-rotate-20 anima"><i class="im-calendar-4"></i></div>
                        <div class="advs-box-content">
                            <h3>Stay foolish</h3>
                            <p>
                                Sed. Hic iaculis ullamco platea molestiae, tincidunt minima aperiam vivamus, sollicitudin ante morbi aliqua? Fermentum lacus.
                            </p>
                            <a class="btn btn-sm" href="about.html">Enter now </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-multiple boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-3.jpg" alt="" /> </a>
                        <div class="circle anima-rotate-20 anima"><i class="im-maximize"></i></div>
                        <div class="advs-box-content">
                            <h3>Be happy</h3>
                            <p>
                                Sed. Hic iaculis ullamco platea molestiae, tincidunt minima aperiam vivamus, sollicitudin ante morbi aliqua? Fermentum lacus.
                            </p>
                            <a class="btn btn-sm" href="about.html">Enter now </a>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>BLOG BOX</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-12">
                    <div class="advs-box advs-box-side-img advs-box-blog boxed-inverse" data-anima="scale-rotate" data-trigger="hover">
                        <div class="row">
                            <div class="col-md-4">
                                <a class="img-box">
                                    <img class="anima" src="../../../images/gallery/image-1.jpg" alt="" />
                                </a>
                            </div>
                            <div class="col-md-8">
                                <h2><a>Stay hungry</a></h2>
                                <hr>
                                <div class="tag-row icon-row">
                                    <span><i class="fa fa-calendar"></i><a>26.05.2018</a></span>
                                    <span><i class="fa fa-bookmark"></i><a href="#">Category</a></span>
                                    <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                                </div>
                                <p>
                                    Culpa. Sapiente inceptos facilisi, molestiae veritatis expedita gravida deserunt, augue consectetuer delectus! Molestias? Illum quas deleniti
                                </p>
                                <a class="btn btn-sm" href="#">Read more</a>
                            </div>
                        </div>
                    </div>
                    <hr class="space s" />
                    <div class="advs-box advs-box-side-img advs-box-blog boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <div class="row">
                            <div class="col-md-4">
                                <a class="img-box">
                                    <img class="anima" src="../../../images/gallery/image-2.jpg" alt="" />
                                </a>
                            </div>
                            <div class="col-md-8">
                                <h2><a>Stay foolish</a></h2>
                                <hr>
                                <div class="tag-row icon-row">
                                    <span><i class="fa fa-calendar"></i><a>26.05.2018</a></span>
                                    <span><i class="fa fa-bookmark"></i><a href="#">Category</a></span>
                                    <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                                </div>
                                <p>
                                    Culpa. Sapiente inceptos facilisi, molestiae veritatis expedita gravida deserunt, augue consectetuer delectus! Molestias? Illum quas deleniti
                                </p>
                                <a class="btn btn-sm " href="#"> Read more</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>BLOG BOX 2</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img niche-box-post boxed-inverse" data-anima="scale-rotate" data-trigger="hover">
                        <div class="block-infos">
                            <div class="block-data">
                                <p class="bd-day">25</p>
                                <p class="bd-month">July</p>
                            </div>
                            <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                        </div>
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-1.jpg" alt="" /> </a>
                        <div class="advs-box-content">
                            <h2><a href="#">Stay hungry</a></h2>
                            <div class="tag-row">
                                <span><i class="fa fa-bookmark"></i> <a href="#">Travel</a></span>
                                <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                            </div>
                            <p class="niche-box-content">
                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                            </p>
                            <a class="btn btn-sm" href="#">Read more</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img niche-box-post boxed-inverse" data-anima="scale-rotate" data-trigger="hover">
                        <div class="block-infos">
                            <div class="block-data">
                                <p class="bd-day">25</p>
                                <p class="bd-month">July</p>
                            </div>
                            <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                        </div>
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-2.jpg" alt="" /> </a>
                        <div class="advs-box-content">
                            <h2><a href="#">Stay foolish</a></h2>
                            <div class="tag-row">
                                <span><i class="fa fa-bookmark"></i> <a href="#">Travel</a></span>
                                <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                            </div>
                            <p class="niche-box-content">
                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                            </p>
                            <a class="btn btn-sm" href="#">Read more</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img niche-box-post boxed-inverse" data-anima="scale-rotate" data-trigger="hover">
                        <div class="block-infos">
                            <div class="block-data">
                                <p class="bd-day">25</p>
                                <p class="bd-month">July</p>
                            </div>
                            <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                        </div>
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-3.jpg" alt="" /> </a>
                        <div class="advs-box-content">
                            <h2><a href="#">Be happy</a></h2>
                            <div class="tag-row">
                                <span><i class="fa fa-bookmark"></i> <a href="#">Travel</a></span>
                                <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                            </div>
                            <p class="niche-box-content">
                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                            </p>
                            <a class="btn btn-sm" href="#">Read more</a>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img niche-box-post boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <div class="block-infos">
                            <div class="block-data">
                                <p class="bd-day">25</p>
                                <p class="bd-month">July</p>
                            </div>
                            <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                        </div>
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-1.jpg" alt="" /> </a>
                        <div class="advs-box-content">
                            <h2><a href="#">Stay hungry</a></h2>
                            <div class="tag-row">
                                <span><i class="fa fa-bookmark"></i> <a href="#">Travel</a></span>
                                <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                            </div>
                            <p class="niche-box-content">
                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                            </p>
                            <a class="btn btn-sm" href="#">Read more</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img niche-box-post boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <div class="block-infos">
                            <div class="block-data">
                                <p class="bd-day">25</p>
                                <p class="bd-month">July</p>
                            </div>
                            <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                        </div>
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-2.jpg" alt="" /> </a>
                        <div class="advs-box-content">
                            <h2><a href="#">Stay foolish</a></h2>
                            <div class="tag-row">
                                <span><i class="fa fa-bookmark"></i> <a href="#">Travel</a></span>
                                <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                            </div>
                            <p class="niche-box-content">
                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                            </p>
                            <a class="btn btn-sm" href="#">Read more</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon-img niche-box-post boxed white" data-anima="scale-rotate" data-trigger="hover">
                        <div class="block-infos">
                            <div class="block-data">
                                <p class="bd-day">25</p>
                                <p class="bd-month">July</p>
                            </div>
                            <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                        </div>
                        <a class="img-box"><img class="anima" src="../../../images/gallery/image-3.jpg" alt="" /> </a>
                        <div class="advs-box-content">
                            <h2><a href="#">Be happy</a></h2>
                            <div class="tag-row">
                                <span><i class="fa fa-bookmark"></i> <a href="#">Travel</a></span>
                                <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                            </div>
                            <p class="niche-box-content">
                                Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                            </p>
                            <a class="btn btn-sm" href="#">Read more</a>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>BLOG BOX 3</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box niche-box-blog">
                        <div class="block-top">
                            <div class="block-infos">
                                <div class="block-data">
                                    <p class="bd-day">25</p>
                                    <p class="bd-month">July</p>
                                </div>
                                <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                            </div>
                            <div class="block-title">
                                <h2><a href="#">Stay hungry</a></h2>
                                <div class="tag-row">
                                    <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                                </div>
                            </div>
                        </div>
                        <a class="img-box img-scale-up" href="#">
                            <img src="../../../images/gallery/image-1.jpg" alt="">
                        </a>
                        <p class="excerpt">
                            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                            Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                        </p>
                        <a class="btn btn-sm" href="#">Read more</a>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box niche-box-blog">
                        <div class="block-top">
                            <div class="block-infos">
                                <div class="block-data">
                                    <p class="bd-day">25</p>
                                    <p class="bd-month">July</p>
                                </div>
                                <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                            </div>
                            <div class="block-title">
                                <h2><a href="#">Stay foolish</a></h2>
                                <div class="tag-row">
                                    <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                                </div>
                            </div>
                        </div>
                        <a class="img-box img-scale-up" href="#">
                            <img src="../../../images/gallery/image-2.jpg" alt="">
                        </a>
                        <p class="excerpt">
                            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                            Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                        </p>
                        <a class="btn btn-sm" href="#">Read more</a>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box niche-box-blog">
                        <div class="block-top">
                            <div class="block-infos">
                                <div class="block-data">
                                    <p class="bd-day">25</p>
                                    <p class="bd-month">July</p>
                                </div>
                                <a class="block-comment" href="#">2 <i class="fa fa-comment-o"></i></a>
                            </div>
                            <div class="block-title">
                                <h2><a href="#">Be happy</a></h2>
                                <div class="tag-row">
                                    <span><i class="fa fa-pencil"></i><a>Admin</a></span>
                                </div>
                            </div>
                        </div>
                        <a class="img-box img-scale-up" href="#">
                            <img src="../../../images/gallery/image-3.jpg" alt="">
                        </a>
                        <p class="excerpt">
                            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                            Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunto.
                        </p>
                        <a class="btn btn-sm" href="#">Read more</a>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>TESTIMONIALS</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon niche-box-testimonails">
                        <i class="fa text-xl circle onlycover" style="background-image:url('../../../images/users/user-4.jpg')"></i>
                        <p>
                            Etiam feugiat. Libero tincidunt, ac magni porttitor fugit laboriosam sed, condimentum tellus. Diam, quas laboriosam, quisque.
                        </p>
                        <h5>Mary Groot <span>Google</span></h5>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon niche-box-testimonails">
                        <i class="fa text-xl circle onlycover" style="background-image:url('../../../images/users/user-2.jpg')"></i>
                        <p>
                            Etiam feugiat. Libero tincidunt, ac magni porttitor fugit laboriosam sed, condimentum tellus. Diam, quas laboriosam, quisque.
                        </p>
                        <h5>Luca Dalla Cort <span>Fintech</span></h5>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box advs-box-top-icon niche-box-testimonails">
                        <i class="fa text-xl circle onlycover" style="background-image:url('../../../images/users/user-3.jpg')"></i>
                        <p>
                            Etiam feugiat. Libero tincidunt, ac magni porttitor fugit laboriosam sed, condimentum tellus. Diam, quas laboriosam, quisque.
                        </p>
                        <h5>Elisa Elsa <span>Telwin</span></h5>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>TESTIMONIALS 2</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="advs-box niche-box-testimonails-cloud">
                        <p>
                            Etiam feugiat. Libero tincidunt, ac magni porttitor fugit laboriosam sed, condimentum tellus. Diam, quas laboriosam, quisque porta praesentium.
                        </p>
                        <div class="name-box vertical-row">
                            <i class="vertical-col fa text-l circle onlycover" style="background-image:url('../../../images/users/user-4.jpg')"></i>
                            <h5 class="vertical-col subtitle">Federico Schiocchet<span class="subtxt">Marketing expert</span></h5>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box niche-box-testimonails-cloud">
                        <p>
                            Etiam feugiat. Libero tincidunt, ac magni porttitor fugit laboriosam sed, condimentum tellus. Diam, quas laboriosam, quisque porta praesentium.
                        </p>
                        <div class="name-box vertical-row">
                            <i class="vertical-col fa text-l circle onlycover" style="background-image:url('../../../images/users/user-2.jpg')"></i>
                            <h5 class="vertical-col subtitle">David Patrick<span class="subtxt">Web developer</span></h5>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="advs-box niche-box-testimonails-cloud">
                        <p>
                            Etiam feugiat. Libero tincidunt, ac magni porttitor fugit laboriosam sed, condimentum tellus. Diam, quas laboriosam, quisque porta praesentium.
                        </p>
                        <div class="name-box vertical-row">
                            <i class="vertical-col fa text-l circle onlycover" style="background-image:url('../../../images/users/user-3.jpg')"></i>
                            <h5 class="vertical-col subtitle">Tua madre<span class="subtxt">Tuo padre</span></h5>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>TEAM</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-3">
                    <div class="advs-box niche-box-team" data-anima="scale-up" data-trigger="hover">
                        <a class="img-box">
                            <img class="anima" src="../../../images/users/user-11.jpg" alt="" />
                        </a>
                        <div class="content-box">
                            <h2>Jack Stone</h2>
                            <h4>Founder</h4>
                            <hr class="e" />
                            <div class="btn-group social-group">
                                <a target="_blank" href="#"><i class="fa fa-facebook"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-twitter"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-instagram"></i></a>
                            </div>
                            <p>Lorem Ipsum is simply dummy text of the printing and industry. Lorem has been the industry.</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="advs-box niche-box-team" data-anima="scale-up" data-trigger="hover">
                        <a class="img-box">
                            <img class="anima" src="../../../images/users/user-2.jpg" alt="" />
                        </a>
                        <div class="content-box">
                            <h2>Oliver Andrew</h2>
                            <h4>Collaboration</h4>
                            <hr class="e" />
                            <div class="btn-group social-group">
                                <a target="_blank" href="#"><i class="fa fa-facebook"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-twitter"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-instagram"></i></a>
                            </div>
                            <p>Lorem Ipsum is simply dummy text of the printing and industry. Lorem has been the industry.</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="advs-box niche-box-team" data-anima="scale-up" data-trigger="hover">
                        <a class="img-box">
                            <img class="anima" src="../../../images/users/user-3.jpg" alt="" />
                        </a>
                        <div class="content-box">
                            <h2>Alex Franz</h2>
                            <h4>Marketing</h4>
                            <hr class="e" />
                            <div class="btn-group social-group">
                                <a target="_blank" href="#"><i class="fa fa-facebook"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-twitter"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-instagram"></i></a>
                            </div>
                            <p>Lorem Ipsum is simply dummy text of the printing and industry. Lorem has been the industry.</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="advs-box niche-box-team" data-anima="scale-up" data-trigger="hover">
                        <a class="img-box">
                            <img class="anima" src="../../../images/users/user-4.jpg" alt="" />
                        </a>
                        <div class="content-box">
                            <h2>Alex Franz</h2>
                            <h4>Security</h4>
                            <hr class="e" />
                            <div class="btn-group social-group">
                                <a target="_blank" href="#"><i class="fa fa-facebook"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-twitter"></i></a>
                                <a target="_blank" href="#"><i class="fa fa-instagram"></i></a>
                            </div>
                            <p>Lorem Ipsum is simply dummy text of the printing and industry. Lorem has been the industry.</p>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>PRICING TABLE</h5>
            <hr class="space m" />
            <div class="row">
                <div class="col-md-4">
                    <div class="list-group pricing-table">
                        <div class="list-group-item pricing-price">
                            20 <span>$</span>
                        </div>
                        <div class="list-group-item pricing-name">
                            <h3>
                                JUST CHECKING
                            </h3>
                        </div>
                        <div class="list-group-item">
                            General contracting
                        </div>
                        <div class="list-group-item">
                            Pre-Framework Y services
                        </div>
                        <div class="list-group-item">
                            Framework Y consulting
                        </div>
                        <div class="list-group-item">
                            Design-build
                        </div>
                        <div class="list-group-item">
                            24/7 support
                        </div>
                        <div class="list-group-item">
                            <a class="btn btn-sm btn-default" href="#"> Order now </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="list-group pricing-table pricing-table-big">
                        <div class="list-group-item pricing-price">
                            85 <span>$</span>
                        </div>
                        <div class="list-group-item pricing-name">
                            <h3>PLUS PLAN</h3>
                        </div>
                        <div class="list-group-item">
                            General contracting
                        </div>
                        <div class="list-group-item">
                            Pre-Framework Y services
                        </div>
                        <div class="list-group-item">
                            businesss
                        </div>
                        <div class="list-group-item">
                            Design-build
                        </div>
                        <div class="list-group-item">
                            24/7 support
                        </div>
                        <div class="list-group-item">
                            <a class="btn btn-sm btn-default" href="#"> Order now </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="list-group pricing-table">
                        <div class="list-group-item pricing-price">
                            200 <span>$</span>
                        </div>
                        <div class="list-group-item pricing-name">
                            <h3>ADD INSURANCE</h3>
                        </div>
                        <div class="list-group-item">
                            General contracting
                        </div>
                        <div class="list-group-item">
                            Pre-Framework Y services
                        </div>
                        <div class="list-group-item">
                            Framework Y consulting
                        </div>
                        <div class="list-group-item">
                            Metal roofing
                        </div>
                        <div class="list-group-item">
                            24/7 support
                        </div>
                        <div class="list-group-item">
                            <a class="btn btn-sm btn-default" href="#"> Order now </a>
                        </div>
                    </div>
                </div>
            </div>
            <hr class="space s" />
            <hr />
            <hr class="space s" />
            <h5>CALL TO ACTION</h5>
            <hr class="space m" />
            <div class="advs-box call-action-box vertical-row">
                <div class="col-md-1">
                    <i class="im-old-camera action-icon"></i>
                </div>
                <div class="col-md-8">
                    <p> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                </div>
                <div class="col-md-3">
                    <a class="btn btn-sm" href="#">GET A QUOTE </a>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>
    <div class="section-empty text-center section-doc">
        <div class="container content">
            <h4 class="text-normal">Documentation</h4>
            <p>This template is built with HTWF and more variants<br /> are available, check the official documentation for more details.</p>
            <hr class="space xs" />
            <a href="http://html.framework-y.com/components/content-box/" target="_blank" class="btn btn-sm">Go to documentation</a>
        </div>
    </div>
    <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/imagesloaded.min.js"></script>
        <script src="../../../HTWF/scripts/bootstrap/js/bootstrap.min.js"></script>
        <script src="../../../HTWF/scripts/jquery.tab-accordion.js"></script>
        <script src="../../../HTWF/scripts/parallax.min.js"></script>
        <link rel="stylesheet" href="../../../HTWF/css/animations.css">
    </footer>
</body>
</html>