{% extends 'basic.html' %} {% block title %} Log In {% endblock %} {% block loginactive %} active {% endblock loginactive %} {% block css %} @import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500); *:focus { outline: none; } body { margin: 0; padding: 0; background: #DDD; font-size: 16px; color: #222; font-family: 'Roboto', sans-serif; font-weight: 300; } #login-box { position: relative; margin: 5% auto; width: 700px; height: 500px; background: #FFF; border-radius: 2px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); } .items { position: absolute; top: 0; left: 0; box-sizing: border-box; padding: 40px; width: 700px; height: 500px; } h1 { margin: 0 0 20px 0; font-weight: bold; font-size: 28px; text-align: center; } input[type="text"], input[type="password"] { display: block; box-sizing: border-box; margin-bottom: 20px; padding: 4px; width: 600px; height: 32px; border: none; border-bottom: 1px solid #AAA; font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 15px; transition: 0.2s ease; } input[type="text"]:focus, input[type="password"]:focus { border-bottom: 2px solid #16a085; color: #16a085; transition: 0.2s ease; } input[type="submit"] { margin-top: 28px; width: 120px; height: 32px; background: #16a085; border: none; border-radius: 2px; color: #FFF; font-family: 'Roboto', sans-serif; font-weight: 500; text-transform: uppercase; transition: 0.1s ease; cursor: pointer; position: relative; left: 250px; } input[type="submit"]:hover, input[type="submit"]:focus { opacity: 0.8; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); transition: 0.1s ease; } input[type="submit"]:active { opacity: 1; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); transition: 0.1s ease; } {% endblock %} {% block body %}
{% for message in messages %} {% endfor %}

Log In

{% csrf_token %}
{% endblock %}