Файл: web-kgvip/contact.html
Строк: 507
<?php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5 шаблон сайта web-студии</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet" />
<!-- Primary CSS styles -->
<link href="css/style.css" rel="stylesheet" />
<!-- Fontawesome CSS styles -->
<link href="css/font-awesome.min.css" rel="stylesheet" />
<!-- Aniamte CSS styles -->
<link href="css/animate.css" rel="stylesheet" />
<!-- Nivo Slider CSS Styles -->
<link href="css/nivo-slider.css" rel="stylesheet" />
<!-- Owl Carousel CSS Styles -->
<link href="css/owl.carousel.css" rel="stylesheet" />
<link href="css/owl.transitions.css" rel="stylesheet" />
</head>
<body>
<div class="container-wrapper navigation">
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="">
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">
<img src="images/logo.jpg" />
</a>
<ul class="mini"></ul><!-- mobile navigation -->
</div><!-- .navbar-header -->
<div class="collapse navbar-collapse">
<div class="right">
<ul class="nav navbar-nav">
<li class="active dropdown h">
<a href="#">Home</a>
<ul class="dropdown-menu">
<li><a href="#">Badass</a></li>
<li><a href="#">Dropdown</a></li>
<li><a href="#">Menu</a></li>
</ul>
</li>
<li class="dropdown h">
<a href="#">Pages</a>
<ul class="dropdown-menu">
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="single.html">Single</a></li>
<li><a href="footer-alternate.html">Footer 2</a></li>
</ul>
</li>
<li class="dropdown h full">
<a href="#">Features</a>
<section class="container dropdown-menu">
<span class="wrapper">
<div class="clear-wrapper">
<article>
<strong>PAGE STRUCTURE</strong>
<ul>
<li><a href="#"><i class="fa fa-video-camera"></i>Video Backgrounds</a></li>
<li><a href="#"><i class="fa fa-picture-o"></i>Parallax Backgrounds</a></li>
<li><a href="#"><i class="fa fa-sun-o"></i>Light Background</a></li>
<li><a href="#"><i class="fa fa-moon-o"></i>Dark Background</a></li>
</ul>
</article>
<span class="divider"></span>
<article>
<strong>PAGE ELEMENTS</strong>
<ul>
<li><a href="#"><i class="fa fa-video-camera"></i>Lorem Ipsum</a></li>
<li><a href="#"><i class="fa fa-picture-o"></i>Dolar Sit</a></li>
<li><a href="#"><i class="fa fa-sun-o"></i>Amet</a></li>
<li><a href="#"><i class="fa fa-moon-o"></i>Varun Sitrem</a></li>
</ul>
</article>
<span class="divider"></span>
<article>
<strong>SOME MORE STUFF</strong>
<ul>
<li><a href="#"><i class="fa fa-video-camera"></i>Pricing</a></li>
<li><a href="#"><i class="fa fa-picture-o"></i>Content</a></li>
<li><a href="#"><i class="fa fa-sun-o"></i>Features</a></li>
<li><a href="#"><i class="fa fa-moon-o"></i>Typography</a></li>
</ul>
</article>
</div><!-- .clear-wrapper -->
<div class="color-wrapper">
<strong>FRESH FROM THE BLOG</strong>
<div class="nivo-wrapper">
<div id="slider" class="nivoSlider">
<img src="images/citydown.jpg" alt="" name="" width="310" height="150" />
<img src="images/oceanscene.jpg" alt="" name="" width="310" height="150" />
</div>
</div>
<p><a href="#">To see more, check out our portfolio page! Prepare to be impressed.</a></p>
</div><!-- .color-wrapper -->
</span>
</section><!-- .container.dropdown-menu -->
</li><!-- .dropdown.full -->
<li><a href="portfolio-1.html">Portfolio</a></li>
<li><a href="blog.html">Blog</a></li>
</ul>
<div class="navbar-form navbar-left">
<i class="fa fa-times"></i>
<i class="fa fa-search"></i>
</div>
</div>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
<div class="search-field">
<div class="container">
<form method="get" role="search">
<input type="text" name="s" placeholder="Type then press enter..." />
<button type="submit" class="hidden btn btn-default">Submit</button>
</form>
</div>
</div><!-- search-field -->
</nav>
</div><!-- .navigation -->
<div id="nav-ends"></div>
<section class="slug parallax-slug-2" data-stellar-background-ratio="0">
<div class="overlay">
<div class="container">
<div class="row">
<div class="col-lg-12">
<h1 class="anim fadeInDown">Contact Us</h1>
<p class="anim fadeInDown" data-wow-delay=".32s">Drop us a message.</p>
</div><!-- .col-lg-12 -->
</div><!-- .row -->
</div>
</div><!-- .overlay -->
</section><!-- .slug -->
<section class="content-section">
<div class="container">
<div class="row">
<div class="col-lg-12 anim fadeInDown" data-wow-delay="0.25s">
<p>
Our primary concern is dealing with our customers and making sure that they are satisfied. Any questions,
comments, or concerns you may have are very important to us.
</p>
</div><!-- .col-lg-12 -->
</div><!-- .row -->
<div class="row">
<div class="col-lg-12 anim fadeInDown" data-wow-delay="0.45s">
<div id="gmap" class="gmap"></div>
<div class="shadow-lg"></div>
</div><!-- .col-lg-12 -->
</div><!-- .row -->
</div>
</section><!-- .content-section -->
<section class="content-section form contact style-2">
<div class="container">
<div class="row">
<form target="#" name="contact">
<div class="col-md-8 anim fadeInLeft">
<span class="input-group tight">
<i class="fa fa-user"></i>
<input type="text" name="contactName" id="contactName" class="lg" placeholder="Name" />
</span><!-- .input-group -->
<span class="input-group tight second">
<i class="fa fa-envelope"></i>
<input type="text" name="contactEmail" id="contactAddress" class="lg" placeholder="Email Address" />
</span><!-- .input-group -->
<span class="input-group">
<i class="fa fa-book"></i>
<input type="text" name="contactSubject" id="contactSubject" class="lg" placeholder="Subject" />
</span><!-- .input-group -->
<span class="input-group">
<textarea name="contactMessage" id="contactMessage" class="lg" placeholder="What's on your mind?"></textarea>
</span><!-- .input-group -->
<span id="message"></span>
<span class="input-group">
<a href="#" type="button" class="btn btn-primary" id="submit_contact" data-loading-text="SENDING...">SEND</a>
</span><!-- .input-group -->
</div><!-- .col-lg-8 -->
<div class="col-md-4">
<ul class="info-list">
<li class="anim fadeInRight" data-wow-delay="0.15s">
<i class="fa fa-map-marker"></i>
<span>
<p>
1600 Pennsylvania Ave NW,<br />
Washington, DC 20500<br />
United Sates of America
</p>
</span>
</li>
<li class="anim fadeInRight" data-wow-delay="0.25s">
<i class="fa fa-phone"></i>
<span>
<article><cite>Phone:</cite> + 1 (202) 332- 1223</article><br />
<article><cite>Fax:</cite> + 1 (202) 332- 1223</article>
<p></p>
</span>
</li>
<li class="hours anim fadeInRight" data-wow-delay="0.35s">
<i class="fa fa-clock-o"></i>
<span>
<article><cite>Fri-Mon:</cite> 10am - 10pm</article><br />
<article><cite>Saturday:</cite> 12am - 8pm</article><br />
<article><cite>Sunday:</cite> Closed</article>
<p></p>
</span>
</li>
</ul><!-- .info-list -->
</div><!-- .col-lg-4 -->
</form>
</div><!-- .row -->
</div><!-- .container -->
<span id="message_sent"><i class="fa-check fa"></i></span><!-- jQuery display of giant checkmark -->
</section><!-- .content-section .form -->
<section class="content-section callout">
<div class="container">
<div class="row">
<div class="col-lg-8 anim fadeInLeft">
<p> Aenean fermentum libero eu lectus tristique, quis ornare tortor tristique pretium. </p>
</div><!-- .col-lg-8 -->
<div class="col-lg-4 anim fadeInRight">
<a class="btn btn-bordered white btn-sm anim fadeInRight" role="button">Action 2</a>
<a class="btn btn-bordered white btn-sm anim fadeInRight" role="button">Buy Dale</a>
</div><!-- .col-lg-4 -->
</div><!-- .row -->
</div><!-- .container -->
</section><!-- .content-section -->
<footer class="classic">
<section class="content-section parallax-bg-3" data-stellar-background-ratio=".15">
<div class="container">
<div class="col-lg-12">
<h1 class="anim fadeInDown">Convinced?</h1>
<div class="center-buttons">
<p>
<a class="btn btn-bordered white btn-lg anim fadeInRight" role="button">Buy Dale</a>
</p>
</div><!-- .center-buttons -->
</div>
</div><!-- .container -->
<div class="foot-wrapper">
<div class="container">
<div class="row">
<div class="col-md-3 anim fadeInLeft">
<span class="logo">
<img src="images/logo-light.png" alt="Light logo" />
</span><!-- .logo -->
<p>
Aenean lacinia bibendum nulla sed leo erat a ante venenatis dapibus posuere velit aliquet.
Donec ullamcorper metus auctor fringi. Nillam quis risus.
</p>
</div><!-- .col-lg-3 -->
<div class="col-md-3 anim fadeInLeft">
<h5><i class="fa fa-twitter-square"></i>TWITTERSPHERE</h5>
<div class="twitter-feed-wrapper">
<div id="twitter-feed"></div>
</div>
</div><!-- .col-lg-3 -->
<div class="col-md-3">
<h5 class="anim fadeInRight"><i class="fa fa-rocket"></i>PAGES TO VISIT</h5>
<ul class="pages">
<li class="anim fadeInRight" data-wow-delay="0.35s"><a class="btn btn-bordered white" role="button" href="#">Home</a></li>
<li class="anim fadeInRight" data-wow-delay="0.37s"><a class="btn btn-bordered white" role="button" href="#">Portfolio</a></li>
<li class="anim fadeInRight" data-wow-delay="0.39s"><a class="btn btn-bordered white" role="button" href="#">About</a></li>
<li class="anim fadeInRight" data-wow-delay="0.42s"><a class="btn btn-bordered white" role="button" href="#">Blog</a></li>
<li class="anim fadeInRight" data-wow-delay="0.45s"><a class="btn btn-bordered white" role="button" href="#">Contact</a></li>
<li class="anim fadeInRight" data-wow-delay="0.49s"><a class="btn btn-bordered white" role="button" href="#">About</a></li>
<li class="anim fadeInRight" data-wow-delay="0.51s"><a class="btn btn-bordered white" role="button" href="#">Single Post</a></li>
<li class="anim fadeInRight" data-wow-delay="0.54s"><a class="btn btn-bordered white" role="button" href="#">Contact</a></li>
</ul><!-- .pages -->
</div><!-- .col-lg-3 -->
<div class="col-md-3 anim fadeInRight">
<h5><i class="fa fa-rss"></i>STAY CONNECTED</h5>
<div class="contact-info">
<p>
Feel free to call us any time, we have a staff
dedicated to taking your calls.
</p>
<span>
<i class="fa fa-phone"></i>
+1 (313) 123 - 4321
</span>
<span>
<i class="fa fa-envelope"></i>
support@example.com
</span>
<ul class="social-media" data-wow-delay="0.25s">
<li><a href="#twitter"><i class="fa fa-twitter"></i></a></li>
<li><a href="#facebook"><i class="fa fa-facebook"></i></a></li>
<li><a href="#linkedin"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#github"><i class="fa fa-github"></i></a></li>
<li><a href="#pintrest"><i class="fa fa-pinterest"></i></a></li>
</ul><!-- .social-media -->
</div>
</div><!-- .col-lg-3 -->
</div><!-- .row -->
<div class="row">
<div class="col-lg-12">
<span class="copyright">Copyright 2014 Empirical Themes LLC - All Rights Reserved</span>
</div><!-- .col-lg-12 -->
</div><!-- .row -->
</div><!-- .container -->
</div><!-- .foot-wrapper -->
</div><!-- .container -->
</section><!-- .content-section -->
</footer>
<script language="javascript" src="js/jquery-1.11.0.min.js"></script>
<!-- Easing core JavaScript -->
<script language="javascript" src="js/jquery.easing.1.3.js"></script>
<!-- Bootstrap core JavaScript -->
<script language="javascript" src="js/bootstrap.min.js"></script>
<!-- WOW core JavaScript -->
<script language="javascript" src="js/wow.min.js"></script>
<!-- Waypoints core JavaScript -->
<script language="javascript" src="js/waypoints.min.js"></script>
<!-- Underscore core JavaScript -->
<script language="javascript" src="js/underscore-min.js"></script>
<!-- jQuery Backstretch core -->
<script language="javascript" src="js/jquery.backstretch.min.js"></script>
<!-- jQuery color core JavaScript -->
<script language="javascript" src="js/jquery.animation.js"></script>
<!-- Stellar core JavaScript -->
<script language="javascript" src="js/jquery.stellar.min.js"></script>
<!-- NiceScroll core Javascript -->
<script language="javascript" src="js/jquery.nicescroll.min.js"></script>
<!-- Retina core JavaScript -->
<script language="javascript" src="js/retina-1.1.0.min.js"></script>
<!-- Nivo Slider JavaScript -->
<script language="javascript" src="js/jquery.nivo.slider.pack.js"></script>
<!-- Contact core JavaScript -->
<script language="javascript" src="js/jquery.contact.min.js"></script>
<!-- Google Map API JavaScript -->
<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
<!-- OWL Carousel core JavaScript -->
<script language="javascript" src="js/owl.carousel.min.js"></script>
<!-- twitterfeed core JavaScript -->
<script language="javascript" src="js/jquery.twitterfeed.js"></script>
<!-- GMap core JavaScript -->
<script language="javascript" src="js/gmap3.js"></script>
<!-- Everything else -->
<script language="javascript" src="js/custom.js"></script>
<script type="text/javascript" language="javascript">
<!--
$(document).ready(function() {
$("#gmap").gmap3({
marker: {
//latLng: [38.897838, -77.036512], /** You can use lat/long pos **/
address:"White House, Washington", // Or you can just type in the address
options: {draggable: true},
events: {
dragend: function (marker) {
$(this).gmap3({
getaddress: {
latLng: marker.getPosition(),
callback: function (results) {
var map = $(this).gmap3("get"),
infowindow = $(this).gmap3({
get: "infowindow"
}),
content = results && results[1] ? results && results[1].formatted_address : "no address";
if (infowindow) {
infowindow.open(map, marker);
infowindow.setContent(content);
} else {
$(this).gmap3({
infowindow: {
anchor: marker,
options: {
content: content
}
}
});
}
}
}
});
}
}
},
map: {
options: {
zoom: 16,
scrollwheel: false
}
}
});
});
// -->
</script>
</body>
</html>
?>