Login panel
by Taqi_Shah
HTML
<form method="POST" action="/account/login/" id="FORM_1">
<legend id="LEGEND_2">
Log in to an existing account
</legend>
<input type="hidden" name="csrfmiddlewaretoken" value="8yKXfjqjRnAwEXop1P4842UWgEYzl8Dr" id="INPUT_3" />
<div id="DIV_4">
<label for="id_login-email" id="LABEL_5">
Email
</label>
<div id="DIV_6">
<input id="INPUT_7" name="login-email" type="email" placeholder="Email Address" />
</div>
</div>
<div id="DIV_8">
<label for="id_login-password" id="LABEL_9">
Password
</label>
<div id="DIV_10">
<input id="INPUT_11" name="login-password" type="password" />
</div>
</div>
<div id="DIV_12">
<div id="DIV_13">
<div id="DIV_14">
<label id="LABEL_15">
<input id="INPUT_16" name="login-remember" type="checkbox" /> <span id="SPAN_17">Remember Me</span>
</label>
</div>
</div>
</div> <a href="/account/password/reset/" id="A_18">Forgot your password?</a>
<button type="submit" id="BUTTON_19">
Log in
</button>
</form>
CSS
#FORM_1 {
box-sizing: border-box;
color: rgb(255, 255, 255);
height: 270.333343505859px;
text-align: center;
width: 540px;
perspective-origin: 270px 135.16667175293px;
transform-origin: 270px 135.16667175293px;
border: 0px none rgb(255, 255, 255);
font: normal normal normal normal 16px/25px BrandonText-Medium;
margin: 0px 0px 50px;
outline: rgb(255, 255, 255) none 0px;
}/*#FORM_1*/
#LEGEND_2 {
box-sizing: border-box;
/*color: rgb(255, 255, 255);*/
color:black;
height: 25.3333339691162px;
text-align: center;
width: 540px;
perspective-origin: 270px 12.6666669845581px;
transform-origin: 270px 12.6666669845581px;
border-top: 0px none rgb(255, 255, 255);
border-right: 0px none rgb(255, 255, 255);
border-bottom: 1.33333337306976px solid rgb(229, 229, 229);
border-left: 0px none rgb(255, 255, 255);
font: normal normal normal normal 21px/25px BrandonText-Medium;
margin: 0px 0px 20px;
outline: rgb(255, 255, 255) none 0px;
padding: 0px;
}/*#LEGEND_2*/
#INPUT_3 {
color: rgb(51, 51, 51);
display: none;
height: auto;
width: auto;
perspective-origin: 50% 50%;
transform-origin: 50% 50%;
border: 0px none rgb(51, 51, 51);
font: normal normal normal normal 16px/25px BrandonText-Medium;
outline: rgb(51, 51, 51) none 0px;
padding: 0px;
}/*#INPUT_3*/
#DIV_4, #DIV_8 {
box-sizing: border-box;
color: rgb(255, 255, 255);
height: 62px;
text-align: center;
width: 540px;
perspective-origin: 270px 31px;
transform-origin: 270px 31px;
border: 0px none rgb(255, 255, 255);
font: normal normal normal normal 16px/25px BrandonText-Medium;
margin: 0px 0px 15px;
outline: rgb(255, 255, 255) none 0px;
}/*#DIV_4, #DIV_8*/
#LABEL_5 {
box-sizing: border-box;
/*color: rgb(255, 255, 255);*/
color:black;
display: inline-block;
height: 24px;
text-align: center;
width: 37.9583320617676px;
...