Files
pkrstarsbot/website/Boson/HTML/onepage-charity.html
2021-02-16 23:07:41 +01:00

790 lines
32 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<title>Boson</title>
<!-- Styles -->
<link rel="stylesheet" href="css/prettyPhoto.css">
<link rel="stylesheet" type="text/css" href="css/settings.css" media="screen"/>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/yamm/yamm.css">
<link rel="stylesheet" href="css/color-scheme/blue.css">
<link rel="stylesheet" href="css/responsive.css">
<!-- extra CSS for new pages -->
<link rel="stylesheet" href="css/custom.css">
<!-- Base JS -->
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/stellar.js"></script>
<script src="js/main.js"></script>
<!-- Revolution Slider -->
<script src="js/jquery.themepunch.plugins.min.js"></script>
<script src="js/jquery.themepunch.revolution.min.js"></script>
<script src="js/revolution-slider-options.js"></script>
<!-- Prety photo -->
<script src="js/jquery.prettyPhoto.js"></script>
<script>
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>
<!-- CSS and JS from Boson -->
<!-- Styles -->
<link rel="stylesheet" href="js/owl-carousel/owl.carousel.css">
<link rel="stylesheet" href="js/owl-carousel/owl.theme.css">
<link rel="stylesheet" href="js/owl-carousel/owl.transitions.css">
<link rel="stylesheet" href="js/rs-plugin/css/settings.css">
<link rel="stylesheet" href="js/flexslider/flexslider.css">
<link rel="stylesheet" href="js/isotope/isotope.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="js/magnific-popup/magnific-popup.css">
<link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/responsive.css">
<!-- Google Fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Raleway:400,200,100,300,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Dosis:400,200,300,500,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lovers+Quarrel' rel='stylesheet' type='text/css'>
<!-- Icon Fonts -->
<link rel="stylesheet" href="css/icomoon/style.css" type="text/css">
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css" type="text/css">
</head>
<body id="one-charity" class="onepage-body">
<div id="page-top"></div>
<div class="outer-wrapper">
<!-- HEADER -->
<header id="header-main">
<div class="container">
<nav class="navbar yamm navbar-default" >
<div class="navbar-header">
<button type="button" data-toggle="collapse" data-target="#navbar-collapse-1" class="navbar-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="./index.html" class="navbar-brand logo"><img src="img/logo.png" alt=""></a>
</div>
<div id="navbar-collapse-1" class="navbar-collapse collapse navbar-right">
<ul class="nav navbar-nav">
<li class="page-scroll"><a href="#page-top">Home</a></li>
<li class="page-scroll"><a href="#1">Donate</a></li>
<li class="page-scroll"><a href="#2">Volunteer</a></li>
<li class="page-scroll"><a href="#3">About</a></li>
<li class="page-scroll"><a href="#4">Team</a></li>
<li class="page-scroll"><a href="#5">Blog</a></li>
<li class="page-scroll"><a href="#6">Contact</a></li>
</ul>
</div>
</nav>
</div>
</header>
<div class="slider-wrap">
<div class="tp-banner-container">
<div class="tp-banner" >
<ul>
<!-- SLIDE -->
<!-- SLIDE -->
<li data-transition="fade" data-slotamount="7" data-masterspeed="2000" data-saveperformance="on" data-title="Ken Burns Slide">
<!-- MAIN IMAGE -->
<img src="images/dummy.png" alt="2" data-lazyload="images/slider/10.jpg" data-bgposition="right top" data-kenburns="off" data-duration="12000" data-ease="Power0.easeInOut" data-bgfit="115" data-bgfitend="100" data-bgpositionend="center bottom">
<!-- LAYERS -->
<!-- LAYER NR. 2 -->
<div class="tp-caption small_text customin tp-resizeme rs-parallaxlevel-0"
data-x="0"
data-y="360"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="2600"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
style="z-index: 7; max-width: auto; max-height: auto; white-space: nowrap; width: 150px !important;
height: 2px !important;
background: rgba(0,0,0,0.2) !important;
">
<p class="line white"></p>
</div>
<!-- LAYER NR. 3 -->
<div class="tp-caption finewide_medium_white lfl tp-resizeme rs-parallaxlevel-0 center-align"
data-x="0"
data-y="215"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="2200"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
style="z-index: 8; max-width: auto; max-height: auto; white-space: nowrap; color: #222222;
text-shadow: none;
font-size: 60px;
line-height: 60px;
font-weight: 900;
background-color: none;
text-decoration: none;
font-family:Open Sans, sans-serif;
text-transform: uppercase;
border-width: 0px;
color: #fff;
border-color: transparent;
border-style: none;
letter-spacing: -2px;
"><span>Help african <br>children education</span>
</div>
<!-- LAYER NR. 5 -->
<div class="tp-caption small_text lfr tp-resizeme rs-parallaxlevel-0"
data-x="0"
data-y="385"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="3000"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
style="z-index: 7; max-width: auto; max-height: auto; white-space: nowrap; position: absolute;
color: #222222;
text-shadow: none;
font-weight: 400;
font-size: 14px;
line-height: 20px;
margin: 0px;
border-width: 0px;
font-family:Open Sans, sans-serif;
text-transform: uppercase;
white-space: nowrap;
color: #fff;
letter-spacing: 1.8px;
"><span>Give them a hand along with the world</span>
</div>
<!-- LAYER NR. 6 -->
<a href="#" class="tp-caption lfb tp-resizeme rs-parallaxlevel-0"
data-x="0"
data-y="430"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="3400"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
data-linktoslide="next"
style="z-index: 12; max-width: auto; max-height: auto; white-space: nowrap;padding:15px 28px;
color: #fff;
text-transform: uppercase;
border: none;
border:2px solid #fff;
font-size: 13px;
letter-spacing: 2px;
font-family: Montserrat;
border-radius: 0px;
display: table;
transition: .4s;">Donate Now</a>
</li>
<!-- SLIDE -->
<!-- SLIDE -->
<li data-transition="fade" data-slotamount="7" data-masterspeed="2000" data-saveperformance="on" data-title="Ken Burns Slide">
<!-- MAIN IMAGE -->
<img src="images/dummy.png" alt="2" data-lazyload="images/slider/11.jpg" data-bgposition="right top" data-kenburns="off" data-duration="12000" data-ease="Power0.easeInOut" data-bgfit="115" data-bgfitend="100" data-bgpositionend="center bottom">
<!-- LAYERS -->
<!-- LAYER NR. 2 -->
<!-- LAYER NR. 2 -->
<div class="tp-caption small_text customin tp-resizeme rs-parallaxlevel-0"
data-x="center"
data-y="360"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="2600"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
style="z-index: 7; max-width: auto; max-height: auto; white-space: nowrap; width: 150px !important;
height: 2px !important;
background: rgba(0,0,0,0.2) !important;
">
<p class="line white"></p>
</div>
<!-- LAYER NR. 3 -->
<div class="tp-caption finewide_medium_white lfl tp-resizeme rs-parallaxlevel-0 center-align"
data-x="center"
data-y="215"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="2200"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
style="z-index: 8; max-width: auto; max-height: auto; white-space: nowrap; color: #222222;
text-shadow: none;
font-size: 60px;
line-height: 60px;
font-weight: 900;
background-color: none;
text-decoration: none;
font-family:Open Sans, sans-serif;
text-transform: uppercase;
border-width: 0px;
color: #fff;
text-align:center;
border-color: transparent;
border-style: none;
letter-spacing: -2px;
"><span>Join hand to save<br> the suffering people</span>
</div>
<!-- LAYER NR. 5 -->
<div class="tp-caption small_text lfr tp-resizeme rs-parallaxlevel-0"
data-x="center"
data-y="385"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="3000"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
style="z-index: 7; max-width: auto; max-height: auto; white-space: nowrap; position: absolute;
color: #222222;
text-shadow: none;
font-weight: 400;
font-size: 14px;
line-height: 20px;
margin: 0px;
border-width: 0px;
font-family:Open Sans, sans-serif;
text-transform: uppercase;
white-space: nowrap;
color: #fff;
letter-spacing: 1.8px;
"><span>Donate today. Save a child</span>
</div>
<!-- LAYER NR. 6 -->
<a href="#" class="tp-caption lfb tp-resizeme rs-parallaxlevel-0"
data-x="center"
data-y="430"
data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0;scaleY:0;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
data-speed="500"
data-start="3400"
data-easing="Power3.easeInOut"
data-splitin="none"
data-splitout="none"
data-elementdelay="0.1"
data-endelementdelay="0.1"
data-linktoslide="next"
style="z-index: 12; max-width: auto; max-height: auto; white-space: nowrap;padding:15px 28px;
color: #fff;
text-transform: uppercase;
border: none;
border:2px solid #fff;
font-size: 13px;
letter-spacing: 2px;
font-family: Montserrat;
border-radius: 0px;
display: table;
transition: .4s;">Donate Now</a>
</li>
<!-- SLIDE -->
</ul>
<div class="tp-bannertimer"></div>
</div>
</div>
</div>
<div class="inner-content padding70">
<div class="container" id="1">
<div class="col-md-8 col-md-offset-2 text-center space50">
<h2 class="uppercase head-w-ul">Donate a <span>cause</span></h2>
<p>Sed dapibus, leo ut placerat bibendum, ligula ligula consectetur eros, sed efficitur justo ex ut risus. Integer nec eros non elit finibus dictum quis sit amet augue.</p>
</div>
<div class="ct-info row">
<div class="col-md-4 text-center">
<img src="images/onepage/5/1.jpg" class="img-responsive" alt=""/>
<div class="donate-meter">
<em>$3912 Raised so far</em>
<div class="dm-wrap"><span style="width:70%"></span></div>
</div>
<div class="space20"></div>
<h4 class="uppercase">Lapien cursus lacinia </h4>
<p>Lorem ipsum dolor sit amet elit facilisis aliquam ipsum a convallis sapien cursus lacinia egestas sem elit pretium lorem rutrum sit amet tempus magna laoreet.</p>
<a href="#" class="button btn-small btn-center color5">Donate Now</a>
</div>
<div class="col-md-4 text-center">
<img src="images/onepage/5/2.jpg" class="img-responsive" alt=""/>
<div class="donate-meter">
<em>$21542 Raised so far</em>
<div class="dm-wrap"><span style="width:95%"></span></div>
</div>
<div class="space20"></div>
<h4 class="uppercase">Tempus magna laoreet</h4>
<p>Lorem ipsum dolor sit amet elit facilisis aliquam ipsum a convallis sapien cursus lacinia egestas sem elit pretium lorem rutrum sit amet tempus magna laoreet.</p>
<a href="#" class="button btn-small btn-center color5">Donate Now</a>
</div>
<div class="col-md-4 text-center">
<img src="images/onepage/5/3.jpg" class="img-responsive" alt=""/>
<div class="donate-meter">
<em>$788 Raised so far</em>
<div class="dm-wrap"><span style="width:33%"></span></div>
</div>
<div class="space20"></div>
<h4 class="uppercase">Egestas sem elit </h4>
<p>Lorem ipsum dolor sit amet elit facilisis aliquam ipsum a convallis sapien cursus lacinia egestas sem elit pretium lorem rutrum sit amet tempus magna laoreet.</p>
<a href="#" class="button btn-small btn-center color5">Donate Now</a>
</div>
</div>
</div>
<div class="clearfix space90"></div>
<div class="parallax-bg5 padding150" id="2">
<div class="container">
<div class="col-md-8 col-md-offset-2 text-center volunter-info">
<h2 class="uppercase white">Become volunteer</h2>
<p class="white">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus porta eros magna ipsum nulla. In gravida, mi id lobortis aliquet, felis tellus aliquet sapien, id placerat orci neque et tellus. Nulla commodo risus tortor, at volutpat purus porttitor ac. Nulla est risus, sodales eu diam non, finibus tempor purus. Aliquam rhoncus ex sit amet dignissim commodo. </p>
<a href="#" class="button btn-lg btn-full">Join Today</a>
</div>
</div>
</div>
<div class="container padding80" id="3">
<div class="section-about">
<div class="row">
<div class="col-md-6">
<div>
<img src="images/onepage/5/4.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-md-6">
<div>
<h3>About our Non profit</h3>
<p class="lead">Lorem ipsum dolor sit amet adipiscing elit Integer feugiat nibh Cum sociis natoque penatibus et magnis dis parturient montes nascetur ridiculus mus Nam consectetur</p>
<p>Cum nascetur ridiculus mus fen convallis tristique cursus ut consecr ac, tempus a odio. Etiam quis massa ac ante adipiscing consectetur. Duis dui turpis, porttitor sit amet metus sed, interdum tempus ipsum. Integer aliquam sem elementum pellentesque. Donec mollis eros dolor, a ongue neque venenatis vulputate. Etiam a eros adipiscing, dapibus ante id, luctus massa. Maecenas non quam interdum, aliquam leo a, ornare mi. Integer. faucibus turpis sed leo gravida laoreet. Curabitur at ligula. </p>
</div>
</div>
</div>
</div>
</div>
<div id="stats2" class="pattern-bg1 no-padding">
<div class="container">
<div class="clearfix space80"></div>
<h2 class="uppercase text-center white">Our <span class="highlight4">Achievements</span></h2>
<div class="clearfix space60"></div>
<div class="row">
<div class="col-md-3 col-sm-6">
<div class="stats2-info">
<p><span class="count">750</span></p>
<h2 class="highlight4">Children Educated</h2>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="stats2-info">
<p><span class="count">300,000</span></p>
<h2 class="highlight4">Donation Raised</h2>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="stats2-info">
<p><span class="count">2753</span></p>
<h2 class="highlight4">Volunteers</h2>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="stats2-info">
<p><span class="count">472</span></p>
<h2 class="highlight4">Rescue Camps</h2>
</div>
</div>
</div>
<div class="clearfix space80"></div>
</div>
</div>
<div class="container padding60" id="4">
<div class="col-md-8 col-md-offset-2 text-center space50">
<h2 class="uppercase head-w-ul">Our awesome <span>team</span></h2>
<p>Sed dapibus, leo ut placerat bibendum, ligula ligula consectetur eros, sed efficitur justo ex ut risus. Integer nec eros non elit finibus dictum quis sit amet augue.</p>
</div>
<div class="row" id="team2">
<div class="space50"></div>
<div class="col-md-3">
<div class="staff-img">
<img src="images/team/1.jpg" class="img-responsive" alt="">
</div>
<h2>Maud Elfreda</h2>
<span>Marketing Expert</span>
<div class="space10"></div>
<div class="text-center">
<p>Nam quis convallis erat, a fermentum tortor. Aliquam auctor felis eu mi tincidunt mollis. Morbi quis viverra lectus, eu accumsan nunc.</p>
<ul class="team-social">
<li><a class="facebook" href="#"><i class="fa fa-facebook"></i></a></li>
<li><a class="twitter" href="#"><i class="fa fa-twitter"></i></a></li>
<li><a class="google" href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a class="pinterest" href="#"><i class="fa fa-pinterest"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-3">
<div class="staff-img">
<img src="images/team/2.jpg" class="img-responsive" alt="">
</div>
<h2>Maud Elfreda</h2>
<span>Marketing Expert</span>
<div class="space10"></div>
<div class="text-center">
<p>Nam quis convallis erat, a fermentum tortor. Aliquam auctor felis eu mi tincidunt mollis. Morbi quis viverra lectus, eu accumsan nunc.</p>
<ul class="team-social">
<li><a class="facebook" href="#"><i class="fa fa-facebook"></i></a></li>
<li><a class="twitter" href="#"><i class="fa fa-twitter"></i></a></li>
<li><a class="google" href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a class="pinterest" href="#"><i class="fa fa-pinterest"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-3">
<div class="staff-img">
<img src="images/team/3.jpg" class="img-responsive" alt="">
</div>
<h2>Maud Elfreda</h2>
<span>Marketing Expert</span>
<div class="space10"></div>
<div class="text-center">
<p>Nam quis convallis erat, a fermentum tortor. Aliquam auctor felis eu mi tincidunt mollis. Morbi quis viverra lectus, eu accumsan nunc.</p>
<ul class="team-social">
<li><a class="facebook" href="#"><i class="fa fa-facebook"></i></a></li>
<li><a class="twitter" href="#"><i class="fa fa-twitter"></i></a></li>
<li><a class="google" href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a class="pinterest" href="#"><i class="fa fa-pinterest"></i></a></li>
</ul>
</div>
</div>
<div class="col-md-3">
<div class="staff-img">
<img src="images/team/4.jpg" class="img-responsive" alt="">
</div>
<h2>Maud Elfreda</h2>
<span>Marketing Expert</span>
<div class="space10"></div>
<div class="text-center">
<p>Nam quis convallis erat, a fermentum tortor. Aliquam auctor felis eu mi tincidunt mollis. Morbi quis viverra lectus, eu accumsan nunc.</p>
<ul class="team-social">
<li><a class="facebook" href="#"><i class="fa fa-facebook"></i></a></li>
<li><a class="twitter" href="#"><i class="fa fa-twitter"></i></a></li>
<li><a class="google" href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a class="pinterest" href="#"><i class="fa fa-pinterest"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="space30"></div>
<div class="parallax-bg6 padding60">
<div class="container">
<div class="testimonial-box">
<div id="testimonial" class="owl-carousel">
<div class="quote-info">
<img src="images/quote/1.jpg" class="img-responsive" alt="">
<p>Duis iaculis mauris dui tellus arcu rhoncus tellus non suscipit nisl tincidunt eget. Mauris in porta sapien. Pellentesque luctus urna volutpat, mollis dolor porttitor, rutrum sem. Aliquam vitae orci a libero iaculis sollicitudin. Sed ullamcorper lorem justo, ut elementum enim dapibus vel.</p>
<h2 class="white">David Billie</h2>
</div>
<div class="quote-info">
<img src="images/quote/2.jpg" class="img-responsive" alt="">
<p>Duis iaculis mauris dui tellus arcu rhoncus tellus non suscipit nisl tincidunt eget. Mauris in porta sapien. Pellentesque luctus urna volutpat, mollis dolor porttitor, rutrum sem. Aliquam vitae orci a libero iaculis sollicitudin. Sed ullamcorper lorem justo, ut elementum enim dapibus vel.</p>
<h2 class="white">Katey Thane</h2>
</div>
<div class="quote-info">
<img src="images/quote/3.jpg" class="img-responsive" alt="">
<p>Duis iaculis mauris dui tellus arcu rhoncus tellus non suscipit nisl tincidunt eget. Mauris in porta sapien. Pellentesque luctus urna volutpat, mollis dolor porttitor, rutrum sem. Aliquam vitae orci a libero iaculis sollicitudin. Sed ullamcorper lorem justo, ut elementum enim dapibus vel.</p>
<h2 class="white">Wally Buddy</h2>
</div>
</div>
</div>
</div>
</div>
<div class="container home-blog padding80" id="5">
<div class="text-center space40">
<h2 class="title uppercase">Latest from blog</h2>
<p>Sed laoreet libero eget tempus blandit praesent eu erat sed sem facilisis rutrum metus<br>facilisis eros justo non ipsum aliquam lacinia non eu ex.</p>
</div>
<div class="row">
<div class="col-md-4">
<div class="hb-info text-center">
<div class="hb-thumb">
<img src="images/blog/1.jpg" class="img-responsive" alt=""/>
<div class="date-meta">
June<span>06</span>2015
</div>
</div>
<h4><a href="#">Climb the mountain</a></h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque volutpat mi tellus, euismod viverra dolor ultrices sit amet.</p>
<a href="#" class="readmore">Read more...</a>
</div>
</div>
<div class="col-md-4">
<div class="hb-info text-center">
<div class="hb-thumb">
<img src="images/blog/2.jpg" class="img-responsive" alt=""/>
<div class="date-meta">
June<span>02</span>2015
</div>
</div>
<h4><a href="#">Girl showing stats</a></h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque volutpat mi tellus, euismod viverra dolor ultrices sit amet.</p>
<a href="#" class="readmore">Read more...</a>
</div>
</div>
<div class="col-md-4">
<div class="hb-info text-center">
<div class="hb-thumb">
<img src="images/blog/3.jpg" class="img-responsive" alt=""/>
<div class="date-meta">
May<span>30</span>2015
</div>
</div>
<h4><a href="#">A photographers heart</a></h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque volutpat mi tellus, euismod viverra dolor ultrices sit amet.</p>
<a href="#" class="readmore">Read more...</a>
</div>
</div>
</div>
</div>
<div class="border-top">
<div class="space80"></div>
<div class="clients container">
<h3 class="uppercase text-center no-margin ">Our Support sponsers</h3>
<div class="space30"></div>
<div id="carousel_five" class="owl-carousel">
<div class="item client-logo">
<a href="#"><img src="images/clients/1.png" class="img-responsive" alt=""/></a>
</div>
<div class="item client-logo">
<a href="#"><img src="images/clients/2.png" class="img-responsive" alt=""/></a>
</div>
<div class="item client-logo">
<a href="#"><img src="images/clients/3.png" class="img-responsive" alt=""/></a>
</div>
<div class="item client-logo">
<a href="#"><img src="images/clients/4.png" class="img-responsive" alt=""/></a>
</div>
<div class="item client-logo">
<a href="#"><img src="images/clients/5.png" class="img-responsive" alt=""/></a>
</div>
<div class="item client-logo">
<a href="#"><img src="images/clients/6.png" class="img-responsive" alt=""/></a>
</div>
<div class="item client-logo">
<a href="#"><img src="images/clients/7.png" class="img-responsive" alt=""/></a>
</div>
</div>
</div>
</div>
</div>
<div class="border-top"></div>
<div class="container-fluid no-padding" id="6">
<div class="col-md-6 full-contact">
<h4 class="uppercase no-margin">Contact Us</h4>
<div class="space20"></div>
<p>We would be glad to have feedback from you. Drop us a line, whether it is a comment, a question or just a hello. You can use either the form below or the contact details on the right.</p>
<form class="home-contact-form">
<div class="row">
<div class="col-md-6">
<div class="input-wrap">
<input class="i-field" placeholder="Name (required)" type="text">
<i class="fa fa-user"></i>
</div>
</div>
<div class="col-md-6">
<div class="input-wrap">
<input class="i-field" placeholder="Email (required)" type="text">
<i class="fa fa-envelope"></i>
</div>
</div>
</div>
<div class="input-wrap">
<input class="i-field" placeholder="Subject" type="text">
<i class="fa fa-pencil"></i>
</div>
<div class="textarea-wrap">
<textarea class="i-field" placeholder="Message"></textarea>
<i class="fa fa-pencil"></i>
</div>
<input class="button" value="Send it" type="submit">
</form>
</div>
<div class="col-md-6 no-padding">
<div class="map-greyscale" id="map-greyscale"></div>
</div>
</div>
<!-- FOOTER -->
<!-- FOOTER COPYRIGHT -->
<div class="footer-bottom">
<div class="container">
<div class="row">
<div class="col-md-7">
<span class="copy">Copyright &copy; 2016 <a href="index.html">Boson</a>. All Right Reserved.</span>
</div>
<div class="col-md-5">
<div class="f-social pull-right">
<a class="fa fa-twitter" href="#"></a>
<a class="fa fa-facebook" href="#"></a>
<a class="fa fa-linkedin" href="#"></a>
<a class="fa fa-dribbble" href="#"></a>
<a class="fa fa-google-plus" href="#"></a>
<a class="fa fa-skype" href="#"></a>
<a class="fa fa-behance" href="#"></a>
<a class="fa fa-stumbleupon" href="#"></a>
<a class="fa fa-rss" href="#"></a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- STYLE SWITCHER
============================================= -->
<div class="b-settings-panel">
<div class="settings-section">
<span>
Boxed
</span>
<div class="b-switch">
<div class="switch-handle"></div>
</div>
<span>
Wide
</span>
</div>
<hr class="dashed" style="margin: 15px 0px;">
<h5>Main Background</h5>
<div class="settings-section bg-list">
<div class="bg-pattern1"></div>
<div class="bg-pattern2"></div>
<div class="bg-pattern6"></div>
<div class="bg-pattern10"></div>
<div class="bg-pattern16"></div>
<div class="bg-pattern4"></div>
<div class="bg-pattern5"></div>
<div class="bg-pattern7"></div>
<div class="bg-pattern9"></div>
<div class="bg-pattern11"></div>
<div class="bg-pattern12"></div>
<div class="bg-pattern13"></div>
<div class="bg-pattern17"></div>
<div class="bg-pattern8"></div>
<div class="bg-pattern14"></div>
<div class="bg-pattern15"></div>
<div class="bg-pattern3"></div>
<div class="bg-pattern18"></div>
</div>
<hr class="dashed" style="margin: 15px 0px;">
<h5>Color Scheme</h5>
<div class="settings-section color-list">
<div data-src="css/color-scheme/moderate-green.css" style="background: #8ec249"></div>
<div data-src="css/color-scheme/vivid-blue.css" style="background: #228dff"></div>
<div data-src="css/color-scheme/orange.css" style="background: #fa6900"></div>
<div data-src="css/color-scheme/brown.css" style="background: #a68c69"></div>
<div data-src="css/color-scheme/yellow.css" style="background: #fabe28"></div>
<div data-src="css/color-scheme/violet.css" style="background: #ba01ff"></div>
<div data-src="css/color-scheme/strong-cyan.css" style="background: #00b9bd"></div>
<div data-src="css/color-scheme/soft-cyan.css" style="background: #4bd5ea"></div>
<div data-src="css/color-scheme/red.css" style="background: #ff0104"></div>
<div data-src="css/color-scheme/lite-brown.css" style="background: #f3a76d"></div>
<div data-src="css/color-scheme/lime-green.css" style="background: #3bdbad"></div>
<div data-src="css/color-scheme/light-voilet.css" style="background: #aaa5ff"></div>
<div data-src="css/color-scheme/gray-green.css" style="background: #697060"></div>
<div data-src="css/color-scheme/gray-cyan.css" style="background: #aeced2"></div>
<div data-src="css/color-scheme/de-green.css" style="background: #b6cd71"></div>
<div data-src="css/color-scheme/cream.css" style="background: #e0d6b2"></div>
</div>
<div class="btn-settings"></div>
</div>
<!-- END STYLE SWITCHER
============================================= -->
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Plugins -->
<script src="js/bootstrap.min.js"></script>
<script src="js/menu.js"></script>
<script src="js/owl-carousel/owl.carousel.min.js"></script>
<script src="js/rs-plugin/js/jquery.themepunch.tools.min.js"></script>
<script src="js/rs-plugin/js/jquery.themepunch.revolution.min.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/isotope/isotope.pkgd.js"></script>
<script src="js/jflickrfeed.min.js"></script>
<script src="js/tweecool.js"></script>
<script src="js/flexslider/jquery.flexslider.js"></script>
<script src="js/easypie/jquery.easypiechart.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/jquery.appear.js"></script>
<script src="js/jquery.inview.js"></script>
<script src="js/jquery.countdown.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/magnific-popup/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.easing/jquery.easing.js"></script>
<script src="js/hippo-off-canvas.js"></script>
<script src="js/main.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script src="js/gmaps/greyscale.js"></script>
<script>
jQuery( "button.navbar-toggle" ).click(function(){
jQuery('#navbar-collapse-1').toggleClass('in');
});
</script>
<script src="js/menu-target.js"></script>
</body>
</html>