Build a Survey Form formatting

Tell us what’s happening:
Im finding difficulty in radio buttons and check boxes options alignment. I tried with text-align and margin properties, but cannot find the better way. Please suggest any other ways.

Your code so far

Survey Form

Let us know your expectations further

  <label  id="email-label" for="email">*Email: </label>
  <input type="email" name="email" id="email" placeholder="" pattern="[a-z0-9._%±]+@[a-z0-9.-]+.[a-z]{2,}$" required>
Your current role in the organisation: Select a value Developer Tester support Manager Senior Manager
   <div >
      <label> Gender: </label>
      <input type="radio" name="gender" id="choice1" value="male">
      <label  class="side-tab" for="choice1">Male</label><br>
     <input type="radio"  name="gender" id="choice2" value="female">
      <label class="side-tab" for="choice2">Female</label>

    <div >
      <label >Are you satisfied with our services?</label>
      <input type="radio" id="choice3" name="feedback" value="satisfied">
      <label for="choice3" class="side-tab"> Satisfied</label>
      <input type="radio"  id="choice4" name="feedback" value="not-satisfied">
      <label for="choice4" class="side-tab" > Not Satisfied</label>
 <!--      <input type="radio" id="choice5" name="feedback">
      <label for="choice5"> Not Sure</label>-->
  <label for="checkbox"> What did you like in the session?</label>
  <input type="checkbox" id="training" value="training" required> 
  <label for="training" class="side-tab"> training </label>
  <input type="checkbox" id="hands-on" value="hands-on">
  <label for="hands-on" class="side-tab"> hands-on</label>
      <label for="final-feedback">Please provide the suggestions:</label>
      <textarea rows="5" columns="200"> </textarea>
 <button type="Submit" id="submit">Submit</button>

background-color: cyan;
border-radius: 30px;
width: 900px;
margin: 50px 70px 0px 300px;

margin: 0px 0px 0px 200px;

vertical-align: middle;
position: relative;
margin-left: 100px;

margin-left: 400px;
margin-bottom: 10px;

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36.

Link to the challenge:

A simple fix would be making sure to wrap each row with a container divs then give

display:flex to your containers.

Doing so will place its children side by side.