.js-float-label-wrapper {
	position: relative;
}

.js-float-label-wrapper label {
	position: absolute;
	top: 1em; left: 1em;
	opacity: 0;
	z-index: 1;
}

.js-float-label-wrapper.focused label,
.js-float-label-wrapper.populated label {
	opacity: 1
}

.js-float-label-wrapper.focused input,
.js-float-label-wrapper.populated input,
.js-float-label-wrapper.focused textarea,
.js-float-label-wrapper.populated textarea {
	padding-top: 2em;
}

.js-float-label-wrapper input,
.js-float-label-wrapper textarea,
.js-float-label-wrapper label {
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-ms-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}


.js-float-label-wrapper label {
	font-weight: 500;
}

.js-float-label-wrapper.focused label,
.js-float-label-wrapper.populated label {
	color: #999;
}

.js-float-label-wrapper.focused.populated label {
	color: #666;
}


input,
textarea {
	display: block;
	width: 320px;
	margin: 20px 0;
	padding: 1em;
	color: #666;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;

	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;

	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
	        border-radius: 0;
}

label {
	font-size: 0.75em;
	color: #666;
}

input:focus,
textarea:focus {
		color: #333;

		-webkit-outline: none;
		-moz-outline: none;
		outline: none;
	}