/*
//==========================================================================================================================
// Login page styling.
//
// SKIN: "Sleek black"
//
// Last modified: 03.07.17
// Author: Romet Saarna (aka TheKuru) http://wizil.ee
//==========================================================================================================================
*/


/* Setup login page */
html, body, p, input, button, h1, h2, h3, h4, h5 {
 font-family: "Open Sans";
}
body {
 margin: 0;
 width: auto;
 opacity: 1;
 filter: alpha(opacity=100);
 font-size: 2em;
 padding: 0;
 background-color: #000000;
}

/* Information tip at the top side of login page */
#informationtip {
 text-align: center;
 font-family: Tahoma, Geneva, Arial, sans-serif;
 color: #F5F5DC;
 font-size: 11px;
 text-decoration: none;
 font-weight: normal;
}
#informationtip a {
 color: #F5F5DC;
 background-color: transparent;
 text-decoration: none;
 -webkit-transition-duration: 0.4s; /* Safari */
 transition-duration: 0.4s;
}
#informationtip a:hover {
 color: red;
 background-color: transparent;
 text-decoration: underline;
}

/* company name */
.login-companyname {
 display: block;
 position: relative;
 width: 100%;
 left: 0;
 color: white;
 opacity: 0.6;
 text-align: center;
 font-size: 24px;
 font-weight: normal;
 font-family: "Open Sans";
}

/* holds everything related to login form */
.login-form-wrapper {
 position: relative;
 width: 100%;
}

input ::-webkit-input-placeholder {
 color: rgba(255, 255, 255, 0.7);
}
input ::-moz-placeholder {
 color: rgba(255, 255, 255, 0.7);
}
input :-ms-input-placeholder {
 color: rgba(255, 255, 255, 0.7);
}
input:focus {
 outline: 0 transparent solid;
}
input:focus ::-webkit-input-placeholder {
 color: rgba(0, 0, 0, 0.7);
}
input:focus ::-moz-placeholder {
 color: rgba(0, 0, 0, 0.7);
}
input:focus :-ms-input-placeholder {
 color: rgba(0, 0, 0, 0.7);
}

.login-form {
 position: absolute;
 width: 350px;
 height: 250px;
 top: 50%;
 left: 50%;
 margin: 155px 0 0 -175px;
}

.login-text {
 max-width: 50%;
 margin: 0 auto;
 color: white;
 font-size: 1.5rem;
 padding: .5rem;
 text-align: center;
}
.login-text .fa-stack-1x {
 color: black;
}

.login-credentials, .login-password {
 background: transparent;
 border: 0 solid;
 border-bottom: 1px solid rgba(255, 255, 255, 0.5);
 color: white;
 display: block;
 margin: 1rem;
 padding: .5rem;
 -webkit-transition: 250ms background ease-in;
 transition: 250ms background ease-in;
 width: calc(100% - 3rem);
 font-family: monospace;
}
.login-credentials:focus, .login-password:focus {
 background: white;
 color: black;
 -webkit-transition: 250ms background ease-in;
 transition: 250ms background ease-in;
}

.login-helplinks {
 color: white;
 cursor: pointer;
 display: block;
 font-size: 12px;
 left: 0;
 opacity: 0.6;
 padding: .5rem;
 position: absolute;
 text-align: center;
 width: 100%;
 text-decoration: none;
}
.login-helplinks:hover {
 opacity: 1;
 text-decoration: underline;
}

.login-submit-button {
 border: 1px solid white;
 background: transparent;
 color: white;
 display: block;
 margin: 1rem auto;
 min-width: 1px;
 padding: .25rem;
 font-size: 16px;
 -webkit-transition: 250ms background ease-in;
 transition: 250ms background ease-in;
 font-family: monospace;
 text-transform: uppercase;
}
.login-submit:hover, .login-submit:focus {
 background: white;
 color: black;
 -webkit-transition: 250ms background ease-in;
 transition: 250ms background ease-in;
}

@-webkit-keyframes hue-rotate {
  from {
    -webkit-filter: grayscale(30%) hue-rotate(0deg);
  }
  to {
    -webkit-filter: grayscale(30%) hue-rotate(360deg);
  }
}

@keyframes hue-rotate {
  from {
    -webkit-filter: grayscale(30%) hue-rotate(0deg);
  }
  to {
    -webkit-filter: grayscale(30%) hue-rotate(360deg);
  }
}

/* dropdown list for displaying admin mail addresses */
.login-dropdown-admin-email-list {
 list-style-type: none;
 margin: 0;
 padding-left: 5px;
 padding-top: 2px;
 padding-bottom: 2px;
 cursor: pointer;
 text-align: center;
}

.login-dropdown-admin-email-list ul {
 list-style-type: none;
 margin: 0;
 padding-left: 5px;
 padding-top: 2px;
 padding-bottom: 2px;
 cursor: help;
 text-align: left;
}

.login-dropdown-admin-email-list > li {
 display: inline-block;
 position: relative;
 cursor: pointer;
 color: white;
 font-size: 11px;
 opacity: 0.6;
}
.login-dropdown-admin-email-list > li:hover {
 color: silver !important;
 opacity: 1;
}

.login-dropdown-admin-email-list li ul {
 position: absolute;
 width: 300px;
 max-height: 0;
 overflow: hidden;
 background-color: transparent;
 border: hidden;
 -moz-transition: 0.4s;
 -ms-transition: 0.4s;
 -o-transition: 0.4s;
 -webkit-transition: 0.4s;
 transition-duration: 0.4s;
}

.login-dropdown-admin-email-list li:hover ul {
 overflow: auto;
 max-height: 100px;
 border: 1px solid grey;
 background-color: black;
}

.login-dropdown-admin-email-list a {
 font-family: Tahoma, Geneva, Arial, sans-serif;
 color: #F5F5DC;
 font-size: 11px;
 text-decoration: none;
 cursor: help;
 -webkit-transition-duration: 0.4s;
 transition-duration: 0.4s;
}
.login-dropdown-admin-email-list a:hover {
 color: silver !important;
}