@charset "UTF-8";

* {
	box-sizing: border-box
}
body{
	margin: 0;
	padding: 0;
}
body, input{
	font-size: 30px;
}

header{
	text-align: center;
}

h2{
	margin-top: 10px;
}

.container {
	position: relative;
	max-width: 1000px;
	margin: auto;
	background-color: #f2f2f2;
	padding: 20px;
	border: solid gray 3px;
	border-radius: 25px;
} 

.form-line {
	display: flex;
	margin: 15px;
/* 	position: relative; */
}

.form-label {
	display: inline-block;
	width: 30%;
}

.form-input{
	display: inline-block;
	width: 65%;
	border: 2px solid #4CAF50;
	border-radius: 6px;
}

.form-input:focus{
	box-shadow: inset 0 0 2px #000;
/*     background: #eeeeee; */
    border-color: #51cbee;
    outline: none; /*Remove Chrome outline*/
}

.csbutton {
	text-decoration: none;
	background-color: #e4f3e2;
	color: black;
	border: 2px solid #4CAF50;
	border-radius: 6px;
	-webkit-transition-duration: 0.4s; /* Safari */
	transition-duration: 0.4s;
}

.csbutton:hover {
	background-color: #4CAF50; /* Green */
	color: white;
	cursor: default;
}

.right {
	text-align: right;
	width: 100%;
	padding-right: 20px;
}

@media screen and (max-width: 750px) {
	.form-line{
		display: block;
		margin: 10px;
	}
	.form-label{
		display: block;
		width: 100%;
	}
	.form-input{
		display: block;
		width: 100%;
	}
}