/* ==========================================================================
   Login Box styles
   ========================================================================== */
  
/*Change Backgound image here */
html{  
  /*background: #000 url(../../img/registration/background-image-1.jpg) top center;*/
  background-color: #E1E100;
  height:100%; 
}
body{
  background: transparent url(../../img/registration/login-bg-overlay.png) repeat;
  min-height:100%; 
}
.alert{
  margin: 20px auto;
  width: 70%;
}
#login-block{   
  padding-top: 50px;
  padding-bottom: 25px;
}
#login-block h3{
  color: #FFF;
  text-align: center;
  font-size:1.5em;
   opacity: 0.8;
  text-shadow: 2px 2px 2px #000;
  font-weight: normal;
 
}

.login-box{
  position: relative;
  max-width:480px;  
  background: transparent url(../../img/registration/login-bg.png) repeat; 
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius:8px;
  padding-bottom: 20px;
  -webkit-box-shadow: 2px 2px 5px #333;
  -moz-box-shadow: 2px 2px 5px #333;
  box-shadow: 2px 2px 5px #333;
  margin-top: 80px;
}

.login-logo{
   text-align: center;
   padding: 15px 0 10px;
}

.login-logo img{
  border:0;
  display: inline-block;
}
.login-form form p{
  width:80%;
  margin: 5px auto 10px;
  text-align: center;
}
 

.login-box hr{
  margin:10px auto 20px;
  width:70%;
  border-top:1px solid #dddbda;
  border-bottom:1px solid #FFF;
}
/* page icon */
.page-icon{
  width: 125px;
  height: 125px;
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  border-radius: 125px;
  background: transparent url(../../img/registration/login-bg.png) repeat; 
  border:8px solid #f9f9fa;
  text-align: center;
  -webkit-box-shadow: inset 1px 3px 8px #999;
  -moz-box-shadow: inset 1px 3px 8px #999;
  box-shadow: inset 1px 3px 8px #9999;
  margin: -80px auto 0;
  
}
.page-icon img{
  vertical-align: middle; 
  margin: 6px 0 0 3px;
  -moz-transition: all .5s ease-in-out;
  -webkit-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  -ms-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
  -ms-interpolation-mode: bicubic;
}
.rotate-icon{
   -moz-transform:rotate(45deg);
  -webkit-transform:rotate(45deg);
  -o-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  transform: rotate(45deg);
}
.login-box .page-icon{
  -webkit-animation-delay: .8s;
  -moz-animation-delay: .8s;
  -o-animation-delay: .8s;
  animation-delay: .8s;
}
/* Login Form */
.login-form input{
  display: block;
  margin:0 auto 15px;
  width:70%;
  background: #fefefe;
  border:1px solid #bfbfbf;
  color:#6c6c6c;
  padding: 8px;
  
}

/* Login Button */
.btn.btn-login {
  width: 120px;
  display:block;
  margin: 20px auto 20px;
  color: white;
  text-transform:uppercase ;  
  text-shadow: 1px 2px 2px #c44c4c;
  background: #48c7d5; 
  border: 1px solid #42a3ae;
  -webkit-box-shadow: inset 0 1px 2px #73e2ed;
  -moz-box-shadow: inset 0 1px 2px #73e2ed;
  box-shadow: inset 0 1px 2px #73e2ed;
  -webkit-transition: background .5s ease-in-out;
  -moz-transition: background .5s ease-in-out;
  -o-transition: background .5s ease-in-out;
  transition: background .5s ease-in-out;
  
}
.btn.btn-login:hover {   
  background: #21aebd; 
} 
.btn.btn-reset{
  width: 180px;
}
.login-links{
  text-align: center;
}
.login-links a{
  color: #6c6c6c; 
  display:inline-block;
  padding:5px;
   
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;;
}
.login-links a:hover{
  text-decoration: none;
  color:#e13c3c;
}

label.checkbox {
  width: 70%;
  display: block;
  margin: 0 auto;
}
label.checkbox input{
  width:25px;
  margin: 4px 0 0;
  padding: 0;
  background: none;
  border: 0;
}
#footer-text, #footer-text a{
  text-align: center;
  color:#FFF;
  opacity: 1;
  text-shadow: 1px 1px 1px #000;
}

