body {
	display:flex; justify-content: center; background-image: url('/img/gradient.png'); background-repeat: repeat-x; 
	}
	.mainblock {
	margin:auto; text-align:center; border:1px dashed gray; border-radius: 4px;
	font-family: Arial, sans-serif; font-size: 15px; font-weight: 500; color: rgb(109,121,185);
	}
	div {
	font-family: Arial, sans-serif; font-size: 15px; font-weight: 500; color: rgb(109,121,185);
	}

	
@media (max-width: 90rem){	/*FOR PHONES*/
	.form {
	margin:auto; padding: 1rem; width: auto;
	}
	.form img{
	max-width:100%; height:auto;
	}
	.input2 {	/*for login inputs*/
	border-radius: 6px; font-size: 18px; border: 1px solid rgb(109,121,185); padding: 10px; margin-bottom: 5px;
	height: 2rem; width: calc(100% - 23px);
	}
	.input2:focus {
	outline: none !important; border:1px solid rgb(121,193,206); box-shadow: 0 0 10px #719ECE;
	}
	.input_short {	/*for login inputs*/
	border-radius:6px; font-size:18px; border:1px solid rgb(109,121,185);
	padding:10px; margin-top:1rem; margin-bottom:1rem; height:2rem; width:4rem;
	}
	.input_short:focus {
	outline: none !important; border:1px solid rgb(121,193,206); box-shadow: 0 0 10px #719ECE;
	}
	.loginbutton {
	color: #fff; background: rgb(109,121,160); border: 0px; border-radius: 6px;
	outline: 0; width: 70%; height: 3rem; font-size: 16px; text-align: center; cursor: pointer;
	}
	.loginbutton:hover {
	transition: all 0.3s ease-out; filter: brightness(115%); transition: 0.2s;
	}
}

@media (min-width: 90rem){	/*FOR DESKTOP*/
	.form {
	margin:1rem; padding:1rem; width:auto;
	}
	.form img{
	max-width:100%; height:auto;
	}
	.input2 {	/*for login inputs*/
	border-radius: 6px; font-size: 18px; border: 1px solid rgb(109,121,185);
	padding: 10px; margin-bottom: 5px; height: 2rem; width: 40rem;
	}
	.input2:focus {
	outline: none !important; border:1px solid rgb(121,193,206); box-shadow: 0 0 10px #719ECE;
	}
	.input_short {	/*for login inputs*/
	border-radius:6px; font-size:18px; border:1px solid rgb(109,121,185);
	padding:10px; margin-top:1rem; margin-bottom:1rem; height:2rem; width:4rem;
	}
	.input_short:focus {
	outline: none !important; border:1px solid rgb(121,193,206); box-shadow: 0 0 10px #719ECE;
	}
	.loginbutton {
	color: #fff; background: rgb(109,121,160); border: 0px; border-radius: 6px; outline: 0;
	width: 18rem; height: 3rem; font-size: 16px; text-align: center; cursor: pointer;
	}
	.loginbutton:hover {
	transition: all 0.3s ease-out; filter: brightness(115%); transition: 0.2s;
	}
}
		

	h1.login-title {
	font-family: Arial, sans-serif; font-size: 22px; font-weight: 500; color: rgb(109,121,185); text-align: center;
	}

	a:link {
	color: rgb(095,130,158); text-decoration: none;
	}
	a:visited {
	color: rgb(095,130,158); text-decoration: none;
	}
	a:hover {
	color: rgb(171,195,214); text-decoration: none;
	}
	a:active {
	color: rgb(176,215,247); text-decoration: none;
	}
	.a2:link {
	color: rgb(171,195,214);
	font-size: 19px; text-transform: uppercase; font-weight: 500; text-decoration: none;
	}
	.a2:visited {
	color: rgb(171,195,214); text-decoration: none;
	}
	.a2:hover {
	border-bottom: 0.125em solid; text-decoration: none;
	}
	.a3:link {
	color: rgb(171,195,214);
	font-size: 19px; text-transform: uppercase; font-weight: 500; text-decoration: none;
	}
	.a3:visited {
	color: rgb(171,195,214); text-decoration: none;
	}
	.a3:hover {
	border-bottom: 0.125em solid; text-decoration: none;
	}