* {
  margin: 0;
  padding: 0;
}

/*create a location for your form per your preference this put the form in the middle of the page*/
.contactform{
	width:inherit;
	height:550px;
	background-color:#f2f4f0;
}

.contactform p {
  padding-top: 20px;
  margin-bottom: 10px;
  text-align: center;
font-family:'Raleway', sans-serif; font-size: 2.5em;
  font-weight: 700;
	/*Use your preferred colors for p*/
  color:#4b306a;
}

.contactform h4{
	 padding-top: 10px;
  margin-bottom: 5px;
  text-align: center;
font-family:'Raleway', sans-serif; font-size:1em;
	/*Use your preferred colors for p*/
  color:#4b306a;
}

.contact-form {
  width: 300px;
  margin: 0 auto;
}

.contact-form input {
  width: 94%;
  height: 40px;
  padding: 0 3%;
  margin-top: 10px;
  border: none;
  border-radius: 4px;
	/*Use your preferred background color and box-shadow color*/
  background-color: #98a989;
  box-shadow: 0px 3px 0px 0px #58684b;
  font-size: 20px;
  font-family:'Raleway', sans-serif;
  font-weight: 400;
/*use your preferred color*/
  color: #FFFFFF;
}

.contact-form textarea {
  width: 94%;
  height: 200px;
  padding: 10px 3%;
  margin-top: 10px;
  border: none;
  border-radius: 4px;
	/*Use your preferred background color and box-shadow color*/
  background-color: #98a989;
  box-shadow: 0px 3px 0px 0px #58684b;
  font-size: 20px;
  font-weight: 400;
  font-family: sans-serif;
	/*use your preferred color*/
  color: #FFFFFF;
  resize: none;
}

.contact-form button {
  display: block;
  width: 40%;
  height: 40px;
  margin: 10px auto 0;
  border: none;
  border-radius: 4px;
/*Use your preferred background color */
  background-color: #6f479a;
  font-size: 20px;
  font-family:'Raleway', sans-serif;
  font-weight: 700;
	/*use your preferred color*/
  color: #FFFFFF;
	/*Use your box-shadow color*/
  box-shadow: 0px 5px 0px 0px #4b306a;
  cursor: pointer;
}

.contact-form button:hover {
  box-shadow: 0px 5px 0px 0px transparent;
  position: relative;
  top: 5px;
}
/*This color is for the font color of the placeholder type*/
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #4b306a;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #4b306a;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #4b306a;
}
:-moz-placeholder { /* Firefox 18- */
  color: #4b306a5;
}

input:focus, textarea:focus {
  box-shadow: 0px 3px 0px 0px transparent;
  position: relative;
  top: 3px;
}