html, 
body{
	height: 100%; 
	background: linear-gradient(to bottom, LightSkyBlue, blue); /* Standard syntax */
	background-repeat: no_repeat;
	background-attachment: fixed;
	font-family: Calibri;
	color: white;
}

/* Form css */
input, .formButton{
	width: 100%; 
	height: 35px;
	margin-bottom: 5px; 
	border-radius: 5px;
	position: relative; 
	margin-left: auto; 
	margin-right: auto;
	font-size: large;
	box-sizing: border-box;
}

.formButton{
	text-align: center; 
}


hr {
	width: 50%;	
}

form{
	margin-top: 1em; 
	width:100%;
	height: auto; 
	min-Width: 200px; 
	/*background:silver; */
}

a {    
	color: grey;
	font-size:large;
} 

a:hover {  
   font-size:larger;
}

.container{
	width: 50%;
	height:100%;
	min-Width: 200px;
	max-Width: 500px; 	
	position: relative; 
	margin-top:auto;
	margin-bottom:auto;
	margin-left: auto; 
	margin-right: auto;
	text-align: center; 
}
.depricated{
	background: red; 
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
	/* Styles */
	.container{
		width: 100%;
	}
	body{
		font-size: 1em;
	}
	a {
		font-size:1.5em;
	}	 
}