body {
  font: 14px Lato,Arial,sans-serif;
  margin: 0;
  padding: 0;
  width: 100%;
  color: var(--login-text-primary);
  background-color: var(--login-bg-secondary);
  position: relative;
  overflow: hidden;
  overflow-y: hidden;
  min-height: 600px;
  overflow-y: auto;
}
body, html {
  height: 100%;
}
body {
  line-height: 1;
}
abbr, address, article, aside, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, p, pre, q, samp, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
}
.info-side{
	position:absolute;
	top:200px;
	left:150px;
	width:35%;
	z-index: 1;
	background: var(--login-bg-secondary);
  	overflow: hidden;
  	border-radius: 5px;
 	 box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}
.info-side-inner-wrapper{
	position:relative;
	padding:50px 40px 40px 40px;
}
.info-side-inner-wrapper .top-wave{
	position:absolute;
	right:0;
	top:0;
	background-image: url('images/top-wave.png');
	width: 154px;
    height: 55px;
}
.login-fields{
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	width:60%;
	background: var(--login-bg-secondary);
  overflow: hidden;
  border-radius: 5px;
 	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}
.login-fields-inner-wrapper{
  padding:150px 80px 50px 200px;
}
form{
  margin-top:30px;
}
input[type="text"], input[type="password"] {
  width: 100%;
  padding: 12px 50px 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid var(--login-border-color);
  border-radius: 4px;
  box-sizing: border-box;
  background-color: var(--login-bg-tertiary);
  color: var(--login-text-primary);
}
span.input-field{
  position: relative;
}
span.input-icon{
  position: absolute;
  top: 0px;
  right: 11px;
  color: var(--login-text-muted);
  cursor:pointer;
}
input[type="submit"] {
  width: 100%;
  background-color: var(--primary);
  color: var(--white);
  padding: 14px 20px;
  margin: 20px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-weight: 700;
  font-family: inherit;
  border: 0;
  font-size:16px;
}
.spinner {
  height: 10px;
  width: 10px;
  animation: rotate 0.8s infinite linear;
  border: 8px solid var(--primary);
  border-right-color: transparent;
  border-radius: 50%;
  margin-left:auto;
  margin-right:auto;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}
#animation {
  display: none;
}
.info-side-inner-wrapper ul{
  margin-top:20px;
  list-style:none;
}
.info-side-inner-wrapper ul li{
  margin-bottom:10px;
}
.info-side-inner-wrapper ul li i{
  color: var(--primary);
  margin-right:10px;
}
.information p, .success p, .warning p,.validation p,.error p{
	padding-bottom: 3px;
}
.information {
	color: #00529B;
	background-color: #BDE5F8;
	background-image: url('../images/info.png');
}
.success {
	color: #4F8A10;
	background-color: #88ffd1;
	background-image:url('../images/success.png');
}
.warning {
	color: #9F6000;
	background-color: #FEEFB3;
	background-image: url('../images/warning.png');
}
.error,.success,.warning,.information {
	margin: 10px 0px;
	padding: 5px 5px 5px 50px;
	background-repeat: no-repeat;
	background-position: 10px center;
}
.error {
	color: #D8000C;
	background-color: #FFBABA;
	background-image: url('../images/error.png');
}
.cursor{
	cursor:pointer;
}
#feedback{
	position: fixed;
	bottom: -10px;
	right: 0;
	z-index: 1000000000000000000000000000000016;
}
.error .cursor,.success .cursor{
	margin-left:10px;
}
.dark-theme {
  --login-bg-primary: #1b1b1b;
  --login-bg-secondary: #262626;
  --login-bg-tertiary: #424242;
  --login-bg-overlay: rgba(38, 38, 38, 0.8);
  --login-text-primary: #ffffff;
  --login-text-secondary: #d9dbe4;
  --login-text-muted: #92929e;
  --login-border-color: rgba(255, 255, 255, 0.15);
  --login-hover-bg: #424242;
  --login-scrollbar-bg: rgba(255, 255, 255, 0.4);
  --login-scrollbar-shadow: rgba(0, 0, 0, 0.3);
}
:root {
  color-scheme: light dark;
  --login-bg-primary: #f7f7f9;
  --login-bg-secondary: #ffffff;
  --login-bg-tertiary: #f4f4f5;
  --login-bg-overlay: rgba(255, 255, 255, 0.6);
  --login-text-primary: #3f4547;
  --login-text-secondary: #545454;
  --login-text-muted: #999999;
  --login-border-color: #D9DBE4;
  --login-hover-bg: #e4e6ec;
  --login-scrollbar-bg: rgba(0, 0, 0, 0.5);
  --login-scrollbar-shadow: rgba(255, 255, 255, 0.5);
  --primary: #1686D9;
  --white: #FFFFFF;
}