/* Login
 ================================ */
#loginForm {
  padding: 75px 20px 50px 20px;
  position: relative;
  margin: 0 auto 26px auto;
  background-color: #fff;  
  min-height: 100%;
}

@media only screen and (min-width : 768px) {
  #loginForm {
    border-radius: 4px;
    width: 300px;
  }
}

.s-login-content {
  position: relative;
}


#loginForm .heading1 {
  letter-spacing: 4px;
  font-size: 8pt;
  text-transform: uppercase;
  color: #000;
}

#loginForm input[type="password"], 
#loginForm #userName {
  padding: 8px 20px 8px;
  font-size: 15pt;
  width: 100%;
  color: #000 !important;
  margin: 10px auto;
  text-align: center;
  border: solid 1px #f2f2f2;
}

#loginForm input[type=text].login_input, 
#loginForm input[type=password].login_input {
  color: #333;
  border-radius:50px;
}

#loginForm input[type=text].login_input {
  background: transparent url(img/username.png) 7px 6px no-repeat;
  background-size: 32px;
}

#loginForm input[type=password].login_input {
  background: transparent url(img/password.png) 7px 6px no-repeat;
  background-size: 32px;
}

#loginForm input[type=text]:focus, 
#loginForm input[type=password]:focus {
  outline: 0;
}

#loginForm input[type=text]:focus:-webkit-autofill, 
#loginForm input[type=password]:-webkit-autofill {
  -webkit-box-shadow:0 0 0 500px #fff inset; 
}

.login_input {
  position: relative;
}

.loginButton {
  border-radius:50px;
  color: #ccc;
  background-color: #282828;
  border: none;
  width: 100%;
  -webkit-transition: background-color 500ms ease;
  transition: background-color 500ms ease;
  letter-spacing: 4px;
  text-transform: uppercase;
  font-size: 10px;
}

.homeButton:hover,
.loginButton:hover {
  background-color: #ff0;
  color: #000;
}

.loginButton {
  margin-top: 10px;  
  padding: 15px 0;
}

.homeButton {
  position: absolute;
  padding: 15px 0;
  background: #ccc;
  border: none;
  color: #000;
  letter-spacing: 4px;
  text-transform: uppercase;
  font-size: 10px;
  width: 100%;
  margin: 0 auto;
  bottom:-28px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  left: 0;
}


@media only screen and (min-width : 768px) {
  .s-login {
    margin-top: 75px;
  }
}

#loginButton,
.memberButton,
.s-main-content .col-lg-4 a, 
.s-detail .btn, .xmlResultLink {
  border-radius: 0;
  border: none;
  background-color: #282828;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 2px;
  white-space: nowrap;
  color: #fff;
  padding: 10px 29px;
  -webkit-transition: background-color 500ms ease;
  transition: background-color 500ms ease;
}

#loginButton:hover,
.memberButton a:hover, 
.s-subject a:hover, 
.xmlResultLink:hover {
  background-color: #f00;
  color: #000;

}

/*Recaptch*/

#loginForm #recaptcha_area {
  padding: 20px 0;
  position: relative;
}

#loginForm #recaptcha_area table {
  border: none !important;
}

#loginForm .recaptchatable .recaptcha_image_cell {
    background-color: white;
    height: 55px !important;
    padding: 0px 7px !important;
    width: 220px;
}

#loginForm .recaptchatable .recaptcha_image_cell center img {
    height: 55px !important;
    width: 213px;
}

#loginForm .recaptchatable #recaptcha_image {
    border: medium none !important;
    float: left;
    margin: auto;
    width: 215px !important;
}

#loginForm .recaptchatable #recaptcha_response_field {
    left: -8px;
    text-align: center;
    position: absolute;
    top: -20px;
    width: 255px !important;
    padding: 10px;
    border-color: #f2f2f2 !important;
    border-radius: 50px;
}

#loginForm #recaptcha_logo, #recaptcha_tagline {
    display:none;
}

#loginForm #recaptcha_area td {
    border: 0 none !important;
    border-collapse: collapse !important;
    float: left;
    margin: 0 !important;
    vertical-align: middle !important;
}

#loginForm .recaptchatable .recaptcha_only_if_privacy a {
  position: absolute;
  top:0px;
  float: none !important;
  text-align: center !important;
  width: 255px !important;
  letter-spacing: 4px;
  text-transform: uppercase;
  font-size: 8pt !important;
  color: #000;
}