html {
	width: 100%; height: 100%;
}
body {
	width: 100%; height: 100%;
}
canvas {
	vertical-align: bottom; display: block;
}
.count-particles {
	background: rgb(0, 0, 34); left: 0px; top: 48px; width: 80px; text-align: left; color: rgb(19, 232, 233); line-height: 14px; text-indent: 4px; padding-bottom: 2px; font-family: Helvetica, Arial, sans-serif; font-size: 0.8em; font-weight: bold; position: absolute;
}
.js-count-particles {
	font-size: 1.1em;
}
#stats {
	margin-top: 5px; margin-left: 5px; -webkit-user-select: none;
}
.count-particles {
	margin-top: 5px; margin-left: 5px; -webkit-user-select: none;
}
#stats {
	border-radius: 3px 3px 0px 0px; overflow: hidden;
}
.count-particles {
	border-radius: 0px 0px 3px 3px;
}
#particles-js {
	background-position: 50% 50%; width: 100%; height: 100%; margin-right: auto; margin-left: auto; position: relative; background-image: url("../img/bg.jpg"); background-repeat: no-repeat; background-size: cover;
}
.sk-rotating-plane {
	margin: -80px auto auto -40px; animation:sk-rotating-plane 1.2s ease-in-out infinite; left: 50%; top: 50%; width: 80px; height: 80px; display: none; position: absolute; z-index: 1; background-color: white; -webkit-animation: sk-rotating-plane 1.2s infinite ease-in-out;
}
.sk-rotating-plane.active {
	display: block;
}
.login {
	background: white; border-radius: 5px; transition:1s; left: 50%; top: 50%; width: 350px; height: 500px; margin-top: -250px; margin-left: -175px; position: absolute; z-index: 2; box-shadow: 0px 0px 5px #333333; -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s;
}
.login-top {
	color: rgb(51, 51, 51); padding-left: 40px; font-size: 24px; margin-top: 100px; margin-bottom: 50px; box-sizing: border-box;
}
.login-right {
	color: rgb(51, 200, 51); padding-right: 20px; font-size: 16px; margin-top: 60px; margin-bottom: 50px; box-sizing: border-box;float: right;
}
.login_reg {
	margin: 0px; color: rgb(48, 152, 213); white-space: nowrap;
}
.login-center {
	padding: 0px 40px; width: 100%; margin-bottom: 30px; box-sizing: border-box;
}
.login-center-img {
	width: 20px; height: 20px; margin-top: 5px; float: left;
}
.login-center-img > img {
	width: 100%;
}
.login-center-input {
	width: 230px; height: 30px; margin-left: 15px; float: left; position: relative;
}
.login-center-input input {
	border-width: 1px; border-style: solid; border-color: rgb(255, 255, 255) rgb(255, 255, 255) rgb(204, 204, 204); transition:0.5s; border-image: none; width: 100%; height: 30px; color: rgb(51, 51, 51); padding-left: 10px; position: relative; z-index: 2; box-sizing: border-box;
}
.login-center-input input:focus {
	border: 1px solid dodgerblue; border-image: none;
}
.login-center-input-text {
	background: white; padding: 0px 5px; transition:0.5s; left: 5px; top: 50%; height: 20px; color: dodgerblue; line-height: 20px; font-size: 14px; margin-top: -10px; position: absolute; z-index: 0; opacity: 0; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s;
}
.login-center-input input:focus ~ .login-center-input-text {
	top: 0px; margin-top: -15px; z-index: 3; opacity: 1;
}
.login.active {
	animation:login-small 0.8s forwards; -webkit-animation: login-small 0.8s; -webkit-animation-fill-mode: forwards;
}
.login-button {
	margin: 50px auto 0px; border-radius: 5px; width: 250px; height: 40px; text-align: center; color: white; line-height: 40px; cursor: pointer; background-color: dodgerblue;
}
.login-button_input {
	text-align: center; color: white; line-height: 40px;background-color: dodgerblue;
}