input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	@extend %transit;
	width: 100%;
	outline: none;
	border: 1px solid #dddddd;
	border-radius: 5px;
	color: #878c9b;
	background: none;
	&:focus {
		border-color: #777777;
		color: $color__text-input-focus;
	}
}

select {
	@extend %transit;
	max-width: 100%;
	width: 100%;
	outline: none;
	border: 1px solid #eeeeee;
	border-radius: 5px;
	background: transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAECAYAAACzzX7wAAAABGdBTUEAALGPC/xhBQAAADdJREFUCB1jvHnzZsP////rGbAARkbGRkaQODZFIEl1dfUGuD6Qohs3bvwHYRAbLoHMAEmgSwIAG3IiSKCM+2YAAAAASUVORK5CYII=') no-repeat calc(100% - 5px) center;
	-moz-appearance: none;
	-webkit-appearance: none;
	&:focus {
		border-color: #777777;
	}
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
select {
	padding: 0 15px;
	height: 45px;
}

textarea {
	display: block;
	padding: 10px 15px;
	max-width: 100%;
	width: 100%;
	min-height: 200px;
}

::-webkit-resizer {
	width: 0;
	height: 30px;
	border-width: 0 0 17px 17px;
	border-style: solid;
	border-color: transparent transparent #dec8ae transparent;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
select:-webkit-autofill {
	transition: background-color 5000s ease-in-out 0s;
}

::-webkit-input-placeholder {
	opacity: 1;
	-webkit-transition: opacity .3s !important;
	transition: opacity .3s !important;
}

:-moz-placeholder {
	opacity: 1;
	-moz-transition: opacity .3s !important;
	transition: opacity .3s !important;
}

/* FF 4-18 */
::-moz-placeholder {
	opacity: 1;
	-moz-transition: opacity .3s !important;
	transition: opacity .3s !important;
}

/* FF 19+ */
:-ms-input-placeholder {
	opacity: 1;
	-ms-transition: opacity .3s !important;
	transition: opacity .3s !important;
}

/* IE 10+ */

*:focus::-webkit-input-placeholder {
	opacity: 0;
}

*:focus:-moz-placeholder {
	opacity: 0;
}

/* FF 4-18 */
*:focus::-moz-placeholder {
	opacity: 0;
}

/* FF 19+ */
*:focus:-ms-input-placeholder {
	opacity: 0;
}

/* IE 10+ */