/**************************************************************************************************/
/** Login - General *******************************************************************************/
/**************************************************************************************************/

html { 
  width: 100%;
  height: 100%;
}

body {
  background-image:url('../../images/header/background.png');
  background-position:0px 0px;
  background-repeat:repeat;
  position: relative;
  width: 100%;
  height: 100%;
}


/**************************************************************************************************/
/** Login - Form **********************************************************************************/
/**************************************************************************************************/

.login-form-container {
  width: 550px;           /* Set this to your convenience */
  height: 230px;          /* Set this to your convenience */
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -180px; 
  margin-left: -275px;     /* Half of width */
  background-color: #FDFDFD;
  box-shadow: 1px 1px 3px rgba(0,0,0,.5);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 0px 0px 5px 5px;
}

.login-form-title {
  width: 551px;           /* Set this to your convenience */
  height: 43px;          /* Set this to your convenience */
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -223px; 
  margin-left: -275px;     /* Half of width */
  line-height: 43px;
  background: #085394;
  text-shadow: 1px 1px #12416a;
  color: #fff;
  padding-left: 10px;
  border-radius: 5px 5px 0px 0px;
  box-sizing: border-box;
  font: 300 13px/45px 'Open Sans';
  box-shadow: 1px 1px 3px rgba(0,0,0,.5);
} 

.login-form-title.error {
  background-color: #AC0F0F;
  color: #FFFFFF;
}

.login-form-title.success {
  background-color: #028F02;
  color: #FFFFFF;
}

.login-form-container .logo {
  float: left;
}

.login-form {
  float: left;
  margin-left: 25px;
}

.login-form label {
  margin-bottom: 5px;
  width: 150px;
  font: 600 14px/15px 'Open Sans';
  display: inline-block;
}

.login-form input {
  padding: 5px;
  margin-bottom: 10px;
  font: 300 18px 'Open Sans';
}

.login-form button, .password-reset-form button {
  float: right;
  background: #095fa3 !important;
  border: 1px solid #00396b;
  padding: 0 20px;
  border-radius: 3px;
  font: 300 13px/36px 'Open Sans', sans-serif;
  color: #fff !important;
  text-align: center;
  height: 36px;
  display: block;
  cursor: pointer;
  -webkit-box-shadow:inset 1px 1px 0px 0px rgba(87, 150, 212, 1);
  -moz-box-shadow:inset 1px 1px 0px 0px rgba(87, 150, 212, 1);
  box-shadow:  inset 1px 1px 0px 0px rgba(87, 150, 212, 1);
  outline: none;
  -webkit-text-fill-color: #fff !important;
}

.login-form .reset-password {
  font: 300 13px 'Open Sans';
  display: block;
  float: left;
}

.social-media {
  float: right;
}


.social-media h2 {
  display:none;
}


.social-media ul {
  display:table;
}


.social-media ul li {
  display:block;
}


.social-media ul li a {
  display:block;
  
  width:48px;
  height:48px;
  
  margin:0px 5px 0px 5px;
  
  text-indent:-20000px;
  overflow:hidden;
  
  background-image:url('../../images/general/icon-social-networks.png');
  background-repeat:no-repeat;
}


.social-media ul li a.twitter  { background-position:0px   0px; }
.social-media ul li a.facebook { background-position:-48px 0px; }
.social-media ul li a.feed     { background-position:-96px 0px; }


/**************************************************************************************************/
/** Password Reset ********************************************************************************/
/**************************************************************************************************/
.password-reset-container {
  width: 550px;           /* Set this to your convenience */
  height: auto;          /* Set this to your convenience */
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -180px; 
  margin-left: -275px;     /* Half of width */
  background-color: #FDFDFD;
  box-shadow: 1px 1px 3px rgba(0,0,0,.5);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 0px 0px 5px 5px;
}

.password-reset-form {
  margin: 0px auto;
}

.password-reset-instructions {
  font: 300 13px/16px 'Open Sans', sans-serif;
  margin-bottom: 20px;
}

.password-reset-form label {
  margin: 0px 5px 10px 0px;
  font: 600 14px/15px 'Open Sans';
  display: inline-block;
}

.password-reset-form input {
  padding: 5px;
  margin-right: 10px;
  font: 300 18px 'Open Sans';
  margin-bottom: 10px;
}

.signup-message {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 45px; 
  margin-left: -275px;     /* Half of width */
  padding: 20px;
  font: 600 20px 'Open Sans';
  width: 550px;
  text-align: center;
  box-sizing: border-box;
}