bootstrap-v4.0_demo
/
frontend.html

<!DOCTYPE html>
<html lang="en">
	<head>
		<!-- Meta tags -->
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<meta http-equiv="x-ua-compatible" content="ie=edge">
		<meta name="description" content="">
		<meta name="author" content="">

		<!-- Title -->
		<title>Neptune</title>

		<!-- Vendor CSS -->
		<link rel="stylesheet" href="vendor/bootstrap/css/bootstrap.min.css">
		<link rel="stylesheet" href="vendor/themify-icons/themify-icons.css">
		<link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="vendor/animate.css/animate.min.css">
		<link rel="stylesheet" href="vendor/waves/waves.min.css">
		<link rel="stylesheet" href="vendor/ionicons/css/ionicons.min.css">
		<link href="https://fonts.googleapis.com/css?family=Exo+2" rel="stylesheet">

		<!-- Neptune CSS -->
		<link rel="stylesheet" href="css/core.css">

		<!-- HTML5 Shiv and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
		<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
		<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
		<![endif]-->
	</head>
	<body>

		<div class="frontend-wrapper bg-white">

			<div class="header text-xs-center img-cover" style="background-image: url(img/photos-1/4.jpg);">
				<div class="gradient gradient-warning"></div>
				<div class="h-content">
					<div class="clearfix">
						<div class="h-logo pull-xs-left"><a class="text-white" href="#">Logo</a></div>
						<div class="h-menu pull-xs-right">
							<ul class="list-inline m-b-0">
								<li class="list-inline-item"><a class="text-white" href="#">About</a></li>
								<li class="list-inline-item"><a class="text-white" href="#">Features</a></li>
								<li class="list-inline-item"><a class="text-white" href="#">Company</a></li>
								<li class="list-inline-item"><a class="text-white" href="#">Contacts</a></li>
							</ul>
						</div>
					</div>
					<div class="row">
						<div class="col-md-8 offset-md-2">
							<div class="h-title">Lorem ipsum dolor sit amet</div>
							<div class="h-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi</div>
							<div class="h-buttons">
								<button class="btn btn-danger btn-rounded btn-lg">Get started</button>
								<button class="btn btn-outline-white btn-rounded btn-lg">Learn more</button>
							</div>
						</div>
					</div>
					<div class="h-down">
						<a class="text-white" href="#">
							<i class="ti-angle-double-down"></i>
						</a>
					</div>
				</div>
			</div>

			<div class="block-1">
				<div class="container-fluid">
					<h3 class="title-1"><span class="b-t-danger">Lorem ipsum</span></h3>
					<div class="text-muted text-xs-center m-b-3">Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus.</div>
					<div class="row">
						<div class="col-md-4">
							<div class="b-item">
								<div class="bi-image img-cover" style="background-image: url(img/photos-1/1.jpg);">
									<button type="submit" class="btn btn-danger btn-rounded label-right">Read More <span class="btn-label"><i class="ti-angle-right"></i></span></button>
								</div>
								<div class="bi-title">Lorem ipsum dolor</div>
							</div>
						</div>
						<div class="col-md-4">
							<div class="b-item">
								<div class="bi-image img-cover" style="background-image: url(img/photos-1/2.jpg);">
									<button type="submit" class="btn btn-danger btn-rounded label-right">Read More <span class="btn-label"><i class="ti-angle-right"></i></span></button>
								</div>
								<div class="bi-title">Lorem ipsum dolor</div>
							</div>
						</div>
						<div class="col-md-4">
							<div class="b-item">
								<div class="bi-image img-cover" style="background-image: url(img/photos-1/3.jpg);">
									<button type="submit" class="btn btn-danger btn-rounded label-right">Read More <span class="btn-label"><i class="ti-angle-right"></i></span></button>
								</div>
								<div class="bi-title">Lorem ipsum dolor</div>
							</div>
						</div>
						<div class="col-md-4">
							<div class="b-item">
								<div class="bi-image img-cover" style="background-image: url(img/photos-1/4.jpg);">
									<button type="submit" class="btn btn-danger btn-rounded label-right">Read More <span class="btn-label"><i class="ti-angle-right"></i></span></button>
								</div>
								<div class="bi-title">Lorem ipsum dolor</div>
							</div>
						</div>
						<div class="col-md-4">
							<div class="b-item">
								<div class="bi-image img-cover" style="background-image: url(img/photos-1/5.jpg);">
									<button type="submit" class="btn btn-danger btn-rounded label-right">Read More <span class="btn-label"><i class="ti-angle-right"></i></span></button>
								</div>
								<div class="bi-title">Lorem ipsum dolor</div>
							</div>
						</div>
						<div class="col-md-4">
							<div class="b-item">
								<div class="bi-image img-cover" style="background-image: url(img/photos-1/6.jpg);">
									<button type="submit" class="btn btn-danger btn-rounded label-right">Read More <span class="btn-label"><i class="ti-angle-right"></i></span></button>
								</div>
								<div class="bi-title">Lorem ipsum dolor</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="block-2 bg-danger">
				<div class="container-fluid">
					<div class="row">
						<div class="col-md-8 offset-md-2">
							<div class="row">
								<div class="col-md-6">
									<div class="b-item">
										<div class="bi-icon"><i class="ti-pulse"></i></div>
										<div class="bi-title">Lorem ipsum dolor</div>
										<div class="bi-text">Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus. Aliquam molestie</div>
									</div>
								</div>
								<div class="col-md-6">
									<div class="b-item">
										<div class="bi-icon"><i class="ti-palette"></i></div>
										<div class="bi-title">Lorem ipsum dolor</div>
										<div class="bi-text">Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus. Aliquam molestie</div>
									</div>
								</div>
								<div class="col-md-6">
									<div class="b-item">
										<div class="bi-icon"><i class="ti-location-arrow"></i></div>
										<div class="bi-title">Lorem ipsum dolor</div>
										<div class="bi-text">Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus. Aliquam molestie</div>
									</div>
								</div>
								<div class="col-md-6">
									<div class="b-item">
										<div class="bi-icon"><i class="ti-music-alt"></i></div>
										<div class="bi-title">Lorem ipsum dolor</div>
										<div class="bi-text">Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus. Aliquam molestie</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="block-3">
				<div class="container-fluid">
					<h3 class="title-1"><span class="b-t-danger">Lorem ipsum</span></h3>
					<div class="text-muted text-xs-center m-b-3">Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus.</div>
					<div class="row">
						<div class="col-md-3 col-sm-6 m-b-20 m-md-b-0">
							<div class="b-item animtt">
								<div class="bi-number"><span>01</span></div>
								<div class="bi-title">Lorem ipsum dolor</div>
								<div class="bi-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus.</div>
							</div>
						</div>
						<div class="col-md-3 col-sm-6 m-b-20 m-md-b-0">
							<div class="b-item animtt">
								<div class="bi-number"><span>02</span></div>
								<div class="bi-title">Lorem ipsum dolor</div>
								<div class="bi-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus.</div>
							</div>
						</div>
						<div class="col-md-3 col-sm-6 m-b-20 m-md-b-0">
							<div class="b-item animtt">
								<div class="bi-number"><span>03</span></div>
								<div class="bi-title">Lorem ipsum dolor</div>
								<div class="bi-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus.</div>
							</div>
						</div>
						<div class="col-md-3 col-sm-6">
							<div class="b-item animtt">
								<div class="bi-number"><span>04</span></div>
								<div class="bi-title">Lorem ipsum dolor</div>
								<div class="bi-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed diam sem, imperdiet at mollis vestibulum, bibendum id purus.</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div id="map" style="height: 400px;"></div>

			<div class="block-4">
				<div class="container-fluid">
					<div class="m-b-2">
						© 2016 Neptune
						<br>
						Created by <a href="#" class="text-danger"><span class="underline">BigBangStudio</span></a>
					</div>
					<div class="b-to-top"><i class="ti-angle-double-up"></i></div>
				</div>
			</div>

		</div>

		<!-- Vendor JS -->
		<script type="text/javascript" src="vendor/jquery/jquery-1.12.3.min.js"></script>
		<script type="text/javascript" src="vendor/tether/js/tether.min.js"></script>
		<script type="text/javascript" src="vendor/bootstrap/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="vendor/waves/waves.min.js"></script>
		<script src="http://maps.google.com/maps/api/js?key=AIzaSyBvUrUti-n6JiOxxR0rGFAaCKVIiGimqx0"></script>
		<script type="text/javascript" src="vendor/gmaps/gmaps.min.js"></script>

		<!-- Neptune JS -->
		<script type="text/javascript" src="js/frontend.js"></script>
	</body>
</html>