* {
    margin: 0;
    padding: 0;
    font-family: "poppins", sans-serif;
}

section {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            width: 100%;
            background: url('images/wallpaper1.png')no-repeat;
            background-position: center;
            background-size: cover;
}

.form-box {
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
            height: 450px;
            width: 400px;
            background: transparent;
            border: 2px solid rgba(255, 255, 255, 0.5);
            border-radius: 20px;
            backdrop-filter: blur(15px);
}

h2 {
        font-size: 2em;
        color: #FFF;
        text-align: center;
}

.input {
            position: relative;
            margin: 30px 0;
            width: 310px;
            border-bottom: 2px solid #FFF;
}

.input label {
                position: absolute;
                top: 50%;
                left: 5px;
                transform: translateY(-50%);
                color: #FFF;
                font-size: 1em;
                pointer-events: none;
                transition: -5s;
}

input:focus ~ label,
input:valid ~ label {top: -5px;}

.input input {
                width: 100%;
                height: 50px;
                background: transparent;
                border: none;
                outline: none;
                font-size: 1em;
                padding: 0 35px 0 5px;
                color: #FFF;
}

.input ion-icon {
                    position: absolute;
                    right: 8px;
                    color: #FFF;
                    font-size: 1.2em;
                    top: 20px;
}

.forget {
            margin: -15px 0 15px;
            font-size: .9em;
            color: #FFF;
            display: flex;
}

.forget label input {
                    margin-right: 3px;

}

.forget label a {
                    color: #FFF;
                    text-decoration: none;
                    margin-left: 80px; 
}

.forget label a:hover {
                        text-decoration: underline;
}

button {
            width: 100%;
            height: 40px;
            border-radius: 40px;
            background: #FFF;
            border: none;
            outline: none;
            cursor: pointer;
            font-size: 1em;
            font-weight: 600;
}

.register {
            font-size: .9em;
            color: #FFF;
            margin: 25px 0 10px;
}

.register p a {
                text-decoration: none;
                color: #FFF;
                font-weight: 600;
}

.register p a:hover {
                        text-decoration: underline;
}
