<!DOCTYPE html>
<html lang="es">
<head>

	<!-- start: Meta -->
	<meta charset="utf-8">
	<title>{{ login }}</title>
	<meta name="description" content="">
	<meta name="author" content="Cristian Dulcey">
	<meta name="keyword" content="">
	<!-- end: Meta -->

	<!-- start: Mobile Specific -->
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- end: Mobile Specific -->

	<!-- start: CSS -->
	<link id="bootstrap-style" href="/static/metro/css/bootstrap.min.css" rel="stylesheet">
	<link href="/static/metro/css/bootstrap-responsive.min.css" rel="stylesheet">
	<link id="base-style" href="/static/metro/css/style.css" rel="stylesheet">
	<link id="base-style-responsive" href="/static/metro/css/style-responsive.css" rel="stylesheet">
	<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,cyrillic-ext,latin-ext' rel='stylesheet' type='text/css'>
	<!-- end: CSS -->


	<!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->
	<!--[if lt IE 9]>
	  	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		<link id="ie-style" href="/static/metro/css/ie.css" rel="stylesheet">
	<![endif]-->

	<!--[if IE 9]>
		<link id="ie9style" href="/static/metro/css/ie9.css" rel="stylesheet">
	<![endif]-->

	<!-- start: Favicon -->
	<link rel="shortcut icon" href="/static/metro/img/favicon.ico">
	<!-- end: Favicon -->

			<style type="text/css">
			body { background: url('/static/metro/img/bg-login.jpg') !important; }
		</style>



</head>

<body>
		<div class="container-fluid-full">
		<div class="row-fluid">

			<div class="row-fluid">
				<div class="login-box">
{#					<div class="icons">#}
{#						<a href="index.html"><i class="halflings-icon home"></i></a>#}
{#						<a href="#"><i class="halflings-icon cog"></i></a>#}
{#					</div>#}
                    {% if messages %}
                        {% for message in messages %}
                        <div role="alert" class="alert {% if message.tags %}alert-{% if message.tags = "error" %}danger{% else %}{{message.tags}}{%endif%}"{%endif%}>{{message}}
                            <button type="button" class="close" id="botonCerrar" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
                        </div>
                        {% endfor %}
                    {% endif%}
					<h2>Login</h2>
					<form class="form-horizontal"  method="post">
						{% csrf_token %}
                        <fieldset>
							<div class="input-prepend" title="Username">
								<span class="add-on"><i class="halflings-icon user"></i></span>
								<input class="input-large span10" name="username" id="username" type="text" placeholder="Usuario"/>
							</div>
							<div class="clearfix"></div>

							<div class="input-prepend" title="Password">
								<span class="add-on"><i class="halflings-icon lock"></i></span>
								<input class="input-large span10" name="password" id="password" type="password" placeholder="Contraseña"/>
							</div>
							<div class="clearfix"></div>

{#							<label class="remember" for="remember"><input type="checkbox" id="remember" />Remember me</label>#}

							<div class="button-login">
								<button type="submit" class="btn btn-primary">Entrar</button>
							</div>
							<div class="clearfix"></div>
                        </fieldset>
					</form>
					<hr>
					<h3>¿Olvidaste Tu Contraseña?</h3>
					<p>
						No te preocupes, <a href="/password">Click Aqui</a> para obtener una nueva.
					</p>
				</div><!--/span-->
			</div><!--/row-->


	</div><!--/.fluid-container-->

		</div><!--/fluid-row-->

	<!-- start: JavaScript-->

		<script src="/static/metro/js/jquery-1.9.1.min.js"></script>
	<script src="/static/metro/js/jquery-migrate-1.0.0.min.js"></script>

		<script src="/static/metro/js/jquery-ui-1.10.0.custom.min.js"></script>

		<script src="/static/metro/js/jquery.ui.touch-punch.js"></script>

		<script src="/static/metro/js/modernizr.js"></script>

		<script src="/static/metro/js/bootstrap.min.js"></script>

		<script src="/static/metro/js/jquery.cookie.js"></script>

		<script src='/static/metro/js/fullcalendar.min.js'></script>

		<script src='/static/metro/js/jquery.dataTables.min.js'></script>

		<script src="/static/metro/js/excanvas.js"></script>
	<script src="/static/metro/js/jquery.flot.js"></script>
	<script src="/static/metro/js/jquery.flot.pie.js"></script>
	<script src="/static/metro/js/jquery.flot.stack.js"></script>
	<script src="/static/metro/js/jquery.flot.resize.min.js"></script>

		<script src="/static/metro/js/jquery.chosen.min.js"></script>

		<script src="/static/metro/js/jquery.uniform.min.js"></script>

		<script src="/static/metro/js/jquery.cleditor.min.js"></script>

		<script src="/static/metro/js/jquery.noty.js"></script>

		<script src="/static/metro/js/jquery.elfinder.min.js"></script>

		<script src="/static/metro/js/jquery.raty.min.js"></script>

		<script src="/static/metro/js/jquery.iphone.toggle.js"></script>

		<script src="/static/metro/js/jquery.uploadify-3.1.min.js"></script>

		<script src="/static/metro/js/jquery.gritter.min.js"></script>

		<script src="/static/metro/js/jquery.imagesloaded.js"></script>

		<script src="/static/metro/js/jquery.masonry.min.js"></script>

		<script src="/static/metro/js/jquery.knob.modified.js"></script>

		<script src="/static/metro/js/jquery.sparkline.min.js"></script>

		<script src="/static/metro/js/counter.js"></script>

		<script src="/static/metro/js/retina.js"></script>

		<script src="/static/metro/js/custom.js"></script>
	<!-- end: JavaScript-->

</body>
</html>