/* Social Login */
.social-login{
  margin:10px 0 5px;
}
.social-login .btn{ 
   text-align: center;
    margin: 5px auto;
    color:#FFF;
    text-shadow: 1px 1px 1px #333;
    width:90%
    -webkit-box-shadow:  0px 0px 10px #FFF;
  -moz-box-shadow:  0px 0px 10px #FFF;
  box-shadow: 0px 0px 10px #FFF;
}
 
.btn.btn-facebook {
  border: 1px solid #2D4479;
  -webkit-box-shadow: inset 0 1px 2px #5272BF, 0px 0px 15px #FFF;
  -moz-box-shadow: inset 0 1px 2px #5272bf, 0px 0px 15px #FFF;
  box-shadow: inset 0 1px 2px #5272BF, 0px 0px 15px #FFF;
  background: #385496;
  background-size: 100%;
  background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#4365B4),color-stop(100%,#385496));
  background-image: -webkit-linear-gradient(top,#4365B4,#385496);
  background-image: -moz-linear-gradient(top,#4365B4,#385496);
  background-image: -o-linear-gradient(top,#4365B4,#385496);
  background-image: linear-gradient(top,#4365B4,#385496);
  font-size:12px;
}
.btn.btn-facebook:hover {
  background: #365293;
  background-size: 100%;
  background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#4365B4),color-stop(100%,#365293));
  background-image: -webkit-linear-gradient(top,#4365B4,#365293);
  background-image: -moz-linear-gradient(top,#4365B4,#365293);
  background-image: -o-linear-gradient(top,#4365B4,#365293);
  background-image: linear-gradient(top,#4365B4,#365293);
  -webkit-transition: box-shadow .05s ease-in-out;
  -moz-transition: box-shadow .05s ease-in-out;
  -o-transition: box-shadow .05s ease-in-out;
  transition: box-shadow .05s ease-in-out;
}

.btn.btn-twitter {
  border: 1px solid #2189FF;
  -webkit-box-shadow: inset 0 1px 2px #8DC2FF, 0px 0px 15px #FFF;
  -moz-box-shadow: inset 0 1px 2px #8dc2ff, 0px 0px 15px #FFF;
  box-shadow: inset 0 1px 2px #8DC2FF, 0px 0px 15px #FFF;
  background: #4A9EFF;
  background-size: 100%;
  background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#73B4FF),color-stop(100%,#4A9EFF));
  background-image: -webkit-linear-gradient(top,#73B4FF,#4A9EFF);
  background-image: -moz-linear-gradient(top,#73B4FF,#4A9EFF);
  background-image: -o-linear-gradient(top,#73B4FF,#4A9EFF);
  background-image: linear-gradient(top,#73B4FF,#4A9EFF);
  font-size:12px;
}

.btn.btn-twitter:hover {
  background: #459CFF;
  background-size: 100%;
  background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#73B4FF),color-stop(100%,#459CFF));
  background-image: -webkit-linear-gradient(top,#73B4FF,#459CFF);
  background-image: -moz-linear-gradient(top,#73B4FF,#459CFF);
  background-image: -o-linear-gradient(top,#73B4FF,#459CFF);
  background-image: linear-gradient(top,#73B4FF,#459CFF);
  -webkit-transition: box-shadow .05s ease-in-out;
  -moz-transition: box-shadow .05s ease-in-out;
  -o-transition: box-shadow .05s ease-in-out;
  transition: box-shadow .05s ease-in-out;
}
.fb-login, .twit-login{
  -webkit-animation-delay: .9s;
  -moz-animation-delay: .9s;
  -o-animation-delay: .9s;
  animation-delay: .9s;
}

 
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers)
=================================================================== */
@media only screen and (max-width: 479px) {
  #login-block{   
    padding-top: 10px;
    padding-bottom: 25px;
  }
  
}

/* Tablet Portrait Size to Tablet Landscape Size (devices and browsers)
=================================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px){
  #login-block {   
    margin: 0 auto;
    width: 420px;
  }
  
}