<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Basic Page Needs
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <meta charset="utf-8" />
    <title><%= it.siteTitel %></title>
    <meta name="description" content="<%= it.desc %>" />
    <meta name="author" content="<%= it.author %>" />

    <!-- Mobile Specific Metas
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <!-- CSS
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->

    <link
      rel="stylesheet"
      type="text/css"
      href="vendor/bootstrap/css/bootstrap.min.css"
    />
    <link rel="stylesheet" type="text/css" href="vendor/animate/animate.css" />
    <link
      rel="stylesheet"
      type="text/css"
      href="vendor/css-hamburgers/hamburgers.min.css"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="vendor/animsition/css/animsition.min.css"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="vendor/select2/select2.min.css"
    />
    <link rel="stylesheet" type="text/css" href="css/util.css" />
    <link rel="stylesheet" type="text/css" href="css/main.css" />

    <!-- Favicon
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
    <link rel="icon" type="image/png" href="images/favicon-16.png" />

    <script
      src="https://kit.fontawesome.com/<%= it.fontawesomeKey %>.js"
      crossorigin="anonymous"
    ></script>
    <script src="vendor/jquery/jquery-3.2.1.min.js"></script>
  </head>
  <body>
    <div class="limiter">
      <div class="container-login100">
        <div class="wrap-login100">
          <% if(it.error == true) { %>
          <div class="alert" id="alert">
            <span class="closebtn" id="closeBtn">&times;</span>
            <%= it.errorMessage %>
          </div>
          <script>
            $("#closeBtn").click(function () {
              $("#alert").fadeOut("slow", function () {
                // Animation complete.
              });
            });
          </script>
          <% } %>
		  
          <div>
            <a href="/"><i class="fas fa-arrow-left"></i> Back</a>
          </div>
          <form class="login100-form validate-form" method="post">
            <span class="login100-form-title p-b-26"> Welcome </span>
            <span class="login100-form-title p-b-48">
              <i class="zmdi zmdi-font"></i>
            </span>

            <div class="wrap-input100">
              <input class="input100" type="text" name="username" />
              <span class="focus-input100" data-placeholder="Username"></span>
            </div>

            <div
              class="wrap-input100 validate-input"
              data-validate="Valid email is: john@test.com"
            >
              <input class="input100" type="text" name="email" />
              <span class="focus-input100" data-placeholder="Email"></span>
            </div>

            <div
              class="wrap-input100 validate-input"
              data-validate="Enter password"
            >
              <span class="btn-show-pass">
                <i class="zmdi zmdi-eye"></i>
              </span>
              <input class="input100" type="password" name="pass" />
              <span class="focus-input100" data-placeholder="Password"></span>
            </div>

            <div
              class="wrap-input100 validate-input"
              data-validate="Repeat password"
            >
              <span class="btn-show-pass">
                <i class="zmdi zmdi-eye"></i>
              </span>
              <input class="input100" type="password" name="pass2" />
              <span
                class="focus-input100"
                data-placeholder="Repeat Password"
              ></span>
            </div>

            <div class="h-captcha" data-sitekey="<%= it.sitekey %>"></div>
            <script
              src="https://hcaptcha.com/1/api.js"
              async
              defer
              unsafe-eval
            ></script>

            <div class="container-login100-form-btn">
              <div class="wrap-login100-form-btn">
                <div class="login100-form-bgbtn"></div>
                <button class="login100-form-btn">Create a new account</button>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>

    <div id="dropDownSelect1"></div>

    <script src="vendor/animsition/js/animsition.min.js"></script>
    <script src="vendor/bootstrap/js/popper.js"></script>
    <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
    <script src="vendor/select2/select2.min.js"></script>
    <script src="vendor/daterangepicker/moment.min.js"></script>
    <script src="js/main.js"></script>

    <!-- End Document
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  </body>
</html>
