* {
  font-family: "Poppins";
  margin: 0;
  padding: 0;
}

body {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow-y: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--lightgreen) !important;
	height: 100vh;
	background-image: url(../images/bk.png), url(../images/new.svg);
	background-repeat: repeat, no-repeat;
	background-position: center left;
}
.btn-primary.btn-next,
.btn-primary.btn-back {
	background-color: var(--c6);
	border-color: var(--c6);
}
.btn-primary.btn-next:hover,
.btn-back.btn-primary:hover {
	background-color: var(--c5);
}
.user h2 {
	font-size: 1.2rem !important;
}
span[role="alert"] {
	color: #b71616;
	font-size: 0.8rem;
	display: block;
	text-align: right;
}
span[role="alert"] + br {
	line-height: 0;
	display: none;
}
.screen-1 {
	background: var(--screen);
	padding: 0.8em;
	display: flex;
	flex-direction: column;
	border-radius: 9px;
	box-shadow: 0 0 1.5em #6377e3d1;
	gap: 0.5rem;
	width: 96%;
	max-width: 517px;
}
.btn-primary {
	--bs-btn-color: #fff;
	--bs-btn-bg: #0d6efd;
	--bs-btn-border-color: var(--color2);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg:  var(--color2);
	--bs-btn-hover-border-color:  var(--color2);
	--bs-btn-focus-shadow-rgb: 49,132,253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg:  var(--color2);
	--bs-btn-active-border-color:  var(--color2);
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #0d6efd;
	--bs-btn-disabled-border-color: #0d6efd;
}
.screen-1 .logo {
  margin-top: -3em;
}
.screen-1 .email {
  background: white;
  box-shadow: 0 0 2em #e6e9f9;
  padding: 1em;
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  border-radius: 20px;
  color: #4d4d4d;
  margin-top: -3em;
}
.screen-1 .email input {
  outline: none;
  border: none;
}
.screen-1 .email input::-moz-placeholder {
  color: black;
  font-size: 0.9em;
}
.screen-1 .email input:-ms-input-placeholder {
  color: black;
  font-size: 0.9em;
}
.screen-1 .email input::placeholder {
  color: black;
  font-size: 0.9em;
}
.screen-1 .email ion-icon {
  color: #4d4d4d;
  margin-bottom: -0.2em;
}
.screen-1 .password {
  background: white;
  box-shadow: 0 0 2em #e6e9f9;
  padding: 1em;
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  border-radius: 20px;
  color: #4d4d4d;
}
.screen-1 .password input {
  outline: none;
  border: none;
}
.screen-1 .password input::-moz-placeholder {
  color: black;
  font-size: 0.9em;
}
.screen-1 .password input:-ms-input-placeholder {
  color: black;
  font-size: 0.9em;
}
.screen-1 .password input::placeholder {
  color: black;
  font-size: 0.9em;
}
.screen-1 hr {
  margin: 0px;
}
.screen-1 .password ion-icon {
  color: #4d4d4d;
  margin-bottom: -0.2em;
}
.screen-1 .password .show-hide {
  margin-right: -5em;
}
.screen-1 .login {
  padding: 1em;
  background: #3e4684;
  color: white;
  border: none;
  border-radius: 30px;
  font-weight: 600;
}
.screen-1 .footer {
	display: flex;
  font-size: 0.8em;
	color: #5e5e5e;
	justify-content: space-between;
	/* padding-bottom: 10em; */
}
.screen-1 .footer span {
  cursor: pointer;
}

button {
  cursor: pointer;
}

.site-logo img {
	width: 182px;
	filter: none;
	mix-blend-mode: hard-light;
}

.site-logo {
	margin: auto;
	margin-bottom: 10px;
}

 /* Extra small devices (phones, 600px and down) */
 @media only screen and (max-width: 600px) {

 }

 /* Small devices (portrait tablets and large phones, 600px and up) */
 @media only screen and (min-width: 600px) {
 }
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {

 }
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {
  .screen-1 {
    padding: 2em;
    width: 74%;
  }
 }
 
 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1200px) {

 }