{% extends "layouts/base-fullscreen.html" %}

{% block title %} Register {% endblock %}

<!-- Specific CSS goes HERE -->
{% block stylesheets %}{% endblock stylesheets %}

{% block content %}   
      
    <div class="row">
      <div class="col-lg-7">
        <div class="yoo-vertical-middle">
          <div class="yoo-vertical-middle-in">
            <div class="yoo-signup-img yoo-style1">
              <img src="/static/assets/img/signup/01.png" alt="">
            </div>
          </div>
        </div>
      </div><!-- .col -->
      <div class="col-lg-5">
        <div class="yoo-vertical-middle">
          <div class="yoo-vertical-middle-in">
            <form action="#" class="yoo-form yoo-style1">
              <h2 class="yoo-form-title">Create an account today</h2>
              <div class="yoo-form-subtitle">Already have an account? <a href="#" class="yoo-form-btn yoo-style2">Sign in</a></div>
              <div class="yoo-height-b25 yoo-height-lg-b25"></div>
              <ul class="yoo-social-area yoo-style1 yoo-mp0">
                <li><a href="#" class="yoo-form-btn yoo-style1 yoo-colo2"><i class="fab fa-facebook-f"></i><span>Sign up with Facebook</span></a></li>
                <li><a href="#" class="yoo-form-btn yoo-style1 yoo-colo3"><i class="fab fa-google-plus-g"></i><span>Sign up with Gmail</span></a></li>
              </ul>
              <div class="yoo-height-b15 yoo-height-lg-b15"></div>
              <div class="yoo-form-separator">Or</div>
              <div class="yoo-height-b15 yoo-height-lg-b15"></div>
              <div class="row">
                <div class="col-lg-6">
                  <div class="form-group level-up form-group-md">
                    <label for="first-name">First Name</label>
                    <input type="text" class="form-control" id="first-name">
                  </div>
                </div>
                <div class="col-lg-6">
                  <div class="form-group level-up form-group-md">
                    <label for="last-name">Last Name</label>
                    <input type="text" class="form-control" id="last-name">
                  </div>
                </div>
                <div class="col-lg-12">
                  <div class="form-group level-up form-group-md">
                    <label for="email">Email</label>
                    <input type="text" class="form-control" id="email">
                  </div>
                </div>
                <div class="col-lg-12">
                  <div class="form-group level-up form-group-md">
                    <label for="password">Password</label>
                    <input type="password" class="form-control" id="password">
                  </div>
                </div>
                <div class="col-lg-12">
                  <div class="form-group">
                    <div class="yoo-termas">
                      <div class="custom-control custom-checkbox">
                      <input class="custom-control-input" type="checkbox" id="gridCheck">
                      <label class="custom-control-label" for="gridCheck">
                        <span class="custom-control-shadow"></span>I agree to terms and condittions & 
                      </label>
                    </div>
                    <a href="#" class="yoo-form-btn yoo-style2">cookies policy.</a>
                    </div>
                  </div>
                  <a href="#" class="yoo-form-btn yoo-style1 yoo-color1" class="yoo-form-btn yoo-style2 yoo-type1"><span>Sign Up</span></a>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>

{% endblock content %}

<!-- Specific Page JS goes HERE  -->
{% block javascripts %}{% endblock javascripts %}