Fix problems with sidebar/banner on mobile devices

The default behaviour for meny.js is to set the sidebar positioning to "fixed" using JS. This works fine, unless your sidebar is taller than your browser viewport (ie. mobile).

This fix sets the meny sidebar to position "absolute" when the viewport height is less than that of the viewport height. The sidebar will then scroll with the content allowing the user to see the bottom items.

**Caveat:** *The sidebar height it hardcoded. It would be better if it was dynamically calculated (ie. if menu items are frequently added or removed.)*

This also fixes the ``smartbanner`` for mobile devices that was partially covering the top of the page. The dirty hack was to change the positioning of the banner so it doesn't hide the top portion of the content/menu.

**Menu**

*Before*
![screenshot_2013-06-09-21-38-13](https://f.cloud.github.com/assets/1537017/630007/3a4dfc28-d184-11e2-9ac6-4d2fb8671198.png)

*After*
![screenshot_2013-06-10-00-09-37](https://f.cloud.github.com/assets/1537017/630004/f9c777d8-d183-11e2-93ac-88e01a91ec99.png)

**Smartbanner**

*Before*
![screenshot_2013-06-09-21-37-23](https://f.cloud.github.com/assets/1537017/630009/5685ee28-d184-11e2-8e7c-77746ec8336f.png)

*After*
![screenshot_2013-06-10-00-09-21](https://f.cloud.github.com/assets/1537017/630005/03650062-d184-11e2-9a70-6091df92a6f7.png)