*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	outline: none;
}

body{
	background: #EAF4EC;
}

.logo {
	margin: auto;
	width: 50%;
  	padding: 10px;
}

path {
	stroke: #FFFFFF;
	fill: #FFFFFF;
	stroke-dasharray: 1800;
	opacity: 10;
	animation: animate 3s;
}

@keyframes animate {
	0% {
		opacity: 0;
		fill: none;
		stroke-dashoffset: 1800;
	}

	30% {
		opacity: 5;
		fill: none;
		stroke-dashoffset: 1800;
	}

	90% {
		fill: rgba(255,255,255,0);
	}

	100% {
		opacity: 10;
		fill:rgba(255,255,255,1);
		stroke-dashoffset: 0;
	}
}


.wrapper{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	max-width: 350px;
	width: 100%;
	background: #fff;
	padding: 25px;
	border-radius: 5px;
	box-shadow: 4px 4px 2px rgba(105,105,105);
}
.wrapper h2{
	text-align: center;
	margin-bottom: 20px;
	text-transform: uppercase;
	font-family: Helvetica;
	letter-spacing: 3px;
	color: 	#000000; 
}
.wrapper .input_field{
	margin-bottom: 10px;
}
.wrapper .input_field input[type="text"],
.wrapper textarea{
	width: 100%;
	border: 1px solid #000000;
	padding: 10px;
}
.wrapper textarea{
	height: 80px;
	resize: none;
}
.wrapper .btn input[type="submit"]{
	border:0;
	margin-top: 15px;
	padding:10px;
	width:100%;
	background:#EAF4EC;
	color: #000000;
	text-transform: uppercase;
	letter-spacing: 5px;
	font-size: 15px;
	font-family: Helvetica;
	font-weight: bold;
	border-radius: 25px;
	cursor: pointer; 
}
.wrapper #error_message{
	margin-bottom: 20px;
	padding: 0px;
	background: #000000;
	text-align: center;
	font-family: Helvetica;
	font-size: 14px;
	color: #FFFFFF;
	transition: all 0.5s ease;
}