universal-web-template
Version:
An universal web proejct template - let you quickly set up a project using Handlebars, sass and ReactJS for front-end templating. It can be adopted with most modern CMS.
1,204 lines (759 loc) • 41.5 kB
HTML
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>app name - Lorem ipsum dolor site</title>
<!-- Site Meta -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
<meta name="description" content="app description">
<meta name="mobile-web-app-capable" content="yes">
<meta name="application-name" content="app name">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="app name">
<meta name="msapplication-config" content="browserconfig.xml">
<meta property="twitter:image" content="twitter.png">
<meta property="og:image" content="open-graph.png">
<meta name="description" content="Home page description">
<link rel="icon" type="image/png" sizes="192x192" href="android-chrome-192x192.png">
<link rel="manifest" href="manifest.json">
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="57x57" href="apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png">
<link rel="icon" type="image/png" sizes="230x230" href="favicon-230x230.png">
<link rel="shortcut icon" href="favicon.ico">
<!-- Site Styles -->
<link rel="stylesheet" href="css/vendors.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body class="home-page">
<div class="alert alert-high">
<div class="container">
<p>
<i class="fa fa-exclamation-triangle"></i>
<span>Lorem ipsum dolor sit amet, sed consecttuer adipicing, eisumod tempotLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
<a href="#" title="Find out more">Find out more</a>
</span>
</p>
<a href="javascript:void(0)" class="close ion-close" aria-label="close" title="Alert - Close">
<span class="sr-only">Close</span>
</a>
</div>
</div>
<header>
<!-- Site Header -->
<!-- Top Header -->
<div id="top-header">
<div class="container row">
<ul class="pull-left">
<li>
<a href="#" title="Lorem ipsum dolor site" target="_blank">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Lorem ipsum dolor site" target="_blank">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Lorem ipsum dolor site" target="_blank">Lorem ipsum dolor site</a>
</li>
</ul>
<ul class="pull-right">
<li class="font-controls">
<a id="enlarge" href="javascript:void(0)" title="Enlarge text">A+<span class="sr-only">Enlarge text</span></a>
<a id="shrink" href="javascript:void(0)" title="Shrink text">A-<span class="sr-only">Shrink text</span></a>
</li>
<li>
<a class="print ion-ios-printer-outline" href="javascript:window.print()" title="Print"><span class="sr-only">Print</span></a>
</li>
<li>
<a href="#content" title="Skip to content">Skip to content</a>
</li>
</ul>
</div>
</div>
<div id="header">
<div class="container row">
<div>
<!-- Site Logo -->
<a href="/" class="logo"><img src="images/logo.png" alt="Project Name - Logo" title="Project Name - Logo"></a>
<h1 class="hide">
<a class="name" href="/" title="Project Name" rel="home"><span>Project Name</span></a>
</h1>
<div class="header-aside pull-right">
<form class="search-form" action="search.html">
<input name="q" type="text" placeholder="" title="search">
<button type="submit" class="ion-ios-search-strong"></button>
</form>
<div class="social">
<a href="#" target="_blank">
<span class="ion-android-share-alt"></span><span class="sr-only">Share</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-rss"></span><span class="sr-only">Subscribe</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-facebook"></span><span class="sr-only">Facebook</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-twitter"></span><span class="sr-only">Twitter</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-linkedin"></span><span class="sr-only">Linkedin</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-instagram-outline"></span><span class="sr-only">Instagram</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div id="mobilemenu-header">
<div class="container">
<a href="javascript:void(0)" class="menu" title="mobile menu">
<span class="sr-only">mobile menu</span>
<i class="ion-android-menu"></i>
</a>
<a href="/" class="logo">
<img src="../images/transport_logo.png" alt="Transport - Logo" title="Transport - Logo">
</a>
</div>
<form class="search-form" action="search.html">
<input name="q" type="text" placeholder="Search" title="search">
<button type="submit" class="ion-ios-search-strong"></button>
</form>
</div>
</header>
<nav>
<div class="container">
<!-- Site Navigation -->
<ul class="nav">
<li>
<a href="#" title="Freight - Lorem ipsum" class="has-submenu">Lorem ipsum
<i class="ion-chevron-right"></i>
</a>
<div class="submenu">
<div class="container">
<div class="row">
<div class="col col-sm-6 col-md-3">
<div class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</div>
<div class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</div>
</div>
<div class="col col-sm-6 col-md-3">
<div class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</div>
<div class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</div>
</div>
<div class="col col-sm-6 col-md-3">
<div class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</div>
<div class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</nav>
<nav id="mobilemenu" class="hide">
<ul>
<li>
<a href="#" title="Freight - Lorem ipsum" class="has-submenu">Lorem ipsum
<i class="ion-chevron-right"></i>
</a>
<ul>
<li class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site
<i class="ion-chevron-right"></i>
</a>
</li>
<li class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site
<i class="ion-chevron-right"></i>
</a>
</li>
<li class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site
<i class="ion-chevron-right"></i>
</a>
</li>
<li class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site
<i class="ion-chevron-right"></i>
</a>
</li>
<li class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site
<i class="ion-chevron-right"></i>
</a>
</li>
<li class="group">
<a href="#" title="Freight group - Lorem ipsum dolor site">Lorem ipsum dolor site
<i class="ion-chevron-right"></i>
</a>
</li>
</ul>
</li>
</ul>
</nav>
<div class="mobile-menu-overlay hide"></div>
<div id="content">
<div id="carousel" class="carousel slide" data-ride="carousel">
<div class="carousel-wrapper">
<div class="carousel-bottom">
<a href="javascript:void(0)" class="pause" title="Pause">
<span class="sr-only">Pause</span>
<i class="ion-ios-pause"></i>
</a>
<ol class="carousel-indicators">
<li data-target="#carousel" data-slide-to="0" class="active"></li>
<li data-target="#carousel" data-slide-to="1" class=""></li>
<li data-target="#carousel" data-slide-to="2" class=""></li>
</ol>
</div>
<div class="carousel-inner" role="listbox">
<div class="fill item active" style="background-image:url('images/home/carousel/banner1.jpg')" alt="Lorem ipsum dolor site" title="Lorem ipsum dolor site">
<div class="carousel-overlay"></div>
<div class="carousel-caption">
<h2>Lorem ipsum dolor site</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.</p>
<a href="#" class="button slide">Find out more</a>
</div>
</div>
<div class="fill item" style="background-image:url('images/home/carousel/banner2.jpg')" alt="Lorem ipsum dolor site" title="Lorem ipsum dolor site">
<div class="carousel-overlay"></div>
<div class="carousel-caption">
<h2>Lorem ipsum dolor site</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.</p>
<a href="#" class="button slide">Find out more</a>
</div>
</div>
<div class="fill item" style="background-image:url('images/home/carousel/banner3.jpg')" alt="Lorem ipsum dolor site" title="Lorem ipsum dolor site">
<div class="carousel-overlay"></div>
<div class="carousel-caption">
<h2>Lorem ipsum dolor site</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.</p>
<a href="#" class="button slide">Find out more</a>
</div>
</div>
</div>
<a class="left carousel-control" href="#carousel" role="button" data-slide="prev">
<i class="ion-chevron-left icon-prev" aria-hidden="true"></i>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel" role="button" data-slide="next">
<i class="ion-chevron-right icon-next" aria-hidden="true"></i>
<span class="sr-only">Next</span>
</a>
</div>
<div class="carousel-links">
<h4>Popular searches</h4>
<ul>
<li>
<a href="#" title="Lorem ipsum dolor site">
<span>Lorem ipsum dolor site</span>
<i class="ion-ios-arrow-right"></i>
</a>
</li>
<li>
<a href="#" title="Lorem ipsum dolor site">
<span>Lorem ipsum dolor site</span>
<i class="ion-ios-arrow-right"></i>
</a>
</li>
<li>
<a href="#" title="Lorem ipsum dolor site">
<span>Lorem ipsum dolor site</span>
<i class="ion-ios-arrow-right"></i>
</a>
</li>
<li>
<a href="#" title="Lorem ipsum dolor site">
<span>Lorem ipsum dolor site</span>
<i class="ion-ios-arrow-right"></i>
</a>
</li>
</ul>
</div>
</div>
<main>
<div class="gray-bg">
<div class="container">
<section class="featured">
<div>
<ul>
<li class="col-xs-12 col-sm-4 col-md-4">
<figure>
<a href="#" title="Lorem ipsum dolor site" class="image">
<img src="images/home/featured/image1.jpg" alt="Lorem ipsum dolor site" title="Lorem ipsum dolor site">
</a>
<figcaption>
<p class="desc">
<strong>Lorem ipsum dolor site</strong><br>
Lorem ipsum dolor sit amet consecutor lorem asset asset letre alira
</p>
<a href="#" target="_self" class="findmore">
Find out more
<i class="ion-ios-arrow-right"></i>
</a>
</figcaption>
<div class="clearfix"></div>
</figure>
</li>
<li class="col-xs-12 col-sm-4 col-md-4">
<figure>
<a href="#" title="Lorem ipsum dolor site" class="image">
<img src="images/home/featured/image2.jpg" alt="Lorem ipsum dolor site" title="Lorem ipsum dolor site">
</a>
<figcaption>
<p class="desc">
<strong>Lorem ipsum dolor site</strong><br>
Lorem ipsum dolor sit amet consecutor lorem asset asset letre alira
</p>
<a href="#" target="_self" class="findmore">
Find out more
<i class="ion-ios-arrow-right"></i>
</a>
</figcaption>
<div class="clearfix"></div>
</figure>
</li>
<li class="col-xs-12 col-sm-4 col-md-4">
<figure>
<a href="#" title="Lorem ipsum dolor site" class="image">
<img src="images/home/featured/image3.jpg" alt="Lorem ipsum dolor site" title="Lorem ipsum dolor site">
</a>
<figcaption>
<p class="desc">
<strong>Lorem ipsum dolor site</strong><br>
Lorem ipsum dolor sit amet consecutor lorem asset asset letre alira
</p>
<a href="#" target="_self" class="findmore">
Find out more
<i class="ion-ios-arrow-right"></i>
</a>
</figcaption>
<div class="clearfix"></div>
</figure>
</li>
</ul>
</div>
</section>
</div>
</div>
<div class="container">
<section class="news">
<div>
<h2>Latest news</h2>
<div class="subscribe">
<a href="javascript:void(0)" class="button link" title="Subscribe to news">
<i class="fa fa-rss"></i>Subscribe to news
</a>
</div>
<ul>
<li class="col-xs-12 col-sm-6 col-md-6">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-article"></i>
<div class="desc">
<span class="date">1 April 2016 | Articles</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-media"></i>
<div class="desc">
<span class="date">1 April 2016 | Media Release</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-publication"></i>
<div class="desc">
<span class="date">1 April 2016 | Publications and reports</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-article"></i>
<div class="desc">
<span class="date">1 April 2016 | Articles</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6 hidden-xs">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-article"></i>
<div class="desc">
<span class="date">1 April 2016 | Articles</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6 hidden-xs">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-media"></i>
<div class="desc">
<span class="date">1 April 2016 | Media Release</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6 hidden-xs">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-publication"></i>
<div class="desc">
<span class="date">1 April 2016 | Publications and reports</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
<li class="col-xs-12 col-sm-6 col-md-6 hidden-xs">
<a href="news-article.html" title="Lorem ipsum dolor site">
<div class="wrapper">
<i class="icon icon-news-article"></i>
<div class="desc">
<span class="date">1 April 2016 | Articles</span>
<span class="caption">Lorem ipsum dolor site</span>
</div>
</div>
</a>
</li>
</ul>
<a class="button view-more" href="news.html">View more news</a>
</div>
</section>
</div>
<div class="container">
<section class="twitter">
<h2>Twitter</h2>
<div class="wrapper">
<i class="twitter-icon ion-social-twitter col-xs-12 col-sm-1 col-md-1 pull-left hidden-xs"></i>
<ul class="col-xs-12 col-sm-11 col-md-11 pull-right">
<li class="col-xs-12 col-sm-4 col-md-4">
<span>@twitteruser | July 21 2016</span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a href="#">Sed iaculis nunc justo</a>, in placerat in...</p>
</li>
<li class="col-xs-12 col-sm-4 col-md-4">
<span>@twitteruser | July 21 2016</span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a href="#">Sed iaculis nunc justo</a>, in placerat in...</p>
</li>
<li class="col-xs-12 col-sm-4 col-md-4">
<span>@twitteruser | July 21 2016</span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a href="#">Sed iaculis nunc justo</a>, in placerat in...</p>
</li>
</ul>
</div>
</section>
</div>
</main>
</div>
<div id="back-to-top">
<a href="javascript:void(0)" title="Back to Top" class="back-top">
<i class="up-icon ion-android-arrow-dropup"></i>
<span>Back to Top</span>
<i class="circle-icon ion-android-arrow-dropup-circle"></i>
</a>
</div>
<div class="overlay hide"></div>
<footer>
<!-- Site Footer -->
<div class="container row">
<div class="footer-menu">
<ul class="menu">
<li class="expanded col-xs-6 col-md-3">
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
</li>
<li class="expanded col-xs-6 col-md-3">
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
</li>
<li class="expanded col-xs-6 col-md-3">
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
</li>
<li class="expanded col-xs-6 col-md-3">
<div>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site" class="title">Lorem ipsum dolor site</a>
<ul class="menu">
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
<li>
<a href="#" title="Footer Menu Link - Lorem ipsum dolor site">Lorem ipsum dolor site</a>
</li>
</ul>
</div>
</li>
</ul>
</div>
<div class="bottom-footer">
<div class="row">
<div class="col-sm-12 col-md-12 col-lg-8">
<div class="links">
<ul>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
<span class="ion-android-open"></span>
</a>
</li>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
</a>
</li>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
</a>
</li>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
</a>
</li>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
</a>
</li>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
</a>
</li>
<li>
<a href="#" target="_blank">Lorem ipsum dolor site
</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-12 col-md-12 col-lg-4">
<div class="social">
<a href="#" target="_blank">
<span class="ion-android-share-alt"></span><span class="sr-only">Share</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-rss"></span><span class="sr-only">Lorem ipsum dolor site</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-facebook"></span><span class="sr-only">Lorem ipsum dolor site</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-twitter"></span><span class="sr-only">Lorem ipsum dolor site</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-linkedin"></span><span class="sr-only">Lorem ipsum dolor site</span>
</a>
<a href="#" target="_blank">
<span class="ion-social-instagram-outline"></span><span class="sr-only">Lorem ipsum dolor site</span>
</a>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- Google Analytics-->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','http://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXXXXX-1', 'auto');
ga('send', 'pageview');
</script>
<!-- Site Scripts -->
<script type="text/javascript" src="js/core.js"></script>
<script type="text/javascript" src="js/modernizr.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</body>
</html>