How in bootstrap-vue make different labels/inputs layout on different devices

HTML-CSS
1

Hello,
Making form with bootstrap-vue, I got labels and relative inputs on different rows:

	<div class="p-4" >


		<b-form @submit="onSubmit" @reset="onReset" v-if="show" offset-md="2" offset-lg="3" >

			<b-form-group
					id="input-group-email"
					label="Email address:"
					label-for="input-1"
					description="We'll never share your email with anyone else."
			>
				<b-form-input
						id="input-1"
						v-model="form.email"
						type="email"
						required
						placeholder="Enter email"
				></b-form-input>
			</b-form-group>

			<b-form-group id="input-group-name" label="Your Name:" label-for="input-2">
				<b-form-input
						id="input-2"
						v-model="form.name"
						required
						placeholder="Enter name"
				></b-form-input>
			</b-form-group>
            ...

In which way have I to remake this form to have labels and relative inputs on different rows
on small and extra small devices, but on onerow and nediun and large devices ?

“bootstrap-vue”: “^2.1.0”
“vue”: “^2.6.10”

Thanks!