</div>
      <div class="row wrapper border-bottom white-bg page-heading">
          <div class="col-lg-8">
              <h2>Tellus Institute</h2>
          </div>
          <div class="col-lg-4" style="margin-top: 20px; text-align: right;">

              <button type="button" class="btn btn-default btn-sm" ui-sref="index.flightDept">Cancel</button>

              <button type="button" class="btn btn-primary btn-sm" ng-click="userData()">Save Changes</button>

          </div>
      </div>
  </div>
  <div class="wrapper wrapper-content animated fadeInRight">
      <div class="row">
          <div class="col-lg-7">
              <div class="ibox float-e-margins">
                  <div class="ibox-title">
                      <div class="pull-left">
                          <h5>Contact Information</h5>
                      </div>
                      <div class="pull-right my-toggle-switch">
                          <div class="switch">
                              <div class="onoffswitch">

                                  <input type="checkbox" ng-checked="status === true" ng-model="status" ng-init="status = true" class="onoffswitch-checkbox" id="example1">

                                  <label class="onoffswitch-label" for="example1">
                                      <span class="onoffswitch-inner"></span>
                                      <span class="onoffswitch-switch"></span>
                                  </label>
                              </div>
                          </div>
                      </div>
                      <div class="clearfix"></div>
                  </div>
                  <div class="ibox-content">
                      <div class="row">
                          <form role="form">
                              <div class="col-sm-6 b-r">

                                      <!-- <div class="form-group"><label>Company Name</label> <input type="text" placeholder="Company Name" ng-model="user.companyName" class="form-control"></div> -->

                                      <div class="form-group"><label>Username</label> <input type="email" placeholder="Email Username" ng-model="user.email" class="form-control"></div>
                                      <div class="form-group"><label>First Name</label> <input type="text" placeholder="First Name" ng-model="user.firstName" class="form-control"></div>
                                      <div class="form-group"><label>Last Name</label> <input type="text" placeholder="Last Name" ng-model="user.lastName" class="form-control"></div>

                                      <!-- <div>
                                          <button class="btn btn-sm btn-primary pull-right m-t-n-xs" type="submit"><strong>Log in</strong></button>
                                          <label> <input type="checkbox" class="i-checks"> Remember me </label>
                                      </div> -->
                                  
                              </div>
                              <div class="col-sm-6">

                                  <div class="form-group"><label>Password</label> <input type="password" ng-model="user.password" placeholder="Password" class="form-control"></div>
                                  <div class="form-group"><label>Phone</label> <input type="number" ng-model="user.phone" placeholder="Phone" class="form-control"></div>
                                  <div class="form-group"><label>Mobile</label> <input type="number" ng-model="user.mobile" placeholder="Mobile" class="form-control"></div>

                              </div>
                          </form>
                      </div>
                  </div>
              </div>
          </div>
          <div class="col-lg-5">
              <div class="ibox float-e-margins">
                  <div class="ibox-title">
                      <h5>Client Notes</h5>
                      
                  </div>
                  <div class="ibox-content">
                      <div class="row">
                          <form role="form">

                              <textarea class="form-control" rows="10" ng-model="user.clientNote" id="comment"></textarea>

                          </form>
                      </div>
                  </div>
                  
              </div>
          </div>
      </div>
  </div>
  
  <div>

    <div class="row">
        <div class="col-lg-7">
            <div class="ibox float-e-margins">
                <div class="ibox-title">

                  <h5>Aircraft List</h5>

                  <div class="pull-right">

                    <button type="button" class="btn btn-primary btn-sm" ng-click="openModal()">+ Add</button>

                  </div>
                  <div class="clearfix"></div>

                  <div class="modal inmodal" id="myModal4" tabindex="-1" role="dialog"  aria-hidden="true">
                      <div class="modal-dialog">
                          <div class="modal-content animated fadeIn">
                              <div class="modal-header">
                                  <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                  <!-- <i class="fa fa-clock-o modal-icon"></i> -->
                                  <h4 class="modal-title">Add Aircraft</h4>
                                  <!-- <small>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</small> -->
                              </div>
                              <div class="modal-body" style="padding: 15px;">
                                  <table class="table table-bordered table-hover table-striped">
                                    <thead>
                                      <tr>
                                        <th>Tail</th>
                                        <th>Make</th>
                                        <th>Model</th>
                                        <th>Size</th>
                                      </tr>
                                    </thead>
                                    <tbody>
                                      <tr>
                                        <td>

                                          <input type="text" style="width:100px;" ng-model="aircraft.tail" class="form-control">

                                        </td>

                                        <td style="width: 30%">
                                          <select class="form-control" ng-model="aircraft.make" ng-change="getModal()">
                                             <option ng-repeat="make in aircraftMakeList">{{make}}</option>

                                          </select>
                                        </td>

                                        <td style="width: 30%">

                                          <select class="form-control">

                                             <option ng-repeat="model in aircraftModalList" ng-model="aircraft.model">{{model}}</option>

                                          </select>
                                        </td>

                                        <td style="width: 30%">

                                          <select class="form-control">

                                             <option ng-repeat="size in aircraftSizeList" ng-model="aircraft.size">{{size}}</option>

                                          </select>
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                              </div>
                              <div class="modal-footer">
                                  <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>

                                  <button type="button" class="btn btn-primary" ng-click="addAircraft()">Save changes</button>

                              </div>
                          </div>
                      </div>
                  </div>

                </div>

                <div class="ibox-content">

                  <div class="table-responsive">
                    <table class="table table-bordered table-hover table-striped">
                      <thead>
                        <tr>
                          <th>Tail</th>
                          <th>Make</th>
                          <th>Model</th>
                          <th>Size</th>

                        </tr>
                      </thead>
                      <tbody>

                        <tr ng-repeat="airData in getCraftList track by $index">

                          <td>

                            <input type="text" style="width:100px;" ng-model="airData.tail" class="form-control">

                          </td>
                          <td>

                            <select class="form-control" ng-model="airData.make">
                               <option>{{airData.make}}</option>

                            </select>
                          </td>
                          <td>

                            <select class="form-control" ng-model="airData.model">
                               <option>{{airData.model}}</option>

                            </select>
                          </td>
                          <td>

                            <select class="form-control" ng-model="airData.size">
                               <option>{{airData.size}}</option>

                            </select>
                          </td>
                        </tr>
                      </tbody>
                    </table>

                  </div>

                       <div class="clearfix"></div>
                    </div>
                 </div>

              </div>

              <div class="col-lg-5">
                  <div class="ibox float-e-margins">
                      <div class="ibox-title">
                          <h5>Account Authenticatio & Payment Method</h5>
                          
                      </div>
                      <div class="ibox-content">
                         <!--  <div class="row">
                              <div class="col-md-3">
                                  <img src="images/master.png">
                              </div>
                              <div class="col-md-9">
                                  <div class="col">
                                      <span style="font-size: large; color: #909394;">**** **** **** 7002</span>
                                  </div>
                                  <div class="col">
                                      <span><strong>Expiry Date:</strong>10/16</span>
                                  </div>
                              </div>
                              <div class="clearfix"></div>
                              <br>
  
                              <div class="col-md-3">
                                  <img src="images/visa1.png">
                              </div>
                              <div class="col-md-9">
                                  <div class="col">
                                      <span style="font-size: large; color: #909394;">**** **** **** 1060</span>
                                  </div>
                                  <div class="col">
                                      <span><strong>Expiry Date:</strong>10/16</span>
                                  </div>
                              </div>
                              <div class="clearfix"></div>
                          </div> -->
  
  
                          <div class="row">

                              <!-- <form name="myForm">

                                  <div class="span3">
                                      <label for="">Card number</label>
                                      <input type="text" class="form-control" ng-model="number">
                                  </div>

                                  <div class="span3">
                                      <label for="">Name on card </label>
                                      <input type="text" class="form-control">
                                  </div>

                                  <div class="row"> 
                                      <div class="col-sm-6">
                                          <label for="">Expiry</label>
                                          <input type="text" class="form-control" ng-model="expiry">
                                      </div>

                                      <div class="col-sm-6">
                                          <label for="">CVV</label>
                                          <input type="text" class="form-control" ng-model="cvc">
                                      </div>
                                  </div>
                                  <div class="span4">
                                      <button type="submit" class="btn btn-primary btn-large">Add</button>
                                  </div>
                                  
                              </form> -->

                              <div class="container">
                                  <div class="row">
                                    <div class="col-xs-12 col-md-4">
                                       <div class="panel panel-default credit-card-box">
                                          <div class="panel-heading display-table" >
                                             <div class="row display-tr" >
                                                <h3 class="panel-title display-td" >Payment Details</h3>
                                                <div class="display-td" >                            
                                                   <img class="img-responsive pull-right" src="http://i76.imgup.net/accepted_c22e0.png">
                                                </div>
                                             </div>

                                          </div>

                                          <div class="panel-body">
                                             <form role="form" id="payment-form">
                                                <div class="row">
                                                   <div class="col-xs-12">
                                                      <div class="form-group">
                                                         <label for="cardNumber">CARD NUMBER</label>
                                                         <div class="input-group">
                                                            <input type="number" ng-model="data.cardNumber" maxlength="16" oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);" class="form-control" name="cardNumber" placeholder="Valid Card Number" autocomplete="cc-number" required autofocus>
                                                            <span class="input-group-addon"><i class="fa fa-credit-card"></i></span>
                                                         </div>
                                                      </div>
                                                   </div>
                                                </div>
                                                <div class="row">
                                                   <div class="col-xs-7 col-md-7">
                                                      <div class="form-group">
                                                         <label for="cardExpiry"><span class="hidden-xs">EXPIRATION</span><span class="visible-xs-inline">EXP</span> DATE</label>
                                                         <input type="text" ng-model="data.expiryDate" class="form-control" name="cardExpiry" placeholder="MM / YY" autocomplete="cc-exp"
                                                            required>
                                                      </div>
                                                   </div>
                                                   <div class="col-xs-5 col-md-5 pull-right">
                                                      <div class="form-group">

                                                         <label for="cardCVC">CVV CODE</label>

                                                         <input type="number"  maxlength="3" oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);" class="form-control" name="cardCVC" placeholder="CVC" autocomplete="cc-csc"
                                                            required>
                                                      </div>
                                                   </div>
                                                </div>
                                                <div class="row">
                                                   <div class="col-xs-12">
                                                      <div class="form-group">
                                                         <label for="name">Card Type</label>
                                                          <select class="form-control m-b" name="account" ng-model="data.cardType" style="margin-bottom: 0;">
                                                              <option value="creditCard" selected>Credit Card</option>
                                                              <option value="debitCard">Debit Card</option>
                                                          </select>
                                                      </div>
                                                   </div>
                                                </div>
                                                <div class="row">
                                                   <div class="col-xs-12">

                                                      <button class="btn btn-success btn-lg btn-block" type="submit" ng-click="addCard()">Add</button>

                                                   </div>
                                                </div>
                                                <div class="row" style="display:none;">
                                                   <div class="col-xs-12">
                                                      <p class="payment-errors"></p>
                                                   </div>
                                                </div>
                                             </form>

                                          </div>

                                       </div>
                                    </div>

                                  </div>
                              </div>
                          </div>

                      </div>

                  </div>
              </div>

          </div>
      </div>

  </div>
  <script type="text/javascript" src="https://js.stripe.com/v2/"></script>