-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
216 lines (211 loc) · 14.1 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Home - Brand</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Cabin:700">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.2/css/lightbox.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.3.1/css/swiper.min.css">
<link rel="stylesheet" href="assets/css/styles.min.css">
</head>
<body id="page-top" style="background-color: rgb(255,255,255);">
<nav class="navbar navbar-light navbar-expand-md navbar navbar-expand-lg fixed-top" id="mainNav">
<div class="container"><a class="navbar-brand js-scroll-trigger" href="#" style="background-image: url("assets/img/AttoBlackNoBkg.svg");width: 43px;height: 49px;">Atto</a><button data-toggle="collapse" class="navbar-toggler navbar-toggler-right" data-target="#navbarResponsive"
type="button" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation" value="Menu"><i class="fa fa-bars"></i></button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="nav navbar-nav ml-auto">
<li class="nav-item nav-link js-scroll-trigger" role="presentation"><a class="nav-link active js-scroll-trigger" href="#page-top">About</a></li>
<li class="nav-item nav-link js-scroll-trigger" role="presentation"><a class="nav-link js-scroll-trigger" href="#services">Services</a></li>
<li class="nav-item nav-link js-scroll-trigger" role="presentation"><a class="nav-link js-scroll-trigger" href="#teamHeading">Camera</a></li>
</ul>
</div>
</div>
</nav>
<header class="masthead">
<div class="intro-body">
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
<h1 class="pulse animated brand-heading" style="color: rgb(255,255,255);">AttO</h1><div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<h4> Let us make you a custom <span class ="items"> </span> </h4>
<script>
var items = new Typed(".items", {
strings:
["",
"T-Shirt",
"Cutting Board",
"Trophy",
"Doorstop^500?",
"Water-Bottle",
"Vinyl Sticker",
"Coffee Mug",
"Anything^300."
],
smartBackspace: true, // Default value
typeSpeed: 100,
backSpeed: 60,
startDelay: 0,
loop: false,
});
</script>
</div><a class="btn btn-link pulse animated infinite btn-circle" role="button" href="#services"><i class="fa fa-angle-double-down animated" data-bs-hover-animate="rubberBand"></i></a></div>
</div>
</div>
</div>
</header>
<div class="highlight-clean" style="background-color: rgb(75,73,186);">
<div class="container">
<div class="row">
<div class="col"><img src="assets/img/gravityWaterLogo.png" class = "gravitywaterlogo"/></div>
</div>
</div>
<div class="container">
<div class="intro">
<p class="text-center" style="color: rgb(184,228,255);">All Atto profits go towards ensuring clean water in Nepalese schools</p>
</div>
<div class="buttons"><a class="btn btn-primary" role="button" href="https://gravitywater.org/" style="background-color: rgb(101,126,163);">Visit GRavityWater</a></div>
</div>
</div>
<div id="services" class="projects-horizontal">
<div class="container">
<div class="intro">
<h2 class="text-center" data-aos="fade-up">Services</h2>
</div>
<div class="row projects">
<div class="col-sm-6 item" data-aos="fade-right">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid" src="assets/img/Lulz%20Bot.jpg"></a></div>
<div class="col">
<h3 class="name">3d Printing</h3>
<p class="description">With over half a dozen printers, Atto can bring your 3D designs to life with rapid turn around times</p>
</div>
</div>
</div>
<div class="col-sm-6 item" data-aos="fade-left">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid" src="assets/img/Laser.jpg"></a></div>
<div class="col">
<h3 class="name">Laser Cutting/engraving</h3>
<p class="description">Channel the power of high-power lasers to engrave or precisely blast through various materials</p>
</div>
</div>
</div>
<div class="col-sm-6 item" data-aos="fade-right">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid" src="assets/img/X%20Carve.jpg"></a></div>
<div class="col">
<h3 class="name">CNC Milling</h3>
<p class="description">Fabricate intricate and robust components with one of our CNC milling machines</p>
</div>
</div>
</div>
<div class="col-sm-6 item" data-aos="fade-left">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid" src="assets/img/Screen%20Printer.jpg"></a></div>
<div class="col">
<h3 class="name">branding</h3>
<p class="description">From vinyl cutters to dye sublimators, our machines stand ready to help you spread your brand</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div data-aos="slide-up" id="team" class="team-clean">
<div class="container">
<div class="intro">
<h2 class="text-center js-scroll-trigger" href="#teamHeading">Team </h2>
</div>
<div class="row people">
<div class="col-md-6 col-lg-4 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/view/abavkarattoscroll/home"><img class="rounded-circle" src="assets/img/Avidh.jpg"></a></div>
</div>
<h3 class="name">Avidh Bavkar</h3>
<p class="title">CEO</p>
<p class="description">Hey! I'm Avidh, a senior here in Ventura CA. Outside of school, I like to build and program competitive robots and help build lunar rovers at UCSB.</p>
<div class="social"><a href="#"></a><a href="https://linkedin.com/in/avidhbavkar/"><i class="fa fa-linkedin"></i></a><a href=""><i class="fa fa-instagram"></i></a></div>
</div>
<div class="col-md-6 col-lg-4 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/venturaedu.org/andrew-lee/home"><img class="rounded-circle img-fluid" src="assets/img/Andrew-2.jpg"></a></div>
</div>
<h3 class="name">Andrew lee</h3>
<p class="title">cfo</p>
<p class="description">Hello! I'm Andrew Lee, the CFO of Atto. I'm part of the Senior Class of Foothill Technology High School. Outside of school, I make lots of coffee and films.</p>
<div class="social"><a href="#"></a><a href="#"><i class="fa fa-linkedin"></i></a><a href="#"><i class="fa fa-instagram"></i></a></div>
</div>
<div class="col-md-6 col-lg-4 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/venturaedu.org/thomasliangdtech/home"><img class="rounded-circle" src="assets/img/Thomas.jpg"></a></div>
</div>
<h3 class="name">thomas liang</h3>
<p class="title"> Team Member</p>
<p class="description">Aenean tortor est, vulputate quis leo in, vehicula rhoncus lacus. Praesent aliquam in tellus eu gravida. Aliquam varius finibus est, et interdum justo suscipit id. Etiam dictum feugiat tellus, a semper massa. </p>
<div class="social"><a href="#"></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-instagram"></i></a></div>
</div>
<div class="col-md-6 col-lg-4 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/view/nathaniel-barnaby"><img class="rounded-circle" src="assets/img/Nate.jpg"></a></div>
</div>
<h3 class="name">Nathaniel Barnaby</h3>
<p class="title">Team Member</p>
<p class="description">Hello. I am a senior at Foothill Technology High School, and currently want to become an Aerospace Engineer. Outside of school, I am a part of a FRC (FIRST Robotics Competition) Team. </p>
<div class="social"><a href="#"></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-instagram"></i></a></div>
</div>
<div class="col-md-6 col-lg-4 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/view/ethan-peters/home?authuser=1"><img class="rounded-circle" src="assets/img/Ethan.jpg"></a></div>
</div>
<h3 class="name">Ethan Peters</h3>
<p class="title">Team Member</p>
<p class="description">Hi! I'm Ethan, a team member of Atto. I am a senior attending Foothill Technology High School in Ventura CA. I love chocolate and ice-cream, and I am part of the Cammarillo Lion Dance Troupe.</p>
<div class="social"><a href="#"></a><i class="fa fa-instagram"></i><a href="#"></a><a href="#"></a></div>
</div>
<div class="col-md-6 col-lg-4 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/venturaedu.org/atto-daniel-dtech/home"><img class="rounded-circle" src="assets/img/Daniel.jpg"></a></div>
</div>
<h3 class="name">Daniel Espinola</h3>
<p class="title">Team Member</p>
<p class="description">Hi I’m Daniel and I am currently a senior at Foothill Technology High School. My goal is to bring the highest quality experience to our customers while reflecting these ideals in our products. </p>
<div class="social"><a href="#"></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-instagram"></i></a></div>
</div>
<div class="col-md-6 col-lg-4 offset-4 offset-lg-0 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/view/liamwulffatto/blog"><img class="rounded-circle" src="assets/img/Liam.jpg"></a></div>
</div>
<h3 class="name">Liam Wulff</h3>
<p class="title">Team Member</p>
<p class="description">Aenean tortor est, vulputate quis leo in, vehicula rhoncus lacus. Praesent aliquam in tellus eu gravida. Aliquam varius finibus est, et interdum justo suscipit id. Etiam dictum feugiat tellus, a semper massa. </p>
<div class="social"><a href="#"></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-instagram"></i></a></div>
</div>
<div class="col-md-6 col-lg-4 offset-4 offset-xl-0 item">
<div class="row">
<div class="col"><a href="https://sites.google.com/view/kaden-henrey-d-tech-portfolio/home"><img class="rounded-circle" src="assets/img/Liam.jpg"></a></div>
</div>
<h3 class="name">Kaden henrEy</h3>
<p class="title">Team Member</p>
<p class="description">Hey I'm Kaden and I'm currently a senior at Foothill Technology Highschool. I hope to make high quality products and learn new things while I'm at it.</p>
<div class="social"><a href="#"></a><a href="#"><i class="fa fa-twitter"></i></a><a href="#"><i class="fa fa-instagram"></i></a></div>
</div>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.2/js/lightbox.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.3.1/js/swiper.jquery.min.js"></script>
<script src="assets/js/script.min.js"></script>
</body>
</html>