mirror of
https://github.com/dawidolko/Website-Templates.git
synced 2025-10-28 00:03:10 +01:00
870 lines
29 KiB
HTML
870 lines
29 KiB
HTML
|
||
<!DOCTYPE html>
|
||
<!-- ##########################################################################
|
||
Don't remove this attribution!
|
||
saved from url http://www.bootstraptor.com
|
||
This template part of Bootstraptor KIT built with Bootstrap 3 Developer Kit v.3.0. by @Bootstraptor
|
||
Bootstrap 3.0.version latest stable
|
||
Read usage license on for this template on http://www.bootstraptor.com
|
||
##########################################################################
|
||
-->
|
||
<html lang="en">
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||
<meta charset="utf-8">
|
||
<title>Base landing page</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta name="description" content="">
|
||
<meta name="author" content="">
|
||
|
||
|
||
<!-- GOOGLE FONT-->
|
||
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,700italic,700,500&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
|
||
<!-- /GOOGLE FONT-->
|
||
|
||
<!-- GOOGLE FONT-->
|
||
<link href='http://fonts.googleapis.com/css?family=Comfortaa:400,300,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
|
||
<!-- /GOOGLE FONT-->
|
||
|
||
<!-- GOOGLE FONT-->
|
||
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,800' rel='stylesheet' type='text/css'>
|
||
<!-- /GOOGLE FONT-->
|
||
|
||
<!-- Le styles -->
|
||
<!-- Latest compiled and minified CSS BS 3.0. latest-->
|
||
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
|
||
<link href="assets/js/bootstrap.min.js" type="text/javascript">
|
||
<link href="assets/js/bootstrap.js" type="text/javascript">
|
||
|
||
|
||
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet">
|
||
<style>
|
||
body {
|
||
padding-top: 0px;
|
||
font-family: 'Roboto', sans-serif;
|
||
/*font-family: 'Comfortaa', cursive;*/
|
||
/*font-family: 'Open Sans', sans-serif;*/
|
||
}
|
||
|
||
h1, h2, h3, h4, h5, h6 {
|
||
font-family: 'Comfortaa', cursive;
|
||
}
|
||
.navbar{
|
||
min-height:80px;
|
||
background:#fff;
|
||
-webkit-box-shadow: 0px 4px 3px rgba(50, 50, 50, 0.23);
|
||
-moz-box-shadow: 0px 4px 3px rgba(50, 50, 50, 0.23);
|
||
box-shadow: 0px 4px 3px rgba(50, 50, 50, 0.23);
|
||
}
|
||
.navbar-nav>li>a {
|
||
padding-top: 30px;
|
||
padding-bottom: 30px;
|
||
font-size:28px;
|
||
text-transform:uppercase;
|
||
font-weight:700;
|
||
}
|
||
.navbar-nav>.active>a,
|
||
.navbar-nav>.active>a:hover,
|
||
.navbar-nav>.active>a:focus {
|
||
color: #e82e46;
|
||
background: none;
|
||
}
|
||
|
||
.navbar-brand{
|
||
color:#e82e46;
|
||
font-size:28px;
|
||
padding-top:25px;
|
||
font-weight:700;
|
||
}
|
||
.navbar-default .navbar-brand{
|
||
color:#e82e46;
|
||
|
||
}
|
||
|
||
.nav>li>a{
|
||
padding:25px 40px;
|
||
|
||
}
|
||
|
||
|
||
header .jumbotron{
|
||
|
||
-webkit-border-radius:0px;
|
||
-moz-border-radius:0px;
|
||
border-radius:0px;
|
||
margin-bottom:0px;
|
||
overflow:hidden;
|
||
padding-bottom:150px;
|
||
font-weight:700;
|
||
padding-top:100px;
|
||
background:#e82e46;
|
||
color:#fff;
|
||
}
|
||
#foot-sec .jumbotron {
|
||
margin-bottom:0px;
|
||
}
|
||
|
||
header{
|
||
padding-top:40px;
|
||
padding-bottom:0px;
|
||
margin-bottom:40px;
|
||
}
|
||
|
||
section {
|
||
margin-bottom:40px;
|
||
padding-top:40px;
|
||
margin-top:-40px;
|
||
min-height:400px;
|
||
width:100%;
|
||
min-width:100%;
|
||
}
|
||
|
||
|
||
.page-header h2{
|
||
font-size:46px;
|
||
line-height:60px;
|
||
font-weight:300;
|
||
}
|
||
.round-wrapper {
|
||
width: 150px;
|
||
height: 150px;
|
||
margin: 0 auto;
|
||
line-height: 165px;
|
||
text-align: center;
|
||
background:#e82e46;
|
||
border-radius: 150px;
|
||
padding: 15px;
|
||
overflow:hidden;
|
||
-webkit-box-sizing: border-box;
|
||
-moz-box-sizing: border-box;
|
||
box-sizing: border-box;
|
||
text-shadow: rgb(184, 36, 55) 1px 1px,
|
||
rgb(184, 36, 55) 2px 2px,
|
||
rgb(184, 36, 55) 3px 3px,
|
||
rgb(184, 36, 55) 4px 4px,
|
||
rgb(184, 36, 55) 5px 5px,
|
||
rgb(184, 36, 55) 6px 6px,
|
||
rgb(184, 36, 55) 7px 7px,
|
||
rgb(184, 36, 55) 8px 8px,
|
||
rgb(184, 36, 55) 9px 9px,
|
||
rgb(184, 36, 55) 10px 10px,
|
||
rgb(184, 36, 55) 11px 11px,
|
||
rgb(184, 36, 55) 12px 12px,
|
||
rgb(184, 36, 55) 13px 13px,
|
||
rgb(184, 36, 55) 14px 14px,
|
||
rgb(184, 36, 55) 15px 15px,
|
||
rgb(184, 36, 55) 16px 16px,
|
||
rgb(184, 36, 55) 17px 17px,
|
||
rgb(184, 36, 55) 18px 18px,
|
||
rgb(184, 36, 55) 19px 19px,
|
||
rgb(184, 36, 55) 20px 20px,
|
||
rgb(184, 36, 55) 21px 21px,
|
||
rgb(184, 36, 55) 22px 22px,
|
||
rgb(184, 36, 55) 23px 23px,
|
||
rgb(184, 36, 55) 24px 24px,
|
||
rgb(184, 36, 55) 25px 25px,
|
||
rgb(184, 36, 55) 26px 26px,
|
||
rgb(184, 36, 55) 27px 27px,
|
||
rgb(184, 36, 55) 28px 28px,
|
||
rgb(184, 36, 55) 29px 29px,
|
||
rgb(184, 36, 55) 30px 30px,
|
||
rgb(184, 36, 55) 31px 31px,
|
||
rgb(184, 36, 55) 32px 32px,
|
||
rgb(184, 36, 55) 33px 33px,
|
||
rgb(184, 36, 55) 34px 34px,
|
||
rgb(184, 36, 55) 35px 35px,
|
||
rgb(184, 36, 55) 36px 36px,
|
||
rgb(184, 36, 55) 37px 37px,
|
||
rgb(184, 36, 55) 38px 38px,
|
||
rgb(184, 36, 55) 39px 39px,
|
||
rgb(184, 36, 55) 40px 40px,
|
||
rgb(184, 36, 55) 41px 41px,
|
||
rgb(184, 36, 55) 42px 42px,
|
||
rgb(184, 36, 55) 43px 43px,
|
||
rgb(184, 36, 55) 44px 44px,
|
||
rgb(184, 36, 55) 45px 45px,
|
||
rgb(184, 36, 55) 46px 46px,
|
||
rgb(184, 36, 55) 47px 47px,
|
||
rgb(184, 36, 55) 48px 48px,
|
||
rgb(184, 36, 55) 49px 49px,
|
||
rgb(184, 36, 55) 50px 50px,
|
||
rgb(184, 36, 55) 51px 51px,
|
||
rgb(184, 36, 55) 52px 52px,
|
||
rgb(184, 36, 55) 53px 53px,
|
||
rgb(184, 36, 55) 54px 54px,
|
||
rgb(184, 36, 55) 55px 55px,
|
||
rgb(184, 36, 55) 56px 56px,
|
||
rgb(184, 36, 55) 57px 57px,
|
||
rgb(184, 36, 55) 58px 58px,
|
||
rgb(184, 36, 55) 59px 59px,
|
||
rgb(184, 36, 55) 60px 60px,
|
||
rgb(184, 36, 55) 61px 61px,
|
||
rgb(184, 36, 55) 62px 62px,
|
||
rgb(184, 36, 55) 63px 63px,
|
||
rgb(184, 36, 55) 64px 64px,
|
||
rgb(184, 36, 55) 65px 65px,
|
||
rgb(184, 36, 55) 66px 66px,
|
||
rgb(184, 36, 55) 67px 67px,
|
||
rgb(184, 36, 55) 68px 68px,
|
||
rgb(184, 36, 55) 69px 69px,
|
||
rgb(184, 36, 55) 70px 70px,
|
||
rgb(184, 36, 55) 71px 71px,
|
||
rgb(184, 36, 55) 72px 72px,
|
||
rgb(184, 36, 55) 73px 73px,
|
||
rgb(184, 36, 55) 74px 74px,
|
||
rgb(184, 36, 55) 75px 75px,
|
||
rgb(184, 36, 55) 76px 76px,
|
||
rgb(184, 36, 55) 77px 77px,
|
||
rgb(184, 36, 55) 78px 78px,
|
||
rgb(184, 36, 55) 79px 79px,
|
||
rgb(184, 36, 55) 80px 80px,
|
||
rgb(184, 36, 55) 81px 81px,
|
||
rgb(184, 36, 55) 82px 82px,
|
||
rgb(184, 36, 55) 83px 83px,
|
||
rgb(184, 36, 55) 84px 84px,
|
||
rgb(195, 38, 58) 85px 85px,
|
||
rgb(207, 41, 62) 86px 86px;
|
||
}
|
||
.round-wrapper i.icon-4x{
|
||
font-size:90px;
|
||
}
|
||
|
||
/************* VIDEO *******************************/
|
||
|
||
.fluid-width-video-wrapper {
|
||
width: 100%;
|
||
position: relative;
|
||
padding: 0;
|
||
padding-top: 50%;
|
||
}
|
||
.vendor {
|
||
margin-bottom: 0px;
|
||
}
|
||
|
||
.container-video {
|
||
width: 100%;
|
||
min-width: 100%;
|
||
position: relative;
|
||
padding: 0;
|
||
height: 100%;
|
||
}
|
||
|
||
.fluid-width-video-wrapper iframe,
|
||
.fluid-width-video-wrapper object,
|
||
.fluid-width-video-wrapper embed {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
border:0px;
|
||
}
|
||
|
||
.video-well.well{
|
||
-webkit-border-radius:0px;
|
||
-moz-border-radius:0px;
|
||
border-radius:0px;
|
||
}
|
||
|
||
/* @MEDIA
|
||
================================== */
|
||
@media (max-width: 1200px) {
|
||
.nav>li>a{
|
||
padding-right:20px;
|
||
padding-left:20px;
|
||
font-size:20px;
|
||
}
|
||
|
||
}
|
||
@media (max-width: 960px) and (min-width: 768px){
|
||
.nav>li>a{
|
||
padding-right:15px;
|
||
padding-left:15px;
|
||
font-size:18px;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
</style>
|
||
<!--[if lt IE 7]>
|
||
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome-ie7.min.css" rel="stylesheet">
|
||
<![endif]-->
|
||
<!-- Fav and touch icons -->
|
||
|
||
|
||
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
|
||
<!--[if lt IE 9]>
|
||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
|
||
<![endif]-->
|
||
<!-- Le fav and touch icons -->
|
||
<link rel="shortcut icon" href="assets/ico/favicon.ico">
|
||
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
|
||
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
|
||
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
|
||
<link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
|
||
|
||
</head>
|
||
<!-- /HEAD-->
|
||
<body data-spy="scroll" data-target=".navbar">
|
||
|
||
<nav id="topnav" class="navbar navbar-fixed-top navbar-default" role="navigation">
|
||
<div class="container">
|
||
<!-- Brand and toggle get grouped for better mobile display -->
|
||
<div class="navbar-header">
|
||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
|
||
<span class="sr-only">Toggle navigation</span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="#">AGENCY BS 3.0.</a>
|
||
</div>
|
||
|
||
<!-- Collect the nav links, forms, and other content for toggling -->
|
||
<div class="collapse navbar-collapse navbar-ex1-collapse">
|
||
|
||
<ul class="nav navbar-nav pull-right">
|
||
<li style="display:none;"><a href="#topnav">HOME</a></li>
|
||
<li><a href="#Section-1">ABOUT US</a></li>
|
||
<li><a href="#Section-2">WORKS</a></li>
|
||
<li><a href="#Section-3">FEATURES</a></li>
|
||
<li><a href="#foot-sec">CONTACT</a></li>
|
||
</ul>
|
||
</div><!-- /.navbar-collapse -->
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- HEADER -->
|
||
<header id="top-section">
|
||
<!-- Main hero unit for a primary marketing message or call to action -->
|
||
<div class="jumbotron">
|
||
<div class="container">
|
||
<div class="row">
|
||
<!-- description-->
|
||
<div class="text-left col-sm-12 col-lg-12 text-center">
|
||
<h1 class="">We build an exceptional websites!</h1>
|
||
<p class="lead">
|
||
High-Performance Landing Pages Flat style look catchy Lead paragraph. High-Performance Landing Pages Flat style look catchy Lead paragraph. High-Performance Landing Pages Flat style look catchy Lead paragraph.
|
||
</p>
|
||
<hr>
|
||
<p class="text-center"><a class="btn btn-default btn-lg" href="#foot-sec" title="">REQUEST A FREE QUOTE</a></p>
|
||
|
||
|
||
</div>
|
||
<!-- / description-->
|
||
</div><!-- /ROW-->
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<!-- / HEADER -->
|
||
|
||
|
||
<!-- SECTION-1 -->
|
||
<section id="Section-1">
|
||
<div class="row">
|
||
<div class="col-12 col-lg-12 page-header page-header-custom text-center" >
|
||
<h2>ABOUT US</h2>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="container ">
|
||
<div class="row">
|
||
<div class="col-lg-4 col-sm-12 text-center">
|
||
<div class="round-wrapper">
|
||
<i class="icon-mobile-phone icon-4x" style="color:#fff;"></i>
|
||
</div>
|
||
<h3>MOBILE APPS</h3>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<div class="col-lg-4 col-sm-12 text-center">
|
||
<div class="round-wrapper">
|
||
<i class="icon-tablet icon-4x" style="color:#fff;"></i>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<h3>APPS FOR TABLETS</h3>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<div class="col-lg-4 col-sm-12 text-center">
|
||
<div class="round-wrapper">
|
||
<i class="icon-desktop icon-4x" style="color:#fff;"></i>
|
||
</div>
|
||
<h3>DESKTOPS APPS</h3>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<div class="col-lg-4 col-sm-12 text-center">
|
||
<div class="round-wrapper">
|
||
<i class="icon-mobile-phone icon-4x" style="color:#fff;"></i>
|
||
</div>
|
||
<h3>MOBILE APPS</h3>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<div class="col-lg-4 col-sm-12 text-center">
|
||
<div class="round-wrapper">
|
||
<i class="icon-tablet icon-4x" style="color:#fff;"></i>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<h3>APPS FOR TABLETS</h3>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
<div class="col-lg-4 col-sm-12 text-center">
|
||
<div class="round-wrapper">
|
||
<i class="icon-desktop icon-4x" style="color:#fff;"></i>
|
||
</div>
|
||
<h3>DESKTOPS APPS</h3>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="row">
|
||
<div class="col-12 col-lg-12 page-header page-header-custom text-center">
|
||
<h3>WHAT PEOPLE SAY ABOUT YOUR WORKS</h3>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-6 col-lg-6">
|
||
<blockquote>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
<small>Someone famous in <cite title="Source Title">Source Title</cite></small>
|
||
</blockquote>
|
||
</div>
|
||
<div class="col-6 col-lg-6">
|
||
<blockquote>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
<small>Someone famous in <cite title="Source Title">Source Title</cite></small>
|
||
</blockquote>
|
||
</div>
|
||
|
||
<div class="col-6 col-lg-6">
|
||
<blockquote>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
<small>Someone famous in <cite title="Source Title">Source Title</cite></small>
|
||
</blockquote>
|
||
</div>
|
||
<div class="col-6 col-lg-6">
|
||
<blockquote>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
|
||
<small>Someone famous in <cite title="Source Title">Source Title</cite></small>
|
||
</blockquote>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- Example row of columns -->
|
||
</div>
|
||
|
||
<div class="jumbotron">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-12 col-lg-12">
|
||
<div class="row">
|
||
<div class=" col-12 col-lg-9">
|
||
<p class="lead">HERE GOES YOUR ACTION SLOGAN! BUY OUR AWESOME PRODUCT RIGHT NOW! OR TRY PRO VERSION FOR FREE!</p>
|
||
</div>
|
||
<div class=" text-center col-12 col-lg-3">
|
||
<a class="btn btn-danger btn-block btn-lg" href="#" title="">Sign up now!</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- /container -->
|
||
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-12 col-lg-12 page-header page-header-custom text-center" >
|
||
<h2>OUR SERVICES</h2>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-6 col-lg-4">
|
||
|
||
<h3>Feature Heading</h3>
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<p><a class="btn btn-default" href="http://www.bootstraptor.com">View details <20></a></p>
|
||
</div>
|
||
<div class="col-6 col-lg-4">
|
||
<h3>Feature Heading</h3>
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<p><a class="btn btn-default" href="http://www.bootstraptor.com">View details <20></a></p>
|
||
</div>
|
||
<div class="col-6 col-lg-4">
|
||
<h3>Feature Heading</h3>
|
||
<p> <i class="icon-desktop "></i> Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||
<p><a class="btn btn-default" href="http://www.bootstraptor.com">View details <20></a></p>
|
||
</div>
|
||
<div class="col-6 col-lg-4">
|
||
<h3>Feature Heading</h3>
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<p><a class="btn btn-default" href="http://www.bootstraptor.com">View details <20></a></p>
|
||
</div>
|
||
<div class="col-6 col-lg-4">
|
||
<h3>Feature Heading</h3>
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<p><a class="btn btn-default" href="http://www.bootstraptor.com">View details <20></a></p>
|
||
</div>
|
||
<div class="col-6 col-lg-4">
|
||
<h3>Feature Heading</h3>
|
||
<p> <i class="icon-desktop "></i> Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||
<p><a class="btn btn-default" href="http://www.bootstraptor.com">View details <20></a></p>
|
||
</div>
|
||
</div>
|
||
</div><!-- / CONTAINER-->
|
||
</section>
|
||
|
||
<!-- / SECTION-1 -->
|
||
|
||
<!-- SECTION-2 -->
|
||
<section id="Section-2">
|
||
<div class="jumbotron">
|
||
<div class="container">
|
||
|
||
<div class="row">
|
||
<div class="page-header text-center col-sm-12 col-lg-12">
|
||
<h2>TAKE A LOOK TO OUR WORKS</h2>
|
||
</div>
|
||
</div>
|
||
</div><!-- / CONTAINER-->
|
||
<div class="container">
|
||
<!-- Example row of columns -->
|
||
<div class="row">
|
||
<div class="col-12 col-lg-4">
|
||
<div class="panel">
|
||
<img class="img-responsive" src="images/thumb.jpg" alt="thumb">
|
||
<div class="panel-footer">
|
||
<h4>Project title here</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-lg-4">
|
||
<div class="panel">
|
||
<img class="img-responsive" src="images/thumb.jpg" alt="thumb">
|
||
<div class="panel-footer">
|
||
<h4>Project title here</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-lg-4">
|
||
<div class="panel">
|
||
<img class="img-responsive" src="images/thumb.jpg" alt="thumb">
|
||
<div class="panel-footer">
|
||
<h4>Project title here</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Example row of columns -->
|
||
<div class="row">
|
||
<div class="col-12 col-lg-4">
|
||
<div class="panel">
|
||
<img class="img-responsive" src="images/thumb.jpg" alt="thumb">
|
||
<div class="panel-footer">
|
||
<h4>Project title here</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-lg-4">
|
||
<div class="panel">
|
||
<img class="img-responsive" src="images/thumb.jpg" alt="thumb">
|
||
<div class="panel-footer">
|
||
<h4>Project title here</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-lg-4">
|
||
<div class="panel">
|
||
<img class="img-responsive" src="images/thumb.jpg" alt="thumb">
|
||
<div class="panel-footer">
|
||
<h4>Project title here</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div><!-- / CONTAINER-->
|
||
</div>
|
||
</section>
|
||
<!-- / SECTION-2 -->
|
||
|
||
<!-- SECTION-3 -->
|
||
<section id="Section-3">
|
||
<div class="container">
|
||
|
||
<div class="row">
|
||
<div class="page-header text-center col-sm-12 col-lg-12">
|
||
<h2>MORE FEATURES</h2>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Example row of columns -->
|
||
<div class="row">
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-desktop icon-4x"></i>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-desktop icon-4x"></i>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-laptop icon-4x"></i></span>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
</i><i class="icon-laptop icon-4x"></i></span>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-tablet icon-4x"></i>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-tablet icon-4x"></i>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-mobile-phone icon-4x"></i>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
<!-- ITEM-->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<div class="row">
|
||
<div class="text-center col-sm-2 col-lg-2">
|
||
<i class="icon-mobile-phone icon-4x"></i>
|
||
</div>
|
||
<div class="col-sm-10 col-lg-10">
|
||
<p> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- / ITEM-->
|
||
|
||
|
||
</div>
|
||
<hr>
|
||
<div class="row">
|
||
<div class="page-header text-center col-sm-12 col-lg-12">
|
||
<h3 style="text-transform:uppercase;">Here goes main sub-title slogan h3</h3>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
|
||
<!-- ITEM -->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<hr>
|
||
</div>
|
||
<!-- ITEM -->
|
||
|
||
<!-- ITEM -->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<hr>
|
||
</div>
|
||
<!-- ITEM -->
|
||
|
||
<!-- ITEM -->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<hr>
|
||
</div>
|
||
<!-- ITEM -->
|
||
|
||
<!-- ITEM -->
|
||
<div class="col-sm-6 col-lg-6">
|
||
<p> <i class="icon-desktop "></i> Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||
<hr>
|
||
</div>
|
||
<!-- ITEM -->
|
||
</div>
|
||
</div><!-- / CONTAINER-->
|
||
|
||
</section>
|
||
<!-- / SECTION-2 -->
|
||
|
||
<!-- FOOTER -->
|
||
<footer id="foot-sec">
|
||
<div class="jumbotron">
|
||
<div class="row">
|
||
<div class="text-center col-12 col-lg-12 page-header">
|
||
<h2>Request a free quote</h2>
|
||
</div>
|
||
<div class="text-center col-12 col-lg-12">
|
||
<form id="ajax-contacts" class="text-center">
|
||
<fieldset>
|
||
<div class="form-group">
|
||
<label for="name">Name</label><input class="form-control text-center" type="text" name="name" value="">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="email">E-Mail</label><input class="form-control text-center" type="text" name="email" value=""><br>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject">Subject</label><input class="form-control text-center" type="text" name="subject" value=""><br>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="message">Comments</label><textarea class="form-control text-center" name="message" rows="5" cols="25"></textarea><br>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="submit"> </label><input class="btn btn-lg btn-info" type="submit" name="submit" value="Send Message">
|
||
</div>
|
||
<fieldset>
|
||
|
||
<!-- END CONTACT FORM -->
|
||
</form>
|
||
</div>
|
||
</div>
|
||
<hr>
|
||
<div class="row">
|
||
<div class="text-center col-12 col-lg-12">
|
||
|
||
<p><EFBFBD> 2013 Built with <a class="" href="http://www.bootstraptor.com">www.bootstraptor.com</a></p>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
<!-- / FOOTER -->
|
||
|
||
|
||
<!-- Le javascript
|
||
================================================== -->
|
||
<!-- Placed at the end of the document so the pages load faster -->
|
||
<script src="assets/js/jquery.js" type="text/javascript"></script>
|
||
<!-- Latest compiled and minified JavaScript -->
|
||
<script src="assets//js/bootstrap.min.js"></script>
|
||
<!-- PAGE CUSTOM SCROLLER -->
|
||
<script type="text/javascript" src="assets/js/jquery.nicescroll.min.js"></script>
|
||
|
||
<script src="assets/js/jquery.parallax-1.1.3.js" type="text/javascript" ></script>
|
||
<script src="assets/js/jquery.localscroll-1.2.7-min.js" type="text/javascript" ></script>
|
||
<script src="assets/js/jquery.scrollTo-1.4.6-min.js" type="text/javascript" ></script>
|
||
|
||
<!-- responsive video-->
|
||
<script src="assets/js/jquery.fitvids.min.js" type="text/javascript"></script>
|
||
<script>
|
||
// Basic FitVids Test
|
||
jQuery(".container").fitVids();
|
||
|
||
</script>
|
||
<!-- / responsive video-->
|
||
|
||
<script>
|
||
jQuery(document).ready(function(){
|
||
jQuery('#topnav').localScroll({offset: {top:0}});
|
||
|
||
//.parallax(xPosition, speedFactor, outerHeight) options:
|
||
//xPosition - Horizontal position of the element
|
||
//inertia - speed to move relative to vertical scroll. Example: 0.1 is one tenth the speed of scrolling, 2 is twice the speed of scrolling
|
||
//outerHeight (true/false) - Whether or not jQuery should use it's outerHeight option to determine when a section is in the viewport
|
||
//jQuery('#top-section').parallax("50%", 0.1);
|
||
//jQuery('#Section-1').parallax("50%", 0.3);
|
||
//jQuery('#Section-2').parallax("50%", 0.1);
|
||
//jQuery('#foot-sec').parallax("50%", 0.1);
|
||
|
||
})
|
||
</script>
|
||
|
||
<script>
|
||
//hide menu after click on mobile
|
||
jQuery('.navbar .nav > li > a').click(function(){
|
||
jQuery('.navbar-collapse.navbar-ex1-collapse.in').removeClass('in').addClass('collapse').css('height', '0');
|
||
|
||
});
|
||
</script>
|
||
|
||
<!-- NICE Scroll plugin -->
|
||
<script>
|
||
//scroll bar custom
|
||
jQuery(document).ready(
|
||
function() {
|
||
jQuery("html").niceScroll({cursorcolor:"#333"});
|
||
}
|
||
);
|
||
</script>
|
||
<!-- saved from url http://www.bootstraptor.com ==========================
|
||
Don't remove this attribution!
|
||
This template build on Bootstrap 3 Developer Kit v.2.0. by @Bootstraptor
|
||
Read usage license on http://www.bootstraptor.com
|
||
@BOOTSTRAPTOR TEMPLATE SUPORT:
|
||
Support & commercial usage license contact: dogserega@gmail.com
|
||
--------------------------------------------------------
|
||
Bootstraptor 3.0. - templates - themes - skins
|
||
usage licenses here http://www.bootstraptor.com <==
|
||
---------------------------------------------------------
|
||
|
||
Uprgader 2.3.* => 3.0. service Bootstrap 3.0. online update service free http://bootstrap3.kissr.com/
|
||
Update Bootstrap 2.3.* to Bootstrap 3.0. online http://bootstrap3.kissr.com/
|
||
follow for templates updates & new releases on Twitter.com/Bootstraptor
|
||
##########################################################################-->
|
||
|
||
</body>
|
||
</html> |