.input-form {
    background: transparent;
    width: auto;
    margin: 0px auto;
    position: relative;
}

#contact input[type="text"], #contact input[type="email"], #contact textarea, #contact button[type="submit"]
{ font:400 12px/16px "Urbanist", sans-serif; color: var(--dark-color); }

#contact {
    background: light-dark(var(--dark-bg), var(--light-bg));
    padding: 25px;
    border: 2px solid light-dark(rgba(0, 0, 0, .7), rgba(250, 250, 250, .7));
    border-radius: 12px;
    margin: 50px 0px;
}

#contact h3 {
    display: block;
    color: light-dark(var(--light-bg), var(--dark-bg));
}

#contact h4 {
    margin: 5px 0px 15px;
    display: block;
    font-size: 13px;
}

fieldset {
    border: medium none !important;
    margin: 0px 0px 10px;
    min-width: 100px;
    padding: 0px;
    width: 100%;
    background: transparent;
}

#contact input[type="text"], #contact input[type="email"], #contact textarea {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    border: 1px solid light-dark(var(--light-color), var(--dark-color));
    background: rgba(0, 0, 0, .1);
    margin: 0px 0px 5px;
    padding: 10px;
}

#contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact textarea:hover {
	-webkit-transition: border-color 0.3s ease-in-out;
	-moz-transition: border-color 0.3s ease-in-out;
	transition: border-color 0.3s ease-in-out;
	border: 1px solid light-dark(var(--light-hover), var(--dark-hover));
}

#contact textarea {
	height: 100px;
	max-width: 100%;
    resize: none;
}

#contact button[type="submit"] {
	cursor: pointer;
	width: 100%;
	border: none;
	background: light-dark(var(--light-active), var(--dark-active));
	color: light-dark(var(--light-color), var(--light-color));
	margin: 0 0 5px;
	padding: 10px;
	font-size: 15px;
}

#contact button[type="submit"]:hover {
	background: light-dark(var(--light-hover), var(--dark-hover));
    color: var(--light-color);
	-webkit-transition: background 0.3s ease-in-out;
	-moz-transition: background 0.3s ease-in-out;
	transition: background-color 0.3s ease-in-out;
}

#contact button[type="submit"]:active { box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5); }

#contact input:focus, #contact textarea:focus {
	outline: 0;
	border: 1px solid light-dark(var(--light-hover), var(--dark-hover));
}
::-webkit-input-placeholder {
 color: #888;
}
:-moz-placeholder {
 color: #888;
}
::-moz-placeholder {
 color: #888;
}
:-ms-input-placeholder {
 color: #888;
}