body.login {
	background: #bbe1f2;
	background: -webkit-linear-gradient(top, #bbe1f2 0%, #e1f2fb 100%) #e1ffff;
	background: -moz-linear-gradient(top, #bbe1f2 0%, #e1f2fb 100%) #e1ffff;
	background: linear-gradient(to bottom, #bbe1f2 0%, #e1f2fb 100%) #e1ffff;
	overflow: hidden;
}

body.login::before {
	display: block;
	content: "";
	background: url(/images/theme/summer/sun.png) center center;
	background-size: contain;
	width: 2500px;
	height: 2500px;
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -1250px;
	margin-top: -1250px;
	animation: rotation 60s infinite linear;
	z-index: -1;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}

div#login input[type="text"], 
div#login input[type="password"] {
  background: rgba(0,0,0,0.15)!important;
  /*color: rgba(255,255,255,0.8)!important;*/
}

div#login label::before {
	background: rgba(0,0,0,0.15)!important;
	/*color: rgba(255,255,255,0.8)!important;*/
}

.login-mode-buttons li a.button {
	/*color: rgba(255,255,255,0.8)!important;*/
}

.login-mode-buttons li a.button::before {
	/*color: rgba(255,255,255,0.8)!important;*/
}

.hidden-login div {
	/*color: rgba(255,255,255,0.8)!important;*/
}

.login-throbber svg path:first-child {
	/*fill: rgba(255,255,255,0.4);*/
}

.login-throbber svg path:last-child {
	/*fill: rgba(255,255,255,0.8);*/
}

canvas {
	position: absolute;
	width: 100%;
	height: 100%;
}