html,
body {
  height: 100%;
}

body {
  display: flex;
  align-items: center;
  background-image:url(../../images/img/login-bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	font-family: 'Raleway', sans-serif;
}

.form-signin {
  width: 100%;
  max-width: 40%;
  padding: 15px;
  margin: auto;
	background: rgb(244 119 33 / 80%);
	border: 10px solid #fff;
	border-radius: 30px;
	box-shadow: 0 0 30px #404040;
}
.form-signin img.mb-4{ margin-top: 20px;}

.form-floating{ width:45%; float: left;}

.login-button{ width:10%;}

.form-signin .form-floating:focus-within {
  z-index: 2;
}

.form-signin input[type="email"], .form-signin input[type="password"] {
	width: 95%; float: left; margin: 0 10px; border-radius: 100px; padding: 10px !important; height: auto !important; font-size: 12px;
}
.form-signin input[type="checkbox"]{width: 15px;
    height: 15px;
    border-radius: 100px;
    float: left;
    margin-right: 5px;}
h1.fw-normal{ font-size: 15px; font-weight: 900 !important; color: #fff;}

.btn-primary, .btn-primary:hover, .btn-primary:focus{ background: none;
    width: 40px !important;
    height: 100%;
    padding: 0;
    border: none;
	box-shadow: none;
}

.rem-reset{ font-size: 12px; margin: 10px 0; width: 100%; float: left;}
.rem-reset label{ margin:0 30px; color: #fff;}
.rem-reset label a{ color: #ffffff; text-decoration: none;}

.svg-login{width: 100%; filter: invert(100%) sepia(1%) saturate(2%) hue-rotate(23deg) brightness(106%) contrast(101%);}
.svg-login:hover{filter: invert(100%) sepia(1%) saturate(2%) hue-rotate(23deg) brightness(106%) contrast(101%);}

@media screen and (max-width: 768px) {
	.form-floating{ width:100%; margin: 10px 0; float: left;}
	.login-button{ width:100%;}
	.form-signin { max-width: 80%;}
}