#loginform_logo {
  max-width:              30em;
  max-height:             20vh;
}

div.loginform {
  margin:                 auto;
  margin-top:             10%;
  border:                 1px solid #4096b8;
  padding:                1em;
  width:                  30em;
  background:             transparent url(../image/login_fd) no-repeat scroll 98% 98%;
}

dl.loginform {
  margin:                 0;
  padding:                0;
}

.loginform dt {
  position:               relative;
  left:                   0;
  top:                    1.3em;
  width:                  8em;
  font-weight:            bold;
  font-size:              0.9em;
}

.loginform dd {
  margin:                 0 0 0 9em;
  padding:                0 0 0em 0em;
}

.loginform-level{
  display:                none;
}

.loginform-id {
  visibility:             hidden;
}

.loginform input, .loginform select {
  border:                 1px inset #ccc;
  width:                  13em;
}

.loginform input[type='submit'] {
  border:                 1px outset #ccc;
  width:                  11em;
  margin:                 1em;
}

#loading_zone {
  float:                  right;
  margin-left:            1em;
}

a.LSsession_recoverPassword {
  float:                  right;
  font-size:              0.8em;
  text-decoration:        none;
  color:                  #4096b8;
  font-weight:            bold;
}

.LSsession_recoverPassword_hidden {
  visibility:             hidden;
}

@media (max-width: 30em) {
  body {
    margin: 0;
  }

  #loginform_logo {
    margin: 1em;
    max-width: calc(90vw - 2em);
  }

  div.loginform {
    width: 98vw;
    max-width: none;
    padding: 1vw;
    box-sizing: border-box;
    margin: 1vw;
    text-align: center;
  }

  .loginform dt {
    position: initial;
    width: 100%;
  }

  .loginform dd {
    margin-left: 0;
    margin-bottom: 0.5em;
    width: 100%;
  }

  a.LSsession_recoverPassword {
    float: none;
    display: block;
  }
}
