/*=========================================================================================
   general
===========================================================================================*/
body { background: #ffffff none repeat scroll 0 0; }

/*=========================================================================================
   Login
===========================================================================================*/
#login { width: 100%; position: absolute; top: 50%; transform: translateY(-50%); }
#login > div > div > h1 { margin-bottom: 1.875rem; text-transform: uppercase; letter-spacing: 0.325rem; font-weight: 300; }
#login .email-input { }
#login .password-input { }
#login input { height: 4.0625rem; font-size: 1.25rem; }
#login .email-input { margin-bottom: -0.125rem; }
#login button { height: 4.0625rem; width: 100%; }
#login #forgotten-text { text-align: center; }

/*=========================================================================================
   Register user
===========================================================================================*/
#register-user { width: 100%; position: absolute; top: 50%; transform: translateY(-50%); }
#register-user .text-input,
#register-user .email-input,
#register-user .password-input { height: 4.0625rem; font-size: 1.25rem; }
#register-user button { height: 4.0625rem; border-radius: 0.1875rem; }

.pw-hints { margin: -1.125rem 0 1.125rem 0; background-color: #fcfcfe; border-bottom: 0.0625rem #dfdfe2 solid; border-left: 0.0625rem #dfdfe2 solid; border-right: 0.0625rem #dfdfe2 solid; }
.pw-hints .hint { width: 33.3333%; float: left; padding: 0.75rem; }
.pw-hints .hint:not(:first-child) { border-left: 0.0625rem #dfdfe2 solid; }
.pw-hints .hint > .title { display: block; font-size: 0.625rem; line-height: 1.3125rem; text-transform: uppercase; color: #696c7a; font-weight: 700; }
.pw-hints .hint > .title span { margin-left: 0.375rem; color: #1fdb37; }
.pw-hints .hint > p { font-size: 0.8125rem; line-height: 1.0625rem; color: #696c7a; margin: 0; }
.pw-hints .hint.not-fulfilled > .title { color: #c7c9d2; }
.pw-hints .hint.not-fulfilled > .title span { display: none; }
.pw-hints .hint.not-fulfilled > p { color: #c7c9d2; }

/*========================================================================================
   Error pages
===========================================================================================*/
#accessdenied { width: 100%; position: absolute; top: 50%; transform: translateY(-50%); }

/*=========================================================================================
   Forgotten password
===========================================================================================*/
.forgotten-pw { width: 100%; position: absolute; top: 50%; transform: translateY(-50%); }
.forgotten-pw .info { margin-top: 1.5625rem; padding: 0.9375rem 0.9375rem 1.625rem; text-align: left; font-size: 0.875rem; line-height: 1.3125rem; font-weight: 700; color: #ffffff; background-color: #363940; border-radius: 0.3125rem; }
.forgotten-pw .info > i { float: left; margin-right: 0.6875rem; }
.forgotten-pw .info > span {  }
.forgotten-pw h1 { padding: 1.25rem 0 0.625rem; }
.forgotten-pw .email-input,
.forgotten-pw .password-input { height: 4.0625rem; font-size: 1.25rem; }
.forgotten-pw button { height: 4.0625rem; width: 100%; text-transform: none; letter-spacing: 0.0625rem; }
/*=========================================================================================
   Home/Index
===========================================================================================*/
#welcome { width: 100%; position: absolute; top: 50%; transform: translateY(-50%); }
#welcome > div > div > h1 { margin: 0.3125rem 0 1.875rem; text-transform: uppercase; letter-spacing: 0.325rem; font-weight: 300; }
#welcome a.button { border-radius: 0.1875rem; text-transform: uppercase; }