How to align properly?

I have to align the fields(right) as shown in below image.Here is my code built in Angularjs using label tag for all the legends in form and i styled using CSS.Please help me getting correct alignment, so that i can submit this to higher officials.It’s very urgent.

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<head>
<title> SAP WORKBENCH </title>
<style>
	body{
	background-color: lightgray;
	margin-left: 500px
	}
	.option{
	width: 300px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	}
	.button{
	width: 300px;
	}
</style>
</head>
	<h2>Password Reset</h2>
	<body>
		<div ng-app="">
			<b></b>
			<form>
				<label>System:</label>
					<select class="option" ng-model="myVar">
						<option></option>
						<option value = "DR9">DR9</option>
						<option value = "QR9">QR9</option>
						<option value = "PR3">PR3</option>
					</select>
				<br><br>
				<div ng-switch="myVar">
						<label>Client:</label>
						<select class="option" ng-switch-when="DR9">
							<option>100</option>
							<option>400</option>
							<option>500</option>		
						</select>
						<select class="option" ng-switch-when="QR9">
							<option>500</option>
						</select>
						<select class="option" ng-switch-when="PR3">
							<option>500</option>
						</select>
						<select class="option" ng-switch-default>
							<option></option>	
						</select>
					</div>
				<br>
				<label>User:</label> 
				<input class="option" type="text" placeholder="Enter User Id.."></input>
				<br><br>
				<label>New Password:</label>
				<input class="option" type="password"></input>
				<br><br>
				<label>Re-Enter New Password:</label>
				<input class="option" type="password"></input>
				<br><br>
				<input class="button" type="button" value="Reset">
			</form>
		</div>
    </body>
</html>

Image

Source: AngularJS