Merge remote-tracking branch 'origin' into category-whitelisting

2025-11-06 14:05:46 +01:00 · 2013-11-27 08:17:23 -05:00
parent 18009ebb39 3a8dca6fb9
commit 4e2326fc84
132 changed files with 4223 additions and 4912 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -12,3 +12,6 @@ public/css/*.css
 Vagrantfile
 .vagrant
 provision.sh
+*.komodoproject
+
+feeds/recent.rss
--- a/README.md
+++ b/README.md
@@ -1,16 +1,16 @@
-
 # NodeBB
 **NodeBB** is a robust Node.js driven forum built on a redis database. It is powered by web sockets, and is compatible down to IE8.

 * [NodeBB Homepage](http://www.nodebb.org/ "NodeBB")
 * [Demo & Meta Discussion](http://try.nodebb.org)
+* [Wiki Guides](https://github.com/designcreateplay/NodeBB/wiki) - includes setup for other platforms
 * [Join us on IRC](https://kiwiirc.com/client/irc.freenode.net/nodebb) - #nodebb on Freenode
 * [Follow on Twitter](http://www.twitter.com/NodeBB/ "NodeBB Twitter")
 * [Like us on Facebook](http://www.facebook.com/NodeBB/ "NodeBB Facebook")

 ![NodeBB Main Category Listing](http://i.imgur.com/zffCFoh.png)

-![NodeBB Topic Page](http://i.imgur.com/tcHW08M.png)
+![NodeBB Topic Page](http://i.imgur.com/JihdcUa.png)

 ## How can I follow along/contribute?

--- a/app.js
+++ b/app.js
@@ -55,7 +55,7 @@
 	winston.info('');


-	if (!nconf.get('help') && !nconf.get('setup') && !nconf.get('upgrade') && fs.existsSync(__dirname + '/config.json')) {
+	if (!nconf.get('help') && !nconf.get('setup') && !nconf.get('install') && !nconf.get('upgrade') && fs.existsSync(__dirname + '/config.json')) {
 		// Load server-side configs
 		nconf.file({
 			file: __dirname + '/config.json'
@@ -64,6 +64,7 @@

 		nconf.set('url', nconf.get('base_url') + (nconf.get('use_port') ? ':' + nconf.get('port') : '') + nconf.get('relative_path') + '/');
 		nconf.set('upload_url', nconf.get('url') + 'uploads/');
+		nconf.set('base_dir', __dirname);

 		winston.info('Initializing NodeBB v' + pkg.version + ', on port ' + nconf.get('port') + ', using Redis store at ' + nconf.get('redis:host') + ':' + nconf.get('redis:port') + '.');
 		winston.info('NodeBB instance bound to: ' + ((nconf.get('bind_address') === "0.0.0.0" || !nconf.get('bind_address')) ? 'Any address (0.0.0.0)' : nconf.get('bind_address')));
@@ -88,8 +89,11 @@
 				websockets = require('./src/websockets.js'),
 				posts = require('./src/posts.js'),
 				plugins = require('./src/plugins'), // Don't remove this - plugins initializes itself
-				Notifications = require('./src/notifications');
+				Notifications = require('./src/notifications'),
+				Upgrade = require('./src/upgrade');

+			Upgrade.check(function(schema_ok) {
+				if (schema_ok || nconf.get('check-schema') === false) {
 					websockets.init(SocketIO);

 					global.templates = {};
@@ -109,11 +113,21 @@
 					], customTemplates);


+					plugins.ready(function() {
 						templates.ready(webserver.init);
+					});

 					Notifications.init();
+				} else {
+					winston.warn('Your NodeBB schema is out-of-date. Please run the following command to bring your dataset up to spec:');
+					winston.warn('    node app --upgrade');
+					winston.warn('To ignore this error (not recommended):');
+					winston.warn('    node app --no-check-schema')
+					process.exit();
+				}
 			});
-	} else if (nconf.get('setup') || !fs.existsSync(__dirname + '/config.json')) {
+		});
+	} else if (nconf.get('setup') || nconf.get('install') || !fs.existsSync(__dirname + '/config.json')) {
 		// New install, ask setup questions
 		if (nconf.get('setup')) {
 			winston.info('NodeBB Setup Triggered via Command Line');
--- a/install/data/categories.json
+++ b/install/data/categories.json
@@ -3,84 +3,84 @@
        "name": "Announcements",
        "description": "Announcements regarding our community",
        "blockclass": "category-blue",
-        "icon" : "icon-bullhorn",
+        "icon" : "fa-bullhorn",
        "order": 1
    },
    {
        "name": "General Discussion",
        "description": "A place to talk about whateeeever you want",
        "blockclass": "category-blue",
-        "icon" : "icon-comment",
+        "icon" : "fa-comment",
        "order": 2
    },
    {
        "name": "NodeBB Development",
        "description": "NodeBB development news and announcements",
        "blockclass": "category-blue",
-        "icon" : "icon-github",
+        "icon" : "fa-github",
        "order": 3
    },
    {
        "name": "Blogs",
        "description": "Blog posts from individual members",
        "blockclass": "category-blue",
-        "icon" : "icon-pencil",
+        "icon" : "fa-pencil",
        "order": 4
    },
    {
        "name": "Feature Requests",
        "description": "Got a feature request you'd like to see? Give us a shout here.",
        "blockclass": "category-purple",
-        "icon" : "icon-lightbulb",
+        "icon" : "fa-lightbulb-o",
        "order": 5
    },
    {
        "name": "Bug Reports",
        "description": "Having trouble with NodeBB? Let us know...",
        "blockclass": "category-purple",
-        "icon" : "icon-cogs",
+        "icon" : "fa-cogs",
        "order": 6
    },
    {
        "name": "NodeBB Plugins",
        "description": "Enhance your NodeBB with plugins!",
        "blockclass": "category-purple",
-        "icon" : "icon-plus-sign",
+        "icon" : "fa-plus-square",
        "order": 7
    },
    {
        "name": "NodeBB Link Exchange",
        "description": "Link exchange",
        "blockclass": "category-purple",
-        "icon" : "icon-exchange",
+        "icon" : "fa-exchange",
        "order": 8
    },
    {
        "name": "News",
        "description": "News from around the world",
        "blockclass": "category-darkblue",
-        "icon" : "icon-globe",
+        "icon" : "fa-globe",
        "order": 9
    },
    {
        "name": "Movies",
        "description": "Discuss the latest movies here",
        "blockclass": "category-darkblue",
-        "icon" : "icon-film",
+        "icon" : "fa-film",
        "order": 10
    },
    {
        "name": "Games",
        "description": "Discuss the latest games here",
        "blockclass": "category-darkblue",
-        "icon" : "icon-screenshot",
+        "icon" : "fa-crosshairs",
        "order": 11
    },
    {
        "name": "Random",
        "description": "Anything and (almost) everything welcome!",
        "blockclass": "category-darkblue",
-        "icon" : "icon-beer",
+        "icon" : "fa-beer",
        "order": 12
    }
 ]
--- a/2
+++ b/2
@@ -1,4 +1,4 @@
-#!/bin/bash
+#!/bin/sh
 clear
 echo "Launching NodeBB in \"development\" mode."
 echo "To run the production build of NodeBB, please use \"forever\"."
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
  "name": "nodebb",
  "license": "GPLv3 or later",
  "description": "NodeBB Forum",
-  "version": "0.0.7",
+  "version": "0.1.1",
  "homepage": "http://www.nodebb.org",
  "repository": {
    "type": "git",
@@ -28,7 +28,7 @@
    "less-middleware": "0.1.12",
    "marked": "0.2.8",
    "bcrypt": "0.7.5",
-    "async": "0.2.8",
+    "async": "~0.2.8",
    "node-imagemagick": "0.1.8",
    "gravatar": "1.0.6",
    "nconf": "~0.6.7",
@@ -43,7 +43,7 @@
    "nodebb-plugin-mentions": "~0.1.14",
    "nodebb-plugin-markdown": "~0.1.8",
    "nodebb-theme-vanilla": "designcreateplay/nodebb-theme-vanilla",
-    "nodebb-theme-cerulean": "0.0.6",
+    "nodebb-theme-cerulean": "0.0.10",
    "cron": "~1.0.1"
  },
  "optionalDependencies": {
--- a/public/logo.png
+++ b/public/logo.png
--- a/public/src/ajaxify.js
+++ b/public/src/ajaxify.js
@@ -1,5 +1,6 @@
-var ajaxify = {};
+"use strict";

+var ajaxify = {};

 (function ($) {
 	/*global app, templates, utils*/
@@ -23,8 +24,9 @@ var ajaxify = {};

 	window.onpopstate = function (event) {
 		// "quiet": If set to true, will not call pushState
-		if (event !== null && event.state && event.state.url !== undefined)
+		if (event !== null && event.state && event.state.url !== undefined) {
 			ajaxify.go(event.state.url, null, null, true);
+		}
 	};

 	var pagination;
