/* Stylesheet for the responsive version of www.juliana-munstergeleen.nl */
/* Fanfareblauw = #000066, #0000B3, #3D3D66, #6B6BB3, #999999, #666666 */

div.login-div {
  display: block;
  margin: auto auto;
  padding: 4px;
  text-align: center;
  vertical-align: top;
  width: 80%;
}

/*
div.login-close {
  float: right;
}
*/

div.login-result {
  text-align: left;
  width: 100%;
}

fieldset.login {
  text-align: left;
  width: 100%;
}

div.login-error {
  color: #ff0000;
  width: 100%;
  text-align: center;
}

@media only screen and (min-width: 640px) {
  /* For tablet and desktop: */
  div.login-error {
    text-align: left;
  }
}

div.login-text-line {
  padding-left: 2px;
  padding-top: 2px;
  padding-bottom: 2px;
  clear: both;
}

div.login-input-line {
  padding-left: 2px;
  padding-top: 2px;
  padding-bottom: 2px;
  clear: both;
}

div.login-text {
}

div.login-label {
  width: 100%;
  padding-right: 0px;
  text-align: center;
}

@media only screen and (min-width: 640px) {
  /* For tablet and desktop: */
  div.login-label {
    width: 40%;
    float: left;
    padding-right: 2px;
    text-align: right;
  }
}

div.login-input {
  width: 100%;
  padding-left: 0px;
  text-align: center;
}

@media only screen and (min-width: 640px) {
  /* For tablet and desktop: */
  div.login-input {
    width: 60%;
    float: left;
    padding-left: 2px;
    text-align: left;
  }
}

/* For mobile phones: */
div.login-button {
  
}

@media only screen and (min-width: 640px) {
  /* For tablet and desktop: */
  div.login-button {
    margin-top: 8px;  
    margin-bottom: 8px;  
    text-align: center;
  }
}

/* For mobile phones: */
div.login-welcome {
  display: inline-block;
}

@media only screen and (min-width: 768px) {
  /* For desktop: */
  div.login-welcome {
    display: block;
    text-align: center;
  }
}

/* For mobile phones: */
div.login-name {
  display: inline-block;
  font-size: larger;
  font-weight: bold;
}

@media only screen and (min-width: 768px) {
  /* For desktop: */
  div.login-name {
    display: block;
    text-align: center;
    margin-bottom: 12px;
  }
}