website

website/.buildpacks

@@ -0,0 +1,2 @@
+https://github.com/heroku/heroku-buildpack-ruby.git
+https://github.com/hashicorp/heroku-buildpack-middleman.git

website/Gemfile

@@ -0,0 +1,3 @@
+source "https://rubygems.org"
+
+gem "middleman-hashicorp", github: "hashicorp/middleman-hashicorp"

website/Gemfile.lock

@@ -0,0 +1,182 @@
+GIT
+  remote: git://github.com/hashicorp/middleman-hashicorp.git
+  revision: 76f0f284ad44cea0457484ea83467192f02daf87
+  specs:
+    middleman-hashicorp (0.1.0)
+      bootstrap-sass (~> 3.3)
+      builder (~> 3.2)
+      less (~> 2.6)
+      middleman (~> 3.3)
+      middleman-livereload (~> 3.4)
+      middleman-minify-html (~> 3.4)
+      middleman-syntax (~> 2.0)
+      rack-contrib (~> 1.2)
+      rack-protection (~> 1.5)
+      rack-rewrite (~> 1.5)
+      rack-ssl-enforcer (~> 0.2)
+      redcarpet (~> 3.2)
+      therubyracer (~> 0.12)
+      thin (~> 1.6)
+
+GEM
+  remote: https://rubygems.org/
+  specs:
+    activesupport (4.1.12)
+      i18n (~> 0.6, >= 0.6.9)
+      json (~> 1.7, >= 1.7.7)
+      minitest (~> 5.1)
+      thread_safe (~> 0.1)
+      tzinfo (~> 1.1)
+    autoprefixer-rails (5.2.1)
+      execjs
+      json
+    bootstrap-sass (3.3.5.1)
+      autoprefixer-rails (>= 5.0.0.1)
+      sass (>= 3.3.0)
+    builder (3.2.2)
+    celluloid (0.16.0)
+      timers (~> 4.0.0)
+    chunky_png (1.3.4)
+    coffee-script (2.4.1)
+      coffee-script-source
+      execjs
+    coffee-script-source (1.9.1.1)
+    commonjs (0.2.7)
+    compass (1.0.3)
+      chunky_png (~> 1.2)
+      compass-core (~> 1.0.2)
+      compass-import-once (~> 1.0.5)
+      rb-fsevent (>= 0.9.3)
+      rb-inotify (>= 0.9)
+      sass (>= 3.3.13, < 3.5)
+    compass-core (1.0.3)
+      multi_json (~> 1.0)
+      sass (>= 3.3.0, < 3.5)
+    compass-import-once (1.0.5)
+      sass (>= 3.2, < 3.5)
+    daemons (1.2.3)
+    em-websocket (0.5.1)
+      eventmachine (>= 0.12.9)
+      http_parser.rb (~> 0.6.0)
+    erubis (2.7.0)
+    eventmachine (1.0.7)
+    execjs (2.5.2)
+    ffi (1.9.10)
+    git-version-bump (0.15.1)
+    haml (4.0.6)
+      tilt
+    hike (1.2.3)
+    hitimes (1.2.2)
+    hooks (0.4.0)
+      uber (~> 0.0.4)
+    htmlcompressor (0.2.0)
+    http_parser.rb (0.6.0)
+    i18n (0.7.0)
+    json (1.8.3)
+    kramdown (1.8.0)
+    less (2.6.0)
+      commonjs (~> 0.2.7)
+    libv8 (3.16.14.11)
+    listen (2.10.1)
+      celluloid (~> 0.16.0)
+      rb-fsevent (>= 0.9.3)
+      rb-inotify (>= 0.9)
+    middleman (3.3.12)
+      coffee-script (~> 2.2)
+      compass (>= 1.0.0, < 2.0.0)
+      compass-import-once (= 1.0.5)
+      execjs (~> 2.0)
+      haml (>= 4.0.5)
+      kramdown (~> 1.2)
+      middleman-core (= 3.3.12)
+      middleman-sprockets (>= 3.1.2)
+      sass (>= 3.4.0, < 4.0)
+      uglifier (~> 2.5)
+    middleman-core (3.3.12)
+      activesupport (~> 4.1.0)
+      bundler (~> 1.1)
+      erubis
+      hooks (~> 0.3)
+      i18n (~> 0.7.0)
+      listen (>= 2.7.9, < 3.0)
+      padrino-helpers (~> 0.12.3)
+      rack (>= 1.4.5, < 2.0)
+      rack-test (~> 0.6.2)
+      thor (>= 0.15.2, < 2.0)
+      tilt (~> 1.4.1, < 2.0)
+    middleman-livereload (3.4.2)
+      em-websocket (~> 0.5.1)
+      middleman-core (>= 3.3)
+      rack-livereload (~> 0.3.15)
+    middleman-minify-html (3.4.1)
+      htmlcompressor (~> 0.2.0)
+      middleman-core (>= 3.2)
+    middleman-sprockets (3.4.2)
+      middleman-core (>= 3.3)
+      sprockets (~> 2.12.1)
+      sprockets-helpers (~> 1.1.0)
+      sprockets-sass (~> 1.3.0)
+    middleman-syntax (2.0.0)
+      middleman-core (~> 3.2)
+      rouge (~> 1.0)
+    minitest (5.7.0)
+    multi_json (1.11.2)
+    padrino-helpers (0.12.5)
+      i18n (~> 0.6, >= 0.6.7)
+      padrino-support (= 0.12.5)
+      tilt (~> 1.4.1)
+    padrino-support (0.12.5)
+      activesupport (>= 3.1)
+    rack (1.6.4)
+    rack-contrib (1.3.0)
+      git-version-bump (~> 0.15)
+      rack (~> 1.4)
+    rack-livereload (0.3.16)
+      rack
+    rack-protection (1.5.3)
+      rack
+    rack-rewrite (1.5.1)
+    rack-ssl-enforcer (0.2.8)
+    rack-test (0.6.3)
+      rack (>= 1.0)
+    rb-fsevent (0.9.5)
+    rb-inotify (0.9.5)
+      ffi (>= 0.5.0)
+    redcarpet (3.3.2)
+    ref (2.0.0)
+    rouge (1.9.1)
+    sass (3.4.16)
+    sprockets (2.12.4)
+      hike (~> 1.2)
+      multi_json (~> 1.0)
+      rack (~> 1.0)
+      tilt (~> 1.1, != 1.3.0)
+    sprockets-helpers (1.1.0)
+      sprockets (~> 2.0)
+    sprockets-sass (1.3.1)
+      sprockets (~> 2.0)
+      tilt (~> 1.1)
+    therubyracer (0.12.2)
+      libv8 (~> 3.16.14.0)
+      ref
+    thin (1.6.3)
+      daemons (~> 1.0, >= 1.0.9)
+      eventmachine (~> 1.0)
+      rack (~> 1.0)
+    thor (0.19.1)
+    thread_safe (0.3.5)
+    tilt (1.4.1)
+    timers (4.0.1)
+      hitimes
+    tzinfo (1.2.2)
+      thread_safe (~> 0.1)
+    uber (0.0.13)
+    uglifier (2.7.1)
+      execjs (>= 0.3.0)
+      json (>= 1.8.0)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  middleman-hashicorp!

website/LICENSE.md

@@ -0,0 +1,10 @@
+# Proprietary License
+
+This license is temporary while a more official one is drafted. However,
+this should make it clear:
+
+* The text contents of this website are MPL 2.0 licensed.
+
+* The design contents of this website are proprietary and may not be reproduced
+  or reused in any way other than to run the Vault website locally. The license
+  for the design is owned solely by HashiCorp, Inc.

website/Procfile

@@ -0,0 +1 @@
+web: bundle exec thin start -p $PORT

website/README.md

