html {
  height: 100%;
}
/* Body Triggers for layout options 
------------------------------------------------------------------
*/
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
/*------------------------------------------------------------------
[Login]
*/
.login-wrapper {
  height: 100%;
}
.login-wrapper > * {
  height: 100%;
}
.login-wrapper .bg-pic {
  position: absolute;
  width: 100%;
  overflow: hidden;
}
.login-wrapper .login-container {
  width: 400px;
  display: block;
  position: relative;
  float: right;
  overflow-y: auto;
}
.login-wrapper .bg-caption {
  width: 50%;
}
.login-container div img{
  width: 100%;
}
.m-b-20 {
margin-bottom: 20px;
}
.p-l-20 {
padding-left: 20px !important;
}
.pull-bottom {
position: absolute !important;
bottom: 0;
}
.text-white {
color: #fff !important;
}
.m-t-30 {
margin-top: 30px;
}
.m-l-20 {
margin-left: 20px;
}
.m-r-20 {
margin-right: 20px;
}
.p-l-50 {
padding-left: 15px !important;
}
.p-r-50 {
padding-right: 15px !important;
}
.p-t-50 {
padding-top: 50px !important;
}
.bg-white {
background-color: #eee;
}
.p-t-35 {
padding-top: 35px !important;
}
/*alert box*/
.alert{
  display: block;
  float: left;
  width: 100%;
}

/* Responsive handlers : Login
------------------------------------
*/
@media (max-width: 768px) {
  .login-wrapper .login-container {
    width: 100% !important;
  }
}
@media only screen and (max-width: 321px) {
  .login-wrapper .login-container {
    width: 100% !important;
  }
}