The layout of my login page has been a problem

[zh-ngk-i]

This is my login view

<main class="auth-main" style="padding-top:150px;">
    <div class="auth-block">
        <h1>Sign in</h1>
        <a class="auth-link">DP System</a>
        <form class="form-horizontal">
            <div class="form-group">
                <label for="email" class="col-sm-2 control-label">Username</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="email" ng-model="username" placeholder="email" required>
                </div>
            </div>
            <div class="form-group">
                <label for="Password" class="col-sm-2 control-label">Password</label>
                <div class="col-sm-10">
                    <input type="password" class="form-control" id="Password" ng-model="password" placeholder="Password" required>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" data-ng-disabled="!username || !password" ng-click="signIn()" class="btn btn-default btn-auth">Sign in</button>
                  <!--  <a href="#/signin/forgot" class="forgot-pass">Forgot password?</a>-->
                </div>
            </div>
        </form>
    </div>
</main>

======================================================
auth-main.css Did not work

[zh-ngk-i]

The whole page was pulled up horizontally，Do not know why, this css is not working。。。。

[niroshn]

@zh-ngk-i Can you add screenshot here?

[am-firnas]

There's no css file named auth-main.css but auth.css.Also note that the project is built with gulp eco system so it should be gulp serve in order to run the application after npm packages install.
The typical way of opening the HTML file doesn't load the css's.

Thanks.