-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
161 lines (148 loc) · 7.08 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>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/icomoon/style.css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<title>Lift</title>
</head>
<body>
<header class="hero">
<nav class="menu">
<div class="logo-menu">
<img id="logo" class="logo" src="assets/img/logo-white.png" alt="logo">
</div>
<div class="item-menu">
<a class="item" href="#">Drive</a>
<a class="item" href="#">Explore <i class="fa fa-angle-down" aria-hidden="true"></i></a>
<a class="item" href="#">Help</a>
<a class="item" id="login" href="#">Log in</a>
<a class="item color-pink" id="sign" href="#">Sign up</a>
</div>
</nav>
<video class="hero-play" preload autoplay loop>
<source src="assets/img/hero-video.mp4" type="video/mp4">
</video>
<div class="detail-hero">
<p class="title-form">TURN MILES</p>
<p class="title-form">INTO MONEY</p>
<p class="subtitle-form ">SIGN UP TO DRIVE WITH LYFT</p>
<form class="" action="index.html" method="post">
<input id="mostrar" class="input-form" required type="tel" placeholder="Phone Number" value="">
<input class="input-form hidden xs" required type="text" placeholder="first Name" value="">
<input class="input-form hidden xs " required type="text" placeholder="First Name" value="">
<input class="input-form hidden xs " required type="text" placeholder="Last Name" value="">
<input class="input-form hidden" required type="mail" placeholder="Email" value="">
<input class="input-form hidden xs" required type="text" placeholder="City" value="">
<input class="padd-top hidden" required type="checkbox" checked="checked">
<label class="padd-top hidden litle-text color-gray">I agree to <a class="color-pink" href="">Lyft’s Terms of Service</a></label>
<br>
<button class="btn-form color-white" type="submit" name="button">Become a driver</button>
</form>
<a class="color-gray" href="#">Sign Up to Ride</a>
<p class="litle-text color-gray">Earn money for inviting friends to drive <span class="color-pink">Learn more</span></p>
<p class="litle-text color-gray">Already aplied? <span class="color-pink">Check the status of your application here</span></p>
</div>
</header>
<section class="info">
<div class="info-text">
<p class="title-info">A RIDE IN MINUTES</p>
<p class="text color-white padd-bt">Request a ride and you will be on your way in minutes. Request. Ride.Repeat
</p>
<p class="title-info">SERIUS ABOUT SAFETY</p>
<p class="text color-white padd-bt">From knowing the color of your driver is car to 24/7 Trust & Safety Team , we got you</p>
<p class="title-info">HAPPY DRIVERS</p>
<p class="title-info">HAPPY RIDERS</p>
<p class="text color-white padd-bt">Ride with us and you will see why 9 out of 10 rides end with five stars</p>
</div>
<div class="info-img">
<img class="img-info" src="assets/img/phone.png" alt="">
</div>
</section>
<section class="ride">
<div class="text-mtd">
<span class="first-text">WATH</span>
<h3 class="title-text">AMPLIFY YOUR RIDE</h3>
<p class="text"> Lyft´s new emblem, Amp , is the secret to smooth pickup. Lighting up dashboad nationwide , the device makes it easy for passenger and drivers to find each other.</p>
</div>
<div class="video-mtd left-text">
<iframe width="420" height="345" src="https://www.youtube.com/embed/fLSmUWOYpKw" frameborder="0" allowfullscreen="">
</iframe>
</div>
</section>
<section class="june">
<div class="video-mtd ">
<iframe width="420" height="345" src="https://www.youtube.com/embed/v8nyGzOLsdw" frameborder="0" allowfullscreen="">
</iframe>
</div>
<div class="text-mtd left-video">
<p class="first-text">WATH</p>
<p class="title-text">JUNE</p>
<p class="text"> In an animated short film by Academy Award-winner John Kahrs, a lonely widow in historic South Chicago is empowered to start sharing the ride — and sharing her life, too.</p>
</div>
</section>
<section class="thing">
<div class="text-mtd">
<p class="first-text">WATH</p>
<p class="title-text">A GOOD THING GOING</p>
<p class="text"> Launching on TV and online, “Ride on the Bright Side” shows how Lyft continues to prioritize happy drivers, short ETAs, and safety.</p>
</div>
<div class="video-mtd left-text">
<iframe class="right" src="https://www.youtube.com/embed/xj2VWLV0xCU" frameborder="0" allowfullscreen=""></iframe>
</div>
</section>
<footer class="pie-pagina color-white">
<div class="item-pie-1">
<ul>
<li class="bold">DRIVE</li>
<li class="bold">RIDE</li>
<li class="bold">LOG IN</li>
<li>Help</li>
<li>Cities</li>
<li>Airports</li>
<li>Fare Estimate</li>
<li>Free Ride Credits</li>
<li>Driver Bonus</li>
<li>Gift Cards</li>
</ul>
</div>
<div class="item-pie-2">
<ul>
<li>PARTNER</li>
<li>Partnerships</li>
<li>Ambassadors</li>
<li>Developers</li>
<li>Events</li>
</ul>
</div>
<div class="item-pie-3">
<ul>
<li>LEARN</li>
<li>Safety</li>
<li>Blog</li>
<li>Press</li>
<li>Carreers</li>
<li>Driver Requeriments</li>
<li>Driver Earnings</li>
</ul>
</div>
<div class="item-pie-4">
<ul>
<li> <img class="img-footer" src="assets/img/apple-store.svg" alt=""></li>
<li> <img class="img-footer" src="assets/img/google-play.png" alt=""></li>
<li><img class="img-footer" src="assets/img/descarga.png" alt=""></li>
<li> <img class="img-footer" src="assets/img/microsoft.png" alt=""></li>
</ul>
</div>
<div class="icon-redes">
<span class="icon-facebook"></span>
<span class="icon-instagram"></span>
<span class="icon-twitter"></span>
<p class="text-pie">© 2017 Lyft, Inc.TermsPrivacy</p>
</div>
</footer>
<script type="text/javascript" src="assets/js/validation.js"></script>
<script type="text/javascript" src="assets/js/app.js"></script>
</body>
</html>