body{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-family: "Raleway", sans-serif;
    background-color: #F9E5FE;   
}
h3{
	font-size: 20px;
	color:#626162;
	text-align: center;
	margin-bottom:40px;
}	
.container{
    width: 40vw;
    padding: 2em;
    background-color: #fff;
    border-radius: 5px;  
}

.form-group{
    margin-bottom: 1em;
    transition: all .3s;  
}

.form-label{
    font-size: 14px;
    color:#aaa;
    display: block;
    opacity: 1;
    transform: translateY(-1.6em);
    transform-origin: 0 2;
    transition: all .3s;
    padding-left: 5px;    
}

.form-control{
    box-shadow: none;
    background-color: aliceblue;
    border-color: #ccc;
    width:100%;
    transition: all .5s;
    padding: 5px;
	border: 1px solid #E3E2E3;
	border-radius:4px;   
}

.form-control::placeholder{
    color: transparent;   
}

.form-control:focus{
    box-shadow: none;
    outline: none;
    border-color: antiquewhite;  
}

.form-control:focus + .form-label,
.form-control:not(:placeholder-shown) + .form-label
{
    transform: translateY(-3.2em);
    padding-left: 0px;
}

.form-group:focus-within{
    transform: scale(1.01,1.01);
}