189 lines
7.9 KiB
HTML
189 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="no-js">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<!-- Main CSS -->
|
|
<link href="assets/css/main.css" rel="stylesheet" >
|
|
<link href="assets/css/overflow.css" rel="stylesheet" >
|
|
<title>Creative Agency</title>
|
|
<!-- WebFont JS -->
|
|
<script src="assets/js/webfont/webfont.js"></script>
|
|
<script>document.documentElement.className = "js";
|
|
var supportsCssVars = function supportsCssVars() {
|
|
var e,
|
|
t = document.createElement("style");
|
|
return t.innerHTML = "root: { --tmp-var: bold; }", document.head.appendChild(t), e = !!(window.CSS && window.CSS.supports && window.CSS.supports("font-weight", "var(--tmp-var)")), t.parentNode.removeChild(t), e;
|
|
};
|
|
|
|
supportsCssVars() || alert("Please view this demo in a modern browser that supports CSS Variables.");
|
|
</script>
|
|
</head>
|
|
<body class="demo-1 loading">
|
|
<main>
|
|
<div class="frame frame--header">
|
|
<!-- NAVIGATION STARTS
|
|
========================================================================= -->
|
|
<nav id="navigation" class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
|
|
<div class="container-fluid">
|
|
<a class="navbar-brand" href="index.html"><img src="assets/img/logo.png" class="img-fluid" alt=""></a>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
|
<ul class="nav navbar-nav ms-auto">
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="index.html">Work</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="about-us.html" >About</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link active" href="contact-us.html">Contact</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<!-- NAVIGATION ENDS
|
|
========================================================================= -->
|
|
</div>
|
|
<!-- CONTACT INTRO STARTS
|
|
========================================================================= -->
|
|
<section class="home-intro" id="about" >
|
|
<div class="container-fluid">
|
|
<div class="row pb-4 align-items-center">
|
|
<div class="col-12 col-lg-6 ">
|
|
<div class="herotext">
|
|
<h6 class="pb-2">/Contact Us</h6>
|
|
<h2>Get In Touch</h2>
|
|
<h5 class="pt-4">We strive to create incredible experiences for people by creating new opportunities for brands, technology and culture.
|
|
<br><br>Cepteur sint occaecat cupidatat proident, taken possession of my entire soul, , like these sweet mornings of spring taken possession of my entire soul.
|
|
</h5>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg-5 offset-lg-1">
|
|
<div class="picture">
|
|
<img src="assets/img/contact/pic1.jpg" class="img-fluid" style="max-width: 100%;" alt="">
|
|
<div class="about-circle">
|
|
<img src="assets/img/play-reel.svg" class="img-fluid cir" alt="">
|
|
<div class="icon"><a class="popup-vimeo" href="https://vimeo.com/45830194"><img src="assets/img/play-icon.svg" class="img-fluid" alt=""></a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- /. CONTACT INTRO ENDS
|
|
========================================================================= -->
|
|
<!-- CONTACT US STARTS
|
|
========================================================================= -->
|
|
<section class="contact-us" id="contact">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-12 col-lg-6">
|
|
<div class="herotext pb-4">
|
|
<h6>Get In Touch</h6>
|
|
<h2>Talk or Meet with Us</h2>
|
|
</div>
|
|
<address class="clearfix d-flex align-items-center pb-2">
|
|
<div class="icon"><i class="las la-map-marker"></i></div>
|
|
<div class="detail">
|
|
<div class="heading">Get Us Here</div>
|
|
1355 Market St, Suite 900<br>
|
|
San Francisco, CA 94<br>
|
|
</div>
|
|
</address>
|
|
<address class="clearfix d-flex align-items-center pb-2">
|
|
<div class="icon"><i class="las la-phone"></i></div>
|
|
<div class="detail">
|
|
<div class="heading">Call Us</div>
|
|
+1 123 456 7890
|
|
</div>
|
|
</address>
|
|
<address class="clearfix d-flex align-items-center">
|
|
<div class="icon"><i class="las la-envelope-open"></i></div>
|
|
<div class="detail">
|
|
<div class="heading">Write Us</div>
|
|
<a href="mailto:info@thisone.com" target="_blank">info@thisone.com</a>
|
|
</div>
|
|
</address>
|
|
</div>
|
|
<div class="col-12 col-lg-6 pt-5 pt-lg-0">
|
|
<div class="herotext pb-4">
|
|
<h6>Estimate Project</h6>
|
|
<h2>Let Us Know Here</h2>
|
|
</div>
|
|
<form action='process.php' method='post' name='ContactForm' id='ContactForm'>
|
|
<div class="mb-3">
|
|
<input type="text" class="form-control" name="name" placeholder="Enter your name *" >
|
|
</div>
|
|
<div class="mb-3">
|
|
<input type="email" class="form-control" name="email" placeholder="Enter your email *" >
|
|
</div>
|
|
<div class="mb-3">
|
|
<input type="text" class="form-control" name="website" placeholder="Enter your website" >
|
|
</div>
|
|
<div class="mb-3">
|
|
<textarea class="form-control" name="comment" placeholder="Enter your message *" rows="3"></textarea>
|
|
</div>
|
|
<div id='message_post'></div>
|
|
<button type='submit' value='Submit' name='submitf' id="submitf" class="btn btn-primary mt-3">SEND MESSAGE</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- /.. CONTACT US ENDS
|
|
========================================================================= -->
|
|
<!-- MAPS STARTS
|
|
========================================================================= -->
|
|
<section class="map pt-2">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-12 p-0">
|
|
<iframe style="filter: invert(90%)" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3197.154890111155!2d174.72928551616675!3d-36.74285307495062!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6d0d3bd2cd208323%3A0x7baab82d6bfe50fe!2sTemplate+Monster!5e0!3m2!1sen!2s!4v1534419180788" height="400" allowfullscreen=""></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- /.. MAPS ENDS
|
|
========================================================================= -->
|
|
<!-- FOOTER STARTS
|
|
========================================================================= -->
|
|
<footer class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<ul class="socialmedia">
|
|
<li><a href="#">Facebook</a></li>
|
|
<li><a href="#">Instagram</a></li>
|
|
<li><a href="#">Twitter</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-6 text-end">
|
|
<p class="">ThisOne © 2021</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
<!-- /.. FOOTER ENDS
|
|
========================================================================= -->
|
|
</main>
|
|
<svg class="cursor" width="30" height="30" viewBox="0 0 30 30">
|
|
<circle class="cursor__inner" cx="15" cy="15" r="7.5"></circle>
|
|
</svg>
|
|
<!--JQUERY MIN JS-->
|
|
<script src="assets/lib/jquery-1.12.4/jquery.min.js"></script>
|
|
<!--BOOTSTRAP JS-->
|
|
<script src="assets/lib/bootstrap/js/bootstrap.min.js"></script>
|
|
<!-- OWL CAROUSEL -->
|
|
<script src="assets/lib/owl-carousel/owl.carousel.js"></script>
|
|
<!-- MAGNIFIC POPUP -->
|
|
<script src="assets/lib/magnific-popup/jquery.magnific-popup.js"></script>
|
|
<!-- PORTFOLIO -->
|
|
<script src="assets/js/work.js"></script>
|
|
<!-- CONTACT FORM JS -->
|
|
<script src="assets/js/contact-form/contact-form.js"></script>
|
|
<!-- CUSTOM JS -->
|
|
<script src="assets/js/script.js"></script>
|
|
</body>
|
|
</html> |