* {
  
  /*with these codes padding and border does not increase it's width.Gives intuitive style.*/  
  -webkit-box-sizing: border-box;   
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body {
   margin:0;
   padding:0;
  font-family: 'Droid Sans', sans-serif;
background:#f1f2f7 url(../images/background.png);margin:0px;padding:0px;animation: animatedBackground 10s linear infinite;
	-moz-animation: animatedBackground 10s linear infinite;
	-webkit-animation: animatedBackground 10s linear infinite;
	-ms-animation: animatedBackground 10s linear infinite;
	-o-animation: animatedBackground 10s linear infinite;
  }

* {
  
  /*with these codes padding and border does not increase it's width.Gives intuitive style.*/
  
  -webkit-box-sizing: border-box;   
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.header-login {padding:0% 1%;width:100%;background:#fff url(../images/he_bg.png) right no-repeat; height :140px;}
.form-padding {padding:0 0 0 0;margin:0 0 10px 0}
form {
 	/*background:#c29bb6; 
  width:300px;
  margin:40px auto;
  border-radius:0.4em;
  border:1px solid #b987aa;
  overflow:hidden;
  position:relative;
  box-shadow: 0 5px 10px 5px rgba(0,0,0,0.2);*/
}

form:after {
  content:"";
  display:block;
  position:absolute;
  height:1px;
  width:100px;
  left:20%;
  background:linear-gradient(left, #111, #444, #b6b6b8, #444, #111);
  top:0;
}

form:before {
 	content:"";
  display:block;
  position:absolute;
  width:8px;
  height:5px;
  border-radius:50%;
  left:34%;
  top:-7px;
  box-shadow: 0 0 6px 4px #fff;
}

.inset {
 	padding:20px 20px 0px 20px; 
  background:#fff; 
  width:350px;
  margin:80px auto;
  border-radius:0.4em;
  overflow:hidden;
  position:relative;
  box-shadow: 0 3px 3px 3px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.login-title {
 	padding:10px 20px 10px 20px; 
  background:#a96a29; 
  color:#fff;
}
form h1 {
  font-size:18px;
  text-shadow:0 1px 0 black;
  text-align:center;
  padding:0px 0;
  border-bottom:1px solid #efefef;
  position:relative;
  margin:0px;
}

form h1:after {
 	content:"";
  display:block;
  width:250px;
  height:100px;
  position:absolute;
  top:0;
  left:50px;
  pointer-events:none;
  transform:rotate(70deg);
  -webkit-transform: rotate(70deg);
  background:linear-gradient(50deg, rgba(255,255,255,0.15), rgba(0,0,0,0));
   background-image: -webkit-linear-gradient(50deg, rgba(255,255,255,0.05), rgba(0,0,0,0)); /* For Safari */

}
.copyright {font-size:11px;text-align:center}
label {	color:#333; display:block; padding-bottom:9px;}

input[type=text],input[type=password] {width:100%; padding:8px 5px; border:1px solid #ccc; box-shadow: 0 1px 0 rgba(255,255,255,0.1); border-radius:0.3em; margin-bottom:10px;}

label[for=remember]{color:white; display:inline-block; padding-bottom:0; padding-top:5px;}

input[type=checkbox] {display:inline-block; vertical-align:top;}

.p-container {padding:0 20px 0px 20px;}

.p-container:after {clear:both; display:table; content:"";}
.p-container span {display:block; float:left; color:#0d93ff; padding-top:8px;}

input[type=submit] {padding:5px 20px;border:1px solid rgba(0,0,0,0.4);text-shadow:0 -1px 0 rgba(0,0,0,0.4);box-shadow: inset 0 1px 0 rgba(255,255,255,0.3), inset 0 10px 10px rgba(255,255,255,0.1); border-radius:0.3em; background:#60253b; color:white; float:right; font-weight:bold; cursor:pointer; font-size:13px;}
input[type=submit]:hover {box-shadow: inset 0 1px 0 rgba(255,255,255,0.3), inset 0 -10px 10px rgba(255,255,255,0.1);}

input[type=text]:hover,
input[type=password]:hover,
label:hover ~ input[type=text],
label:hover ~ input[type=password] {background:#efefef;}
 

/* Makes responsive fields.Sets size and field alignment.*/
input[type=text]{margin-bottom: 10px;margin-top: 10px; width:100%; padding: 8px 10px 8px 10px; border-radius:5px; border:1px solid #ccc;}
input[type=submit]{margin-bottom: 10px; width:100%;padding: 0 10px 0 10px; border-radius:5px;border:1px solid #ccc;background-color:#60253b;}
textarea{width:100%;padding: 15px;margin-top: 10px;border:1px solid #7ac9b7;border-radius:5px; margin-bottom: 20px;resize:none;}
 
input[type=text]:focus,textarea:focus { border-color: #4697e4;}
.logodisplay {background:#fff;text-align:center;margin:5px 5px 5px 5px;border-radius:0.4em;}
@media screen and (max-width: 979px) {
.header-login {padding:1% 1%;width:100%;background:#fff}
}

@keyframes animatedBackground {
	0% { background-position: 0 0; }
	100% { background-position: -300px 0; }
}
@-moz-keyframes animatedBackground {
	0% { background-position: 0 0; }
	100% { background-position: -300px 0; }
}
@-webkit-keyframes animatedBackground {
	0% { background-position: 0 0; }
	100% { background-position: -300px 0; }
}
@-ms-keyframes animatedBackground {
	0% { background-position: 0 0; }
	100% { background-position: -300px 0; }
}
@-o-keyframes animatedBackground {
	0% { background-position: 0 0; }
	100% { background-position: -300px 0; }
}

@keyframes animatedBird {
	0% { background-position: 0 25%; }
	100% { background-position: 100% 0; }
}
@-moz-keyframes animatedBird {
	0% { background-position: 0 25%; }
	100% { background-position: 100% 0; }
}
@-webkit-keyframes animatedBird {
	0% { background-position: 0 25%; }
	100% { background-position: 100% 0; }
}
@-ms-keyframes animatedBird {
	0% { background-position: 0 25%; }
	100% { background-position: 100% 0; }
}
@-o-keyframes animatedBird {
	0% { background-position: 0 25%; }
	100% { background-position: 100% 0; }
}
.bird {
	width: 100%; 
	height: 100%;	
	position: absolute;
	background-image: url(bird.gif);
	background-repeat: no-repeat;

	animation: animatedBird 10s linear infinite;
	-moz-animation: animatedBird 10s linear infinite;
	-webkit-animation: animatedBird 10s linear infinite;
	-ms-animation: animatedBird 10s linear infinite;
	-o-animation: animatedBird 10s linear infinite;
}