-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcontactus.html
154 lines (137 loc) · 6.34 KB
/
contactus.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!--
Will recreate the contact us page.
Make it functional.
Connect it with a database.
-->
<!-- Just using this as a prototype. -->
<!-- working on the css & javascript. -->
<!-- Comment this new code out. -->
<!-- Will use the previious one on the main index page
Then later on will do the functionality section.
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>B&R Technologies</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<!-- <link href="assets/img/favicon.png" rel="icon">
Another icon will be put -->
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<link href="https://fonts.cdnfonts.com/css/footlight-mt-pro" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
</head>
<body>
<!-- ======= Header ======= -->
<header id="header" class="fixed-top d-flex align-items-center">
<div class="container d-flex align-items-center">
<!-- <h1 class="logo me-auto"><a href="index.html">B&R Technologies<span>.</span></a></h1> -->
<!-- Uncomment below if you prefer to use an image logo -->
<a href="index.html" class="logo me-auto"><img src="assets/img/logo.png" alt=""></a>
<nav id="navbar" class="navbar order-last order-lg-0">
<ul>
<li><a class="nav-link scrollto active" href="#hero">Home</a></li>
<li><a class="nav-link scrollto" href="#about">About</a></li>
<li><a class="nav-link scrollto" href="#services">Services</a></li>
<li><a class="nav-link scrollto " href="#portfolio">Portfolio</a></li>
<li><a class="nav-link scrollto" href="#team">Team</a></li>
<li><a class="nav-link scrollto" href="#contact">Contact</a></li>
</ul>
<i class="bi bi-list mobile-nav-toggle"></i>
</nav><!-- .navbar -->
<!--
Deacticated the 2nd Get started Button. Pretty much avoiding repitition
<a href="#contact" class="get-started-btn scrollto">Get Started</a> -->
</div>
</header><!-- End Header -->
<!-- ======= Hero Section ======= -->
<section id="hero" class="d-flex align-items-center">
<div class="container" data-aos="zoom-out" data-aos-delay="100">
<div class="row">
<div class="col-lg">
<h1>B&R Technologies</h1> <br>
<h1>Big Ideas, Creative People And New Technologies.</h1>
<h2>For Better digital experience & transformation of your ideas into beautiful designs & functional websites.</h2>
<a href="#services" class="btn-get-started scrollto">Get Started</a>
</div>
</div>
</div>
</section><!-- End Hero -->
<section id="contact" class="contact">
<div class="container" data-aos="fade-up">
<div class="section-title">
<h2>We are ready! Are you?</h2>
<p>Our specialities in custom web design, responsive websites, wordpress, ecommerce, database programming & web applications are surpassed only by our trademark customer service.</p>
<p> <br> Feel free to contact us over the phone, email or contact form below to leverage all of the above for your business.</p>
</div>
<div class="row" data-aos="fade-up" data-aos-delay="100">
<div class="col-lg-6">
<div class="row">
<div class="col-md-12">
<div class="info-box">
<i class="bx bx-map"></i>
<h3>Our Address</h3>
<p>Remote. Nairobi, Kenya</p>
</div>
</div>
<div class="col-md-6">
<div class="info-box mt-4">
<i class="bx bx-envelope"></i>
<h3>Email Us</h3>
<p>info@brtech.com<br>contact@brtech.com</p>
</div>
</div>
<div class="col-md-6">
<div class="info-box mt-4">
<i class="bx bx-phone-call"></i>
<h3>Call Us</h3>
<p>+254 716 304 035<br>+254 748 177 458</p>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<form onsubmit="sendEmail(); reset(); return false" class="php-email-form">
<div class="row">
<div class="col form-group">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" required>
</div>
<div class="col form-group">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" required>
</div>
</div>
<div class="form-group">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" required>
</div>
<div class="form-group">
<textarea class="form-control" name="message" rows="5" placeholder="Message" required></textarea>
</div>
<div class="my-3">
<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your message has been sent. Thank you!</div>
</div>
<div class="text-center"><button type="submit">Send Message</button></div>
</form>
</div>
</div>
</div>
<!-- End Contact Section -->
<script src="https://smtpjs.com/v3/smtp.js"></script>
<script src="script.js"></script>
</body>
</html>