.contact{
	background-color: rgb(235, 235, 235);
	display: flex;
	flex-direction: column;
	text-align: center;
}
.contacttitle{
	text-align: center;
	font-size: 300%;
	color: gray;
	margin: 0px;
	padding-top: 10px;
}
.stuff{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
}

.socialmedia{
	display: flex;
	flex-direction: column;
}

.facebook, .email{
	display: flex;
	flex-direction: row;
	align-items: center;
	text-decoration: none;
	color: black;
	font-size: 300%;
}

.email img, .facebook img{
	width: 80px;
	margin-right: 20px;
}

.contactform{
	font-size: 120%;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	padding-top: 20px;
}

.formgroup{
	display: flex;
	flex-direction: column;
	margin-bottom: 10px;
	color: gray;
	width: 80%;
}

.formgroup input, .formgroup textarea{
	border: 1px solid rgba(128, 128, 128, 0.4);
	font-size: 100%;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.formgroup textarea{
	font-size: 70%;
	resize: none;
}

.contactform button{
	width: 80%;
	border: none;
	outline: none;
	padding: 10px;
	font-family: "Alegreya", serif;
	font-size: 120%;
	border-radius: 10px;
	box-shadow: 5px 5px 10px gray;
	cursor: pointer;
	margin-top: 10px;
	transition: .3s ease;
}

.contactform button:hover{
	background-color: #64c4bc;
}

@media screen and (max-width: 1100px) {
	.email img, .facebook img{
		width:50px;
	}

}

@media screen and (max-width: 800px) {
	.stuff{
		flex-direction: column;
	}

	.facebook, .email{
		justify-content: center;
	}

	.contactform{
		align-items: center;
	}
	
}