-
Notifications
You must be signed in to change notification settings - Fork 0
/
sensepi.html
354 lines (324 loc) · 33.8 KB
/
sensepi.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
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
<!-- title -->
<title>Appiko | SensePi</title>
<meta name="description" content="Product page of the SensePi motion sensor" />
<meta name="keywords" content="SensePi, motion sensor, Appiko, camera trap" />
<meta name="author" content="Appiko">
<meta property="og:image" content="images/icon/logo_icon.png">
<!-- favicon -->
<link rel="shortcut icon" href="images/icon/favicon.ico">
<!-- animation -->
<link rel="stylesheet" href="css/animate.css" />
<!-- bootstrap -->
<link rel="stylesheet" href="css/bootstrap.min.css" />
<!-- font-awesome icon -->
<link rel="stylesheet" href="css/font-awesome.min.css" />
<!-- themify-icons -->
<link rel="stylesheet" href="css/themify-icons.css" />
<!-- owl carousel -->
<link rel="stylesheet" href="css/owl.transitions.css" />
<link rel="stylesheet" href="css/owl.carousel.css" />
<!-- magnific popup -->
<link rel="stylesheet" href="css/magnific-popup.css" />
<!-- base -->
<link rel="stylesheet" href="css/base.css" />
<!-- elements -->
<link rel="stylesheet" href="css/elements.css" />
<!-- responsive -->
<link rel="stylesheet" href="css/responsive.css" />
<!-- Appiko's custom -->
<link rel="stylesheet" href="css/custom.css" />
<!--[if IE 9]>
<link rel="stylesheet" type="text/css" href="css/ie.css" />
<![endif]-->
<!--[if IE]>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div id="page" class="page">
<!-- slider text -->
<!-- end slider text --><!-- subscribe section -->
<!-- end subscribe section --><!-- feature box section -->
<!-- end feature box section --><!-- slider text -->
<!-- end slider text --><!-- subscribe section -->
<!-- end subscribe section --><!-- feature box section -->
<!-- end feature box section --><!-- slider text -->
<!-- end slider text --><!-- subscribe section -->
<!-- end subscribe section --><!-- feature box section -->
<!-- end feature box section --><!-- slider text -->
<!-- end slider text --><!-- subscribe section -->
<!-- end subscribe section --><!-- feature box section -->
<!-- end feature box section --><!-- slider text -->
<!-- end slider text --><!-- subscribe section -->
<!-- end subscribe section --><!-- feature box section -->
<!-- end feature box section --><!-- slider text -->
<!-- end slider text --><!-- subscribe section -->
<!-- end subscribe section --><header class="leadgen-agency-1" id="header">
<!-- nav -->
<nav class="navbar bg-white tz-header-bg no-margin alt-font shrink-header light-header">
<div class="container navigation-menu">
<div class="row">
<!-- logo -->
<div class="col-md-3 col-sm-4 col-xs-9">
<a href="index.html" class="inner-link"><img alt="Appiko Logo" src="images/logo/logo_text.png" data-img-size="(W)163px X (H)39px" style="border-radius: 0px; border-color: rgb(78, 78, 78); border-style: none; border-width: 1px !important;" id="ui-id-26"></a>
</div>
<!-- end logo -->
<div class="col-md-9 col-sm-8 col-xs-6 position-inherit xs-no-padding-left">
<button data-target="#bs-example-navbar-collapse-1" data-toggle="collapse" class="navbar-toggle collapsed" type="button">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="pull-right">
<a id="collapsed-store" class="inner-link" href="store.html" style="color: rgb(255, 182, 0); background-color: rgba(0, 0, 0, 0); border-color: rgb(78, 78, 78) rgb(78, 78, 78) rgba(0, 0, 0, 0); font-size: 15px; font-weight: 700; font-family: Montserrat, sans-serif; text-transform: none;">Buy</a>
</div>
<div id="bs-example-navbar-collapse-1" class="social collapse navbar-collapse pull-right font-weight-500">
<ul class="nav navbar-nav">
<li class="propClone"><a class="inner-link" href="#fov" style="color: rgb(78, 78, 78); background-color: rgba(0, 0, 0, 0); border-color: rgb(78, 78, 78) rgb(78, 78, 78) rgba(0, 0, 0, 0); font-size: 14px; font-weight: 400; font-family: Montserrat, sans-serif; text-transform: none;" id="ui-id-35">Detection</a></li>
<li class="propClone sm-no-border"><a class="inner-link" href="#battery" style="color: rgb(78, 78, 78); background-color: rgba(0, 0, 0, 0); border-color: rgb(78, 78, 78) rgb(78, 78, 78) rgba(0, 0, 0, 0); font-size: 14px; font-weight: 400; font-family: Montserrat, sans-serif; text-transform: none;" id="ui-id-34">Battery</a></li>
<li class="propClone"><a class="inner-link" href="#app" style="color: rgb(78, 78, 78); background-color: rgba(0, 0, 0, 0); border-color: rgb(78, 78, 78) rgb(78, 78, 78) rgba(0, 0, 0, 0); font-size: 14px; font-weight: 400; font-family: Montserrat, sans-serif; text-transform: none;" id="ui-id-35">App</a></li>
<li class="propClone sm-no-border"><a class="inner-link" href="#specs" style="color: rgb(78, 78, 78); background-color: rgba(0, 0, 0, 0); border-color: rgb(78, 78, 78) rgb(78, 78, 78) rgba(0, 0, 0, 0); font-size: 14px; font-weight: 400; font-family: Montserrat, sans-serif; text-transform: none;" id="ui-id-34"><p>Specs</p></a></li>
<li id="li-store" class="propClone sm-no-border"><a class="inner-link" href="store.html" style="background-color: rgba(0, 0, 0, 0); border-color: rgb(78, 78, 78) rgb(78, 78, 78) rgba(0, 0, 0, 0); font-family: Montserrat, sans-serif; text-transform: none; color: rgb(255, 182, 0) !important; font-size: 15px !important; font-weight: 700 !important;" id="ui-id-34"><p>Buy</p></a></li>
</ul>
</div>
</div>
</div>
</div>
</nav>
<!-- end nav -->
</header><section class="position-relative hero-section23 cover-background tz-builder-bg-image border-none xs-padding-top-30px hero-style23" id="hero" data-img-size="(W)1920px X (H)1000px" style="padding-bottom: 0px; background-image: linear-gradient(rgba(255, 182, 0, 0.1), rgba(0, 0, 0, 0.01)), url('http://127.0.0.1/elements/hero-23.html') !important; padding-top: 10px !important;">
<div class="container position-relative">
<div class="row equalize xs-equalize-auto equalize-display-inherit two-column">
<!-- slider text -->
<div class="col-md-6 col-sm-6 col-xs-12 display-table pull-right xs-text-center" style="">
<div class="display-table-cell-vertical-middle">
<h2 class="title-extra-large-4 md-title-extra-large-3 font-weight-400 line-height-65 sm-title-extra-large alt-font xs-title-extra-large text-white margin-thirteen-bottom xs-margin-five-bottom tz-text" style="background-color: rgba(0, 0, 0, 0); font-size: 60px; font-family: Montserrat, sans-serif; text-transform: none; color: rgb(68, 68, 68) !important; font-weight: 600 !important;" id="ui-id-26"><p>SensePi</p></h2>
<div class="text-light-gray text-extra-large xs-text-extra-large width-95 margin-sixteen-bottom tz-text" style="background-color: rgba(0, 0, 0, 0); font-size: 18px; font-weight: 400; font-family: 'Open Sans', sans-serif; text-transform: none; color: rgb(102, 102, 102) !important;" id="ui-id-27"><p>A reliable motion sensor that sips battery and is simple to setup for triggering your camera</p><p></p></div>
<div class="btn-dual">
<a class="btn btn-large propClone bg-golden-yellow text-black xs-margin-ten-bottom xs-width-100" href="store.html" style="color: rgb(0, 0, 0); background-color: rgb(255, 182, 0); border-color: rgba(0, 0, 0, 0); font-size: 13px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none; border-radius: 4px;" id="ui-id-31"><span class="tz-text" style="color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0); font-size: 13px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none; border-radius: 0px;" id="ui-id-26">BUY NOW</span></a>
<a class="btn btn-large propClone bg-white text-black xs-margin-ten-bottom no-margin xs-width-100" href="#fov" style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); font-size: 13px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none;" id="ui-id-29"><span class="tz-text" style="color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0); font-size: 13px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none; border-radius: 0px;" id="ui-id-21">READ MORE</span></a>
</div>
</div>
</div>
<!-- end slider text -->
<!-- image -->
<div class="col-md-6 col-sm-6 col-xs-12 display-table" style="">
<div class="display-table-cell-vertical-middle">
<img class="" src="images/sensepi/tripod1.png" data-img-size="(W)700px X (H)901px" alt="SensePi on a tripod" style="border-radius: 0px; border-style: none !important; border-width: 1px !important;" id="ui-id-20">
</div>
</div>
<!-- end image -->
</div>
</div>
</section><section class="bg-white builder-bg" id="pics">
<div class="container-fluid">
<div class="row">
<div class="owl-carousel owl-theme owl-dark-pagination black-pagination testimonial-style3">
<!-- portfolio item -->
<div class="item lightbox-gallery">
<a href="images/sensepi/slider/DSC03171.JPG" title=""><img src="images/sensepi/slider/IMG_20181215_135106.jpg" data-img-size="(W)800px X (H)650px" id="tz-bg-31" alt="SensePi with Nikon camera in a case" style="border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-left-radius:0px;border-bottom-right-radius:0px;border-color:rgb(78, 78, 78);border-style:none;border-width:1px !important;"></a>
</div>
<!-- end portfolio item -->
<!-- portfolio item -->
<div class="item lightbox-gallery">
<a href="images/sensepi/slider/DSC03177.JPG" title=""><img src="images/sensepi/slider/IMG_20181215_135018.jpg" data-img-size="(W)800px X (H)650px" id="tz-bg-32" alt="SensePi tied to a tree" style="border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-left-radius:0px;border-bottom-right-radius:0px;border-color:rgb(78, 78, 78);border-style:none;border-width:1px !important;"></a>
</div>
<!-- end portfolio item -->
<!-- portfolio item -->
<div class="item lightbox-gallery">
<a href="images/sensepi/slider/DSC03184.JPG" title=""><img src="images/sensepi/slider/IMG_20181215_135012.jpg" data-img-size="(W)800px X (H)650px" id="tz-bg-33" alt="Macro shot of SensePi on a tree" style="border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-left-radius:0px;border-bottom-right-radius:0px;border-color:rgb(78, 78, 78);border-style:none;border-width:1px !important;"></a>
</div>
<!-- end portfolio item -->
</div>
</div>
</div>
</section><section class="bg-gray builder-bg border-none" id="fov">
<div class="container-fluid">
<div class="row equalize">
<div class="col-lg-5 col-md-6 col-sm-6 col-xs-12 display-table" style="">
<div class="content-text xs-padding-twenty-nine text-center padding-twenty-nine md-padding-sixteen display-table-cell-vertical-middle">
<!-- image -->
<div class="margin-seven-bottom xs-margin-twelve-bottom"><img src="images/icon/FoVs.png" data-img-size="(W)91px X (H)98px" alt="Narrow and wide FoV vector art" style="border-radius: 0px; border-style: none !important; border-width: 1px !important;" id="ui-id-30"></div>
<!-- end image -->
<!-- section title -->
<div class="font-weight-400 text-dark-gray text-extra-large sm-text-extra-large margin-four-bottom xs-margin-ten-bottom display-block tz-text">Wide/Narrow</div>
<h2 class="text-dark-gray alt-font font-weight-600 title-extra-large-2 md-title-extra-large sm-title-extra-large xs-title-extra-large margin-eight-bottom xs-margin-ten-bottom tz-text">Available in two field of view</h2>
<div class="text-medium sm-text-medium tz-text margin-eleven-bottom width-80 md-width-100 center-col sm-margin-eleven-bottom xs-margin-twenty-bottom xs-width-100"><p>SensePi is available with either a narrow or wide Field of View (FoV) lens. Use the narrow angle lens to get a shot of an animal right in front of the unit with the best in class range. Want to get a sequence of pictures or a video of an
animal entering the frame? Get the wide angle SensePi.</p></div>
<a class="btn-medium btn-circle btn bg-light-orange text-white" href="#battery" style="color: rgb(255, 255, 255); font-size: 12px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none; background-color: rgb(255, 182, 0) !important;" id="ui-id-35"><span class="tz-text" style="color: rgb(255, 255, 255); background-color: rgba(0, 0, 0, 0); font-size: 12px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none; border-radius: 0px;" id="ui-id-58">MORE</span></a>
<!-- end section title -->
</div>
</div>
<div class="col-lg-7 col-md-6 col-sm-6 col-xs-12 no-padding content-img cover-background tz-builder-bg-image" data-img-size="(W)1200px X (H)750px" style="padding-top: 0px; padding-bottom: 0px; background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.01)), url('/images/sensepi/fieldFoV.png') !important;" id="ui-id-32"></div>
</div>
</div>
</section><section class="padding-110px-tb xs-padding-60px-tb bg-deep-green builder-bg border-none" id="battery" style="padding: 110px 0px; background-color: rgb(255, 182, 0) !important;">
<div class="container">
<div class="row equalize xs-equalize-auto equalize-display-inherit">
<!-- image -->
<div class="col-md-6 col-sm-6 col-xs-12 xs-text-center xs-margin-nineteen-bottom display-table" style="">
<div class="display-table-cell-vertical-middle">
<img alt="SensePi circuitry" src="images/sensepi/circuit_logo.jpg" data-img-size="(W)800px X (H)788px" style="border-radius: 0px; border-style: none !important; border-width: 1px !important;" id="ui-id-34">
</div>
</div>
<!-- end image -->
<div class="col-md-6 col-sm-6 col-xs-12 xs-text-center display-table" style="">
<div class="display-table-cell-vertical-middle">
<!-- section title -->
<h1 class="text-white font-weight-600 margin-ten-bottom title-extra-large-3 xs-margin-fifteen-bottom sm-title-extra-large-3 xs-title-extra-large-3 tz-text">Battery life's more than a year!</h1>
<!-- end section title -->
<div class="text-white title-medium sm-title-medium margin-nine-bottom xs-margin-fifteen-bottom tz-text">With only two AA batteries</div>
<div class="text-white text-medium sm-text-medium tz-text"><p>SensePi can definitely be continuously operational for more than a year with just two AA batteries. Isn't it great not to think about the battery of an electronics gadget?</p></div>
<div class="text-white text-medium sm-text-medium tz-text"><p>We take pride in all the circuit design and software development that has gone into SensePi that makes this exceptional battery life possible. Fewer batteries used is also great for the environment. Also, all our technology is open-source, feel free to take a look and adopt. </p></div>
<a class="btn btn-large btn-circle propClone bg-white text-deep-green margin-three-top" href="https://github.com/appiko/" style="color: rgb(106, 168, 79); background-color: rgb(255, 255, 255); font-size: 14px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none;" id="ui-id-20"><span class="tz-text" style="background-color: rgba(0, 0, 0, 0); font-size: 14px; font-weight: 500; font-family: Montserrat, sans-serif; text-transform: none; color: rgb(102, 102, 102) !important;" id="ui-id-49">Github Repo</span><i class="fa icon-extra-small tz-icon-color fa-long-arrow-right" style="color: rgb(102, 102, 102) !important; font-size: 14px; background-color: rgba(0, 0, 0, 0);" id="ui-id-51"></i></a>
</div>
</div>
</div>
</div>
</section><section class="padding-110px-tb xs-padding-60px-tb bg-white builder-bg" id="app">
<div class="container">
<div class="row equalize xs-equalize-auto equalize-display-inherit">
<div class="col-md-6 col-md-offset-1 col-sm-6 col-xs-12 xs-text-center xs-margin-nineteen-bottom display-table" style="">
<div class="display-table-cell-vertical-middle">
<!-- section title -->
<h2 class="title-extra-large-2 sm-title-large xs-title-extra-large xs-title-large text-dark-gray width-90 sm-width-100 margin-eight-bottom tz-text sm-margin-ten-bottom alt-font"><p><i>Setup</i> simply</p></h2>
<!-- end section title -->
<div class="title-small sm-text-extra-large text-medium-gray width-90 sm-width-100 margin-eight-bottom tz-text"><p>Forget fiddly knobs & switches</p></div>
<div class="text-medium tz-text width-90 sm-width-100 margin-twelve-bottom sm-margin-ten-bottom"><p>A simple and intuitive mobile app - <i>Setup</i> allows configuring the SensePi wirelessly over Bluetooth. This allows you to easily configure the device exactly the way you want to get the perfect picture. Get <i>Setup</i> for both iOS and Android. </p></div>
<div class="float-left width-100 xs-text-center">
<a href="https://itunes.apple.com/us/app/appiko-setup/id1394422031" class="sm-width-140px float-left xs-float-none xs-display-inline-block"><img src="images/icon/application-offer-img-01.png" data-img-size="(W)200px X (H)61px" alt="Link to iOS App Store" style="border-radius: 0px; border-color: rgb(78, 78, 78); border-style: none; border-width: 1px !important;" id="ui-id-28"></a>
<a href="https://play.google.com/store/apps/details?id=org.appiko.senseconfig" class="sm-width-140px float-left xs-float-none margin-five-left xs-margin-two-left xs-display-inline-block"><img src="images/icon/application-offer-img-02.png" data-img-size="(W)200px X (H)61px" alt="Link to Google Play Store" style="border-radius: 0px; border-color: rgb(78, 78, 78); border-style: none; border-width: 1px !important;" id="ui-id-27"></a>
</div>
</div>
</div>
<div class="col-md-5 col-sm-6 col-xs-12 xs-text-center display-table" style="">
<div class="display-table-cell-vertical-middle">
<img alt="Setup app usage animation" src="images/setup/screen.gif" data-img-size="(W)525px X (H)720px" style="border-radius: 0px; border-style: none !important; border-width: 1px !important;" id="ui-id-33">
</div>
</div>
</div>
</div>
</section><section class="padding-110px-tb xs-padding-60px-tb bg-white builder-bg" id="specs" style="padding: 110px 0px; background-color: rgb(238, 238, 238) !important;">
<div class="container">
<div class="row equalize xs-equalize-auto equalize-display-inherit">
<div class="col-md-6 col-sm-6 xs-12 xs-text-center display-table" style="">
<div class="display-table-cell-vertical-middle">
<img alt="SensePi specs" src="images/sensepi/specs_side_front.png" data-img-size="(W)800px X (H)681px" style="border-radius: 0px; border-style: none !important; border-width: 1px !important;" id="ui-id-79">
</div>
</div>
<!-- content details -->
<div class="col-md-6 col-sm-6 xs-12 xs-text-center xs-margin-nineteen-bottom display-table" style="">
<div class="display-table-cell-vertical-middle">
<h2 class="title-extra-large-2 md-title-extra-large sm-title-extra-large xs-title-extra-large font-weight-300 text-black margin-four-bottom xs-margin-fifteen-bottom tz-text">Specifications</h2>
<!-- content details -->
<div class="two-column">
<div class="col-lg-6 col-md-12 col-sm-6 col-xs-12 margin-six-bottom xs-margin-fifteen-bottom xs-no-padding-lr">
<div class="float-left width-100 margin-four-bottom">
<div class="col-md-2 col-sm-2 col-xs-12 font-weight-300 text-bitter-sweet title-large sm-title-large no-padding tz-text" style="color: rgb(255, 182, 0) !important; background-color: rgba(0, 0, 0, 0); font-size: 28px; font-weight: 300; font-family: 'Open Sans', sans-serif; text-transform: none;" id="ui-id-19">01.</div>
<h3 class="title-small sm-title-small text-dark-gray col-md-10 col-sm-10 col-xs-12 no-padding-left xs-no-padding margin-one-top md-margin-one-half-top tz-text">Dimensions</h3>
</div>
<div class="text-medium sm-text-medium float-left width-90 md-width-100 tz-text"><p>Length: 87 mm<br>Width: 80 mm<br>Height: 76 mm</p></div>
</div>
<div class="col-lg-6 col-md-12 col-sm-6 col-xs-12 margin-six-bottom xs-margin-fifteen-bottom xs-no-padding-lr">
<div class="float-left width-100 margin-four-bottom">
<div class="col-md-2 col-sm-2 col-xs-12 font-weight-300 text-bitter-sweet title-large sm-title-large no-padding tz-text" style="background-color: rgba(0, 0, 0, 0); font-size: 28px; font-weight: 300; font-family: 'Open Sans', sans-serif; text-transform: none; color: rgb(255, 182, 0) !important;" id="ui-id-20">02.</div>
<h3 class="title-small sm-title-small text-dark-gray col-md-10 col-sm-10 col-xs-12 no-padding-left xs-no-padding margin-one-top md-margin-one-half-top tz-text">Battery</h3>
</div>
<div class="text-medium sm-text-medium float-left width-90 md-width-100 tz-text"><p>Battery: 2 x AA (Lithium, NiMH, Alkaline)</p><p>Battery life: More than a year</p></div>
</div>
<div class="col-lg-6 col-md-12 col-sm-6 col-xs-12 margin-six-bottom xs-margin-fifteen-bottom xs-no-padding-lr">
<div class="float-left width-100 margin-four-bottom">
<div class="col-md-2 col-sm-2 col-xs-12 font-weight-300 text-bitter-sweet title-large sm-title-large no-padding tz-text" style="background-color: rgba(0, 0, 0, 0); font-size: 28px; font-weight: 300; font-family: 'Open Sans', sans-serif; text-transform: none; color: rgb(255, 182, 0) !important;" id="ui-id-21">03.</div>
<h3 class="title-small sm-title-small text-dark-gray col-md-10 col-sm-10 col-xs-12 no-padding-left xs-no-padding margin-one-top md-margin-one-half-top tz-text">Modes</h3>
</div>
<div class="text-medium sm-text-medium float-left width-90 md-width-100 tz-text"><p>Single-shot</p><p>Multi-shot</p><p>Long-press</p><p>Video</p><p>Half-press (focus)</p></div>
</div>
<div class="col-lg-6 col-md-12 col-sm-6 col-xs-12 margin-six-bottom xs-no-margin-bottom xs-no-padding-lr">
<div class="float-left width-100 margin-four-bottom">
<div class="col-md-2 col-sm-2 col-xs-12 font-weight-300 text-bitter-sweet title-large sm-title-large no-padding tz-text" style="background-color: rgba(0, 0, 0, 0); font-size: 28px; font-weight: 300; font-family: 'Open Sans', sans-serif; text-transform: none; color: rgb(255, 182, 0) !important;" id="ui-id-22">04.</div>
<h3 class="title-small sm-title-small text-dark-gray col-md-10 col-sm-10 col-xs-12 no-padding-left xs-no-padding margin-one-top md-margin-one-half-top tz-text">Detection</h3>
</div>
<div class="text-medium sm-text-medium float-left width-90 md-width-100 tz-text"><p><b>Narrow</b><br>FoV: 6 degree<br>Max Range: 15 m to 25 m</p><p><b>Wide</b><br>FoV: 90 degree<br>Max Range: 5 m to 15 m</p></div>
</div>
</div>
<!-- end content details -->
<!-- <a class="btn-medium btn-circle btn border-2-fast-blue btn-border text-fast-blue propClone" href="#" data-selector="a.btn, button.btn" style=""><span class="tz-text" data-selector=".tz-text" style="">CONTINUE READING</span><i class="fa fa-long-arrow-right icon-extra-small tz-icon-color" data-selector=".tz-icon-color"></i></a> -->
</div>
</div>
<!-- end content details -->
</div>
</div>
</section><footer id="footer" class="bg-white builder-bg padding-60px-tb xs-padding-40px-tb footer-style4">
<div class="container">
<div class="row equalize sm-equalize-auto">
<!-- logo -->
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 sm-text-center sm-margin-five-bottom xs-margin-nine-bottom display-table" style="">
<div class="display-table-cell-vertical-middle">
<a href="index.html" class="inner-link"><img src="images/logo/logo_text.png" alt="Appiko Logo" data-img-size="(W)163px X (H)39px" style="border-radius: 0px; border-style: none !important; border-width: 1px !important;" id="ui-id-63"></a>
</div>
</div>
<!-- end logo -->
<div class="col-lg-6 col-md-5 col-sm-12 col-xs-12 sm-margin-three-bottom text-center xs-text-center display-table" style="">
<div class="display-table-cell-vertical-middle">
<span class="tz-text"><p>This work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License.</a> <a rel="license" href="https://creativecommons.org/licenses/by/4.0/"><img alt="CC-BY" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/80x15.png"></a></p></span>
</div>
</div>
<!-- social elements -->
<div class="col-lg-3 col-md-4 col-sm-12 col-xs-12 text-right sm-text-center display-table" style="">
<div class="social icon-extra-small display-table-cell-vertical-middle">
<a href="https://twitter.com/AppikoOrg" class="margin-sixteen-right">
<i class="fa tz-icon-color fa-twitter" style="color: rgb(78, 78, 78); font-size: 16px !important; background-color: rgba(0, 0, 0, 0);" id="ui-id-67"></i>
</a>
<a href="https://www.instagram.com/appikoorg/" class="margin-sixteen-right">
<i class="fa tz-icon-color fa-instagram" style="color: rgb(78, 78, 78); font-size: 16px !important; background-color: rgba(0, 0, 0, 0);" id="ui-id-67"></i>
</a>
<a href="https://linkedin.com/company/appiko/" class="margin-sixteen-right">
<i class="fa tz-icon-color fa-linkedin" style="color: rgb(78, 78, 78); font-size: 16px !important; background-color: rgba(0, 0, 0, 0);" id="ui-id-67"></i>
</a>
<a href="https://github.com/appiko">
<i class="fa tz-icon-color fa-github" style="color: rgb(78, 78, 78); font-size: 16px !important; background-color: rgba(0, 0, 0, 0);" id="ui-id-68"></i>
</a>
</div>
</div>
<!-- end social elements -->
</div>
</div>
</footer></div><!-- /#page -->
<!-- javascript libraries -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.appear.js"></script>
<script type="text/javascript" src="js/smooth-scroll.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- wow animation -->
<script type="text/javascript" src="js/wow.min.js"></script>
<!-- owl carousel -->
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
<!-- images loaded -->
<script type="text/javascript" src="js/imagesloaded.pkgd.min.js"></script>
<!-- isotope -->
<script type="text/javascript" src="js/jquery.isotope.min.js"></script>
<!-- magnific popup -->
<script type="text/javascript" src="js/jquery.magnific-popup.min.js"></script>
<!-- navigation -->
<script type="text/javascript" src="js/jquery.nav.js"></script>
<!-- equalize -->
<script type="text/javascript" src="js/equalize.min.js"></script>
<!-- fit videos -->
<script type="text/javascript" src="js/jquery.fitvids.js"></script>
<!-- number counter -->
<script type="text/javascript" src="js/jquery.countTo.js"></script>
<!-- time counter -->
<script type="text/javascript" src="js/counter.js"></script>
<!-- twitter Fetcher -->
<script type="text/javascript" src="js/twitterFetcher_min.js"></script>
<!-- main -->
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>