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('');
});
toggle switch style02

toggle switch style02

Timeline style01

Timeline style01

Tablet style code texte

Tablet style code texte

Input range slider HTML style04

Input range slider HTML style04

Image hover effects style

Image hover effects style

Image hover 03

Image hover 03

Footer Responsive avec Bootstrap4

Footer Responsive avec Bootstrap4

Créer un effet de défilement vers le bas de la souris animé

Créer un effet de défilement vers le bas de la souris animé

Carousel 8 bloc with B4

Carousel 8 bloc with B4

Card Bootstrap4 02

Card Bootstrap4 02

Card Bootstrap4 01

Card Bootstrap4 01

Asidebar Bootstrap4 style01

Asidebar Bootstrap4 style01