I'm not sure where I went wrong but my bootstrap form won't work as is because I can't type anything into the form boxes. If I move the form boxes above the third div from the top the email box works and if I move them above the second div from the top both boxes work. Can anyone explain what's going on and how to fix this?

```
<div class ="container" style= "height:150px;">
    <div id="Logo" class="col-xs-12 col-md-11">
        <img id="CashPass" src="assets/images/CashPassLogo (2).png"/>
    </div>
</div>

<div class="container" style= "height:500px;" id="intro">
    <div id="HomeTopContainer" class="col-xs-12 col-md-8">
        <h3>
            Something <i>Something</i>
        </h3>
        <img id="Something" src="https://abc123.jpg"/>
    </div>

    <div id="signup"> <!--style="height:500px; padding-right: 10%;"-->
        <div class="col-xs-6 col-md-4">
            <h1 class="hit">
                Something
            </h1>
            <form class="form" name="form" ng-submit="signUp()" novalidate>
                <div  class="form-group"
                      ng-class="{ 'has-success': form.email.$valid && submitted, 'has-error': form.email.$invalid && submitted }">
                    <!--<label>Email</label>-->
                    <input type="email" name="email" class="form-control" placeholder = "Email" ng-model="user.email" required/>
                </div>

                <div class="form-group"
                     ng-class="{ 'has-success': form.password.$valid && submitted, 'has-error': form.password.$invalid && submitted }">
                    <!--<label>Password</label>-->
                    <input type="password" name="password" class="form-control" placeholder = "Password" ng-model="user.password"
                           ng-minlength="3"
                           required/>
                    <p class="help-block"
                       ng-show="(form.password.$error.minlength || form.password.$error.required) && submitted">
                        Password must be at least 3 characters.
                    </p>
                </div>
            </form>
        </div>
    </div>

    <div class= "hit">
        <button class="btn btn-inverse btn-lg btn-login" id = "Join" type="submit">
            Join
        </button>
        <a class="btn btn-default btn-lg btn-register" id = "login" href="/stuff">
            Login
        </a>
    </div>

```

The SCSS is as follows:

```
.hit {
  position: relative;
  padding: 30px 15px;
  /*color: #F5F5F5;*/
  text-align: center;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  /*background: #4393B9;*/
  .center-block{};
}

.center-block {
  font-size: 5em;
  width: 150px;
  height: 150px;
  text-align: center;
};

/*id*/

#intro {
  background-color: #add8e6;
}

#glyphicon{
  text-align: right;
  font-size: 5em;
}

#HomeTopContainer {
  text-align: center;
}

#signup{
  margin-left: auto;
  margin-right: auto;
}

#bottomborder{
  height: 75px;
  background-color: #19469D;
  margin-top: -7px;
  text-align: center;
  font-size: 20px;
}

```