@charset "utf-8";
/* CSS Document */

.cover {
    position: absolute;
    top: 0px;
    left:0px;
    width:100%;
    min-height:100% !important;
    background:#000;
    opacity:0.7;
    z-index:0;
filter:alpha(opacity=70); /* For IE8 and earlier */ 
}

.form-signin {
    max-width: 500px;
    padding: 19px 29px 29px;
    margin: 0 auto;
	//margin-top:90px;
    background-color: #fff;
	
    border: 1px solid #e5e5e5;
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
       -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
            box-shadow: 0 1px 2px rgba(0,0,0,.05);
			
	font-family:Tahoma, Geneva, sans-serif;
	color:#ffffff;
	font-weight:lighter;
}

.form-signin .form-signin-heading{
    color:#00A2D1;
}
.form-signin input[type="text"],
.form-signin input[type="password"],
.form-signin input[type="email"] {
    font-size: 16px;
    height: 45px;
    padding: 7px 9px;
}

.signin-form, .body-container
{
	//border:solid red 1px;
	margin-top:110px;
}
.navbar-brand{
	font-family:"Lucida Handwriting";
}
#btn-submit{
	height:45px;
}


.entry-illustration {
  width: 12px;
  height: 12px;
  
  border: 2px solid #dfffff;
  border-radius: 50%;
  
  transition: background-color 500ms;
  
  top: 0;
  left: 0;
}



input {
  cursor: pointer;
}

.number-pad {
  width: 100%;
  text-align: center;
  padding-top: 10px;
  z-index: 2;
  color: #ffffff;
}


.number-push {
  width: 80px;
  height: 80px;
  text-align:center;
  border-radius: 50%;
  border: 1px solid #fff;  
  cursor: pointer; 
  font-size: 3.5em;
  text-align: center;
  margin:12px;
  font-weight:300;
  background:rgba(255,255,255,0.2);

  
  
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  
  transition: background-color 300ms, color 300ms;
  opacity:0.9;
filter:alpha(opacity=90);
}



.reset {
  right: 0px;
  top: 350px;
  
  border: none;
  background-color: transparent;
  
  font-size: 1em;
  font-weight: bold;
  
  cursor: pointer;
  
  color: #dfffff;

}

.entry-illustration {
width: 15px;
  height: 15px;
  border: 1px solid #fff;
  border-radius: 10px; 
  transition: background-color 500ms;
  
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

.text-gray{color:#999;}
.text-dark{color:#333;}
.text-orange{color:#F68A35;}
.text-red{color:#fc8675;}
.text-green{color:#78cd51;}
.text-green2{color:#8EB038;}
.text-green-light{color:#8BC34A;}
.text-green-light{color:#8BC34A;}
.text-blue{color:#3399dc;}

.bg-sat{background-color:#d0f5d8;color:#B0C343}
.bg-sun{background-color:#facac3;color:#F4CECF}
.bg-green{background-color:#78cd51;color:#ffffff}
.bg-orange{background-color:#F68A35;color:#ffffff}
.bg-danger{background-color:#fc8675;color:#ff2121}
.bg-red{background-color:#ff2121;color:#ffffff}
.bg-blue{background-color:#03A9F4;color:#ffffff}
.bg-green2{background-color:#8EB038;color:#ffffff}
.bg-gray{background-color:#f2f2f2;color:#37474F}
.bg-pay{background-color:#FCE4EC;}
.bg-pink{background-color:#FE759F;color:#ffffff}
.bg-purple{background-color:#7E57C2;color:#ffffff}
.bg-brown{background-color:#795548;color:#ffffff}
.bg-light-orange{background-color:#FFAB91;color:#ffffff}
.bg-white{background-color:#fff}

.bg-green-dark{background-color:#2f7531;color:#ffffff}
.bg-green-light{background-color:#8BC34A;color:#ffffff}
.bg-green-lime{background-color:#9dd653;color:#ffffff}

.button-green{
  background: #78cd51;color:#fff;-webkit-border-radius:50em;-moz-border-radius:50em;-moz-border-radius:50em;border-radius:50em;border:1px solid #eee;text-align:center;padding-left:1px;cursor:pointer;font-size:18px;-khtml-opacity:.90; -moz-opacity:.90; -ms-filter:”alpha(opacity=90)”;filter:alpha(opacity=90);filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.9);opacity:.90;width:40px;height:40px;
}
.button-green2{
  background: #8EB038;color:#fff;-webkit-border-radius:50em;-moz-border-radius:50em;-moz-border-radius:50em;border-radius:50em;border:1px solid #eee;text-align:center;padding-left:1px;cursor:pointer;font-size:18px;-khtml-opacity:.90; -moz-opacity:.90; -ms-filter:”alpha(opacity=90)”;filter:alpha(opacity=90);filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.9);opacity:.90;width:40px;height:40px;
}
.button-light-red{
  background: #fc8675;color:#fff;-webkit-border-radius:50em;-moz-border-radius:50em;-moz-border-radius:50em;border-radius:50em;border:1px solid #eee;text-align:center;padding-left:2px;cursor:pointer;font-size:18px;-khtml-opacity:.90; -moz-opacity:.90; -ms-filter:”alpha(opacity=90)”;filter:alpha(opacity=90);filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.9);opacity:.90;width:40px;height:40px;
}
.button-red{
  background: #ff2121;color:#fff;-webkit-border-radius:50em;-moz-border-radius:50em;-moz-border-radius:50em;border-radius:50em;border:1px solid #eee;text-align:center;padding-left:1px;cursor:pointer;font-size:18px;-khtml-opacity:.90; -moz-opacity:.90; -ms-filter:”alpha(opacity=90)”;filter:alpha(opacity=90);filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.9);opacity:.90;width:40px;height:40px;
}
.button-blue{
  background: #3399dc;color:#fff;-webkit-border-radius:50em;-moz-border-radius:50em;-moz-border-radius:50em;border-radius:50em;border:1px solid #eee;text-align:center;padding-left:1px;cursor:pointer;font-size:18px;-khtml-opacity:.90; -moz-opacity:.90; -ms-filter:”alpha(opacity=90)”;filter:alpha(opacity=90);filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.9);opacity:.90;width:40px;height:40px;
}

.button-orange{
  background: #f9aa0b;color:#fff;border:1px solid #eee;text-align:center;padding-left:1px;cursor:pointer;font-size:18px;-khtml-opacity:.90; -moz-opacity:.90; -ms-filter:”alpha(opacity=90)”;filter:alpha(opacity=90);filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.9);opacity:.90;width:40px;height:40px;
}

.form-control {
  border-radius: 1px;
  margin-bottom: 0px;
  border-color: #fff;
  padding: 10px;
  min-height: 35px;
  box-shadow: none;

}
.form-control::-webkit-input-placeholder,
.form-control:-moz-placeholder,
.form-control::-moz-placeholder,
.form-control:-ms-input-placeholder {
 
}
.form-control:focus {
  border-color: #FF5A00;
  box-shadow: none;
}

.password-invalid {
    outline-color: red;
    /* also need animation and -moz-animation */
    -webkit-animation: shake .5s linear;
}
/* also need keyframes and -moz-keyframes */
 @-webkit-keyframes shake {
    8%, 41% {
        -webkit-transform: translateX(-10px);
    }
    25%, 58% {
        -webkit-transform: translateX(10px);
    }
    75% {
        -webkit-transform: translateX(-5px);
    }
    92% {
        -webkit-transform: translateX(5px);
    }
    0%, 100% {
        -webkit-transform: translateX(0);
    }
}