-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
162 lines (139 loc) · 11.7 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
<!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.0">
<link rel="stylesheet" href="input.css">
<link rel="shortcut icon" href="favicon-32x32.png" type="png/x-icon">
<title>It's Me</title>
</head><div id="0f171e"></div>
<body>
<nav class="flex bg-[#0f171e] scroll-m-7:w-[100%] text-[#f2f4f6] text-opacity-90 h-16 justify-between px-10 w-screen fixed z-50">
<div class="flex justify-center items-center gap-4 ">
<div class="w-28 bg-[#0f171e] max-h-max "><img src="AmazonNav.png" alt="AmazonLogo"></div>
<div>Home</div>
<div>Store</div>
<div>Channels</div>
<div class="group grid gap-4">
<div class=" cursor-pointer mb-10 relative top-5 "><a href="#">Categories</a> </div>
<ul class=" auto-cols-min gap-4 max-w-max absolute top-16 hidden group-active:grid z-20 ">
<li class="transition-all ease-in-out delay-75 duration-500 hover:w-60 hover:border-white border-2 border-[#284867] shadow-sm shadow-slate-500 rounded-lg h-20 w-40 font-semibold text-yellow-50 bg-[#284867] flex justify-center items-center bg-cover " style="background-image: url(https://m.media-amazon.com/images/G/01/digital/video/web_cats/Included-With-Prime.png);">Kids</li>
<li class=" transition-all ease-in-out delay-75 duration-500 hover:w-60 hover:border-white border-2 border-[#284867] shadow-sm shadow-slate-500 rounded-lg h-20 w-40 font-semibold text-yellow-50 bg-[#284867] flex justify-center items-center bg-cover" style="background-image:url(https://m.media-amazon.com/images/G/01/digital/video/web_cats/Amazon-Originals.png) ;">Tv</li>
<li class="transition-all ease-in-out delay-75 duration-500 hover:w-60 hover:border-white border-2 border-[#284867] shadow-sm shadow-slate-500 rounded-lg h-20 w-40 font-semibold text-yellow-50 bg-[#284867] flex justify-center items-center bg-cover" style="background-image:url(https://m.media-amazon.com/images/G/01/digital/video/web_cats/Movies.png) ;">Movies</li>
<li class="transition-all ease-in-out delay-75 duration-500 hover:w-60 hover:border-white border-2 border-[#284867] shadow-sm shadow-slate-500 rounded-lg h-20 w-40 font-semibold text-yellow-50 bg-[#284867] flex justify-center items-center bg-cover" style="background-image:url(https://m.media-amazon.com/images/G/01/digital/video/web_cats/TV-Shows.png) ;">Amazon Originals</li>
<li class="transition-all ease-in-out delay-75 duration-500 hover:w-60 hover:border-white border-2 border-[rgb(40,72,103)] shadow-sm shadow-slate-500 rounded-lg h-20 w-40 font-semibold text-yellow-50 bg-[#284867] flex justify-center items-center bg-cover" style="background-image:url(https://m.media-amazon.com/images/G/01/digital/video/web_cats/Included-With-Prime.png) ;">Included with Prime</li>
</ul>
</div>
<div>My Stuff</div>
</div>
<div class=" flex justify-center items-center ">
<div class=" px-2 bg-cyan-700 h-9 flex w-32 text-lg font-extralight rounded-sm justify-center items-center">Try For Free</div>
<div class="group px-2 w-14 "> <a href="#"><img src="search-2997143-2516181.webp" alt="search"></a>
<div class="search hidden group-hover:grid z-10 absolute top-3 right-40"> <input class="w-80 h-10 rounded-full text-lg z-10 bg-slate-800 px-3" type="text" placeholder="Search"></div>
</div>
<div class="flex ">
<div><img src="download.svg" alt="pipo"></div>
<div class="px-2 ">
<select name="laxmi" id="amma" class="bg-inherit ">
<option class="bg-slate-700 text-center" value="en">EN
</option>
<option class=" bg-slate-700 text-center" value="HN">HN</option>
<option class="bg-slate-700 text-center" value="KO">ML</option>
<option class="bg-slate-700 text-center " value="Gu">GJ</option>
</select>
</div>
</div>
<div class="w-7 "><img src="user-login-icon-14.png" alt="" ></div>
<div class="px-2"><select name="mila" id="kila" class="w-4 bg-inherit">
<option value="cxc" class="bg-slate-700 text-lg m-5"> </option>
<option value="bdh" class="bg-slate-700 text-lg m-5">Sign In</option>
<option value="njx" class="bg-slate-700 text-lg m-5" >Watch Anywhere</option>
<option value="kass" class="bg-slate-700 text-lg m-5">Help</option>
</select>
</div>
</div>
</nav>
<main>
<section>
<div class="Sigma-Container flex absolute top-16 items-center justify-center ">
<div class="z-10 Beta-container-1 flex flex-col justify-center bg-black h-[34rem] ">
<h1 class="text-5xl text-white m-5">Welcome to Prime Video</h1>
<p class="text-white text-2xl m-5 ">Watch the latest movies, TV shows, and award-winning Amazon Originals</p>
<div class="signin border-white text-white border-2 w-fit p-3 rounded-md bg-cyan-500 m-3 hover:bg-cyan-600 hover:cursor-pointer hover:border-zinc-500 px-14">Sign In For Join Prime</div>
</div>
<div class="Beta-container-2 bg-cover" style="background-image: url(MLP._SX1440_CR5750865675_QL80_AC_FP_.jpg);">
</div>
</div>
</section>
<section>
<div class="Sigma-container2 flex justify-betweent absolute top-[38rem] ">
<div class="beta-container10 h-[30rem] overflow-hidden">
<img src="TVOD_MLP_Left._SX1440_CR00865675_QL80_AC_FP_.jpg" alt="">
</div>
<div class="beta-container20 bg-black h-[30rem] flex flex-col justify-center">
<h1 class="text-5xl text-white my-6 font-semibold ">Movie rentals on Prime Video
</h1>
<p class="text-white text-3xl w-[32rem] pb-6 font-thin">Early Access to new movies, before digital subscription</p>
<div class="text-white border-white border-2 w-fit px-14 py-3 bg-cyan-600 hover:bg-cyan-800 rounded-md hover:cursor-pointer text-left">Rent Now</div>
</div>
</div>
</section>
<section>
<div class="Sigma_class_3 flex absolute top-[68rem] items-center justify-center mx-9">
<div class="beta_class01">
<h1 class="text-5xl pb-10">Your favorite channels all in one place</h1>
<p class="max-w-2xl text-2xl font-thin">With Prime Video Channels, find shows and movies from your favorite channels all in one place. Enjoy with an add-on subscription to Channels of your choice</p>
</div>
<div class="beta_class02 grid grid-cols-3 ">
<div class="box-1 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="426x294_Discovery.jpg" alt=""></div>
<div class="box-2 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="426x294_MANORAMAMAX.jpg" alt=""></div>
<div class="box-3 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Docubay-426X2947_V1.jpg" alt=""></div>
<div class="box-4 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Erosnow-426X2948_V1.jpg" alt=""></div>
<div class="box-5 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Hayu.png" alt=""></div>
<div class="box-6 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="hoichoi-426X2946_V1.jpg" alt=""></div>
<div class="box-7 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="iWonder.png" alt=""></div>
<div class="box-8 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="LionsgatePlay-426X2946_V1.jpg" alt=""></div>
<div class="box-9 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Mubi-426X2946_V1.jpg" alt=""></div>
<div class="box-10 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Vrott.png" alt=""></div>
<div class="box-11 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Amc.png" alt=""></div>
<div class="box-12 m-1 hover:cursor-pointer hover:transition-shadow hover:ease-in-out hover:animate-pulse hover:delay-1000 hover:shadow-black"><img class="w-64" src="Stingray.png" alt=""></div>
</div>
</div>
</section>
<section>
<div class="Sigma-Container001 flex absolute top-[106rem] items-center justify-center">
<div class="Beta-Conatainer001 h-[27rem] overflow-hidden ">
<img class=" w-[210rem]" src="MLP_Template_Image_Left._SX1440_CR00865675_QL80_AC_FP_.jpg" alt="">
</div>
<div class="Beta-Conatainer002 flex flex-col t bg-black h-[27rem] justify-center ">
<h1 class="text-4xl font-semibold my-2 text-white">Even better with Fire TV Stick</h1>
<p class=" text-2xl my-3 text-white mb-10 font-thin">The biggest movies and TV shows are always better on a big screen. Simply plug in your Amazon Fire TV Stick and stream on any HDTV. Press the voice button on the remote and say the name of the title you want to watch to find it in seconds.</p>
<div class="border-2 border-black bg-cyan-600 text-white max-w-fit px-20 rounded-md py-3 hover:cursor-pointer hover:bg-cyan-800">Get Started</div>
</div>
</div>
</section>
<section>
<div class="sigma-male0001 flex absolute top-[133rem]">
<div class=" pl-10 betamale1 bg-black flex flex-col justify-center ">
<h1 class="pl-10 text-white font-semibold text-5xl mb-6" >Family Friendly</h1>
<p class="pl-10 text-white font-light text-2xl mb-10 flex flex-shrink">With easy to use Parental Controls and a dedicated kids page, enjoy secure, ad-free kids entertainment. Kids can enjoy popular TV shows like Peppa Pig, Powerpuff Girls, and Chhota Bheem.</p>
<div class=" ml-10 border-2 border-black bg-cyan-600 text-white max-w-fit px-20 rounded-md py-3 hover:cursor-pointer hover:bg-cyan-800">Get Started</div>
</div>
<div class="betamale2 h-[25rem] overflow-hidden">
<img class="w-[120rem]" src="IN-kids-30Jan._SX1440_CR5750865675_QL80_AC_FP_.jpg" alt="">
</div>
</div>
</section>
</main>
<footer class=" flex flex-col absolute top-[158rem] justify-center items-center bg-[#222222] w-[100vw] pb-12 pt-8">
<img class="w-28" src="web_footer_logo._CB462908456_.png" alt="">
<div>
<a class=" px-3 text-base font-thin text-sky-500 " href="#">Terms and Privacy Notice</a>
<a class=" px-3 text-base font-thin text-sky-500 " href="#">Send us feedback</a>
<a class=" px-3 text-base font-thin text-sky-500 " href="#">Help</a>
</div>
<p class="font-light text-[#949494]">© 1996-2022, Amazon.com, Inc. or its affiliates</p>
</footer>
</body>
</html>