body { padding: 0; }

input[type='text'], input[type='tel'], input[type='email'], input[type='password'], input[type='button'], input[type='submit'] {
  width: 95%; height: 30px; box-sizing: border-box; background: transparent; margin: 15px 0;
}

input[type='text'], input[type='tel'], input[type='email'], input[type='password'] {
  color: #EEE;
}

input[type='button'], input[type='submit'] {
  background: #FFF;
  color: #000;
}

input:focus:invalid:focus { color: #FFDADA; }

input::placeholder { opacity: 1; color: #FFF; font-weight: 100; letter-spacing: 1px; }
input:-ms-input-placeholder    { color: #FFF; font-weight: 100; letter-spacing: 1px; }
input::-ms-input-placeholder   { color: #FFF; font-weight: 100; letter-spacing: 1px; }

#zip { display: none; }

#loginButton, #remindButton { width: calc(100% - 10px); }
#requestButton { color: rgb(230,110,40); }

#fullScreen {
  position: relative;
  overflow: hidden;
  background: rgb(0, 44, 81);
}

#l-wrap {
  float: left;
  color: white;
  background: rgb(0, 44, 81);
  height: 1200px;
  width: calc(50% - 1px);
}

#r-wrap {
  float: right;
  color: white;
  background: linear-gradient(135deg, rgba(222,65,65,1) 0%, rgba(235,131,44,1) 100%);
  height: 1200px;
  width: calc(50% - 1px);
}

#graphic-wrap {
  position: absolute;
  margin-top: 20px;
  text-align: center;
  width: 18.5%;
  z-index: 10;
}

#graphic-wrap > img {
  width: 100%;
  max-width: 250px;
  min-width: 50px;
}

#l-content, #r-content {
  display: table;
  margin: 65px auto;
}

#l-header, #r-header {
  white-space: nowrap;
  font-size: 20px; 
  font-weight: 100; 
  margin: 15px;
}

#r-btn, #l-btn {
  margin: 0 auto;
  padding: 2px;
  border-radius: 50%;
  height: 50px; width: 50px;
  color: white;
}

#r-btn:hover, #l-btn:hover {
  cursor: pointer;
  background: rgba(99,99,99,0.22);
}

#forgotten, #detailRequest {
  display: inline-block;
  margin: 12px 0;
  font-weight: 100; 
  font-size: 12px;
  height: 20px;
}

#forgotten:hover { 
  cursor: pointer; 
  background: #24476D;
}

.form-box {
  position: relative;
  margin: 0 15px;
}

.form-close-main, .form-close-extra {
  position: absolute;
  top: 15px; right: -15px;
  height: 25px; width: 20px;
  padding: 0 5px;
  color: #FFF;
  font-weight: 100;
  font-size: 27px;
}

.form-close-main:hover, .form-close-extra:hover { cursor: pointer; }

.xs-ctr-sm-lft { text-align: left;  margin-top: 25px; }
.xs-ctr-sm-rgt { text-align: right; margin-top: 25px; }

@media screen and (max-width: 999px) {

  .xs-ctr-sm-lft, .xs-ctr-sm-rgt { text-align: center; margin-top: 0; }

  #loginButton, #remindButton { width: 95%; }

}


/* new for bottom content */
.login-header {
  text-align: center;
  padding: 5px 35px; 
  font-size: 33px;
}

.login-footer > .span6 {
  padding: 5px 35px;
}