@@ -0,0 +1,24 @@
+# Nomad Website
+
+This subdirectory contains the entire source for the [Nomad Website](https://nomadproject.io/).
+This is a [Middleman](http://middlemanapp.com) project, which builds a static
+site from these source files.
+
+## Contributions Welcome!
+
+If you find a typo or you feel like you can improve the HTML, CSS, or
+JavaScript, we welcome contributions. Feel free to open issues or pull
+requests like any normal GitHub project, and we'll merge it in.
+
+## Running the Site Locally
+
+Running the site locally is simple. Clone this repo and run the following
+commands:
+
+```
+$ bundle
+$ bundle exec middleman server
+```
+
+Then open up `http://localhost:4567`. Note that some URLs you may need to append
+".html" to make them work (in the navigation).

website/Vagrantfile

@@ -0,0 +1,38 @@
+# -*- mode: ruby -*-
+# vi: set ft=ruby :
+
+# Vagrantfile API/syntax version. Don't touch unless you know what you're doing!
+VAGRANTFILE_API_VERSION = "2"
+
+$script = <<SCRIPT
+sudo apt-get -y update
+
+# RVM/Ruby
+sudo apt-get -y install curl
+curl -sSL https://get.rvm.io | bash -s stable
+. ~/.bashrc
+. ~/.bash_profile
+rvm install 2.0.0
+rvm --default use 2.0.0
+
+# Middleman deps
+cd /vagrant
+bundle
+
+# JS stuff
+sudo apt-get install -y python-software-properties
+sudo add-apt-repository -y ppa:chris-lea/node.js
+sudo apt-get update -y
+sudo apt-get install -y nodejs
+
+# Get JS deps
+cd /vagrant/source
+npm install
+SCRIPT
+
+Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|
+  config.vm.box = "chef/ubuntu-12.04"
+  config.vm.network "private_network", ip: "33.33.30.10"
+  config.vm.provision "shell", inline: $script, privileged: false
+  config.vm.synced_folder ".", "/vagrant", type: "rsync"
+end

website/config.rb

@@ -0,0 +1,15 @@
+#-------------------------------------------------------------------------
+# Configure Middleman
+#-------------------------------------------------------------------------
+
+set :base_url, "https://www.vaultproject.io/"
+
+activate :hashicorp do |h|
+  h.version         = ENV["VAULT_VERSION"]
+  h.bintray_enabled = ENV["BINTRAY_ENABLED"]
+  h.bintray_repo    = "mitchellh/vault"
+  h.bintray_user    = "mitchellh"
+  h.bintray_key     = ENV["BINTRAY_API_KEY"]
+
+  h.minify_javascript = false
+end

website/config.ru

@@ -0,0 +1,38 @@
+require "rack"
+require "rack/contrib/not_found"
+require "rack/contrib/response_headers"
+require "rack/contrib/static_cache"
+require "rack/contrib/try_static"
+require "rack/protection"
+
+# Protect against various bad things
+use Rack::Protection::JsonCsrf
+use Rack::Protection::RemoteReferrer
+use Rack::Protection::HttpOrigin
+use Rack::Protection::EscapedParams
+use Rack::Protection::XSSHeader
+use Rack::Protection::FrameOptions
+use Rack::Protection::PathTraversal
+use Rack::Protection::IPSpoofing
+
+# Properly compress the output if the client can handle it.
+use Rack::Deflater
+
+# Set the "forever expire" cache headers for these static assets. Since
+# we hash the contents of the assets to determine filenames, this is safe
+# to do.
+use Rack::StaticCache,
+  :root => "build",
+  :urls => ["/images", "/javascripts", "/stylesheets", "/webfonts"],
+  :duration => 2,
+  :versioning => false
+
+# Try to find a static file that matches our request, since Middleman
+# statically generates everything.
+use Rack::TryStatic,
+  :root => "build",
+  :urls => ["/"],
+  :try  => [".html", "index.html", "/index.html"]
+
+# 404 if we reached this point. Sad times.
+run Rack::NotFound.new(File.expand_path("../build/404.html", __FILE__))

website/helpers/sidebar_helpers.rb

@@ -0,0 +1,12 @@
+module SidebarHelpers
+  # This helps by setting the "active" class for sidebar nav elements
+  # if the YAML frontmatter matches the expected value.
+  def sidebar_current(expected)
+    current = current_page.data.sidebar_current || ""
+    if current.start_with?(expected)
+      return " class=\"active\""
+    else
+      return ""
+    end
+  end
+end

website/source/.gitignore

@@ -0,0 +1,2 @@
+# Source folder
+node_modules/

website/source/404.html.erb

@@ -0,0 +1,5 @@
+---
+noindex: true
+---
+
+<h2>Page Not Found</h2>

website/source/assets/javascripts/app/CubeDraw.js

@@ -0,0 +1,82 @@
+(function(){
+
+CubeDraw = Base.extend({
+
+	$cube: null,
+	ROWS: 4,
+	PADDING: 64, // 44 pixel base square + 20 padding
+	previousRowTop: null,
+	previousRowLeft: null,
+	lastCube: null,
+
+	constructor: function(){
+		this.$cube = $('.cube');
+		this.$cubes = $('#cubes');
+
+		this.lastCube = this.$cube;
+		this.previousRowLeft = parseInt(this.lastCube.css('left'), 10)
+		this.previousRowTop = parseInt(this.lastCube.css('top'), 10);
+
+		this.addEventListeners();
+	},
+
+	addEventListeners: function(){
+		var angle = this.getRadiansForAngle(30);
+		var sin = Math.sin(angle) * this.PADDING;
+		var cos = Math.cos(angle) * this.PADDING;
+
+		//sett up our parent columns
+		for(var i = 0; i < this.ROWS; i++){
+			var cube = this.lastCube.clone();
+
+			cube.css({ top: this.previousRowTop - sin, left: this.previousRowLeft - cos});
+			this.$cubes.prepend(cube);
+			this.lastCube = cube;
+			this.previousRowLeft = parseInt(this.lastCube.css('left'), 10)
+			this.previousRowTop = parseInt(this.lastCube.css('top'), 10)
+		}
+
+		//use the parent cubes as starting point for rows
+		var $allParentCubes = $('.cube');
+		var angle = this.getRadiansForAngle(150);
+		var sin = Math.sin(angle) * this.PADDING;
+		var cos = Math.cos(angle) * this.PADDING;
+
+		for(var j = this.ROWS; j > -1 ; j--){
+			var baseCube = $($allParentCubes[j]);
+
+			this.previousRowLeft = parseInt(baseCube.css('left'), 10)
+			this.previousRowTop = parseInt(baseCube.css('top'), 10)
+
+			for(var n = 0; n < this.ROWS; n++){
+				var cube = baseCube.clone();
+				cube.css({ top: this.previousRowTop - sin, left: this.previousRowLeft - cos});
+
+				this.$cubes.prepend(cube);
+
+				this.lastCube = cube;
+				this.previousRowLeft = parseInt(this.lastCube.css('left'), 10)
+				this.previousRowTop = parseInt(this.lastCube.css('top'), 10)
+			}
+		}
+
+		var $all = $('.cube');
+		for(var c = 0; c < $all.length; c++){
+			(function(index){
+				setTimeout(function(){
+					var $theCube = $($all[index]);
+					$theCube.addClass('in')
+				}, 100*c)
+			})(c)
+		}
+	},
+
+	getRadiansForAngle: function(angle) {
+		return angle * (Math.PI/180);
+	}
+
+});
+
+window.CubeDraw = CubeDraw;
+
+})();

website/source/assets/javascripts/app/DotLockup.js

@@ -0,0 +1,130 @@
+(function(){
+
+DotLockup = Base.extend({
+
+	$keyWrap: null,
+	$keys: null,
+
+	constructor: function(){
+		var _this = this;
+
+		_this.$keyWrap = $('.keys');
+		_this.$keys = $('.keys span');
+
+		//(3000)
+
+		_this.addEventListeners();
+		_this.animateFull()
+			.then(_this.animateOff.bind(this))
+			.then(_this.animateFull.bind(this))
+			.then(_this.animatePress.bind(this))
+			.then(_this.resetKeys.bind(this));
+	},
+
+	addEventListeners: function(){
+		var _this = this;
+	},
+
+	animateFull: function(uberDelay){
+		var _this = this,
+			uberDelay = uberDelay || 0,
+			deferred = $.Deferred();
+
+		setTimeout( function(){
+			_this.updateEachKeyClass('full', 'off', 1000, 150, deferred.resolve);
+		}, uberDelay)
+
+		return deferred;
+	},
+
+	animateOff: function(){
+		var deferred = $.Deferred();
+
+		this.updateEachKeyClass('full off', '', 1000, 150, deferred.resolve, true);
+		
+		return deferred;
+	},
+
+	animatePress: function(){
+		var _this = this,
+			deferred = $.Deferred(),
+			len = _this.$keys.length,
+			presses = _this.randomNumbersIn(len),
+			delay = 250,
+			interval = 600;
+
+		for(var i=0; i < len; i++){
+			(function(index){
+				setTimeout(function(){
+					_this.$keys.eq(presses[index]).addClass('press');
+					if(index == len -1 ){
+						deferred.resolve();
+					}				
+				}, delay)
+
+				delay += interval;
+			}(i))
+		}
+
+		return deferred;
+	},
+
+	resetKeys: function(){
+		var _this = this,
+			len = _this.$keys.length,
+			delay = 2500,
+			interval = 250;
+
+		setTimeout(function(){
+			_this.$keys.removeClass('full press');	
+		}, delay)
+		/*for(var i=0; i < len; i++){
+			(function(index){
+				setTimeout(function(){
+					_this.$keys.eq(index).removeClass('full press');	
+				}, delay)
+
+				delay += interval;
+			}(i))
+		}*/		
+	},
+
+	updateEachKeyClass: function(clsAdd, clsRemove, delay, interval, resolve, reverse){
+		var delay = delay;
+		this.$keys.each(function(index){
+			var span = this;
+			var finishIndex = (reverse) ? 0 : 9; // final timeout at 0 or 9 depending on if class removal is reversed on the span list
+			setTimeout( function(){ 
+				$(span).removeClass(clsRemove).addClass(clsAdd);
+				if(index == finishIndex ){
+					resolve();
+				}
+			}, delay);
+
+			if(reverse){
+				delay -= interval;
+			}else{
+				delay += interval;
+			}
+		})		
+
+	},
+
+	randomNumbersIn: function(len){
+		var arr = [];
+		while(arr.length < len){
+		  	var randomnumber=Math.floor(Math.random()*len)
+		  	var found=false;
+		  	for(var i=0;i<arr.length;i++){
+				if(arr[i]==randomnumber){found=true;break}
+		  	}
+		  	if(!found)arr[arr.length]=randomnumber;
+		}
+		return arr;
+	}
+
+});
+
+window.DotLockup = DotLockup;
+
+})();

website/source/assets/javascripts/app/Init.js

@@ -0,0 +1,45 @@
+(function(Sidebar, CubeDraw){
+
+// Quick and dirty IE detection
+var isIE = (function(){
+	if (window.navigator.userAgent.match('Trident')) {
+		return true;
+	} else {
+		return false;
+	}
+})();
+
+// isIE = true;
+
+var Init = {
+
+	start: function(){
+		var id = document.body.id.toLowerCase();
+
+		if (this.Pages[id]) {
+			this.Pages[id]();
+		}
+
+		//always init sidebar
+		Init.initializeSidebar();
+	},
+
+	initializeSidebar: function(){
+		new Sidebar();
+	},
+
+	initializeHomepage: function(){
+		new CubeDraw();
+	},
+
+	Pages: {
+		'page-home': function(){
+			Init.initializeHomepage();
+		}
+	}
+
+};
+
+Init.start();
+
+})(window.Sidebar, window.CubeDraw);

website/source/assets/javascripts/app/Sidebar.js

@@ -0,0 +1,51 @@
+(function(){
+
+Sidebar = Base.extend({
+
+	$body: null,
+	$overlay: null,
+	$sidebar: null,
+	$sidebarHeader: null,
+	$sidebarImg: null,
+	$toggleButton: null,
+
+	constructor: function(){
+		this.$body = $('body');
+		this.$overlay = $('.sidebar-overlay');
+    	this.$sidebar = $('#sidebar');
+    	this.$sidebarHeader = $('#sidebar .sidebar-header');
+    	this.$toggleButton = $('.navbar-toggle');
+
+    	this.sidebarImg = this.$sidebarHeader.css('background-image');
+
+		this.addEventListeners();
+	},
+
+	addEventListeners: function(){
+		var _this = this;
+
+	    _this.$toggleButton.on('click', function() {
+	        _this.$sidebar.toggleClass('open');
+	        if ((_this.$sidebar.hasClass('sidebar-fixed-left') || _this.$sidebar.hasClass('sidebar-fixed-right')) && _this.$sidebar.hasClass('open')) {
+	            _this.$overlay.addClass('active');
+	            _this.$body.css('overflow', 'hidden');
+	        } else {
+	            _this.$overlay.removeClass('active');
+	            _this.$body.css('overflow', 'auto');
+	        }
+
+	        return false;
+	    });
+
+	    _this.$overlay.on('click', function() {
+	        $(this).removeClass('active');
+	        _this.$body.css('overflow', 'auto');
+	        _this.$sidebar.removeClass('open');
+	    });
+	}
+
+});
+
+window.Sidebar = Sidebar;
+
+})();

website/source/assets/javascripts/application.js

@@ -0,0 +1,11 @@
+//= require jquery
+//= require bootstrap
+//= require jquery.waypoints.min
+
+//= require lib/String.substitute
+//= require lib/Function.prototype.bind
+//= require lib/Base
+
+//= require app/Sidebar
+//= require app/CubeDraw
+//= require app/Init

website/source/assets/javascripts/demo.js

@@ -0,0 +1,9 @@
+window.Demo = Ember.Application.create({
+  rootElement: '#demo-app',
+});
+
+Demo.deferReadiness();
+
+if (document.getElementById('demo-app')) {
+  Demo.advanceReadiness();
+}

website/source/assets/javascripts/html5shiv.js

@@ -0,0 +1,8 @@
+/*
+ HTML5 Shiv v3.6.2pre | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
+*/
+(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
+a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
+c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
+"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",version:"3.6.2pre",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
+for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);

website/source/assets/javascripts/lib/Base.js

@@ -0,0 +1,145 @@
+/*
+  Based on Base.js 1.1a (c) 2006-2010, Dean Edwards
+  Updated to pass JSHint and converted into a module by Kenneth Powers
+  License: http://www.opensource.org/licenses/mit-license.php
+*/
+/*global define:true module:true*/
+/*jshint eqeqeq:true*/
+(function (name, global, definition) {
+  if (typeof module !== 'undefined') {
+    module.exports = definition();
+  } else if (typeof define !== 'undefined' && typeof define.amd === 'object') {
+    define(definition);
+  } else {
+    global[name] = definition();
+  }
+})('Base', this, function () {
+  // Base Object
+  var Base = function () {};
+
+  // Implementation
+  Base.extend = function (_instance, _static) { // subclass
+    var extend = Base.prototype.extend;
+    // build the prototype
+    Base._prototyping = true;
+    var proto = new this();
+    extend.call(proto, _instance);
+    proto.base = function () {
+      // call this method from any other method to invoke that method's ancestor
+    };
+    delete Base._prototyping;
+    // create the wrapper for the constructor function
+    //var constructor = proto.constructor.valueOf(); //-dean
+    var constructor = proto.constructor;
+    var klass = proto.constructor = function () {
+        if (!Base._prototyping) {
+          if (this._constructing || this.constructor === klass) { // instantiation
+            this._constructing = true;
+            constructor.apply(this, arguments);
+            delete this._constructing;
+          } else if (arguments[0] !== null) { // casting
+            return (arguments[0].extend || extend).call(arguments[0], proto);
+          }
+        }
+      };
+    // build the class interface
+    klass.ancestor = this;
+    klass.extend = this.extend;
+    klass.forEach = this.forEach;
+    klass.implement = this.implement;
+    klass.prototype = proto;
+    klass.toString = this.toString;
+    klass.valueOf = function (type) {
+      return (type === 'object') ? klass : constructor.valueOf();
+    };
+    extend.call(klass, _static);
+    // class initialization
+    if (typeof klass.init === 'function') klass.init();
+    return klass;
+  };
+
+  Base.prototype = {
+    extend: function (source, value) {
+      if (arguments.length > 1) { // extending with a name/value pair
+        var ancestor = this[source];
+        if (ancestor && (typeof value === 'function') && // overriding a method?
+        // the valueOf() comparison is to avoid circular references
+        (!ancestor.valueOf || ancestor.valueOf() !== value.valueOf()) && /\bbase\b/.test(value)) {
+          // get the underlying method
+          var method = value.valueOf();
+          // override
+          value = function () {
+            var previous = this.base || Base.prototype.base;
+            this.base = ancestor;
+            var returnValue = method.apply(this, arguments);
+            this.base = previous;
+            return returnValue;
+          };
+          // point to the underlying method
+          value.valueOf = function (type) {
+            return (type === 'object') ? value : method;
+          };
+          value.toString = Base.toString;
+        }
+        this[source] = value;
+      } else if (source) { // extending with an object literal
+        var extend = Base.prototype.extend;
+        // if this object has a customized extend method then use it
+        if (!Base._prototyping && typeof this !== 'function') {
+          extend = this.extend || extend;
+        }
+        var proto = {
+          toSource: null
+        };
+        // do the "toString" and other methods manually
+        var hidden = ['constructor', 'toString', 'valueOf'];
+        // if we are prototyping then include the constructor
+        for (var i = Base._prototyping ? 0 : 1; i < hidden.length; i++) {
+          var h = hidden[i];
+          if (source[h] !== proto[h])
+            extend.call(this, h, source[h]);
+        }
+        // copy each of the source object's properties to this object
+        for (var key in source) {
+          if (!proto[key]) extend.call(this, key, source[key]);
+        }
+      }
+      return this;
+    }
+  };
+
+  // initialize
+  Base = Base.extend({
+    constructor: function () {
+      this.extend(arguments[0]);
+    }
+  }, {
+    ancestor: Object,
+    version: '1.1',
+    forEach: function (object, block, context) {
+      for (var key in object) {
+        if (this.prototype[key] === undefined) {
+          block.call(context, object[key], key, object);
+        }
+      }
+    },
+    implement: function () {
+      for (var i = 0; i < arguments.length; i++) {
+        if (typeof arguments[i] === 'function') {
+          // if it's a function, call it
+          arguments[i](this.prototype);
+        } else {
+          // add the interface using the extend method
+          this.prototype.extend(arguments[i]);
+        }
+      }
+      return this;
+    },
+    toString: function () {
+      return String(this.valueOf());
+    }
+  });
+
+  // Return Base implementation
+  return Base;
+});

website/source/assets/javascripts/lib/Chainable.js

@@ -0,0 +1,92 @@
+(function(){
+
+var Chainable = function(engine){
+	this.engine = engine;
+	this._chain = [];
+	this._updateTimer = this._updateTimer.bind(this);
+	this._cycle = this._cycle.bind(this);
+};
+
+Chainable.prototype._running = false;
+
+Chainable.prototype._updateTimer = function(tick){
+	this._timer += tick;
+	if (this._timer >= this._timerMax) {
+		this.resetTimer();
+		this._cycle();
+	}
+};
+
+Chainable.prototype.resetTimer = function(){
+	this.engine.updateChainTimer = undefined;
+	this._timer = 0;
+	this._timerMax = 0;
+	return this;
+};
+
+Chainable.prototype.start = function(){
+	if (this._running || !this._chain.length) {
+		return this;
+	}
+	this._running = true;
+	return this._cycle();
+};
+
+Chainable.prototype.reset = function(){
+	if (!this._running) {
+		return this;
+	}
+	this.resetTimer();
+	this._timer = 0;
+	this._running = false;
+	return this;
+};
+
+Chainable.prototype._cycle = function(){
+	var current;
+	if (!this._chain.length) {
+		return this.reset();
+	}
+
+	current = this._chain.shift();
+
+	if (current.type === 'function') {
+		current.func.apply(current.scope, current.args);
+		current = null;
+		return this._cycle();
+	}
+	if (current.type === 'wait') {
+		this.resetTimer();
+		// Convert timer to seconds
+		this._timerMax = current.time / 1000;
+		this.engine.updateChainTimer = this._updateTimer;
+		current = null;
+	}
+
+	return this;
+};
+
+Chainable.prototype.then = Chainable.prototype.exec = function(func, scope, args){
+	this._chain.push({
+		type  : 'function',
+
+		func  : func,
+		scope : scope || window,
+		args  : args  || []
+	});
+
+	return this.start();
+};
+
+Chainable.prototype.wait = function(time){
+	this._chain.push({
+		type : 'wait',
+		time : time
+	});
+
+	return this.start();
+};
+
+window.Chainable = Chainable;
+
+})();

website/source/assets/javascripts/lib/Function.prototype.bind.js

@@ -0,0 +1,21 @@
+if (!Function.prototype.bind) {
+	Function.prototype.bind = function (oThis) {
+		if (typeof this !== "function") {
+			throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
+		}
+
+		var aArgs = Array.prototype.slice.call(arguments, 1),
+		fToBind = this,
+		fNOP = function () {},
+		fBound = function () {
+			return fToBind.apply(this instanceof fNOP && oThis ?
+				this : oThis,
+				aArgs.concat(Array.prototype.slice.call(arguments)));
+		};
+
+		fNOP.prototype = this.prototype;
+		fBound.prototype = new fNOP();
+
+		return fBound;
+	};
+}

website/source/assets/javascripts/lib/String.substitute.js

@@ -0,0 +1,14 @@
+(function(String){
+
+if (String.prototype.substitute) {
+	return;
+}
+
+String.prototype.substitute = function(object, regexp){
+	return String(this).replace(regexp || (/\\?\{([^{}]+)\}/g), function(match, name){
+		if (match.charAt(0) == '\\') return match.slice(1);
+		return (object[name] !== null) ? object[name] : '';
+	});
+};
+
+})(String);

website/source/assets/javascripts/lib/dbg.js

@@ -0,0 +1,60 @@
+/*
+ *
+ *	name: dbg
+ *
+ *	description: A bad ass little console utility, check the README for deets
+ *
+ *	license: MIT-style license
+ *
+ *	author: Amadeus Demarzi
+ *
+ *	provides: window.dbg
+ *
+ */
+
+(function(){
+
+	var global = this,
+
+		// Get the real console or set to null for easy boolean checks
+		realConsole = global.console || null,
+
+		// Backup / Disabled Lambda
+		fn = function(){},
+
+		// Supported console methods
+		methodNames = ['log', 'error', 'warn', 'info', 'count', 'debug', 'profileEnd', 'trace', 'dir', 'dirxml', 'assert', 'time', 'profile', 'timeEnd', 'group', 'groupEnd'],
+
+		// Disabled Console
+		disabledConsole = {
+
+			// Enables dbg, if it exists, otherwise it just provides disabled
+			enable: function(quiet){
+				global.dbg = realConsole ? realConsole : disabledConsole;
+			},
+
+			// Disable dbg
+			disable: function(){
+				global.dbg = disabledConsole;
+			}
+
+		}, name, i;
+
+	// Setup disabled console and provide fallbacks on the real console
+	for (i = 0; i < methodNames.length;i++){
+		name = methodNames[i];
+		disabledConsole[name] = fn;
+		if (realConsole && !realConsole[name])
+			realConsole[name] = fn;
+	}
+
+	// Add enable/disable methods
+	if (realConsole) {
+		realConsole.disable = disabledConsole.disable;
+		realConsole.enable = disabledConsole.enable;
+	}
+
+	// Enable dbg
+	disabledConsole.enable();
+
+}).call(this);

website/source/assets/javascripts/respond.min.js

@@ -0,0 +1,6 @@
+/*! matchMedia() polyfill - Test a CSS media type/query in JS. Authors & copyright (c) 2012: Scott Jehl, Paul Irish, Nicholas Zakas. Dual MIT/BSD license */
+/*! NOTE: If you're already including a window.matchMedia polyfill via Modernizr or otherwise, you don't need this part */
+window.matchMedia=window.matchMedia||function(a){"use strict";var c,d=a.documentElement,e=d.firstElementChild||d.firstChild,f=a.createElement("body"),g=a.createElement("div");return g.id="mq-test-1",g.style.cssText="position:absolute;top:-100em",f.style.background="none",f.appendChild(g),function(a){return g.innerHTML='&shy;<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',d.insertBefore(f,e),c=42===g.offsetWidth,d.removeChild(f),{matches:c,media:a}}}(document);
+
+/*! Respond.js v1.1.0: min/max-width media query polyfill. (c) Scott Jehl. MIT/GPLv2 Lic. j.mp/respondjs  */
+(function(a){"use strict";function x(){u(!0)}var b={};a.respond=b,b.update=function(){},b.mediaQueriesSupported=a.matchMedia&&a.matchMedia("only all").matches,b.mediaQueriesSupported;var q,r,t,c=a.document,d=c.documentElement,e=[],f=[],g=[],h={},i=30,j=c.getElementsByTagName("head")[0]||d,k=c.getElementsByTagName("base")[0],l=j.getElementsByTagName("link"),m=[],n=function(){for(var b=0;l.length>b;b++){var c=l[b],d=c.href,e=c.media,f=c.rel&&"stylesheet"===c.rel.toLowerCase();d&&f&&!h[d]&&(c.styleSheet&&c.styleSheet.rawCssText?(p(c.styleSheet.rawCssText,d,e),h[d]=!0):(!/^([a-zA-Z:]*\/\/)/.test(d)&&!k||d.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&m.push({href:d,media:e}))}o()},o=function(){if(m.length){var a=m.shift();v(a.href,function(b){p(b,a.href,a.media),h[a.href]=!0,setTimeout(function(){o()},0)})}},p=function(a,b,c){var d=a.match(/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi),g=d&&d.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+b+"$2$3")},i=!g&&c;b.length&&(b+="/"),i&&(g=1);for(var j=0;g>j;j++){var k,l,m,n;i?(k=c,f.push(h(a))):(k=d[j].match(/@media *([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1,f.push(RegExp.$2&&h(RegExp.$2))),m=k.split(","),n=m.length;for(var o=0;n>o;o++)l=m[o],e.push({media:l.split("(")[0].match(/(only\s+)?([a-zA-Z]+)\s?/)&&RegExp.$2||"all",rules:f.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(/\(min\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(/\(max\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},s=function(){var a,b=c.createElement("div"),e=c.body,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",e||(e=f=c.createElement("body"),e.style.background="none"),e.appendChild(b),d.insertBefore(e,d.firstChild),a=b.offsetWidth,f?d.removeChild(e):e.removeChild(b),a=t=parseFloat(a)},u=function(a){var b="clientWidth",h=d[b],k="CSS1Compat"===c.compatMode&&h||c.body[b]||h,m={},n=l[l.length-1],o=(new Date).getTime();if(a&&q&&i>o-q)return clearTimeout(r),r=setTimeout(u,i),void 0;q=o;for(var p in e)if(e.hasOwnProperty(p)){var v=e[p],w=v.minw,x=v.maxw,y=null===w,z=null===x,A="em";w&&(w=parseFloat(w)*(w.indexOf(A)>-1?t||s():1)),x&&(x=parseFloat(x)*(x.indexOf(A)>-1?t||s():1)),v.hasquery&&(y&&z||!(y||k>=w)||!(z||x>=k))||(m[v.media]||(m[v.media]=[]),m[v.media].push(f[v.rules]))}for(var B in g)g.hasOwnProperty(B)&&g[B]&&g[B].parentNode===j&&j.removeChild(g[B]);for(var C in m)if(m.hasOwnProperty(C)){var D=c.createElement("style"),E=m[C].join("\n");D.type="text/css",D.media=C,j.insertBefore(D,n.nextSibling),D.styleSheet?D.styleSheet.cssText=E:D.appendChild(c.createTextNode(E)),g.push(D)}},v=function(a,b){var c=w();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},w=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}();n(),b.update=n,a.addEventListener?a.addEventListener("resize",x,!1):a.attachEvent&&a.attachEvent("onresize",x)})(this);

website/source/assets/stylesheets/_api.scss

@@ -0,0 +1,51 @@
+//
+// API
+// --------------------------------------------------
+
+.bs-api-section dl, dl.api {
+    margin-top: 30px;
+    line-height: 20px;
+
+    dt {
+        color: #888;
+        text-transform: uppercase;
+        font-weight: normal;
+        float: left;
+        width: 150px;
+        text-align: right;
+    }
+
+    dd {
+        margin-left: 170px;
+
+        pre.api-sample {
+            margin-top: 20px;
+            font-size: 14px;
+            padding: 10px;
+        }
+    }
+
+    ul {
+        margin: 0;
+        padding: 0;
+
+        li {
+            margin: 0;
+            list-style-type: none;
+            padding-bottom: 20px;
+            font-size: 15px;
+            font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
+            font-weight: 500;
+
+            span.param {
+                font-weight: bold;
+            }
+
+            span.param-flags {
+                font-style: italic;
+                color: #888;
+                padding-right: 6px;
+            }
+        }
+    }
+}

website/source/assets/stylesheets/_buttons.scss

@@ -0,0 +1,119 @@
+//
+// Button Styles
+// --------------------------------------------------
+
+.h-btn{
+	display: inline-block;
+	background-color: $white;
+	color: $black;
+	@include transition(color .3s ease-in-out);
+	//@include btn-shadow();
+	font-family: $font-family-blanc-reg;
+	text-transform: uppercase;
+	border-radius: 3px;
+
+	&.has-caret{
+		span.h-caret{
+			display: inline-block;
+			width: 8px;
+			height: 12px;
+			margin-left: 10px;
+			@include transition(all 300ms ease-in);
+		}
+	}
+
+	&.lrg{
+		font-size: $font-size-reg;
+		padding: 10px 24px;
+	}
+
+	&.sml{
+		padding: 8px 14px;
+		font-size: $font-size-reg - 2;
+	    line-height: 14px;
+
+		&.has-caret{
+			span.h-caret{
+				background-size: 6px 9px !important;
+				margin-bottom: -2px;
+				margin-right: -3px;
+			}
+		}
+	}
+
+	&.light{
+		color: $green-light;
+
+		&.has-border{
+			border: 2px solid $green-light;
+		}
+
+		&.has-caret{
+			span.h-caret{
+				background: image-url('../images/caret-light.png') 0 0 no-repeat;
+				@include img-retina("../images/caret-light.png", "../images/caret-light@2x.png", 8px, 12px);
+			}
+		}
+	}
+
+	&.green{
+		color: $green;
+
+		&.has-border{
+			border: 2px solid $green;
+		}
+
+		span.h-caret{
+			background: image-url('../images/caret-green.png') 0 0 no-repeat;
+			@include img-retina("../images/caret-green.png", "../images/caret-green@2x.png", 8px, 12px);
+		}
+
+		&.fill{
+			background-color: $green;
+			color: $white;
+
+			span.h-caret{
+				background: image-url('../images/caret-white.png') 0 0 no-repeat;
+				@include img-retina("../images/caret-white.png", "../images/caret-white@2x.png", 8px, 12px);
+			}
+		}
+	}
+
+	&.gray{
+		color: $blue-light;
+
+		&.border{
+			border: 2px solid $blue-light;
+		}
+
+		&.fill{
+			background-color: $blue-light;
+			color: $white;
+
+			span.h-caret{
+				background: image-url('../images/caret-white.png') 0 0 no-repeat;
+				@include img-retina("../images/caret-white.png", "../images/caret-white@2x.png", 8px, 12px);
+			}
+		}
+	}
+
+	&.dark{
+		color: $green-dark;
+
+		&.border{
+			border: 2px solid $green-dark;
+		}
+	}
+
+	&:hover{
+		text-decoration: none;
+		@include transition(color 200ms ease-in);
+
+		&.has-caret{
+			span.h-caret{
+				@include translate(4px, 0);
+				@include transition(all 200ms ease-in);
+			}
+		}
+	}
+}

website/source/assets/stylesheets/_community.scss

@@ -0,0 +1,21 @@
+.people {
+    margin-top: 30px;
+
+    .person {
+        margin-bottom: 40px;
+
+        h3 {
+            color: $blue-dark;
+            text-transform: none;
+        }
+
+        img {
+            width: 125px;
+            margin: auto auto;
+        }
+
+        .bio {
+            padding-left: 150px;
+        }
+    }
+}

website/source/assets/stylesheets/_docs.scss

@@ -0,0 +1,283 @@
+//
+// Docs
+// --------------------------------------------------
+
+body.layout-atlas,
+body.layout-consul,
+body.layout-dnsimple,
+body.layout-dme,
+body.layout-cloudflare,
+body.layout-cloudstack,
+body.layout-google,
+body.layout-heroku,
+body.layout-mailgun,
+body.layout-digitalocean,
+body.layout-aws,
+body.layout-docs,
+body.layout-inner,
+body.layout-downloads,
+body.layout-intro{
+	//background: $light-black image-url('sidebar-wire.png') left 62px no-repeat;
+	>.container{
+		.col-md-8[role=main]{
+			min-height: 800px;
+			background-color: white;
+
+			>div{
+				position: relative;
+				z-index: 10;
+			}
+		}
+	}
+}
+
+.docs-sidebar{
+  	position: relative;
+  	z-index: 20;
+  	margin-bottom: 30px;
+	margin-top: 50px;
+	margin-right: 4%;
+	@include open();
+
+	.nav.docs-sidenav{
+		padding-bottom: 15px;
+
+		:last-child{
+			border-bottom: none;
+		}
+
+		//all li
+		li{
+			position: relative;
+
+			> a{
+				padding: 10px 0 10px 8px;
+				font-size: 15px;
+				color: $blue-dark;
+
+				&:before{
+					@include bez-1-transition();
+				}
+
+				&:hover{
+					background-color: transparent !important;
+
+					&:before{
+						@include bez-1-transition();
+					}
+				}
+			}
+		}
+
+		$parent-active-state: -14px;
+		$parent-default-state: -10px;
+		$child-active-state: -4px;
+		$child-default-state: 0px;
+
+		//first teir li
+		> li {
+			margin: 0 0 0 10px;
+
+			&.active {
+				>a{
+					color: $green-dark;
+					font-weight: 600;
+					border-right: 1px solid $green-faint;
+
+					&:hover{
+						&:before{
+							left: $parent-default-state;
+						}
+					}
+
+					&:before{
+						@include rotate(90deg);
+						opacity: 1;
+					}
+				}
+
+				.nav {
+					display: block;
+				}
+			}
+
+			> a {
+        		-webkit-font-smoothing: antialiased;
+
+				&:hover{
+					&:before{
+						left: $parent-active-state;
+					}
+				}
+
+				&:before{
+					content: '';
+					position: absolute;
+			        width: 8px;
+			        height: 12px;
+					top: 15px;
+					left: $parent-default-state;
+					overflow: hidden;
+					background: url(../images/caret-green.png) 0 0 no-repeat;
+					opacity: .3;
+					@include img-retina("../images/caret-light.png", "../images/caret-light@2x.png", 6px, 9px);
+				}
+			}
+		}
+
+		//nested ul.nav
+		.nav {
+			display: none;
+			padding-top: 10px;
+			padding-bottom: 10px;
+			margin-bottom: 15px;
+			border-right: 1px solid $green-faint;
+		    border-bottom: 1px solid $green-faint;
+
+			> li{
+				margin-left: 10px;
+
+				&.active{
+					> a{
+		            	color: $green-dark;
+						font-weight: 600;
+
+						&:hover{
+							&:before{
+								left: $child-default-state;
+							}
+						}
+
+						&:before{
+							//background: url(../images/triangle-sprite.png) 0 0 no-repeat;
+							//@include img-retina("../images/triangle-sprite.png", "../images/triangle-sprite@2x.png", 5px, 19px);
+						}
+					}
+				}
+
+				> a{
+          			-webkit-font-smoothing: antialiased;
+					padding: 6px 15px;
+
+					&:hover{
+						&:before{
+							left: $child-active-state;
+						}
+					}
+
+					&:before{
+						opacity: .75;
+						content: '';
+						position: absolute;
+				        width: 5px;
+				        height: 7px;
+						top: 12px;
+						left: $child-default-state;
+						overflow: hidden;
+						//background: url(../images/triangle-sprite.png) 0 -13px no-repeat;
+						//@include img-retina("../images/triangle-sprite.png", "../images/triangle-sprite@2x.png", 5px, 19px);
+					}
+				}
+			}
+		}
+
+        .nav-visible {
+            display: block;
+        }
+	}
+}
+
+
+.bs-docs-section{
+	padding-top: 10px;
+	padding-left: 3%;
+	padding-bottom: 80px;
+
+	.lead{
+		margin-bottom: 48px
+	}
+
+	.doc-sectional{
+		margin-bottom: 48px;
+	}
+
+	p, li, .alert {
+		color: $blue-dark;
+		font-size: 18px;
+		font-family: $font-family-open-sans;
+		font-weight: $font-weight-reg;
+    	line-height: 1.84em;
+		margin: 0 0 18px;
+    	-webkit-font-smoothing: antialiased;
+	}
+
+    pre{
+        margin: 0 0 18px;
+    }
+
+	a{
+		color: $green-dark;
+		border-bottom: 1px solid $green-dark;
+		@include transition(all 300ms ease-in);
+
+		&:hover{
+			color: $blue-dark;
+			border-bottom: 2px solid $blue-dark;
+			text-decoration: none;
+			@include transition(all 300ms ease-in);
+		}
+	}
+
+    img{
+        max-width: 650px;
+        margin-top: 25px;
+        margin-bottom: 25px;
+    }
+
+	h1, .h1, h2, .h2, h3, .h3, h4, .h4{
+		color: $gray-dark;
+		margin-top: 54px;
+		margin-bottom: 18px;
+    	@include open-sb();
+	}
+
+	h1{
+		font-size: 36px;
+	}
+
+    #graph {
+        margin-top: 30px;
+    }
+}
+
+
+@media (max-width: 992px) {
+
+  .bs-docs-section{
+  	  padding-left: 0;
+  }
+}
+
+@media (max-width: 768px) {
+	.bs-docs-section{
+		padding-top: 0;
+		h1{
+			margin-top: 0;
+		}
+	}
+}
+
+
+
+
+@media (max-width: 480px) {
+	.bs-docs-section{
+        img{
+            max-width: 450px;
+        }
+
+		h1{
+			font-size: 32px;
+		}
+	}
+}

website/source/assets/stylesheets/_downloads.scss

@@ -0,0 +1,59 @@
+.downloads {
+    margin-top: 20px;
+
+    .description {
+        margin-bottom: 20px;
+    }
+
+    .download {
+        border-bottom: 1px solid #b2b2b2;
+        padding-bottom: 15px;
+        margin-top: 10px;
+        margin-bottom: 10px;
+
+        .details {
+            padding-left: 95px;
+
+            h2 {
+                margin-top: 30px;
+            }
+
+            ul {
+                padding-left: 0px;
+            }
+
+            li {
+                display: inline-block;
+
+                &:after {
+                    content: " | ";
+                }
+
+                &:last-child:after {
+                    content: "";
+                }
+            }
+        }
+
+        .icon {
+            img {
+                width: 75px;
+            }
+        }
+
+        .os-name {
+            font-size: 40px;
+            margin-bottom: -3px;
+        }
+    }
+
+    .poweredby {
+        margin-top: 20px;
+
+        img {
+            display: block;
+            margin: 0 auto;
+            width: 122px;
+        }
+    }
+}

website/source/assets/stylesheets/_footer.scss

@@ -0,0 +1,116 @@
+body.page-sub{
+    #footer{
+        padding: 0 0 40px 0;
+        .col-md-5{
+            padding-top: 40px;
+            border-top: 1px solid $faint-gray;
+        }
+    }
+}
+
+#footer{
+    padding: 40px 0;
+    color: black;
+
+    .footer-links{
+        margin-bottom: 20px;
+
+        .li-under a:hover::after,
+        .li-under a:focus::after {
+            opacity: 1;
+            -webkit-transform: skewY(15deg) translateY(8px);
+            -moz-transform: skewY(15deg) translateY(8px);
+            transform: skewY(15deg) translateY(8px);
+        }
+
+        .li-under a::after {
+            background-color: $purple;
+        }
+
+        li{
+            a{
+                @include v-nav-style();
+            }
+        }
+    }
+
+    .pull-right{
+        padding-right: 15px;
+    }
+
+    .footer-hashi{
+        font-size: 14px;
+
+        a{
+            color: black;
+            font-weight: 600;
+        }
+
+        span{
+            margin-right: 4px;
+        }
+
+        .hashi-logo{
+            display: inline-block;
+            vertical-align: middle;
+            i{
+                display: inline-block;
+                margin-top: -2px;
+                width: 27px;
+                height: 28px;
+                background: image-url('../images/hashi-logo.png') 0 0 no-repeat;
+                @include img-retina('../images/hashi-logo.png', '../images/hashi-logo@2x.png', 27px, 28px);
+            }
+        }
+    }
+}
+
+@media (max-width: 992px) {
+
+}
+
+@media (max-width: 768px) {
+
+    body.page-sub{
+        #footer{
+            .col-md-5{
+                &:last-child{
+                    padding-top: 0;
+                    border-top: none;
+                }
+            }
+        }
+    }
+
+    #footer{
+        padding: 100px 0 40px;
+        text-align: center;
+
+        .footer-links{
+            float: none;
+            display: inline-block;
+        }
+
+        .footer-hashi {
+            float: none;
+            display: inline-block;
+
+            .pull-right{
+                float: none !important;
+            }
+        }
+    }
+}
+
+@media (max-width: 320px) {
+
+    #footer{
+        text-align: center;
+
+        .footer-links{
+            .li-under{
+                float: none !important;
+            }
+        }
+    }
+}

website/source/assets/stylesheets/_global.scss

@@ -0,0 +1,90 @@
+//
+// Global Site
+// --------------------------------------------------
+
+/*html{
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+}*/
+
+body {
+    -webkit-font-smoothing: antialiased;
+    color: $black;
+    background-color: $white;
+    font-size: 15px;
+    font-family: $font-family-open-sans;
+    font-weight: 500;
+}
+
+
+h1, h2, h3, h4, h5 {
+    -webkit-font-smoothing: antialiased;
+}
+h1{
+	font-size: 42px;
+	line-height: 42px;
+	font-family: $font-family-open-sans;
+	font-weight: $font-weight-reg;
+	margin-bottom: 24px;
+}
+
+h3{
+	font-size: 28px;
+	line-height: 28px;
+	font-family: $font-family-open-sans;
+	font-weight: $font-weight-reg;
+}
+
+//an alternative color for buttons in the doc body
+.btn-serf{
+	color: $white !important;
+	background-color: $btn-color;
+	border-radius: $btn-border-radius;
+	//@include box-shadow( $shadow );
+}
+
+.highlight{
+	margin-bottom: 18px;
+}
+
+pre {
+	background-color: $black;
+	color: $white;
+	font-size: 14px;
+	font-weight: normal;
+	font-family: "Courier New", Monaco, Menlo, Consolas, monospace;
+	border: none;
+	padding: 20px;
+	margin-bottom: 0;
+}
+
+
+//fixed grid below 992 to prevent smaller responsive sizes
+@media (max-width: 992px) {
+	.container{
+		max-width: 970px;
+	}
+}
+
+//all below styles are overriding corrections for below (min-width: 992px)
+//below (min-width: 992px) these styles change
+.navbar-nav {
+	margin: 0;
+}
+
+.navbar-right {
+	float: right !important;
+}
+
+.navbar-nav > li {
+	float: left;
+}
+
+.navbar-nav > li > a {
+	padding-top: 15px;
+	padding-bottom: 15px;
+}
+
+.center {
+    text-align: center;
+}

website/source/assets/stylesheets/_header.scss

@@ -0,0 +1,131 @@
+//
+// Header
+// --------------------------------------------------
+
+#header {
+    position: relative;
+    color: $white;
+    text-rendering: optimizeLegibility;
+    margin-bottom: 0;
+    /* opacity: 0;
+    @include translate3d(0, -10px, 0); */
+    transition: all 1s ease;
+
+    /* &.showit{
+        opacity: 1;
+        @include translate3d(0, 0px, 0);
+        transition: all 1s ease;
+    } */
+
+    &.navbar-static-top{
+        height:70px;
+        z-index: 1000;
+    }
+
+    .navbar-header{
+
+        .navbar-toggle{
+            padding-right: 15px;
+            margin-top: 26px;
+            margin-bottom: 14px;
+            margin-right: 0;
+            //border: 2px solid $white;
+            border-radius: 0;
+            .icon-bar{
+                border: 1px solid $black;
+                border-radius: 0;
+            }
+        }
+    }
+
+
+    .navbar-brand {
+        display: inline-block;
+        padding: 0;
+        margin: 30px 10px 0 0 ;
+
+        .logo{
+            display: inline-block;
+            height: 56px;
+            padding: 0;
+            color: $gray-darker;
+            font-family: $font-family-blanc;
+            font-size: 28px;
+            line-height: 56px;
+            padding-left: 60px;
+            background: image-url('../images/logo-header.png') 0 0 no-repeat;
+            @include img-retina("../images/logo-header.png", "../images/logo-header@2x.png", 49px, 56px);
+
+            &:hover{
+				@include transition(all 300ms ease-in);
+				color: $green-dark;
+				text-decoration: none;
+			}
+        }
+    }
+
+    .main-links.navbar-nav{
+        margin-top: 50px;
+        margin-left: 120px;
+
+        li > a {
+            @include v-nav-style();
+        }
+    }
+
+    .buttons{
+        ul.navbar-nav{
+            margin-top: 50px;
+            li {
+              padding-left: 12px;
+
+              &.download{
+                background: image-url('../images/icon-download.png') 0 0 no-repeat;
+                @include img-retina("../images/icon-download.png", "../images/icon-download@2x.png", 18px, 18px);
+                margin-right: 22px;
+                background-position: 0 1px;
+              }
+
+              &.github{
+                background: image-url('../images/icon-github.png') 0 0 no-repeat;
+                @include img-retina("../images/icon-github.png", "../images/icon-github@2x.png", 19px, 18px);
+                background-position: 0 1px;
+              }
+
+              >a {
+                    @include v-nav-style();
+                }
+            }
+        }
+    }
+
+    .nav > li > a:hover, .nav > li > a:focus {
+        background-color: transparent;
+        color: $black;
+        @include transition( color 0.3s ease );
+    }
+}
+
+@media (min-width: 992px) {
+
+}
+
+@media (max-width: 992px) {
+
+}
+
+@media (max-width: 768px) {
+
+}
+
+@media (max-width: 763px) {
+    .navbar-static-top {
+        .nav-white {
+            background-color:rgba(0,0,0,0.5);
+        }
+    }
+}
+
+@media (max-width: 320px) {
+
+}

website/source/assets/stylesheets/_home.scss

@@ -0,0 +1,490 @@
+//
+// Home
+// --------------------------------------------------
+
+#hero{
+	@include translate3d(0, -10px, 0);
+	text-align: center;
+
+	#hero-graphic{
+		position: relative;
+		display: inline-block;
+		width: 499px;
+		height: 340px;
+		margin: 120px auto;
+
+		#hero-logotype{
+			position: absolute;
+			display: inline-block;
+		    top: 75px;
+		    left: 187px;
+			width: 115px;
+			height: 155px;
+			background: image-url('../images/hero-logotype.png') 0 0 no-repeat;
+			@include img-retina("../images/hero-logotype.png", "../images/hero-logotype@2x.png", 115px, 155px);
+		}
+
+		#cubes{
+			.cube{
+				position: absolute;
+			  	top: 300px;
+			  	left: 248px;
+				opacity: 0.01;
+				@include transform( translate(0, 150px) );
+				@include transition( all 1.5s $easeInOutBack );
+
+				&.in{
+				  	@include transform( translate(0, 0) );
+				  	opacity: 1;
+				}
+
+				.face {
+				  	@include transform-origin(0 0);
+				  	position: absolute;
+				  	height: 44px;
+				  	width: 44px;
+
+					&.top{
+						background-color: $green;
+						@include transform(rotate(210deg) skewX(-30deg) scaleY(0.864) );
+					}
+					&.left{
+						background-color: $green-dark;
+						@include transform(rotate(90deg) skewX(-30deg) scaleY(0.864) );
+					}
+					&.right{
+						background-color: $green-light;
+						@include transform(rotate(-30deg) skewX(-30deg) scaleY(0.864) );
+					}
+				}
+			}
+		}
+	}
+
+	#hero-text{
+		position: relative;
+		text: center;
+
+		h1{
+			color: $blue-dark;
+			font-size: $font-size-xl;
+			font-family: $font-family-blanc;
+		}
+
+		h3{
+			color: $blue-light;
+			font-size: $font-size-m;
+			font-family: $font-family-blanc;
+		}
+
+		#hero-btns{
+			margin-top: 26px;
+			a{
+
+			}
+		}
+	}
+
+	#tag-line{
+		margin: 15px 0 20px 0;
+		font-size: 24px;
+		font-weight: 300;
+	}
+
+	p{
+		margin-top: 60px;
+		text-align: left;
+		font-size: 18px;
+		font-weight: 300;
+		line-height: 2em;
+
+		.strong{
+			font-size: 20px;
+			font-weight: 500;
+		}
+	}
+}
+
+.banner{
+	margin-top: 120px;
+
+	&.gray-banner{
+		.col{
+			border: 1px solid $blue-faint;
+		}
+
+		p{
+			color: $blue-light;
+		}
+	}
+
+	&.green-banner{
+		.col{
+			border: 1px solid $blue-faint;
+		}
+
+		p{
+			color: $blue-dark;
+		}
+	}
+
+	&#cta-banner{
+		margin-top: 0;
+		margin-bottom: 80px;
+
+		.col{
+			padding: 60px 20px;
+		}
+	}
+
+	.col{
+		padding: 20px;
+		text-align: center;
+		border-radius: 3px;
+	}
+
+	p{
+		margin-bottom: 0px;
+		margin-right: 30px;
+		font-size: $font-size-reg;
+		line-height: $font-size-reg;
+		font-family: $font-family-blanc-reg;
+	}
+
+	p, a{
+		display: inline-block;
+	}
+}
+
+#content{
+	overflow: hidden;
+	margin-top: 120px;
+
+	h2{
+		margin-bottom: 120px;
+		text-align: center;
+		font-size: $font-size-m;
+		font-family: $font-family-blanc;
+		color: $green;
+		text-transform: uppercase;
+	}
+
+	.feature{
+		position: relative;
+		margin-bottom: 150px;
+		padding-bottom: 80px;
+		border-bottom: 1px solid $blue-faint;
+
+		&:last-child{
+			border-bottom: none;
+		}
+
+		&#deploy{
+			padding-bottom: 835px;
+			width: 1161px;
+			height: 735px;
+			background: image-url('../images/feature-deploy.png') 0 0 no-repeat;
+			@include img-retina("../images/feature-deploy.png", "../images/feature-deploy@2x.png", 1161px, 735px);
+		}
+
+		&#maintain{
+			.feature-graphic{
+				margin-top: -50px;
+				width: 1113px;
+				height: 689px;
+				background: image-url('../images/feature-manage.png') 0 0 no-repeat;
+				@include img-retina("../images/feature-manage.png", "../images/feature-manage@2x.png", 1113px, 689px);
+			}
+		}
+
+		&#healing{
+			.feature-graphic{
+				margin-top: 80px;
+				width: 1009px;
+				height: 309px;
+				background: image-url('../images/feature-healing.png') 0 0 no-repeat;
+				@include img-retina("../images/feature-healing.png", "../images/feature-healing@2x.png", 1009px, 309px);
+			}
+		}
+
+		&#density{
+			.feature-graphic{
+				margin-top: 80px;
+				width: 1040px;
+				height: 409px;
+				background: image-url('../images/feature-density.png') 0 0 no-repeat;
+				@include img-retina("../images/feature-density.png", "../images/feature-density@2x.png", 1040px, 409px);
+			}
+		}
+
+		&#partners{
+			.partner-logos{
+				.docker-wrap{
+					border-right: 1px solid $blue-faint;
+
+					.partner-logo{
+						display: inline-block;
+						width: 120px;
+						height: 180px;
+
+						&.docker-logo{
+			    			background: image-url('../images/partner-docker.png') center center no-repeat;
+			   				@include img-retina("../images/partner-docker.png", "../images/partner-docker@2x.png", 100px, 84px);
+						}
+					}
+				}
+
+				.cloud-wrap{
+					.partner-logo{
+						float: left;
+						width: 25%;
+						height: 180px;
+
+						&.aws-logo{
+			    			background: image-url('../images/partner-amazon.png') center center no-repeat;
+			   				@include img-retina("../images/partner-amazon.png", "../images/partner-amazon@2x.png", 153px, 56px);
+						}
+						&.google-logo{
+			    			background: image-url('../images/partner-google.png') center center no-repeat;
+			   				@include img-retina("../images/partner-google.png", "../images/partner-google@2x.png", 135px, 87px);
+						}
+						&.microsoft-logo{
+			    			background: image-url('../images/partner-microsoft.png') center center no-repeat;
+			   				@include img-retina("../images/partner-microsoft.png", "../images/partner-microsoft@2x.png", 188px, 84px);
+						}
+						&.engineyard-logo{
+			    			background: image-url('../images/partner-engineyard.png') center center no-repeat;
+			   				@include img-retina("../images/partner-engineyard.png", "../images/partner-engineyard@2x.png", 178px, 37px);
+						}
+
+					}
+				}
+			}
+		}
+
+		&#audit{
+			.graphic{
+				width: 491px;
+				height: 129px;
+			    background: image-url('../images/graphic-audit.png') 0 0 no-repeat;
+			   	@include img-retina("../images/graphic-audit.png", "../images/graphic-audit@2x.png", 491px, 129px);
+			}
+		}
+
+		.feature-graphic{
+			margin: 0 auto;
+		}
+
+		.feature-header{
+
+			&.right{
+				h3, p{
+					text-align: right;
+					display: block;
+					float: right;
+				}
+			}
+
+			h3{
+				margin: 30px 0 20px 0;
+				color: $blue-dark;
+				letter-spacing: 1px;
+				font-size: $font-size-l;
+				font-family: $font-family-blanc;
+				line-height: 1.25em;
+				max-width: 640px;
+			}
+
+			p{
+				margin-bottom: 30px;
+				color: $blue-light;
+				font-size: $font-size-reg+2;
+				font-family: $font-family-blanc-reg;
+				line-height: 1.75em;
+				max-width: 480px;
+			}
+		}
+
+		.feature-footer{
+			position: absolute;
+			bottom: 0;
+			left: 0;
+			padding-bottom: 80px;
+
+			p{
+				display: inline-block;
+				color: $blue-dark;
+				font-size: $font-size-reg;
+				font-family: $font-family-blanc;
+				line-height: 1.75em;
+				max-width: 320px;
+				padding-left: 20px;
+				border-left: 1px solid $blue-faint;
+			}
+
+			.docker-outline-logo{
+				display: inline-block;
+				width: 125px;
+				height: 80px;
+				margin-right: 20px;
+			    background: image-url('../images/icon-docker-outline.png') 0 0 no-repeat;
+			   	@include img-retina("../images/icon-docker-outline.png", "../images/icon-docker-outline@2x.png", 125px, 80px);
+			}
+
+			a{
+				margin-bottom: 15px;
+				margin-left: 15px;
+
+				&:first-child{
+					margin-left: 0;
+				}
+			}
+		}
+	}
+
+	#cta {
+		position: relative;
+		padding: 160px 0;
+		background: image-url('../images/bg-iconscrud.png') center center no-repeat;
+		@include img-retina("../images/bg-icons.png", "../images/bg-icons@2x.png", 669px, 260px);
+		background-position: center center;
+		border-top: 1px solid $faint-gray;
+		border-bottom: 1px solid $faint-gray;
+
+		a{
+			margin-bottom: 5px;
+		}
+
+		p{
+			margin-top: 10px;
+			color: $black;
+			font-size: 14px;
+			font-weight: 600;
+	    	line-height: 1.5esm;
+
+	    	&.cta-gray{
+	    		color: $gray;
+	    		font-weight: 300;
+	    	}
+		}
+
+		.outline-btn {
+			padding: 16px 40px;
+			display: inline-block;
+			&:focus {
+		    	outline: 0;
+			}
+		}
+	}
+}
+
+@media (min-width: 1200px) {
+
+}
+
+
+@media (max-width: 1200px) {
+
+}
+
+@media (min-width: 992px) and (max-width:1200px) {
+	#cta a {
+		margin-top: 15px;
+		font-size: 18px;
+	}
+}
+
+@media (min-width: 768px) and (max-width:992px) {
+	#cta a {
+		margin-top: 10px;
+	}
+}
+
+@media (max-width: 992px) {
+
+}
+
+@media (max-width: 768px) {
+	#cta{
+		.intro{
+			text-align: center;
+			p{
+				text-align: center;
+				margin-bottom: 15px;
+			}
+		}
+	}
+}
+
+
+@media (max-width: 480px) {
+	#hero{
+		#diagram{
+			width: 100%;
+			height: 132px;
+		    background: image-url('../images/hero.png') center 0 no-repeat;
+		   	@include img-retina("../images/hero.png", "../images/hero@2x.png", 320px, 132px);
+		}
+	}
+
+	#content{
+		.feature{
+			&#audit{
+				.graphic{
+					width: 100%;
+					height: 84px;
+				    background: image-url('../images/graphic-audit.png') center 0 no-repeat;
+				   	@include img-retina("../images/graphic-audit.png", "../images/graphic-audit@2x.png", 320px, 84px);
+				}
+			}
+		}
+	}
+
+	.feature-footer{
+		text-align: center;
+		a{
+			margin-bottom: 15px;
+			margin-left: 0 !important;
+		}
+	}
+}
+
+
+@media (max-width: 320px) {
+
+	#hero{
+		#diagram{
+			width: 100%;
+			height: 132px;
+		    background: image-url('../images/hero.png') center 0 no-repeat;
+		   	@include img-retina("../images/hero.png", "../images/hero@2x.png", 320px, 132px);
+		}
+	}
+
+	#content{
+		.feature{
+			&#crud{
+				.graphic{
+					width: 100%;
+					height: 111px;
+				    background: image-url('../images/graphic-crud.png') center 0 no-repeat;
+				   	@include img-retina("../images/graphic-crud.png", "../images/graphic-crud@2x.png", 290px, 111px);
+				}
+			}
+
+			&#audit{
+				.graphic{
+					width: 100%;
+					height: 76px;
+				    background: image-url('../images/graphic-audit.png') center 0 no-repeat;
+				   	@include img-retina("../images/graphic-audit.png", "../images/graphic-audit@2x.png", 290px, 76px);
+				}
+			}
+		}
+	}
+
+	#cta a {
+		font-size: 14px;
+		font-weight: 400;
+	}
+}

