{% load static from staticfiles %}
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'> {% block metatags %} {% endblock %}
<link href="https://fonts.googleapis.com/css?family=Lato:300,400" rel="stylesheet">
<link rel="stylesheet" href="{% static 'css/index.css' %}">
<!--[if IE]> <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'> <![endif]-->
<link href="{% static 'img/favicon.png' %}" rel='shortcut icon' type='image/x-icon'>
<link href="{% static 'img/favicon.png' %}" rel='apple-touch-icon-precomposed'>
<!-- / START - page related stylesheets [optional] -->
<!-- / END - page related stylesheets [optional] -->
<!-- / bootstrap [required] -->
<link href="{% static 'assets/stylesheets/bootstrap/bootstrap.css' %}" rel="stylesheet" type="text/css" media="all" />
<!-- / theme file [required] -->
<link href="{% static 'assets/stylesheets/light-theme.css' %}" rel="stylesheet" type="text/css" media="all" id="color-settings-body-color" />
<!-- / coloring file [optional] (if you are going to use custom contrast color) -->
<link href="{% static 'assets/stylesheets/theme-colors.css' %}" rel="stylesheet" type="text/css" media="all" />
</head>
<body class='contrast-image login'>
<img src="/static/img/wisp-bg-1.jpg" id="fondoAleatorio">
<div class='text-center'>
{% if messages %}
<div class="container">
<div class="row">
<div class="col-sm-offset-2 col-sm-8">
{% for message in messages %}
<div class="alert {{ message.tags }} alert-dismissible alert-wisp" role="alert" style="opacity: 80% !important;">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
{{ message|safe }}
</div>
{% endfor %}
</div>
</div>
</div>
{% endif %}
<div class='login-container'>
<div class='container'>
<div class='row'>
<div class='col-sm-4 col-sm-offset-4'>
{% block content %} {% endblock %}
</div>
</div>
</div>
</div>
</div>
<!-- / jquery [required] -->
<script src="{% static 'assets/javascripts/jquery/jquery.min.js' %}" type="text/javascript"></script>
<!-- / jquery mobile (for touch events) -->
<script src="{% static 'assets/javascripts/jquery/jquery.mobile.custom.min.js' %}" type="text/javascript"></script>
<!-- / jquery ui -->
<script src="{% static 'assets/javascripts/jquery/jquery-ui.min.js' %}" type="text/javascript"></script>
<!-- / jQuery UI Touch Punch -->
<script src="{% static 'assets/javascripts/jquery/jquery.ui.touch-punch.min.js' %}" type="text/javascript"></script>
<!-- / bootstrap [required] -->
<script src="{% static 'assets/javascripts/bootstrap/bootstrap.js' %}" type="text/javascript"></script>
<!-- / modernizr -->
<script src="{% static 'assets/javascripts/plugins/modernizr/modernizr.min.js' %}" type="text/javascript"></script>
<!-- / retina -->
<script src="{% static 'assets/javascripts/plugins/retina/retina.js' %}" type="text/javascript"></script>
<!-- / theme file [required] -->
<script src="{% static 'assets/javascripts/theme.js' %}" type="text/javascript"></script>
<!-- / START - page related files and scripts [optional] -->
<script src="{% static 'assets/javascripts/plugins/validate/jquery.validate.min.js ' %}" type="text/javascript"></script>
<!-- / END - page related files and scripts [optional] -->
<script type="text/javascript">
numero = Math.floor(Math.random() * 7) + 1
document.getElementById("fondoAleatorio").src="/static/img/wisp-bg-" + numero + ".jpg";
</script>
{% block extra_resources %} {% endblock %}
</body>
</html>