- Files
- Index
- Style
- Script
- README
- CDN Add
PLEASE WAIT...
<!DOCTYPE html>
<html>
<head>
<title>Netflix India - Watch TV Shows Online , Watch Movies Online</title>
</head>
<body>
<div class="root">
<nav class="navbar">
<img class="img-logo" src="https://download.logo.wine/logo/Netflix/Netflix-Logo.wine.png" alt="Netflix"/>
<div class="btn-signin">Sign In</div>
</nav>
<div class="main-content">
<div class="main-title-content">
<h1 class="main-title">Unlimited Movies, TV <br>shows and more</h1>
<h2 class="sub-title">Watch anywhere. Cancel anytime.</h2>
<p class="main-call-to-action">Ready to watch? Enter your email to create or restart your membership.
</p>
</div>
<div class="main-email-container">
<input class="main-email-container-input" type="text" placeholder="Email address">
<div class="btn-get-started">Get Started ></div>
</div>
</div>
</div>
</body>
</html>body{
margin: 0px;
padding: 0px;
overflow-y: hidden;
}
.root{
background-size: cover;
background-image: radial-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.8)),url("https://assets.nflxext.com/ffe/siteui/vlv3/0bd3a69d-6790-4edc-9818-1c8c558946c2/e1a8a32a-a07a-4bae-965a-9b218881763e/IN-en-20220329-popsignuptwoweeks-perspective_alpha_website_medium.jpg");
background-position: center;
background-repeat: no-repeat;
}
.navbar{
padding-top: 1%;
padding-left: 2vw;
padding-right: 4vw;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
height: 10vh;
}
.img-logo{
width: 14%;
color: #e50914;
}
.btn-signin{
background-color: #e50914;
color: #fff;
padding-top: 8px;
padding-right: 20px;
padding-bottom: 8px;
padding-left: 20px;
border-radius: 5px;
cursor: pointer;
width: fit-content;
}
.main-content{
width: 100%;
height: 90vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
line-height: 1.1;
}
.main-title-content{
color: #fff;
text-align: center;
width: 50%;
}
.main-title{
font-size: 3.2em;
}
.sub-title{
font-family: Arial, Helvetica, sans-serif;
font-size: 1.5em;
margin-bottom: 30px;
}
.main-call-to-action{
font-family: Arial, Helvetica, sans-serif;
font-size: 1.2em;
}
.main-email-container{
width: 55%;
height: fit-content;
background-color: #ffffff;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.main-email-container-input{
outline: none;
border: none;
padding: 20px 10px;
font-size: 1em;
}
.btn-get-started{
cursor: pointer;
padding: 20px 32px;
font-family: Arial, Helvetica, sans-serif;
height: fit-content;
background-color: #e50914;
color: #fff;
font-size: 1.4em;
text-transform: uppercase;
}
.btn-get-started:hover{
background-color: #ff0b18;
}/* ESLint rules https://eslint.org/docs/2.0.0/rules/ */
/* eslint no-undef: "off" */