website/source/assets/stylesheets/_mixins.scss

@@ -0,0 +1,762 @@
+//
+// Mixins
+// --------------------------------------------------
+
+
+// Utilities
+// -------------------------
+
+// Clearfix
+// Source: http://nicolasgallagher.com/micro-clearfix-hack/
+//
+// For modern browsers
+// 1. The space content is one way to avoid an Opera bug when the
+//    contenteditable attribute is included anywhere else in the document.
+//    Otherwise it causes space to appear at the top and bottom of elements
+//    that are clearfixed.
+// 2. The use of `table` rather than `block` is only necessary if using
+//    `:before` to contain the top-margins of child elements.
+@mixin clearfix() {
+  &:before,
+  &:after {
+    content: " "; /* 1 */
+    display: table; /* 2 */
+  }
+  &:after {
+    clear: both;
+  }
+}
+
+// Webkit-style focus
+@mixin tab-focus() {
+  // Default
+  outline: thin dotted #333;
+  // Webkit
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+// Center-align a block level element
+@mixin center-block() {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+// Sizing shortcuts
+@mixin size($width, $height) {
+  width: $width;
+  height: $height;
+}
+@mixin square($size) {
+  @include size($size, $size);
+}
+
+// Placeholder text
+@mixin placeholder($color: $input-color-placeholder) {
+  &:-moz-placeholder            { color: $color; } // Firefox 4-18
+  &::-moz-placeholder           { color: $color; } // Firefox 19+
+  &:-ms-input-placeholder       { color: $color; } // Internet Explorer 10+
+  &::-webkit-input-placeholder  { color: $color; } // Safari and Chrome
+}
+
+// Text overflow
+// Requires inline-block or block for proper styling
+@mixin text-overflow() {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+// CSS image replacement
+// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
+@mixin hide-text() {
+  font: #{"0/0"} a;
+  color: transparent;
+  text-shadow: none;
+  background-color: transparent;
+  border: 0;
+}
+
+
+
+// CSS3 PROPERTIES
+// --------------------------------------------------
+
+// Single side border-radius
+@mixin border-top-radius($radius) {
+  border-top-right-radius: $radius;
+   border-top-left-radius: $radius;
+}
+@mixin border-right-radius($radius) {
+  border-bottom-right-radius: $radius;
+     border-top-right-radius: $radius;
+}
+@mixin border-bottom-radius($radius) {
+  border-bottom-right-radius: $radius;
+   border-bottom-left-radius: $radius;
+}
+@mixin border-left-radius($radius) {
+  border-bottom-left-radius: $radius;
+     border-top-left-radius: $radius;
+}
+
+// Drop shadows
+@mixin box-shadow($shadow) {
+  -webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1
+          box-shadow: $shadow;
+}
+
+// Transitions
+@mixin transition($transition) {
+  -webkit-transition: $transition;
+          transition: $transition;
+}
+@mixin transition-delay($transition-delay) {
+  -webkit-transition-delay: $transition-delay;
+          transition-delay: $transition-delay;
+}
+@mixin transition-duration($transition-duration) {
+  -webkit-transition-duration: $transition-duration;
+          transition-duration: $transition-duration;
+}
+@mixin transition-transform($transition) {
+  -webkit-transition: -webkit-transform $transition;
+     -moz-transition: -moz-transform $transition;
+       -o-transition: -o-transform $transition;
+          transition: transform $transition;
+}
+
+// Transformations
+@mixin transform($transform...) {
+    -webkit-transform: $transform;
+        -ms-transform: $transform;
+            transform: $transform;
+}
+
+@mixin rotate($degrees) {
+  -webkit-transform: rotate($degrees);
+      -ms-transform: rotate($degrees); // IE9+
+          transform: rotate($degrees);
+}
+
+@mixin scale($ratio) {
+  -webkit-transform: scale($ratio);
+      -ms-transform: scale($ratio); // IE9+
+          transform: scale($ratio);
+}
+
+@mixin translate($x, $y) {
+  -webkit-transform: translate($x, $y);
+      -ms-transform: translate($x, $y); // IE9+
+          transform: translate($x, $y);
+}
+@mixin skew($x, $y) {
+  -webkit-transform: skew($x, $y);
+      -ms-transform: skewX($x) skewY($y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
+          transform: skew($x, $y);
+}
+@mixin translate3d($x, $y, $z) {
+  -webkit-transform: translate3d($x, $y, $z);
+          transform: translate3d($x, $y, $z);
+}
+//transform origin
+@mixin transform-origin ($origin) {
+    moz-transform-origin: $origin;
+	     -o-transform-origin: $origin;
+	    -ms-transform-origin: $origin;
+	-webkit-transform-origin: $origin;
+          transform-origin: $origin;
+}
+
+// Backface visibility
+// Prevent browsers from flickering when using CSS 3D transforms.
+// Default value is `visible`, but can be changed to `hidden`
+// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
+@mixin backface-visibility($visibility) {
+  -webkit-backface-visibility: $visibility;
+     -moz-backface-visibility: $visibility;
+          backface-visibility: $visibility;
+}
+
+// Box sizing
+@mixin box-sizing($boxmodel) {
+  -webkit-box-sizing: $boxmodel;
+     -moz-box-sizing: $boxmodel;
+          box-sizing: $boxmodel;
+}
+
+// User select
+// For selecting text on the page
+@mixin user-select($select) {
+  -webkit-user-select: $select;
+     -moz-user-select: $select;
+      -ms-user-select: $select; // IE10+
+       -o-user-select: $select;
+          user-select: $select;
+}
+
+// Resize anything
+@mixin resizable($direction) {
+  resize: $direction; // Options: horizontal, vertical, both
+  overflow: auto; // Safari fix
+}
+
+// CSS3 Content Columns
+@mixin content-columns($column-count, $column-gap: $grid-gutter-width) {
+  -webkit-column-count: $column-count;
+     -moz-column-count: $column-count;
+          column-count: $column-count;
+  -webkit-column-gap: $column-gap;
+     -moz-column-gap: $column-gap;
+          column-gap: $column-gap;
+}
+
+// Optional hyphenation
+@mixin hyphens($mode: auto) {
+  word-wrap: break-word;
+  -webkit-hyphens: $mode;
+     -moz-hyphens: $mode;
+      -ms-hyphens: $mode; // IE10+
+       -o-hyphens: $mode;
+          hyphens: $mode;
+}
+
+// Opacity
+@mixin opacity($opacity) {
+  opacity: $opacity;
+  // IE8 filter
+  $opacity-ie: ($opacity * 100);
+  filter: #{"alpha(opacity=#{opacity-ie})"};
+}
+
+
+
+// GRADIENTS
+// --------------------------------------------------
+
+#gradient {
+
+  // Horizontal gradient, from left to right
+  //
+  // Creates two color stops, start and end, by specifying a color and position for each color stop.
+  // Color stops are not available in IE9 and below.
+  @mixin horizontal($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
+    background-image: -webkit-gradient(linear, $start-percent top, $end-percent top, from($start-color), to($end-color)); // Safari 4+, Chrome 2+
+    background-image: -webkit-linear-gradient(left, color-stop($start-color $start-percent), color-stop($end-color $end-percent)); // Safari 5.1+, Chrome 10+
+    background-image: -moz-linear-gradient(left, $start-color $start-percent, $end-color $end-percent); // FF 3.6+
+    background-image:  linear-gradient(to right, $start-color $start-percent, $end-color $end-percent); // Standard, IE10
+    background-repeat: repeat-x;
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=1); // IE9 and down
+  }
+
+  // Vertical gradient, from top to bottom
+  //
+  // Creates two color stops, start and end, by specifying a color and position for each color stop.
+  // Color stops are not available in IE9 and below.
+  @mixin vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
+    background-image: -webkit-gradient(linear, left $start-percent, left $end-percent, from($start-color), to($end-color)); // Safari 4+, Chrome 2+
+    background-image: -webkit-linear-gradient(top, $start-color, $start-percent, $end-color, $end-percent); // Safari 5.1+, Chrome 10+
+    background-image:  -moz-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // FF 3.6+
+    background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10
+    background-repeat: repeat-x;
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=0); // IE9 and down
+  }
+
+  @mixin directional($start-color: #555, $end-color: #333, $deg: 45deg) {
+    background-repeat: repeat-x;
+    background-image: -webkit-linear-gradient($deg, $start-color, $end-color); // Safari 5.1+, Chrome 10+
+    background-image: -moz-linear-gradient($deg, $start-color, $end-color); // FF 3.6+
+    background-image: linear-gradient($deg, $start-color, $end-color); // Standard, IE10
+  }
+  @mixin horizontal-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
+    background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from($start-color), color-stop($color-stop, $mid-color), to($end-color));
+    background-image: -webkit-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
+    background-image: -moz-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
+    background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
+    background-repeat: no-repeat;
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=1); // IE9 and down
+  }
+  @mixin vertical-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
+    background-image: -webkit-gradient(linear, 0 0, 0 100%, from($start-color), color-stop($color-stop, $mid-color), to($end-color));
+    background-image: -webkit-linear-gradient($start-color, $mid-color $color-stop, $end-color);
+    background-image: -moz-linear-gradient(top, $start-color, $mid-color $color-stop, $end-color);
+    background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
+    background-repeat: no-repeat;
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{argb($start-color)}', endColorstr='#{argb($end-color)}', GradientType=0); // IE9 and down
+  }
+  @mixin radial($inner-color: #555, $outer-color: #333) {
+    background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($inner-color), to($outer-color));
+    background-image: -webkit-radial-gradient(circle, $inner-color, $outer-color);
+    background-image: -moz-radial-gradient(circle, $inner-color, $outer-color);
+    background-image: radial-gradient(circle, $inner-color, $outer-color);
+    background-repeat: no-repeat;
+  }
+  @mixin striped($color: #555, $angle: 45deg) {
+    background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
+    background-image: -webkit-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
+    background-image: -moz-linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
+    background-image: linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
+  }
+}
+
+// Reset filters for IE
+//
+// When you need to remove a gradient background, do not forget to use this to reset
+// the IE filter for IE9 and below.
+@mixin reset-filter() {
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+}
+
+
+
+// Retina images
+//
+// Short retina mixin for setting background-image and -size
+
+@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
+  background-image: image-url("#{$file-1x}");
+  background-size: $width-1x $height-1x;
+
+  @media
+  only screen and (-webkit-min-device-pixel-ratio: 2),
+  only screen and (   min--moz-device-pixel-ratio: 2),
+  only screen and (     -o-min-device-pixel-ratio: 2/1),
+  only screen and (        min-device-pixel-ratio: 2),
+  only screen and (                min-resolution: 192dpi),
+  only screen and (                min-resolution: 2dppx) {
+    background-image: image-url("#{$file-2x}");
+    background-size: $width-1x $height-1x;
+  }
+}
+
+
+// Responsive image
+//
+// Keep images from scaling beyond the width of their parents.
+
+@mixin img-responsive($display: block) {
+  display: $display;
+  max-width: 100%; // Part 1: Set a maximum relative to the parent
+  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+}
+
+
+// COMPONENT MIXINS
+// --------------------------------------------------
+
+// Horizontal dividers
+// -------------------------
+// Dividers (basically an hr) within dropdowns and nav lists
+@mixin nav-divider($color: #e5e5e5) {
+  height: 1px;
+  margin: (($line-height-computed / 2) - 1) 0;
+  overflow: hidden;
+  background-color: $color;
+}
+
+// Panels
+// -------------------------
+@mixin panel-variant($border, $heading-text-color, $heading-bg-color, $heading-border) {
+  border-color: $border;
+  & > .panel-heading {
+    color: $heading-text-color;
+    background-color: $heading-bg-color;
+    border-color: $heading-border;
+    + .panel-collapse .panel-body {
+      border-top-color: $border;
+    }
+  }
+  & > .panel-footer {
+    + .panel-collapse .panel-body {
+      border-bottom-color: $border;
+    }
+  }
+}
+
+// Alerts
+// -------------------------
+@mixin alert-variant($background, $border, $text-color) {
+  background-color: $background;
+  border-color: $border;
+  color: $text-color;
+  hr {
+    border-top-color: darken($border, 5%);
+  }
+  .alert-link {
+    color: darken($text-color, 10%);
+  }
+}
+
+// Tables
+// -------------------------
+@mixin table-row-variant($state, $background, $border) {
+  // Exact selectors below required to override `.table-striped` and prevent
+  // inheritance to nested tables.
+  .table > thead > tr,
+  .table > tbody > tr,
+  .table > tfoot > tr {
+    > td.#{state},
+    > th.#{state},
+    &.#{state} > td,
+    &.#{state} > th {
+      background-color: $background;
+      border-color: $border;
+    }
+  }
+
+  // Hover states for `.table-hover`
+  // Note: this is not available for cells or rows within `thead` or `tfoot`.
+  .table-hover > tbody > tr {
+    > td.#{state}:hover,
+    > th.#{state}:hover,
+    &.#{state}:hover > td {
+      background-color: darken($background, 5%);
+      border-color: darken($border, 5%);
+    }
+  }
+}
+
+// Button variants
+// -------------------------
+// Easily pump out default styles, as well as :hover, :focus, :active,
+// and disabled options for all buttons
+@mixin button-variant($color, $background, $border) {
+  color: $color;
+  background-color: $background;
+  border-color: $border;
+
+  &:hover,
+  &:focus,
+  &:active,
+  &.active,
+  .open .dropdown-toggle& {
+    color: $color;
+    background-color: darken($background, 8%);
+        border-color: darken($border, 12%);
+  }
+  &:active,
+  &.active,
+  .open .dropdown-toggle& {
+    background-image: none;
+  }
+  &.disabled,
+  &[disabled],
+  fieldset[disabled] & {
+    &,
+    &:hover,
+    &:focus,
+    &:active,
+    &.active {
+      background-color: $background;
+          border-color: $border
+    }
+  }
+}
+
+// Button sizes
+// -------------------------
+@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
+  padding: $padding-vertical $padding-horizontal;
+  font-size: $font-size;
+  line-height: $line-height;
+  border-radius: $border-radius;
+}
+
+// Pagination
+// -------------------------
+@mixin pagination-size($padding-vertical, $padding-horizontal, $font-size, $border-radius) {
+  > li {
+    > a,
+    > span {
+      padding: $padding-vertical $padding-horizontal;
+      font-size: $font-size;
+    }
+    &:first-child {
+      > a,
+      > span {
+        @include border-left-radius($border-radius);
+      }
+    }
+    &:last-child {
+      > a,
+      > span {
+        @include border-right-radius($border-radius);
+      }
+    }
+  }
+}
+
+// Labels
+// -------------------------
+@mixin label-variant($color) {
+  background-color: $color;
+  &[href] {
+    &:hover,
+    &:focus {
+      background-color: darken($color, 10%);
+    }
+  }
+}
+
+// Navbar vertical align
+// -------------------------
+// Vertically center elements in the navbar.
+// Example: an element has a height of 30px, so write out `@include navbar-vertical-align(30px);` to calculate the appropriate top margin.
+@mixin navbar-vertical-align($element-height) {
+  margin-top: (($navbar-height - $element-height) / 2);
+  margin-bottom: (($navbar-height - $element-height) / 2);
+}
+
+// Progress bars
+// -------------------------
+// @mixin progress-bar-variant($color) {
+//   background-color: $color;
+//   .progress-striped & {
+//     #gradient > @include striped($color);
+//   }
+// }
+
+// Responsive utilities
+// -------------------------
+// More easily include all the states for responsive-utilities.less.
+@mixin responsive-visibility() {
+  display: block !important;
+  tr& { display: table-row !important; }
+  th&,
+  td& { display: table-cell !important; }
+}
+
+@mixin responsive-invisibility() {
+  display: none !important;
+  tr& { display: none !important; }
+  th&,
+  td& { display: none !important; }
+}
+
+// Grid System
+// -----------
+
+// Centered container element
+@mixin container-fixed() {
+  margin-right: auto;
+  margin-left: auto;
+  padding-left:  ($grid-gutter-width / 2);
+  padding-right: ($grid-gutter-width / 2);
+  @include clearfix();
+}
+
+// Creates a wrapper for a series of columns
+@mixin make-row($gutter: $grid-gutter-width) {
+  margin-left:  ($gutter / -2);
+  margin-right: ($gutter / -2);
+  @include clearfix();
+}
+
+// Generate the extra small columns
+@mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  float: left;
+  width: percentage(($columns / $grid-columns));
+  // Prevent columns from collapsing when empty
+  min-height: 1px;
+  // Inner gutter via padding
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+}
+
+// Generate the small columns
+@mixin make-sm-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  // Prevent columns from collapsing when empty
+  min-height: 1px;
+  // Inner gutter via padding
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+
+  // Calculate width based on number of columns available
+  @media (min-width: $screen-sm) {
+    float: left;
+    width: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the small column offsets
+@mixin make-sm-column-offset($columns) {
+  @media (min-width: $screen-sm) {
+    margin-left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-sm-column-push($columns) {
+  @media (min-width: $screen-sm) {
+    left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-sm-column-pull($columns) {
+  @media (min-width: $screen-sm) {
+    right: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the medium columns
+@mixin make-md-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  // Prevent columns from collapsing when empty
+  min-height: 1px;
+  // Inner gutter via padding
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+
+  // Calculate width based on number of columns available
+  @media (min-width: $screen-md) {
+    float: left;
+    width: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the large column offsets
+@mixin make-md-column-offset($columns) {
+  @media (min-width: $screen-md) {
+    margin-left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-md-column-push($columns) {
+  @media (min-width: $screen-md) {
+    left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-md-column-pull($columns) {
+  @media (min-width: $screen-md) {
+    right: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the large columns
+@mixin make-lg-column($columns, $gutter: $grid-gutter-width) {
+  position: relative;
+  // Prevent columns from collapsing when empty
+  min-height: 1px;
+  // Inner gutter via padding
+  padding-left:  ($gutter / 2);
+  padding-right: ($gutter / 2);
+
+  // Calculate width based on number of columns available
+  @media (min-width: $screen-lg) {
+    float: left;
+    width: percentage(($columns / $grid-columns));
+  }
+}
+
+// Generate the large column offsets
+@mixin make-lg-column-offset($columns) {
+  @media (min-width: $screen-lg) {
+    margin-left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-lg-column-push($columns) {
+  @media (min-width: $screen-lg) {
+    left: percentage(($columns / $grid-columns));
+  }
+}
+@mixin make-lg-column-pull($columns) {
+  @media (min-width: $screen-lg) {
+    right: percentage(($columns / $grid-columns));
+  }
+}
+
+
+// Form validation states
+//
+// Used in forms.less to generate the form validation CSS for warnings, errors,
+// and successes.
+
+@mixin form-control-validation($text-color: #555, $border-color: #ccc, $background-color: #f5f5f5) {
+  // Color the label and help text
+  .help-block,
+  .control-label {
+    color: $text-color;
+  }
+  // Set the border and box shadow on specific inputs to match
+  .form-control {
+    border-color: $border-color;
+    @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
+    &:focus {
+      border-color: darken($border-color, 10%);
+      $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
+      @include box-shadow($shadow);
+    }
+  }
+  // Set validation states also for addons
+  .input-group-addon {
+    color: $text-color;
+    border-color: $border-color;
+    background-color: $background-color;
+  }
+}
+
+// Form control focus state
+//
+// Generate a customized focus state and for any input with the specified color,
+// which defaults to the `$input-focus-border` variable.
+//
+// We highly encourage you to not customize the default value, but instead use
+// this to tweak colors on an as-needed basis. This aesthetic change is based on
+// WebKit's default styles, but applicable to a wider range of browsers. Its
+// usability and accessibility should be taken into account with any change.
+//
+// Example usage: change the default blue border and shadow to white for better
+// contrast against a dark gray background.
+
+@mixin form-control-focus($color: $input-border-focus) {
+  $color-rgba: rgba(red($color), green($color), blue($color), .6);
+  &:focus {
+    border-color: $color;
+    outline: 0;
+    @include box-shadow(#{"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px #{color-rgba}"});
+  }
+}
+
+// Form control sizing
+//
+// Relative text size, padding, and border-radii changes for form controls. For
+// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
+// element gets special love because it's special, and that's a fact!
+
+@mixin input-size($input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
+  height: $input-height;
+  padding: $padding-vertical $padding-horizontal;
+  font-size: $font-size;
+  line-height: $line-height;
+  border-radius: $border-radius;
+
+  select& {
+    height: $input-height;
+    line-height: $input-height;
+  }
+
+  textarea& {
+    height: auto;
+  }
+}
+
+
+//mixins
+@mixin img-retina($image1x, $image, $width, $height) {
+  background-image: url($image1x);
+  background-size: $width $height;
+  background-repeat: no-repeat;
+
+  @media (min--moz-device-pixel-ratio: 1.3),
+         (-o-min-device-pixel-ratio: 2.6/2),
+         (-webkit-min-device-pixel-ratio: 1.3),
+         (min-device-pixel-ratio: 1.3),
+         (min-resolution: 1.3dppx) {
+    /* on retina, use image that's scaled by 2 */
+    background-image: url($image);
+    background-size: $width $height;
+  }
+}
+
+@mixin btn-shadow{
+  box-shadow: 2px 3px 2px rgba(0,0,0,0.08);
+}

website/source/assets/stylesheets/_sidebar.scss

@@ -0,0 +1,474 @@
+
+// Base variables
+// --------------------------------------------------
+$screen-tablet:          768px;
+
+$gray-darker:            #212121; // #212121 - text
+$gray-secondary:              #757575; // #757575 - secondary text, icons
+$gray:                   #bdbdbd; // #bdbdbd - hint text
+$gray-light:             #e0e0e0; // #e0e0e0 - divider
+$gray-lighter:           #f5f5f5; // #f5f5f5 - background
+
+/* -- Sidebar style ------------------------------- */
+
+// Sidebar variables
+// --------------------------------------------------
+$zindex-sidebar-fixed: 1035;
+
+$sidebar-desktop-width: 280px;
+$sidebar-width: 240px;
+
+
+$sidebar-padding: 16px;
+$sidebar-divider: $sidebar-padding/2;
+
+$sidebar-nav-height: 48px;
+
+$sidebar-icon-width: 40px;
+$sidebar-icon-height: 20px;
+
+$sidebar-badge-size: $sidebar-nav-height/2;
+$sidebar-badge-font-size: 10px;
+
+$sidebar-brand-color: $gray-secondary;
+$sidebar-icon-color: $gray-secondary;
+$sidebar-menu-color: $gray-darker;
+
+
+$sidebar-font-weight: 300;
+
+// Sidebar mixins
+// --------------------------------------------------
+
+// Sidebar horizontal block
+//
+// This settings will extended by .sidebar-text, .sidebar-brand and .sidebar-nav>li>a
+@mixin sidebar-block()
+{
+  display: block;
+  line-height: $sidebar-nav-height;
+  padding: 0;
+  //padding-left: ($sidebar-padding + $sidebar-badge-size) + $sidebar-padding;
+  //padding-right: ($sidebar-padding + $sidebar-badge-size) + $sidebar-padding;
+  text-decoration: none;
+  clear: both;
+  @include v-nav-style-core();
+  //@include text-overflow();
+  @include transition(all .2s ease-in-out);
+  color: $blue-dark;
+
+  &:hover, &:focus {
+    @include box-shadow(none);
+    outline: none;
+  }
+
+  // positioning caret in sidebar block
+  .caret {
+    position: absolute;
+    right: $sidebar-padding + $sidebar-badge-size/2 - 4px; // caret centered by badge position; 4px - caret width
+    top: $sidebar-nav-height/2;
+  }
+  // positioning badge in sidebar block
+  .sidebar-badge {
+    position: absolute;
+    right: $sidebar-padding;
+    top: ($sidebar-nav-height - $sidebar-badge-size)/2 ;
+  }
+}
+
+// Sidebar design template
+//
+// You can make own sidebar style with this template
+@mixin sidebar-template(
+  $color,
+  $bg,
+  $header-bg,
+  $brand-color,
+  $brand-bg,
+  $brand-hover-color,
+  $brand-hover-bg,
+  $divider,
+  $badge-color,
+  $badge-bg,
+  $icon-color,
+  $icon-hover-color,
+  $link-color,
+  $link-bg,
+  $link-hover-color,
+  $link-hover-bg,
+  $link-active-color,
+  $link-active-bg,
+  $link-disabled-color,
+  $link-disabled-bg
+) {
+
+  background-color: $bg;
+
+  ul{
+    padding-left: 0;
+    list-style-type: none;
+  }
+
+  .sidebar-header {
+    background-color: $header-bg;
+    margin-bottom: 15px;
+  }
+
+  .sidebar-divider, .sidebar-nav .divider {
+    background-color: $divider;
+  }
+
+  .sidebar-text {
+    color: $color;
+  }
+
+  .buttons-nav{
+    margin-top: 10px;
+    text-align: center;
+    @include v-nav-style-core();
+
+    li{
+        margin-bottom: 20px;
+        a{
+            min-width: 148px;
+            color: $blue-dark;
+            &:hover{
+                color: $green-dark;
+            }
+        }
+    }
+  }
+
+  .sidebar-nav {
+    text-align: center;
+    //border-bottom: 1px solid $faint-gray;
+    padding-bottom: 8px;
+
+    &:last-child{
+      border-bottom: none;
+    }
+
+    li > a {
+      color: $link-color;
+      background-color: $link-bg;
+
+      i {
+        color: $icon-color;
+      }
+    }
+    li:hover > a, li > a:hover {
+      color: $link-hover-color;
+      background-color: $link-hover-bg;
+
+      i {
+        color: $icon-hover-color;
+      }
+    }
+    li:focus > a, li > a:focus {
+      color: $link-color;
+      background-color: $link-bg;
+
+      i {
+        color: $icon-hover-color;
+      }
+    }
+
+    > .open > a {
+      &,
+      &:hover,
+      &:focus {
+        color: $link-hover-color;
+        background-color: $link-hover-bg;
+      }
+    }
+
+    > .active > a {
+      &,
+      &:hover,
+      &:focus {
+        color: $link-active-color;
+        background-color: $link-active-bg;
+      }
+    }
+    > .disabled > a {
+      &,
+      &:hover,
+      &:focus {
+        color: $link-disabled-color;
+        background-color: $link-disabled-bg;
+      }
+    }
+    > li > .ink {
+      //background: #80d8ff;
+      //opacity: 0.5;
+    }
+
+    // Dropdown menu items
+    > .dropdown {
+      // Remove background color from open dropdown
+      > .dropdown-menu {
+
+        background-color: $link-hover-bg;
+
+        > li > a {
+          &:focus {
+            background-color: $link-hover-bg;
+            color: $link-hover-color;
+          }
+          &:hover {
+            background-color: darken($link-hover-bg, 7%);
+            color: $link-hover-color;
+          }
+        }
+
+        > .active > a {
+          &,
+          &:hover,
+          &:focus {
+            color: $link-active-color;
+            background-color: $link-active-bg;
+          }
+        }
+      }
+    }
+  }
+}
+
+//
+// Sidebars
+// --------------------------------------------------
+
+// Wrapper and base class
+//
+// Provide a static sidebar from which we expand to create other sidebar variations.
+.sidebar {
+  position: relative;
+  display: block;
+  min-height: 100%;
+  overflow-y: auto;
+  overflow-x: hidden;
+  border: none;
+  @include transition(all 0.5s cubic-bezier(0.55, 0, 0.1, 1));
+  @include clearfix();
+}
+
+// Sidebar Elements
+//
+// Basic style of sidebar elements
+.sidebar {
+
+  // Sidebar heading
+  //----------------
+  .sidebar-header {
+    position: relative;
+    margin-bottom: $sidebar-divider;
+    @include transition(all .2s ease-in-out);
+    //border-bottom: 1px solid $faint-gray;
+
+    .buttons{
+      text-align: center;
+      padding: $xsmall-pad 0 $small-pad;
+      a{
+        &.outline-btn{
+          margin-right: 10px;
+        }
+      }
+    }
+  }
+
+ .sidebar-image {
+    padding-top: 24px;
+    img {
+      display: block;
+      margin: 0 auto;
+    }
+  }
+
+  // Brand/project name
+  //
+  // In google guideline used for email dropdown
+  .sidebar-brand {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    @include sidebar-block();
+
+    &:hover,
+    &:focus {
+      text-decoration: none;
+    }
+  }
+
+  // Sidebar text
+  //----------------
+  .sidebar-text {
+    @include sidebar-block();
+  }
+
+  // Sidebar icons
+  //----------------
+  .sidebar-icon {
+    display: inline-block;
+    height: $sidebar-icon-height;
+    margin-right: $sidebar-divider;
+    text-align: left;
+    font-size: $sidebar-icon-height;
+    vertical-align: middle;
+
+    &:before, &:after {
+      vertical-align: middle;
+    }
+  }
+}
+
+
+
+// Sidebar navigation class
+// ------------------------
+.sidebar .sidebar-nav {
+  margin: 0;
+  padding: 0;
+
+  // Links
+  //----------------
+  li {
+    position: relative;
+    list-style-type: none;
+
+    a {
+      position: relative;
+      cursor: pointer;
+      user-select: none;
+      @include sidebar-block();
+
+      &:hover {
+        background: transparent;
+      }
+    }
+  }
+}
+
+// Sidebar color theme variations
+//
+// ------------------------
+.sidebar-default {
+  @include sidebar-template(
+  $color: $gray-darker,
+  $bg: #fff,
+  $header-bg: $white,
+  $brand-color: $gray-dark,
+  $brand-bg: transparent,
+  $brand-hover-color: $gray-darker,
+  $brand-hover-bg: rgba(0, 0, 0, 0.10),
+  $divider: $gray,
+  $badge-color: #fff,
+  $badge-bg: $gray,
+  $icon-color: $gray-dark,
+  $icon-hover-color: $gray-dark,
+  $link-color: $gray-darker,
+  $link-bg: transparent,
+  $link-hover-color: $gray-darker,
+  $link-hover-bg: lighten($faint-gray, 6%),
+  $link-active-color: $gray-darker,
+  $link-active-bg: $gray-light,
+  $link-disabled-color: $gray-light,
+  $link-disabled-bg: transparent
+  );
+}
+
+
+// Sidebar toggling
+//
+// Hide sidebar
+.sidebar {
+  width: 0;
+  @include translate3d(-$sidebar-desktop-width, 0, 0);
+
+  &.open {
+    min-width: $sidebar-desktop-width;
+    width: $sidebar-desktop-width;
+    @include translate3d(0, 0, 0);
+  }
+}
+
+// Sidebar positions: fix the left/right sidebars
+.sidebar-fixed-left,
+.sidebar-fixed-right,
+.sidebar-stacked {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  z-index: $zindex-sidebar-fixed;
+}
+.sidebar-stacked {
+  left: 0;
+}
+.sidebar-fixed-left {
+  left: 0;
+  box-shadow: 2px 0px 25px rgba(0,0,0,0.15);
+  -webkit-box-shadow: 2px 0px 25px rgba(0,0,0,0.15);
+}
+.sidebar-fixed-right {
+  right: 0;
+  box-shadow: 0px 2px 25px rgba(0,0,0,0.15);
+  -webkit-box-shadow: 0px 2px 25px rgba(0,0,0,0.15);
+
+  @include translate3d($sidebar-desktop-width, 0, 0);
+  &.open {
+    @include translate3d(0, 0, 0);
+  }
+  .icon-material-sidebar-arrow:before {
+    content: "\e614"; // icon-material-arrow-forward
+  }
+}
+
+// Sidebar size
+//
+// Change size of sidebar and sidebar elements on small screens
+@media (max-width: $screen-tablet) {
+  .sidebar.open {
+    min-width: $sidebar-width;
+    width: $sidebar-width;
+  }
+
+  .sidebar .sidebar-header {
+    //height: $sidebar-width * 9/16; // 16:9 header dimension
+  }
+
+  .sidebar .sidebar-image {
+    /* img {
+      width: $sidebar-width/4 - $sidebar-padding;
+      height: $sidebar-width/4 - $sidebar-padding;
+    } */
+  }
+}
+
+.sidebar-overlay {
+  visibility: hidden;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  opacity: 0;
+  background: $white;
+  z-index: $zindex-sidebar-fixed - 1;
+
+  -webkit-transition: visibility 0 linear .4s,opacity .4s cubic-bezier(.4,0,.2,1);
+  -moz-transition: visibility 0 linear .4s,opacity .4s cubic-bezier(.4,0,.2,1);
+  transition: visibility 0 linear .4s,opacity .4s cubic-bezier(.4,0,.2,1);
+  -webkit-transform: translateZ(0);
+  -moz-transform: translateZ(0);
+  -ms-transform: translateZ(0);
+  -o-transform: translateZ(0);
+  transform: translateZ(0);
+}
+
+.sidebar-overlay.active {
+  opacity: 0.3;
+  visibility: visible;
+  -webkit-transition-delay: 0;
+  -moz-transition-delay: 0;
+  transition-delay: 0;
+}

website/source/assets/stylesheets/_utilities.scss

@@ -0,0 +1,210 @@
+//
+// Utility classes
+// --------------------------------------------------
+
+
+//
+// -------------------------
+@mixin anti-alias() {
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+}
+
+@mixin open-light() {
+    font-family: $font-family-open-sans;
+    font-weight: 300;
+}
+
+@mixin open() {
+    font-family: $font-family-open-sans;
+    font-weight: 400;
+}
+
+@mixin open-sb() {
+    font-family: $font-family-open-sans;
+    font-weight: 600;
+}
+
+@mixin open-bold() {
+    font-family: $font-family-open-sans;
+    font-weight: 700;
+}
+
+@mixin skewY($skew) {
+    -webkit-transform: skewY($skew);
+    -moz-transform: skewY($skew);
+    -ms-transform: skewY($skew);
+    -o-transform: skewY($skew);
+    transform: skewY($skew);
+}
+
+@mixin v-nav-style-core{
+    color: $gray-darker;
+    font-family: $font-family-blanc-reg;
+    font-size: 13px;
+    text-transform: uppercase;
+    letter-spacing: 0.0625em;
+}
+
+@mixin v-nav-style{
+    margin: 0 15px;
+    padding: 0;
+    line-height: 22px;
+    @include v-nav-style-core();
+    @include transition( color 0.3s ease );
+
+    &:hover{
+        color: $green-dark;
+        @include transition( color 0.3s ease );
+        background-color: transparent;
+    }
+}
+
+@mixin bez-1-transition{
+    @include transition( all 300ms ease-in-out );
+}
+
+
+@keyframes press {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: .55
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@-webkit-keyframes press {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: .55
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+#demo-app .loading-bar{
+    display: block;
+    -webkit-animation: shift-rightwards 2s ease-in-out infinite;
+    -moz-animation: shift-rightwards 2s ease-in-out infinite;
+    -ms-animation: shift-rightwards 2s ease-in-out infinite;
+    -o-animation: shift-rightwards 2s ease-in-out infinite;
+    animation: shift-rightwards 2s ease-in-out infinite;
+    -webkit-animation-delay: .4s;
+    -moz-animation-delay: .4s;
+    -o-animation-delay: .4s;
+    animation-delay: .4s;
+}
+
+.loading-bar{
+    position: fixed;
+    display: none;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 2px;
+    z-index: 800;
+    background: $blue;
+    -webkit-transform: translateX(100%);
+    -moz-transform: translateX(100%);
+    -o-transform: translateX(100%);
+    transform: translateX(100%);
+}
+
+@-webkit-keyframes shift-rightwards
+{
+    0%
+    {
+        @include translate(-100%, 0);
+    }
+
+    40%
+    {
+        @include translate(0%, 0);
+    }
+
+    60%
+    {
+        @include translate(0%, 0);
+    }
+
+    100%
+    {
+        @include translate(100%, 0);
+    }
+
+}
+@-moz-keyframes shift-rightwards
+{
+    0%
+    {
+        @include translate(-100%, 0);
+    }
+
+    40%
+    {
+        @include translate(0%, 0);
+    }
+
+    60%
+    {
+        @include translate(0%, 0);
+    }
+
+    100%
+    {
+        @include translate(100%, 0);
+    }
+
+}
+@-o-keyframes shift-rightwards
+{
+    0%
+    {
+        @include translate(-100%, 0);
+    }
+
+    40%
+    {
+        @include translate(0%, 0);
+    }
+
+    60%
+    {
+        @include translate(0%, 0);
+    }
+
+    100%
+    {
+        @include translate(100%, 0);
+    }
+
+}
+@keyframes shift-rightwards
+{
+    0%
+    {
+        @include translate(-100%, 0);
+    }
+
+    40%
+    {
+        @include translate(0%, 0);
+    }
+
+    60%
+    {
+        @include translate(0%, 0);
+    }
+
+    100%
+    {
+        @include translate(100%, 0);
+    }
+}

website/source/assets/stylesheets/_variables.scss

@@ -0,0 +1,80 @@
+//
+// Variables
+// --------------------------------------------------
+
+
+// Global values
+// --------------------------------------------------
+
+$header-height:  		   	 90px;
+$btn-border-radius:   		 4px;
+$el-border-radius:   		 6px;
+// colors
+// -------------------------
+
+$white: 					#fff;
+$black:                 	#000;
+$gray:						#929199;
+$light-gray:				#C2C1C7;
+$faint-gray:				#E3E3EA;
+$green:                     #56cdad;
+$green-dark:                #449b82;
+$green-light:               #9bdb9c;
+$green-faint:               #E3F5E3;
+$blue-dark:					#4e5859;
+$blue-light:                #89999A;
+$blue:                  	#00BFE0;
+$blue-faint:                #E0E8E8;
+$light-black: 				#242424;
+$orange:               		#e78c5b;
+$gray-dark: 				#3B4142; //#4e5859;
+$gray: 						#777;
+$gray-light:   				#939393;
+$gray-lighter:   			#979797;
+$red: 						#dd4e58;
+$red-dark:           		#c5454e;
+$purple:   				    #822ff7;
+$light-purple:				#f7f3f9;
+$btn-color:  				#4592C5;
+
+
+// Scaffolding
+// -------------------------
+$body-bg:               	#fff;
+$text-color:            	$gray;
+
+// Links
+// -------------------------
+$link-color:            	$red-dark;
+$link-hover-color:      	darken($link-color, 15%);
+
+// Typography
+// -------------------------
+$font-family-open-sans:		'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+$font-family-blanc: 	    'Blanc-Light', 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+$font-family-blanc-reg: 	'Blanc-Regular', 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+$font-weight-xl:  		    300;
+$font-weight-reg:  	        400;
+$font-weight-sb:            600;
+$font-weight-xb:  		    700;
+$font-size-xl:              44px;
+$font-size-l:               36px;
+$font-size-m:               28px;
+$font-size-reg:             16px;
+
+$text-shadow: 				1px 1px 1px #000;
+$shadow: 					$text-shadow;
+
+
+//margin + padding
+$xsmall-pad: 20px;
+$small-pad: 30px;
+$med-pad: 70px;
+$large-pad: 120px;
+$xl-pad: 150px;
+
+$light-outline: #f7f7f7;
+
+//
+$easeInOutBack: cubic-bezier(0.68, -0.55, 0.265, 1.55);
+$easeOutBack: cubic-bezier(0.175, 0.885, 0.32, 1.275);

website/source/assets/stylesheets/_webfonts.scss

@@ -0,0 +1,29 @@
+/**
+ * @license
+ * MyFonts Webfont Build ID 3078913, 2015-08-21T01:21:30-0400
+ *
+ * The fonts listed in this notice are subject to the End User License
+ * Agreement(s) entered into by the website owner. All other parties are
+ * explicitly restricted from using the Licensed Webfonts(s).
+ *
+ * You may obtain a valid license at the URLs below.
+ *
+ * Webfont: Blanc-Light by Latinotype
+ * URL: http://www.myfonts.com/fonts/latinotype/blanc/light/
+ * Copyright: Jorge Cisterna
+ * Licensed pageviews: 10,000
+ *
+ *
+ * License: http://www.myfonts.com/viewlicense?type=web&buildid=3078913
+ *
+ * © 2015 MyFonts Inc
+*/
+
+
+/* @import must be at top of file, otherwise CSS will not work */
+//@import url("//hello.myfonts.net/count/2efc68");
+@import url("//hello.myfonts.net/count/2efb01");
+
+
+@font-face {font-family: 'Blanc-Light';src: url('../webfonts/2EFB01_0_0.eot');src: url('../webfonts/2EFB01_0_0.eot?#iefix') format('embedded-opentype'),url('../webfonts/2EFB01_0_0.woff2') format('woff2'),url('../webfonts/2EFB01_0_0.woff') format('woff'),url('../webfonts/2EFB01_0_0.ttf') format('truetype');}
+@font-face {font-family: 'Blanc-Regular';src: url('../webfonts/2EFC68_0_0.eot');src: url('../webfonts/2EFC68_0_0.eot?#iefix') format('embedded-opentype'),url('../webfonts/2EFC68_0_0.woff2') format('woff2'),url('../webfonts/2EFC68_0_0.woff') format('woff'),url('../webfonts/2EFC68_0_0.ttf') format('truetype');}

website/source/assets/stylesheets/application.scss

@@ -0,0 +1,30 @@
+@import 'bootstrap-sprockets';
+@import 'bootstrap';
+
+@import url("//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Ubuntu+Mono");
+
+// Core variables and mixins
+@import '_variables';
+@import '_mixins';
+
+// Utility classes
+@import '_utilities';
+
+// Core CSS
+@import '_webfonts';
+
+//Global Site
+@import '_global';
+
+// Components
+@import '_header';
+@import '_footer';
+@import '_buttons';
+@import '_sidebar';
+
+// Pages
+@import '_home';
+@import '_community';
+@import '_docs';
+@import '_downloads';
+@import '_api';

website/source/community.html.erb

@@ -0,0 +1,87 @@
+---
+layout: "inner"
+page_title: "Community"
+description: |-
+  Vault is an open source project with a growing community.
+---
+
+<h1>Community</h1>
+
+<p>
+Vault is an open source project with a growing community. There are
+active, dedicated users willing to help you through various mediums.
+</p>
+<p>
+<strong>IRC:</strong> <code>#vault-tool</code> on Freenode
+</p>
+<p>
+<strong>Mailing list:</strong>
+<a href="https://groups.google.com/group/vault-tool">Vault Google Group</a>
+</p>
+<p>
+<strong>Bug Tracker:</strong>
+<a href="https://github.com/hashicorp/vault/issues">Issue tracker
+	on GitHub</a>. Please only use this for reporting bugs. Do not ask
+for general help here. Use IRC or the mailing list for that.
+
+<h1>People</h1>
+<p>
+The following people are some of the faces behind Vault. They each
+contribute to Vault in some core way. Over time, faces may appear and
+disappear from this list as contributors come and go. In addition to
+the faces below, Vault is a project by
+<a href="https://www.hashicorp.com">HashiCorp</a>, so many HashiCorp
+employees actively contribute to Vault.
+</p>
+<div class="people">
+	<div class="person">
+		<img class="pull-left" src="http://www.gravatar.com/avatar/54079122b67de9677c1f93933ce8b63a.png?s=125">
+		<div class="bio">
+			<h3>Mitchell Hashimoto (<a href="https://github.com/mitchellh">@mitchellh</a>)</h3>
+			<p>
+			Mitchell Hashimoto is the creator of Vault and works on all
+			layers of Vault from the core to backends. In addition to Vault,
+			Mitchell is the creator of
+			<a href="https://www.vagrantup.com">Vagrant</a>,
+			<a href="https://www.packer.io">Packer</a>,
+			<a href="https://www.consul.io">Consul</a>, and
+			<a href="https://www.terraform.io">Terraform</a>.
+			</p>
+		</div>
+	</div>
+
+	<div class="person">
+		<img class="pull-left" src="http://www.gravatar.com/avatar/11ba9630c9136eef9a70d26473d355d5.png?s=125">
+		<div class="bio">
+			<h3>Armon Dadgar (<a href="https://github.com/armon">@armon</a>)</h3>
+			<p>
+			Armon Dadgar is a creator of Vault. He works on all aspects of Vault,
+			focusing on core architecture and security. Armon is also the creator of
+			<a href="https://www.consul.io">Consul</a>,
+			<a href="https://www.serfdom.io">Serf</a>,
+			<a href="https://www.terraform.io">Terraform</a>,
+			<a href="https://github.com/armon/statsite">Statsite</a>, and
+            <a href="https://github.com/armon/bloomd">Bloomd</a>.
+            </p>
+		</div>
+    </div>
+
+	<div class="person">
+		<img class="pull-left" src="http://www.gravatar.com/avatar/2acc31dd6370a54b18f6755cd0710ce6.png?s=125">
+		<div class="bio">
+			<h3>Jack Pearkes (<a href="https://github.com/pearkes">@pearkes</a>)</h3>
+			<p>
+			Jack Pearkes is the creator of the online interactive demo of Vault.
+			He maintains this demo as well as the design and interaction of the
+			Vault website. Jack is an employee of HashiCorp and a primary engineer
+			behind <a href="https://atlas.hashicorp.com">Atlas</a>.
+			He is also a core committer to
+			<a href="https://www.packer.io">Packer</a>,
+			<a href="https://www.consul.io">Consul</a>, and
+			<a href="https://www.terraform.io">Terraform</a>.
+			</p>
+		</div>
+    </div>
+
+    <div class="clearfix"></div>
+</div>

website/source/docs/audit/file.html.md

@@ -0,0 +1,36 @@
+---
+layout: "docs"
+page_title: "Audit Backend: File"
+sidebar_current: "docs-audit-file"
+description: |-
+  The "file" audit backend writes audit logs to a file.
+---
+
+# Audit Backend: File
+
+Name: `file`
+
+The "file" audit backend writes audit logs to a file.
+
+This is a very simple audit backend: it appends logs to a file. It does
+not currently assist with any log rotation.
+
+## Options
+
+When enabling this backend, the following options are accepted:
+
+  * `path` (required) - The path to where the file will be written. If
+      this path exists, the audit backend will append to it.
+  * `log_raw` (optional) Should security sensitive information be logged raw. Defaults to "false".
+
+## Format
+
+Each line in the audit log is a JSON object. The "type" field specifies
+what type of object it is. Currently, only two types exist: "request" and
+"response".
+
+The line contains all of the information for any given request and response.
+
+If `log_raw` if false, as is default, all sensitive information is first hashed
+before logging. If explicitly enabled, all values are logged raw without hashing.
+

website/source/docs/audit/index.html.md

@@ -0,0 +1,67 @@
+---
+layout: "docs"
+page_title: "Audit Backends"
+sidebar_current: "docs-audit"
+description: |-
+  Audit backends are mountable backends that log requests and responses in Vault.
+---
+
+# Audit Backends
+
+Audit backends are the components in Vault that keep a detailed log
+of all requests and response to Vault. Because _every_ operation with
+Vault is an API request/response, the audit log contains _every_ interaction
+with Vault, including errors.
+
+Vault ships with multiple audit backends, depending on the location you want
+the logs sent to. Multiple audit backends can be enabled and Vault will send
+the audit logs to both. This allows you to not only have a redundant copy,
+but also a second copy in case the first is tampered with.
+
+## Sensitive Information
+
+The audit logs contain the full request and response objects for every
+interaction with Vault. The data in the request and the data in the
+response (including secrets and authentication tokens) will be hashed
+without a salt using SHA1.
+
+The purpose of the hash is so that secrets aren't in plaintext within
+your audit logs. However, you're still able to check the value of
+secrets by SHA-ing it yourself.
+
+## Enabling/Disabling Audit Backends
+
+When a Vault server is first initialized, no auditing is enabled. Audit
+backends must be enabled by a root user using `vault audit-enable`.
+
+When enabling an audit backend, options can be passed to it to configure it.
+For example, the command below enables the file audit backend:
+
+```
+$ vault audit-enable file path=/var/log/vault_audit.log
+...
+```
+
+In the command above, we passed the "path" parameter to specify the path
+where the audit log will be written to. Each audit backend has its own
+set of parameters. See the documentation to the left for more details.
+
+When an audit backend is disabled, it will stop receiving logs immediately.
+The existing logs that it did store are untouched.
+
+## Blocked Audit Backends
+
+If there are any audit backends enabled, Vault requires that at least
+one be able to persist the log before completing a Vault request.
+
+If you have only one audit backend enabled, and it is blocking (network
+block, etc.), then Vault will be _unresponsive_. Vault _will not_ complete
+any requests until the audit backend can write.
+
+If you have more than one audit backend, then Vault will complete the request
+as long as one audit backend persists the log.
+
+Vault will not respond to requests if audit backends are blocked because
+audit logs are critically important and ignoring blocked requests opens
+an avenue for attack. Be absolutely certain that your audit backends cannot
+block.

website/source/docs/audit/syslog.html.md

@@ -0,0 +1,37 @@
+---
+layout: "docs"
+page_title: "Audit Backend: Syslog"
+sidebar_current: "docs-audit-syslog"
+description: |-
+  The "syslog" audit backend writes audit logs to syslog.
+---
+
+# Audit Backend: Syslog
+
+Name: `syslog`
+
+The "syslog" audit backend writes audit logs to syslog.
+
+It currently does not support a configurable syslog destination, and
+always sends to the local agent. This backend is only supported on Unix systems,
+and should not be enabled if any standby Vault instances do not support it.
+
+## Options
+
+When enabling this backend, the following options are accepted:
+
+ * `facility` (optional) - The syslog facility to use. Defaults to "AUTH".
+ * `tag` (optional) - The syslog tag to use. Defaults to "vault".
+ * `log_raw` (optional) Should security sensitive information be logged raw. Defaults to "false".
+
+## Format
+
+Each line in the audit log is a JSON object. The "type" field specifies
+what type of object it is. Currently, only two types exist: "request" and
+"response".
+
+The line contains all of the information for any given request and response.
+
+If `log_raw` if false, as is default, all sensitive information is first hashed
+before logging. If explicitly enabled, all values are logged raw without hashing.
+

website/source/docs/auth/app-id.html.md

@@ -0,0 +1,119 @@
+---
+layout: "docs"
+page_title: "Auth Backend: App ID"
+sidebar_current: "docs-auth-appid"
+description: |-
+  The App ID auth backend is a mechanism for machines to authenticate with Vault.
+---
+
+# Auth Backend: App ID
+
+Name: `app-id`
+
+The App ID auth backend is a mechanism for machines to authenticate with
+Vault. It works by requiring two hard-to-guess unique pieces of information:
+a unique app ID, and a unique user ID.
+
+The goal of this credential provider is to allow elastic users
+(dynamic machines, containers, etc.) to authenticate with Vault without
+having to store passwords outside of Vault. It is a single method of
+solving the chicken-and-egg problem of setting up Vault access on a machine.
+With this provider, nobody except the machine itself has access to both
+pieces of information necessary to authenticate. For example:
+configuration management will have the app IDs, but the machine itself
+will detect its user ID based on some unique machine property such as a
+MAC address (or a hash of it with some salt).
+
+An example, real world process for using this provider:
+
+  1. Create unique app IDs (UUIDs work well) and map them to policies.
+     (Path: map/app-id/<app-id>)
+
+  2. Store the app IDs within configuration management systems.
+
+  3. An out-of-band process run by security operators map unique user IDs
+     to these app IDs. Example: when an instance is launched, a cloud-init
+     system tells security operators a unique ID for this machine. This
+     process can be scripted, but the key is that it is out-of-band and
+     out of reach of configuration management.
+   (Path: map/user-id/<user-id>)
+
+  4. A new server is provisioned. Configuration management configures the
+     app ID, the server itself detects its user ID. With both of these
+     pieces of information, Vault can be accessed according to the policy
+     set by the app ID.
+
+More details on this process follow:
+
+The app ID is a unique ID that maps to a set of policies. This ID is
+generated by an operator and configured into the backend. The ID itself
+is usually a UUID, but any hard-to-guess unique value can be used.
+
+After creating app IDs, an operator authorizes a fixed set of user IDs
+with each app ID. When a valid {app ID, user ID} tuple is given to the
+"login" path, then the user is authenticated with the configured app
+ID policies.
+
+The user ID can be any value (just like the app ID), however it is
+generally a value unique to a machine, such as a MAC address or instance ID,
+or a value hashed from these unique values.
+
+
+## Authentication
+
+#### Via the CLI
+
+App ID authentication is not allowed via the CLI.
+
+#### Via the API
+
+The endpoint for the App ID login is `/login`. The client is expected
+to provide the `app_id` and `user_id` parameters as part of the request.
+
+## Configuration
+
+First you must enable the App ID auth backend:
+
+```
+$ vault auth-enable app-id
+Successfully enabled 'app-id' at 'app-id'!
+```
+
+Now when you run `vault auth -methods`, the App ID backend is available:
+
+```
+Path       Type      Description
+app-id/    app-id
+token/     token     token based credentials
+```
+
+To use the App ID auth backend, an operator must configure it with
+the set of App IDs, user IDs, and the mapping between them. An
+example is shown below, use `vault path-help` for more details.
+
+```
+$ vault write auth/app-id/map/app-id/foo value=root display_name=foo
+...
+
+$ vault write auth/app-id/map/user-id/bar value=foo cidr_block=10.0.0.0/16
+...
+```
+
+The above creates an App ID "foo" that associates with the policy "root".
+The `display_name` sets the display name for audit logs and secrets.
+Next, we configure the user ID "bar" and say that the user ID bar
+can be paired with "foo" but only if the client is in the "10.0.0.0/16" CIDR block.
+The `cidr_block` configuration is optional.
+
+This means that if a client authenticates and provide both "foo" and "bar",
+then the app ID will authenticate that client with the policy "root".
+
+In practice, both the user and app ID are likely hard-to-guess UUID-like values.
+
+Note that it is possible to authorize multiple app IDs with each
+user ID by writing them as comma-separated values to the user ID mapping:
+
+```
+$ vault write auth/app-id/map/user-id/bar value=foo,baz cidr_block=10.0.0.0/16
+...
+```

website/source/docs/auth/cert.html.md

@@ -0,0 +1,68 @@
+---
+layout: "docs"
+page_title: "Auth Backend: TLS Certificates"
+sidebar_current: "docs-auth-cert"
+description: |-
+  The "cert" auth backend allows users to authenticate with Vault using TLS client certificates.
+---
+
+# Auth Backend: TLS Certificates
+
+Name: `cert`
+
+The "cert" auth backend allows authentication using SSL/TLS client certificates
+which are either signed by a CA or self-signed.
+
+The trusted certificates and CAs are configured directly to the auth
+backend using the `certs/` path. This backend cannot read trusted certificates
+from an external source.
+
+## Authentication
+
+### Via the CLI
+```
+vault auth -method=cert \
+  -ca-cert=ca.pem -client-cert=cert.pem -client-key=key.pem
+```
+
+### Via the API
+The endpoint for the login is `/login`. The client simply connects with their TLS
+certificate and when the login endpoint is hit, the auth backend will determine
+if there is a matching trusted certificate to authenticate the client.
+
+```
+curl --cacert ca.pem --cert cert.pem --key key.pem \
+  $VAULT_ADDR/v1/auth/cert/login -XPOST
+```
+
+## Configuration
+
+First, you must enable the certificate auth backend:
+
+```
+$ vault auth-enable cert
+Successfully enabled 'cert' at 'cert'!
+```
+
+Now when you run `vault auth -methods`, the certificate backend is available:
+
+```
+Path       Type      Description
+cert/      cert
+token/     token     token based credentials
+```
+
+To use the "cert" auth backend, an operator must configure it with
+trusted certificates that are allowed to authenticate. An example is shown below.
+Use `vault path-help` for more details.
+
+```
+$ vault write auth/cert/certs/web display_name=web policies=web,prod certificate=@web-cert.pem lease=3600
+...
+```
+
+The above creates a new trusted certificate "web" with same display name
+and the "web" and "prod" policies. The certificate (public key) used to verify
+clients is given by the "web-cert.pem" file. Lastly, an optional lease value
+can be provided in seconds to limit the lease period.
+

website/source/docs/auth/github.html.md

@@ -0,0 +1,86 @@
+---
+layout: "docs"
+page_title: "Auth Backend: GitHub"
+sidebar_current: "docs-auth-github"
+description: |-
+  The GitHub auth backend allows authentication with Vault using GitHub.
+---
+
+# Auth Backend: GitHub
+
+Name: `github`
+
+The GitHub auth backend can be used to authenticate with Vault using
+a GitHub personal access token.
+This method of authentication is most useful for humans: operators or
+developers using Vault directly via the CLI.
+
+## Authentication
+
+#### Via the CLI
+
+```
+$ vault auth -method=github token=<api token>
+...
+```
+
+#### Via the API
+
+The endpoint for the GitHub login is `/login`.
+
+## Configuration
+
+First, you must enable the GitHub auth backend:
+
+```
+$ vault auth-enable github
+Successfully enabled 'github' at 'github'!
+```
+
+Now when you run `vault auth -methods`, the GitHub backend is available:
+
+```
+Path       Type      Description
+github/    github
+token/     token     token based credentials
+```
+
+Prior to using the GitHub auth backend, it must be configured. To
+configure it, use the `/config` endpoint with the following arguments:
+
+  * `organization` (string, required) - The organization name a user must
+       be a part of to authenticate.
+
+###Generate a GitHub Personal Access Token
+Access your Personal Access Tokens in GitHub at [https://github.com/settings/tokens](https://github.com/settings/tokens).
+Generate a new Token that has the scope `read:org`. Save the generated token. This is what you will provide to vault.
+
+For example:
+
+```
+$ vault write auth/github/config organization=hashicorp
+Success! Data written to: auth/github/config
+```
+
+After configuring that, you must map the teams of that organization to
+policies within Vault. Use the `map/teams/<team>` endpoints to do that.
+Example:
+
+```
+$ vault write auth/github/map/teams/owners value=root
+Success! Data written to: auth/github/map/teams/owners
+```
+
+The above would make anyone in the "owners" team a root user in Vault
+(not recommended).
+
+You can then auth with a user that is a member of the "owners" team using a Personal Access Token with the `read:org` scope.
+
+```
+$ vault auth -method=github token=000000905b381e723b3d6a7d52f148a5d43c4b45
+Successfully authenticated! The policies that are associated
+with this token are listed below:
+
+root
+```
+

website/source/docs/auth/index.html.md

@@ -0,0 +1,40 @@
+---
+layout: "docs"
+page_title: "Auth Backends"
+sidebar_current: "docs-auth"
+description: |-
+  Auth backends are mountable backends that perform authentication for Vault.
+---
+
+# Auth Backends
+
+Auth backends are the components in Vault that perform authentication
+and are responsible for assigning identity and a set of policies to a
+user.
+
+Having multiple auth backends enables you to use an auth backend
+that makes the sense for your use case of Vault and your organization.
+
+For example, on developer machines, the [GitHub auth backend](/docs/auth/github.html)
+is easiest to use. But for servers the [App ID](/docs/auth/app-id.html)
+backend is the recommended choice.
+
+To learn more about authentication, see the
+[authentication concepts page](/docs/concepts/auth.html).
+
+## Enabling/Disabling Auth Backends
+
+Auth backends can be enabled/disabled using the CLI or the API.
+
+When enabled, auth backends are similar to [secret backends](/docs/secrets/index.html):
+they are mounted within the Vault mount table and can be accessed
+and configured using the standard read/write API. The only difference
+is that all auth backends are mounted underneath the `auth/` prefix.
+
+By default, auth backends are mounted to `auth/<type>`. For example,
+if you enable "github", then you can interact with it at `auth/github`.
+However, this path is customizable, allowing users with advanced use
+cases to mount a single auth backend multiple times.
+
+When an auth backend is disabled, all users authenticated via that
+backend are automatically logged out.

website/source/docs/auth/ldap.html.md

@@ -0,0 +1,131 @@
+---
+layout: "docs"
+page_title: "Auth Backend: LDAP"
+sidebar_current: "docs-auth-ldap"
+description: |-
+  The "ldap" auth backend allows users to authenticate with Vault using LDAP credentials.
+---
+
+# Auth Backend: LDAP
+
+Name: `ldap`
+
+The "ldap" auth backend allows authentication using an existing LDAP
+server and user/password credentials. This allows Vault to be integrated
+into environments using LDAP without duplicating the user/pass configuration
+in multiple places.
+
+The mapping of groups in LDAP to Vault policies is managed by using the
+`users/` and `groups/` paths.
+
+## Authentication
+
+#### Via the CLI
+
+```
+$ vault auth -method=ldap username=mitchellh
+Password (will be hidden):
+Successfully authenticated! The policies that are associated
+with this token are listed below:
+
+root
+```
+
+#### Via the API
+
+The endpoint for the login is `auth/ldap/login/<username>`.
+
+The password should be sent in the POST body encoded as JSON.
+
+```shell
+$ curl $VAULT_ADDR/v1/auth/ldap/login/mitchellh \
+    -d '{ "password": "foo" }'
+```
+
+The response will be in JSON. For example:
+
+```javascript
+{
+  "lease_id":"",
+  "renewable":false,
+  "lease_duration":0,
+  "data":null,
+  "auth":{
+    "client_token":"c4f280f6-fdb2-18eb-89d3-589e2e834cdb",
+    "policies":[
+      "root"
+    ],
+    "metadata":{
+      "username":"mitchellh"
+    },
+    "lease_duration":0,
+    "renewable":false
+  }
+}
+```
+
+## Configuration
+
+First, you must enable the ldap auth backend:
+
+```
+$ vault auth-enable ldap
+Successfully enabled 'ldap' at 'ldap'!
+```
+
+Now when you run `vault auth -methods`, the ldap backend is available:
+
+```
+Path       Type      Description
+ldap/      ldap
+token/     token     token based credentials
+```
+
+To use the "ldap" auth backend, an operator must configure it with
+the address of the LDAP server that is to be used. An example is shown below.
+Use `vault path-help` for more details.
+
+```
+$ vault write auth/ldap/config url="ldap://ldap.forumsys.com" \
+		userattr=uid \
+        userdn="dc=example,dc=com" \
+        groupdn="dc=example,dc=com" \
+        upndomain="forumsys.com" \
+        certificate=@ldap_ca_cert.pem \
+        insecure_tls=false \
+        starttls=true
+...
+```
+
+The above configures the target LDAP server, along with the parameters
+specifying how users and groups should be queried from the LDAP server.
+
+Next we want to create a mapping from an LDAP group to a Vault policy:
+
+```
+$ vault write auth/ldap/groups/scientists policies=foo,bar
+```
+
+This maps the LDAP group "scientists" to the "foo" and "bar" Vault policies.
+
+We can also add specific LDAP users to additional (potentially non-LDAP) groups:
+
+```
+$ vault write auth/ldap/groups/engineers policies=foobar
+$ vault write auth/ldap/users/tesla groups=engineers
+```
+
+This adds the LDAP user "tesla" to the "engineers" group, which maps to
+the "foobar" Vault policy.
+
+Finally, we can test this by authenticating:
+
+```
+$ vault auth -method=ldap username=tesla
+Password (will be hidden):
+Successfully authenticated! The policies that are associated
+with this token are listed below:
+
+bar, foo, foobar
+```
+