body.login {
  background-color:#008CD5;
  background-image: radial-gradient(
    at 27% 81%,
    hsla(200, 100%, 17%, 1) 0px,
    transparent 100%
  ),
  radial-gradient(at 3% 10%, hsla(200, 100%, 36%, 1) 0px, transparent 50%),
  radial-gradient(at 7% 77%, #003a57 0px, transparent 50%),
  radial-gradient(at 0% 78%, hsla(200, 100%, 17%, 1) 0px, transparent 50%),
  radial-gradient(at 52% 42%, hsla(200, 99%, 32%, 1) 0px, transparent 50%),
  radial-gradient(at 96% 36%, hsla(200, 99%, 8%, 1) 0px, transparent 50%),
  radial-gradient(at 40% 27%, hsla(200, 100%, 17%, 1) 0px, transparent 50%);
background-size: 200% 200%, 150% 150%, 225% 225%, 200% 200%, 150% 150%,
  225% 225%, 200% 200%;
animation: animatedBackground 10s linear infinite;
}

body.login #login {
  margin-top:6%;
}

#login{
  width:80%;
  max-width:460px;  
}

.login h1 a{
  content: url(media/logo-big.svg);
  background:none !important;
  width:220px;
  margin-bottom:0;
}

body.login #login form {
  border-radius: 6px;
  border:none;
  position: relative;
  overflow: visible;
  padding:40px 32px;
  box-shadow: 0px 24px 80px -23px rgba(0,0,0,0.6);
  background-color: #fff;
  margin-bottom:32px;
}

body.login #login form:before{
  content:'';
  position: absolute;
  display: block;
  left:-108px;
  top:90px;
  width:108px;
  height:180px;
  z-index:-1;
  background:url(media/pixel-pattern-1.svg);
}

body.login #login form:after{
  content:'';
  position: absolute;
  display: block;
  right:-180px;
  top:-30px;
  width:216px;
  height:180px;
  z-index:-1;
  background:url(media/pixel-pattern-2.svg);
}
.wp-core-ui .button, .wp-core-ui .button-primary, .wp-core-ui .button-secondary{
  border-radius: 4px;
}

.login form .input, .login input[type=password], .login input[type=text]{
  padding:.75rem .62rem;
  border-color:#98B9CA;
}

body.login #nav,
body.login #backtoblog {
  margin: 0;
  padding-top: 24px;
}
body.login #backtoblog {
  padding-bottom: 24px;
  padding-top: 16px;
}

body.login .message,
body.login .success,
body.login #login_error {
  border-left: 4px solid #f1a80c;
}

.login #backtoblog a, .login #nav a{
  color:#fff;
}

.login #backtoblog a:hover, .login #nav a:hover{
  color:#fff;
  text-decoration: underline;
}

.login .button.wp-hide-pw{
  top:10px;  
  right:10px;
}

.login #login_error, .login .message, .login .success {
  border:1px solid rgba(255,255,255,.2);
  border-left: 4px solid #72aee6;
  background-color: rgba(255,255,255,.1);
  border-radius: 6px;
  color: #fff;
  margin-top:20px;
  margin-bottom:0
}
.privacy-policy-page-link,
.login #login_error, .login .message, .login .success a{
  color: #fff;
}


@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}




@keyframes animatedBackground {
  0%,
  100% {
    background-position: 0% 50%, 100% 50%, 50% 100%;
    background-size: 200% 200%, 150% 150%, 225% 225%;
  }
  33% {
    background-position: 50% 100%, 0% 50%, 100% 50%;
    background-size: 225% 225%, 200% 200%, 150% 150%;
  }
  66% {
    background-position: 100% 50%, 50% 0%, 0% 50%;
    background-size: 150% 150%, 225% 225%, 200% 200%;
  }
}


.itsec-pwls-login--hide .itsec-pwls-login-fallback {
  margin-left: 0;
  margin-right: 0;
  position: static;
  clear: both;
}