/*
Theme Name: New-Polaris's Custom Theme
Author: New-Polaris Authors
Version: 1.0
Description: A custom theme built with HTML, CSS and JS
*/

body,html{
	position:relative;
	display:flex;
	flex-direction:column;
	flex-wrap:nowrap;
	justify-content:start;
	align-items:center;
	background-color:#00063D;
	padding:0;
	margin:0;
	
}



.IMG1{
	height:100vh;
	width:auto;
	/*height:100vh;*/
	top:0px;
	filter: saturate(1.5) brightness(2);
}


.AAA{
	position:absolute;
	display:flex;
	flex-direction:column;
	flex-wrap:nowrap;
	justify-content:start;
	align-items:center;
}

.AAA h1{
	color:white;
}


.login-container { z-index:5;
	
	
  max-width: 400px;
  margin: 80px auto;
  padding: 30px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
  border-radius: 10px;
  background: linear-gradient(var(--angle), rgba(0,0,0,0.45), rgba(0,0,0,0.5), rgba(255,255,255,0.4));
  /*animation: rotateGradient 10s linear infinite;*/
  /*background-color:rgba(0,0,255,0.1);*/
	color:white;
	box-shadow:0px 0px 25px 10px rgba(255,255,255,0.5);
}

@property --angle {
	syntax: '<angle>';
	inherits: false;
	initial-value: 350deg;
}

/*@keyframes rotateGradient {
	0%   { --angle: 0deg; }
	20%  { --angle: 90deg; }
	50%  { --angle: 180deg; }
	100% { --angle: 360deg; }
}*/



.login-container label { z-index:6;
  display: block;
  margin-bottom: 8px;
  font-weight: bold;
  padding-top:30px;

}
.login-container input[type="text"],
.login-container input[type="password"] {z-index:6;
  width: 100%;
  padding: 10px;
  margin-bottom: 20px;
  border: 1px solid #ccc;
  border-radius: 5px;
   background-color:rgba(150,150,255,0.2);
   color:#AAF1FF;
   font-size:1.5rem;
   
}

.login-container input[type="submit"] {
  background: #0073aa;
  color: white;
  padding: 10px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.login-container input[type="submit"]:hover {
  background-color: #AAF1FF; /* #AAF1FF  #005177 */
  color:#005177;
}


@media screen and (max-width: 760px) {
	.login-container {
		width:70vw;
		
		font-size:1rem;
		
	}
	.login-container input[type="text"],
.login-container input[type="password"] {
	font-size:1rem;
}

.IMG1{
	height:auto;
	width:100vw;
}
}
