/* CSS Document */


/**************************** 
External Stylesheets
*****************************/

@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap');
@import url('https://cdn.lineicons.com/1.0.1/LineIcons.min.css');


/**************************** 
Normalize
*****************************/
html {
	height:100%;
}

body.loginbody {
	margin:0;
	padding:0;
	font-family: 'Roboto', Sans Serif;
	font-size:16px;
	background:url(../images/page-bg.jpg) no-repeat center center !important;
	background-size:cover!important;
	height:100%;
}
body.loginbody a {
	text-decoration:none;
}

body.loginbody input, body.loginbody button, body.loginbody select, body.loginbody textarea {
	font-family: 'Roboto', Sans Serif;
}


/**************************** 
Login Page
*****************************/

.logindiv {
position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width:400px;
}
.loginlogo {
	text-align:center;
	margin-bottom:40px;
}
.loginform {
	background:#fff;
	padding:20px;
	border-radius:8px;
}

.loginlanguage {
	width:100%;
	background:#efefef;
	border-radius:6px;
	padding-left:55px;
	font-size:15px;
	border:none;
	height:50px;
	line-height:50px;
	margin-bottom:10px;
	box-sizing:border-box;
}

.loginusername, .loginpassword {
	width:100%;
	background:#efefef;
	border-radius:6px;
	padding-left:55px;
	font-size:15px;
	border:none;
	height:50px;
	line-height:50px;
	margin-bottom:10px;
	box-sizing:border-box;
}

.loginusername::placeholder, .loginpassword::placeholder {
	color:#000;
}


.loginrememberforget {
	overflow:hidden;
	margin-bottom:20px;
}
.loginremember {
	width:45%;
	float:left;
	position: relative;
padding-left: 25px;
font-size:14px;
color:#202020;
line-height:22px;
}
.loginremember input[type=checkbox] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.loginremember .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background:#efefef;
  /*border:solid 1px;*/
  border-radius:3px;
}

/* On mouse-over, add a grey background color */
.loginremember:hover input[type=checkbox] ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a grey background */
.loginremember input[type=checkbox]:checked ~ .checkmark {
  background-color: #efefef;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.loginremember input[type=checkbox]:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.loginremember .checkmark:after {
  left: 7px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid #1a3665;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.loginforget {
	width:45%;
	float:right;
	text-align:right;
	font-size:14px;
	line-height:22px;
}
.loginforget a {
	color:#202020;
	text-decoration:none;
}
.loginsubmit {
	width:100%;
	height:50px;
	background:#1a3665;
	color:#fff;
	border-radius:6px;
	border:none;
	font-size:16px;
		cursor:pointer;
}
.input-icon {
	position:absolute;
	font-size:22px;
	margin-top:15px;
	margin-left:10px;
	padding-right:10px;
	border-right:solid 1px #777777;
}