.container { justify-content: center; display: flex; align-items: center; align-content: center; } .form { width: 50vw; } .form-input { margin-bottom: 40px; display: flex; justify-content: flex-start; flex-direction: column; flex-wrap: wrap; } .form-input input[type='text'], .form-input input[type='password'], .form-input input[type='email'] { background-color: #FFFFFF; border: 1px solid #D6D9DC; border-radius: 3px; width: 100%; padding: 7px; font-size: 14px; } .form-input label { margin-bottom: 15px; } @media only screen and (min-width: 700px) { .container { height: 95vh; } .sidebar { width: 50vw; } .form { width: 50vw; } .form-input { flex-direction: row; align-items: flex-start; /* To avoid stretching */ margin-bottom: 20px; } .form-input input[type='text'], .form-input input[type='password'], .form-input input[type='email'] { width: 250px; height: initial; } .form-input label { text-align: right; width: 120px; margin-top: 7px; padding-right: 20px; } }