-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
253 lines (205 loc) · 9.8 KB
/
index.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
<!DOCTYPE html>
<html 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, shrink-to-fit=no">
<meta name="theme-color" content="#3ed2a7">
<link rel="shortcut icon" href="./assets/img/favicon.ico" />
<title>FOBOS</title>
<link rel="stylesheet" href="assets/css/theme-vendors.min.css" />
<link rel="stylesheet" href="assets/css/theme.min.css" />
<link rel="stylesheet" href="assets/css/themes/digital-agency.css" />
<!-- Head Libs -->
<script async src="assets/vendors/modernizr.min.js"></script>
</head>
<body data-mobile-nav-trigger-alignment="right" data-mobile-nav-align="left" data-mobile-nav-style="minimal" data-mobile-nav-shceme="gray" data-mobile-header-scheme="gray" data-mobile-nav-breakpoint="1199">
<div id="wrap">
<header class="main-header main-header-overlay">
<div class="mainbar-wrap">
<div class="megamenu-hover-bg"></div><!-- /.megamenu-hover-bg -->
<div class="container-fluid mainbar-container">
<div class="mainbar">
<div class="row mainbar-row align-items-lg-stretch px-4">
<div class="col pr-5">
<div class="navbar-header">
<a class="navbar-brand" href="index.html" rel="home">
<span class="navbar-brand-inner">
<img class="mobile-logo-default" src="./assets/img/FOBOS_FINAL_LOGO.png" alt="Ave HTML Template">
<img class="logo-default" src="./assets/img/FOBOS_FINAL_LOGO.png" alt="Ave HTML Template">
<img class="logo-text" src="./assets/img/FOBOS_TITLE.png" alt="Ave HTML Template">
</span>
</a>
<button type="button" class="navbar-toggle collapsed nav-trigger style-mobile" data-toggle="collapse" data-target="#main-header-collapse" aria-expanded="false" data-changeclassnames='{ "html": "mobile-nav-activated overflow-hidden" }'>
<span class="sr-only">Toggle navigation</span>
<span class="bars">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</span>
</button>
</div><!-- /.navbar-header -->
</div><!-- /.col -->
<div class="col">
<div class="collapse navbar-collapse" id="main-header-collapse">
<ul id="primary-nav" class="main-nav main-nav-hover-underline-1 nav align-items-lg-stretch justify-content-lg-center" data-submenu-options='{ "toggleType":"fade", "handler":"mouse-in-out" }' data-localscroll="true">
<li class="is-active">
<a href="index.html">
<span class="link-icon"></span>
<span class="link-txt">
<span class="link-ext"></span>
<span class="txt">Home</span>
</span>
</a>
</li>
<li>
<a href="science.html">
<span class="link-icon"></span>
<span class="link-txt">
<span class="link-ext"></span>
<span class="txt">Science</span>
</span>
</a>
</li>
<li>
<a href="instrument.html">
<span class="link-icon"></span>
<span class="link-txt">
<span class="link-ext"></span>
<span class="txt">Instrument</span>
</span>
</a>
</li>
<li>
<a href="community.html">
<span class="link-icon"></span>
<span class="link-txt">
<span class="link-ext"></span>
<span class="txt">Community</span>
</span>
</a>
</li>
<li>
<a href="contact.html">
<span class="link-icon"></span>
<span class="link-txt">
<span class="link-ext"></span>
<span class="txt">Contact</span>
</span>
</a>
</li>
</ul><!-- /#primary-nav -->
</div><!-- /#main-header-collapse -->
</div><!-- /.col -->
</div><!-- /.mainbar-row -->
</div><!-- /.mainbar -->
</div><!-- /.mainbar-container -->
</div><!-- /.mainbar-wrap -->
</header><!-- /.main-header -->
<main id="content" class="content">
<section
class="vc_row fullheight d-flex flex-wrap align-items-end"
data-parallax="true"
data-parallax-options='{"parallaxBG":true}'
data-slideshow-bg="true"
data-slideshow-options='{"delay":6000,"imageArray":["./assets/img/night-sky.jpg","./assets/img/stars.jpg"]}'
>
<span class="row-bg-loader">
<span class="row-bg-loader-inner"></span>
</span>
<div class="container">
<div class="row">
<div class="lqd-column col-md-10 col-md-offset-1 text-center mt-7" data-custom-animations="true" data-ca-options='{"triggerHandler":"inview","animationTarget":"all-childs","duration":"1200","delay":"150","easing":"easeOutQuint","direction":"forward","initValues":{"translateY":31,"translateZ":-108,"opacity":0},"animations":{"translateY":0,"translateZ":0,"opacity":1}}'>
<header class="fancy-title">
<h1 class="text-white lh-15 mb-4"><span class="font-size-2-3x lh-1">FOBOS</span></h1>
<h3 class="text-white lh-15 mb-4"><span class="font-size-1x lh-1">The Fiber-Optic Broadband Optical Spectrograph<br />
A Next-Generation Facility for Keck</span></h3>
<div class="row">
<div class="lqd-column col-md-12 bkg-opwhite">
<p class="text-white font-size-22 mb-1"> With first-light in 2028,
FOBOS will be the premier instrument for deep, high-target-density
spectroscopy in the era of deep-imaging surveys, like the Vera C.
Rubin Observatory Legacy Survey of Space and Time LSST, Euclid, and
the Nancy Grace Roman Space Telescope. Its flexible acquisition
system will position 1800 individual fibers or 45 fiber-bundles over
Keck’s full 20-arcmin field-of-view, and provide spectroscopy
covering the full optical band (0.31-1 μm) at moderate spectral
resolution (R = 3500).</p>
</div><!-- /.col-md-8 col-md-offset-2 -->
</div><!-- /.row -->
</header><!-- /.fancy-title -->
<a href="contact.html" class="btn btn-solid text-uppercase circle btn-bordered border-thin font-size-16 font-weight-bold ltr-sp-05 px-2 bg-hover-white text-hover-black mb-2" data-localscroll="true" data-localscroll-options='{"scrollBelowSection":true}'>
<span>
<span class="btn-txt">Participate</span>
</span>
</a>
<!-- <a href="https://www.youtube.com/watch?v=LjaKHqDbzSA" class="btn btn-default text-uppercase circle btn-bordered border-thick fresco btn-icon-left btn-icon-circle btn-icon-bordered font-size-16 font-weight-bold ltr-sp-05 px-2 color-secondary mb-2">
<span>
<span class="btn-txt">How we work</span>
<span class="btn-icon"><i class="fa fa-play"></i></span>
</span>
</a> -->
</div><!-- /.col-md-10 col-md-offset-1 text-center -->
</div><!-- /.row -->
</div><!-- /.container -->
<!-- <div class="bg-forestgreen col-xs-12 px-0 py-4"> -->
<div class="bg-fade-white-05 col-xs-12 px-0 py-4">
<div class="container">
<div class="row">
<div class="lqd-column col-md-12">
<div class="carousel-container carousel-nav-left carousel-nav-md carousel-dots-style1">
<div class="carousel-items row" data-lqd-flickity='{"cellAlign":"left","prevNextButtons":false,"buttonsAppendTo":"self","pageDots":false,"groupCells":false,"wrapAround":true,"autoPlay":3000,"pauseAutoPlayOnHover":false}'>
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/keck-obs.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/aao_logo_white_0.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/uk.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/uc-berk.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/ucsc.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/lick.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/berkeley.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
<div class="lqd-column carousel-item col-md-2 col-sm-3 col-xs-4">
<figure class="text-center">
<img src="./assets/img/logos/uw.png" alt="Client">
</figure>
</div><!-- /.carousel-item -->
</div><!-- /.carousel-items row -->
</div><!-- /.carousel-container -->
</div><!-- /.col-md-12 -->
</div><!-- /.row -->
</div><!-- /.container -->
</div>
</section>
</main><!-- /#content.content -->
</div><!-- /#wrap -->
<script src="./assets/vendors/jquery.min.js"></script>
<script src="./assets/js/theme-vendors.js"></script>
<script src="./assets/js/theme.min.js"></script>
</body>
</html>