azkaban-uncached

diff --git a/build.xml b/build.xml
index 86db40b..7b1479b 100644
--- a/build.xml
+++ b/build.xml
@@ -4,6 +4,7 @@
 	<property file="build.properties" />
 	<property name="base.dir" value="${basedir}" />
 	<property name="dist.jar.dir" value="${basedir}/dist/jars" />
+	<property name="dist.dust.dir" value="${basedir}/dist/dust" />
 	<property name="dist.classes.dir" value="${basedir}/dist/classes" />
 	<property name="dist.packages.dir" value="${basedir}/dist/packages" />
 	<property name="dist.web.package.dir" value="${dist.packages.dir}/azkaban-web-server" />
@@ -19,6 +20,7 @@
 	<property name="lib.dir" value="${basedir}/lib" />
 	<property name="bin.dir" value="${basedir}/bin" />
 	<property name="java.src.dir" value="${basedir}/src/java" />
+	<property name="dust.src.dir" value="${basedir}/src/tl" />
 	<property name="web.src.dir" value="${basedir}/src/web" />
 	<property name="sql.src.dir" value="${basedir}/src/sql" />
 	
@@ -48,6 +50,8 @@
 	<target name="build" description="Compile main source tree java files">
 		<delete dir="${dist.classes.dir}" />
 		<mkdir dir="${dist.classes.dir}" />
+		<delete dir="${dist.dust.dir}" />
+		<mkdir dir="${dist.dust.dir}" />
 		
 		<!-- copy non-java files to classes dir to load from classpath -->
 		<copy todir="${dist.classes.dir}">
@@ -61,6 +65,21 @@
 			<src path="${java.src.dir}" />
 			<classpath refid="main.classpath" />
 		</javac>
+
+		<!-- Compile dustjs templates -->
+		<!-- Note: Because apply does not support multiple srcfile and targetfile
+				 elements, and for and foreach requires ant-contrib, we use targetfile 
+				 for the template name parameter and then redirect the output of dustc
+				 to the final output file -->
+		<apply dir="${dust.src.dir}" executable="dustc" relative="true">
+			<mapper type="glob" from="*.tl" to="*" />
+			<targetfile prefix="--name=" />
+			<srcfile />
+			<fileset dir="${dust.src.dir}" includes="*.tl" />
+			<redirector>
+				<outputmapper id="out" type="glob" from="*.tl" to="${dist.dust.dir}/*.js" />
+			</redirector>
+		</apply>
 	</target>
 	
 	<target name="jars" depends="build" description="Create azkaban jar">
@@ -147,17 +166,22 @@
 		</copy>
 		
 		<!-- Copy bin files for web server only-->
-		<copy todir="${dist.web.package.dir}/bin" >
+		<copy todir="${dist.web.package.dir}/bin">
 			<fileset dir="${web.package.dir}/bin"/>
 		</copy>
 		
 		<!-- Copy web files -->
-		<copy todir="${dist.web.package.dir}/web" >
+		<copy todir="${dist.web.package.dir}/web">
 			<fileset dir="${web.src.dir}" />
 		</copy>
+
+		<!-- Copy compiled dust templates -->
+		<copy todir="${dist.web.package.dir}/web/js">
+			<fileset dir="${dist.dust.dir}" />
+		</copy>
 		
 		<!-- Copy conf create table scripts -->
-		<copy todir="${dist.web.package.dir}/conf" >
+		<copy todir="${dist.web.package.dir}/conf">
 			<fileset dir="${web.package.dir}/conf" />
 		</copy>
 		
@@ -241,6 +265,11 @@
 			<fileset dir="${web.src.dir}" />
 		</copy>
 		
+		<!-- Copy compiled dust templates -->
+		<copy todir="${dist.solo.package.dir}/web/js">
+			<fileset dir="${dist.dust.dir}" />
+		</copy>
+		
 		<!-- Copy sql files -->
 		<copy todir="${dist.solo.package.dir}/sql" >
 			<fileset dir="${sql.src.dir}" />
@@ -259,4 +288,8 @@
 	
 	<target name="package-all" depends="package-exec-server, package-web-server, package-solo-server, package-sql-scripts" description="Create all packages">
 	</target>
+
+	<target name="package" depends="package-all" description="Create all packages">
+	</target>
+
 </project>

diff --git a/src/java/azkaban/utils/Utils.java b/src/java/azkaban/utils/Utils.java
index c0b197b..257508a 100644
--- a/src/java/azkaban/utils/Utils.java
+++ b/src/java/azkaban/utils/Utils.java
@@ -359,13 +359,16 @@ public class Utils {
 	}
 
 	public static String createPeriodString(ReadablePeriod period) {
-		String periodStr = "n";
+		String periodStr = "null";
 
 		if (period == null) {
-			return "n";
+			return "null";
 		}
 
-		if (period.get(DurationFieldType.months()) > 0) {
+		if (period.get(DurationFieldType.years()) > 0) {
+			int years = period.get(DurationFieldType.years());
+			periodStr = years + "y";
+		} else if (period.get(DurationFieldType.months()) > 0) {
 			int months = period.get(DurationFieldType.months());
 			periodStr = months + "M";
 		} else if (period.get(DurationFieldType.weeks()) > 0) {

diff --git a/src/java/azkaban/utils/WebUtils.java b/src/java/azkaban/utils/WebUtils.java
index 95fc6aa..31322e6 100644
--- a/src/java/azkaban/utils/WebUtils.java
+++ b/src/java/azkaban/utils/WebUtils.java
@@ -115,13 +115,17 @@ public class WebUtils {
 	
 	public String formatPeriod(ReadablePeriod period)
 	{
-        String periodStr = "n";
+        String periodStr = "null";
 
         if (period == null) {
             return periodStr;
         }
 
-        if (period.get(DurationFieldType.months()) > 0) {
+        if (period.get(DurationFieldType.years()) > 0) {
+        	int years = period.get(DurationFieldType.years());
+        	periodStr = years + " year(s)";
+        }
+        else if (period.get(DurationFieldType.months()) > 0) {
             int months = period.get(DurationFieldType.months());
             periodStr = months + " month(s)";
         }

diff --git a/src/java/azkaban/webapp/servlet/LoginAbstractAzkabanServlet.java b/src/java/azkaban/webapp/servlet/LoginAbstractAzkabanServlet.java
index d9d039a..5e0c67e 100644
--- a/src/java/azkaban/webapp/servlet/LoginAbstractAzkabanServlet.java
+++ b/src/java/azkaban/webapp/servlet/LoginAbstractAzkabanServlet.java
@@ -291,9 +291,10 @@ public abstract class LoginAbstractAzkabanServlet extends AbstractAzkabanServlet
 			return true;
 		}
 		
-		for(String roleName: user.getRoles()) {
+		for (String roleName: user.getRoles()) {
 			Role role = userManager.getRole(roleName);
-			if (role.getPermission().isPermissionSet(type) || role.getPermission().isPermissionSet(Permission.Type.ADMIN)) {
+			if (role.getPermission().isPermissionSet(type) || 
+					role.getPermission().isPermissionSet(Permission.Type.ADMIN)) {
 				return true;
 			}
 		}

diff --git a/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm b/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm
index 3e4af3f..e21ca51 100644
--- a/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/executingflowpage.vm
@@ -17,14 +17,11 @@
 <!DOCTYPE html> 
 <html>
 	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
 
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+
+		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.common.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.date.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.context.menu.js"></script>
@@ -47,128 +44,159 @@
 			var flowId = "${flowid}";
 			var execId = "${execid}";
 		</script>
-		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
+		<link rel="stylesheet" type="text/css" href="${context}/css/azkaban-svg.css">
+		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css">
 	</head>
 	<body>
-#set($current_page="all")
-#set($show_schedule="false")
-
-#parse("azkaban/webapp/servlet/velocity/nav.vm")
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
-		<div class="content">
-#if($errorMsg)
-				<div class="box-error-message">$errorMsg</div>
+
+#set ($current_page="all")
+#set ($show_schedule="false")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
+				</div>
+			</div>
 #else
-#if($error_message != "null")
-				<div class="box-error-message">$error_message</div>
-#elseif($success_message != "null")
-				<div class="box-success-message">$success_message</div>
-#end
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
 
-				<div id="all-jobs-content">
-					<div class="section-hd flow-header">
-						<h2><a href="${context}/executor?execid=${execid}">Flow Execution <span>$execid</span></a></h2>
-						<div class="section-sub-hd">
-							<h4><a href="${context}/manager?project=${projectName}">Project <span>$projectName</span></a></h4>
-							<h4 class="separator">&gt;</h4>
-							<h4><a href="${context}/manager?project=${projectName}&flow=${flowid}">Flow <span>$flowid</span></a></h4>
-							<h4 class="separator">&gt;</h4>
-							<h4><a href="${context}/executor?execid=${execid}">Execution <span>$execid</span></a></h4>
-						</div>
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
+			</div>
+
+	## Page header
+
+			<div class="page-header">
+				<h1>
+					<a href="${context}/executor?execid=${execid}">Flow Execution <small>$execid</small></a>
+				</h1>
+			</div>
+
+	## Breadcrumb
+				
+			<ol class="breadcrumb">
+				<li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
+				<li><a href="${context}/manager?project=${projectName}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+				<li><a href="${context}/executor?execid=${execid}"><strong>Execution</strong> $execid</a></li>
+			</ol>
+		
+	## Flow status
+			
+			<div class="well">
+				<div class="row" id="flow-status">
+					<div class="col-lg-6">
+						<p><strong>Status</strong> <span id="flowStatus">-</span></p>
+						<p><strong>Submit User</strong> <span id="submitUser">-</span></p>
 					</div>
-					
-					<div id="headertabs" class="headertabs">
-						<ul>
-							<li><a id="graphViewLink" href="#graph">Graph</a></li>
-							<li class="lidivider">|</li>
-							<li><a id="jobslistViewLink" href="#jobslist">Job List</a></li>
-							<li class="lidivider">|</li>
-							<li><a id="flowLogViewLink" href="#log">Flow Log</a></li>
-						</ul>
-						<ul id="actionsBtns" class="buttons">
-							<li><div id="pausebtn" class="btn2">Pause</div></li>
-							<li><div id="resumebtn" class="btn2">Resume</div></li>
-							<li><div id="cancelbtn" class="btn6">Cancel</div></li>
-							<li><div id="retrybtn" class="btn1">Retry Failed</div></li>
-							<li><div id="executebtn" class="btn1">Prepare Execution</div></li>
-						</ul>
+					<div class="col-lg-6">
+						<p><strong>Start Time</strong> <span id="startTime">-</span></p>
+						<p><strong>End Time</strong> <span id="endTime">-</span></p>
+						<p><strong>Duration</strong> <span id="duration">-</span></p>
 					</div>
-					<div id="graphView">
-						<div class="relative">
-							<div id="jobList" class="jobList">
-								<div id="filterList" class="filterList">
-									<input id="filter" class="filter" placeholder="  Job Filter" />
-								</div>
-								<div id="list" class="list">
-								</div>
-								<div id="resetPanZoomBtn" class="btn5 resetPanZoomBtn" >Reset Pan Zoom</div>
-							</div>
-							<div id="svgDiv" class="svgDiv">
-								<svg id="svgGraph" class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed" >
-								</svg>
+				</div>
+			</div>
+
+	## Tabs and buttons.
+
+			<div class="row">
+				<div class="col-lg-8">
+					<ul class="nav nav-pills" id="headertabs">
+						<li id="graphViewLink"><a href="#graph">Graph</a></li>
+						<li id="jobslistViewLink"><a href="#jobslist">Job List</a></li>
+						<li id="flowLogViewLink"><a href="#log">Flow Log</a></li>
+					</ul>
+				</div>
+				<div class="col-lg-4">
+					<div class="pull-right">
+						<button id="pausebtn" class="btn btn-primary">Pause</button>
+						<button id="resumebtn" class="btn btn-primary">Resume</button>
+						<button id="cancelbtn" class="btn btn-danger">Cancel</button>
+						<button id="retrybtn" class="btn btn-success">Retry Failed</button>
+						<button id="executebtn" class="btn btn-success">Prepare Execution</button>
+					</div>
+					<div class="clearfix"></div>
+				</div>
+			</div>
+
+	## Graph View
+
+	#parse ("azkaban/webapp/servlet/velocity/flowgraphview.vm")
+	
+	## Job List View
+
+			<div class="row" id="jobListView">
+				<div class="col-lg-12">
+					<table class="table table-striped table-bordered">
+						<thead>
+							<tr>
+								<th>Name</th>
+								<th class="timeline">Timeline</th>
+								<th class="date">Start Time</th>
+								<th class="date">End Time</th>
+								<th class="elapse">Elapsed</th>
+								<th class="status">Status</th>
+								<th class="logs">Details</th>
+							</tr>
+						</thead>
+						<tbody id="executableBody">
+						</tbody>
+					</table>
+				</div>
+			</div>
+
+	## Flow Log View
+
+			<div class="row" id="flowLogView">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">
+							<div class="pull-right">
+								<button type="button" id="updateLogBtn" class="btn btn-xs btn-default">Refresh</button>
 							</div>
+							Flow log
 						</div>
-					</div>
-					<div id="jobListView" class="executionInfo">
-						<table>
-							<thead>
-								<tr>
-									<th>Name</th>
-									<th class="timeline">Timeline</th>
-									<th class="date">Start Time</th>
-									<th class="date">End Time</th>
-									<th class="elapse">Elapsed</th>
-									<th class="status">Status</th>
-									<th class="details">Details</th>
-								</tr>
-							</thead>
-							<tbody id="executableBody">
-							</tbody>
-						</table>
-					</div>
-					<div id="flowLogView" class="logView">
-						<div class="logHeader"><div class="logButtonRow"><div id="updateLogBtn" class="btn7">Refresh</div></div></div>
-						<div class="logViewer">
+						<div class="panel-body">
 							<pre id="logSection" class="log"></pre>
 						</div>
 					</div>
 				</div>
-				
-				<div id="flow-status">
-					<table class="status">
-						<tr><td class="first">Status</td><td id="flowStatus">-</td></tr>
-						<tr><td class="first">Submit User</td><td id="submitUser">-</td></tr>
-					</table>
-					<table class="time">
-						<tr><td class="first">Start Time</td><td id="startTime">-</td></tr>
-						<tr><td class="first">End Time</td><td id="endTime">-</td></tr>
-						<tr><td class="first">Duration</td><td id="duration">-</td></tr>
-					</table>
+			</div>
+	
+	## Error message message dialog.
+
+			<div class="modal fade" id="messageDialog">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header" id="messageTitle">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Error</h4>
+						</div>
+						<div class="modal-body" id="messageDiv">
+							<p id="messageBox"></p>
+						</div>
+					</div>
 				</div>
+			</div>
 
-#parse("azkaban/webapp/servlet/velocity/flowexecutionpanel.vm")
-#end
-		</div>
+		<div id="contextMenu"></div>
 
-		
-		<div id="messageDialog" class="modal">
-			<h3 id="messageTitle">Error</h3>
-			<div class="messageDiv">
-				<p id="messageBox"></p>
-			</div>
-		</div>
-		
-		<div id="invalid-session" class="modal">
-			<h3>Invalid Session</h3>
-			<p>Session has expired. Please re-login.</p>
-			<div class="actions">
-				<a class="yes btn2" id="login-btn" href="#">Re-login</a>
-			</div>
-		</div>
-		
-		<div id="contextMenu">
+	#parse ("azkaban/webapp/servlet/velocity/invalidsessionmodal.vm")
+	#parse ("azkaban/webapp/servlet/velocity/flowexecutionpanel.vm")
+	#parse ("azkaban/webapp/servlet/velocity/messagedialog.vm")
+#end
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
 		</div>
-		#parse( "azkaban/webapp/servlet/velocity/messagedialog.vm" )
 	</body>
 </html>
-

diff --git a/src/java/azkaban/webapp/servlet/velocity/executionspage.vm b/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
index f416d20..7c0a5d0 100644
--- a/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/executionspage.vm
@@ -16,14 +16,11 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse("azkaban/webapp/servlet/velocity/style.vm")
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+	<head lang="en">
 
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+	
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript">
 			var contextURL = "${context}";
@@ -34,103 +31,132 @@
 		</script>
 	</head>
 	<body>
-		#set($current_page="executing")
-#parse("azkaban/webapp/servlet/velocity/nav.vm")
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
 
-		<div class="content">
-			<div id="all-jobs-content">
-				<div class="section-hd">
-					<h2>Executing Flows</h2>
-				</div>
+#set ($current_page="executing")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
 			</div>
-			
-			<h3 class="subhead">Currently Running Jobs</h3>
-			<div class="executionInfo">
-				<table id="executingJobs">
-					<thead>
-						<tr>
-							<th class="execid">Execution Id</th>
-							<th>Flow</th>
-							<th>Project</th>
-							<th class="user">User</th>
-							<th class="user">Proxy User</th>
-							<th class="date">Start Time</th>
-							<th class="date">End Time</th>
-							<th class="elapse">Elapsed</th>
-							<th class="status">Status</th>
-							<th class="action">Action</th>
-						</tr>
-					</thead>
-					<tbody>
-#if($runningFlows)
-	#foreach($flow in $runningFlows)
-						<tr class="row" >
-							<td class="tb-name">
-								<a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
-							</td>
-							<td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
-							<td>
-								<a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
-							</td>
-							<td>${flow.submitUser}</td>
-							<td>${flow.proxyUsers}</td>
-							<td>$utils.formatDate(${flow.startTime})</td>
-							<td>$utils.formatDate(${flow.endTime})</td>
-							<td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
-							<td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
-							<td></td>
-						</tr>
+
+## Page header.
+
+			<div class="page-header">
+				<h1>Executing Flows</h1>
+			</div>
+
+## Page Content
+
+			<div class="row">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">Currently Running Jobs</div>
+						<table id="executingJobs" class="table table-striped">
+							<thead>
+								<tr>
+									<th class="execid">Execution Id</th>
+									<th>Flow</th>
+									<th>Project</th>
+									<th class="user">User</th>
+									<th class="user">Proxy User</th>
+									<th class="date">Start Time</th>
+									<th class="date">End Time</th>
+									<th class="elapse">Elapsed</th>
+									<th class="status">Status</th>
+									<th class="action">Action</th>
+								</tr>
+							</thead>
+							<tbody>
+#if ($runningFlows)
+	#foreach ($flow in $runningFlows)
+								<tr class="row" >
+									<td class="tb-name">
+										<a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
+									</td>
+									<td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
+									<td>
+										<a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
+									</td>
+									<td>${flow.submitUser}</td>
+									<td>${flow.proxyUsers}</td>
+									<td>$utils.formatDate(${flow.startTime})</td>
+									<td>$utils.formatDate(${flow.endTime})</td>
+									<td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
+									<td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
+									<td></td>
+								</tr>
 	#end
 #else
-						<tr><td></td><td class="last">No Executing Flows</td></tr>
+								<tr>
+									<td></td>
+									<td class="last">No Executing Flows</td>
+								</tr>
 #end
-					</tbody>
-				</table>
-			</div>
-			<h3 class="subhead">Recently Finished Jobs</h3>
-			<div class="executionInfo">
-				<table id="recentlyFinished">
-					<thead>
-						<tr>
-							<th class="execid">Execution Id</th>
-							<th>Flow</th>
-							<th>Project</th>
-							<th class="user">User</th>
-							<th class="user">Proxy User</th>
-							<th class="date">Start Time</th>
-							<th class="date">End Time</th>
-							<th class="elapse">Elapsed</th>
-							<th class="status">Status</th>
-							<th class="action">Action</th>
-						</tr>
-					</thead>
-					<tbody>
-#if($recentlyFinished.isEmpty())
-	#foreach($flow in $recentlyFinished)
-						<tr class="row" >
-							<td class="tb-name execId">
-								<a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
-							</td>
-							<td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
-							<td>
-								<a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
-							</td>
-							<td>${flow.submitUser}</td>
-							<td>${flow.proxyUsers}</td>
-							<td>$utils.formatDate(${flow.startTime})</td>
-							<td>$utils.formatDate(${flow.endTime})</td>
-							<td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
-							<td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
-							<td></td>
-						</tr>
+							</tbody>
+						</table>
+					</div><!-- /panel -->
+				</div><!-- /col-lg-12 -->
+			</div><!-- /row -->
+
+			<div class="row">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">Recently Finished Jobs</div>
+						<table id="recentlyFinished" class="table table-striped">
+							<thead>
+								<tr>
+									<th class="execid">Execution Id</th>
+									<th>Flow</th>
+									<th>Project</th>
+									<th class="user">User</th>
+									<th class="user">Proxy User</th>
+									<th class="date">Start Time</th>
+									<th class="date">End Time</th>
+									<th class="elapse">Elapsed</th>
+									<th class="status">Status</th>
+									<th class="action">Action</th>
+								</tr>
+							</thead>
+							<tbody>
+#if ($recentlyFinished.isEmpty())
+	#foreach ($flow in $recentlyFinished)
+								<tr class="row" >
+									<td class="tb-name execId">
+										<a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
+									</td>
+									<td><a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})&flow=${flow.flowId}">${flow.flowId}</a></td>
+									<td>
+										<a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
+									</td>
+									<td>${flow.submitUser}</td>
+									<td>${flow.proxyUsers}</td>
+									<td>$utils.formatDate(${flow.startTime})</td>
+									<td>$utils.formatDate(${flow.endTime})</td>
+									<td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
+									<td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
+									<td></td>
+								</tr>
 	#end
 #else
-						<tr><td></td><td class="last">No Recently Finished</td></tr>
+								<tr>
+									<td></td>
+									<td class="last">No Recently Finished</td>
+								</tr>
 #end	
-					</tbody>
-				</table>
-			</div>
-		</div>
+							</tbody>
+						</table>
+					</div><!-- /panel -->
+
+				</div><!-- /col-lg-12 -->
+			</div><!-- /row -->
+		
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
+		</div><!-- /container -->
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm b/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
index f338e2d..b752a56 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowexecutionpanel.vm
@@ -14,172 +14,207 @@
  * the License.
 *#
 
-<script type="text/javascript" src="${context}/js/azkaban.layout.js"></script>
-<script type="text/javascript" src="${context}/js/svgNavigate.js"></script>
-<script type="text/javascript" src="${context}/js/azkaban.context.menu.js"></script>
-<script type="text/javascript" src="${context}/js/azkaban.common.utils.js"></script>
-<script type="text/javascript" src="${context}/js/azkaban.svg.graph.view.js"></script>
-<script type="text/javascript" src="${context}/js/azkaban.flow.execute.view.js"></script>
-
-<div id="modalBackground" class="modalBackground2">
-<div id="execute-flow-panel" class="modal modalContainer2">
-	<h3 id="execute-flow-panel-title"></h3>
-	<a title="Close" class="modal-close closeExecPanel">x</a>
-	<div id="execute-message" class="message">
-	</div>
-	
-	<div class="panel">
-		<div id="executionGraphOptions">
-			<div id="graphOptions" class="sideMenu">
-				<h3 id="flowOption" viewpanel="svgDivCustom">Flow View</h3>
-				<div>
-					<p>Right click on the jobs to disable and enable jobs in the flow.</p>
-				</div>
-				<h3 viewpanel="notificationPanel">Notification</h3>
-				<div>
-					<p>Change the addresses where success and failure emails will be sent.</p>
-				</div>
-				<h3 viewpanel="failureOptions">Failure Options</h3>
-				<div>
-					<p>Select flow behavior when a failure is detected.</p>
-				</div>
-				<h3 viewpanel="concurrentPanel">Concurrent</h3>
-				<div>
-					<p>Change the behavior of the flow if it is already running.</p>
-				</div>
-				<h3 viewpanel="flowParametersPanel">Flow Parameters</h3>
-				<div>
-					<p>Add temporary flow parameters that are used to override global properties for each job.</p>
-				</div>
-			</div>
-		</div>
-		<div id="executionGraphOptionsPanel" class="rightPanel">
-			<div id="svgDivCustom" class="svgDiv sidePanel" >
-				<svg class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed" >
-				</svg>
-			</div>
-			<div id="notificationPanel" class="sidePanel">
-				<div>
-					<h4>Notify on Failure</h4>
-					<p>On a job failure, notify on either the first failure, and/or when the failed flow finishes.</p>
-					<input id="notifyFailureFirst" class="checkbox" type="checkbox" name="notify" value="first" checked /> <label for="notify">First Failure</label>
-					<input id="notifyFailureLast" class="checkbox" type="checkbox" name="notify" value="last"></input> <label for="notify">Flow Finished</label>
-					
-
-					<h4>Failure Emails</h4>
-					<div>
-						<input id="overrideFailureEmails" type="checkbox" name="overrideFailureEmails" value="overrideFailureEmails" />
-						<label for="overrideFailureEmails">Override flow email settings</label>
-					</div>
-					<p>Notify these addresses on failure. Comma, space or semi-colon delimited list.</p>
-					<textarea id="failureEmails"></textarea>
-				</div>
-			
-				<div>
-					<h4>Success Emails</h4>
-					<div>
-						<input id="overrideSuccessEmails" type="checkbox" name="overrideSuccessEmails" value="overrideSuccessEmails" />
-						<label for="overrideSuccessEmails">Override flow email settings</label>
-					</div>
-					<p>Notify when the flow finishes successfully. Comma, space or semi-colon delimited list.</p>
-					<textarea id="successEmails"></textarea>
-				</div>
-			</div> 
-			<div id="failureOptions" class="failureOptions sidePanel">
-				<h4>Failure Options</h4>
-				<p>When a failure first occurs in the flow, select the execution behavior.</p>
-				<ul>
-					<li><span class="bold">Finish Current Running</span> finishes only the currently running jobs. It will not start any new jobs.</p></li>
-					<li><span class="bold">Cancel All</span> immediately kills all jobs and fails the flow.</p></li>
-					<li><span class="bold">Finish All Possible</span> will keep executing jobs as long as its dependencies are met.</p></li>
-				</ul>
-
-				<select id="failureAction" name="failureAction">
-					<option value="finishCurrent">Finish Current Running</option>
-					<option value="cancelImmediately">Cancel All</option>
-					<option value="finishPossible">Finish All Possible</option>
-				</select>
-			</div>
-			<div id="concurrentPanel" class="sidePanel">
-				<h4>Concurrent Execution Options</h4>
-				<p>If the flow is currently running, these are the options that can be set.</p>
-
-				<input id="skip" class="radio" type="radio" name="concurrent" value="skip" checked /><label for="skip">Skip Execution</label>
-				<p>Do not run flow if it is already running.</p>
-				
-				<input id="ignore" class="radio" type="radio" name="concurrent" value="ignore" checked /><label for="ignore">Run Concurrently</label>
-				<p>Run the flow anyways. Previous execution is unaffected.</p>
-
-				<input id="pipeline" class="radio" type="radio" name="concurrent" value="pipeline" /><label for="pipeline">Pipeline</label>
-				<select id="pipelineLevel" name="pipelineLevel">
-					<option value="1">Level 1</option>
-					<option value="2">Level 2</option>
-				</select>
-				<p>Pipeline the flow, so the current execution will not be overrun.</p>
-				<ul>
-					<li>Level 1: block job A until the previous flow job A has completed.</li>
-					<li>Level 2: block job A until the previous flow job A's children have completed.</li>
-				</ul>
-				<!--
-				<input id="queue" class="radio" type="radio" name="concurrent" value="queue" /><label for="queue">Queue Job</label>
-				<select id="queueLevel" name="queueLevel">
-					<option value="1">1</option>
-					<option value="2">2</option>
-				</select>
-				<p>Queue up to 2. Wait until the previous execution has completed before running.</p>
-				-->
-			</div>
-			<div id="flowParametersPanel" class="sidePanel">
-				<h4>Flow Property Override</h4>
-				<div id="editTable" class="tableDiv">
-					<table>
-						<thead>
-							<tr>
-								<th>Name</th>
-								<th>Value</th>
-							</tr>
-						</thead>
-						<tbody>
-							<tr id="addRow" class="addRow"><td id="addRow-col" colspan="2"><span class="addIcon"></span><a>Add Row</a></td></tr>
-						</tbody>
-					</table>
-				</div>
-			</div>
-		</div>
-	</div>
-	
-	<div class="actions">
-		#if(!$show_schedule || $show_schedule == 'true') 
-		<a class="btn2" id="schedule-btn">Schedule</a>
-		#end
-		
+			<script type="text/javascript" src="${context}/js/azkaban.layout.js"></script>
+			<script type="text/javascript" src="${context}/js/svgNavigate.js"></script>
+			<script type="text/javascript" src="${context}/js/azkaban.context.menu.js"></script>
+			<script type="text/javascript" src="${context}/js/azkaban.common.utils.js"></script>
+			<script type="text/javascript" src="${context}/js/azkaban.svg.graph.view.js"></script>
+			<script type="text/javascript" src="${context}/js/azkaban.flow.execute.view.js"></script>
+
+			<div class="modal modal-wide fade" id="execute-flow-panel">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title" id="execute-flow-panel-title"></h4>
+						</div><!-- /modal-header -->
+						<div class="modal-body row">
+							<div class="col-md-4">
+								<ul class="nav nav-pills nav-stacked" id="graph-options">
+									<li id="flow-option" viewpanel="svg-div-custom">
+										<a href="#">Flow View</a>
+										<div class="menu-caption">Right click on the jobs to disable and enable jobs in the flow.</div>
+									</li>
+									<li viewpanel="notification-panel">
+										<a href="#">Notification</a>
+										<div class="menu-caption">Change the address where success and failure emails will be sent.</div>
+									</li>
+									<li viewpanel="failure-options">
+										<a href="#">Failure Options</a>
+										<div class="menu-caption">Select flow behavior when a failure is detected.</div>
+									</li>
+									<li viewpanel="concurrent-panel">
+										<a href="#">Concurrent</a>
+										<div class="menu-caption">Change the behavior of the flow if it is already running.</div>
+									</li>
+									<li viewpanel="flow-parameters-panel">
+										<a href="#">Flow Parameters</a>
+										<div class="menu-caption">Add temporary flow parameters that are used to override global settings for each job.</div>
+									</li>
+								</ul>
+							</div><!-- /col-md-4 -->
+							<div class="col-md-8">
+								<div id="execution-graph-options-panel">
+
+## SVG graph panel.
+
+									<div id="svg-div-custom" class="side-panel">
+										<svg class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed">
+										</svg>
+									</div>
+
+## Notification panel.
+
+									<div id="notification-panel" class="side-panel">
+										<h4>Notify on failure</h4>
+										<p>On a job failure, notify on either the first failure, and/or when the failed flow finishes.</p>
+										<hr>
+										<label class="checkbox-inline">
+											<input id="notify-failure-first" type="checkbox" name="notify" value="first">First failure
+										</label>
+										<label class="checkbox-inline">
+											<input id="notify-failure-last" type="checkbox" name="notify" value="last">Flow finished
+										</label>
+
+										<h4>Failure Emails</h4>
+										<div class="checkbox">
+											<label>
+												<input type="checkbox" id="override-failure-emails" name="overrideFailureEmails" value="overrideFailureEmails">
+												Override flow email settings.
+											</label>
+										</div>
+										<label>Notify these addresses on failure. Comma, space, or semi-colon delimited list.</label>
+										<textarea class="form-control" rows="3" id="failure-emails"></textarea>
+
+										<h4>Success Emails</h4>
+										<div class="checkbox">
+											<label>
+												<input type="checkbox" name="overrideSuccessEmails" value="overrideSuccessEmails">
+												Override flow email settings.
+											</label>
+										</div>
+										<label>Notify when the flow finishes successfully. Comma, space, or semi-colon delimited list.</label>
+										<textarea class="form-control" rows="3" id="success-emails"></textarea>
+									</div>
+
+## Failure options panel.
+
+									<div id="failure-options" class="side-panel">
+										<h4>Failure Options</h4>
+										<p>When a failure first occurs in the flow, select the execution behavior.</p>
+										<hr>
+										<ul>
+											<li><strong>Finish Current Running</strong> finishes only the currently running job. It will not start any new jobs.</li>
+											<li><strong>Cancel All</strong> immediately kills all jobs and fails the flow.</li>
+											<li><strong>Finish All Possible</strong> will keep executing jobs as long as its dependencies are met.</li>
+										</ul>
+										<select id="failure-action" name="failureAction">
+											<option value="finishCurrent">Finish Current Running</option>
+											<option value="cancelImmediately">Cancel All</option>
+											<option value="finishPossible">Finish All Possible</option>
+										</select>
+									</div>
+
+## Concurrent execution options panel.
+
+									<div id="concurrent-panel" class="side-panel">
+										<h4>Concurrent Execution Options</h4>
+										<p>If the flow is currently running, these are the options that can be set.</p>
+										<hr>
+										<div class="radio">
+											<label>
+												<input type="radio" id="skip" name="concurrent" value="skip" checked="checked">
+												Skip Execution
+											</label>
+											<span class="help-block">Do not run flow if it is already running.</span>
+										</div>
+
+										<div class="radio">
+											<label>
+												<input type="radio" id="ignore" name="concurrent" value="ignore">
+												Run Concurrently
+											</label>
+											<span class="help-block">Do not run flow if it is already running.</span>
+										</div>
+
+										<div class="radio">
+											<label>
+												<input type="radio" id="pipeline" name="concurrent" value="pipeline">
+												Pipeline
+											</label>
+											<select id="pipelineLevel" name="pipelineLevel">
+												<option value="1">Level 1</option>
+												<option value="2">Level 2</option>
+											</select>
+											<span class="help-block">
+												Pipeline the flow, so the current execution will not be overrun.
+												<ul>
+													<li>Level 1: block job A until the previous flow job A has completed.</li>
+													<li>Level 2: block job A until the previous flow job A's children have completed.</li>
+												</li>
+											</span>
+										</div>
+									</div>
+
+## Flow parameters panel
+
+									<div id="flow-parameters-panel" class="side-panel">
+										<h4>Flow Property Override</h4>
+										<hr>
+										<div id="editTable">
+											<table class="table table-striped">
+												<thead>
+													<tr>
+														<th>Name</th>
+														<th>Value</th>
+													</tr>
+												</thead>
+												<tbody>
+													<tr id="addRow" class="addRow">
+														<td id="addRow-col" colspan="2">
+															<button type="button" class="btn btn-success btn-xs">Add Row</button>
+														</td>
+													</tr>
+												</tbody>
+											</table>
+										</div>
+									</div>
+
+								</div><!-- /execution-graph-options-panel -->
+							</div><!-- /col-md-8 -->
+						</div><!-- /modal-body -->
+
+						<div class="modal-footer">
+#if (!$show_schedule || $show_schedule == 'true') 
+							<button type="button" class="btn btn-success" id="schedule-btn">Schedule</button>
+#end
 #*
-		#if( $triggerPlugins.size() > 0 ) 
-			#foreach( $triggerPlugin in $triggerPlugins )
-			<a class="btn2" id=set-$triggerPlugin.pluginName>$triggerPlugin.pluginName</a>
-			#end
-		#end
+#if ($triggerPlugins.size() > 0)
+	#foreach ($triggerPlugin in $triggerPlugins)
+							<button type="button" class="btn btn-default" id=set-$triggerPlugin.pluginName>$triggerPlugin.pluginName</button>
+	#end
+#end
 *#
-		<a class="yes btn1" id="execute-btn">Execute</a>
-		<a class="no simplemodal-close btn3 closeExecPanel">Cancel</a>
-	</div>
-</div>
-</div>
-
-#if(!$show_schedule || $show_schedule == 'true') 
-#parse( "azkaban/webapp/servlet/velocity/schedulepanel.vm" )
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="execute-btn">Execute</button>
+						</div><!-- /modal-footer -->
+					</div><!-- /modal-content -->
+				</div><!-- /modal-dialog -->
+			</div><!-- /modal -->
+
+#if (!$show_schedule || $show_schedule == 'true') 
+	#parse ("azkaban/webapp/servlet/velocity/schedulepanel.vm")
 #end
 
 #*
-#if( $triggerPlugins.size() > 0 ) 
-	#foreach( $triggerPlugin in $triggerPlugins )
-		#set ($prefix = $triggerPlugin.pluginName )
-		#set ($webpath = $triggerPlugin.pluginPath )
-		#parse( $triggerPlugin.inputPanelVM )
+#if ($triggerPlugins.size() > 0)
+	#foreach ($triggerPlugin in $triggerPlugins)
+		#set ($prefix = $triggerPlugin.pluginName)
+		#set ($webpath = $triggerPlugin.pluginPath)
+		#parse ($triggerPlugin.inputPanelVM)
 	#end
 #end
 *#
 
-<div id="contextMenu">
-	
-</div>
+			<div id="contextMenu"></div>
+

diff --git a/src/java/azkaban/webapp/servlet/velocity/flowgraphview.vm b/src/java/azkaban/webapp/servlet/velocity/flowgraphview.vm
new file mode 100644
index 0000000..c6e79fd
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/flowgraphview.vm
@@ -0,0 +1,38 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+
+ 	## Graph view.
+ 
+			<div class="row" id="graphView">
+				<div class="col-lg-4">
+					<div class="panel panel-default" id="jobList">
+						<div class="panel-heading">
+							<input id="filter" type="text" placeholder="Job Filter" class="form-control">
+						</div>
+						<ul id="list" class="list-group"></ul>
+						<div class="panel-footer">
+							<button type="button" class="btn btn-sm btn-default" id="resetPanZoomBtn">Reset Pan Zoom</button>
+						</div>
+					</div>
+				</div>
+				<div class="col-lg-8">
+					<div id="svgDiv" class="well">
+						<svg id="svgGraph" class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed" >
+						</svg>
+					</div>
+				</div>
+			</div>

diff --git a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
index cde432c..b9833fe 100644
--- a/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/flowpage.vm
@@ -16,16 +16,15 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
+	<head lang="en">
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
 		
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
-		
+		<script type="text/javascript" src="${context}/js/dust-core-2.2.2.min.js"></script>
+		<script type="text/javascript" src="${context}/js/flowsummary.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.date.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.ajax.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.common.utils.js"></script>
@@ -47,107 +46,124 @@
 			var flowId = "${flowid}";
 			var execId = null;
 		</script>
+		<link rel="stylesheet" type="text/css" href="${context}/css/azkaban-svg.css" />
 		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
 	</head>
 	<body>
-#set($current_page="all")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
-		<div class="content">
-#if($errorMsg)
-				<div class="box-error-message">$errorMsg</div>
+
+#set ($current_page="all")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
+				</div>
+			</div>
 #else
-#if($error_message != "null")
-				<div class="box-error-message">$error_message</div>
-#elseif($success_message != "null")
-				<div class="box-success-message">$success_message</div>
-#end
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
 
-				<div id="all-jobs-content">
-					<div class="section-hd flow-header">
-						<h2><a href="${context}/manager?project=${project.name}&flow=${flowid}">Flow <span>$flowid</span></a></h2>
-						<div class="section-sub-hd">
-							<h4><a href="${context}/manager?project=${project.name}">Project <span>$project.name</span></a></h4>
-							<h4 class="separator">&gt;</h4>
-							<h4><a href="${context}/manager?project=${project.name}&flow=${flowid}">Flow <span>$flowid</span></a></h4>
-						</div>
-						
-						<div id="executebtn" class="btn1">Schedule / Execute Flow</div>
-					</div>
-					
-					<div id="headertabs" class="headertabs">
-						<ul>
-							<li><a id="graphViewLink" href="#graph">Graph</a></li>
-							<li class="lidivider">|</li>
-							<li><a id="executionsViewLink" href="#executions">Executions</a></li>
-						</ul>
-					</div>
-					<div id="graphView">
-						<div class="relative">
-							<div id="jobList" class="jobList">
-								<div id="filterList" class="filterList">
-									<input id="filter" class="filter" placeholder="  Job Filter" />
-								</div>
-								<div id="list" class="list">
-								</div>
-								<div id="resetPanZoomBtn" class="btn5 resetPanZoomBtn" >Reset Pan Zoom</div>
-							</div>
-							<div id="svgDiv" class="svgDiv">
-								<svg id="svgGraph" class="svgGraph" xmlns="http://www.w3.org/2000/svg" version="1.1" shape-rendering="optimize-speed" text-rendering="optimize-speed" >
-								</svg>
-							</div>
-						</div>
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
+			</div>
+	
+	## Page header.
+
+			<div class="page-header">
+				<h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
+				<p>$project.description</p>
+			</div>
+
+	## Breadcrumbs and tabs
+
+			<div class="row">
+				<div class="col-lg-12">
+					<ol class="breadcrumb">
+						<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+					</ol>
+				</div>
+			</div>
+
+			<div class="row">
+				<div class="col-lg-8">
+					<ul class="nav nav-pills" id="headertabs">
+						<li id="graphViewLink"><a href="#graph">Graph</a></li>
+						<li id="executionsViewLink"><a href="#executions">Executions</a></li>
+						<li id="summaryViewLink"><a href="#summary">Summary</a></li>
+					</ul>
+				</div>
+				<div class="col-lg-4">
+					<div class="pull-right">
+						<button type="button" class="btn btn-success" id="executebtn">Schedule / Execute Flow</button>
 					</div>
-					<div id="executionsView">
-						<div id="executionDiv" class="all-jobs executionInfo">
-							<table id="execTable">
-								<thead>
-									<tr>
-										<th>Execution Id</th>
-										<th>User</th>
-										<th class="date">Start Time</th>
-										<th class="date">End Time</th>
-										<th class="elapse">Elapsed</th>
-										<th class="status">Status</th>
-										<th class="action">Action</th>
-									</tr>
-								</thead>
-								<tbody id="execTableBody">
-								</tbody>
-							</table>
-						</div>
+					<div class="clearfix"></div>
+				</div>
+			</div>
 					
-						<div id="pageSelection">
-							<ul>
-								<li id="previous" class="first"><a><span class="arrow">&larr;</span>Previous</a></li>
-								<li id="page1"><a href="#page1">1</a></li>
-								<li id="page2"><a href="#page2">2</a></li>
-								<li id="page3"><a href="#page3">3</a></li>
-								<li id="page4"><a href="#page4">4</a></li>
-								<li id="page5"><a href="#page5">5</a></li>
-								<li id="next"><a>Next<span class="arrow">&rarr;</span></a></li>
-							</ul>
-						</div>
-					</div>
+	## Graph view.
+
+	#parse ("azkaban/webapp/servlet/velocity/flowgraphview.vm")
+
+	## Executions view.
+
+			<div class="row" id="executionsView">
+				<div class="col-lg-12">
+					<table class="table table-striped table-bordered" id="execTable">
+						<thead>
+							<tr>
+								<th>Execution Id</th>
+								<th>User</th>
+								<th class="date">Start Time</th>
+								<th class="date">End Time</th>
+								<th class="elapse">Elapsed</th>
+								<th class="status">Status</th>
+								<th class="action">Action</th>
+							</tr>
+						</thead>
+						<tbody id="execTableBody">
+						</tbody>
+					</table>
+					<ul id="pageSelection" class="pagination">
+						<li id="previous" class="first"><a><span class="arrow">&larr;</span>Previous</a></li>
+						<li id="page1"><a href="#page1">1</a></li>
+						<li id="page2"><a href="#page2">2</a></li>
+						<li id="page3"><a href="#page3">3</a></li>
+						<li id="page4"><a href="#page4">4</a></li>
+						<li id="page5"><a href="#page5">5</a></li>
+						<li id="next"><a>Next<span class="arrow">&rarr;</span></a></li>
+					</ul>
 				</div>
-		<!-- modal content -->
-
-				<div id="invalid-session" class="modal">
-					<h3>Invalid Session</h3>
-						<p>Session has expired. Please re-login.</p>
-						<div class="actions">
-							<a class="yes btn3" id="login-btn" href="#">Re-login</a>
-						</div>
+			</div>
+		
+	## Summary view.
+
+			<div class="row">
+				<div class="col-lg-12" id="summaryView">
 				</div>
+			</div><!-- /#summaryView -->
 
-#parse( "azkaban/webapp/servlet/velocity/flowexecutionpanel.vm" )
+			<div id="contextMenu">
+			</div>
 
+	#parse ("azkaban/webapp/servlet/velocity/invalidsessionmodal.vm")
+	#parse ("azkaban/webapp/servlet/velocity/flowexecutionpanel.vm")
+	#parse ("azkaban/webapp/servlet/velocity/messagedialog.vm")
 #end
 
-		</div>
-		<div id="contextMenu">
-		</div>
-		#parse( "azkaban/webapp/servlet/velocity/messagedialog.vm" )
+#parse("azkaban/webapp/servlet/velocity/footer.vm")
+		</div><!-- /.container -->
 	</body>
-</html>
-
+</body>

diff --git a/src/java/azkaban/webapp/servlet/velocity/footer.vm b/src/java/azkaban/webapp/servlet/velocity/footer.vm
new file mode 100644
index 0000000..cf3f9e5
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/footer.vm
@@ -0,0 +1,20 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+			<hr>
+			<footer>
+				<p>Azkaban</p>
+			</footer>

diff --git a/src/java/azkaban/webapp/servlet/velocity/historypage.vm b/src/java/azkaban/webapp/servlet/velocity/historypage.vm
index 8c833d2..b1b93dc 100644
--- a/src/java/azkaban/webapp/servlet/velocity/historypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/historypage.vm
@@ -16,14 +16,15 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
+	<head lang="en">
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+
+		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
+		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-timepicker-addon.css" />
+
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-timepicker-addon.js"></script> 
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-sliderAccess.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>		
@@ -33,85 +34,108 @@
 			var currentTime = ${currentTime};
 			var timezone = "${timezone}";
 		</script>
-		
-		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
-		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-timepicker-addon.css" />
 	</head>
 	<body>
-		#set($current_page="history")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
-
-		#if($errorMsg)
-					<div class="box-error-message">$errorMsg</div>
-		#else
-			#if($error_message != "null")
-	                <div class="box-error-message">$error_message</div>
-			#elseif($success_message != "null")
-        	        <div class="box-success-message">$success_message</div>
-			#end
-		#end	
 		
+#set ($current_page="history")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
 
-		<div class="content">
-			<div id="all-jobs-content">
-				<div class="section-hd">
-					<h2>History</h2>
-					<a id="adv-filter-btn" class="btn1 "  href="#">Advanced Filter</a>
-					<form id="search-form" method="get">
-						<input type="hidden" name="search" value="true">
-						<input type="submit" value="Quick Search" class="search-btn">
-						<input id="searchtextbox" type="text" placeholder="flow name containing ..." value=#if($search_term) ${search_term} #else "" #end class="search-input" name="searchterm">
-					</form>
+		<div class="container">
+			
+## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
+			</div>
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
 			</div>
-			
-			<div class="executionInfo">
-				<table id="executingJobs">
-					<thead>
-						<tr>
-							<th class="execid">Execution Id</th>
-							<th>Flow</th>
-							<th>Project</th>
-							<th>User</th>
-							<th class="date">Start Time</th>
-							<th class="date">End Time</th>
-							<th class="elapse">Elapsed</th>
-							<th class="status">Status</th>
-							<th class="action">Action</th>
-						</tr>
-					</thead>
-					<tbody>
-#if(!$flowHistory.isEmpty())
-	#foreach($flow in $flowHistory)
-						<tr class="row" >
-							<td class="tb-name execId">
-								<a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
-							</td>
-							<td class="tb-name">
-								<a href="${context}/executor?execid=${flow.executionId}">${flow.flowId}</a>
-							</td>
-							<td>
-								<a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
-							</td>
-							<td>${flow.submitUser}</td>
-							<td>$utils.formatDate(${flow.startTime})</td>
-							<td>$utils.formatDate(${flow.endTime})</td>
-							<td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
-							<td><div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div></td>
-							<td></td>
-						</tr>
+#else
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+#end
+
+## Page header.
+
+			<div class="page-header">
+				<h1>History</h1>
+			</div>
+
+			<div class="row">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">
+							<form id="search-form" method="get" class="form-inline" role="form">
+								<input type="hidden" name="search" value="true">
+								<div class="form-group">
+									<div class="input-group">
+										<input type="text" id="searchtextbox" placeholder="flow name containing ..." value=#if($search_term) ${search_term} #else "" #end class="form-control" name="searchterm">
+										<span class="input-group-btn">
+											<button class="btn btn-primary">Quick Search</button>
+											<button type="button" class="btn btn-success" id="adv-filter-btn">Advanced Filter</button>
+										</span>
+									</div>
+								</div>
+							</form>
+						</div>
+						<table id="executingJobs" class="table table-striped">
+							<thead>
+								<tr>
+									<th class="execid">Execution Id</th>
+									<th>Flow</th>
+									<th>Project</th>
+									<th>User</th>
+									<th class="date">Start Time</th>
+									<th class="date">End Time</th>
+									<th class="elapse">Elapsed</th>
+									<th class="status">Status</th>
+									<th class="action">Action</th>
+								</tr>
+							</thead>
+							<tbody>
+#if (!$flowHistory.isEmpty())
+	#foreach ($flow in $flowHistory)
+								<tr>
+									<td class="tb-name execId">
+										<a href="${context}/executor?execid=${flow.executionId}">${flow.executionId}</a>
+									</td>
+									<td class="tb-name">
+										<a href="${context}/executor?execid=${flow.executionId}">${flow.flowId}</a>
+									</td>
+									<td>
+										<a href="${context}/manager?project=$vmutils.getProjectName(${flow.projectId})">$vmutils.getProjectName(${flow.projectId})</a>
+									</td>
+									<td>${flow.submitUser}</td>
+									<td>$utils.formatDate(${flow.startTime})</td>
+									<td>$utils.formatDate(${flow.endTime})</td>
+									<td>$utils.formatDuration(${flow.startTime}, ${flow.endTime})</td>
+									<td>
+										<div class="status ${flow.status}">$utils.formatStatus(${flow.status})</div>
+									</td>
+									<td></td>
+								</tr>
 	#end
 #else
-						<tr><td class="last" colspan="9">No History Results Found</td></tr>
+								<tr>
+									<td class="last" colspan="9">No History Results Found</td>
+								</tr>
 #end
-					</tbody>
-				</table>
-				
-				<div id="pageSelection" class="nonjavascript">
-					<ul>
-		
-						#if($search)
+							</tbody>
+						</table>
+					</div><!-- /panel -->
+					<ul class="pagination" id="pageSelection">
+#if ($search)
 						<li id="previous" class="first"><a href="${context}/history?page=${previous.page}&size=${previous.size}&search=true&searchterm=${search_term}"><span class="arrow">&larr;</span>Previous</a></li>
 						<li id="page1" #if($page1.selected) class="selected" #end><a href="${context}/history?page=${page1.page}&size=${page1.size}&search=true&searchterm=${search_term}">${page1.page}</a></li>
 						<li id="page2" #if($page2.selected) class="selected" #end><a href="${context}/history?page=${page2.page}&size=${page2.size}&search=true&searchterm=${search_term}">${page2.page}</a></li>
@@ -119,7 +143,7 @@
 						<li id="page4" #if($page4.selected) class="selected" #end><a href="${context}/history?page=${page4.page}&size=${page4.size}&search=true&searchterm=${search_term}">${page4.page}</a></li>
 						<li id="page5" #if($page5.selected) class="selected" #end><a href="${context}/history?page=${page5.page}&size=${page5.size}&search=true&searchterm=${search_term}">${page5.page}</a></li>
 						<li id="next"><a href="${context}/history?page=${next.page}&size=${next.size}&search=true&searchterm=${search_term}">Next<span class="arrow">&rarr;</span></a></li>
-						#elseif($advfilter)
+#elseif($advfilter)
 						<li id="previous" class="first"><a href="${context}/history?page=${previous.page}&size=${previous.size}&advfilter=true&projcontain=${projcontain}&flowcontain=${flowcontain}&usercontain=${usercontain}&status=${status}&begin=${begin}&end=${end}"><span class="arrow">&larr;</span>Previous</a></li>
 						<li id="page1" #if($page1.selected) class="selected" #end><a href="${context}/history?page=${page1.page}&size=${page1.size}&advfilter=true&projcontain=${projcontain}&flowcontain=${flowcontain}&usercontain=${usercontain}&status=${status}&begin=${begin}&end=${end}">${page1.page}</a></li>
 						<li id="page2" #if($page2.selected) class="selected" #end><a href="${context}/history?page=${page2.page}&size=${page2.size}&advfilter=true&projcontain=${projcontain}&flowcontain=${flowcontain}&usercontain=${usercontain}&status=${status}&begin=${begin}&end=${end}">${page2.page}</a></li>
@@ -127,7 +151,7 @@
 						<li id="page4" #if($page4.selected) class="selected" #end><a href="${context}/history?page=${page4.page}&size=${page4.size}&advfilter=true&projcontain=${projcontain}&flowcontain=${flowcontain}&usercontain=${usercontain}&status=${status}&begin=${begin}&end=${end}">${page4.page}</a></li>
 						<li id="page5" #if($page5.selected) class="selected" #end><a href="${context}/history?page=${page5.page}&size=${page5.size}&advfilter=true&projcontain=${projcontain}&flowcontain=${flowcontain}&usercontain=${usercontain}&status=${status}&begin=${begin}&end=${end}">${page5.page}</a></li>
 						<li id="next"><a href="${context}/history?page=${next.page}&size=${next.size}&advfilter=true&projcontain=${projcontain}&flowcontain=${flowcontain}&usercontain=${usercontain}&status=${status}&begin=${begin}&end=${end}">Next<span class="arrow">&rarr;</span></a></li>
-						#else
+#else
 						<li id="previous" class="first"><a href="${context}/history?page=${previous.page}&size=${previous.size}"><span class="arrow">&larr;</span>Previous</a></li>
 						<li id="page1" #if($page1.selected) class="selected" #end><a href="${context}/history?page=${page1.page}&size=${page1.size}">${page1.page}</a></li>
 						<li id="page2" #if($page2.selected) class="selected" #end><a href="${context}/history?page=${page2.page}&size=${page2.size}">${page2.page}</a></li>
@@ -135,67 +159,85 @@
 						<li id="page4" #if($page4.selected) class="selected" #end><a href="${context}/history?page=${page4.page}&size=${page4.size}">${page4.page}</a></li>
 						<li id="page5" #if($page5.selected) class="selected" #end><a href="${context}/history?page=${page5.page}&size=${page5.size}">${page5.page}</a></li>
 						<li id="next"><a href="${context}/history?page=${next.page}&size=${next.size}">Next<span class="arrow">&rarr;</span></a></li>
-						#end
-						
+#end
 					</ul>
+				</div><!-- /col-lg-12 -->
+			</div><!-- /row -->
+
+## Advanced Filter Modal.
+
+			<div class="modal fade" id="adv-filter">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Advanced Filter</h4>
+						</div>
+						<div class="modal-body">
+							<div class="alert alert-danger" id="adv-filter-error-msg">$error_msg</div>
+							<fieldset class="form-horizontal">
+								<div class="form-group">
+									<label for="projcontain" class="col-sm-2 control-label">Project</label>
+									<div class="col-sm-10">
+										<input id="projcontain" type="text" placeholder="Project name containing ..." value="" class="form-control" name="projcontain">
+									</div>
+								</div>
+								<div class="form-group">
+									<label for="flowcontain" class="col-sm-2 control-label">Flow</label>
+									<div class="col-sm-10">
+										<input id="flowcontain" type="text" placeholder="Flow name containing ..." value="" class="form-control" name="flowcontain">
+									</div>
+								</div>
+								<div class="form-group">
+									<label for="usercontain" class="col-sm-2 control-label">User</label>
+									<div class="col-sm-10">
+										<input id="usercontain" type="text" placeholder="User name containing ..." value="" class="form-control" name="usercontain">
+									</div>
+								</div>
+								<div class="form-group">
+									<label for="status" class="col-sm-2 control-label">Status</label>
+									<div class="col-sm-10">
+										<select id="status" class="form-control">
+											<option value=0>All Status</option>
+											<option value=10>Ready</option>
+											<option value=20>Preapring</option>
+											<option value=30>Running</option>
+											<option value=40>Paused</option>
+											<option value=50>Succeed</option>
+											<option value=60>Killed</option>
+											<option value=70>Failed</option>
+											<option value=80>Failed Finishing</option>
+											<option value=90>Skipped</option>
+											<option value=100>Disabled</option>
+											<option value=110>Queued</option>
+										</select>
+									</div>
+								</div>
+								<div class="form-group">
+									<label for="datetimebegin" class="col-sm-2 control-label">Date between</label>
+									<div class="col-sm-10">
+										<input type="text" id="datetimebegin" value="" class="ui-datetime-container form-control"> 
+									</div>
+								</div>
+								<div class="form-group">
+									<label for="datetimeend" class="col-sm-2 control-label">and</label>
+									<div class="col-sm-10">
+										<input type="text" id="datetimeend" value="" class="ui-datetime-container form-control"> 
+									</div>
+								</div>
+							</fieldset>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button class="btn btn-success" id="filter-btn">Filter</button>
+						</div>
+					</div>
 				</div>
 			</div>
-		</div>
-		
-		<!-- modal content -->
-		<div id="adv-filter" class="modal">
-			<h3>Advanced Filter</h3>
-			<div id="errorMsg" class="box-error-message">$errorMsg</div>
 			
-			<div class="message">
-				<fieldset>
-					<dl>
-						<dt><label for="path" >Project Name</label></dt>
-						<dd><input id="projcontain" type="text" placeholder="project name containing ..." value = ""  class="filter-input" name="projcontain"/></dd>
-						<dt><label for="path">Flow Name</label></dt>
-						<dd><input id="flowcontain" type="text" placeholder="flow name containing ..." value = ""  class="filter-input" name="flowcontain"/></dd>
-						<dt><label for="path">User Name</label></dt>
-						<dd><input id="usercontain" type="text" placeholder="user name containing ..." value = ""  class="filter-input" name="usercontain"/></dd>
-						<dt><label for="path">Status</label></dt>
-						<!--dd><input id="status" type="text" placeholder="Flow status is ..." value = ""  class="filter-input" name="status"/></dd-->
-						<dd>
-							<select id="status">
-								<option value=0>All Status</option>
-								<option value=10>Ready</option>
-								<option value=20>Preapring</option>
-								<option value=30>Running</option>
-								<option value=40>Paused</option>
-								<option value=50>Succeed</option>
-								<option value=60>Killed</option>
-								<option value=70>Failed</option>
-								<option value=80>Failed Finishing</option>
-								<option value=90>Skipped</option>
-								<option value=100>Disabled</option>
-								<option value=110>Queued</option>
-							</select>
-						</dd>
-						<dt>Date between</dt>
-						<dd><div class="ui-datetime-container"> 
-					 		<input type="text" name="basic_example_1" id="datetimebegin" value="" /> 
-						</div></dd>	
-						<!--dd><input type="text" class="ui-datetime-container" id="datetimebegin" value=""/></dd-->
-						<dt>and</dt>
-						<dd><input type="text" class="ui-datetime-container" id="datetimeend" value=""/></dd>
-					</dl>
-				</fieldset>
-			</div>
-			<div class="actions">
-				<a class="yes btn2" id="filter-btn" href="#">Filter</a>
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
-			</div>
-			<div id="invalid-session" class="modal">
-				<h3>Invalid Session</h3>
-				<p>Session has expired. Please re-login.</p>
-				<div class="actions">
-					<a class="yes btn2" id="login-btn" href="#">Re-login</a>
-				</div>
-			</div>
-		</div>
-		
+#parse ("azkaban/webapp/servlet/velocity/invalidsessionmodal.vm")
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
+		</div><!-- /container -->
 	</body>
-</html>
+<html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/index.vm b/src/java/azkaban/webapp/servlet/velocity/index.vm
index bf83de8..b332247 100644
--- a/src/java/azkaban/webapp/servlet/velocity/index.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/index.vm
@@ -15,14 +15,12 @@
 *#
 
 <!DOCTYPE html> 
-<html>
+<html lang="en">
 	<head>
-#parse("azkaban/webapp/servlet/velocity/style.vm")
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+
 		<script type="text/javascript" src="${context}/js/azkaban.table.sort.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.main.view.js"></script>
@@ -35,111 +33,152 @@
 		</script>
 	</head>
 	<body>
+
 #set($current_page="all")
-#parse("azkaban/webapp/servlet/velocity/nav.vm")
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
-
-		<div class="content">
-			#if($error_message != "null")
-				<div class="box-error-message">$error_message</div>
-			#elseif($success_message != "null")
-				<div class="box-success-message">$success_message</div>
-			#end
-			<div id="all-jobs-content">
-				<div class="section-hd">
+#parse("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+## Page error or success message.
+
+#if($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+#elseif($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+#end
+
+## Alert message
+## TODO: See if this can be removed.
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
+			</div>
+
+## Page Header and project search form.
+
+			<div class="page-header">
 #if ($allProjects)
-					<h2>All Projects</h2>
-					<div class="section-sub-hd">
-						<h4><a href="${context}/index">My Projects</a></h4>
-					</div>
+				<h1>All Projects</h1>
+				<p>My Projects</p>
 #else
-					<h2>My Projects</h2>
-					<div class="section-sub-hd">
-						<h4><a href="${context}/index?all">All Projects</a></h4>
-					</div>
+				<h1>My Projects</h1>
+				<p>All Projects</p>
 #end
-					<form id="search-form" method="get">
-						<input type="hidden" name="doaction" value="search">
-						<input type="submit" value="Quick Search" class="search-btn">
-#if ($allProjects)
-						<input type="hidden" name="all" value="true">			
-#end			
-						<input id="searchtextbox" type="text" placeholder="project name containing ..." value=#if($search_term) ${search_term} #else "" #end class="search-input" name="searchterm">
-					</form>
+			</div>
 
+## Table of projects.
+
+			<div class="row">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">
+							<form id="search-form" method="get" class="form-inline" role="form">
+								<fieldset>
+									<input type="hidden" name="doaction" value="search">
+#if ($allProjects)
+									<input type="hidden" name="all" value="true">				
+#end
+									<div class="form-group col-md-10">
+										<div class="input-group">
+											<input id="search-textbox" type="text" placeholder="Project name containing..." value=#if($search_term) ${search_term} #else "" #end class="form-control" name="searchterm">
+											<span class="input-group-btn">
+												<button class="btn btn-primary">Quick Search</button>
+											</span>
+										</div>
+									</div>
 #if (!$hideCreateProject)
-					<a id="create-project-btn" class="btn1 " href="#">Create Project</a>
+									<div class="form-group col-md-2" id="create-project">
+										<button type="button" id="create-project-btn" class="btn btn-success"><span class="glyphicon glyphicon-plus"></span> Create Project</button>
+									</div>
 #end
-				</div><!-- end .section-hd -->
-			</div>
-			<table id="all-jobs" class="all-jobs job-table project-table">
-				<thead>
-					<tr>
-						<th class="tb-name">Name</th>
-						<th class="tb-up-date">Modified Date</th>
-						<th class="tb-owner">Modified By</th>
-					</tr>
-				</thead>
-				<tbody>
+								</fieldset>
+							</form>
+						</div>
+						<table class="table table-striped table-bordered table-hover" id="all-jobs">
+							<thead>
+								<tr>
+									<th class="tb-name">Name</th>
+									<th class="tb-up-date">Modified Date</th>
+									<th class="tb-owner">Modified By</th>
+								</tr>
+							</thead>
+							<tbody>
 #if(!$projects.isEmpty())
 	#foreach($project in $projects)
-					<tr class="row">
-						<td class="tb-name expand project-expand" id="${project.name}">
-							<span class="state-icon"></span>
-							<a href="${context}/manager?project=${project.name}">$project.name</a>
-						</td>
-						<td class="tb-up-date">$utils.formatDate($project.lastModifiedTimestamp)</td>
-						<td class="tb-owner">$project.lastModifiedUser</td>
-					</tr>
-					<tr class="childrow" id="${project.name}-child" style="display: none;">
-						<td class="expandedFlow" colspan="3">
-							<table class="innerTable">
-								<thead>
-									<tr><th class="tb-name">Flows</th></tr>
-								</thead>
-								<tbody id="${project.name}-tbody">
-								</tbody>
-							</table>
-						</td>
-					</tr>
+								<tr>
+									<td id="${project.name}" class="tb-name project-expand expanded">
+										<span class="glyphicon glyphicon-plus"></span>
+										<a href="${context}/manager?project=${project.name}">$project.name</a>
+									</td>
+									<td class="tb-up-date">$utils.formatDate($project.lastModifiedTimestamp)</td>
+									<td class="tb-owner">$project.lastModifiedUser</td>
+								</tr>
+								<tr class="childrow collapse" id="${project.name}-child">
+									<td colspan="3">
+										<table class="table table-bordered">
+											<thead>
+												<tr>
+													<th class="tb-name">Flows</th>
+												</tr>
+											</thead>
+											<tbody id="${project.name}-tbody">
+											</tbody>
+										</table>
+									</td>
+								</tr>
 	#end
 #else
-					<tr><td class="last">No viewable projects found.</td></tr>
+								<tr>
+									<td colspan="3">No viewable projects found.</td>
+								</tr>
 #end
-				</tbody>
-			</table>
-		</div>
-
-		<!-- modal content -->
-		<div id="create-project" class="modal">
-			<h3>Create Project</h3>
-			<div id="errorMsg" class="box-error-message">$errorMsg</div>
-			
-			<div class="message">
-				<fieldset>
-					<dl>
-						<dt><label for="path">Project Name</label></dt>
-						<dd><input id="path" name="project" type="text" size="20" title="The project name."/></dd>
-						<dt>Description</dt>
-						<dd><textarea id="description" name="description" rows="2" cols="40"></textarea></dd>
-					
-						<input name="action" type="hidden" value="create" />
-						<input name="redirect" type="hidden" value="$!context/" />
-					</dl>
-				</fieldset>
-			</div>
-			<div class="actions">
-				<a class="yes btn2" id="create-btn" href="#">Create Project</a>
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
+							</tbody>
+						</table>
+					</div>
+				</div>
 			</div>
-			<div id="invalid-session" class="modal">
-				<h3>Invalid Session</h3>
-				<p>Session has expired. Please re-login.</p>
-				<div class="actions">
-					<a class="yes btn2" id="login-btn" href="#">Re-login</a>
+
+## Modal dialog to be displayed to create a new project.
+
+			<div class="modal fade" id="create-project-modal">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Create Project</h4>
+						</div>
+						<div class="modal-body">
+							<div class="alert alert-danger" id="modal-error-msg">$error_msg</div>
+							<fieldset class="form-horizontal">
+								<div class="form-group">
+									<label for="path" class="col-sm-2 control-label">Name</label>
+									<div class="col-sm-10">
+										<input id="path" name="project" type="text" class="form-control" placeholder="Project name">
+									</div>
+								</div>
+								<div class="form-group">
+									<label for="description" class="col-sm-2 control-label">Description</label>
+									<div class="col-sm-10">
+										<textarea id="description" name="description" rows="2" cols="40" class="form-control" placeholder="Project description"></textarea>
+									</div>
+								</div>
+							</fieldset>
+						</div>
+						<div class="modal-footer">
+							<input name="action" type="hidden" value="create">
+							<input name="redirect" type="hidden" value="$!context/">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="create-btn">Create Project</button>
+						</div>
+					</div>
 				</div>
 			</div>
-		</div>
+
+#parse ("azkaban/webapp/servlet/velocity/invalidsessionmodal.vm")
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
+		</div><!-- /container -->
 	</body>
 </html>
 

diff --git a/src/java/azkaban/webapp/servlet/velocity/invalidsessionmodal.vm b/src/java/azkaban/webapp/servlet/velocity/invalidsessionmodal.vm
new file mode 100644
index 0000000..f0875e4
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/invalidsessionmodal.vm
@@ -0,0 +1,34 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+	## Modal dialog to be displayed when the user sesion is invalid.
+			
+			<div class="modal fade" id="invalid-session-modal">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Invalid Session</h4>
+						</div>
+						<div class="modal-body">
+							<p>Session has expired. Please re-login.</p>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-primary" id="login-btn">Re-login</button>
+						</div>
+					</div>
+				</div>
+			</div>

diff --git a/src/java/azkaban/webapp/servlet/velocity/javascript.vm b/src/java/azkaban/webapp/servlet/velocity/javascript.vm
new file mode 100644
index 0000000..40b35fd
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/javascript.vm
@@ -0,0 +1,22 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
+		<script type="text/javascript" src="${context}/js/bootstrap.min.js"></script>    
+		<script type="text/javascript" src="${context}/js/bootstrap-fileinput.js"></script>    
+		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
+		<script type="text/javascript" src="${context}/js/namespace.js"></script>
+		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>

diff --git a/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm b/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm
index df18893..f6abad7 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobdetailspage.vm
@@ -16,13 +16,11 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+	<head lang="en">
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+
 		<script type="text/javascript" src="${context}/js/azkaban.ajax.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.jobdetails.view.js"></script>
@@ -41,97 +39,126 @@
 		</script>
 	</head>
 	<body>
-#set($current_page="executing")
-#parse("azkaban/webapp/servlet/velocity/nav.vm")
-		<div class="content">
-#if($errorMsg)
-				<div class="box-error-message">$errorMsg</div>
-#else
-	#if($error_message != "null")
-				<div class="box-error-message">$error_message</div>
-	#elseif($success_message != "null")
-				<div class="box-success-message">$success_message</div>
-	#end
-		
-			<div id="all-jobs-content">
-				<div class="section-hd flow-header">
-					<h2><a href="${context}/executor?execid=${execid}&job=${jobid}">Job Execution<span>$jobid</span></a></h2>
-					<div class="section-sub-hd">
-						<h4><a href="${context}/manager?project=${projectName}">Project <span>$projectName</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${projectName}&flow=${flowid}">Flow <span>$flowid</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/executor?execid=${execid}#jobslist">Execution <span>$execid</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${projectName}&flow=${flowid}&job=$jobid">Job <span>$jobid</span></a></h4>
-					</div>
+
+#set ($current_page="executing")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
 			</div>
-			
-			<div id="headertabs" class="headertabs">
-				<ul>
-					<li><a id="jobSummaryViewLink" href="#jobsummary">Summary</a></li>
-					<li class="lidividier">|</li>
-					<li><a id="jobLogViewLink" href="#joblog">Log</a></li>
-					<li class="lidividier">|</li>
-					<li><a href="${context}/pigvisualizer?execid=${execid}&jobid=${jobid}">Visualization</a></li>
-				</ul>
+#else
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+	
+	## Page header.
+
+			<div class="page-header">
+				<h1><a href="${context}/executor?execid=${execid}&job=${jobid}">Job Execution <small>$jobid</small></a></h1>
 			</div>
+	
+	## Breadcrumb
+
+			<ol class="breadcrumb">
+				<li><a href="${context}/manager?project=${projectName}"><strong>Project</strong> $projectName</a></li>
+				<li><a href="${context}/manager?project=${projectName}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+				<li><a href="${context}/executor?execid=${execid}#jobslist"><strong>Execution</strong> $execid</a></li>
+				<li><a href="${context}/manager?project=${projectName}&flow=${flowid}&job=$jobid"><strong>Job</strong> $jobid</a></li>
+			</ol>
 
-	## Job log view.
+	## Tabs
+					
+			<ul class="nav nav-tabs" id="headertabs">
+				<li id="jobSummaryViewLink"><a href="#jobsummary">Summary</a></li>
+				<li id="jobLogViewLink"><a href="#joblog">Log</a></li>
+				<li><a href="${context}/pigvisualizer?execid=${execid}&jobid=${jobid}">Visualization</a></li>
+			</ul>
+			
+	## Log content.
 
-			<div id="jobLogView" class="logView">
-				<div class="logHeader"><div class="logButtonRow"><div id="updateLogBtn" class="btn7">Refresh</div></div></div>
-				<div class="logViewer">
-					<pre id="logSection" class="log"></pre>
+			<div class="row" id="jobLogView">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">
+							<div class="pull-right">
+								<button type="button" id="updateLogBtn" class="btn btn-xs btn-default">Refresh</button>
+							</div>
+							Job Logs
+						</div>
+						<div class="panel-body">
+							<pre id="logSection" class="log"></pre>
+						</div>
+					</div>
 				</div>
 			</div>
 
-	## Job summary view
-
-			<div id="jobSummaryView" class="summaryView">
-				<table id="commandTable">
-				</table>
-				
-				<br/>
-				<div id="jobsummary">Job Summary
-					<table>
-						<thead id="summaryHeader">
-						</thead>
-						<tbody id="summaryBody">
-						</tbody>
+	## Job Summary
+			<div id="jobSummaryView" class="row">
+				<div class="col-lg-12">
+					<table id="commandTable" class="table table-striped table-bordered table-hover">
 					</table>
-				</div>
 				
-				<br/>
-				<div id="jobstats">Job Stats
-					<table>
-						<thead id="statsHeader">
-						</thead>
-						<tbody id="statsBody">
-						</tbody>
-					</table>
-				</div>
+					<div class="panel panel-default" id="jobsummary">
+						<div class="panel-heading">Job Summary</div>
+						<table class="table table-striped table-bordered table-hover">
+							<thead id="summaryHeader">
+							</thead>
+							<tbody id="summaryBody">
+							</tbody>
+						</table>
+					</div>
 				
-				<br/>
-				<div id="hiveTable">Job Summary
-					<table>
-						<thead id="hiveTableHeader">
-						</thead>
-						<tbody id="hiveTableBody">
-						</tbody>
-					</table>
+					<div class="panel panel-default" id="jobstats">
+						<div class="panel-heading">Job Stats</div>
+						<table class="table table-striped table-bordered table-hover table-condensed">
+							<thead id="statsHeader">
+							</thead>
+							<tbody id="statsBody">
+							</tbody>
+						</table>
+					</div>
+					
+					<div class="panel panel-default" id="hiveTable">
+						<div class="panel-heading">Job Summary</div>
+						<table class="table table-striped table-bordered table-hover">
+							<thead id="hiveTableHeader">
+							</thead>
+							<tbody id="hiveTableBody">
+							</tbody>
+						</table>
+					</div>
 				</div>
 			</div>
+			
+	## Error message message dialog.
 
-#end
-
-			<div id="messageDialog" class="modal">
-				<h3 id="messageTitle">Error</h3>
-				<div class="messageDiv">
-					<p id="messageBox"></p>
+			<div class="modal fade" id="messageDialog">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header" id="messageTitle">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Error</h4>
+						</div>
+						<div class="modal-body" id="messageDiv">
+							<p id="messageBox"></p>
+						</div>
+					</div>
 				</div>
 			</div>
+
+#end
+
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
 		</div>
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm b/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
index 05d4240..ffb9f8a 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobhistorypage.vm
@@ -16,13 +16,11 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+	<head lang="en">
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
+
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/d3.v3.min.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.date.utils.js"></script>
@@ -59,91 +57,132 @@
 		</style>
 	</head>
 	<body>
-#set($current_page="all")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
 
-#if($errorMsg)
-			<div class="box-error-message">$errorMsg</div>
+#set ($current_page="all")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
+				</div>
+			</div>
 #else
-	<div class="content">
-	#if($error_message != "null")
-			<div class="box-error-message">$error_message</div>
-	#elseif($success_message != "null")
-			<div class="box-success-message">$success_message</div>
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
 	#end
-			<div id="all-jobs-content">
-				<div class="section-hd">
-					<h2><a href="${context}/manager?project=${projectName}&job=${jobid}&history">Job History <span>$jobid</span></a></h2>
-					<div class="section-sub-hd">
-						<h4><a href="${context}/manager?project=${projectName}">Project <span>$projectName</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${projectName}&job=${jobid}&history">Job History <span>$jobid</span></a></h4>
-					</div>
-				</div>
+
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
 			</div>
-			
-			<div id="timeGraph">
+	
+	## Page header
+
+			<div class="page-header">
+				<h1>
+					<a href="${context}/manager?project=${project.name}">$project.name</a> / 
+					<a href="${context}/manager?project=${project.name}&flow=${flowid}">$flowid</a>
+				</h1>
 			</div>
+
+			<div class="row">
+				<div class="col-lg-8">
+	
+	## Breadcrumb
+
+					<ol class="breadcrumb">
+						<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}"><strong>Job</strong> $jobid</a></li>
+					</ol>
 			
-			<div class="executionInfo">
-				<table id="all-jobs" class="all-jobs job-table">
-					<thead>
-						<tr>
-							<th class="execid">Execution Id</th>
-							<th class="jobid">Job</th>
-							<th class="flowid">Flow</th>
-							<th class="date">Start Time</th>
-							<th class="date">End Time</th>
-							<th class="elapse">Elapse</th>		
-							<th class="status">Status</th>
-							<th class="logs">Logs</th>
-						</tr>
-					</thead>
-					<tbody>
-	#foreach($job in $history)
-						<tr>
-							<td class="first">
-								#if ($job.attempt > 0)
-								<a href="${context}/executor?execid=${job.execId}">${job.execId}.${job.attempt}</a>
-								#else
-								<a href="${context}/executor?execid=${job.execId}">${job.execId}</a>
-								#end
-							</td>
-							<td>
-								<a href="${context}/manager?project=${projectName}&flow=${job.flowId}&job=${jobid}">${jobid}</a>
-							</td>
-							<td>
-								<a href="${context}/manager?project=${projectName}&flow=${job.flowId}">${job.flowId}</a>
-							</td>
-							<td>$utils.formatDate(${job.startTime})</td>
-							<td>$utils.formatDate(${job.endTime})</td>
-							<td>$utils.formatDuration(${job.startTime}, ${job.endTime})</td>
-							<td><div class="status ${job.status}">$utils.formatStatus(${job.status})</div></td>
-							<td class="logLink">
-								<a href="${context}/executor?execid=${job.execId}&job=${jobid}&attempt=${job.attempt}">Logs</a>
-							</td>
-						</tr>
-	#end
-					</tbody>
-				</table>
+	#set ($job_page="history")
+	#parse ("azkaban/webapp/servlet/velocity/jobnav.vm")
 				
-				<div id="pageSelection" class="nonjavascript">
-					<ul>
+					<div class="panel panel-default">
+						<div class="panel-heading">Job History</div>
+						<div class="panel-body">
+							<div id="timeGraph"></div>
+						</div>
+
+						<table id="all-jobs" class="table table-striped table-bordered">
+							<thead>
+								<tr>
+									<th class="execid">Execution Id</th>
+									<th class="jobid">Job</th>
+									<th class="flowid">Flow</th>
+									<th class="date">Start Time</th>
+									<th class="date">End Time</th>
+									<th class="elapse">Elapse</th>		
+									<th class="status">Status</th>
+									<th class="logs">Logs</th>
+								</tr>
+							</thead>
+							<tbody>
+	#if ($history)
+		#foreach ($job in $history)
+								<tr>
+									<td class="first">
+			#if ($job.attempt > 0)
+										<a href="${context}/executor?execid=${job.execId}">${job.execId}.${job.attempt}</a>
+			#else
+										<a href="${context}/executor?execid=${job.execId}">${job.execId}</a>
+			#end
+									</td>
+									<td>
+										<a href="${context}/manager?project=${projectName}&flow=${job.flowId}&job=${jobid}">${jobid}</a>
+									</td>
+									<td>
+										<a href="${context}/manager?project=${projectName}&flow=${job.flowId}">${job.flowId}</a>
+									</td>
+									<td>$utils.formatDate(${job.startTime})</td>
+									<td>$utils.formatDate(${job.endTime})</td>
+									<td>$utils.formatDuration(${job.startTime}, ${job.endTime})</td>
+									<td>
+										<div class="status ${job.status}">
+											$utils.formatStatus(${job.status})
+										</div>
+									</td>
+									<td class="logLink">
+										<a href="${context}/executor?execid=${job.execId}&job=${jobid}&attempt=${job.attempt}">Logs</a>
+									</td>
+								</tr>
+		#end
+	#else
+								<tr>
+									<td colspan="8">No history</td>
+								</tr>
+	#end
+							</tbody>
+						</table>
+					</div>
+
+					<ul class="pagination" id="pageSelection">
 						<li id="previous" class="first"><a href="${context}/manager?project=${projectId}&job=${jobid}&history&page=${previous.page}&size=${previous.size}"><span class="arrow">&larr;</span>Previous</a></li>
-				
 						<li id="page1" #if($page1.selected) class="selected" #elseif ($page1.disabled) class="disabled" #end><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${page1.nextPage}&size=${page1.size}">${page1.page}</a></li>
 						<li id="page2" #if($page2.selected) class="selected" #elseif ($page2.disabled) class="disabled" #end><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${page2.nextPage}&size=${page2.size}">${page2.page}</a></li>
 						<li id="page3" #if($page3.selected) class="selected" #elseif ($page3.disabled) class="disabled" #end><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${page3.nextPage}&size=${page3.size}">${page3.page}</a></li>
 						<li id="page4" #if($page4.selected) class="selected" #elseif ($page4.disabled) class="disabled" #end><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${page4.nextPage}&size=${page4.size}">${page4.page}</a></li>
 						<li id="page5" #if($page5.selected) class="selected" #elseif ($page5.disabled) class="disabled" #end><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${page5.nextPage}&size=${page5.size}">${page5.page}</a></li>
-	
 						<li id="next"><a href="${context}/manager?project=${projectName}&job=${jobid}&history&page=${next.page}&size=${next.size}">Next<span class="arrow">&rarr;</span></a></li>
 					</ul>
-				</div>
-			</div>
-	</div>
+
+				</div><!-- /col-lg-8 -->
+				<div class="col-lg-4">
+	#parse ("azkaban/webapp/servlet/velocity/jobsidebar.vm")
+				</div><!-- /col-lg-4 -->
+			</div><!-- /row -->
 
 #end
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+		</div>
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/jobnav.vm b/src/java/azkaban/webapp/servlet/velocity/jobnav.vm
new file mode 100644
index 0000000..70f974e
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/jobnav.vm
@@ -0,0 +1,20 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+	
+					<ul class="nav nav-tabs">
+						<li#if($job_page == 'properties') class="active"#end><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job</a></li>
+						<li#if($job_page == 'history') class="active"#end><a id="jobs-logs-btn" href="${context}/manager?project=${project.name}&job=$jobid&history">History</a></li>
+					</ul>

diff --git a/src/java/azkaban/webapp/servlet/velocity/jobpage.vm b/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
index 8c19a53..95a2368 100644
--- a/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/jobpage.vm
@@ -17,17 +17,14 @@
 <!DOCTYPE html> 
 <html>
 	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
 
+#parse ("azkaban/webapp/servlet/velocity/style2.vm")
+#parse ("azkaban/webapp/servlet/velocity/javascript.vm")
+
+		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
+		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.jobedit.view.js"></script>
-		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
 		<script type="text/javascript">
 			var contextURL = "${context}";
 			var currentTime = ${currentTime};
@@ -40,136 +37,136 @@
 		</script>
 	</head>
 	<body>
-#set($current_page="all")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
+		
+#set ($current_page="all")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
 
-#if($errorMsg)
-		<div class="box-error-message">$errorMsg</div>
-#else
-	<div class="content">
-	#if($error_message != "null")
-			<div class="box-error-message">$error_message</div>
-	#elseif($success_message != "null")
-			<div class="box-success-message">$success_message</div>
-	#end
-			<div id="all-jobs-content">
-				<div class="section-hd">
-					<h2><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job <span>$jobid</span></a></h2>
-					<div class="section-sub-hd">
-						<h4><a href="${context}/manager?project=${project.name}">Project <span>$project.name</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${project.name}&flow=${flowid}">Flow <span>$flowid</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job <span>$jobid</span></a></h4>
-					</div>
-					
-					<a id="jobs-logs-btn" class="btn2" href="${context}/manager?project=${project.name}&job=$jobid&history">Job History</a>
-					<a id="edit-job-btn" class="btn1" onclick='jobEditView.show("${project.name}", "${flowid}", "${jobid}")'>Job Edit</a>
+		<div class="container">
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
 			</div>
-			
-			<div id="job-summary">
-				<table class="summary-table">
-					<tr><td class="first">Type:</td><td>$jobtype</td></tr>
-					<tr><td class="first">Dependencies:</td><td>
-#if ($dependencies) 
-#foreach($dependency in $dependencies)
-	<a href="${context}/manager?project=${project.name}&flow=${flowid}&job=$dependency">$dependency</a>
-#end
-#else
-	<span>No Dependencies</span>
-#end
-					</td></tr>
-					<tr><td class="first">Dependents:</td><td>
-#if ($dependents) 
-#foreach($dependent in $dependents)
-						<span class="nowrap"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=$dependent">$dependent</a></span>
-#end
 #else
-						<span>No Dependencies</span>
-#end
-					</td></tr>
-					<tr><td class="first">Properties:</td><td>
-#if ($properties) 
-#foreach($property in $properties)
-						<!--a>$property</a><span>,</span-->
-						<span class="nowrap"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$property">$property</a></span>
-#end
-#else
-						<span>No Property Files For This Job</span>
-#end
-					</td></tr>
-				</table>
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
 			</div>
-			
-			<table id="all-jobs" class="all-jobs job-table parameters">
-				<thead>
-					<tr>
-						<th class="tb-pname">Parameter Name</th>
-						<th class="tb-pvalue">Value</th>
-					</tr>
-				</thead>
-				<tbody>
-#foreach($parameter in $parameters)
-					<tr>
-						<td class="first">$parameter.first</td><td>$parameter.second</td>
-					</tr>
-#end
-				</tbody>
-			</table>
-	</div>
 
-#end
+	## Page header
 
-		<!-- modal content -->
-
-		<div id="jobEditModalBackground" class="modalBackground2">
-			<div id="job-edit-pane" class="modal modalContainer2">
-				<a href='#' title='Close' class='modal-close'>x</a>
-					<h3>Job Description Edit</h3>					
-					<div class="optionsPane">
-						<div id="generalPanel" class="generalPanel panel">
-							<div id="mustHave">
-								<h4>Job Essentials</h4>
-								<dl>
-									<dt>Job Name</dt>
-									<dd>
-										<label id="jobName"></label>
-									</dd>
-									<dt>Job Type</dt>
-									<dd>
-										<label id="jobType"></label>
-									</dd>
-								</dl>
-							</div>
-							<br></br>
-							<!--div id="jobTypeSpecific">
-								<h4>Job Type Specific parameters</h4>
-							</div-->
-							<div id="generalJobSetting">
-								<h4>General Job Settings (Be Aware: A Job May Be Shared By Multiple Flows. The Change Will Be Global!)</h4>
-								<div class="tableDiv">
-									<table id="generalProps">
-										<thead>
-											<tr>
-												<th>Name</th>
-												<th>Value</th>
-											</tr>
-										</thead>
-										<tbody>
-											<tr id="addRow"><td id="addRow-col" colspan="2"><span class="addIcon"></span><a href="#">Add Row</a></td></tr>
-										</tbody>
-									</table>
-								</div>
+			<div class="page-header">
+				<h1>
+					<a href="${context}/manager?project=${project.name}">$project.name</a> / 
+					<a href="${context}/manager?project=${project.name}&flow=${flowid}">$flowid</a>
+				</h1>
+			</div>
+
+			<div class="row">
+				<div class="col-lg-8">
+
+	## Breadcrumb
+
+					<ol class="breadcrumb">
+						<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}"><strong>Job</strong> $jobid</a></li>
+					</ol>
+				
+	#set ($job_page="properties")
+	#parse ("azkaban/webapp/servlet/velocity/jobnav.vm")
+
+	## Job details table
+
+					<div class="panel panel-default">
+						<div class="panel-heading">
+							<div class="pull-right">
+								<button id="edit-job-btn" class="btn btn-xs btn-primary" onclick='jobEditView.show("${project.name}", "${flowid}", "${jobid}")'>Edit</button>
 							</div>
+							Job Properties
 						</div>
+
+						<table id="all-jobs" class="table table-striped table-bordered">
+							<thead>
+								<tr>
+									<th class="tb-pname">Parameter Name</th>
+									<th class="tb-pvalue">Value</th>
+								</tr>
+							</thead>
+							<tbody>
+	#foreach ($parameter in $parameters)
+								<tr>
+									<td class="first">$parameter.first</td><td>$parameter.second</td>
+								</tr>
+	#end
+							</tbody>
+						</table>
 					</div>
-					<div class="actions">
-						<a class="yes btn1" id="set-btn" >Set/Change Job Description</a>
-						<a class="no simplemodal-close btn3" id="cancel-btn" >Cancel</a>
+				</div><!-- /col-lg-8 -->
+				<div class="col-lg-4">
+	#parse ("azkaban/webapp/servlet/velocity/jobsidebar.vm")
+				</div><!-- /col-lg-4 -->
+			</div><!-- /row -->
+
+## Edit job modal.
+
+			<div class="modal fade" id="job-edit-pane">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Edit Job</h4>
+						</div>
+						<div class="modal-body">
+							<h4>Job Essentials</h4>
+							<dl>
+								<dt>Job Name</dt>
+								<dd id="jobName"></dd>
+								<dt>Job Type</dt>
+								<dd id="jobType"></dd>
+							</dl>
+							<h4>General Job Settings</h4>
+							<p><strong>Be Aware:</strong> A job may be shared by multiple flows. The change will be global!</p>
+							<table id="generalProps" class="table table-striped table-bordered">
+								<thead>
+									<tr>
+										<th>Name</th>
+										<th>Value</th>
+									</tr>
+								</thead>
+								<tbody>
+									<tr id="addRow">
+										<td id="addRow-col" colspan="2">
+											<button type="button" class="btn btn-xs btn-success">Add Row</button>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="set-btn">Set/Change Job Description</button>
+						</div>
 					</div>
+				</div>
 			</div>
-		</div>
+
+#end
+
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+		</div><!-- /container -->
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/jobsidebar.vm b/src/java/azkaban/webapp/servlet/velocity/jobsidebar.vm
new file mode 100644
index 0000000..b293ea5
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/jobsidebar.vm
@@ -0,0 +1,70 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+					<div class="well" id="job-summary">
+						<h3>Job <small>$jobid</small></h3>
+						<p><strong>Job Type</strong> $jobtype</p>
+					</div>
+
+	## Dependencies
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Dependencies</div>
+						<ul class="list-group">
+	#if ($dependencies) 
+		#foreach($dependency in $dependencies)
+							<li class="list-group-item">
+								<a href="${context}/manager?project=${project.name}&flow=${flowid}&job=$dependency">$dependency</a>
+							</li>
+		#end
+	#else
+							<li class="list-group-item">No Dependencies</li>
+	#end
+						</ul>
+					</div><!-- /panel -->
+
+	## Dependents
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Dependents</div>
+						<ul class="list-group">
+	#if ($dependents) 
+		#foreach($dependent in $dependents)
+							<li class="list-group-item">
+								<a href="${context}/manager?project=${project.name}&flow=${flowid}&job=$dependent">$dependent</a>
+							</li>
+		#end
+	#else
+							<li class="list-group-item">No Dependencies</li>
+	#end
+
+						</ul>
+					</div><!-- /panel -->
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Properties</div>
+						<ul class="list-group">
+	#if ($properties) 
+		#foreach($property in $properties)
+							<li class="list-group-item">
+								<a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$property">$property</a>
+							</li>
+		#end
+	#else
+							<li class="list-group-item">No Property Files For This Job</li>
+	#end
+						</ul>
+					</div><!-- /panel -->

diff --git a/src/java/azkaban/webapp/servlet/velocity/login.vm b/src/java/azkaban/webapp/servlet/velocity/login.vm
index ec2b572..4064be3 100644
--- a/src/java/azkaban/webapp/servlet/velocity/login.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/login.vm
@@ -13,51 +13,64 @@
  * License for the specific language governing permissions and limitations under
  * the License.
 *#
-<!DOCTYPE html> 
-<html>
+
+<!DOCTYPE html>
+<html lang="en">
   <head>
-    <head>
-    <title>#appname()</title>
-    <link rel="stylesheet" type="text/css" href="${context}/css/azkaban.css">    
-    <link rel="shortcut icon" href="${context}/favicon.ico" />
-	<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-	<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-	<script type="text/javascript" src="${context}/js/namespace.js"></script>
-	<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-	<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse("azkaban/webapp/servlet/velocity/javascript.vm")
 
     <script type="text/javascript" src="${context}/js/azkaban.login.js"></script>
-    #parse( "azkaban/webapp/servlet/velocity/style.vm" )
-	<script type="text/javascript">
-		var contextURL = "${context}";
-	</script>
+		<script type="text/javascript">
+			var contextURL = "${context}";
+		</script>
   </head>
   <body>
-    <div class="header">
-    #parse("azkaban/webapp/servlet/velocity/title.vm" )
-    </div>
-    
-    <div id="login" class="shadow-box">
-    	<div class="shadow-box-header">
-    		<div class="box-title">Login</div>
- 		</div>
-    	<br>
-    	<div id="errorMsg" class="box-error-message">$errorMsg</div>
-    	<div id="loginForm" class="login-form">
-    	    <div id="login-password">
-		    	<p class="login-label">Username</p>
-		    	<input id="username" type="text" name="username" class="login-textbox" ></input>
-	
-				<br/>
-		    	<p class="login-label">Password</p>
-		    	<input id="password" type="password" name="password" class="login-textbox"></input>
+    <div class="navbar navbar-inverse navbar-static-top">
+      <div class="container">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+#parse("azkaban/webapp/servlet/velocity/title2.vm")
+        </div>
+        <div class="navbar-collapse collapse">
+				</div>
 			</div>
+		</div>
+
+		<div class="container">
+			<div class="row">
+				<div class="col-lg-4">
+				</div>
+				<div class="col-lg-4">
+					<div class="alert alert-danger" id="error-msg"></div>
+					<div class="well">
+						<form role="form" id="login-form">
+							<fieldset>
+								<legend>Login</legend>
+								<div class="form-group">
+									<input type="text" class="form-control" name="username" id="username" placeholder="username">
+								</div>
+								<div class="form-group">
+									<input type="password" class="form-control" name="password" id="password" placeholder="password">
+								</div>
+								<div class="form-group">
+									<button type="button" class="btn btn-primary btn-lg btn-block" id="login-submit">Login</button>
+								</div>
+							</fieldset>
+						</form>
+					</div><!-- /well -->
+				</div>
+				<div class="col-lg-4"></div>
+			</div><!-- /row -->
+  
+#parse("azkaban/webapp/servlet/velocity/footer.vm")
 
-	    	<div class="shadow-box-footer">
-	    	  <div id="loginSubmit" class="btn2 button1" class="login-submit">Login</div>
-	    	</div>
-    	</div>
-    </div>
+		</div><!-- /container -->
   </body>
 </html>
 

diff --git a/src/java/azkaban/webapp/servlet/velocity/messagedialog.vm b/src/java/azkaban/webapp/servlet/velocity/messagedialog.vm
index e0aec19..97ce566 100644
--- a/src/java/azkaban/webapp/servlet/velocity/messagedialog.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/messagedialog.vm
@@ -14,12 +14,21 @@
  * the License.
 *#
 
-<script type="text/javascript" src="${context}/js/azkaban.message.dialog.view.js"></script>
-
-<div id="azkabanMessageDialog" class="modal">
-	<h3 id="azkabanMessageDialogTitle"></h3>
-	<div id="azkabanMessageDialogText"></div>
-	<div class="actions">
-		<a class="yes btn2 continueclass" id="continue-btn" href="#">Continue</a>
-	</div>
-</div>
+			<script type="text/javascript" src="${context}/js/azkaban.message.dialog.view.js"></script>
+			
+			<div class="modal fade" id="azkaban-message-dialog">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title" id="azkaban-message-dialog-title"></h4>
+						</div><!-- /modal-header -->
+						<div class="modal-body">
+							<p id="azkaban-message-dialog-text"></p>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-primary" data-dismiss="modal">Continue</button>
+						</div>
+					</div>
+				</div>
+			</div>

diff --git a/src/java/azkaban/webapp/servlet/velocity/nav2.vm b/src/java/azkaban/webapp/servlet/velocity/nav2.vm
new file mode 100644
index 0000000..44f2134
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/nav2.vm
@@ -0,0 +1,56 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+    <div class="navbar navbar-inverse navbar-static-top">
+      <div class="container">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+#parse("azkaban/webapp/servlet/velocity/title2.vm")
+        </div>
+        <div class="navbar-collapse collapse">
+          <ul class="nav navbar-nav">
+						<li#if($current_page == 'all') class="active"#end><a href="$!context/index">Projects</a></li>
+						<li#if($current_page == 'schedule') class="active"#end><a href="$!context/schedule">Scheduling</a></li>
+						<!--<li#if($current_page == 'triggers') class="active"#end><a href="$!context/triggers">Triggers</a></li>-->
+						<li#if($current_page == 'executing') class="active"#end><a href="$!context/executor">Executing</a></li>
+						<li#if($current_page == 'history') class="active"#end><a href="$!context/history">History</a></li>
+#foreach($viewer in $viewers)
+	#if(!$viewer.hidden)
+						<li#if($current_page == $viewer.pluginName) class="active"#end><a href="$!context/$viewer.pluginPath">$viewer.pluginName</a></li>
+	#end
+#end
+
+#foreach($trigger in $triggerPlugins)
+	#if(!$trigger.hidden)
+						<li#if($current_page == $trigger.pluginName) class="active"#end><a href="$!context/$trigger.pluginPath">$trigger.pluginName</a></li>
+	#end
+#end
+          </ul>
+          <ul class="nav navbar-nav navbar-right">
+            <li class="dropdown">
+							<a href="#" class="dropdown-toggle" data-toggle="dropdown">${user_id} <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                <li><a href="$!context?logout">Logout</a></li>
+              </ul>
+            </li>
+          </ul>
+        </div><!--/.nav-collapse -->
+      </div>
+    </div>

diff --git a/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm b/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm
index ff4613c..a7c5e34 100644
--- a/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/permissionspage.vm
@@ -15,14 +15,11 @@
 *#
 
 <!DOCTYPE html> 
-<html>
+<html lang="en">
 	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+
+#parse ("azkaban/webapp/servlet/velocity/style2.vm")
+#parse ("azkaban/webapp/servlet/velocity/javascript.vm")
 
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.permission.view.js"></script>
@@ -37,229 +34,314 @@
 		</script>
 	</head>
 	<body>
-#set($current_page="all")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
 
-			<div class="content">
-#if($errorMsg)
-				<div class="box-error-message">$errorMsg</div>
+#set ($current_page = "all")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+	<div class="container">
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
+				</div>
+			</div>
 #else
-#if($error_message != "null")
-				<div class="box-error-message">$error_message</div>
-#elseif($success_message != "null")
-				<div class="box-success-message">$success_message</div>
-#end
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
+			</div>
+
+			<div class="page-header">
+				<h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
+				<p>$project.description</p>
+			</div>
+
+			<div class="row">
+				<div class="col-lg-8">
+	
+	## Breadcrumb
+
+					<ol class="breadcrumb">
+						<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+					</ol>
 
-				<div id="all-jobs-content">
-					<div class="section-hd">
-						<h2><a href="${context}/manager?project=${project.name}&permissions">Permissions</a></h2>
-						<div class="section-sub-hd">
-							<h4><a href="${context}/manager?project=${project.name}">Project <span>$project.name</span></a></h4>
+	#set ($project_page = "permissions")
+	#parse ("azkaban/webapp/servlet/velocity/projectnav.vm")
+
+					<div class="panel panel-default">
+						<div class="panel-heading">
+							Permissions
+							<div class="pull-right">
+	#if ($isAdmin)
+								<button id="addUser" class="btn btn-xs btn-success">Add User</button>
+								<button id="addGroup" class="btn btn-xs btn-warning">Add Group</button>
+								<button id="addProxyUser" class="btn btn-xs btn-info">Add Proxy User</button>
+	#end
+							</div>
 						</div>
-					</div>
-				</div>
+						<div class="panel-body">
 
-				<div id="project-users">
-					<table class="user-table">
-						<tr><td class="first">Project Admins:</td><td>$admins</td></tr>
-						<tr><td class="first">Your Permissions:</td><td>$userpermission.toString()</td></tr>
-						
-						<tr><td class="first"></td></tr>
-					</table>
-					
-					#if($isAdmin)
-						<button id="addUser" class="btn1">Add User</button>
-						<button id="addGroup" class="btn1">Add Group</button>
-						<button id="addProxyUser" class="btn2">Add Proxy User</button>
-					#end
-				</div>
+	## User permissions table.
 
-				<div id="project-summary">
-					<table class="summary-table">
-						<tr><td class="first">Name:</td><td>$project.name</td></tr>
-						<tr><td class="first">Created Date:</td><td>$utils.formatDate($project.lastModifiedTimestamp)</td></tr>
-						<tr><td class="first">Modified Date:</td><td>$utils.formatDate($project.createTimestamp)</td></tr>
-						<tr><td class="first">Last Modified by:</td><td>$project.lastModifiedUser</td></tr>
-						<tr><td class="first">Description:</td><td id="pdescription">$project.description</td>
-						</tr>
-					</table>
-				</div>
+							<div class="panel panel-success">
+								<div class="panel-heading">User</div>
+								<table class="table table-striped" id="permissions-table">
+									<thead>
+										<th class="tb-username">User</th>
+										<th class="tb-perm">Admin</th>
+										<th class="tb-read">Read</th>
+										<th class="tb-write">Write</th>
+										<th class="tb-execute">Execute</th>
+										<th class="tb-schedule">Schedule</th>					
+	#if ($isAdmin)
+											<th class="tb-action"></th>
+	#end
+									</thead>
+									<tbody>
 
-		<table id="permissions-table" class="all-jobs permission-table">
-			<thead>
-				<tr>
-					<th class="tb-username">User</th>
-					<th class="tb-perm">Admin</th>
-					<th class="tb-read">Read</th>
-					<th class="tb-write">Write</th>
-					<th class="tb-execute">Execute</th>
-					<th class="tb-schedule">Schedule</th>					
-					#if($isAdmin)
-						<th class="tb-action"></th>
-					#end
-				</tr>
-			</thead>
-			<tbody>
-#if($permissions)
-#foreach($perm in $permissions)
-	<tr>
-		<td class="tb-username">#if($perm.first == $username) ${perm.first} <span class="sublabel">(you)</span> #else $perm.first #end</td>
-		#if ($perm.second.isPermissionNameSet("ADMIN")) 
-			<td><input id="${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled" checked="true"></input></td>
-			<td><input id="${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled" checked="true"></input></td>
-			<td><input id="${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" checked="true"></input></td>
-			<td><input id="${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" checked="true"></input></td>
-			<td><input id="${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" checked="true"></input></td>
-		#else
-			<td><input id="${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled"></input></td>
-			<td><input id="${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled"  #if ($perm.second.isPermissionNameSet("READ")) checked="true" #end></input></td>
-			<td><input id="${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" #if ($perm.second.isPermissionNameSet("WRITE")) checked="true" #end></input></td>
-			<td><input id="${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" #if ($perm.second.isPermissionNameSet("EXECUTE")) checked="true" #end></input></td>
-			<td><input id="${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" #if ($perm.second.isPermissionNameSet("SCHEDULE")) checked="true" #end></input></td>
-		#end
+	#if ($permissions)
+		#foreach ($perm in $permissions)
+										<tr>
+											<td class="tb-username">
+			#if ($perm.first == $username) 
+												${perm.first} <span class="sublabel">(you)</span> 
+			#else 
+												$perm.first 
+			#end
+											</td>
+			#if ($perm.second.isPermissionNameSet("ADMIN")) 
+											<td><input id="${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled" checked="true"></input></td>
+											<td><input id="${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled" checked="true"></input></td>
+											<td><input id="${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" checked="true"></input></td>
+											<td><input id="${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" checked="true"></input></td>
+											<td><input id="${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" checked="true"></input></td>
+			#else
+											<td><input id="${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled"></input></td>
+											<td><input id="${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled"  #if ($perm.second.isPermissionNameSet("READ")) checked="true" #end></input></td>
+											<td><input id="${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" #if ($perm.second.isPermissionNameSet("WRITE")) checked="true" #end></input></td>
+											<td><input id="${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" #if ($perm.second.isPermissionNameSet("EXECUTE")) checked="true" #end></input></td>
+											<td><input id="${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" #if ($perm.second.isPermissionNameSet("SCHEDULE")) checked="true" #end></input></td>
+			#end
 
-		#if($isAdmin)
-			<td><button id="$perm.first" #if($perm.first == $username) disabled="disabled" class="change-btn btn-disabled" #else class="change-btn btn2" #end >Change</button></td>
+			#if ($isAdmin)
+											<td><button id="$perm.first" #if($perm.first == $username) disabled="disabled" class="btn btn-xs btn-disabled" #else class="btn btn-xs btn-default" #end >Change</button></td>
+			#end
+										</tr>
 		#end
-	</tr>
-#end
-#else
-	<tr><td class="last">No Users Found.</td></tr>
-#end
-			</tbody>
-		</table>
+	#else
+										<tr><td class="last">No Users Found.</td></tr>
+	#end
+									</tbody>
+								</table>
+							</div>
 
-		<table id="group-permissions-table" class="all-jobs permission-table">
-			<thead>
-				<tr>
-					<th class="tb-username">Group</th>
-					<th class="tb-perm">Admin</th>
-					<th class="tb-read">Read</th>
-					<th class="tb-write">Write</th>
-					<th class="tb-execute">Execute</th>
-					<th class="tb-schedule">Schedule</th>
-					#if($isAdmin)
-						<th class="tb-action"></th>
-					#end
-				</tr>
-			</thead>
-			<tbody>
-#if($groupPermissions)
-#foreach($perm in $groupPermissions)
-	<tr>
-		<td class="tb-username">#if($perm.first == $username) ${perm.first} <span class="sublabel">(you)</span> #else $perm.first #end</td>
-		#if ($perm.second.isPermissionNameSet("ADMIN")) 
-			<td><input id="group-${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled" checked="true"></input></td>
-			<td><input id="group-${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled" checked="true"></input></td>
-			<td><input id="group-${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" checked="true"></input></td>
-			<td><input id="group-${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" checked="true"></input></td>
-			<td><input id="group-${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" checked="true"></input></td>
-		#else
-			<td><input id="group-${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled"></input></td>
-			<td><input id="group-${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled"  #if ($perm.second.isPermissionNameSet("READ")) checked="true" #end></input></td>
-			<td><input id="group-${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" #if ($perm.second.isPermissionNameSet("WRITE")) checked="true" #end></input></td>
-			<td><input id="group-${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" #if ($perm.second.isPermissionNameSet("EXECUTE")) checked="true" #end></input></td>
-			<td><input id="group-${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" #if ($perm.second.isPermissionNameSet("SCHEDULE")) checked="true" #end></input></td>
-		#end
+	## Group permissions table.
+							
+							<div class="panel panel-warning">
+								<div class="panel-heading">Group</div>
+								<table class="table table-striped" id="group-permissions-table">
+									<thead>
+										<tr>
+											<th class="tb-username">Group</th>
+											<th class="tb-perm">Admin</th>
+											<th class="tb-read">Read</th>
+											<th class="tb-write">Write</th>
+											<th class="tb-execute">Execute</th>
+											<th class="tb-schedule">Schedule</th>
+	#if ($isAdmin)
+											<th class="tb-action"></th>
+	#end
+										</tr>
+									</thead>
+									<tbody>
+	#if ($groupPermissions)
+		#foreach ($perm in $groupPermissions)
+										<tr>
+											<td class="tb-username">
+			#if ($perm.first == $username) 
+												${perm.first} <span class="sublabel">(you)</span> 
+			#else 
+												$perm.first 
+			#end
+											</td>
+			#if ($perm.second.isPermissionNameSet("ADMIN")) 
+											<td><input id="group-${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled" checked="true"></input></td>
+											<td><input id="group-${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled" checked="true"></input></td>
+											<td><input id="group-${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" checked="true"></input></td>
+											<td><input id="group-${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" checked="true"></input></td>
+											<td><input id="group-${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" checked="true"></input></td>
+			#else
+											<td><input id="group-${perm.first}-admin-checkbox" type="checkbox" name="admin" disabled="disabled"></input></td>
+											<td><input id="group-${perm.first}-read-checkbox" type="checkbox" name="read" disabled="disabled"  #if ($perm.second.isPermissionNameSet("READ")) checked="true" #end></input></td>
+											<td><input id="group-${perm.first}-write-checkbox" type="checkbox" name="write" disabled="disabled" #if ($perm.second.isPermissionNameSet("WRITE")) checked="true" #end></input></td>
+											<td><input id="group-${perm.first}-execute-checkbox" type="checkbox" name="execute" disabled="disabled" #if ($perm.second.isPermissionNameSet("EXECUTE")) checked="true" #end></input></td>
+											<td><input id="group-${perm.first}-schedule-checkbox" type="checkbox" name="schedule" disabled="disabled" #if ($perm.second.isPermissionNameSet("SCHEDULE")) checked="true" #end></input></td>
+			#end
 
-		#if($isAdmin)
-			<td><button id="group-$perm.first" class="change-btn btn2">Change</button></td>
+			#if ($isAdmin)
+											<td><button id="group-$perm.first" class="btn btn-xs btn-default">Change</button></td>
+			#end
+										</tr>
 		#end
-	</tr>
-#end
-#else
-	<tr><td class="last">No Groups Found.</td></tr>
-#end
-			</tbody>
-		</table>
-		
-		<br/>
-		<table id="proxy-user-table" class="all-jobs permission-table">
-			<thead>
-				<tr>
-					<th class="tb-username">Proxy User</th>
-					#if($isAdmin)
-						<th class="tb-action"></th>
-					#end
-				</tr>
-			</thead>
-			<tbody>
-#if($proxyUsers)
-#foreach($proxyUser in $proxyUsers)
-	<tr>
-		<td class="tb-username">#if($proxyUser == $username) ${proxyUser} <span class="sublabel">(you)</span> #else $proxyUser #end</td>
-		#if($isAdmin)
-			<td><button id="proxy-${proxyUser}" name="${proxyUser}" class="remove-btn btn2">Remove</button></td>
-		#end
-	</tr>
-#end
-#else
-	<tr><td class="last">No Proxy User Found.</td></tr>
-#end
-			</tbody>
-		</table>
-#end
-
-		</div>
+	#else
+										<tr><td class="last">No Groups Found.</td></tr>
+	#end
+									</tbody>
+								</table>
+							</div>
 	
-		<div id="remove-proxy" class="modal">
-			<h3>Remove Proxy User</h3>
-			<div id="removeProxyErrorMsg" class="box-error-message"></div>
-			<p id="proxyRemoveMsg">Removing Proxy User </p>
-			<div class="actions">
-				<a class="yes btn2" id="remove-proxy-btn" href="#">Remove Proxy User</a>
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
-			</div>
-		</div>
-	
-		<div id="add-proxy" class="modal">
-			<h3 id="proxy-title">Add Proxy User</h3>
-			<div id="proxyErrorMsg" class="box-error-message"></div>
-			<dl>
-				<dt>Proxy</dt>
-				<dd><input id="proxy-user-box" name="proxyid" type="text" /></dd>
-			</dl>
-			<div class="actions">
-				<a class="yes btn2" id="add-proxy-btn" href="#">Add Proxy User</a>
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
-			</div>
-		</div>
+	## Proxy users table.
+							
+							<div class="panel panel-info">
+								<div class="panel-heading">Proxy Users</div>
+								<table class="table table-striped" id="proxy-user-table">
+									<thead>
+										<tr>
+											<th class="tb-username">Proxy User</th>
+	#if ($isAdmin)
+											<th class="tb-action"></th>
+	#end
+										</tr>
+									</thead>
+									<tbody>
+	#if ($proxyUsers)
+		#foreach ($proxyUser in $proxyUsers)
+										<tr>
+											<td class="tb-username">#if($proxyUser == $username) ${proxyUser} <span class="sublabel">(you)</span> #else $proxyUser #end</td>
+			#if($isAdmin)
+											<td><button id="proxy-${proxyUser}" name="${proxyUser}" class="btn btn-xs btn-primary">Remove</button></td>
+			#end
+										</tr>
+		#end
+	#else
+										<tr><td class="last">No Proxy User Found.</td></tr>
+	#end
+									</tbody>
+								</table>
+							</div>
 	
-		<div id="change-permission" class="modal">
-			<h3 id="change-title">Change Permissions</h3>
-			<div id="errorMsg" class="box-error-message"></div>
-			<div class="message">
-				<fieldset>
-					<dl>
-						<dt>User</dt>
-						<dd><input id="user-box" name="userid" type="text" /></dd>
-					<div id="otherCheckBoxes">
-						<dt class="nextline">Admin</dt>
-						<dd><input id="admin-change" name="admin" type="checkbox" /></dd>
-						<dt>Read</dt>
-					    <dd><input id="read-change" name="read" type="checkbox" /></dd>
-					    <dt>Write</dt>
-					    <dd><input id="write-change" name="write" type="checkbox" /></dd>
-					    <dt>Execute</dt>
-					    <dd><input id="execute-change" name="execute" type="checkbox" /></dd>
-					    <dt>Schedule</dt>
-					    <dd><input id="schedule-change" name="schedule" type="checkbox" /></dd>
+						</div><!-- /panel-body -->
+					</div><!-- /panel -->
+				</div><!-- /col-lg-8 -->
+				<div class="col-lg-4">
+	#parse ("azkaban/webapp/servlet/velocity/projectsidebar.vm")
+				</div><!-- /col-lg-4 -->
+			</div><!-- /row -->
+
+## Remove proxy user modal dialog.
+
+			<div class="modal fade" id="remove-proxy">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Remove Proxy User</h4>
+						</div>
+						<div class="modal-body">
+							<div class="alert alert-danger" id="remove-proxy-error-msg"></div>
+							<p>Removing Proxy User</p>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="remove-proxy-btn">Remove Proxy User</a>
+						</div>
 					</div>
-					</dl>
-				</fieldset>
+				</div>
 			</div>
-			<div class="actions">
-				<a class="yes btn2" id="change-btn" href="#">Commit</a>
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
+
+## Add proxy user modal dialog.
+
+			<div class="modal fade" id="add-proxy">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Add Proxy User</h4>
+						</div>
+						<div class="modal-body">
+							<div class="alert alert-danger" id="add-proxy-error-msg"></div>
+							<fieldset class="form-horizontal">
+								<div class="form-group">
+									<label for="path" class="col-sm-2 control-label">Proxy</label>
+									<div class="col-sm-10">
+										<input type="text" name="proxyid" id="proxy-user-box" class="form-control">
+									</div>
+								</div>
+							</fieldset>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="add-proxy-btn">Add Proxy User</button>
+						</div>
+					</div>
+				</div>
 			</div>
-		</div>
-		<div id="invalid-session" class="modal">
-			<h3>Invalid Session</h3>
-			<p>Session has expired. Please re-login.</p>
-			<div class="actions">
-				<a class="yes btn2" id="login-btn" href="#">Re-login</a>
+			
+## Change permissions modal dialog.
+
+			<div class="modal fade" id="change-permission">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Change Permissions</h4>
+						</div>
+						<div class="modal-body">
+							<div class="alert alert-danger" id="change-permission-error-msg"></div>
+							<fieldset class="form-horizontal">
+								<div class="form-group">
+									<label for="path" class="col-sm-2 control-label">User</label>
+									<div class="col-sm-10">
+										<input type="text" name="userid" id="user-box" class="form-control">
+									</div>
+								</div>
+								<div class="form-group">
+									<label class="checkbox-inline">
+										<input id="admin-change" name="admin" type="checkbox">
+										Admin
+									</label>
+									<label class="checkbox-inline">
+										<input id="read-change" name="read" type="checkbox">
+										Read
+									</label>
+									<label class="checkbox-inline">
+										<input id="write-change" name="write" type="checkbox">
+										Write
+									</label>
+									<label class="checkbox-inline">
+										<input id="execute-change" name="execute" type="checkbox">
+										Execute
+									</label>
+									<label class="checkbox-inline">
+										<input id="schedule-change" name="schedule" type="checkbox">
+										Schedule
+									</label>
+								</div>
+							</fieldset>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="change-btn">Commit</button>
+						</div>
+					</div>
+				</div>
 			</div>
-		</div>
+
+	#parse ("azkaban/webapp/servlet/velocity/invalidsessionmodal.vm")
+#end
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+		</div><!-- /container -->
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/projectlogpage.vm b/src/java/azkaban/webapp/servlet/velocity/projectlogpage.vm
index af1e15c..1bf473a 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectlogpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectlogpage.vm
@@ -16,18 +16,15 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+	<head lang="en">
+
+#parse ("azkaban/webapp/servlet/velocity/style2.vm")
+#parse ("azkaban/webapp/servlet/velocity/javascript.vm")
+
 		<script type="text/javascript" src="${context}/js/azkaban.date.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.ajax.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.projectlog.view.js"></script>
-		
 		<script type="text/javascript">
 			var contextURL = "${context}";
 			var currentTime = ${currentTime};
@@ -36,50 +33,72 @@
 			var successMessage = null;
 			
 			var projectName = "${projectName}";
-
 		</script>
 	</head>
 	<body>
-		#set($current_page="executing")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="content">
-#if($errorMsg)
-				<div class="box-error-message">$errorMsg</div>
-#else
-#if($error_message != "null")
-				<div class="box-error-message">$error_message</div>
-#elseif($success_message != "null")
-				<div class="box-success-message">$success_message</div>
-#end
-		
-			<div id="all-jobs-content">
-				<div class="section-hd flow-header">
-					<h2><a href="${context}/manager?project=${projectName}">Project Audit Logs <span>$projectName</span></a></h2>
+
+#set ($current_page="executing")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
 			</div>
-			
-			<div id="headertabs" class="headertabs">
-				<ul>
-					<li><a id="logViewLink" href="#log">Log</a></li>
-				</ul>
+#else
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+
+	## Page header.
+
+			<div class="page-header">
+				<h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
+				<p>$project.description</p>
 			</div>
 
-			<div id="projectLogView" class="logView">
-				<div class="logHeader"><div class="logButtonRow"><div id="updateLogBtn" class="btn7">Refresh</div></div></div>
-				<div id="logViewer" class="logViewer">
-					<table id="logTable">
-						
-					</table>
+	## Page content.
+
+			<div class="row">
+				<div class="col-lg-8">
+	
+	## Breadcrumb
+
+					<ol class="breadcrumb">
+						<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+					</ol>
+
+	#set ($project_page = "logs")
+	#parse ("azkaban/webapp/servlet/velocity/projectnav.vm")
+
+					<div class="panel panel-default" id="flow-tabs">
+						<div class="panel-heading">
+							<div class="pull-right" id="project-options">
+								<button type="button" id="updateLogBtn" class="btn btn-xs btn-info">Refresh</button>
+							</div>
+							Audit Logs
+						</div>
+						<table class="table table-striped" id="logTable">
+						</table>
+					</div>
 				</div>
-			</div>
-#end
-			<div id="messageDialog" class="modal">
-				<h3 id="messageTitle">Error</h3>
-				<div class="messageDiv">
-					<p id="messageBox"></p>
+				<div class="col-lg-4">
+	#parse ("azkaban/webapp/servlet/velocity/projectsidebar.vm")
 				</div>
 			</div>
 
-		</div>
+#end
+
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
+		</div><!-- /container -->
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/projectnav.vm b/src/java/azkaban/webapp/servlet/velocity/projectnav.vm
new file mode 100644
index 0000000..c19a6ab
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/projectnav.vm
@@ -0,0 +1,23 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+					<ul class="nav nav-tabs">
+						<li#if($project_page == 'flows') class="active"#end><a href="${context}/manager?project=${project.name}">Flows</a></li>
+						<li#if($project_page == 'permissions') class="active"#end><a id="project-permission-btn" href="${context}/manager?project=${project.name}&permissions">Permissions</a></li>
+	#if ($admin)
+						<li#if($project_page == 'logs') class="active"#end><a id="project-logs-btn" href="${context}/manager?project=${project.name}&logs">Project Logs</a></li>
+	#end
+					</ul>

diff --git a/src/java/azkaban/webapp/servlet/velocity/projectpage.vm b/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
index ef3d281..e96d96e 100644
--- a/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/projectpage.vm
@@ -15,22 +15,18 @@
 *#
 
 <!DOCTYPE html> 
-<html>
+<html lang="en">
 	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
+
+#parse ("azkaban/webapp/servlet/velocity/style2.vm")
+#parse ("azkaban/webapp/servlet/velocity/javascript.vm")
+
+		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
+		<link rel="stylesheet" type="text/css" href="${context}/css/azkaban-svg.css" />
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
-		
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.ajax.utils.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.project.view.js"></script>
-
-		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
-
 		<script type="text/javascript">
 			var contextURL = "${context}";
 			var currentTime = ${currentTime};
@@ -39,149 +35,168 @@
 			var successMessage = null;
 
 			var projectId = ${project.id};
-
 			var execAccess = ${exec};
 			var projectName = "$project.name";
 		</script>
 	</head>
 	<body>
-#set($current_page="all")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
 
-			<div class="content">
-#if($errorMsg)
-				<div class="box-error-message"><pre>$errorMsg</pre></div>
-#else
-#if($error_message != "null")
-				<div class="box-error-message"><pre>$error_message</pre></div>
-#elseif($success_message != "null")
-				<div class="box-success-message"><pre>$success_message</pre></div>
-#end
+#set ($current_page="all")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
 
-				<div id="all-jobs-content">
-					<div class="section-hd">
-						<h2><a href="${context}/manager?project=${project.name}">Project <span>$project.name</span></a></h2>
-						<a id="project-upload-btn" class="btn1 projectupload">Upload</a>
-						<a id="project-permission-btn" class="btn5 projectpermission" href="${context}/manager?project=${project.name}&permissions">Permissions</a>
-						#if($admin)
-						<a id="project-logs-btn" class="btn2" href="${context}/manager?project=${project.name}&logs">Project Logs</a>
-						<a id="project-delete-btn" class="btn6">Delete Project</a>
-						#end
-					</div><!-- end .section-hd -->
-				</div>
+		<div class="container">
 
-				<div id="project-users">
-					<table class="user-table">
-						<tr><td class="first">Project Admins:</td><td>$admins</td></tr>
-						<tr><td class="first">Your Permissions:</td><td>$userpermission.toString()</td></tr>
-					</table>
-				</div>
+## Page error or success message.
 
-				<div id="project-summary">
-					<table class="summary-table">
-						<tr><td class="first">Name:</td><td>$project.name</td></tr>
-						<tr><td class="first">Created Date:</td><td>$utils.formatDate($project.createTimestamp)</td></tr>
-						<tr><td class="first">Modified Date:</td><td>$utils.formatDate($project.lastModifiedTimestamp)</td></tr>
-						<tr><td class="first">Modified by:</td><td>$project.lastModifiedUser</td></tr>
-						<tr><td class="first">Description:</td><td id="pdescription">$project.description</td>
-							#if($admin)
-								<td><div id="edit" class="btn5">Edit Description</div></td>
-							#end
-						</tr>
-					</table>
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
-
-			<div id="flow-tabs">
-				<table id="all-jobs" class="all-jobs job-table">
-					<thead>
-						<tr>
-							<th class="tb-name">Flow Name</th>
-						</tr>
-					</thead>
-					<tbody>
-#if($flows)
-#foreach($flow in $flows)
-						<tr class="row flowrow">
-							<td class="tb-name" flow="${flow.id}" project="${project.name}">
-									<div class="jobfolder expand" id="${flow.id}">
-										<span class="state-icon"></span>
-										<a href="${context}/manager?project=${project.name}&flow=${flow.id}">${flow.id}</a>
-									</div>
-									#if (${exec})
-									<div class="job-hover-menu">
-										<div class="btn1 executeFlow" flowId="${flow.id}">Execute Flow</div>
-									</div>
-									#end
-							</td>
-						</tr>
-						<tr class="childrow" id="${flow.id}-child" style="display: none;">
-							<td class="expandedFlow">
-								<table class="innerTable">
-									<thead>
-										<tr><th class="tb-name">Jobs</th></tr>
-									</thead>
-									<tbody id="${flow.id}-tbody">
-									</tbody>
-								</table>
-							</td>
-						</tr>
-#end
-#else
-						<tr><td class="last">No flows uploaded to this project.</td></tr>
-#end
-					</tbody>
-				</table>
 			</div>
-#end
-		</div>
-	
-		<div id="upload-project" class="modal">
-			<h3>Upload Project Files</h3>
-			<div id="errorMsg" class="box-error-message">$errorMsg</div>
-			<div class="message">
-				<form id="upload-form" enctype="multipart/form-data" method="post" action="$!context/manager">
-					<fieldset>
-						<dl>
-							<dt>Job Archive</dt>
-							<dd><input id="file" name="file" class="file" type="file" /></dd>
-							<input type="hidden" name="project" value="$project.name" />
-							<input type="hidden" name="action" value="upload" />
-						</dl>
-					</fieldset>
-				</form>
+#else
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
 			</div>
-			<div class="actions">
-				<a class="yes btn2" id="upload-btn" href="#">Upload</a>
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
+
+	## Page header.
+
+			<div class="page-header">
+				<h1><a href="${context}/manager?project=${project.name}">Project <small>$project.name</small></a></h1>
+				<p>$project.description</p>
 			</div>
-			<div id="invalid-session" class="modal">
-				<h3>Invalid Session</h3>
-				<p>Session has expired. Please re-login.</p>
-				<div class="actions">
-					<a class="yes btn2" id="login-btn" href="#">Re-login</a>
+
+	## Page content.
+
+			<div class="row">
+				<div class="col-lg-8">
+					
+	## Breadcrumb
+
+					<ol class="breadcrumb">
+						<li class="active"><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+					</ol>
+
+	#set ($project_page = "flows")
+	#parse ("azkaban/webapp/servlet/velocity/projectnav.vm")
+
+					<div class="panel panel-default" id="flow-tabs">
+						<div class="panel-heading">
+							<div class="pull-right" id="project-options">
+								<button id="project-upload-btn" class="btn btn-xs btn-primary">Upload</button>
+								<button id="project-delete-btn" class="btn btn-xs btn-danger">Delete Project</button>
+							</div>
+							Flows
+						</div>
+						<div class="panel-body">
+
+	#if ($flows)
+		#foreach ($flow in $flows)
+							<div class="panel panel-info" flow="${flow.id}" project="${project.name}">
+								<div class="panel-heading flow-expander" id="${flow.id}">
+									<a href="${context}/manager?project=${project.name}&flow=${flow.id}">${flow.id}</a>
+								</div>
+								<div id="${flow.id}-child" class="panel-collapse collapse">
+									<table class="table">
+										<tbody id="${flow.id}-tbody">
+										</tbody>
+									</table>
+								</div>
+								<div class="panel-footer">
+			#if (${exec})
+									<button type="button" class="btn btn-sm btn-primary execute-flow" flowId="${flow.id}">Execute Flow</button>
+									<a href="${context}/manager?project=${project.name}&flow=${flow.id}#executions" class="btn btn-primary btn-sm">Executions</a>
+									<a href="${context}/manager?project=${project.name}&flow=${flow.id}#summary" class="btn btn-primary btn-sm">Summary</a>
+			#end
+								</div>
+							</div>
+		#end
+	#else
+							<p>No flows uploaded to this project</p>
+	#end
+						</div>
+					</div>
+				</div><!-- /col-lg-8 -->
+
+				<div class="col-lg-4">
+	#parse ("azkaban/webapp/servlet/velocity/projectsidebar.vm")
+				</div><!-- /col-lg-4 -->
+			</div><!-- /row -->
+
+## Upload project modal
+
+			<div class="modal fade" id="upload-project-modal">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<form id="upload-project-form" enctype="multipart/form-data" method="post" action="$!context/manager">
+							<div class="modal-header">
+								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+								<h4 class="modal-title">Upload Project Files</h4>
+							</div>
+							<div class="modal-body">
+								<div class="alert alert-danger" id="upload-project-modal-error-msg">$error_msg</div>
+								<fieldset class="form-horizontal">
+									<div class="form-group">
+										<label for="path" class="col-sm-2 control-label">Job Archive</label>
+										<div class="col-sm-10">
+											<input type="file" class="form-control" id="file" name="file">
+										</div>
+									</div>
+								</fieldset>
+							</div>
+							<div class="modal-footer">
+								<input type="hidden" name="project" value="$project.name">
+								<input type="hidden" name="action" value="upload">
+								<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+								<button type="button" class="btn btn-primary" id="upload-project-btn">Upload</button>
+							</div>
+						</form>
+					</div>
 				</div>
 			</div>
-		</div>
-		<div id="delete-project" class="modal">
-			<h3>Delete Project</h3>
-			<div class="warn">
-				<div class="warning-icon"></div>
-				<div class="warning-message"><p>Warning: This project will be deleted and may not be recoverable.</p></div>
-			</div>
-			<form id="delete-form">
-				<input type="hidden" name="project" value="$project.name" />
-				<input type="hidden" name="delete" value="true" />
-			</form>
+
+	## Delete project modal.
 			
-			<div class="actions">
-				<a class="no simplemodal-close btn3" href="#">Cancel</a>
-				<a class="yes btn6" id="delete-btn" href="#">Yes</a>
+			<div class="modal fade" id="delete-project-modal">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Delete Project</h4>
+						</div>
+						<div class="modal-body">
+							<p>Warning: This project will be deleted and may not be recoverable.</p>
+						</div>
+						<div class="modal-footer">
+							<form id="delete-form">
+								<input type="hidden" name="project" value="$project.name">
+								<input type="hidden" name="delete" value="true">
+								<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+								<button type="button" class="btn btn-danger" id="delete-btn">Yes</button>
+							</form>
+						</div>
+					</div>
+				</div>
 			</div>
-		</div>
-		#parse( "azkaban/webapp/servlet/velocity/flowexecutionpanel.vm" )
-		#parse( "azkaban/webapp/servlet/velocity/messagedialog.vm" )
+
+	#parse ("azkaban/webapp/servlet/velocity/invalidsessionmodal.vm")
+	#parse ("azkaban/webapp/servlet/velocity/flowexecutionpanel.vm")
+	#parse ("azkaban/webapp/servlet/velocity/messagedialog.vm")
+#end
+
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
+		</div><!-- /container -->
 	</body>
-	
 </html>
 

diff --git a/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm b/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
new file mode 100644
index 0000000..20bb3bf
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/projectsidebar.vm
@@ -0,0 +1,27 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+					<div class="well">
+						<h3>$project.name</h3>
+						<p><strong>Created on</strong> $utils.formatDate($project.createTimestamp)</p>
+						<p><strong>Last modified by</strong> $utils.formatDate($project.lastModifiedTimestamp)</p>
+						<p><strong>Modified by</strong> $project.lastModifiedUser</p>
+
+						<hr>
+
+						<p><strong>Project admins:</strong> $admins</p>
+						<p><strong>Your Permissions:</strong> $userpermission.toString()</p>
+					</div>

diff --git a/src/java/azkaban/webapp/servlet/velocity/propertypage.vm b/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
index d771ca6..192c105 100644
--- a/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/propertypage.vm
@@ -16,13 +16,10 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
+	<head lang="en">
+
+#parse("azkaban/webapp/servlet/velocity/style2.vm")
+#parse ("azkaban/webapp/servlet/velocity/javascript.vm")
 
 		<script type="text/javascript" src="${context}/js/azkaban.nav.js"></script>
 		<script type="text/javascript">
@@ -36,73 +33,113 @@
 		</script>
 	</head>
 	<body>
+
 #set($current_page="all")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
+#parse("azkaban/webapp/servlet/velocity/nav2.vm")
+		
+		<div class="container">
 
-#if($errorMsg)
-			<div class="box-error-message">$errorMsg</div>
-#else
-	<div class="content">
-	#if($error_message != "null")
-			<div class="box-error-message">$error_message</div>
-	#elseif($success_message != "null")
-			<div class="box-success-message">$success_message</div>
-	#end
-			<div id="all-jobs-content">
-				<div class="section-hd">
-					<h2><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=${property}">Property <span>$property</span></a></h2>
-					<div class="section-sub-hd">
-						<h4><a href="${context}/manager?project=${project.name}">Project <span>$project.name</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${project.name}&flow=${flowid}">Flow <span>$flowid</span></a></h4>
-						<h4 class="separator">&gt;</h4>
-						<h4><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Job <span>$jobid</span></a></h4>
-					</div>
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
 			</div>
-			
-			<div id="property-summary">
-				<table class="summary-table">
-					<tr><td class="first">Inherited From:</td><td>
-#if ($inheritedproperties) 
-#foreach($inheritedproperty in $inheritedproperties)
-					<a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$inheritedproperty">$inheritedproperty</a>
-#end
 #else
-					<span>No Inherited Properties</span>
-#end
-					</td></tr>
-					<tr><td class="first">Source Of:</td><td>
-#if ($dependingproperties) 
-#foreach($dependingproperty in $dependingproperties)
-					<span class="nowrap"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$dependingproperty">$dependingproperty</a></span>
-#end
-#else
-					<span>No Dependents</span>
-#end
-					</td></tr>
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
 
-				</table>
+	## Page header
+
+			<div class="page-header">
+				<h1>
+					<a href="${context}/manager?project=${project.name}">$project.name</a> / 
+					<a href="${context}/manager?project=${project.name}&flow=${flowid}">$flowid</a>
+				</h1>
 			</div>
-			
-			<table id="all-jobs" class="all-jobs job-table parameters">
-				<thead>
-					<tr>
-						<th class="tb-pname">Parameter Name</th>
-						<th class="tb-pvalue">Value</th>
-					</tr>
-				</thead>
-				<tbody>
-#foreach($parameter in $parameters)
-					<tr>
-						<td class="first">$parameter.first</td><td>$parameter.second</td>
-					</tr>
-#end
-				</tbody>
-			</table>
-	</div>
+
+			<div class="row">
+				<div class="col-lg-8">
+
+	## Breadcrumb
+
+					<ol class="breadcrumb">
+						<li><a href="${context}/manager?project=${project.name}"><strong>Project</strong> $project.name</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}"><strong>Flow</strong> $flowid</a></li>
+						<li><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}"><strong>Job</strong> $jobid</a></li>
+					</ol>
+	
+	## Tabs
+
+					<ul class="nav nav-tabs">
+						<li class="active"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}">Properties</a></li>
+						<li><a id="jobs-logs-btn" href="${context}/manager?project=${project.name}&job=$jobid&history">History</a></li>
+					</ul>
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Property $property</div>
+
+						<table id="all-jobs" class="table table-striped table-bordered">
+							<thead>
+								<tr>
+									<th class="tb-pname">Parameter Name</th>
+									<th class="tb-pvalue">Value</th>
+								</tr>
+							</thead>
+							<tbody>
+	#foreach ($parameter in $parameters)
+								<tr>
+									<td class="first">$parameter.first</td><td>$parameter.second</td>
+								</tr>
+	#end
+							</tbody>
+						</table>
+					</div>
+				</div><!-- /col-lg-8 -->
+				<div class="col-lg-4">
+					<div class="well" id="job-summary">
+						<h4>Properties <small>$property</small></h4>
+						<p><strong>Job</strong> $jobid</p>
+						<p><strong>Job Type</strong> $jobtype</p>
+					</div>
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Inherited From</div>
+						<ul class="list-group">
+	#if ($inheritedproperties) 
+		#foreach ($inheritedproperty in $inheritedproperties)
+							<li class="list-group-item"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$inheritedproperty">$inheritedproperty</a></li>
+		#end
+	#else
+							<li class="list-group-item">No inherited properties.</li>
+	#end
+						</ul>
+					</div>
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Source of</div>
+						<ul class="list-group">
+	#if ($dependingproperties) 
+		#foreach ($dependingproperty in $dependingproperties)
+							<li class="list-group-item"><a href="${context}/manager?project=${project.name}&flow=${flowid}&job=${jobid}&prop=$dependingproperty">$dependingproperty</a></li>
+		#end
+	#else
+							<li class="list-group-item">No dependents.</li>
+	#end
+						</ul>
+					</div>
+				</div>
+			</div><!-- /row -->
 
 #end
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
+		</div><!-- /container -->
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm b/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm
index 0987dd6..ee51a3c 100644
--- a/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/scheduledflowpage.vm
@@ -16,18 +16,14 @@
 
 <!DOCTYPE html> 
 <html>
-	<head>
-#parse( "azkaban/webapp/servlet/velocity/style.vm" )
+	<head lang="en">
+
+#parse ("azkaban/webapp/servlet/velocity/style2.vm")
+#parse ("azkaban/webapp/servlet/velocity/javascript.vm")
+
 		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui-1.10.1.custom.css" />
-		<link rel="stylesheet" type="text/css" href="${context}/css/jquery-ui.css" />
 		
-		<script type="text/javascript" src="${context}/js/jquery/jquery-1.9.1.js"></script>    
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-1.10.1.custom.js"></script>
-		<script type="text/javascript" src="${context}/js/underscore-1.4.4-min.js"></script>
-		<script type="text/javascript" src="${context}/js/namespace.js"></script>
-		<script type="text/javascript" src="${context}/js/backbone-0.9.10-min.js"></script>
-		<script type="text/javascript" src="${context}/js/jquery.simplemodal-1.4.4.js"></script>
-		
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-timepicker-addon.js"></script> 
 		<script type="text/javascript" src="${context}/js/jqueryui/jquery-ui-sliderAccess.js"></script>
 		<script type="text/javascript" src="${context}/js/azkaban.table.sort.js"></script>
@@ -42,123 +38,144 @@
 		</script>
 	</head>
 	<body>
-#set($current_page="schedule")
-#parse( "azkaban/webapp/servlet/velocity/nav.vm" )
-		<div class="messaging"><p id="messageClose">X</p><p id="message"></p></div>  
 
-		<div class="content">
-		
-#if($errorMsg)
-		<div class="box-error-message">$errorMsg</div>
-#else
-#if($error_message != "null")
-		<div class="box-error-message">$error_message</div>
-#elseif($success_message != "null")
-		<div class="box-success-message">$success_message</div>
-#end
-#end		
-		
-			<div id="all-scheduledFlows-content">
-				<div class="section-hd">
-					<h2>Scheduled Flows</h2>
+#set ($current_page="schedule")
+#parse ("azkaban/webapp/servlet/velocity/nav2.vm")
+
+		<div class="container">
+
+## Page error or success message.
+
+#if ($errorMsg)
+			<div class="panel panel-danger">
+				<div class="panel-heading">Error</div>
+				<div class="panel-body">
+					$errorMsg
 				</div>
 			</div>
-			
-			<div class="scheduledFlows">
-				<table id="scheduledFlowsTbl">
-					<thead>
-						<tr>
-							<!--th class="execid">Execution Id</th-->
-							<th>ID</th>
-							<th>Flow</th>
-							<th>Project</th>
-							<th>Submitted By</th>
-							<th class="date">First Scheduled to Run</th>
-							<th class="date">Next Execution Time</th>
-							<th class="date">Repeats Every</th>
-							<th>Has SLA</th>
-							<th colspan="2" class="action ignoresort">Action</th>
-						</tr>
-					</thead>
-					<tbody>
-#if(!$schedules.isEmpty())
-	#foreach($sched in $schedules)
-						<tr class="row" >
-
-							<td>${sched.scheduleId}</td>
-							<td class="tb-name">
-								<a href="${context}/manager?project=${sched.projectName}&flow=${sched.flowName}">${sched.flowName}</a>
-							</td>
-							<td>
-								<a href="${context}/manager?project=${sched.projectName}">${sched.projectName}</a>
-							</td>
-							<td>${sched.submitUser}</td>
-							<td>$utils.formatDateTime(${sched.firstSchedTime})</td>
-							<td>$utils.formatDateTime(${sched.nextExecTime})</td>
-							<td>$utils.formatPeriod(${sched.period})</td>
-							<td>#if(${sched.slaOptions}) true #else false #end</td>
-							<td><button id="removeSchedBtn" onclick="removeSched(${sched.scheduleId})" >Remove Schedule</button></td>
-							<td><button id="addSlaBtn" onclick="slaView.initFromSched(${sched.scheduleId}, '${sched.flowName}')" >Set SLA</button></td>
-						</tr>
-	#end
 #else
-						<tr><td class="last">No Scheduled Flow Found</td></tr>
-#end
-					</tbody>
-				</table>
+	#if ($error_message != "null")
+			<div class="alert alert-danger">$error_message</div>
+	#elseif ($success_message != "null")
+			<div class="alert alert-success">$success_message</div>
+	#end
+
+	## Alert message
+
+			<div class="alert alert-dismissable alert-messaging" id="messaging">
+				<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+				<p id="messaging-message"></p>
 			</div>
 
-		<!-- modal content -->
+	## Page header.
 
-		<div id="slaModalBackground" class="modalBackground2">
-			<div id="sla-options" class="modal modalContainer2">
-				<a href='#' title='Close' class='modal-close'>x</a>
-					<h3>SLA Options</h3>
-					<div>
-						<ul class="optionsPicker">
-							<li id="slaOptions">General SLA Options</li>
-						</ul>
-					</div>
-					<div class="optionsPane">
-						<div id="generalPanel" class="generalPanel panel">
-							<div id="slaActions">
-								<h4>SLA Alert Emails</h4>
-								<dl>
-									<dt >SLA Alert Emails</dt>
-									<dd>
-										<textarea id="slaEmails"></textarea>
-									</dd>
-								</dl>
-							</div>
-							<br></br>
-							<div id="slaRules">
-								<h4>Flow SLA Rules</h4>
-								<div class="tableDiv">
-									<table id="flowRulesTbl">
-										<thead>
-											<tr>
-												<th>Flow/Job</th>
-												<th>Sla Rule</th>
-												<th>Duration</th>
-												<th>Email Action</th>
-												<th>Kill Action</th>
-											</tr>
-										</thead>
-										<tbody>
-											<tr id="addRow"><td id="addRow-col" colspan="5"><span class="addIcon"></span><a href="#">Add Row</a></td></tr>
-										</tbody>
-									</table>
+			<div class="page-header">
+				<h1>Scheduled Flows</h1>
+			</div>
+
+	## Page content.
+
+			<div class="row">
+				<div class="col-lg-12">
+					<div class="panel panel-default">
+						<div class="panel-heading">Scheduled Flows</div>
+						<table id="scheduledFlowsTbl" class="table table-striped">
+							<thead>
+								<tr>
+									<!--th class="execid">Execution Id</th-->
+									<th>ID</th>
+									<th>Flow</th>
+									<th>Project</th>
+									<th>Submitted By</th>
+									<th class="date">First Scheduled to Run</th>
+									<th class="date">Next Execution Time</th>
+									<th class="date">Repeats Every</th>
+									<th>Has SLA</th>
+									<th colspan="2" class="action ignoresort">Action</th>
+								</tr>
+							</thead>
+							<tbody>
+	#if(!$schedules.isEmpty())
+		#foreach($sched in $schedules)
+								<tr>
+									<td>${sched.scheduleId}</td>
+									<td class="tb-name">
+										<a href="${context}/manager?project=${sched.projectName}&flow=${sched.flowName}">${sched.flowName}</a>
+									</td>
+									<td>
+										<a href="${context}/manager?project=${sched.projectName}">${sched.projectName}</a>
+									</td>
+									<td>${sched.submitUser}</td>
+									<td>$utils.formatDateTime(${sched.firstSchedTime})</td>
+									<td>$utils.formatDateTime(${sched.nextExecTime})</td>
+									<td>$utils.formatPeriod(${sched.period})</td>
+									<td>#if(${sched.slaOptions}) true #else false #end</td>
+									<td><button type="button" id="removeSchedBtn" class="btn btn-sm btn-danger" onclick="removeSched(${sched.scheduleId})" >Remove Schedule</button></td>
+									<td><button type="button" id="addSlaBtn" class="btn btn-sm btn-primary" onclick="slaView.initFromSched(${sched.scheduleId}, '${sched.flowName}')" >Set SLA</button></td>
+								</tr>
+
+		#end
+	#else
+								<tr>
+									<td class="last">No scheduled flow found.</td>
+								</tr>
+	#end
+							</tbody>
+						</table>
+					</div><!-- /panel -->
+				</div><!-- /col-lg-12 -->
+			</div><!-- /row -->
+
+## Set SLA modal.
+
+			<div class="modal modal-wide fade" id="sla-options">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">SLA Options</h4>
+						</div>
+						<div class="modal-body">
+							<h4>SLA Alert Emails</h4>
+							<fieldset>
+								<div class="form-group">
+									<label>SLA Alert Emails</label>
+									<textarea id="slaEmails" class="form-control"></textarea>
 								</div>
-							
-							</div>
+							</fieldset>
+							<h4>Flow SLA Rules</h4>
+							<table class="table table-striped" id="flowRulesTbl">
+								<thead>
+									<tr>
+										<th>Flow/Job</th>
+										<th>Sla Rule</th>
+										<th>Duration</th>
+										<th>Email Action</th>
+										<th>Kill Action</th>
+									</tr>
+								</thead>
+								<tbody>
+									<tr id="addRow">
+										<td id="addRow-col" colspan="5">
+											<span class="addIcon"></span>
+											<button type="button" class="btn btn-xs btn-success">Add Row</button>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<!--<button type="button" class="btn btn-danger" id="remove-sla-btn">Remove SLA</button>-->
+							<button type="button" class="btn btn-primary" id="set-sla-btn">Set/Change SLA</button>
 						</div>
 					</div>
-					<div class="actions">
-						<!--a class="yes btn1" id="remove-sla-btn" href="#">Remove SLA</a-->
-						<a class="yes btn1" id="set-sla-btn" href="#">Set/Change SLA</a>
-						<a class="no simplemodal-close btn3" id="sla-cancel-btn" href="#">Cancel</a>
-					</div>
+				</div>
 			</div>
+#end
+
+#parse ("azkaban/webapp/servlet/velocity/footer.vm")
+
 		</div>
 	</body>
 </html>

diff --git a/src/java/azkaban/webapp/servlet/velocity/schedulepanel.vm b/src/java/azkaban/webapp/servlet/velocity/schedulepanel.vm
index 1f54c5d..b3a72b4 100644
--- a/src/java/azkaban/webapp/servlet/velocity/schedulepanel.vm
+++ b/src/java/azkaban/webapp/servlet/velocity/schedulepanel.vm
@@ -14,52 +14,72 @@
  * the License.
 *#
 
-<script type="text/javascript" src="${context}/js/azkaban.date.utils.js"></script>  
-<script type="text/javascript" src="${context}/js/azkaban.schedule.panel.view.js"></script>
-
-<div id="scheduleModalBackground" class="modalBackground3">
-	<div id="schedule-panel-top">
-		<div id="schedule-panel" class="modal">
-			<a href='#' title='Close' class='modal-close closeSchedule'>x</a>
-			<h3>Schedule Flow Options</h3>
-
-			<div id="scheduleInfo">
-				<dl>
-					<dt>Schedule Time</dt>
-					<dd>
-						<input id="hour" type="text" size="2" value="12"/>
-						<input id="minutes" type="text" size="2" value="00"/>
-						<select id="am_pm">
-						  <option>pm</option>
-						  <option>am</option>
-						</select>
-						<select id="timezone">
-						  <option>${timezone}</option>
-						  <option>UTC</option>
-						</select>
-					</dd>
-					<dt>Schedule Date</dt><dd><input type="text" id="datepicker" /></dd>
-					<dt>Recurrence</dt>
-					<dd>
-						<input id="is_recurring" type="checkbox" checked  />
-						<span>repeat every</span>
-					 	<input id="period" type="text" size="2" value="1"/>
-						<select id="period_units">
-						  <option value="d">Days</option>
-						  <option value="h">Hours</option>
-						  <option value="m">Minutes</option>
-						  <option value="M">Months</option>
-						  <option value="w">Weeks</option>
-						</select>
-					</dd>
-				</dl>
-			</div>
-	
-
-			<div class="actions">
-				<a class="yes btn1" id="schedule-button" href="#">Schedule</a>
-				<a class="no simplemodal-close btn3 closeSchedule" id="cancel-schedule-btn" href="#">Cancel</a>
+			<script type="text/javascript" src="${context}/js/azkaban.date.utils.js"></script>  
+			<script type="text/javascript" src="${context}/js/azkaban.schedule.panel.view.js"></script>
+			
+			<div class="modal fade" id="schedule-modal">
+				<div class="modal-dialog">
+					<div class="modal-content">
+						<div class="modal-header">
+							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+							<h4 class="modal-title">Schedule Flow Options</h4>
+						</div><!-- /modal-header -->
+						<div class="modal-body">
+							<fieldset>
+								<div class="form-group">
+									<label>Schedule Time</label>
+									<div class="form-inline">
+										<div class="form-group">
+											<input id="hour" type="text" size="2" value="12" class="form-control">
+										</div>
+										<div class="form-group">
+											<input id="minutes" type="text" size="2" value="00" class="form-control">
+										</div>
+										<div class="form-group">
+											<select id="am_pm" class="form-control">
+												<option>pm</option>
+												<option>am</option>
+											</select>
+										</div>
+										<div class="form-group">
+											<select id="timezone" class="form-control">
+												<option>${timezone}</option>
+												<option>UTC</option>
+											</select>
+										</div>
+									</div>
+								</div>
+								<div class="form-group">
+									<label>Schedule Date</label>
+									<input type="text" id="datepicker" class="form-control">
+								</div>
+								<div class="form-group">
+									<label>Recurrence</label>
+									<div class="form-inline">
+										<div class="checkbox">
+											<input id="is_recurring" type="checkbox" checked="checked">
+											<label>repeat every</label>
+										</div>
+										<div class="form-group">
+											<input id="period" type="text" size="2" value="1" class="form-control">
+										</div>
+										<div class="form-group">
+											<select id="period_units" class="form-control">
+												<option value="d">Days</option>
+												<option value="h">Hours</option>
+												<option value="m">Minutes</option>
+												<option value="M">Months</option>
+												<option value="w">Weeks</option>
+											</select>
+										</div>
+									</div>
+								</div>
+							</fieldset>
+						</div>
+						<div class="modal-footer">
+							<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+							<button type="button" class="btn btn-primary" id="schedule-button">Schedule</button>
+						</div>
+					</div>
+				</div>
 			</div>
-		</div>
-	</div>
-</div>

diff --git a/src/java/azkaban/webapp/servlet/velocity/style2.vm b/src/java/azkaban/webapp/servlet/velocity/style2.vm
new file mode 100644
index 0000000..6f65f36
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/style2.vm
@@ -0,0 +1,30 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+
+    <meta charset="utf-8">
+    <title>#appname()</title>
+    
+		<link rel="shortcut icon" href="${context}/favicon.ico" />
+    <!-- Bootstrap core CSS -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/bootstrap-fileinput.css" rel="stylesheet">
+    <link href="/css/bootstrap-azkaban.css" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="/js/html5shiv.js"></script>
+      <script src="/js/respond.min.js"></script>
+    <![endif]-->

diff --git a/src/java/azkaban/webapp/servlet/velocity/title2.vm b/src/java/azkaban/webapp/servlet/velocity/title2.vm
new file mode 100644
index 0000000..a6a8d01
--- /dev/null
+++ b/src/java/azkaban/webapp/servlet/velocity/title2.vm
@@ -0,0 +1,16 @@
+#*
+ * Copyright 2012 LinkedIn Corp.
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not
+ * use this file except in compliance with the License. You may obtain a copy of
+ * the License at
+ * 
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations under
+ * the License.
+*#
+					<a class="navbar-brand" href="${context}/"><strong>Azkaban</strong> ${azkaban_name} <small>${azkaban_label}</small></a> 

diff --git a/src/package/execserver/bin/azkaban-executor-start.sh b/src/package/execserver/bin/azkaban-executor-start.sh
index f6313f7..5245714 100755
--- a/src/package/execserver/bin/azkaban-executor-start.sh
+++ b/src/package/execserver/bin/azkaban-executor-start.sh
@@ -1,3 +1,5 @@
+#!/bin/bash
+
 azkaban_dir=$(dirname $0)/..
 
 if [[ -z "$tmpdir" ]]; then

diff --git a/src/package/execserver/bin/start-exec.sh b/src/package/execserver/bin/start-exec.sh
index f44b2ec..fbb7124 100644
--- a/src/package/execserver/bin/start-exec.sh
+++ b/src/package/execserver/bin/start-exec.sh
@@ -1,3 +1,5 @@
+#!/bin/bash
+
 base_dir=$(dirname $0)/..
 
 bin/azkaban-executor-start.sh $base_dir 2>&1>logs/executorServerLog__`date +%F+%T`.out &

diff --git a/src/package/soloserver/bin/azkaban-solo-start.sh b/src/package/soloserver/bin/azkaban-solo-start.sh
index 32e3054..54ac8d9 100755
--- a/src/package/soloserver/bin/azkaban-solo-start.sh
+++ b/src/package/soloserver/bin/azkaban-solo-start.sh
@@ -1,3 +1,5 @@
+#!/bin/bash
+
 azkaban_dir=$(dirname $0)/..
 
 if [[ -z "$tmpdir" ]]; then

diff --git a/src/package/triggerserver/bin/azkaban-trigger-start.sh b/src/package/triggerserver/bin/azkaban-trigger-start.sh
index 00e1077..64daa9b 100755
--- a/src/package/triggerserver/bin/azkaban-trigger-start.sh
+++ b/src/package/triggerserver/bin/azkaban-trigger-start.sh
@@ -1,3 +1,5 @@
+#!/bin/bash
+
 azkaban_dir=$(dirname $0)/..
 
 if [[ -z "$tmpdir" ]]; then

diff --git a/src/package/webserver/bin/azkaban-web-start.sh b/src/package/webserver/bin/azkaban-web-start.sh
index fd16e47..b0604fd 100755
--- a/src/package/webserver/bin/azkaban-web-start.sh
+++ b/src/package/webserver/bin/azkaban-web-start.sh
@@ -1,3 +1,5 @@
+#!/bin/bash
+
 azkaban_dir=$(dirname $0)/..
 
 if [[ -z "$tmpdir" ]]; then

diff --git a/src/package/webserver/bin/start-web.sh b/src/package/webserver/bin/start-web.sh
index 30d43fa..b063aaa 100644
--- a/src/package/webserver/bin/start-web.sh
+++ b/src/package/webserver/bin/start-web.sh
@@ -1,3 +1,5 @@
+#!/bin/bash
+
 base_dir=$(dirname $0)/..
 
 bin/azkaban-web-start.sh $base_dir 2>&1>logs/webServerLog_`date +%F+%T`.out &

diff --git a/src/tl/flowsummary.tl b/src/tl/flowsummary.tl
new file mode 100644
index 0000000..85c9a99
--- /dev/null
+++ b/src/tl/flowsummary.tl
@@ -0,0 +1,209 @@
+					<div class="panel panel-default">
+						<div class="panel-heading">General</div>
+						<table class="table table-striped table-bordered table-condensed table-hover">
+							<tbody>
+								<tr>
+									<td class="worksheet-key">Workflow name</td>
+									<td>{general.flowId}</td>
+								</tr>
+								<tr class="editRow">
+									<td class="worksheet-key">Workflow Purpose/Description</td>
+									<td class="editable"><span class="spanValue">{general.flowDescription}</span></td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Project name</td>
+									<td>{general.projectName}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Name of scheduled item</td>
+									<td>{general.flowId}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Workflow Hadoop User Name</td>
+									<td>{general.user}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Responsible team</td>
+									<td class="editable"><span class="spanValue">{general.team}</span></td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Responsible manager</td>
+									<td class="editable"><span class="spanValue">{general.manager}</span></td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Responsible Developer</td>
+									<td class="editable"><span class="spanValue">{general.developer}</span></td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Hadoop APIs Used</td>
+									<td>{general.apis}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Additional Hadoop APIs Used</td>
+									<td>{general.additionalApis}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Streaming Languages Used</td>
+									<td>{general.streamingLanguages}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Code Repository</td>
+									<td>{general.codeRepository}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Does this workflow perform any second, third, or higher level connection graph calculations?</td>
+									<td>{general.higherLevelGraphOperations}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Can this workflow be run with an empty <strong>/jobs</strong> directory</td>
+									<td>{general.emptyJobsDirectory}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">If not, why not?</td>
+									<td>{general.emptyJobsDirectoryReason}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">How does the result get to front-end servers?</td>
+									<td>{general.toFrontEnd}</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Scheduling</div>
+						<table class="table table-striped table-bordered table-condensed table-hover">
+							<tbody>
+								<tr>
+									<td class="worksheet-key">Max Map Slots from Largest Job</td>
+									<td>{scheduling.maxMapSlots}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Max Reduce Slots from Largest Job</td>
+									<td>{scheduling.maxReduceSlots}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Total Reduce Slots from All Jobs</td>
+									<td>{scheduling.totalReduceSlots}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Total Number of Jobs</td>
+									<td>{scheduling.numJobs}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Longest Task Time</td>
+									<td>{scheduling.longestTaskTime}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Required Schedule</td>
+									<td>{scheduling.schedule}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Launch Time</td>
+									<td>{scheduling.launchTime}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Total Workflow Run Time (hours)</td>
+									<td>{scheduling.totalFlowTime}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Expected Time of Completion</td>
+									<td>{scheduling.expectedCompletionTime}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Max Permitted Delay</td>
+									<td>{scheduling.maxPermittedDelay}</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Resources</div>
+						<table class="table table-striped table-bordered table-condensed table-hover">
+							<tbody>
+								<tr>
+									<td class="worksheet-key">Is any of the code specifically multi-threaded?</td>
+									<td colspan="3">{resources.multithreaded}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Do you 'fat jar' any hadoop-core jars?</td>
+									<td colspan="3">{resources.fatJar}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Which job has the largest spill count?</td>
+									<td>{resources.largestSpill.job}</td>
+									<td class="worksheet-key">Largest spill count for any given task?</td>
+									<td>{resources.largestSpill.count}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Is there a distributed cache in use?</td>
+									<td>{resources.distributedCache.using}</td>
+									<td class="worksheet-key">How big is the distributed cache?</td>
+									<td>{resources.distributedCache.size}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Size of largest <code>-Xmx</code> value?</td>
+									<td>{resources.largestXmx.size}</td>
+									<td class="worksheet-key">If this is above 1G, please explain why</td>
+									<td>{resources.largestXmx.reason}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Do any jobs use <code>-Xms</code>?</td>
+									<td>{resources.xms.using}</td>
+									<td class="worksheet-key">If so, why?</td>
+									<td>{resources.xms.reason}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Is <em>intermediate compression</em> specifically turned on?</td>
+									<td>{resources.intermediateCompression.on}</td>
+									<td class="worksheet-key">If so, which codec</td>
+									<td>{resources.intermediateCompression.codec}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Are there combiners in use?</td>
+									<td colspan="3">{resources.combiners}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Size of largest <code>mapred.job.map.memory.mb</code></td>
+									<td>{resources.largestMapredJobMapMemoryMb.size}</td>
+									<td class="worksheet-key">Used by job</td>
+									<td>{resources.largestMapredJobMapMemoryMb.job}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Size of largest <code>mapred.job.reduce.memory.mb</code></td>
+									<td>{resources.largestMapredJobReduceMemoryMb.size}</td>
+									<td class="worksheet-key">Used by job</td>
+									<td>{resources.largestMapredJobMapMemoryMb.job}</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+
+					<div class="panel panel-default">
+						<div class="panel-heading">Input/Output</div>
+						<table class="table table-striped table-bordered table-condensed table-hover">
+							<tbody>
+								<tr>
+									<td class="worksheet-key">List of input HDFS file paths</td>
+									<td>{io.hdfsPaths}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Number of files generated (hadoop dfs -count)</td>
+									<td>{io.hdfsFileCount}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Average size of files generated in GB</td>
+									<td>{io.averageFileSize}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Size of intermediate data (content of /jobs - output going to production) in GB on HDFS</td>
+									<td>{io.intermediateFileSize}</td>
+								</tr>
+								<tr>
+									<td class="worksheet-key">Size of final output data in GB on HDFS</td>
+									<td>{io.finalOutputSize}</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>

diff --git a/src/web/css/azkaban-svg.css b/src/web/css/azkaban-svg.css
new file mode 100644
index 0000000..78a4625
--- /dev/null
+++ b/src/web/css/azkaban-svg.css
@@ -0,0 +1,131 @@
+svg .edge {
+	stroke: #777;
+	stroke-width: 2;
+}
+
+svg .edge:hover {
+	stroke: #009FC9;
+	stroke-width: 4;
+}
+
+svg .node.disabled {
+	opacity: 0.3;
+}
+
+svg .node .backboard {
+	fill: #FFF;
+	opacity: 0.05;
+}
+
+svg .node:hover {
+	cursor: pointer;
+}
+
+svg .node:hover .backboard {
+	opacity: 0.7;
+}
+
+svg .selected .backboard {
+	opacity: 0.4;
+}
+
+svg .node circle {
+	fill: #888;
+	stroke: #777;
+	stroke-width: 2;
+}
+
+svg .node:hover circle {
+	stroke: #009FC9;
+}
+
+svg .node:hover text {
+	fill: #009FC9;
+}
+
+svg .selected text {
+	fill: #338AB0;
+}
+
+svg .selected circle {
+	stroke: #009FC9;
+	stroke-width: 4;
+}
+
+svg .READY circle {
+	fill: #CCC;
+}
+
+svg .RUNNING circle {
+	fill: #009FC9;
+}
+
+svg .QUEUED circle {
+	opacity: 0.5;
+	fill: #009FC9;
+}
+
+svg .FAILED circle {
+	fill: #CC0000;
+}
+
+svg .KILLED circle {
+	fill: #CC0000;
+}
+
+svg .SUCCEEDED circle {
+	fill: #00CC33;
+}
+
+svg .DISABLED circle {
+	opacity: 0.3;
+}
+
+svg .SKIPPED circle {
+	opacity: 0.3;
+}
+
+#Used for charts
+svg circle.READY {
+	stroke: #CCC;
+	stroke-width: 2px;
+	fill: #FFF;
+}
+
+svg circle.RUNNING {
+	stroke: #009FC9;
+	stroke-width: 2px;
+	fill: #FFF;
+}
+
+svg circle.FAILED {
+	stroke: #CC0000;
+	stroke-width: 2px;
+	fill: #FFF;
+}
+
+svg circle.KILLED {
+	stroke: #CC0000;
+	stroke-width: 2px;
+	fill: #FFF;
+}
+
+svg circle.SUCCEEDED {
+	stroke: #00CC33;
+	stroke-width: 2px;
+	fill: #FFF;
+}
+
+svg circle.DISABLED {
+	stroke: #CCC;
+	opacity: 0.3;
+	stroke-width: 2px;
+	fill: #FFF;
+}
+
+svg circle.SKIPPED {
+	stroke: #CCC;
+	opacity: 0.3;
+	stroke-width: 2px;
+	fill: #FFF;
+}

diff --git a/src/web/css/bootstrap.css b/src/web/css/bootstrap.css
new file mode 100644
index 0000000..6aef1f6
--- /dev/null
+++ b/src/web/css/bootstrap.css
@@ -0,0 +1,7098 @@
+/*!
+ * Bootstrap v3.0.2 by @fat and @mdo
+ * Copyright 2013 Twitter, Inc.
+ * Licensed under http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Designed and built with all the love in the world by @mdo and @fat.
+ */
+
+/*! normalize.css v2.1.3 | MIT License | git.io/normalize */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section,
+summary {
+  display: block;
+}
+
+audio,
+canvas,
+video {
+  display: inline-block;
+}
+
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+
+[hidden],
+template {
+  display: none;
+}
+
+html {
+  font-family: sans-serif;
+  -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+}
+
+body {
+  margin: 0;
+}
+
+a {
+  background: transparent;
+}
+
+a:focus {
+  outline: thin dotted;
+}
+
+a:active,
+a:hover {
+  outline: 0;
+}
+
+h1 {
+  margin: 0.67em 0;
+  font-size: 2em;
+}
+
+abbr[title] {
+  border-bottom: 1px dotted;
+}
+
+b,
+strong {
+  font-weight: bold;
+}
+
+dfn {
+  font-style: italic;
+}
+
+hr {
+  height: 0;
+  -moz-box-sizing: content-box;
+       box-sizing: content-box;
+}
+
+mark {
+  color: #000;
+  background: #ff0;
+}
+
+code,
+kbd,
+pre,
+samp {
+  font-family: monospace, serif;
+  font-size: 1em;
+}
+
+pre {
+  white-space: pre-wrap;
+}
+
+q {
+  quotes: "\201C" "\201D" "\2018" "\2019";
+}
+
+small {
+  font-size: 80%;
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 75%;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sup {
+  top: -0.5em;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+img {
+  border: 0;
+}
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+figure {
+  margin: 0;
+}
+
+fieldset {
+  padding: 0.35em 0.625em 0.75em;
+  margin: 0 2px;
+  border: 1px solid #c0c0c0;
+}
+
+legend {
+  padding: 0;
+  border: 0;
+}
+
+button,
+input,
+select,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: 100%;
+}
+
+button,
+input {
+  line-height: normal;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+button,
+html input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+  cursor: pointer;
+  -webkit-appearance: button;
+}
+
+button[disabled],
+html input[disabled] {
+  cursor: default;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+  padding: 0;
+  box-sizing: border-box;
+}
+
+input[type="search"] {
+  -webkit-box-sizing: content-box;
+     -moz-box-sizing: content-box;
+          box-sizing: content-box;
+  -webkit-appearance: textfield;
+}
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  padding: 0;
+  border: 0;
+}
+
+textarea {
+  overflow: auto;
+  vertical-align: top;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+@media print {
+  * {
+    color: #000 !important;
+    text-shadow: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+  }
+  a,
+  a:visited {
+    text-decoration: underline;
+  }
+  a[href]:after {
+    content: " (" attr(href) ")";
+  }
+  abbr[title]:after {
+    content: " (" attr(title) ")";
+  }
+  a[href^="javascript:"]:after,
+  a[href^="#"]:after {
+    content: "";
+  }
+  pre,
+  blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid;
+  }
+  thead {
+    display: table-header-group;
+  }
+  tr,
+  img {
+    page-break-inside: avoid;
+  }
+  img {
+    max-width: 100% !important;
+  }
+  @page  {
+    margin: 2cm .5cm;
+  }
+  p,
+  h2,
+  h3 {
+    orphans: 3;
+    widows: 3;
+  }
+  h2,
+  h3 {
+    page-break-after: avoid;
+  }
+  select {
+    background: #fff !important;
+  }
+  .navbar {
+    display: none;
+  }
+  .table td,
+  .table th {
+    background-color: #fff !important;
+  }
+  .btn > .caret,
+  .dropup > .btn > .caret {
+    border-top-color: #000 !important;
+  }
+  .label {
+    border: 1px solid #000;
+  }
+  .table {
+    border-collapse: collapse !important;
+  }
+  .table-bordered th,
+  .table-bordered td {
+    border: 1px solid #ddd !important;
+  }
+}
+
+*,
+*:before,
+*:after {
+  -webkit-box-sizing: border-box;
+     -moz-box-sizing: border-box;
+          box-sizing: border-box;
+}
+
+html {
+  font-size: 62.5%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+body {
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  line-height: 1.428571429;
+  color: #333333;
+  background-color: #ffffff;
+}
+
+input,
+button,
+select,
+textarea {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+a {
+  color: #428bca;
+  text-decoration: none;
+}
+
+a:hover,
+a:focus {
+  color: #2a6496;
+  text-decoration: underline;
+}
+
+a:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+img {
+  vertical-align: middle;
+}
+
+.img-responsive {
+  display: block;
+  height: auto;
+  max-width: 100%;
+}
+
+.img-rounded {
+  border-radius: 6px;
+}
+
+.img-thumbnail {
+  display: inline-block;
+  height: auto;
+  max-width: 100%;
+  padding: 4px;
+  line-height: 1.428571429;
+  background-color: #ffffff;
+  border: 1px solid #dddddd;
+  border-radius: 4px;
+  -webkit-transition: all 0.2s ease-in-out;
+          transition: all 0.2s ease-in-out;
+}
+
+.img-circle {
+  border-radius: 50%;
+}
+
+hr {
+  margin-top: 20px;
+  margin-bottom: 20px;
+  border: 0;
+  border-top: 1px solid #eeeeee;
+}
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  border: 0;
+}
+
+p {
+  margin: 0 0 10px;
+}
+
+.lead {
+  margin-bottom: 20px;
+  font-size: 16px;
+  font-weight: 200;
+  line-height: 1.4;
+}
+
+@media (min-width: 768px) {
+  .lead {
+    font-size: 21px;
+  }
+}
+
+small,
+.small {
+  font-size: 85%;
+}
+
+cite {
+  font-style: normal;
+}
+
+.text-muted {
+  color: #999999;
+}
+
+.text-primary {
+  color: #428bca;
+}
+
+.text-primary:hover {
+  color: #3071a9;
+}
+
+.text-warning {
+  color: #c09853;
+}
+
+.text-warning:hover {
+  color: #a47e3c;
+}
+
+.text-danger {
+  color: #b94a48;
+}
+
+.text-danger:hover {
+  color: #953b39;
+}
+
+.text-success {
+  color: #468847;
+}
+
+.text-success:hover {
+  color: #356635;
+}
+
+.text-info {
+  color: #3a87ad;
+}
+
+.text-info:hover {
+  color: #2d6987;
+}
+
+.text-left {
+  text-align: left;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.text-center {
+  text-align: center;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6 {
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 500;
+  line-height: 1.1;
+  color: inherit;
+}
+
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small,
+.h1 small,
+.h2 small,
+.h3 small,
+.h4 small,
+.h5 small,
+.h6 small,
+h1 .small,
+h2 .small,
+h3 .small,
+h4 .small,
+h5 .small,
+h6 .small,
+.h1 .small,
+.h2 .small,
+.h3 .small,
+.h4 .small,
+.h5 .small,
+.h6 .small {
+  font-weight: normal;
+  line-height: 1;
+  color: #999999;
+}
+
+h1,
+h2,
+h3 {
+  margin-top: 20px;
+  margin-bottom: 10px;
+}
+
+h1 small,
+h2 small,
+h3 small,
+h1 .small,
+h2 .small,
+h3 .small {
+  font-size: 65%;
+}
+
+h4,
+h5,
+h6 {
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
+h4 small,
+h5 small,
+h6 small,
+h4 .small,
+h5 .small,
+h6 .small {
+  font-size: 75%;
+}
+
+h1,
+.h1 {
+  font-size: 36px;
+}
+
+h2,
+.h2 {
+  font-size: 30px;
+}
+
+h3,
+.h3 {
+  font-size: 24px;
+}
+
+h4,
+.h4 {
+  font-size: 18px;
+}
+
+h5,
+.h5 {
+  font-size: 14px;
+}
+
+h6,
+.h6 {
+  font-size: 12px;
+}
+
+.page-header {
+  padding-bottom: 9px;
+  margin: 40px 0 20px;
+  border-bottom: 1px solid #eeeeee;
+}
+
+ul,
+ol {
+  margin-top: 0;
+  margin-bottom: 10px;
+}
+
+ul ul,
+ol ul,
+ul ol,
+ol ol {
+  margin-bottom: 0;
+}
+
+.list-unstyled {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-inline {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-inline > li {
+  display: inline-block;
+  padding-right: 5px;
+  padding-left: 5px;
+}
+
+.list-inline > li:first-child {
+  padding-left: 0;
+}
+
+dl {
+  margin-bottom: 20px;
+}
+
+dt,
+dd {
+  line-height: 1.428571429;
+}
+
+dt {
+  font-weight: bold;
+}
+
+dd {
+  margin-left: 0;
+}
+
+@media (min-width: 768px) {
+  .dl-horizontal dt {
+    float: left;
+    width: 160px;
+    overflow: hidden;
+    clear: left;
+    text-align: right;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .dl-horizontal dd {
+    margin-left: 180px;
+  }
+  .dl-horizontal dd:before,
+  .dl-horizontal dd:after {
+    display: table;
+    content: " ";
+  }
+  .dl-horizontal dd:after {
+    clear: both;
+  }
+  .dl-horizontal dd:before,
+  .dl-horizontal dd:after {
+    display: table;
+    content: " ";
+  }
+  .dl-horizontal dd:after {
+    clear: both;
+  }
+}
+
+abbr[title],
+abbr[data-original-title] {
+  cursor: help;
+  border-bottom: 1px dotted #999999;
+}
+
+abbr.initialism {
+  font-size: 90%;
+  text-transform: uppercase;
+}
+
+blockquote {
+  padding: 10px 20px;
+  margin: 0 0 20px;
+  border-left: 5px solid #eeeeee;
+}
+
+blockquote p {
+  font-size: 17.5px;
+  font-weight: 300;
+  line-height: 1.25;
+}
+
+blockquote p:last-child {
+  margin-bottom: 0;
+}
+
+blockquote small {
+  display: block;
+  line-height: 1.428571429;
+  color: #999999;
+}
+
+blockquote small:before {
+  content: '\2014 \00A0';
+}
+
+blockquote.pull-right {
+  padding-right: 15px;
+  padding-left: 0;
+  border-right: 5px solid #eeeeee;
+  border-left: 0;
+}
+
+blockquote.pull-right p,
+blockquote.pull-right small,
+blockquote.pull-right .small {
+  text-align: right;
+}
+
+blockquote.pull-right small:before,
+blockquote.pull-right .small:before {
+  content: '';
+}
+
+blockquote.pull-right small:after,
+blockquote.pull-right .small:after {
+  content: '\00A0 \2014';
+}
+
+blockquote:before,
+blockquote:after {
+  content: "";
+}
+
+address {
+  margin-bottom: 20px;
+  font-style: normal;
+  line-height: 1.428571429;
+}
+
+code,
+kbd,
+pre,
+samp {
+  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+}
+
+code {
+  padding: 2px 4px;
+  font-size: 90%;
+  color: #c7254e;
+  white-space: nowrap;
+  background-color: #f9f2f4;
+  border-radius: 4px;
+}
+
+pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-size: 13px;
+  line-height: 1.428571429;
+  color: #333333;
+  word-break: break-all;
+  word-wrap: break-word;
+  background-color: #f5f5f5;
+  border: 1px solid #cccccc;
+  border-radius: 4px;
+}
+
+pre code {
+  padding: 0;
+  font-size: inherit;
+  color: inherit;
+  white-space: pre-wrap;
+  background-color: transparent;
+  border-radius: 0;
+}
+
+.pre-scrollable {
+  max-height: 340px;
+  overflow-y: scroll;
+}
+
+.container {
+  padding-right: 15px;
+  padding-left: 15px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+.container:before,
+.container:after {
+  display: table;
+  content: " ";
+}
+
+.container:after {
+  clear: both;
+}
+
+.container:before,
+.container:after {
+  display: table;
+  content: " ";
+}
+
+.container:after {
+  clear: both;
+}
+
+.row {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+
+.row:before,
+.row:after {
+  display: table;
+  content: " ";
+}
+
+.row:after {
+  clear: both;
+}
+
+.row:before,
+.row:after {
+  display: table;
+  content: " ";
+}
+
+.row:after {
+  clear: both;
+}
+
+.col-xs-1,
+.col-sm-1,
+.col-md-1,
+.col-lg-1,
+.col-xs-2,
+.col-sm-2,
+.col-md-2,
+.col-lg-2,
+.col-xs-3,
+.col-sm-3,
+.col-md-3,
+.col-lg-3,
+.col-xs-4,
+.col-sm-4,
+.col-md-4,
+.col-lg-4,
+.col-xs-5,
+.col-sm-5,
+.col-md-5,
+.col-lg-5,
+.col-xs-6,
+.col-sm-6,
+.col-md-6,
+.col-lg-6,
+.col-xs-7,
+.col-sm-7,
+.col-md-7,
+.col-lg-7,
+.col-xs-8,
+.col-sm-8,
+.col-md-8,
+.col-lg-8,
+.col-xs-9,
+.col-sm-9,
+.col-md-9,
+.col-lg-9,
+.col-xs-10,
+.col-sm-10,
+.col-md-10,
+.col-lg-10,
+.col-xs-11,
+.col-sm-11,
+.col-md-11,
+.col-lg-11,
+.col-xs-12,
+.col-sm-12,
+.col-md-12,
+.col-lg-12 {
+  position: relative;
+  min-height: 1px;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11 {
+  float: left;
+}
+
+.col-xs-12 {
+  width: 100%;
+}
+
+.col-xs-11 {
+  width: 91.66666666666666%;
+}
+
+.col-xs-10 {
+  width: 83.33333333333334%;
+}
+
+.col-xs-9 {
+  width: 75%;
+}
+
+.col-xs-8 {
+  width: 66.66666666666666%;
+}
+
+.col-xs-7 {
+  width: 58.333333333333336%;
+}
+
+.col-xs-6 {
+  width: 50%;
+}
+
+.col-xs-5 {
+  width: 41.66666666666667%;
+}
+
+.col-xs-4 {
+  width: 33.33333333333333%;
+}
+
+.col-xs-3 {
+  width: 25%;
+}
+
+.col-xs-2 {
+  width: 16.666666666666664%;
+}
+
+.col-xs-1 {
+  width: 8.333333333333332%;
+}
+
+.col-xs-pull-12 {
+  right: 100%;
+}
+
+.col-xs-pull-11 {
+  right: 91.66666666666666%;
+}
+
+.col-xs-pull-10 {
+  right: 83.33333333333334%;
+}
+
+.col-xs-pull-9 {
+  right: 75%;
+}
+
+.col-xs-pull-8 {
+  right: 66.66666666666666%;
+}
+
+.col-xs-pull-7 {
+  right: 58.333333333333336%;
+}
+
+.col-xs-pull-6 {
+  right: 50%;
+}
+
+.col-xs-pull-5 {
+  right: 41.66666666666667%;
+}
+
+.col-xs-pull-4 {
+  right: 33.33333333333333%;
+}
+
+.col-xs-pull-3 {
+  right: 25%;
+}
+
+.col-xs-pull-2 {
+  right: 16.666666666666664%;
+}
+
+.col-xs-pull-1 {
+  right: 8.333333333333332%;
+}
+
+.col-xs-pull-0 {
+  right: 0;
+}
+
+.col-xs-push-12 {
+  left: 100%;
+}
+
+.col-xs-push-11 {
+  left: 91.66666666666666%;
+}
+
+.col-xs-push-10 {
+  left: 83.33333333333334%;
+}
+
+.col-xs-push-9 {
+  left: 75%;
+}
+
+.col-xs-push-8 {
+  left: 66.66666666666666%;
+}
+
+.col-xs-push-7 {
+  left: 58.333333333333336%;
+}
+
+.col-xs-push-6 {
+  left: 50%;
+}
+
+.col-xs-push-5 {
+  left: 41.66666666666667%;
+}
+
+.col-xs-push-4 {
+  left: 33.33333333333333%;
+}
+
+.col-xs-push-3 {
+  left: 25%;
+}
+
+.col-xs-push-2 {
+  left: 16.666666666666664%;
+}
+
+.col-xs-push-1 {
+  left: 8.333333333333332%;
+}
+
+.col-xs-push-0 {
+  left: 0;
+}
+
+.col-xs-offset-12 {
+  margin-left: 100%;
+}
+
+.col-xs-offset-11 {
+  margin-left: 91.66666666666666%;
+}
+
+.col-xs-offset-10 {
+  margin-left: 83.33333333333334%;
+}
+
+.col-xs-offset-9 {
+  margin-left: 75%;
+}
+
+.col-xs-offset-8 {
+  margin-left: 66.66666666666666%;
+}
+
+.col-xs-offset-7 {
+  margin-left: 58.333333333333336%;
+}
+
+.col-xs-offset-6 {
+  margin-left: 50%;
+}
+
+.col-xs-offset-5 {
+  margin-left: 41.66666666666667%;
+}
+
+.col-xs-offset-4 {
+  margin-left: 33.33333333333333%;
+}
+
+.col-xs-offset-3 {
+  margin-left: 25%;
+}
+
+.col-xs-offset-2 {
+  margin-left: 16.666666666666664%;
+}
+
+.col-xs-offset-1 {
+  margin-left: 8.333333333333332%;
+}
+
+.col-xs-offset-0 {
+  margin-left: 0;
+}
+
+@media (min-width: 768px) {
+  .container {
+    width: 750px;
+  }
+  .col-sm-1,
+  .col-sm-2,
+  .col-sm-3,
+  .col-sm-4,
+  .col-sm-5,
+  .col-sm-6,
+  .col-sm-7,
+  .col-sm-8,
+  .col-sm-9,
+  .col-sm-10,
+  .col-sm-11 {
+    float: left;
+  }
+  .col-sm-12 {
+    width: 100%;
+  }
+  .col-sm-11 {
+    width: 91.66666666666666%;
+  }
+  .col-sm-10 {
+    width: 83.33333333333334%;
+  }
+  .col-sm-9 {
+    width: 75%;
+  }
+  .col-sm-8 {
+    width: 66.66666666666666%;
+  }
+  .col-sm-7 {
+    width: 58.333333333333336%;
+  }
+  .col-sm-6 {
+    width: 50%;
+  }
+  .col-sm-5 {
+    width: 41.66666666666667%;
+  }
+  .col-sm-4 {
+    width: 33.33333333333333%;
+  }
+  .col-sm-3 {
+    width: 25%;
+  }
+  .col-sm-2 {
+    width: 16.666666666666664%;
+  }
+  .col-sm-1 {
+    width: 8.333333333333332%;
+  }
+  .col-sm-pull-12 {
+    right: 100%;
+  }
+  .col-sm-pull-11 {
+    right: 91.66666666666666%;
+  }
+  .col-sm-pull-10 {
+    right: 83.33333333333334%;
+  }
+  .col-sm-pull-9 {
+    right: 75%;
+  }
+  .col-sm-pull-8 {
+    right: 66.66666666666666%;
+  }
+  .col-sm-pull-7 {
+    right: 58.333333333333336%;
+  }
+  .col-sm-pull-6 {
+    right: 50%;
+  }
+  .col-sm-pull-5 {
+    right: 41.66666666666667%;
+  }
+  .col-sm-pull-4 {
+    right: 33.33333333333333%;
+  }
+  .col-sm-pull-3 {
+    right: 25%;
+  }
+  .col-sm-pull-2 {
+    right: 16.666666666666664%;
+  }
+  .col-sm-pull-1 {
+    right: 8.333333333333332%;
+  }
+  .col-sm-pull-0 {
+    right: 0;
+  }
+  .col-sm-push-12 {
+    left: 100%;
+  }
+  .col-sm-push-11 {
+    left: 91.66666666666666%;
+  }
+  .col-sm-push-10 {
+    left: 83.33333333333334%;
+  }
+  .col-sm-push-9 {
+    left: 75%;
+  }
+  .col-sm-push-8 {
+    left: 66.66666666666666%;
+  }
+  .col-sm-push-7 {
+    left: 58.333333333333336%;
+  }
+  .col-sm-push-6 {
+    left: 50%;
+  }
+  .col-sm-push-5 {
+    left: 41.66666666666667%;
+  }
+  .col-sm-push-4 {
+    left: 33.33333333333333%;
+  }
+  .col-sm-push-3 {
+    left: 25%;
+  }
+  .col-sm-push-2 {
+    left: 16.666666666666664%;
+  }
+  .col-sm-push-1 {
+    left: 8.333333333333332%;
+  }
+  .col-sm-push-0 {
+    left: 0;
+  }
+  .col-sm-offset-12 {
+    margin-left: 100%;
+  }
+  .col-sm-offset-11 {
+    margin-left: 91.66666666666666%;
+  }
+  .col-sm-offset-10 {
+    margin-left: 83.33333333333334%;
+  }
+  .col-sm-offset-9 {
+    margin-left: 75%;
+  }
+  .col-sm-offset-8 {
+    margin-left: 66.66666666666666%;
+  }
+  .col-sm-offset-7 {
+    margin-left: 58.333333333333336%;
+  }
+  .col-sm-offset-6 {
+    margin-left: 50%;
+  }
+  .col-sm-offset-5 {
+    margin-left: 41.66666666666667%;
+  }
+  .col-sm-offset-4 {
+    margin-left: 33.33333333333333%;
+  }
+  .col-sm-offset-3 {
+    margin-left: 25%;
+  }
+  .col-sm-offset-2 {
+    margin-left: 16.666666666666664%;
+  }
+  .col-sm-offset-1 {
+    margin-left: 8.333333333333332%;
+  }
+  .col-sm-offset-0 {
+    margin-left: 0;
+  }
+}
+
+@media (min-width: 992px) {
+  .container {
+    width: 970px;
+  }
+  .col-md-1,
+  .col-md-2,
+  .col-md-3,
+  .col-md-4,
+  .col-md-5,
+  .col-md-6,
+  .col-md-7,
+  .col-md-8,
+  .col-md-9,
+  .col-md-10,
+  .col-md-11 {
+    float: left;
+  }
+  .col-md-12 {
+    width: 100%;
+  }
+  .col-md-11 {
+    width: 91.66666666666666%;
+  }
+  .col-md-10 {
+    width: 83.33333333333334%;
+  }
+  .col-md-9 {
+    width: 75%;
+  }
+  .col-md-8 {
+    width: 66.66666666666666%;
+  }
+  .col-md-7 {
+    width: 58.333333333333336%;
+  }
+  .col-md-6 {
+    width: 50%;
+  }
+  .col-md-5 {
+    width: 41.66666666666667%;
+  }
+  .col-md-4 {
+    width: 33.33333333333333%;
+  }
+  .col-md-3 {
+    width: 25%;
+  }
+  .col-md-2 {
+    width: 16.666666666666664%;
+  }
+  .col-md-1 {
+    width: 8.333333333333332%;
+  }
+  .col-md-pull-12 {
+    right: 100%;
+  }
+  .col-md-pull-11 {
+    right: 91.66666666666666%;
+  }
+  .col-md-pull-10 {
+    right: 83.33333333333334%;
+  }
+  .col-md-pull-9 {
+    right: 75%;
+  }
+  .col-md-pull-8 {
+    right: 66.66666666666666%;
+  }
+  .col-md-pull-7 {
+    right: 58.333333333333336%;
+  }
+  .col-md-pull-6 {
+    right: 50%;
+  }
+  .col-md-pull-5 {
+    right: 41.66666666666667%;
+  }
+  .col-md-pull-4 {
+    right: 33.33333333333333%;
+  }
+  .col-md-pull-3 {
+    right: 25%;
+  }
+  .col-md-pull-2 {
+    right: 16.666666666666664%;
+  }
+  .col-md-pull-1 {
+    right: 8.333333333333332%;
+  }
+  .col-md-pull-0 {
+    right: 0;
+  }
+  .col-md-push-12 {
+    left: 100%;
+  }
+  .col-md-push-11 {
+    left: 91.66666666666666%;
+  }
+  .col-md-push-10 {
+    left: 83.33333333333334%;
+  }
+  .col-md-push-9 {
+    left: 75%;
+  }
+  .col-md-push-8 {
+    left: 66.66666666666666%;
+  }
+  .col-md-push-7 {
+    left: 58.333333333333336%;
+  }
+  .col-md-push-6 {
+    left: 50%;
+  }
+  .col-md-push-5 {
+    left: 41.66666666666667%;
+  }
+  .col-md-push-4 {
+    left: 33.33333333333333%;
+  }
+  .col-md-push-3 {
+    left: 25%;
+  }
+  .col-md-push-2 {
+    left: 16.666666666666664%;
+  }
+  .col-md-push-1 {
+    left: 8.333333333333332%;
+  }
+  .col-md-push-0 {
+    left: 0;
+  }
+  .col-md-offset-12 {
+    margin-left: 100%;
+  }
+  .col-md-offset-11 {
+    margin-left: 91.66666666666666%;
+  }
+  .col-md-offset-10 {
+    margin-left: 83.33333333333334%;
+  }
+  .col-md-offset-9 {
+    margin-left: 75%;
+  }
+  .col-md-offset-8 {
+    margin-left: 66.66666666666666%;
+  }
+  .col-md-offset-7 {
+    margin-left: 58.333333333333336%;
+  }
+  .col-md-offset-6 {
+    margin-left: 50%;
+  }
+  .col-md-offset-5 {
+    margin-left: 41.66666666666667%;
+  }
+  .col-md-offset-4 {
+    margin-left: 33.33333333333333%;
+  }
+  .col-md-offset-3 {
+    margin-left: 25%;
+  }
+  .col-md-offset-2 {
+    margin-left: 16.666666666666664%;
+  }
+  .col-md-offset-1 {
+    margin-left: 8.333333333333332%;
+  }
+  .col-md-offset-0 {
+    margin-left: 0;
+  }
+}
+
+@media (min-width: 1200px) {
+  .container {
+    width: 1170px;
+  }
+  .col-lg-1,
+  .col-lg-2,
+  .col-lg-3,
+  .col-lg-4,
+  .col-lg-5,
+  .col-lg-6,
+  .col-lg-7,
+  .col-lg-8,
+  .col-lg-9,
+  .col-lg-10,
+  .col-lg-11 {
+    float: left;
+  }
+  .col-lg-12 {
+    width: 100%;
+  }
+  .col-lg-11 {
+    width: 91.66666666666666%;
+  }
+  .col-lg-10 {
+    width: 83.33333333333334%;
+  }
+  .col-lg-9 {
+    width: 75%;
+  }
+  .col-lg-8 {
+    width: 66.66666666666666%;
+  }
+  .col-lg-7 {
+    width: 58.333333333333336%;
+  }
+  .col-lg-6 {
+    width: 50%;
+  }
+  .col-lg-5 {
+    width: 41.66666666666667%;
+  }
+  .col-lg-4 {
+    width: 33.33333333333333%;
+  }
+  .col-lg-3 {
+    width: 25%;
+  }
+  .col-lg-2 {
+    width: 16.666666666666664%;
+  }
+  .col-lg-1 {
+    width: 8.333333333333332%;
+  }
+  .col-lg-pull-12 {
+    right: 100%;
+  }
+  .col-lg-pull-11 {
+    right: 91.66666666666666%;
+  }
+  .col-lg-pull-10 {
+    right: 83.33333333333334%;
+  }
+  .col-lg-pull-9 {
+    right: 75%;
+  }
+  .col-lg-pull-8 {
+    right: 66.66666666666666%;
+  }
+  .col-lg-pull-7 {
+    right: 58.333333333333336%;
+  }
+  .col-lg-pull-6 {
+    right: 50%;
+  }
+  .col-lg-pull-5 {
+    right: 41.66666666666667%;
+  }
+  .col-lg-pull-4 {
+    right: 33.33333333333333%;
+  }
+  .col-lg-pull-3 {
+    right: 25%;
+  }
+  .col-lg-pull-2 {
+    right: 16.666666666666664%;
+  }
+  .col-lg-pull-1 {
+    right: 8.333333333333332%;
+  }
+  .col-lg-pull-0 {
+    right: 0;
+  }
+  .col-lg-push-12 {
+    left: 100%;
+  }
+  .col-lg-push-11 {
+    left: 91.66666666666666%;
+  }
+  .col-lg-push-10 {
+    left: 83.33333333333334%;
+  }
+  .col-lg-push-9 {
+    left: 75%;
+  }
+  .col-lg-push-8 {
+    left: 66.66666666666666%;
+  }
+  .col-lg-push-7 {
+    left: 58.333333333333336%;
+  }
+  .col-lg-push-6 {
+    left: 50%;
+  }
+  .col-lg-push-5 {
+    left: 41.66666666666667%;
+  }
+  .col-lg-push-4 {
+    left: 33.33333333333333%;
+  }
+  .col-lg-push-3 {
+    left: 25%;
+  }
+  .col-lg-push-2 {
+    left: 16.666666666666664%;
+  }
+  .col-lg-push-1 {
+    left: 8.333333333333332%;
+  }
+  .col-lg-push-0 {
+    left: 0;
+  }
+  .col-lg-offset-12 {
+    margin-left: 100%;
+  }
+  .col-lg-offset-11 {
+    margin-left: 91.66666666666666%;
+  }
+  .col-lg-offset-10 {
+    margin-left: 83.33333333333334%;
+  }
+  .col-lg-offset-9 {
+    margin-left: 75%;
+  }
+  .col-lg-offset-8 {
+    margin-left: 66.66666666666666%;
+  }
+  .col-lg-offset-7 {
+    margin-left: 58.333333333333336%;
+  }
+  .col-lg-offset-6 {
+    margin-left: 50%;
+  }
+  .col-lg-offset-5 {
+    margin-left: 41.66666666666667%;
+  }
+  .col-lg-offset-4 {
+    margin-left: 33.33333333333333%;
+  }
+  .col-lg-offset-3 {
+    margin-left: 25%;
+  }
+  .col-lg-offset-2 {
+    margin-left: 16.666666666666664%;
+  }
+  .col-lg-offset-1 {
+    margin-left: 8.333333333333332%;
+  }
+  .col-lg-offset-0 {
+    margin-left: 0;
+  }
+}
+
+table {
+  max-width: 100%;
+  background-color: transparent;
+}
+
+th {
+  text-align: left;
+}
+
+.table {
+  width: 100%;
+  margin-bottom: 20px;
+}
+
+.table > thead > tr > th,
+.table > tbody > tr > th,
+.table > tfoot > tr > th,
+.table > thead > tr > td,
+.table > tbody > tr > td,
+.table > tfoot > tr > td {
+  padding: 8px;
+  line-height: 1.428571429;
+  vertical-align: top;
+  border-top: 1px solid #dddddd;
+}
+
+.table > thead > tr > th {
+  vertical-align: bottom;
+  border-bottom: 2px solid #dddddd;
+}
+
+.table > caption + thead > tr:first-child > th,
+.table > colgroup + thead > tr:first-child > th,
+.table > thead:first-child > tr:first-child > th,
+.table > caption + thead > tr:first-child > td,
+.table > colgroup + thead > tr:first-child > td,
+.table > thead:first-child > tr:first-child > td {
+  border-top: 0;
+}
+
+.table > tbody + tbody {
+  border-top: 2px solid #dddddd;
+}
+
+.table .table {
+  background-color: #ffffff;
+}
+
+.table-condensed > thead > tr > th,
+.table-condensed > tbody > tr > th,
+.table-condensed > tfoot > tr > th,
+.table-condensed > thead > tr > td,
+.table-condensed > tbody > tr > td,
+.table-condensed > tfoot > tr > td {
+  padding: 5px;
+}
+
+.table-bordered {
+  border: 1px solid #dddddd;
+}
+
+.table-bordered > thead > tr > th,
+.table-bordered > tbody > tr > th,
+.table-bordered > tfoot > tr > th,
+.table-bordered > thead > tr > td,
+.table-bordered > tbody > tr > td,
+.table-bordered > tfoot > tr > td {
+  border: 1px solid #dddddd;
+}
+
+.table-bordered > thead > tr > th,
+.table-bordered > thead > tr > td {
+  border-bottom-width: 2px;
+}
+
+.table-striped > tbody > tr:nth-child(odd) > td,
+.table-striped > tbody > tr:nth-child(odd) > th {
+  background-color: #f9f9f9;
+}
+
+.table-hover > tbody > tr:hover > td,
+.table-hover > tbody > tr:hover > th {
+  background-color: #f5f5f5;
+}
+
+table col[class*="col-"] {
+  display: table-column;
+  float: none;
+}
+
+table td[class*="col-"],
+table th[class*="col-"] {
+  display: table-cell;
+  float: none;
+}
+
+.table > thead > tr > td.active,
+.table > tbody > tr > td.active,
+.table > tfoot > tr > td.active,
+.table > thead > tr > th.active,
+.table > tbody > tr > th.active,
+.table > tfoot > tr > th.active,
+.table > thead > tr.active > td,
+.table > tbody > tr.active > td,
+.table > tfoot > tr.active > td,
+.table > thead > tr.active > th,
+.table > tbody > tr.active > th,
+.table > tfoot > tr.active > th {
+  background-color: #f5f5f5;
+}
+
+.table > thead > tr > td.success,
+.table > tbody > tr > td.success,
+.table > tfoot > tr > td.success,
+.table > thead > tr > th.success,
+.table > tbody > tr > th.success,
+.table > tfoot > tr > th.success,
+.table > thead > tr.success > td,
+.table > tbody > tr.success > td,
+.table > tfoot > tr.success > td,
+.table > thead > tr.success > th,
+.table > tbody > tr.success > th,
+.table > tfoot > tr.success > th {
+  background-color: #dff0d8;
+}
+
+.table-hover > tbody > tr > td.success:hover,
+.table-hover > tbody > tr > th.success:hover,
+.table-hover > tbody > tr.success:hover > td,
+.table-hover > tbody > tr.success:hover > th {
+  background-color: #d0e9c6;
+}
+
+.table > thead > tr > td.danger,
+.table > tbody > tr > td.danger,
+.table > tfoot > tr > td.danger,
+.table > thead > tr > th.danger,
+.table > tbody > tr > th.danger,
+.table > tfoot > tr > th.danger,
+.table > thead > tr.danger > td,
+.table > tbody > tr.danger > td,
+.table > tfoot > tr.danger > td,
+.table > thead > tr.danger > th,
+.table > tbody > tr.danger > th,
+.table > tfoot > tr.danger > th {
+  background-color: #f2dede;
+}
+
+.table-hover > tbody > tr > td.danger:hover,
+.table-hover > tbody > tr > th.danger:hover,
+.table-hover > tbody > tr.danger:hover > td,
+.table-hover > tbody > tr.danger:hover > th {
+  background-color: #ebcccc;
+}
+
+.table > thead > tr > td.warning,
+.table > tbody > tr > td.warning,
+.table > tfoot > tr > td.warning,
+.table > thead > tr > th.warning,
+.table > tbody > tr > th.warning,
+.table > tfoot > tr > th.warning,
+.table > thead > tr.warning > td,
+.table > tbody > tr.warning > td,
+.table > tfoot > tr.warning > td,
+.table > thead > tr.warning > th,
+.table > tbody > tr.warning > th,
+.table > tfoot > tr.warning > th {
+  background-color: #fcf8e3;
+}
+
+.table-hover > tbody > tr > td.warning:hover,
+.table-hover > tbody > tr > th.warning:hover,
+.table-hover > tbody > tr.warning:hover > td,
+.table-hover > tbody > tr.warning:hover > th {
+  background-color: #faf2cc;
+}
+
+@media (max-width: 767px) {
+  .table-responsive {
+    width: 100%;
+    margin-bottom: 15px;
+    overflow-x: scroll;
+    overflow-y: hidden;
+    border: 1px solid #dddddd;
+    -ms-overflow-style: -ms-autohiding-scrollbar;
+    -webkit-overflow-scrolling: touch;
+  }
+  .table-responsive > .table {
+    margin-bottom: 0;
+  }
+  .table-responsive > .table > thead > tr > th,
+  .table-responsive > .table > tbody > tr > th,
+  .table-responsive > .table > tfoot > tr > th,
+  .table-responsive > .table > thead > tr > td,
+  .table-responsive > .table > tbody > tr > td,
+  .table-responsive > .table > tfoot > tr > td {
+    white-space: nowrap;
+  }
+  .table-responsive > .table-bordered {
+    border: 0;
+  }
+  .table-responsive > .table-bordered > thead > tr > th:first-child,
+  .table-responsive > .table-bordered > tbody > tr > th:first-child,
+  .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+  .table-responsive > .table-bordered > thead > tr > td:first-child,
+  .table-responsive > .table-bordered > tbody > tr > td:first-child,
+  .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+    border-left: 0;
+  }
+  .table-responsive > .table-bordered > thead > tr > th:last-child,
+  .table-responsive > .table-bordered > tbody > tr > th:last-child,
+  .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+  .table-responsive > .table-bordered > thead > tr > td:last-child,
+  .table-responsive > .table-bordered > tbody > tr > td:last-child,
+  .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+    border-right: 0;
+  }
+  .table-responsive > .table-bordered > tbody > tr:last-child > th,
+  .table-responsive > .table-bordered > tfoot > tr:last-child > th,
+  .table-responsive > .table-bordered > tbody > tr:last-child > td,
+  .table-responsive > .table-bordered > tfoot > tr:last-child > td {
+    border-bottom: 0;
+  }
+}
+
+fieldset {
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  display: block;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 20px;
+  font-size: 21px;
+  line-height: inherit;
+  color: #333333;
+  border: 0;
+  border-bottom: 1px solid #e5e5e5;
+}
+
+label {
+  display: inline-block;
+  margin-bottom: 5px;
+  font-weight: bold;
+}
+
+input[type="search"] {
+  -webkit-box-sizing: border-box;
+     -moz-box-sizing: border-box;
+          box-sizing: border-box;
+}
+
+input[type="radio"],
+input[type="checkbox"] {
+  margin: 4px 0 0;
+  margin-top: 1px \9;
+  /* IE8-9 */
+
+  line-height: normal;
+}
+
+input[type="file"] {
+  display: block;
+}
+
+select[multiple],
+select[size] {
+  height: auto;
+}
+
+select optgroup {
+  font-family: inherit;
+  font-size: inherit;
+  font-style: inherit;
+}
+
+input[type="file"]:focus,
+input[type="radio"]:focus,
+input[type="checkbox"]:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+input[type="number"]::-webkit-outer-spin-button,
+input[type="number"]::-webkit-inner-spin-button {
+  height: auto;
+}
+
+output {
+  display: block;
+  padding-top: 7px;
+  font-size: 14px;
+  line-height: 1.428571429;
+  color: #555555;
+  vertical-align: middle;
+}
+
+.form-control {
+  display: block;
+  width: 100%;
+  height: 34px;
+  padding: 6px 12px;
+  font-size: 14px;
+  line-height: 1.428571429;
+  color: #555555;
+  vertical-align: middle;
+  background-color: #ffffff;
+  background-image: none;
+  border: 1px solid #cccccc;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
+          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
+}
+
+.form-control:focus {
+  border-color: #66afe9;
+  outline: 0;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
+}
+
+.form-control:-moz-placeholder {
+  color: #999999;
+}
+
+.form-control::-moz-placeholder {
+  color: #999999;
+}
+
+.form-control:-ms-input-placeholder {
+  color: #999999;
+}
+
+.form-control::-webkit-input-placeholder {
+  color: #999999;
+}
+
+.form-control[disabled],
+.form-control[readonly],
+fieldset[disabled] .form-control {
+  cursor: not-allowed;
+  background-color: #eeeeee;
+}
+
+textarea.form-control {
+  height: auto;
+}
+
+.form-group {
+  margin-bottom: 15px;
+}
+
+.radio,
+.checkbox {
+  display: block;
+  min-height: 20px;
+  padding-left: 20px;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  vertical-align: middle;
+}
+
+.radio label,
+.checkbox label {
+  display: inline;
+  margin-bottom: 0;
+  font-weight: normal;
+  cursor: pointer;
+}
+
+.radio input[type="radio"],
+.radio-inline input[type="radio"],
+.checkbox input[type="checkbox"],
+.checkbox-inline input[type="checkbox"] {
+  float: left;
+  margin-left: -20px;
+}
+
+.radio + .radio,
+.checkbox + .checkbox {
+  margin-top: -5px;
+}
+
+.radio-inline,
+.checkbox-inline {
+  display: inline-block;
+  padding-left: 20px;
+  margin-bottom: 0;
+  font-weight: normal;
+  vertical-align: middle;
+  cursor: pointer;
+}
+
+.radio-inline + .radio-inline,
+.checkbox-inline + .checkbox-inline {
+  margin-top: 0;
+  margin-left: 10px;
+}
+
+input[type="radio"][disabled],
+input[type="checkbox"][disabled],
+.radio[disabled],
+.radio-inline[disabled],
+.checkbox[disabled],
+.checkbox-inline[disabled],
+fieldset[disabled] input[type="radio"],
+fieldset[disabled] input[type="checkbox"],
+fieldset[disabled] .radio,
+fieldset[disabled] .radio-inline,
+fieldset[disabled] .checkbox,
+fieldset[disabled] .checkbox-inline {
+  cursor: not-allowed;
+}
+
+.input-sm {
+  height: 30px;
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 3px;
+}
+
+select.input-sm {
+  height: 30px;
+  line-height: 30px;
+}
+
+textarea.input-sm {
+  height: auto;
+}
+
+.input-lg {
+  height: 45px;
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 6px;
+}
+
+select.input-lg {
+  height: 45px;
+  line-height: 45px;
+}
+
+textarea.input-lg {
+  height: auto;
+}
+
+.has-warning .help-block,
+.has-warning .control-label,
+.has-warning .radio,
+.has-warning .checkbox,
+.has-warning .radio-inline,
+.has-warning .checkbox-inline {
+  color: #c09853;
+}
+
+.has-warning .form-control {
+  border-color: #c09853;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+
+.has-warning .form-control:focus {
+  border-color: #a47e3c;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
+}
+
+.has-warning .input-group-addon {
+  color: #c09853;
+  background-color: #fcf8e3;
+  border-color: #c09853;
+}
+
+.has-error .help-block,
+.has-error .control-label,
+.has-error .radio,
+.has-error .checkbox,
+.has-error .radio-inline,
+.has-error .checkbox-inline {
+  color: #b94a48;
+}
+
+.has-error .form-control {
+  border-color: #b94a48;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+
+.has-error .form-control:focus {
+  border-color: #953b39;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
+}
+
+.has-error .input-group-addon {
+  color: #b94a48;
+  background-color: #f2dede;
+  border-color: #b94a48;
+}
+
+.has-success .help-block,
+.has-success .control-label,
+.has-success .radio,
+.has-success .checkbox,
+.has-success .radio-inline,
+.has-success .checkbox-inline {
+  color: #468847;
+}
+
+.has-success .form-control {
+  border-color: #468847;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+
+.has-success .form-control:focus {
+  border-color: #356635;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
+}
+
+.has-success .input-group-addon {
+  color: #468847;
+  background-color: #dff0d8;
+  border-color: #468847;
+}
+
+.form-control-static {
+  margin-bottom: 0;
+}
+
+.help-block {
+  display: block;
+  margin-top: 5px;
+  margin-bottom: 10px;
+  color: #737373;
+}
+
+@media (min-width: 768px) {
+  .form-inline .form-group {
+    display: inline-block;
+    margin-bottom: 0;
+    vertical-align: middle;
+  }
+  .form-inline .form-control {
+    display: inline-block;
+  }
+  .form-inline .radio,
+  .form-inline .checkbox {
+    display: inline-block;
+    padding-left: 0;
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .form-inline .radio input[type="radio"],
+  .form-inline .checkbox input[type="checkbox"] {
+    float: none;
+    margin-left: 0;
+  }
+}
+
+.form-horizontal .control-label,
+.form-horizontal .radio,
+.form-horizontal .checkbox,
+.form-horizontal .radio-inline,
+.form-horizontal .checkbox-inline {
+  padding-top: 7px;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.form-horizontal .form-group {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+
+.form-horizontal .form-group:before,
+.form-horizontal .form-group:after {
+  display: table;
+  content: " ";
+}
+
+.form-horizontal .form-group:after {
+  clear: both;
+}
+
+.form-horizontal .form-group:before,
+.form-horizontal .form-group:after {
+  display: table;
+  content: " ";
+}
+
+.form-horizontal .form-group:after {
+  clear: both;
+}
+
+.form-horizontal .form-control-static {
+  padding-top: 7px;
+}
+
+@media (min-width: 768px) {
+  .form-horizontal .control-label {
+    text-align: right;
+  }
+}
+
+.btn {
+  display: inline-block;
+  padding: 6px 12px;
+  margin-bottom: 0;
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 1.428571429;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: middle;
+  cursor: pointer;
+  background-image: none;
+  border: 1px solid transparent;
+  border-radius: 4px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+       -o-user-select: none;
+          user-select: none;
+}
+
+.btn:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+.btn:hover,
+.btn:focus {
+  color: #333333;
+  text-decoration: none;
+}
+
+.btn:active,
+.btn.active {
+  background-image: none;
+  outline: 0;
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+          box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+
+.btn.disabled,
+.btn[disabled],
+fieldset[disabled] .btn {
+  pointer-events: none;
+  cursor: not-allowed;
+  opacity: 0.65;
+  filter: alpha(opacity=65);
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+
+.btn-default {
+  color: #333333;
+  background-color: #ffffff;
+  border-color: #cccccc;
+}
+
+.btn-default:hover,
+.btn-default:focus,
+.btn-default:active,
+.btn-default.active,
+.open .dropdown-toggle.btn-default {
+  color: #333333;
+  background-color: #ebebeb;
+  border-color: #adadad;
+}
+
+.btn-default:active,
+.btn-default.active,
+.open .dropdown-toggle.btn-default {
+  background-image: none;
+}
+
+.btn-default.disabled,
+.btn-default[disabled],
+fieldset[disabled] .btn-default,
+.btn-default.disabled:hover,
+.btn-default[disabled]:hover,
+fieldset[disabled] .btn-default:hover,
+.btn-default.disabled:focus,
+.btn-default[disabled]:focus,
+fieldset[disabled] .btn-default:focus,
+.btn-default.disabled:active,
+.btn-default[disabled]:active,
+fieldset[disabled] .btn-default:active,
+.btn-default.disabled.active,
+.btn-default[disabled].active,
+fieldset[disabled] .btn-default.active {
+  background-color: #ffffff;
+  border-color: #cccccc;
+}
+
+.btn-primary {
+  color: #ffffff;
+  background-color: #428bca;
+  border-color: #357ebd;
+}
+
+.btn-primary:hover,
+.btn-primary:focus,
+.btn-primary:active,
+.btn-primary.active,
+.open .dropdown-toggle.btn-primary {
+  color: #ffffff;
+  background-color: #3276b1;
+  border-color: #285e8e;
+}
+
+.btn-primary:active,
+.btn-primary.active,
+.open .dropdown-toggle.btn-primary {
+  background-image: none;
+}
+
+.btn-primary.disabled,
+.btn-primary[disabled],
+fieldset[disabled] .btn-primary,
+.btn-primary.disabled:hover,
+.btn-primary[disabled]:hover,
+fieldset[disabled] .btn-primary:hover,
+.btn-primary.disabled:focus,
+.btn-primary[disabled]:focus,
+fieldset[disabled] .btn-primary:focus,
+.btn-primary.disabled:active,
+.btn-primary[disabled]:active,
+fieldset[disabled] .btn-primary:active,
+.btn-primary.disabled.active,
+.btn-primary[disabled].active,
+fieldset[disabled] .btn-primary.active {
+  background-color: #428bca;
+  border-color: #357ebd;
+}
+
+.btn-warning {
+  color: #ffffff;
+  background-color: #f0ad4e;
+  border-color: #eea236;
+}
+
+.btn-warning:hover,
+.btn-warning:focus,
+.btn-warning:active,
+.btn-warning.active,
+.open .dropdown-toggle.btn-warning {
+  color: #ffffff;
+  background-color: #ed9c28;
+  border-color: #d58512;
+}
+
+.btn-warning:active,
+.btn-warning.active,
+.open .dropdown-toggle.btn-warning {
+  background-image: none;
+}
+
+.btn-warning.disabled,
+.btn-warning[disabled],
+fieldset[disabled] .btn-warning,
+.btn-warning.disabled:hover,
+.btn-warning[disabled]:hover,
+fieldset[disabled] .btn-warning:hover,
+.btn-warning.disabled:focus,
+.btn-warning[disabled]:focus,
+fieldset[disabled] .btn-warning:focus,
+.btn-warning.disabled:active,
+.btn-warning[disabled]:active,
+fieldset[disabled] .btn-warning:active,
+.btn-warning.disabled.active,
+.btn-warning[disabled].active,
+fieldset[disabled] .btn-warning.active {
+  background-color: #f0ad4e;
+  border-color: #eea236;
+}
+
+.btn-danger {
+  color: #ffffff;
+  background-color: #d9534f;
+  border-color: #d43f3a;
+}
+
+.btn-danger:hover,
+.btn-danger:focus,
+.btn-danger:active,
+.btn-danger.active,
+.open .dropdown-toggle.btn-danger {
+  color: #ffffff;
+  background-color: #d2322d;
+  border-color: #ac2925;
+}
+
+.btn-danger:active,
+.btn-danger.active,
+.open .dropdown-toggle.btn-danger {
+  background-image: none;
+}
+
+.btn-danger.disabled,
+.btn-danger[disabled],
+fieldset[disabled] .btn-danger,
+.btn-danger.disabled:hover,
+.btn-danger[disabled]:hover,
+fieldset[disabled] .btn-danger:hover,
+.btn-danger.disabled:focus,
+.btn-danger[disabled]:focus,
+fieldset[disabled] .btn-danger:focus,
+.btn-danger.disabled:active,
+.btn-danger[disabled]:active,
+fieldset[disabled] .btn-danger:active,
+.btn-danger.disabled.active,
+.btn-danger[disabled].active,
+fieldset[disabled] .btn-danger.active {
+  background-color: #d9534f;
+  border-color: #d43f3a;
+}
+
+.btn-success {
+  color: #ffffff;
+  background-color: #5cb85c;
+  border-color: #4cae4c;
+}
+
+.btn-success:hover,
+.btn-success:focus,
+.btn-success:active,
+.btn-success.active,
+.open .dropdown-toggle.btn-success {
+  color: #ffffff;
+  background-color: #47a447;
+  border-color: #398439;
+}
+
+.btn-success:active,
+.btn-success.active,
+.open .dropdown-toggle.btn-success {
+  background-image: none;
+}
+
+.btn-success.disabled,
+.btn-success[disabled],
+fieldset[disabled] .btn-success,
+.btn-success.disabled:hover,
+.btn-success[disabled]:hover,
+fieldset[disabled] .btn-success:hover,
+.btn-success.disabled:focus,
+.btn-success[disabled]:focus,
+fieldset[disabled] .btn-success:focus,
+.btn-success.disabled:active,
+.btn-success[disabled]:active,
+fieldset[disabled] .btn-success:active,
+.btn-success.disabled.active,
+.btn-success[disabled].active,
+fieldset[disabled] .btn-success.active {
+  background-color: #5cb85c;
+  border-color: #4cae4c;
+}
+
+.btn-info {
+  color: #ffffff;
+  background-color: #5bc0de;
+  border-color: #46b8da;
+}
+
+.btn-info:hover,
+.btn-info:focus,
+.btn-info:active,
+.btn-info.active,
+.open .dropdown-toggle.btn-info {
+  color: #ffffff;
+  background-color: #39b3d7;
+  border-color: #269abc;
+}
+
+.btn-info:active,
+.btn-info.active,
+.open .dropdown-toggle.btn-info {
+  background-image: none;
+}
+
+.btn-info.disabled,
+.btn-info[disabled],
+fieldset[disabled] .btn-info,
+.btn-info.disabled:hover,
+.btn-info[disabled]:hover,
+fieldset[disabled] .btn-info:hover,
+.btn-info.disabled:focus,
+.btn-info[disabled]:focus,
+fieldset[disabled] .btn-info:focus,
+.btn-info.disabled:active,
+.btn-info[disabled]:active,
+fieldset[disabled] .btn-info:active,
+.btn-info.disabled.active,
+.btn-info[disabled].active,
+fieldset[disabled] .btn-info.active {
+  background-color: #5bc0de;
+  border-color: #46b8da;
+}
+
+.btn-link {
+  font-weight: normal;
+  color: #428bca;
+  cursor: pointer;
+  border-radius: 0;
+}
+
+.btn-link,
+.btn-link:active,
+.btn-link[disabled],
+fieldset[disabled] .btn-link {
+  background-color: transparent;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+
+.btn-link,
+.btn-link:hover,
+.btn-link:focus,
+.btn-link:active {
+  border-color: transparent;
+}
+
+.btn-link:hover,
+.btn-link:focus {
+  color: #2a6496;
+  text-decoration: underline;
+  background-color: transparent;
+}
+
+.btn-link[disabled]:hover,
+fieldset[disabled] .btn-link:hover,
+.btn-link[disabled]:focus,
+fieldset[disabled] .btn-link:focus {
+  color: #999999;
+  text-decoration: none;
+}
+
+.btn-lg {
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 6px;
+}
+
+.btn-sm,
+.btn-xs {
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 3px;
+}
+
+.btn-xs {
+  padding: 1px 5px;
+}
+
+.btn-block {
+  display: block;
+  width: 100%;
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.btn-block + .btn-block {
+  margin-top: 5px;
+}
+
+input[type="submit"].btn-block,
+input[type="reset"].btn-block,
+input[type="button"].btn-block {
+  width: 100%;
+}
+
+.fade {
+  opacity: 0;
+  -webkit-transition: opacity 0.15s linear;
+          transition: opacity 0.15s linear;
+}
+
+.fade.in {
+  opacity: 1;
+}
+
+.collapse {
+  display: none;
+}
+
+.collapse.in {
+  display: block;
+}
+
+.collapsing {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: height 0.35s ease;
+          transition: height 0.35s ease;
+}
+
+@font-face {
+  font-family: 'Glyphicons Halflings';
+  src: url('../fonts/glyphicons-halflings-regular.eot');
+  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
+}
+
+.glyphicon {
+  position: relative;
+  top: 1px;
+  display: inline-block;
+  font-family: 'Glyphicons Halflings';
+  -webkit-font-smoothing: antialiased;
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.glyphicon:empty {
+  width: 1em;
+}
+
+.glyphicon-asterisk:before {
+  content: "\2a";
+}
+
+.glyphicon-plus:before {
+  content: "\2b";
+}
+
+.glyphicon-euro:before {
+  content: "\20ac";
+}
+
+.glyphicon-minus:before {
+  content: "\2212";
+}
+
+.glyphicon-cloud:before {
+  content: "\2601";
+}
+
+.glyphicon-envelope:before {
+  content: "\2709";
+}
+
+.glyphicon-pencil:before {
+  content: "\270f";
+}
+
+.glyphicon-glass:before {
+  content: "\e001";
+}
+
+.glyphicon-music:before {
+  content: "\e002";
+}
+
+.glyphicon-search:before {
+  content: "\e003";
+}
+
+.glyphicon-heart:before {
+  content: "\e005";
+}
+
+.glyphicon-star:before {
+  content: "\e006";
+}
+
+.glyphicon-star-empty:before {
+  content: "\e007";
+}
+
+.glyphicon-user:before {
+  content: "\e008";
+}
+
+.glyphicon-film:before {
+  content: "\e009";
+}
+
+.glyphicon-th-large:before {
+  content: "\e010";
+}
+
+.glyphicon-th:before {
+  content: "\e011";
+}
+
+.glyphicon-th-list:before {
+  content: "\e012";
+}
+
+.glyphicon-ok:before {
+  content: "\e013";
+}
+
+.glyphicon-remove:before {
+  content: "\e014";
+}
+
+.glyphicon-zoom-in:before {
+  content: "\e015";
+}
+
+.glyphicon-zoom-out:before {
+  content: "\e016";
+}
+
+.glyphicon-off:before {
+  content: "\e017";
+}
+
+.glyphicon-signal:before {
+  content: "\e018";
+}
+
+.glyphicon-cog:before {
+  content: "\e019";
+}
+
+.glyphicon-trash:before {
+  content: "\e020";
+}
+
+.glyphicon-home:before {
+  content: "\e021";
+}
+
+.glyphicon-file:before {
+  content: "\e022";
+}
+
+.glyphicon-time:before {
+  content: "\e023";
+}
+
+.glyphicon-road:before {
+  content: "\e024";
+}
+
+.glyphicon-download-alt:before {
+  content: "\e025";
+}
+
+.glyphicon-download:before {
+  content: "\e026";
+}
+
+.glyphicon-upload:before {
+  content: "\e027";
+}
+
+.glyphicon-inbox:before {
+  content: "\e028";
+}
+
+.glyphicon-play-circle:before {
+  content: "\e029";
+}
+
+.glyphicon-repeat:before {
+  content: "\e030";
+}
+
+.glyphicon-refresh:before {
+  content: "\e031";
+}
+
+.glyphicon-list-alt:before {
+  content: "\e032";
+}
+
+.glyphicon-lock:before {
+  content: "\e033";
+}
+
+.glyphicon-flag:before {
+  content: "\e034";
+}
+
+.glyphicon-headphones:before {
+  content: "\e035";
+}
+
+.glyphicon-volume-off:before {
+  content: "\e036";
+}
+
+.glyphicon-volume-down:before {
+  content: "\e037";
+}
+
+.glyphicon-volume-up:before {
+  content: "\e038";
+}
+
+.glyphicon-qrcode:before {
+  content: "\e039";
+}
+
+.glyphicon-barcode:before {
+  content: "\e040";
+}
+
+.glyphicon-tag:before {
+  content: "\e041";
+}
+
+.glyphicon-tags:before {
+  content: "\e042";
+}
+
+.glyphicon-book:before {
+  content: "\e043";
+}
+
+.glyphicon-bookmark:before {
+  content: "\e044";
+}
+
+.glyphicon-print:before {
+  content: "\e045";
+}
+
+.glyphicon-camera:before {
+  content: "\e046";
+}
+
+.glyphicon-font:before {
+  content: "\e047";
+}
+
+.glyphicon-bold:before {
+  content: "\e048";
+}
+
+.glyphicon-italic:before {
+  content: "\e049";
+}
+
+.glyphicon-text-height:before {
+  content: "\e050";
+}
+
+.glyphicon-text-width:before {
+  content: "\e051";
+}
+
+.glyphicon-align-left:before {
+  content: "\e052";
+}
+
+.glyphicon-align-center:before {
+  content: "\e053";
+}
+
+.glyphicon-align-right:before {
+  content: "\e054";
+}
+
+.glyphicon-align-justify:before {
+  content: "\e055";
+}
+
+.glyphicon-list:before {
+  content: "\e056";
+}
+
+.glyphicon-indent-left:before {
+  content: "\e057";
+}
+
+.glyphicon-indent-right:before {
+  content: "\e058";
+}
+
+.glyphicon-facetime-video:before {
+  content: "\e059";
+}
+
+.glyphicon-picture:before {
+  content: "\e060";
+}
+
+.glyphicon-map-marker:before {
+  content: "\e062";
+}
+
+.glyphicon-adjust:before {
+  content: "\e063";
+}
+
+.glyphicon-tint:before {
+  content: "\e064";
+}
+
+.glyphicon-edit:before {
+  content: "\e065";
+}
+
+.glyphicon-share:before {
+  content: "\e066";
+}
+
+.glyphicon-check:before {
+  content: "\e067";
+}
+
+.glyphicon-move:before {
+  content: "\e068";
+}
+
+.glyphicon-step-backward:before {
+  content: "\e069";
+}
+
+.glyphicon-fast-backward:before {
+  content: "\e070";
+}
+
+.glyphicon-backward:before {
+  content: "\e071";
+}
+
+.glyphicon-play:before {
+  content: "\e072";
+}
+
+.glyphicon-pause:before {
+  content: "\e073";
+}
+
+.glyphicon-stop:before {
+  content: "\e074";
+}
+
+.glyphicon-forward:before {
+  content: "\e075";
+}
+
+.glyphicon-fast-forward:before {
+  content: "\e076";
+}
+
+.glyphicon-step-forward:before {
+  content: "\e077";
+}
+
+.glyphicon-eject:before {
+  content: "\e078";
+}
+
+.glyphicon-chevron-left:before {
+  content: "\e079";
+}
+
+.glyphicon-chevron-right:before {
+  content: "\e080";
+}
+
+.glyphicon-plus-sign:before {
+  content: "\e081";
+}
+
+.glyphicon-minus-sign:before {
+  content: "\e082";
+}
+
+.glyphicon-remove-sign:before {
+  content: "\e083";
+}
+
+.glyphicon-ok-sign:before {
+  content: "\e084";
+}
+
+.glyphicon-question-sign:before {
+  content: "\e085";
+}
+
+.glyphicon-info-sign:before {
+  content: "\e086";
+}
+
+.glyphicon-screenshot:before {
+  content: "\e087";
+}
+
+.glyphicon-remove-circle:before {
+  content: "\e088";
+}
+
+.glyphicon-ok-circle:before {
+  content: "\e089";
+}
+
+.glyphicon-ban-circle:before {
+  content: "\e090";
+}
+
+.glyphicon-arrow-left:before {
+  content: "\e091";
+}
+
+.glyphicon-arrow-right:before {
+  content: "\e092";
+}
+
+.glyphicon-arrow-up:before {
+  content: "\e093";
+}
+
+.glyphicon-arrow-down:before {
+  content: "\e094";
+}
+
+.glyphicon-share-alt:before {
+  content: "\e095";
+}
+
+.glyphicon-resize-full:before {
+  content: "\e096";
+}
+
+.glyphicon-resize-small:before {
+  content: "\e097";
+}
+
+.glyphicon-exclamation-sign:before {
+  content: "\e101";
+}
+
+.glyphicon-gift:before {
+  content: "\e102";
+}
+
+.glyphicon-leaf:before {
+  content: "\e103";
+}
+
+.glyphicon-fire:before {
+  content: "\e104";
+}
+
+.glyphicon-eye-open:before {
+  content: "\e105";
+}
+
+.glyphicon-eye-close:before {
+  content: "\e106";
+}
+
+.glyphicon-warning-sign:before {
+  content: "\e107";
+}
+
+.glyphicon-plane:before {
+  content: "\e108";
+}
+
+.glyphicon-calendar:before {
+  content: "\e109";
+}
+
+.glyphicon-random:before {
+  content: "\e110";
+}
+
+.glyphicon-comment:before {
+  content: "\e111";
+}
+
+.glyphicon-magnet:before {
+  content: "\e112";
+}
+
+.glyphicon-chevron-up:before {
+  content: "\e113";
+}
+
+.glyphicon-chevron-down:before {
+  content: "\e114";
+}
+
+.glyphicon-retweet:before {
+  content: "\e115";
+}
+
+.glyphicon-shopping-cart:before {
+  content: "\e116";
+}
+
+.glyphicon-folder-close:before {
+  content: "\e117";
+}
+
+.glyphicon-folder-open:before {
+  content: "\e118";
+}
+
+.glyphicon-resize-vertical:before {
+  content: "\e119";
+}
+
+.glyphicon-resize-horizontal:before {
+  content: "\e120";
+}
+
+.glyphicon-hdd:before {
+  content: "\e121";
+}
+
+.glyphicon-bullhorn:before {
+  content: "\e122";
+}
+
+.glyphicon-bell:before {
+  content: "\e123";
+}
+
+.glyphicon-certificate:before {
+  content: "\e124";
+}
+
+.glyphicon-thumbs-up:before {
+  content: "\e125";
+}
+
+.glyphicon-thumbs-down:before {
+  content: "\e126";
+}
+
+.glyphicon-hand-right:before {
+  content: "\e127";
+}
+
+.glyphicon-hand-left:before {
+  content: "\e128";
+}
+
+.glyphicon-hand-up:before {
+  content: "\e129";
+}
+
+.glyphicon-hand-down:before {
+  content: "\e130";
+}
+
+.glyphicon-circle-arrow-right:before {
+  content: "\e131";
+}
+
+.glyphicon-circle-arrow-left:before {
+  content: "\e132";
+}
+
+.glyphicon-circle-arrow-up:before {
+  content: "\e133";
+}
+
+.glyphicon-circle-arrow-down:before {
+  content: "\e134";
+}
+
+.glyphicon-globe:before {
+  content: "\e135";
+}
+
+.glyphicon-wrench:before {
+  content: "\e136";
+}
+
+.glyphicon-tasks:before {
+  content: "\e137";
+}
+
+.glyphicon-filter:before {
+  content: "\e138";
+}
+
+.glyphicon-briefcase:before {
+  content: "\e139";
+}
+
+.glyphicon-fullscreen:before {
+  content: "\e140";
+}
+
+.glyphicon-dashboard:before {
+  content: "\e141";
+}
+
+.glyphicon-paperclip:before {
+  content: "\e142";
+}
+
+.glyphicon-heart-empty:before {
+  content: "\e143";
+}
+
+.glyphicon-link:before {
+  content: "\e144";
+}
+
+.glyphicon-phone:before {
+  content: "\e145";
+}
+
+.glyphicon-pushpin:before {
+  content: "\e146";
+}
+
+.glyphicon-usd:before {
+  content: "\e148";
+}
+
+.glyphicon-gbp:before {
+  content: "\e149";
+}
+
+.glyphicon-sort:before {
+  content: "\e150";
+}
+
+.glyphicon-sort-by-alphabet:before {
+  content: "\e151";
+}
+
+.glyphicon-sort-by-alphabet-alt:before {
+  content: "\e152";
+}
+
+.glyphicon-sort-by-order:before {
+  content: "\e153";
+}
+
+.glyphicon-sort-by-order-alt:before {
+  content: "\e154";
+}
+
+.glyphicon-sort-by-attributes:before {
+  content: "\e155";
+}
+
+.glyphicon-sort-by-attributes-alt:before {
+  content: "\e156";
+}
+
+.glyphicon-unchecked:before {
+  content: "\e157";
+}
+
+.glyphicon-expand:before {
+  content: "\e158";
+}
+
+.glyphicon-collapse-down:before {
+  content: "\e159";
+}
+
+.glyphicon-collapse-up:before {
+  content: "\e160";
+}
+
+.glyphicon-log-in:before {
+  content: "\e161";
+}
+
+.glyphicon-flash:before {
+  content: "\e162";
+}
+
+.glyphicon-log-out:before {
+  content: "\e163";
+}
+
+.glyphicon-new-window:before {
+  content: "\e164";
+}
+
+.glyphicon-record:before {
+  content: "\e165";
+}
+
+.glyphicon-save:before {
+  content: "\e166";
+}
+
+.glyphicon-open:before {
+  content: "\e167";
+}
+
+.glyphicon-saved:before {
+  content: "\e168";
+}
+
+.glyphicon-import:before {
+  content: "\e169";
+}
+
+.glyphicon-export:before {
+  content: "\e170";
+}
+
+.glyphicon-send:before {
+  content: "\e171";
+}
+
+.glyphicon-floppy-disk:before {
+  content: "\e172";
+}
+
+.glyphicon-floppy-saved:before {
+  content: "\e173";
+}
+
+.glyphicon-floppy-remove:before {
+  content: "\e174";
+}
+
+.glyphicon-floppy-save:before {
+  content: "\e175";
+}
+
+.glyphicon-floppy-open:before {
+  content: "\e176";
+}
+
+.glyphicon-credit-card:before {
+  content: "\e177";
+}
+
+.glyphicon-transfer:before {
+  content: "\e178";
+}
+
+.glyphicon-cutlery:before {
+  content: "\e179";
+}
+
+.glyphicon-header:before {
+  content: "\e180";
+}
+
+.glyphicon-compressed:before {
+  content: "\e181";
+}
+
+.glyphicon-earphone:before {
+  content: "\e182";
+}
+
+.glyphicon-phone-alt:before {
+  content: "\e183";
+}
+
+.glyphicon-tower:before {
+  content: "\e184";
+}
+
+.glyphicon-stats:before {
+  content: "\e185";
+}
+
+.glyphicon-sd-video:before {
+  content: "\e186";
+}
+
+.glyphicon-hd-video:before {
+  content: "\e187";
+}
+
+.glyphicon-subtitles:before {
+  content: "\e188";
+}
+
+.glyphicon-sound-stereo:before {
+  content: "\e189";
+}
+
+.glyphicon-sound-dolby:before {
+  content: "\e190";
+}
+
+.glyphicon-sound-5-1:before {
+  content: "\e191";
+}
+
+.glyphicon-sound-6-1:before {
+  content: "\e192";
+}
+
+.glyphicon-sound-7-1:before {
+  content: "\e193";
+}
+
+.glyphicon-copyright-mark:before {
+  content: "\e194";
+}
+
+.glyphicon-registration-mark:before {
+  content: "\e195";
+}
+
+.glyphicon-cloud-download:before {
+  content: "\e197";
+}
+
+.glyphicon-cloud-upload:before {
+  content: "\e198";
+}
+
+.glyphicon-tree-conifer:before {
+  content: "\e199";
+}
+
+.glyphicon-tree-deciduous:before {
+  content: "\e200";
+}
+
+.caret {
+  display: inline-block;
+  width: 0;
+  height: 0;
+  margin-left: 2px;
+  vertical-align: middle;
+  border-top: 4px solid #000000;
+  border-right: 4px solid transparent;
+  border-bottom: 0 dotted;
+  border-left: 4px solid transparent;
+}
+
+.dropdown {
+  position: relative;
+}
+
+.dropdown-toggle:focus {
+  outline: 0;
+}
+
+.dropdown-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  z-index: 1000;
+  display: none;
+  float: left;
+  min-width: 160px;
+  padding: 5px 0;
+  margin: 2px 0 0;
+  font-size: 14px;
+  list-style: none;
+  background-color: #ffffff;
+  border: 1px solid #cccccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 4px;
+  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+  background-clip: padding-box;
+}
+
+.dropdown-menu.pull-right {
+  right: 0;
+  left: auto;
+}
+
+.dropdown-menu .divider {
+  height: 1px;
+  margin: 9px 0;
+  overflow: hidden;
+  background-color: #e5e5e5;
+}
+
+.dropdown-menu > li > a {
+  display: block;
+  padding: 3px 20px;
+  clear: both;
+  font-weight: normal;
+  line-height: 1.428571429;
+  color: #333333;
+  white-space: nowrap;
+}
+
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  color: #262626;
+  text-decoration: none;
+  background-color: #f5f5f5;
+}
+
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  color: #ffffff;
+  text-decoration: none;
+  background-color: #428bca;
+  outline: 0;
+}
+
+.dropdown-menu > .disabled > a,
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
+  color: #999999;
+}
+
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
+  text-decoration: none;
+  cursor: not-allowed;
+  background-color: transparent;
+  background-image: none;
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.open > .dropdown-menu {
+  display: block;
+}
+
+.open > a {
+  outline: 0;
+}
+
+.dropdown-header {
+  display: block;
+  padding: 3px 20px;
+  font-size: 12px;
+  line-height: 1.428571429;
+  color: #999999;
+}
+
+.dropdown-backdrop {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 990;
+}
+
+.pull-right > .dropdown-menu {
+  right: 0;
+  left: auto;
+}
+
+.dropup .caret,
+.navbar-fixed-bottom .dropdown .caret {
+  border-top: 0 dotted;
+  border-bottom: 4px solid #000000;
+  content: "";
+}
+
+.dropup .dropdown-menu,
+.navbar-fixed-bottom .dropdown .dropdown-menu {
+  top: auto;
+  bottom: 100%;
+  margin-bottom: 1px;
+}
+
+@media (min-width: 768px) {
+  .navbar-right .dropdown-menu {
+    right: 0;
+    left: auto;
+  }
+}
+
+.btn-default .caret {
+  border-top-color: #333333;
+}
+
+.btn-primary .caret,
+.btn-success .caret,
+.btn-warning .caret,
+.btn-danger .caret,
+.btn-info .caret {
+  border-top-color: #fff;
+}
+
+.dropup .btn-default .caret {
+  border-bottom-color: #333333;
+}
+
+.dropup .btn-primary .caret,
+.dropup .btn-success .caret,
+.dropup .btn-warning .caret,
+.dropup .btn-danger .caret,
+.dropup .btn-info .caret {
+  border-bottom-color: #fff;
+}
+
+.btn-group,
+.btn-group-vertical {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.btn-group > .btn,
+.btn-group-vertical > .btn {
+  position: relative;
+  float: left;
+}
+
+.btn-group > .btn:hover,
+.btn-group-vertical > .btn:hover,
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus,
+.btn-group > .btn:active,
+.btn-group-vertical > .btn:active,
+.btn-group > .btn.active,
+.btn-group-vertical > .btn.active {
+  z-index: 2;
+}
+
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus {
+  outline: none;
+}
+
+.btn-group .btn + .btn,
+.btn-group .btn + .btn-group,
+.btn-group .btn-group + .btn,
+.btn-group .btn-group + .btn-group {
+  margin-left: -1px;
+}
+
+.btn-toolbar:before,
+.btn-toolbar:after {
+  display: table;
+  content: " ";
+}
+
+.btn-toolbar:after {
+  clear: both;
+}
+
+.btn-toolbar:before,
+.btn-toolbar:after {
+  display: table;
+  content: " ";
+}
+
+.btn-toolbar:after {
+  clear: both;
+}
+
+.btn-toolbar .btn-group {
+  float: left;
+}
+
+.btn-toolbar > .btn + .btn,
+.btn-toolbar > .btn-group + .btn,
+.btn-toolbar > .btn + .btn-group,
+.btn-toolbar > .btn-group + .btn-group {
+  margin-left: 5px;
+}
+
+.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
+  border-radius: 0;
+}
+
+.btn-group > .btn:first-child {
+  margin-left: 0;
+}
+
+.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+.btn-group > .btn:last-child:not(:first-child),
+.btn-group > .dropdown-toggle:not(:first-child) {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.btn-group > .btn-group {
+  float: left;
+}
+
+.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
+  border-radius: 0;
+}
+
+.btn-group > .btn-group:first-child > .btn:last-child,
+.btn-group > .btn-group:first-child > .dropdown-toggle {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+.btn-group > .btn-group:last-child > .btn:first-child {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.btn-group .dropdown-toggle:active,
+.btn-group.open .dropdown-toggle {
+  outline: 0;
+}
+
+.btn-group-xs > .btn {
+  padding: 5px 10px;
+  padding: 1px 5px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 3px;
+}
+
+.btn-group-sm > .btn {
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 3px;
+}
+
+.btn-group-lg > .btn {
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 6px;
+}
+
+.btn-group > .btn + .dropdown-toggle {
+  padding-right: 8px;
+  padding-left: 8px;
+}
+
+.btn-group > .btn-lg + .dropdown-toggle {
+  padding-right: 12px;
+  padding-left: 12px;
+}
+
+.btn-group.open .dropdown-toggle {
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+          box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+
+.btn-group.open .dropdown-toggle.btn-link {
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+
+.btn .caret {
+  margin-left: 0;
+}
+
+.btn-lg .caret {
+  border-width: 5px 5px 0;
+  border-bottom-width: 0;
+}
+
+.dropup .btn-lg .caret {
+  border-width: 0 5px 5px;
+}
+
+.btn-group-vertical > .btn,
+.btn-group-vertical > .btn-group {
+  display: block;
+  float: none;
+  width: 100%;
+  max-width: 100%;
+}
+
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after {
+  display: table;
+  content: " ";
+}
+
+.btn-group-vertical > .btn-group:after {
+  clear: both;
+}
+
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after {
+  display: table;
+  content: " ";
+}
+
+.btn-group-vertical > .btn-group:after {
+  clear: both;
+}
+
+.btn-group-vertical > .btn-group > .btn {
+  float: none;
+}
+
+.btn-group-vertical > .btn + .btn,
+.btn-group-vertical > .btn + .btn-group,
+.btn-group-vertical > .btn-group + .btn,
+.btn-group-vertical > .btn-group + .btn-group {
+  margin-top: -1px;
+  margin-left: 0;
+}
+
+.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
+  border-radius: 0;
+}
+
+.btn-group-vertical > .btn:first-child:not(:last-child) {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.btn-group-vertical > .btn:last-child:not(:first-child) {
+  border-top-right-radius: 0;
+  border-bottom-left-radius: 4px;
+  border-top-left-radius: 0;
+}
+
+.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
+  border-radius: 0;
+}
+
+.btn-group-vertical > .btn-group:first-child > .btn:last-child,
+.btn-group-vertical > .btn-group:first-child > .dropdown-toggle {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.btn-group-vertical > .btn-group:last-child > .btn:first-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.btn-group-justified {
+  display: table;
+  width: 100%;
+  border-collapse: separate;
+  table-layout: fixed;
+}
+
+.btn-group-justified .btn {
+  display: table-cell;
+  float: none;
+  width: 1%;
+}
+
+[data-toggle="buttons"] > .btn > input[type="radio"],
+[data-toggle="buttons"] > .btn > input[type="checkbox"] {
+  display: none;
+}
+
+.input-group {
+  position: relative;
+  display: table;
+  border-collapse: separate;
+}
+
+.input-group.col {
+  float: none;
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.input-group .form-control {
+  width: 100%;
+  margin-bottom: 0;
+}
+
+.input-group-lg > .form-control,
+.input-group-lg > .input-group-addon,
+.input-group-lg > .input-group-btn > .btn {
+  height: 45px;
+  padding: 10px 16px;
+  font-size: 18px;
+  line-height: 1.33;
+  border-radius: 6px;
+}
+
+select.input-group-lg > .form-control,
+select.input-group-lg > .input-group-addon,
+select.input-group-lg > .input-group-btn > .btn {
+  height: 45px;
+  line-height: 45px;
+}
+
+textarea.input-group-lg > .form-control,
+textarea.input-group-lg > .input-group-addon,
+textarea.input-group-lg > .input-group-btn > .btn {
+  height: auto;
+}
+
+.input-group-sm > .form-control,
+.input-group-sm > .input-group-addon,
+.input-group-sm > .input-group-btn > .btn {
+  height: 30px;
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 3px;
+}
+
+select.input-group-sm > .form-control,
+select.input-group-sm > .input-group-addon,
+select.input-group-sm > .input-group-btn > .btn {
+  height: 30px;
+  line-height: 30px;
+}
+
+textarea.input-group-sm > .form-control,
+textarea.input-group-sm > .input-group-addon,
+textarea.input-group-sm > .input-group-btn > .btn {
+  height: auto;
+}
+
+.input-group-addon,
+.input-group-btn,
+.input-group .form-control {
+  display: table-cell;
+}
+
+.input-group-addon:not(:first-child):not(:last-child),
+.input-group-btn:not(:first-child):not(:last-child),
+.input-group .form-control:not(:first-child):not(:last-child) {
+  border-radius: 0;
+}
+
+.input-group-addon,
+.input-group-btn {
+  width: 1%;
+  white-space: nowrap;
+  vertical-align: middle;
+}
+
+.input-group-addon {
+  padding: 6px 12px;
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 1;
+  color: #555555;
+  text-align: center;
+  background-color: #eeeeee;
+  border: 1px solid #cccccc;
+  border-radius: 4px;
+}
+
+.input-group-addon.input-sm {
+  padding: 5px 10px;
+  font-size: 12px;
+  border-radius: 3px;
+}
+
+.input-group-addon.input-lg {
+  padding: 10px 16px;
+  font-size: 18px;
+  border-radius: 6px;
+}
+
+.input-group-addon input[type="radio"],
+.input-group-addon input[type="checkbox"] {
+  margin-top: 0;
+}
+
+.input-group .form-control:first-child,
+.input-group-addon:first-child,
+.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .dropdown-toggle,
+.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+.input-group-addon:first-child {
+  border-right: 0;
+}
+
+.input-group .form-control:last-child,
+.input-group-addon:last-child,
+.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .dropdown-toggle,
+.input-group-btn:first-child > .btn:not(:first-child) {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.input-group-addon:last-child {
+  border-left: 0;
+}
+
+.input-group-btn {
+  position: relative;
+  white-space: nowrap;
+}
+
+.input-group-btn:first-child > .btn {
+  margin-right: -1px;
+}
+
+.input-group-btn:last-child > .btn {
+  margin-left: -1px;
+}
+
+.input-group-btn > .btn {
+  position: relative;
+}
+
+.input-group-btn > .btn + .btn {
+  margin-left: -4px;
+}
+
+.input-group-btn > .btn:hover,
+.input-group-btn > .btn:active {
+  z-index: 2;
+}
+
+.nav {
+  padding-left: 0;
+  margin-bottom: 0;
+  list-style: none;
+}
+
+.nav:before,
+.nav:after {
+  display: table;
+  content: " ";
+}
+
+.nav:after {
+  clear: both;
+}
+
+.nav:before,
+.nav:after {
+  display: table;
+  content: " ";
+}
+
+.nav:after {
+  clear: both;
+}
+
+.nav > li {
+  position: relative;
+  display: block;
+}
+
+.nav > li > a {
+  position: relative;
+  display: block;
+  padding: 10px 15px;
+}
+
+.nav > li > a:hover,
+.nav > li > a:focus {
+  text-decoration: none;
+  background-color: #eeeeee;
+}
+
+.nav > li.disabled > a {
+  color: #999999;
+}
+
+.nav > li.disabled > a:hover,
+.nav > li.disabled > a:focus {
+  color: #999999;
+  text-decoration: none;
+  cursor: not-allowed;
+  background-color: transparent;
+}
+
+.nav .open > a,
+.nav .open > a:hover,
+.nav .open > a:focus {
+  background-color: #eeeeee;
+  border-color: #428bca;
+}
+
+.nav .open > a .caret,
+.nav .open > a:hover .caret,
+.nav .open > a:focus .caret {
+  border-top-color: #2a6496;
+  border-bottom-color: #2a6496;
+}
+
+.nav .nav-divider {
+  height: 1px;
+  margin: 9px 0;
+  overflow: hidden;
+  background-color: #e5e5e5;
+}
+
+.nav > li > a > img {
+  max-width: none;
+}
+
+.nav-tabs {
+  border-bottom: 1px solid #dddddd;
+}
+
+.nav-tabs > li {
+  float: left;
+  margin-bottom: -1px;
+}
+
+.nav-tabs > li > a {
+  margin-right: 2px;
+  line-height: 1.428571429;
+  border: 1px solid transparent;
+  border-radius: 4px 4px 0 0;
+}
+
+.nav-tabs > li > a:hover {
+  border-color: #eeeeee #eeeeee #dddddd;
+}
+
+.nav-tabs > li.active > a,
+.nav-tabs > li.active > a:hover,
+.nav-tabs > li.active > a:focus {
+  color: #555555;
+  cursor: default;
+  background-color: #ffffff;
+  border: 1px solid #dddddd;
+  border-bottom-color: transparent;
+}
+
+.nav-tabs.nav-justified {
+  width: 100%;
+  border-bottom: 0;
+}
+
+.nav-tabs.nav-justified > li {
+  float: none;
+}
+
+.nav-tabs.nav-justified > li > a {
+  margin-bottom: 5px;
+  text-align: center;
+}
+
+.nav-tabs.nav-justified > .dropdown .dropdown-menu {
+  top: auto;
+  left: auto;
+}
+
+@media (min-width: 768px) {
+  .nav-tabs.nav-justified > li {
+    display: table-cell;
+    width: 1%;
+  }
+  .nav-tabs.nav-justified > li > a {
+    margin-bottom: 0;
+  }
+}
+
+.nav-tabs.nav-justified > li > a {
+  margin-right: 0;
+  border-radius: 4px;
+}
+
+.nav-tabs.nav-justified > .active > a,
+.nav-tabs.nav-justified > .active > a:hover,
+.nav-tabs.nav-justified > .active > a:focus {
+  border: 1px solid #dddddd;
+}
+
+@media (min-width: 768px) {
+  .nav-tabs.nav-justified > li > a {
+    border-bottom: 1px solid #dddddd;
+    border-radius: 4px 4px 0 0;
+  }
+  .nav-tabs.nav-justified > .active > a,
+  .nav-tabs.nav-justified > .active > a:hover,
+  .nav-tabs.nav-justified > .active > a:focus {
+    border-bottom-color: #ffffff;
+  }
+}
+
+.nav-pills > li {
+  float: left;
+}
+
+.nav-pills > li > a {
+  border-radius: 4px;
+}
+
+.nav-pills > li + li {
+  margin-left: 2px;
+}
+
+.nav-pills > li.active > a,
+.nav-pills > li.active > a:hover,
+.nav-pills > li.active > a:focus {
+  color: #ffffff;
+  background-color: #428bca;
+}
+
+.nav-pills > li.active > a .caret,
+.nav-pills > li.active > a:hover .caret,
+.nav-pills > li.active > a:focus .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+
+.nav-stacked > li {
+  float: none;
+}
+
+.nav-stacked > li + li {
+  margin-top: 2px;
+  margin-left: 0;
+}
+
+.nav-justified {
+  width: 100%;
+}
+
+.nav-justified > li {
+  float: none;
+}
+
+.nav-justified > li > a {
+  margin-bottom: 5px;
+  text-align: center;
+}
+
+.nav-justified > .dropdown .dropdown-menu {
+  top: auto;
+  left: auto;
+}
+
+@media (min-width: 768px) {
+  .nav-justified > li {
+    display: table-cell;
+    width: 1%;
+  }
+  .nav-justified > li > a {
+    margin-bottom: 0;
+  }
+}
+
+.nav-tabs-justified {
+  border-bottom: 0;
+}
+
+.nav-tabs-justified > li > a {
+  margin-right: 0;
+  border-radius: 4px;
+}
+
+.nav-tabs-justified > .active > a,
+.nav-tabs-justified > .active > a:hover,
+.nav-tabs-justified > .active > a:focus {
+  border: 1px solid #dddddd;
+}
+
+@media (min-width: 768px) {
+  .nav-tabs-justified > li > a {
+    border-bottom: 1px solid #dddddd;
+    border-radius: 4px 4px 0 0;
+  }
+  .nav-tabs-justified > .active > a,
+  .nav-tabs-justified > .active > a:hover,
+  .nav-tabs-justified > .active > a:focus {
+    border-bottom-color: #ffffff;
+  }
+}
+
+.tab-content > .tab-pane {
+  display: none;
+}
+
+.tab-content > .active {
+  display: block;
+}
+
+.nav .caret {
+  border-top-color: #428bca;
+  border-bottom-color: #428bca;
+}
+
+.nav a:hover .caret {
+  border-top-color: #2a6496;
+  border-bottom-color: #2a6496;
+}
+
+.nav-tabs .dropdown-menu {
+  margin-top: -1px;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.navbar {
+  position: relative;
+  min-height: 50px;
+  margin-bottom: 20px;
+  border: 1px solid transparent;
+}
+
+.navbar:before,
+.navbar:after {
+  display: table;
+  content: " ";
+}
+
+.navbar:after {
+  clear: both;
+}
+
+.navbar:before,
+.navbar:after {
+  display: table;
+  content: " ";
+}
+
+.navbar:after {
+  clear: both;
+}
+
+@media (min-width: 768px) {
+  .navbar {
+    border-radius: 4px;
+  }
+}
+
+.navbar-header:before,
+.navbar-header:after {
+  display: table;
+  content: " ";
+}
+
+.navbar-header:after {
+  clear: both;
+}
+
+.navbar-header:before,
+.navbar-header:after {
+  display: table;
+  content: " ";
+}
+
+.navbar-header:after {
+  clear: both;
+}
+
+@media (min-width: 768px) {
+  .navbar-header {
+    float: left;
+  }
+}
+
+.navbar-collapse {
+  max-height: 340px;
+  padding-right: 15px;
+  padding-left: 15px;
+  overflow-x: visible;
+  border-top: 1px solid transparent;
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+  -webkit-overflow-scrolling: touch;
+}
+
+.navbar-collapse:before,
+.navbar-collapse:after {
+  display: table;
+  content: " ";
+}
+
+.navbar-collapse:after {
+  clear: both;
+}
+
+.navbar-collapse:before,
+.navbar-collapse:after {
+  display: table;
+  content: " ";
+}
+
+.navbar-collapse:after {
+  clear: both;
+}
+
+.navbar-collapse.in {
+  overflow-y: auto;
+}
+
+@media (min-width: 768px) {
+  .navbar-collapse {
+    width: auto;
+    border-top: 0;
+    box-shadow: none;
+  }
+  .navbar-collapse.collapse {
+    display: block !important;
+    height: auto !important;
+    padding-bottom: 0;
+    overflow: visible !important;
+  }
+  .navbar-collapse.in {
+    overflow-y: auto;
+  }
+  .navbar-collapse .navbar-nav.navbar-left:first-child {
+    margin-left: -15px;
+  }
+  .navbar-collapse .navbar-nav.navbar-right:last-child {
+    margin-right: -15px;
+  }
+  .navbar-collapse .navbar-text:last-child {
+    margin-right: 0;
+  }
+}
+
+.container > .navbar-header,
+.container > .navbar-collapse {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+
+@media (min-width: 768px) {
+  .container > .navbar-header,
+  .container > .navbar-collapse {
+    margin-right: 0;
+    margin-left: 0;
+  }
+}
+
+.navbar-static-top {
+  z-index: 1000;
+  border-width: 0 0 1px;
+}
+
+@media (min-width: 768px) {
+  .navbar-static-top {
+    border-radius: 0;
+  }
+}
+
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  position: fixed;
+  right: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+@media (min-width: 768px) {
+  .navbar-fixed-top,
+  .navbar-fixed-bottom {
+    border-radius: 0;
+  }
+}
+
+.navbar-fixed-top {
+  top: 0;
+  border-width: 0 0 1px;
+}
+
+.navbar-fixed-bottom {
+  bottom: 0;
+  margin-bottom: 0;
+  border-width: 1px 0 0;
+}
+
+.navbar-brand {
+  float: left;
+  padding: 15px 15px;
+  font-size: 18px;
+  line-height: 20px;
+}
+
+.navbar-brand:hover,
+.navbar-brand:focus {
+  text-decoration: none;
+}
+
+@media (min-width: 768px) {
+  .navbar > .container .navbar-brand {
+    margin-left: -15px;
+  }
+}
+
+.navbar-toggle {
+  position: relative;
+  float: right;
+  padding: 9px 10px;
+  margin-top: 8px;
+  margin-right: 15px;
+  margin-bottom: 8px;
+  background-color: transparent;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+
+.navbar-toggle .icon-bar {
+  display: block;
+  width: 22px;
+  height: 2px;
+  border-radius: 1px;
+}
+
+.navbar-toggle .icon-bar + .icon-bar {
+  margin-top: 4px;
+}
+
+@media (min-width: 768px) {
+  .navbar-toggle {
+    display: none;
+  }
+}
+
+.navbar-nav {
+  margin: 7.5px -15px;
+}
+
+.navbar-nav > li > a {
+  padding-top: 10px;
+  padding-bottom: 10px;
+  line-height: 20px;
+}
+
+@media (max-width: 767px) {
+  .navbar-nav .open .dropdown-menu {
+    position: static;
+    float: none;
+    width: auto;
+    margin-top: 0;
+    background-color: transparent;
+    border: 0;
+    box-shadow: none;
+  }
+  .navbar-nav .open .dropdown-menu > li > a,
+  .navbar-nav .open .dropdown-menu .dropdown-header {
+    padding: 5px 15px 5px 25px;
+  }
+  .navbar-nav .open .dropdown-menu > li > a {
+    line-height: 20px;
+  }
+  .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-nav .open .dropdown-menu > li > a:focus {
+    background-image: none;
+  }
+}
+
+@media (min-width: 768px) {
+  .navbar-nav {
+    float: left;
+    margin: 0;
+  }
+  .navbar-nav > li {
+    float: left;
+  }
+  .navbar-nav > li > a {
+    padding-top: 15px;
+    padding-bottom: 15px;
+  }
+}
+
+@media (min-width: 768px) {
+  .navbar-left {
+    float: left !important;
+  }
+  .navbar-right {
+    float: right !important;
+  }
+}
+
+.navbar-form {
+  padding: 10px 15px;
+  margin-top: 8px;
+  margin-right: -15px;
+  margin-bottom: 8px;
+  margin-left: -15px;
+  border-top: 1px solid transparent;
+  border-bottom: 1px solid transparent;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+}
+
+@media (min-width: 768px) {
+  .navbar-form .form-group {
+    display: inline-block;
+    margin-bottom: 0;
+    vertical-align: middle;
+  }
+  .navbar-form .form-control {
+    display: inline-block;
+  }
+  .navbar-form .radio,
+  .navbar-form .checkbox {
+    display: inline-block;
+    padding-left: 0;
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .navbar-form .radio input[type="radio"],
+  .navbar-form .checkbox input[type="checkbox"] {
+    float: none;
+    margin-left: 0;
+  }
+}
+
+@media (max-width: 767px) {
+  .navbar-form .form-group {
+    margin-bottom: 5px;
+  }
+}
+
+@media (min-width: 768px) {
+  .navbar-form {
+    width: auto;
+    padding-top: 0;
+    padding-bottom: 0;
+    margin-right: 0;
+    margin-left: 0;
+    border: 0;
+    -webkit-box-shadow: none;
+            box-shadow: none;
+  }
+}
+
+.navbar-nav > li > .dropdown-menu {
+  margin-top: 0;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.navbar-nav.pull-right > li > .dropdown-menu,
+.navbar-nav > li > .dropdown-menu.pull-right {
+  right: 0;
+  left: auto;
+}
+
+.navbar-btn {
+  margin-top: 8px;
+  margin-bottom: 8px;
+}
+
+.navbar-text {
+  float: left;
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+@media (min-width: 768px) {
+  .navbar-text {
+    margin-right: 15px;
+    margin-left: 15px;
+  }
+}
+
+.navbar-default {
+  background-color: #f8f8f8;
+  border-color: #e7e7e7;
+}
+
+.navbar-default .navbar-brand {
+  color: #777777;
+}
+
+.navbar-default .navbar-brand:hover,
+.navbar-default .navbar-brand:focus {
+  color: #5e5e5e;
+  background-color: transparent;
+}
+
+.navbar-default .navbar-text {
+  color: #777777;
+}
+
+.navbar-default .navbar-nav > li > a {
+  color: #777777;
+}
+
+.navbar-default .navbar-nav > li > a:hover,
+.navbar-default .navbar-nav > li > a:focus {
+  color: #333333;
+  background-color: transparent;
+}
+
+.navbar-default .navbar-nav > .active > a,
+.navbar-default .navbar-nav > .active > a:hover,
+.navbar-default .navbar-nav > .active > a:focus {
+  color: #555555;
+  background-color: #e7e7e7;
+}
+
+.navbar-default .navbar-nav > .disabled > a,
+.navbar-default .navbar-nav > .disabled > a:hover,
+.navbar-default .navbar-nav > .disabled > a:focus {
+  color: #cccccc;
+  background-color: transparent;
+}
+
+.navbar-default .navbar-toggle {
+  border-color: #dddddd;
+}
+
+.navbar-default .navbar-toggle:hover,
+.navbar-default .navbar-toggle:focus {
+  background-color: #dddddd;
+}
+
+.navbar-default .navbar-toggle .icon-bar {
+  background-color: #cccccc;
+}
+
+.navbar-default .navbar-collapse,
+.navbar-default .navbar-form {
+  border-color: #e7e7e7;
+}
+
+.navbar-default .navbar-nav > .dropdown > a:hover .caret,
+.navbar-default .navbar-nav > .dropdown > a:focus .caret {
+  border-top-color: #333333;
+  border-bottom-color: #333333;
+}
+
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .open > a:hover,
+.navbar-default .navbar-nav > .open > a:focus {
+  color: #555555;
+  background-color: #e7e7e7;
+}
+
+.navbar-default .navbar-nav > .open > a .caret,
+.navbar-default .navbar-nav > .open > a:hover .caret,
+.navbar-default .navbar-nav > .open > a:focus .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+
+.navbar-default .navbar-nav > .dropdown > a .caret {
+  border-top-color: #777777;
+  border-bottom-color: #777777;
+}
+
+@media (max-width: 767px) {
+  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+    color: #777777;
+  }
+  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+    color: #333333;
+    background-color: transparent;
+  }
+  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #555555;
+    background-color: #e7e7e7;
+  }
+  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
+  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+    color: #cccccc;
+    background-color: transparent;
+  }
+}
+
+.navbar-default .navbar-link {
+  color: #777777;
+}
+
+.navbar-default .navbar-link:hover {
+  color: #333333;
+}
+
+.navbar-inverse {
+  background-color: #222222;
+  border-color: #080808;
+}
+
+.navbar-inverse .navbar-brand {
+  color: #999999;
+}
+
+.navbar-inverse .navbar-brand:hover,
+.navbar-inverse .navbar-brand:focus {
+  color: #ffffff;
+  background-color: transparent;
+}
+
+.navbar-inverse .navbar-text {
+  color: #999999;
+}
+
+.navbar-inverse .navbar-nav > li > a {
+  color: #999999;
+}
+
+.navbar-inverse .navbar-nav > li > a:hover,
+.navbar-inverse .navbar-nav > li > a:focus {
+  color: #ffffff;
+  background-color: transparent;
+}
+
+.navbar-inverse .navbar-nav > .active > a,
+.navbar-inverse .navbar-nav > .active > a:hover,
+.navbar-inverse .navbar-nav > .active > a:focus {
+  color: #ffffff;
+  background-color: #080808;
+}
+
+.navbar-inverse .navbar-nav > .disabled > a,
+.navbar-inverse .navbar-nav > .disabled > a:hover,
+.navbar-inverse .navbar-nav > .disabled > a:focus {
+  color: #444444;
+  background-color: transparent;
+}
+
+.navbar-inverse .navbar-toggle {
+  border-color: #333333;
+}
+
+.navbar-inverse .navbar-toggle:hover,
+.navbar-inverse .navbar-toggle:focus {
+  background-color: #333333;
+}
+
+.navbar-inverse .navbar-toggle .icon-bar {
+  background-color: #ffffff;
+}
+
+.navbar-inverse .navbar-collapse,
+.navbar-inverse .navbar-form {
+  border-color: #101010;
+}
+
+.navbar-inverse .navbar-nav > .open > a,
+.navbar-inverse .navbar-nav > .open > a:hover,
+.navbar-inverse .navbar-nav > .open > a:focus {
+  color: #ffffff;
+  background-color: #080808;
+}
+
+.navbar-inverse .navbar-nav > .dropdown > a:hover .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+
+.navbar-inverse .navbar-nav > .dropdown > a .caret {
+  border-top-color: #999999;
+  border-bottom-color: #999999;
+}
+
+.navbar-inverse .navbar-nav > .open > a .caret,
+.navbar-inverse .navbar-nav > .open > a:hover .caret,
+.navbar-inverse .navbar-nav > .open > a:focus .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+
+@media (max-width: 767px) {
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
+    border-color: #080808;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
+    color: #999999;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
+    color: #ffffff;
+    background-color: transparent;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #ffffff;
+    background-color: #080808;
+  }
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+    color: #444444;
+    background-color: transparent;
+  }
+}
+
+.navbar-inverse .navbar-link {
+  color: #999999;
+}
+
+.navbar-inverse .navbar-link:hover {
+  color: #ffffff;
+}
+
+.breadcrumb {
+  padding: 8px 15px;
+  margin-bottom: 20px;
+  list-style: none;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+}
+
+.breadcrumb > li {
+  display: inline-block;
+}
+
+.breadcrumb > li + li:before {
+  padding: 0 5px;
+  color: #cccccc;
+  content: "/\00a0";
+}
+
+.breadcrumb > .active {
+  color: #999999;
+}
+
+.pagination {
+  display: inline-block;
+  padding-left: 0;
+  margin: 20px 0;
+  border-radius: 4px;
+}
+
+.pagination > li {
+  display: inline;
+}
+
+.pagination > li > a,
+.pagination > li > span {
+  position: relative;
+  float: left;
+  padding: 6px 12px;
+  margin-left: -1px;
+  line-height: 1.428571429;
+  text-decoration: none;
+  background-color: #ffffff;
+  border: 1px solid #dddddd;
+}
+
+.pagination > li:first-child > a,
+.pagination > li:first-child > span {
+  margin-left: 0;
+  border-bottom-left-radius: 4px;
+  border-top-left-radius: 4px;
+}
+
+.pagination > li:last-child > a,
+.pagination > li:last-child > span {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+
+.pagination > li > a:hover,
+.pagination > li > span:hover,
+.pagination > li > a:focus,
+.pagination > li > span:focus {
+  background-color: #eeeeee;
+}
+
+.pagination > .active > a,
+.pagination > .active > span,
+.pagination > .active > a:hover,
+.pagination > .active > span:hover,
+.pagination > .active > a:focus,
+.pagination > .active > span:focus {
+  z-index: 2;
+  color: #ffffff;
+  cursor: default;
+  background-color: #428bca;
+  border-color: #428bca;
+}
+
+.pagination > .disabled > span,
+.pagination > .disabled > span:hover,
+.pagination > .disabled > span:focus,
+.pagination > .disabled > a,
+.pagination > .disabled > a:hover,
+.pagination > .disabled > a:focus {
+  color: #999999;
+  cursor: not-allowed;
+  background-color: #ffffff;
+  border-color: #dddddd;
+}
+
+.pagination-lg > li > a,
+.pagination-lg > li > span {
+  padding: 10px 16px;
+  font-size: 18px;
+}
+
+.pagination-lg > li:first-child > a,
+.pagination-lg > li:first-child > span {
+  border-bottom-left-radius: 6px;
+  border-top-left-radius: 6px;
+}
+
+.pagination-lg > li:last-child > a,
+.pagination-lg > li:last-child > span {
+  border-top-right-radius: 6px;
+  border-bottom-right-radius: 6px;
+}
+
+.pagination-sm > li > a,
+.pagination-sm > li > span {
+  padding: 5px 10px;
+  font-size: 12px;
+}
+
+.pagination-sm > li:first-child > a,
+.pagination-sm > li:first-child > span {
+  border-bottom-left-radius: 3px;
+  border-top-left-radius: 3px;
+}
+
+.pagination-sm > li:last-child > a,
+.pagination-sm > li:last-child > span {
+  border-top-right-radius: 3px;
+  border-bottom-right-radius: 3px;
+}
+
+.pager {
+  padding-left: 0;
+  margin: 20px 0;
+  text-align: center;
+  list-style: none;
+}
+
+.pager:before,
+.pager:after {
+  display: table;
+  content: " ";
+}
+
+.pager:after {
+  clear: both;
+}
+
+.pager:before,
+.pager:after {
+  display: table;
+  content: " ";
+}
+
+.pager:after {
+  clear: both;
+}
+
+.pager li {
+  display: inline;
+}
+
+.pager li > a,
+.pager li > span {
+  display: inline-block;
+  padding: 5px 14px;
+  background-color: #ffffff;
+  border: 1px solid #dddddd;
+  border-radius: 15px;
+}
+
+.pager li > a:hover,
+.pager li > a:focus {
+  text-decoration: none;
+  background-color: #eeeeee;
+}
+
+.pager .next > a,
+.pager .next > span {
+  float: right;
+}
+
+.pager .previous > a,
+.pager .previous > span {
+  float: left;
+}
+
+.pager .disabled > a,
+.pager .disabled > a:hover,
+.pager .disabled > a:focus,
+.pager .disabled > span {
+  color: #999999;
+  cursor: not-allowed;
+  background-color: #ffffff;
+}
+
+.label {
+  display: inline;
+  padding: .2em .6em .3em;
+  font-size: 75%;
+  font-weight: bold;
+  line-height: 1;
+  color: #ffffff;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  border-radius: .25em;
+}
+
+.label[href]:hover,
+.label[href]:focus {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.label:empty {
+  display: none;
+}
+
+.label-default {
+  background-color: #999999;
+}
+
+.label-default[href]:hover,
+.label-default[href]:focus {
+  background-color: #808080;
+}
+
+.label-primary {
+  background-color: #428bca;
+}
+
+.label-primary[href]:hover,
+.label-primary[href]:focus {
+  background-color: #3071a9;
+}
+
+.label-success {
+  background-color: #5cb85c;
+}
+
+.label-success[href]:hover,
+.label-success[href]:focus {
+  background-color: #449d44;
+}
+
+.label-info {
+  background-color: #5bc0de;
+}
+
+.label-info[href]:hover,
+.label-info[href]:focus {
+  background-color: #31b0d5;
+}
+
+.label-warning {
+  background-color: #f0ad4e;
+}
+
+.label-warning[href]:hover,
+.label-warning[href]:focus {
+  background-color: #ec971f;
+}
+
+.label-danger {
+  background-color: #d9534f;
+}
+
+.label-danger[href]:hover,
+.label-danger[href]:focus {
+  background-color: #c9302c;
+}
+
+.badge {
+  display: inline-block;
+  min-width: 10px;
+  padding: 3px 7px;
+  font-size: 12px;
+  font-weight: bold;
+  line-height: 1;
+  color: #ffffff;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  background-color: #999999;
+  border-radius: 10px;
+}
+
+.badge:empty {
+  display: none;
+}
+
+a.badge:hover,
+a.badge:focus {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.btn .badge {
+  position: relative;
+  top: -1px;
+}
+
+a.list-group-item.active > .badge,
+.nav-pills > .active > a > .badge {
+  color: #428bca;
+  background-color: #ffffff;
+}
+
+.nav-pills > li > a > .badge {
+  margin-left: 3px;
+}
+
+.jumbotron {
+  padding: 30px;
+  margin-bottom: 30px;
+  font-size: 21px;
+  font-weight: 200;
+  line-height: 2.1428571435;
+  color: inherit;
+  background-color: #eeeeee;
+}
+
+.jumbotron h1 {
+  line-height: 1;
+  color: inherit;
+}
+
+.jumbotron p {
+  line-height: 1.4;
+}
+
+.container .jumbotron {
+  border-radius: 6px;
+}
+
+@media screen and (min-width: 768px) {
+  .jumbotron {
+    padding-top: 48px;
+    padding-bottom: 48px;
+  }
+  .container .jumbotron {
+    padding-right: 60px;
+    padding-left: 60px;
+  }
+  .jumbotron h1 {
+    font-size: 63px;
+  }
+}
+
+.thumbnail {
+  display: inline-block;
+  display: block;
+  height: auto;
+  max-width: 100%;
+  padding: 4px;
+  margin-bottom: 20px;
+  line-height: 1.428571429;
+  background-color: #ffffff;
+  border: 1px solid #dddddd;
+  border-radius: 4px;
+  -webkit-transition: all 0.2s ease-in-out;
+          transition: all 0.2s ease-in-out;
+}
+
+.thumbnail > img {
+  display: block;
+  height: auto;
+  max-width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+a.thumbnail:hover,
+a.thumbnail:focus,
+a.thumbnail.active {
+  border-color: #428bca;
+}
+
+.thumbnail .caption {
+  padding: 9px;
+  color: #333333;
+}
+
+.alert {
+  padding: 15px;
+  margin-bottom: 20px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+
+.alert h4 {
+  margin-top: 0;
+  color: inherit;
+}
+
+.alert .alert-link {
+  font-weight: bold;
+}
+
+.alert > p,
+.alert > ul {
+  margin-bottom: 0;
+}
+
+.alert > p + p {
+  margin-top: 5px;
+}
+
+.alert-dismissable {
+  padding-right: 35px;
+}
+
+.alert-dismissable .close {
+  position: relative;
+  top: -2px;
+  right: -21px;
+  color: inherit;
+}
+
+.alert-success {
+  color: #468847;
+  background-color: #dff0d8;
+  border-color: #d6e9c6;
+}
+
+.alert-success hr {
+  border-top-color: #c9e2b3;
+}
+
+.alert-success .alert-link {
+  color: #356635;
+}
+
+.alert-info {
+  color: #3a87ad;
+  background-color: #d9edf7;
+  border-color: #bce8f1;
+}
+
+.alert-info hr {
+  border-top-color: #a6e1ec;
+}
+
+.alert-info .alert-link {
+  color: #2d6987;
+}
+
+.alert-warning {
+  color: #c09853;
+  background-color: #fcf8e3;
+  border-color: #faebcc;
+}
+
+.alert-warning hr {
+  border-top-color: #f7e1b5;
+}
+
+.alert-warning .alert-link {
+  color: #a47e3c;
+}
+
+.alert-danger {
+  color: #b94a48;
+  background-color: #f2dede;
+  border-color: #ebccd1;
+}
+
+.alert-danger hr {
+  border-top-color: #e4b9c0;
+}
+
+.alert-danger .alert-link {
+  color: #953b39;
+}
+
+@-webkit-keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+
+@-moz-keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+
+@-o-keyframes progress-bar-stripes {
+  from {
+    background-position: 0 0;
+  }
+  to {
+    background-position: 40px 0;
+  }
+}
+
+@keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+
+.progress {
+  height: 20px;
+  margin-bottom: 20px;
+  overflow: hidden;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+          box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.progress-bar {
+  float: left;
+  width: 0;
+  height: 100%;
+  font-size: 12px;
+  line-height: 20px;
+  color: #ffffff;
+  text-align: center;
+  background-color: #428bca;
+  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  -webkit-transition: width 0.6s ease;
+          transition: width 0.6s ease;
+}
+
+.progress-striped .progress-bar {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-size: 40px 40px;
+}
+
+.progress.active .progress-bar {
+  -webkit-animation: progress-bar-stripes 2s linear infinite;
+          animation: progress-bar-stripes 2s linear infinite;
+}
+
+.progress-bar-success {
+  background-color: #5cb85c;
+}
+
+.progress-striped .progress-bar-success {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+
+.progress-bar-info {
+  background-color: #5bc0de;
+}
+
+.progress-striped .progress-bar-info {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+
+.progress-bar-warning {
+  background-color: #f0ad4e;
+}
+
+.progress-striped .progress-bar-warning {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+
+.progress-bar-danger {
+  background-color: #d9534f;
+}
+
+.progress-striped .progress-bar-danger {
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+
+.media,
+.media-body {
+  overflow: hidden;
+  zoom: 1;
+}
+
+.media,
+.media .media {
+  margin-top: 15px;
+}
+
+.media:first-child {
+  margin-top: 0;
+}
+
+.media-object {
+  display: block;
+}
+
+.media-heading {
+  margin: 0 0 5px;
+}
+
+.media > .pull-left {
+  margin-right: 10px;
+}
+
+.media > .pull-right {
+  margin-left: 10px;
+}
+
+.media-list {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-group {
+  padding-left: 0;
+  margin-bottom: 20px;
+}
+
+.list-group-item {
+  position: relative;
+  display: block;
+  padding: 10px 15px;
+  margin-bottom: -1px;
+  background-color: #ffffff;
+  border: 1px solid #dddddd;
+}
+
+.list-group-item:first-child {
+  border-top-right-radius: 4px;
+  border-top-left-radius: 4px;
+}
+
+.list-group-item:last-child {
+  margin-bottom: 0;
+  border-bottom-right-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+
+.list-group-item > .badge {
+  float: right;
+}
+
+.list-group-item > .badge + .badge {
+  margin-right: 5px;
+}
+
+a.list-group-item {
+  color: #555555;
+}
+
+a.list-group-item .list-group-item-heading {
+  color: #333333;
+}
+
+a.list-group-item:hover,
+a.list-group-item:focus {
+  text-decoration: none;
+  background-color: #f5f5f5;
+}
+
+a.list-group-item.active,
+a.list-group-item.active:hover,
+a.list-group-item.active:focus {
+  z-index: 2;
+  color: #ffffff;
+  background-color: #428bca;
+  border-color: #428bca;
+}
+
+a.list-group-item.active .list-group-item-heading,
+a.list-group-item.active:hover .list-group-item-heading,
+a.list-group-item.active:focus .list-group-item-heading {
+  color: inherit;
+}
+
+a.list-group-item.active .list-group-item-text,
+a.list-group-item.active:hover .list-group-item-text,
+a.list-group-item.active:focus .list-group-item-text {
+  color: #e1edf7;
+}
+
+.list-group-item-heading {
+  margin-top: 0;
+  margin-bottom: 5px;
+}
+
+.list-group-item-text {
+  margin-bottom: 0;
+  line-height: 1.3;
+}
+
+.panel {
+  margin-bottom: 20px;
+  background-color: #ffffff;
+  border: 1px solid transparent;
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+}
+
+.panel-body {
+  padding: 15px;
+}
+
+.panel-body:before,
+.panel-body:after {
+  display: table;
+  content: " ";
+}
+
+.panel-body:after {
+  clear: both;
+}
+
+.panel-body:before,
+.panel-body:after {
+  display: table;
+  content: " ";
+}
+
+.panel-body:after {
+  clear: both;
+}
+
+.panel > .list-group {
+  margin-bottom: 0;
+}
+
+.panel > .list-group .list-group-item {
+  border-width: 1px 0;
+}
+
+.panel > .list-group .list-group-item:first-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+
+.panel > .list-group .list-group-item:last-child {
+  border-bottom: 0;
+}
+
+.panel-heading + .list-group .list-group-item:first-child {
+  border-top-width: 0;
+}
+
+.panel > .table,
+.panel > .table-responsive {
+  margin-bottom: 0;
+}
+
+.panel > .panel-body + .table,
+.panel > .panel-body + .table-responsive {
+  border-top: 1px solid #dddddd;
+}
+
+.panel > .table-bordered,
+.panel > .table-responsive > .table-bordered {
+  border: 0;
+}
+
+.panel > .table-bordered > thead > tr > th:first-child,
+.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
+.panel > .table-bordered > tbody > tr > th:first-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
+.panel > .table-bordered > tfoot > tr > th:first-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+.panel > .table-bordered > thead > tr > td:first-child,
+.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
+.panel > .table-bordered > tbody > tr > td:first-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
+.panel > .table-bordered > tfoot > tr > td:first-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+  border-left: 0;
+}
+
+.panel > .table-bordered > thead > tr > th:last-child,
+.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
+.panel > .table-bordered > tbody > tr > th:last-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
+.panel > .table-bordered > tfoot > tr > th:last-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+.panel > .table-bordered > thead > tr > td:last-child,
+.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
+.panel > .table-bordered > tbody > tr > td:last-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
+.panel > .table-bordered > tfoot > tr > td:last-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+  border-right: 0;
+}
+
+.panel > .table-bordered > thead > tr:last-child > th,
+.panel > .table-responsive > .table-bordered > thead > tr:last-child > th,
+.panel > .table-bordered > tbody > tr:last-child > th,
+.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
+.panel > .table-bordered > tfoot > tr:last-child > th,
+.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th,
+.panel > .table-bordered > thead > tr:last-child > td,
+.panel > .table-responsive > .table-bordered > thead > tr:last-child > td,
+.panel > .table-bordered > tbody > tr:last-child > td,
+.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
+.panel > .table-bordered > tfoot > tr:last-child > td,
+.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td {
+  border-bottom: 0;
+}
+
+.panel-heading {
+  padding: 10px 15px;
+  border-bottom: 1px solid transparent;
+  border-top-right-radius: 3px;
+  border-top-left-radius: 3px;
+}
+
+.panel-heading > .dropdown .dropdown-toggle {
+  color: inherit;
+}
+
+.panel-title {
+  margin-top: 0;
+  margin-bottom: 0;
+  font-size: 16px;
+}
+
+.panel-title > a {
+  color: inherit;
+}
+
+.panel-footer {
+  padding: 10px 15px;
+  background-color: #f5f5f5;
+  border-top: 1px solid #dddddd;
+  border-bottom-right-radius: 3px;
+  border-bottom-left-radius: 3px;
+}
+
+.panel-group .panel {
+  margin-bottom: 0;
+  overflow: hidden;
+  border-radius: 4px;
+}
+
+.panel-group .panel + .panel {
+  margin-top: 5px;
+}
+
+.panel-group .panel-heading {
+  border-bottom: 0;
+}
+
+.panel-group .panel-heading + .panel-collapse .panel-body {
+  border-top: 1px solid #dddddd;
+}
+
+.panel-group .panel-footer {
+  border-top: 0;
+}
+
+.panel-group .panel-footer + .panel-collapse .panel-body {
+  border-bottom: 1px solid #dddddd;
+}
+
+.panel-default {
+  border-color: #dddddd;
+}
+
+.panel-default > .panel-heading {
+  color: #333333;
+  background-color: #f5f5f5;
+  border-color: #dddddd;
+}
+
+.panel-default > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #dddddd;
+}
+
+.panel-default > .panel-heading > .dropdown .caret {
+  border-color: #333333 transparent;
+}
+
+.panel-default > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #dddddd;
+}
+
+.panel-primary {
+  border-color: #428bca;
+}
+
+.panel-primary > .panel-heading {
+  color: #ffffff;
+  background-color: #428bca;
+  border-color: #428bca;
+}
+
+.panel-primary > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #428bca;
+}
+
+.panel-primary > .panel-heading > .dropdown .caret {
+  border-color: #ffffff transparent;
+}
+
+.panel-primary > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #428bca;
+}
+
+.panel-success {
+  border-color: #d6e9c6;
+}
+
+.panel-success > .panel-heading {
+  color: #468847;
+  background-color: #dff0d8;
+  border-color: #d6e9c6;
+}
+
+.panel-success > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #d6e9c6;
+}
+
+.panel-success > .panel-heading > .dropdown .caret {
+  border-color: #468847 transparent;
+}
+
+.panel-success > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #d6e9c6;
+}
+
+.panel-warning {
+  border-color: #faebcc;
+}
+
+.panel-warning > .panel-heading {
+  color: #c09853;
+  background-color: #fcf8e3;
+  border-color: #faebcc;
+}
+
+.panel-warning > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #faebcc;
+}
+
+.panel-warning > .panel-heading > .dropdown .caret {
+  border-color: #c09853 transparent;
+}
+
+.panel-warning > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #faebcc;
+}
+
+.panel-danger {
+  border-color: #ebccd1;
+}
+
+.panel-danger > .panel-heading {
+  color: #b94a48;
+  background-color: #f2dede;
+  border-color: #ebccd1;
+}
+
+.panel-danger > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #ebccd1;
+}
+
+.panel-danger > .panel-heading > .dropdown .caret {
+  border-color: #b94a48 transparent;
+}
+
+.panel-danger > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #ebccd1;
+}
+
+.panel-info {
+  border-color: #bce8f1;
+}
+
+.panel-info > .panel-heading {
+  color: #3a87ad;
+  background-color: #d9edf7;
+  border-color: #bce8f1;
+}
+
+.panel-info > .panel-heading + .panel-collapse .panel-body {
+  border-top-color: #bce8f1;
+}
+
+.panel-info > .panel-heading > .dropdown .caret {
+  border-color: #3a87ad transparent;
+}
+
+.panel-info > .panel-footer + .panel-collapse .panel-body {
+  border-bottom-color: #bce8f1;
+}
+
+.well {
+  min-height: 20px;
+  padding: 19px;
+  margin-bottom: 20px;
+  background-color: #f5f5f5;
+  border: 1px solid #e3e3e3;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
+}
+
+.well blockquote {
+  border-color: #ddd;
+  border-color: rgba(0, 0, 0, 0.15);
+}
+
+.well-lg {
+  padding: 24px;
+  border-radius: 6px;
+}
+
+.well-sm {
+  padding: 9px;
+  border-radius: 3px;
+}
+
+.close {
+  float: right;
+  font-size: 21px;
+  font-weight: bold;
+  line-height: 1;
+  color: #000000;
+  text-shadow: 0 1px 0 #ffffff;
+  opacity: 0.2;
+  filter: alpha(opacity=20);
+}
+
+.close:hover,
+.close:focus {
+  color: #000000;
+  text-decoration: none;
+  cursor: pointer;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+
+button.close {
+  padding: 0;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  -webkit-appearance: none;
+}
+
+.modal-open {
+  overflow: hidden;
+}
+
+.modal {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1040;
+  display: none;
+  overflow: auto;
+  overflow-y: scroll;
+}
+
+.modal.fade .modal-dialog {
+  -webkit-transform: translate(0, -25%);
+      -ms-transform: translate(0, -25%);
+          transform: translate(0, -25%);
+  -webkit-transition: -webkit-transform 0.3s ease-out;
+     -moz-transition: -moz-transform 0.3s ease-out;
+       -o-transition: -o-transform 0.3s ease-out;
+          transition: transform 0.3s ease-out;
+}
+
+.modal.in .modal-dialog {
+  -webkit-transform: translate(0, 0);
+      -ms-transform: translate(0, 0);
+          transform: translate(0, 0);
+}
+
+.modal-dialog {
+  position: relative;
+  z-index: 1050;
+  width: auto;
+  padding: 10px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+.modal-content {
+  position: relative;
+  background-color: #ffffff;
+  border: 1px solid #999999;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 6px;
+  outline: none;
+  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
+          box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
+  background-clip: padding-box;
+}
+
+.modal-backdrop {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1030;
+  background-color: #000000;
+}
+
+.modal-backdrop.fade {
+  opacity: 0;
+  filter: alpha(opacity=0);
+}
+
+.modal-backdrop.in {
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+
+.modal-header {
+  min-height: 16.428571429px;
+  padding: 15px;
+  border-bottom: 1px solid #e5e5e5;
+}
+
+.modal-header .close {
+  margin-top: -2px;
+}
+
+.modal-title {
+  margin: 0;
+  line-height: 1.428571429;
+}
+
+.modal-body {
+  position: relative;
+  padding: 20px;
+}
+
+.modal-footer {
+  padding: 19px 20px 20px;
+  margin-top: 15px;
+  text-align: right;
+  border-top: 1px solid #e5e5e5;
+}
+
+.modal-footer:before,
+.modal-footer:after {
+  display: table;
+  content: " ";
+}
+
+.modal-footer:after {
+  clear: both;
+}
+
+.modal-footer:before,
+.modal-footer:after {
+  display: table;
+  content: " ";
+}
+
+.modal-footer:after {
+  clear: both;
+}
+
+.modal-footer .btn + .btn {
+  margin-bottom: 0;
+  margin-left: 5px;
+}
+
+.modal-footer .btn-group .btn + .btn {
+  margin-left: -1px;
+}
+
+.modal-footer .btn-block + .btn-block {
+  margin-left: 0;
+}
+
+@media screen and (min-width: 768px) {
+  .modal-dialog {
+    width: 600px;
+    padding-top: 30px;
+    padding-bottom: 30px;
+  }
+  .modal-content {
+    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+  }
+}
+
+.tooltip {
+  position: absolute;
+  z-index: 1030;
+  display: block;
+  font-size: 12px;
+  line-height: 1.4;
+  opacity: 0;
+  filter: alpha(opacity=0);
+  visibility: visible;
+}
+
+.tooltip.in {
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
+
+.tooltip.top {
+  padding: 5px 0;
+  margin-top: -3px;
+}
+
+.tooltip.right {
+  padding: 0 5px;
+  margin-left: 3px;
+}
+
+.tooltip.bottom {
+  padding: 5px 0;
+  margin-top: 3px;
+}
+
+.tooltip.left {
+  padding: 0 5px;
+  margin-left: -3px;
+}
+
+.tooltip-inner {
+  max-width: 200px;
+  padding: 3px 8px;
+  color: #ffffff;
+  text-align: center;
+  text-decoration: none;
+  background-color: #000000;
+  border-radius: 4px;
+}
+
+.tooltip-arrow {
+  position: absolute;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+}
+
+.tooltip.top .tooltip-arrow {
+  bottom: 0;
+  left: 50%;
+  margin-left: -5px;
+  border-top-color: #000000;
+  border-width: 5px 5px 0;
+}
+
+.tooltip.top-left .tooltip-arrow {
+  bottom: 0;
+  left: 5px;
+  border-top-color: #000000;
+  border-width: 5px 5px 0;
+}
+
+.tooltip.top-right .tooltip-arrow {
+  right: 5px;
+  bottom: 0;
+  border-top-color: #000000;
+  border-width: 5px 5px 0;
+}
+
+.tooltip.right .tooltip-arrow {
+  top: 50%;
+  left: 0;
+  margin-top: -5px;
+  border-right-color: #000000;
+  border-width: 5px 5px 5px 0;
+}
+
+.tooltip.left .tooltip-arrow {
+  top: 50%;
+  right: 0;
+  margin-top: -5px;
+  border-left-color: #000000;
+  border-width: 5px 0 5px 5px;
+}
+
+.tooltip.bottom .tooltip-arrow {
+  top: 0;
+  left: 50%;
+  margin-left: -5px;
+  border-bottom-color: #000000;
+  border-width: 0 5px 5px;
+}
+
+.tooltip.bottom-left .tooltip-arrow {
+  top: 0;
+  left: 5px;
+  border-bottom-color: #000000;
+  border-width: 0 5px 5px;
+}
+
+.tooltip.bottom-right .tooltip-arrow {
+  top: 0;
+  right: 5px;
+  border-bottom-color: #000000;
+  border-width: 0 5px 5px;
+}
+
+.popover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1010;
+  display: none;
+  max-width: 276px;
+  padding: 1px;
+  text-align: left;
+  white-space: normal;
+  background-color: #ffffff;
+  border: 1px solid #cccccc;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 6px;
+  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+          box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+  background-clip: padding-box;
+}
+
+.popover.top {
+  margin-top: -10px;
+}
+
+.popover.right {
+  margin-left: 10px;
+}
+
+.popover.bottom {
+  margin-top: 10px;
+}
+
+.popover.left {
+  margin-left: -10px;
+}
+
+.popover-title {
+  padding: 8px 14px;
+  margin: 0;
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 18px;
+  background-color: #f7f7f7;
+  border-bottom: 1px solid #ebebeb;
+  border-radius: 5px 5px 0 0;
+}
+
+.popover-content {
+  padding: 9px 14px;
+}
+
+.popover .arrow,
+.popover .arrow:after {
+  position: absolute;
+  display: block;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+}
+
+.popover .arrow {
+  border-width: 11px;
+}
+
+.popover .arrow:after {
+  border-width: 10px;
+  content: "";
+}
+
+.popover.top .arrow {
+  bottom: -11px;
+  left: 50%;
+  margin-left: -11px;
+  border-top-color: #999999;
+  border-top-color: rgba(0, 0, 0, 0.25);
+  border-bottom-width: 0;
+}
+
+.popover.top .arrow:after {
+  bottom: 1px;
+  margin-left: -10px;
+  border-top-color: #ffffff;
+  border-bottom-width: 0;
+  content: " ";
+}
+
+.popover.right .arrow {
+  top: 50%;
+  left: -11px;
+  margin-top: -11px;
+  border-right-color: #999999;
+  border-right-color: rgba(0, 0, 0, 0.25);
+  border-left-width: 0;
+}
+
+.popover.right .arrow:after {
+  bottom: -10px;
+  left: 1px;
+  border-right-color: #ffffff;
+  border-left-width: 0;
+  content: " ";
+}
+
+.popover.bottom .arrow {
+  top: -11px;
+  left: 50%;
+  margin-left: -11px;
+  border-bottom-color: #999999;
+  border-bottom-color: rgba(0, 0, 0, 0.25);
+  border-top-width: 0;
+}
+
+.popover.bottom .arrow:after {
+  top: 1px;
+  margin-left: -10px;
+  border-bottom-color: #ffffff;
+  border-top-width: 0;
+  content: " ";
+}
+
+.popover.left .arrow {
+  top: 50%;
+  right: -11px;
+  margin-top: -11px;
+  border-left-color: #999999;
+  border-left-color: rgba(0, 0, 0, 0.25);
+  border-right-width: 0;
+}
+
+.popover.left .arrow:after {
+  right: 1px;
+  bottom: -10px;
+  border-left-color: #ffffff;
+  border-right-width: 0;
+  content: " ";
+}
+
+.carousel {
+  position: relative;
+}
+
+.carousel-inner {
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+}
+
+.carousel-inner > .item {
+  position: relative;
+  display: none;
+  -webkit-transition: 0.6s ease-in-out left;
+          transition: 0.6s ease-in-out left;
+}
+
+.carousel-inner > .item > img,
+.carousel-inner > .item > a > img {
+  display: block;
+  height: auto;
+  max-width: 100%;
+  line-height: 1;
+}
+
+.carousel-inner > .active,
+.carousel-inner > .next,
+.carousel-inner > .prev {
+  display: block;
+}
+
+.carousel-inner > .active {
+  left: 0;
+}
+
+.carousel-inner > .next,
+.carousel-inner > .prev {
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+
+.carousel-inner > .next {
+  left: 100%;
+}
+
+.carousel-inner > .prev {
+  left: -100%;
+}
+
+.carousel-inner > .next.left,
+.carousel-inner > .prev.right {
+  left: 0;
+}
+
+.carousel-inner > .active.left {
+  left: -100%;
+}
+
+.carousel-inner > .active.right {
+  left: 100%;
+}
+
+.carousel-control {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 15%;
+  font-size: 20px;
+  color: #ffffff;
+  text-align: center;
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+
+.carousel-control.left {
+  background-image: -webkit-gradient(linear, 0 top, 100% top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
+  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0), color-stop(rgba(0, 0, 0, 0.0001) 100%));
+  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
+  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
+}
+
+.carousel-control.right {
+  right: 0;
+  left: auto;
+  background-image: -webkit-gradient(linear, 0 top, 100% top, from(rgba(0, 0, 0, 0.0001)), to(rgba(0, 0, 0, 0.5)));
+  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.0001) 0), color-stop(rgba(0, 0, 0, 0.5) 100%));
+  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0, rgba(0, 0, 0, 0.5) 100%);
+  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0, rgba(0, 0, 0, 0.5) 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
+}
+
+.carousel-control:hover,
+.carousel-control:focus {
+  color: #ffffff;
+  text-decoration: none;
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
+
+.carousel-control .icon-prev,
+.carousel-control .icon-next,
+.carousel-control .glyphicon-chevron-left,
+.carousel-control .glyphicon-chevron-right {
+  position: absolute;
+  top: 50%;
+  z-index: 5;
+  display: inline-block;
+}
+
+.carousel-control .icon-prev,
+.carousel-control .glyphicon-chevron-left {
+  left: 50%;
+}
+
+.carousel-control .icon-next,
+.carousel-control .glyphicon-chevron-right {
+  right: 50%;
+}
+
+.carousel-control .icon-prev,
+.carousel-control .icon-next {
+  width: 20px;
+  height: 20px;
+  margin-top: -10px;
+  margin-left: -10px;
+  font-family: serif;
+}
+
+.carousel-control .icon-prev:before {
+  content: '\2039';
+}
+
+.carousel-control .icon-next:before {
+  content: '\203a';
+}
+
+.carousel-indicators {
+  position: absolute;
+  bottom: 10px;
+  left: 50%;
+  z-index: 15;
+  width: 60%;
+  padding-left: 0;
+  margin-left: -30%;
+  text-align: center;
+  list-style: none;
+}
+
+.carousel-indicators li {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  margin: 1px;
+  text-indent: -999px;
+  cursor: pointer;
+  background-color: #000 \9;
+  background-color: rgba(0, 0, 0, 0);
+  border: 1px solid #ffffff;
+  border-radius: 10px;
+}
+
+.carousel-indicators .active {
+  width: 12px;
+  height: 12px;
+  margin: 0;
+  background-color: #ffffff;
+}
+
+.carousel-caption {
+  position: absolute;
+  right: 15%;
+  bottom: 20px;
+  left: 15%;
+  z-index: 10;
+  padding-top: 20px;
+  padding-bottom: 20px;
+  color: #ffffff;
+  text-align: center;
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+}
+
+.carousel-caption .btn {
+  text-shadow: none;
+}
+
+@media screen and (min-width: 768px) {
+  .carousel-control .glyphicons-chevron-left,
+  .carousel-control .glyphicons-chevron-right,
+  .carousel-control .icon-prev,
+  .carousel-control .icon-next {
+    width: 30px;
+    height: 30px;
+    margin-top: -15px;
+    margin-left: -15px;
+    font-size: 30px;
+  }
+  .carousel-caption {
+    right: 20%;
+    left: 20%;
+    padding-bottom: 30px;
+  }
+  .carousel-indicators {
+    bottom: 20px;
+  }
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  content: " ";
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+.center-block {
+  display: block;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+.pull-right {
+  float: right !important;
+}
+
+.pull-left {
+  float: left !important;
+}
+
+.hide {
+  display: none !important;
+}
+
+.show {
+  display: block !important;
+}
+
+.invisible {
+  visibility: hidden;
+}
+
+.text-hide {
+  font: 0/0 a;
+  color: transparent;
+  text-shadow: none;
+  background-color: transparent;
+  border: 0;
+}
+
+.hidden {
+  display: none !important;
+  visibility: hidden !important;
+}
+
+.affix {
+  position: fixed;
+}
+
+@-ms-viewport {
+  width: device-width;
+}
+
+.visible-xs,
+tr.visible-xs,
+th.visible-xs,
+td.visible-xs {
+  display: none !important;
+}
+
+@media (max-width: 767px) {
+  .visible-xs {
+    display: block !important;
+  }
+  tr.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-xs,
+  td.visible-xs {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-xs.visible-sm {
+    display: block !important;
+  }
+  tr.visible-xs.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-xs.visible-sm,
+  td.visible-xs.visible-sm {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-xs.visible-md {
+    display: block !important;
+  }
+  tr.visible-xs.visible-md {
+    display: table-row !important;
+  }
+  th.visible-xs.visible-md,
+  td.visible-xs.visible-md {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .visible-xs.visible-lg {
+    display: block !important;
+  }
+  tr.visible-xs.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-xs.visible-lg,
+  td.visible-xs.visible-lg {
+    display: table-cell !important;
+  }
+}
+
+.visible-sm,
+tr.visible-sm,
+th.visible-sm,
+td.visible-sm {
+  display: none !important;
+}
+
+@media (max-width: 767px) {
+  .visible-sm.visible-xs {
+    display: block !important;
+  }
+  tr.visible-sm.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-sm.visible-xs,
+  td.visible-sm.visible-xs {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-sm {
+    display: block !important;
+  }
+  tr.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-sm,
+  td.visible-sm {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-sm.visible-md {
+    display: block !important;
+  }
+  tr.visible-sm.visible-md {
+    display: table-row !important;
+  }
+  th.visible-sm.visible-md,
+  td.visible-sm.visible-md {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .visible-sm.visible-lg {
+    display: block !important;
+  }
+  tr.visible-sm.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-sm.visible-lg,
+  td.visible-sm.visible-lg {
+    display: table-cell !important;
+  }
+}
+
+.visible-md,
+tr.visible-md,
+th.visible-md,
+td.visible-md {
+  display: none !important;
+}
+
+@media (max-width: 767px) {
+  .visible-md.visible-xs {
+    display: block !important;
+  }
+  tr.visible-md.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-md.visible-xs,
+  td.visible-md.visible-xs {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-md.visible-sm {
+    display: block !important;
+  }
+  tr.visible-md.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-md.visible-sm,
+  td.visible-md.visible-sm {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-md {
+    display: block !important;
+  }
+  tr.visible-md {
+    display: table-row !important;
+  }
+  th.visible-md,
+  td.visible-md {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .visible-md.visible-lg {
+    display: block !important;
+  }
+  tr.visible-md.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-md.visible-lg,
+  td.visible-md.visible-lg {
+    display: table-cell !important;
+  }
+}
+
+.visible-lg,
+tr.visible-lg,
+th.visible-lg,
+td.visible-lg {
+  display: none !important;
+}
+
+@media (max-width: 767px) {
+  .visible-lg.visible-xs {
+    display: block !important;
+  }
+  tr.visible-lg.visible-xs {
+    display: table-row !important;
+  }
+  th.visible-lg.visible-xs,
+  td.visible-lg.visible-xs {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .visible-lg.visible-sm {
+    display: block !important;
+  }
+  tr.visible-lg.visible-sm {
+    display: table-row !important;
+  }
+  th.visible-lg.visible-sm,
+  td.visible-lg.visible-sm {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .visible-lg.visible-md {
+    display: block !important;
+  }
+  tr.visible-lg.visible-md {
+    display: table-row !important;
+  }
+  th.visible-lg.visible-md,
+  td.visible-lg.visible-md {
+    display: table-cell !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .visible-lg {
+    display: block !important;
+  }
+  tr.visible-lg {
+    display: table-row !important;
+  }
+  th.visible-lg,
+  td.visible-lg {
+    display: table-cell !important;
+  }
+}
+
+.hidden-xs {
+  display: block !important;
+}
+
+tr.hidden-xs {
+  display: table-row !important;
+}
+
+th.hidden-xs,
+td.hidden-xs {
+  display: table-cell !important;
+}
+
+@media (max-width: 767px) {
+  .hidden-xs,
+  tr.hidden-xs,
+  th.hidden-xs,
+  td.hidden-xs {
+    display: none !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-xs.hidden-sm,
+  tr.hidden-xs.hidden-sm,
+  th.hidden-xs.hidden-sm,
+  td.hidden-xs.hidden-sm {
+    display: none !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-xs.hidden-md,
+  tr.hidden-xs.hidden-md,
+  th.hidden-xs.hidden-md,
+  td.hidden-xs.hidden-md {
+    display: none !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .hidden-xs.hidden-lg,
+  tr.hidden-xs.hidden-lg,
+  th.hidden-xs.hidden-lg,
+  td.hidden-xs.hidden-lg {
+    display: none !important;
+  }
+}
+
+.hidden-sm {
+  display: block !important;
+}
+
+tr.hidden-sm {
+  display: table-row !important;
+}
+
+th.hidden-sm,
+td.hidden-sm {
+  display: table-cell !important;
+}
+
+@media (max-width: 767px) {
+  .hidden-sm.hidden-xs,
+  tr.hidden-sm.hidden-xs,
+  th.hidden-sm.hidden-xs,
+  td.hidden-sm.hidden-xs {
+    display: none !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-sm,
+  tr.hidden-sm,
+  th.hidden-sm,
+  td.hidden-sm {
+    display: none !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-sm.hidden-md,
+  tr.hidden-sm.hidden-md,
+  th.hidden-sm.hidden-md,
+  td.hidden-sm.hidden-md {
+    display: none !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .hidden-sm.hidden-lg,
+  tr.hidden-sm.hidden-lg,
+  th.hidden-sm.hidden-lg,
+  td.hidden-sm.hidden-lg {
+    display: none !important;
+  }
+}
+
+.hidden-md {
+  display: block !important;
+}
+
+tr.hidden-md {
+  display: table-row !important;
+}
+
+th.hidden-md,
+td.hidden-md {
+  display: table-cell !important;
+}
+
+@media (max-width: 767px) {
+  .hidden-md.hidden-xs,
+  tr.hidden-md.hidden-xs,
+  th.hidden-md.hidden-xs,
+  td.hidden-md.hidden-xs {
+    display: none !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-md.hidden-sm,
+  tr.hidden-md.hidden-sm,
+  th.hidden-md.hidden-sm,
+  td.hidden-md.hidden-sm {
+    display: none !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-md,
+  tr.hidden-md,
+  th.hidden-md,
+  td.hidden-md {
+    display: none !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .hidden-md.hidden-lg,
+  tr.hidden-md.hidden-lg,
+  th.hidden-md.hidden-lg,
+  td.hidden-md.hidden-lg {
+    display: none !important;
+  }
+}
+
+.hidden-lg {
+  display: block !important;
+}
+
+tr.hidden-lg {
+  display: table-row !important;
+}
+
+th.hidden-lg,
+td.hidden-lg {
+  display: table-cell !important;
+}
+
+@media (max-width: 767px) {
+  .hidden-lg.hidden-xs,
+  tr.hidden-lg.hidden-xs,
+  th.hidden-lg.hidden-xs,
+  td.hidden-lg.hidden-xs {
+    display: none !important;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+  .hidden-lg.hidden-sm,
+  tr.hidden-lg.hidden-sm,
+  th.hidden-lg.hidden-sm,
+  td.hidden-lg.hidden-sm {
+    display: none !important;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+  .hidden-lg.hidden-md,
+  tr.hidden-lg.hidden-md,
+  th.hidden-lg.hidden-md,
+  td.hidden-lg.hidden-md {
+    display: none !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .hidden-lg,
+  tr.hidden-lg,
+  th.hidden-lg,
+  td.hidden-lg {
+    display: none !important;
+  }
+}
+
+.visible-print,
+tr.visible-print,
+th.visible-print,
+td.visible-print {
+  display: none !important;
+}
+
+@media print {
+  .visible-print {
+    display: block !important;
+  }
+  tr.visible-print {
+    display: table-row !important;
+  }
+  th.visible-print,
+  td.visible-print {
+    display: table-cell !important;
+  }
+  .hidden-print,
+  tr.hidden-print,
+  th.hidden-print,
+  td.hidden-print {
+    display: none !important;
+  }
+}
\ No newline at end of file

diff --git a/src/web/css/bootstrap-azkaban.css b/src/web/css/bootstrap-azkaban.css
new file mode 100644
index 0000000..72faaa9
--- /dev/null
+++ b/src/web/css/bootstrap-azkaban.css
@@ -0,0 +1,19 @@
+.modal-wide .modal-dialog {
+	width: 80%; /* or whatever you wish */
+}
+
+.alert-messaging {
+	display: none;
+}
+
+.nav-tabs, .nav-pills {
+	margin-bottom: 15px;
+}
+
+.flow-expander {
+	cursor: pointer;
+}
+
+table .worksheet-key {
+	width: 25%;
+}

diff --git a/src/web/css/bootstrap-datetimepicker.min.css b/src/web/css/bootstrap-datetimepicker.min.css
new file mode 100644
index 0000000..ed45378
--- /dev/null
+++ b/src/web/css/bootstrap-datetimepicker.min.css
@@ -0,0 +1,9 @@
+/*!
+ * Datepicker for Bootstrap v3
+ *
+ * Copyright 2012 Stefan Petre
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ */
+ .bootstrap-datetimepicker-widget{top:0;left:0;z-index:9999;width:250px;padding:4px;margin-top:1px;border-radius:4px}.bootstrap-datetimepicker-widget .btn{padding:6px}.bootstrap-datetimepicker-widget:before{position:absolute;top:-7px;left:6px;display:inline-block;border-right:7px solid transparent;border-bottom:7px solid #ccc;border-left:7px solid transparent;border-bottom-color:rgba(0,0,0,0.2);content:''}.bootstrap-datetimepicker-widget:after{position:absolute;top:-6px;left:7px;display:inline-block;border-right:6px solid transparent;border-bottom:6px solid white;border-left:6px solid transparent;content:''}.bootstrap-datetimepicker-widget.pull-right:before{right:6px;left:auto}.bootstrap-datetimepicker-widget.pull-right:after{right:7px;left:auto}.bootstrap-datetimepicker-widget>ul{margin:0;list-style-type:none}.bootstrap-datetimepicker-widget .timepicker-hour,.bootstrap-datetimepicker-widget .timepicker-minute,.bootstrap-datetimepicker-widget .timepicker-second{width:100%;font-size:1.2em;font-weight:bold}.bootstrap-datetimepicker-widget table[data-hour-format="12"] .separator{width:4px;padding:0;margin:0}.bootstrap-datetimepicker-widget .datepicker>div{display:none}.bootstrap-datetimepicker-widget .picker-switch{text-align:center}.bootstrap-datetimepicker-widget table{width:100%;margin:0}.bootstrap-datetimepicker-widget td,.bootstrap-datetimepicker-widget th{width:20px;height:20px;text-align:center;border-radius:4px}.bootstrap-datetimepicker-widget td.day:hover,.bootstrap-datetimepicker-widget td.hour:hover,.bootstrap-datetimepicker-widget td.minute:hover,.bootstrap-datetimepicker-widget td.second:hover{cursor:pointer;background:#eee}.bootstrap-datetimepicker-widget td.old,.bootstrap-datetimepicker-widget td.new{color:#999}.bootstrap-datetimepicker-widget td.active,.bootstrap-datetimepicker-widget td.active:hover{color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,0.25);background-color:#428bca}.bootstrap-datetimepicker-widget td.disabled,.bootstrap-datetimepicker-widget td.disabled:hover{color:#999;cursor:not-allowed;background:0}.bootstrap-datetimepicker-widget td span{display:block;float:left;width:47px;height:54px;margin:2px;line-height:54px;cursor:pointer;border-radius:4px}.bootstrap-datetimepicker-widget td span:hover{background:#eee}.bootstrap-datetimepicker-widget td span.active{color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,0.25);background-color:#428bca}.bootstrap-datetimepicker-widget td span.old{color:#999}.bootstrap-datetimepicker-widget td span.disabled,.bootstrap-datetimepicker-widget td span.disabled:hover{color:#999;cursor:not-allowed;background:0}.bootstrap-datetimepicker-widget th.switch{width:145px}.bootstrap-datetimepicker-widget th.next,.bootstrap-datetimepicker-widget th.prev{font-size:21px}.bootstrap-datetimepicker-widget th.disabled,.bootstrap-datetimepicker-widget th.disabled:hover{color:#999;cursor:not-allowed;background:0}.bootstrap-datetimepicker-widget thead tr:first-child th{cursor:pointer}.bootstrap-datetimepicker-widget thead tr:first-child th:hover{background:#eee}.input-group.date .input-group-addon span{display:block;width:16px;height:16px;cursor:pointer}.bootstrap-datetimepicker-widget.left-oriented:before{right:6px;left:auto}.bootstrap-datetimepicker-widget.left-oriented:after{right:7px;left:auto}.bootstrap-datetimepicker-widget ul.list-unstyled li.in div.timepicker div.timepicker-picker table.table-condensed tbody>tr>td{padding:0!important}
\ No newline at end of file

diff --git a/src/web/css/bootstrap-fileinput.css b/src/web/css/bootstrap-fileinput.css
new file mode 100644
index 0000000..1929506
--- /dev/null
+++ b/src/web/css/bootstrap-fileinput.css
@@ -0,0 +1,93 @@
+
+.fileinput {
+  display: inline-block;
+  margin-bottom: 9px;
+}
+
+.fileinput .uneditable-input {
+  display: inline-block;
+  margin-bottom: 0;
+  vertical-align: middle;
+  cursor: text;
+}
+
+.fileinput .thumbnail {
+  display: inline-block;
+  margin-bottom: 5px;
+  overflow: hidden;
+  text-align: center;
+  vertical-align: middle;
+}
+
+.fileinput .thumbnail > img {
+  max-height: 100%;
+}
+
+.fileinput .btn {
+  vertical-align: middle;
+}
+
+.fileinput-exists .fileinput-new,
+.fileinput-new .fileinput-exists {
+  display: none;
+}
+
+.fileinput-inline .fileinput-controls {
+  display: inline;
+}
+
+.fileinput .uneditable-input {
+  white-space: normal;
+}
+
+.fileinput-new .input-group .btn-file {
+  border-radius: 0 4px 4px 0;
+}
+
+.fileinput-new .input-group .btn-file.btn-xs,
+.fileinput-new .input-group .btn-file.btn-sm {
+  border-radius: 0 3px 3px 0;
+}
+
+.fileinput-new .input-group .btn-file.btn-lg {
+  border-radius: 0 6px 6px 0;
+}
+
+.form-group.has-warning .fileinput .uneditable-input {
+  color: #c09853;
+  border-color: #faebcc;
+}
+
+.form-group.has-warning .fileinput .fileinput-preview {
+  color: #c09853;
+}
+
+.form-group.has-warning .fileinput .thumbnail {
+  border-color: #faebcc;
+}
+
+.form-group.has-error .fileinput .uneditable-input {
+  color: #b94a48;
+  border-color: #ebccd1;
+}
+
+.form-group.has-error .fileinput .fileinput-preview {
+  color: #b94a48;
+}
+
+.form-group.has-error .fileinput .thumbnail {
+  border-color: #ebccd1;
+}
+
+.form-group.has-success .fileinput .uneditable-input {
+  color: #468847;
+  border-color: #d6e9c6;
+}
+
+.form-group.has-success .fileinput .fileinput-preview {
+  color: #468847;
+}
+
+.form-group.has-success .fileinput .thumbnail {
+  border-color: #d6e9c6;
+}

diff --git a/src/web/css/bootstrap-theme.css b/src/web/css/bootstrap-theme.css
new file mode 100644
index 0000000..c9c347e
--- /dev/null
+++ b/src/web/css/bootstrap-theme.css
@@ -0,0 +1,459 @@
+/*!
+ * Bootstrap v3.0.2 by @fat and @mdo
+ * Copyright 2013 Twitter, Inc.
+ * Licensed under http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Designed and built with all the love in the world by @mdo and @fat.
+ */
+
+.btn-default,
+.btn-primary,
+.btn-success,
+.btn-info,
+.btn-warning,
+.btn-danger {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+
+.btn-default:active,
+.btn-primary:active,
+.btn-success:active,
+.btn-info:active,
+.btn-warning:active,
+.btn-danger:active,
+.btn-default.active,
+.btn-primary.active,
+.btn-success.active,
+.btn-info.active,
+.btn-warning.active,
+.btn-danger.active {
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+          box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+
+.btn:active,
+.btn.active {
+  background-image: none;
+}
+
+.btn-default {
+  text-shadow: 0 1px 0 #fff;
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#ffffff), to(#e0e0e0));
+  background-image: -webkit-linear-gradient(top, #ffffff 0%, #e0e0e0 100%);
+  background-image: -moz-linear-gradient(top, #ffffff 0%, #e0e0e0 100%);
+  background-image: linear-gradient(to bottom, #ffffff 0%, #e0e0e0 100%);
+  background-repeat: repeat-x;
+  border-color: #dbdbdb;
+  border-color: #ccc;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.btn-default:hover,
+.btn-default:focus {
+  background-color: #e0e0e0;
+  background-position: 0 -15px;
+}
+
+.btn-default:active,
+.btn-default.active {
+  background-color: #e0e0e0;
+  border-color: #dbdbdb;
+}
+
+.btn-primary {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#2d6ca2));
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
+  background-image: -moz-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
+  background-image: linear-gradient(to bottom, #428bca 0%, #2d6ca2 100%);
+  background-repeat: repeat-x;
+  border-color: #2b669a;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.btn-primary:hover,
+.btn-primary:focus {
+  background-color: #2d6ca2;
+  background-position: 0 -15px;
+}
+
+.btn-primary:active,
+.btn-primary.active {
+  background-color: #2d6ca2;
+  border-color: #2b669a;
+}
+
+.btn-success {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#5cb85c), to(#419641));
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image: -moz-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
+  background-repeat: repeat-x;
+  border-color: #3e8f3e;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.btn-success:hover,
+.btn-success:focus {
+  background-color: #419641;
+  background-position: 0 -15px;
+}
+
+.btn-success:active,
+.btn-success.active {
+  background-color: #419641;
+  border-color: #3e8f3e;
+}
+
+.btn-warning {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f0ad4e), to(#eb9316));
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image: -moz-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
+  background-repeat: repeat-x;
+  border-color: #e38d13;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.btn-warning:hover,
+.btn-warning:focus {
+  background-color: #eb9316;
+  background-position: 0 -15px;
+}
+
+.btn-warning:active,
+.btn-warning.active {
+  background-color: #eb9316;
+  border-color: #e38d13;
+}
+
+.btn-danger {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#d9534f), to(#c12e2a));
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image: -moz-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
+  background-repeat: repeat-x;
+  border-color: #b92c28;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.btn-danger:hover,
+.btn-danger:focus {
+  background-color: #c12e2a;
+  background-position: 0 -15px;
+}
+
+.btn-danger:active,
+.btn-danger.active {
+  background-color: #c12e2a;
+  border-color: #b92c28;
+}
+
+.btn-info {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#5bc0de), to(#2aabd2));
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image: -moz-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
+  background-repeat: repeat-x;
+  border-color: #28a4c9;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.btn-info:hover,
+.btn-info:focus {
+  background-color: #2aabd2;
+  background-position: 0 -15px;
+}
+
+.btn-info:active,
+.btn-info.active {
+  background-color: #2aabd2;
+  border-color: #28a4c9;
+}
+
+.thumbnail,
+.img-thumbnail {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
+}
+
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  background-color: #e8e8e8;
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f5f5f5), to(#e8e8e8));
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: -moz-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+}
+
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  background-color: #357ebd;
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#357ebd));
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
+  background-image: -moz-linear-gradient(top, #428bca 0%, #357ebd 100%);
+  background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
+}
+
+.navbar-default {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#ffffff), to(#f8f8f8));
+  background-image: -webkit-linear-gradient(top, #ffffff 0%, #f8f8f8 100%);
+  background-image: -moz-linear-gradient(top, #ffffff 0%, #f8f8f8 100%);
+  background-image: linear-gradient(to bottom, #ffffff 0%, #f8f8f8 100%);
+  background-repeat: repeat-x;
+  border-radius: 4px;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
+}
+
+.navbar-default .navbar-nav > .active > a {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#ebebeb), to(#f3f3f3));
+  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
+  background-image: -moz-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
+  background-image: linear-gradient(to bottom, #ebebeb 0%, #f3f3f3 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff3f3f3', GradientType=0);
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.075);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.075);
+}
+
+.navbar-brand,
+.navbar-nav > li > a {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
+}
+
+.navbar-inverse {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#3c3c3c), to(#222222));
+  background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222222 100%);
+  background-image: -moz-linear-gradient(top, #3c3c3c 0%, #222222 100%);
+  background-image: linear-gradient(to bottom, #3c3c3c 0%, #222222 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+.navbar-inverse .navbar-nav > .active > a {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#222222), to(#282828));
+  background-image: -webkit-linear-gradient(top, #222222 0%, #282828 100%);
+  background-image: -moz-linear-gradient(top, #222222 0%, #282828 100%);
+  background-image: linear-gradient(to bottom, #222222 0%, #282828 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff282828', GradientType=0);
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.25);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.25);
+}
+
+.navbar-inverse .navbar-brand,
+.navbar-inverse .navbar-nav > li > a {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+}
+
+.navbar-static-top,
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  border-radius: 0;
+}
+
+.alert {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
+}
+
+.alert-success {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#dff0d8), to(#c8e5bc));
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image: -moz-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
+  background-repeat: repeat-x;
+  border-color: #b2dba1;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
+}
+
+.alert-info {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#d9edf7), to(#b9def0));
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image: -moz-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
+  background-repeat: repeat-x;
+  border-color: #9acfea;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
+}
+
+.alert-warning {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#fcf8e3), to(#f8efc0));
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image: -moz-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
+  background-repeat: repeat-x;
+  border-color: #f5e79e;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
+}
+
+.alert-danger {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f2dede), to(#e7c3c3));
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image: -moz-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
+  background-repeat: repeat-x;
+  border-color: #dca7a7;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
+}
+
+.progress {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#ebebeb), to(#f5f5f5));
+  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image: -moz-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
+}
+
+.progress-bar {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#3071a9));
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #3071a9 100%);
+  background-image: -moz-linear-gradient(top, #428bca 0%, #3071a9 100%);
+  background-image: linear-gradient(to bottom, #428bca 0%, #3071a9 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3071a9', GradientType=0);
+}
+
+.progress-bar-success {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#5cb85c), to(#449d44));
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image: -moz-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
+}
+
+.progress-bar-info {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#5bc0de), to(#31b0d5));
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image: -moz-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
+}
+
+.progress-bar-warning {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f0ad4e), to(#ec971f));
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image: -moz-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
+}
+
+.progress-bar-danger {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#d9534f), to(#c9302c));
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image: -moz-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
+}
+
+.list-group {
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
+}
+
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
+  text-shadow: 0 -1px 0 #3071a9;
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#3278b3));
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #3278b3 100%);
+  background-image: -moz-linear-gradient(top, #428bca 0%, #3278b3 100%);
+  background-image: linear-gradient(to bottom, #428bca 0%, #3278b3 100%);
+  background-repeat: repeat-x;
+  border-color: #3278b3;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3278b3', GradientType=0);
+}
+
+.panel {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+}
+
+.panel-default > .panel-heading {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f5f5f5), to(#e8e8e8));
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: -moz-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+}
+
+.panel-primary > .panel-heading {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#357ebd));
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
+  background-image: -moz-linear-gradient(top, #428bca 0%, #357ebd 100%);
+  background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
+}
+
+.panel-success > .panel-heading {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#dff0d8), to(#d0e9c6));
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image: -moz-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
+}
+
+.panel-info > .panel-heading {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#d9edf7), to(#c4e3f3));
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image: -moz-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
+}
+
+.panel-warning > .panel-heading {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#fcf8e3), to(#faf2cc));
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image: -moz-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
+}
+
+.panel-danger > .panel-heading {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f2dede), to(#ebcccc));
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image: -moz-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
+}
+
+.well {
+  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#e8e8e8), to(#f5f5f5));
+  background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image: -moz-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
+  background-repeat: repeat-x;
+  border-color: #dcdcdc;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
+  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.1);
+          box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.1);
+}
\ No newline at end of file

diff --git a/src/web/fonts/glyphicons-halflings-regular.eot b/src/web/fonts/glyphicons-halflings-regular.eot
new file mode 100644
index 0000000..423bd5d
Binary files /dev/null and b/src/web/fonts/glyphicons-halflings-regular.eot differ

diff --git a/src/web/fonts/glyphicons-halflings-regular.svg b/src/web/fonts/glyphicons-halflings-regular.svg
new file mode 100644
index 0000000..4469488
--- /dev/null
+++ b/src/web/fonts/glyphicons-halflings-regular.svg
@@ -0,0 +1,229 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata></metadata>
+<defs>
+<font id="glyphicons_halflingsregular" horiz-adv-x="1200" >
+<font-face units-per-em="1200" ascent="960" descent="-240" />
+<missing-glyph horiz-adv-x="500" />
+<glyph />
+<glyph />
+<glyph unicode="&#xd;" />
+<glyph unicode=" " />
+<glyph unicode="*" d="M100 500v200h259l-183 183l141 141l183 -183v259h200v-259l183 183l141 -141l-183 -183h259v-200h-259l183 -183l-141 -141l-183 183v-259h-200v259l-183 -183l-141 141l183 183h-259z" />
+<glyph unicode="+" d="M0 400v300h400v400h300v-400h400v-300h-400v-400h-300v400h-400z" />
+<glyph unicode="&#xa0;" />
+<glyph unicode="&#x2000;" horiz-adv-x="652" />
+<glyph unicode="&#x2001;" horiz-adv-x="1304" />
+<glyph unicode="&#x2002;" horiz-adv-x="652" />
+<glyph unicode="&#x2003;" horiz-adv-x="1304" />
+<glyph unicode="&#x2004;" horiz-adv-x="434" />
+<glyph unicode="&#x2005;" horiz-adv-x="326" />
+<glyph unicode="&#x2006;" horiz-adv-x="217" />
+<glyph unicode="&#x2007;" horiz-adv-x="217" />
+<glyph unicode="&#x2008;" horiz-adv-x="163" />
+<glyph unicode="&#x2009;" horiz-adv-x="260" />
+<glyph unicode="&#x200a;" horiz-adv-x="72" />
+<glyph unicode="&#x202f;" horiz-adv-x="260" />
+<glyph unicode="&#x205f;" horiz-adv-x="326" />
+<glyph unicode="&#x20ac;" d="M100 500l100 100h113q0 47 5 100h-218l100 100h135q37 167 112 257q117 141 297 141q242 0 354 -189q60 -103 66 -209h-181q0 55 -25.5 99t-63.5 68t-75 36.5t-67 12.5q-24 0 -52.5 -10t-62.5 -32t-65.5 -67t-50.5 -107h379l-100 -100h-300q-6 -46 -6 -100h406l-100 -100 h-300q9 -74 33 -132t52.5 -91t62 -54.5t59 -29t46.5 -7.5q29 0 66 13t75 37t63.5 67.5t25.5 96.5h174q-31 -172 -128 -278q-107 -117 -274 -117q-205 0 -324 158q-36 46 -69 131.5t-45 205.5h-217z" />
+<glyph unicode="&#x2212;" d="M200 400h900v300h-900v-300z" />
+<glyph unicode="&#x2601;" d="M-14 494q0 -80 56.5 -137t135.5 -57h750q120 0 205 86t85 208q0 120 -85 206.5t-205 86.5q-46 0 -90 -14q-44 97 -134.5 156.5t-200.5 59.5q-152 0 -260 -107.5t-108 -260.5q0 -25 2 -37q-66 -14 -108.5 -67.5t-42.5 -122.5z" />
+<glyph unicode="&#x2709;" d="M0 100l400 400l200 -200l200 200l400 -400h-1200zM0 300v600l300 -300zM0 1100l600 -603l600 603h-1200zM900 600l300 300v-600z" />
+<glyph unicode="&#x270f;" d="M-13 -13l333 112l-223 223zM187 403l214 -214l614 614l-214 214zM887 1103l214 -214l99 92q13 13 13 32.5t-13 33.5l-153 153q-15 13 -33 13t-33 -13z" />
+<glyph unicode="&#xe000;" horiz-adv-x="500" d="M0 0z" />
+<glyph unicode="&#xe001;" d="M0 1200h1200l-500 -550v-550h300v-100h-800v100h300v550z" />
+<glyph unicode="&#xe002;" d="M14 84q18 -55 86 -75.5t147 5.5q65 21 109 69t44 90v606l600 155v-521q-64 16 -138 -7q-79 -26 -122.5 -83t-25.5 -111q17 -55 85.5 -75.5t147.5 4.5q70 23 111.5 63.5t41.5 95.5v881q0 10 -7 15.5t-17 2.5l-752 -193q-10 -3 -17 -12.5t-7 -19.5v-689q-64 17 -138 -7 q-79 -25 -122.5 -82t-25.5 -112z" />
+<glyph unicode="&#xe003;" d="M23 693q0 200 142 342t342 142t342 -142t142 -342q0 -142 -78 -261l300 -300q7 -8 7 -18t-7 -18l-109 -109q-8 -7 -18 -7t-18 7l-300 300q-119 -78 -261 -78q-200 0 -342 142t-142 342zM176 693q0 -136 97 -233t234 -97t233.5 96.5t96.5 233.5t-96.5 233.5t-233.5 96.5 t-234 -97t-97 -233z" />
+<glyph unicode="&#xe005;" d="M100 784q0 64 28 123t73 100.5t104.5 64t119 20.5t120 -38.5t104.5 -104.5q48 69 109.5 105t121.5 38t118.5 -20.5t102.5 -64t71 -100.5t27 -123q0 -57 -33.5 -117.5t-94 -124.5t-126.5 -127.5t-150 -152.5t-146 -174q-62 85 -145.5 174t-149.5 152.5t-126.5 127.5 t-94 124.5t-33.5 117.5z" />
+<glyph unicode="&#xe006;" d="M-72 800h479l146 400h2l146 -400h472l-382 -278l145 -449l-384 275l-382 -275l146 447zM168 71l2 1z" />
+<glyph unicode="&#xe007;" d="M-72 800h479l146 400h2l146 -400h472l-382 -278l145 -449l-384 275l-382 -275l146 447zM168 71l2 1zM237 700l196 -142l-73 -226l192 140l195 -141l-74 229l193 140h-235l-77 211l-78 -211h-239z" />
+<glyph unicode="&#xe008;" d="M0 0v143l400 257v100q-37 0 -68.5 74.5t-31.5 125.5v200q0 124 88 212t212 88t212 -88t88 -212v-200q0 -51 -31.5 -125.5t-68.5 -74.5v-100l400 -257v-143h-1200z" />
+<glyph unicode="&#xe009;" d="M0 0v1100h1200v-1100h-1200zM100 100h100v100h-100v-100zM100 300h100v100h-100v-100zM100 500h100v100h-100v-100zM100 700h100v100h-100v-100zM100 900h100v100h-100v-100zM300 100h600v400h-600v-400zM300 600h600v400h-600v-400zM1000 100h100v100h-100v-100z M1000 300h100v100h-100v-100zM1000 500h100v100h-100v-100zM1000 700h100v100h-100v-100zM1000 900h100v100h-100v-100z" />
+<glyph unicode="&#xe010;" d="M0 50v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5zM0 650v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400 q-21 0 -35.5 14.5t-14.5 35.5zM600 50v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5zM600 650v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400 q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe011;" d="M0 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM0 450v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200 q-21 0 -35.5 14.5t-14.5 35.5zM0 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5 t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 450v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5 v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM800 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM800 450v200q0 21 14.5 35.5t35.5 14.5h200 q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM800 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe012;" d="M0 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM0 450q0 -21 14.5 -35.5t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v200q0 21 -14.5 35.5t-35.5 14.5h-200q-21 0 -35.5 -14.5 t-14.5 -35.5v-200zM0 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 50v200q0 21 14.5 35.5t35.5 14.5h700q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5 t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5zM400 450v200q0 21 14.5 35.5t35.5 14.5h700q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5zM400 850v200q0 21 14.5 35.5t35.5 14.5h700q21 0 35.5 -14.5t14.5 -35.5 v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe013;" d="M29 454l419 -420l818 820l-212 212l-607 -607l-206 207z" />
+<glyph unicode="&#xe014;" d="M106 318l282 282l-282 282l212 212l282 -282l282 282l212 -212l-282 -282l282 -282l-212 -212l-282 282l-282 -282z" />
+<glyph unicode="&#xe015;" d="M23 693q0 200 142 342t342 142t342 -142t142 -342q0 -142 -78 -261l300 -300q7 -8 7 -18t-7 -18l-109 -109q-8 -7 -18 -7t-18 7l-300 300q-119 -78 -261 -78q-200 0 -342 142t-142 342zM176 693q0 -136 97 -233t234 -97t233.5 96.5t96.5 233.5t-96.5 233.5t-233.5 96.5 t-234 -97t-97 -233zM300 600v200h100v100h200v-100h100v-200h-100v-100h-200v100h-100z" />
+<glyph unicode="&#xe016;" d="M23 694q0 200 142 342t342 142t342 -142t142 -342q0 -141 -78 -262l300 -299q7 -7 7 -18t-7 -18l-109 -109q-8 -8 -18 -8t-18 8l-300 299q-120 -77 -261 -77q-200 0 -342 142t-142 342zM176 694q0 -136 97 -233t234 -97t233.5 97t96.5 233t-96.5 233t-233.5 97t-234 -97 t-97 -233zM300 601h400v200h-400v-200z" />
+<glyph unicode="&#xe017;" d="M23 600q0 183 105 331t272 210v-166q-103 -55 -165 -155t-62 -220q0 -177 125 -302t302 -125t302 125t125 302q0 120 -62 220t-165 155v166q167 -62 272 -210t105 -331q0 -118 -45.5 -224.5t-123 -184t-184 -123t-224.5 -45.5t-224.5 45.5t-184 123t-123 184t-45.5 224.5 zM500 750q0 -21 14.5 -35.5t35.5 -14.5h100q21 0 35.5 14.5t14.5 35.5v400q0 21 -14.5 35.5t-35.5 14.5h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-400z" />
+<glyph unicode="&#xe018;" d="M100 1h200v300h-200v-300zM400 1v500h200v-500h-200zM700 1v800h200v-800h-200zM1000 1v1200h200v-1200h-200z" />
+<glyph unicode="&#xe019;" d="M26 601q0 -33 6 -74l151 -38l2 -6q14 -49 38 -93l3 -5l-80 -134q45 -59 105 -105l133 81l5 -3q45 -26 94 -39l5 -2l38 -151q40 -5 74 -5q27 0 74 5l38 151l6 2q46 13 93 39l5 3l134 -81q56 44 104 105l-80 134l3 5q24 44 39 93l1 6l152 38q5 40 5 74q0 28 -5 73l-152 38 l-1 6q-16 51 -39 93l-3 5l80 134q-44 58 -104 105l-134 -81l-5 3q-45 25 -93 39l-6 1l-38 152q-40 5 -74 5q-27 0 -74 -5l-38 -152l-5 -1q-50 -14 -94 -39l-5 -3l-133 81q-59 -47 -105 -105l80 -134l-3 -5q-25 -47 -38 -93l-2 -6l-151 -38q-6 -48 -6 -73zM385 601 q0 88 63 151t152 63t152 -63t63 -151q0 -89 -63 -152t-152 -63t-152 63t-63 152z" />
+<glyph unicode="&#xe020;" d="M100 1025v50q0 10 7.5 17.5t17.5 7.5h275v100q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5v-100h275q10 0 17.5 -7.5t7.5 -17.5v-50q0 -11 -7 -18t-18 -7h-1050q-11 0 -18 7t-7 18zM200 100v800h900v-800q0 -41 -29.5 -71t-70.5 -30h-700q-41 0 -70.5 30 t-29.5 71zM300 100h100v700h-100v-700zM500 100h100v700h-100v-700zM500 1100h300v100h-300v-100zM700 100h100v700h-100v-700zM900 100h100v700h-100v-700z" />
+<glyph unicode="&#xe021;" d="M1 601l656 644l644 -644h-200v-600h-300v400h-300v-400h-300v600h-200z" />
+<glyph unicode="&#xe022;" d="M100 25v1150q0 11 7 18t18 7h475v-500h400v-675q0 -11 -7 -18t-18 -7h-850q-11 0 -18 7t-7 18zM700 800v300l300 -300h-300z" />
+<glyph unicode="&#xe023;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM500 500v400h100 v-300h200v-100h-300z" />
+<glyph unicode="&#xe024;" d="M-100 0l431 1200h209l-21 -300h162l-20 300h208l431 -1200h-538l-41 400h-242l-40 -400h-539zM488 500h224l-27 300h-170z" />
+<glyph unicode="&#xe025;" d="M0 0v400h490l-290 300h200v500h300v-500h200l-290 -300h490v-400h-1100zM813 200h175v100h-175v-100z" />
+<glyph unicode="&#xe026;" d="M1 600q0 122 47.5 233t127.5 191t191 127.5t233 47.5t233 -47.5t191 -127.5t127.5 -191t47.5 -233t-47.5 -233t-127.5 -191t-191 -127.5t-233 -47.5t-233 47.5t-191 127.5t-127.5 191t-47.5 233zM188 600q0 -170 121 -291t291 -121t291 121t121 291t-121 291t-291 121 t-291 -121t-121 -291zM350 600h150v300h200v-300h150l-250 -300z" />
+<glyph unicode="&#xe027;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM350 600l250 300 l250 -300h-150v-300h-200v300h-150z" />
+<glyph unicode="&#xe028;" d="M0 25v475l200 700h800q199 -700 200 -700v-475q0 -11 -7 -18t-18 -7h-1150q-11 0 -18 7t-7 18zM200 500h200l50 -200h300l50 200h200l-97 500h-606z" />
+<glyph unicode="&#xe029;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -172 121.5 -293t292.5 -121t292.5 121t121.5 293q0 171 -121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM500 397v401 l297 -200z" />
+<glyph unicode="&#xe030;" d="M23 600q0 -118 45.5 -224.5t123 -184t184 -123t224.5 -45.5t224.5 45.5t184 123t123 184t45.5 224.5h-150q0 -177 -125 -302t-302 -125t-302 125t-125 302t125 302t302 125q136 0 246 -81l-146 -146h400v400l-145 -145q-157 122 -355 122q-118 0 -224.5 -45.5t-184 -123 t-123 -184t-45.5 -224.5z" />
+<glyph unicode="&#xe031;" d="M23 600q0 118 45.5 224.5t123 184t184 123t224.5 45.5q198 0 355 -122l145 145v-400h-400l147 147q-112 80 -247 80q-177 0 -302 -125t-125 -302h-150zM100 0v400h400l-147 -147q112 -80 247 -80q177 0 302 125t125 302h150q0 -118 -45.5 -224.5t-123 -184t-184 -123 t-224.5 -45.5q-198 0 -355 122z" />
+<glyph unicode="&#xe032;" d="M100 0h1100v1200h-1100v-1200zM200 100v900h900v-900h-900zM300 200v100h100v-100h-100zM300 400v100h100v-100h-100zM300 600v100h100v-100h-100zM300 800v100h100v-100h-100zM500 200h500v100h-500v-100zM500 400v100h500v-100h-500zM500 600v100h500v-100h-500z M500 800v100h500v-100h-500z" />
+<glyph unicode="&#xe033;" d="M0 100v600q0 41 29.5 70.5t70.5 29.5h100v200q0 82 59 141t141 59h300q82 0 141 -59t59 -141v-200h100q41 0 70.5 -29.5t29.5 -70.5v-600q0 -41 -29.5 -70.5t-70.5 -29.5h-900q-41 0 -70.5 29.5t-29.5 70.5zM400 800h300v150q0 21 -14.5 35.5t-35.5 14.5h-200 q-21 0 -35.5 -14.5t-14.5 -35.5v-150z" />
+<glyph unicode="&#xe034;" d="M100 0v1100h100v-1100h-100zM300 400q60 60 127.5 84t127.5 17.5t122 -23t119 -30t110 -11t103 42t91 120.5v500q-40 -81 -101.5 -115.5t-127.5 -29.5t-138 25t-139.5 40t-125.5 25t-103 -29.5t-65 -115.5v-500z" />
+<glyph unicode="&#xe035;" d="M0 275q0 -11 7 -18t18 -7h50q11 0 18 7t7 18v300q0 127 70.5 231.5t184.5 161.5t245 57t245 -57t184.5 -161.5t70.5 -231.5v-300q0 -11 7 -18t18 -7h50q11 0 18 7t7 18v300q0 116 -49.5 227t-131 192.5t-192.5 131t-227 49.5t-227 -49.5t-192.5 -131t-131 -192.5 t-49.5 -227v-300zM200 20v460q0 8 6 14t14 6h160q8 0 14 -6t6 -14v-460q0 -8 -6 -14t-14 -6h-160q-8 0 -14 6t-6 14zM800 20v460q0 8 6 14t14 6h160q8 0 14 -6t6 -14v-460q0 -8 -6 -14t-14 -6h-160q-8 0 -14 6t-6 14z" />
+<glyph unicode="&#xe036;" d="M0 400h300l300 -200v800l-300 -200h-300v-400zM688 459l141 141l-141 141l71 71l141 -141l141 141l71 -71l-141 -141l141 -141l-71 -71l-141 141l-141 -141z" />
+<glyph unicode="&#xe037;" d="M0 400h300l300 -200v800l-300 -200h-300v-400zM700 857l69 53q111 -135 111 -310q0 -169 -106 -302l-67 54q86 110 86 248q0 146 -93 257z" />
+<glyph unicode="&#xe038;" d="M0 401v400h300l300 200v-800l-300 200h-300zM702 858l69 53q111 -135 111 -310q0 -170 -106 -303l-67 55q86 110 86 248q0 145 -93 257zM889 951l7 -8q123 -151 123 -344q0 -189 -119 -339l-7 -8l81 -66l6 8q142 178 142 405q0 230 -144 408l-6 8z" />
+<glyph unicode="&#xe039;" d="M0 0h500v500h-200v100h-100v-100h-200v-500zM0 600h100v100h400v100h100v100h-100v300h-500v-600zM100 100v300h300v-300h-300zM100 800v300h300v-300h-300zM200 200v100h100v-100h-100zM200 900h100v100h-100v-100zM500 500v100h300v-300h200v-100h-100v-100h-200v100 h-100v100h100v200h-200zM600 0v100h100v-100h-100zM600 1000h100v-300h200v-300h300v200h-200v100h200v500h-600v-200zM800 800v300h300v-300h-300zM900 0v100h300v-100h-300zM900 900v100h100v-100h-100zM1100 200v100h100v-100h-100z" />
+<glyph unicode="&#xe040;" d="M0 200h100v1000h-100v-1000zM100 0v100h300v-100h-300zM200 200v1000h100v-1000h-100zM500 0v91h100v-91h-100zM500 200v1000h200v-1000h-200zM700 0v91h100v-91h-100zM800 200v1000h100v-1000h-100zM900 0v91h200v-91h-200zM1000 200v1000h200v-1000h-200z" />
+<glyph unicode="&#xe041;" d="M1 700v475q0 10 7.5 17.5t17.5 7.5h474l700 -700l-500 -500zM148 953q0 -42 29 -71q30 -30 71.5 -30t71.5 30q29 29 29 71t-29 71q-30 30 -71.5 30t-71.5 -30q-29 -29 -29 -71z" />
+<glyph unicode="&#xe042;" d="M2 700v475q0 11 7 18t18 7h474l700 -700l-500 -500zM148 953q0 -42 30 -71q29 -30 71 -30t71 30q30 29 30 71t-30 71q-29 30 -71 30t-71 -30q-30 -29 -30 -71zM701 1200h100l700 -700l-500 -500l-50 50l450 450z" />
+<glyph unicode="&#xe043;" d="M100 0v1025l175 175h925v-1000l-100 -100v1000h-750l-100 -100h750v-1000h-900z" />
+<glyph unicode="&#xe044;" d="M200 0l450 444l450 -443v1150q0 20 -14.5 35t-35.5 15h-800q-21 0 -35.5 -15t-14.5 -35v-1151z" />
+<glyph unicode="&#xe045;" d="M0 100v700h200l100 -200h600l100 200h200v-700h-200v200h-800v-200h-200zM253 829l40 -124h592l62 124l-94 346q-2 11 -10 18t-18 7h-450q-10 0 -18 -7t-10 -18zM281 24l38 152q2 10 11.5 17t19.5 7h500q10 0 19.5 -7t11.5 -17l38 -152q2 -10 -3.5 -17t-15.5 -7h-600 q-10 0 -15.5 7t-3.5 17z" />
+<glyph unicode="&#xe046;" d="M0 200q0 -41 29.5 -70.5t70.5 -29.5h1000q41 0 70.5 29.5t29.5 70.5v600q0 41 -29.5 70.5t-70.5 29.5h-150q-4 8 -11.5 21.5t-33 48t-53 61t-69 48t-83.5 21.5h-200q-41 0 -82 -20.5t-70 -50t-52 -59t-34 -50.5l-12 -20h-150q-41 0 -70.5 -29.5t-29.5 -70.5v-600z M356 500q0 100 72 172t172 72t172 -72t72 -172t-72 -172t-172 -72t-172 72t-72 172zM494 500q0 -44 31 -75t75 -31t75 31t31 75t-31 75t-75 31t-75 -31t-31 -75zM900 700v100h100v-100h-100z" />
+<glyph unicode="&#xe047;" d="M53 0h365v66q-41 0 -72 11t-49 38t1 71l92 234h391l82 -222q16 -45 -5.5 -88.5t-74.5 -43.5v-66h417v66q-34 1 -74 43q-18 19 -33 42t-21 37l-6 13l-385 998h-93l-399 -1006q-24 -48 -52 -75q-12 -12 -33 -25t-36 -20l-15 -7v-66zM416 521l178 457l46 -140l116 -317h-340 z" />
+<glyph unicode="&#xe048;" d="M100 0v89q41 7 70.5 32.5t29.5 65.5v827q0 28 -1 39.5t-5.5 26t-15.5 21t-29 14t-49 14.5v70h471q120 0 213 -88t93 -228q0 -55 -11.5 -101.5t-28 -74t-33.5 -47.5t-28 -28l-12 -7q8 -3 21.5 -9t48 -31.5t60.5 -58t47.5 -91.5t21.5 -129q0 -84 -59 -156.5t-142 -111 t-162 -38.5h-500zM400 200h161q89 0 153 48.5t64 132.5q0 90 -62.5 154.5t-156.5 64.5h-159v-400zM400 700h139q76 0 130 61.5t54 138.5q0 82 -84 130.5t-239 48.5v-379z" />
+<glyph unicode="&#xe049;" d="M200 0v57q77 7 134.5 40.5t65.5 80.5l173 849q10 56 -10 74t-91 37q-6 1 -10.5 2.5t-9.5 2.5v57h425l2 -57q-33 -8 -62 -25.5t-46 -37t-29.5 -38t-17.5 -30.5l-5 -12l-128 -825q-10 -52 14 -82t95 -36v-57h-500z" />
+<glyph unicode="&#xe050;" d="M-75 200h75v800h-75l125 167l125 -167h-75v-800h75l-125 -167zM300 900v300h150h700h150v-300h-50q0 29 -8 48.5t-18.5 30t-33.5 15t-39.5 5.5t-50.5 1h-200v-850l100 -50v-100h-400v100l100 50v850h-200q-34 0 -50.5 -1t-40 -5.5t-33.5 -15t-18.5 -30t-8.5 -48.5h-49z " />
+<glyph unicode="&#xe051;" d="M33 51l167 125v-75h800v75l167 -125l-167 -125v75h-800v-75zM100 901v300h150h700h150v-300h-50q0 29 -8 48.5t-18 30t-33.5 15t-40 5.5t-50.5 1h-200v-650l100 -50v-100h-400v100l100 50v650h-200q-34 0 -50.5 -1t-39.5 -5.5t-33.5 -15t-18.5 -30t-8 -48.5h-50z" />
+<glyph unicode="&#xe052;" d="M0 50q0 -20 14.5 -35t35.5 -15h1100q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM0 350q0 -20 14.5 -35t35.5 -15h800q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-800q-21 0 -35.5 -14.5t-14.5 -35.5 v-100zM0 650q0 -20 14.5 -35t35.5 -15h1000q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1000q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM0 950q0 -20 14.5 -35t35.5 -15h600q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-600q-21 0 -35.5 -14.5 t-14.5 -35.5v-100z" />
+<glyph unicode="&#xe053;" d="M0 50q0 -20 14.5 -35t35.5 -15h1100q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM0 650q0 -20 14.5 -35t35.5 -15h1100q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5 v-100zM200 350q0 -20 14.5 -35t35.5 -15h700q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-700q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM200 950q0 -20 14.5 -35t35.5 -15h700q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-700q-21 0 -35.5 -14.5 t-14.5 -35.5v-100z" />
+<glyph unicode="&#xe054;" d="M0 50v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15t-14.5 35zM100 650v100q0 21 14.5 35.5t35.5 14.5h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1000q-21 0 -35.5 15 t-14.5 35zM300 350v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800q-21 0 -35.5 15t-14.5 35zM500 950v100q0 21 14.5 35.5t35.5 14.5h600q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-600 q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe055;" d="M0 50v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15t-14.5 35zM0 350v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15 t-14.5 35zM0 650v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15t-14.5 35zM0 950v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100 q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe056;" d="M0 50v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15t-14.5 35zM0 350v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15 t-14.5 35zM0 650v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15t-14.5 35zM0 950v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15 t-14.5 35zM300 50v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800q-21 0 -35.5 15t-14.5 35zM300 350v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800 q-21 0 -35.5 15t-14.5 35zM300 650v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800q-21 0 -35.5 15t-14.5 35zM300 950v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15 h-800q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe057;" d="M-101 500v100h201v75l166 -125l-166 -125v75h-201zM300 0h100v1100h-100v-1100zM500 50q0 -20 14.5 -35t35.5 -15h600q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-600q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM500 350q0 -20 14.5 -35t35.5 -15h300q20 0 35 15t15 35 v100q0 21 -15 35.5t-35 14.5h-300q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM500 650q0 -20 14.5 -35t35.5 -15h500q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-500q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM500 950q0 -20 14.5 -35t35.5 -15h100q20 0 35 15t15 35v100 q0 21 -15 35.5t-35 14.5h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-100z" />
+<glyph unicode="&#xe058;" d="M1 50q0 -20 14.5 -35t35.5 -15h600q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-600q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM1 350q0 -20 14.5 -35t35.5 -15h300q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-300q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM1 650 q0 -20 14.5 -35t35.5 -15h500q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-500q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM1 950q0 -20 14.5 -35t35.5 -15h100q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM801 0v1100h100v-1100 h-100zM934 550l167 -125v75h200v100h-200v75z" />
+<glyph unicode="&#xe059;" d="M0 275v650q0 31 22 53t53 22h750q31 0 53 -22t22 -53v-650q0 -31 -22 -53t-53 -22h-750q-31 0 -53 22t-22 53zM900 600l300 300v-600z" />
+<glyph unicode="&#xe060;" d="M0 44v1012q0 18 13 31t31 13h1112q19 0 31.5 -13t12.5 -31v-1012q0 -18 -12.5 -31t-31.5 -13h-1112q-18 0 -31 13t-13 31zM100 263l247 182l298 -131l-74 156l293 318l236 -288v500h-1000v-737zM208 750q0 56 39 95t95 39t95 -39t39 -95t-39 -95t-95 -39t-95 39t-39 95z " />
+<glyph unicode="&#xe062;" d="M148 745q0 124 60.5 231.5t165 172t226.5 64.5q123 0 227 -63t164.5 -169.5t60.5 -229.5t-73 -272q-73 -114 -166.5 -237t-150.5 -189l-57 -66q-10 9 -27 26t-66.5 70.5t-96 109t-104 135.5t-100.5 155q-63 139 -63 262zM342 772q0 -107 75.5 -182.5t181.5 -75.5 q107 0 182.5 75.5t75.5 182.5t-75.5 182t-182.5 75t-182 -75.5t-75 -181.5z" />
+<glyph unicode="&#xe063;" d="M1 600q0 122 47.5 233t127.5 191t191 127.5t233 47.5t233 -47.5t191 -127.5t127.5 -191t47.5 -233t-47.5 -233t-127.5 -191t-191 -127.5t-233 -47.5t-233 47.5t-191 127.5t-127.5 191t-47.5 233zM173 600q0 -177 125.5 -302t301.5 -125v854q-176 0 -301.5 -125 t-125.5 -302z" />
+<glyph unicode="&#xe064;" d="M117 406q0 94 34 186t88.5 172.5t112 159t115 177t87.5 194.5q21 -71 57.5 -142.5t76 -130.5t83 -118.5t82 -117t70 -116t50 -125.5t18.5 -136q0 -89 -39 -165.5t-102 -126.5t-140 -79.5t-156 -33.5q-114 6 -211.5 53t-161.5 138.5t-64 210.5zM243 414q14 -82 59.5 -136 t136.5 -80l16 98q-7 6 -18 17t-34 48t-33 77q-15 73 -14 143.5t10 122.5l9 51q-92 -110 -119.5 -185t-12.5 -156z" />
+<glyph unicode="&#xe065;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5q366 -6 397 -14l-186 -186h-311q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v125l200 200v-225q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5 t-117.5 282.5zM436 341l161 50l412 412l-114 113l-405 -405zM995 1015l113 -113l113 113l-21 85l-92 28z" />
+<glyph unicode="&#xe066;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h261l2 -80q-133 -32 -218 -120h-145q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5l200 153v-53q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5t-117.5 282.5 zM423 524q30 38 81.5 64t103 35.5t99 14t77.5 3.5l29 -1v-209l360 324l-359 318v-216q-7 0 -19 -1t-48 -8t-69.5 -18.5t-76.5 -37t-76.5 -59t-62 -88t-39.5 -121.5z" />
+<glyph unicode="&#xe067;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h300q60 0 127 -23l-178 -177h-349q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v69l200 200v-169q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5 t-117.5 282.5zM342 632l283 -284l566 567l-136 137l-430 -431l-147 147z" />
+<glyph unicode="&#xe068;" d="M0 603l300 296v-198h200v200h-200l300 300l295 -300h-195v-200h200v198l300 -296l-300 -300v198h-200v-200h195l-295 -300l-300 300h200v200h-200v-198z" />
+<glyph unicode="&#xe069;" d="M200 50v1000q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-437l500 487v-1100l-500 488v-438q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe070;" d="M0 50v1000q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-437l500 487v-487l500 487v-1100l-500 488v-488l-500 488v-438q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe071;" d="M136 550l564 550v-487l500 487v-1100l-500 488v-488z" />
+<glyph unicode="&#xe072;" d="M200 0l900 550l-900 550v-1100z" />
+<glyph unicode="&#xe073;" d="M200 150q0 -21 14.5 -35.5t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v800q0 21 -14.5 35.5t-35.5 14.5h-200q-21 0 -35.5 -14.5t-14.5 -35.5v-800zM600 150q0 -21 14.5 -35.5t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v800q0 21 -14.5 35.5t-35.5 14.5h-200 q-21 0 -35.5 -14.5t-14.5 -35.5v-800z" />
+<glyph unicode="&#xe074;" d="M200 150q0 -20 14.5 -35t35.5 -15h800q21 0 35.5 15t14.5 35v800q0 21 -14.5 35.5t-35.5 14.5h-800q-21 0 -35.5 -14.5t-14.5 -35.5v-800z" />
+<glyph unicode="&#xe075;" d="M0 0v1100l500 -487v487l564 -550l-564 -550v488z" />
+<glyph unicode="&#xe076;" d="M0 0v1100l500 -487v487l500 -487v437q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-1000q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v438l-500 -488v488z" />
+<glyph unicode="&#xe077;" d="M300 0v1100l500 -487v437q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-1000q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v438z" />
+<glyph unicode="&#xe078;" d="M100 250v100q0 21 14.5 35.5t35.5 14.5h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5zM100 500h1100l-550 564z" />
+<glyph unicode="&#xe079;" d="M185 599l592 -592l240 240l-353 353l353 353l-240 240z" />
+<glyph unicode="&#xe080;" d="M272 194l353 353l-353 353l241 240l572 -571l21 -22l-1 -1v-1l-592 -591z" />
+<glyph unicode="&#xe081;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -300t-217.5 -218t-299.5 -80t-299.5 80t-217.5 218t-80 300zM300 500h200v-200h200v200h200v200h-200v200h-200v-200h-200v-200z" />
+<glyph unicode="&#xe082;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -300t-217.5 -218t-299.5 -80t-299.5 80t-217.5 218t-80 300zM300 500h600v200h-600v-200z" />
+<glyph unicode="&#xe083;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -300t-217.5 -218t-299.5 -80t-299.5 80t-217.5 218t-80 300zM246 459l213 -213l141 142l141 -142l213 213l-142 141l142 141l-213 212l-141 -141l-141 142l-212 -213l141 -141z" />
+<glyph unicode="&#xe084;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM270 551l276 -277l411 411l-175 174l-236 -236l-102 102z" />
+<glyph unicode="&#xe085;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -300t-217.5 -218t-299.5 -80t-299.5 80t-217.5 218t-80 300zM363 700h144q4 0 11.5 -1t11 -1t6.5 3t3 9t1 11t3.5 8.5t3.5 6t5.5 4t6.5 2.5t9 1.5t9 0.5h11.5h12.5q19 0 30 -10t11 -26 q0 -22 -4 -28t-27 -22q-5 -1 -12.5 -3t-27 -13.5t-34 -27t-26.5 -46t-11 -68.5h200q5 3 14 8t31.5 25.5t39.5 45.5t31 69t14 94q0 51 -17.5 89t-42 58t-58.5 32t-58.5 15t-51.5 3q-105 0 -172 -56t-67 -183zM500 300h200v100h-200v-100z" />
+<glyph unicode="&#xe086;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -300t-217.5 -218t-299.5 -80t-299.5 80t-217.5 218t-80 300zM400 300h400v100h-100v300h-300v-100h100v-200h-100v-100zM500 800h200v100h-200v-100z" />
+<glyph unicode="&#xe087;" d="M0 500v200h194q15 60 36 104.5t55.5 86t88 69t126.5 40.5v200h200v-200q54 -20 113 -60t112.5 -105.5t71.5 -134.5h203v-200h-203q-25 -102 -116.5 -186t-180.5 -117v-197h-200v197q-140 27 -208 102.5t-98 200.5h-194zM290 500q24 -73 79.5 -127.5t130.5 -78.5v206h200 v-206q149 48 201 206h-201v200h200q-25 74 -76 127.5t-124 76.5v-204h-200v203q-75 -24 -130 -77.5t-79 -125.5h209v-200h-210z" />
+<glyph unicode="&#xe088;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM356 465l135 135 l-135 135l109 109l135 -135l135 135l109 -109l-135 -135l135 -135l-109 -109l-135 135l-135 -135z" />
+<glyph unicode="&#xe089;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM322 537l141 141 l87 -87l204 205l142 -142l-346 -345z" />
+<glyph unicode="&#xe090;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -115 62 -215l568 567q-100 62 -216 62q-171 0 -292.5 -121.5t-121.5 -292.5zM391 245q97 -59 209 -59q171 0 292.5 121.5t121.5 292.5 q0 112 -59 209z" />
+<glyph unicode="&#xe091;" d="M0 547l600 453v-300h600v-300h-600v-301z" />
+<glyph unicode="&#xe092;" d="M0 400v300h600v300l600 -453l-600 -448v301h-600z" />
+<glyph unicode="&#xe093;" d="M204 600l450 600l444 -600h-298v-600h-300v600h-296z" />
+<glyph unicode="&#xe094;" d="M104 600h296v600h300v-600h298l-449 -600z" />
+<glyph unicode="&#xe095;" d="M0 200q6 132 41 238.5t103.5 193t184 138t271.5 59.5v271l600 -453l-600 -448v301q-95 -2 -183 -20t-170 -52t-147 -92.5t-100 -135.5z" />
+<glyph unicode="&#xe096;" d="M0 0v400l129 -129l294 294l142 -142l-294 -294l129 -129h-400zM635 777l142 -142l294 294l129 -129v400h-400l129 -129z" />
+<glyph unicode="&#xe097;" d="M34 176l295 295l-129 129h400v-400l-129 130l-295 -295zM600 600v400l129 -129l295 295l142 -141l-295 -295l129 -130h-400z" />
+<glyph unicode="&#xe101;" d="M23 600q0 118 45.5 224.5t123 184t184 123t224.5 45.5t224.5 -45.5t184 -123t123 -184t45.5 -224.5t-45.5 -224.5t-123 -184t-184 -123t-224.5 -45.5t-224.5 45.5t-184 123t-123 184t-45.5 224.5zM456 851l58 -302q4 -20 21.5 -34.5t37.5 -14.5h54q20 0 37.5 14.5 t21.5 34.5l58 302q4 20 -8 34.5t-33 14.5h-207q-20 0 -32 -14.5t-8 -34.5zM500 300h200v100h-200v-100z" />
+<glyph unicode="&#xe102;" d="M0 800h100v-200h400v300h200v-300h400v200h100v100h-111v6t-1 15t-3 18l-34 172q-11 39 -41.5 63t-69.5 24q-32 0 -61 -17l-239 -144q-22 -13 -40 -35q-19 24 -40 36l-238 144q-33 18 -62 18q-39 0 -69.5 -23t-40.5 -61l-35 -177q-2 -8 -3 -18t-1 -15v-6h-111v-100z M100 0h400v400h-400v-400zM200 900q-3 0 14 48t35 96l18 47l214 -191h-281zM700 0v400h400v-400h-400zM731 900l202 197q5 -12 12 -32.5t23 -64t25 -72t7 -28.5h-269z" />
+<glyph unicode="&#xe103;" d="M0 -22v143l216 193q-9 53 -13 83t-5.5 94t9 113t38.5 114t74 124q47 60 99.5 102.5t103 68t127.5 48t145.5 37.5t184.5 43.5t220 58.5q0 -189 -22 -343t-59 -258t-89 -181.5t-108.5 -120t-122 -68t-125.5 -30t-121.5 -1.5t-107.5 12.5t-87.5 17t-56.5 7.5l-99 -55z M238.5 300.5q19.5 -6.5 86.5 76.5q55 66 367 234q70 38 118.5 69.5t102 79t99 111.5t86.5 148q22 50 24 60t-6 19q-7 5 -17 5t-26.5 -14.5t-33.5 -39.5q-35 -51 -113.5 -108.5t-139.5 -89.5l-61 -32q-369 -197 -458 -401q-48 -111 -28.5 -117.5z" />
+<glyph unicode="&#xe104;" d="M111 408q0 -33 5 -63q9 -56 44 -119.5t105 -108.5q31 -21 64 -16t62 23.5t57 49.5t48 61.5t35 60.5q32 66 39 184.5t-13 157.5q79 -80 122 -164t26 -184q-5 -33 -20.5 -69.5t-37.5 -80.5q-10 -19 -14.5 -29t-12 -26t-9 -23.5t-3 -19t2.5 -15.5t11 -9.5t19.5 -5t30.5 2.5 t42 8q57 20 91 34t87.5 44.5t87 64t65.5 88.5t47 122q38 172 -44.5 341.5t-246.5 278.5q22 -44 43 -129q39 -159 -32 -154q-15 2 -33 9q-79 33 -120.5 100t-44 175.5t48.5 257.5q-13 -8 -34 -23.5t-72.5 -66.5t-88.5 -105.5t-60 -138t-8 -166.5q2 -12 8 -41.5t8 -43t6 -39.5 t3.5 -39.5t-1 -33.5t-6 -31.5t-13.5 -24t-21 -20.5t-31 -12q-38 -10 -67 13t-40.5 61.5t-15 81.5t10.5 75q-52 -46 -83.5 -101t-39 -107t-7.5 -85z" />
+<glyph unicode="&#xe105;" d="M-61 600l26 40q6 10 20 30t49 63.5t74.5 85.5t97 90t116.5 83.5t132.5 59t145.5 23.5t145.5 -23.5t132.5 -59t116.5 -83.5t97 -90t74.5 -85.5t49 -63.5t20 -30l26 -40l-26 -40q-6 -10 -20 -30t-49 -63.5t-74.5 -85.5t-97 -90t-116.5 -83.5t-132.5 -59t-145.5 -23.5 t-145.5 23.5t-132.5 59t-116.5 83.5t-97 90t-74.5 85.5t-49 63.5t-20 30zM120 600q7 -10 40.5 -58t56 -78.5t68 -77.5t87.5 -75t103 -49.5t125 -21.5t123.5 20t100.5 45.5t85.5 71.5t66.5 75.5t58 81.5t47 66q-1 1 -28.5 37.5t-42 55t-43.5 53t-57.5 63.5t-58.5 54 q49 -74 49 -163q0 -124 -88 -212t-212 -88t-212 88t-88 212q0 85 46 158q-102 -87 -226 -258zM377 656q49 -124 154 -191l105 105q-37 24 -75 72t-57 84l-20 36z" />
+<glyph unicode="&#xe106;" d="M-61 600l26 40q6 10 20 30t49 63.5t74.5 85.5t97 90t116.5 83.5t132.5 59t145.5 23.5q61 0 121 -17l37 142h148l-314 -1200h-148l37 143q-82 21 -165 71.5t-140 102t-109.5 112t-72 88.5t-29.5 43zM120 600q210 -282 393 -336l37 141q-107 18 -178.5 101.5t-71.5 193.5 q0 85 46 158q-102 -87 -226 -258zM377 656q49 -124 154 -191l47 47l23 87q-30 28 -59 69t-44 68l-14 26zM780 161l38 145q22 15 44.5 34t46 44t40.5 44t41 50.5t33.5 43.5t33 44t24.5 34q-97 127 -140 175l39 146q67 -54 131.5 -125.5t87.5 -103.5t36 -52l26 -40l-26 -40 q-7 -12 -25.5 -38t-63.5 -79.5t-95.5 -102.5t-124 -100t-146.5 -79z" />
+<glyph unicode="&#xe107;" d="M-97.5 34q13.5 -34 50.5 -34h1294q37 0 50.5 35.5t-7.5 67.5l-642 1056q-20 33 -48 36t-48 -29l-642 -1066q-21 -32 -7.5 -66zM155 200l445 723l445 -723h-345v100h-200v-100h-345zM500 600l100 -300l100 300v100h-200v-100z" />
+<glyph unicode="&#xe108;" d="M100 262v41q0 20 11 44.5t26 38.5l363 325v339q0 62 44 106t106 44t106 -44t44 -106v-339l363 -325q15 -14 26 -38.5t11 -44.5v-41q0 -20 -12 -26.5t-29 5.5l-359 249v-263q100 -91 100 -113v-64q0 -21 -13 -29t-32 1l-94 78h-222l-94 -78q-19 -9 -32 -1t-13 29v64 q0 22 100 113v263l-359 -249q-17 -12 -29 -5.5t-12 26.5z" />
+<glyph unicode="&#xe109;" d="M0 50q0 -20 14.5 -35t35.5 -15h1000q21 0 35.5 15t14.5 35v750h-1100v-750zM0 900h1100v150q0 21 -14.5 35.5t-35.5 14.5h-150v100h-100v-100h-500v100h-100v-100h-150q-21 0 -35.5 -14.5t-14.5 -35.5v-150zM100 100v100h100v-100h-100zM100 300v100h100v-100h-100z M100 500v100h100v-100h-100zM300 100v100h100v-100h-100zM300 300v100h100v-100h-100zM300 500v100h100v-100h-100zM500 100v100h100v-100h-100zM500 300v100h100v-100h-100zM500 500v100h100v-100h-100zM700 100v100h100v-100h-100zM700 300v100h100v-100h-100zM700 500 v100h100v-100h-100zM900 100v100h100v-100h-100zM900 300v100h100v-100h-100zM900 500v100h100v-100h-100z" />
+<glyph unicode="&#xe110;" d="M0 200v200h259l600 600h241v198l300 -295l-300 -300v197h-159l-600 -600h-341zM0 800h259l122 -122l141 142l-181 180h-341v-200zM678 381l141 142l122 -123h159v198l300 -295l-300 -300v197h-241z" />
+<glyph unicode="&#xe111;" d="M0 400v600q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-600q0 -41 -29.5 -70.5t-70.5 -29.5h-596l-304 -300v300h-100q-41 0 -70.5 29.5t-29.5 70.5z" />
+<glyph unicode="&#xe112;" d="M100 600v200h300v-250q0 -113 6 -145q17 -92 102 -117q39 -11 92 -11q37 0 66.5 5.5t50 15.5t36 24t24 31.5t14 37.5t7 42t2.5 45t0 47v25v250h300v-200q0 -42 -3 -83t-15 -104t-31.5 -116t-58 -109.5t-89 -96.5t-129 -65.5t-174.5 -25.5t-174.5 25.5t-129 65.5t-89 96.5 t-58 109.5t-31.5 116t-15 104t-3 83zM100 900v300h300v-300h-300zM800 900v300h300v-300h-300z" />
+<glyph unicode="&#xe113;" d="M-30 411l227 -227l352 353l353 -353l226 227l-578 579z" />
+<glyph unicode="&#xe114;" d="M70 797l580 -579l578 579l-226 227l-353 -353l-352 353z" />
+<glyph unicode="&#xe115;" d="M-198 700l299 283l300 -283h-203v-400h385l215 -200h-800v600h-196zM402 1000l215 -200h381v-400h-198l299 -283l299 283h-200v600h-796z" />
+<glyph unicode="&#xe116;" d="M18 939q-5 24 10 42q14 19 39 19h896l38 162q5 17 18.5 27.5t30.5 10.5h94q20 0 35 -14.5t15 -35.5t-15 -35.5t-35 -14.5h-54l-201 -961q-2 -4 -6 -10.5t-19 -17.5t-33 -11h-31v-50q0 -20 -14.5 -35t-35.5 -15t-35.5 15t-14.5 35v50h-300v-50q0 -20 -14.5 -35t-35.5 -15 t-35.5 15t-14.5 35v50h-50q-21 0 -35.5 15t-14.5 35q0 21 14.5 35.5t35.5 14.5h535l48 200h-633q-32 0 -54.5 21t-27.5 43z" />
+<glyph unicode="&#xe117;" d="M0 0v800h1200v-800h-1200zM0 900v100h200q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5h500v-100h-1200z" />
+<glyph unicode="&#xe118;" d="M1 0l300 700h1200l-300 -700h-1200zM1 400v600h200q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5h500v-200h-1000z" />
+<glyph unicode="&#xe119;" d="M302 300h198v600h-198l298 300l298 -300h-198v-600h198l-298 -300z" />
+<glyph unicode="&#xe120;" d="M0 600l300 298v-198h600v198l300 -298l-300 -297v197h-600v-197z" />
+<glyph unicode="&#xe121;" d="M0 100v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM31 400l172 739q5 22 23 41.5t38 19.5h672q19 0 37.5 -22.5t23.5 -45.5l172 -732h-1138zM800 100h100v100h-100v-100z M1000 100h100v100h-100v-100z" />
+<glyph unicode="&#xe122;" d="M-101 600v50q0 24 25 49t50 38l25 13v-250l-11 5.5t-24 14t-30 21.5t-24 27.5t-11 31.5zM99 500v250v5q0 13 0.5 18.5t2.5 13t8 10.5t15 3h200l675 250v-850l-675 200h-38l47 -276q2 -12 -3 -17.5t-11 -6t-21 -0.5h-8h-83q-20 0 -34.5 14t-18.5 35q-56 337 -56 351z M1100 200v850q0 21 14.5 35.5t35.5 14.5q20 0 35 -14.5t15 -35.5v-850q0 -20 -15 -35t-35 -15q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe123;" d="M74 350q0 21 13.5 35.5t33.5 14.5h17l118 173l63 327q15 77 76 140t144 83l-18 32q-6 19 3 32t29 13h94q20 0 29 -10.5t3 -29.5l-18 -37q83 -19 144 -82.5t76 -140.5l63 -327l118 -173h17q20 0 33.5 -14.5t13.5 -35.5q0 -20 -13 -40t-31 -27q-22 -9 -63 -23t-167.5 -37 t-251.5 -23t-245.5 20.5t-178.5 41.5l-58 20q-18 7 -31 27.5t-13 40.5zM497 110q12 -49 40 -79.5t63 -30.5t63 30.5t39 79.5q-48 -6 -102 -6t-103 6z" />
+<glyph unicode="&#xe124;" d="M21 445l233 -45l-78 -224l224 78l45 -233l155 179l155 -179l45 233l224 -78l-78 224l234 45l-180 155l180 156l-234 44l78 225l-224 -78l-45 233l-155 -180l-155 180l-45 -233l-224 78l78 -225l-233 -44l179 -156z" />
+<glyph unicode="&#xe125;" d="M0 200h200v600h-200v-600zM300 275q0 -75 100 -75h61q123 -100 139 -100h250q46 0 83 57l238 344q29 31 29 74v100q0 44 -30.5 84.5t-69.5 40.5h-328q28 118 28 125v150q0 44 -30.5 84.5t-69.5 40.5h-50q-27 0 -51 -20t-38 -48l-96 -198l-145 -196q-20 -26 -20 -63v-400z M400 300v375l150 212l100 213h50v-175l-50 -225h450v-125l-250 -375h-214l-136 100h-100z" />
+<glyph unicode="&#xe126;" d="M0 400v600h200v-600h-200zM300 525v400q0 75 100 75h61q123 100 139 100h250q46 0 83 -57l238 -344q29 -31 29 -74v-100q0 -44 -30.5 -84.5t-69.5 -40.5h-328q28 -118 28 -125v-150q0 -44 -30.5 -84.5t-69.5 -40.5h-50q-27 0 -51 20t-38 48l-96 198l-145 196 q-20 26 -20 63zM400 525l150 -212l100 -213h50v175l-50 225h450v125l-250 375h-214l-136 -100h-100v-375z" />
+<glyph unicode="&#xe127;" d="M8 200v600h200v-600h-200zM308 275v525q0 17 14 35.5t28 28.5l14 9l362 230q14 6 25 6q17 0 29 -12l109 -112q14 -14 14 -34q0 -18 -11 -32l-85 -121h302q85 0 138.5 -38t53.5 -110t-54.5 -111t-138.5 -39h-107l-130 -339q-7 -22 -20.5 -41.5t-28.5 -19.5h-341 q-7 0 -90 81t-83 94zM408 289l100 -89h293l131 339q6 21 19.5 41t28.5 20h203q16 0 25 15t9 36q0 20 -9 34.5t-25 14.5h-457h-6.5h-7.5t-6.5 0.5t-6 1t-5 1.5t-5.5 2.5t-4 4t-4 5.5q-5 12 -5 20q0 14 10 27l147 183l-86 83l-339 -236v-503z" />
+<glyph unicode="&#xe128;" d="M-101 651q0 72 54 110t139 37h302l-85 121q-11 16 -11 32q0 21 14 34l109 113q13 12 29 12q11 0 25 -6l365 -230q7 -4 16.5 -10.5t26 -26t16.5 -36.5v-526q0 -13 -85.5 -93.5t-93.5 -80.5h-342q-15 0 -28.5 20t-19.5 41l-131 339h-106q-84 0 -139 39t-55 111zM-1 601h222 q15 0 28.5 -20.5t19.5 -40.5l131 -339h293l106 89v502l-342 237l-87 -83l145 -184q10 -11 10 -26q0 -11 -5 -20q-1 -3 -3.5 -5.5l-4 -4t-5 -2.5t-5.5 -1.5t-6.5 -1t-6.5 -0.5h-7.5h-6.5h-476v-100zM999 201v600h200v-600h-200z" />
+<glyph unicode="&#xe129;" d="M97 719l230 -363q4 -6 10.5 -15.5t26 -25t36.5 -15.5h525q13 0 94 83t81 90v342q0 15 -20 28.5t-41 19.5l-339 131v106q0 84 -39 139t-111 55t-110 -53.5t-38 -138.5v-302l-121 84q-15 12 -33.5 11.5t-32.5 -13.5l-112 -110q-22 -22 -6 -53zM172 739l83 86l183 -146 q22 -18 47 -5q3 1 5.5 3.5l4 4t2.5 5t1.5 5.5t1 6.5t0.5 6v7.5v7v456q0 22 25 31t50 -0.5t25 -30.5v-202q0 -16 20 -29.5t41 -19.5l339 -130v-294l-89 -100h-503zM400 0v200h600v-200h-600z" />
+<glyph unicode="&#xe130;" d="M1 585q-15 -31 7 -53l112 -110q13 -13 32 -13.5t34 10.5l121 85l-1 -302q0 -84 38.5 -138t110.5 -54t111 55t39 139v106l339 131q20 6 40.5 19.5t20.5 28.5v342q0 7 -81 90t-94 83h-525q-17 0 -35.5 -14t-28.5 -28l-10 -15zM76 565l237 339h503l89 -100v-294l-340 -130 q-20 -6 -40 -20t-20 -29v-202q0 -22 -25 -31t-50 0t-25 31v456v14.5t-1.5 11.5t-5 12t-9.5 7q-24 13 -46 -5l-184 -146zM305 1104v200h600v-200h-600z" />
+<glyph unicode="&#xe131;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q162 0 299.5 -80t217.5 -218t80 -300t-80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM300 500h300l-2 -194l402 294l-402 298v-197h-298v-201z" />
+<glyph unicode="&#xe132;" d="M0 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t231.5 47.5q122 0 232.5 -47.5t190.5 -127.5t127.5 -190.5t47.5 -232.5q0 -162 -80 -299.5t-218 -217.5t-300 -80t-299.5 80t-217.5 217.5t-80 299.5zM200 600l400 -294v194h302v201h-300v197z" />
+<glyph unicode="&#xe133;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q121 0 231.5 -47.5t190.5 -127.5t127.5 -190.5t47.5 -232.5q0 -162 -80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM300 600h200v-300h200v300h200l-300 400z" />
+<glyph unicode="&#xe134;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q121 0 231.5 -47.5t190.5 -127.5t127.5 -190.5t47.5 -232.5q0 -162 -80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM300 600l300 -400l300 400h-200v300h-200v-300h-200z" />
+<glyph unicode="&#xe135;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q121 0 231.5 -47.5t190.5 -127.5t127.5 -190.5t47.5 -232.5q0 -162 -80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM254 780q-8 -34 5.5 -93t7.5 -87q0 -9 17 -44t16 -60q12 0 23 -5.5 t23 -15t20 -13.5q20 -10 108 -42q22 -8 53 -31.5t59.5 -38.5t57.5 -11q8 -18 -15 -55.5t-20 -57.5q12 -21 22.5 -34.5t28 -27t36.5 -17.5q0 -6 -3 -15.5t-3.5 -14.5t4.5 -17q101 -2 221 111q31 30 47 48t34 49t21 62q-14 9 -37.5 9.5t-35.5 7.5q-14 7 -49 15t-52 19 q-9 0 -39.5 -0.5t-46.5 -1.5t-39 -6.5t-39 -16.5q-50 -35 -66 -12q-4 2 -3.5 25.5t0.5 25.5q-6 13 -26.5 17t-24.5 7q2 22 -2 41t-16.5 28t-38.5 -20q-23 -25 -42 4q-19 28 -8 58q8 16 22 22q6 -1 26 -1.5t33.5 -4.5t19.5 -13q12 -19 32 -37.5t34 -27.5l14 -8q0 3 9.5 39.5 t5.5 57.5q-4 23 14.5 44.5t22.5 31.5q5 14 10 35t8.5 31t15.5 22.5t34 21.5q-6 18 10 37q8 0 23.5 -1.5t24.5 -1.5t20.5 4.5t20.5 15.5q-10 23 -30.5 42.5t-38 30t-49 26.5t-43.5 23q11 41 1 44q31 -13 58.5 -14.5t39.5 3.5l11 4q6 36 -17 53.5t-64 28.5t-56 23 q-19 -3 -37 0q-15 -12 -36.5 -21t-34.5 -12t-44 -8t-39 -6q-15 -3 -46 0t-45 -3q-20 -6 -51.5 -25.5t-34.5 -34.5q-3 -11 6.5 -22.5t8.5 -18.5q-3 -34 -27.5 -91t-29.5 -79zM518 915q3 12 16 30.5t16 25.5q10 -10 18.5 -10t14 6t14.5 14.5t16 12.5q0 -18 8 -42.5t16.5 -44 t9.5 -23.5q-6 1 -39 5t-53.5 10t-36.5 16z" />
+<glyph unicode="&#xe136;" d="M0 164.5q0 21.5 15 37.5l600 599q-33 101 6 201.5t135 154.5q164 92 306 -9l-259 -138l145 -232l251 126q13 -175 -151 -267q-123 -70 -253 -23l-596 -596q-15 -16 -36.5 -16t-36.5 16l-111 110q-15 15 -15 36.5z" />
+<glyph unicode="&#xe137;" horiz-adv-x="1220" d="M0 196v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM0 596v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000 q-41 0 -70.5 29.5t-29.5 70.5zM0 996v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM600 596h500v100h-500v-100zM800 196h300v100h-300v-100zM900 996h200v100h-200v-100z" />
+<glyph unicode="&#xe138;" d="M100 1100v100h1000v-100h-1000zM150 1000h900l-350 -500v-300l-200 -200v500z" />
+<glyph unicode="&#xe139;" d="M0 200v200h1200v-200q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM0 500v400q0 41 29.5 70.5t70.5 29.5h300v100q0 41 29.5 70.5t70.5 29.5h200q41 0 70.5 -29.5t29.5 -70.5v-100h300q41 0 70.5 -29.5t29.5 -70.5v-400h-500v100h-200v-100h-500z M500 1000h200v100h-200v-100z" />
+<glyph unicode="&#xe140;" d="M0 0v400l129 -129l200 200l142 -142l-200 -200l129 -129h-400zM0 800l129 129l200 -200l142 142l-200 200l129 129h-400v-400zM729 329l142 142l200 -200l129 129v-400h-400l129 129zM729 871l200 200l-129 129h400v-400l-129 129l-200 -200z" />
+<glyph unicode="&#xe141;" d="M0 596q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM182 596q0 -172 121.5 -293t292.5 -121t292.5 121t121.5 293q0 171 -121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM291 655 q0 23 15.5 38.5t38.5 15.5t39 -16t16 -38q0 -23 -16 -39t-39 -16q-22 0 -38 16t-16 39zM400 850q0 22 16 38.5t39 16.5q22 0 38 -16t16 -39t-16 -39t-38 -16q-23 0 -39 16.5t-16 38.5zM513 609q0 32 21 56.5t52 29.5l122 126l1 1q-9 14 -9 28q0 22 16 38.5t39 16.5 q22 0 38 -16t16 -39t-16 -39t-38 -16q-16 0 -29 10l-55 -145q17 -22 17 -51q0 -36 -25.5 -61.5t-61.5 -25.5q-37 0 -62.5 25.5t-25.5 61.5zM800 655q0 22 16 38t39 16t38.5 -15.5t15.5 -38.5t-16 -39t-38 -16q-23 0 -39 16t-16 39z" />
+<glyph unicode="&#xe142;" d="M-40 375q-13 -95 35 -173q35 -57 94 -89t129 -32q63 0 119 28q33 16 65 40.5t52.5 45.5t59.5 64q40 44 57 61l394 394q35 35 47 84t-3 96q-27 87 -117 104q-20 2 -29 2q-46 0 -79.5 -17t-67.5 -51l-388 -396l-7 -7l69 -67l377 373q20 22 39 38q23 23 50 23q38 0 53 -36 q16 -39 -20 -75l-547 -547q-52 -52 -125 -52q-55 0 -100 33t-54 96q-5 35 2.5 66t31.5 63t42 50t56 54q24 21 44 41l348 348q52 52 82.5 79.5t84 54t107.5 26.5q25 0 48 -4q95 -17 154 -94.5t51 -175.5q-7 -101 -98 -192l-252 -249l-253 -256l7 -7l69 -60l517 511 q67 67 95 157t11 183q-16 87 -67 154t-130 103q-69 33 -152 33q-107 0 -197 -55q-40 -24 -111 -95l-512 -512q-68 -68 -81 -163z" />
+<glyph unicode="&#xe143;" d="M79 784q0 131 99 229.5t230 98.5q144 0 242 -129q103 129 245 129q130 0 227 -98.5t97 -229.5q0 -46 -17.5 -91t-61 -99t-77 -89.5t-104.5 -105.5q-197 -191 -293 -322l-17 -23l-16 23q-43 58 -100 122.5t-92 99.5t-101 100l-84.5 84.5t-68 74t-60 78t-33.5 70.5t-15 78z M250 784q0 -27 30.5 -70t61.5 -75.5t95 -94.5l22 -22q93 -90 190 -201q82 92 195 203l12 12q64 62 97.5 97t64.5 79t31 72q0 71 -48 119.5t-106 48.5q-73 0 -131 -83l-118 -171l-114 174q-51 80 -124 80q-59 0 -108.5 -49.5t-49.5 -118.5z" />
+<glyph unicode="&#xe144;" d="M57 353q0 -94 66 -160l141 -141q66 -66 159 -66q95 0 159 66l283 283q66 66 66 159t-66 159l-141 141q-12 12 -19 17l-105 -105l212 -212l-389 -389l-247 248l95 95l-18 18q-46 45 -75 101l-55 -55q-66 -66 -66 -159zM269 706q0 -93 66 -159l141 -141l19 -17l105 105 l-212 212l389 389l247 -247l-95 -96l18 -18q46 -46 77 -99l29 29q35 35 62.5 88t27.5 96q0 93 -66 159l-141 141q-66 66 -159 66q-95 0 -159 -66l-283 -283q-66 -64 -66 -159z" />
+<glyph unicode="&#xe145;" d="M200 100v953q0 21 30 46t81 48t129 38t163 15t162 -15t127 -38t79 -48t29 -46v-953q0 -41 -29.5 -70.5t-70.5 -29.5h-600q-41 0 -70.5 29.5t-29.5 70.5zM300 300h600v700h-600v-700zM496 150q0 -43 30.5 -73.5t73.5 -30.5t73.5 30.5t30.5 73.5t-30.5 73.5t-73.5 30.5 t-73.5 -30.5t-30.5 -73.5z" />
+<glyph unicode="&#xe146;" d="M0 0l303 380l207 208l-210 212h300l267 279l-35 36q-15 14 -15 35t15 35q14 15 35 15t35 -15l283 -282q15 -15 15 -36t-15 -35q-14 -15 -35 -15t-35 15l-36 35l-279 -267v-300l-212 210l-208 -207z" />
+<glyph unicode="&#xe148;" d="M295 433h139q5 -77 48.5 -126.5t117.5 -64.5v335l-27 7q-46 14 -79 26.5t-72 36t-62.5 52t-40 72.5t-16.5 99q0 92 44 159.5t109 101t144 40.5v78h100v-79q38 -4 72.5 -13.5t75.5 -31.5t71 -53.5t51.5 -84t24.5 -118.5h-159q-8 72 -35 109.5t-101 50.5v-307l64 -14 q34 -7 64 -16.5t70 -31.5t67.5 -52t47.5 -80.5t20 -112.5q0 -139 -89 -224t-244 -96v-77h-100v78q-152 17 -237 104q-40 40 -52.5 93.5t-15.5 139.5zM466 889q0 -29 8 -51t16.5 -34t29.5 -22.5t31 -13.5t38 -10q7 -2 11 -3v274q-61 -8 -97.5 -37.5t-36.5 -102.5zM700 237 q170 18 170 151q0 64 -44 99.5t-126 60.5v-311z" />
+<glyph unicode="&#xe149;" d="M100 600v100h166q-24 49 -44 104q-10 26 -14.5 55.5t-3 72.5t25 90t68.5 87q97 88 263 88q129 0 230 -89t101 -208h-153q0 52 -34 89.5t-74 51.5t-76 14q-37 0 -79 -14.5t-62 -35.5q-41 -44 -41 -101q0 -11 2.5 -24.5t5.5 -24t9.5 -26.5t10.5 -25t14 -27.5t14 -25.5 t15.5 -27t13.5 -24h242v-100h-197q8 -50 -2.5 -115t-31.5 -94q-41 -59 -99 -113q35 11 84 18t70 7q32 1 102 -16t104 -17q76 0 136 30l50 -147q-41 -25 -80.5 -36.5t-59 -13t-61.5 -1.5q-23 0 -128 33t-155 29q-39 -4 -82 -17t-66 -25l-24 -11l-55 145l16.5 11t15.5 10 t13.5 9.5t14.5 12t14.5 14t17.5 18.5q48 55 54 126.5t-30 142.5h-221z" />
+<glyph unicode="&#xe150;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM602 900l298 300l298 -300h-198v-900h-200v900h-198z" />
+<glyph unicode="&#xe151;" d="M2 300h198v900h200v-900h198l-298 -300zM700 0v200h100v-100h200v-100h-300zM700 400v100h300v-200h-99v-100h-100v100h99v100h-200zM700 700v500h300v-500h-100v100h-100v-100h-100zM801 900h100v200h-100v-200z" />
+<glyph unicode="&#xe152;" d="M2 300h198v900h200v-900h198l-298 -300zM700 0v500h300v-500h-100v100h-100v-100h-100zM700 700v200h100v-100h200v-100h-300zM700 1100v100h300v-200h-99v-100h-100v100h99v100h-200zM801 200h100v200h-100v-200z" />
+<glyph unicode="&#xe153;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM800 100v400h300v-500h-100v100h-200zM800 1100v100h200v-500h-100v400h-100zM901 200h100v200h-100v-200z" />
+<glyph unicode="&#xe154;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM800 400v100h200v-500h-100v400h-100zM800 800v400h300v-500h-100v100h-200zM901 900h100v200h-100v-200z" />
+<glyph unicode="&#xe155;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM700 100v200h500v-200h-500zM700 400v200h400v-200h-400zM700 700v200h300v-200h-300zM700 1000v200h200v-200h-200z" />
+<glyph unicode="&#xe156;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM700 100v200h200v-200h-200zM700 400v200h300v-200h-300zM700 700v200h400v-200h-400zM700 1000v200h500v-200h-500z" />
+<glyph unicode="&#xe157;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h300q162 0 281 -118.5t119 -281.5v-300q0 -165 -118.5 -282.5t-281.5 -117.5h-300q-165 0 -282.5 117.5t-117.5 282.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500z" />
+<glyph unicode="&#xe158;" d="M0 400v300q0 163 119 281.5t281 118.5h300q165 0 282.5 -117.5t117.5 -282.5v-300q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-163 0 -281.5 117.5t-118.5 282.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM400 300l333 250l-333 250v-500z" />
+<glyph unicode="&#xe159;" d="M0 400v300q0 163 117.5 281.5t282.5 118.5h300q163 0 281.5 -119t118.5 -281v-300q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5t-117.5 282.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM300 700l250 -333l250 333h-500z" />
+<glyph unicode="&#xe160;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h300q165 0 282.5 -117.5t117.5 -282.5v-300q0 -162 -118.5 -281t-281.5 -119h-300q-165 0 -282.5 118.5t-117.5 281.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM300 400h500l-250 333z" />
+<glyph unicode="&#xe161;" d="M0 400v300h300v200l400 -350l-400 -350v200h-300zM500 0v200h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5h-500v200h400q165 0 282.5 -117.5t117.5 -282.5v-300q0 -165 -117.5 -282.5t-282.5 -117.5h-400z" />
+<glyph unicode="&#xe162;" d="M216 519q10 -19 32 -19h302q-155 -438 -160 -458q-5 -21 4 -32l9 -8l9 -1q13 0 26 16l538 630q15 19 6 36q-8 18 -32 16h-300q1 4 78 219.5t79 227.5q2 17 -6 27l-8 8h-9q-16 0 -25 -15q-4 -5 -98.5 -111.5t-228 -257t-209.5 -238.5q-17 -19 -7 -40z" />
+<glyph unicode="&#xe163;" d="M0 400q0 -165 117.5 -282.5t282.5 -117.5h300q47 0 100 15v185h-500q-41 0 -70.5 29.5t-29.5 70.5v500q0 41 29.5 70.5t70.5 29.5h500v185q-14 4 -114 7.5t-193 5.5l-93 2q-165 0 -282.5 -117.5t-117.5 -282.5v-300zM600 400v300h300v200l400 -350l-400 -350v200h-300z " />
+<glyph unicode="&#xe164;" d="M0 400q0 -165 117.5 -282.5t282.5 -117.5h300q163 0 281.5 117.5t118.5 282.5v98l-78 73l-122 -123v-148q0 -41 -29.5 -70.5t-70.5 -29.5h-500q-41 0 -70.5 29.5t-29.5 70.5v500q0 41 29.5 70.5t70.5 29.5h156l118 122l-74 78h-100q-165 0 -282.5 -117.5t-117.5 -282.5 v-300zM496 709l353 342l-149 149h500v-500l-149 149l-342 -353z" />
+<glyph unicode="&#xe165;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM406 600 q0 80 57 137t137 57t137 -57t57 -137t-57 -137t-137 -57t-137 57t-57 137z" />
+<glyph unicode="&#xe166;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 800l445 -500l450 500h-295v400h-300v-400h-300zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe167;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 700h300v-300h300v300h295l-445 500zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe168;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 705l305 -305l596 596l-154 155l-442 -442l-150 151zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe169;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 988l97 -98l212 213l-97 97zM200 401h700v699l-250 -239l-149 149l-212 -212l149 -149zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe170;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM200 612l212 -212l98 97l-213 212zM300 1200l239 -250l-149 -149l212 -212l149 148l248 -237v700h-699zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe171;" d="M23 415l1177 784v-1079l-475 272l-310 -393v416h-392zM494 210l672 938l-672 -712v-226z" />
+<glyph unicode="&#xe172;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-850q0 -21 -15 -35.5t-35 -14.5h-150v400h-700v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 1000h100v200h-100v-200z" />
+<glyph unicode="&#xe173;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-218l-276 -275l-120 120l-126 -127h-378v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM581 306l123 123l120 -120l353 352l123 -123l-475 -476zM600 1000h100v200h-100v-200z" />
+<glyph unicode="&#xe174;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-269l-103 -103l-170 170l-298 -298h-329v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 1000h100v200h-100v-200zM700 133l170 170l-170 170l127 127l170 -170l170 170l127 -128l-170 -169l170 -170 l-127 -127l-170 170l-170 -170z" />
+<glyph unicode="&#xe175;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-300h-400v-200h-500v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 300l300 -300l300 300h-200v300h-200v-300h-200zM600 1000v200h100v-200h-100z" />
+<glyph unicode="&#xe176;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-402l-200 200l-298 -298h-402v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 300h200v-300h200v300h200l-300 300zM600 1000v200h100v-200h-100z" />
+<glyph unicode="&#xe177;" d="M0 250q0 -21 14.5 -35.5t35.5 -14.5h1100q21 0 35.5 14.5t14.5 35.5v550h-1200v-550zM0 900h1200v150q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5v-150zM100 300v200h400v-200h-400z" />
+<glyph unicode="&#xe178;" d="M0 400l300 298v-198h400v-200h-400v-198zM100 800v200h100v-200h-100zM300 800v200h100v-200h-100zM500 800v200h400v198l300 -298l-300 -298v198h-400zM800 300v200h100v-200h-100zM1000 300h100v200h-100v-200z" />
+<glyph unicode="&#xe179;" d="M100 700v400l50 100l50 -100v-300h100v300l50 100l50 -100v-300h100v300l50 100l50 -100v-400l-100 -203v-447q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v447zM800 597q0 -29 10.5 -55.5t25 -43t29 -28.5t25.5 -18l10 -5v-397q0 -21 14.5 -35.5 t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v1106q0 31 -18 40.5t-44 -7.5l-276 -117q-25 -16 -43.5 -50.5t-18.5 -65.5v-359z" />
+<glyph unicode="&#xe180;" d="M100 0h400v56q-75 0 -87.5 6t-12.5 44v394h500v-394q0 -38 -12.5 -44t-87.5 -6v-56h400v56q-4 0 -11 0.5t-24 3t-30 7t-24 15t-11 24.5v888q0 22 25 34.5t50 13.5l25 2v56h-400v-56q75 0 87.5 -6t12.5 -44v-394h-500v394q0 38 12.5 44t87.5 6v56h-400v-56q4 0 11 -0.5 t24 -3t30 -7t24 -15t11 -24.5v-888q0 -22 -25 -34.5t-50 -13.5l-25 -2v-56z" />
+<glyph unicode="&#xe181;" d="M0 300q0 -41 29.5 -70.5t70.5 -29.5h300q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5h-300q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM100 100h400l200 200h105l295 98v-298h-425l-100 -100h-375zM100 300v200h300v-200h-300zM100 600v200h300v-200h-300z M100 1000h400l200 -200v-98l295 98h105v200h-425l-100 100h-375zM700 402v163l400 133v-163z" />
+<glyph unicode="&#xe182;" d="M16.5 974.5q0.5 -21.5 16 -90t46.5 -140t104 -177.5t175 -208q103 -103 207.5 -176t180 -103.5t137 -47t92.5 -16.5l31 1l163 162q16 17 13 40.5t-22 37.5l-192 136q-19 14 -45 12t-42 -19l-119 -118q-143 103 -267 227q-126 126 -227 268l118 118q17 17 20 41.5 t-11 44.5l-139 194q-14 19 -36.5 22t-40.5 -14l-162 -162q-1 -11 -0.5 -32.5z" />
+<glyph unicode="&#xe183;" d="M0 50v212q0 20 10.5 45.5t24.5 39.5l365 303v50q0 4 1 10.5t12 22.5t30 28.5t60 23t97 10.5t97 -10t60 -23.5t30 -27.5t12 -24l1 -10v-50l365 -303q14 -14 24.5 -39.5t10.5 -45.5v-212q0 -21 -15 -35.5t-35 -14.5h-1100q-21 0 -35.5 14.5t-14.5 35.5zM0 712 q0 -21 14.5 -33.5t34.5 -8.5l202 33q20 4 34.5 21t14.5 38v146q141 24 300 24t300 -24v-146q0 -21 14.5 -38t34.5 -21l202 -33q20 -4 34.5 8.5t14.5 33.5v200q-6 8 -19 20.5t-63 45t-112 57t-171 45t-235 20.5q-92 0 -175 -10.5t-141.5 -27t-108.5 -36.5t-81.5 -40 t-53.5 -36.5t-31 -27.5l-9 -10v-200z" />
+<glyph unicode="&#xe184;" d="M100 0v100h1100v-100h-1100zM175 200h950l-125 150v250l100 100v400h-100v-200h-100v200h-200v-200h-100v200h-200v-200h-100v200h-100v-400l100 -100v-250z" />
+<glyph unicode="&#xe185;" d="M100 0h300v400q0 41 -29.5 70.5t-70.5 29.5h-100q-41 0 -70.5 -29.5t-29.5 -70.5v-400zM500 0v1000q0 41 29.5 70.5t70.5 29.5h100q41 0 70.5 -29.5t29.5 -70.5v-1000h-300zM900 0v700q0 41 29.5 70.5t70.5 29.5h100q41 0 70.5 -29.5t29.5 -70.5v-700h-300z" />
+<glyph unicode="&#xe186;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v300h-200v100h200v100h-300v-300h200v-100h-200v-100zM600 300h200v100h100v300h-100v100h-200v-500 zM700 400v300h100v-300h-100z" />
+<glyph unicode="&#xe187;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h100v200h100v-200h100v500h-100v-200h-100v200h-100v-500zM600 300h200v100h100v300h-100v100h-200v-500 zM700 400v300h100v-300h-100z" />
+<glyph unicode="&#xe188;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v100h-200v300h200v100h-300v-500zM600 300h300v100h-200v300h200v100h-300v-500z" />
+<glyph unicode="&#xe189;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 550l300 -150v300zM600 400l300 150l-300 150v-300z" />
+<glyph unicode="&#xe190;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300v500h700v-500h-700zM300 400h130q41 0 68 42t27 107t-28.5 108t-66.5 43h-130v-300zM575 549 q0 -65 27 -107t68 -42h130v300h-130q-38 0 -66.5 -43t-28.5 -108z" />
+<glyph unicode="&#xe191;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v300h-200v100h200v100h-300v-300h200v-100h-200v-100zM601 300h100v100h-100v-100zM700 700h100 v-400h100v500h-200v-100z" />
+<glyph unicode="&#xe192;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v400h-200v100h-100v-500zM301 400v200h100v-200h-100zM601 300h100v100h-100v-100zM700 700h100 v-400h100v500h-200v-100z" />
+<glyph unicode="&#xe193;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 700v100h300v-300h-99v-100h-100v100h99v200h-200zM201 300v100h100v-100h-100zM601 300v100h100v-100h-100z M700 700v100h200v-500h-100v400h-100z" />
+<glyph unicode="&#xe194;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM400 500v200 l100 100h300v-100h-300v-200h300v-100h-300z" />
+<glyph unicode="&#xe195;" d="M0 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM182 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM400 400v400h300 l100 -100v-100h-100v100h-200v-100h200v-100h-200v-100h-100zM700 400v100h100v-100h-100z" />
+<glyph unicode="&#xe197;" d="M-14 494q0 -80 56.5 -137t135.5 -57h222v300h400v-300h128q120 0 205 86t85 208q0 120 -85 206.5t-205 86.5q-46 0 -90 -14q-44 97 -134.5 156.5t-200.5 59.5q-152 0 -260 -107.5t-108 -260.5q0 -25 2 -37q-66 -14 -108.5 -67.5t-42.5 -122.5zM300 200h200v300h200v-300 h200l-300 -300z" />
+<glyph unicode="&#xe198;" d="M-14 494q0 -80 56.5 -137t135.5 -57h8l414 414l403 -403q94 26 154.5 104t60.5 178q0 121 -85 207.5t-205 86.5q-46 0 -90 -14q-44 97 -134.5 156.5t-200.5 59.5q-152 0 -260 -107.5t-108 -260.5q0 -25 2 -37q-66 -14 -108.5 -67.5t-42.5 -122.5zM300 200l300 300 l300 -300h-200v-300h-200v300h-200z" />
+<glyph unicode="&#xe199;" d="M100 200h400v-155l-75 -45h350l-75 45v155h400l-270 300h170l-270 300h170l-300 333l-300 -333h170l-270 -300h170z" />
+<glyph unicode="&#xe200;" d="M121 700q0 -53 28.5 -97t75.5 -65q-4 -16 -4 -38q0 -74 52.5 -126.5t126.5 -52.5q56 0 100 30v-306l-75 -45h350l-75 45v306q46 -30 100 -30q74 0 126.5 52.5t52.5 126.5q0 24 -9 55q50 32 79.5 83t29.5 112q0 90 -61.5 155.5t-150.5 71.5q-26 89 -99.5 145.5 t-167.5 56.5q-116 0 -197.5 -81.5t-81.5 -197.5q0 -4 1 -12t1 -11q-14 2 -23 2q-74 0 -126.5 -52.5t-52.5 -126.5z" />
+</font>
+</defs></svg> 
\ No newline at end of file

diff --git a/src/web/fonts/glyphicons-halflings-regular.ttf b/src/web/fonts/glyphicons-halflings-regular.ttf
new file mode 100644
index 0000000..a498ef4
Binary files /dev/null and b/src/web/fonts/glyphicons-halflings-regular.ttf differ

diff --git a/src/web/fonts/glyphicons-halflings-regular.woff b/src/web/fonts/glyphicons-halflings-regular.woff
new file mode 100644
index 0000000..d83c539
Binary files /dev/null and b/src/web/fonts/glyphicons-halflings-regular.woff differ

diff --git a/src/web/js/azkaban.ajax.utils.js b/src/web/js/azkaban.ajax.utils.js
index 96d4b28..342e2af 100644
--- a/src/web/js/azkaban.ajax.utils.js
+++ b/src/web/js/azkaban.ajax.utils.js
@@ -15,142 +15,145 @@
  */
 
 function ajaxCall(requestURL, data, callback) {
-	$.get(
-		requestURL,
-		data,
-		function(data) {
-			if (data.error == "session") {
-				// We need to relogin.
-				var errorDialog = document.getElementById("invalid-session");
-				if (errorDialog) {
-					  $(errorDialog).modal({
-					      closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-					      position: ["20%",],
-					      containerId: 'confirm-container',
-					      containerCss: {
-					        'height': '220px',
-					        'width': '565px'
-					      },
-					      onClose: function (dialog) {
-					      	window.location.reload();
-					      }
-					    });
-				}
-			}
-			else {
-				callback.call(this,data);
+	var successHandler = function(data) {
+		if (data.error == "session") {
+			// We need to relogin.
+			var errorDialog = document.getElementById("invalid-session");
+			if (errorDialog) {
+				$(errorDialog).modal({
+					closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
+					position: ["20%",],
+					containerId: 'confirm-container',
+					containerCss: {
+						'height': '220px',
+						'width': '565px'
+					},
+					onClose: function (dialog) {
+						window.location.reload();
+					}
+				});
 			}
-		},
-		"json"
-	);
+		}
+		else {
+			callback.call(this,data);
+		}
+	};
+	$.get(requestURL, data, successHandler, "json");
 }
 
 function executeFlow(executingData) {
 	executeURL = contextURL + "/executor";
-	$.get(
-		executeURL,
-		executingData,
-		function(data) {
-			if (data.error) {
-				messageDialogView.show("Error Executing Flow", data.error);
-			}
-			else {
-				messageDialogView.show("Flow submitted", data.message,
-					function() {
-						var redirectURL = contextURL + "/executor?execid=" + data.execid;
-						window.location.href = redirectURL;
-					}
-				);
-			}
-		},
-		"json"
-	);
+	var successHandler = function(data) {
+		if (data.error) {
+			flowExecuteDialogView.hideExecutionOptionPanel();
+			messageDialogView.show("Error Executing Flow", data.error);
+		}
+		else {
+			flowExecuteDialogView.hideExecutionOptionPanel();
+			messageDialogView.show("Flow submitted", data.message,
+				function() {
+					var redirectURL = contextURL + "/executor?execid=" + data.execid;
+					window.location.href = redirectURL;
+				}
+			);
+		}
+	};
+
+	$.get(executeURL, executingData, successHandler, "json");
 }
 
 function fetchFlowInfo(model, projectName, flowId, execId) {
-  	var fetchData = {"project": projectName, "ajax":"flowInfo", "flow":flowId};
-  	if (execId) {
-  		fetchData.execid = execId;
-  	}
-  	
-  	var executeURL = contextURL + "/executor";
-  	$.ajax({
-  		url: executeURL,
-  		data: fetchData,
-  		success: function(data) {
-			if (data.error) {
-				alert(data.error);
-			}
-			else {
-				model.set({
-					"successEmails": data.successEmails, 
-					"failureEmails": data.failureEmails,
-					"failureAction": data.failureAction,
-					"notifyFailure": {"first": data.notifyFailureFirst, "last":data.notifyFailureLast},
-					"flowParams": data.flowParam,
-					"isRunning": data.running,
-					"nodeStatus": data.nodeStatus,
-					"concurrentOption": data.concurrentOptions,
-					"pipelineLevel": data.pipelineLevel,
-					"pipelineExecution": data.pipelineExecution,
-					"queueLevel":data.queueLevel
-				});
-			}
-			
-			model.trigger("change:flowinfo");
-		},
+	var fetchData = {"project": projectName, "ajax":"flowInfo", "flow":flowId};
+	if (execId) {
+		fetchData.execid = execId;
+	}
+	
+	var executeURL = contextURL + "/executor";
+	var successHandler = function(data) {
+		if (data.error) {
+			alert(data.error);
+		}
+		else {
+			model.set({
+				"successEmails": data.successEmails, 
+				"failureEmails": data.failureEmails,
+				"failureAction": data.failureAction,
+				"notifyFailure": {
+					"first": data.notifyFailureFirst, 
+					"last": data.notifyFailureLast
+				},
+				"flowParams": data.flowParam,
+				"isRunning": data.running,
+				"nodeStatus": data.nodeStatus,
+				"concurrentOption": data.concurrentOptions,
+				"pipelineLevel": data.pipelineLevel,
+				"pipelineExecution": data.pipelineExecution,
+				"queueLevel":data.queueLevel
+			});
+		}
+		model.trigger("change:flowinfo");
+	};
+
+	$.ajax({
+		url: executeURL,
+		data: fetchData,
+		success: successHandler,
 		dataType: "json",
 		async: false
-  	});
+	});
 }
 
 function fetchFlow(model, projectName, flowId, sync) {
 	// Just in case people don't set sync
 	sync = sync ? true : false;
-
-  	var managerUrl = contextURL + "/manager";
-  	var fetchData = {
-  		"ajax" : "fetchflowgraph",
-  		"project" : projectName,
-  		"flow" : flowId
-  	};
+	var managerUrl = contextURL + "/manager";
+	var fetchData = {
+		"ajax" : "fetchflowgraph",
+		"project" : projectName,
+		"flow" : flowId
+	};
+	var successHandler = function(data) {
+		if (data.error) {
+			alert(data.error);
+		}
+		else {
+			var disabled = data.disabled ? data.disabled : {};
+			model.set({
+				flowId: data.flowId, 
+				data: data, 
+				disabled: disabled
+			});
+			
+			var nodeMap = {};
+			for (var i = 0; i < data.nodes.length; ++i) {
+				var node = data.nodes[i];
+				nodeMap[node.id] = node;
+			}
+			
+			for (var i = 0; i < data.edges.length; ++i) {
+				 var edge = data.edges[i];
+				 
+				 if (!nodeMap[edge.target].in) {
+					nodeMap[edge.target].in = {};
+				 }
+				 var targetInMap = nodeMap[edge.target].in;
+				 targetInMap[edge.from] = nodeMap[edge.from];
+				 
+				 if (!nodeMap[edge.from].out) {
+					nodeMap[edge.from].out = {};
+				 }
+				 var sourceOutMap = nodeMap[edge.from].out;
+				 sourceOutMap[edge.target] = nodeMap[edge.target];
+			}
+			
+			model.set({nodeMap: nodeMap});
+		}
+	};
 
 	$.ajax({
 		url: managerUrl,
 		data: fetchData,
-		success: function(data) {
-			if (data.error) {
-				alert(data.error);
-			}
-			else {
-				var disabled = data.disabled ? data.disabled : {};
-				model.set({flowId: data.flowId, data:data, disabled: disabled});
-				
-				var nodeMap = {};
-				for (var i = 0; i < data.nodes.length; ++i) {
-					var node = data.nodes[i];
-					nodeMap[node.id] = node;
-				}
-				
-				for (var i = 0; i < data.edges.length; ++i) {
-					 var edge = data.edges[i];
-					 
-					 if (!nodeMap[edge.target].in) {
-					 	nodeMap[edge.target].in = {};
-					 }
-					 var targetInMap = nodeMap[edge.target].in;
-					 targetInMap[edge.from] = nodeMap[edge.from];
-					 
-					 if (!nodeMap[edge.from].out) {
-					 	nodeMap[edge.from].out = {};
-					 }
-					 var sourceOutMap = nodeMap[edge.from].out;
-					 sourceOutMap[edge.target] = nodeMap[edge.target];
-				}
-				
-				model.set({nodeMap: nodeMap});
-			}
-		},
+		success: successHandler,
 		dataType: "json",
 		async: !sync
 	});
@@ -164,34 +167,39 @@ function flowExecutingStatus(projectName, flowId) {
 	var requestURL = contextURL + "/executor";
 	
 	var executionIds;
-	$.ajax( {
+	var successHandler = function(data) {
+		if (data.error == "session") {
+			// We need to relogin.
+			var errorDialog = document.getElementById("invalid-session");
+			if (errorDialog) {
+				$(errorDialog).modal({
+					closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
+					position: ["20%",],
+					containerId: 'confirm-container',
+					containerCss: {
+						'height': '220px',
+						'width': '565px'
+					},
+					onClose: function (dialog) {
+						window.location.reload();
+					}
+				});
+			}
+		}
+		else {
+			executionIds = data.execIds;
+		}
+	};
+	$.ajax({
 		url: requestURL,
 		async: false,
-		data: {"ajax":"getRunning", "project":projectName, "flow":flowId},
+		data: {
+			"ajax": "getRunning", 
+			"project": projectName, 
+			"flow": flowId
+		},
 		error: function(data) {},
-		success: function(data) {
-			if (data.error == "session") {
-				// We need to relogin.
-				var errorDialog = document.getElementById("invalid-session");
-				if (errorDialog) {
-					  $(errorDialog).modal({
-					      closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-					      position: ["20%",],
-					      containerId: 'confirm-container',
-					      containerCss: {
-					        'height': '220px',
-					        'width': '565px'
-					      },
-					      onClose: function (dialog) {
-					      	window.location.reload();
-					      }
-					    });
-				}
-			}
-			else {
-				executionIds = data.execIds;
-			}
-		}
+		success: successHandler
 	});
 	
 	return executionIds;

diff --git a/src/web/js/azkaban.common.utils.js b/src/web/js/azkaban.common.utils.js
index 411de17..147bb94 100644
--- a/src/web/js/azkaban.common.utils.js
+++ b/src/web/js/azkaban.common.utils.js
@@ -16,9 +16,9 @@
 
 function addClass(el, name) {
 	if (!hasClass(el, name)) { 
-			var classes = el.getAttribute("class");
-			classes += classes ? ' ' + name : '' +name;
-			el.setAttribute("class", classes);
+		var classes = el.getAttribute("class");
+		classes += classes ? ' ' + name : '' +name;
+		el.setAttribute("class", classes);
 	}
 }
 
@@ -34,5 +34,5 @@ function hasClass(el, name) {
 	if (classes == null) {
 		return false;
 	}
-   return new RegExp('(\\s|^)'+name+'(\\s|$)').test(classes);
+	return new RegExp('(\\s|^)'+name+'(\\s|$)').test(classes);
 }

diff --git a/src/web/js/azkaban.date.utils.js b/src/web/js/azkaban.date.utils.js
index ce90f7b..a65ec50 100644
--- a/src/web/js/azkaban.date.utils.js
+++ b/src/web/js/azkaban.date.utils.js
@@ -67,7 +67,8 @@ var getDateFormat = function(date) {
 	var minutes = getTwoDigitStr(date.getMinutes());
 	var second = getTwoDigitStr(date.getSeconds());
 
-	var datestring = year + "-" + month + "-" + day + "  " + hours + ":" + minutes + " " + second + "s";
+	var datestring = year + "-" + month + "-" + day + "  " + hours + ":" + 
+			minutes + " " + second + "s";
 	return datestring;
 }
 

diff --git a/src/web/js/azkaban.exflow.view.js b/src/web/js/azkaban.exflow.view.js
index fce01a8..0d70f37 100644
--- a/src/web/js/azkaban.exflow.view.js
+++ b/src/web/js/azkaban.exflow.view.js
@@ -28,12 +28,12 @@ var handleJobMenuClick = function(action, el, pos) {
 }
 
 var statusView;
-azkaban.StatusView= Backbone.View.extend({
-	initialize : function(settings) {
+azkaban.StatusView = Backbone.View.extend({
+	initialize: function(settings) {
 		this.model.bind('change:graph', this.render, this);
 		this.model.bind('change:update', this.statusUpdate, this);
 	},
-	render : function(evt) {
+	render: function(evt) {
 		var data = this.model.get("data");
 		
 		var user = data.submitUser;
@@ -41,7 +41,8 @@ azkaban.StatusView= Backbone.View.extend({
 		
 		this.statusUpdate(evt);
 	},
-	statusUpdate : function(evt) {
+	
+	statusUpdate: function(evt) {
 		var data = this.model.get("data");
 		
 		statusItem = $("#flowStatus");
@@ -83,202 +84,188 @@ azkaban.StatusView= Backbone.View.extend({
 });
 
 var flowTabView;
-azkaban.FlowTabView= Backbone.View.extend({
-  events : {
-  	"click #graphViewLink" : "handleGraphLinkClick",
-  	"click #jobslistViewLink" : "handleJobslistLinkClick",
-  	"click #flowLogViewLink" : "handleLogLinkClick",
-  	"click #cancelbtn" : "handleCancelClick",
-  	"click #executebtn" : "handleRestartClick",
-  	"click #pausebtn" : "handlePauseClick",
-  	"click #resumebtn" : "handleResumeClick",
-  	"click #retrybtn" : "handleRetryClick"
-  },
-  initialize : function(settings) {
-  	$("#cancelbtn").hide();
-  	$("#executebtn").hide();
-  	$("#pausebtn").hide();
-  	$("#resumebtn").hide();
-  	$("#retrybtn").hide();
-  
+azkaban.FlowTabView = Backbone.View.extend({
+	events: {
+		"click #graphViewLink": "handleGraphLinkClick",
+		"click #jobslistViewLink": "handleJobslistLinkClick",
+		"click #flowLogViewLink": "handleLogLinkClick",
+		"click #cancelbtn": "handleCancelClick",
+		"click #executebtn": "handleRestartClick",
+		"click #pausebtn": "handlePauseClick",
+		"click #resumebtn": "handleResumeClick",
+		"click #retrybtn": "handleRetryClick"
+	},
+	
+	initialize: function(settings) {
+		$("#cancelbtn").hide();
+		$("#executebtn").hide();
+		$("#pausebtn").hide();
+		$("#resumebtn").hide();
+		$("#retrybtn").hide();
+	
 		this.model.bind('change:graph', this.handleFlowStatusChange, this);
 		this.model.bind('change:update', this.handleFlowStatusChange, this);
 	
-  	var selectedView = settings.selectedView;
-  	if (selectedView == "jobslist") {
-  		this.handleJobslistLinkClick();
-  	}
-  	else {
-  		this.handleGraphLinkClick();
-  	}
-  },
-  render: function() {
-  	console.log("render graph");
-  },
-  handleGraphLinkClick: function(){
-  	$("#jobslistViewLink").removeClass("selected");
-  	$("#graphViewLink").addClass("selected");
-  	$("#flowLogViewLink").removeClass("selected");
-  	
-  	$("#jobListView").hide();
-  	$("#graphView").show();
-  	$("#flowLogView").hide();
-  },
-  handleJobslistLinkClick: function() {
-  	$("#graphViewLink").removeClass("selected");
-  	$("#jobslistViewLink").addClass("selected");
-  	$("#flowLogViewLink").removeClass("selected");
-  	
-  	$("#graphView").hide();
-  	$("#jobListView").show();
-  	$("#flowLogView").hide();
-  },
-  handleLogLinkClick: function() {
-  	$("#graphViewLink").removeClass("selected");
-  	$("#jobslistViewLink").removeClass("selected");
-  	$("#flowLogViewLink").addClass("selected");
-  	
-  	$("#graphView").hide();
-  	$("#jobListView").hide();
-  	$("#flowLogView").show();
-  },
-  handleFlowStatusChange: function() {
-  	var data = this.model.get("data");
-  	$("#cancelbtn").hide();
-  	$("#executebtn").hide();
-  	$("#pausebtn").hide();
-  	$("#resumebtn").hide();
-  	$("#retrybtn").hide();
-
-  	if(data.status=="SUCCEEDED") {
-  	  	$("#executebtn").show();
-  	}
-  	else if (data.status=="FAILED") {
-  		$("#executebtn").show();
-  	}
-  	else if (data.status=="FAILED_FINISHING") {
-  		$("#cancelbtn").show();
-  		$("#executebtn").hide();
-  		$("#retrybtn").show();
-  	}
-  	else if (data.status=="RUNNING") {
-  		$("#cancelbtn").show();
-  		$("#pausebtn").show();
-  	}
-  	else if (data.status=="PAUSED") {
-  		$("#cancelbtn").show();
-  		$("#resumebtn").show();
-  	}
-  	else if (data.status=="WAITING") {
-  		$("#cancelbtn").show();
-  	}
-  	else if (data.status=="KILLED") {
-  		$("#executebtn").show();
-  	}
-  },
-  handleCancelClick : function(evt) {
-    var requestURL = contextURL + "/executor";
-	ajaxCall(
-		requestURL,
-		{"execid": execId, "ajax":"cancelFlow"},
-		function(data) {
-          console.log("cancel clicked");
-          if (data.error) {
-          	showDialog("Error", data.error);
-          }
-          else {
-            showDialog("Cancelled", "Flow has been cancelled.");
-
-            setTimeout(function() {updateStatus();}, 1100);
-          }
-      	}
-      );
-  },
-  handleRetryClick : function(evt) {
-      var graphData = graphModel.get("data");
-
-      var requestURL = contextURL + "/executor";
-	  ajaxCall(
-		requestURL,
-		{"execid": execId, "ajax":"retryFailedJobs"},
-		function(data) {
-          console.log("cancel clicked");
-          if (data.error) {
-          	showDialog("Error", data.error);
-          }
-          else {
-            showDialog("Retry", "Flow has been retried.");
-            setTimeout(function() {updateStatus();}, 1100);
-          }
-      	}
-      );
-  },
-  handleRestartClick : function(evt) {
-  	var data = graphModel.get("data");
-  	var nodes = data.nodes;
-  
-    var executingData = {
-  		project: projectName,
-  		ajax: "executeFlow",
-  		flow: flowId,
-  		execid: execId
-	};
-
-  	flowExecuteDialogView.show(executingData);
-  },
-  handlePauseClick : function(evt) {
-  	  var requestURL = contextURL + "/executor";
-		ajaxCall(
-	      requestURL,
-	      {"execid": execId, "ajax":"pauseFlow"},
-	      function(data) {
-	          console.log("pause clicked");
-	          if (data.error) {
-	          	showDialog("Error", data.error);
-	          }
-	          else {
-	            showDialog("Paused", "Flow has been paused.");
-	            
-            	setTimeout(function() {updateStatus();}, 1100);
-	          }
-	      }
-      );
-  },
-  handleResumeClick : function(evt) {
-     var requestURL = contextURL + "/executor";
-     ajaxCall(
-          requestURL,
-	      {"execid": execId, "ajax":"resumeFlow"},
-	      function(data) {
-	          console.log("pause clicked");
-	          if (data.error) {
-	          	showDialog("Error", data.error);
-	          }
-	          else {
-	          	showDialog("Resumed", "Flow has been resumed.");
-            	setTimeout(function() {updateStatus();}, 1100);
-	          }
-	      }
-	  );
-  }
+		var selectedView = settings.selectedView;
+		if (selectedView == "jobslist") {
+			this.handleJobslistLinkClick();
+		}
+		else {
+			this.handleGraphLinkClick();
+		}
+	},
+	
+	render: function() {
+		console.log("render graph");
+	},
+	
+	handleGraphLinkClick: function(){
+		$("#jobslistViewLink").removeClass("active");
+		$("#graphViewLink").addClass("active");
+		$("#flowLogViewLink").removeClass("active");
+		
+		$("#jobListView").hide();
+		$("#graphView").show();
+		$("#flowLogView").hide();
+	},
+	
+	handleJobslistLinkClick: function() {
+		$("#graphViewLink").removeClass("active");
+		$("#jobslistViewLink").addClass("active");
+		$("#flowLogViewLink").removeClass("active");
+		
+		$("#graphView").hide();
+		$("#jobListView").show();
+		$("#flowLogView").hide();
+	},
+	
+	handleLogLinkClick: function() {
+		$("#graphViewLink").removeClass("active");
+		$("#jobslistViewLink").removeClass("active");
+		$("#flowLogViewLink").addClass("active");
+		
+		$("#graphView").hide();
+		$("#jobListView").hide();
+		$("#flowLogView").show();
+	},
+	
+	handleFlowStatusChange: function() {
+		var data = this.model.get("data");
+		$("#cancelbtn").hide();
+		$("#executebtn").hide();
+		$("#pausebtn").hide();
+		$("#resumebtn").hide();
+		$("#retrybtn").hide();
+
+		if (data.status == "SUCCEEDED") {
+				$("#executebtn").show();
+		}
+		else if (data.status == "FAILED") {
+			$("#executebtn").show();
+		}
+		else if (data.status == "FAILED_FINISHING") {
+			$("#cancelbtn").show();
+			$("#executebtn").hide();
+			$("#retrybtn").show();
+		}
+		else if (data.status == "RUNNING") {
+			$("#cancelbtn").show();
+			$("#pausebtn").show();
+		}
+		else if (data.status == "PAUSED") {
+			$("#cancelbtn").show();
+			$("#resumebtn").show();
+		}
+		else if (data.status == "WAITING") {
+			$("#cancelbtn").show();
+		}
+		else if (data.status == "KILLED") {
+			$("#executebtn").show();
+		}
+	},
+	
+	handleCancelClick: function(evt) {
+		var requestURL = contextURL + "/executor";
+		var requestData = {"execid": execId, "ajax": "cancelFlow"};
+		var successHandler = function(data) {
+			console.log("cancel clicked");
+			if (data.error) {
+				showDialog("Error", data.error);
+			}
+			else {
+				showDialog("Cancelled", "Flow has been cancelled.");
+				setTimeout(function() {updateStatus();}, 1100);
+			}
+		};
+		ajaxCall(requestURL, requestData, successHandler);
+	},
+	
+	handleRetryClick: function(evt) {
+		var graphData = graphModel.get("data");
+		var requestURL = contextURL + "/executor";
+		var requestData = {"execid": execId, "ajax":"retryFailedJobs"};
+		var successHandler = function(data) {
+			console.log("cancel clicked");
+			if (data.error) {
+				showDialog("Error", data.error);
+			}
+			else {
+				showDialog("Retry", "Flow has been retried.");
+				setTimeout(function() {updateStatus();}, 1100);
+			}
+		};
+		ajaxCall(requestURL, requestData, successHandler);
+	},
+	
+	handleRestartClick: function(evt) {
+		var data = graphModel.get("data");
+		var nodes = data.nodes;
+		var executingData = {
+			project: projectName,
+			ajax: "executeFlow",
+			flow: flowId,
+			execid: execId
+		};
+		flowExecuteDialogView.show(executingData);
+	},
+	
+	handlePauseClick: function(evt) {
+		var requestURL = contextURL + "/executor";
+		var requestData = {"execid": execId, "ajax":"pauseFlow"};
+		var successHandler = function(data) {
+			console.log("pause clicked");
+			if (data.error) {
+				showDialog("Error", data.error);
+			}
+			else {
+				showDialog("Paused", "Flow has been paused.");
+				setTimeout(function() {updateStatus();}, 1100);
+			}
+		};
+		ajaxCall(requestURL, requestData, successHandler);
+	},
+	
+	handleResumeClick: function(evt) {
+		var requestURL = contextURL + "/executor";
+		var requestData = {"execid": execId, "ajax":"resumeFlow"};
+		var successHandler = function(data) {
+			console.log("pause clicked");
+			if (data.error) {
+				showDialog("Error", data.error);
+			}
+			else {
+				showDialog("Resumed", "Flow has been resumed.");
+				setTimeout(function() {updateStatus();}, 1100);
+			}
+		};
+		ajaxCall(requestURL, requestData, successHandler);
+	}
 });
 
 var showDialog = function(title, message) {
-  $('#messageTitle').text(title);
-
-  $('#messageBox').text(message);
-
-  $('#messageDialog').modal({
-      closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-      position: ["20%",],
-      containerId: 'confirm-container',
-      containerCss: {
-        'height': '220px',
-        'width': '565px'
-      },
-      onShow: function (dialog) {
-      }
-    });
+	$('#messageTitle').text(title);
+	$('#messageBox').text(message);
+	$('#messageDialog').modal();
 }
 
 var jobListView;
@@ -287,19 +274,22 @@ var mainSvgGraphView;
 var executionListView;
 azkaban.ExecutionListView = Backbone.View.extend({
 	events: {
-//		"click .progressBox" : "handleProgressBoxClick"
+		//"click .progressBox": "handleProgressBoxClick"
 	},
+	
 	initialize: function(settings) {
 		this.model.bind('change:graph', this.renderJobs, this);
 		this.model.bind('change:update', this.updateJobs, this);
 	},
+	
 	renderJobs: function(evt) {
 		var data = this.model.get("data");
 		var lastTime = data.endTime == -1 ? (new Date()).getTime() : data.endTime;
 		this.updateJobRow(data.nodes);
 		this.updateProgressBar(data);
 	},
-/*	handleProgressBoxClick: function(evt) {
+
+	/*handleProgressBoxClick: function(evt) {
 		var target = evt.currentTarget;
 		var job = target.job;
 		var attempt = target.attempt;
@@ -317,6 +307,7 @@ azkaban.ExecutionListView = Backbone.View.extend({
 	
 		contextMenuView.show(evt, menu);
 	},*/
+	
 	updateJobs: function(evt) {
 		var data = this.model.get("update");
 		var lastTime = data.endTime == -1 ? (new Date()).getTime() : data.endTime;
@@ -324,6 +315,7 @@ azkaban.ExecutionListView = Backbone.View.extend({
 		this.updateJobRow(data.nodes);
 		this.updateProgressBar(this.model.get("data"));
 	},
+	
 	updateJobRow: function(nodes) {
 		var executingBody = $("#executableBody");
 		nodes.sort(function(a,b) { return a.startTime - b.startTime; });
@@ -384,7 +376,7 @@ azkaban.ExecutionListView = Backbone.View.extend({
 				}
 				
 				if (node.endTime == -1) {
-//					$("#" + node.id + "-elapse").text("0 sec");
+					//$("#" + node.id + "-elapse").text("0 sec");
 					$("#" + nodeId + "-elapse").text(getDuration(node.startTime, (new Date()).getTime()));					
 				}
 				else {
@@ -393,8 +385,9 @@ azkaban.ExecutionListView = Backbone.View.extend({
 			}
 		}
 	},
+	
 	updateProgressBar: function(data) {
-		if(data.startTime == -1) {
+		if (data.startTime == -1) {
 			return;
 		}
 		
@@ -424,24 +417,24 @@ azkaban.ExecutionListView = Backbone.View.extend({
 			
 			// Add all the attempts
 			if (node.pastAttempts) {
-				var logURL = contextURL + "/executor?execid=" + execId + "&job=" + node.id + "&attempt=" +  node.pastAttempts.length;
+				var logURL = contextURL + "/executor?execid=" + execId + "&job=" + node.id + "&attempt=" +	node.pastAttempts.length;
 				var aId = node.id + "-log-link";
 				$("#" + aId).attr("href", logURL);
 				elem.attempt = node.pastAttempts.length;
 				
 				// Calculate the node attempt bars
-				for(var p = 0; p < node.pastAttempts.length; ++p) {
+				for (var p = 0; p < node.pastAttempts.length; ++p) {
 					var pastAttempt = node.pastAttempts[p];
 					var pastAttemptBox = $("#" + nodeId + "-progressbar-" + p);
 					
 					var left = (pastAttempt.startTime - flowStartTime)*factor;
-					var width =  Math.max((pastAttempt.endTime - pastAttempt.startTime)*factor, 3);
+					var width =	Math.max((pastAttempt.endTime - pastAttempt.startTime)*factor, 3);
 					
 					var margin = left - offsetLeft;
 					$(pastAttemptBox).css("margin-left", left - offsetLeft);
 					$(pastAttemptBox).css("width", width);
 					
-					$(pastAttemptBox).attr("title", "attempt:" + p + "  start:" + getHourMinSec(new Date(pastAttempt.startTime)) + "  end:" + getHourMinSec(new Date(pastAttempt.endTime)));
+					$(pastAttemptBox).attr("title", "attempt:" + p + "	start:" + getHourMinSec(new Date(pastAttempt.startTime)) + "	end:" + getHourMinSec(new Date(pastAttempt.endTime)));
 					offsetLeft += width + margin;
 				}
 			}
@@ -454,9 +447,10 @@ azkaban.ExecutionListView = Backbone.View.extend({
 			
 			elem.css("margin-left", left)
 			elem.css("width", width);
-			elem.attr("title", "attempt:" + elem.attempt + "  start:" + getHourMinSec(new Date(node.startTime)) + "  end:" + getHourMinSec(new Date(node.endTime)));
+			elem.attr("title", "attempt:" + elem.attempt + "	start:" + getHourMinSec(new Date(node.startTime)) + "	end:" + getHourMinSec(new Date(node.endTime)));
 		}
 	},
+	
 	addNodeRow: function(node) {
 		var executingBody = $("#executableBody");
 		var tr = document.createElement("tr");
@@ -536,31 +530,36 @@ azkaban.FlowLogView = Backbone.View.extend({
 		var model = this.model;
 		console.log("fetchLogs offset is " + offset)
 
-		$.ajax({async:false, 
-			url:requestURL,
-			data:{"execid": execId, "ajax":"fetchExecFlowLogs", "offset": offset, "length": 50000},
-			success:
-				function(data) {
-					console.log("fetchLogs");
-					if (data.error) {
-						console.log(data.error);
+		$.ajax({
+			async: false, 
+			url: requestURL,
+			data: {
+				"execid": execId, 
+				"ajax": "fetchExecFlowLogs", 
+				"offset": offset, 
+				"length": 50000
+			},
+			success: function(data) {
+				console.log("fetchLogs");
+				if (data.error) {
+					console.log(data.error);
+				}
+				else {
+					var log = $("#logSection").text();
+					if (!log) {
+						log = data.data;
 					}
 					else {
-						var log = $("#logSection").text();
-						if (!log) {
-							log = data.data;
-						}
-						else {
-							log += data.data;
-						}
-	
-						var newOffset = data.offset + data.length;
-	
-						$("#logSection").text(log);
-						model.set({"offset": newOffset, "log": log});
-						$(".logViewer").scrollTop(9999);
+						log += data.data;
 					}
+
+					var newOffset = data.offset + data.length;
+
+					$("#logSection").text(log);
+					model.set({"offset": newOffset, "log": log});
+					$(".logViewer").scrollTop(9999);
 				}
+			}
 		});
 	}
 });
@@ -576,48 +575,57 @@ var updateStatus = function() {
 	var oldData = graphModel.get("data");
 	var nodeMap = graphModel.get("nodeMap");
 	
-	ajaxCall(
-	      requestURL,
-	      {"execid": execId, "ajax":"fetchexecflowupdate", "lastUpdateTime": updateTime},
-	      function(data) {
-	          console.log("data updated");
-	          updateTime = data.updateTime;
-	          oldData.submitTime = data.submitTime;
-	          oldData.startTime = data.startTime;
-	          oldData.endTime = data.endTime;
-	          oldData.status = data.status;
-	          
-	          for (var i = 0; i < data.nodes.length; ++i) {
-	          	var node = data.nodes[i];
-	          	var oldNode = nodeMap[node.id];
-	          	oldNode.startTime = node.startTime;
-	          	oldNode.updateTime = node.updateTime;
-	          	oldNode.endTime = node.endTime;
-	          	oldNode.status = node.status;
-	          	oldNode.attempt = node.attempt;
-	          	if (oldNode.attempt > 0) {
-	          		oldNode.pastAttempts = node.pastAttempts;
-	          	}
-	          }
-
-	          graphModel.set({"update": data});
-	          graphModel.trigger("change:update");
-	      });
+	var requestData = {
+		"execid": execId, 
+		"ajax": "fetchexecflowupdate", 
+		"lastUpdateTime": updateTime
+	};
+
+	var successHandler = function(data) {
+		console.log("data updated");
+		updateTime = data.updateTime;
+		oldData.submitTime = data.submitTime;
+		oldData.startTime = data.startTime;
+		oldData.endTime = data.endTime;
+		oldData.status = data.status;
+		
+		for (var i = 0; i < data.nodes.length; ++i) {
+			var node = data.nodes[i];
+			var oldNode = nodeMap[node.id];
+			oldNode.startTime = node.startTime;
+			oldNode.updateTime = node.updateTime;
+			oldNode.endTime = node.endTime;
+			oldNode.status = node.status;
+			oldNode.attempt = node.attempt;
+			if (oldNode.attempt > 0) {
+				oldNode.pastAttempts = node.pastAttempts;
+			}
+		}
+
+		graphModel.set({"update": data});
+		graphModel.trigger("change:update");
+	};
+	ajaxCall(requestURL, requestData, successHandler);
 }
 
 var updateTime = -1;
 var updaterFunction = function() {
 	var oldData = graphModel.get("data");
-	var keepRunning = oldData.status != "SUCCEEDED" && oldData.status != "FAILED" && oldData.status != "KILLED";
+	var keepRunning = 
+			oldData.status != "SUCCEEDED" && 
+			oldData.status != "FAILED" && 
+			oldData.status != "KILLED";
 
 	if (keepRunning) {
 		updateStatus();
 
 		var data = graphModel.get("data");
-		if (data.status == "UNKNOWN" || data.status == "WAITING" || data.status == "PREPARING") {
+		if (data.status == "UNKNOWN" || 
+				data.status == "WAITING" || 
+				data.status == "PREPARING") {
 			setTimeout(function() {updaterFunction();}, 1000);
 		}
-		else if (data.status != "SUCCEEDED" && data.status != "FAILED" ) {
+		else if (data.status != "SUCCEEDED" && data.status != "FAILED") {
 			// 5 sec updates
 			setTimeout(function() {updaterFunction();}, 5000);
 		}
@@ -632,7 +640,10 @@ var updaterFunction = function() {
 
 var logUpdaterFunction = function() {
 	var oldData = graphModel.get("data");
-	var keepRunning = oldData.status != "SUCCEEDED" && oldData.status != "FAILED" && oldData.status != "KILLED";
+	var keepRunning = 
+			oldData.status != "SUCCEEDED" && 
+			oldData.status != "FAILED" && 
+			oldData.status != "KILLED";
 	if (keepRunning) {
 		// update every 30 seconds for the logs until finished
 		flowLogView.handleUpdate();
@@ -650,9 +661,9 @@ var exNodeClickCallback = function(event) {
 	var visualizerURL = contextURL + "/pigvisualizer?execid=" + execId + "&jobid=" + jobId;
 
 	var menu = [	
-			{title: "Open Job...", callback: function() {window.location.href = requestURL;}},
-			{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
-			{title: "Visualize Job...", callback: function() {window.location.href = visualizerURL;}}
+		{title: "Open Job...", callback: function() {window.location.href = requestURL;}},
+		{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
+		{title: "Visualize Job...", callback: function() {window.location.href = visualizerURL;}}
 	];
 
 	contextMenuView.show(event, menu);
@@ -665,9 +676,9 @@ var exJobClickCallback = function(event) {
 	var visualizerURL = contextURL + "/pigvisualizer?execid=" + execId + "&jobid=" + jobId;
 
 	var menu = [	
-			{title: "Open Job...", callback: function() {window.location.href = requestURL;}},
-			{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
-			{title: "Visualize Job...", callback: function() {window.location.href = visualizerURL;}}
+		{title: "Open Job...", callback: function() {window.location.href = requestURL;}},
+		{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
+		{title: "Visualize Job...", callback: function() {window.location.href = visualizerURL;}}
 	];
 
 	contextMenuView.show(event, menu);
@@ -700,8 +711,8 @@ var attemptRightClick = function(event) {
 	var requestURL = contextURL + "/executor?project=" + projectName + "&execid=" + execId + "&job=" + job + "&attempt=" + attempt;
 
 	var menu = [	
-			{title: "Open Attempt Log...", callback: function() {window.location.href=requestURL;}},
-			{title: "Open Attempt Log in New Window...", callback: function() {window.open(requestURL);}}
+		{title: "Open Attempt Log...", callback: function() {window.location.href=requestURL;}},
+		{title: "Open Attempt Log in New Window...", callback: function() {window.open(requestURL);}}
 	];
 
 	contextMenuView.show(event, menu);
@@ -714,66 +725,88 @@ $(function() {
 	graphModel = new azkaban.GraphModel();
 	logModel = new azkaban.LogModel();
 	
-	flowTabView = new azkaban.FlowTabView({el:$( '#headertabs'), model: graphModel});
-	mainSvgGraphView = new azkaban.SvgGraphView({el:$('#svgDiv'), model: graphModel, rightClick:  { "node": exNodeClickCallback, "edge": exEdgeClickCallback, "graph": exGraphClickCallback }});
-	jobsListView = new azkaban.JobListView({el:$('#jobList'), model: graphModel, contextMenuCallback: exJobClickCallback});
-	flowLogView = new azkaban.FlowLogView({el:$('#flowLogView'), model: logModel});
-	statusView = new azkaban.StatusView({el:$('#flow-status'), model: graphModel});
+	flowTabView = new azkaban.FlowTabView({
+		el: $('#headertabs'), 
+		model: graphModel
+	});
+	mainSvgGraphView = new azkaban.SvgGraphView({
+		el: $('#svgDiv'), 
+		model: graphModel, 
+		rightClick:	{ 
+			"node": exNodeClickCallback, 
+			"edge": exEdgeClickCallback, 
+			"graph": exGraphClickCallback 
+		}
+	});
+	jobsListView = new azkaban.JobListView({
+		el: $('#jobList'), 
+		model: graphModel, 
+		contextMenuCallback: exJobClickCallback
+	});
+	flowLogView = new azkaban.FlowLogView({
+		el: $('#flowLogView'), 
+		model: logModel
+	});
+	statusView = new azkaban.StatusView({
+		el: $('#flow-status'), 
+		model: graphModel
+	});
 	
-	executionListView = new azkaban.ExecutionListView({el: $('#jobListView'), model:graphModel});
+	executionListView = new azkaban.ExecutionListView({
+		el: $('#jobListView'), 
+		model: graphModel
+	});
 	
 	var requestURL = contextURL + "/executor";
-
-	ajaxCall(
-	      requestURL,
-	      {"execid": execId, "ajax":"fetchexecflow"},
-	      function(data) {
-	          console.log("data fetched");
-	          graphModel.set({data: data});
-	          graphModel.set({disabled: {}});
-	          graphModel.trigger("change:graph");
-	          
-	          updateTime = Math.max(updateTime, data.submitTime);
-	          updateTime = Math.max(updateTime, data.startTime);
-	          updateTime = Math.max(updateTime, data.endTime);
-	          
-	          var nodeMap = {};
-	          for (var i = 0; i < data.nodes.length; ++i) {
-	             var node = data.nodes[i];
-	             nodeMap[node.id] = node;
-	             updateTime = Math.max(updateTime, node.startTime);
-	             updateTime = Math.max(updateTime, node.endTime);
-	          }
-	          for (var i = 0; i < data.edges.length; ++i) {
-	          	 var edge = data.edges[i];
-	          	 
-	          	 if (!nodeMap[edge.target].in) {
-	          	 	nodeMap[edge.target].in = {};
-	          	 }
-	          	 var targetInMap = nodeMap[edge.target].in;
-	          	 targetInMap[edge.from] = nodeMap[edge.from];
-	          	 
-	          	 if (!nodeMap[edge.from].out) {
-	          	 	nodeMap[edge.from].out = {};
-	          	 }
-	          	 var sourceOutMap = nodeMap[edge.from].out;
-	          	 sourceOutMap[edge.target] = nodeMap[edge.target];
-	          }
-	          
-	          graphModel.set({nodeMap: nodeMap});
-	          
-	          if (window.location.hash) {
-					var hash = window.location.hash;
-					if (hash == "#jobslist") {
-						flowTabView.handleJobslistLinkClick();
-					}
-					else if (hash == "#log") {
-						flowTabView.handleLogLinkClick();
-					}
-			 }
-	          
-	      	 updaterFunction();
-	      	 logUpdaterFunction();
-	      }
-	    );
+	var requestData = {"execid": execId, "ajax":"fetchexecflow"};
+	var successHandler = function(data) {
+		console.log("data fetched");
+		graphModel.set({data: data});
+		graphModel.set({disabled: {}});
+		graphModel.trigger("change:graph");
+		
+		updateTime = Math.max(updateTime, data.submitTime);
+		updateTime = Math.max(updateTime, data.startTime);
+		updateTime = Math.max(updateTime, data.endTime);
+		
+		var nodeMap = {};
+		for (var i = 0; i < data.nodes.length; ++i) {
+			var node = data.nodes[i];
+			nodeMap[node.id] = node;
+			updateTime = Math.max(updateTime, node.startTime);
+			updateTime = Math.max(updateTime, node.endTime);
+		}
+		for (var i = 0; i < data.edges.length; ++i) {
+			var edge = data.edges[i];
+			 
+			if (!nodeMap[edge.target].in) {
+				nodeMap[edge.target].in = {};
+			}
+			var targetInMap = nodeMap[edge.target].in;
+			targetInMap[edge.from] = nodeMap[edge.from];
+			 
+			if (!nodeMap[edge.from].out) {
+				nodeMap[edge.from].out = {};
+			}
+			var sourceOutMap = nodeMap[edge.from].out;
+			sourceOutMap[edge.target] = nodeMap[edge.target];
+		}
+		
+		graphModel.set({nodeMap: nodeMap});
+		if (window.location.hash) {
+			var hash = window.location.hash;
+			if (hash == "#jobslist") {
+				flowTabView.handleJobslistLinkClick();
+			}
+			else if (hash == "#log") {
+				flowTabView.handleLogLinkClick();
+			}
+		}
+		else {
+			flowTabView.handleGraphLinkClick();
+		}
+		updaterFunction();
+		logUpdaterFunction();
+	};
+	ajaxCall(requestURL, requestData, successHandler);
 });

diff --git a/src/web/js/azkaban.flow.execute.view.js b/src/web/js/azkaban.flow.execute.view.js
index c84ef57..a74f473 100644
--- a/src/web/js/azkaban.flow.execute.view.js
+++ b/src/web/js/azkaban.flow.execute.view.js
@@ -18,7 +18,6 @@ $.namespace('azkaban');
 
 function recurseAllAncestors(nodes, disabledMap, id, disable) {
 	var node = nodes[id];
-	
 	if (node.in) {
 		for (var key in node.in) {
 			disabledMap[key] = disable;
@@ -29,7 +28,6 @@ function recurseAllAncestors(nodes, disabledMap, id, disable) {
 
 function recurseAllDescendents(nodes, disabledMap, id, disable) {
 	var node = nodes[id];
-	
 	if (node.out) {
 		for (var key in node.out) {
 			disabledMap[key] = disable;
@@ -39,267 +37,282 @@ function recurseAllDescendents(nodes, disabledMap, id, disable) {
 }
 
 var flowExecuteDialogView;
-azkaban.FlowExecuteDialogView= Backbone.View.extend({
-  events : {
-  	"click .closeExecPanel": "hideExecutionOptionPanel",
-  	"click #schedule-btn" : "scheduleClick",
-  	"click #execute-btn" : "handleExecuteFlow"
-  },
-  initialize : function(settings) {
-  	  this.model.bind('change:flowinfo', this.changeFlowInfo, this);
-  	  
-  	  $("#overrideSuccessEmails").click(function(evt) {
-		 if($(this).is(':checked')){
-		 	$('#successEmails').attr('disabled',null);
-		 }
-		 else {
-		 	$('#successEmails').attr('disabled',"disabled");
-		 }
-  	  });
-  	  
-  	   $("#overrideFailureEmails").click(function(evt) {
-		 if($(this).is(':checked')){
-		 	$('#failureEmails').attr('disabled',null);
-		 }
-		 else {
-		 	$('#failureEmails').attr('disabled',"disabled");
-		 }
-  	  });
-  },
-  render: function() {
-  },
-  getExecutionOptionData: function() {
-	var failureAction = $('#failureAction').val();
-	var failureEmails = $('#failureEmails').val();
-	var successEmails = $('#successEmails').val();
-	var notifyFailureFirst = $('#notifyFailureFirst').is(':checked');
-	var notifyFailureLast = $('#notifyFailureLast').is(':checked');
-	var failureEmailsOverride = $("#overrideFailureEmails").is(':checked');
-	var successEmailsOverride = $("#overrideSuccessEmails").is(':checked');
-	
-	var flowOverride = {};
-	var editRows = $(".editRow");
-	for (var i = 0; i < editRows.length; ++i) {
-		var row = editRows[i];
-		var td = $(row).find('td');
-		var key = $(td[0]).text();
-		var val = $(td[1]).text();
+azkaban.FlowExecuteDialogView = Backbone.View.extend({
+	events: {
+		"click .closeExecPanel": "hideExecutionOptionPanel",
+		"click #schedule-btn": "scheduleClick",
+		"click #execute-btn": "handleExecuteFlow"
+	},
+	
+	initialize: function(settings) {
+		this.model.bind('change:flowinfo', this.changeFlowInfo, this);
+		$("#overrideSuccessEmails").click(function(evt) {
+			if ($(this).is(':checked')) {
+				$('#successEmails').attr('disabled', null);
+			}
+			else {
+				$('#successEmails').attr('disabled', "disabled");
+			}
+		});
+				
+		$("#overrideFailureEmails").click(function(evt) {
+			if ($(this).is(':checked')) {
+				$('#failureEmails').attr('disabled', null);
+			}
+			else {
+				$('#failureEmails').attr('disabled', "disabled");
+			}
+		});
+	},
+	
+	render: function() {
+	},
+	
+	getExecutionOptionData: function() {
+		var failureAction = $('#failureAction').val();
+		var failureEmails = $('#failureEmails').val();
+		var successEmails = $('#successEmails').val();
+		var notifyFailureFirst = $('#notifyFailureFirst').is(':checked');
+		var notifyFailureLast = $('#notifyFailureLast').is(':checked');
+		var failureEmailsOverride = $("#overrideFailureEmails").is(':checked');
+		var successEmailsOverride = $("#overrideSuccessEmails").is(':checked');
 		
-		if (key && key.length > 0) {
-			flowOverride[key] = val;
+		var flowOverride = {};
+		var editRows = $(".editRow");
+		for (var i = 0; i < editRows.length; ++i) {
+			var row = editRows[i];
+			var td = $(row).find('td');
+			var key = $(td[0]).text();
+			var val = $(td[1]).text();
+			
+			if (key && key.length > 0) {
+				flowOverride[key] = val;
+			}
 		}
-	}
-	
-	var disabled = "";
-	var disabledMap = this.model.get('disabled');
-	for (var dis in disabledMap) {
-		if (disabledMap[dis]) {
-			disabled += dis + ",";
+		
+		var disabled = "";
+		var disabledMap = this.model.get('disabled');
+		for (var dis in disabledMap) {
+			if (disabledMap[dis]) {
+				disabled += dis + ",";
+			}
 		}
-	}
-	
-	var executingData = {
-		projectId: projectId,
-		project: this.projectName,
-		ajax: "executeFlow",
-		flow: this.flowId,
-		disabled: disabled,
-		failureEmailsOverride:failureEmailsOverride,
-		successEmailsOverride:successEmailsOverride,
-		failureAction: failureAction,
-		failureEmails: failureEmails,
-		successEmails: successEmails,
-		notifyFailureFirst: notifyFailureFirst,
-		notifyFailureLast: notifyFailureLast,
-		flowOverride: flowOverride
-	};
-	
-	// Set concurrency option, default is skip
-
-	var concurrentOption = $('input[name=concurrent]:checked').val();
-	executingData.concurrentOption = concurrentOption;
-	if (concurrentOption == "pipeline") {
-		var pipelineLevel = $("#pipelineLevel").val();
-		executingData.pipelineLevel = pipelineLevel;
-	}
-	else if (concurrentOption == "queue") {
-		executingData.queueLevel = $("#queueLevel").val();
-	}
+		
+		var executingData = {
+			projectId: projectId,
+			project: this.projectName,
+			ajax: "executeFlow",
+			flow: this.flowId,
+			disabled: disabled,
+			failureEmailsOverride:failureEmailsOverride,
+			successEmailsOverride:successEmailsOverride,
+			failureAction: failureAction,
+			failureEmails: failureEmails,
+			successEmails: successEmails,
+			notifyFailureFirst: notifyFailureFirst,
+			notifyFailureLast: notifyFailureLast,
+			flowOverride: flowOverride
+		};
+		
+		// Set concurrency option, default is skip
+
+		var concurrentOption = $('input[name=concurrent]:checked').val();
+		executingData.concurrentOption = concurrentOption;
+		if (concurrentOption == "pipeline") {
+			var pipelineLevel = $("#pipelineLevel").val();
+			executingData.pipelineLevel = pipelineLevel;
+		}
+		else if (concurrentOption == "queue") {
+			executingData.queueLevel = $("#queueLevel").val();
+		}
+		
+		return executingData;
+	},
 	
-	return executingData;
-  },
-  changeFlowInfo: function() {
-  	var successEmails = this.model.get("successEmails");
-  	var failureEmails = this.model.get("failureEmails");
-  	var failureActions = this.model.get("failureAction");
-  	var notifyFailure = this.model.get("notifyFailure");
-  	var flowParams = this.model.get("flowParams");
-  	var isRunning = this.model.get("isRunning");
-  	var concurrentOption = this.model.get("concurrentOption");
-  	var pipelineLevel = this.model.get("pipelineLevel");
-  	var pipelineExecutionId = this.model.get("pipelineExecution");
-  	var queueLevel = this.model.get("queueLevel");
-  	var nodeStatus = this.model.get("nodeStatus");
-  	var overrideSuccessEmails = this.model.get("overrideSuccessEmails");
-  	var overrideFailureEmails = this.model.get("overrideFailureEmails");
-  	
-	if (overrideSuccessEmails) {
-		$('#overrideSuccessEmails').attr('checked', true);
-	}
-	else {
-		$('#successEmails').attr('disabled','disabled');
-	}
-	if (overrideFailureEmails) {
-		$('#overrideFailureEmails').attr('checked', true);
-	}
-	else {
-		$('#failureEmails').attr('disabled','disabled');
-	}
-  	
-  	if (successEmails) {
-  		$('#successEmails').val(successEmails.join());
-  	}
-  	if (failureEmails) {
-  		$('#failureEmails').val(failureEmails.join());
-  	}
-  	if (failureActions) {
+	changeFlowInfo: function() {
+		var successEmails = this.model.get("successEmails");
+		var failureEmails = this.model.get("failureEmails");
+		var failureActions = this.model.get("failureAction");
+		var notifyFailure = this.model.get("notifyFailure");
+		var flowParams = this.model.get("flowParams");
+		var isRunning = this.model.get("isRunning");
+		var concurrentOption = this.model.get("concurrentOption");
+		var pipelineLevel = this.model.get("pipelineLevel");
+		var pipelineExecutionId = this.model.get("pipelineExecution");
+		var queueLevel = this.model.get("queueLevel");
+		var nodeStatus = this.model.get("nodeStatus");
+		var overrideSuccessEmails = this.model.get("overrideSuccessEmails");
+		var overrideFailureEmails = this.model.get("overrideFailureEmails");
+		
+		if (overrideSuccessEmails) {
+			$('#overrideSuccessEmails').attr('checked', true);
+		}
+		else {
+			$('#successEmails').attr('disabled','disabled');
+		}
+		if (overrideFailureEmails) {
+			$('#overrideFailureEmails').attr('checked', true);
+		}
+		else {
+			$('#failureEmails').attr('disabled','disabled');
+		}
+		
+		if (successEmails) {
+			$('#successEmails').val(successEmails.join());
+		}
+		if (failureEmails) {
+			$('#failureEmails').val(failureEmails.join());
+		}
+		if (failureActions) {
 		$('#failureAction').val(failureActions);
-  	}
-  	
-  	if (notifyFailure.first) {
+		}
+		
+		if (notifyFailure.first) {
 		$('#notifyFailureFirst').attr('checked', true);
-  	}
-  	if (notifyFailure.last) {
-  		$('#notifyFailureLast').attr('checked', true);
-  	}
-  	
-  	if (concurrentOption) {
-  		$('input[value='+concurrentOption+'][name="concurrent"]').attr('checked', true);
-  	}
-  	if (pipelineLevel) {
-  		$('#pipelineLevel').val(pipelineLevel);
-  	}
-  	if (queueLevel) {
-  		$('#queueLevel').val(queueLevel);
-  	}
-  	
-  	if (nodeStatus) {
-  		var nodeMap = this.model.get("nodeMap");
-  
-  		var disabled = {};
-  		for (var key in nodeStatus) {
-  			var status = nodeStatus[key];
-  			
-  			var node = nodeMap[key];
-  			if (node) {
-  				node.status = status;
-  				
-				if (node.status == "DISABLED" || node.status == "SKIPPED") {
-					node.status = "READY";
-					disabled[node.id] = true;
-				}
-				if (node.status == "SUCCEEDED" || node.status=="RUNNING") {
-					disabled[node.id] = true;
+		}
+		if (notifyFailure.last) {
+			$('#notifyFailureLast').attr('checked', true);
+		}
+		
+		if (concurrentOption) {
+			$('input[value='+concurrentOption+'][name="concurrent"]').attr('checked', true);
+		}
+		if (pipelineLevel) {
+			$('#pipelineLevel').val(pipelineLevel);
+		}
+		if (queueLevel) {
+			$('#queueLevel').val(queueLevel);
+		}
+		
+		if (nodeStatus) {
+			var nodeMap = this.model.get("nodeMap");
+			var disabled = {};
+			for (var key in nodeStatus) {
+				var status = nodeStatus[key];
+				
+				var node = nodeMap[key];
+				if (node) {
+					node.status = status;
+					if (node.status == "DISABLED" || node.status == "SKIPPED") {
+						node.status = "READY";
+						disabled[node.id] = true;
+					}
+					if (node.status == "SUCCEEDED" || node.status=="RUNNING") {
+						disabled[node.id] = true;
+					}
 				}
-  			}
-  		}
-  		this.model.set({"disabled":disabled});
-  	}
-  	
-	if (flowParams) {
-		for (var key in flowParams) {
-			editTableView.handleAddRow({paramkey: key, paramvalue: flowParams[key]});
+			}
+			this.model.set({"disabled":disabled});
 		}
-	}
-  },
-  show: function(data) {
-  	var projectName = data.project;
-  	var flowId = data.flow;
-  	var jobId = data.job;
-  	
-  	// ExecId is optional
-  	var execId = data.execid;
-  
-  	var loadedId = executableGraphModel.get("flowId");
-  
-  	this.loadGraph(projectName, flowId);
-  	this.loadFlowInfo(projectName, flowId, execId);
-
-  	this.projectName = projectName;
-  	this.flowId = flowId;
-	if (jobId) {
-		this.showExecuteJob(projectName, flowId, jobId, data.withDep);
-	}
-	else {
-		this.showExecuteFlow(projectName, flowId);
-	}
-  },
-  showExecuteFlow: function(projectName, flowId) {
-	$("#execute-flow-panel-title").text("Execute Flow " + flowId);
-	this.showExecutionOptionPanel();
-
-	// Triggers a render
-	this.model.trigger("change:graph");
-  },
-  showExecuteJob: function(projectName, flowId, jobId, withDep) {
-	sideMenuDialogView.menuSelect($("#flowOption"));
-	$("#execute-flow-panel-title").text("Execute Flow " + flowId);
-	
-	var nodes = this.model.get("nodeMap");
-	var disabled = this.model.get("disabled");
-	
-	// Disable all, then re-enable those you want.
-	for(var key in nodes) {
-		disabled[key] = true;
-	}
+		
+		if (flowParams) {
+			for (var key in flowParams) {
+				editTableView.handleAddRow({
+					paramkey: key, 
+					paramvalue: flowParams[key]
+				});
+			}
+		}
+	},
 	
-	var jobNode = nodes[jobId];
-	disabled[jobId] = false;
+	show: function(data) {
+		var projectName = data.project;
+		var flowId = data.flow;
+		var jobId = data.job;
+		
+		// ExecId is optional
+		var execId = data.execid;
 	
-	if (withDep) {
-		recurseAllAncestors(nodes, disabled, jobId, false);
-	}
+		var loadedId = executableGraphModel.get("flowId");
+	
+		this.loadGraph(projectName, flowId);
+		this.loadFlowInfo(projectName, flowId, execId);
+
+		this.projectName = projectName;
+		this.flowId = flowId;
+		if (jobId) {
+			this.showExecuteJob(projectName, flowId, jobId, data.withDep);
+		}
+		else {
+			this.showExecuteFlow(projectName, flowId);
+		}
+	},
+	
+	showExecuteFlow: function(projectName, flowId) {
+		$("#execute-flow-panel-title").text("Execute Flow " + flowId);
+		this.showExecutionOptionPanel();
+
+		// Triggers a render
+		this.model.trigger("change:graph");
+	},
+	
+	showExecuteJob: function(projectName, flowId, jobId, withDep) {
+		sideMenuDialogView.menuSelect($("#flow-option"));
+		$("#execute-flow-panel-title").text("Execute Flow " + flowId);
+		
+		var nodes = this.model.get("nodeMap");
+		var disabled = this.model.get("disabled");
+		
+		// Disable all, then re-enable those you want.
+		for (var key in nodes) {
+			disabled[key] = true;
+		}
+		
+		var jobNode = nodes[jobId];
+		disabled[jobId] = false;
+		
+		if (withDep) {
+			recurseAllAncestors(nodes, disabled, jobId, false);
+		}
 
-	this.showExecutionOptionPanel();
-	this.model.trigger("change:graph");
-  },
-  showExecutionOptionPanel: function() {
-  	sideMenuDialogView.menuSelect($("#flowOption"));
-  	$('#modalBackground').show();
-  	$('#execute-flow-panel').show();
-  },
-  hideExecutionOptionPanel: function() {
-  	$('#modalBackground').hide();
-  	$('#execute-flow-panel').hide();
-  },
-  scheduleClick: function() {
-  	schedulePanelView.showSchedulePanel();
-  },
-  loadFlowInfo: function(projectName, flowId, execId) {
-    console.log("Loading flow " + flowId);
-	fetchFlowInfo(this.model, projectName, flowId, execId);
-  },
-  loadGraph: function(projectName, flowId) {
-  	console.log("Loading flow " + flowId);
-	fetchFlow(this.model, projectName, flowId, true);
-  },
-  handleExecuteFlow: function(evt) {
-  	  	var executeURL = contextURL + "/executor";
+		this.showExecutionOptionPanel();
+		this.model.trigger("change:graph");
+	},
+	
+	showExecutionOptionPanel: function() {
+		sideMenuDialogView.menuSelect($("#flow-option"));
+		$('#execute-flow-panel').modal();
+	},
+	
+	hideExecutionOptionPanel: function() {
+		$('#execute-flow-panel').modal("hide");
+	},
+	
+	scheduleClick: function() {
+		console.log("click schedule button.");
+		this.hideExecutionOptionPanel();
+		schedulePanelView.showSchedulePanel();
+	},
+	
+	loadFlowInfo: function(projectName, flowId, execId) {
+		console.log("Loading flow " + flowId);
+		fetchFlowInfo(this.model, projectName, flowId, execId);
+	},
+	
+	loadGraph: function(projectName, flowId) {
+		console.log("Loading flow " + flowId);
+		fetchFlow(this.model, projectName, flowId, true);
+	},
+	
+	handleExecuteFlow: function(evt) {
+		console.log("click schedule button.");
+		var executeURL = contextURL + "/executor";
 		var executingData = this.getExecutionOptionData();
 		executeFlow(executingData);
-  }
+	}
 });
 
 var editTableView;
 azkaban.EditTableView = Backbone.View.extend({
-	events : {
+	events: {
 		"click table .addRow": "handleAddRow",
 		"click table .editable": "handleEditColumn",
 		"click table .removeIcon": "handleRemoveColumn"
 	},
-	initialize: function(setting) {
 
+	initialize: function(setting) {
 	},
+	
 	handleAddRow: function(data) {
 		var name = "";
 		if (data.paramkey) {
@@ -311,36 +324,37 @@ azkaban.EditTableView = Backbone.View.extend({
 			value = data.paramvalue;
 		}
 	
-	  	var tr = document.createElement("tr");
-	  	var tdName = document.createElement("td");
-	    var tdValue = document.createElement("td");
-	    
-	    var icon = document.createElement("span");
-	    $(icon).addClass("removeIcon");
-	    var nameData = document.createElement("span");
-	    $(nameData).addClass("spanValue");
-	    $(nameData).text(name);
-	    var valueData = document.createElement("span");
-	    $(valueData).addClass("spanValue");
-	    $(valueData).text(value);
-	    	    
+		var tr = document.createElement("tr");
+		var tdName = document.createElement("td");
+		var tdValue = document.createElement("td");
+		
+		var icon = document.createElement("span");
+		$(icon).addClass("removeIcon");
+		var nameData = document.createElement("span");
+		$(nameData).addClass("spanValue");
+		$(nameData).text(name);
+		var valueData = document.createElement("span");
+		$(valueData).addClass("spanValue");
+		$(valueData).text(value);
+						
 		$(tdName).append(icon);
 		$(tdName).append(nameData);
 		$(tdName).addClass("name");
 		$(tdName).addClass("editable");
 		
 		$(tdValue).append(valueData);
-	    $(tdValue).addClass("editable");
+		$(tdValue).addClass("editable");
 		
 		$(tr).addClass("editRow");
-	  	$(tr).append(tdName);
-	  	$(tr).append(tdValue);
-	   
-	  	$(tr).insertBefore(".addRow");
-	  	return tr;
-	  },
-	  handleEditColumn : function(evt) {
-	  	var curTarget = evt.currentTarget;
+		$(tr).append(tdName);
+		$(tr).append(tdValue);
+	 
+		$(tr).insertBefore(".addRow");
+		return tr;
+	},
+	
+	handleEditColumn: function(evt) {
+		var curTarget = evt.currentTarget;
 	
 		var text = $(curTarget).children(".spanValue").text();
 		$(curTarget).empty();
@@ -359,95 +373,80 @@ azkaban.EditTableView = Backbone.View.extend({
 		});
 		
 		$(input).keypress(function(evt) {
-		    if(evt.which == 13) {
-		        obj.closeEditingTarget(evt);
-		    }
+			if (evt.which == 13) {
+				obj.closeEditingTarget(evt);
+			}
 		});
-
-	  },
-	  handleRemoveColumn : function(evt) {
-	  	var curTarget = evt.currentTarget;
-	  	// Should be the table
-	  	var row = curTarget.parentElement.parentElement;
+	},
+	
+	handleRemoveColumn: function(evt) {
+		var curTarget = evt.currentTarget;
+		// Should be the table
+		var row = curTarget.parentElement.parentElement;
 		$(row).remove();
-	  },
-	  closeEditingTarget: function(evt) {
-  		var input = evt.currentTarget;
-  		var text = $(input).val();
-  		var parent = $(input).parent();
-  		$(parent).empty();
-
-	    var valueData = document.createElement("span");
-	    $(valueData).addClass("spanValue");
-	    $(valueData).text(text);
-
-		if($(parent).hasClass("name")) {
+	},
+	
+	closeEditingTarget: function(evt) {
+		var input = evt.currentTarget;
+		var text = $(input).val();
+		var parent = $(input).parent();
+		$(parent).empty();
+
+		var valueData = document.createElement("span");
+		$(valueData).addClass("spanValue");
+		$(valueData).text(text);
+
+		if ($(parent).hasClass("name")) {
 			var icon = document.createElement("span");
 			$(icon).addClass("removeIcon");
 			$(parent).append(icon);
 		}
-	    
-	    $(parent).removeClass("editing");
-	    $(parent).append(valueData);
-	  }
+		
+		$(parent).removeClass("editing");
+		$(parent).append(valueData);
+	}
 });
 
 var sideMenuDialogView;
-azkaban.SideMenuDialogView= Backbone.View.extend({
-	events : {
-		"click .menuHeader" : "menuClick"
-  	},
-  	initialize : function(settings) {
-  		var children = $(this.el).children();
-  		var currentParent;
-  		var parents = [];
-  		var realChildren = [];
-  		for (var i = 0; i < children.length; ++i ) {
-  			var child = children[i];
-  			if ((i % 2) == 0) {
-  				currentParent = child;
-  				$(child).addClass("menuHeader");
-  				parents.push(child);
-  			}
-  			else {
-  				$(child).addClass("menuContent");
-  				$(child).hide();
-  				currentParent.child = child;
-  				realChildren.push(child);
-  			}
-  		}
-  		
-  		this.menuSelect($("#flowOption"));
-  		
-  		this.parents = parents;
-  		this.children = realChildren;
-  	},
-  	menuClick : function(evt) {
-  		this.menuSelect(evt.currentTarget);
-  	},
-  	menuSelect : function(target) {
-  		if ($(target).hasClass("selected")) {
-  			return;
-  		}
-  		
-  		$(".sidePanel").each(function() {
-  			$(this).hide();
-  		});
-  		
-  		$(".menuHeader").each(function() {
-  			$(this.child).slideUp("fast");
-  			$(this).removeClass("selected");
-  		});
-  		
-  		$(".sidePanel").each(function() {
-  			$(this).hide();
-  		});
-  		
-  		$(target).addClass("selected");
-  		$(target.child).slideDown("fast");
-  		var panelName = $(target).attr("viewpanel");
-  		$("#" + panelName).show();
-  	}
+azkaban.SideMenuDialogView = Backbone.View.extend({
+	events: {
+		"click .menu-header": "menuClick"
+	},
+	
+	initialize: function(settings) {
+		var children = $(this.el).children();
+		for (var i = 0; i < children.length; ++i ) {
+			var child = children[i];
+			$(child).addClass("menu-header");
+			var caption = $(child).find(".menu-caption");
+			$(caption).hide();
+		}
+		this.menuSelect($("#flow-option"));
+	},
+	
+	menuClick: function(evt) {
+		this.menuSelect(evt.currentTarget);
+	},
+	
+	menuSelect: function(target) {
+		if ($(target).hasClass("active")) {
+			return;
+		}
+		
+		$(".side-panel").each(function() {
+			$(this).hide();
+		});
+		
+		$(".menu-header").each(function() {
+			$(this).find(".menu-caption").slideUp("fast");
+			$(this).removeClass("active");
+		});
+		
+		$(target).addClass("active");
+		$(target).find(".menu-caption").slideDown("fast");
+		var panelName = $(target).attr("viewpanel");
+		$("#" + panelName).show();
+	}
 });
 
 var handleJobMenuClick = function(action, el, pos) {
@@ -457,7 +456,7 @@ var handleJobMenuClick = function(action, el, pos) {
 	if (action == "open") {
 		window.location.href = requestURL;
 	}
-	else if(action == "openwindow") {
+	else if (action == "openwindow") {
 		window.open(requestURL);
 	}
 }
@@ -498,7 +497,7 @@ var touchParents = function(jobid, disable) {
 
 	if (inNodes) {
 		for (var key in inNodes) {
-		  disabled[key] = disable;
+			disabled[key] = disable;
 		}
 	}
 	
@@ -513,7 +512,7 @@ var touchChildren = function(jobid, disable) {
 
 	if (outNodes) {
 		for (var key in outNodes) {
-		  disabledMap[key] = disable;
+			disabledMap[key] = disable;
 		}
 	}
 	
@@ -547,24 +546,23 @@ var nodeClickCallback = function(event) {
 	var flowId = executableGraphModel.get("flowId");
 	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobId;
 
-	var menu = [	{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
-			{break: 1},
-			{title: "Enable", callback: function() {touchNode(jobId, false);}, submenu: [
-									{title: "Parents", callback: function(){touchParents(jobId, false);}},
-									{title: "Ancestors", callback: function(){touchAncestors(jobId, false);}},
-									{title: "Children", callback: function(){touchChildren(jobId, false);}},
-									{title: "Descendents", callback: function(){touchDescendents(jobId, false);}},
-									{title: "Enable All", callback: function(){enableAll();}}
-								]
-			},
-			{title: "Disable", callback: function() {touchNode(jobId, true)}, submenu: [
-									{title: "Parents", callback: function(){touchParents(jobId, true);}},
-									{title: "Ancestors", callback: function(){touchAncestors(jobId, true);}},
-									{title: "Children", callback: function(){touchChildren(jobId, true);}},
-									{title: "Descendents", callback: function(){touchDescendents(jobId, true);}},
-									{title: "Disable All", callback: function(){disableAll();}}
-								]
-			}
+	var menu = [
+		{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
+		{break: 1},
+		{title: "Enable", callback: function() {touchNode(jobId, false);}, submenu: [
+			{title: "Parents", callback: function(){touchParents(jobId, false);}},
+			{title: "Ancestors", callback: function(){touchAncestors(jobId, false);}},
+			{title: "Children", callback: function(){touchChildren(jobId, false);}},
+			{title: "Descendents", callback: function(){touchDescendents(jobId, false);}},
+			{title: "Enable All", callback: function(){enableAll();}}
+		]},
+		{title: "Disable", callback: function() {touchNode(jobId, true)}, submenu: [
+			{title: "Parents", callback: function(){touchParents(jobId, true);}},
+			{title: "Ancestors", callback: function(){touchAncestors(jobId, true);}},
+			{title: "Children", callback: function(){touchChildren(jobId, true);}},
+			{title: "Descendents", callback: function(){touchDescendents(jobId, true);}},
+			{title: "Disable All", callback: function(){disableAll();}}
+		]}
 	];
 
 	contextMenuView.show(event, menu);
@@ -579,7 +577,8 @@ var graphClickCallback = function(event) {
 	var flowId = executableGraphModel.get("flowId");
 	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId;
 	
-	var menu = [	{title: "Open Flow in New Window...", callback: function() {window.open(requestURL);}},
+	var menu = [
+		{title: "Open Flow in New Window...", callback: function() {window.open(requestURL);}},
 		{break: 1},
 		{title: "Enable All", callback: function() {enableAll();}},
 		{title: "Disable All", callback: function() {disableAll();}},
@@ -593,11 +592,30 @@ var graphClickCallback = function(event) {
 var contextMenuView;
 $(function() {
 	executableGraphModel = new azkaban.GraphModel();
-	flowExecuteDialogView = new azkaban.FlowExecuteDialogView({el:$('#execute-flow-panel'), model: executableGraphModel});
-	svgGraphView = new azkaban.SvgGraphView({el:$('#svgDivCustom'), model: executableGraphModel, topGId:"topG", graphMargin: 10, rightClick: { "node": nodeClickCallback, "edge": edgeClickCallback, "graph": graphClickCallback }});
+	flowExecuteDialogView = new azkaban.FlowExecuteDialogView({
+		el: $('#execute-flow-panel'), 
+		model: executableGraphModel
+	});
+	svgGraphView = new azkaban.SvgGraphView({
+		el: $('#svg-div-custom'), 
+		model: executableGraphModel, 
+		topGId: "topG", 
+		graphMargin: 10, 
+		rightClick: { 
+			"node": nodeClickCallback, 
+			"edge": edgeClickCallback, 
+			"graph": graphClickCallback 
+		}
+	});
 	
-	sideMenuDialogView = new azkaban.SideMenuDialogView({el:$('#graphOptions')});
-	editTableView = new azkaban.EditTableView({el:$('#editTable')});
-
-	contextMenuView = new azkaban.ContextMenuView({el:$('#contextMenu')});
+	sideMenuDialogView = new azkaban.SideMenuDialogView({
+		el: $('#graph-options')
+	});
+	editTableView = new azkaban.EditTableView({
+		el: $('#editTable')
+	});
+
+	contextMenuView = new azkaban.ContextMenuView({
+		el: $('#contextMenu')
+	});
 });

diff --git a/src/web/js/azkaban.flow.job.view.js b/src/web/js/azkaban.flow.job.view.js
index d4dff6b..cc41b04 100644
--- a/src/web/js/azkaban.flow.job.view.js
+++ b/src/web/js/azkaban.flow.job.view.js
@@ -18,76 +18,72 @@ azkaban.JobListView = Backbone.View.extend({
 	events: {
 		"keyup input": "filterJobs",
 		"click li": "handleJobClick",
-		"click .resetPanZoomBtn" : "handleResetPanZoom",
-		"contextmenu li" : "handleContextMenuClick"
+		"click .resetPanZoomBtn": "handleResetPanZoom",
+		"contextmenu li": "handleContextMenuClick"
 	},
+	
 	initialize: function(settings) {
 		this.model.bind('change:selected', this.handleSelectionChange, this);
 		this.model.bind('change:disabled', this.handleDisabledChange, this);
 		this.model.bind('change:graph', this.render, this);
 		this.model.bind('change:update', this.handleStatusUpdate, this);
 		
-		this.filterInput = $(this.el).find(".filter");
-		this.list = $(this.el).find(".list");
+		this.filterInput = $(this.el).find("#filter");
+		this.list = $(this.el).find("#list");
 		this.contextMenu = settings.contextMenuCallback;
 		this.listNodes = {};
 	},
+	
 	filterJobs: function(self) {
 		var filter = this.filterInput.val();
-		
 		if (filter && filter.trim() != "") {
 			filter = filter.trim();
-			
 			if (filter == "") {
 				if (this.filter) {
-					this.jobs.children().each(
-						function(){
-							var a = $(this).find("a");
-        					$(a).html(this.jobid);
-        					$(this).show();
-						}
-					);
+					this.jobs.children().each(function(){
+						var a = $(this).find("a");
+						$(a).html(this.jobid);
+						$(this).show();
+					});
 				}
-				
 				this.filter = null;
 				return;
 			}
 		}
 		else {
 			if (this.filter) {
-				this.jobs.children().each(
-					function(){
-						var a = $(this).find("a");
-    					$(a).html(this.jobid);
-    					$(this).show();
-					}
-				);
+				this.jobs.children().each(function(){
+					var a = $(this).find("a");
+					$(a).html(this.jobid);
+					$(this).show();
+				});
 			}
 				
 			this.filter = null;
 			return;
 		}
 		
-		this.jobs.children().each(
-			function(){
-        		var jobid = this.jobid;
-        		var index = jobid.indexOf(filter);
-        		if (index != -1) {
-        			var a = $(this).find("a");
-        			
-        			var endIndex = index + filter.length;
-        			var newHTML = jobid.substring(0, index) + "<span>" + jobid.substring(index, endIndex) + "</span>" + jobid.substring(endIndex, jobid.length);
-        			
-        			$(a).html(newHTML);
-        			$(this).show();
-        		}
-        		else {
-        			$(this).hide();
-        		}
-    	});
-    	
-    	this.filter = filter;
+		this.jobs.children().each(function() {
+			var jobid = this.jobid;
+			var index = jobid.indexOf(filter);
+			if (index != -1) {
+				var a = $(this).find("a");
+				var endIndex = index + filter.length;
+				var newHTML = jobid.substring(0, index) + "<span>" + 
+						jobid.substring(index, endIndex) + "</span>" + 
+						jobid.substring(endIndex, jobid.length);
+				
+				$(a).html(newHTML);
+				$(this).show();
+			}
+			else {
+				$(this).hide();
+			}
+		});
+			
+		this.filter = filter;
 	},
+	
 	handleStatusUpdate: function(evt) {
 		var updateData = this.model.get("update");
 		if (updateData.nodes) {
@@ -98,6 +94,7 @@ azkaban.JobListView = Backbone.View.extend({
 			}
 		}
 	},
+	
 	assignInitialStatus: function(evt) {
 		var data = this.model.get("data");
 		for (var i = 0; i < data.nodes.length; ++i) {
@@ -105,6 +102,7 @@ azkaban.JobListView = Backbone.View.extend({
 			$(this.listNodes[updateNode.id]).addClass(updateNode.status);
 		}
 	},
+	
 	render: function(self) {
 		var data = this.model.get("data");
 		var nodes = data.nodes;
@@ -117,7 +115,7 @@ azkaban.JobListView = Backbone.View.extend({
 		};
 	
 		var nodeArray = nodes.slice(0);
-		nodeArray.sort(function(a,b){ 
+		nodeArray.sort(function(a, b) {
 			var diff = a.y - b.y;
 			if (diff == 0) {
 				return a.x - b.x;
@@ -127,13 +125,13 @@ azkaban.JobListView = Backbone.View.extend({
 			}
 		});
 		
-		var ul = document.createElement("ul");
-		$(ul).attr("class", "jobs");
+		var ul = this.list;
 		this.jobs = $(ul);
 		
 		for (var i = 0; i < nodeArray.length; ++i) {
 			var li = document.createElement("li");
-			li.jobid=nodeArray[i].id;
+			li.jobid = nodeArray[i].id;
+			$(li).addClass('list-group-item');
 			
 			var iconDiv = document.createElement("div");
 			$(iconDiv).addClass("icon");
@@ -142,25 +140,26 @@ azkaban.JobListView = Backbone.View.extend({
 			var a = document.createElement("a");
 			$(a).text(nodeArray[i].id);
 			li.appendChild(a);
-			ul.appendChild(li);
-			li.jobid=nodeArray[i].id;
+			$(ul).append(li);
+			li.jobid = nodeArray[i].id;
 			
 			this.listNodes[nodeArray[i].id] = li;
 		}
 		
-		this.list.append(ul);
 		this.assignInitialStatus(self);
 		this.handleDisabledChange(self);
 	},
+	
 	handleContextMenuClick: function(evt) {
 		if (this.contextMenu) {
 			this.contextMenu(evt);
 			return false;
 		}
 	},
-	handleJobClick : function(evt) {
+	
+	handleJobClick: function(evt) {
 		var jobid = evt.currentTarget.jobid;
-		if(!evt.currentTarget.jobid) {
+		if (!evt.currentTarget.jobid) {
 			return;
 		}
 		
@@ -177,6 +176,7 @@ azkaban.JobListView = Backbone.View.extend({
 			this.model.set({"selected": jobid});
 		}
 	},
+	
 	handleDisabledChange: function(evt) {
 		var disabledMap = this.model.get("disabled");
 		var nodes = this.model.get("nodes");
@@ -190,6 +190,7 @@ azkaban.JobListView = Backbone.View.extend({
 			}
 		}
 	},
+	
 	handleSelectionChange: function(evt) {
 		if (!this.model.hasChanged("selected")) {
 			return;
@@ -206,6 +207,7 @@ azkaban.JobListView = Backbone.View.extend({
 			$(this.listNodes[current]).addClass("selected");
 		}
 	},
+	
 	handleResetPanZoom: function(evt) {
 		this.model.trigger("resetPanZoom");
 	}

diff --git a/src/web/js/azkaban.flow.view.js b/src/web/js/azkaban.flow.view.js
index ce01dbc..8d8eb6e 100644
--- a/src/web/js/azkaban.flow.view.js
+++ b/src/web/js/azkaban.flow.view.js
@@ -31,22 +31,25 @@ var statusStringMap = {
 
 var handleJobMenuClick = function(action, el, pos) {
 	var jobid = el[0].jobid;
-	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobid;
+	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + 
+			flowId + "&job=" + jobid;
 	if (action == "open") {
 		window.location.href = requestURL;
 	}
-	else if(action == "openwindow") {
+	else if (action == "openwindow") {
 		window.open(requestURL);
 	}
 }
 
 var flowTabView;
-azkaban.FlowTabView= Backbone.View.extend({
-	events : {
-		"click #graphViewLink" : "handleGraphLinkClick",
-		"click #executionsViewLink" : "handleExecutionLinkClick"
+azkaban.FlowTabView = Backbone.View.extend({
+	events: {
+		"click #graphViewLink": "handleGraphLinkClick",
+		"click #executionsViewLink": "handleExecutionLinkClick",
+		"click #summaryViewLink": "handleSummaryLinkClick"
 	},
-	initialize : function(settings) {
+	
+	initialize: function(settings) {
 		var selectedView = settings.selectedView;
 		if (selectedView == "executions") {
 			this.handleExecutionLinkClick();
@@ -54,26 +57,42 @@ azkaban.FlowTabView= Backbone.View.extend({
 		else {
 			this.handleGraphLinkClick();
 		}
-
 	},
+	
 	render: function() {
 		console.log("render graph");
 	},
+	
 	handleGraphLinkClick: function(){
-		$("#executionsViewLink").removeClass("selected");
-		$("#graphViewLink").addClass("selected");
+		$("#executionsViewLink").removeClass("active");
+		$("#graphViewLink").addClass("active");
+		$('#summaryViewLink').removeClass('active');
 		
 		$("#executionsView").hide();
 		$("#graphView").show();
+		$('#summaryView').hide();
 	},
+	
 	handleExecutionLinkClick: function() {
-		$("#graphViewLink").removeClass("selected");
-		$("#executionsViewLink").addClass("selected");
+		$("#graphViewLink").removeClass("active");
+		$("#executionsViewLink").addClass("active");
+		$('#summaryViewLink').removeClass('active');
 		
-		 $("#graphView").hide();
-		 $("#executionsView").show();
-		 executionModel.trigger("change:view");
-	}
+		$("#graphView").hide();
+		$("#executionsView").show();
+		$('#summaryView').hide();
+		executionModel.trigger("change:view");
+	},
+
+	handleSummaryLinkClick: function() {
+		$('#graphViewLink').removeClass('active');
+		$('#executionsViewLink').removeClass('active');
+		$('#summaryViewLink').addClass('active');
+
+		$('#graphView').hide();
+		$('#executionsView').hide();
+		$('#summaryView').show();
+	},
 });
 
 var jobListView;
@@ -84,12 +103,14 @@ azkaban.ExecutionsView = Backbone.View.extend({
 	events: {
 		"click #pageSelection li": "handleChangePageSelection"
 	},
+	
 	initialize: function(settings) {
 		this.model.bind('change:view', this.handleChangeView, this);
 		this.model.bind('render', this.render, this);
 		this.model.set({page: 1, pageSize: 16});
 		this.model.bind('change:page', this.handlePageChange, this);
 	},
+	
 	render: function(evt) {
 		console.log("render");
 		// Render page selections
@@ -155,6 +176,7 @@ azkaban.ExecutionsView = Backbone.View.extend({
 		
 		this.renderPagination(evt);
 	},
+	
 	renderPagination: function(evt) {
 		var total = this.model.get("total");
 		total = total? total : 1;
@@ -228,49 +250,154 @@ azkaban.ExecutionsView = Backbone.View.extend({
 			a.attr("href", "#page" + tpage);
 		}
 	},
+	
 	handleChangePageSelection: function(evt) {
 		if ($(evt.currentTarget).hasClass("disabled")) {
 			return;
 		}
 		var page = evt.currentTarget.page;
-		
 		this.model.set({"page": page});
 	},
+	
 	handleChangeView: function(evt) {
 		if (this.init) {
 			return;
 		}
-		
 		console.log("init");
 		this.handlePageChange(evt);
 		this.init = true;
 	},
+	
 	handlePageChange: function(evt) {
 		var page = this.model.get("page") - 1;
 		var pageSize = this.model.get("pageSize");
 		var requestURL = contextURL + "/manager";
 		
 		var model = this.model;
-		$.get(
-			requestURL,
-			{"project": projectName, "flow":flowId, "ajax": "fetchFlowExecutions", "start":page * pageSize, "length": pageSize},
-			function(data) {
-				model.set({"executions": data.executions, "total": data.total});
-				model.trigger("render");
-			},
-			"json"
-		);
+		var requestData = {
+			"project": projectName, 
+			"flow": flowId, 
+			"ajax": "fetchFlowExecutions", 
+			"start": page * pageSize, 
+			"length": pageSize
+		};
+		var successHandler = function(data) {
+			model.set({
+				"executions": data.executions, 
+				"total": data.total
+			});
+			model.trigger("render");
+		};
+		$.get(requestURL, requestData, successHandler, "json");
 	}
 });
 
+var summaryView;
+azkaban.SummaryView = Backbone.View.extend({
+	events: {
+		"click": "closeEditingTarget",
+		"click table .editable": "handleEditField"
+	},
+	
+	initialize: function(settings) {
+		console.log("summaryView initialize");
+		var general = {
+			flowName: "",
+			flowDescription: "",
+			projectName: projectName,
+			flowId: flowId
+		};
+
+		var scheduling = {};
+		var resources = {};
+		var io = {};
+
+		this.model.bind('change:view', this.handleChangeView, this);
+		this.model.bind('render', this.render, this);
+		this.model.set({
+			'general': general,
+			'scheduling': scheduling,
+			'resources': resources,
+			'io': io
+		});
+		this.model.trigger('render');
+	},
+
+	handleChangeView: function(evt) {
+		console.log("summaryView handleChangeView");
+	},
+
+	handleEditField: function(evt) {
+		var curTarget = evt.currentTarget;
+		console.log("summaryView handleEditField");
+		if (this.editingTarget != curTarget) {
+			this.closeEditingTarget(evt);
+
+			var text = $(curTarget).children('.spanValue').text();
+			$(curTarget).empty();
+
+			var input = document.createElement('input');
+			$(input).attr('type', 'text');
+			$(input).css('width', '100%');
+			$(input).val(text);
+
+			$(curTarget).addClass('editing');
+			$(curTarget).append(input);
+			$(input).focus();
+			var obj = this;
+			$(input).keypress(function(evt) {
+				if (evt.which == 13) {
+					obj.closeEditingTarget(evt);
+				}
+			});
+			this.editingTarget = curTarget;
+		}
+		evt.preventDefault();
+		evt.stopPropagation();
+	},
+
+	closeEditingTarget: function(evt) {
+		console.log("summaryView closeEditingTarget");
+		if (this.editingTarget != null &&
+				this.editingTarget != evt.target &&
+				this.editingTarget != evt.target.myparent) {
+			var input = $(this.editingTarget).children("input")[0];
+			var text = $(input).val();
+			$(input).remove();
+
+			var valueData = document.createElement("span");
+			$(valueData).addClass("spanValue");
+			$(valueData).text(text);
+
+			$(this.editingTarget).removeClass("editing");
+			$(this.editingTarget).append(valueData);
+			valueData.myparent = this.editingTarget;
+			this.editingTarget = null;
+		}
+	},
+	
+	render: function(evt) {
+		console.log("summaryView render");
+		var data = {
+			general: this.model.get('general'),
+			scheduling: this.model.get('scheduling'),
+			resources: this.model.get('resources')
+		};
+		dust.render("flowsummary", data, function(err, out) {
+			$('#summaryView').html(out);
+		});
+	},
+});
+
 var exNodeClickCallback = function(event) {
 	console.log("Node clicked callback");
 	var jobId = event.currentTarget.jobid;
-	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobId;
+	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + 
+			flowId + "&job=" + jobId;
 
 	var menu = [	
-			{title: "Open Job...", callback: function() {window.location.href=requestURL;}},
-			{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}}
+		{title: "Open Job...", callback: function() {window.location.href=requestURL;}},
+		{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}}
 	];
 
 	contextMenuView.show(event, menu);
@@ -279,11 +406,12 @@ var exNodeClickCallback = function(event) {
 var exJobClickCallback = function(event) {
 	console.log("Node clicked callback");
 	var jobId = event.currentTarget.jobid;
-	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobId;
+	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + 
+			flowId + "&job=" + jobId;
 
 	var menu = [	
-			{title: "Open Job...", callback: function() {window.location.href=requestURL;}},
-			{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}}
+		{title: "Open Job...", callback: function() {window.location.href=requestURL;}},
+		{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}}
 	];
 
 	contextMenuView.show(event, menu);
@@ -312,20 +440,35 @@ azkaban.GraphModel = Backbone.Model.extend({});
 
 var executionModel;
 azkaban.ExecutionModel = Backbone.Model.extend({});
+
+var summaryModel;
+azkaban.SummaryModel = Backbone.Model.extend({});
+
 var mainSvgGraphView;
 
 $(function() {
 	var selected;
 	// Execution model has to be created before the window switches the tabs.
 	executionModel = new azkaban.ExecutionModel();
-	executionsView = new azkaban.ExecutionsView({el:$('#executionsView'), model: executionModel});
-	flowTabView = new azkaban.FlowTabView({el:$( '#headertabs'), selectedView: selected });
+	executionsView = new azkaban.ExecutionsView({
+		el: $('#executionsView'), 
+		model: executionModel
+	});
+	summaryModel = new azkaban.SummaryModel();
+	summaryView = new azkaban.SummaryView({
+		el: $('#summaryView'),
+		model: summaryModel
+	});
+	flowTabView = new azkaban.FlowTabView({
+		el: $('#headertabs'), 
+		selectedView: selected 
+	});
 
 	graphModel = new azkaban.GraphModel();
 	mainSvgGraphView = new azkaban.SvgGraphView({
 		el: $('#svgDiv'), 
 		model: graphModel, 
-		rightClick:  { 
+		rightClick: { 
 			"node": exNodeClickCallback, 
 			"edge": exEdgeClickCallback, 
 			"graph": exGraphClickCallback 
@@ -340,7 +483,7 @@ $(function() {
 	var requestURL = contextURL + "/manager";
 
 	// Set up the Flow options view. Create a new one every time :p
-	$('#executebtn').click( function() {
+	$('#executebtn').click(function() {
 		var data = graphModel.get("data");
 		var nodes = data.nodes;
 		var executingData = {
@@ -352,61 +495,65 @@ $(function() {
 		flowExecuteDialogView.show(executingData);
 	});
 
-	$.get(
-		requestURL,
-		{"project": projectName, "ajax":"fetchflowgraph", "flow":flowId},
-		function(data) {
-			// Create the nodes
-			var nodes = {};
-			for (var i=0; i < data.nodes.length; ++i) {
-				var node = data.nodes[i];
-				nodes[node.id] = node;
+	var requestData = {
+		"project": projectName, 
+		"ajax": "fetchflowgraph", 
+		"flow": flowId
+	};
+	var successHandler = function(data) {
+		// Create the nodes
+		var nodes = {};
+		for (var i = 0; i < data.nodes.length; ++i) {
+			var node = data.nodes[i];
+			nodes[node.id] = node;
+		}
+		for (var i = 0; i < data.edges.length; ++i) {
+			var edge = data.edges[i];
+			var fromNode = nodes[edge.from];
+			var toNode = nodes[edge.target];
+			
+			if (!fromNode.outNodes) {
+				fromNode.outNodes = {};
 			}
-			for (var i=0; i < data.edges.length; ++i) {
-				var edge = data.edges[i];
-				var fromNode = nodes[edge.from];
-				var toNode = nodes[edge.target];
-				
-				if (!fromNode.outNodes) {
-					fromNode.outNodes = {};
-				}
-				fromNode.outNodes[toNode.id] = toNode;
-				
-				if (!toNode.inNodes) {
-					toNode.inNodes = {};
-				}
-				toNode.inNodes[fromNode.id] = fromNode;
+			fromNode.outNodes[toNode.id] = toNode;
+			
+			if (!toNode.inNodes) {
+				toNode.inNodes = {};
 			}
+			toNode.inNodes[fromNode.id] = fromNode;
+		}
+	
+		console.log("data fetched");
+		graphModel.set({data: data});
+		graphModel.set({nodes: nodes});
+		graphModel.set({disabled: {}});
+		graphModel.trigger("change:graph");
 		
-			console.log("data fetched");
-			graphModel.set({data: data});
-			graphModel.set({nodes: nodes});
-			graphModel.set({disabled: {}});
-			graphModel.trigger("change:graph");
-			
-			// Handle the hash changes here so the graph finishes rendering first.
-			if (window.location.hash) {
-				var hash = window.location.hash;
-				if (hash == "#executions") {
+		// Handle the hash changes here so the graph finishes rendering first.
+		if (window.location.hash) {
+			var hash = window.location.hash;
+			if (hash == "#executions") {
+				flowTabView.handleExecutionLinkClick();
+			}
+			if (hash == "#summary") {
+				flowTabView.handleSummaryLinkClick();
+			}
+			else if (hash == "#graph") {
+				// Redundant, but we may want to change the default. 
+				selected = "graph";
+			}
+			else {
+				if ("#page" == hash.substring(0, "#page".length)) {
+					var page = hash.substring("#page".length, hash.length);
+					console.log("page " + page);
 					flowTabView.handleExecutionLinkClick();
-				}
-				else if (hash == "#graph") {
-					// Redundant, but we may want to change the default. 
-					selected = "graph";
+					executionModel.set({"page": parseInt(page)});
 				}
 				else {
-					if ("#page" == hash.substring(0, "#page".length)) {
-						var page = hash.substring("#page".length, hash.length);
-						console.log("page " + page);
-						flowTabView.handleExecutionLinkClick();
-						executionModel.set({"page": parseInt(page)});
-					}
-					else {
-						selected = "graph";
-					}
+					selected = "graph";
 				}
 			}
-		},
-		"json"
-	);
+		}
+	};
+	$.get(requestURL, requestData, successHandler, "json");
 });

diff --git a/src/web/js/azkaban.history.view.js b/src/web/js/azkaban.history.view.js
index d1b99c0..ebd2179 100644
--- a/src/web/js/azkaban.history.view.js
+++ b/src/web/js/azkaban.history.view.js
@@ -21,6 +21,7 @@ azkaban.AdvFilterView = Backbone.View.extend({
 	events: {
 		"click #filter-btn": "handleAdvFilter"
 	},
+	
 	initialize: function(settings) {
 		$( "#datetimebegin" ).datetimepicker({
 			dateFormat: "mm/dd/yy",
@@ -32,76 +33,49 @@ azkaban.AdvFilterView = Backbone.View.extend({
 			separator: '-',
 			timeFormat: "HH:mm"
 		});
-		$("#errorMsg").hide();
+		$("#adv-filter-error-msg").hide();
 	},
+	
 	handleAdvFilter: function(evt) {
 		console.log("handleAdv");
 		var projcontain = $('#projcontain').val();
 		var flowcontain = $('#flowcontain').val();
 		var usercontain = $('#usercontain').val();
 		var status = $('#status').val();
-		var begin  = $('#datetimebegin').val();
-		var end    = $('#datetimeend').val();
+		var begin	= $('#datetimebegin').val();
+		var end		= $('#datetimeend').val();
 		
 		console.log("filtering history");
 
 		var historyURL = contextURL + "/history"
 		var redirectURL = contextURL + "/schedule"	
-		
 
 		var requestURL = historyURL + "?advfilter=true" + "&projcontain=" + projcontain + "&flowcontain=" + flowcontain + "&usercontain=" + usercontain + "&status=" + status + "&begin=" + begin + "&end=" + end ; 
 		window.location = requestURL;
-		
-//		$.get(
-//			historyURL,
-//			{"action": "advfilter", "projre": projre, "flowre": flowre, "userre": userre},
-//			function(data) {
-//				if (data.action == "redirect") {
-//                    window.location = data.redirect;
-//                }
-//			},
-//			"json"
-//		)
-//		$.ajax({
-//        	async: "false",
-//        	url: "history",
-//        	dataType: "json",
-//        	type: "POST",
-//        	data: {
-//        	action:"advfilter",
-//        	projre:projre,
-//        	flowre:flowre,
-//        	userre:userre
-//        	},
-//        	success: function(data) {
-//        		if (data.redirect) {
-//               		window.location = data.redirect;
-//            	}
-//        	}
-//        })
+
+		/*
+		var requestData = {
+			"action": "advfilter", 
+			"projre": projre, 
+			"flowre": flowre, 
+			"userre": userre
+		};
+		var successHandler = function(data) {
+			if (data.action == "redirect") {
+				window.location = data.redirect;
+			}
+		};
+		$.get(historyURL, requestData, successHandler, "json");
+	*/
 	},
-	render: function(){
+
+	render: function() {
 	}
 });
 
 $(function() {
-
 	filterView = new azkaban.AdvFilterView({el: $('#adv-filter')});
-
-	 $('#adv-filter-btn').click( function() {
-		$('#adv-filter').modal({
-        closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-          position: ["20%",],
-          containerId: 'confirm-container',
-          containerCss: {
-            'height': '220px',
-            'width': '500px'
-          },
-          onShow: function (dialog) {
-            var modal = this;
-            $("#errorMsg").hide();
-          }
-        });
-    });
-
+	$('#adv-filter-btn').click( function() {
+		$('#adv-filter').modal();
+	});
 });

diff --git a/src/web/js/azkaban.jobdetails.view.js b/src/web/js/azkaban.jobdetails.view.js
index a24943d..3f2b7a2 100644
--- a/src/web/js/azkaban.jobdetails.view.js
+++ b/src/web/js/azkaban.jobdetails.view.js
@@ -281,16 +281,16 @@ azkaban.JobTabView = Backbone.View.extend({
 	},
 
 	handleJobLogViewLinkClick: function() {
-		$('#jobSummaryViewLink').removeClass('selected');
+		$('#jobSummaryViewLink').removeClass('active');
 		$('#jobSummaryView').hide();
-		$('#jobLogViewLink').addClass('selected');
+		$('#jobLogViewLink').addClass('active');
 		$('#jobLogView').show();
 	},
 	
 	handleJobSummaryViewLinkClick: function() {
-		$('#jobSummaryViewLink').addClass('selected');
+		$('#jobSummaryViewLink').addClass('active');
 		$('#jobSummaryView').show();
-		$('#jobLogViewLink').removeClass('selected');
+		$('#jobLogViewLink').removeClass('active');
 		$('#jobLogView').hide();
 	},
 });

diff --git a/src/web/js/azkaban.jobedit.view.js b/src/web/js/azkaban.jobedit.view.js
index fcc3e97..b1441c8 100644
--- a/src/web/js/azkaban.jobedit.view.js
+++ b/src/web/js/azkaban.jobedit.view.js
@@ -22,26 +22,27 @@ azkaban.JobEditView = Backbone.View.extend({
 		"click" : "closeEditingTarget",
 		"click #set-btn": "handleSet",	
 		"click #cancel-btn": "handleCancel",
-		"click .modal-close": "handleCancel",
 		"click #addRow": "handleAddRow",
 		"click table .editable": "handleEditColumn",
 		"click table .removeIcon": "handleRemoveColumn"
 	},
+	
 	initialize: function(setting) {
 		this.projectURL = contextURL + "manager"
 		this.generalParams = {}
 		this.overrideParams = {}
 	},
+	
 	handleCancel: function(evt) {
-		$('#jobEditModalBackground').hide();
 		$('#job-edit-pane').hide();
 		var tbl = document.getElementById("generalProps").tBodies[0];
 		var rows = tbl.rows;
 		var len = rows.length;
-		for(var i=0; i < len-1; i++) {
+		for (var i = 0; i < len-1; i++) {
 			tbl.deleteRow(0);
 		}
 	},
+	
 	show: function(projectName, flowName, jobName) {
 		this.projectName = projectName;
 		this.flowName = flowName;
@@ -49,62 +50,59 @@ azkaban.JobEditView = Backbone.View.extend({
 		
 		var projectURL = this.projectURL
 		
-		
-		$('#jobEditModalBackground').show();
-		$('#job-edit-pane').show();
+		$('#job-edit-pane').modal();
 		
 		var handleAddRow = this.handleAddRow;
 		
-//		var overrideParams;
-//		var generalParams;
-//		this.overrideParams = overrideParams;
-//		this.generalParams = generalParams;
-		var fetchJobInfo = {"project": this.projectName, "ajax":"fetchJobInfo", "flowName":this.flowName, "jobName":this.jobName};
-		
+		/*var overrideParams;
+		var generalParams;
+		this.overrideParams = overrideParams;
+		this.generalParams = generalParams;*/
+		var fetchJobInfo = {
+			"project": this.projectName, 
+			"ajax": "fetchJobInfo", 
+			"flowName": this.flowName, 
+			"jobName": this.jobName
+		};
 		var mythis = this;
-		
-		$.get(
-				projectURL,
-				fetchJobInfo,
-				function(data) {
-					if (data.error) {
-						alert(data.error);
-					}
-					else {
-						document.getElementById('jobName').innerHTML = data.jobName;				
-						document.getElementById('jobType').innerHTML = data.jobType;
-						var generalParams = data.generalParams;
-						var overrideParams = data.overrideParams;
-						
-//						for(var key in generalParams) {
-//							var row = handleAddRow();
-//							var td = $(row).find('span');
-//							$(td[1]).text(key);
-//							$(td[2]).text(generalParams[key]);
-//						}
-						
-						mythis.overrideParams = overrideParams;
-						mythis.generalParams = generalParams;
+		var fetchJobSuccessHandler = function(data) {
+			if (data.error) {
+				alert(data.error);
+			}
+			else {
+				document.getElementById('jobName').innerHTML = data.jobName;				
+				document.getElementById('jobType').innerHTML = data.jobType;
+				var generalParams = data.generalParams;
+				var overrideParams = data.overrideParams;
 						
-						for(var okey in overrideParams) {
-							if(okey != 'type' && okey != 'dependencies') {
-								var row = handleAddRow();
-								var td = $(row).find('span');
-								$(td[1]).text(okey);
-								$(td[2]).text(overrideParams[okey]);
-							}
-						}
+				/*for (var key in generalParams) {
+					var row = handleAddRow();
+					var td = $(row).find('span');
+					$(td[1]).text(key);
+					$(td[2]).text(generalParams[key]);
+				}*/
 						
+				mythis.overrideParams = overrideParams;
+				mythis.generalParams = generalParams;
+				
+				for (var okey in overrideParams) {
+					if (okey != 'type' && okey != 'dependencies') {
+						var row = handleAddRow();
+						var td = $(row).find('span');
+						$(td[1]).text(okey);
+						$(td[2]).text(overrideParams[okey]);
 					}
-				},
-				"json"
-			);
+				}
+			}
+		};
 
+		$.get(projectURL, fetchJobInfo, fetchJobSuccessHandler, "json");
 	},
+
 	handleSet: function(evt) {
 		this.closeEditingTarget(evt);
 		var jobOverride = {};
-	  	var editRows = $(".editRow");
+		var editRows = $(".editRow");
 		for (var i = 0; i < editRows.length; ++i) {
 			var row = editRows[i];
 			var td = $(row).find('span');
@@ -120,7 +118,7 @@ azkaban.JobEditView = Backbone.View.extend({
 		var generalParams = this.generalParams
 		
 		jobOverride['type'] = overrideParams['type']
-		if('dependencies' in overrideParams) {
+		if ('dependencies' in overrideParams) {
 			jobOverride['dependencies'] = overrideParams['dependencies']
 		}
 		
@@ -138,32 +136,29 @@ azkaban.JobEditView = Backbone.View.extend({
 
 		var projectURL = this.projectURL
 		var redirectURL = projectURL+'?project='+project+'&flow='+flowName+'&job='+jobName;
+		var jobOverrideSuccessHandler = function(data) {
+			if (data.error) {
+				alert(data.error);
+			}
+			else {
+				window.location = redirectURL;
+			}
+		};
 		
-		$.get(
-			projectURL,
-			jobOverrideData,
-			function(data) {
-				if (data.error) {
-					alert(data.error);
-				}
-				else {
-					window.location = redirectURL;
-				}
-			},
-			"json"
-		);
+		$.get(projectURL, jobOverrideData, jobOverrideSuccessHandler, "json");
 	},
+	
 	handleAddRow: function(evt) {
 		var tr = document.createElement("tr");
-	  	var tdName = document.createElement("td");
-	    var tdValue = document.createElement("td");
+		var tdName = document.createElement("td");
+		var tdValue = document.createElement("td");
 
-	    var icon = document.createElement("span");
-	    $(icon).addClass("removeIcon");
-	    var nameData = document.createElement("span");
-	    $(nameData).addClass("spanValue");
-	    var valueData = document.createElement("span");
-	    $(valueData).addClass("spanValue");
+		var icon = document.createElement("span");
+		$(icon).addClass("removeIcon");
+		var nameData = document.createElement("span");
+		$(nameData).addClass("spanValue");
+		var valueData = document.createElement("span");
+		$(valueData).addClass("spanValue");
 
 		$(tdName).append(icon);
 		$(tdName).append(nameData);
@@ -172,18 +167,18 @@ azkaban.JobEditView = Backbone.View.extend({
 		nameData.myparent = tdName;
 
 		$(tdValue).append(valueData);
-	    $(tdValue).addClass("editable");
+			$(tdValue).addClass("editable");
 		valueData.myparent = tdValue;
 		
 		$(tr).addClass("editRow");
-	  	$(tr).append(tdName);
-	  	$(tr).append(tdValue);
-
-	  	$(tr).insertBefore("#addRow");
-	  	return tr;
+		$(tr).append(tdName);
+		$(tr).append(tdValue);
 
+		$(tr).insertBefore("#addRow");
+		return tr;
 	},
-	handleEditColumn : function(evt) {
+	
+	handleEditColumn: function(evt) {
 		var curTarget = evt.currentTarget;
 	
 		if (this.editingTarget != curTarget) {
@@ -202,9 +197,9 @@ azkaban.JobEditView = Backbone.View.extend({
 			$(input).focus();
 			var obj = this;
 			$(input).keypress(function(evt) {
-		    	if(evt.which == 13) {
-			        obj.closeEditingTarget(evt);
-			    }
+				if (evt.which == 13) {
+					obj.closeEditingTarget(evt);
+				}
 			});
 			
 			this.editingTarget = curTarget;
@@ -213,41 +208,42 @@ azkaban.JobEditView = Backbone.View.extend({
 		evt.preventDefault();
 		evt.stopPropagation();
 	},
-	handleRemoveColumn : function(evt) {
+	
+	handleRemoveColumn: function(evt) {
 		var curTarget = evt.currentTarget;
 		// Should be the table
 		var row = curTarget.parentElement.parentElement;
 		$(row).remove();
 	},
+	
 	closeEditingTarget: function(evt) {
-		if (this.editingTarget != null && this.editingTarget != evt.target && this.editingTarget != evt.target.myparent ) {
-	  		var input = $(this.editingTarget).children("input")[0];
-	  		var text = $(input).val();
-	  		$(input).remove();
-
-		    var valueData = document.createElement("span");
-		    $(valueData).addClass("spanValue");
-		    $(valueData).text(text);
-
-	  		if ($(this.editingTarget).hasClass("name")) {
-		  		var icon = document.createElement("span");
-		    	$(icon).addClass("removeIcon");
-		    	$(this.editingTarget).append(icon);
-		    }
+		if (this.editingTarget != null && 
+				this.editingTarget != evt.target && 
+				this.editingTarget != evt.target.myparent) {
+			var input = $(this.editingTarget).children("input")[0];
+			var text = $(input).val();
+			$(input).remove();
+
+			var valueData = document.createElement("span");
+			$(valueData).addClass("spanValue");
+			$(valueData).text(text);
+
+			if ($(this.editingTarget).hasClass("name")) {
+				var icon = document.createElement("span");
+				$(icon).addClass("removeIcon");
+				$(this.editingTarget).append(icon);
+			}
 
-		    $(this.editingTarget).removeClass("editing");
-		    $(this.editingTarget).append(valueData);
-		    valueData.myparent=this.editingTarget;
-		    this.editingTarget = null;
-	  	}
+			$(this.editingTarget).removeClass("editing");
+			$(this.editingTarget).append(valueData);
+			valueData.myparent=this.editingTarget;
+			this.editingTarget = null;
+		}
 	}
 });
 
 $(function() {
-
-
-	jobEditView = new azkaban.JobEditView({el:$('#job-edit-pane')});
-	
-	 
-	
+	jobEditView = new azkaban.JobEditView({
+		el: $('#job-edit-pane')
+	});
 });

diff --git a/src/web/js/azkaban.jobhistory.view.js b/src/web/js/azkaban.jobhistory.view.js
index 29f0d12..9607258 100644
--- a/src/web/js/azkaban.jobhistory.view.js
+++ b/src/web/js/azkaban.jobhistory.view.js
@@ -20,15 +20,22 @@ var jobHistoryView;
 azkaban.JobHistoryView = Backbone.View.extend({
 	events: {
 	},
+	
 	initialize: function(settings) {
 		this.render();
 	},
-	render : function(self) {
+	
+	render: function(self) {
 		var data = this.model.get("data");
 	
-		var margin = {top: 20, right: 20, bottom: 30, left: 70},
-	    width = $(this.el).width() - margin.left - margin.right,
-	    height = 300 - margin.top - margin.bottom;
+		var margin = {
+			top: 20, 
+			right: 20, 
+			bottom: 30, 
+			left: 70
+		};
+	  var width = $(this.el).width() - margin.left - margin.right;
+	  var height = 300 - margin.top - margin.bottom;
 	    
 		var x = d3.time.scale()
 		    .range([0, width]);
@@ -36,9 +43,9 @@ azkaban.JobHistoryView = Backbone.View.extend({
 		var y = d3.scale.linear()
 		    .range([height, 0]);
 	    
-	    var xAxis = d3.svg.axis()
-		    .scale(x)
-		    .orient("bottom");
+		var xAxis = d3.svg.axis()
+				.scale(x)
+				.orient("bottom");
 
 		var yAxis = d3.svg.axis()
 		    .scale(y)
@@ -59,49 +66,56 @@ azkaban.JobHistoryView = Backbone.View.extend({
 		    .append("g")
 		    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
 		  
-		  var xextent = d3.extent(data, function(d) { return d.startTime; });
-		  var diff = (xextent[1] - xextent[0])*0.05;
-		  
-		  xextent[0] -= diff;
-		  xextent[1] += diff;
-		  x.domain(xextent);
-		  
-		  var yextent = d3.extent(data, function(d) { return d.endTime - d.startTime; });
-		  var upperYbound = yextent[1]*1.25;
-		  y.domain([0, upperYbound]);
+		var xextent = d3.extent(data, function(d) {
+			return d.startTime;
+		});
+		var diff = (xextent[1] - xextent[0])*0.05;
 		
-		  svg.append("g")
-		      .attr("class", "x axis")
-		      .attr("transform", "translate(0," + height + ")")
-		      .call(xAxis);
+		xextent[0] -= diff;
+		xextent[1] += diff;
+		x.domain(xextent);
 		
-		  svg.append("g")
-		      .attr("class", "y axis")
-		      .call(yAxis)
-		      .append("text")
-		      .attr("transform", "rotate(-90)")
-		      .attr("y", 6)
-		      .attr("dy", ".71em")
-		      .style("text-anchor", "end")
-		      .text("Duration");
+		var yextent = d3.extent(data, function(d) {
+			return d.endTime - d.startTime;
+		});
+		var upperYbound = yextent[1]*1.25;
+		y.domain([0, upperYbound]);
+	
+		svg.append("g")
+				.attr("class", "x axis")
+				.attr("transform", "translate(0," + height + ")")
+				.call(xAxis);
+	
+		svg.append("g")
+				.attr("class", "y axis")
+				.call(yAxis)
+				.append("text")
+				.attr("transform", "rotate(-90)")
+				.attr("y", 6)
+				.attr("dy", ".71em")
+				.style("text-anchor", "end")
+				.text("Duration");
+	
+		svg.append("path")
+				.datum(data)
+				.attr("class", "line")
+				.attr("d", line);
+				
+		var node = svg.selectAll("g.node")
+				.data(data)
+				.attr("class", "node")
+				.enter().append("g")
+				.attr("transform",  function(d) {
+			return "translate(" + x(d.startTime) + "," + y(d.endTime-d.startTime) + ")";
+		});
 		
-		  svg.append("path")
-		      .datum(data)
-		      .attr("class", "line")
-		      .attr("d", line);
-		      
-		  var node = svg.selectAll("g.node")
-		  				.data(data)
-		  				.attr("class", "node")
-		  				.enter().append("g")
-		  				.attr("transform",  function(d) { return "translate(" + x(d.startTime) + "," + y(d.endTime-d.startTime) + ")";});
-
-		  
-		  node.append("circle")
-		  	  .attr("r", 5)
-		  	  .attr("class", function(d) {return d.status;})
-		  	  .append("svg:title")
-		  		.text(function(d) { return d.execId + ":" + d.flowId + " ran in " + getDuration(d.startTime, d.endTime)});
+		node.append("circle")
+				.attr("r", 5)
+				.attr("class", function(d) {return d.status;})
+				.append("svg:title")
+				.text(function(d) {
+			return d.execId + ":" + d.flowId + " ran in " + getDuration(d.startTime, d.endTime);
+		});
 	}
 });
 
@@ -112,6 +126,11 @@ $(function() {
 	var selected;
 	var series = dataSeries;
 	dataModel = new azkaban.DataModel();
-	dataModel.set({"data":series});
-	jobDurationView = new azkaban.JobHistoryView({el:$('#timeGraph'), model: dataModel});
+	dataModel.set({
+		"data": series
+	});
+	jobDurationView = new azkaban.JobHistoryView({
+		el: $('#timeGraph'), 
+		model: dataModel
+	});
 });

diff --git a/src/web/js/azkaban.layout.js b/src/web/js/azkaban.layout.js
index 6938572..6f6c2c5 100644
--- a/src/web/js/azkaban.layout.js
+++ b/src/web/js/azkaban.layout.js
@@ -41,9 +41,16 @@ function layoutGraph(nodes, edges) {
 		//}
 		
 		var width = nodes[i].label.length * 10;
-		var node = { id: nodes[i].id, node: nodes[i], level: nodes[i].level, in:[], out:[], width: width, x:0 };
+		var node = {
+			id: nodes[i].id, 
+			node: nodes[i], 
+			level: nodes[i].level, 
+			in: [], 
+			out: [], 
+			width: width, 
+			x: 0 
+		};
 		nodeMap[nodes[i].id] = node;
-
 		maxLayer = Math.max(node.level, maxLayer);
 		if(!layers[node.level]) {
 			layers[node.level] = [];
@@ -70,7 +77,15 @@ function layoutGraph(nodes, edges) {
 		var guides = [];
 		
 		for (var j = srcNode.level + 1; j < destNode.level; ++j) {
-			var dummyNode = {level: j, in: [], x: lastNode.x, out: [], realSrc: srcNode, realDest: destNode, width: 10};
+			var dummyNode = {
+				level: j, 
+				in: [], 
+				x: lastNode.x, 
+				out: [], 
+				realSrc: srcNode, 
+				realDest: destNode, 
+				width: 10
+			};
 			layers[j].push(dummyNode);
 			dummyNode.in.push(lastNode);
 			lastNode.out.push(dummyNode);
@@ -114,7 +129,6 @@ function layoutGraph(nodes, edges) {
 		sort(layers[i]);
 		spreadLayerSmart(layers[i]);
 	}
-	
 
 	// Space it vertically
 	spaceVertically(layers, maxLayer);
@@ -134,7 +148,6 @@ function layoutGraph(nodes, edges) {
 		var dest = edges[i].target;
 		
 		var edgeId = src + ">>" + dest;
-
 		if (edgeDummies[edgeId] && edgeDummies[edgeId].length > 0) {
 			var prevX = nodeMap[src].x;
 			var destX = nodeMap[dest].x; 
@@ -146,7 +159,6 @@ function layoutGraph(nodes, edges) {
 				guides.push(point);
 				
 				var nextX = j == dummies.length - 1 ? destX: dummies[j + 1].x; 
-
 				if (point.x != prevX && point.x != nextX) {
 					// Add gap
 					if ((point.x > prevX) == (point.x > nextX)) {
@@ -166,7 +178,13 @@ function layoutGraph(nodes, edges) {
 
 function spreadLayerSmart(layer) {
 	var ranges = [];
-	ranges.push({start: 0, end:0, width: layer[0].width, x: layer[0].x, index: 0});
+	ranges.push({
+		start: 0, 
+		end: 0, 
+		width: layer[0].width, 
+		x: layer[0].x, 
+		index: 0
+	});
 	var largestRangeIndex = -1;
 	
 	var totalX = layer[0].x;
@@ -180,11 +198,17 @@ function spreadLayerSmart(layer) {
 		if (delta == 0) {
 			prevRange.end = i;
 			prevRange.width += layer[i].width;
-			totalWidth+=layer[i].width;
+			totalWidth += layer[i].width;
 		}
 		else {
-			totalWidth+=Math.max(layer[i].width, delta);
-			ranges.push({start: i, end: i, width: layer[i].width, x: layer[i].x, index: ranges.length});
+			totalWidth += Math.max(layer[i].width, delta);
+			ranges.push({
+				start: i, 
+				end: i, 
+				width: layer[i].width, 
+				x: layer[i].x, 
+				index: ranges.length
+			});
 		}
 		
 		totalX += layer[i].x;
@@ -220,34 +244,31 @@ function spreadLayerSmart(layer) {
 		endIndex = e + 1;
 	}
 	
-	for (var i=startIndex; i >= 0; --i) {
+	for (var i = startIndex; i >= 0; --i) {
 		var range = ranges[i];
 		var crossPointS = range.x + range.width/2;
 		var crossPointE = ranges[i + 1].x - ranges[i + 1].width/2;
-		
 		if (crossPointE < crossPointS) {
 			range.x -= crossPointS - crossPointE;
 		}
 	}
 	
-	for (var i=endIndex; i < ranges.length; ++i) {
+	for (var i = endIndex; i < ranges.length; ++i) {
 		var range = ranges[i];
 		var crossPointE = range.x - range.width/2;
 		var crossPointS = ranges[i - 1].x + ranges[i - 1].width/2;
-		
 		if (crossPointE < crossPointS) {
 			range.x += crossPointS - crossPointE;
 		}
 	}
 	
-	for (var i=0; i < ranges.length; ++i) {
+	for (var i = 0; i < ranges.length; ++i) {
 		var range = ranges[i];
 		if (range.start == range.end) {
 			layer[range.start].x = range.x;
 		}
 		else {
 			var start = range.x - range.width/2;
-			
 			for (var j=range.start;j <=range.end; ++j) {
 				layer[j].x = start + layer[j].width/2;
 				start += layer[j].width;
@@ -256,23 +277,21 @@ function spreadLayerSmart(layer) {
 	}
 }
 
-
 function spaceVertically(layers, maxLayer) {
 	var startY = 0;
 	var startLayer = layers[0];
-	for (var i=0; i < startLayer.length; ++i) {
+	for (var i = 0; i < startLayer.length; ++i) {
 		startLayer[i].y = startY;
 	}
 	
 	var minHeight = 50;
-	for (var a=1; a <= maxLayer; ++a) {
+	for (var a = 1; a <= maxLayer; ++a) {
 		var maxDelta = 0;
 		var layer = layers[a];
-		for (var i=0; i < layer.length; ++i) {
-			for (var j=0; j < layer[i].in.length; ++j) {
+		for (var i = 0; i < layer.length; ++i) {
+			for (var j = 0; j < layer[i].in.length; ++j) {
 				var upper = layer[i].in[j];
 				var delta = Math.abs(upper.x - layer[i].x);
-				
 				maxDelta = Math.max(maxDelta, delta);
 			}
 		}
@@ -282,11 +301,10 @@ function spaceVertically(layers, maxLayer) {
 		
 		calcHeight = Math.min(calcHeight, maxHeight); 
 		startY += Math.max(calcHeight, minHeight);
-		for (var i=0; i < layer.length; ++i) {
-			layer[i].y=startY;
+		for (var i = 0; i < layer.length; ++i) {
+			layer[i].y = startY;
 		}
 	}
-
 }
 
 function uncrossWithIn(layer) {
@@ -301,7 +319,6 @@ function findAverage(nodes) {
 	for (var i = 0; i < nodes.length; ++i) {
 		sum += nodes[i].x;
 	}
-	
 	return sum/nodes.length;
 }
 

diff --git a/src/web/js/azkaban.login.js b/src/web/js/azkaban.login.js
index 423c5cf..1ac077f 100644
--- a/src/web/js/azkaban.login.js
+++ b/src/web/js/azkaban.login.js
@@ -17,45 +17,53 @@
 $.namespace('azkaban');
 
 var loginView;
-azkaban.LoginView= Backbone.View.extend({
-  events : {
-    "click #loginSubmit": "handleLogin",
-    'keypress input': 'handleKeyPress'
-  },
-  initialize : function(settings) {
-	 $('#errorMsg').hide();
-  },
-  handleLogin : function(evt) {
-	 console.log("Logging in.");
-	 var username = $("#username").val();
-	 var password = $("#password").val();
+azkaban.LoginView = Backbone.View.extend({
+	events: {
+		"click #login-submit": "handleLogin",
+		'keypress input': 'handleKeyPress'
+	},
+
+	initialize: function(settings) {
+		$('#error-msg').hide();
+	},
+	
+	handleLogin: function(evt) {
+		console.log("Logging in.");
+		var username = $("#username").val();
+		var password = $("#password").val();
 	 
-     $.ajax({
-     	async: "false",
-     	url: contextURL,
-     	dataType: "json",
-     	type: "POST",
-     	data: {action:"login", username:username, password:password},
-     	success: function(data) {
-     		if (data.error) {
-     			$('#errorMsg').text(data.error);
-     			$('#errorMsg').slideDown('fast');
-     		}
-     		else {
-     			document.location.reload();
-     		}
-     	}
-     });
-  },
-  handleKeyPress : function(evt) {
-	  if (evt.charCode == 13 || evt.keyCode == 13) {
-	  	this.handleLogin();
-  	  }
-  },
-  render: function() {
-  }
+		$.ajax({
+			async: "false",
+			url: contextURL,
+			dataType: "json",
+			type: "POST",
+			data: {
+				action: "login", 
+				username: username, 
+				password: password
+			},
+			success: function(data) {
+				if (data.error) {
+					$('#error-msg').text(data.error);
+					$('#error-msg').slideDown('fast');
+				}
+				else {
+					document.location.reload();
+				}
+			}
+		});
+	},
+	
+	handleKeyPress: function(evt) {
+		if (evt.charCode == 13 || evt.keyCode == 13) {
+			this.handleLogin();
+		}
+	},
+	
+	render: function() {
+	}
 });
 
 $(function() {
-	loginView = new azkaban.LoginView({el:$('#loginForm')});
+	loginView = new azkaban.LoginView({el: $('#login-form')});
 });

diff --git a/src/web/js/azkaban.main.view.js b/src/web/js/azkaban.main.view.js
index 161c6ab..e0d10c6 100644
--- a/src/web/js/azkaban.main.view.js
+++ b/src/web/js/azkaban.main.view.js
@@ -17,189 +17,190 @@
 $.namespace('azkaban');
 
 var projectTableView;
-azkaban.ProjectTableView= Backbone.View.extend({
-  events : {
-    "click .project-expand": "expandProject"
-  },
-  initialize : function(settings) {
-
-  },
-  expandProject : function(evt) {
-    if (evt.target.tagName!="SPAN") {
-    	return;
-    }
-    
-    var target = evt.currentTarget;
-    var targetId = target.id;
-    var requestURL = contextURL + "/manager";
-    
-    var targetExpanded = $('#' + targetId + '-child');
-    var targetTBody = $('#' + targetId + '-tbody');
-    
-    var createFlowListFunction = this.createFlowListTable;
-    
-    if (target.loading) {
-    	console.log("Still loading.");
-    }
-    else if (target.loaded) {
-    	if($(targetExpanded).is(':visible')) {
-    		$(target).addClass('expand').removeClass('collapse');
-    		$(targetExpanded).fadeOut("fast");
-    	}
-    	else {
-    	    $(target).addClass('collapse').removeClass('expand');
-    		$(targetExpanded).fadeIn();
-    	}
-    }
-    else {
-	    // projectId is available
-	    $(target).addClass('wait').removeClass('collapse').removeClass('expand');
-	    target.loading = true;
-	    
-	    $.get(
-	      requestURL,
-	      {"project": targetId, "ajax":"fetchprojectflows"},
-	      function(data) {
-	        console.log("Success");
-	        target.loaded = true;
-	        target.loading = false;
-	        
-	        createFlowListFunction(data, targetTBody);
-	        
-			$(target).addClass('collapse').removeClass('wait');
-	    	$(targetExpanded).fadeIn("fast");
-	      },
-	      "json"
-	    );
-    }
-  },
-  render: function() {
-  },
-  createFlowListTable : function(data, innerTable) {
-  	var flows = data.flows;
-  	flows.sort(function(a,b){return a.flowId.localeCompare(b.flowId);});
-  	
-  	var requestURL = contextURL + "/manager?project=" + data.project + "&flow=";
-  	for (var i = 0; i < flows.length; ++i) {
-  		var id = flows[i].flowId;
-  		
-  		var tr = document.createElement("tr");
-		var idtd = document.createElement("td");
-		$(idtd).addClass("tb-name");
-  		
-  		var ida = document.createElement("a");
-		ida.project = data.project;
-		$(ida).text(id);
-		$(ida).attr("href", requestURL + id);
+azkaban.ProjectTableView = Backbone.View.extend({
+	events: {
+		"click .project-expand": "expandProject"
+	},
+	
+	initialize: function(settings) {
+	},
+	
+	expandProject: function(evt) {
+		if (evt.target.tagName != "SPAN") {
+			return;
+		}
+		
+		var target = evt.currentTarget;
+		var targetId = target.id;
+		var requestURL = contextURL + "/manager";
+		
+		var targetExpanded = $('#' + targetId + '-child');
+		var targetTBody = $('#' + targetId + '-tbody');
+		var createFlowListFunction = this.createFlowListTable;
 		
-		$(idtd).append(ida);
-		$(tr).append(idtd);
-		$(innerTable).append(tr);
-  	}
-  }
+		if (target.loading) {
+			console.log("Still loading.");
+		}
+		else if (target.loaded) {
+			if ($(targetExpanded).is(':visible')) {
+				$(target).addClass('expanded').removeClass('collapsed');
+				$(targetExpanded).fadeOut("fast");
+			}
+			else {
+				$(target).addClass('collapsed').removeClass('expanded');
+				$(targetExpanded).fadeIn();
+			}
+		}
+		else {
+			// projectId is available
+			$(target).addClass('wait').removeClass('collapsed').removeClass('expanded');
+			target.loading = true;
+
+			var request = {
+				"project": targetId, 
+				"ajax": "fetchprojectflows"
+			};
+
+			var successHandler = function(data) {
+				console.log("Success");
+				target.loaded = true;
+				target.loading = false;
+				
+				createFlowListFunction(data, targetTBody);
+				
+				$(target).addClass('collapsed').removeClass('wait');
+				$(targetExpanded).fadeIn("fast");
+			};
+			
+			$.get(requestURL, request, successHandler, "json");
+		}
+	},
+
+	render: function() {
+	},
+	
+	createFlowListTable: function(data, innerTable) {
+		var flows = data.flows;
+		flows.sort(function(a,b) {
+			return a.flowId.localeCompare(b.flowId);
+		});
+		var requestURL = contextURL + "/manager?project=" + data.project + "&flow=";
+		for (var i = 0; i < flows.length; ++i) {
+			var id = flows[i].flowId;
+			var tr = document.createElement("tr");
+			var idtd = document.createElement("td");
+			$(idtd).addClass("tb-name");
+			
+			var ida = document.createElement("a");
+			ida.project = data.project;
+			$(ida).text(id);
+			$(ida).attr("href", requestURL + id);
+			
+			$(idtd).append(ida);
+			$(tr).append(idtd);
+			$(innerTable).append(tr);
+		}
+	}
 });
 
 var projectHeaderView;
-azkaban.ProjectHeaderView= Backbone.View.extend({
-  events : {
-    "click #create-project-btn":"handleCreateProjectJob"
-  },
-  initialize : function(settings) {
-    if (settings.errorMsg && settings.errorMsg != "null") {
-      // Chrome bug in displaying placeholder text. Need to hide the box.
-      $('#searchtextbox').hide();
-      $('.messaging').addClass("error");
-      $('.messaging').removeClass("success");
-      $('.messaging').html(settings.errorMsg);
-    }
-    else if (settings.successMsg && settings.successMsg != "null") {
-      $('#searchtextbox').hide();
-      $('.messaging').addClass("success");
-      $('.messaging').removeClass("error");
-      $('#message').html(settings.successMsg);
-    }
-    else {
-      $('#searchtextbox').show();
-      $('.messaging').removeClass("success");
-      $('.messaging').removeClass("error");
-    }
-    
-    $('#messageClose').click(function() {
-      $('#searchtextbox').show();
-      
-      $('.messaging').slideUp('fast', function() {
-        $('.messaging').removeClass("success");
-        $('.messaging').removeClass("error");
-      });
-    });
-  },
-  handleCreateProjectJob : function(evt) {
-    console.log("click create project");
-      $('#create-project').modal({
-          closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-          position: ["20%",],
-          containerId: 'confirm-container',
-          containerCss: {
-            'height': '220px',
-            'width': '565px'
-          },
-          onShow: function (dialog) {
-            var modal = this;
-            $("#errorMsg").hide();
-          }
-        });
-  },
-  render: function() {
-  }
+azkaban.ProjectHeaderView = Backbone.View.extend({
+	events: {
+		"click #create-project-btn": "handleCreateProjectJob"
+	},
+
+	initialize: function(settings) {
+		console.log("project header view initialize.");
+		if (settings.errorMsg && settings.errorMsg != "null") {
+			$('#messaging').addClass("alert-danger");
+			$('#messaging').removeClass("alert-success");
+			$('#messaging-message').html(settings.errorMsg);
+		}
+		else if (settings.successMsg && settings.successMsg != "null") {
+			$('#messaging').addClass("alert-success");
+			$('#messaging').removeClass("alert-danger");
+			$('#messaging-message').html(settings.successMsg);
+		}
+		else {
+			$('#messaging').removeClass("alert-success");
+			$('#messaging').removeClass("alert-danger");
+		}
+	},
+
+	handleCreateProjectJob: function(evt) {
+		$('#create-project-modal').modal();
+	},
+	
+	render: function() {
+	}
 });
 
 var createProjectView;
-azkaban.CreateProjectView= Backbone.View.extend({
-  events : {
-    "click #create-btn": "handleCreateProject"
-  },
-  initialize : function(settings) {
-    $("#errorMsg").hide();
-  },
-  handleCreateProject : function(evt) {
-	 // First make sure we can upload
-	 var projectName = $('#path').val();
-	 var description = $('#description').val();
-
-     console.log("Creating");
-     $.ajax({
-     	async: "false",
-     	url: "manager",
-     	dataType: "json",
-     	type: "POST",
-     	data: {action:"create", name:projectName, description:description},
-     	success: function(data) {
-     		if (data.status == "success") {
-     			if (data.action == "redirect") {
-     				window.location = data.path;
-     			}
-     		}
-     		else {
-     			if (data.action == "login") {
- 					window.location = "";
-     			}
-     			else {
-	     			$("#errorMsg").text("ERROR: " + data.message);
-	    			$("#errorMsg").slideDown("fast");
-    			}
-     		}
-     	}
-     });
+azkaban.CreateProjectView = Backbone.View.extend({
+	events: {
+		"click #create-btn": "handleCreateProject"
+	},
+	
+	initialize: function(settings) {
+		$("#modal-error-msg").hide();
+	},
+	
+	handleCreateProject: function(evt) {
+		// First make sure we can upload
+		var projectName = $('#path').val();
+		var description = $('#description').val();
+		console.log("Creating");
+		$.ajax({
+			async: "false",
+			url: "manager",
+			dataType: "json",
+			type: "POST",
+			data: {
+				action: "create", 
+				name: projectName, 
+				description: description
+			},
+			success: function(data) {
+				if (data.status == "success") {
+					if (data.action == "redirect") {
+						window.location = data.path;
+					}
+				}
+				else {
+					if (data.action == "login") {
+						window.location = "";
+					}
+					else {
+						$("#modal-error-msg").text("ERROR: " + data.message);
+						$("#modal-error-msg").slideDown("fast");
+					}
+				}
+			}
+		});
+	},
 
-  },
-  render: function() {
-  }
+	render: function() {
+	}
 });
 
 var tableSorterView;
 $(function() {
-	projectHeaderView = new azkaban.ProjectHeaderView({el:$( '#all-jobs-content'), successMsg: successMessage, errorMsg: errorMessage });
-	projectTableView = new azkaban.ProjectTableView({el:$('#all-jobs')});
-	tableSorterView = new azkaban.TableSorter({el:$('#all-jobs'), initialSort: $('.tb-name')});
-	uploadView = new azkaban.CreateProjectView({el:$('#create-project')});
+	projectHeaderView = new azkaban.ProjectHeaderView({
+		el: $('#create-project'), 
+		successMsg: successMessage, 
+		errorMsg: errorMessage 
+	});
+	
+	projectTableView = new azkaban.ProjectTableView({
+		el: $('#all-jobs')
+	});
+	
+	tableSorterView = new azkaban.TableSorter({
+		el: $('#all-jobs'), 
+		initialSort: $('.tb-name')
+	});
+	
+	uploadView = new azkaban.CreateProjectView({
+		el: $('#create-project-modal')
+	});
 });

diff --git a/src/web/js/azkaban.message.dialog.view.js b/src/web/js/azkaban.message.dialog.view.js
index f58cc4c..cea0852 100644
--- a/src/web/js/azkaban.message.dialog.view.js
+++ b/src/web/js/azkaban.message.dialog.view.js
@@ -17,38 +17,28 @@
 $.namespace('azkaban');
 
 var messageDialogView;
-
 azkaban.MessageDialogView = Backbone.View.extend({
-  events : {
-  },
-  initialize : function(settings) {
+	events: {
+	},
 
-  },
-  show: function(title, message, callback) {
-  	$("#azkabanMessageDialogTitle").text(title);
-  	$("#azkabanMessageDialogText").text(message);
-  	this.callback = callback;
-  	
-      $(this.el).modal({
-          position: ["20%",],
-          closeClass: "continueclass",
-          containerId: 'confirm-container',
-          containerCss: {
-            'height': '220px',
-            'width': '565px'
-          },
-          onShow: function (dialog) {
-          },
-          onClose: function() {
-          	if (callback) {
-          		callback.call();
-          	}
-          }
-     });
-  }
+	initialize: function(settings) {
+	},
+	
+	show: function(title, message, callback) {
+		$("#azkaban-message-dialog-title").text(title);
+		$("#azkaban-message-dialog-text").text(message);
+		this.callback = callback;
+		$(this.el).on('hidden.bs.modal', function() {
+			if (callback) {
+				callback.call();
+			}
+		});
+		$(this.el).modal();
+	}
 });
 
-
 $(function() {
-	messageDialogView = new azkaban.MessageDialogView({el: $('#azkabanMessageDialog')});
+	messageDialogView = new azkaban.MessageDialogView({
+		el: $('#azkaban-message-dialog')
+	});
 });

diff --git a/src/web/js/azkaban.nav.js b/src/web/js/azkaban.nav.js
index 8b6de28..feffedc 100644
--- a/src/web/js/azkaban.nav.js
+++ b/src/web/js/azkaban.nav.js
@@ -18,13 +18,15 @@ $.namespace('azkaban');
 
 var navView;
 azkaban.NavView = Backbone.View.extend({
-	events : {
+	events: {
 		"click #user-id":"handleUserMenu"
 	},
-	initialize : function(settings) {
+	
+	initialize: function(settings) {
 		$("#user-menu").hide();
 	},
-	handleUserMenu : function(evt) {
+	
+	handleUserMenu: function(evt) {
 		if ($("#user-menu").is(":visible")) {
 			$("#user-menu").slideUp('fast');
 		}
@@ -32,21 +34,24 @@ azkaban.NavView = Backbone.View.extend({
 			$("#user-menu").slideDown('fast');
 		}
 	},
+	
 	render: function() {
 	}
 });
 
 $(function() {
-	navView = new azkaban.NavView({el:$( '#header' )});
+	navView = new azkaban.NavView({
+		el: $('#header')
+	});
 });
 
 (function($){
-	$.getQuery = function( query ) {
+	$.getQuery = function(query) {
 		query = query.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
 		var expr = "[\\?&]"+query+"=([^&#]*)";
-		var regex = new RegExp( expr );
-		var results = regex.exec( window.location.href );
-		if( results !== null ) {
+		var regex = new RegExp(expr);
+		var results = regex.exec(window.location.href);
+		if (results !== null) {
 			return results[1];
 			return decodeURIComponent(results[1].replace(/\+/g, " "));
 		} else {

diff --git a/src/web/js/azkaban.permission.view.js b/src/web/js/azkaban.permission.view.js
index 5cfc495..fbd332c 100644
--- a/src/web/js/azkaban.permission.view.js
+++ b/src/web/js/azkaban.permission.view.js
@@ -19,34 +19,40 @@ $.namespace('azkaban');
 var permissionTableView;
 var groupPermissionTableView;
 
-azkaban.PermissionTableView= Backbone.View.extend({
-  events : {
-	"click button": "handleChangePermission"
-  },
-  initialize : function(settings) {
-  	this.group = settings.group;
-  	this.proxy = settings.proxy;
-  },
-  render: function() {
-  },
-  handleChangePermission: function(evt) {
-  	  var currentTarget = evt.currentTarget;
-  	  changePermissionView.display(currentTarget.id, false, this.group, this.proxy);
-  }
+azkaban.PermissionTableView = Backbone.View.extend({
+	events : {
+		"click button": "handleChangePermission"
+	},
+	
+	initialize : function(settings) {
+		this.group = settings.group;
+		this.proxy = settings.proxy;
+	},
+	
+	render: function() {
+	},
+	
+	handleChangePermission: function(evt) {
+		var currentTarget = evt.currentTarget;
+		changePermissionView.display(currentTarget.id, false, this.group, this.proxy);
+	}
 });
 
 var proxyTableView;
 azkaban.ProxyTableView= Backbone.View.extend({
-  events : {
-	"click button": "handleRemoveProxy"
-  },
-  initialize : function(settings) {
-  },
-  render: function() {
-  },
-  handleRemoveProxy: function(evt) {
-	removeProxyView.display($(evt.currentTarget).attr("name"));
-  }
+	events : {
+		"click button": "handleRemoveProxy"
+	},
+	
+	initialize : function(settings) {
+	},
+	
+	render: function() {
+	},
+	
+	handleRemoveProxy: function(evt) {
+		removeProxyView.display($(evt.currentTarget).attr("name"));
+	}
 });
 
 var removeProxyView;
@@ -54,46 +60,36 @@ azkaban.RemoveProxyView = Backbone.View.extend({
 	events: {
 		"click #remove-proxy-btn": "handleRemoveProxy"
 	},
+	
 	initialize : function(settings) {
-		$('#removeProxyErrorMsg').hide();
+		$('#remove-proxy-error-msg').hide();
 	},
+	
 	display: function(proxyName) {
 		this.el.proxyName = proxyName;
 		$("#proxyRemoveMsg").text("Removing proxy user '" + proxyName + "'");
-	  	 $(this.el).modal({
-	          closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-	          position: ["20%",],
-	          containerId: 'confirm-container',
-	          containerCss: {
-	            'height': '220px',
-	            'width': '565px'
-	          },
-	          onShow: function (dialog) {
-	            var modal = this;
-	            $("#removeProxyErrorMsg").hide();
-	          }
-        });
+		$(this.el).modal();
 	},
 	handleRemoveProxy: function() {
-	  	var requestURL = contextURL + "/manager";
+		var requestURL = contextURL + "/manager";
 		var proxyName = this.el.proxyName;
+		var requestData = {
+			"project": projectName, 
+			"name": proxyName, 
+			"ajax": "removeProxyUser"
+		};
+		var successHandler = function(data) {
+			console.log("Output");
+			if (data.error) {
+				$("#removeProxyErrorMsg").text(data.error);
+				$("#removeProxyErrorMsg").show();
+				return;
+			}
+			var replaceURL = requestURL + "?project=" + projectName +"&permissions";
+			window.location.replace(replaceURL);
+		};
 
-	  	$.get(
-	  	      requestURL,
-	  	      {"project": projectName, "name": proxyName, "ajax":"removeProxyUser"},
-	  	      function(data) {
-	  	      	  console.log("Output");
-	  	      	  if (data.error) {
-	  	      	  	$("#removeProxyErrorMsg").text(data.error);
-	  	      	  	$("#removeProxyErrorMsg").show();
-	  	      	  	return;
-	  	      	  }
-	  	      	  
-	  	      	  var replaceURL = requestURL + "?project=" + projectName +"&permissions";
-	  	          window.location.replace(replaceURL);
-	  	      },
-	  	      "json"
-	  	    );
+		$.get(requestURL, requestData, successHandler, "json");
 	}
 });
 
@@ -102,233 +98,241 @@ azkaban.AddProxyView = Backbone.View.extend({
 	events: {
 		"click #add-proxy-btn": "handleAddProxy"
 	},
+	
 	initialize : function(settings) {
-		$('#proxyErrorMsg').hide();
+		$('#add-proxy-error-msg').hide();
 	},
+	
 	display: function() {
-	  	 $(this.el).modal({
-	          closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-	          position: ["20%",],
-	          containerId: 'confirm-container',
-	          containerCss: {
-	            'height': '220px',
-	            'width': '565px'
-	          },
-	          onShow: function (dialog) {
-	            var modal = this;
-	            $("#errorMsg").hide();
-	          }
-        });
+		$(this.el).modal();
 	},
+	
 	handleAddProxy: function() {
-	  	var requestURL = contextURL + "/manager";
-	  	var name = $('#proxy-user-box').val();
-		
-	  	$.get(
-	  	      requestURL,
-	  	      {"project": projectName, "name": name, "ajax":"addProxyUser"},
-	  	      function(data) {
-	  	      	  console.log("Output");
-	  	      	  if (data.error) {
-	  	      	  	$("#proxyErrorMsg").text(data.error);
-	  	      	  	$("#proxyErrorMsg").show();
-	  	      	  	return;
-	  	      	  }
-	  	      	  
-	  	      	  var replaceURL = requestURL + "?project=" + projectName +"&permissions";
-	  	          window.location.replace(replaceURL);
-	  	      },
-	  	      "json"
-	  	    );
+		var requestURL = contextURL + "/manager";
+		var name = $('#proxy-user-box').val();
+		var requestData = {
+			"project": projectName, 
+			"name": name, 
+			"ajax":"addProxyUser"
+		};
+	
+		var successHandler = function(data) {
+			console.log("Output");
+			if (data.error) {
+				$("#proxyErrorMsg").text(data.error);
+				$("#proxyErrorMsg").show();
+				return;
+			}
+			
+			var replaceURL = requestURL + "?project=" + projectName +"&permissions";
+			window.location.replace(replaceURL);
+		};
+		$.get(requestURL, requestData, successHandler, "json");
 	}
 });
 
 var changePermissionView;
 azkaban.ChangePermissionView= Backbone.View.extend({
-  events : {
-  	"click input[type=checkbox]": "handleCheckboxClick",
-  	"click #change-btn": "handleChangePermissions"
-  },
-  initialize : function(settings) {
-  	$('#errorMsg').hide();
-  },
-  display: function(userid, newPerm, group, proxy) {
-  	// 6 is the length of the prefix "group-"
-  	this.userid = group ? userid.substring(6, userid.length) : userid;
-  	if(group == true) {
-  		this.userid = userid.substring(6, userid.length)
-  	} else if (proxy == true) {
-  		this.userid = userid.substring(6, userid.length)
-  	} else {
-  		this.userid = userid
-  	}
-  	
-  	this.permission = {};
-	$('#user-box').val(this.userid);
-	this.newPerm = newPerm;
-	this.group = group;
+	events: {
+		"click input[type=checkbox]": "handleCheckboxClick",
+		"click #change-btn": "handleChangePermissions"
+	},
 	
-	var prefix = userid;
-	var adminInput = $("#" + prefix + "-admin-checkbox");
-	var readInput = $("#" + prefix + "-read-checkbox");
-	var writeInput = $("#" + prefix + "-write-checkbox");
-	var executeInput = $("#" + prefix + "-execute-checkbox");
-	var scheduleInput = $("#" + prefix + "-schedule-checkbox");
+	initialize: function(settings) {
+		$('#change-permission-error-msg').hide();
+	},
 	
-	if (newPerm) {
-		if (group) {
-			$('#change-title').text("Add New Group Permissions");
-		}
-		else if(proxy){
-			$('#change-title').text("Add New Proxy User Permissions");
+	display: function(userid, newPerm, group, proxy) {
+		// 6 is the length of the prefix "group-"
+		this.userid = group ? userid.substring(6, userid.length) : userid;
+		if(group == true) {
+			this.userid = userid.substring(6, userid.length)
+		} else if (proxy == true) {
+			this.userid = userid.substring(6, userid.length)
+		} else {
+			this.userid = userid
 		}
-		else{
-			$('#change-title').text("Add New User Permissions");
-		}
-		$('#user-box').attr("disabled", null);
 		
-		// default
-		this.permission.admin = false;
-		this.permission.read = true;
-		this.permission.write = false;
-		this.permission.execute = false;
-		this.permission.schedule = false;
-	}
-	else {
-		if (group) {
-			$('#change-title').text("Change Group Permissions");
+		this.permission = {};
+		$('#user-box').val(this.userid);
+		this.newPerm = newPerm;
+		this.group = group;
+		
+		var prefix = userid;
+		var adminInput = $("#" + prefix + "-admin-checkbox");
+		var readInput = $("#" + prefix + "-read-checkbox");
+		var writeInput = $("#" + prefix + "-write-checkbox");
+		var executeInput = $("#" + prefix + "-execute-checkbox");
+		var scheduleInput = $("#" + prefix + "-schedule-checkbox");
+		
+		if (newPerm) {
+			if (group) {
+				$('#change-title').text("Add New Group Permissions");
+			}
+			else if(proxy){
+				$('#change-title').text("Add New Proxy User Permissions");
+			}
+			else{
+				$('#change-title').text("Add New User Permissions");
+			}
+			$('#user-box').attr("disabled", null);
+			
+			// default
+			this.permission.admin = false;
+			this.permission.read = true;
+			this.permission.write = false;
+			this.permission.execute = false;
+			this.permission.schedule = false;
 		}
 		else {
-			$('#change-title').text("Change User Permissions");
+			if (group) {
+				$('#change-title').text("Change Group Permissions");
+			}
+			else {
+				$('#change-title').text("Change User Permissions");
+			}
+			
+			$('#user-box').attr("disabled", "disabled");
+			
+			this.permission.admin = $(adminInput).is(":checked");
+			this.permission.read = $(readInput).is(":checked");
+			this.permission.write = $(writeInput).is(":checked");
+			this.permission.execute = $(executeInput).is(":checked");
+			this.permission.schedule = $(scheduleInput).is(":checked");
 		}
 		
-		$('#user-box').attr("disabled", "disabled");
+		this.changeCheckbox();
 		
-		this.permission.admin = $(adminInput).is(":checked");
-		this.permission.read = $(readInput).is(":checked");
-		this.permission.write = $(writeInput).is(":checked");
-		this.permission.execute = $(executeInput).is(":checked");
-		this.permission.schedule = $(scheduleInput).is(":checked");
-	}
+		changePermissionView.render();
+		$('#change-permission').modal();
+	},
 	
-	this.changeCheckbox();
+	render: function() {
+	},
 	
-	changePermissionView.render();
-  	 $('#change-permission').modal({
-          closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-          position: ["20%",],
-          containerId: 'confirm-container',
-          containerCss: {
-            'height': '220px',
-            'width': '565px'
-          },
-          onShow: function (dialog) {
-            var modal = this;
-            $("#errorMsg").hide();
-          }
-        });
-  },
-  render: function() {
-  },
-  handleCheckboxClick : function(evt) {
-  	console.log("click");
-  	var targetName = evt.currentTarget.name;
-  	if(targetName == "proxy") {
-  		this.doProxy = evt.currentTarget.checked;
-  	}
-  	else {
-  		this.permission[targetName] = evt.currentTarget.checked;
-  	}
-  	this.changeCheckbox(evt);
-  },
-  changeCheckbox : function(evt) {
-    var perm = this.permission;
+	handleCheckboxClick: function(evt) {
+		console.log("click");
+		var targetName = evt.currentTarget.name;
+		if(targetName == "proxy") {
+			this.doProxy = evt.currentTarget.checked;
+		}
+		else {
+			this.permission[targetName] = evt.currentTarget.checked;
+		}
+		this.changeCheckbox(evt);
+	},
+	
+	changeCheckbox: function(evt) {
+		var perm = this.permission;
 
-  	if (perm.admin) {
-  		$("#admin-change").attr("checked", true);
-  		$("#read-change").attr("checked", true);
-  		$("#read-change").attr("disabled", "disabled");
-  		
-  		$("#write-change").attr("checked", true);
-  		$("#write-change").attr("disabled", "disabled");
+		if (perm.admin) {
+			$("#admin-change").attr("checked", true);
+			$("#read-change").attr("checked", true);
+			$("#read-change").attr("disabled", "disabled");
+			
+			$("#write-change").attr("checked", true);
+			$("#write-change").attr("disabled", "disabled");
 
-  		$("#execute-change").attr("checked", true);
-  		$("#execute-change").attr("disabled", "disabled"); 
-  		
-  		$("#schedule-change").attr("checked", true);
-  		$("#schedule-change").attr("disabled", "disabled");
-  	}
-  	else {
-  		$("#admin-change").attr("checked", false);
-  		
-  		$("#read-change").attr("checked", perm.read);
-  		$("#read-change").attr("disabled", null);
-  		  		
-  		$("#write-change").attr("checked", perm.write);
-  		$("#write-change").attr("disabled", null);
-  		
-  		$("#execute-change").attr("checked", perm.execute);
-  		$("#execute-change").attr("disabled", null);
-  		
-  		$("#schedule-change").attr("checked", perm.schedule);
+			$("#execute-change").attr("checked", true);
+			$("#execute-change").attr("disabled", "disabled"); 
+			
+			$("#schedule-change").attr("checked", true);
+			$("#schedule-change").attr("disabled", "disabled");
+		}
+		else {
+			$("#admin-change").attr("checked", false);
+			
+			$("#read-change").attr("checked", perm.read);
+			$("#read-change").attr("disabled", null);
+						
+			$("#write-change").attr("checked", perm.write);
+			$("#write-change").attr("disabled", null);
+			
+			$("#execute-change").attr("checked", perm.execute);
+			$("#execute-change").attr("disabled", null);
+			
+			$("#schedule-change").attr("checked", perm.schedule);
 		$("#schedule-change").attr("disabled", null);
-  	}
-  	
-  	$("#change-btn").removeClass("btn-disabled");
-  	$("#change-btn").attr("disabled", null);
-  	
-  	if (perm.admin || perm.read || perm.write || perm.execute || perm.schedule) {
-  		$("#change-btn").text("Commit");
-  	}
-  	else {
-  		if(	this.newPerm) {
-  			$("#change-btn").disabled = true;
-  			$("#change-btn").addClass("btn-disabled");
-  		}
-  		else {
-  			$("#change-btn").text("Remove");
-  		}
-  	}
-  },
-  handleChangePermissions : function(evt) {
-  	var requestURL = contextURL + "/manager";
-  	var name = $('#user-box').val();
-	var command = this.newPerm ? "addPermission" : "changePermission";
-	var group = this.group;
-	
-	var permission = {};
-	permission.admin = $("#admin-change").is(":checked");
-	permission.read = $("#read-change").is(":checked");
-	permission.write = $("#write-change").is(":checked");
-	permission.execute = $("#execute-change").is(":checked");
-	permission.schedule = $("#schedule-change").is(":checked");
+		}
+		
+		$("#change-btn").removeClass("btn-disabled");
+		$("#change-btn").attr("disabled", null);
+		
+		if (perm.admin || perm.read || perm.write || perm.execute || perm.schedule) {
+			$("#change-btn").text("Commit");
+		}
+		else {
+			if(	this.newPerm) {
+				$("#change-btn").disabled = true;
+				$("#change-btn").addClass("btn-disabled");
+			}
+			else {
+				$("#change-btn").text("Remove");
+			}
+		}
+	},
 	
-  	$.get(
-	      requestURL,
-	      {"project": projectName, "name": name, "ajax":command, "permissions": this.permission, "group": group},
-	      function(data) {
-	      	  console.log("Output");
-	      	  if (data.error) {
-	      	  	$("#errorMsg").text(data.error);
-	      	  	$("#errorMsg").show();
-	      	  	return;
-	      	  }
-	      	  
-	      	  var replaceURL = requestURL + "?project=" + projectName +"&permissions";
-	          window.location.replace(replaceURL);
-	      },
-	      "json"
-	    );
-  }
+	handleChangePermissions : function(evt) {
+		var requestURL = contextURL + "/manager";
+		var name = $('#user-box').val();
+		var command = this.newPerm ? "addPermission" : "changePermission";
+		var group = this.group;
+		
+		var permission = {};
+		permission.admin = $("#admin-change").is(":checked");
+		permission.read = $("#read-change").is(":checked");
+		permission.write = $("#write-change").is(":checked");
+		permission.execute = $("#execute-change").is(":checked");
+		permission.schedule = $("#schedule-change").is(":checked");
+
+		var requestData = {
+			"project": projectName, 
+			"name": name, 
+			"ajax": command, 
+			"permissions": this.permission, 
+			"group": group
+		};
+		var successHandler = function(data) {
+			console.log("Output");
+			if (data.error) {
+				$("#errorMsg").text(data.error);
+				$("#errorMsg").show();
+				return;
+			}
+			
+			var replaceURL = requestURL + "?project=" + projectName +"&permissions";
+			window.location.replace(replaceURL);
+		};
+
+		$.get(requestURL, requestData, successHandler, "json");
+	}
 });
 
 $(function() {
-	permissionTableView = new azkaban.PermissionTableView({el:$('#permissions-table'), group: false, proxy: false});
-	groupPermissionTableView = new azkaban.PermissionTableView({el:$('#group-permissions-table'), group: true, proxy: false});
-	proxyTableView = new azkaban.ProxyTableView({el:$('#proxy-user-table'), group: false, proxy: true});
-	changePermissionView = new azkaban.ChangePermissionView({el:$('#change-permission')});
-	addProxyView = new azkaban.AddProxyView({el:$('#add-proxy')});
-	removeProxyView = new azkaban.RemoveProxyView({el:$('#remove-proxy')});
+	permissionTableView = new azkaban.PermissionTableView({
+		el: $('#permissions-table'), 
+		group: false, 
+		proxy: false
+	});
+	groupPermissionTableView = new azkaban.PermissionTableView({
+		el: $('#group-permissions-table'), 
+		group: true, 
+		proxy: false
+	});
+	proxyTableView = new azkaban.ProxyTableView({
+		el: $('#proxy-user-table'), 
+		group: false, 
+		proxy: true
+	});
+	changePermissionView = new azkaban.ChangePermissionView({
+		el: $('#change-permission')
+	});
+	addProxyView = new azkaban.AddProxyView({
+		el: $('#add-proxy')
+	});
+	removeProxyView = new azkaban.RemoveProxyView({
+		el: $('#remove-proxy')
+	});
 	$('#addUser').bind('click', function() {
 		changePermissionView.display("", true, false, false);
 	});
@@ -340,5 +344,4 @@ $(function() {
 	$('#addProxyUser').bind('click', function() {
 		addProxyView.display();
 	});
-	
 });

diff --git a/src/web/js/azkaban.project.view.js b/src/web/js/azkaban.project.view.js
index 0671ede..0ccd2d5 100644
--- a/src/web/js/azkaban.project.view.js
+++ b/src/web/js/azkaban.project.view.js
@@ -17,348 +17,342 @@
 $.namespace('azkaban');
 
 var projectView;
-azkaban.ProjectView= Backbone.View.extend({
-  events : {
-      "click #project-upload-btn":"handleUploadProjectJob",
-      "click #project-delete-btn": "handleDeleteProject"
-  },
-  initialize : function(settings) {
-  },
-  handleUploadProjectJob : function(evt) {
-      console.log("click upload project");
-      $('#upload-project').modal({
-          closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-          position: ["20%",],
-          containerId: 'confirm-container',
-          containerCss: {
-            'height': '220px',
-            'width': '565px'
-          },
-          onShow: function (dialog) {
-            var modal = this;
-            $("#errorMsg").hide();
-          }
-        });
-  },
-  handleDeleteProject : function(evt) {
-	$('#delete-project').modal({
-        closeHTML: "<a href='#' title='Close' class='modal-close'>x</a>",
-        position: ["20%",],
-        containerId: 'confirm-container',
-        containerCss: {
-          'height': '240px',
-          'width': '640px'
-        },
-        onShow: function (dialog) {
-          var modal = this;
-          $("#errorMsg").hide();
-        }
-    });
-  },
-  render: function() {
-  }
+azkaban.ProjectView = Backbone.View.extend({
+	events: {
+		"click #project-upload-btn": "handleUploadProjectJob",
+		"click #project-delete-btn": "handleDeleteProject"
+	},
+
+	initialize: function(settings) {
+	},
+
+	handleUploadProjectJob: function(evt) {
+		console.log("click upload project");
+		$('#upload-project-modal').modal();
+	},
+
+	handleDeleteProject: function(evt) {
+		console.log("click delete project");
+		$('#delete-project-modal').modal();
+	},
+	
+	render: function() {
+	}
 });
 
 var uploadProjectView;
-azkaban.UploadProjectView= Backbone.View.extend({
-  events : {
-    "click #upload-btn": "handleCreateProject"
-  },
-  initialize : function(settings) {
-    $("#errorMsg").hide();
-  },
-  handleCreateProject : function(evt) {
-    $("#upload-form").submit();
-  },
-  render: function() {
-  }
+azkaban.UploadProjectView = Backbone.View.extend({
+	events: {
+		"click #upload-project-btn": "handleCreateProject"
+	},
+
+	initialize: function(settings) {
+		console.log("Hide upload project modal error msg");
+		$("#upload-project-modal-error-msg").hide();
+	},
+	
+	handleCreateProject: function(evt) {
+		console.log("Upload project button.");
+		$("#upload-project-form").submit();
+	},
+	
+	render: function() {
+	}
 });
 
 var deleteProjectView;
-azkaban.DeleteProjectView= Backbone.View.extend({
-  events : {
-    "click #delete-btn": "handleDeleteProject"
-  },
-  initialize : function(settings) {
-  },
-  handleDeleteProject : function(evt) {
-  	$("#delete-form").submit();
-  },
-  render: function() {
-  }
+azkaban.DeleteProjectView = Backbone.View.extend({
+	events: {
+		"click #delete-btn": "handleDeleteProject"
+	},
+	
+	initialize: function(settings) {
+	},
+	
+	handleDeleteProject: function(evt) {
+		$("#delete-form").submit();
+	},
+
+	render: function() {
+	}
 });
 
 var flowTableView;
-azkaban.FlowTableView= Backbone.View.extend({
-  events : {
-    "click .jobfolder": "expandFlowProject",
-    "mouseover .expandedFlow a": "highlight",
-    "mouseout .expandedFlow a": "unhighlight",
-    "click .runJob": "runJob",
-    "click .runWithDep": "runWithDep",
-    "click .executeFlow": "executeFlow",
-    "click .viewFlow": "viewFlow",
-    "click .viewJob": "viewJob"
-  },
-  initialize : function(settings) {
-  },
-  expandFlowProject : function(evt) {
-    if (evt.target.tagName!="SPAN") {
-    	return;
-    }
-    
-    var target = evt.currentTarget;
-    var targetId = target.id;
-    var requestURL = contextURL + "/manager";
+azkaban.FlowTableView = Backbone.View.extend({
+	events : {
+		"click .flow-expander": "expandFlowProject",
+		"mouseover .expandedFlow a": "highlight",
+		"mouseout .expandedFlow a": "unhighlight",
+		"click .runJob": "runJob",
+		"click .runWithDep": "runWithDep",
+		"click .execute-flow": "executeFlow",
+		"click .viewFlow": "viewFlow",
+		"click .viewJob": "viewJob"
+	},
 
-    var targetExpanded = $('#' + targetId + '-child');
-    var targetTBody = $('#' + targetId + '-tbody');
-    
-    var createJobListFunction = this.createJobListTable;
-    
-    if (target.loading) {
-    	console.log("Still loading.");
-    }
-    else if (target.loaded) {
-    	if($(targetExpanded).is(':visible')) {
-    		$(target).addClass('expand').removeClass('collapse');
-    		$(targetExpanded).fadeOut("fast");
-    	}
-    	else {
-    	    $(target).addClass('collapse').removeClass('expand');
-    		$(targetExpanded).fadeIn();
-    	}
-    }
-    else {
-	    // projectName is available
-	    $(target).addClass('wait').removeClass('collapse').removeClass('expand');
-	    target.loading = true;
-	    
-	    $.get(
-	      requestURL,
-	      {"project": projectName, "ajax":"fetchflowjobs", "flow":targetId},
-	      function(data) {
-	        console.log("Success");
-	        target.loaded = true;
-	        target.loading = false;
-	        
-	        createJobListFunction(data, targetTBody);
-	        
-			$(target).addClass('collapse').removeClass('wait');
-	    	$(targetExpanded).fadeIn("fast");
-	      },
-	      "json"
-	    );
-    }
-  },
-  createJobListTable : function(data, innerTable) {
-  	var nodes = data.nodes;
-  	var flowId = data.flowId;
-  	var project = data.project;
-  	var requestURL = contextURL + "/manager?project=" + project + "&flow=" + flowId + "&job=";
-  	for (var i = 0; i < nodes.length; i++) {
-		var job = nodes[i];
-		var name = job.id;
-		var level = job.level;
-		var nodeId = flowId + "-" + name;
-		
-		var tr = document.createElement("tr");
-		$(tr).addClass("jobrow");
-		var idtd = document.createElement("td");
-		$(idtd).addClass("tb-name");
-		$(idtd).addClass("tb-job-name");
-		idtd.flowId=flowId;
-		idtd.projectName=project;
-		idtd.jobName=name;
-		
-		var ida = document.createElement("a");
-		ida.dependents = job.dependents;
-		ida.dependencies = job.dependencies;
-		ida.flowid = flowId;
-		$(ida).text(name);
-		$(ida).addClass("jobLink");
-		$(ida).attr("id", nodeId);
-		$(ida).css("margin-left", level * 20);
-		$(ida).attr("href", requestURL + name);
+	initialize: function(settings) {
+	},
+
+	expandFlowProject: function(evt) {
+		if (evt.target.tagName == "A") {
+			return;
+		}
 		
-		$(idtd).append(ida);
-		$(tr).append(idtd);
-		$(innerTable).append(tr);
+		var target = evt.currentTarget;
+		var targetId = target.id;
+		var requestURL = contextURL + "/manager";
 
-		if (execAccess) {
-			var hoverMenuDiv = document.createElement("div");
-			$(hoverMenuDiv).addClass("job-hover-menu");
+		var targetExpanded = $('#' + targetId + '-child');
+		var targetTBody = $('#' + targetId + '-tbody');
+		
+		var createJobListFunction = this.createJobListTable;
+		if (target.loading) {
+			console.log("Still loading.");
+		}
+		else if (target.loaded) {
+			$(targetExpanded).collapse('toggle');
+		}
+		else {
+			// projectName is available
+			target.loading = true;
+			var requestData = {
+				"project": projectName, 
+				"ajax":"fetchflowjobs", 
+				"flow":targetId
+			};
+			var successHandler = function(data) {
+				console.log("Success");
+				target.loaded = true;
+				target.loading = false;
+				createJobListFunction(data, targetTBody);
+				$(targetExpanded).collapse('show');
+			};
+			$.get(requestURL, requestData, successHandler, "json");
+		}
+	},
+	
+	createJobListTable: function(data, innerTable) {
+		var nodes = data.nodes;
+		var flowId = data.flowId;
+		var project = data.project;
+		var requestURL = contextURL + "/manager?project=" + project + "&flow=" + flowId + "&job=";
+		for (var i = 0; i < nodes.length; i++) {
+			var job = nodes[i];
+			var name = job.id;
+			var level = job.level;
+			var nodeId = flowId + "-" + name;
 			
-			var divRunJob = document.createElement("div");
-			$(divRunJob).addClass("btn1");
-			$(divRunJob).addClass("runJob");
-			$(divRunJob).text("Run Job");
-			divRunJob.jobName = name;
-			divRunJob.flowId = flowId;
-			$(hoverMenuDiv).append(divRunJob);
+			var tr = document.createElement("tr");
+			$(tr).addClass("jobrow");
+			var idtd = document.createElement("td");
+			$(idtd).addClass("tb-name");
+			$(idtd).addClass("tb-job-name");
+			idtd.flowId = flowId;
+			idtd.projectName = project;
+			idtd.jobName = name;
+
+			if (execAccess) {
+				var hoverMenuDiv = document.createElement("div");
+				$(hoverMenuDiv).addClass("pull-right");
+				
+				var divRunJob = document.createElement("button");
+				$(divRunJob).addClass("btn");
+				$(divRunJob).addClass("btn-success");
+				$(divRunJob).addClass("btn-xs");
+				$(divRunJob).addClass("runJob");
+				$(divRunJob).text("Run Job");
+				divRunJob.jobName = name;
+				divRunJob.flowId = flowId;
+				$(hoverMenuDiv).append(divRunJob);
+				
+				var divRunWithDep = document.createElement("button");
+				$(divRunWithDep).addClass("btn");
+				$(divRunWithDep).addClass("btn-success");
+				$(divRunWithDep).addClass("btn-xs");
+				$(divRunWithDep).addClass("runWithDep");
+				$(divRunWithDep).text("Run With Dependencies");
+				divRunWithDep.jobName = name;
+				divRunWithDep.flowId = flowId;
+				$(hoverMenuDiv).append(divRunWithDep);
+				
+				$(idtd).append(hoverMenuDiv);
+			}
 			
-			var divRunWithDep = document.createElement("div");
-			$(divRunWithDep).addClass("btn1");
-			$(divRunWithDep).addClass("runWithDep");
-			$(divRunWithDep).text("Run With Dependencies");
-			divRunWithDep.jobName = name;
-			divRunWithDep.flowId = flowId;
-			$(hoverMenuDiv).append(divRunWithDep);
+			var ida = document.createElement("a");
+			ida.dependents = job.dependents;
+			ida.dependencies = job.dependencies;
+			ida.flowid = flowId;
+			$(ida).text(name);
+			$(ida).addClass("jobLink");
+			$(ida).attr("id", nodeId);
+			$(ida).css("margin-left", level * 20);
+			$(ida).attr("href", requestURL + name);
 			
-			$(idtd).append(hoverMenuDiv);
-		}		
-  	}
-  },
-  unhighlight: function(evt) {
-  	var currentTarget = evt.currentTarget;
- 	$(".dependent").removeClass("dependent");
-	$(".dependency").removeClass("dependency");
+			$(idtd).append(ida);
+			$(tr).append(idtd);
+			$(innerTable).append(tr);
+		}
+	},
+	
+	unhighlight: function(evt) {
+		var currentTarget = evt.currentTarget;
+		$(".dependent").removeClass("dependent");
+		$(".dependency").removeClass("dependency");
+	},
 
-  },
-  highlight: function(evt) {
- 	var currentTarget = evt.currentTarget;
- 	$(".dependent").removeClass("dependent");
-	$(".dependency").removeClass("dependency");
+	highlight: function(evt) {
+		var currentTarget = evt.currentTarget;
+		$(".dependent").removeClass("dependent");
+		$(".dependency").removeClass("dependency");
 	
- 	if ($(currentTarget).hasClass("jobLink")) {
-		this.highlightJob(currentTarget);
-	}
+		if ($(currentTarget).hasClass("jobLink")) {
+			this.highlightJob(currentTarget);
+		}
+	},
 
-  },
-  highlightJob: function(currentTarget) {
-   	var dependents = currentTarget.dependents;
- 	var dependencies = currentTarget.dependencies;
- 	var flowid = currentTarget.flowid;
- 	
- 	if (dependents) {
-	 	for (var i = 0; i < dependents.length; ++i) {
-	 		var depId = flowid + "-" + dependents[i];
-	 		$("#"+depId).toggleClass("dependent");
-	 	}
- 	}
- 	
- 	if (dependencies) {
-	 	for (var i = 0; i < dependencies.length; ++i) {
-	 		var depId = flowid + "-" + dependencies[i];
-	 		$("#"+depId).toggleClass("dependency");
-	 	}
-  	}
-  },
-  viewFlow: function(evt) {
-  	console.log("View Flow");
-  	var flowId = evt.currentTarget.flowId;
+	highlightJob: function(currentTarget) {
+		var dependents = currentTarget.dependents;
+		var dependencies = currentTarget.dependencies;
+		var flowid = currentTarget.flowid;
+		
+		if (dependents) {
+			for (var i = 0; i < dependents.length; ++i) {
+				var depId = flowid + "-" + dependents[i];
+				$("#"+depId).toggleClass("dependent");
+			}
+		}
+		
+		if (dependencies) {
+			for (var i = 0; i < dependencies.length; ++i) {
+				var depId = flowid + "-" + dependencies[i];
+				$("#"+depId).toggleClass("dependency");
+			}
+		}
+	},
+
+	viewFlow: function(evt) {
+		console.log("View Flow");
+		var flowId = evt.currentTarget.flowId;
+		location.href = contextURL + "/manager?project=" + projectName + "&flow=" + flowId;
+	},
+
+	viewJob: function(evt) {
+		console.log("View Job");
+		var flowId = evt.currentTarget.flowId;
+		var jobId = evt.currentTarget.jobId;
+		location.href = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobId;
+	},
+
+	runJob: function(evt) {
+		console.log("Run Job");
+		var jobId = evt.currentTarget.jobName;
+		var flowId = evt.currentTarget.flowId;
+		
+		var executingData = {
+			project: projectName,
+			ajax: "executeFlow",
+			flow: flowId,
+			job: jobId
+		};
+		
+		this.executeFlowDialog(executingData);
+	},
+
+	runWithDep: function(evt) {
+		var jobId = evt.currentTarget.jobName;
+		var flowId = evt.currentTarget.flowId;
+		console.log("Run With Dep");
+		
+		var executingData = {
+			project: projectName,
+			ajax: "executeFlow",
+			flow: flowId,
+			job: jobId,
+			withDep: true
+		};
+		this.executeFlowDialog(executingData);
+	},
+
+	executeFlow: function(evt) {
+		console.log("Execute Flow");
+		var flowId = $(evt.currentTarget).attr('flowid');
+		
+		var executingData = {
+			project: projectName,
+			ajax: "executeFlow",
+			flow: flowId
+		};
+		
+		this.executeFlowDialog(executingData);
+	},
+
+	executeFlowDialog: function(executingData) {
+		flowExecuteDialogView.show(executingData);
+	},
 
-  	location.href = contextURL + "/manager?project=" + projectName + "&flow=" + flowId;
-  },
-  viewJob: function(evt) {
-  	console.log("View Job");
-  	var flowId = evt.currentTarget.flowId;
-  	var jobId = evt.currentTarget.jobId;
-  	
-  	location.href = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobId;
-  },
-  runJob: function(evt) {
-  	console.log("Run Job");
-  	var jobId = evt.currentTarget.jobName;
-  	var flowId = evt.currentTarget.flowId;
-  	
-  	var executingData = {
-  		project: projectName,
-  		ajax: "executeFlow",
-  		flow: flowId,
-  		job: jobId
-	};
-  	
-  	this.executeFlowDialog(executingData);
-  },
-  runWithDep: function(evt) {
-    var jobId = evt.currentTarget.jobName;
-  	var flowId = evt.currentTarget.flowId;
-    console.log("Run With Dep");
-    
-    var executingData = {
-  		project: projectName,
-  		ajax: "executeFlow",
-  		flow: flowId,
-  		job: jobId,
-  		withDep: true
-	};
-    
-    this.executeFlowDialog(executingData);
-  },
-  executeFlow: function(evt) {
-    console.log("Execute Flow");
-   	var flowId = $(evt.currentTarget).attr('flowid');
-    
-    var executingData = {
-  		project: projectName,
-  		ajax: "executeFlow",
-  		flow: flowId
-	};
-    
-    this.executeFlowDialog(executingData);
-  },
-  executeFlowDialog: function(executingData) {
-  	flowExecuteDialogView.show(executingData);
-  },
-  render: function() {
-  }
+	render: function() {
+	}
 });
 
 var projectSummary;
-azkaban.ProjectSummaryView= Backbone.View.extend({
-  events : {
-      "click #edit": "handleDescriptionEdit"
-  },
-  initialize : function(settings) {
-  },
-  handleDescriptionEdit : function(evt) {
-      console.log("Edit description");
-      var editText = $("#edit").text();
-      var descriptionTD = $('#pdescription');
-      
-      if (editText != "Edit Description") {
-          var requestURL = contextURL + "/manager";
-          var newText = $("#descEdit").val();
+azkaban.ProjectSummaryView = Backbone.View.extend({
+	events: {
+		"click #edit": "handleDescriptionEdit"
+	},
+
+	initialize: function(settings) {
+	},
+	
+	handleDescriptionEdit: function(evt) {
+		console.log("Edit description");
+		var editText = $("#edit").text();
+		var descriptionTD = $('#pdescription');
+		
+		if (editText != "Edit Description") {
+			var requestURL = contextURL + "/manager";
+			var newText = $("#descEdit").val();
 
-          $.get(
-		      requestURL,
-		      {"project": projectName, "ajax":"changeDescription", "description":newText},
-		      function(data) {
-				if (data.error) {
-					alert(data.error);
-				}
-		      },
-		      "json"
-	    );
-          
-          $(descriptionTD).remove("#descEdit");
-          $(descriptionTD).text(newText);
-          
-          $("#edit").text("Edit Description");
-      }
-      else {
-	      var text = $(descriptionTD).text();
-	      var edit = document.createElement("textarea");
-	      
-	      $(edit).addClass("editTextArea");
-	      $(edit).attr("id", "descEdit");
-	      $(edit).val(text);
-	      $(descriptionTD).text("");
-	      $(descriptionTD).append(edit);
-	      
-	      $("#edit").text("Commit");
-      }
-  },
-  render: function() {
-  }
+			$.get(
+				requestURL,
+				{
+					"project": projectName, 
+					"ajax":"changeDescription", 
+					"description":newText
+				},
+				function(data) {
+					if (data.error) {
+						alert(data.error);
+					}
+				},
+				"json"
+			);
+				
+			$(descriptionTD).remove("#descEdit");
+			$(descriptionTD).text(newText);
+			$("#edit").text("Edit Description");
+		}
+		else {
+			var text = $(descriptionTD).text();
+			var edit = document.createElement("textarea");
+			
+			$(edit).addClass("editTextArea");
+			$(edit).attr("id", "descEdit");
+			$(edit).val(text);
+			$(descriptionTD).text("");
+			$(descriptionTD).append(edit);
+			
+			$("#edit").text("Commit");
+		}
+	},
+	render: function() {
+	}
 });
 
 $(function() {
-	projectView = new azkaban.ProjectView({el:$('#all-jobs-content')});
-	uploadView = new azkaban.UploadProjectView({el:$('#upload-project')});
+	projectView = new azkaban.ProjectView({el:$('#project-options')});
+	uploadView = new azkaban.UploadProjectView({el:$('#upload-project-modal')});
 	flowTableView = new azkaban.FlowTableView({el:$('#flow-tabs')});
 	projectSummary = new azkaban.ProjectSummaryView({el:$('#project-summary')});
-	deleteProjectView = new azkaban.DeleteProjectView({el: $('#delete-project')});
+	deleteProjectView = new azkaban.DeleteProjectView({el: $('#delete-project-modal')});
 	// Setting up the project tabs
 });

diff --git a/src/web/js/azkaban.schedule.panel.view.js b/src/web/js/azkaban.schedule.panel.view.js
index 1d85736..b869552 100644
--- a/src/web/js/azkaban.schedule.panel.view.js
+++ b/src/web/js/azkaban.schedule.panel.view.js
@@ -17,73 +17,78 @@
 $.namespace('azkaban');
 
 var schedulePanelView;
-azkaban.SchedulePanelView= Backbone.View.extend({
-  events : {
-  	"click .closeSchedule": "hideSchedulePanel",
-  	"click #schedule-button": "scheduleFlow"
-  },
-  initialize : function(settings) {
- 	$("#datepicker").css("backgroundColor", "transparent");
-	$( "#datepicker" ).datepicker();
-	$( "#datepicker" ).datepicker('setDate', new Date());
-	$( "#datepicker" ).datepicker("hide");
-  },
-  render: function() {
-  },
-  showSchedulePanel: function() {
-  	$('#scheduleModalBackground').show();
-  	$('#schedule-panel').show();
-  },
-  hideSchedulePanel: function() {
-  	$('#scheduleModalBackground').hide();
-  	$('#schedule-panel').hide();
-  },
-  scheduleFlow: function() {
-	var hourVal = $('#hour').val();
-	var minutesVal = $('#minutes').val();
-	var ampmVal = $('#am_pm').val();
-	var timezoneVal = $('#timezone').val();
-	var dateVal = $('#datepicker').val();
-	var is_recurringVal = $('#is_recurring').val();
-	var periodVal = $('#period').val();
-	var periodUnits = $('#period_units').val();
-  
-  	var scheduleURL = contextURL + "/schedule"
-  	
-  	var scheduleData = flowExecuteDialogView.getExecutionOptionData();
-  	 console.log("Creating schedule for "+projectName+"."+scheduleData.flow);
-	var scheduleTime = $('#hour').val() + "," + $('#minutes').val() + "," + $('#am_pm').val() + "," + $('#timezone').val();
-	var scheduleDate = $('#datepicker').val();
-	var is_recurring = document.getElementById('is_recurring').checked ? 'on' : 'off'; 
-	var period = $('#period').val() + $('#period_units').val();
+azkaban.SchedulePanelView = Backbone.View.extend({
+	events: {
+		"click #schedule-button": "scheduleFlow"
+	},
+
+	initialize: function(settings) {
+		$("#datepicker").css("backgroundColor", "transparent");
+		$("#datepicker").datepicker();
+		$("#datepicker").datepicker('setDate', new Date());
+		$("#datepicker").datepicker("hide");
+	},
+
+	render: function() {
+	},
+	
+	showSchedulePanel: function() {
+		$('#schedule-modal').modal();
+	},
 	
-	scheduleData.ajax = "scheduleFlow";
-	scheduleData.projectName = projectName;
-	scheduleData.scheduleTime = scheduleTime;
-	scheduleData.scheduleDate = scheduleDate;
-	scheduleData.is_recurring = is_recurring;
-	scheduleData.period = period;
+	hideSchedulePanel: function() {
+		$('#schedule-modal').modal("hide");
+	},
+	
+	scheduleFlow: function() {
+		var hourVal = $('#hour').val();
+		var minutesVal = $('#minutes').val();
+		var ampmVal = $('#am_pm').val();
+		var timezoneVal = $('#timezone').val();
+		var dateVal = $('#datepicker').val();
+		var is_recurringVal = $('#is_recurring').val();
+		var periodVal = $('#period').val();
+		var periodUnits = $('#period_units').val();
+	
+		var scheduleURL = contextURL + "/schedule"
+		var scheduleData = flowExecuteDialogView.getExecutionOptionData();
 
-	$.post(
-			scheduleURL,
-			scheduleData,
-			function(data) {
-				if (data.error) {
-					messageDialogView.show("Error Scheduling Flow", data.message);
-				}
-				else {
-					messageDialogView.show("Flow Scheduled", data.message,
+		console.log("Creating schedule for " + projectName + "." + 
+				scheduleData.flow);
+		
+		var scheduleTime = $('#hour').val() + "," + $('#minutes').val() + "," + 
+				$('#am_pm').val() + "," + $('#timezone').val();
+		var scheduleDate = $('#datepicker').val();
+		var is_recurring = document.getElementById('is_recurring').checked 
+				? 'on' : 'off'; 
+		var period = $('#period').val() + $('#period_units').val();
+		
+		scheduleData.ajax = "scheduleFlow";
+		scheduleData.projectName = projectName;
+		scheduleData.scheduleTime = scheduleTime;
+		scheduleData.scheduleDate = scheduleDate;
+		scheduleData.is_recurring = is_recurring;
+		scheduleData.period = period;
+			
+		var successHandler = function(data) {
+			if (data.error) {
+				messageDialogView.show("Error Scheduling Flow", data.message);
+			}
+			else {
+				messageDialogView.show("Flow Scheduled", data.message,
 					function() {
 						window.location.href = scheduleURL;
 					}
-					);
-				}
-			},
-			"json"
-	);
-  }
+				);
+			}
+		};
+
+		$.post(scheduleURL, scheduleData, successHandler, "json");
+	}
 });
 
 $(function() {
-	schedulePanelView =  new azkaban.SchedulePanelView({el:$('#scheduleModalBackground')});
+	schedulePanelView =	new azkaban.SchedulePanelView({
+		el: $('#schedule-modal')
+	});
 });

diff --git a/src/web/js/azkaban.scheduled.view.js b/src/web/js/azkaban.scheduled.view.js
index b713783..25cad1c 100644
--- a/src/web/js/azkaban.scheduled.view.js
+++ b/src/web/js/azkaban.scheduled.view.js
@@ -19,212 +19,202 @@ $.namespace('azkaban');
 function removeSched(scheduleId) {
 	var scheduleURL = contextURL + "/schedule"
 	var redirectURL = contextURL + "/schedule"
-	$.post(
-			scheduleURL,
-			{"action":"removeSched", "scheduleId":scheduleId},
-			function(data) {
-				if (data.error) {
-//                 alert(data.error)
-					$('#errorMsg').text(data.error);
-				}
-				else {
-// 		 alert("Schedule "+schedId+" removed!")
-					window.location = redirectURL;
-				}
-			},
-			"json"
-	)
+	var requestData = {
+		"action": "removeSched", 
+		"scheduleId":scheduleId
+	};
+	var successHandler = function(data) {
+		if (data.error) {
+			$('#errorMsg').text(data.error);
+		}
+		else {
+			window.location = redirectURL;
+		}
+	};
+	$.post(scheduleURL, requestData, successHandler, "json");
 }
 
 function removeSla(scheduleId) {
 	var scheduleURL = contextURL + "/schedule"
 	var redirectURL = contextURL + "/schedule"
-	$.post(
-			scheduleURL,
-			{"action":"removeSla", "scheduleId":scheduleId},
-			function(data) {
-				if (data.error) {
-//                 alert(data.error)
-					$('#errorMsg').text(data.error)
-				}
-				else {
-// 		 alert("Schedule "+schedId+" removed!")
-					window.location = redirectURL
-				}
-			},
-			"json"
-	)
+	var requestData = {
+		"action": "removeSla", 
+		"scheduleId": scheduleId
+	};
+	var successHandler = function(data) {
+		if (data.error) {
+			$('#errorMsg').text(data.error)
+		}
+		else {
+			window.location = redirectURL
+		}
+	};
+	$.post(scheduleURL, requestData, successHandler, "json");
 }
 
+var slaView;
 azkaban.ChangeSlaView = Backbone.View.extend({
-	events : {
-		"click" : "closeEditingTarget",
+	events: {
+		"click": "closeEditingTarget",
 		"click #set-sla-btn": "handleSetSla",	
 		"click #remove-sla-btn": "handleRemoveSla",
-		"click #sla-cancel-btn": "handleSlaCancel",
-		"click .modal-close": "handleSlaCancel",
 		"click #addRow": "handleAddRow"
 	},
+	
 	initialize: function(setting) {
-
+		$('#sla-options').on('hidden.bs.modal', function() {
+			slaView.handleSlaCancel();
+		});
 	},
-	handleSlaCancel: function(evt) {
+	
+	handleSlaCancel: function() {
 		console.log("Clicked cancel button");
 		var scheduleURL = contextURL + "/schedule";
-
-		$('#slaModalBackground').hide();
-		$('#sla-options').hide();
-		
 		var tFlowRules = document.getElementById("flowRulesTbl").tBodies[0];
 		var rows = tFlowRules.rows;
 		var rowLength = rows.length
-		for(var i = 0; i < rowLength-1; i++) {
+		for (var i = 0; i < rowLength-1; i++) {
 			tFlowRules.deleteRow(0);
 		}
-		
 	},
+	
 	initFromSched: function(scheduleId, flowName) {
 		this.scheduleId = scheduleId;
-		
 		var scheduleURL = contextURL + "/schedule"
 		this.scheduleURL = scheduleURL;
+		
 		var indexToName = {};
 		var nameToIndex = {};
 		var indexToText = {};
 		this.indexToName = indexToName;
 		this.nameToIndex = nameToIndex;
 		this.indexToText = indexToText;
+		
 		var ruleBoxOptions = ["SUCCESS", "FINISH"];
 		this.ruleBoxOptions = ruleBoxOptions;
 		
-		var fetchScheduleData = {"scheduleId": this.scheduleId, "ajax":"slaInfo"};
-		
-		$.get(
-				this.scheduleURL,
-				fetchScheduleData,
-				function(data) {
-					if (data.error) {
-						alert(data.error);
-					}
-					else {
-						if (data.slaEmails) {
-							$('#slaEmails').val(data.slaEmails.join());
+		var fetchScheduleData = {
+			"scheduleId": this.scheduleId, 
+			"ajax": "slaInfo"
+		};
+	
+		var successHandler = function(data) {
+			if (data.error) {
+				alert(data.error);
+				return;
+			}
+			if (data.slaEmails) {
+				$('#slaEmails').val(data.slaEmails.join());
+			}
+			
+			var allJobNames = data.allJobNames;
+			
+			indexToName[0] = "";
+			nameToIndex[flowName] = 0;
+			indexToText[0] = "flow " + flowName;
+			for (var i = 1; i <= allJobNames.length; i++) {
+				indexToName[i] = allJobNames[i-1];
+				nameToIndex[allJobNames[i-1]] = i;
+				indexToText[i] = "job " + allJobNames[i-1];
+			}
+			
+			// populate with existing settings
+			if (data.settings) {
+				var tFlowRules = document.getElementById("flowRulesTbl").tBodies[0];
+				for (var setting in data.settings) {
+					var rFlowRule = tFlowRules.insertRow(0);
+					
+					var cId = rFlowRule.insertCell(-1);
+					var idSelect = document.createElement("select");
+					idSelect.setAttribute("class", "form-control");
+					for (var i in indexToName) {
+						idSelect.options[i] = new Option(indexToText[i], indexToName[i]);
+						if (data.settings[setting].id == indexToName[i]) {
+							idSelect.options[i].selected = true;
 						}
-						
-						var allJobNames = data.allJobNames;
-						
-						indexToName[0] = "";
-						nameToIndex[flowName] = 0;
-						indexToText[0] = "flow " + flowName;
-						for(var i = 1; i <= allJobNames.length; i++) {
-							indexToName[i] = allJobNames[i-1];
-							nameToIndex[allJobNames[i-1]] = i;
-							indexToText[i] = "job " + allJobNames[i-1];
+					}								
+					cId.appendChild(idSelect);
+					
+					var cRule = rFlowRule.insertCell(-1);
+					var ruleSelect = document.createElement("select");
+					ruleSelect.setAttribute("class", "form-control");
+					for (var i in ruleBoxOptions) {
+						ruleSelect.options[i] = new Option(ruleBoxOptions[i], ruleBoxOptions[i]);
+						if (data.settings[setting].rule == ruleBoxOptions[i]) {
+							ruleSelect.options[i].selected = true;
 						}
-						
-						// populate with existing settings
-						if(data.settings) {
-							
-							var tFlowRules = document.getElementById("flowRulesTbl").tBodies[0];
-							
-							for(var setting in data.settings) {
-								var rFlowRule = tFlowRules.insertRow(0);
-								
-								var cId = rFlowRule.insertCell(-1);
-								var idSelect = document.createElement("select");
-								for(var i in indexToName) {
-									idSelect.options[i] = new Option(indexToText[i], indexToName[i]);
-									if(data.settings[setting].id == indexToName[i]) {
-										idSelect.options[i].selected = true;
-									}
-								}								
-								cId.appendChild(idSelect);
-								
-								var cRule = rFlowRule.insertCell(-1);
-								var ruleSelect = document.createElement("select");
-								for(var i in ruleBoxOptions) {
-									ruleSelect.options[i] = new Option(ruleBoxOptions[i], ruleBoxOptions[i]);
-									if(data.settings[setting].rule == ruleBoxOptions[i]) {
-										ruleSelect.options[i].selected = true;
-									}
-								}
-								cRule.appendChild(ruleSelect);
-								
-								var cDuration = rFlowRule.insertCell(-1);
-								var duration = document.createElement("input");
-								duration.type = "text";
-								duration.setAttribute("class", "durationpick");
-								var rawMinutes = data.settings[setting].duration;
-								var intMinutes = rawMinutes.substring(0, rawMinutes.length-1);
-								var minutes = parseInt(intMinutes);
-								var hours = Math.floor(minutes / 60);
-								minutes = minutes % 60;
-								duration.value = hours + ":" + minutes;
-								cDuration.appendChild(duration);
+					}
+					cRule.appendChild(ruleSelect);
+					
+					var cDuration = rFlowRule.insertCell(-1);
+					var duration = document.createElement("input");
+					duration.type = "text";
+					duration.setAttribute("class", "form-control durationpick");
+					var rawMinutes = data.settings[setting].duration;
+					var intMinutes = rawMinutes.substring(0, rawMinutes.length-1);
+					var minutes = parseInt(intMinutes);
+					var hours = Math.floor(minutes / 60);
+					minutes = minutes % 60;
+					duration.value = hours + ":" + minutes;
+					cDuration.appendChild(duration);
 
-								var cEmail = rFlowRule.insertCell(-1);
-								var emailCheck = document.createElement("input");
-								emailCheck.type = "checkbox";
-								for(var act in data.settings[setting].actions) {
-									if(data.settings[setting].actions[act] == "EMAIL") {
-										emailCheck.checked = true;
-									}
-								}
-								cEmail.appendChild(emailCheck);
-								
-								var cKill = rFlowRule.insertCell(-1);
-								var killCheck = document.createElement("input");
-								killCheck.type = "checkbox";
-								for(var act in data.settings[setting].actions) {
-									if(data.settings[setting].actions[act] == "KILL") {
-										killCheck.checked = true;
-									}
-								}
-								cKill.appendChild(killCheck);
-								
-								$('.durationpick').timepicker({hourMax: 99});
-							}
+					var cEmail = rFlowRule.insertCell(-1);
+					var emailCheck = document.createElement("input");
+					emailCheck.type = "checkbox";
+					for (var act in data.settings[setting].actions) {
+						if (data.settings[setting].actions[act] == "EMAIL") {
+							emailCheck.checked = true;
+						}
+					}
+					cEmail.appendChild(emailCheck);
+					
+					var cKill = rFlowRule.insertCell(-1);
+					var killCheck = document.createElement("input");
+					killCheck.type = "checkbox";
+					for (var act in data.settings[setting].actions) {
+						if (data.settings[setting].actions[act] == "KILL") {
+							killCheck.checked = true;
 						}
-						$('.durationpick').timepicker({hourMax: 99});
 					}
-				},
-				"json"
-			);
+					cKill.appendChild(killCheck);
+					$('.durationpick').timepicker({hourMax: 99});
+				}
+			}
+			$('.durationpick').timepicker({hourMax: 99});
+		};
+
+		$.get(this.scheduleURL, fetchScheduleData, successHandler, "json");
 		
-		$('#slaModalBackground').show();
-		$('#sla-options').show();
+		$('#sla-options').modal();
 		
-//		this.schedFlowOptions = sched.flowOptions
+		//this.schedFlowOptions = sched.flowOptions
 		console.log("Loaded schedule info. Ready to set SLA.");
-
 	},
+	
 	handleRemoveSla: function(evt) {
 		console.log("Clicked remove sla button");
 		var scheduleURL = this.scheduleURL;
 		var redirectURL = this.scheduleURL;
-		$.post(
-				scheduleURL,
-				{"action":"removeSla", "scheduleId":this.scheduleId},
-				function(data) {
-				if (data.error) {
-						$('#errorMsg').text(data.error)
-					}
-					else {
-						window.location = redirectURL
-					}
-				"json"
-				}
-			);
-
+		var requestData = {
+			"action": "removeSla", 
+			"scheduleId": this.scheduleId
+		};
+		var successHandler = function(data) {
+			if (data.error) {
+				$('#errorMsg').text(data.error)
+			}
+			else {
+				window.location = redirectURL
+			}
+		};
+		$.post(scheduleURL, requestData, successHanlder, "json");
 	},
+	
 	handleSetSla: function(evt) {
-
 		var slaEmails = $('#slaEmails').val();
 		var settings = {};
-		
-		
 		var tFlowRules = document.getElementById("flowRulesTbl").tBodies[0];
-		for(var row = 0; row < tFlowRules.rows.length-1; row++) {
+		for (var row = 0; row < tFlowRules.rows.length-1; row++) {
 			var rFlowRule = tFlowRules.rows[row];
 			var id = rFlowRule.cells[0].firstChild.value;
 			var rule = rFlowRule.cells[1].firstChild.value;
@@ -242,24 +232,19 @@ azkaban.ChangeSlaView = Backbone.View.extend({
 		};
 
 		var scheduleURL = this.scheduleURL;
-		
-		$.post(
-			scheduleURL,
-			slaData,
-			function(data) {
-				if (data.error) {
-					alert(data.error);
-				}
-				else {
-					tFlowRules.length = 0;
-					window.location = scheduleURL;
-				}
-			},
-			"json"
-		);
+		var successHandler = function(data) {
+			if (data.error) {
+				alert(data.error);
+			}
+			else {
+				tFlowRules.length = 0;
+				window.location = scheduleURL;
+			}
+		};
+		$.post(scheduleURL, slaData, successHandler, "json");
 	},
+	
 	handleAddRow: function(evt) {
-		
 		var indexToName = this.indexToName;
 		var nameToIndex = this.nameToIndex;
 		var indexToText = this.indexToText;
@@ -270,15 +255,16 @@ azkaban.ChangeSlaView = Backbone.View.extend({
 		
 		var cId = rFlowRule.insertCell(-1);
 		var idSelect = document.createElement("select");
-		for(var i in indexToName) {
+		idSelect.setAttribute("class", "form-control");
+		for (var i in indexToName) {
 			idSelect.options[i] = new Option(indexToText[i], indexToName[i]);
 		}
-		
 		cId.appendChild(idSelect);
 		
 		var cRule = rFlowRule.insertCell(-1);
 		var ruleSelect = document.createElement("select");
-		for(var i in ruleBoxOptions) {
+		ruleSelect.setAttribute("class", "form-control");
+		for (var i in ruleBoxOptions) {
 			ruleSelect.options[i] = new Option(ruleBoxOptions[i], ruleBoxOptions[i]);
 		}
 		cRule.appendChild(ruleSelect);
@@ -286,7 +272,7 @@ azkaban.ChangeSlaView = Backbone.View.extend({
 		var cDuration = rFlowRule.insertCell(-1);
 		var duration = document.createElement("input");
 		duration.type = "text";
-		duration.setAttribute("class", "durationpick");
+		duration.setAttribute("class", "durationpick form-control");
 		cDuration.appendChild(duration);
 
 		var cEmail = rFlowRule.insertCell(-1);
@@ -300,12 +286,11 @@ azkaban.ChangeSlaView = Backbone.View.extend({
 		cKill.appendChild(killCheck);
 		
 		$('.durationpick').timepicker({hourMax: 99});
-
 		return rFlowRule;
 	},
-	handleEditColumn : function(evt) {
-		var curTarget = evt.currentTarget;
 	
+	handleEditColumn: function(evt) {
+		var curTarget = evt.currentTarget;
 		if (this.editingTarget != curTarget) {
 			this.closeEditingTarget();
 			
@@ -322,32 +307,26 @@ azkaban.ChangeSlaView = Backbone.View.extend({
 			this.editingTarget = curTarget;
 		}
 	},
-	handleRemoveColumn : function(evt) {
+	
+	handleRemoveColumn: function(evt) {
 		var curTarget = evt.currentTarget;
 		// Should be the table
 		var row = curTarget.parentElement.parentElement;
 		$(row).remove();
 	},
+	
 	closeEditingTarget: function(evt) {
-
 	}
 });
 
-var slaView;
 var tableSorterView;
 $(function() {
-	var selected;
-
-
 	slaView = new azkaban.ChangeSlaView({el:$('#sla-options')});
 	tableSorterView = new azkaban.TableSorter({el:$('#scheduledFlowsTbl')});
-//	var requestURL = contextURL + "/manager";
+	//var requestURL = contextURL + "/manager";
 
 	// Set up the Flow options view. Create a new one every time :p
-//	 $('#addSlaBtn').click( function() {
-//		 slaView.show();
-//	 });
-
-	 
-	
+	//$('#addSlaBtn').click( function() {
+	//	slaView.show();
+	//});
 });

diff --git a/src/web/js/azkaban.svg.graph.view.js b/src/web/js/azkaban.svg.graph.view.js
index 380dff0..66f914f 100644
--- a/src/web/js/azkaban.svg.graph.view.js
+++ b/src/web/js/azkaban.svg.graph.view.js
@@ -176,7 +176,12 @@ azkaban.SvgGraphView = Backbone.View.extend({
 			var x = node.x - offset;
 			var y = node.y - offset;
 			
-			$(this.svgGraph).svgNavigate("transformToBox", {x: x, y: y, width: widthHeight, height: widthHeight});
+			$(this.svgGraph).svgNavigate("transformToBox", {
+				x: x, 
+				y: y, 
+				width: widthHeight, 
+				height: widthHeight
+			});
 		}
 	},
 	handleStatusUpdate: function(evt) {
@@ -211,7 +216,9 @@ azkaban.SvgGraphView = Backbone.View.extend({
 			if (callbacks.node && currentTarget.jobid) {
 				callbacks.node(self);
 			}
-			else if (callbacks.edge && (currentTarget.nodeName == "polyline" || currentTarget.nodeName == "line")) {
+			else if (callbacks.edge && 
+					(currentTarget.nodeName == "polyline" || 
+					 currentTarget.nodeName == "line")) {
 				callbacks.edge(self);
 			}
 			else if (callbacks.graph) {
@@ -317,15 +324,24 @@ azkaban.SvgGraphView = Backbone.View.extend({
 		nodeG.jobid=node.id;
 	},
 	addBounds: function(toBounds, addBounds) {
-		toBounds.minX = toBounds.minX ? Math.min(toBounds.minX, addBounds.minX) : addBounds.minX;
-		toBounds.minY = toBounds.minY ? Math.min(toBounds.minY, addBounds.minY) : addBounds.minY;
-		toBounds.maxX = toBounds.maxX ? Math.max(toBounds.maxX, addBounds.maxX) : addBounds.maxX;
-		toBounds.maxY = toBounds.maxY ? Math.max(toBounds.maxY, addBounds.maxY) : addBounds.maxY;
+		toBounds.minX = toBounds.minX 
+				? Math.min(toBounds.minX, addBounds.minX) : addBounds.minX;
+		toBounds.minY = toBounds.minY 
+				? Math.min(toBounds.minY, addBounds.minY) : addBounds.minY;
+		toBounds.maxX = toBounds.maxX 
+				? Math.max(toBounds.maxX, addBounds.maxX) : addBounds.maxX;
+		toBounds.maxY = toBounds.maxY 
+				? Math.max(toBounds.maxY, addBounds.maxY) : addBounds.maxY;
 	},
 	resetPanZoom : function(duration) {
 		var bounds = this.graphBounds;
-		var param = {x: bounds.minX, y: bounds.minY, width: (bounds.maxX - bounds.minX), height: (bounds.maxY - bounds.minY), duration: duration };
-
+		var param = {
+			x: bounds.minX, 
+			y: bounds.minY, 
+			width: (bounds.maxX - bounds.minX), 
+			height: (bounds.maxY - bounds.minY), 
+			duration: duration 
+		};
 		$(this.svgGraph).svgNavigate("transformToBox", param);
 	}
 });

diff --git a/src/web/js/azkaban.table.sort.js b/src/web/js/azkaban.table.sort.js
index 516448c..40f05e8 100644
--- a/src/web/js/azkaban.table.sort.js
+++ b/src/web/js/azkaban.table.sort.js
@@ -16,50 +16,52 @@
 
 $.namespace('azkaban');
 
-azkaban.TableSorter= Backbone.View.extend({
-  events : {
+azkaban.TableSorter = Backbone.View.extend({
+  events: {
   	"click .sortable": "handleClickSort"
   },
-  initialize : function(settings) {
+
+  initialize: function(settings) {
   	$(this.el).addClass("sortableTable");
   
-  	var thead = $(this.el).children("thead");
-	var th = $(thead).find("th");
-	
-	$(th).addClass("sortable");
-	$("th.ignoresort").removeClass("sortable");
-	var sortDiv = document.createElement("div");
+		var thead = $(this.el).children("thead");
+		var th = $(thead).find("th");
+		
+		$(th).addClass("sortable");
+		$("th.ignoresort").removeClass("sortable");
+		var sortDiv = document.createElement("div");
 
-	$(sortDiv).addClass("sortIcon");
-	
-	$(th).append(sortDiv);
-	
-	var tbody = $(this.el).children("tbody");
-	var rows = $(tbody).children("tr");
-	
-	var row;
-	for (var i = 0; i < rows.length; ++i ) {
-		var nextRow = rows[i];
-		if (row && $(nextRow).hasClass("childrow")) {
-			if (!row.childRows) {
-				row.childRows = new Array();
-			}
+		$(sortDiv).addClass("sortIcon");
+		
+		$(th).append(sortDiv);
 		
-			row.childRows.push(nextRow);
+		var tbody = $(this.el).children("tbody");
+		var rows = $(tbody).children("tr");
+		
+		var row;
+		for (var i = 0; i < rows.length; ++i ) {
+			var nextRow = rows[i];
+			if (row && $(nextRow).hasClass("childrow")) {
+				if (!row.childRows) {
+					row.childRows = new Array();
+				}
+				row.childRows.push(nextRow);
+			}
+			else {
+				row = nextRow;
+			}
 		}
-		else {
-			row = nextRow;
+		
+		if (settings.initialSort) {
+			this.toggleSort(settings.initialSort);
 		}
-	}
-	
-	if (settings.initialSort) {
-		this.toggleSort(settings.initialSort);
-	}
   },
+
   handleClickSort: function(evt) {
   	this.toggleSort(evt.currentTarget);
   },
-  toggleSort: function(th) {
+  
+	toggleSort: function(th) {
   	console.log("sorting by index " + $(th).index());
   	if ($(th).hasClass("asc")) {
   		$(th).removeClass("asc");
@@ -81,70 +83,72 @@ azkaban.TableSorter= Backbone.View.extend({
   		this.sort($(th).index(), false);
   	}
   },
-  sort: function(index, desc) {
-	var tbody = $(this.el).children("tbody");
-	var rows = $(tbody).children("tr");
+  
+	sort: function(index, desc) {
+		var tbody = $(this.el).children("tbody");
+		var rows = $(tbody).children("tr");
+
+		var tdToSort = new Array();
+		for (var i = 0; i < rows.length; ++i) {
+			var row = rows[i];
+			if (!$(row).hasClass("childrow")) {
+				var td = row.children[index];
+				tdToSort.push(td);
+			}
+		}
 
-	var tdToSort = new Array();
-	for (var i = 0; i < rows.length; ++i) {
-		var row = rows[i];
-		if (!$(row).hasClass("childrow")) {
-			var td = row.children[index];
-			tdToSort.push(td);
+		if (desc) {
+			tdToSort.sort(function(a,b) {
+				var texta = $(a).text().trim().toLowerCase();
+				var textb = $(b).text().trim().toLowerCase();
+				
+				if (texta < textb) {
+					return 1;
+				}
+				else if (texta > textb) {
+					return -1;
+				} 
+				else {
+					return 0;
+				}
+			});
+		}
+		else {
+			tdToSort.sort(function(a,b) {
+				var texta = $(a).text().trim().toLowerCase();
+				var textb = $(b).text().trim().toLowerCase();
+				
+				if (texta < textb) {
+					return -1;
+				}
+				else if (texta > textb) {
+					return 1;
+				} 
+				else {
+					return 0;
+				}
+			});
 		}
-	}
 
-	if (desc) {
-		tdToSort.sort(function(a,b) {
-			var texta = $(a).text().trim().toLowerCase();
-			var textb = $(b).text().trim().toLowerCase();
-			
-			if (texta < textb) {
-				return 1;
-			}
-			else if (texta > textb) {
-				return -1;
-			} 
-			else {
-				return 0;
-			}
-		});
-	}
-	else {
-		tdToSort.sort(function(a,b) {
-			var texta = $(a).text().trim().toLowerCase();
-			var textb = $(b).text().trim().toLowerCase();
+		var sortedTR = new Array();
+		for (var i = 0; i < tdToSort.length; ++i) {
+			var tr = $(tdToSort[i]).parent();
+			sortedTR.push(tr);
 			
-			if (texta < textb) {
-				return -1;
-			}
-			else if (texta > textb) {
-				return 1;
-			} 
-			else {
-				return 0;
+			var childRows = tr[0].childRows;
+			if (childRows) {
+				for(var j=0; j < childRows.length; ++j) {
+					sortedTR.push(childRows[j]);
+				}
 			}
-		});
-	}
-
-	var sortedTR = new Array();
-	for (var i = 0; i < tdToSort.length; ++i) {
-		var tr = $(tdToSort[i]).parent();
-		sortedTR.push(tr);
+		}
 		
-		var childRows = tr[0].childRows;
-		if (childRows) {
-			for(var j=0; j < childRows.length; ++j) {
-				sortedTR.push(childRows[j]);
-			}
+		for (var i = 0; i < sortedTR.length; ++i) {
+			$(tbody).append(sortedTR[i]);
 		}
-	}
-	
-	for (var i = 0; i < sortedTR.length; ++i) {
-		$(tbody).append(sortedTR[i]);
-	}
   },
+
   render: function() {
-  	console.log("render graph");
+  	console.log("render sorted table");
   }
 });

diff --git a/src/web/js/bootstrap.js b/src/web/js/bootstrap.js
new file mode 100644
index 0000000..1c638ab
--- /dev/null
+++ b/src/web/js/bootstrap.js
@@ -0,0 +1,2002 @@
+/*!
+ * Bootstrap v3.0.2 by @fat and @mdo
+ * Copyright 2013 Twitter, Inc.
+ * Licensed under http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Designed and built with all the love in the world by @mdo and @fat.
+ */
+
+if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery") }
+
+/* ========================================================================
+ * Bootstrap: transition.js v3.0.2
+ * http://getbootstrap.com/javascript/#transitions
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // CSS TRANSITION SUPPORT (Shoutout: http://www.modernizr.com/)
+  // ============================================================
+
+  function transitionEnd() {
+    var el = document.createElement('bootstrap')
+
+    var transEndEventNames = {
+      'WebkitTransition' : 'webkitTransitionEnd'
+    , 'MozTransition'    : 'transitionend'
+    , 'OTransition'      : 'oTransitionEnd otransitionend'
+    , 'transition'       : 'transitionend'
+    }
+
+    for (var name in transEndEventNames) {
+      if (el.style[name] !== undefined) {
+        return { end: transEndEventNames[name] }
+      }
+    }
+  }
+
+  // http://blog.alexmaccaw.com/css-transitions
+  $.fn.emulateTransitionEnd = function (duration) {
+    var called = false, $el = this
+    $(this).one($.support.transition.end, function () { called = true })
+    var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
+    setTimeout(callback, duration)
+    return this
+  }
+
+  $(function () {
+    $.support.transition = transitionEnd()
+  })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: alert.js v3.0.2
+ * http://getbootstrap.com/javascript/#alerts
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // ALERT CLASS DEFINITION
+  // ======================
+
+  var dismiss = '[data-dismiss="alert"]'
+  var Alert   = function (el) {
+    $(el).on('click', dismiss, this.close)
+  }
+
+  Alert.prototype.close = function (e) {
+    var $this    = $(this)
+    var selector = $this.attr('data-target')
+
+    if (!selector) {
+      selector = $this.attr('href')
+      selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
+    }
+
+    var $parent = $(selector)
+
+    if (e) e.preventDefault()
+
+    if (!$parent.length) {
+      $parent = $this.hasClass('alert') ? $this : $this.parent()
+    }
+
+    $parent.trigger(e = $.Event('close.bs.alert'))
+
+    if (e.isDefaultPrevented()) return
+
+    $parent.removeClass('in')
+
+    function removeElement() {
+      $parent.trigger('closed.bs.alert').remove()
+    }
+
+    $.support.transition && $parent.hasClass('fade') ?
+      $parent
+        .one($.support.transition.end, removeElement)
+        .emulateTransitionEnd(150) :
+      removeElement()
+  }
+
+
+  // ALERT PLUGIN DEFINITION
+  // =======================
+
+  var old = $.fn.alert
+
+  $.fn.alert = function (option) {
+    return this.each(function () {
+      var $this = $(this)
+      var data  = $this.data('bs.alert')
+
+      if (!data) $this.data('bs.alert', (data = new Alert(this)))
+      if (typeof option == 'string') data[option].call($this)
+    })
+  }
+
+  $.fn.alert.Constructor = Alert
+
+
+  // ALERT NO CONFLICT
+  // =================
+
+  $.fn.alert.noConflict = function () {
+    $.fn.alert = old
+    return this
+  }
+
+
+  // ALERT DATA-API
+  // ==============
+
+  $(document).on('click.bs.alert.data-api', dismiss, Alert.prototype.close)
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: button.js v3.0.2
+ * http://getbootstrap.com/javascript/#buttons
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // BUTTON PUBLIC CLASS DEFINITION
+  // ==============================
+
+  var Button = function (element, options) {
+    this.$element = $(element)
+    this.options  = $.extend({}, Button.DEFAULTS, options)
+  }
+
+  Button.DEFAULTS = {
+    loadingText: 'loading...'
+  }
+
+  Button.prototype.setState = function (state) {
+    var d    = 'disabled'
+    var $el  = this.$element
+    var val  = $el.is('input') ? 'val' : 'html'
+    var data = $el.data()
+
+    state = state + 'Text'
+
+    if (!data.resetText) $el.data('resetText', $el[val]())
+
+    $el[val](data[state] || this.options[state])
+
+    // push to event loop to allow forms to submit
+    setTimeout(function () {
+      state == 'loadingText' ?
+        $el.addClass(d).attr(d, d) :
+        $el.removeClass(d).removeAttr(d);
+    }, 0)
+  }
+
+  Button.prototype.toggle = function () {
+    var $parent = this.$element.closest('[data-toggle="buttons"]')
+
+    if ($parent.length) {
+      var $input = this.$element.find('input')
+        .prop('checked', !this.$element.hasClass('active'))
+        .trigger('change')
+      if ($input.prop('type') === 'radio') $parent.find('.active').removeClass('active')
+    }
+
+    this.$element.toggleClass('active')
+  }
+
+
+  // BUTTON PLUGIN DEFINITION
+  // ========================
+
+  var old = $.fn.button
+
+  $.fn.button = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.button')
+      var options = typeof option == 'object' && option
+
+      if (!data) $this.data('bs.button', (data = new Button(this, options)))
+
+      if (option == 'toggle') data.toggle()
+      else if (option) data.setState(option)
+    })
+  }
+
+  $.fn.button.Constructor = Button
+
+
+  // BUTTON NO CONFLICT
+  // ==================
+
+  $.fn.button.noConflict = function () {
+    $.fn.button = old
+    return this
+  }
+
+
+  // BUTTON DATA-API
+  // ===============
+
+  $(document).on('click.bs.button.data-api', '[data-toggle^=button]', function (e) {
+    var $btn = $(e.target)
+    if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
+    $btn.button('toggle')
+    e.preventDefault()
+  })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: carousel.js v3.0.2
+ * http://getbootstrap.com/javascript/#carousel
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // CAROUSEL CLASS DEFINITION
+  // =========================
+
+  var Carousel = function (element, options) {
+    this.$element    = $(element)
+    this.$indicators = this.$element.find('.carousel-indicators')
+    this.options     = options
+    this.paused      =
+    this.sliding     =
+    this.interval    =
+    this.$active     =
+    this.$items      = null
+
+    this.options.pause == 'hover' && this.$element
+      .on('mouseenter', $.proxy(this.pause, this))
+      .on('mouseleave', $.proxy(this.cycle, this))
+  }
+
+  Carousel.DEFAULTS = {
+    interval: 5000
+  , pause: 'hover'
+  , wrap: true
+  }
+
+  Carousel.prototype.cycle =  function (e) {
+    e || (this.paused = false)
+
+    this.interval && clearInterval(this.interval)
+
+    this.options.interval
+      && !this.paused
+      && (this.interval = setInterval($.proxy(this.next, this), this.options.interval))
+
+    return this
+  }
+
+  Carousel.prototype.getActiveIndex = function () {
+    this.$active = this.$element.find('.item.active')
+    this.$items  = this.$active.parent().children()
+
+    return this.$items.index(this.$active)
+  }
+
+  Carousel.prototype.to = function (pos) {
+    var that        = this
+    var activeIndex = this.getActiveIndex()
+
+    if (pos > (this.$items.length - 1) || pos < 0) return
+
+    if (this.sliding)       return this.$element.one('slid', function () { that.to(pos) })
+    if (activeIndex == pos) return this.pause().cycle()
+
+    return this.slide(pos > activeIndex ? 'next' : 'prev', $(this.$items[pos]))
+  }
+
+  Carousel.prototype.pause = function (e) {
+    e || (this.paused = true)
+
+    if (this.$element.find('.next, .prev').length && $.support.transition.end) {
+      this.$element.trigger($.support.transition.end)
+      this.cycle(true)
+    }
+
+    this.interval = clearInterval(this.interval)
+
+    return this
+  }
+
+  Carousel.prototype.next = function () {
+    if (this.sliding) return
+    return this.slide('next')
+  }
+
+  Carousel.prototype.prev = function () {
+    if (this.sliding) return
+    return this.slide('prev')
+  }
+
+  Carousel.prototype.slide = function (type, next) {
+    var $active   = this.$element.find('.item.active')
+    var $next     = next || $active[type]()
+    var isCycling = this.interval
+    var direction = type == 'next' ? 'left' : 'right'
+    var fallback  = type == 'next' ? 'first' : 'last'
+    var that      = this
+
+    if (!$next.length) {
+      if (!this.options.wrap) return
+      $next = this.$element.find('.item')[fallback]()
+    }
+
+    this.sliding = true
+
+    isCycling && this.pause()
+
+    var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
+
+    if ($next.hasClass('active')) return
+
+    if (this.$indicators.length) {
+      this.$indicators.find('.active').removeClass('active')
+      this.$element.one('slid', function () {
+        var $nextIndicator = $(that.$indicators.children()[that.getActiveIndex()])
+        $nextIndicator && $nextIndicator.addClass('active')
+      })
+    }
+
+    if ($.support.transition && this.$element.hasClass('slide')) {
+      this.$element.trigger(e)
+      if (e.isDefaultPrevented()) return
+      $next.addClass(type)
+      $next[0].offsetWidth // force reflow
+      $active.addClass(direction)
+      $next.addClass(direction)
+      $active
+        .one($.support.transition.end, function () {
+          $next.removeClass([type, direction].join(' ')).addClass('active')
+          $active.removeClass(['active', direction].join(' '))
+          that.sliding = false
+          setTimeout(function () { that.$element.trigger('slid') }, 0)
+        })
+        .emulateTransitionEnd(600)
+    } else {
+      this.$element.trigger(e)
+      if (e.isDefaultPrevented()) return
+      $active.removeClass('active')
+      $next.addClass('active')
+      this.sliding = false
+      this.$element.trigger('slid')
+    }
+
+    isCycling && this.cycle()
+
+    return this
+  }
+
+
+  // CAROUSEL PLUGIN DEFINITION
+  // ==========================
+
+  var old = $.fn.carousel
+
+  $.fn.carousel = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.carousel')
+      var options = $.extend({}, Carousel.DEFAULTS, $this.data(), typeof option == 'object' && option)
+      var action  = typeof option == 'string' ? option : options.slide
+
+      if (!data) $this.data('bs.carousel', (data = new Carousel(this, options)))
+      if (typeof option == 'number') data.to(option)
+      else if (action) data[action]()
+      else if (options.interval) data.pause().cycle()
+    })
+  }
+
+  $.fn.carousel.Constructor = Carousel
+
+
+  // CAROUSEL NO CONFLICT
+  // ====================
+
+  $.fn.carousel.noConflict = function () {
+    $.fn.carousel = old
+    return this
+  }
+
+
+  // CAROUSEL DATA-API
+  // =================
+
+  $(document).on('click.bs.carousel.data-api', '[data-slide], [data-slide-to]', function (e) {
+    var $this   = $(this), href
+    var $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
+    var options = $.extend({}, $target.data(), $this.data())
+    var slideIndex = $this.attr('data-slide-to')
+    if (slideIndex) options.interval = false
+
+    $target.carousel(options)
+
+    if (slideIndex = $this.attr('data-slide-to')) {
+      $target.data('bs.carousel').to(slideIndex)
+    }
+
+    e.preventDefault()
+  })
+
+  $(window).on('load', function () {
+    $('[data-ride="carousel"]').each(function () {
+      var $carousel = $(this)
+      $carousel.carousel($carousel.data())
+    })
+  })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: collapse.js v3.0.2
+ * http://getbootstrap.com/javascript/#collapse
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // COLLAPSE PUBLIC CLASS DEFINITION
+  // ================================
+
+  var Collapse = function (element, options) {
+    this.$element      = $(element)
+    this.options       = $.extend({}, Collapse.DEFAULTS, options)
+    this.transitioning = null
+
+    if (this.options.parent) this.$parent = $(this.options.parent)
+    if (this.options.toggle) this.toggle()
+  }
+
+  Collapse.DEFAULTS = {
+    toggle: true
+  }
+
+  Collapse.prototype.dimension = function () {
+    var hasWidth = this.$element.hasClass('width')
+    return hasWidth ? 'width' : 'height'
+  }
+
+  Collapse.prototype.show = function () {
+    if (this.transitioning || this.$element.hasClass('in')) return
+
+    var startEvent = $.Event('show.bs.collapse')
+    this.$element.trigger(startEvent)
+    if (startEvent.isDefaultPrevented()) return
+
+    var actives = this.$parent && this.$parent.find('> .panel > .in')
+
+    if (actives && actives.length) {
+      var hasData = actives.data('bs.collapse')
+      if (hasData && hasData.transitioning) return
+      actives.collapse('hide')
+      hasData || actives.data('bs.collapse', null)
+    }
+
+    var dimension = this.dimension()
+
+    this.$element
+      .removeClass('collapse')
+      .addClass('collapsing')
+      [dimension](0)
+
+    this.transitioning = 1
+
+    var complete = function () {
+      this.$element
+        .removeClass('collapsing')
+        .addClass('in')
+        [dimension]('auto')
+      this.transitioning = 0
+      this.$element.trigger('shown.bs.collapse')
+    }
+
+    if (!$.support.transition) return complete.call(this)
+
+    var scrollSize = $.camelCase(['scroll', dimension].join('-'))
+
+    this.$element
+      .one($.support.transition.end, $.proxy(complete, this))
+      .emulateTransitionEnd(350)
+      [dimension](this.$element[0][scrollSize])
+  }
+
+  Collapse.prototype.hide = function () {
+    if (this.transitioning || !this.$element.hasClass('in')) return
+
+    var startEvent = $.Event('hide.bs.collapse')
+    this.$element.trigger(startEvent)
+    if (startEvent.isDefaultPrevented()) return
+
+    var dimension = this.dimension()
+
+    this.$element
+      [dimension](this.$element[dimension]())
+      [0].offsetHeight
+
+    this.$element
+      .addClass('collapsing')
+      .removeClass('collapse')
+      .removeClass('in')
+
+    this.transitioning = 1
+
+    var complete = function () {
+      this.transitioning = 0
+      this.$element
+        .trigger('hidden.bs.collapse')
+        .removeClass('collapsing')
+        .addClass('collapse')
+    }
+
+    if (!$.support.transition) return complete.call(this)
+
+    this.$element
+      [dimension](0)
+      .one($.support.transition.end, $.proxy(complete, this))
+      .emulateTransitionEnd(350)
+  }
+
+  Collapse.prototype.toggle = function () {
+    this[this.$element.hasClass('in') ? 'hide' : 'show']()
+  }
+
+
+  // COLLAPSE PLUGIN DEFINITION
+  // ==========================
+
+  var old = $.fn.collapse
+
+  $.fn.collapse = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.collapse')
+      var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
+
+      if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  $.fn.collapse.Constructor = Collapse
+
+
+  // COLLAPSE NO CONFLICT
+  // ====================
+
+  $.fn.collapse.noConflict = function () {
+    $.fn.collapse = old
+    return this
+  }
+
+
+  // COLLAPSE DATA-API
+  // =================
+
+  $(document).on('click.bs.collapse.data-api', '[data-toggle=collapse]', function (e) {
+    var $this   = $(this), href
+    var target  = $this.attr('data-target')
+        || e.preventDefault()
+        || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
+    var $target = $(target)
+    var data    = $target.data('bs.collapse')
+    var option  = data ? 'toggle' : $this.data()
+    var parent  = $this.attr('data-parent')
+    var $parent = parent && $(parent)
+
+    if (!data || !data.transitioning) {
+      if ($parent) $parent.find('[data-toggle=collapse][data-parent="' + parent + '"]').not($this).addClass('collapsed')
+      $this[$target.hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
+    }
+
+    $target.collapse(option)
+  })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: dropdown.js v3.0.2
+ * http://getbootstrap.com/javascript/#dropdowns
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // DROPDOWN CLASS DEFINITION
+  // =========================
+
+  var backdrop = '.dropdown-backdrop'
+  var toggle   = '[data-toggle=dropdown]'
+  var Dropdown = function (element) {
+    var $el = $(element).on('click.bs.dropdown', this.toggle)
+  }
+
+  Dropdown.prototype.toggle = function (e) {
+    var $this = $(this)
+
+    if ($this.is('.disabled, :disabled')) return
+
+    var $parent  = getParent($this)
+    var isActive = $parent.hasClass('open')
+
+    clearMenus()
+
+    if (!isActive) {
+      if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
+        // if mobile we we use a backdrop because click events don't delegate
+        $('<div class="dropdown-backdrop"/>').insertAfter($(this)).on('click', clearMenus)
+      }
+
+      $parent.trigger(e = $.Event('show.bs.dropdown'))
+
+      if (e.isDefaultPrevented()) return
+
+      $parent
+        .toggleClass('open')
+        .trigger('shown.bs.dropdown')
+
+      $this.focus()
+    }
+
+    return false
+  }
+
+  Dropdown.prototype.keydown = function (e) {
+    if (!/(38|40|27)/.test(e.keyCode)) return
+
+    var $this = $(this)
+
+    e.preventDefault()
+    e.stopPropagation()
+
+    if ($this.is('.disabled, :disabled')) return
+
+    var $parent  = getParent($this)
+    var isActive = $parent.hasClass('open')
+
+    if (!isActive || (isActive && e.keyCode == 27)) {
+      if (e.which == 27) $parent.find(toggle).focus()
+      return $this.click()
+    }
+
+    var $items = $('[role=menu] li:not(.divider):visible a', $parent)
+
+    if (!$items.length) return
+
+    var index = $items.index($items.filter(':focus'))
+
+    if (e.keyCode == 38 && index > 0)                 index--                        // up
+    if (e.keyCode == 40 && index < $items.length - 1) index++                        // down
+    if (!~index)                                      index=0
+
+    $items.eq(index).focus()
+  }
+
+  function clearMenus() {
+    $(backdrop).remove()
+    $(toggle).each(function (e) {
+      var $parent = getParent($(this))
+      if (!$parent.hasClass('open')) return
+      $parent.trigger(e = $.Event('hide.bs.dropdown'))
+      if (e.isDefaultPrevented()) return
+      $parent.removeClass('open').trigger('hidden.bs.dropdown')
+    })
+  }
+
+  function getParent($this) {
+    var selector = $this.attr('data-target')
+
+    if (!selector) {
+      selector = $this.attr('href')
+      selector = selector && /#/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
+    }
+
+    var $parent = selector && $(selector)
+
+    return $parent && $parent.length ? $parent : $this.parent()
+  }
+
+
+  // DROPDOWN PLUGIN DEFINITION
+  // ==========================
+
+  var old = $.fn.dropdown
+
+  $.fn.dropdown = function (option) {
+    return this.each(function () {
+      var $this = $(this)
+      var data  = $this.data('dropdown')
+
+      if (!data) $this.data('dropdown', (data = new Dropdown(this)))
+      if (typeof option == 'string') data[option].call($this)
+    })
+  }
+
+  $.fn.dropdown.Constructor = Dropdown
+
+
+  // DROPDOWN NO CONFLICT
+  // ====================
+
+  $.fn.dropdown.noConflict = function () {
+    $.fn.dropdown = old
+    return this
+  }
+
+
+  // APPLY TO STANDARD DROPDOWN ELEMENTS
+  // ===================================
+
+  $(document)
+    .on('click.bs.dropdown.data-api', clearMenus)
+    .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
+    .on('click.bs.dropdown.data-api'  , toggle, Dropdown.prototype.toggle)
+    .on('keydown.bs.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: modal.js v3.0.2
+ * http://getbootstrap.com/javascript/#modals
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // MODAL CLASS DEFINITION
+  // ======================
+
+  var Modal = function (element, options) {
+    this.options   = options
+    this.$element  = $(element)
+    this.$backdrop =
+    this.isShown   = null
+
+    if (this.options.remote) this.$element.load(this.options.remote)
+  }
+
+  Modal.DEFAULTS = {
+      backdrop: true
+    , keyboard: true
+    , show: true
+  }
+
+  Modal.prototype.toggle = function (_relatedTarget) {
+    return this[!this.isShown ? 'show' : 'hide'](_relatedTarget)
+  }
+
+  Modal.prototype.show = function (_relatedTarget) {
+    var that = this
+    var e    = $.Event('show.bs.modal', { relatedTarget: _relatedTarget })
+
+    this.$element.trigger(e)
+
+    if (this.isShown || e.isDefaultPrevented()) return
+
+    this.isShown = true
+
+    this.escape()
+
+    this.$element.on('click.dismiss.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this))
+
+    this.backdrop(function () {
+      var transition = $.support.transition && that.$element.hasClass('fade')
+
+      if (!that.$element.parent().length) {
+        that.$element.appendTo(document.body) // don't move modals dom position
+      }
+
+      that.$element.show()
+
+      if (transition) {
+        that.$element[0].offsetWidth // force reflow
+      }
+
+      that.$element
+        .addClass('in')
+        .attr('aria-hidden', false)
+
+      that.enforceFocus()
+
+      var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
+
+      transition ?
+        that.$element.find('.modal-dialog') // wait for modal to slide in
+          .one($.support.transition.end, function () {
+            that.$element.focus().trigger(e)
+          })
+          .emulateTransitionEnd(300) :
+        that.$element.focus().trigger(e)
+    })
+  }
+
+  Modal.prototype.hide = function (e) {
+    if (e) e.preventDefault()
+
+    e = $.Event('hide.bs.modal')
+
+    this.$element.trigger(e)
+
+    if (!this.isShown || e.isDefaultPrevented()) return
+
+    this.isShown = false
+
+    this.escape()
+
+    $(document).off('focusin.bs.modal')
+
+    this.$element
+      .removeClass('in')
+      .attr('aria-hidden', true)
+      .off('click.dismiss.modal')
+
+    $.support.transition && this.$element.hasClass('fade') ?
+      this.$element
+        .one($.support.transition.end, $.proxy(this.hideModal, this))
+        .emulateTransitionEnd(300) :
+      this.hideModal()
+  }
+
+  Modal.prototype.enforceFocus = function () {
+    $(document)
+      .off('focusin.bs.modal') // guard against infinite focus loop
+      .on('focusin.bs.modal', $.proxy(function (e) {
+        if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {
+          this.$element.focus()
+        }
+      }, this))
+  }
+
+  Modal.prototype.escape = function () {
+    if (this.isShown && this.options.keyboard) {
+      this.$element.on('keyup.dismiss.bs.modal', $.proxy(function (e) {
+        e.which == 27 && this.hide()
+      }, this))
+    } else if (!this.isShown) {
+      this.$element.off('keyup.dismiss.bs.modal')
+    }
+  }
+
+  Modal.prototype.hideModal = function () {
+    var that = this
+    this.$element.hide()
+    this.backdrop(function () {
+      that.removeBackdrop()
+      that.$element.trigger('hidden.bs.modal')
+    })
+  }
+
+  Modal.prototype.removeBackdrop = function () {
+    this.$backdrop && this.$backdrop.remove()
+    this.$backdrop = null
+  }
+
+  Modal.prototype.backdrop = function (callback) {
+    var that    = this
+    var animate = this.$element.hasClass('fade') ? 'fade' : ''
+
+    if (this.isShown && this.options.backdrop) {
+      var doAnimate = $.support.transition && animate
+
+      this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
+        .appendTo(document.body)
+
+      this.$element.on('click.dismiss.modal', $.proxy(function (e) {
+        if (e.target !== e.currentTarget) return
+        this.options.backdrop == 'static'
+          ? this.$element[0].focus.call(this.$element[0])
+          : this.hide.call(this)
+      }, this))
+
+      if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
+
+      this.$backdrop.addClass('in')
+
+      if (!callback) return
+
+      doAnimate ?
+        this.$backdrop
+          .one($.support.transition.end, callback)
+          .emulateTransitionEnd(150) :
+        callback()
+
+    } else if (!this.isShown && this.$backdrop) {
+      this.$backdrop.removeClass('in')
+
+      $.support.transition && this.$element.hasClass('fade')?
+        this.$backdrop
+          .one($.support.transition.end, callback)
+          .emulateTransitionEnd(150) :
+        callback()
+
+    } else if (callback) {
+      callback()
+    }
+  }
+
+
+  // MODAL PLUGIN DEFINITION
+  // =======================
+
+  var old = $.fn.modal
+
+  $.fn.modal = function (option, _relatedTarget) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.modal')
+      var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)
+
+      if (!data) $this.data('bs.modal', (data = new Modal(this, options)))
+      if (typeof option == 'string') data[option](_relatedTarget)
+      else if (options.show) data.show(_relatedTarget)
+    })
+  }
+
+  $.fn.modal.Constructor = Modal
+
+
+  // MODAL NO CONFLICT
+  // =================
+
+  $.fn.modal.noConflict = function () {
+    $.fn.modal = old
+    return this
+  }
+
+
+  // MODAL DATA-API
+  // ==============
+
+  $(document).on('click.bs.modal.data-api', '[data-toggle="modal"]', function (e) {
+    var $this   = $(this)
+    var href    = $this.attr('href')
+    var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
+    var option  = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
+
+    e.preventDefault()
+
+    $target
+      .modal(option, this)
+      .one('hide', function () {
+        $this.is(':visible') && $this.focus()
+      })
+  })
+
+  $(document)
+    .on('show.bs.modal',  '.modal', function () { $(document.body).addClass('modal-open') })
+    .on('hidden.bs.modal', '.modal', function () { $(document.body).removeClass('modal-open') })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: tooltip.js v3.0.2
+ * http://getbootstrap.com/javascript/#tooltip
+ * Inspired by the original jQuery.tipsy by Jason Frame
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // TOOLTIP PUBLIC CLASS DEFINITION
+  // ===============================
+
+  var Tooltip = function (element, options) {
+    this.type       =
+    this.options    =
+    this.enabled    =
+    this.timeout    =
+    this.hoverState =
+    this.$element   = null
+
+    this.init('tooltip', element, options)
+  }
+
+  Tooltip.DEFAULTS = {
+    animation: true
+  , placement: 'top'
+  , selector: false
+  , template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
+  , trigger: 'hover focus'
+  , title: ''
+  , delay: 0
+  , html: false
+  , container: false
+  }
+
+  Tooltip.prototype.init = function (type, element, options) {
+    this.enabled  = true
+    this.type     = type
+    this.$element = $(element)
+    this.options  = this.getOptions(options)
+
+    var triggers = this.options.trigger.split(' ')
+
+    for (var i = triggers.length; i--;) {
+      var trigger = triggers[i]
+
+      if (trigger == 'click') {
+        this.$element.on('click.' + this.type, this.options.selector, $.proxy(this.toggle, this))
+      } else if (trigger != 'manual') {
+        var eventIn  = trigger == 'hover' ? 'mouseenter' : 'focus'
+        var eventOut = trigger == 'hover' ? 'mouseleave' : 'blur'
+
+        this.$element.on(eventIn  + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
+        this.$element.on(eventOut + '.' + this.type, this.options.selector, $.proxy(this.leave, this))
+      }
+    }
+
+    this.options.selector ?
+      (this._options = $.extend({}, this.options, { trigger: 'manual', selector: '' })) :
+      this.fixTitle()
+  }
+
+  Tooltip.prototype.getDefaults = function () {
+    return Tooltip.DEFAULTS
+  }
+
+  Tooltip.prototype.getOptions = function (options) {
+    options = $.extend({}, this.getDefaults(), this.$element.data(), options)
+
+    if (options.delay && typeof options.delay == 'number') {
+      options.delay = {
+        show: options.delay
+      , hide: options.delay
+      }
+    }
+
+    return options
+  }
+
+  Tooltip.prototype.getDelegateOptions = function () {
+    var options  = {}
+    var defaults = this.getDefaults()
+
+    this._options && $.each(this._options, function (key, value) {
+      if (defaults[key] != value) options[key] = value
+    })
+
+    return options
+  }
+
+  Tooltip.prototype.enter = function (obj) {
+    var self = obj instanceof this.constructor ?
+      obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
+
+    clearTimeout(self.timeout)
+
+    self.hoverState = 'in'
+
+    if (!self.options.delay || !self.options.delay.show) return self.show()
+
+    self.timeout = setTimeout(function () {
+      if (self.hoverState == 'in') self.show()
+    }, self.options.delay.show)
+  }
+
+  Tooltip.prototype.leave = function (obj) {
+    var self = obj instanceof this.constructor ?
+      obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
+
+    clearTimeout(self.timeout)
+
+    self.hoverState = 'out'
+
+    if (!self.options.delay || !self.options.delay.hide) return self.hide()
+
+    self.timeout = setTimeout(function () {
+      if (self.hoverState == 'out') self.hide()
+    }, self.options.delay.hide)
+  }
+
+  Tooltip.prototype.show = function () {
+    var e = $.Event('show.bs.'+ this.type)
+
+    if (this.hasContent() && this.enabled) {
+      this.$element.trigger(e)
+
+      if (e.isDefaultPrevented()) return
+
+      var $tip = this.tip()
+
+      this.setContent()
+
+      if (this.options.animation) $tip.addClass('fade')
+
+      var placement = typeof this.options.placement == 'function' ?
+        this.options.placement.call(this, $tip[0], this.$element[0]) :
+        this.options.placement
+
+      var autoToken = /\s?auto?\s?/i
+      var autoPlace = autoToken.test(placement)
+      if (autoPlace) placement = placement.replace(autoToken, '') || 'top'
+
+      $tip
+        .detach()
+        .css({ top: 0, left: 0, display: 'block' })
+        .addClass(placement)
+
+      this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
+
+      var pos          = this.getPosition()
+      var actualWidth  = $tip[0].offsetWidth
+      var actualHeight = $tip[0].offsetHeight
+
+      if (autoPlace) {
+        var $parent = this.$element.parent()
+
+        var orgPlacement = placement
+        var docScroll    = document.documentElement.scrollTop || document.body.scrollTop
+        var parentWidth  = this.options.container == 'body' ? window.innerWidth  : $parent.outerWidth()
+        var parentHeight = this.options.container == 'body' ? window.innerHeight : $parent.outerHeight()
+        var parentLeft   = this.options.container == 'body' ? 0 : $parent.offset().left
+
+        placement = placement == 'bottom' && pos.top   + pos.height  + actualHeight - docScroll > parentHeight  ? 'top'    :
+                    placement == 'top'    && pos.top   - docScroll   - actualHeight < 0                         ? 'bottom' :
+                    placement == 'right'  && pos.right + actualWidth > parentWidth                              ? 'left'   :
+                    placement == 'left'   && pos.left  - actualWidth < parentLeft                               ? 'right'  :
+                    placement
+
+        $tip
+          .removeClass(orgPlacement)
+          .addClass(placement)
+      }
+
+      var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight)
+
+      this.applyPlacement(calculatedOffset, placement)
+      this.$element.trigger('shown.bs.' + this.type)
+    }
+  }
+
+  Tooltip.prototype.applyPlacement = function(offset, placement) {
+    var replace
+    var $tip   = this.tip()
+    var width  = $tip[0].offsetWidth
+    var height = $tip[0].offsetHeight
+
+    // manually read margins because getBoundingClientRect includes difference
+    var marginTop = parseInt($tip.css('margin-top'), 10)
+    var marginLeft = parseInt($tip.css('margin-left'), 10)
+
+    // we must check for NaN for ie 8/9
+    if (isNaN(marginTop))  marginTop  = 0
+    if (isNaN(marginLeft)) marginLeft = 0
+
+    offset.top  = offset.top  + marginTop
+    offset.left = offset.left + marginLeft
+
+    $tip
+      .offset(offset)
+      .addClass('in')
+
+    // check to see if placing tip in new offset caused the tip to resize itself
+    var actualWidth  = $tip[0].offsetWidth
+    var actualHeight = $tip[0].offsetHeight
+
+    if (placement == 'top' && actualHeight != height) {
+      replace = true
+      offset.top = offset.top + height - actualHeight
+    }
+
+    if (/bottom|top/.test(placement)) {
+      var delta = 0
+
+      if (offset.left < 0) {
+        delta       = offset.left * -2
+        offset.left = 0
+
+        $tip.offset(offset)
+
+        actualWidth  = $tip[0].offsetWidth
+        actualHeight = $tip[0].offsetHeight
+      }
+
+      this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
+    } else {
+      this.replaceArrow(actualHeight - height, actualHeight, 'top')
+    }
+
+    if (replace) $tip.offset(offset)
+  }
+
+  Tooltip.prototype.replaceArrow = function(delta, dimension, position) {
+    this.arrow().css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
+  }
+
+  Tooltip.prototype.setContent = function () {
+    var $tip  = this.tip()
+    var title = this.getTitle()
+
+    $tip.find('.tooltip-inner')[this.options.html ? 'html' : 'text'](title)
+    $tip.removeClass('fade in top bottom left right')
+  }
+
+  Tooltip.prototype.hide = function () {
+    var that = this
+    var $tip = this.tip()
+    var e    = $.Event('hide.bs.' + this.type)
+
+    function complete() {
+      if (that.hoverState != 'in') $tip.detach()
+    }
+
+    this.$element.trigger(e)
+
+    if (e.isDefaultPrevented()) return
+
+    $tip.removeClass('in')
+
+    $.support.transition && this.$tip.hasClass('fade') ?
+      $tip
+        .one($.support.transition.end, complete)
+        .emulateTransitionEnd(150) :
+      complete()
+
+    this.$element.trigger('hidden.bs.' + this.type)
+
+    return this
+  }
+
+  Tooltip.prototype.fixTitle = function () {
+    var $e = this.$element
+    if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {
+      $e.attr('data-original-title', $e.attr('title') || '').attr('title', '')
+    }
+  }
+
+  Tooltip.prototype.hasContent = function () {
+    return this.getTitle()
+  }
+
+  Tooltip.prototype.getPosition = function () {
+    var el = this.$element[0]
+    return $.extend({}, (typeof el.getBoundingClientRect == 'function') ? el.getBoundingClientRect() : {
+      width: el.offsetWidth
+    , height: el.offsetHeight
+    }, this.$element.offset())
+  }
+
+  Tooltip.prototype.getCalculatedOffset = function (placement, pos, actualWidth, actualHeight) {
+    return placement == 'bottom' ? { top: pos.top + pos.height,   left: pos.left + pos.width / 2 - actualWidth / 2  } :
+           placement == 'top'    ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2  } :
+           placement == 'left'   ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
+        /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width   }
+  }
+
+  Tooltip.prototype.getTitle = function () {
+    var title
+    var $e = this.$element
+    var o  = this.options
+
+    title = $e.attr('data-original-title')
+      || (typeof o.title == 'function' ? o.title.call($e[0]) :  o.title)
+
+    return title
+  }
+
+  Tooltip.prototype.tip = function () {
+    return this.$tip = this.$tip || $(this.options.template)
+  }
+
+  Tooltip.prototype.arrow = function () {
+    return this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow')
+  }
+
+  Tooltip.prototype.validate = function () {
+    if (!this.$element[0].parentNode) {
+      this.hide()
+      this.$element = null
+      this.options  = null
+    }
+  }
+
+  Tooltip.prototype.enable = function () {
+    this.enabled = true
+  }
+
+  Tooltip.prototype.disable = function () {
+    this.enabled = false
+  }
+
+  Tooltip.prototype.toggleEnabled = function () {
+    this.enabled = !this.enabled
+  }
+
+  Tooltip.prototype.toggle = function (e) {
+    var self = e ? $(e.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type) : this
+    self.tip().hasClass('in') ? self.leave(self) : self.enter(self)
+  }
+
+  Tooltip.prototype.destroy = function () {
+    this.hide().$element.off('.' + this.type).removeData('bs.' + this.type)
+  }
+
+
+  // TOOLTIP PLUGIN DEFINITION
+  // =========================
+
+  var old = $.fn.tooltip
+
+  $.fn.tooltip = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.tooltip')
+      var options = typeof option == 'object' && option
+
+      if (!data) $this.data('bs.tooltip', (data = new Tooltip(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  $.fn.tooltip.Constructor = Tooltip
+
+
+  // TOOLTIP NO CONFLICT
+  // ===================
+
+  $.fn.tooltip.noConflict = function () {
+    $.fn.tooltip = old
+    return this
+  }
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: popover.js v3.0.2
+ * http://getbootstrap.com/javascript/#popovers
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // POPOVER PUBLIC CLASS DEFINITION
+  // ===============================
+
+  var Popover = function (element, options) {
+    this.init('popover', element, options)
+  }
+
+  if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')
+
+  Popover.DEFAULTS = $.extend({} , $.fn.tooltip.Constructor.DEFAULTS, {
+    placement: 'right'
+  , trigger: 'click'
+  , content: ''
+  , template: '<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
+  })
+
+
+  // NOTE: POPOVER EXTENDS tooltip.js
+  // ================================
+
+  Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype)
+
+  Popover.prototype.constructor = Popover
+
+  Popover.prototype.getDefaults = function () {
+    return Popover.DEFAULTS
+  }
+
+  Popover.prototype.setContent = function () {
+    var $tip    = this.tip()
+    var title   = this.getTitle()
+    var content = this.getContent()
+
+    $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
+    $tip.find('.popover-content')[this.options.html ? 'html' : 'text'](content)
+
+    $tip.removeClass('fade top bottom left right in')
+
+    // IE8 doesn't accept hiding via the `:empty` pseudo selector, we have to do
+    // this manually by checking the contents.
+    if (!$tip.find('.popover-title').html()) $tip.find('.popover-title').hide()
+  }
+
+  Popover.prototype.hasContent = function () {
+    return this.getTitle() || this.getContent()
+  }
+
+  Popover.prototype.getContent = function () {
+    var $e = this.$element
+    var o  = this.options
+
+    return $e.attr('data-content')
+      || (typeof o.content == 'function' ?
+            o.content.call($e[0]) :
+            o.content)
+  }
+
+  Popover.prototype.arrow = function () {
+    return this.$arrow = this.$arrow || this.tip().find('.arrow')
+  }
+
+  Popover.prototype.tip = function () {
+    if (!this.$tip) this.$tip = $(this.options.template)
+    return this.$tip
+  }
+
+
+  // POPOVER PLUGIN DEFINITION
+  // =========================
+
+  var old = $.fn.popover
+
+  $.fn.popover = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.popover')
+      var options = typeof option == 'object' && option
+
+      if (!data) $this.data('bs.popover', (data = new Popover(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  $.fn.popover.Constructor = Popover
+
+
+  // POPOVER NO CONFLICT
+  // ===================
+
+  $.fn.popover.noConflict = function () {
+    $.fn.popover = old
+    return this
+  }
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: scrollspy.js v3.0.2
+ * http://getbootstrap.com/javascript/#scrollspy
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // SCROLLSPY CLASS DEFINITION
+  // ==========================
+
+  function ScrollSpy(element, options) {
+    var href
+    var process  = $.proxy(this.process, this)
+
+    this.$element       = $(element).is('body') ? $(window) : $(element)
+    this.$body          = $('body')
+    this.$scrollElement = this.$element.on('scroll.bs.scroll-spy.data-api', process)
+    this.options        = $.extend({}, ScrollSpy.DEFAULTS, options)
+    this.selector       = (this.options.target
+      || ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
+      || '') + ' .nav li > a'
+    this.offsets        = $([])
+    this.targets        = $([])
+    this.activeTarget   = null
+
+    this.refresh()
+    this.process()
+  }
+
+  ScrollSpy.DEFAULTS = {
+    offset: 10
+  }
+
+  ScrollSpy.prototype.refresh = function () {
+    var offsetMethod = this.$element[0] == window ? 'offset' : 'position'
+
+    this.offsets = $([])
+    this.targets = $([])
+
+    var self     = this
+    var $targets = this.$body
+      .find(this.selector)
+      .map(function () {
+        var $el   = $(this)
+        var href  = $el.data('target') || $el.attr('href')
+        var $href = /^#\w/.test(href) && $(href)
+
+        return ($href
+          && $href.length
+          && [[ $href[offsetMethod]().top + (!$.isWindow(self.$scrollElement.get(0)) && self.$scrollElement.scrollTop()), href ]]) || null
+      })
+      .sort(function (a, b) { return a[0] - b[0] })
+      .each(function () {
+        self.offsets.push(this[0])
+        self.targets.push(this[1])
+      })
+  }
+
+  ScrollSpy.prototype.process = function () {
+    var scrollTop    = this.$scrollElement.scrollTop() + this.options.offset
+    var scrollHeight = this.$scrollElement[0].scrollHeight || this.$body[0].scrollHeight
+    var maxScroll    = scrollHeight - this.$scrollElement.height()
+    var offsets      = this.offsets
+    var targets      = this.targets
+    var activeTarget = this.activeTarget
+    var i
+
+    if (scrollTop >= maxScroll) {
+      return activeTarget != (i = targets.last()[0]) && this.activate(i)
+    }
+
+    for (i = offsets.length; i--;) {
+      activeTarget != targets[i]
+        && scrollTop >= offsets[i]
+        && (!offsets[i + 1] || scrollTop <= offsets[i + 1])
+        && this.activate( targets[i] )
+    }
+  }
+
+  ScrollSpy.prototype.activate = function (target) {
+    this.activeTarget = target
+
+    $(this.selector)
+      .parents('.active')
+      .removeClass('active')
+
+    var selector = this.selector
+      + '[data-target="' + target + '"],'
+      + this.selector + '[href="' + target + '"]'
+
+    var active = $(selector)
+      .parents('li')
+      .addClass('active')
+
+    if (active.parent('.dropdown-menu').length)  {
+      active = active
+        .closest('li.dropdown')
+        .addClass('active')
+    }
+
+    active.trigger('activate')
+  }
+
+
+  // SCROLLSPY PLUGIN DEFINITION
+  // ===========================
+
+  var old = $.fn.scrollspy
+
+  $.fn.scrollspy = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.scrollspy')
+      var options = typeof option == 'object' && option
+
+      if (!data) $this.data('bs.scrollspy', (data = new ScrollSpy(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  $.fn.scrollspy.Constructor = ScrollSpy
+
+
+  // SCROLLSPY NO CONFLICT
+  // =====================
+
+  $.fn.scrollspy.noConflict = function () {
+    $.fn.scrollspy = old
+    return this
+  }
+
+
+  // SCROLLSPY DATA-API
+  // ==================
+
+  $(window).on('load', function () {
+    $('[data-spy="scroll"]').each(function () {
+      var $spy = $(this)
+      $spy.scrollspy($spy.data())
+    })
+  })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: tab.js v3.0.2
+ * http://getbootstrap.com/javascript/#tabs
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // TAB CLASS DEFINITION
+  // ====================
+
+  var Tab = function (element) {
+    this.element = $(element)
+  }
+
+  Tab.prototype.show = function () {
+    var $this    = this.element
+    var $ul      = $this.closest('ul:not(.dropdown-menu)')
+    var selector = $this.data('target')
+
+    if (!selector) {
+      selector = $this.attr('href')
+      selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
+    }
+
+    if ($this.parent('li').hasClass('active')) return
+
+    var previous = $ul.find('.active:last a')[0]
+    var e        = $.Event('show.bs.tab', {
+      relatedTarget: previous
+    })
+
+    $this.trigger(e)
+
+    if (e.isDefaultPrevented()) return
+
+    var $target = $(selector)
+
+    this.activate($this.parent('li'), $ul)
+    this.activate($target, $target.parent(), function () {
+      $this.trigger({
+        type: 'shown.bs.tab'
+      , relatedTarget: previous
+      })
+    })
+  }
+
+  Tab.prototype.activate = function (element, container, callback) {
+    var $active    = container.find('> .active')
+    var transition = callback
+      && $.support.transition
+      && $active.hasClass('fade')
+
+    function next() {
+      $active
+        .removeClass('active')
+        .find('> .dropdown-menu > .active')
+        .removeClass('active')
+
+      element.addClass('active')
+
+      if (transition) {
+        element[0].offsetWidth // reflow for transition
+        element.addClass('in')
+      } else {
+        element.removeClass('fade')
+      }
+
+      if (element.parent('.dropdown-menu')) {
+        element.closest('li.dropdown').addClass('active')
+      }
+
+      callback && callback()
+    }
+
+    transition ?
+      $active
+        .one($.support.transition.end, next)
+        .emulateTransitionEnd(150) :
+      next()
+
+    $active.removeClass('in')
+  }
+
+
+  // TAB PLUGIN DEFINITION
+  // =====================
+
+  var old = $.fn.tab
+
+  $.fn.tab = function ( option ) {
+    return this.each(function () {
+      var $this = $(this)
+      var data  = $this.data('bs.tab')
+
+      if (!data) $this.data('bs.tab', (data = new Tab(this)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  $.fn.tab.Constructor = Tab
+
+
+  // TAB NO CONFLICT
+  // ===============
+
+  $.fn.tab.noConflict = function () {
+    $.fn.tab = old
+    return this
+  }
+
+
+  // TAB DATA-API
+  // ============
+
+  $(document).on('click.bs.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
+    e.preventDefault()
+    $(this).tab('show')
+  })
+
+}(jQuery);
+
+/* ========================================================================
+ * Bootstrap: affix.js v3.0.2
+ * http://getbootstrap.com/javascript/#affix
+ * ========================================================================
+ * Copyright 2013 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ======================================================================== */
+
+
++function ($) { "use strict";
+
+  // AFFIX CLASS DEFINITION
+  // ======================
+
+  var Affix = function (element, options) {
+    this.options = $.extend({}, Affix.DEFAULTS, options)
+    this.$window = $(window)
+      .on('scroll.bs.affix.data-api', $.proxy(this.checkPosition, this))
+      .on('click.bs.affix.data-api',  $.proxy(this.checkPositionWithEventLoop, this))
+
+    this.$element = $(element)
+    this.affixed  =
+    this.unpin    = null
+
+    this.checkPosition()
+  }
+
+  Affix.RESET = 'affix affix-top affix-bottom'
+
+  Affix.DEFAULTS = {
+    offset: 0
+  }
+
+  Affix.prototype.checkPositionWithEventLoop = function () {
+    setTimeout($.proxy(this.checkPosition, this), 1)
+  }
+
+  Affix.prototype.checkPosition = function () {
+    if (!this.$element.is(':visible')) return
+
+    var scrollHeight = $(document).height()
+    var scrollTop    = this.$window.scrollTop()
+    var position     = this.$element.offset()
+    var offset       = this.options.offset
+    var offsetTop    = offset.top
+    var offsetBottom = offset.bottom
+
+    if (typeof offset != 'object')         offsetBottom = offsetTop = offset
+    if (typeof offsetTop == 'function')    offsetTop    = offset.top()
+    if (typeof offsetBottom == 'function') offsetBottom = offset.bottom()
+
+    var affix = this.unpin   != null && (scrollTop + this.unpin <= position.top) ? false :
+                offsetBottom != null && (position.top + this.$element.height() >= scrollHeight - offsetBottom) ? 'bottom' :
+                offsetTop    != null && (scrollTop <= offsetTop) ? 'top' : false
+
+    if (this.affixed === affix) return
+    if (this.unpin) this.$element.css('top', '')
+
+    this.affixed = affix
+    this.unpin   = affix == 'bottom' ? position.top - scrollTop : null
+
+    this.$element.removeClass(Affix.RESET).addClass('affix' + (affix ? '-' + affix : ''))
+
+    if (affix == 'bottom') {
+      this.$element.offset({ top: document.body.offsetHeight - offsetBottom - this.$element.height() })
+    }
+  }
+
+
+  // AFFIX PLUGIN DEFINITION
+  // =======================
+
+  var old = $.fn.affix
+
+  $.fn.affix = function (option) {
+    return this.each(function () {
+      var $this   = $(this)
+      var data    = $this.data('bs.affix')
+      var options = typeof option == 'object' && option
+
+      if (!data) $this.data('bs.affix', (data = new Affix(this, options)))
+      if (typeof option == 'string') data[option]()
+    })
+  }
+
+  $.fn.affix.Constructor = Affix
+
+
+  // AFFIX NO CONFLICT
+  // =================
+
+  $.fn.affix.noConflict = function () {
+    $.fn.affix = old
+    return this
+  }
+
+
+  // AFFIX DATA-API
+  // ==============
+
+  $(window).on('load', function () {
+    $('[data-spy="affix"]').each(function () {
+      var $spy = $(this)
+      var data = $spy.data()
+
+      data.offset = data.offset || {}
+
+      if (data.offsetBottom) data.offset.bottom = data.offsetBottom
+      if (data.offsetTop)    data.offset.top    = data.offsetTop
+
+      $spy.affix(data)
+    })
+  })
+
+}(jQuery);

diff --git a/src/web/js/bootstrap.min.js b/src/web/js/bootstrap.min.js
new file mode 100644
index 0000000..0e668e8
--- /dev/null
+++ b/src/web/js/bootstrap.min.js
@@ -0,0 +1,9 @@
+/*!
+ * Bootstrap v3.0.2 by @fat and @mdo
+ * Copyright 2013 Twitter, Inc.
+ * Licensed under http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Designed and built with all the love in the world by @mdo and @fat.
+ */
+
+if("undefined"==typeof jQuery)throw new Error("Bootstrap requires jQuery");+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]}}a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one(a.support.transition.end,function(){c=!0});var e=function(){c||a(d).trigger(a.support.transition.end)};return setTimeout(e,b),this},a(function(){a.support.transition=b()})}(jQuery),+function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function c(){f.trigger("closed.bs.alert").remove()}var d=a(this),e=d.attr("data-target");e||(e=d.attr("href"),e=e&&e.replace(/.*(?=#[^\s]*$)/,""));var f=a(e);b&&b.preventDefault(),f.length||(f=d.hasClass("alert")?d:d.parent()),f.trigger(b=a.Event("close.bs.alert")),b.isDefaultPrevented()||(f.removeClass("in"),a.support.transition&&f.hasClass("fade")?f.one(a.support.transition.end,c).emulateTransitionEnd(150):c())};var d=a.fn.alert;a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("bs.alert");e||d.data("bs.alert",e=new c(this)),"string"==typeof b&&e[b].call(d)})},a.fn.alert.Constructor=c,a.fn.alert.noConflict=function(){return a.fn.alert=d,this},a(document).on("click.bs.alert.data-api",b,c.prototype.close)}(jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d)};b.DEFAULTS={loadingText:"loading..."},b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.is("input")?"val":"html",e=c.data();a+="Text",e.resetText||c.data("resetText",c[d]()),c[d](e[a]||this.options[a]),setTimeout(function(){"loadingText"==a?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.closest('[data-toggle="buttons"]');if(a.length){var b=this.$element.find("input").prop("checked",!this.$element.hasClass("active")).trigger("change");"radio"===b.prop("type")&&a.find(".active").removeClass("active")}this.$element.toggleClass("active")};var c=a.fn.button;a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("bs.button"),f="object"==typeof c&&c;e||d.data("bs.button",e=new b(this,f)),"toggle"==c?e.toggle():c&&e.setState(c)})},a.fn.button.Constructor=b,a.fn.button.noConflict=function(){return a.fn.button=c,this},a(document).on("click.bs.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle"),b.preventDefault()})}(jQuery),+function(a){"use strict";var b=function(b,c){this.$element=a(b),this.$indicators=this.$element.find(".carousel-indicators"),this.options=c,this.paused=this.sliding=this.interval=this.$active=this.$items=null,"hover"==this.options.pause&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.DEFAULTS={interval:5e3,pause:"hover",wrap:!0},b.prototype.cycle=function(b){return b||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},b.prototype.getActiveIndex=function(){return this.$active=this.$element.find(".item.active"),this.$items=this.$active.parent().children(),this.$items.index(this.$active)},b.prototype.to=function(b){var c=this,d=this.getActiveIndex();return b>this.$items.length-1||0>b?void 0:this.sliding?this.$element.one("slid",function(){c.to(b)}):d==b?this.pause().cycle():this.slide(b>d?"next":"prev",a(this.$items[b]))},b.prototype.pause=function(b){return b||(this.paused=!0),this.$element.find(".next, .prev").length&&a.support.transition.end&&(this.$element.trigger(a.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},b.prototype.next=function(){return this.sliding?void 0:this.slide("next")},b.prototype.prev=function(){return this.sliding?void 0:this.slide("prev")},b.prototype.slide=function(b,c){var d=this.$element.find(".item.active"),e=c||d[b](),f=this.interval,g="next"==b?"left":"right",h="next"==b?"first":"last",i=this;if(!e.length){if(!this.options.wrap)return;e=this.$element.find(".item")[h]()}this.sliding=!0,f&&this.pause();var j=a.Event("slide.bs.carousel",{relatedTarget:e[0],direction:g});if(!e.hasClass("active")){if(this.$indicators.length&&(this.$indicators.find(".active").removeClass("active"),this.$element.one("slid",function(){var b=a(i.$indicators.children()[i.getActiveIndex()]);b&&b.addClass("active")})),a.support.transition&&this.$element.hasClass("slide")){if(this.$element.trigger(j),j.isDefaultPrevented())return;e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),d.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid")},0)}).emulateTransitionEnd(600)}else{if(this.$element.trigger(j),j.isDefaultPrevented())return;d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid")}return f&&this.cycle(),this}};var c=a.fn.carousel;a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("bs.carousel"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c),g="string"==typeof c?c:f.slide;e||d.data("bs.carousel",e=new b(this,f)),"number"==typeof c?e.to(c):g?e[g]():f.interval&&e.pause().cycle()})},a.fn.carousel.Constructor=b,a.fn.carousel.noConflict=function(){return a.fn.carousel=c,this},a(document).on("click.bs.carousel.data-api","[data-slide], [data-slide-to]",function(b){var c,d=a(this),e=a(d.attr("data-target")||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,"")),f=a.extend({},e.data(),d.data()),g=d.attr("data-slide-to");g&&(f.interval=!1),e.carousel(f),(g=d.attr("data-slide-to"))&&e.data("bs.carousel").to(g),b.preventDefault()}),a(window).on("load",function(){a('[data-ride="carousel"]').each(function(){var b=a(this);b.carousel(b.data())})})}(jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d),this.transitioning=null,this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.DEFAULTS={toggle:!0},b.prototype.dimension=function(){var a=this.$element.hasClass("width");return a?"width":"height"},b.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var b=a.Event("show.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.$parent&&this.$parent.find("> .panel > .in");if(c&&c.length){var d=c.data("bs.collapse");if(d&&d.transitioning)return;c.collapse("hide"),d||c.data("bs.collapse",null)}var e=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[e](0),this.transitioning=1;var f=function(){this.$element.removeClass("collapsing").addClass("in")[e]("auto"),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!a.support.transition)return f.call(this);var g=a.camelCase(["scroll",e].join("-"));this.$element.one(a.support.transition.end,a.proxy(f,this)).emulateTransitionEnd(350)[e](this.$element[0][g])}}},b.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var b=a.Event("hide.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.dimension();this.$element[c](this.$element[c]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"),this.transitioning=1;var d=function(){this.transitioning=0,this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse")};return a.support.transition?(this.$element[c](0).one(a.support.transition.end,a.proxy(d,this)).emulateTransitionEnd(350),void 0):d.call(this)}}},b.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()};var c=a.fn.collapse;a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("bs.collapse"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c);e||d.data("bs.collapse",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.collapse.Constructor=b,a.fn.collapse.noConflict=function(){return a.fn.collapse=c,this},a(document).on("click.bs.collapse.data-api","[data-toggle=collapse]",function(b){var c,d=a(this),e=d.attr("data-target")||b.preventDefault()||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,""),f=a(e),g=f.data("bs.collapse"),h=g?"toggle":d.data(),i=d.attr("data-parent"),j=i&&a(i);g&&g.transitioning||(j&&j.find('[data-toggle=collapse][data-parent="'+i+'"]').not(d).addClass("collapsed"),d[f.hasClass("in")?"addClass":"removeClass"]("collapsed")),f.collapse(h)})}(jQuery),+function(a){"use strict";function b(){a(d).remove(),a(e).each(function(b){var d=c(a(this));d.hasClass("open")&&(d.trigger(b=a.Event("hide.bs.dropdown")),b.isDefaultPrevented()||d.removeClass("open").trigger("hidden.bs.dropdown"))})}function c(b){var c=b.attr("data-target");c||(c=b.attr("href"),c=c&&/#/.test(c)&&c.replace(/.*(?=#[^\s]*$)/,""));var d=c&&a(c);return d&&d.length?d:b.parent()}var d=".dropdown-backdrop",e="[data-toggle=dropdown]",f=function(b){a(b).on("click.bs.dropdown",this.toggle)};f.prototype.toggle=function(d){var e=a(this);if(!e.is(".disabled, :disabled")){var f=c(e),g=f.hasClass("open");if(b(),!g){if("ontouchstart"in document.documentElement&&!f.closest(".navbar-nav").length&&a('<div class="dropdown-backdrop"/>').insertAfter(a(this)).on("click",b),f.trigger(d=a.Event("show.bs.dropdown")),d.isDefaultPrevented())return;f.toggleClass("open").trigger("shown.bs.dropdown"),e.focus()}return!1}},f.prototype.keydown=function(b){if(/(38|40|27)/.test(b.keyCode)){var d=a(this);if(b.preventDefault(),b.stopPropagation(),!d.is(".disabled, :disabled")){var f=c(d),g=f.hasClass("open");if(!g||g&&27==b.keyCode)return 27==b.which&&f.find(e).focus(),d.click();var h=a("[role=menu] li:not(.divider):visible a",f);if(h.length){var i=h.index(h.filter(":focus"));38==b.keyCode&&i>0&&i--,40==b.keyCode&&i<h.length-1&&i++,~i||(i=0),h.eq(i).focus()}}}};var g=a.fn.dropdown;a.fn.dropdown=function(b){return this.each(function(){var c=a(this),d=c.data("dropdown");d||c.data("dropdown",d=new f(this)),"string"==typeof b&&d[b].call(c)})},a.fn.dropdown.Constructor=f,a.fn.dropdown.noConflict=function(){return a.fn.dropdown=g,this},a(document).on("click.bs.dropdown.data-api",b).on("click.bs.dropdown.data-api",".dropdown form",function(a){a.stopPropagation()}).on("click.bs.dropdown.data-api",e,f.prototype.toggle).on("keydown.bs.dropdown.data-api",e+", [role=menu]",f.prototype.keydown)}(jQuery),+function(a){"use strict";var b=function(b,c){this.options=c,this.$element=a(b),this.$backdrop=this.isShown=null,this.options.remote&&this.$element.load(this.options.remote)};b.DEFAULTS={backdrop:!0,keyboard:!0,show:!0},b.prototype.toggle=function(a){return this[this.isShown?"hide":"show"](a)},b.prototype.show=function(b){var c=this,d=a.Event("show.bs.modal",{relatedTarget:b});this.$element.trigger(d),this.isShown||d.isDefaultPrevented()||(this.isShown=!0,this.escape(),this.$element.on("click.dismiss.modal",'[data-dismiss="modal"]',a.proxy(this.hide,this)),this.backdrop(function(){var d=a.support.transition&&c.$element.hasClass("fade");c.$element.parent().length||c.$element.appendTo(document.body),c.$element.show(),d&&c.$element[0].offsetWidth,c.$element.addClass("in").attr("aria-hidden",!1),c.enforceFocus();var e=a.Event("shown.bs.modal",{relatedTarget:b});d?c.$element.find(".modal-dialog").one(a.support.transition.end,function(){c.$element.focus().trigger(e)}).emulateTransitionEnd(300):c.$element.focus().trigger(e)}))},b.prototype.hide=function(b){b&&b.preventDefault(),b=a.Event("hide.bs.modal"),this.$element.trigger(b),this.isShown&&!b.isDefaultPrevented()&&(this.isShown=!1,this.escape(),a(document).off("focusin.bs.modal"),this.$element.removeClass("in").attr("aria-hidden",!0).off("click.dismiss.modal"),a.support.transition&&this.$element.hasClass("fade")?this.$element.one(a.support.transition.end,a.proxy(this.hideModal,this)).emulateTransitionEnd(300):this.hideModal())},b.prototype.enforceFocus=function(){a(document).off("focusin.bs.modal").on("focusin.bs.modal",a.proxy(function(a){this.$element[0]===a.target||this.$element.has(a.target).length||this.$element.focus()},this))},b.prototype.escape=function(){this.isShown&&this.options.keyboard?this.$element.on("keyup.dismiss.bs.modal",a.proxy(function(a){27==a.which&&this.hide()},this)):this.isShown||this.$element.off("keyup.dismiss.bs.modal")},b.prototype.hideModal=function(){var a=this;this.$element.hide(),this.backdrop(function(){a.removeBackdrop(),a.$element.trigger("hidden.bs.modal")})},b.prototype.removeBackdrop=function(){this.$backdrop&&this.$backdrop.remove(),this.$backdrop=null},b.prototype.backdrop=function(b){var c=this.$element.hasClass("fade")?"fade":"";if(this.isShown&&this.options.backdrop){var d=a.support.transition&&c;if(this.$backdrop=a('<div class="modal-backdrop '+c+'" />').appendTo(document.body),this.$element.on("click.dismiss.modal",a.proxy(function(a){a.target===a.currentTarget&&("static"==this.options.backdrop?this.$element[0].focus.call(this.$element[0]):this.hide.call(this))},this)),d&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),!b)return;d?this.$backdrop.one(a.support.transition.end,b).emulateTransitionEnd(150):b()}else!this.isShown&&this.$backdrop?(this.$backdrop.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one(a.support.transition.end,b).emulateTransitionEnd(150):b()):b&&b()};var c=a.fn.modal;a.fn.modal=function(c,d){return this.each(function(){var e=a(this),f=e.data("bs.modal"),g=a.extend({},b.DEFAULTS,e.data(),"object"==typeof c&&c);f||e.data("bs.modal",f=new b(this,g)),"string"==typeof c?f[c](d):g.show&&f.show(d)})},a.fn.modal.Constructor=b,a.fn.modal.noConflict=function(){return a.fn.modal=c,this},a(document).on("click.bs.modal.data-api",'[data-toggle="modal"]',function(b){var c=a(this),d=c.attr("href"),e=a(c.attr("data-target")||d&&d.replace(/.*(?=#[^\s]+$)/,"")),f=e.data("modal")?"toggle":a.extend({remote:!/#/.test(d)&&d},e.data(),c.data());b.preventDefault(),e.modal(f,this).one("hide",function(){c.is(":visible")&&c.focus()})}),a(document).on("show.bs.modal",".modal",function(){a(document.body).addClass("modal-open")}).on("hidden.bs.modal",".modal",function(){a(document.body).removeClass("modal-open")})}(jQuery),+function(a){"use strict";var b=function(a,b){this.type=this.options=this.enabled=this.timeout=this.hoverState=this.$element=null,this.init("tooltip",a,b)};b.DEFAULTS={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover focus",title:"",delay:0,html:!1,container:!1},b.prototype.init=function(b,c,d){this.enabled=!0,this.type=b,this.$element=a(c),this.options=this.getOptions(d);for(var e=this.options.trigger.split(" "),f=e.length;f--;){var g=e[f];if("click"==g)this.$element.on("click."+this.type,this.options.selector,a.proxy(this.toggle,this));else if("manual"!=g){var h="hover"==g?"mouseenter":"focus",i="hover"==g?"mouseleave":"blur";this.$element.on(h+"."+this.type,this.options.selector,a.proxy(this.enter,this)),this.$element.on(i+"."+this.type,this.options.selector,a.proxy(this.leave,this))}}this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.getOptions=function(b){return b=a.extend({},this.getDefaults(),this.$element.data(),b),b.delay&&"number"==typeof b.delay&&(b.delay={show:b.delay,hide:b.delay}),b},b.prototype.getDelegateOptions=function(){var b={},c=this.getDefaults();return this._options&&a.each(this._options,function(a,d){c[a]!=d&&(b[a]=d)}),b},b.prototype.enter=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs."+this.type);return clearTimeout(c.timeout),c.hoverState="in",c.options.delay&&c.options.delay.show?(c.timeout=setTimeout(function(){"in"==c.hoverState&&c.show()},c.options.delay.show),void 0):c.show()},b.prototype.leave=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs."+this.type);return clearTimeout(c.timeout),c.hoverState="out",c.options.delay&&c.options.delay.hide?(c.timeout=setTimeout(function(){"out"==c.hoverState&&c.hide()},c.options.delay.hide),void 0):c.hide()},b.prototype.show=function(){var b=a.Event("show.bs."+this.type);if(this.hasContent()&&this.enabled){if(this.$element.trigger(b),b.isDefaultPrevented())return;var c=this.tip();this.setContent(),this.options.animation&&c.addClass("fade");var d="function"==typeof this.options.placement?this.options.placement.call(this,c[0],this.$element[0]):this.options.placement,e=/\s?auto?\s?/i,f=e.test(d);f&&(d=d.replace(e,"")||"top"),c.detach().css({top:0,left:0,display:"block"}).addClass(d),this.options.container?c.appendTo(this.options.container):c.insertAfter(this.$element);var g=this.getPosition(),h=c[0].offsetWidth,i=c[0].offsetHeight;if(f){var j=this.$element.parent(),k=d,l=document.documentElement.scrollTop||document.body.scrollTop,m="body"==this.options.container?window.innerWidth:j.outerWidth(),n="body"==this.options.container?window.innerHeight:j.outerHeight(),o="body"==this.options.container?0:j.offset().left;d="bottom"==d&&g.top+g.height+i-l>n?"top":"top"==d&&g.top-l-i<0?"bottom":"right"==d&&g.right+h>m?"left":"left"==d&&g.left-h<o?"right":d,c.removeClass(k).addClass(d)}var p=this.getCalculatedOffset(d,g,h,i);this.applyPlacement(p,d),this.$element.trigger("shown.bs."+this.type)}},b.prototype.applyPlacement=function(a,b){var c,d=this.tip(),e=d[0].offsetWidth,f=d[0].offsetHeight,g=parseInt(d.css("margin-top"),10),h=parseInt(d.css("margin-left"),10);isNaN(g)&&(g=0),isNaN(h)&&(h=0),a.top=a.top+g,a.left=a.left+h,d.offset(a).addClass("in");var i=d[0].offsetWidth,j=d[0].offsetHeight;if("top"==b&&j!=f&&(c=!0,a.top=a.top+f-j),/bottom|top/.test(b)){var k=0;a.left<0&&(k=-2*a.left,a.left=0,d.offset(a),i=d[0].offsetWidth,j=d[0].offsetHeight),this.replaceArrow(k-e+i,i,"left")}else this.replaceArrow(j-f,j,"top");c&&d.offset(a)},b.prototype.replaceArrow=function(a,b,c){this.arrow().css(c,a?50*(1-a/b)+"%":"")},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle();a.find(".tooltip-inner")[this.options.html?"html":"text"](b),a.removeClass("fade in top bottom left right")},b.prototype.hide=function(){function b(){"in"!=c.hoverState&&d.detach()}var c=this,d=this.tip(),e=a.Event("hide.bs."+this.type);return this.$element.trigger(e),e.isDefaultPrevented()?void 0:(d.removeClass("in"),a.support.transition&&this.$tip.hasClass("fade")?d.one(a.support.transition.end,b).emulateTransitionEnd(150):b(),this.$element.trigger("hidden.bs."+this.type),this)},b.prototype.fixTitle=function(){var a=this.$element;(a.attr("title")||"string"!=typeof a.attr("data-original-title"))&&a.attr("data-original-title",a.attr("title")||"").attr("title","")},b.prototype.hasContent=function(){return this.getTitle()},b.prototype.getPosition=function(){var b=this.$element[0];return a.extend({},"function"==typeof b.getBoundingClientRect?b.getBoundingClientRect():{width:b.offsetWidth,height:b.offsetHeight},this.$element.offset())},b.prototype.getCalculatedOffset=function(a,b,c,d){return"bottom"==a?{top:b.top+b.height,left:b.left+b.width/2-c/2}:"top"==a?{top:b.top-d,left:b.left+b.width/2-c/2}:"left"==a?{top:b.top+b.height/2-d/2,left:b.left-c}:{top:b.top+b.height/2-d/2,left:b.left+b.width}},b.prototype.getTitle=function(){var a,b=this.$element,c=this.options;return a=b.attr("data-original-title")||("function"==typeof c.title?c.title.call(b[0]):c.title)},b.prototype.tip=function(){return this.$tip=this.$tip||a(this.options.template)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".tooltip-arrow")},b.prototype.validate=function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},b.prototype.enable=function(){this.enabled=!0},b.prototype.disable=function(){this.enabled=!1},b.prototype.toggleEnabled=function(){this.enabled=!this.enabled},b.prototype.toggle=function(b){var c=b?a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs."+this.type):this;c.tip().hasClass("in")?c.leave(c):c.enter(c)},b.prototype.destroy=function(){this.hide().$element.off("."+this.type).removeData("bs."+this.type)};var c=a.fn.tooltip;a.fn.tooltip=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tooltip"),f="object"==typeof c&&c;e||d.data("bs.tooltip",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.tooltip.Constructor=b,a.fn.tooltip.noConflict=function(){return a.fn.tooltip=c,this}}(jQuery),+function(a){"use strict";var b=function(a,b){this.init("popover",a,b)};if(!a.fn.tooltip)throw new Error("Popover requires tooltip.js");b.DEFAULTS=a.extend({},a.fn.tooltip.Constructor.DEFAULTS,{placement:"right",trigger:"click",content:"",template:'<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'}),b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype),b.prototype.constructor=b,b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.options.html?"html":"text"](b),a.find(".popover-content")[this.options.html?"html":"text"](c),a.removeClass("fade top bottom left right in"),a.find(".popover-title").html()||a.find(".popover-title").hide()},b.prototype.hasContent=function(){return this.getTitle()||this.getContent()},b.prototype.getContent=function(){var a=this.$element,b=this.options;return a.attr("data-content")||("function"==typeof b.content?b.content.call(a[0]):b.content)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".arrow")},b.prototype.tip=function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip};var c=a.fn.popover;a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("bs.popover"),f="object"==typeof c&&c;e||d.data("bs.popover",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.noConflict=function(){return a.fn.popover=c,this}}(jQuery),+function(a){"use strict";function b(c,d){var e,f=a.proxy(this.process,this);this.$element=a(c).is("body")?a(window):a(c),this.$body=a("body"),this.$scrollElement=this.$element.on("scroll.bs.scroll-spy.data-api",f),this.options=a.extend({},b.DEFAULTS,d),this.selector=(this.options.target||(e=a(c).attr("href"))&&e.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.offsets=a([]),this.targets=a([]),this.activeTarget=null,this.refresh(),this.process()}b.DEFAULTS={offset:10},b.prototype.refresh=function(){var b=this.$element[0]==window?"offset":"position";this.offsets=a([]),this.targets=a([]);var c=this;this.$body.find(this.selector).map(function(){var d=a(this),e=d.data("target")||d.attr("href"),f=/^#\w/.test(e)&&a(e);return f&&f.length&&[[f[b]().top+(!a.isWindow(c.$scrollElement.get(0))&&c.$scrollElement.scrollTop()),e]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){c.offsets.push(this[0]),c.targets.push(this[1])})},b.prototype.process=function(){var a,b=this.$scrollElement.scrollTop()+this.options.offset,c=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,d=c-this.$scrollElement.height(),e=this.offsets,f=this.targets,g=this.activeTarget;if(b>=d)return g!=(a=f.last()[0])&&this.activate(a);for(a=e.length;a--;)g!=f[a]&&b>=e[a]&&(!e[a+1]||b<=e[a+1])&&this.activate(f[a])},b.prototype.activate=function(b){this.activeTarget=b,a(this.selector).parents(".active").removeClass("active");var c=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',d=a(c).parents("li").addClass("active");d.parent(".dropdown-menu").length&&(d=d.closest("li.dropdown").addClass("active")),d.trigger("activate")};var c=a.fn.scrollspy;a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("bs.scrollspy"),f="object"==typeof c&&c;e||d.data("bs.scrollspy",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.noConflict=function(){return a.fn.scrollspy=c,this},a(window).on("load",function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(jQuery),+function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype.show=function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.data("target");if(d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),!b.parent("li").hasClass("active")){var e=c.find(".active:last a")[0],f=a.Event("show.bs.tab",{relatedTarget:e});if(b.trigger(f),!f.isDefaultPrevented()){var g=a(d);this.activate(b.parent("li"),c),this.activate(g,g.parent(),function(){b.trigger({type:"shown.bs.tab",relatedTarget:e})})}}},b.prototype.activate=function(b,c,d){function e(){f.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),g?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var f=c.find("> .active"),g=d&&a.support.transition&&f.hasClass("fade");g?f.one(a.support.transition.end,e).emulateTransitionEnd(150):e(),f.removeClass("in")};var c=a.fn.tab;a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tab");e||d.data("bs.tab",e=new b(this)),"string"==typeof c&&e[c]()})},a.fn.tab.Constructor=b,a.fn.tab.noConflict=function(){return a.fn.tab=c,this},a(document).on("click.bs.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})}(jQuery),+function(a){"use strict";var b=function(c,d){this.options=a.extend({},b.DEFAULTS,d),this.$window=a(window).on("scroll.bs.affix.data-api",a.proxy(this.checkPosition,this)).on("click.bs.affix.data-api",a.proxy(this.checkPositionWithEventLoop,this)),this.$element=a(c),this.affixed=this.unpin=null,this.checkPosition()};b.RESET="affix affix-top affix-bottom",b.DEFAULTS={offset:0},b.prototype.checkPositionWithEventLoop=function(){setTimeout(a.proxy(this.checkPosition,this),1)},b.prototype.checkPosition=function(){if(this.$element.is(":visible")){var c=a(document).height(),d=this.$window.scrollTop(),e=this.$element.offset(),f=this.options.offset,g=f.top,h=f.bottom;"object"!=typeof f&&(h=g=f),"function"==typeof g&&(g=f.top()),"function"==typeof h&&(h=f.bottom());var i=null!=this.unpin&&d+this.unpin<=e.top?!1:null!=h&&e.top+this.$element.height()>=c-h?"bottom":null!=g&&g>=d?"top":!1;this.affixed!==i&&(this.unpin&&this.$element.css("top",""),this.affixed=i,this.unpin="bottom"==i?e.top-d:null,this.$element.removeClass(b.RESET).addClass("affix"+(i?"-"+i:"")),"bottom"==i&&this.$element.offset({top:document.body.offsetHeight-h-this.$element.height()}))}};var c=a.fn.affix;a.fn.affix=function(c){return this.each(function(){var d=a(this),e=d.data("bs.affix"),f="object"==typeof c&&c;e||d.data("bs.affix",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.affix.Constructor=b,a.fn.affix.noConflict=function(){return a.fn.affix=c,this},a(window).on("load",function(){a('[data-spy="affix"]').each(function(){var b=a(this),c=b.data();c.offset=c.offset||{},c.offsetBottom&&(c.offset.bottom=c.offsetBottom),c.offsetTop&&(c.offset.top=c.offsetTop),b.affix(c)})})}(jQuery);
\ No newline at end of file

diff --git a/src/web/js/bootstrap-datetimepicker.min.js b/src/web/js/bootstrap-datetimepicker.min.js
new file mode 100644
index 0000000..12d186f
--- /dev/null
+++ b/src/web/js/bootstrap-datetimepicker.min.js
@@ -0,0 +1,28 @@
+/**
+ * version 2.1.11
+ * @license
+ * =========================================================
+ * bootstrap-datetimepicker.js
+ * http://www.eyecon.ro/bootstrap-datepicker
+ * =========================================================
+ * Copyright 2012 Stefan Petre
+ *
+ * Contributions:
+ * - updated for Bootstrap v3 by Jonathan Peterson (@Eonasdan) and (almost)
+ *    completely rewritten to use Momentjs
+ * - based on tarruda's bootstrap-datepicker
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * =========================================================
+ */
+(function(d){if(typeof moment==="undefined"){alert("momentjs is requried");throw new Error("momentjs is requried")}var c=0,a=moment,b=function(g,i){var s={pickDate:true,pickTime:true,startDate:new a({y:1970}),endDate:new a().add(50,"y"),collapse:true,language:"en",defaultDate:"",disabledDates:[],icons:{},useStrict:false},K={time:"glyphicon glyphicon-time",date:"glyphicon glyphicon-calendar",up:"glyphicon glyphicon-chevron-up",down:"glyphicon glyphicon-chevron-down"},q=this,E=function(){var O=false,N,P,M;q.options=d.extend({},s,i);q.options.icons=d.extend({},K,q.options.icons);if(!(q.options.pickTime||q.options.pickDate)){throw new Error("Must choose at least one picker")}q.id=c++;a.lang(q.options.language);q.date=a();q.element=d(g);q.unset=false;q.isInput=q.element.is("input");q.component=false;if(q.element.hasClass("input-group")){if(q.element.find(".datepickerbutton").size()==0){q.component=q.element.find(".input-group-addon")}else{q.component=q.element.find(".datepickerbutton")}}q.format=q.options.format;M=a()._lang._longDateFormat;if(!q.format){if(q.isInput){q.format=q.element.data("format")}else{q.format=q.element.find("input").data("format")}if(!q.format){q.format=(q.options.pickDate?M.L:"");if(q.options.pickDate&&q.options.pickTime){q.format+=" "}q.format+=(q.options.pickTime?M.LT:"")}}q.use24hours=q.format.toLowerCase().indexOf("a")<1;if(q.component){O=q.component.find("span")}if(q.options.pickTime){if(O){O.addClass(q.options.icons.time)}}if(q.options.pickDate){if(O){O.removeClass(q.options.icons.time);O.addClass(q.options.icons.date)}}q.widget=d(I(q.options.pickDate,q.options.pickTime,q.options.collapse)).appendTo("body");q.minViewMode=q.options.minViewMode||q.element.data("date-minviewmode")||0;if(typeof q.minViewMode==="string"){switch(q.minViewMode){case"months":q.minViewMode=1;break;case"years":q.minViewMode=2;break;default:q.minViewMode=0;break}}q.viewMode=q.options.viewMode||q.element.data("date-viewmode")||0;if(typeof q.viewMode==="string"){switch(q.viewMode){case"months":q.viewMode=1;break;case"years":q.viewMode=2;break;default:q.viewMode=0;break}}for(N=0;N<q.options.disabledDates.length;N++){P=q.options.disabledDates[N];P=a(P);if(!P.isValid()){P=a(q.options.startDate).subtract(1,"day")}q.options.disabledDates[N]=P.format("L")}q.startViewMode=q.viewMode;q.setStartDate(q.options.startDate||q.element.data("date-startdate"));q.setEndDate(q.options.endDate||q.element.data("date-enddate"));H();L();l();C();n();f();J();if(q.options.defaultDate!==""){q.setValue(q.options.defaultDate)}},o=function(){var M="absolute",O=q.component?q.component.offset():q.element.offset(),N=d(window);q.width=q.component?q.component.outerWidth():q.element.outerWidth();O.top=O.top+q.element.outerHeight();if(q.options.width!==undefined){q.widget.width(q.options.width)}if(q.options.orientation==="left"){q.widget.addClass("left-oriented");O.left=O.left-q.widget.width()+20}if(A()){M="fixed";O.top-=N.scrollTop();O.left-=N.scrollLeft()}if(N.width()<O.left+q.widget.outerWidth()){O.right=N.width()-O.left-q.width;O.left="auto";q.widget.addClass("pull-right")}else{O.right="auto";q.widget.removeClass("pull-right")}q.widget.css({position:M,top:O.top,left:O.left,right:O.right})},z=function(M){q.element.trigger({type:"change.dp",date:q.getDate(),oldDate:M})},w=function(M){q.element.trigger({type:"error.dp",date:M})},n=function(M){a.lang(q.options.language);var N=M;if(!N){if(q.isInput){N=q.element.val()}else{N=q.element.find("input").val()}if(N){q.date=a(N,q.format,q.options.useStrict)}if(!q.date){q.date=a()}}q.viewDate=a(q.date).startOf("month");h();y()},H=function(){a.lang(q.options.language);var O=d("<tr>"),M=a.weekdaysMin(),N;if(a()._lang._week.dow==0){for(N=0;N<7;N++){O.append('<th class="dow">'+M[N]+"</th>")}}else{for(N=1;N<8;N++){if(N==7){O.append('<th class="dow">'+M[0]+"</th>")}else{O.append('<th class="dow">'+M[N]+"</th>")}}}q.widget.find(".datepicker-days thead").append(O)},L=function(){a.lang(q.options.language);var N="",M=0,O=a.monthsShort();while(M<12){N+='<span class="month">'+O[M++]+"</span>"}q.widget.find(".datepicker-months td").append(N)},h=function(){a.lang(q.options.language);var X=q.viewDate.year(),V=q.viewDate.month(),W=q.options.startDate.year(),Z=q.options.startDate.month(),aa=q.options.endDate.year(),T=q.options.endDate.month(),P,S,R=[],ab,O,Q,Y,N,U,M=a.months();q.widget.find(".datepicker-days").find(".disabled").removeClass("disabled");q.widget.find(".datepicker-months").find(".disabled").removeClass("disabled");q.widget.find(".datepicker-years").find(".disabled").removeClass("disabled");q.widget.find(".datepicker-days th:eq(1)").text(M[V]+" "+X);P=a(q.viewDate).subtract("months",1);Y=P.daysInMonth();P.date(Y).startOf("week");if((X==W&&V<=Z)||X<W){q.widget.find(".datepicker-days th:eq(0)").addClass("disabled")}if((X==aa&&V>=T)||X>aa){q.widget.find(".datepicker-days th:eq(2)").addClass("disabled")}S=a(P).add(42,"d");while(P.isBefore(S)){if(P.weekday()===a().startOf("week").weekday()){ab=d("<tr>");R.push(ab)}O="";if(P.year()<X||(P.year()==X&&P.month()<V)){O+=" old"}else{if(P.year()>X||(P.year()==X&&P.month()>V)){O+=" new"}}if(P.isSame(a({y:q.date.year(),M:q.date.month(),d:q.date.date()}))){O+=" active"}if((a(P).add(1,"d")<=q.options.startDate)||(P>q.options.endDate)||e(P)){O+=" disabled"}ab.append('<td class="day'+O+'">'+P.date()+"</td>");P.add(1,"d")}q.widget.find(".datepicker-days tbody").empty().append(R);U=a().year(),M=q.widget.find(".datepicker-months").find("th:eq(1)").text(X).end().find("span").removeClass("active");if(U===X){M.eq(a().month()).addClass("active")}if(U-1<W){q.widget.find(".datepicker-months th:eq(0)").addClass("disabled")}if(U+1>aa){q.widget.find(".datepicker-months th:eq(2)").addClass("disabled")}for(Q=0;Q<12;Q++){if((X==W&&Z>Q)||(X<W)){d(M[Q]).addClass("disabled")}else{if((X==aa&&T<Q)||(X>aa)){d(M[Q]).addClass("disabled")}}}R="";X=parseInt(X/10,10)*10;N=q.widget.find(".datepicker-years").find("th:eq(1)").text(X+"-"+(X+9)).end().find("td");q.widget.find(".datepicker-years").find("th").removeClass("disabled");if(W>X){q.widget.find(".datepicker-years").find("th:eq(0)").addClass("disabled")}if(aa<X+9){q.widget.find(".datepicker-years").find("th:eq(2)").addClass("disabled")}X-=1;for(Q=-1;Q<11;Q++){R+='<span class="year'+(Q===-1||Q===10?" old":"")+(U===X?" active":"")+((X<W||X>aa)?" disabled":"")+'">'+X+"</span>";X+=1}N.html(R)},l=function(){a.lang(q.options.language);var P=q.widget.find(".timepicker .timepicker-hours table"),O="",Q,N,M;P.parent().hide();if(q.use24hours){Q=0;for(N=0;N<6;N+=1){O+="<tr>";for(M=0;M<4;M+=1){O+='<td class="hour">'+D(Q.toString())+"</td>";Q++}O+="</tr>"}}else{Q=1;for(N=0;N<3;N+=1){O+="<tr>";for(M=0;M<4;M+=1){O+='<td class="hour">'+D(Q.toString())+"</td>";Q++}O+="</tr>"}}P.html(O)},C=function(){var P=q.widget.find(".timepicker .timepicker-minutes table"),O="",Q=0,N,M;P.parent().hide();for(N=0;N<5;N++){O+="<tr>";for(M=0;M<4;M+=1){O+='<td class="minute">'+D(Q.toString())+"</td>";Q+=3}O+="</tr>"}P.html(O)},y=function(){if(!q.date){return}var O=q.widget.find(".timepicker span[data-time-component]"),M=q.date.hours(),N="AM";if(!q.use24hours){if(M>=12){N="PM"}if(M===0){M=12}else{if(M!=12){M=M%12}}q.widget.find(".timepicker [data-action=togglePeriod]").text(N)}O.filter("[data-time-component=hours]").text(D(M));O.filter("[data-time-component=minutes]").text(D(q.date.minutes()))},B=function(S){S.stopPropagation();S.preventDefault();q.unset=false;var R=d(S.target).closest("span, td, th"),Q,O,P,M,N=q.date;if(R.length===1){if(!R.is(".disabled")){switch(R[0].nodeName.toLowerCase()){case"th":switch(R[0].className){case"switch":f(1);break;case"prev":case"next":P=G.modes[q.viewMode].navStep;if(R[0].className==="prev"){P=P*-1}q.viewDate.add(P,G.modes[q.viewMode].navFnc);h();break}break;case"span":if(R.is(".month")){Q=R.parent().find("span").index(R);q.viewDate.month(Q)}else{O=parseInt(R.text(),10)||0;q.viewDate.year(O)}if(q.viewMode!==0){q.date=a({y:q.viewDate.year(),M:q.viewDate.month(),d:q.viewDate.date(),h:q.date.hours(),m:q.date.minutes()});z(N)}f(-1);h();break;case"td":if(R.is(".day")){M=parseInt(R.text(),10)||1;Q=q.viewDate.month();O=q.viewDate.year();if(R.is(".old")){if(Q===0){Q=11;O-=1}else{Q-=1}}else{if(R.is(".new")){if(Q==11){Q=0;O+=1}else{Q+=1}}}q.date=a({y:O,M:Q,d:M,h:q.date.hours(),m:q.date.minutes()});q.viewDate=a({y:O,M:Q,d:Math.min(28,M)});h();x();z(N)}break}}}},r={incrementHours:function(){j("add","hours")},incrementMinutes:function(){j("add","minutes")},decrementHours:function(){j("subtract","hours")},decrementMinutes:function(){j("subtract","minutes")},togglePeriod:function(){var M=q.date.hours();if(M>=12){M-=12}else{M+=12}q.date.hours(M)},showPicker:function(){q.widget.find(".timepicker > div:not(.timepicker-picker)").hide();q.widget.find(".timepicker .timepicker-picker").show()},showHours:function(){q.widget.find(".timepicker .timepicker-picker").hide();q.widget.find(".timepicker .timepicker-hours").show()},showMinutes:function(){q.widget.find(".timepicker .timepicker-picker").hide();q.widget.find(".timepicker .timepicker-minutes").show()},selectHour:function(M){q.date.hours(parseInt(d(M.target).text(),10));r.showPicker.call(q)},selectMinute:function(M){q.date.minutes(parseInt(d(M.target).text(),10));r.showPicker.call(q)}},v=function(O){var N=d(O.currentTarget).data("action"),P=r[N].apply(q,arguments),M=q.date;F(O);if(!q.date){q.date=a({y:1970})}x();y();z(M);return P},F=function(M){M.stopPropagation();M.preventDefault()},u=function(O){a.lang(q.options.language);var M=d(O.target),N=q.date,P=a(M.val(),q.format,q.options.useStrict);if(P.isValid()){n();q.setValue(P);z(N);x()}else{q.viewDate=N;z(N);w(P);q.unset=true;M.val("")}},f=function(M){if(M){q.viewMode=Math.max(q.minViewMode,Math.min(2,q.viewMode+M))}q.widget.find(".datepicker > div").hide().filter(".datepicker-"+G.modes[q.viewMode].clsName).show()},J=function(){var Q,P,N,M,O;q.widget.on("click",".datepicker *",d.proxy(B,this));q.widget.on("click","[data-action]",d.proxy(v,this));q.widget.on("mousedown",d.proxy(F,this));if(q.options.pickDate&&q.options.pickTime){q.widget.on("click.togglePicker",".accordion-toggle",function(R){R.stopPropagation();Q=d(this);P=Q.closest("ul");N=P.find(".in");M=P.find(".collapse:not(.in)");if(N&&N.length){O=N.data("collapse");if(O&&O.transitioning){return}N.collapse("hide");M.collapse("show");Q.find("span").toggleClass(q.options.icons.time+" "+q.options.icons.date);q.element.find(".input-group-addon span").toggleClass(q.options.icons.time+" "+q.options.icons.date)}})}if(q.isInput){q.element.on({focus:d.proxy(q.show,this),change:d.proxy(u,this),blur:d.proxy(q.hide,this)})}else{q.element.on({change:d.proxy(u,this)},"input");if(q.component){q.component.on("click",d.proxy(q.show,this))}else{q.element.on("click",d.proxy(q.show,this))}}},p=function(){d(window).on("resize.datetimepicker"+q.id,d.proxy(o,this));if(!q.isInput){d(document).on("mousedown.datetimepicker"+q.id,d.proxy(q.hide,this))}},t=function(){q.widget.off("click",".datepicker *",q.click);q.widget.off("click","[data-action]");q.widget.off("mousedown",q.stopEvent);if(q.options.pickDate&&q.options.pickTime){q.widget.off("click.togglePicker")}if(q.isInput){q.element.off({focus:q.show,change:q.change})}else{q.element.off({change:q.change},"input");if(q.component){q.component.off("click",q.show)}else{q.element.off("click",q.show)}}},k=function(){d(window).off("resize.datetimepicker"+q.id);if(!q.isInput){d(document).off("mousedown.datetimepicker"+q.id)}},A=function(){if(q.element){var N=q.element.parents(),M=false,O;for(O=0;O<N.length;O++){if(d(N[O]).css("position")=="fixed"){M=true;break}}return M}else{return false}},x=function(){a.lang(q.options.language);var N="",M;if(!q.unset){N=a(q.date).format(q.format)}if(!q.isInput){if(q.component){M=q.element.find("input");M.val(N)}q.element.data("date",N)}else{q.element.val(N)}if(!q.options.pickTime){q.hide()}},j=function(O,N){a.lang(q.options.language);var M;if(O=="add"){M=a(q.date);if(M.hours()==23){M.add(1,N)}M.add(1,N)}else{M=a(q.date).subtract(1,N)}if(M.isAfter(q.options.endDate)||M.subtract(1,N).isBefore(q.options.startDate)||e(M)){w(M.format(q.format));return}if(O=="add"){q.date.add(1,N)}else{q.date.subtract(1,N)}},e=function(M){a.lang(q.options.language);var O=q.options.disabledDates,N;for(N in O){if(O[N]==a(M).format("L")){return true}}return false},D=function(M){M=M.toString();if(M.length>=2){return M}else{return"0"+M}},I=function(N,M,O){if(N&&M){return('<div class="bootstrap-datetimepicker-widget dropdown-menu" style="z-index:9999 !important;"><ul class="list-unstyled"><li'+(O?' class="collapse in"':"")+'><div class="datepicker">'+G.template+'</div></li><li class="picker-switch accordion-toggle"><a class="btn" style="width:100%"><span class="'+q.options.icons.time+'"></span></a></li><li'+(O?' class="collapse"':"")+'><div class="timepicker">'+m.getTemplate()+"</div></li></ul></div>")}else{if(M){return('<div class="bootstrap-datetimepicker-widget dropdown-menu"><div class="timepicker">'+m.getTemplate()+"</div></div>")}else{return('<div class="bootstrap-datetimepicker-widget dropdown-menu"><div class="datepicker">'+G.template+"</div></div>")}}},G={modes:[{clsName:"days",navFnc:"month",navStep:1},{clsName:"months",navFnc:"year",navStep:1},{clsName:"years",navFnc:"year",navStep:10}],headTemplate:'<thead><tr><th class="prev">&lsaquo;</th><th colspan="5" class="switch"></th><th class="next">&rsaquo;</th></tr></thead>',contTemplate:'<tbody><tr><td colspan="7"></td></tr></tbody>'},m={hourTemplate:'<span data-action="showHours" data-time-component="hours" class="timepicker-hour"></span>',minuteTemplate:'<span data-action="showMinutes" data-time-component="minutes" class="timepicker-minute"></span>'};G.template='<div class="datepicker-days"><table class="table-condensed">'+G.headTemplate+'<tbody></tbody></table></div><div class="datepicker-months"><table class="table-condensed">'+G.headTemplate+G.contTemplate+'</table></div><div class="datepicker-years"><table class="table-condensed">'+G.headTemplate+G.contTemplate+"</table></div>";m.getTemplate=function(){return('<div class="timepicker-picker"><table class="table-condensed"><tr><td><a href="#" class="btn" data-action="incrementHours"><span class="'+q.options.icons.up+'"></span></a></td><td class="separator"></td><td><a href="#" class="btn" data-action="incrementMinutes"><span class="'+q.options.icons.up+'"></span></a></td>'+(!q.use24hours?'<td class="separator"></td>':"")+"</tr><tr><td>"+m.hourTemplate+'</td> <td class="separator">:</td><td>'+m.minuteTemplate+"</td> "+(!q.use24hours?'<td class="separator"></td><td><button type="button" class="btn btn-primary" data-action="togglePeriod"></button></td>':"")+'</tr><tr><td><a href="#" class="btn" data-action="decrementHours"><span class="'+q.options.icons.down+'"></span></a></td><td class="separator"></td><td><a href="#" class="btn" data-action="decrementMinutes"><span class="'+q.options.icons.down+'"></span></a></td>'+(!q.use24hours?'<td class="separator"></td>':"")+'</tr></table></div><div class="timepicker-hours" data-action="selectHour"><table class="table-condensed"></table></div><div class="timepicker-minutes" data-action="selectMinute"><table class="table-condensed"></table></div>')};q.destroy=function(){t();k();q.widget.remove();q.element.removeData("DateTimePicker");q.component.removeData("DateTimePicker")};q.show=function(M){q.widget.show();q.height=q.component?q.component.outerHeight():q.element.outerHeight();o();q.element.trigger({type:"show.dp",date:q.date});p();if(M){F(M)}},q.disable=function(){q.element.find("input").prop("disabled",true);t()},q.enable=function(){q.element.find("input").prop("disabled",false);J()},q.hide=function(){var O=q.widget.find(".collapse"),M,N;for(M=0;M<O.length;M++){N=O.eq(M).data("collapse");if(N&&N.transitioning){return}}q.widget.hide();q.viewMode=q.startViewMode;f();q.element.trigger({type:"hide.dp",date:q.date});k()},q.setValue=function(M){a.lang(q.options.language);if(!M){q.unset=true}else{q.unset=false}if(!a.isMoment(M)){M=a(M)}if(M.isValid()){q.date=M;x();q.viewDate=a({y:q.date.year(),M:q.date.month()});h();y()}else{w(M)}},q.getDate=function(){if(q.unset){return null}return q.date},q.setDate=function(M){if(!M){q.setValue(null)}else{q.setValue(M)}},q.setEndDate=function(M){q.options.endDate=a(M);if(!q.options.endDate.isValid()){q.options.endDate=a().add(50,"y")}if(q.viewDate){n()}},q.setStartDate=function(M){q.options.startDate=a(M);if(!q.options.startDate.isValid()){q.options.startDate=a({y:1970})}if(q.viewDate){n()}};E()};d.fn.datetimepicker=function(e){return this.each(function(){var g=d(this),f=g.data("DateTimePicker");if(!f){g.data("DateTimePicker",new b(this,e))}})}})(jQuery);
\ No newline at end of file

diff --git a/src/web/js/bootstrap-fileinput.js b/src/web/js/bootstrap-fileinput.js
new file mode 100644
index 0000000..88c26c2
--- /dev/null
+++ b/src/web/js/bootstrap-fileinput.js
@@ -0,0 +1,179 @@
+/* ===========================================================
+ * Bootstrap: fileinput.js v3.0.0-p7
+ * http://jasny.github.com/bootstrap/javascript.html#fileinput
+ * ===========================================================
+ * Copyright 2012 Jasny BV, Netherlands.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License")
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
++function ($) { "use strict";
+
+  var isIE = window.navigator.appName == 'Microsoft Internet Explorer'
+
+  // FILEUPLOAD PUBLIC CLASS DEFINITION
+  // =================================
+
+  var Fileupload = function (element, options) {
+    this.$element = $(element)
+      
+    this.$input = this.$element.find(':file')
+    if (this.$input.length === 0) return
+
+    this.name = this.$input.attr('name') || options.name
+
+    this.$hidden = this.$element.find('input[type=hidden][name="'+this.name+'"]')
+    if (this.$hidden.length === 0) {
+      this.$hidden = $('<input type="hidden" />')
+      this.$element.prepend(this.$hidden)
+    }
+
+    this.$preview = this.$element.find('.fileinput-preview')
+    var height = this.$preview.css('height')
+    if (this.$preview.css('display') != 'inline' && height != '0px' && height != 'none') this.$preview.css('line-height', height)
+
+    this.original = {
+      exists: this.$element.hasClass('fileinput-exists'),
+      preview: this.$preview.html(),
+      hiddenVal: this.$hidden.val()
+    }
+    
+    this.listen()
+  }
+  
+  Fileupload.prototype.listen = function() {
+    this.$input.on('change.bs.fileinput', $.proxy(this.change, this))
+    $(this.$input[0].form).on('reset.bs.fileinput', $.proxy(this.reset, this))
+    
+    this.$element.find('[data-trigger="fileinput"]').on('click.bs.fileinput', $.proxy(this.trigger, this))
+    this.$element.find('[data-dismiss="fileinput"]').on('click.bs.fileinput', $.proxy(this.clear, this))
+  },
+
+  Fileupload.prototype.change = function(e) {
+    if (e.target.files === undefined) e.target.files = e.target && e.target.value ? [ {name: e.target.value.replace(/^.+\\/, '')} ] : []
+    if (e.target.files.length === 0) return
+
+    this.$hidden.val('')
+    this.$hidden.attr('name', '')
+    this.$input.attr('name', this.name)
+
+    var file = e.target.files[0]
+
+    if (this.$preview.length > 0 && (typeof file.type !== "undefined" ? file.type.match('image.*') : file.name.match(/\.(gif|png|jpe?g)$/i)) && typeof FileReader !== "undefined") {
+      var reader = new FileReader()
+      var preview = this.$preview
+      var element = this.$element
+
+      reader.onload = function(re) {
+        var $img = $('<img>').attr('src', re.target.result)
+        e.target.files[0].result = re.target.result
+        
+        element.find('.fileinput-filename').text(file.name)
+        
+        // if parent has max-height, using `(max-)height: 100%` on child doesn't take padding and border into account
+        if (preview.css('max-height') != 'none') $img.css('max-height', parseInt(preview.css('max-height'), 10) - parseInt(preview.css('padding-top'), 10) - parseInt(preview.css('padding-bottom'), 10)  - parseInt(preview.css('border-top'), 10) - parseInt(preview.css('border-bottom'), 10))
+        
+        preview.html($img)
+        element.addClass('fileinput-exists').removeClass('fileinput-new')
+
+        element.trigger('change.bs.fileinput', e.target.files)
+      }
+
+      reader.readAsDataURL(file)
+    } else {
+      this.$element.find('.fileinput-filename').text(file.name)
+      this.$preview.text(file.name)
+      
+      this.$element.addClass('fileinput-exists').removeClass('fileinput-new')
+      
+      this.$element.trigger('change.bs.fileinput')
+    }
+  },
+
+  Fileupload.prototype.clear = function(e) {
+    if (e) e.preventDefault()
+    
+    this.$hidden.val('')
+    this.$hidden.attr('name', this.name)
+    this.$input.attr('name', '')
+
+    //ie8+ doesn't support changing the value of input with type=file so clone instead
+    if (isIE) { 
+      var inputClone = this.$input.clone(true);
+      this.$input.after(inputClone);
+      this.$input.remove();
+      this.$input = inputClone;
+    } else {
+      this.$input.val('')
+    }
+
+    this.$preview.html('')
+    this.$element.find('.fileinput-filename').text('')
+    this.$element.addClass('fileinput-new').removeClass('fileinput-exists')
+    
+    if (e !== false) {
+      this.$input.trigger('change')
+      this.$element.trigger('clear.bs.fileinput')
+    }
+  },
+
+  Fileupload.prototype.reset = function() {
+    this.clear(false)
+
+    this.$hidden.val(this.original.hiddenVal)
+    this.$preview.html(this.original.preview)
+    this.$element.find('.fileinput-filename').text('')
+
+    if (this.original.exists) this.$element.addClass('fileinput-exists').removeClass('fileinput-new')
+     else this.$element.addClass('fileinput-new').removeClass('fileinput-exists')
+    
+    this.$element.trigger('reset.bs.fileinput')
+  },
+
+  Fileupload.prototype.trigger = function(e) {
+    this.$input.trigger('click')
+    e.preventDefault()
+  }
+
+  
+  // FILEUPLOAD PLUGIN DEFINITION
+  // ===========================
+
+  $.fn.fileinput = function (options) {
+    return this.each(function () {
+      var $this = $(this)
+      , data = $this.data('fileinput')
+      if (!data) $this.data('fileinput', (data = new Fileupload(this, options)))
+      if (typeof options == 'string') data[options]()
+    })
+  }
+
+  $.fn.fileinput.Constructor = Fileupload
+
+
+  // FILEUPLOAD DATA-API
+  // ==================
+
+  $(document).on('click.fileinput.data-api', '[data-provides="fileinput"]', function (e) {
+    var $this = $(this)
+    if ($this.data('fileinput')) return
+    $this.fileinput($this.data())
+      
+    var $target = $(e.target).closest('[data-dismiss="fileinput"],[data-trigger="fileinput"]');
+    if ($target.length > 0) {
+      e.preventDefault()
+      $target.trigger('click.bs.fileinput')
+    }
+  })
+
+}(window.jQuery);

diff --git a/src/web/js/dust-core-2.2.2.min.js b/src/web/js/dust-core-2.2.2.min.js
new file mode 100644
index 0000000..3606333
--- /dev/null
+++ b/src/web/js/dust-core-2.2.2.min.js
@@ -0,0 +1,9 @@
+//
+// Dust - Asynchronous Templating v2.2.2
+// http://akdubya.github.com/dustjs
+//
+// Copyright (c) 2010, Aleksander Williams
+// Released under the MIT License.
+//
+
+function getGlobal(){return function(){return this.dust}.call(null)}var dust={};(function(dust){function Context(e,t,n,r){this.stack=e,this.global=t,this.blocks=n,this.templateName=r}function Stack(e,t,n,r){this.tail=t,this.isObject=!dust.isArray(e)&&e&&typeof e=="object",this.head=e,this.index=n,this.of=r}function Stub(e){this.head=new Chunk(this),this.callback=e,this.out=""}function Stream(){this.head=new Chunk(this)}function Chunk(e,t,n){this.root=e,this.next=t,this.data=[],this.flushable=!1,this.taps=n}function Tap(e,t){this.head=e,this.tail=t}if(!dust)return;var ERROR="ERROR",WARN="WARN",INFO="INFO",DEBUG="DEBUG",levels=[DEBUG,INFO,WARN,ERROR],logger=function(){};dust.isDebug=!1,dust.debugLevel=INFO,typeof window!="undefined"&&window&&window.console&&window.console.log?logger=window.console.log:typeof console!="undefined"&&console&&console.log&&(logger=console.log),dust.log=function(e,t){var t=t||INFO;dust.isDebug&&levels.indexOf(t)>=levels.indexOf(dust.debugLevel)&&(dust.logQueue||(dust.logQueue=[]),dust.logQueue.push({message:e,type:t}),logger.call(console||window.console,"[DUST "+t+"]: "+e))},dust.onError=function(e,t){dust.log(e.message||e,ERROR);if(dust.isDebug)throw e;return t},dust.helpers={},dust.cache={},dust.register=function(e,t){if(!e)return;dust.cache[e]=t},dust.render=function(e,t,n){var r=(new Stub(n)).head;try{dust.load(e,r,Context.wrap(t,e)).end()}catch(i){dust.onError(i,r)}},dust.stream=function(e,t){var n=new Stream;return dust.nextTick(function(){try{dust.load(e,n.head,Context.wrap(t,e)).end()}catch(r){dust.onError(r,n.head)}}),n},dust.renderSource=function(e,t,n){return dust.compileFn(e)(t,n)},dust.compileFn=function(e,t){var n=dust.loadSource(dust.compile(e,t));return function(e,r){var i=r?new Stub(r):new Stream;return dust.nextTick(function(){typeof n=="function"?n(i.head,Context.wrap(e,t)).end():dust.onError(new Error("Template ["+t+"] cannot be resolved to a Dust function"))}),i}},dust.load=function(e,t,n){var r=dust.cache[e];return r?r(t,n):dust.onLoad?t.map(function(t){dust.onLoad(e,function(r,i){if(r)return t.setError(r);dust.cache[e]||dust.loadSource(dust.compile(i,e)),dust.cache[e](t,n).end()})}):t.setError(new Error("Template Not Found: "+e))},dust.loadSource=function(source,path){return eval(source)},Array.isArray?dust.isArray=Array.isArray:dust.isArray=function(e){return Object.prototype.toString.call(e)==="[object Array]"},dust.nextTick=function(){return typeof process!="undefined"?process.nextTick:function(e){setTimeout(e,0)}}(),dust.isEmpty=function(e){return dust.isArray(e)&&!e.length?!0:e===0?!1:!e},dust.filter=function(e,t,n){if(n)for(var r=0,i=n.length;r<i;r++){var s=n[r];s==="s"?(t=null,dust.log("Using unescape filter on ["+e+"]",DEBUG)):typeof dust.filters[s]=="function"?e=dust.filters[s](e):dust.onError(new Error("Invalid filter ["+s+"]"))}return t&&(e=dust.filters[t](e)),e},dust.filters={h:function(e){return dust.escapeHtml(e)},j:function(e){return dust.escapeJs(e)},u:encodeURI,uc:encodeURIComponent,js:function(e){return JSON?JSON.stringify(e):(dust.log("JSON is undefined.  JSON stringify has not been used on ["+e+"]",WARN),e)},jp:function(e){return JSON?JSON.parse(e):(dust.log("JSON is undefined.  JSON parse has not been used on ["+e+"]",WARN),e)}},dust.makeBase=function(e){return new Context(new Stack,e)},Context.wrap=function(e,t){return e instanceof Context?e:new Context(new Stack(e),{},null,t)},Context.prototype.get=function(e,t){return typeof e=="string"&&(e[0]==="."&&(t=!0,e=e.substr(1)),e=e.split(".")),this._get(t,e)},Context.prototype._get=function(e,t){var n=this.stack,r=1,i,s,o,u;dust.log("Searching for reference [{"+t.join(".")+"}] in template ["+this.getTemplateName()+"]",DEBUG),s=t[0],o=t.length;if(e&&o===0)u=n,n=n.head;else{if(!e){while(n){if(n.isObject){u=n.head,i=n.head[s];if(i!==undefined)break}n=n.tail}i!==undefined?n=i:n=this.global?this.global[s]:undefined}else n=n.head[s];while(n&&r<o)u=n,n=n[t[r]],r++}if(typeof n=="function"){var a=function(){return n.apply(u,arguments)};return a.isFunction=!0,a}return n===undefined&&dust.log("Cannot find the value for reference [{"+t.join(".")+"}] in template ["+this.getTemplateName()+"]"),n},Context.prototype.getPath=function(e,t){return this._get(e,t)},Context.prototype.push=function(e,t,n){return new Context(new Stack(e,this.stack,t,n),this.global,this.blocks,this.getTemplateName())},Context.prototype.rebase=function(e){return new Context(new Stack(e),this.global,this.blocks,this.getTemplateName())},Context.prototype.current=function(){return this.stack.head},Context.prototype.getBlock=function(e,t,n){if(typeof e=="function"){var r=new Chunk;e=e(r,this).data.join("")}var i=this.blocks;if(!i){dust.log("No blocks for context[{"+e+"}] in template ["+this.getTemplateName()+"]",DEBUG);return}var s=i.length,o;while(s--){o=i[s][e];if(o)return o}},Context.prototype.shiftBlocks=function(e){var t=this.blocks,n;return e?(t?n=t.concat([e]):n=[e],new Context(this.stack,this.global,n,this.getTemplateName())):this},Context.prototype.getTemplateName=function(){return this.templateName},Stub.prototype.flush=function(){var e=this.head;while(e){if(!e.flushable){if(e.error){this.callback(e.error),dust.onError(new Error("Chunk error ["+e.error+"] thrown. Ceasing to render this template.")),this.flush=function(){};return}return}this.out+=e.data.join(""),e=e.next,this.head=e}this.callback(null,this.out)},Stream.prototype.flush=function(){var e=this.head;while(e){if(!e.flushable){if(e.error){this.emit("error",e.error),dust.onError(new Error("Chunk error ["+e.error+"] thrown. Ceasing to render this template.")),this.flush=function(){};return}return}this.emit("data",e.data.join("")),e=e.next,this.head=e}this.emit("end")},Stream.prototype.emit=function(e,t){if(!this.events)return dust.log("No events to emit",INFO),!1;var n=this.events[e];if(!n)return dust.log("Event type ["+e+"] does not exist",WARN),!1;if(typeof n=="function")n(t);else if(dust.isArray(n)){var r=n.slice(0);for(var i=0,s=r.length;i<s;i++)r[i](t)}else dust.onError(new Error("Event Handler ["+n+"] is not of a type that is handled by emit"))},Stream.prototype.on=function(e,t){return this.events||(this.events={}),this.events[e]?typeof this.events[e]=="function"?this.events[e]=[this.events[e],t]:this.events[e].push(t):(dust.log("Event type ["+e+"] does not exist. Using just the specified callback.",WARN),t?this.events[e]=t:dust.log("Callback for type ["+e+"] does not exist. Listener not registered.",WARN)),this},Stream.prototype.pipe=function(e){return this.on("data",function(t){try{e.write(t,"utf8")}catch(n){dust.onError(n,e.head)}}).on("end",function(){try{return e.end()}catch(t){dust.onError(t,e.head)}}).on("error",function(t){e.error(t)}),this},Chunk.prototype.write=function(e){var t=this.taps;return t&&(e=t.go(e)),this.data.push(e),this},Chunk.prototype.end=function(e){return e&&this.write(e),this.flushable=!0,this.root.flush(),this},Chunk.prototype.map=function(e){var t=new Chunk(this.root,this.next,this.taps),n=new Chunk(this.root,t,this.taps);return this.next=n,this.flushable=!0,e(n),t},Chunk.prototype.tap=function(e){var t=this.taps;return t?this.taps=t.push(e):this.taps=new Tap(e),this},Chunk.prototype.untap=function(){return this.taps=this.taps.tail,this},Chunk.prototype.render=function(e,t){return e(this,t)},Chunk.prototype.reference=function(e,t,n,r){if(typeof e=="function"){e.isFunction=!0,e=e.apply(t.current(),[this,t,null,{auto:n,filters:r}]);if(e instanceof Chunk)return e}return dust.isEmpty(e)?this:this.write(dust.filter(e,n,r))},Chunk.prototype.section=function(e,t,n,r){if(typeof e=="function"){e=e.apply(t.current(),[this,t,n,r]);if(e instanceof Chunk)return e}var i=n.block,s=n["else"];r&&(t=t.push(r));if(dust.isArray(e)){if(i){var o=e.length,u=this;if(o>0){t.stack.head&&(t.stack.head.$len=o);for(var a=0;a<o;a++)t.stack.head&&(t.stack.head.$idx=a),u=i(u,t.push(e[a],a,o));return t.stack.head&&(t.stack.head.$idx=undefined,t.stack.head.$len=undefined),u}if(s)return s(this,t)}}else if(e===!0){if(i)return i(this,t)}else if(e||e===0){if(i)return i(this,t.push(e))}else if(s)return s(this,t);return dust.log("Not rendering section (#) block in template ["+t.getTemplateName()+"], because above key was not found",DEBUG),this},Chunk.prototype.exists=function(e,t,n){var r=n.block,i=n["else"];if(!dust.isEmpty(e)){if(r)return r(this,t)}else if(i)return i(this,t);return dust.log("Not rendering exists (?) block in template ["+t.getTemplateName()+"], because above key was not found",DEBUG),this},Chunk.prototype.notexists=function(e,t,n){var r=n.block,i=n["else"];if(dust.isEmpty(e)){if(r)return r(this,t)}else if(i)return i(this,t);return dust.log("Not rendering not exists (^) block check in template ["+t.getTemplateName()+"], because above key was found",DEBUG),this},Chunk.prototype.block=function(e,t,n){var r=n.block;return e&&(r=e),r?r(this,t):this},Chunk.prototype.partial=function(e,t,n){var r;r=dust.makeBase(t.global),r.blocks=t.blocks,t.stack&&t.stack.tail&&(r.stack=t.stack.tail),n&&(r=r.push(n)),typeof e=="string"&&(r.templateName=e),r=r.push(t.stack.head);var i;return typeof e=="function"?i=this.capture(e,r,function(e,t){r.templateName=r.templateName||e,dust.load(e,t,r).end()}):i=dust.load(e,this,r),i},Chunk.prototype.helper=function(e,t,n,r){var i=this;try{return dust.helpers[e]?dust.helpers[e](i,t,n,r):dust.onError(new Error("Invalid helper ["+e+"]"),i)}catch(s){return dust.onError(s,i)}},Chunk.prototype.capture=function(e,t,n){return this.map(function(r){var i=new Stub(function(e,t){e?r.setError(e):n(t,r)});e(i.head,t).end()})},Chunk.prototype.setError=function(e){return this.error=e,this.root.flush(),this},Tap.prototype.push=function(e){return new Tap(e,this)},Tap.prototype.go=function(e){var t=this;while(t)e=t.head(e),t=t.tail;return e};var HCHARS=new RegExp(/[&<>\"\']/),AMP=/&/g,LT=/</g,GT=/>/g,QUOT=/\"/g,SQUOT=/\'/g;dust.escapeHtml=function(e){return typeof e=="string"?HCHARS.test(e)?e.replace(AMP,"&amp;").replace(LT,"&lt;").replace(GT,"&gt;").replace(QUOT,"&quot;").replace(SQUOT,"&#39;"):e:e};var BS=/\\/g,FS=/\//g,CR=/\r/g,LS=/\u2028/g,PS=/\u2029/g,NL=/\n/g,LF=/\f/g,SQ=/'/g,DQ=/"/g,TB=/\t/g;dust.escapeJs=function(e){return typeof e=="string"?e.replace(BS,"\\\\").replace(FS,"\\/").replace(DQ,'\\"').replace(SQ,"\\'").replace(CR,"\\r").replace(LS,"\\u2028").replace(PS,"\\u2029").replace(NL,"\\n").replace(LF,"\\f").replace(TB,"\\t"):e}})(dust),typeof exports!="undefined"&&(typeof process!="undefined"&&require("./server")(dust),module.exports=dust)
\ No newline at end of file