/* login */
.loginContainer{
  position:absolute;
  background:var(--white);
  width:30rem;
  height:27rem;
  top:50%;
  left:50%;
  margin-top:-15rem;
  margin-left:-15rem;
  box-shadow: 2px 2px 7px -1px rgba(0,0,0,0.2);
  border-radius:0.5rem;
}
.loginHeadline{
  background: var(--india);
  background: var(--beryllight);
  height:5rem;
  margin-bottom:2rem;    
  border-radius:0.5rem 0.5rem 0rem 0rem;
}
.headlineLogoContainer{
  margin-top: 0.75rem;
  font-size:2rem;
  text-align:left;
  margin-left:1rem;
  color: var(--white);      
}
.loginLogo{    
  height:3.5rem;    
}
.systemSlogan{   
  margin-top: 0.75rem;     
  font-size:1.5rem;
  text-align:right;
  color: var(--leafgreen);   
  font-weight:700;  
  margin-right:1rem; 
}
.systemType{
  text-align:right;
  color: var(--tungsten);   
  font-size:1.1rem;
  margin-right:1rem;  
  font-family: 'Capitolina', serif;
}
.loginInputContainer{    
  color: var(--black);    
  font-size:1rem;
  text-align:left;
  margin:0rem auto;
  width:20rem;
}
.loginInputLabel{
  font-size:1rem;
  color: var(--tungsten);    
  color:var(--leafgreen);
}
.loginInput{
  outline: 0;
  border:0;
  border-bottom:1px solid var(--india);
  width:100%;
}
.loginSubmitButton{
  margin: 0rem auto;
  display:block;
  margin-top:2rem;
  background:var(--white);
  width:10rem;
  padding:1rem;
  text-align:center;
  border:1px solid var(--beryllight);
  border-radius:0.5rem;
  font-size:1.15rem;
  font-weight:700;
  color:var(--leafgreen);
  transition:0.3s;
}
.loginSubmitButton:active{    
  border:1px solid var(--leafgreen);
  background:var(--leafgreen);
  color:var(--white);
  cursor:pointer;
}
.loginSubmitButton:hover{    
  border:1px solid var(--leafgreen);
  background:var(--leafgreen);
  color:var(--white);
  cursor:pointer;
}
.loginErrorDiv{
  color:var(--red);
  text-align:center;
  font-weight:bold;
}