/*

 Type: 			Cascading Style Sheet for login page (when user is not logged in to Querio system).
 
 2019-11-07		Charles  T4497. Initial creation.
*/


.bg {
  position: fixed; 
  top: 0; 
  left: 0; 

  /* Preserve aspet ratio */
  min-width: 100%;
  min-height: 100%;
  z-index: -20000;
}

#container_login {
	width:										400px;
	margin-left:								auto;
	margin-right:								auto;
	height:										400px;
	padding-top:								150px;
}

.popover-content {
    color: white;
    font-size: 10px;
    background-color: #f33 ; 
    padding: 5px 5px 3px 5px!important;
    max-width: 330px;
}

.popover.left .arrow:after {
   border-left-color: red; 
}

.popover-content-help {
    color: white;
    font-size: 10px;
    background-color: #f33!important; 
    padding: 5px;
}

#container_login div.form_box {
	background-color:							#f9f9f9;
	padding:									25px 50px;
	
	-webkit-box-shadow: 0px 0px 10px 0px rgba(51,51,51,1);
	-moz-box-shadow: 0px 0px 10px 0px rgba(51,51,51,1);
	box-shadow: 0px 0px 10px 0px rgba(51,51,51,1);
}

#container_login div.welcome {
	color:										#999999;
	font-size:									20px;
	margin-bottom:								25px;
}

#container {

background-color: transparent !important;
}

.circular {
	width: 150px;
	height: 80px;
/* 	border-radius: 100px; */
/* 	-webkit-border-radius: 100px; */
/* 	-moz-border-radius: 100px; */
/* 	box-shadow: 0 0 8px rgba(0, 0, 0, .8); */
/* 	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); */
/* 	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); */
/* 	margin-left: 30px; */
	background-repeat: 		no-repeat;
	background-position: 	center;
	background-image:		url('../images/default/imec_logo_150x50.png');
	background-size: 		90%;
	margin: auto;
	}
	
.circular img{
/* 	margin:0 */
}

#login_form .username_container {
	color:										#999999;
	font-size:									13px;
	line-height:								32px;
	margin-bottom:								20px;
	padding-bottom:                             10px;
}

#login_form .username_container>input {
	width:										300px;
	border:										1px solid #cccccc;
	font-size:									12px;	
	height:										32px;
	padding-left:								5px;
}

#login_form .password_container {
	color:										#999999;
	font-size:									13px;
/* 	line-height:								32px; */
	margin-bottom:								10px;
	padding-bottom:                            10px;
}

#initiate_help {
	font-size:									13px;
	
}

#login_form .password_container>input {
	width:										300px;
	border:										1px solid #cccccc;
	font-size:									12px;
	height:										32px;
	padding-left:								5px;
}

#login_form>input {
	width:										280px;
	border:										1px solid #cccccc;
	padding:									10px;
	font-size:									12px;
}

#login_form .button {
	width:										300px;
	border:										1px solid #cccccc;
	background-image:							none;
	height:										32px;
	line-height:								32px;
	padding-top:								0px;
	background-color:                          #4484EE;
	cursor: pointer;
    font-weight: normal;
    white-space: nowrap;
    font-size: 14px;
    color: white;
}

a, a:visited {
    color: blue !important;
}

.error { 
	border: 1px solid #b94a48!important; 
	background-color: #fee!important; 
}

.popover {
	border-radius: 0px;
	max-width: 300px;
	border: 1px solid #f33;
	padding: 0;
}

.popover.left {
	margin-left: -15px;
}

.blue-popover {
	border-radius: 0px;
	max-width: 330px;
	padding: 5px 5px 0px 5px!important;
	border: 1px solid #288cfb!important;
	background-color: #288cfb!important;
	padding: 0;
}

.blue-arrow {
	border-left-color: #288cfb!important;
}

.blue-arrow:after {
	border-left-color: #288cfb!important;
}


.red-popover {
	border-radius: 0px;
	max-width: 330px;
	padding: 5px 5px 3px 5px!important;
	border: 1px solid #f00!important;
	background-color: #f00!important;
	padding: 0 !important;
}

.red-arrow {
	border-left-color: #f00!important;
}

.red-arrow:after {
	border-left-color: #f00!important;
}


.popover-content {
    color: white;
    font-size: 10px;
    background-color: #f33 ; 
    padding: 5px 5px 3px 5px!important;
    max-width: 330px;
}

.popover.left .arrow:after {
   border-left-color: red; 
}

.popover-content-help {
    color: white;
    font-size: 10px;
    background-color: #f33!important; 
    padding: 5px;
}

.email_input {
	display: 		inline;
	width: 			200px;
	border-radius: 	0px;
}

#popover_pw_with_email_form .button {
	width: 50px;
	margin-bottom: 10px;
}

#popover_pw_with_email{
	font-size: 10px;
}

.error_field {
    color: red;   
}