forked from Laboratoria-learning/lyft
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
161 lines (161 loc) · 5.46 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Lyft</title>
<link rel="stylesheet" href="css/main.css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800" rel="stylesheet">
<link rel="stylesheet" href="fonts/style.css">
</head>
<body>
<!-- menú superior -->
<nav>
<img src="assets/images/logo-white.png" alt="">
<a>Drive</a>
<a>Explore</a>
<a>Help</a>
<button class="button">Log in</button>
</nav>
<!-- intro formulario -->
<section class="intro">
<!-- imagen de fondo -->
<div class="image"></div>
<!-- recuadro formulario -->
<div class="background">
<h1 class="text-uppercase m-0">TURN MILES</h1>
<h1 class="text-uppercase m-0">INTO MONEY</h1>
<h3 class="text-uppercase">SIGN UP TO DRIVE WITH LYFT.</h3>
<form action="">
<div id="form_phone">
<input type="text" value="Phone Number" id="Phone Number" name="Phone_Number">
</div>
</form>
<button class="btn_intro">Become a driver</button>
<a id="sign">Sign Up to Ride</a>
<div class="small">
<p class="cgray">Already applied?<a class="cgray">Check the status of your application here.</a></p>
<p class="mb-0 cgray">Earn money for inviting friends to drive. <a class="mb-0 cgray">Learn more</a></p>
</div>
</div>
</section>
<!-- intro 2 -->
<section class="intro2">
<div class="container">
<div class="text">
<div>
<h2 class="text-uppercase m-0">A RIDE IN MINUTES</h2>
<p>Request a ride and you’ll be on your way in minutes. Request. Ride. Repeat.</p>
</div>
<div>
<h2 class="text-uppercase m-0">SERIOUS ABOUT SAFETY</h2>
<p>From knowing the color of your driver’s car to our 24/7 Trust & Safety Team, we got you.</p>
</div>
<div>
<h2 class="text-uppercase m-0">HAPPY DRIVERS.</h2>
<h2 class="text-uppercase">HAPPY RIDERS.</h2>
<p>Ride with us and you’ll see why 9 out of 10 rides end with five stars.</p>
</div>
</div>
<div>
<img src="assets/images/phone.png" alt="">
</div>
</div>
</section>
<!-- seccion watch1 -->
<section class="watch1">
<div clas="container">
<div class="tvideo">
<div class="review">
<p class="text-uppercase m-0 top">Watch</p>
<h2 class="text-uppercase m-0">Amplify your ride</h2>
<p>Lyft's new emblem, Amp, is the secret to smooth pickups, Lighting up dashboards nationwide, the device makes it easy for passengers and drivers to find each other.</p>
</div>
<iframe id="ytplayer" type="text/html"
src="https://www.youtube.com/embed/fLSmUWOYpKw" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</section>
<!-- seccion video watch2 -->
<section class="watch2">
<div clas="container">
<div class="tvideo2">
<div class="review">
<p class="text-uppercase m-0 top">Watch</p>
<h2 class="text-uppercase m-0">June</h2>
<p>In an animated short film by Academy Award-winner John Kahrs a lonely widow in history South Chicago, is empowered to star sharing the ride- and sharing her life, too.</p>
</div>
<iframe id="ytplayer" type="text/html" src="https://www.youtube.com/embed/V7j8Aqxmbs8" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</section>
<!-- seccion video watch3 -->
<section class="watch3">
<div clas="container">
<div class="tvideo">
<div class="review">
<p class="text-uppercase m-0 top">Watch</p>
<h2 class="text-uppercase m-0">A good thing going</h2>
<p>Launching on tv and online "Ride on the Bright Side" shows how Lyft continues to prioritize happy drivers, short ETAs, and safety.</p>
</div>
<iframe id="ytplayer3" type="text/html" src="https://www.youtube.com/embed/xj2VWLV0xCU" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</section>
<!-- pie de página -->
<footer>
<div class="container" >
<div class="fcontainer">
<ul>
<li><h3 class="text-uppercase mt-0">LOG IN</h3></li>
<li><a href="">Help</a></li>
<li><a href="">Cities</a></li>
<li><a href="">Airports</a></li>
<li><a href="">Fare Estimate</a></li>
</ul>
<ul>
<li><h3 class="text-uppercase mt-0">PARTNER</h3></li>
<li><a href="">Partnerships</a></li>
<li><a href="">Enterprise</a></li>
<li><a href="">Ambassadors</a></li>
<li><a href="">Developers</a></li>
</ul>
<ul>
<li><h3 class="text-uppercase mt-0">LEARN</h3></li>
<li><a href="">Safety</a></li>
<li><a href="">Blog</a></li>
<li><a href="">Press</a></li>
<li><a href="">Careers</a></li>
</ul>
<!-- logos app, google, microsoft -->
<div id="foot" class="container" >
<div class="flogos">
<div>
<img src="assets/images/apple-store.svg" alt="">
</div>
<div>
<img src="assets/images/google-play.png" alt="">
</div>
<div>
<img src="assets/images/microsoft.png" alt="">
</div>
</div>
</div>
</div>
<!-- iconos sociales -->
<div class="fsocial">
<ul>
<li><button class="circle"><a href="https://twitter.com/lyft">
<span class="icon-twitter"></span></a></button></li>
<li><button class="circle"><a href="https://www.facebook.com/lyft"><span class="icon-facebook"></span></a></button></li>
<li><button class="circle"><a href="https://www.instagram.com/lyft/"><span class="icon-instagram"></span></a></button></li>
</ul>
</div>
<!-- derechos reservados -->
<div class="end">
<hr>
<p>© 2017 Lyft, Inc.TermsPrivacy</p>
</div>
</div>
</footer>
</body>
</html>