<!DOCTYPE html>
{% load static %}

<html lang="en">
    <head>


    <meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

<title>

 BBQUDA

</title>

<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />

<!--     Fonts and icons     -->

  <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700,200" rel="stylesheet" />

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">

<!-- CSS Files -->

<link href="{% static "css/bootstrap.min.css" %}" rel="stylesheet" />
<link href="{% static "css/now-ui-dashboard.min.css" %}" rel="stylesheet" />
<link href="{% static "css/demo.css" %}" rel="stylesheet" />
<link rel="stylesheet" href="https://d19m59y37dris4.cloudfront.net/obaju/2-1-1/vendor/bootstrap/css/bootstrap.min.css">


  <div><style>

.errorlist
    {
        color: red;
    }

</style>


  </head>
        <div class="wrapper " >

            <div class="sidebar" data-color="orange">

    <div class="sidebar-wrapper" id="sidebar-wrapper" >


    </div>
</div>


            <div class="main-panel" id="main-panel" >
              <!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-transparent  bg-primary  navbar-absolute">
	<div class="container-fluid">
    <div class="navbar-wrapper">



			<a class="navbar-brand" >BBQUDA - Website for visualizing mission logs obtained from the EcoMapper and Heron drones.</a>
		</div>



	    <div class="collapse navbar-collapse justify-content-end" id="navigation">

<ul class="navbar-nav">



</ul>


	    </div>
	</div>
</nav>
<!-- End Navbar -->

                  <div class="panel-header panel-header-sm" >


</div>


                  <div class="content" style="background-image: url('{% static "heron.jpg" %}'); background-repeat: no-repeat; background-size: 100% 100%;">
                      <div class="row">
  <div class="col-md-12">


<div class="card" style = "width:50%">

    <div class="card-body" >
        <div class="table-responsive" >
            <table class="table" >

<tbody>
<div class="form-fields-section" >


<div class="registration" >



                <div class="bg-form" >

                   <form method="post" action="" id="form-login" class="login"><div class="signin form-fields-section kaxsdc" data-event="load">
             {% csrf_token %}

                        <h1> Log In </h1>





<div class="returningCustomer bg-form">


                            <fieldset>

                                <ol>
                                    <li class="field field--content">
                                        {{ form.username.errors }}
                                        {{ form.username.label_tag }}
                                        {{ form.username }}
                                   </li>

                                    <li class="field field--content">
                                        {{ form.password.errors }}
                                        {{ form.password.label_tag }}
                                        {{ form.password }}
                                    </li>



                                    </ol>
                                    <button type="submit" class="btn btn-default btn-lg btn-block">Login</button>
                        </div>

                        </form>
                            <div class="separator">

                                <hr>

                            </div>
                            <a href="{%url 'register'%}" class="cw-btn cw-btn--default cw-btn--full js-sign-in">Dont have an account? Register here.</a>

                        </fieldset>



                </div>
              </div>
            </div>

                </tbody>
            </table>
        </div>
    </div>
</div>

  </div>
  </div>
  <div class="col-md-12">


  </div>
</div>

                  </div>


             </div>

        </div>



    </body>

</html>