@@ -32,10 +34,13 @@ var ajaxify = {};
 	ajaxify.go = function (url, callback, template, quiet) {
 		// start: the following should be set like so: ajaxify.onchange(function(){}); where the code actually belongs
 		$(window).off('scroll');
-		app.enter_room('global');
+		app.enterRoom('global');

 		pagination = pagination || document.getElementById('pagination');
-		if (pagination) pagination.parentNode.style.display = 'none';
+		if (pagination) {
+			pagination.parentNode.style.display = 'none';
+		}
+
 		window.onscroll = null;
 		// end

@@ -62,37 +67,55 @@ var ajaxify = {};
 		}

 		if (templates.is_available(tpl_url) && !templates.force_refresh(tpl_url)) {
-			if (quiet !== true) {
 			if (window.history && window.history.pushState) {
-					window.history.pushState({
-						"url": url
-					}, url, RELATIVE_PATH + "/" + url);
+				window.history[!quiet ? 'pushState' : 'replaceState']({
+					url: url
+				}, url, RELATIVE_PATH + '/' + url);
+
+				$.ajax(RELATIVE_PATH + '/plugins/fireHook', {
+					type: 'PUT',
+					data: {
+						_csrf: $('#csrf_token').val(),
+						hook: 'page.load',
+						args: {
+							template: tpl_url,
+							url: url,
+							uid: app.uid
 						}
 					}
+				});
+			}

 			translator.load(tpl_url);

-			jQuery('#footer, #content').fadeOut(100);
+			jQuery('#footer, #content').addClass('ajaxifying');

 			templates.flush();
 			templates.load_template(function () {
 				exec_body_scripts(content);
 				require(['forum/' + tpl_url], function(script) {
-					if (script && script.init) script.init();
+					if (script && script.init) {
+						script.init();
+					}
 				});

 				if (callback) {
 					callback();
 				}

-				app.process_page();
+				app.processPage();

-				jQuery('#content, #footer').stop(true, true).fadeIn(200, function () {
-					if (window.location.hash)
+				jQuery('#content, #footer').stop(true, true).removeClass('ajaxifying');
+
+				if (window.location.hash) {
 					hash = window.location.hash;
-					if (hash)
-						app.scrollToPost(hash.substr(1));
+				}
+
+				if (hash) {
+					require(['forum/topic'], function(topic) {
+						topic.scrollToPost(hash.substr(1));
 					});
+				}

 				utils.refreshTitle(url);

@@ -105,23 +128,27 @@ var ajaxify = {};
 	};

 	$('document').ready(function () {
-		if (!window.history || !window.history.pushState) return; // no ajaxification for old browsers
+		if (!window.history || !window.history.pushState) {
+			return; // no ajaxification for old browsers
+		}

 		content = content || document.getElementById('content');

 		// Enhancing all anchors to ajaxify...
 		$(document.body).on('click', 'a', function (e) {
 			function hrefEmpty(href) {
-				return href == 'javascript:;' || href == window.location.href + "#" || href.slice(-1) === "#";
+				return href === 'javascript:;' || href === window.location.href + "#" || href.slice(-1) === "#";
 			}

-			if (hrefEmpty(this.href) || this.target !== '' || this.protocol === 'javascript:')
+			if (hrefEmpty(this.href) || this.target !== '' || this.protocol === 'javascript:') {
 				return;
+			}

-			if(!window.location.pathname.match(/\/(403|404)$/g))
+			if(!window.location.pathname.match(/\/(403|404)$/g)) {
 				app.previousUrl = window.location.href;
+			}

-			if (this.getAttribute('data-ajaxify') == 'false') {
+			if (this.getAttribute('data-ajaxify') === 'false') {
 				return;
 			}

--- a/public/src/app.js
+++ b/public/src/app.js
@@ -47,7 +47,7 @@ var socket,

 					socket.on('connect', function (data) {
 						if (reconnecting) {
-							reconnectEl.html('<i class="icon-ok"></i> Connected!');
+							reconnectEl.html('<i class="fa fa-check"></i> Connected!');
 							reconnecting = false;

 							setTimeout(function() {
@@ -75,7 +75,7 @@ var socket,
 						reconnecting = true;

 						reconnectEl.addClass('active');
-						reconnectEl.html('<i class="icon-spinner icon-spin"></i> Reconnecting...');
+						reconnectEl.html('<i class="fa fa-spinner fa-spin"></i> Reconnecting...');
 					});

 					socket.on('api:user.get_online_users', function (users) {
@@ -88,10 +88,10 @@ var socket,

 							if (uid && jQuery.inArray(uid, users) !== -1) {
 								el.find('i').remove();
-								el.prepend('<i class="icon-circle"></i>');
+								el.prepend('<i class="fa fa-circle"></i>');
 							} else {
 								el.find('i').remove();
-								el.prepend('<i class="icon-circle-blank"></i>');
+								el.prepend('<i class="fa fa-circle-o"></i>');
 							}

 							el.processed = true;
@@ -125,7 +125,7 @@ var socket,
 						setTimeout(app.logout, 1000);
 					});

-					app.enter_room('global');
+					app.enterRoom('global');
 				}
 			},
 			async: false
@@ -136,7 +136,7 @@ var socket,
 		$.post(RELATIVE_PATH + '/logout', {
 			_csrf: $('#csrf_token').val()
 		}, function() {
-			window.location = RELATIVE_PATH + '/';
+			window.location.href = RELATIVE_PATH + '/';
 		});
 	}

@@ -186,43 +186,35 @@ var socket,
 			clearTimeout(alert.attr('timeoutId'));
 			startTimeout(alert, params.timeout);
 		} else {
-			var div = document.createElement('div'),
-				button = document.createElement('button'),
-				strong = document.createElement('strong'),
-				p = document.createElement('p');
+			var div = $('<div id="' + alert_id + '" class="alert toaster-alert alert-' + params.type +'"></div>'),
+				button = $('<button class="close">&times;</button>'),
+				strong = $('<strong>' + title + '</strong>'),
+				p = $('<p>' + params.message + '</p>');

-			p.innerHTML = params.message;
-			strong.innerHTML = title;
+			div.append(button)
+				.append(strong)
+				.append(p);

-			div.className = "alert toaster-alert " + "alert-" + params.type;
-
-			div.setAttribute('id', alert_id);
-			div.appendChild(button);
-			div.appendChild(strong);
-			div.appendChild(p);
-
-			button.className = 'close';
-			button.innerHTML = '&times;';
-			button.onclick = function (ev) {
-				div.parentNode.removeChild(div);
-			}
+			button.on('click', function () {
+				div.remove();
+			});

 			if (params.location == null)
 				params.location = 'alert_window';

-			jQuery('#' + params.location).prepend(jQuery(div).fadeIn('100'));
+			$('#' + params.location).prepend(div.fadeIn('100'));

 			if (params.timeout) {
 				startTimeout(div, params.timeout);
 			}

 			if (params.clickfn) {
-				div.onclick = function () {
+				div.on('click', function () {
 					params.clickfn();
-					jQuery(div).fadeOut(500, function () {
-						this.remove();
+					div.fadeOut(500, function () {
+						$(this).remove();
+					});
 				});
-				}
 			}
 		}
 	}
@@ -251,22 +243,23 @@ var socket,
 		});
 	}

-	app.current_room = null;
-	app.enter_room = function (room) {
+	app.currentRoom = null;
+	app.enterRoom = function (room) {
 		if (socket) {
-			if (app.current_room === room)
+			if (app.currentRoom === room) {
 				return;
+			}

 			socket.emit('event:enter_room', {
 				'enter': room,
-				'leave': app.current_room
+				'leave': app.currentRoom
 			});

-			app.current_room = room;
+			app.currentRoom = room;
 		}
 	};

-	app.populate_online_users = function () {
+	app.populateOnlineUsers = function () {
 		var uids = [];

 		jQuery('.post-row').each(function () {
@@ -276,11 +269,9 @@ var socket,
 		socket.emit('api:user.get_online_users', uids);
 	}

-	app.process_page = function () {
-		app.populate_online_users();
-
-		var url = window.location.href,
-			parts = url.split('/'),
+	function highlightNavigationLink() {
+		var path = window.location.pathname,
+			parts = path.split('/'),
 			active = parts[parts.length - 1];

 		jQuery('#main-nav li').removeClass('active');
@@ -295,10 +286,27 @@ var socket,
 				}
 			});
 		}
+	}
+
+	app.createUserTooltips = function() {
+		$('img[title].teaser-pic,img[title].user-img').each(function() {
+			$(this).tooltip({
+				placement: 'top',
+				title: $(this).attr('title')
+			});
+		});
+	}
+
+	app.processPage = function () {
+		app.populateOnlineUsers();
+
+		highlightNavigationLink();

 		$('span.timeago').timeago();
 		$('.post-content img').addClass('img-responsive');

+		app.createUserTooltips();
+
 		setTimeout(function () {
 			window.scrollTo(0, 1); // rehide address bar on mobile after page load completes.
 		}, 100);
@@ -331,6 +339,28 @@ var socket,
 	}

 	app.openChat = function (username, touid) {
+		if (username === app.username) {
+			app.alert({
+				type: 'warning',
+				title: 'Invalid Chat',
+				message: "You can't chat with yourself!",
+				timeout: 5000
+			});
+
+			return;
+		}
+
+		if (!app.username) {
+			app.alert({
+				type: 'danger',
+				title: 'Not Logged In',
+				message: 'Please log in to chat with <strong>' + username + '</strong>',
+				timeout: 5000
+			});
+
+			return;
+		}
+
 		require(['chat'], function (chat) {
 			var chatModal;
 			if (!chat.modalExists(touid)) {
@@ -343,61 +373,6 @@ var socket,
 		});
 	}

-	app.createNewPosts = function (data) {
-		if (data.posts[0].uid !== app.uid) {
- 			data.posts[0].display_moderator_tools = 'none';
- 		}
-
-		var html = templates.prepare(templates['topic'].blocks['posts']).parse(data);
-		translator.translate(html, function(translatedHTML) {
-			var uniqueid = new Date().getTime(),
-				tempContainer = jQuery('<div id="' + uniqueid + '"></div>')
-					.appendTo("#post-container")
-					.hide()
-					.append(translatedHTML)
-					.fadeIn('slow');
-
-			for (var x = 0, numPosts = data.posts.length; x < numPosts; x++) {
-				socket.emit('api:post.privileges', data.posts[x].pid);
-			}
-
-			tempContainer.replaceWith(tempContainer.contents());
-			infiniteLoaderActive = false;
-
-			app.populate_online_users();
-			app.addCommasToNumbers();
-			$('span.timeago').timeago();
-			$('.post-content img').addClass('img-responsive');
-		});
-	}
-
-	app.infiniteLoaderActive = false;
-
-	app.loadMorePosts = function (tid, callback) {
-		if (app.infiniteLoaderActive)
-			return;
-		app.infiniteLoaderActive = true;
-
-		if ($('#loading-indicator').attr('done') === '0')
-			$('#loading-indicator').removeClass('hide');
-
-		socket.emit('api:topic.loadMore', {
-			tid: tid,
-			after: document.querySelectorAll('#post-container li[data-pid]').length
-		}, function (data) {
-			app.infiniteLoaderActive = false;
-			if (data.posts.length) {
-				$('#loading-indicator').attr('done', '0');
-				app.createNewPosts(data);
-			} else {
-				$('#loading-indicator').attr('done', '1');
-			}
-			$('#loading-indicator').addClass('hide');
-			if (callback)
-				callback(data.posts);
-		});
-	}
-
 	app.scrollToTop = function () {
 		$('body,html').animate({
 			scrollTop: 0
@@ -410,43 +385,6 @@ var socket,
 		});
 	}

-	app.scrollToPost = function (pid) {
-
-		if (!pid)
-			return;
-
-		var container = $(document.body),
-			scrollTo = $('#post_anchor_' + pid),
-			tid = $('#post-container').attr('data-tid');
-
-		function animateScroll() {
-			$('body,html').animate({
-				scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() - $('#header-menu').height()
-			}, 400);
-			//$('body,html').scrollTop(scrollTo.offset().top - container.offset().top + container.scrollTop() - $('#header-menu').height());
-		}
-
-		if (!scrollTo.length && tid) {
-
-			var intervalID = setInterval(function () {
-				app.loadMorePosts(tid, function (posts) {
-					scrollTo = $('#post_anchor_' + pid);
-
-					if (tid && scrollTo.length) {
-						animateScroll();
-					}
-
-					if (!posts.length || scrollTo.length)
-						clearInterval(intervalID);
-				});
-			}, 100);
-
-		} else if (tid) {
-			animateScroll();
-		}
-
-	}
-
 	jQuery('document').ready(function () {
 		$('#search-form').on('submit', function () {
 			var input = $(this).find('input');
--- a/public/src/forum/account.js
+++ b/public/src/forum/account.js
@@ -10,9 +10,10 @@ define(['forum/accountheader'], function(header) {

 		$(document).ready(function() {
 			var username = $('.account-username a').html();
-			app.enter_room('user/' + theirid);
+			app.enterRoom('user/' + theirid);

 			app.addCommasToNumbers();
+			$('.user-recent-posts img').addClass('img-responsive');

 			var followBtn = $('#follow-btn');
 			var unfollowBtn = $('#unfollow-btn');
@@ -71,6 +72,7 @@ define(['forum/accountheader'], function(header) {
 			socket.on('event:new_post', function(data) {
 				var html = templates.prepare(templates['account'].blocks['posts']).parse(data);
 				$('.user-recent-posts').prepend(html);
+				$('.user-recent-posts span.timeago').timeago();
 			});

 		});
@@ -81,10 +83,10 @@ define(['forum/accountheader'], function(header) {

 		if (data.online) {
 			onlineStatus.find('span span').text('online');
-			onlineStatus.find('i').attr('class', 'icon-circle');
+			onlineStatus.find('i').attr('class', 'fa fa-circle');
 		} else {
 			onlineStatus.find('span span').text('offline');
-			onlineStatus.find('i').attr('class', 'icon-circle-blank');
+			onlineStatus.find('i').attr('class', 'fa fa-circle-o');
 		}
 	};

--- a/public/src/forum/accountedit.js
+++ b/public/src/forum/accountedit.js
@@ -1,11 +1,13 @@
 define(['forum/accountheader', 'uploader'], function(header, uploader) {
-	var AccountEdit = {};
+	var AccountEdit = {},
+		gravatarPicture = '',
+		uploadedPicture = '';

 	AccountEdit.init = function() {
 		header.init();

-		var gravatarPicture = templates.get('gravatarpicture');
-		var uploadedPicture = templates.get('uploadedpicture');
+		gravatarPicture = templates.get('gravatarpicture');
+		uploadedPicture = templates.get('uploadedpicture');

 		var selectedImageType = '';

@@ -50,14 +52,14 @@ define(['forum/accountheader', 'uploader'], function(header, uploader) {
 		});

 		$('#gravatar-box').on('click', function() {
-			$('#gravatar-box .icon-ok').show();
-			$('#uploaded-box .icon-ok').hide();
+			$('#gravatar-box .fa-check').show();
+			$('#uploaded-box .fa-check').hide();
 			selectedImageType = 'gravatar';
 		});

 		$('#uploaded-box').on('click', function() {
-			$('#gravatar-box .icon-ok').hide();
-			$('#uploaded-box .icon-ok').show();
+			$('#gravatar-box .fa-check').hide();
+			$('#uploaded-box .fa-check').show();
 			selectedImageType = 'uploaded';
 		});

@@ -194,31 +196,33 @@ define(['forum/accountheader', 'uploader'], function(header, uploader) {

 	AccountEdit.updateImages = function() {
 		var currentPicture = $('#user-current-picture').attr('src');
-		var gravatarPicture = templates.get('gravatarpicture');
-		var uploadedPicture = templates.get('uploadedpicture');

 		if (gravatarPicture) {
 			$('#user-gravatar-picture').attr('src', gravatarPicture);
 			$('#gravatar-box').show();
-		} else
+		} else {
 			$('#gravatar-box').hide();
+		}

 		if (uploadedPicture) {
 			$('#user-uploaded-picture').attr('src', uploadedPicture);
 			$('#uploaded-box').show();
-		} else
+		} else {
 			$('#uploaded-box').hide();
+		}


-		if (currentPicture == gravatarPicture)
-			$('#gravatar-box .icon-ok').show();
-		else
-			$('#gravatar-box .icon-ok').hide();
+		if (currentPicture == gravatarPicture) {
+			$('#gravatar-box .fa-check').show();
+		} else {
+			$('#gravatar-box .fa-check').hide();
+		}

-		if (currentPicture == uploadedPicture)
-			$('#uploaded-box .icon-ok').show();
-		else
-			$('#uploaded-box .icon-ok').hide();
+		if (currentPicture == uploadedPicture) {
+			$('#uploaded-box .fa-check').show();
+		} else {
+			$('#uploaded-box .fa-check').hide();
+		}
 	}

 	return AccountEdit;
--- a/public/src/forum/admin/categories.js
+++ b/public/src/forum/admin/categories.js
@@ -18,7 +18,7 @@ define(function() {
 		}

 		function select_icon(el) {
-			var selected = el.attr('class').replace(' icon-2x', '');
+			var selected = el.attr('class').replace(' fa-2x', '');
 			jQuery('#icons .selected').removeClass('selected');
 			if (selected)
 				jQuery('#icons .' + selected).parent().addClass('selected');
@@ -27,9 +27,13 @@ define(function() {
 			bootbox.confirm('<h2>Select an icon.</h2>' + document.getElementById('icons').innerHTML, function(confirm) {
 				if (confirm) {
 					var iconClass = jQuery('.bootbox .selected').children(':first').attr('class');
-					el.attr('class', iconClass + ' icon-2x');
-					el.val(iconClass);
-					el.attr('value', iconClass);
+
+					el.attr('class', iconClass + ' fa-2x');
+
+					// remove the 'fa ' from the class name, just need the icon name itself
+					var categoryIconClass = iconClass.replace('fa ', '');
+					el.val(categoryIconClass);
+					el.attr('value', categoryIconClass);

 					modified(el);
 				}
@@ -77,7 +81,8 @@ define(function() {
 				name: $('#inputName').val(),
 				description: $('#inputDescription').val(),
 				icon: $('#new-category-modal i').val(),
-				blockclass: $('#inputBlockclass').val()
+				bgColor: '#0059b2',
+				color: '#fff'
 			};

 			socket.emit('api:admin.categories.create', category, function(err, data) {
@@ -125,11 +130,7 @@ define(function() {
 				select_icon($(this).find('i'));
 			});

-			jQuery('.blockclass').on('change', function(ev) {
-				update_blockclass(ev.target);
-			});
-
-			jQuery('.category_name, .category_description, .blockclass').on('change', function(ev) {
+			jQuery('.admin-categories form input').on('change', function(ev) {
 				modified(ev.target);
 			});

@@ -156,6 +157,21 @@ define(function() {
 				return false;
 			});

+			// Colour Picker
+			$('[data-name="bgColor"], [data-name="color"]').each(function(idx, inputEl) {
+				var	jinputEl = $(this),
+					previewEl = jinputEl.parents('[data-cid]').find('.preview-box');
+
+				jinputEl.ColorPicker({
+					color: this.value || '#000',
+					onChange: function(hsb, hex) {
+						jinputEl.val('#' + hex);
+						if (inputEl.getAttribute('data-name') === 'bgColor') previewEl.css('background', '#' + hex);
+						else if (inputEl.getAttribute('data-name') === 'color') previewEl.css('color', '#' + hex);
+						modified(inputEl);
+					}
+				});
+			});
 		});
 	};

--- a/public/src/forum/admin/groups.js
+++ b/public/src/forum/admin/groups.js
@@ -45,10 +45,12 @@ define(function() {

 					errorEl.html(errorText).removeClass('hide');
 				} else {
-					createModal.modal('hide');
 					errorEl.addClass('hide');
 					createNameEl.val('');
+					createModal.on('hidden.bs.modal', function() {
 						ajaxify.go('admin/groups');
+					});
+					createModal.modal('hide');
 				}
 			});
 		});
--- a/public/src/forum/admin/index.js
+++ b/public/src/forum/admin/index.js
@@ -20,7 +20,7 @@ define(function() {
 			document.getElementById('connections').innerHTML = total;
 		});

-		app.enter_room('admin');
+		app.enterRoom('admin');
 		socket.emit('api:get_all_rooms');
 	};

--- a/public/src/forum/admin/plugins.js
+++ b/public/src/forum/admin/plugins.js
@@ -13,7 +13,7 @@ define(function() {

 				socket.on('api:admin.plugins.toggle', function(status) {
 					pluginTgl = document.querySelector('.plugins li[data-plugin-id="' + status.id + '"] button');
-					pluginTgl.innerHTML = '<i class="icon-off"></i> ' + (status.active ? 'Dea' : 'A') + 'ctivate';
+					pluginTgl.innerHTML = '<i class="fa fa-power-off"></i> ' + (status.active ? 'Dea' : 'A') + 'ctivate';

 					app.alert({
 						alert_id: 'plugin_toggled_' + status.id,
--- a/public/src/forum/admin/settings.js
+++ b/public/src/forum/admin/settings.js
@@ -38,6 +38,8 @@ define(['uploader'], function(uploader) {
 				}
 			} else if (fields[x].nodeName === 'TEXTAREA') {
 				if (app.config[key]) fields[x].value = app.config[key];
+			} else if (fields[x].nodeName === 'SELECT') {
+				if (app.config[key]) fields[x].value = app.config[key];
 			}
 		}

@@ -61,6 +63,8 @@ define(['uploader'], function(uploader) {
 					}
 				} else if (fields[x].nodeName === 'TEXTAREA') {
 					value = fields[x].value;
+				} else if (fields[x].nodeName === 'SELECT') {
+					value = fields[x].value;
 				}

 				socket.emit('api:config.set', {
--- a/public/src/forum/admin/topics.js
+++ b/public/src/forum/admin/topics.js
@@ -42,10 +42,15 @@ define(function() {

 		loadMoreEl.addEventListener('click', function() {
 			if (this.className.indexOf('disabled') === -1) {
-				var topics = document.querySelectorAll('.topics li[data-tid]'),
-					lastTid = parseInt(topics[topics.length - 1].getAttribute('data-tid'));
+				var topics = document.querySelectorAll('.topics li[data-tid]');

-				this.innerHTML = '<i class="icon-refresh icon-spin"></i> Retrieving topics';
+				if(!topics.length) {
+					return;
+				}
+
+				var lastTid = parseInt(topics[topics.length - 1].getAttribute('data-tid'));
+
+				this.innerHTML = '<i class="fa fa-refresh fa-spin"></i> Retrieving topics';
 				socket.emit('api:admin.topics.getMore', {
 					limit: 10,
 					after: lastTid
--- a/public/src/forum/admin/users.js
+++ b/public/src/forum/admin/users.js
@@ -91,7 +91,7 @@ define(function() {
 				timeoutId = setTimeout(function() {
 					var username = $('#search-user').val();

-					jQuery('.icon-spinner').removeClass('none');
+					jQuery('.fa-spinner').removeClass('none');
 					socket.emit('api:admin.user.search', username);

 				}, 250);
@@ -108,7 +108,7 @@ define(function() {
 					userListEl = document.querySelector('.users');

 				userListEl.innerHTML = html;
-				jQuery('.icon-spinner').addClass('none');
+				jQuery('.fa-spinner').addClass('none');

 				if (data && data.length === 0) {
 					$('#user-notfound-notify').html('User not found!')
--- a/public/src/forum/category.js
+++ b/public/src/forum/category.js
@@ -1,18 +1,17 @@
 define(function () {
-	var	Category = {};
+	var Category = {},
+		loadingMoreTopics = false;

 	Category.init = function() {
 		var	cid = templates.get('category_id'),
-			room = 'category_' + cid,
 			twitterEl = jQuery('#twitter-intent'),
 			facebookEl = jQuery('#facebook-share'),
 			googleEl = jQuery('#google-share'),
 			twitter_url = templates.get('twitter-intent-url'),
 			facebook_url = templates.get('facebook-share-url'),
-			google_url = templates.get('google-share-url'),
-			loadingMoreTopics = false;
+			google_url = templates.get('google-share-url');

-		app.enter_room(room);
+		app.enterRoom('category_' + cid);

 		twitterEl.on('click', function () {
 			window.open(twitter_url, '_blank', 'width=550,height=420,scrollbars=no,status=no');
@@ -56,7 +55,7 @@ define(function () {
 				li.setAttribute('data-pid', posts[i].pid);


-				li.innerHTML = '<a href="/user/' + posts[i].userslug + '"><img title="' + posts[i].username + '" style="width: 48px; height: 48px; /*temporary*/" class="img-rounded" src="' + posts[i].picture + '" class="" /></a>' +
+				li.innerHTML = '<a href="/user/' + posts[i].userslug + '"><img title="' + posts[i].username + '" style="width: 48px; height: 48px; /*temporary*/" class="img-rounded user-img" src="' + posts[i].picture + '" class="" /></a>' +
 					'<a href="/topic/' + posts[i].topicSlug + '#' + posts[i].pid + '">' +
 					'<strong><span>'+ posts[i].username + '</span></strong>' +
 					'<p>' +
@@ -69,6 +68,7 @@ define(function () {
 				recent_replies.appendChild(frag);
 			}
 			$('#category_recent_replies span.timeago').timeago();
+			app.createUserTooltips();
 		});

 		$(window).off('scroll').on('scroll', function (ev) {
@@ -94,17 +94,20 @@ define(function () {

 		if (numTopics > 0) {
 			for (var x = 0; x < numTopics; x++) {
-				if ($(topics[x]).find('.icon-pushpin').length)
+				if ($(topics[x]).find('.fa-thumb-tack').length) {
+					if(x === numTopics - 1) {
+						topic.insertAfter(topics[x]);
+					}
 					continue;
+				}
 				topic.insertBefore(topics[x]);
-				topic.hide().fadeIn('slow');
 				break;
 			}
 		} else {
 			container.append(topic);
-			topic.hide().fadeIn('slow');
 		}

+		topic.hide().fadeIn('slow');
 		socket.emit('api:categories.getRecentReplies', templates.get('category_id'));

 		addActiveUser(data);
@@ -144,6 +147,10 @@ define(function () {


 	Category.loadMoreTopics = function(cid) {
+		if (loadingMoreTopics) {
+			return;
+		}
+		
 		loadingMoreTopics = true;
 		socket.emit('api:category.loadMore', {
 			cid: cid,
--- a/public/src/forum/footer.js
+++ b/public/src/forum/footer.js
@@ -105,11 +105,14 @@

 				notifList.appendChild(notifFrag);

-				if (data.unread.length > 0) notifIcon.className = 'icon-circle active';
-				else notifIcon.className = 'icon-circle-blank';
+				if (data.unread.length > 0) {
+					notifIcon.className = 'fa fa-circle active';
+				} else {
+					notifIcon.className = 'fa fa-circle-o';
+				}

 				socket.emit('api:notifications.mark_all_read', null, function() {
-					notifIcon.className = 'icon-circle-blank';
+					notifIcon.className = 'fa fa-circle-o';
 					utils.refreshTitle();
 				});
 			});
@@ -136,7 +139,7 @@
 	});

 	socket.on('event:new_notification', function() {
-		document.querySelector('.notifications a i').className = 'icon-circle active';
+		document.querySelector('.notifications a i').className = 'fa fa-circle active';
 		app.alert({
 			alert_id: 'new_notif',
 			title: 'New notification',
--- a/public/src/forum/login.js
+++ b/public/src/forum/login.js
@@ -26,17 +26,23 @@ define(function() {
 				'_csrf': $('#csrf-token').val()
 			};

+			$('#login').attr('disabled', 'disabled').html('Logging in...');
+			$('#login-error-notify').hide();
+
 			$.ajax({
 				type: "POST",
 				url: RELATIVE_PATH + '/login',
 				data: loginData,
 				success: function(data, textStatus, jqXHR) {
+
 					if (!data.success) {
 						$('#login-error-notify').show();
+						$('#login').removeAttr('disabled').html('Login');
 					} else {
-						$('#login-error-notify').hide();
-
-						if(!app.previousUrl) { app.previousUrl = '/'; }
+						$('#login').html('Redirecting...');
+						if(!app.previousUrl) {
+							app.previousUrl = '/';
+						}

 						if(app.previousUrl.indexOf('/reset/') != -1)
 							window.location.replace(RELATIVE_PATH + "/?loggedin");
@@ -48,6 +54,7 @@ define(function() {
 				},
 				error: function(data, textStatus, jqXHR) {
 					$('#login-error-notify').show();
+					$('#login').removeAttr('disabled').html('Login');
 				},
 				dataType: 'json',
 				async: true,
@@ -63,6 +70,12 @@ define(function() {
 		});

 		document.querySelector('#content input').focus();
+
+		if(!config.emailSetup)
+			$('#reset-link').addClass('hide');
+		else
+			$('#reset-link').removeClass('hide');
+
 	};

 	return Login;
--- a/public/src/forum/recent.js
+++ b/public/src/forum/recent.js
@@ -8,7 +8,7 @@ define(function() {
 	var active = '';

 	Recent.init = function() {
-		app.enter_room('recent_posts');
+		app.enterRoom('recent_posts');

 		ajaxify.register_events([
 			'event:new_topic',
--- a/public/src/forum/register.js
+++ b/public/src/forum/register.js
@@ -12,7 +12,7 @@ define(function() {
 			password_notify = $('#password-notify'),
 			password_confirm_notify = $('#password-confirm-notify'),
 			validationError = false,
-			successIcon = '<i class="icon icon-ok"></i>';
+			successIcon = '<i class="fa fa-check"></i>';

 		$('#referrer').val(app.previousUrl);

@@ -151,7 +151,9 @@ define(function() {
 		}

 		register.on('click', function(e) {
-			if (validateForm()) e.preventDefault();
+			if (validateForm()) {
+				e.preventDefault();
+			}
 		});
 	};

--- a/public/src/forum/topic.js
+++ b/public/src/forum/topic.js
@@ -1,5 +1,7 @@
 define(function() {
-	var	Topic = {};
+	var	Topic = {},
+		infiniteLoaderActive = false;
+

 	Topic.init = function() {
 		var expose_tools = templates.get('expose_tools'),
@@ -17,16 +19,26 @@ define(function() {
 			google_url = templates.get('google-share-url');


+		function fixDeleteStateForPosts() {
+			var postEls = document.querySelectorAll('#post-container li[data-deleted]');
+			for (var x = 0, numPosts = postEls.length; x < numPosts; x++) {
+				if (postEls[x].getAttribute('data-deleted') === '1') {
+					toggle_post_delete_state(postEls[x].getAttribute('data-pid'));
+				}
+				postEls[x].removeAttribute('data-deleted');
+			}
+		}
+
+
 		jQuery('document').ready(function() {

 			app.addCommasToNumbers();

+			app.enterRoom('topic_' + tid);

-			var room = 'topic_' + tid,
-				adminTools = document.getElementById('thread-tools');
-
-			app.enter_room(room);
-
+			if($('#post-container .posts .post-row').length > 1) {
+				$('.topic-main-buttons').removeClass('hide').parent().removeClass('hide');
+			}

 			$('.twitter-share').on('click', function () {
 				window.open(twitter_url, '_blank', 'width=550,height=420,scrollbars=no,status=no');
@@ -50,11 +62,10 @@ define(function() {

 			if (expose_tools === '1') {
 				var moveThreadModal = $('#move_thread_modal');
-
-				adminTools.style.visibility = 'inherit';
+				$('.thread-tools').removeClass('hide');

 				// Add events to the thread tools
-				$('#delete_thread').on('click', function(e) {
+				$('.delete_thread').on('click', function(e) {
 					if (thread_state.deleted !== '1') {
 						bootbox.confirm('Are you sure you want to delete this thread?', function(confirm) {
 							if (confirm) {
@@ -73,7 +84,7 @@ define(function() {
 					return false;
 				});

-				$('#lock_thread').on('click', function(e) {
+				$('.lock_thread').on('click', function(e) {
 					if (thread_state.locked !== '1') {
 						socket.emit('api:topic.lock', {
 							tid: tid
@@ -86,7 +97,7 @@ define(function() {
 					return false;
 				});

-				$('#pin_thread').on('click', function(e) {
+				$('.pin_thread').on('click', function(e) {
 					if (thread_state.pinned !== '1') {
 						socket.emit('api:topic.pin', {
 							tid: tid
@@ -99,7 +110,7 @@ define(function() {
 					return false;
 				});

-				$('#move_thread').on('click', function(e) {
+				$('.move_thread').on('click', function(e) {
 					moveThreadModal.modal('show');
 					return false;
 				});
@@ -109,7 +120,6 @@ define(function() {
 					var loadingEl = document.getElementById('categories-loading');
 					if (loadingEl) {
 						socket.once('api:categories.get', function(data) {
-							console.log(data);
 							// Render categories
 							var categoriesFrag = document.createDocumentFragment(),
 								categoryEl = document.createElement('li'),
@@ -125,8 +135,10 @@ define(function() {
 							categoriesEl.className = 'category-list';
 							for (x = 0; x < numCategories; x++) {
 								info = data.categories[x];
-								categoryEl.className = info.blockclass + (info.disabled === '1' ? ' disabled' : '');
-								categoryEl.innerHTML = '<i class="' + info.icon + '"></i> ' + info.name;
+								categoryEl.style.background = info.bgColor;
+								categoryEl.style.color = info.color || '#fff';
+								categoryEl.className = info.disabled === '1' ? ' disabled' : '';
+								categoryEl.innerHTML = '<i class="fa ' + info.icon + '"></i> ' + info.name;
 								categoryEl.setAttribute('data-cid', info.cid);
 								categoriesFrag.appendChild(categoryEl.cloneNode(true));
 							}
@@ -148,7 +160,7 @@ define(function() {
 									commitEl.disabled = true;
 									$(cancelEl).fadeOut(250);
 									$(moveThreadModal).find('.modal-header button').fadeOut(250);
-									commitEl.innerHTML = 'Moving <i class="icon-spin icon-refresh"></i>';
+									commitEl.innerHTML = 'Moving <i class="fa-spin fa-refresh"></i>';

 									socket.once('api:topic.move', function(data) {
 										moveThreadModal.modal('hide');
@@ -182,15 +194,11 @@ define(function() {
 				});
 			}

-			// Fix delete state for this thread's posts
-			var postEls = document.querySelectorAll('#post-container li[data-deleted]');
-			for (var x = 0, numPosts = postEls.length; x < numPosts; x++) {
-				if (postEls[x].getAttribute('data-deleted') === '1') toggle_post_delete_state(postEls[x].getAttribute('data-pid'));
-				postEls[x].removeAttribute('data-deleted');
-			}
+			fixDeleteStateForPosts();
+

 			// Follow Thread State
-			var followEl = $('.main-post .follow'),
+			var followEl = $('.posts .follow'),
 				set_follow_state = function(state, quiet) {
 					if (state && !followEl.hasClass('btn-success')) {
 						followEl.addClass('btn-success');
@@ -246,7 +254,7 @@ define(function() {
 			var bookmark = localStorage.getItem('topic:' + tid + ':bookmark');

 			if(bookmark) {
-				app.scrollToPost(parseInt(bookmark, 10));
+				Topic.scrollToPost(parseInt(bookmark, 10));
 			}

 			$('#post-container').on('click', '.deleted', function(ev) {
@@ -258,13 +266,15 @@ define(function() {
 			$(window).off('scroll').on('scroll', function() {
 				var bottom = ($(document).height() - $(window).height()) * 0.9;

-				if ($(window).scrollTop() > bottom && !app.infiniteLoaderActive && $('#post-container').children().length) {
-					app.loadMorePosts(tid);
+				if ($(window).scrollTop() > bottom && !infiniteLoaderActive && $('#post-container').children().length) {
+					loadMorePosts(tid, function(posts) {
+						fixDeleteStateForPosts();
+					});
 				}
 			});
 		}

-		var reply_fn = function() {
+		$('.topic').on('click', '.post_reply', function() {
 			var selectionText = '',
 				selection = window.getSelection() || document.getSelection();

@@ -278,9 +288,7 @@ define(function() {
 					cmp.push(tid, null, null, selectionText.length > 0 ? selectionText + '\n\n' : '');
 				});
 			}
-		};
-		$('#post-container').on('click', '.post_reply', reply_fn);
-		$('#post_reply').on('click', reply_fn);
+		});

 		$('#post-container').on('click', '.quote', function() {
 			if (thread_state.locked !== '1') {
@@ -304,15 +312,15 @@ define(function() {
 			var uid = $(this).parents('li').attr('data-uid');

 			var element = $(this).find('i');
-			if (element.attr('class') == 'icon-star-empty') {
+			if ($(element).hasClass('fa-star-o')) {
 				socket.emit('api:posts.favourite', {
 					pid: pid,
-					room_id: app.current_room
+					room_id: app.currentRoom
 				});
 			} else {
 				socket.emit('api:posts.unfavourite', {
 					pid: pid,
-					room_id: app.current_room
+					room_id: app.currentRoom
 				});
 			}
 		});
@@ -327,7 +335,7 @@ define(function() {

 		$('#post-container').delegate('.edit', 'click', function(e) {
 			var pid = $(this).parents('li').attr('data-pid'),
-				main = $(this).parents('.main-post');
+				main = $(this).parents('.posts');

 			require(['composer'], function(cmp) {
 				cmp.push(null, null, pid);
@@ -341,13 +349,25 @@ define(function() {
 				confirmDel = confirm((deleteAction ? 'Delete' : 'Restore') + ' this post?');

 			if (confirmDel) {
-				deleteAction ?
+				if(deleteAction) {
 					socket.emit('api:posts.delete', {
-						pid: pid
-					}) :
-					socket.emit('api:posts.restore', {
-						pid: pid
+						pid: pid,
+						tid: tid
+					}, function(err) {
+						if(err) {
+							return app.alertError('Can\'t delete post!');
+						}
 					});
+				} else {
+					socket.emit('api:posts.restore', {
+						pid: pid,
+						tid: tid
+					}, function(err) {
+						if(err) {
+							return app.alertError('Can\'t restore post!');
+						}
+					});
+				}
 			}
 		});

@@ -355,9 +375,6 @@ define(function() {
 			var username = $(this).parents('li.row').attr('data-username');
 			var touid = $(this).parents('li.row').attr('data-uid');

-			if (username === app.username || !app.username)
-				return;
-
 			app.openChat(username, touid);
 		});

@@ -381,12 +398,15 @@ define(function() {
 						var userLink = $('<a href="/user/' + userslug + '"></a>').append(userIcon);
 						userLink.attr('data-uid', uid);

+						var div = $('<div class="inline-block"></div>');
+						div.append(userLink);
+
 						userLink.tooltip({
-							placement: 'left',
+							placement: 'top',
 							title: username
 						});

-						return userLink;
+						return div;
 					}
 				}

@@ -428,7 +448,7 @@ define(function() {
 				activeEl.find('.anonymous-box').remove();
 				if(anonymousCount || remainingUsers) {

-					var anonLink = $('<i class="icon-user anonymous-box"></i>');
+					var anonLink = $('<div class="anonymous-box inline-block"><i class="fa fa-user"></i></div>');
 					activeEl.append(anonLink);

 					var title = '';
@@ -440,12 +460,12 @@ define(function() {
 						title = anonymousCount + ' guest(s)';

 					anonLink.tooltip({
-						placement: 'left',
+						placement: 'top',
 						title: title
 					});
 				}
 			}
-			app.populate_online_users();
+			app.populateOnlineUsers();
 		});

 		socket.on('event:rep_up', function(data) {
@@ -456,7 +476,7 @@ define(function() {
 			adjust_rep(-1, data.pid, data.uid);
 		});

-		socket.on('event:new_post', app.createNewPosts);
+		socket.on('event:new_post', createNewPosts);

 		socket.on('event:topic_deleted', function(data) {
 			if (data.tid === tid && data.status === 'ok') {
@@ -523,7 +543,7 @@ define(function() {
 			if (data.status === 'ok' && data.pid) {
 				var favEl = document.querySelector('.post_rep_' + data.pid).nextSibling;
 				if (favEl) {
-					favEl.className = 'icon-star';
+					favEl.className = 'fa fa-star';
 					$(favEl).parent().addClass('btn-warning');
 				}
 			}
@@ -533,18 +553,22 @@ define(function() {
 			if (data.status === 'ok' && data.pid) {
 				var favEl = document.querySelector('.post_rep_' + data.pid).nextSibling;
 				if (favEl) {
-					favEl.className = 'icon-star-empty';
+					favEl.className = 'fa fa-star-o';
 					$(favEl).parent().removeClass('btn-warning');
 				}
 			}
 		});

 		socket.on('event:post_deleted', function(data) {
-			if (data.pid) toggle_post_delete_state(data.pid, true);
+			if (data.pid) {
+				 toggle_post_delete_state(data.pid);
+			}
 		});

 		socket.on('event:post_restored', function(data) {
-			if (data.pid) toggle_post_delete_state(data.pid, true);
+			if (data.pid) {
+				toggle_post_delete_state(data.pid);
+			}
 		});

 		socket.on('api:post.privileges', function(privileges) {
@@ -566,21 +590,21 @@ define(function() {
 		}

 		function set_locked_state(locked, alert) {
-			var threadReplyBtn = document.getElementById('post_reply'),
+			var threadReplyBtn = $('.topic-main-buttons .post_reply'),
 				postReplyBtns = document.querySelectorAll('#post-container .post_reply'),
 				quoteBtns = document.querySelectorAll('#post-container .quote'),
 				editBtns = document.querySelectorAll('#post-container .edit'),
 				deleteBtns = document.querySelectorAll('#post-container .delete'),
 				numPosts = document.querySelectorAll('#post_container li[data-pid]').length,
-				lockThreadEl = document.getElementById('lock_thread'),
+				lockThreadEl = $('.lock_thread'),
 				x;

 			if (locked === true) {
-				lockThreadEl.innerHTML = '<i class="icon-unlock"></i> Unlock Thread';
-				threadReplyBtn.disabled = true;
-				threadReplyBtn.innerHTML = 'Locked <i class="icon-lock"></i>';
+				lockThreadEl.html('<i class="fa fa-unlock"></i> Unlock Thread');
+				threadReplyBtn.attr('disabled', true);
+				threadReplyBtn.html('Locked <i class="fa fa-lock"></i>');
 				for (x = 0; x < numPosts; x++) {
-					postReplyBtns[x].innerHTML = 'Locked <i class="icon-lock"></i>';
+					postReplyBtns[x].innerHTML = 'Locked <i class="fa fa-lock"></i>';
 					quoteBtns[x].style.display = 'none';
 					editBtns[x].style.display = 'none';
 					deleteBtns[x].style.display = 'none';
@@ -598,11 +622,11 @@ define(function() {

 				thread_state.locked = '1';
 			} else {
-				lockThreadEl.innerHTML = '<i class="icon-lock"></i> Lock Thread';
-				threadReplyBtn.disabled = false;
-				threadReplyBtn.innerHTML = 'Reply';
+				lockThreadEl.html('<i class="fa fa-lock"></i> Lock Thread');
+				threadReplyBtn.attr('disabled', false);
+				threadReplyBtn.html('Reply');
 				for (x = 0; x < numPosts; x++) {
-					postReplyBtns[x].innerHTML = 'Reply <i class="icon-reply"></i>';
+					postReplyBtns[x].innerHTML = 'Reply <i class="fa fa-reply"></i>';
 					quoteBtns[x].style.display = 'inline-block';
 					editBtns[x].style.display = 'inline-block';
 					deleteBtns[x].style.display = 'inline-block';
@@ -623,13 +647,14 @@ define(function() {
 		}

 		function set_delete_state(deleted) {
-			var deleteThreadEl = document.getElementById('delete_thread'),
-				deleteTextEl = deleteThreadEl.getElementsByTagName('span')[0],
+			var deleteThreadEl = $('.delete_thread'),
+				deleteTextEl = $('.delete_thread span'),
+				//deleteThreadEl.getElementsByTagName('span')[0],
 				threadEl = $('#post-container'),
 				deleteNotice = document.getElementById('thread-deleted') || document.createElement('div');

 			if (deleted) {
-				deleteTextEl.innerHTML = '<i class="icon-comment"></i> Restore Thread';
+				deleteTextEl.html('<i class="fa fa-comment"></i> Restore Thread');
 				threadEl.addClass('deleted');

 				// Spawn a 'deleted' notice at the top of the page
@@ -640,7 +665,7 @@ define(function() {

 				thread_state.deleted = '1';
 			} else {
-				deleteTextEl.innerHTML = '<i class="icon-trash"></i> Delete Thread';
+				deleteTextEl.html('<i class="fa fa-trash-o"></i> Delete Thread');
 				threadEl.removeClass('deleted');
 				deleteNotice.parentNode.removeChild(deleteNotice);

@@ -649,10 +674,10 @@ define(function() {
 		}

 		function set_pinned_state(pinned, alert) {
-			var pinEl = document.getElementById('pin_thread');
+			var pinEl = $('.pin_thread');

 			if (pinned) {
-				pinEl.innerHTML = '<i class="icon-pushpin"></i> Unpin Thread';
+				pinEl.html('<i class="fa fa-thumb-tack"></i> Unpin Thread');
 				if (alert) {
 					app.alert({
 						'alert_id': 'thread_pin',
@@ -665,7 +690,7 @@ define(function() {

 				thread_state.pinned = '1';
 			} else {
-				pinEl.innerHTML = '<i class="icon-pushpin"></i> Pin Thread';
+				pinEl.html('<i class="fa fa-thumb-tack"></i> Pin Thread');
 				if (alert) {
 					app.alert({
 						'alert_id': 'thread_pin',
@@ -702,6 +727,7 @@ define(function() {
 					} else {
 						postEl.toggleClass('none');
 					}
+					updatePostCount();
 				});
 				socket.emit('api:post.privileges', pid);
 			}
@@ -740,8 +766,8 @@ define(function() {



-		var postAuthorImage, mobileAuthorOverlay, pagination;
-		var postcount = templates.get('postcount');
+		var pagination;
+		Topic.postCount = templates.get('postcount');

 		function updateHeader() {
 			if (pagination == null) {
@@ -752,10 +778,6 @@ define(function() {
 					app.scrollToBottom();
 				});
 			}
-
-			jQuery('.mobile-author-overlay').css('bottom', '0px');
-			postAuthorImage = postAuthorImage || document.getElementById('mobile-author-image');
-			mobileAuthorOverlay = mobileAuthorOverlay || document.getElementById('mobile-author-overlay');
 			pagination = pagination || document.getElementById('pagination');

 			pagination.parentNode.style.display = 'block';
@@ -764,18 +786,16 @@ define(function() {
 			var scrollTop = jQuery(window).scrollTop();
 			var scrollBottom = scrollTop + windowHeight;

-			if (scrollTop < 50 && postcount > 1) {
+			if (scrollTop < 50 && Topic.postCount > 1) {
 				localStorage.removeItem("topic:" + tid + ":bookmark");
-				postAuthorImage.src = (jQuery('.main-post .avatar img').attr('src'));
-				mobileAuthorOverlay.innerHTML = 'Posted by ' + jQuery('.main-post').attr('data-username') + ', ' + jQuery('.main-post').find('.relativeTimeAgo').html();
-				pagination.innerHTML = '0 out of ' + postcount;
+				pagination.innerHTML = '0 out of ' + Topic.postCount;
 				return;
 			}


 			var count = 0, smallestNonNegative = 0;

-			jQuery('.sub-posts').each(function() {
+			jQuery('.posts > .post-row').each(function() {
 				count++;
 				this.postnumber = count;

@@ -794,15 +814,13 @@ define(function() {
 						smallestNonNegative = Number.MAX_VALUE;
 					}

-					pagination.innerHTML = this.postnumber + ' out of ' + postcount;
-					postAuthorImage.src = (jQuery(this).find('.profile-image-block img').attr('src'));
-					mobileAuthorOverlay.innerHTML = 'Posted by ' + jQuery(this).attr('data-username') + ', ' + jQuery(this).find('.relativeTimeAgo').html();
+					pagination.innerHTML = this.postnumber + ' out of ' + Topic.postCount;
 				}
 			});

 			setTimeout(function() {
 				if (scrollTop + windowHeight == jQuery(document).height()) {
-					pagination.innerHTML = postcount + ' out of ' + postcount;
+					pagination.innerHTML = Topic.postCount + ' out of ' + Topic.postCount;
 				}
 			}, 100);
 		}
@@ -811,5 +829,142 @@ define(function() {
 		window.onload = updateHeader;
 	};

+	Topic.scrollToPost = function(pid) {
+		if (!pid) {
+			return;
+		}
+
+		var container = $(document.body),
+			scrollTo = $('#post_anchor_' + pid),
+			tid = $('#post-container').attr('data-tid');
+
+		function animateScroll() {
+			$('body,html').animate({
+				scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() - $('#header-menu').height()
+			}, 400);
+		}
+
+		if (!scrollTo.length && tid) {
+
+			var intervalID = setInterval(function () {
+				loadMorePosts(tid, function (posts) {
+					scrollTo = $('#post_anchor_' + pid);
+
+					if (tid && scrollTo.length) {
+						animateScroll();
+					}
+
+					if (!posts.length || scrollTo.length)
+						clearInterval(intervalID);
+				});
+			}, 100);
+
+		} else if (tid) {
+			animateScroll();
+		}
+	}
+
+	function createNewPosts(data, infiniteLoaded) {
+		if(!data || (data.posts && !data.posts.length))
+			return;
+
+		if (data.posts[0].uid !== app.uid) {
+			data.posts[0].display_moderator_tools = 'none';
+		}
+
+		function removeAlreadyAddedPosts() {
+			data.posts = data.posts.filter(function(post) {
+				return $('#post-container li[data-pid="' + post.pid +'"]').length === 0;
+			});
+		}
+
+		function findInsertionPoint() {
+			var after = null,
+				firstPid = data.posts[0].pid;
+			$('#post-container li[data-pid]').each(function() {
+				if(parseInt(firstPid, 10) > parseInt($(this).attr('data-pid'), 10)) {
+					after = $(this);
+					if(after.hasClass('posts')) {
+						after = after.next();
+					}
+				} else {
+					return false;
+				}
+			});
+			return after;
+		}
+
+		removeAlreadyAddedPosts();
+		if(!data.posts.length) {
+			return;
+		}
+
+		var insertAfter = findInsertionPoint();
+
+		var html = templates.prepare(templates['topic'].blocks['posts']).parse(data);
+		var regexp = new RegExp("<!--[\\s]*IF @first[\\s]*-->[\\s\\S]*<!--[\\s]*ENDIF @first[\\s]*-->", 'g');
+		html = html.replace(regexp, '');
+
+		translator.translate(html, function(translatedHTML) {
+			var translated = $(translatedHTML);
+
+			if(!infiniteLoaded) {
+				translated.removeClass('infiniteloaded');
+			}
+
+			translated.insertAfter(insertAfter)
+				.hide()
+				.fadeIn('slow');
+
+			for (var x = 0, numPosts = data.posts.length; x < numPosts; x++) {
+				socket.emit('api:post.privileges', data.posts[x].pid);
+			}
+
+			infiniteLoaderActive = false;
+
+			app.populateOnlineUsers();
+			app.addCommasToNumbers();
+			$('span.timeago').timeago();
+			$('.post-content img').addClass('img-responsive');
+			updatePostCount();
+		});
+	}
+
+	function updatePostCount() {
+		Topic.postCount = $('#post-container li[data-pid]:not(.deleted)').length;
+		$('#topic-post-count').html(Topic.postCount);
+	}
+
+	function loadMorePosts(tid, callback) {
+		var indicatorEl = $('.loading-indicator');
+
+		if (infiniteLoaderActive) {
+			return;
+		}
+
+		infiniteLoaderActive = true;
+
+		if (indicatorEl.attr('done') === '0') {
+			indicatorEl.fadeIn();
+		}
+
+		socket.emit('api:topic.loadMore', {
+			tid: tid,
+			after: $('#post-container .post-row.infiniteloaded').length
+		}, function (data) {
+			infiniteLoaderActive = false;
+			if (data.posts.length) {
+				indicatorEl.attr('done', '0');
+				createNewPosts(data, true);
+			} else {
+				indicatorEl.attr('done', '1');
+			}
+			indicatorEl.fadeOut();
+			if (callback) {
+				callback(data.posts);
+			}
+		});
+	}
+
 	return Topic;
 });
--- a/public/src/forum/unread.js
+++ b/public/src/forum/unread.js
@@ -1,9 +1,8 @@
 define(function() {
-	var	Unread = {};
+	var Unread = {},
+		loadingMoreTopics = false;

 	Unread.init = function() {
-		var loadingMoreTopics = false;
-
 		app.enter_room('recent_posts');

 		ajaxify.register_events([
@@ -109,8 +108,9 @@ define(function() {
 		});


-		if ($("body").height() <= $(window).height() && $('#topics-container').children().length >= 20)
+		if ($("body").height() <= $(window).height() && $('#topics-container').children().length >= 20) {
 			$('#load-more-btn').show();
+		}

 		$('#load-more-btn').on('click', function() {
 			loadMoreTopics();
--- a/public/src/forum/users.js
+++ b/public/src/forum/users.js
@@ -36,7 +36,7 @@ define(function() {
 				var username = $('#search-user').val();

 				if (username == '') {
-					jQuery('#user-notfound-notify').html('<i class="icon icon-circle-blank"></i>');
+					jQuery('#user-notfound-notify').html('<i class="fa fa-circle-o"></i>');
 					jQuery('#user-notfound-notify').parent().removeClass('btn-warning label-warning btn-success label-success');
 					return;
 				}
@@ -44,7 +44,7 @@ define(function() {
 				if (lastSearch === username) return;
 				lastSearch = username;

-				jQuery('#user-notfound-notify').html('<i class="icon-spinner icon-spin"></i>');
+				jQuery('#user-notfound-notify').html('<i class="fa fa-spinner fa-spin"></i>');

 				setTimeout(function() {
 					socket.emit('api:admin.user.search', username);
--- a/public/src/modules/composer.js
+++ b/public/src/modules/composer.js
@@ -114,19 +114,19 @@ define(['taskbar'], function(taskbar) {
 													'<input type="text" tabIndex="1" placeholder="Enter your topic title here..." />' +
 													'<div class="btn-toolbar formatting-bar">' +
 														'<div class="btn-group">' +
-															'<span class="btn btn-link" tabindex="-1"><i class="icon-bold"></i></span>' +
-															'<span class="btn btn-link" tabindex="-1"><i class="icon-italic"></i></span>' +
-															'<span class="btn btn-link" tabindex="-1"><i class="icon-list"></i></span>' +
-															'<span class="btn btn-link" tabindex="-1"><i class="icon-link"></i></span>' +
+															'<span class="btn btn-link" tabindex="-1"><i class="fa fa-bold"></i></span>' +
+															'<span class="btn btn-link" tabindex="-1"><i class="fa fa-italic"></i></span>' +
+															'<span class="btn btn-link" tabindex="-1"><i class="fa fa-list"></i></span>' +
+															'<span class="btn btn-link" tabindex="-1"><i class="fa fa-link"></i></span>' +
 														'</div>' +
 													'</div>' +
 													'<textarea tabIndex="2"></textarea>' +
 													'<div class="imagedrop"><div>Drag and Drop Images Here</div></div>'+
 													'<div class="btn-toolbar action-bar">' +
 														'<div class="btn-group" style="float: right; margin-right: -8px">' +
-															'<button data-action="minimize" class="btn hidden-xs" tabIndex="4"><i class="icon-download-alt"></i> Minimize</button>' +
-															'<button class="btn" data-action="discard" tabIndex="5"><i class="icon-remove"></i> Discard</button>' +
-															'<button data-action="post" class="btn" tabIndex="3"><i class="icon-ok"></i> Submit</button>' +
+															'<button data-action="minimize" class="btn hidden-xs" tabIndex="4"><i class="fa fa-download"></i> Minimize</button>' +
+															'<button class="btn" data-action="discard" tabIndex="5"><i class="fa fa-times"></i> Discard</button>' +
+															'<button data-action="post" class="btn" tabIndex="3"><i class="fa fa-check"></i> Submit</button>' +
 														'</div>' +
 													'</div>' +
 												'</div>';
@@ -210,13 +210,17 @@ define(['taskbar'], function(taskbar) {
 					selectionEnd = postContentEl.selectionEnd,
 					selectionLength = selectionEnd - selectionStart;

+				function insertIntoInput(element, value) {
+					var start = postContentEl.selectionStart;
+					element.value = element.value.slice(0, start) + value + element.value.slice(start, element.value.length);
+					postContentEl.selectionStart = postContentEl.selectionEnd = start + value.length;
+				}
+
 				switch(iconClass) {
-					case 'icon-bold':
+					case 'fa fa-bold':
 						if (selectionStart === selectionEnd) {
 							// Nothing selected
-							postContentEl.value = postContentEl.value + '**bolded text**';
-							postContentEl.selectionStart = cursorEnd+2;
-							postContentEl.selectionEnd = postContentEl.value.length - 2;
+							insertIntoInput(postContentEl, "**bolded text**");
 						} else {
 							// Text selected
 							postContentEl.value = postContentEl.value.slice(0, selectionStart) + '**' + postContentEl.value.slice(selectionStart, selectionEnd) + '**' + postContentEl.value.slice(selectionEnd);
@@ -224,12 +228,10 @@ define(['taskbar'], function(taskbar) {
 							postContentEl.selectionEnd = selectionEnd + 2;
 						}
 					break;
-					case 'icon-italic':
+					case 'fa fa-italic':
 						if (selectionStart === selectionEnd) {
 							// Nothing selected
-							postContentEl.value = postContentEl.value + '*italicised text*';
-							postContentEl.selectionStart = cursorEnd+1;
-							postContentEl.selectionEnd = postContentEl.value.length - 1;
+							insertIntoInput(postContentEl, "*italicised text*");
 						} else {
 							// Text selected
 							postContentEl.value = postContentEl.value.slice(0, selectionStart) + '*' + postContentEl.value.slice(selectionStart, selectionEnd) + '*' + postContentEl.value.slice(selectionEnd);
@@ -237,18 +239,14 @@ define(['taskbar'], function(taskbar) {
 							postContentEl.selectionEnd = selectionEnd + 1;
 						}
 					break;
-					case 'icon-list':
+					case 'fa fa-list':
 						// Nothing selected
-						postContentEl.value = postContentEl.value + "\n\n* list item";
-						postContentEl.selectionStart = cursorEnd+4;
-						postContentEl.selectionEnd = postContentEl.value.length;
+						insertIntoInput(postContentEl, "\n\n* list item");
 					break;
-					case 'icon-link':
+					case 'fa fa-link':
 						if (selectionStart === selectionEnd) {
 							// Nothing selected
-							postContentEl.value = postContentEl.value + '[link text](link url)';
-							postContentEl.selectionStart = cursorEnd+12;
-							postContentEl.selectionEnd = postContentEl.value.length - 1;
+							insertIntoInput(postContentEl, "[link text](link url)");
 						} else {
 							// Text selected
 							postContentEl.value = postContentEl.value.slice(0, selectionStart) + '[' + postContentEl.value.slice(selectionStart, selectionEnd) + '](link url)' + postContentEl.value.slice(selectionEnd);
@@ -258,6 +256,7 @@ define(['taskbar'], function(taskbar) {
 					break;
 				}
 			});
+
 			window.addEventListener('resize', function() {
 				if (composer.active !== undefined) composer.reposition(composer.active);
 			});
--- a/public/src/modules/mobileMenu.js
+++ b/public/src/modules/mobileMenu.js
@@ -40,7 +40,7 @@ define(function() {

 			var category = categories[i];

-			image.className = category.icon + ' icon-3x';
+			image.className = category.icon + ' fa-3x';
 			name.innerHTML = '<br />' + category.name;
 			icon.appendChild(image);
 			icon.appendChild(name);
@@ -82,7 +82,7 @@ define(function() {
 				    cmp.push(0, cid);
 				});
 			};
-			postBtn.children[0].className = 'icon-plus icon-2x';
+			postBtn.children[0].className = 'fa fa-plus fa-2x';
 		} else if (tid) {
 			postBtn.style.display = 'inline-block';
 			postBtn.onclick = function() {
@@ -90,7 +90,7 @@ define(function() {
 				    cmp.push(tid);
 				});
 			};
-			postBtn.children[0].className = 'icon-reply icon-2x'
+			postBtn.children[0].className = 'fa fa-reply fa-2x'
 		} else {
 			postBtn.style.display = 'none';
 		}
--- a/public/src/templates.js
+++ b/public/src/templates.js
@@ -235,11 +235,11 @@
 		}

 		function makeRegex(block) {
-			return new RegExp("<!-- BEGIN " + block + " -->[\\s\\S]*<!-- END " + block + " -->", 'g');
+			return new RegExp("<!--[\\s]*BEGIN " + block + "[\\s]*-->[\\s\\S]*<!--[\\s]*END " + block + "[\\s]*-->", 'g');
 		}

 		function makeConditionalRegex(block) {
-			return new RegExp("<!-- IF " + block + " -->[\\s\\S]*<!-- ENDIF " + block + " -->", 'g');
+			return new RegExp("<!--[\\s]*IF " + block + "[\\s]*-->[\\s\\S]*<!--[\\s]*ENDIF " + block + "[\\s]*-->", 'g');
 		}

 		function getBlock(regex, block, template) {
@@ -248,22 +248,12 @@

 			if (self.blocks && block !== undefined) self.blocks[block] = data[0];

-			data = data[0]
-				.replace("<!-- BEGIN " + block + " -->", "")
-				.replace("<!-- END " + block + " -->", "");
-
-			return data;
-		}
-
-		function getConditionalBlock(regex, block, template) {
-			data = template.match(regex);
-			if (data == null) return;
-
-			if (self.blocks && block !== undefined) self.blocks[block] = data[0];
+			var begin = new RegExp("(\r\n)*<!-- BEGIN " + block + " -->(\r\n)*", "g"),
+				end = new RegExp("(\r\n)*<!-- END " + block + " -->(\r\n)*", "g"),

 			data = data[0]
-				.replace("<!-- IF " + block + " -->", "")
-				.replace("<!-- ENDIF " + block + " -->", "");
+				.replace(begin, "")
+				.replace(end, "");

 			return data;
 		}
@@ -275,7 +265,7 @@
 		var template = this.html,
 			regex, block;

-		return (function parse(data, namespace, template) {
+		return (function parse(data, namespace, template, blockInfo) {
 			if (!data || data.length == 0) {
 				template = '';
 			}
@@ -302,7 +292,7 @@
 							result = "";

 						do {
-							result += parse(data[d][i], namespace, block);
+							result += parse(data[d][i], namespace, block, {iterator: i, total: numblocks});
 						} while (i++ < numblocks);

 						namespace = namespace.replace(d + '.', '');
@@ -317,12 +307,37 @@
 						block = parse(data[d], namespace, block);
 						template = setBlock(regex, block, template);
 					} else {
-						var conditional = makeConditionalRegex(d),
-							block = getConditionalBlock(conditional, namespace, template);
+						function checkConditional(key, value) {
+							var conditional = makeConditionalRegex(key),
+								conditionalBlock = conditional.exec(template);
 							
-						if (block && !data[d]) {
+							if (conditionalBlock !== null) {
+								conditionalBlock = conditionalBlock[0].split(/<!-- ELSE -->/);
+								
+								if (conditionalBlock[1]) {
+									// there is an else statement
+									if (!value) {
+										template = template.replace(conditional, conditionalBlock[1]);	
+									} else {
+										template = template.replace(conditional, conditionalBlock[0]);	
+									}
+									
+								} else {
+									// regular if 
+									if (!value) {
 										template = template.replace(conditional, '');
 									}
+								}
+							}
+						}
+
+						checkConditional(namespace + d, data[d]);
+						checkConditional('!' + namespace + d, !data[d]);
+						
+						if (blockInfo) {
+							checkConditional('@first', blockInfo.iterator === 0);
+							checkConditional('@last', blockInfo.iterator === blockInfo.total);
+						}
 						
 						
 						template = replace(namespace + d, data[d], template);
--- a/public/src/utils.js
+++ b/public/src/utils.js
@@ -181,7 +181,7 @@
 				document.title = (numNotifications > 0 ? '(' + numNotifications + ') ' : '') + title;
 				notificationIcon = notificationIcon || document.querySelector('.notifications a i');
 				if (numNotifications > 0 && notificationIcon) {
-					notificationIcon.className = 'icon-circle active';
+					notificationIcon.className = 'fa fa-circle active';
 				}
 			});

--- a/public/templates/account.tpl
+++ b/public/templates/account.tpl
@@ -13,7 +13,7 @@
 				<img src="{picture}" class="user-profile-picture img-thumbnail"/>
 			</div>
 			<div class="account-online-status">
-				<span><i class="icon-circle-blank"></i> <span>offline</span></span>
+				<span><i class="fa fa-circle-o"></i> <span>offline</span></span>
 			</div>
 			<div class="{show_banned}">
 				<span class="label label-danger">banned</span>
@@ -27,7 +27,7 @@
 		<div class="col-md-4">
 			<div class="inline-block">
 				<div class="account-bio-block">
-					<span class="account-bio-label">email</span><i class="icon-eye-close {emailClass}" title="Email hidden"></i>
+					<span class="account-bio-label">email</span><i class="fa fa-eye-slash {emailClass}" title="Email hidden"></i>
 					<span>{email}</span>
 					<br/>

@@ -36,7 +36,7 @@
 					<br/>

 					<span class="account-bio-label">website</span>
-					<span><a href="{website}">{website}</a></span>
+					<span><a href="{website}">{websiteName}</a></span>
 					<br/>

 					<span class="account-bio-label">location</span>
--- a/public/templates/accountedit.tpl
+++ b/public/templates/accountedit.tpl
@@ -12,13 +12,13 @@
 					<div id="gravatar-box">
 						<img id="user-gravatar-picture" src="" class="img-thumbnail user-profile-picture">
 						<span class="user-picture-label">Gravatar</span>
-						<i class='icon-ok icon-2x'></i>
+						<i class='fa fa-check fa-2x'></i>
 					</div>
 					<br/>
 					<div id="uploaded-box">
 						<img id="user-uploaded-picture" src="" class="img-thumbnail user-profile-picture">
 						<span class="user-picture-label">Uploaded picture</span>
-						<i class='icon-ok icon-2x'></i>
+						<i class='fa fa-check fa-2x'></i>
 					</div>

 					<a id="uploadPictureBtn" href="#">Upload new picture</a>
@@ -33,7 +33,7 @@

 	<div class="account-username-box" data-userslug="{userslug}">
 		<span class="account-username">
-			<a href="/user/{userslug}">{username}</a> <i class="icon-chevron-right"></i>
+			<a href="/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
 			<a href="/user/{userslug}/edit">edit</a>
 		</span>
 	</div>
--- a/public/templates/accountsettings.tpl
+++ b/public/templates/accountsettings.tpl
@@ -3,7 +3,7 @@

 	<div class="account-username-box" data-userslug="{userslug}">
 		<span class="account-username">
-			<a href="/user/{userslug}">{username}</a> <i class="icon-chevron-right"></i>
+			<a href="/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
 			<a href="/user/{userslug}/settings">settings</a>
 		</span>
 	</div>
--- a/public/templates/admin/categories.tpl
+++ b/public/templates/admin/categories.tpl
--- a/public/templates/admin/groups.tpl
+++ b/public/templates/admin/groups.tpl
@@ -12,14 +12,14 @@
 					<p>{groups.description}</p>
 					<div class="btn-group">
 						<button class="btn btn-default" data-action="members">Members</button>
+						<!-- IF groups.deletable -->
 						<button class="btn btn-danger" data-action="delete">Delete Group</button>
+						<!-- ENDIF groups.deletable -->
 					</div>
 				</div>
 				<div class="col-lg-4">
 					<ul class="pull-right members">
-					<!-- BEGIN members -->
-						<li data-uid="{groups.members.uid}" title="{groups.members.username}"><img src="{groups.members.picture}" /></li>
-					<!-- END members -->
+					<!-- BEGIN members --><li data-uid="{groups.members.uid}" title="{groups.members.username}"><img src="{groups.members.picture}" /></li><!-- END members -->
 					</ul>
 				</div>
 			</div>
--- a/public/templates/admin/header.tpl
+++ b/public/templates/admin/header.tpl
@@ -12,6 +12,7 @@
 	<script type="text/javascript" src="{relative_path}/vendor/bootstrap/js/bootstrap.min.js"></script>
 	<script type="text/javascript" src="http://code.jquery.com/qunit/qunit-git.js"></script>
 	<link rel="stylesheet" type="text/css" href="http://code.jquery.com/qunit/qunit-git.css">
+	<link rel="stylesheet" type="text/css" href="{relative_path}/vendor/colorpicker/colorpicker.css">
 	<script type="text/javascript" src="{relative_path}/socket.io/socket.io.js"></script>
 	<script type="text/javascript" src="{relative_path}/src/app.js"></script>
 	<script type="text/javascript" src="{relative_path}/src/templates.js"></script>
@@ -21,6 +22,7 @@
 	<script src="{relative_path}/vendor/jquery/js/jquery.form.js"></script>
 	<script src="{relative_path}/vendor/requirejs/require.js"></script>
 	<script src="{relative_path}/vendor/bootbox/bootbox.min.js"></script>
+	<script src="{relative_path}/vendor/colorpicker/colorpicker.js"></script>

 	<script>
 		require.config({
@@ -39,7 +41,7 @@
 </head>

 <body class="admin">
-	<div class="navbar navbar-inverse navbar-fixed-top">
+	<div class="navbar navbar-inverse navbar-fixed-top header">
 		<div class="container">
 			<div class="navbar-header">
 				<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
@@ -52,20 +54,34 @@
 			<div class="collapse navbar-collapse">
 				<ul class="nav navbar-nav">
 					<li>
-					  <a href="/" target="_blank"><i class="icon-book"></i> Forum</a>
+						<a href="/admin/index"><i class="fa fa-home"></i> Home</a>
 					</li>
 					<li>
-					  <a href="/admin/index"><i class="icon-home"></i> Home</a>
+						<a href="/admin/settings"><i class="fa fa-cogs"></i> Settings</a>
 					</li>
 					<li>
-					  <a href="/admin/settings"><i class="icon-cogs"></i> Settings</a>
+						<a href="/" target="_top"><i class="fa fa-book"></i> Forum</a>
 					</li>
 					<li>
 						<a href="#" id="reconnect"></a>
 					</li>
 				</ul>
-				<ul class="nav pull-right" id="right-menu">
-					<li><a href="/users" id="user_label"></a></li>
+
+				<ul id="logged-in-menu" class="nav navbar-nav navbar-right">
+					<li id="user_label" class="dropdown">
+						<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="user_dropdown">
+							<img src="{userpicture}"/>
+						</a>
+						<ul id="user-control-list" class="dropdown-menu" aria-labelledby="user_dropdown">
+							<li>
+								<a id="user-profile-link" href="/user/{userslug}" target="_top"><span>Profile</span></a>
+							</li>
+							<li id="logout-link">
+								<a href="#">Log out</a>
+							</li>
+						</ul>
+					</li>
+
 				</ul>
 			</div>
 		</div>
@@ -80,26 +96,26 @@
 					<ul class="nav nav-list">
 						<li class="nav-header">NodeBB</li>
 						<li class='active'>
-							<a href='{relative_path}/admin/index'><i class='icon-home'></i> Home</a>
+							<a href='{relative_path}/admin/index'><i class='fa fa-home'></i> Home</a>
 						</li>
-						<li><a href='{relative_path}/admin/categories/active'><i class='icon-folder-close-alt'></i> Categories</a></li>
-						<li><a href='{relative_path}/admin/users/latest'><i class='icon-user'></i> Users</a></li>
-						<li><a href="{relative_path}/admin/groups"><i class="icon-group"></i> Groups</a></li>
-						<li><a href='{relative_path}/admin/topics'><i class='icon-book'></i> Topics</a></li>
-						<li><a href='{relative_path}/admin/themes'><i class='icon-th'></i> Themes</a></li>
-						<li><a href='{relative_path}/admin/plugins'><i class='icon-code-fork'></i> Plugins</a></li>
-						<li><a href='{relative_path}/admin/settings'><i class='icon-cogs'></i> Settings</a></li>
-						<li><a href='{relative_path}/admin/redis'><i class='icon-hdd'></i> Redis</a></li>
-						<li><a href='{relative_path}/admin/logger'><i class='icon-th'></i> Logger</a></li>
-						<li><a href="{relative_path}/admin/motd"><i class="icon-comment"></i> MOTD</a></li>
+						<li><a href='{relative_path}/admin/categories/active'><i class='fa fa-folder'></i> Categories</a></li>
+						<li><a href='{relative_path}/admin/users/latest'><i class='fa fa-user'></i> Users</a></li>
+						<li><a href="{relative_path}/admin/groups"><i class="fa fa-group"></i> Groups</a></li>
+						<li><a href='{relative_path}/admin/topics'><i class='fa fa-book'></i> Topics</a></li>
+						<li><a href='{relative_path}/admin/themes'><i class='fa fa-th'></i> Themes</a></li>
+						<li><a href='{relative_path}/admin/plugins'><i class='fa fa-code-fork'></i> Plugins</a></li>
+						<li><a href='{relative_path}/admin/settings'><i class='fa fa-cogs'></i> Settings</a></li>
+						<li><a href='{relative_path}/admin/redis'><i class='fa fa-hdd-o'></i> Redis</a></li>
+						<li><a href='{relative_path}/admin/logger'><i class='fa fa-th'></i> Logger</a></li>
+						<li><a href="{relative_path}/admin/motd"><i class="fa fa-comment"></i> MOTD</a></li>
 					</ul>
 				</div>
 				<div class="well sidebar-nav">
 					<ul class="nav nav-list">
 						<li class="nav-header">Social Authentication</li>
-						<li><a href='{relative_path}/admin/twitter'><i class='icon-twitter-sign'></i> Twitter</a></li>
-						<li><a href='{relative_path}/admin/facebook'><i class='icon-facebook-sign'></i> Facebook</a></li>
-						<li><a href='{relative_path}/admin/gplus'><i class='icon-google-plus-sign'></i> Google+</a></li>
+						<li><a href='{relative_path}/admin/twitter'><i class='fa fa-twitter-square'></i> Twitter</a></li>
+						<li><a href='{relative_path}/admin/facebook'><i class='fa fa-facebook-square'></i> Facebook</a></li>
+						<li><a href='{relative_path}/admin/gplus'><i class='fa fa-google-plus-square'></i> Google+</a></li>
 					</ul>
 				</div>
 				<div class="well sidebar-nav">
@@ -107,7 +123,7 @@
 						<li class="nav-header">Plugins</li>
 						<!-- BEGIN plugins -->
 						<li>
-							<a href='{relative_path}/admin{plugins.route}'><i class="{plugins.icon}"></i> {plugins.name}</a>
+							<a href='{relative_path}/admin{plugins.route}'><i class="fa {plugins.icon}"></i> {plugins.name}</a>
 						</li>
 						<!-- END plugins -->
 					</ul>
--- a/public/templates/admin/index.tpl
+++ b/public/templates/admin/index.tpl
@@ -3,10 +3,10 @@
 	<h1>Welcome to NodeBB</h1>
 	<br />
 	<p>
-		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="icon-comment"></i> NodeBB Forum</a>
-		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="icon-github-alt"></i> Get Plugins</a>
-		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="icon-github-alt"></i> Get Themes</a>
-		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="icon-twitter"></i> dcplabs</a>
+		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="fa fa-comment"></i> NodeBB Forum</a>
+		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="fa fa-github-alt"></i> Get Plugins</a>
+		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="fa fa-github-alt"></i> Get Themes</a>
+		<a target="_blank" href="http://www.nodebb.org" class="btn btn-default btn-lg"><i class="fa fa-twitter"></i> dcplabs</a>
 	</p>
 	<p><small>You are running <strong>NodeBB v{version}</strong>. Always make sure that your <strong>NodeBB</strong> is up to date for the latest security patches and bug fixes.</small></p>
 </div>
--- a/public/templates/admin/themes.tpl
+++ b/public/templates/admin/themes.tpl
@@ -6,7 +6,7 @@
 	The following themes are currently installed in this NodeBB instance.
 </p>
 <ul class="themes" id="installed_themes">
-	<li><i class="icon-refresh icon-spin"></i> Checking for installed themes...</li>
+	<li><i class="fa fa-refresh fa-spin"></i> Checking for installed themes...</li>
 </ul>

 <h3>Bootswatch Themes</h3>
@@ -15,7 +15,7 @@
 	with Bootstrap as a base theme.
 </p>
 <ul class="themes" id="bootstrap_themes">
-	<li><i class="icon-refresh icon-spin"></i> Loading Themes</li>
+	<li><i class="fa fa-refresh fa-spin"></i> Loading Themes</li>
 </ul>

 <h3>Revert to Default</h3>
--- a/public/templates/admin/topics.tpl
+++ b/public/templates/admin/topics.tpl
@@ -1,24 +1,33 @@
 <h1>Topics</h1>
 <hr />

+
 <ul class="topics">
 	<!-- BEGIN topics -->
 	<li data-tid="{topics.tid}" data-locked="{topics.locked}" data-pinned="{topics.pinned}" data-deleted="{topics.deleted}">
 		<div class="btn-group pull-right">
-			<button data-action="pin" class="btn"><i class="icon-pushpin"></i></button>
-			<button data-action="lock" class="btn"><i class="icon-lock"></i></button>
-			<button data-action="delete" class="btn"><i class="icon-trash"></i></button>
+			<button data-action="pin" class="btn"><i class="fa fa-thumb-tack"></i></button>
+			<button data-action="lock" class="btn"><i class="fa fa-lock"></i></button>
+			<button data-action="delete" class="btn"><i class="fa fa-trash-o"></i></button>
 		</div>
 		<a target="_blank" href="{relative_path}/topic/{topics.slug}">{topics.title}</a>
 		<ul>
-			<li><i class="icon-time"></i> Posted <span class="timeago" title="{topics.relativeTime}"></span> by {topics.username}</li>
-			<li><i class="icon-comments"></i> {topics.postcount} post(s)</li>
+			<li><i class="fa fa-clock-o"></i> Posted <span class="timeago" title="{topics.relativeTime}"></span> by {topics.username}</li>
+			<li><i class="fa fa-comments"></i> {topics.postcount} post(s)</li>
 		</ul>
 		<div class="clear"></div>
 	</li>
 	<!-- END topics -->
 </ul>

+<!-- IF notopics -->
+<div class="alert alert-warning" id="category-no-topics">
+	<strong>There are no topics.</strong>
+</div>
+<!-- ELSE -->
 <div class="text-center">
 	<button id="topics_loadmore" class="btn btn-primary btn-lg">Load More Topics</button>
 </div>
+<!-- ENDIF notopics -->
+
+
--- a/public/templates/admin/users.tpl
+++ b/public/templates/admin/users.tpl
@@ -10,7 +10,7 @@
 <br />
 <div class="search {search_display} well">
 	<input class="form-control" id="search-user" type="text" placeholder="Enter a username to search"/><br />
-	<i class="icon-spinner icon-spin none"></i>
+	<i class="fa fa-spinner fa-spin none"></i>
 	<span id="user-notfound-notify" class="label label-danger hide">User not found!</span><br/>
 </div>

@@ -24,12 +24,12 @@
 		<a href="/user/{users.userslug}">{users.username}</a>
 		<br/>
 		<div title="reputation">
+			<i class='fa fa-star'></i>
 			<span id='reputation'>{users.reputation}</span>
-			<i class='icon-star'></i>
 		</div>
 		<div title="post count">
+			<i class='fa fa-pencil'></i>
 			<span id='postcount'>{users.postcount}</span>
-			<i class='icon-pencil'></i>
 		</div>
 		<div>
 			<a href="#" class="btn btn-default ban-btn">Ban</a>
--- a/public/templates/category.tpl
+++ b/public/templates/category.tpl
@@ -3,7 +3,7 @@
 		<a href="/" itemprop="url"><span itemprop="title">[[global:home]]</span></a>
 	</li>
 	<li class="active" itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
-		<span itemprop="title">{category_name} <a target="_blank" href="../{category_id}.rss"><i class="icon-rss-sign"></i></a></span>
+		<span itemprop="title">{category_name} <a target="_blank" href="../{category_id}.rss"><i class="fa fa-rss-square"></i></a></span>
 	</li>
 	<div id="category_active_users"></div>
 </ol>
@@ -12,9 +12,9 @@
 	<button id="new_post" class="btn btn-primary btn-lg {show_topic_button}">[[category:new_topic_button]]</button>

 	<div class="inline-block pull-right">
-		<a href="#" id="facebook-share"><i class="icon-facebook-sign icon-2x"></i></a>&nbsp;
-		<a href="#" id="twitter-intent"><i class="icon-twitter-sign icon-2x"></i></a>&nbsp;
-		<a href="#" id="google-share"><i class="icon-google-plus-sign icon-2x"></i></a>&nbsp;
+		<a href="#" id="facebook-share"><i class="fa fa-facebook-square fa-2x"></i></a>&nbsp;
+		<a href="#" id="twitter-intent"><i class="fa fa-twitter-square fa-2x"></i></a>&nbsp;
+		<a href="#" id="google-share"><i class="fa fa-google-plus-square fa-2x"></i></a>&nbsp;
 	</div>
 </div>

@@ -38,7 +38,7 @@
 									<meta itemprop="name" content="{topics.title}">

 									<span class="topic-title">
-										<strong><i class="{topics.pin-icon}"></i> <i class="{topics.lock-icon}"></i></strong>
+										<strong><i class="fa {topics.pin-icon}"></i> <i class="fa {topics.lock-icon}"></i></strong>
 										{topics.title}
 									</span>
 								</h3>
@@ -62,6 +62,9 @@
 								</span>

 								<span class="pull-right hidden-xs">
+									<!-- IF topics.unreplied -->
+									No one has replied
+									<!-- ELSE -->
 									<a href="/user/{topics.teaser_userslug}">
 										<img class="teaser-pic" src="{topics.teaser_userpicture}" title="{topics.teaser_username}"/>
 									</a>
@@ -69,7 +72,7 @@
 										replied
 									</a>
 									<span class="timeago" title="{topics.teaser_timestamp}"></span>
-
+									<!-- ENDIF topics.unreplied -->
 								</span>
 							</small>
 						</div>
@@ -80,43 +83,35 @@
 		</ul>
 	</div>
 	<div class="col-md-3 {show_sidebar} category-sidebar">
-
-		<div class="sidebar-block img-thumbnail">
-			<div class="block-header">
-				[[category:sidebar.recent_replies]]
-			</div>
-			<div class="block-content recent-replies">
+		<div class="panel panel-default">
+			<div class="panel-heading">[[category:sidebar.recent_replies]]</div>
+			<div class="panel-body recent-replies">
 				<ul id="category_recent_replies"></ul>
 			</div>
 		</div>
-		<div class="sidebar-block img-thumbnail">
-			<div class="block-header">
-				[[category:sidebar.active_participants]]
-			</div>
-			<div class="block-content active-users">
+
+		<div class="panel panel-default">
+			<div class="panel-heading">[[category:sidebar.active_participants]]</div>
+			<div class="panel-body active-users">
 				<!-- BEGIN active_users -->
-				<a data-uid="{active_users.uid}" href="/user/{active_users.userslug}"><img title="{active_users.username}" src="{active_users.picture}" class="img-rounded" /></a>
+				<a data-uid="{active_users.uid}" href="/user/{active_users.userslug}"><img title="{active_users.username}" src="{active_users.picture}" class="img-rounded user-img" /></a>
 				<!-- END active_users -->
 			</div>
 		</div>
-		<div class="sidebar-block img-thumbnail {moderator_block_class}">
-			<div class="block-header">
-				[[category:sidebar.moderators]]
-			</div>
-			<div class="block-content">
+
+		<div class="panel panel-default {moderator_block_class}">
+			<div class="panel-heading">[[category:sidebar.moderators]]</div>
+			<div class="panel-body moderators">
 				<!-- BEGIN moderators -->
 				<a href="/user/{moderators.userslug}"><img title="{moderators.username}" src="{moderators.picture}" class="img-rounded" /></a>
 				<!-- END moderators -->
 			</div>
 		</div>
+
 		<!-- BEGIN sidebars -->
-		<div class="sidebar-block img-thumbnail {sidebars.block_class}">
-			<div class="block-header">
-				{sidebars.header}
-			</div>
-			<div class="block-content">
-				{sidebars.content}
-			</div>
+		<div class="panel panel-default">
+			<div class="panel panel-default {sidebars.block_class}">{sidebars.header}</div>
+			<div class="panel-body">{sidebars.content}</div>
 		</div>
 		<!-- END sidebars -->
 	</div>
--- a/public/templates/favourites.tpl
+++ b/public/templates/favourites.tpl
@@ -1,7 +1,7 @@
 <div class="well favourites">
 	<div class="account-username-box" data-userslug="{userslug}">
 		<span class="account-username">
-			<a href="/user/{userslug}">{username}</a> <i class="icon-chevron-right"></i>
+			<a href="/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
 			<a href="/user/{userslug}/favourites">favourites</a>
 		</span>
 	</div>
@@ -13,7 +13,8 @@
 			<!-- BEGIN posts -->
 			<div class="topic-row img-thumbnail clearfix" topic-url="topic/{posts.tid}/#{posts.pid}">
 				<span><strong>{posts.username}</strong> : </span>
-				<span>{posts.content}</span>
+				<span>{posts.category_name} >> {posts.title}</span>
+				<div>{posts.content}</div>
 				<div>
 					<span class="pull-right timeago" title="{posts.relativeTime}"></span>
 				</div>
--- a/public/templates/followers.tpl
+++ b/public/templates/followers.tpl
@@ -3,7 +3,7 @@

 	<div class="account-username-box" data-userslug="{userslug}">
 		<span class="account-username">
-			<a href="/user/{userslug}">{username}</a> <i class="icon-chevron-right"></i>
+			<a href="/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
 			<a href="/user/{userslug}/followers">followers</a>
 		</span>
 	</div>
@@ -19,12 +19,12 @@
 				<a href="/user/{followers.userslug}">{followers.username}</a>
 				<br/>
 				<div title="reputation" class="reputation">
+					<i class='fa fa-star'></i>
 					<span class='formatted-number'>{followers.reputation}</span>
-					<i class='icon-star'></i>
 				</div>
 				<div title="post count" class="post-count">
+					<i class='fa fa-pencil'></i>
 					<span class='formatted-number'>{followers.postcount}</span>
-					<i class='icon-pencil'></i>
 				</div>
 			</div>
 		</div>
--- a/public/templates/following.tpl
+++ b/public/templates/following.tpl
@@ -3,7 +3,7 @@

 	<div class="account-username-box" data-userslug="{userslug}">
 		<span class="account-username">
-			<a href="/user/{userslug}">{username}</a> <i class="icon-chevron-right"></i>
+			<a href="/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
 			<a href="/user/{userslug}/following">following</a>
 		</span>
 	</div>
@@ -20,11 +20,11 @@
 				<br/>
 				<div title="reputation" class="reputation">
 					<span class='formatted-number'>{following.reputation}</span>
-					<i class='icon-star'></i>
+					<i class='fa fa-star'></i>
 				</div>
 				<div title="post count" class="post-count">
 					<span class='formatted-number'>{following.postcount}</span>
-					<i class='icon-pencil'></i>
+					<i class='fa fa-pencil'></i>
 				</div>
 			</div>
 		</div>
--- a/public/templates/footer.tpl
+++ b/public/templates/footer.tpl
@@ -60,6 +60,7 @@


 	<footer id="footer" class="container footer">
+		{footerHTML}
 		<div class="copyright">Copyright &copy; 2013 <a target="_blank" href="http://www.nodebb.org">NodeBB</a> by <a target="_blank" href="https://github.com/psychobunny">psychobunny</a>, <a href="https://github.com/julianlam" target="_blank">julianlam</a>, <a href="https://github.com/barisusakli" target="_blank">barisusakli</a> from <a target="_blank" href="http://www.designcreateplay.com">designcreateplay</a></div>
 	</footer>

--- a/public/templates/header.tpl
+++ b/public/templates/header.tpl
@@ -60,8 +60,7 @@
 						<a href="/users">[[global:header.users]]</a>
 					</li>
 					<li class="{adminDisplay}">
-
-						<a href="/admin"><i class="icon-cogs"></i> [[global:header.admin]]</a>
+						<a href="/admin"><i class="fa fa-cogs"></i> [[global:header.admin]]</a>
 					</li>
 					<li class="visible-xs">
 						<a href="/search">[[global:header.search]]</a>
@@ -73,7 +72,6 @@
 					<!-- END navigation -->
 				</ul>

-
 				<ul id="logged-in-menu" class="nav navbar-nav navbar-right hide">
 					<li>
 						<a href="#" id="reconnect"></a>
@@ -87,15 +85,15 @@
 								</div>
 								<button type="submit" class="btn btn-default hide">[[global:search]]</button>
 							</div>
-							<button id="search-button" type="button" class="btn btn-link"><i class="icon-search"></i></button>
+							<button id="search-button" type="button" class="btn btn-link"><i class="fa fa-search"></i></button>
 						</form>
 					</li>

 					<li id="notifications-list" class="notifications dropdown text-center hidden-xs">
-						<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="notif_dropdown"><i class="icon-circle-blank"></i></a>
+						<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="notif_dropdown"><i class="fa fa-circle-o"></i></a>
 						<ul id="notif-list" class="dropdown-menu" aria-labelledby="notif_dropdown">
 							<li>
-								<a href="#"><i class="icon-refresh icon-spin"></i> [[global:notifications.loading]]</a>
+								<a href="#"><i class="fa fa-refresh fa-spin"></i> [[global:notifications.loading]]</a>
 							</li>
 						</ul>
 					</li>
@@ -117,8 +115,14 @@
 				</ul>

 				<ul id="logged-out-menu" class="nav navbar-nav navbar-right">
-					<li>
-						<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="loggedout_dropdown"><i class="icon-signin"></i></a>
+					<li class="visible-lg visible-md visible-sm">
+						<a href="/register">Register</a>
+					</li>
+					<li class="visible-lg visible-md visible-sm">
+						<a href="/login">Login</a>
+					</li>
+					<li class="visible-xs">
+						<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="loggedout_dropdown"><i class="fa fa-sign-in"></i></a>
 						<ul class="dropdown-menu" aria-labelledby="loggedout_dropdown">
 							<li>
 								<a href="/register">Register</a>
@@ -130,11 +134,15 @@
 					</li>
 				</ul>

-				<div class="pagination-block">
-					<i class="icon-upload pointer"></i>
+				<ul class="nav navbar-nav navbar-right pagination-block">
+					<li class="active">
+						<a>
+							<i class="fa fa-chevron-up pointer"></i>
 							<span id="pagination"></span>
-					<i class="icon-upload pointer icon-rotate-180"></i>
-				</div>
+							<i class="fa fa-chevron-down pointer"></i>
+						</a>
+					</li>
+				</ul>
 			</div>
 		</div>
 	</div>
--- a/public/templates/home.tpl
+++ b/public/templates/home.tpl
@@ -8,9 +8,9 @@
 		<a href="category/{categories.slug}" itemprop="url">
 			<meta itemprop="name" content="{categories.name}">
 			<h4><span class="badge {categories.badgeclass}">{categories.topic_count} </span> {categories.name}</h4>
-			<div class="icon {categories.blockclass}">
+			<div class="icon" style="background: {categories.bgColor}; color: {categories.color};">
 				<div id="category-{categories.cid}" class="category-slider-{categories.post_count}">
-					<div class="category-box"><i class="{categories.icon} icon-4x"></i></div>
+					<div class="category-box"><i class="fa {categories.icon} fa-4x"></i></div>
 					<div class="category-box" itemprop="description">{categories.description}</div>
 					<!-- BEGIN posts -->
 					<div class="category-box">
@@ -20,7 +20,7 @@
 						</div>
 					</div>
 					<!-- END posts -->
-					<div class="category-box"><i class="{categories.icon} icon-4x"></i></div>
+					<div class="category-box"><i class="fa {categories.icon} fa-4x"></i></div>
 				</div>
 			</div>
 		</a>
--- a/public/templates/install/basic.tpl
+++ b/public/templates/install/basic.tpl
@@ -30,10 +30,10 @@

 <hr />
 <div class="pull-right">
-	<button data-path="mail" class="btn btn-primary btn-lg">Next &ndash; <i class="icon-envelope"></i> Mail</button>
+	<button data-path="mail" class="btn btn-primary btn-lg">Next &ndash; <i class="fa fa-envelope"></i> Mail</button>
 </div>
 <div>
-	<button data-path="redis" class="btn btn-primary btn-lg">Previous &ndash; <i class="icon-hdd"></i> Redis</button>
+	<button data-path="redis" class="btn btn-primary btn-lg">Previous &ndash; <i class="fa fa-hdd-o"></i> Redis</button>
 </div>

 <script>
--- a/public/templates/install/header.tpl
+++ b/public/templates/install/header.tpl
@@ -34,13 +34,13 @@
 				<div class="nav-collapse collapse">
 					<ul class="nav nodebb-inline-block">
 						<li>
-							<a data-tab="email" href="/install/email"><i class="icon-envelope"></i> Mail</a>
+							<a data-tab="email" href="/install/email"><i class="fa fa-envelope"></i> Mail</a>
 						</li>
 						<li>
-							<a data-tab="social" href="/install/social"><i class="icon-facebook"></i> Social</a>
+							<a data-tab="social" href="/install/social"><i class="fa fa-facebook"></i> Social</a>
 						</li>
 						<li>
-							<a data-tab="privileges" href="/install/privileges"><i class="icon-legal"></i> Privileges</a>
+							<a data-tab="privileges" href="/install/privileges"><i class="fa fa-gavel"></i> Privileges</a>
 						</li>
 					</ul>
 				</div>
--- a/public/templates/install/mail.tpl
+++ b/public/templates/install/mail.tpl
@@ -23,7 +23,7 @@

 <hr />
 <div class="pull-right">
-	<button data-path="social" class="btn btn-primary btn-lg">Next &ndash; <i class="icon-facebook"></i> Social</button>
+	<button data-path="social" class="btn btn-primary btn-lg">Next &ndash; <i class="fa fa-facebook"></i> Social</button>
 </div>

 <script>
--- a/public/templates/install/privileges.tpl
+++ b/public/templates/install/privileges.tpl
@@ -1,4 +1,3 @@
-
 <h1>User Privilege Thresholds</h1>

 <form class="form-inline">
@@ -15,22 +14,22 @@
 		<label>Manage Content</label> <input type="number" class="input-mini" value="1000" placeholder="1000" data-field="privileges:manage_content" />
 	</p>
 	<p>
-		Users with reach the "Manage Content" threshold are able to edit/delete other users' posts.
+		Users who reach the "Manage Content" threshold are able to edit/delete other users' posts.
 	</p>
 	<p>
 		<label>Manage Topics</label> <input type="number" class="input-mini" value="2000" placeholder="2000" data-field="privileges:manage_topic" />
 	</p>
 	<p>
-		Users with reach the "Manage Topics" threshold are able to edit, lock, pin, close, and delete topics.
+		Users who reach the "Manage Topics" threshold are able to edit, lock, pin, close, and delete topics.
 	</p>
 </form>

 <hr />
 <div class="pull-right">
-	<button id="start-nodebb" class="btn btn-success btn-lg"><i class="icon-thumbs-up"></i> Start using NodeBB!</button>
+	<button id="start-nodebb" class="btn btn-success btn-lg"><i class="fa fa-thumbs-up"></i> Start using NodeBB!</button>
 </div>
 <div>
-	<button data-path="social" class="btn btn-primary btn-lg">Previous &ndash; <i class="icon-facebook"></i> Social</button>
+	<button data-path="social" class="btn btn-primary btn-lg">Previous &ndash; <i class="fa fa-facebook"></i> Social</button>
 </div>

 <script>
--- a/public/templates/install/redis.tpl
+++ b/public/templates/install/redis.tpl
@@ -32,7 +32,7 @@

 <hr />
 <div class="pull-right">
-	<button data-path="basic" class="btn btn-primary btn-lg" disabled>Next &ndash; <i class="icon-cog"></i> Basic</button>
+	<button data-path="basic" class="btn btn-primary btn-lg" disabled>Next &ndash; <i class="fa fa-cog"></i> Basic</button>
 </div>

 <script>
@@ -43,7 +43,7 @@

 			if (e.target.className.indexOf('testing') === -1) {
 				e.target.className += ' testing';
-				e.target.innerHTML = '<i class="icon-spinner icon-spin"></i> Testing';
+				e.target.innerHTML = '<i class="fa fa-spinner fa-spin"></i> Testing';
 				socket.once('api:config.redisTest', function(data) {
 					if (data && data.status === 'ok') {
 						e.target.className = 'btn btn-success testing';
--- a/public/templates/install/social.tpl
+++ b/public/templates/install/social.tpl
@@ -34,10 +34,10 @@

 <hr />
 <div class="pull-right">
-	<button data-path="privileges" class="btn btn-primary btn-lg">Next &ndash; <i class="icon-legal"></i> Privileges</button>
+	<button data-path="privileges" class="btn btn-primary btn-lg">Next &ndash; <i class="fa fa-gavel"></i> Privileges</button>
 </div>
 <div>
-	<button data-path="mail" class="btn btn-primary btn-lg">Previous &ndash; <i class="icon-envelope"></i> Mail</button>
+	<button data-path="mail" class="btn btn-primary btn-lg">Previous &ndash; <i class="fa fa-envelope"></i> Mail</button>
 </div>

 <script>
--- a/public/templates/login.tpl
+++ b/public/templates/login.tpl
@@ -40,7 +40,7 @@
 				</div>
 				<div class="form-group">
 					<div class="col-lg-offset-2 col-lg-10">
-						<button class="btn btn-primary" id="login" type="submit">[[login:login]]</button> &nbsp; <a href="/reset">[[login:forgot_password]]</a>
+						<button class="btn btn-primary" id="login" type="submit">[[login:login]]</button> &nbsp; <a id="reset-link" class="hide" href="/reset">[[login:forgot_password]]</a>
 					</div>
 				</div>
 				<input type="hidden" name="_csrf" value="{token}" id="csrf-token" />
@@ -53,9 +53,9 @@
 		<div class="well well-lg">
 			<h4>[[login:alternative_logins]]</h4>
 			<ul class="alt-logins">
-				<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="icon-twitter-sign icon-3x"></i></li>
-				<li data-url="/auth/google" class="google {google:display}"><i class="icon-google-plus-sign icon-3x"></i></li>
-				<li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="icon-facebook-sign icon-3x"></i></li>
+				<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="fa fa-twitter-square fa-3x"></i></li>
+				<li data-url="/auth/google" class="google {google:display}"><i class="fa fa-google-plus-square fa-3x"></i></li>
+				<li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="fa fa-facebook-square fa-3x"></i></li>
 			</ul>
 		</div>
 	</div>
--- a/public/templates/noscript/home.tpl
+++ b/public/templates/noscript/home.tpl
@@ -1,7 +1,7 @@
 		<ul class="categories">
 			<!-- BEGIN categories -->
 			<li>
-				<div class="icon"><i class="{categories.icon} icon-4x"></i></div>
+				<div class="icon"><i class="{categories.icon} fa-4x"></i></div>
 				<a href="category/{categories.slug}">{categories.name}</a>
 				<p>{categories.description}</p>
 				<div class="clear"></div>
--- a/public/templates/noscript/topic.tpl
+++ b/public/templates/noscript/topic.tpl
@@ -1,18 +1,4 @@
 		<ul class="posts">
-			<!-- BEGIN main_posts -->
-			<li>
-				<a name="{main_posts.pid}"></a>
-				<div class="row">
-					<div class="col-lg-2 profile">
-						<img class="img-thumbnail" src="{main_posts.picture}" /><br />
-						<span class="username">{main_posts.username}</span>
-					</div>
-					<div class="col-lg-10">
-						{main_posts.content}
-					</div>
-				</div>
-			</li>
-			<!-- END main_posts -->
 			<!-- BEGIN posts -->
 			<li>
 				<a name="{posts.pid}"></a>
--- a/public/templates/notifications.tpl
+++ b/public/templates/notifications.tpl
@@ -5,7 +5,7 @@
 <ul class="notifications-list">
 <!-- BEGIN notifications -->
 	<li data-nid="{notifications.nid}" class="{notifications.readClass}">
-		<a href="..{notifications.path}">{notifications.text}</a>
+		<a href="{notifications.path}">{notifications.text}</a>
 		<p class="timestamp">
 			<span class="timeago" title="{notifications.datetimeISO}"></span>
 		</p>
--- a/public/templates/outgoing.tpl
+++ b/public/templates/outgoing.tpl
@@ -10,11 +10,11 @@

 	<div class="well">
 		<h3>
-			You are now leaving NodeBB.
+			You are now leaving {title}.
 		</h3>
 		<p>
 			<a href="{url}" rel="nofollow" class="btn btn-primary btn-lg">Continue to {url}</a>
-			<a id="return-btn" href="#" class="btn btn-lg btn-warning">Return to NodeBB</a>
+			<a id="return-btn" href="#" class="btn btn-lg btn-warning">Return to {title}</a>
 		</p>
 	</div>
 </div>
--- a/public/templates/recent.tpl
+++ b/public/templates/recent.tpl
@@ -1,7 +1,6 @@
 <ol class="breadcrumb">
 	<li><a href="/">Home</a></li>
-	<li class="active">{category_name}</li>
-	<div id="category_active_users"></div>
+	<li class="active">Recent <a href="./recent.rss"><i class="fa fa-rss-square"></i></a></li>
 </ol>

 <ul class="nav nav-pills">
@@ -21,7 +20,7 @@
 </div>

 <div class="category row">
-	<div class="{topic_row_size}">
+	<div class="col-md-12">
 		<ul id="topics-container">
 		<!-- BEGIN topics -->
 		<li class="category-item {topics.deleted-class}">
@@ -29,7 +28,7 @@
 				<div class="col-md-12 col-xs-12 topic-row img-thumbnail">

 					<a href="../../topic/{topics.slug}">
-						<h3><span class="topic-title"><strong><i class="{topics.pin-icon}"></i> <i class="{topics.lock-icon}"></i></strong> {topics.title}</span></h3>
+						<h3><span class="topic-title"><strong><i class="fa {topics.pin-icon}"></i> <i class="fa {topics.lock-icon}"></i></strong> {topics.title}</span></h3>
 					</a>
 					<small>
 						<span class="topic-stats">
@@ -48,13 +47,16 @@
 							</a>
 							posted in
 							<a href="../../category/{topics.categorySlug}">
-								<i class="{topics.categoryIcon}"></i> {topics.categoryName}
+								<i class="fa {topics.categoryIcon}"></i> {topics.categoryName}
 							</a>
 							<span class="timeago" title="{topics.relativeTime}"></span>
 							</span>
 						</span>

 						<span class="pull-right hidden-xs">
+							<!-- IF topics.unreplied -->
+							No one has replied
+							<!-- ELSE -->
 							<a href="/user/{topics.teaser_userslug}">
 								<img class="teaser-pic" src="{topics.teaser_userpicture}" title="{topics.teaser_username}"/>
 							</a>
@@ -62,7 +64,7 @@
 								replied
 							</a>
 							<span class="timeago" title="{topics.teaser_timestamp}"></span>
-
+							<!-- ENDIF topics.unreplied -->
 						</span>
 					</small>
 				</div>
--- a/public/templates/register.tpl
+++ b/public/templates/register.tpl
@@ -17,7 +17,7 @@
 						<div class="input-group">
 							<input class="form-control" type="text" placeholder="[[register:email_address_placeholder]]" name="email" id="email" />
 					        <span class="input-group-addon">
-					        	<span id="email-notify"><i class="icon icon-circle-blank"></i></span>
+					        	<span id="email-notify"><i class="fa fa-circle-o"></i></span>
 					        </span>
 						</div>
 						<span class="help-block">[[register:help.email]]</span>
@@ -29,7 +29,7 @@
 						<div class="input-group">
 							<input class="form-control" type="text" placeholder="[[register:username_placeholder]]" name="username" id="username" />
 					        <span class="input-group-addon">
-					        	<span id="username-notify"><i class="icon icon-circle-blank"></i></span>
+					        	<span id="username-notify"><i class="fa fa-circle-o"></i></span>
 					        </span>
 						</div>
 						<span class="help-block">[[register:help.username_restrictions, {minimumUsernameLength}, {maximumUsernameLength}]]</span>
@@ -41,7 +41,7 @@
 						<div class="input-group">
 							<input class="form-control" type="password" placeholder="[[register:password_placeholder]]" name="password" id="password" />
 					        <span class="input-group-addon">
-					        	<span id="password-notify"><i class="icon icon-circle-blank"></i></span>
+					        	<span id="password-notify"><i class="fa fa-circle-o"></i></span>
 					        </span>
 						</div>
 						<span class="help-block">[[register:help.minimum_password_length, {minimumPasswordLength}]]</span>
@@ -53,7 +53,7 @@
 						<div class="input-group">
 							<input class="form-control" type="password" placeholder="[[register:confirm_password_placeholder]]" name="password-confirm" id="password-confirm" />
 					        <span class="input-group-addon">
-					        	<span id="password-confirm-notify"><i class="icon icon-circle-blank"></i></span>
+					        	<span id="password-confirm-notify"><i class="fa fa-circle-o"></i></span>
 					        </span>
 						</div>
 					</div>
@@ -73,9 +73,9 @@
 		<div class="well well-lg">
 			<h4>[[register:alternative_registration]]</h4>
 			<ul class="alt-logins">
-				<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="icon-twitter-sign icon-3x"></i></li>
-				<li data-url="/auth/google" class="google {google:display}"><i class="icon-google-plus-sign icon-3x"></i></li>
-				<li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="icon-facebook-sign icon-3x"></i></li>
+				<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="fa fa-twitter-square fa-3x"></i></li>
+				<li data-url="/auth/google" class="google {google:display}"><i class="fa fa-google-plus-square fa-3x"></i></li>
+				<li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="fa fa-facebook-square fa-3x"></i></li>
 			</ul>
 		</div>
 	</div>
--- a/public/templates/topic.tpl
+++ b/public/templates/topic.tpl
@@ -9,7 +9,8 @@
 <input type="hidden" template-variable="facebook-share-url" value="{facebook-share-url}" />
 <input type="hidden" template-variable="google-share-url" value="{google-share-url}" />

-<div class="topic row">
+<div class="container">
+	<div class="topic row">
 		<ol class="breadcrumb">
 			<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
 				<a href="/" itemprop="url"><span itemprop="title">[[global:home]]</span></a>
@@ -18,99 +19,36 @@
 				<a href="/category/{category_slug}" itemprop="url"><span itemprop="title">{category_name}</span></a>
 			</li>
 			<li class="active" itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
-			<span itemprop="title">{topic_name} <a target="_blank" href="../{topic_id}.rss"><i class="icon-rss-sign"></i></a></span>
+				<span itemprop="title">{topic_name} <a target="_blank" href="../{topic_id}.rss"><i class="fa fa-rss-square"></i></a></span>
 			</li>
-		<div class="thread_active_users active-users pull-right hidden-xs"></div>
+
 		</ol>

 		<ul id="post-container" class="container" data-tid="{topic_id}">
-		<!-- BEGIN main_posts -->
-			<a id="post_anchor_{main_posts.pid}" name="{main_posts.pid}"></a>
-			<li class="row post-row main-post" data-pid="{main_posts.pid}" data-uid="{main_posts.uid}" data-username="{main_posts.username}" data-deleted="{main_posts.deleted}" itemscope itemtype="http://schema.org/Article">
-				<div class="col-md-12">
-					<div class="post-block">
-						<meta itemprop="datePublished" content="{main_posts.relativeTime}">
-						<meta itemprop="dateModified" content="{main_posts.relativeEditTime}">
-						<meta itemprop="url" content="/topic/{slug}/">
-						<a class="avatar" href="/user/{main_posts.userslug}">
-							<img itemprop="image" src="{main_posts.picture}" align="left" class="img-thumbnail" width=150 height=150 /><br />
-						</a>
-						<h3>
-							<p id="topic_title_{main_posts.pid}" class="topic-title" itemprop="name">{topic_name}</p>
-						</h3>
-
-						<div class="topic-buttons">
-							<div class="btn-group">
-								<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" type="button" title="[[topic:posted_by]] {main_posts.username}">
-									<span class="username-field" href="/user/{main_posts.userslug}" itemprop="author" itemscope itemtype="http://schema.org/Person">{main_posts.username}&nbsp;</span>
-									<span class="caret"></span>
-								</button>
-							    <ul class="dropdown-menu">
-									<li><a href="/user/{main_posts.userslug}"><i class="icon-user"></i> [[topic:profile]]</a></li>
-									<li><div class="chat"><i class="icon-comment"></i> [[topic:chat]]</div></li>
-							    </ul>
-							</div>
-
-							<div class="btn-group">
-								<button class="btn btn-sm btn-default follow" type="button" title="Be notified of new replies in this topic"><i class="icon-eye-open"></i></button>
-								<button class="favourite btn btn-sm btn-default {main_posts.fav_button_class}" type="button">
-									<span class="favourite-text">[[topic:favourite]]</span>
-									<span class="post_rep_{main_posts.pid}">{main_posts.post_rep} </span><i class="{main_posts.fav_star_class}"></i>
-								</button>
-							</div>
-							<div class="btn-group">
-								<button class="btn btn-sm btn-default quote" type="button" title="[[topic:quote]]"><i class="icon-quote-left"></i></button>
-								<button class="btn btn-sm btn-primary btn post_reply" type="button">[[topic:reply]] <i class="icon-reply"></i></button>
-							</div>
-
-
-							<div class="btn-group pull-right post-tools">
-								<button class="btn btn-sm btn-default edit {main_posts.display_moderator_tools}" type="button" title="[[topic:edit]]"><i class="icon-pencil"></i></button>
-								<button class="btn btn-sm btn-default delete {main_posts.display_moderator_tools}" type="button" title="[[topic:delete]]"><i class="icon-trash"></i></button>
-							</div>
-
-							<div class="btn-group pull-right post-tools">
-								<button class="btn btn-sm btn-default link" type="button" title="[[topic:link]]"><i class="icon-link"></i></button>
-								<button class="btn btn-sm btn-default facebook-share" type="button" title=""><i class="icon-facebook"></i></button>
-								<button class="btn btn-sm btn-default twitter-share" type="button" title=""><i class="icon-twitter"></i></button>
-								<button class="btn btn-sm btn-default google-share" type="button" title=""><i class="icon-google-plus"></i></button>
-							</div>
-
-							<input id="post_{main_posts.pid}_link" value="" class="pull-right" style="display:none;"></input>
-
-						</div>
-
-						<div id="content_{main_posts.pid}" class="post-content" itemprop="articleBody">{main_posts.content}</div>
-						<div class="post-signature">{main_posts.signature}</div>
-						<div class="post-info">
-							<span class="pull-left">
-								{main_posts.additional_profile_info}
-							</span>
-							<span class="pull-right">
-								posted <span class="relativeTimeAgo timeago" title="{main_posts.relativeTime}"></span>
-								<span class="{main_posts.edited-class}">| last edited by <strong><a href="/user/{main_posts.editorslug}">{main_posts.editorname}</a></strong></span>
-								<span class="timeago" title="{main_posts.relativeEditTime}"></span>
-							</span>
-							<div style="clear:both;"></div>
-						</div>
-					</div>
-				</div>
-			</li>
-		<!-- END main_posts -->
-
+			<div class="posts">
 			<!-- BEGIN posts -->
+				<li class="row post-row infiniteloaded" data-pid="{posts.pid}" data-uid="{posts.uid}" data-username="{posts.username}" data-deleted="{posts.deleted}" itemscope itemtype="http://schema.org/Comment">
 					<a id="post_anchor_{posts.pid}" name="{posts.pid}"></a>
-			<li class="row post-row sub-posts" data-pid="{posts.pid}" data-uid="{posts.uid}" data-username="{posts.username}" data-deleted="{posts.deleted}" itemscope itemtype="http://schema.org/Comment">
+
 					<meta itemprop="datePublished" content="{posts.relativeTime}">
 					<meta itemprop="dateModified" content="{posts.relativeEditTime}">
-				<div class="col-md-1 profile-image-block hidden-xs hidden-sm">
+
+					<div class="col-md-1 profile-image-block hidden-xs hidden-sm sub-post">
 						<a href="/user/{posts.userslug}">
 							<img src="{posts.picture}" align="left" class="img-thumbnail" itemprop="image" />
 							<span class="label label-danger {posts.show_banned}">[[topic:banned]]</span>
 						</a>
 					</div>
+
 					<div class="col-md-11">
 						<div class="post-block">
+							<a class="main-post avatar" href="/user/{posts.userslug}">
+								<img itemprop="image" src="{posts.picture}" align="left" class="img-thumbnail" width=150 height=150 />
+							</a>
+							<h3 class="main-post">
+								<p id="topic_title_{posts.pid}" class="topic-title" itemprop="name">{topic_name}</p>
+							</h3>
+
 							<div class="topic-buttons">
 								<div class="btn-group">
 									<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" type="button" title="Posted by {posts.username}">
@@ -119,33 +57,37 @@
 									</button>

 								    <ul class="dropdown-menu">
-									<li><a href="/user/{posts.userslug}"><i class="icon-user"></i> [[topic:profile]]</a></li>
-									<li><div class="chat"><i class="icon-comment"></i> [[topic:chat]]</div></li>
+										<li><a href="/user/{posts.userslug}"><i class="fa fa-user"></i> [[topic:profile]]</a></li>
+										<li><div class="chat"><i class="fa fa-comment"></i> [[topic:chat]]</div></li>
 								    </ul>
 								</div>

 								<div class="btn-group">
+									<button class="btn btn-sm btn-default follow main-post" type="button" title="Be notified of new replies in this topic"><i class="fa fa-eye"></i></button>
 									<button class="favourite btn btn-sm btn-default {posts.fav_button_class}" type="button">
 										<span class="favourite-text">[[topic:favourite]]</span>
-									<span class="post_rep_{posts.pid}">{posts.post_rep} </span><i class="{posts.fav_star_class}"></i>
+										<span class="post_rep_{posts.pid}">{posts.post_rep} </span><i class="fa {posts.fav_star_class}"></i>
 									</button>
 								</div>
 								<div class="btn-group">
-								<button class="btn btn-sm btn-default quote" type="button" title="[[topic:quote]]"><i class="icon-quote-left"></i></button>
-								<button class="btn btn-sm btn-primary btn post_reply" type="button">[[topic:reply]] <i class="icon-reply"></i></button>
+									<button class="btn btn-sm btn-default quote" type="button" title="[[topic:quote]]"><i class="fa fa-quote-left"></i></button>
+									<button class="btn btn-sm btn-primary btn post_reply" type="button">[[topic:reply]] <i class="fa fa-reply"></i></button>
 								</div>

 								<div class="btn-group pull-right post-tools">
-								<button class="btn btn-sm btn-default link" type="button" title="[[topic:link]]"><i class="icon-link"></i></button>
-								<button class="btn btn-sm btn-default edit {posts.display_moderator_tools}" type="button" title="[[topic:edit]]"><i class="icon-pencil"></i></button>
-								<button class="btn btn-sm btn-default delete {posts.display_moderator_tools}" type="button" title="[[topic:delete]]"><i class="icon-trash"></i></button>
+									<button class="btn btn-sm btn-default link" type="button" title="[[topic:link]]"><i class="fa fa-link"></i></button>
+									<button class="btn btn-sm btn-default edit {posts.display_moderator_tools}" type="button" title="[[topic:edit]]"><i class="fa fa-pencil"></i></button>
+									<button class="btn btn-sm btn-default delete {posts.display_moderator_tools}" type="button" title="[[topic:delete]]"><i class="fa fa-trash-o"></i></button>
 								</div>

 								<input id="post_{posts.pid}_link" value="" class="pull-right" style="display:none;"></input>
 							</div>

 							<div id="content_{posts.pid}" class="post-content" itemprop="text">{posts.content}</div>
+							<!-- IF posts.signature -->
 							<div class="post-signature">{posts.signature}</div>
+							<!-- ENDIF posts.signature -->
+
 							<div class="post-info">
 								<span class="pull-left">
 									{posts.additional_profile_info}
@@ -160,39 +102,59 @@
 						</div>
 					</div>
 				</li>
-		<!-- END posts -->
-	</ul>

-	<div id="loading-indicator" style="text-align:center;" class="hide" done="0">
-		<i class="icon-spinner icon-spin icon-large"></i>
+				<!-- IF @first -->
+				<li class="well post-bar">
+					<div class="inline-block">
+						<small class="topic-stats">
+							<span>posts</span>
+							<strong><span id="topic-post-count" class="formatted-number">{postcount}</span></strong> |
+							<span>views</span>
+							<strong><span class="formatted-number">{viewcount}</span></strong> |
+							<span>browsing</span>
+						</small>
+						<div class="thread_active_users active-users inline-block"></div>
 					</div>
-
-	<hr />
-
-	<div class="topic-main-buttons">
-		<button id="post_reply" class="btn btn-primary btn-lg post_reply" type="button">[[topic:reply]]</button>
-		<div class="btn-group pull-right" id="thread-tools" style="visibility: hidden;">
-			<button class="btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown" type="button">[[topic:thread_tools.title]] <span class="caret"></span></button>
+					<div class="topic-main-buttons pull-right inline-block">
+						<button class="btn btn-primary post_reply" type="button">[[topic:reply]]</button>
+						<div class="btn-group thread-tools hide">
+							<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">[[topic:thread_tools.title]] <span class="caret"></span></button>
 							<ul class="dropdown-menu">
-				<li><a href="#" id="pin_thread"><i class="icon-pushpin"></i> [[topic:thread_tools.pin]]</a></li>
-				<li><a href="#" id="lock_thread"><i class="icon-lock"></i> [[topic:thread_tools.lock]]</a></li>
+								<li><a href="#" class="pin_thread"><i class="fa fa-thumb-tack"></i> [[topic:thread_tools.pin]]</a></li>
+								<li><a href="#" class="lock_thread"><i class="fa fa-lock"></i> [[topic:thread_tools.lock]]</a></li>
 								<li class="divider"></li>
-				<li><a href="#" id="move_thread"><i class="icon-move"></i> [[topic:thread_tools.move]]</a></li>
+								<li><a href="#" class="move_thread"><i class="fa fa-arrows"></i> [[topic:thread_tools.move]]</a></li>
 								<li class="divider"></li>
-				<li><a href="#" id="delete_thread"><span class="text-error"><i class="icon-trash"></i> [[topic:thread_tools.delete]]</span></a></li>
+								<li><a href="#" class="delete_thread"><span class="text-error"><i class="fa fa-trash-o"></i> [[topic:thread_tools.delete]]</span></a></li>
 							</ul>
 						</div>
 					</div>
+					<div style="clear:both;"></div>
+				</li>
+				<!-- ENDIF @first -->
+			<!-- END posts -->
+			</div>
+		</ul>

-	<div class="mobile-author-overlay">
-		<div class="row">
-			<div class="col-xs-3">
-				<img id="mobile-author-image" src="" width=50 height=50 />
+		<div class="well col-md-11 col-xs-12 pull-right hide">
+			<div class="topic-main-buttons pull-right inline-block hide">
+				<div class="loading-indicator" done="0" style="display:none;">
+					Loading <span class="hidden-xs" style="display:inline!important;">More Posts</span> <i class="fa fa-refresh fa-spin"></i>
 				</div>
-			<div class="col-xs-9">
-				<h4><div id="mobile-author-overlay"></div></h4>
+				<button class="btn btn-primary post_reply" type="button">[[topic:reply]]</button>
+				<div class="btn-group thread-tools hide">
+					<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">[[topic:thread_tools.title]] <span class="caret"></span></button>
+					<ul class="dropdown-menu">
+						<li><a href="#" class="pin_thread"><i class="fa fa-thumb-tack"></i> [[topic:thread_tools.pin]]</a></li>
+						<li><a href="#" class="lock_thread"><i class="fa fa-lock"></i> [[topic:thread_tools.lock]]</a></li>
+						<li class="divider"></li>
+						<li><a href="#" class="move_thread"><i class="fa fa-arrows"></i> [[topic:thread_tools.move]]</a></li>
+						<li class="divider"></li>
+						<li><a href="#" class="delete_thread"><span class="text-error"><i class="fa fa-trash-o"></i> [[topic:thread_tools.delete]]</span></a></li>
+					</ul>
 				</div>
 			</div>
+			<div style="clear:both;"></div>
 		</div>

 		<div id="move_thread_modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="Move Topic" aria-hidden="true">
@@ -203,7 +165,7 @@
 						<h3>Move Topic</h3>
 					</div>
 					<div class="modal-body">
-					<p id="categories-loading"><i class="icon-spin icon-refresh"></i> [[topic:load_categories]]</p>
+						<p id="categories-loading"><i class="fa fa-spin fa-refresh"></i> [[topic:load_categories]]</p>
 						<ul class="category-list"></ul>
 						<p>
 							[[topic:disabled_categories_note]]
@@ -221,4 +183,5 @@
 			</div>
 		</div>

+	</div>
 </div>
--- a/public/templates/unread.tpl
+++ b/public/templates/unread.tpl
@@ -23,7 +23,7 @@
 				<div class="row">
 					<div class="col-md-12 topic-row">
 						<a href="../../topic/{topics.slug}">
-							<h3><span class="topic-title"><strong><i class="{topics.pin-icon}"></i> <i class="{topics.lock-icon}"></i></strong> {topics.title}</span></h3>
+							<h3><span class="topic-title"><strong><i class="fa {topics.pin-icon}"></i> <i class="fa {topics.lock-icon}"></i></strong> {topics.title}</span></h3>
 						</a>
 						<small>
 							<span class="topic-stats">
@@ -42,21 +42,24 @@
 								</a>
 								posted in
 								<a href="../../category/{topics.categorySlug}">
-									<i class="{topics.categoryIcon}"></i> {topics.categoryName}
+									<i class="fa {topics.categoryIcon}"></i> {topics.categoryName}
 								</a>
 								<span class="timeago" title="{topics.relativeTime}"></span>
 								</span>
 							</span>

 							<span class="pull-right hidden-xs">
+								<!-- IF topics.unreplied -->
+								No one has replied
+								<!-- ELSE -->
 								<a href="/user/{topics.teaser_userslug}">
-									<img class="img-rounded teaser-pic" src="{topics.teaser_userpicture}" title="{topics.teaser_username}"/>
+									<img class="teaser-pic" src="{topics.teaser_userpicture}" title="{topics.teaser_username}"/>
 								</a>
 								<a href="../../topic/{topics.slug}#{topics.teaser_pid}">
 									replied
 								</a>
 								<span class="timeago" title="{topics.teaser_timestamp}"></span>
-
+								<!-- ENDIF topics.unreplied -->
 							</span>
 						</small>
 					</div>
--- a/public/templates/users.tpl
+++ b/public/templates/users.tpl
@@ -13,7 +13,7 @@
 		<div class="input-group">
 			<input class="form-control" id="search-user" type="text" placeholder="[[users:enter_username]]"/>
 	        <span class="input-group-addon">
-	        	<span id="user-notfound-notify"><i class="icon icon-circle-blank"></i></span>
+	        	<span id="user-notfound-notify"><i class="fa fa-search"></i></span>
 	        </span>
 		</div>
 	</div>
@@ -29,12 +29,12 @@
 				<a href="/user/{users.userslug}">{users.username}</a>
 				<br/>
 				<div title="reputation" class="reputation">
+					<i class='fa fa-star'></i>
 					<span class='formatted-number'>{users.reputation}</span>
-					<i class='icon-star'></i>
 				</div>
 				<div title="post count" class="post-count">
+					<i class='fa fa-pencil'></i>
 					<span class='formatted-number'>{users.postcount}</span>
-					<i class='icon-pencil'></i>
 				</div>
 			</div>
 		</li>
--- a/public/vendor/colorpicker/colorpicker.css
+++ b/public/vendor/colorpicker/colorpicker.css
@@ -0,0 +1,162 @@
+.colorpicker {
+	width: 356px;
+	height: 176px;
+	overflow: hidden;
+	position: absolute;
+	background: url(./images/custom_background.png);
+	font-family: Arial, Helvetica, sans-serif;
+	display: none;
+}
+.colorpicker_color {
+	width: 150px;
+	height: 150px;
+	left: 14px;
+	top: 13px;
+	position: absolute;
+	background: #f00;
+	overflow: hidden;
+	cursor: crosshair;
+}
+.colorpicker_color div {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 150px;
+	height: 150px;
+	background: url(./images/colorpicker_overlay.png);
+}
+.colorpicker_color div div {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 11px;
+	height: 11px;
+	overflow: hidden;
+	background: url(./images/colorpicker_select.gif);
+	margin: -5px 0 0 -5px;
+}
+.colorpicker_hue {
+	position: absolute;
+	top: 13px;
+	left: 171px;
+	width: 35px;
+	height: 150px;
+	cursor: n-resize;
+}
+.colorpicker_hue div {
+	position: absolute;
+	width: 35px;
+	height: 9px;
+	overflow: hidden;
+	background: url(./images/custom_indic.gif) left top;
+	margin: -4px 0 0 0;
+	left: 0px;
+}
+.colorpicker_new_color {
+	position: absolute;
+	width: 60px;
+	height: 30px;
+	left: 213px;
+	top: 13px;
+	background: #f00;
+}
+.colorpicker_current_color {
+	position: absolute;
+	width: 60px;
+	height: 30px;
+	left: 283px;
+	top: 13px;
+	background: #f00;
+}
+.colorpicker input {
+	background-color: transparent;
+	border: 1px solid transparent;
+	position: absolute;
+	font-size: 10px;
+	font-family: Arial, Helvetica, sans-serif;
+	color: #898989;
+	top: 4px;
+	right: 11px;
+	text-align: right;
+	margin: 0;
+	padding: 0;
+	height: 11px;
+}
+.colorpicker_hex {
+	position: absolute;
+	width: 72px;
+	height: 22px;
+	background: url(./images/custom_hex.png) top;
+	left: 212px;
+	top: 142px;
+}
+.colorpicker_hex input {
+	right: 6px;
+}
+.colorpicker_field {
+	height: 22px;
+	width: 62px;
+	background-position: top;
+	position: absolute;
+}
+.colorpicker_field span {
+	position: absolute;
+	width: 12px;
+	height: 22px;
+	overflow: hidden;
+	top: 0;
+	right: 0;
+	cursor: n-resize;
+}
+.colorpicker_rgb_r {
+	background-image: url(./images/custom_rgb_r.png);
+	top: 52px;
+	left: 212px;
+}
+.colorpicker_rgb_g {
+	background-image: url(./images/custom_rgb_g.png);
+	top: 82px;
+	left: 212px;
+}
+.colorpicker_rgb_b {
+	background-image: url(./images/custom_rgb_b.png);
+	top: 112px;
+	left: 212px;
+}
+.colorpicker_hsb_h {
+	background-image: url(./images/custom_hsb_h.png);
+	top: 52px;
+	left: 282px;
+}
+.colorpicker_hsb_s {
+	background-image: url(./images/custom_hsb_s.png);
+	top: 82px;
+	left: 282px;
+}
+.colorpicker_hsb_b {
+	background-image: url(./images/custom_hsb_b.png);
+	top: 112px;
+	left: 282px;
+}
+.colorpicker_submit {
+	display: none;
+	position: absolute;
+	width: 22px;
+	height: 22px;
+	background: url(./images/custom_submit.png) top;
+	left: 322px;
+	top: 142px;
+	overflow: hidden;
+}
+.colorpicker_focus {
+	background-position: center;
+}
+.colorpicker_hex.colorpicker_focus {
+	background-position: bottom;
+}
+.colorpicker_submit.colorpicker_focus {
+	background-position: bottom;
+}
+.colorpicker_slider {
+	background-position: bottom;
+}
--- a/public/vendor/colorpicker/colorpicker.js
+++ b/public/vendor/colorpicker/colorpicker.js
@@ -0,0 +1,484 @@
+/**
+ *
+ * Color picker
+ * Author: Stefan Petre www.eyecon.ro
+ *
+ * Dual licensed under the MIT and GPL licenses
+ *
+ */
+(function ($) {
+	var ColorPicker = function () {
+		var
+			ids = {},
+			inAction,
+			charMin = 65,
+			visible,
+			tpl = '<div class="colorpicker"><div class="colorpicker_color"><div><div></div></div></div><div class="colorpicker_hue"><div></div></div><div class="colorpicker_new_color"></div><div class="colorpicker_current_color"></div><div class="colorpicker_hex"><input type="text" maxlength="6" size="6" /></div><div class="colorpicker_rgb_r colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_g colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_h colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_s colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_submit"></div></div>',
+			defaults = {
+				eventName: 'click',
+				onShow: function () {},
+				onBeforeShow: function(){},
+				onHide: function () {},
+				onChange: function () {},
+				onSubmit: function () {},
+				color: 'ff0000',
+				livePreview: true,
+				flat: false
+			},
+			fillRGBFields = function  (hsb, cal) {
+				var rgb = HSBToRGB(hsb);
+				$(cal).data('colorpicker').fields
+					.eq(1).val(rgb.r).end()
+					.eq(2).val(rgb.g).end()
+					.eq(3).val(rgb.b).end();
+			},
+			fillHSBFields = function  (hsb, cal) {
+				$(cal).data('colorpicker').fields
+					.eq(4).val(hsb.h).end()
+					.eq(5).val(hsb.s).end()
+					.eq(6).val(hsb.b).end();
+			},
+			fillHexFields = function (hsb, cal) {
+				$(cal).data('colorpicker').fields
+					.eq(0).val(HSBToHex(hsb)).end();
+			},
+			setSelector = function (hsb, cal) {
+				$(cal).data('colorpicker').selector.css('backgroundColor', '#' + HSBToHex({h: hsb.h, s: 100, b: 100}));
+				$(cal).data('colorpicker').selectorIndic.css({
+					left: parseInt(150 * hsb.s/100, 10),
+					top: parseInt(150 * (100-hsb.b)/100, 10)
+				});
+			},
+			setHue = function (hsb, cal) {
+				$(cal).data('colorpicker').hue.css('top', parseInt(150 - 150 * hsb.h/360, 10));
+			},
+			setCurrentColor = function (hsb, cal) {
+				$(cal).data('colorpicker').currentColor.css('backgroundColor', '#' + HSBToHex(hsb));
+			},
+			setNewColor = function (hsb, cal) {
+				$(cal).data('colorpicker').newColor.css('backgroundColor', '#' + HSBToHex(hsb));
+			},
+			keyDown = function (ev) {
+				var pressedKey = ev.charCode || ev.keyCode || -1;
+				if ((pressedKey > charMin && pressedKey <= 90) || pressedKey == 32) {
+					return false;
+				}
+				var cal = $(this).parent().parent();
+				if (cal.data('colorpicker').livePreview === true) {
+					change.apply(this);
+				}
+			},
+			change = function (ev) {
+				var cal = $(this).parent().parent(), col;
+				if (this.parentNode.className.indexOf('_hex') > 0) {
+					cal.data('colorpicker').color = col = HexToHSB(fixHex(this.value));
+				} else if (this.parentNode.className.indexOf('_hsb') > 0) {
+					cal.data('colorpicker').color = col = fixHSB({
+						h: parseInt(cal.data('colorpicker').fields.eq(4).val(), 10),
+						s: parseInt(cal.data('colorpicker').fields.eq(5).val(), 10),
+						b: parseInt(cal.data('colorpicker').fields.eq(6).val(), 10)
+					});
+				} else {
+					cal.data('colorpicker').color = col = RGBToHSB(fixRGB({
+						r: parseInt(cal.data('colorpicker').fields.eq(1).val(), 10),
+						g: parseInt(cal.data('colorpicker').fields.eq(2).val(), 10),
+						b: parseInt(cal.data('colorpicker').fields.eq(3).val(), 10)
+					}));
+				}
+				if (ev) {
+					fillRGBFields(col, cal.get(0));
+					fillHexFields(col, cal.get(0));
+					fillHSBFields(col, cal.get(0));
+				}
+				setSelector(col, cal.get(0));
+				setHue(col, cal.get(0));
+				setNewColor(col, cal.get(0));
+				cal.data('colorpicker').onChange.apply(cal, [col, HSBToHex(col), HSBToRGB(col)]);
+			},
+			blur = function (ev) {
+				var cal = $(this).parent().parent();
+				cal.data('colorpicker').fields.parent().removeClass('colorpicker_focus');
+			},
+			focus = function () {
+				charMin = this.parentNode.className.indexOf('_hex') > 0 ? 70 : 65;
+				$(this).parent().parent().data('colorpicker').fields.parent().removeClass('colorpicker_focus');
+				$(this).parent().addClass('colorpicker_focus');
+			},
+			downIncrement = function (ev) {
+				var field = $(this).parent().find('input').focus();
+				var current = {
+					el: $(this).parent().addClass('colorpicker_slider'),
+					max: this.parentNode.className.indexOf('_hsb_h') > 0 ? 360 : (this.parentNode.className.indexOf('_hsb') > 0 ? 100 : 255),
+					y: ev.pageY,
+					field: field,
+					val: parseInt(field.val(), 10),
+					preview: $(this).parent().parent().data('colorpicker').livePreview
+				};
+				$(document).bind('mouseup', current, upIncrement);
+				$(document).bind('mousemove', current, moveIncrement);
+			},
+			moveIncrement = function (ev) {
+				ev.data.field.val(Math.max(0, Math.min(ev.data.max, parseInt(ev.data.val + ev.pageY - ev.data.y, 10))));
+				if (ev.data.preview) {
+					change.apply(ev.data.field.get(0), [true]);
+				}
+				return false;
+			},
+			upIncrement = function (ev) {
+				change.apply(ev.data.field.get(0), [true]);
+				ev.data.el.removeClass('colorpicker_slider').find('input').focus();
+				$(document).unbind('mouseup', upIncrement);
+				$(document).unbind('mousemove', moveIncrement);
+				return false;
+			},
+			downHue = function (ev) {
+				var current = {
+					cal: $(this).parent(),
+					y: $(this).offset().top
+				};
+				current.preview = current.cal.data('colorpicker').livePreview;
+				$(document).bind('mouseup', current, upHue);
+				$(document).bind('mousemove', current, moveHue);
+			},
+			moveHue = function (ev) {
+				change.apply(
+					ev.data.cal.data('colorpicker')
+						.fields
+						.eq(4)
+						.val(parseInt(360*(150 - Math.max(0,Math.min(150,(ev.pageY - ev.data.y))))/150, 10))
+						.get(0),
+					[ev.data.preview]
+				);
+				return false;
+			},
+			upHue = function (ev) {
+				fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
+				fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
+				$(document).unbind('mouseup', upHue);
+				$(document).unbind('mousemove', moveHue);
+				return false;
+			},
+			downSelector = function (ev) {
+				var current = {
+					cal: $(this).parent(),
+					pos: $(this).offset()
+				};
+				current.preview = current.cal.data('colorpicker').livePreview;
+				$(document).bind('mouseup', current, upSelector);
+				$(document).bind('mousemove', current, moveSelector);
+			},
+			moveSelector = function (ev) {
+				change.apply(
+					ev.data.cal.data('colorpicker')
+						.fields
+						.eq(6)
+						.val(parseInt(100*(150 - Math.max(0,Math.min(150,(ev.pageY - ev.data.pos.top))))/150, 10))
+						.end()
+						.eq(5)
+						.val(parseInt(100*(Math.max(0,Math.min(150,(ev.pageX - ev.data.pos.left))))/150, 10))
+						.get(0),
+					[ev.data.preview]
+				);
+				return false;
+			},
+			upSelector = function (ev) {
+				fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
+				fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
+				$(document).unbind('mouseup', upSelector);
+				$(document).unbind('mousemove', moveSelector);
+				return false;
+			},
+			enterSubmit = function (ev) {
+				$(this).addClass('colorpicker_focus');
+			},
+			leaveSubmit = function (ev) {
+				$(this).removeClass('colorpicker_focus');
+			},
+			clickSubmit = function (ev) {
+				var cal = $(this).parent();
+				var col = cal.data('colorpicker').color;
+				cal.data('colorpicker').origColor = col;
+				setCurrentColor(col, cal.get(0));
+				cal.data('colorpicker').onSubmit(col, HSBToHex(col), HSBToRGB(col), cal.data('colorpicker').el);
+			},
+			show = function (ev) {
+				var cal = $('#' + $(this).data('colorpickerId'));
+				cal.data('colorpicker').onBeforeShow.apply(this, [cal.get(0)]);
+				var pos = $(this).offset();
+				var viewPort = getViewport();
+				var top = pos.top + this.offsetHeight;
+				var left = pos.left;
+				if (top + 176 > viewPort.t + viewPort.h) {
+					top -= this.offsetHeight + 176;
+				}
+				if (left + 356 > viewPort.l + viewPort.w) {
+					left -= 356;
+				}
+				cal.css({left: left + 'px', top: top + 'px'});
+				if (cal.data('colorpicker').onShow.apply(this, [cal.get(0)]) != false) {
+					cal.show();
+				}
+				$(document).bind('mousedown', {cal: cal}, hide);
+				return false;
+			},
+			hide = function (ev) {
+				if (!isChildOf(ev.data.cal.get(0), ev.target, ev.data.cal.get(0))) {
+					if (ev.data.cal.data('colorpicker').onHide.apply(this, [ev.data.cal.get(0)]) != false) {
+						ev.data.cal.hide();
+					}
+					$(document).unbind('mousedown', hide);
+				}
+			},
+			isChildOf = function(parentEl, el, container) {
+				if (parentEl == el) {
+					return true;
+				}
+				if (parentEl.contains) {
+					return parentEl.contains(el);
+				}
+				if ( parentEl.compareDocumentPosition ) {
+					return !!(parentEl.compareDocumentPosition(el) & 16);
+				}
+				var prEl = el.parentNode;
+				while(prEl && prEl != container) {
+					if (prEl == parentEl)
+						return true;
+					prEl = prEl.parentNode;
+				}
+				return false;
+			},
+			getViewport = function () {
+				var m = document.compatMode == 'CSS1Compat';
+				return {
+					l : window.pageXOffset || (m ? document.documentElement.scrollLeft : document.body.scrollLeft),
+					t : window.pageYOffset || (m ? document.documentElement.scrollTop : document.body.scrollTop),
+					w : window.innerWidth || (m ? document.documentElement.clientWidth : document.body.clientWidth),
+					h : window.innerHeight || (m ? document.documentElement.clientHeight : document.body.clientHeight)
+				};
+			},
+			fixHSB = function (hsb) {
+				return {
+					h: Math.min(360, Math.max(0, hsb.h)),
+					s: Math.min(100, Math.max(0, hsb.s)),
+					b: Math.min(100, Math.max(0, hsb.b))
+				};
+			},
+			fixRGB = function (rgb) {
+				return {
+					r: Math.min(255, Math.max(0, rgb.r)),
+					g: Math.min(255, Math.max(0, rgb.g)),
+					b: Math.min(255, Math.max(0, rgb.b))
+				};
+			},
+			fixHex = function (hex) {
+				var len = 6 - hex.length;
+				if (len > 0) {
+					var o = [];
+					for (var i=0; i<len; i++) {
+						o.push('0');
+					}
+					o.push(hex);
+					hex = o.join('');
+				}
+				return hex;
+			},
+			HexToRGB = function (hex) {
+				var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
+				return {r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF)};
+			},
+			HexToHSB = function (hex) {
+				return RGBToHSB(HexToRGB(hex));
+			},
+			RGBToHSB = function (rgb) {
+				var hsb = {
+					h: 0,
+					s: 0,
+					b: 0
+				};
+				var min = Math.min(rgb.r, rgb.g, rgb.b);
+				var max = Math.max(rgb.r, rgb.g, rgb.b);
+				var delta = max - min;
+				hsb.b = max;
+				if (max != 0) {
+
+				}
+				hsb.s = max != 0 ? 255 * delta / max : 0;
+				if (hsb.s != 0) {
+					if (rgb.r == max) {
+						hsb.h = (rgb.g - rgb.b) / delta;
+					} else if (rgb.g == max) {
+						hsb.h = 2 + (rgb.b - rgb.r) / delta;
+					} else {
+						hsb.h = 4 + (rgb.r - rgb.g) / delta;
+					}
+				} else {
+					hsb.h = -1;
+				}
+				hsb.h *= 60;
+				if (hsb.h < 0) {
+					hsb.h += 360;
+				}
+				hsb.s *= 100/255;
+				hsb.b *= 100/255;
+				return hsb;
+			},
+			HSBToRGB = function (hsb) {
+				var rgb = {};
+				var h = Math.round(hsb.h);
+				var s = Math.round(hsb.s*255/100);
+				var v = Math.round(hsb.b*255/100);
+				if(s == 0) {
+					rgb.r = rgb.g = rgb.b = v;
+				} else {
+					var t1 = v;
+					var t2 = (255-s)*v/255;
+					var t3 = (t1-t2)*(h%60)/60;
+					if(h==360) h = 0;
+					if(h<60) {rgb.r=t1;	rgb.b=t2; rgb.g=t2+t3}
+					else if(h<120) {rgb.g=t1; rgb.b=t2;	rgb.r=t1-t3}
+					else if(h<180) {rgb.g=t1; rgb.r=t2;	rgb.b=t2+t3}
+					else if(h<240) {rgb.b=t1; rgb.r=t2;	rgb.g=t1-t3}
+					else if(h<300) {rgb.b=t1; rgb.g=t2;	rgb.r=t2+t3}
+					else if(h<360) {rgb.r=t1; rgb.g=t2;	rgb.b=t1-t3}
+					else {rgb.r=0; rgb.g=0;	rgb.b=0}
+				}
+				return {r:Math.round(rgb.r), g:Math.round(rgb.g), b:Math.round(rgb.b)};
+			},
+			RGBToHex = function (rgb) {
+				var hex = [
+					rgb.r.toString(16),
+					rgb.g.toString(16),
+					rgb.b.toString(16)
+				];
+				$.each(hex, function (nr, val) {
+					if (val.length == 1) {
+						hex[nr] = '0' + val;
+					}
+				});
+				return hex.join('');
+			},
+			HSBToHex = function (hsb) {
+				return RGBToHex(HSBToRGB(hsb));
+			},
+			restoreOriginal = function () {
+				var cal = $(this).parent();
+				var col = cal.data('colorpicker').origColor;
+				cal.data('colorpicker').color = col;
+				fillRGBFields(col, cal.get(0));
+				fillHexFields(col, cal.get(0));
+				fillHSBFields(col, cal.get(0));
+				setSelector(col, cal.get(0));
+				setHue(col, cal.get(0));
+				setNewColor(col, cal.get(0));
+			};
+		return {
+			init: function (opt) {
+				opt = $.extend({}, defaults, opt||{});
+				if (typeof opt.color == 'string') {
+					opt.color = HexToHSB(opt.color);
+				} else if (opt.color.r != undefined && opt.color.g != undefined && opt.color.b != undefined) {
+					opt.color = RGBToHSB(opt.color);
+				} else if (opt.color.h != undefined && opt.color.s != undefined && opt.color.b != undefined) {
+					opt.color = fixHSB(opt.color);
+				} else {
+					return this;
+				}
+				return this.each(function () {
+					if (!$(this).data('colorpickerId')) {
+						var options = $.extend({}, opt);
+						options.origColor = opt.color;
+						var id = 'collorpicker_' + parseInt(Math.random() * 1000);
+						$(this).data('colorpickerId', id);
+						var cal = $(tpl).attr('id', id);
+						if (options.flat) {
+							cal.appendTo(this).show();
+						} else {
+							cal.appendTo(document.body);
+						}
+						options.fields = cal
+											.find('input')
+												.bind('keyup', keyDown)
+												.bind('change', change)
+												.bind('blur', blur)
+												.bind('focus', focus);
+						cal
+							.find('span').bind('mousedown', downIncrement).end()
+							.find('>div.colorpicker_current_color').bind('click', restoreOriginal);
+						options.selector = cal.find('div.colorpicker_color').bind('mousedown', downSelector);
+						options.selectorIndic = options.selector.find('div div');
+						options.el = this;
+						options.hue = cal.find('div.colorpicker_hue div');
+						cal.find('div.colorpicker_hue').bind('mousedown', downHue);
+						options.newColor = cal.find('div.colorpicker_new_color');
+						options.currentColor = cal.find('div.colorpicker_current_color');
+						cal.data('colorpicker', options);
+						cal.find('div.colorpicker_submit')
+							.bind('mouseenter', enterSubmit)
+							.bind('mouseleave', leaveSubmit)
+							.bind('click', clickSubmit);
+						fillRGBFields(options.color, cal.get(0));
+						fillHSBFields(options.color, cal.get(0));
+						fillHexFields(options.color, cal.get(0));
+						setHue(options.color, cal.get(0));
+						setSelector(options.color, cal.get(0));
+						setCurrentColor(options.color, cal.get(0));
+						setNewColor(options.color, cal.get(0));
+						if (options.flat) {
+							cal.css({
+								position: 'relative',
+								display: 'block'
+							});
+						} else {
+							$(this).bind(options.eventName, show);
+						}
+					}
+				});
+			},
+			showPicker: function() {
+				return this.each( function () {
+					if ($(this).data('colorpickerId')) {
+						show.apply(this);
+					}
+				});
+			},
+			hidePicker: function() {
+				return this.each( function () {
+					if ($(this).data('colorpickerId')) {
+						$('#' + $(this).data('colorpickerId')).hide();
+					}
+				});
+			},
+			setColor: function(col) {
+				if (typeof col == 'string') {
+					col = HexToHSB(col);
+				} else if (col.r != undefined && col.g != undefined && col.b != undefined) {
+					col = RGBToHSB(col);
+				} else if (col.h != undefined && col.s != undefined && col.b != undefined) {
+					col = fixHSB(col);
+				} else {
+					return this;
+				}
+				return this.each(function(){
+					if ($(this).data('colorpickerId')) {
+						var cal = $('#' + $(this).data('colorpickerId'));
+						cal.data('colorpicker').color = col;
+						cal.data('colorpicker').origColor = col;
+						fillRGBFields(col, cal.get(0));
+						fillHSBFields(col, cal.get(0));
+						fillHexFields(col, cal.get(0));
+						setHue(col, cal.get(0));
+						setSelector(col, cal.get(0));
+						setCurrentColor(col, cal.get(0));
+						setNewColor(col, cal.get(0));
+					}
+				});
+			}
+		};
+	}();
+	$.fn.extend({
+		ColorPicker: ColorPicker.init,
+		ColorPickerHide: ColorPicker.hidePicker,
+		ColorPickerShow: ColorPicker.showPicker,
+		ColorPickerSetColor: ColorPicker.setColor
+	});
+})(jQuery)
--- a/public/vendor/colorpicker/images/Thumbs.db
+++ b/public/vendor/colorpicker/images/Thumbs.db
--- a/public/vendor/colorpicker/images/blank.gif
+++ b/public/vendor/colorpicker/images/blank.gif
--- a/public/vendor/colorpicker/images/colorpicker_background.png
+++ b/public/vendor/colorpicker/images/colorpicker_background.png
--- a/public/vendor/colorpicker/images/colorpicker_hex.png
+++ b/public/vendor/colorpicker/images/colorpicker_hex.png
--- a/public/vendor/colorpicker/images/colorpicker_hsb_b.png
+++ b/public/vendor/colorpicker/images/colorpicker_hsb_b.png
--- a/public/vendor/colorpicker/images/colorpicker_hsb_h.png
+++ b/public/vendor/colorpicker/images/colorpicker_hsb_h.png
--- a/public/vendor/colorpicker/images/colorpicker_hsb_s.png
+++ b/public/vendor/colorpicker/images/colorpicker_hsb_s.png
--- a/public/vendor/colorpicker/images/colorpicker_indic.gif
+++ b/public/vendor/colorpicker/images/colorpicker_indic.gif
--- a/public/vendor/colorpicker/images/colorpicker_overlay.png
+++ b/public/vendor/colorpicker/images/colorpicker_overlay.png
--- a/public/vendor/colorpicker/images/colorpicker_rgb_b.png
+++ b/public/vendor/colorpicker/images/colorpicker_rgb_b.png
--- a/public/vendor/colorpicker/images/colorpicker_rgb_g.png
+++ b/public/vendor/colorpicker/images/colorpicker_rgb_g.png
--- a/public/vendor/colorpicker/images/colorpicker_rgb_r.png
+++ b/public/vendor/colorpicker/images/colorpicker_rgb_r.png
--- a/public/vendor/colorpicker/images/colorpicker_select.gif
+++ b/public/vendor/colorpicker/images/colorpicker_select.gif
--- a/public/vendor/colorpicker/images/colorpicker_submit.png
+++ b/public/vendor/colorpicker/images/colorpicker_submit.png
--- a/public/vendor/colorpicker/images/custom_background.png
+++ b/public/vendor/colorpicker/images/custom_background.png
--- a/public/vendor/colorpicker/images/custom_hex.png
+++ b/public/vendor/colorpicker/images/custom_hex.png
--- a/public/vendor/colorpicker/images/custom_hsb_b.png
+++ b/public/vendor/colorpicker/images/custom_hsb_b.png
--- a/public/vendor/colorpicker/images/custom_hsb_h.png
+++ b/public/vendor/colorpicker/images/custom_hsb_h.png
--- a/public/vendor/colorpicker/images/custom_hsb_s.png
+++ b/public/vendor/colorpicker/images/custom_hsb_s.png
--- a/public/vendor/colorpicker/images/custom_indic.gif
+++ b/public/vendor/colorpicker/images/custom_indic.gif
--- a/public/vendor/colorpicker/images/custom_rgb_b.png
+++ b/public/vendor/colorpicker/images/custom_rgb_b.png
--- a/public/vendor/colorpicker/images/custom_rgb_g.png
+++ b/public/vendor/colorpicker/images/custom_rgb_g.png
--- a/public/vendor/colorpicker/images/custom_rgb_r.png
+++ b/public/vendor/colorpicker/images/custom_rgb_r.png
--- a/public/vendor/colorpicker/images/custom_submit.png
+++ b/public/vendor/colorpicker/images/custom_submit.png
--- a/public/vendor/colorpicker/images/select.png
+++ b/public/vendor/colorpicker/images/select.png
--- a/public/vendor/colorpicker/images/select2.png
+++ b/public/vendor/colorpicker/images/select2.png
--- a/public/vendor/colorpicker/images/slider.png
+++ b/public/vendor/colorpicker/images/slider.png
--- a/public/vendor/fontawesome/css/font-awesome-ie7.css
+++ b/public/vendor/fontawesome/css/font-awesome-ie7.css
--- a/public/vendor/fontawesome/css/font-awesome-ie7.min.css
+++ b/public/vendor/fontawesome/css/font-awesome-ie7.min.css
@@ -1,384 +0,0 @@
-.icon-large{font-size:1.3333333333333333em;margin-top:-4px;padding-top:3px;margin-bottom:-4px;padding-bottom:3px;vertical-align:middle;}
-.nav [class^="icon-"],.nav [class*=" icon-"]{vertical-align:inherit;margin-top:-4px;padding-top:3px;margin-bottom:-4px;padding-bottom:3px;}.nav [class^="icon-"].icon-large,.nav [class*=" icon-"].icon-large{vertical-align:-25%;}
-.nav-pills [class^="icon-"].icon-large,.nav-tabs [class^="icon-"].icon-large,.nav-pills [class*=" icon-"].icon-large,.nav-tabs [class*=" icon-"].icon-large{line-height:.75em;margin-top:-7px;padding-top:5px;margin-bottom:-5px;padding-bottom:4px;}
-.btn [class^="icon-"].pull-left,.btn [class*=" icon-"].pull-left,.btn [class^="icon-"].pull-right,.btn [class*=" icon-"].pull-right{vertical-align:inherit;}
-.btn [class^="icon-"].icon-large,.btn [class*=" icon-"].icon-large{margin-top:-0.5em;}
-a [class^="icon-"],a [class*=" icon-"]{cursor:pointer;}
-.icon-glass{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf000;');}
-.icon-music{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf001;');}
-.icon-search{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf002;');}
-.icon-envelope-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf003;');}
-.icon-heart{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf004;');}
-.icon-star{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf005;');}
-.icon-star-empty{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf006;');}
-.icon-user{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf007;');}
-.icon-film{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf008;');}
-.icon-th-large{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf009;');}
-.icon-th{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf00a;');}
-.icon-th-list{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf00b;');}
-.icon-ok{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf00c;');}
-.icon-remove{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf00d;');}
-.icon-zoom-in{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf00e;');}
-.icon-zoom-out{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf010;');}
-.icon-off{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf011;');}
-.icon-power-off{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf011;');}
-.icon-signal{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf012;');}
-.icon-cog{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf013;');}
-.icon-gear{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf013;');}
-.icon-trash{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf014;');}
-.icon-home{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf015;');}
-.icon-file-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf016;');}
-.icon-time{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf017;');}
-.icon-road{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf018;');}
-.icon-download-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf019;');}
-.icon-download{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf01a;');}
-.icon-upload{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf01b;');}
-.icon-inbox{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf01c;');}
-.icon-play-circle{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf01d;');}
-.icon-repeat{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf01e;');}
-.icon-rotate-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf01e;');}
-.icon-refresh{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf021;');}
-.icon-list-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf022;');}
-.icon-lock{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf023;');}
-.icon-flag{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf024;');}
-.icon-headphones{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf025;');}
-.icon-volume-off{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf026;');}
-.icon-volume-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf027;');}
-.icon-volume-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf028;');}
-.icon-qrcode{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf029;');}
-.icon-barcode{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf02a;');}
-.icon-tag{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf02b;');}
-.icon-tags{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf02c;');}
-.icon-book{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf02d;');}
-.icon-bookmark{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf02e;');}
-.icon-print{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf02f;');}
-.icon-camera{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf030;');}
-.icon-font{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf031;');}
-.icon-bold{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf032;');}
-.icon-italic{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf033;');}
-.icon-text-height{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf034;');}
-.icon-text-width{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf035;');}
-.icon-align-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf036;');}
-.icon-align-center{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf037;');}
-.icon-align-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf038;');}
-.icon-align-justify{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf039;');}
-.icon-list{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf03a;');}
-.icon-indent-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf03b;');}
-.icon-indent-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf03c;');}
-.icon-facetime-video{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf03d;');}
-.icon-picture{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf03e;');}
-.icon-pencil{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf040;');}
-.icon-map-marker{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf041;');}
-.icon-adjust{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf042;');}
-.icon-tint{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf043;');}
-.icon-edit{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf044;');}
-.icon-share{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf045;');}
-.icon-check{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf046;');}
-.icon-move{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf047;');}
-.icon-step-backward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf048;');}
-.icon-fast-backward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf049;');}
-.icon-backward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf04a;');}
-.icon-play{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf04b;');}
-.icon-pause{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf04c;');}
-.icon-stop{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf04d;');}
-.icon-forward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf04e;');}
-.icon-fast-forward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf050;');}
-.icon-step-forward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf051;');}
-.icon-eject{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf052;');}
-.icon-chevron-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf053;');}
-.icon-chevron-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf054;');}
-.icon-plus-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf055;');}
-.icon-minus-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf056;');}
-.icon-remove-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf057;');}
-.icon-ok-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf058;');}
-.icon-question-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf059;');}
-.icon-info-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf05a;');}
-.icon-screenshot{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf05b;');}
-.icon-remove-circle{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf05c;');}
-.icon-ok-circle{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf05d;');}
-.icon-ban-circle{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf05e;');}
-.icon-arrow-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf060;');}
-.icon-arrow-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf061;');}
-.icon-arrow-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf062;');}
-.icon-arrow-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf063;');}
-.icon-share-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf064;');}
-.icon-mail-forward{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf064;');}
-.icon-resize-full{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf065;');}
-.icon-resize-small{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf066;');}
-.icon-plus{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf067;');}
-.icon-minus{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf068;');}
-.icon-asterisk{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf069;');}
-.icon-exclamation-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf06a;');}
-.icon-gift{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf06b;');}
-.icon-leaf{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf06c;');}
-.icon-fire{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf06d;');}
-.icon-eye-open{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf06e;');}
-.icon-eye-close{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf070;');}
-.icon-warning-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf071;');}
-.icon-plane{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf072;');}
-.icon-calendar{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf073;');}
-.icon-random{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf074;');}
-.icon-comment{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf075;');}
-.icon-magnet{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf076;');}
-.icon-chevron-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf077;');}
-.icon-chevron-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf078;');}
-.icon-retweet{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf079;');}
-.icon-shopping-cart{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf07a;');}
-.icon-folder-close{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf07b;');}
-.icon-folder-open{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf07c;');}
-.icon-resize-vertical{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf07d;');}
-.icon-resize-horizontal{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf07e;');}
-.icon-bar-chart{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf080;');}
-.icon-twitter-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf081;');}
-.icon-facebook-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf082;');}
-.icon-camera-retro{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf083;');}
-.icon-key{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf084;');}
-.icon-cogs{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf085;');}
-.icon-gears{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf085;');}
-.icon-comments{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf086;');}
-.icon-thumbs-up-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf087;');}
-.icon-thumbs-down-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf088;');}
-.icon-star-half{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf089;');}
-.icon-heart-empty{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf08a;');}
-.icon-signout{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf08b;');}
-.icon-linkedin-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf08c;');}
-.icon-pushpin{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf08d;');}
-.icon-external-link{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf08e;');}
-.icon-signin{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf090;');}
-.icon-trophy{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf091;');}
-.icon-github-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf092;');}
-.icon-upload-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf093;');}
-.icon-lemon{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf094;');}
-.icon-phone{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf095;');}
-.icon-check-empty{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf096;');}
-.icon-unchecked{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf096;');}
-.icon-bookmark-empty{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf097;');}
-.icon-phone-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf098;');}
-.icon-twitter{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf099;');}
-.icon-facebook{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09a;');}
-.icon-github{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09b;');}
-.icon-unlock{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09c;');}
-.icon-credit-card{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09d;');}
-.icon-rss{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09e;');}
-.icon-hdd{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a0;');}
-.icon-bullhorn{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a1;');}
-.icon-bell{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a2;');}
-.icon-certificate{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a3;');}
-.icon-hand-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a4;');}
-.icon-hand-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a5;');}
-.icon-hand-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a6;');}
-.icon-hand-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a7;');}
-.icon-circle-arrow-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a8;');}
-.icon-circle-arrow-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0a9;');}
-.icon-circle-arrow-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0aa;');}
-.icon-circle-arrow-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ab;');}
-.icon-globe{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ac;');}
-.icon-wrench{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ad;');}
-.icon-tasks{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ae;');}
-.icon-filter{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0b0;');}
-.icon-briefcase{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0b1;');}
-.icon-fullscreen{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0b2;');}
-.icon-group{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c0;');}
-.icon-link{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c1;');}
-.icon-cloud{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c2;');}
-.icon-beaker{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c3;');}
-.icon-cut{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c4;');}
-.icon-copy{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c5;');}
-.icon-paper-clip{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c6;');}
-.icon-paperclip{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c6;');}
-.icon-save{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c7;');}
-.icon-sign-blank{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c8;');}
-.icon-reorder{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0c9;');}
-.icon-list-ul{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ca;');}
-.icon-list-ol{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0cb;');}
-.icon-strikethrough{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0cc;');}
-.icon-underline{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0cd;');}
-.icon-table{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ce;');}
-.icon-magic{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d0;');}
-.icon-truck{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d1;');}
-.icon-pinterest{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d2;');}
-.icon-pinterest-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d3;');}
-.icon-google-plus-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d4;');}
-.icon-google-plus{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d5;');}
-.icon-money{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d6;');}
-.icon-caret-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d7;');}
-.icon-caret-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d8;');}
-.icon-caret-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0d9;');}
-.icon-caret-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0da;');}
-.icon-columns{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0db;');}
-.icon-sort{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0dc;');}
-.icon-sort-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0dd;');}
-.icon-sort-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0de;');}
-.icon-envelope{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e0;');}
-.icon-linkedin{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e1;');}
-.icon-undo{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e2;');}
-.icon-rotate-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e2;');}
-.icon-legal{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e3;');}
-.icon-dashboard{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e4;');}
-.icon-comment-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e5;');}
-.icon-comments-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e6;');}
-.icon-bolt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e7;');}
-.icon-sitemap{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e8;');}
-.icon-umbrella{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e9;');}
-.icon-paste{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ea;');}
-.icon-lightbulb{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0eb;');}
-.icon-exchange{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ec;');}
-.icon-cloud-download{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ed;');}
-.icon-cloud-upload{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0ee;');}
-.icon-user-md{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f0;');}
-.icon-stethoscope{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f1;');}
-.icon-suitcase{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f2;');}
-.icon-bell-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f3;');}
-.icon-coffee{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f4;');}
-.icon-food{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f5;');}
-.icon-file-text-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f6;');}
-.icon-building{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f7;');}
-.icon-hospital{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f8;');}
-.icon-ambulance{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0f9;');}
-.icon-medkit{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0fa;');}
-.icon-fighter-jet{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0fb;');}
-.icon-beer{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0fc;');}
-.icon-h-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0fd;');}
-.icon-plus-sign-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0fe;');}
-.icon-double-angle-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf100;');}
-.icon-double-angle-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf101;');}
-.icon-double-angle-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf102;');}
-.icon-double-angle-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf103;');}
-.icon-angle-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf104;');}
-.icon-angle-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf105;');}
-.icon-angle-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf106;');}
-.icon-angle-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf107;');}
-.icon-desktop{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf108;');}
-.icon-laptop{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf109;');}
-.icon-tablet{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf10a;');}
-.icon-mobile-phone{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf10b;');}
-.icon-circle-blank{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf10c;');}
-.icon-quote-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf10d;');}
-.icon-quote-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf10e;');}
-.icon-spinner{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf110;');}
-.icon-circle{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf111;');}
-.icon-reply{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf112;');}
-.icon-mail-reply{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf112;');}
-.icon-github-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf113;');}
-.icon-folder-close-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf114;');}
-.icon-folder-open-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf115;');}
-.icon-expand-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf116;');}
-.icon-collapse-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf117;');}
-.icon-smile{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf118;');}
-.icon-frown{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf119;');}
-.icon-meh{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf11a;');}
-.icon-gamepad{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf11b;');}
-.icon-keyboard{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf11c;');}
-.icon-flag-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf11d;');}
-.icon-flag-checkered{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf11e;');}
-.icon-terminal{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf120;');}
-.icon-code{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf121;');}
-.icon-reply-all{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf122;');}
-.icon-mail-reply-all{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf122;');}
-.icon-star-half-empty{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf123;');}
-.icon-star-half-full{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf123;');}
-.icon-location-arrow{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf124;');}
-.icon-crop{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf125;');}
-.icon-code-fork{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf126;');}
-.icon-unlink{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf127;');}
-.icon-question{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf128;');}
-.icon-info{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf129;');}
-.icon-exclamation{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf12a;');}
-.icon-superscript{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf12b;');}
-.icon-subscript{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf12c;');}
-.icon-eraser{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf12d;');}
-.icon-puzzle-piece{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf12e;');}
-.icon-microphone{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf130;');}
-.icon-microphone-off{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf131;');}
-.icon-shield{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf132;');}
-.icon-calendar-empty{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf133;');}
-.icon-fire-extinguisher{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf134;');}
-.icon-rocket{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf135;');}
-.icon-maxcdn{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf136;');}
-.icon-chevron-sign-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf137;');}
-.icon-chevron-sign-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf138;');}
-.icon-chevron-sign-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf139;');}
-.icon-chevron-sign-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf13a;');}
-.icon-html5{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf13b;');}
-.icon-css3{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf13c;');}
-.icon-anchor{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf13d;');}
-.icon-unlock-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf13e;');}
-.icon-bullseye{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf140;');}
-.icon-ellipsis-horizontal{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf141;');}
-.icon-ellipsis-vertical{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf142;');}
-.icon-rss-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf143;');}
-.icon-play-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf144;');}
-.icon-ticket{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf145;');}
-.icon-minus-sign-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf146;');}
-.icon-check-minus{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf147;');}
-.icon-level-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf148;');}
-.icon-level-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf149;');}
-.icon-check-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf14a;');}
-.icon-edit-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf14b;');}
-.icon-external-link-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf14c;');}
-.icon-share-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf14d;');}
-.icon-compass{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf14e;');}
-.icon-collapse{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf150;');}
-.icon-collapse-top{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf151;');}
-.icon-expand{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf152;');}
-.icon-eur{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf153;');}
-.icon-euro{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf153;');}
-.icon-gbp{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf154;');}
-.icon-usd{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf155;');}
-.icon-dollar{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf155;');}
-.icon-inr{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf156;');}
-.icon-rupee{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf156;');}
-.icon-jpy{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf157;');}
-.icon-yen{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf157;');}
-.icon-cny{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf158;');}
-.icon-renminbi{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf158;');}
-.icon-krw{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf159;');}
-.icon-won{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf159;');}
-.icon-btc{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf15a;');}
-.icon-bitcoin{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf15a;');}
-.icon-file{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf15b;');}
-.icon-file-text{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf15c;');}
-.icon-sort-by-alphabet{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf15d;');}
-.icon-sort-by-alphabet-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf15e;');}
-.icon-sort-by-attributes{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf160;');}
-.icon-sort-by-attributes-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf161;');}
-.icon-sort-by-order{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf162;');}
-.icon-sort-by-order-alt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf163;');}
-.icon-thumbs-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf164;');}
-.icon-thumbs-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf165;');}
-.icon-youtube-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf166;');}
-.icon-youtube{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf167;');}
-.icon-xing{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf168;');}
-.icon-xing-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf169;');}
-.icon-youtube-play{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16a;');}
-.icon-dropbox{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16b;');}
-.icon-stackexchange{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16c;');}
-.icon-instagram{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16d;');}
-.icon-flickr{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16e;');}
-.icon-adn{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf170;');}
-.icon-bitbucket{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf171;');}
-.icon-bitbucket-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf172;');}
-.icon-tumblr{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf173;');}
-.icon-tumblr-sign{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf174;');}
-.icon-long-arrow-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf175;');}
-.icon-long-arrow-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf176;');}
-.icon-long-arrow-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf177;');}
-.icon-long-arrow-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf178;');}
-.icon-apple{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf179;');}
-.icon-windows{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17a;');}
-.icon-android{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17b;');}
-.icon-linux{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17c;');}
-.icon-dribbble{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17d;');}
-.icon-skype{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17e;');}
-.icon-foursquare{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf180;');}
-.icon-trello{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf181;');}
-.icon-female{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf182;');}
-.icon-male{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf183;');}
-.icon-gittip{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf184;');}
-.icon-sun{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf185;');}
-.icon-moon{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf186;');}
-.icon-archive{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf187;');}
-.icon-bug{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf188;');}
-.icon-vk{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf189;');}
-.icon-weibo{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf18a;');}
-.icon-renren{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf18b;');}
--- a/public/vendor/fontawesome/css/font-awesome.css
+++ b/public/vendor/fontawesome/css/font-awesome.css
--- a/public/vendor/fontawesome/css/font-awesome.min.css
+++ b/public/vendor/fontawesome/css/font-awesome.min.css
--- a/public/vendor/fontawesome/font/FontAwesome.otf
+++ b/public/vendor/fontawesome/font/FontAwesome.otf
--- a/public/vendor/fontawesome/font/fontawesome-webfont.eot
+++ b/public/vendor/fontawesome/font/fontawesome-webfont.eot
--- a/public/vendor/fontawesome/font/fontawesome-webfont.woff
+++ b/public/vendor/fontawesome/font/fontawesome-webfont.woff
--- a/public/vendor/fontawesome/fonts/FontAwesome.otf
+++ b/public/vendor/fontawesome/fonts/FontAwesome.otf
--- a/Show More
+++ b/Show More