login page green one

<!DOCTYPE html>
<html>
<head>
    <title>LOGIN PAGE GREEN ONE | 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="keyword" content="LOGIN PAGE GREEN ONE">
    <meta name="author" content="Mezgani said">
    <meta name="copyright" content="NGLESSON">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
	<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>

    <div class="bk-login3">
        <div class="container-fluid">
            <div class="row">
                <div class="col-xl-3 col-lg-4 col-md-4 col-sm-4 col-xs-4 col-4 img-logo-login logo-left text-left pt-2">
                    <img src="https://mindbodymoms.com/wp-content/uploads/2018/06/Your-Logo-here.png" class="img-fluid" 
                    alt="" title="" width="200px" height="auto">
                </div>
            </div>
        </div>
        <div class="container h-100">
            <div class="row h-100 justify-content-center align-items-center mx-auto mt-5">
                <div class="col-xl-6 col-lg-6 col-md-8 col-sm-12 col-xs-12 col-12 mt-5">  
                    <div class="card-login3">
                        <h3 class="text-center">S'authentifier</h3>
                        <form action="" method="" class="p-3 mt-3 mb-2">
                            <div class="form-group">
                                <input 
                                type="email" 
                                class="form-control inputlogin" 
                                placeholder="Entrez votre login" 
                                id="inputlogin" 
                                name="inputlogin"
                                maxlength="100" 
                                minlength="4"
                                value=""
                                pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$"
                                title="Votre format email est invalide" 
                                email required
                                >
                            </div>
                            <div class="form-group mt-5">
                                <input 
                                type="password" 
                                class="form-control inputpass" 
                                placeholder="Entrez votre mot de passe" 
                                id="inputpass" 
                                name="inputpass"
                                maxlength="20" 
                                minlength="6"
                                pattern=".{6,20}"
                                value=""
                                required
                                >
                            </div>
                            <div class="form-group text-center mt-5">
                                <button type="submit" class="btn btn-green btn-lg">
                                    <i class="fa fa-sign-in"></i> Se connecter
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <svg 
            xmlns="http://www.w3.org/2000/svg" 
            class="curve-green" 
            viewBox="0 0 1440 68" enable-background="new 0 0 1440 68">
            <path d="m1622.3 1937.7c0 0-410.7 169.1-913.4 75.5-502.7-93.6-977.7 56.3-977.7 56.3v440h1891.1v-571.8" 
                fill="#007732" 
                transform="translate(0-1977)">
            </path>
        </svg>
    </div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap');

* {
    margin:0px;
    padding:0px;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}
.bg-green{
    background-color: #33b35a;
}
.btn-green {
    color: #FFF;
    background-color: #33b35a;
    border-color: #33b35a;
}
.btn-green:hover {
    color: #33b35a;
    background-color: #FFF;
    border-color: #33b35a;
}
.bold {
    font-weight: bold;
}
.space1 {
    letter-spacing: 1px;
}
.body-login3{
    background-color: #FFF;
    font-family: 'Roboto', sans-serif;
    overflow-x: hidden !important;
	width: 100%;
    height: 100%;
}
.card-login3{
    margin-top: 15%;
    background: #FFF;
}
.card-login3 .form-control{
   border: none;
   border-radius: 0px;
   border-bottom: 1px solid #292929;
}
.card-login3 .inputlogin{
    background: url('icons/user.png') no-repeat scroll 7px 9px;
    padding-left:30px;
}
.card-login3 .inputpass{
    background: url('icons/padlock.png') no-repeat scroll 7px 9px;
    padding-left:30px;
}
.curve-green{
    position: fixed;
    bottom: 0px;
    width: 100%;
    left: 0;
    right: 0;
    height: 200px;
    z-index: -1;
}
$(document).ready(function(){
    $('#inputlogin').val('');
    $('#inputpass').val('');
});
Asidebar Bootstrap4 style02

Asidebar Bootstrap4 style02

Asidebar Menu Style01

Asidebar Menu Style01

Background div gradient

Background div gradient

Carousel Bootstrap4

Carousel Bootstrap4

Chercher un mot sur la liste

Chercher un mot sur la liste

Double Scrollbar style in table 01

Double Scrollbar style in table 01

Double Scrollbar with Plugin Jquery in table

Double Scrollbar with Plugin Jquery in table

Google Style Login

Google Style Login

Image hover 04

Image hover 04

Image hover effects style

Image hover effects style

Loading Style snake

Loading Style snake

Pure CSS Percentage Circle

Pure CSS Percentage Circle