.input-box {
	display: flex;
    flex-direction: column;
	width: 40%;
	margin-right: 10%;

	font-size: 1.3rem;
	font-weight: 600;

	&__input {
		font-family: inherit;
		color: inherit;
		font-size: 1.5rem;
		padding: 0.5rem 1rem;
		border-radius: 2px;
		background-color: rgba(255, 255, 255, 0.5);
		border: none;
		border-bottom: 3px solid #eee;
		display: inline-block;
        transition: all 0.3s;
        margin-bottom: 1rem;

		&:focus {
			outline: none;
			box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
			border-bottom: 3px solid #5acec2;
		}

		&--fail {
			border-bottom: 3px solid #9e4560;
		}

		&::placeholder {
			font-size: 1.3rem;
			color:  #cecece;
		}

	}

	&.-wide{
		width: 100%;
		margin-right: 0;
	}

}