For the life of me, I cannot figure out why this home page loads at the bottom. Is this an angular ui-router, angular, javascript or CSS issue? I've been stuck on this for two hours and not knowing why my html page loads at the bottom instead of the top is really killing my self-esteem as a programmer :/

Here is the home page: [ URL Redacted ]

UPDATE --
I solved this issue. It was with Angular UI-Router. See my answer below for the simple fix.

I use Angular and Angular UI-Router and the set up looks like this...

default.jade

  doctype html

  html(lang='en', xmlns='http://www.w3.org/1999/xhtml', xmlns:fb='https://www.facebook.com/2008/fbml', itemscope='itemscope', itemtype='http://schema.org/Product')

  include ../includes/head

  body(ng-controller=RootController)

  block content

  include ../includes/foot

index.jade

extends layouts/default



block content

  section.container

    div(ui-view=header)

    div(ui-view=content)

    div(ui-view=footer)

Angular Config.js

window.app.config(function($stateProvider, $urlRouterProvider) {

// For any unmatched url, redirect to /

$urlRouterProvider.otherwise(/);

// Now set up the states

$stateProvider

    .state('home', {

      url: /,

      views: {

        header:    { templateUrl: views/header/home.html   },

        content:   { templateUrl: views/content/home.html  },

        footer:    { templateUrl: views/footer/footer.html }

      },

      resolve: { factory: setRoot }

    })

    .state('signin', {

      url: /signin,

      views: {

        header:    { templateUrl: views/header/signin.html   },

        content:   { templateUrl: views/content/signin.html  },

        footer:    { templateUrl: views/footer/footer.html }

      },

      resolve: { factory: setRoot }

    })