form {
	margin: 100px auto 0;
	width: 300px;
	padding: 20px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
	text-align: center;
}

form h1 {
	margin: 0 0 10px;
	font-size: 20px;
	font-weight: bold;
}

form p {
	width: inherit;
	margin: 5px 0;
	color: #999;
}

form input {
	display: block;
	width: inherit;
	padding: 2px;
	background: rgba(0, 0, 0, 0.05);
	border: 1px solid rgba(0, 0, 0, 0.15);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
	border-radius: 3px;
	font-size: 14px;
}

form input:invalid:not (:focus ) {
	border-color: red;
}

form button {
	padding: 2px 5px;
	border-radius: 3px;
	border: 1px solid #192937;
	background: rgba(187, 255, 255, 0.19999999999999996);
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(187, 255, 255,
		0.19999999999999996) ), to(rgba(187, 255, 255, 0) ) );
	background-image: -moz-linear-gradient(top, rgba(187, 255, 255, 0.19999999999999996),
		rgba(187, 255, 255, 0) );
	background-color: #2a3a48;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), inset 0 1px 0
		rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.2);
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
	color: #c7d1d8;
	cursor: pointer;
	display: block;
	width: 305px;
	font-size: 14px;
}

form button:hover {
	background: rgba(187, 255, 255, 0.30000000000000004);
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(187, 255, 255,
		0.30000000000000004) ), to(rgba(187, 255, 255, 0) ) );
	background-image: -moz-linear-gradient(top, rgba(187, 255, 255, 0.30000000000000004),
		rgba(187, 255, 255, 0) );
	background-color: #2a3a48;
	color: #ffffff;
}