body {
  display: flex;
  flex-direction: column;
  align-items: center;
  /*justify-content: center;*/
  padding: 30px;
  font-family: Verdana;
  font-size: 12pt;
}

div.logo {
  padding: 20px;
}

label {
  display: block;
}

label > span {
  width: 120px;
  display: inline-block;
}

form > label > input {
  display: inline-block !important;
  width: auto !important;
}

input[type='text'],
input[type='password'] {
  color: black;
}

input[type='submit'] {
  width: 100%;
  margin-top: 10px;
}

/*
:host
{
    display: block;
    padding: 50px 0;
    text-align: center;
    overflow-y: auto;
    margin: -10px;
}

img
{
    margin-bottom: 20px;
}
*/
ul.users {
  list-style: none;
  width: 800px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  flex-wrap: wrap;
  margin: 0 auto;
  margin-bottom: 30px;
}

ul.users > li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 200px;
  text-align: center;
  padding: 10px;
  margin: 10px 20px;
  background-color: #2b435a;
  border-radius: 10px;
  cursor: pointer;
  color: #eee;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
  min-height: 120px;
}
ul.users > li:hover {
  color: white;
  background-color: #32577b;
}

ul.users > li > i.fas {
  display: block;
  margin-bottom: 5px;
  font-size: 32pt;
}

span.username {
  font-size: 13pt;
}

form.login {
  position: relative;
}

div.login-popup-container {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  justify-content: center;
  align-items: center;
}

div.login-popup {
  position: relative;
  width: 250px;
  height: 150px;
  background-color: rgb(177, 183, 187);
  color: black;
  border-radius: 10px;
  box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.25);
  padding: 15px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

div.login-popup > i.fa {
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
  margin: 10px;
}

p.login_message {
  border: 1px solid #2b435a;
  background-color: #4b6f92;
  padding: 12px;
  border-radius: 4px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25);
}
p.login_message.warning {
  border: 1px solid #5d4405;
  background-color: #c78c3b;
}
p.login_message.error {
  border: 1px solid #5a040b;
  background-color: #bb6265;
}