Form Création de compte

<!DOCTYPE html>
  <title>Formulaire - Créer un compte | par NGLESSON</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Mezgani said">
  <meta name="copyright" content="NGLESSON">
  <link rel="stylesheet" href="">
  <link rel="stylesheet" href="">
  <link href="style.css" rel="stylesheet" type="text/css">
  <div class="container">
    <div class="row mt-5 mb-5">
    <div class="col-lg-6">
      <div class="form-login text-center">
          <img src="location-pin.svg" height="120px" width="120px" class="text-center img-responsive">
        <h1 class="text-bleu mt-3">Créer un compte et accédez à nos services. <span class="text-success">100% Gratuit</span></h1>
        <ul class="list-unstyled text-left" style="line-height: 2">
          <li><span class="fa fa-check text-success"></span> Ajouter votre établissement</li>
          <li><span class="fa fa-check text-success"></span> Référencer vos produits</li>
          <li><span class="fa fa-check text-success"></span> Publier vos moments</li>
          <li><span class="fa fa-check text-success"></span> Gérer votre établissement</li>
      <div class="col-lg-6">
      <div class="form-login">
          <div class="form-login-triangle"></div>
          <h2 class="form-login-header">Créer un compte</h2>
          <form class="form-login-body">
            <p><input type="text" id="inputname" name="inputname" autocomplete="on"  placeholder="Saisissez votre nom complet" required></p>
            <p><input type="email" id="inputemail" name="inputemail" autocomplete="on" placeholder="Saisissez votre email" email required></p>
            <p><input type="password" id="inputpass" name="inputpass" autocomplete="on"  placeholder="Saisissez votre mot de passe" required></p>
            <p><input type="submit" value="Créer un compte"></p>
  <script src=""></script>
  <script src=""></script>
  <script src=""></script>  
@import url(,700);

body {
  background: transparent;
  font-family: 'Open Sans', sans-serif;

.form-login {
  width: 100%;
  margin: 40px auto;
  font-size: 16px;

.form-login .text-bleu{color:#28d;}

/* Reset top and bottom margins from certain elements */
.form-login p {
  margin-top: 0;
  margin-bottom: 0;

/* The triangle form is achieved by a CSS hack */
.form-login-triangle {
  width: 0;
  margin-right: auto;
  margin-left: auto;
  border: 12px solid transparent;
  border-bottom-color: #28d;

.form-login-header {
  background: #28d;
  padding: 20px;
  font-size: 1.4em;
  font-weight: normal;
  text-align: center;
  text-transform: uppercase;
  color: #fff;

.form-login-body {
  background: #ebebeb;
  padding: 12px;

/* Every row inside .form-login-body is defined with p tags */
.form-login p {
  padding: 12px;

.form-login input {
  box-sizing: border-box;
  display: block;
  width: 100%;
  border-width: 1px;
  border-style: solid;
  padding: 16px;
  outline: 0;
  font-family: inherit;
  font-size: 0.95em;

.form-login input[type="email"],
.form-login input[type="text"],
.form-login input[type="password"] {
  background: #fff;
  border-color: #bbb;
  color: #555;

/* Text fields' focus effect */
.form-login input[type="email"]:focus,
.form-login input[type="text"]:focus,
.form-login input[type="password"]:focus {
  border-color: #888;

.form-login input[type="submit"] {
  background: #28d;
  border-color: transparent;
  color: #fff;
  cursor: pointer;

.form-login input[type="submit"]:hover {
  background: #17c;

/* Buttons' focus effect */
.form-login input[type="submit"]:focus {
  border-color: #05a;