diff --git a/README.txt b/README.txt
index 078d0c5..867dc9b 100644
--- a/README.txt
+++ b/README.txt
@@ -1,18 +1,23 @@
-Photon by HTML5 UP
+Story by HTML5 UP
 html5up.net | @ajlkn
 Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 
 
-A simple (gradient-heavy) single pager that revisits a style I messed with on two
-previous designs (Tessellate and Telephasic). Fully responsive, built on Sass,
-and, as usual, loaded with an assortment of pre-styled elements. Have fun! :)
+Say hello to Story, a brand new responsive one-pager for HTML5 UP! Inspired by my work
+on Carrd*, Story is built to be extremely modular and tweakable, and as such is entirely
+built on reusable, insanely customizable elements (like "spotlight" and "gallery") that
+can be endlessly duplicated and tweaked into whatever you need to tell your story --
+without, in many cases, touching *any* CSS. Check out index-demo.html for an interactive
+demo, and index.html for the actual template. Enjoy!
 
-Demo images* courtesy of Unsplash, a radtastic collection of CC0 (public domain) images
+Demo images** courtesy of Unsplash, a radtastic collection of CC0 (public domain) images
 you can use for pretty much whatever.
 
-(* = Not included)
+PS: Delete index-demo.html and assets/js/demo.js when you're done messing with the demo
+as neither are needed in production :)
 
-Feedback, bug reports, and comments are not only welcome, but strongly encouraged :)
+(* = my other side project -- carrd.co)
+(** = not included)
 
 AJ
 aj@lkn.io | @ajlkn
@@ -28,8 +33,5 @@ Credits:
 
 	Other:
 		jQuery (jquery.com)
-		html5shiv.js (@afarkas @jdalton @jon_neal @rem)
-		CSS3 Pie (css3pie.com)
-		background-size polyfill (github.com/louisremi)
-		Respond.js (j.mp/respondjs)
+		Misc. Sass functions (@HugoGiraudel)
 		Skel (skel.io)
\ No newline at end of file
diff --git a/assets/css/ie8.css b/assets/css/ie8.css
deleted file mode 100644
index 047d302..0000000
--- a/assets/css/ie8.css
+++ /dev/null
@@ -1,368 +0,0 @@
-/*
-	Photon by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-/* Basic */
-
-	hr {
-		border-bottom: solid 1px #ccc;
-	}
-
-	blockquote {
-		border-left: solid 4px #ccc;
-	}
-
-	code {
-		border: solid 1px #ccc;
-	}
-
-/* Section/Article */
-
-	header.major:after {
-		background: #ccc;
-	}
-
-/* Form */
-
-	input[type="text"],
-	input[type="password"],
-	input[type="email"],
-	select,
-	textarea {
-		-ms-behavior: url("assets/js/ie/PIE.htc");
-		border: solid 1px #ccc;
-		position: relative;
-	}
-
-/* List */
-
-	ul.alt li {
-		border-top: solid 1px #ccc;
-	}
-
-	ul.major-icons li .icon {
-		-ms-behavior: url("assets/js/ie/PIE.htc");
-		border: solid 1px #ccc;
-		position: relative;
-	}
-
-/* Table */
-
-	table thead {
-		border-bottom: solid 1px #ccc;
-	}
-
-	table tfoot {
-		border-top: solid 1px #ccc;
-	}
-
-	table.alt tbody tr td {
-		border: solid 1px #ccc;
-		border-left-width: 0;
-		border-top-width: 0;
-	}
-
-/* Button */
-
-	input[type="submit"],
-	input[type="reset"],
-	input[type="button"],
-	button,
-	.button {
-		-ms-behavior: url("assets/js/ie/PIE.htc");
-		border: solid 1px #ccc;
-		position: relative;
-	}
-
-/* Image */
-
-	.image {
-		-ms-behavior: url("assets/js/ie/PIE.htc");
-	}
-
-		.image img {
-			-ms-behavior: url("assets/js/ie/PIE.htc");
-			position: relative;
-		}
-
-/* Main */
-
-	.main.style2 {
-		background-color: #333;
-		color: #ffffff;
-		-ms-behavior: url("assets/js/ie/backgroundsize.min.htc");
-		background-image: url("../../images/header.jpg");
-		background-size: cover;
-		position: relative;
-	}
-
-		.main.style2 a {
-			border-bottom-color: #ffffff;
-		}
-
-			.main.style2 a:hover {
-				color: #ffffff;
-			}
-
-		.main.style2 h1, .main.style2 h2, .main.style2 h3, .main.style2 h4, .main.style2 h5, .main.style2 h6, .main.style2 strong, .main.style2 b {
-			color: #ffffff;
-		}
-
-		.main.style2 header p {
-			color: #ffffff;
-		}
-
-		.main.style2 header.major:after {
-			background: #ffffff;
-		}
-
-		.main.style2 input[type="submit"],
-		.main.style2 input[type="reset"],
-		.main.style2 input[type="button"],
-		.main.style2 button,
-		.main.style2 .button {
-			border: solid 1px #ffffff !important;
-			color: #ffffff !important;
-		}
-
-			.main.style2 input[type="submit"]:hover,
-			.main.style2 input[type="reset"]:hover,
-			.main.style2 input[type="button"]:hover,
-			.main.style2 button:hover,
-			.main.style2 .button:hover {
-				background-color: transparent;
-			}
-
-			.main.style2 input[type="submit"]:active,
-			.main.style2 input[type="reset"]:active,
-			.main.style2 input[type="button"]:active,
-			.main.style2 button:active,
-			.main.style2 .button:active {
-				background-color: transparent;
-			}
-
-			.main.style2 input[type="submit"].special,
-			.main.style2 input[type="reset"].special,
-			.main.style2 input[type="button"].special,
-			.main.style2 button.special,
-			.main.style2 .button.special {
-				background-color: #ffffff;
-				border: solid 1px #ffffff !important;
-				color: #333 !important;
-			}
-
-				.main.style2 input[type="submit"].special:hover,
-				.main.style2 input[type="reset"].special:hover,
-				.main.style2 input[type="button"].special:hover,
-				.main.style2 button.special:hover,
-				.main.style2 .button.special:hover {
-					background-color: transparent !important;
-					color: #ffffff !important;
-				}
-
-				.main.style2 input[type="submit"].special:active,
-				.main.style2 input[type="reset"].special:active,
-				.main.style2 input[type="button"].special:active,
-				.main.style2 button.special:active,
-				.main.style2 .button.special:active {
-					background-color: transparent !important;
-				}
-
-		.main.style2 ul.major-icons li .icon {
-			border-color: #ffffff;
-		}
-
-		.main.style2 .icon.major {
-			color: #ffffff;
-		}
-
-		.main.style2:before {
-			background-image: url("images/overlay1.png");
-			content: '';
-			height: 100%;
-			left: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
-		}
-
-		.main.style2 > * {
-			position: relative;
-			z-index: 1;
-		}
-
-/* Header */
-
-	#header {
-		background-color: #4686a0;
-		color: #ffffff;
-	}
-
-		#header a {
-			border-bottom-color: #ffffff;
-		}
-
-			#header a:hover {
-				color: #ffffff;
-			}
-
-		#header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header strong, #header b {
-			color: #ffffff;
-		}
-
-		#header header p {
-			color: #ffffff;
-		}
-
-		#header header.major:after {
-			background: #ffffff;
-		}
-
-		#header input[type="submit"],
-		#header input[type="reset"],
-		#header input[type="button"],
-		#header button,
-		#header .button {
-			border: solid 1px #ffffff !important;
-			color: #ffffff !important;
-		}
-
-			#header input[type="submit"]:hover,
-			#header input[type="reset"]:hover,
-			#header input[type="button"]:hover,
-			#header button:hover,
-			#header .button:hover {
-				background-color: transparent;
-			}
-
-			#header input[type="submit"]:active,
-			#header input[type="reset"]:active,
-			#header input[type="button"]:active,
-			#header button:active,
-			#header .button:active {
-				background-color: transparent;
-			}
-
-			#header input[type="submit"].special,
-			#header input[type="reset"].special,
-			#header input[type="button"].special,
-			#header button.special,
-			#header .button.special {
-				background-color: #ffffff;
-				border: solid 1px #ffffff !important;
-				color: #4686a0 !important;
-			}
-
-				#header input[type="submit"].special:hover,
-				#header input[type="reset"].special:hover,
-				#header input[type="button"].special:hover,
-				#header button.special:hover,
-				#header .button.special:hover {
-					background-color: transparent !important;
-					color: #ffffff !important;
-				}
-
-				#header input[type="submit"].special:active,
-				#header input[type="reset"].special:active,
-				#header input[type="button"].special:active,
-				#header button.special:active,
-				#header .button.special:active {
-					background-color: transparent !important;
-				}
-
-		#header ul.major-icons li .icon {
-			border-color: #ffffff;
-		}
-
-		#header .icon.major {
-			color: #ffffff;
-		}
-
-/* Footer */
-
-	#footer {
-		background-color: #4686a0;
-		color: #ffffff;
-	}
-
-		#footer a {
-			border-bottom-color: #ffffff;
-		}
-
-			#footer a:hover {
-				color: #ffffff;
-			}
-
-		#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6, #footer strong, #footer b {
-			color: #ffffff;
-		}
-
-		#footer header p {
-			color: #ffffff;
-		}
-
-		#footer header.major:after {
-			background: #ffffff;
-		}
-
-		#footer input[type="submit"],
-		#footer input[type="reset"],
-		#footer input[type="button"],
-		#footer button,
-		#footer .button {
-			border: solid 1px #ffffff !important;
-			color: #ffffff !important;
-		}
-
-			#footer input[type="submit"]:hover,
-			#footer input[type="reset"]:hover,
-			#footer input[type="button"]:hover,
-			#footer button:hover,
-			#footer .button:hover {
-				background-color: transparent;
-			}
-
-			#footer input[type="submit"]:active,
-			#footer input[type="reset"]:active,
-			#footer input[type="button"]:active,
-			#footer button:active,
-			#footer .button:active {
-				background-color: transparent;
-			}
-
-			#footer input[type="submit"].special,
-			#footer input[type="reset"].special,
-			#footer input[type="button"].special,
-			#footer button.special,
-			#footer .button.special {
-				background-color: #ffffff;
-				border: solid 1px #ffffff !important;
-				color: #4686a0 !important;
-			}
-
-				#footer input[type="submit"].special:hover,
-				#footer input[type="reset"].special:hover,
-				#footer input[type="button"].special:hover,
-				#footer button.special:hover,
-				#footer .button.special:hover {
-					background-color: transparent !important;
-					color: #ffffff !important;
-				}
-
-				#footer input[type="submit"].special:active,
-				#footer input[type="reset"].special:active,
-				#footer input[type="button"].special:active,
-				#footer button.special:active,
-				#footer .button.special:active {
-					background-color: transparent !important;
-				}
-
-		#footer ul.major-icons li .icon {
-			border-color: #ffffff;
-		}
-
-		#footer .icon.major {
-			color: #ffffff;
-		}
\ No newline at end of file
diff --git a/assets/css/ie9.css b/assets/css/ie9.css
deleted file mode 100644
index a51c00b..0000000
--- a/assets/css/ie9.css
+++ /dev/null
@@ -1,55 +0,0 @@
-/*
-	Photon by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-/* Header */
-
-	#header {
-		background-image: none;
-		filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#4fa49a", endColorStr="#4361c2", GradientType=1);
-		position: relative;
-	}
-
-		#header:before {
-			background-image: url("images/overlay2.png"), url("images/overlay3.svg");
-			background-position: top left,							center center;
-			background-size: auto,								cover;
-			content: '';
-			height: 100%;
-			left: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
-		}
-
-		#header > * {
-			position: relative;
-			z-index: 1;
-		}
-
-/* Footer */
-
-	#footer {
-		background-image: none;
-		filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#4361c2", endColorStr="#4fa49a", GradientType=1);
-		position: relative;
-	}
-
-		#footer:before {
-			background-image: url("images/overlay2.png"), url("images/overlay4.svg");
-			background-position: top left,							center center;
-			background-size: auto,								cover;
-			content: '';
-			height: 100%;
-			left: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
-		}
-
-		#footer > * {
-			position: relative;
-			z-index: 1;
-		}
\ No newline at end of file
diff --git a/assets/css/images/overlay1.png b/assets/css/images/overlay1.png
deleted file mode 100644
index 7aa8031..0000000
Binary files a/assets/css/images/overlay1.png and /dev/null differ
diff --git a/assets/css/images/overlay2.png b/assets/css/images/overlay2.png
deleted file mode 100644
index 1d1e8f5..0000000
Binary files a/assets/css/images/overlay2.png and /dev/null differ
diff --git a/assets/css/images/overlay3.svg b/assets/css/images/overlay3.svg
deleted file mode 100644
index 1dc020c..0000000
--- a/assets/css/images/overlay3.svg
+++ /dev/null
@@ -1,22 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1000px" height="1000px" viewBox="0 0 1000 1000" zoomAndPan="disable">
-    <style type="text/css"><![CDATA[
-		.p-4 { fill: rgba(255,255,255,0.16); }
-		.p-3 { fill: rgba(255,255,255,0.12); }
-		.p-2 { fill: rgba(255,255,255,0.08); }
-		.p-1 { fill: rgba(255,255,255,0.04); }
-		.p0 { fill: none; }
-		.p1 { fill: rgba(0,0,0,0.025); }
-		.p2 { fill: rgba(0,0,0,0.05); }
-		.p3 { fill: rgba(0,0,0,0.075); }
-		.p4 { fill: rgba(0,0,0,0.1); }
-    ]]></style>
-	<polygon class="p-4" points="-1125,0 -375,1000 125,1000 -875,0" />
-	<polygon class="p-3" points="-875,0 125,1000 375,1000 -625,0" />
-	<polygon class="p-2" points="-625,0 375,1000 625,1000 -375,0" />
-	<polygon class="p-1" points="-375,0 625,1000 875,1000 -125,0" />
-	<polygon class="p0" points="-125,0 875,1000 1125,1000 125,0" />
-	<polygon class="p1" points="125,0 1125,1000 1375,1000 375,0" />
-	<polygon class="p2" points="375,0 1375,1000 1625,1000 625,0" />
-	<polygon class="p3" points="625,0 1625,1000 1875,1000 875,0" />
-	<polygon class="p4" points="875,0 1875,1000 2125,1000 1125,0" />
-</svg>
\ No newline at end of file
diff --git a/assets/css/images/overlay4.svg b/assets/css/images/overlay4.svg
deleted file mode 100644
index fb0be90..0000000
--- a/assets/css/images/overlay4.svg
+++ /dev/null
@@ -1,22 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1000px" height="1000px" viewBox="0 0 1000 1000" zoomAndPan="disable">
-    <style type="text/css"><![CDATA[
-		.p-4 { fill: rgba(255,255,255,0.16); }
-		.p-3 { fill: rgba(255,255,255,0.12); }
-		.p-2 { fill: rgba(255,255,255,0.08); }
-		.p-1 { fill: rgba(255,255,255,0.04); }
-		.p0 { fill: none; }
-		.p1 { fill: rgba(0,0,0,0.025); }
-		.p2 { fill: rgba(0,0,0,0.05); }
-		.p3 { fill: rgba(0,0,0,0.075); }
-		.p4 { fill: rgba(0,0,0,0.1); }
-    ]]></style>
-	<polygon class="p4" points="-1125,0 -375,1000 125,1000 -875,0" />
-	<polygon class="p3" points="-875,0 125,1000 375,1000 -625,0" />
-	<polygon class="p2" points="-625,0 375,1000 625,1000 -375,0" />
-	<polygon class="p1" points="-375,0 625,1000 875,1000 -125,0" />
-	<polygon class="p0" points="-125,0 875,1000 1125,1000 125,0" />
-	<polygon class="p-1" points="125,0 1125,1000 1375,1000 375,0" />
-	<polygon class="p-2" points="375,0 1375,1000 1625,1000 625,0" />
-	<polygon class="p-3" points="625,0 1625,1000 1875,1000 875,0" />
-	<polygon class="p-4" points="875,0 1875,1000 2125,1000 1125,0" />
-</svg>
\ No newline at end of file
diff --git a/assets/css/main.css b/assets/css/main.css
index 02f1709..dc3e51f 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1,8 +1,8 @@
-@import url("font-awesome.min.css");
-@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic");
+@import url(font-awesome.min.css);
+@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i");
 
 /*
-	Photon by HTML5 UP
+	Story by HTML5 UP
 	html5up.net | @ajlkn
 	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 */
@@ -56,191 +56,6 @@
 		box-sizing: border-box;
 	}
 
-/* Containers */
-
-	.container {
-		margin-left: auto;
-		margin-right: auto;
-	}
-
-	.container.\31 25\25 {
-		width: 100%;
-		max-width: 75em;
-		min-width: 60em;
-	}
-
-	.container.\37 5\25 {
-		width: 45em;
-	}
-
-	.container.\35 0\25 {
-		width: 30em;
-	}
-
-	.container.\32 5\25 {
-		width: 15em;
-	}
-
-	.container {
-		width: 60em;
-	}
-
-	@media screen and (max-width: 1680px) {
-
-		.container.\31 25\25 {
-			width: 100%;
-			max-width: 75em;
-			min-width: 60em;
-		}
-
-		.container.\37 5\25 {
-			width: 45em;
-		}
-
-		.container.\35 0\25 {
-			width: 30em;
-		}
-
-		.container.\32 5\25 {
-			width: 15em;
-		}
-
-		.container {
-			width: 60em;
-		}
-
-	}
-
-	@media screen and (max-width: 1140px) {
-
-		.container.\31 25\25 {
-			width: 100%;
-			max-width: 112.5%;
-			min-width: 90%;
-		}
-
-		.container.\37 5\25 {
-			width: 67.5%;
-		}
-
-		.container.\35 0\25 {
-			width: 45%;
-		}
-
-		.container.\32 5\25 {
-			width: 22.5%;
-		}
-
-		.container {
-			width: 90%;
-		}
-
-	}
-
-	@media screen and (max-width: 980px) {
-
-		.container.\31 25\25 {
-			width: 100%;
-			max-width: 125%;
-			min-width: 100%;
-		}
-
-		.container.\37 5\25 {
-			width: 75%;
-		}
-
-		.container.\35 0\25 {
-			width: 50%;
-		}
-
-		.container.\32 5\25 {
-			width: 25%;
-		}
-
-		.container {
-			width: 100% !important;
-		}
-
-	}
-
-	@media screen and (max-width: 736px) {
-
-		.container.\31 25\25 {
-			width: 100%;
-			max-width: 125%;
-			min-width: 100%;
-		}
-
-		.container.\37 5\25 {
-			width: 75%;
-		}
-
-		.container.\35 0\25 {
-			width: 50%;
-		}
-
-		.container.\32 5\25 {
-			width: 25%;
-		}
-
-		.container {
-			width: 100% !important;
-		}
-
-	}
-
-	@media screen and (max-width: 480px) {
-
-		.container.\31 25\25 {
-			width: 100%;
-			max-width: 125%;
-			min-width: 100%;
-		}
-
-		.container.\37 5\25 {
-			width: 75%;
-		}
-
-		.container.\35 0\25 {
-			width: 50%;
-		}
-
-		.container.\32 5\25 {
-			width: 25%;
-		}
-
-		.container {
-			width: 100% !important;
-		}
-
-	}
-
-	@media screen and (max-width: 320px) {
-
-		.container.\31 25\25 {
-			width: 100%;
-			max-width: 125%;
-			min-width: 100%;
-		}
-
-		.container.\37 5\25 {
-			width: 75%;
-		}
-
-		.container.\35 0\25 {
-			width: 50%;
-		}
-
-		.container.\32 5\25 {
-			width: 25%;
-		}
-
-		.container {
-			width: 100% !important;
-		}
-
-	}
-
 /* Grid */
 
 	.row {
@@ -273,99 +88,99 @@
 	}
 
 	.row.\30 \25 > * {
-		padding: 0 0 0 0em;
+		padding: 0 0 0 0rem;
 	}
 
 	.row.\30 \25 {
-		margin: 0 0 -1px 0em;
+		margin: 0 0 -1px 0rem;
 	}
 
 	.row.uniform.\30 \25 > * {
-		padding: 0em 0 0 0em;
+		padding: 0rem 0 0 0rem;
 	}
 
 	.row.uniform.\30 \25 {
-		margin: 0em 0 -1px 0em;
+		margin: 0rem 0 -1px 0rem;
 	}
 
 	.row > * {
-		padding: 0 0 0 2em;
+		padding: 0 0 0 2rem;
 	}
 
 	.row {
-		margin: 0 0 -1px -2em;
+		margin: 0 0 -1px -2rem;
 	}
 
 	.row.uniform > * {
-		padding: 2em 0 0 2em;
+		padding: 2rem 0 0 2rem;
 	}
 
 	.row.uniform {
-		margin: -2em 0 -1px -2em;
+		margin: -2rem 0 -1px -2rem;
 	}
 
 	.row.\32 00\25 > * {
-		padding: 0 0 0 4em;
+		padding: 0 0 0 4rem;
 	}
 
 	.row.\32 00\25 {
-		margin: 0 0 -1px -4em;
+		margin: 0 0 -1px -4rem;
 	}
 
 	.row.uniform.\32 00\25 > * {
-		padding: 4em 0 0 4em;
+		padding: 4rem 0 0 4rem;
 	}
 
 	.row.uniform.\32 00\25 {
-		margin: -4em 0 -1px -4em;
+		margin: -4rem 0 -1px -4rem;
 	}
 
 	.row.\31 50\25 > * {
-		padding: 0 0 0 3em;
+		padding: 0 0 0 3rem;
 	}
 
 	.row.\31 50\25 {
-		margin: 0 0 -1px -3em;
+		margin: 0 0 -1px -3rem;
 	}
 
 	.row.uniform.\31 50\25 > * {
-		padding: 3em 0 0 3em;
+		padding: 3rem 0 0 3rem;
 	}
 
 	.row.uniform.\31 50\25 {
-		margin: -3em 0 -1px -3em;
+		margin: -3rem 0 -1px -3rem;
 	}
 
 	.row.\35 0\25 > * {
-		padding: 0 0 0 1em;
+		padding: 0 0 0 1rem;
 	}
 
 	.row.\35 0\25 {
-		margin: 0 0 -1px -1em;
+		margin: 0 0 -1px -1rem;
 	}
 
 	.row.uniform.\35 0\25 > * {
-		padding: 1em 0 0 1em;
+		padding: 1rem 0 0 1rem;
 	}
 
 	.row.uniform.\35 0\25 {
-		margin: -1em 0 -1px -1em;
+		margin: -1rem 0 -1px -1rem;
 	}
 
 	.row.\32 5\25 > * {
-		padding: 0 0 0 0.5em;
+		padding: 0 0 0 0.5rem;
 	}
 
 	.row.\32 5\25 {
-		margin: 0 0 -1px -0.5em;
+		margin: 0 0 -1px -0.5rem;
 	}
 
 	.row.uniform.\32 5\25 > * {
-		padding: 0.5em 0 0 0.5em;
+		padding: 0.5rem 0 0 0.5rem;
 	}
 
 	.row.uniform.\32 5\25 {
-		margin: -0.5em 0 -1px -0.5em;
+		margin: -0.5rem 0 -1px -0.5rem;
 	}
 
 	.\31 2u, .\31 2u\24 {
@@ -502,83 +317,83 @@
 	@media screen and (max-width: 1680px) {
 
 		.row > * {
-			padding: 0 0 0 2em;
+			padding: 0 0 0 2rem;
 		}
 
 		.row {
-			margin: 0 0 -1px -2em;
+			margin: 0 0 -1px -2rem;
 		}
 
 		.row.uniform > * {
-			padding: 2em 0 0 2em;
+			padding: 2rem 0 0 2rem;
 		}
 
 		.row.uniform {
-			margin: -2em 0 -1px -2em;
+			margin: -2rem 0 -1px -2rem;
 		}
 
 		.row.\32 00\25 > * {
-			padding: 0 0 0 4em;
+			padding: 0 0 0 4rem;
 		}
 
 		.row.\32 00\25 {
-			margin: 0 0 -1px -4em;
+			margin: 0 0 -1px -4rem;
 		}
 
 		.row.uniform.\32 00\25 > * {
-			padding: 4em 0 0 4em;
+			padding: 4rem 0 0 4rem;
 		}
 
 		.row.uniform.\32 00\25 {
-			margin: -4em 0 -1px -4em;
+			margin: -4rem 0 -1px -4rem;
 		}
 
 		.row.\31 50\25 > * {
-			padding: 0 0 0 3em;
+			padding: 0 0 0 3rem;
 		}
 
 		.row.\31 50\25 {
-			margin: 0 0 -1px -3em;
+			margin: 0 0 -1px -3rem;
 		}
 
 		.row.uniform.\31 50\25 > * {
-			padding: 3em 0 0 3em;
+			padding: 3rem 0 0 3rem;
 		}
 
 		.row.uniform.\31 50\25 {
-			margin: -3em 0 -1px -3em;
+			margin: -3rem 0 -1px -3rem;
 		}
 
 		.row.\35 0\25 > * {
-			padding: 0 0 0 1em;
+			padding: 0 0 0 1rem;
 		}
 
 		.row.\35 0\25 {
-			margin: 0 0 -1px -1em;
+			margin: 0 0 -1px -1rem;
 		}
 
 		.row.uniform.\35 0\25 > * {
-			padding: 1em 0 0 1em;
+			padding: 1rem 0 0 1rem;
 		}
 
 		.row.uniform.\35 0\25 {
-			margin: -1em 0 -1px -1em;
+			margin: -1rem 0 -1px -1rem;
 		}
 
 		.row.\32 5\25 > * {
-			padding: 0 0 0 0.5em;
+			padding: 0 0 0 0.5rem;
 		}
 
 		.row.\32 5\25 {
-			margin: 0 0 -1px -0.5em;
+			margin: 0 0 -1px -0.5rem;
 		}
 
 		.row.uniform.\32 5\25 > * {
-			padding: 0.5em 0 0 0.5em;
+			padding: 0.5rem 0 0 0.5rem;
 		}
 
 		.row.uniform.\32 5\25 {
-			margin: -0.5em 0 -1px -0.5em;
+			margin: -0.5rem 0 -1px -0.5rem;
 		}
 
 		.\31 2u\28xlarge\29, .\31 2u\24\28xlarge\29 {
@@ -714,86 +529,86 @@
 
 	}
 
-	@media screen and (max-width: 1140px) {
+	@media screen and (max-width: 1280px) {
 
 		.row > * {
-			padding: 0 0 0 1.5em;
+			padding: 0 0 0 2rem;
 		}
 
 		.row {
-			margin: 0 0 -1px -1.5em;
+			margin: 0 0 -1px -2rem;
 		}
 
 		.row.uniform > * {
-			padding: 1.5em 0 0 1.5em;
+			padding: 2rem 0 0 2rem;
 		}
 
 		.row.uniform {
-			margin: -1.5em 0 -1px -1.5em;
+			margin: -2rem 0 -1px -2rem;
 		}
 
 		.row.\32 00\25 > * {
-			padding: 0 0 0 3em;
+			padding: 0 0 0 4rem;
 		}
 
 		.row.\32 00\25 {
-			margin: 0 0 -1px -3em;
+			margin: 0 0 -1px -4rem;
 		}
 
 		.row.uniform.\32 00\25 > * {
-			padding: 3em 0 0 3em;
+			padding: 4rem 0 0 4rem;
 		}
 
 		.row.uniform.\32 00\25 {
-			margin: -3em 0 -1px -3em;
+			margin: -4rem 0 -1px -4rem;
 		}
 
 		.row.\31 50\25 > * {
-			padding: 0 0 0 2.25em;
+			padding: 0 0 0 3rem;
 		}
 
 		.row.\31 50\25 {
-			margin: 0 0 -1px -2.25em;
+			margin: 0 0 -1px -3rem;
 		}
 
 		.row.uniform.\31 50\25 > * {
-			padding: 2.25em 0 0 2.25em;
+			padding: 3rem 0 0 3rem;
 		}
 
 		.row.uniform.\31 50\25 {
-			margin: -2.25em 0 -1px -2.25em;
+			margin: -3rem 0 -1px -3rem;
 		}
 
 		.row.\35 0\25 > * {
-			padding: 0 0 0 0.75em;
+			padding: 0 0 0 1rem;
 		}
 
 		.row.\35 0\25 {
-			margin: 0 0 -1px -0.75em;
+			margin: 0 0 -1px -1rem;
 		}
 
 		.row.uniform.\35 0\25 > * {
-			padding: 0.75em 0 0 0.75em;
+			padding: 1rem 0 0 1rem;
 		}
 
 		.row.uniform.\35 0\25 {
-			margin: -0.75em 0 -1px -0.75em;
+			margin: -1rem 0 -1px -1rem;
 		}
 
 		.row.\32 5\25 > * {
-			padding: 0 0 0 0.375em;
+			padding: 0 0 0 0.5rem;
 		}
 
 		.row.\32 5\25 {
-			margin: 0 0 -1px -0.375em;
+			margin: 0 0 -1px -0.5rem;
 		}
 
 		.row.uniform.\32 5\25 > * {
-			padding: 0.375em 0 0 0.375em;
+			padding: 0.5rem 0 0 0.5rem;
 		}
 
 		.row.uniform.\32 5\25 {
-			margin: -0.375em 0 -1px -0.375em;
+			margin: -0.5rem 0 -1px -0.5rem;
 		}
 
 		.\31 2u\28large\29, .\31 2u\24\28large\29 {
@@ -932,83 +747,83 @@
 	@media screen and (max-width: 980px) {
 
 		.row > * {
-			padding: 0 0 0 1.5em;
+			padding: 0 0 0 2rem;
 		}
 
 		.row {
-			margin: 0 0 -1px -1.5em;
+			margin: 0 0 -1px -2rem;
 		}
 
 		.row.uniform > * {
-			padding: 1.5em 0 0 1.5em;
+			padding: 2rem 0 0 2rem;
 		}
 
 		.row.uniform {
-			margin: -1.5em 0 -1px -1.5em;
+			margin: -2rem 0 -1px -2rem;
 		}
 
 		.row.\32 00\25 > * {
-			padding: 0 0 0 3em;
+			padding: 0 0 0 4rem;
 		}
 
 		.row.\32 00\25 {
-			margin: 0 0 -1px -3em;
+			margin: 0 0 -1px -4rem;
 		}
 
 		.row.uniform.\32 00\25 > * {
-			padding: 3em 0 0 3em;
+			padding: 4rem 0 0 4rem;
 		}
 
 		.row.uniform.\32 00\25 {
-			margin: -3em 0 -1px -3em;
+			margin: -4rem 0 -1px -4rem;
 		}
 
 		.row.\31 50\25 > * {
-			padding: 0 0 0 2.25em;
+			padding: 0 0 0 3rem;
 		}
 
 		.row.\31 50\25 {
-			margin: 0 0 -1px -2.25em;
+			margin: 0 0 -1px -3rem;
 		}
 
 		.row.uniform.\31 50\25 > * {
-			padding: 2.25em 0 0 2.25em;
+			padding: 3rem 0 0 3rem;
 		}
 
 		.row.uniform.\31 50\25 {
-			margin: -2.25em 0 -1px -2.25em;
+			margin: -3rem 0 -1px -3rem;
 		}
 
 		.row.\35 0\25 > * {
-			padding: 0 0 0 0.75em;
+			padding: 0 0 0 1rem;
 		}
 
 		.row.\35 0\25 {
-			margin: 0 0 -1px -0.75em;
+			margin: 0 0 -1px -1rem;
 		}
 
 		.row.uniform.\35 0\25 > * {
-			padding: 0.75em 0 0 0.75em;
+			padding: 1rem 0 0 1rem;
 		}
 
 		.row.uniform.\35 0\25 {
-			margin: -0.75em 0 -1px -0.75em;
+			margin: -1rem 0 -1px -1rem;
 		}
 
 		.row.\32 5\25 > * {
-			padding: 0 0 0 0.375em;
+			padding: 0 0 0 0.5rem;
 		}
 
 		.row.\32 5\25 {
-			margin: 0 0 -1px -0.375em;
+			margin: 0 0 -1px -0.5rem;
 		}
 
 		.row.uniform.\32 5\25 > * {
-			padding: 0.375em 0 0 0.375em;
+			padding: 0.5rem 0 0 0.5rem;
 		}
 
 		.row.uniform.\32 5\25 {
-			margin: -0.375em 0 -1px -0.375em;
+			margin: -0.5rem 0 -1px -0.5rem;
 		}
 
 		.\31 2u\28medium\29, .\31 2u\24\28medium\29 {
@@ -1147,83 +962,83 @@
 	@media screen and (max-width: 736px) {
 
 		.row > * {
-			padding: 0 0 0 1.5em;
+			padding: 0 0 0 2rem;
 		}
 
 		.row {
-			margin: 0 0 -1px -1.5em;
+			margin: 0 0 -1px -2rem;
 		}
 
 		.row.uniform > * {
-			padding: 1.5em 0 0 1.5em;
+			padding: 2rem 0 0 2rem;
 		}
 
 		.row.uniform {
-			margin: -1.5em 0 -1px -1.5em;
+			margin: -2rem 0 -1px -2rem;
 		}
 
 		.row.\32 00\25 > * {
-			padding: 0 0 0 3em;
+			padding: 0 0 0 4rem;
 		}
 
 		.row.\32 00\25 {
-			margin: 0 0 -1px -3em;
+			margin: 0 0 -1px -4rem;
 		}
 
 		.row.uniform.\32 00\25 > * {
-			padding: 3em 0 0 3em;
+			padding: 4rem 0 0 4rem;
 		}
 
 		.row.uniform.\32 00\25 {
-			margin: -3em 0 -1px -3em;
+			margin: -4rem 0 -1px -4rem;
 		}
 
 		.row.\31 50\25 > * {
-			padding: 0 0 0 2.25em;
+			padding: 0 0 0 3rem;
 		}
 
 		.row.\31 50\25 {
-			margin: 0 0 -1px -2.25em;
+			margin: 0 0 -1px -3rem;
 		}
 
 		.row.uniform.\31 50\25 > * {
-			padding: 2.25em 0 0 2.25em;
+			padding: 3rem 0 0 3rem;
 		}
 
 		.row.uniform.\31 50\25 {
-			margin: -2.25em 0 -1px -2.25em;
+			margin: -3rem 0 -1px -3rem;
 		}
 
 		.row.\35 0\25 > * {
-			padding: 0 0 0 0.75em;
+			padding: 0 0 0 1rem;
 		}
 
 		.row.\35 0\25 {
-			margin: 0 0 -1px -0.75em;
+			margin: 0 0 -1px -1rem;
 		}
 
 		.row.uniform.\35 0\25 > * {
-			padding: 0.75em 0 0 0.75em;
+			padding: 1rem 0 0 1rem;
 		}
 
 		.row.uniform.\35 0\25 {
-			margin: -0.75em 0 -1px -0.75em;
+			margin: -1rem 0 -1px -1rem;
 		}
 
 		.row.\32 5\25 > * {
-			padding: 0 0 0 0.375em;
+			padding: 0 0 0 0.5rem;
 		}
 
 		.row.\32 5\25 {
-			margin: 0 0 -1px -0.375em;
+			margin: 0 0 -1px -0.5rem;
 		}
 
 		.row.uniform.\32 5\25 > * {
-			padding: 0.375em 0 0 0.375em;
+			padding: 0.5rem 0 0 0.5rem;
 		}
 
 		.row.uniform.\32 5\25 {
-			margin: -0.375em 0 -1px -0.375em;
+			margin: -0.5rem 0 -1px -0.5rem;
 		}
 
 		.\31 2u\28small\29, .\31 2u\24\28small\29 {
@@ -1362,83 +1177,83 @@
 	@media screen and (max-width: 480px) {
 
 		.row > * {
-			padding: 0 0 0 1.5em;
+			padding: 0 0 0 2rem;
 		}
 
 		.row {
-			margin: 0 0 -1px -1.5em;
+			margin: 0 0 -1px -2rem;
 		}
 
 		.row.uniform > * {
-			padding: 1.5em 0 0 1.5em;
+			padding: 2rem 0 0 2rem;
 		}
 
 		.row.uniform {
-			margin: -1.5em 0 -1px -1.5em;
+			margin: -2rem 0 -1px -2rem;
 		}
 
 		.row.\32 00\25 > * {
-			padding: 0 0 0 3em;
+			padding: 0 0 0 4rem;
 		}
 
 		.row.\32 00\25 {
-			margin: 0 0 -1px -3em;
+			margin: 0 0 -1px -4rem;
 		}
 
 		.row.uniform.\32 00\25 > * {
-			padding: 3em 0 0 3em;
+			padding: 4rem 0 0 4rem;
 		}
 
 		.row.uniform.\32 00\25 {
-			margin: -3em 0 -1px -3em;
+			margin: -4rem 0 -1px -4rem;
 		}
 
 		.row.\31 50\25 > * {
-			padding: 0 0 0 2.25em;
+			padding: 0 0 0 3rem;
 		}
 
 		.row.\31 50\25 {
-			margin: 0 0 -1px -2.25em;
+			margin: 0 0 -1px -3rem;
 		}
 
 		.row.uniform.\31 50\25 > * {
-			padding: 2.25em 0 0 2.25em;
+			padding: 3rem 0 0 3rem;
 		}
 
 		.row.uniform.\31 50\25 {
-			margin: -2.25em 0 -1px -2.25em;
+			margin: -3rem 0 -1px -3rem;
 		}
 
 		.row.\35 0\25 > * {
-			padding: 0 0 0 0.75em;
+			padding: 0 0 0 1rem;
 		}
 
 		.row.\35 0\25 {
-			margin: 0 0 -1px -0.75em;
+			margin: 0 0 -1px -1rem;
 		}
 
 		.row.uniform.\35 0\25 > * {
-			padding: 0.75em 0 0 0.75em;
+			padding: 1rem 0 0 1rem;
 		}
 
 		.row.uniform.\35 0\25 {
-			margin: -0.75em 0 -1px -0.75em;
+			margin: -1rem 0 -1px -1rem;
 		}
 
 		.row.\32 5\25 > * {
-			padding: 0 0 0 0.375em;
+			padding: 0 0 0 0.5rem;
 		}
 
 		.row.\32 5\25 {
-			margin: 0 0 -1px -0.375em;
+			margin: 0 0 -1px -0.5rem;
 		}
 
 		.row.uniform.\32 5\25 > * {
-			padding: 0.375em 0 0 0.375em;
+			padding: 0.5rem 0 0 0.5rem;
 		}
 
 		.row.uniform.\32 5\25 {
-			margin: -0.375em 0 -1px -0.375em;
+			margin: -0.5rem 0 -1px -0.5rem;
 		}
 
 		.\31 2u\28xsmall\29, .\31 2u\24\28xsmall\29 {
@@ -1574,86 +1389,86 @@
 
 	}
 
-	@media screen and (max-width: 320px) {
+	@media screen and (max-width: 360px) {
 
 		.row > * {
-			padding: 0 0 0 1.5em;
+			padding: 0 0 0 2rem;
 		}
 
 		.row {
-			margin: 0 0 -1px -1.5em;
+			margin: 0 0 -1px -2rem;
 		}
 
 		.row.uniform > * {
-			padding: 1.5em 0 0 1.5em;
+			padding: 2rem 0 0 2rem;
 		}
 
 		.row.uniform {
-			margin: -1.5em 0 -1px -1.5em;
+			margin: -2rem 0 -1px -2rem;
 		}
 
 		.row.\32 00\25 > * {
-			padding: 0 0 0 3em;
+			padding: 0 0 0 4rem;
 		}
 
 		.row.\32 00\25 {
-			margin: 0 0 -1px -3em;
+			margin: 0 0 -1px -4rem;
 		}
 
 		.row.uniform.\32 00\25 > * {
-			padding: 3em 0 0 3em;
+			padding: 4rem 0 0 4rem;
 		}
 
 		.row.uniform.\32 00\25 {
-			margin: -3em 0 -1px -3em;
+			margin: -4rem 0 -1px -4rem;
 		}
 
 		.row.\31 50\25 > * {
-			padding: 0 0 0 2.25em;
+			padding: 0 0 0 3rem;
 		}
 
 		.row.\31 50\25 {
-			margin: 0 0 -1px -2.25em;
+			margin: 0 0 -1px -3rem;
 		}
 
 		.row.uniform.\31 50\25 > * {
-			padding: 2.25em 0 0 2.25em;
+			padding: 3rem 0 0 3rem;
 		}
 
 		.row.uniform.\31 50\25 {
-			margin: -2.25em 0 -1px -2.25em;
+			margin: -3rem 0 -1px -3rem;
 		}
 
 		.row.\35 0\25 > * {
-			padding: 0 0 0 0.75em;
+			padding: 0 0 0 1rem;
 		}
 
 		.row.\35 0\25 {
-			margin: 0 0 -1px -0.75em;
+			margin: 0 0 -1px -1rem;
 		}
 
 		.row.uniform.\35 0\25 > * {
-			padding: 0.75em 0 0 0.75em;
+			padding: 1rem 0 0 1rem;
 		}
 
 		.row.uniform.\35 0\25 {
-			margin: -0.75em 0 -1px -0.75em;
+			margin: -1rem 0 -1px -1rem;
 		}
 
 		.row.\32 5\25 > * {
-			padding: 0 0 0 0.375em;
+			padding: 0 0 0 0.5rem;
 		}
 
 		.row.\32 5\25 {
-			margin: 0 0 -1px -0.375em;
+			margin: 0 0 -1px -0.5rem;
 		}
 
 		.row.uniform.\32 5\25 > * {
-			padding: 0.375em 0 0 0.375em;
+			padding: 0.5rem 0 0 0.5rem;
 		}
 
 		.row.uniform.\32 5\25 {
-			margin: -0.375em 0 -1px -0.375em;
+			margin: -0.5rem 0 -1px -0.5rem;
 		}
 
 		.\31 2u\28xxsmall\29, .\31 2u\24\28xxsmall\29 {
@@ -1791,8 +1606,24 @@
 
 /* Basic */
 
+	@-ms-viewport {
+		width: device-width;
+	}
+
+	body {
+		-ms-overflow-style: scrollbar;
+	}
+
+	@media screen and (max-width: 480px) {
+
+		html, body {
+			min-width: 320px;
+		}
+
+	}
+
 	body {
-		background: #fff;
+		background: #ffffff;
 	}
 
 		body.is-loading *, body.is-loading *:before, body.is-loading *:after {
@@ -1806,31 +1637,69 @@
 			transition: none !important;
 		}
 
+/* Type */
+
+	html {
+		font-size: 18pt;
+	}
+
+		@media screen and (max-width: 1680px) {
+
+			html {
+				font-size: 14pt;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			html {
+				font-size: 12pt;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			html {
+				font-size: 11pt;
+			}
+
+		}
+
+		@media screen and (max-width: 360px) {
+
+			html {
+				font-size: 10pt;
+			}
+
+		}
+
+	body {
+		background-color: #ffffff;
+		color: #000000;
+	}
+
 	body, input, select, textarea {
-		color: #666;
 		font-family: "Source Sans Pro", Helvetica, sans-serif;
-		font-size: 16pt;
+		font-size: 1rem;
 		font-weight: 300;
-		line-height: 1.65em;
+		line-height: 1.65;
 	}
 
 	a {
-		-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
-		-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
-		-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
-		transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
-		border-bottom: dotted 1px #666;
-		color: inherit;
-		text-decoration: none;
+		-moz-transition: color 0.2s ease-in-out;
+		-webkit-transition: color 0.2s ease-in-out;
+		-ms-transition: color 0.2s ease-in-out;
+		transition: color 0.2s ease-in-out;
+		text-decoration: underline;
 	}
 
 		a:hover {
-			border-bottom-color: transparent !important;
-			color: #6bd4c8;
+			text-decoration: none;
 		}
 
 	strong, b {
-		color: #555;
 		font-weight: 400;
 	}
 
@@ -1839,13 +1708,18 @@
 	}
 
 	p {
-		margin: 0 0 2em 0;
+		margin: 0 0 2rem 0;
 	}
 
+		p.major {
+			font-size: 1.25rem;
+		}
+
 	h1, h2, h3, h4, h5, h6 {
-		color: #555;
-		line-height: 1em;
-		margin: 0 0 1em 0;
+		font-weight: 300;
+		line-height: 1.375;
+		letter-spacing: -0.05em;
+		margin: 0 0 1rem 0;
 	}
 
 		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
@@ -1854,88 +1728,81 @@
 		}
 
 	h1 {
-		font-size: 2.25em;
-		line-height: 1.35em;
+		font-size: 3.5rem;
+		line-height: 1.2;
 	}
 
 	h2 {
-		font-size: 2em;
-		line-height: 1.35em;
+		font-size: 2.25rem;
 	}
 
 	h3 {
-		font-size: 1.35em;
-		line-height: 1.5em;
+		font-size: 1.5rem;
 	}
 
 	h4 {
-		font-size: 1.25em;
-		line-height: 1.5em;
+		font-size: 1.1rem;
 	}
 
 	h5 {
-		font-size: 0.9em;
-		line-height: 1.5em;
+		font-size: 0.9rem;
 	}
 
 	h6 {
-		font-size: 0.7em;
-		line-height: 1.5em;
+		font-size: 0.7rem;
 	}
 
 	sub {
-		font-size: 0.8em;
+		font-size: 0.8rem;
 		position: relative;
-		top: 0.5em;
+		top: 0.5rem;
 	}
 
 	sup {
-		font-size: 0.8em;
+		font-size: 0.8rem;
 		position: relative;
-		top: -0.5em;
+		top: -0.5rem;
 	}
 
-	hr {
-		border: 0;
-		border-bottom: solid 1px rgba(144, 144, 144, 0.5);
-		margin: 2em 0;
-	}
-
-		hr.major {
-			margin: 3em 0;
-		}
-
 	blockquote {
-		border-left: solid 4px rgba(144, 144, 144, 0.5);
+		border-left: solid 4px;
 		font-style: italic;
-		margin: 0 0 2em 0;
-		padding: 0.5em 0 0.5em 2em;
+		margin: 0 0 2rem 0;
+		padding: 0.5rem 0 0.5rem 2rem;
 	}
 
 	code {
-		background: rgba(144, 144, 144, 0.075);
 		border-radius: 4px;
-		border: solid 1px rgba(144, 144, 144, 0.5);
 		font-family: "Courier New", monospace;
 		font-size: 0.9em;
-		margin: 0 0.25em;
-		padding: 0.25em 0.65em;
+		margin: 0 0.25rem;
+		padding: 0.25rem 0.325rem;
 	}
 
 	pre {
 		-webkit-overflow-scrolling: touch;
 		font-family: "Courier New", monospace;
 		font-size: 0.9em;
-		margin: 0 0 2em 0;
+		margin: 0 0 2rem 0;
 	}
 
 		pre code {
 			display: block;
-			line-height: 1.75em;
-			padding: 1em 1.5em;
+			line-height: 1.5;
+			padding: 0.75rem 1rem;
 			overflow-x: auto;
 		}
 
+	hr {
+		border: 0;
+		border-bottom: solid 1px;
+		margin: 2.5rem 0;
+	}
+
+		hr.major {
+			margin: 3.5rem 0;
+		}
+
 	.align-left {
 		text-align: left;
 	}
@@ -1948,116 +1815,369 @@
 		text-align: right;
 	}
 
-/* Section/Article */
+	@media screen and (max-width: 736px) {
 
-	section.special, article.special {
-		text-align: center;
-	}
+		p.major {
+			font-size: 1.1rem;
+		}
 
-	header p {
-		color: #999;
-		margin: 0 0 1.5em 0;
-		position: relative;
-	}
+		h1 {
+			font-size: 2.5rem;
+		}
 
-	header h2 + p {
-		font-size: 1.25em;
-		line-height: 1.5em;
-		margin-top: -1em;
-	}
+		h2 {
+			font-size: 2rem;
+		}
 
-	header h3 + p {
-		font-size: 1.1em;
-		line-height: 1.5em;
-		margin-top: -0.8em;
-	}
+		h3 {
+			font-size: 1.25rem;
+		}
+
+		h4 {
+			font-size: 1rem;
+		}
 
-	header h4 + p,
-	header h5 + p,
-	header h6 + p {
-		font-size: 0.9em;
-		line-height: 1.5em;
-		margin-top: -0.6em;
 	}
 
-	header.major {
-		margin: 0 0 1em 0;
+	input, select, textarea {
+		color: #000000;
 	}
 
-		header.major:after {
-			background: rgba(144, 144, 144, 0.5);
-			content: '';
-			display: inline-block;
-			height: 1px;
-			margin-top: 1.5em;
-			width: 6em;
-		}
+	a {
+		color: #000000;
+	}
 
-		header.major h2, header.major h3, header.major h4, header.major h5, header.major h6 {
-			margin: 0;
+		a:hover {
+			color: #47D3E5;
 		}
 
-		header.major p {
-			margin: 0.7em 0 0 0;
-		}
+	strong, b {
+		color: #000000;
+	}
 
-	header.special {
-		text-align: center;
+	h1, h2, h3, h4, h5, h6 {
+		color: #000000;
 	}
 
-/* Form */
+	blockquote {
+		border-left-color: rgba(0, 0, 0, 0.2);
+	}
 
-	form {
-		margin: 0 0 2em 0;
+	code {
+		background: rgba(0, 0, 0, 0.05);
+		border-color: rgba(0, 0, 0, 0.2);
 	}
 
-	label {
-		color: #555;
-		display: block;
-		font-size: 0.9em;
-		font-weight: 400;
-		margin: 0 0 1em 0;
+	hr {
+		border-bottom-color: rgba(0, 0, 0, 0.2);
 	}
 
-	input[type="text"],
-	input[type="password"],
-	input[type="email"],
-	select,
-	textarea {
-		-moz-appearance: none;
-		-webkit-appearance: none;
-		-ms-appearance: none;
-		appearance: none;
-		background: rgba(144, 144, 144, 0.075);
+/* Box */
+
+	.box {
 		border-radius: 4px;
-		border: none;
-		border: solid 1px rgba(144, 144, 144, 0.5);
-		color: inherit;
-		display: block;
-		outline: 0;
-		padding: 0 1em;
-		text-decoration: none;
-		width: 100%;
+		border: solid 1px;
+		margin-bottom: 2rem;
+		padding: 1.5rem;
 	}
 
-		input[type="text"]:invalid,
-		input[type="password"]:invalid,
-		input[type="email"]:invalid,
-		select:invalid,
-		textarea:invalid {
-			box-shadow: none;
+		.box > :last-child,
+		.box > :last-child > :last-child,
+		.box > :last-child > :last-child > :last-child {
+			margin-bottom: 0;
 		}
 
-		input[type="text"]:focus,
-		input[type="password"]:focus,
-		input[type="email"]:focus,
-		select:focus,
-		textarea:focus {
-			border-color: #6bd4c8;
+		.box.alt {
+			border: 0;
+			border-radius: 0;
+			padding: 0;
 		}
 
-	.select-wrapper {
-		text-decoration: none;
+	.box {
+		border-color: rgba(0, 0, 0, 0.2);
+	}
+
+/* Button */
+
+	input[type="submit"],
+	input[type="reset"],
+	input[type="button"],
+	button,
+	.button {
+		-moz-appearance: none;
+		-webkit-appearance: none;
+		-ms-appearance: none;
+		appearance: none;
+		-moz-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		-webkit-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		-ms-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		border: 0;
+		cursor: pointer;
+		display: inline-block;
+		font-weight: 400;
+		letter-spacing: 0.125em;
+		text-align: center;
+		text-decoration: none;
+		text-transform: uppercase;
+		white-space: nowrap;
+		font-size: 0.75rem;
+		max-width: 20rem;
+		height: 3.75em;
+		line-height: 3.75em;
+		border-radius: 3.75em;
+		padding: 0 2.5em;
+		text-overflow: ellipsis;
+		overflow: hidden;
+	}
+
+		input[type="submit"].icon:before,
+		input[type="reset"].icon:before,
+		input[type="button"].icon:before,
+		button.icon:before,
+		.button.icon:before {
+			margin-right: 0.5rem;
+		}
+
+		input[type="submit"].fit,
+		input[type="reset"].fit,
+		input[type="button"].fit,
+		button.fit,
+		.button.fit {
+			display: block;
+			margin: 0 0 1rem 0;
+			width: 100%;
+		}
+
+		input[type="submit"].small,
+		input[type="reset"].small,
+		input[type="button"].small,
+		button.small,
+		.button.small {
+			font-size: 0.6rem;
+			height: 3.325em;
+			line-height: 3.325em;
+			border-radius: 3.325em;
+			padding: 0 2em;
+		}
+
+		input[type="submit"].big,
+		input[type="reset"].big,
+		input[type="button"].big,
+		button.big,
+		.button.big {
+			font-size: 0.8rem;
+			height: 4em;
+			line-height: 4em;
+			border-radius: 4em;
+			padding: 0 3em;
+		}
+
+		input[type="submit"].wide,
+		input[type="reset"].wide,
+		input[type="button"].wide,
+		button.wide,
+		.button.wide {
+			min-width: 14em;
+		}
+
+		input[type="submit"].disabled, input[type="submit"]:disabled,
+		input[type="reset"].disabled,
+		input[type="reset"]:disabled,
+		input[type="button"].disabled,
+		input[type="button"]:disabled,
+		button.disabled,
+		button:disabled,
+		.button.disabled,
+		.button:disabled {
+			-moz-pointer-events: none;
+			-webkit-pointer-events: none;
+			-ms-pointer-events: none;
+			pointer-events: none;
+			opacity: 0.25;
+		}
+
+	input[type="submit"],
+	input[type="reset"],
+	input[type="button"],
+	button,
+	.button {
+		background-color: transparent;
+		box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
+		color: #000000 !important;
+	}
+
+		input[type="submit"]:hover,
+		input[type="reset"]:hover,
+		input[type="button"]:hover,
+		button:hover,
+		.button:hover {
+			box-shadow: inset 0 0 0 1px #47D3E5;
+			color: #47D3E5 !important;
+		}
+
+		input[type="submit"]:active,
+		input[type="reset"]:active,
+		input[type="button"]:active,
+		button:active,
+		.button:active {
+			background-color: rgba(71, 211, 229, 0.2);
+			box-shadow: inset 0 0 0 1px #47D3E5;
+			color: #47D3E5 !important;
+		}
+
+		input[type="submit"].special,
+		input[type="reset"].special,
+		input[type="button"].special,
+		button.special,
+		.button.special {
+			background-color: #000000;
+			box-shadow: none;
+			color: #ffffff !important;
+		}
+
+			input[type="submit"].special:hover,
+			input[type="reset"].special:hover,
+			input[type="button"].special:hover,
+			button.special:hover,
+			.button.special:hover {
+				background-color: #47D3E5;
+			}
+
+			input[type="submit"].special:active,
+			input[type="reset"].special:active,
+			input[type="button"].special:active,
+			button.special:active,
+			.button.special:active {
+				background-color: #1ebdd1;
+			}
+
+/* Form */
+
+	form {
+		margin: 0 0 2rem 0;
+	}
+
+		form .field {
+			margin: 0 0 1.5rem 0;
+			clear: both;
+		}
+
+			form .field.half {
+				clear: none;
+				width: 50%;
+				float: left;
+				padding: 0 0 0 0.75rem;
+			}
+
+				form .field.half.first {
+					padding: 0 0.75rem 0 0;
+				}
+
+			form .field.third {
+				clear: none;
+				width: 33.33333%;
+				float: left;
+				padding: 0 0 0 0.75rem;
+			}
+
+				form .field.third.first {
+					padding: 0 0.75rem 0 0;
+				}
+
+		form > .actions {
+			clear: both;
+			margin: 1.875rem 0 0 0 !important;
+		}
+
+		@media screen and (max-width: 736px) {
+
+			form .field {
+				margin: 0 0 1.125rem 0;
+			}
+
+				form .field.half {
+					padding: 0 0 0 0.5625rem;
+				}
+
+					form .field.half.first {
+						padding: 0 0.5625rem 0 0;
+					}
+
+			form > .actions {
+				margin: 1.5rem 0 0 0 !important;
+			}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			form .field.half {
+				width: 100%;
+				float: none;
+				padding: 0;
+			}
+
+				form .field.half.first {
+					padding: 0;
+				}
+
+			form .field.third {
+				width: 100%;
+				float: none;
+				padding: 0;
+			}
+
+				form .field.third.first {
+					padding: 0;
+				}
+
+		}
+
+	label {
+		display: block;
+		font-size: 0.9rem;
+		font-weight: 400;
+		margin: 0 0 1rem 0;
+	}
+
+	input[type="text"],
+	input[type="password"],
+	input[type="email"],
+	input[type="tel"],
+	input[type="search"],
+	input[type="url"],
+	select,
+	textarea {
+		-moz-appearance: none;
+		-webkit-appearance: none;
+		-ms-appearance: none;
+		appearance: none;
+		background-color: transparent;
+		border-radius: 4px;
+		border: none;
+		border: solid 1px;
+		color: inherit;
+		display: block;
+		outline: 0;
+		padding: 0 0.825rem;
+		text-decoration: none;
+		width: 100%;
+	}
+
+		input[type="text"]:invalid,
+		input[type="password"]:invalid,
+		input[type="email"]:invalid,
+		input[type="tel"]:invalid,
+		input[type="search"]:invalid,
+		input[type="url"]:invalid,
+		select:invalid,
+		textarea:invalid {
+			box-shadow: none;
+		}
+
+	.select-wrapper {
+		text-decoration: none;
 		display: block;
 		position: relative;
 	}
@@ -2072,17 +2192,16 @@
 		}
 
 		.select-wrapper:before {
-			color: rgba(144, 144, 144, 0.5);
 			content: '\f078';
 			display: block;
-			height: 2.75em;
-			line-height: 2.75em;
+			height: 2.75rem;
+			line-height: 2.75rem;
 			pointer-events: none;
 			position: absolute;
 			right: 0;
 			text-align: center;
 			top: 0;
-			width: 2.75em;
+			width: 2.75rem;
 		}
 
 		.select-wrapper select::-ms-expand {
@@ -2092,12 +2211,15 @@
 	input[type="text"],
 	input[type="password"],
 	input[type="email"],
+	input[type="tel"],
+	input[type="search"],
+	input[type="url"],
 	select {
-		height: 2.75em;
+		height: 2.75rem;
 	}
 
 	textarea {
-		padding: 0.75em 1em;
+		padding: 0.75rem 1rem;
 	}
 
 	input[type="checkbox"],
@@ -2108,23 +2230,27 @@
 		appearance: none;
 		display: block;
 		float: left;
-		margin-right: -2em;
+		margin-right: -2rem;
 		opacity: 0;
-		width: 1em;
+		width: 1rem;
 		z-index: -1;
 	}
 
 		input[type="checkbox"] + label,
 		input[type="radio"] + label {
 			text-decoration: none;
-			color: #666;
+			-moz-user-select: none;
+			-webkit-user-select: none;
+			-ms-user-select: none;
+			user-select: none;
 			cursor: pointer;
 			display: inline-block;
-			font-size: 1em;
+			font-size: 1rem;
 			font-weight: 300;
-			padding-left: 2.4em;
-			padding-right: 0.75em;
+			padding-left: 2.4rem;
+			padding-right: 0.75rem;
 			position: relative;
+			margin-bottom: 0;
 		}
 
 			input[type="checkbox"] + label:before,
@@ -2139,33 +2265,24 @@
 
 			input[type="checkbox"] + label:before,
 			input[type="radio"] + label:before {
-				background: rgba(144, 144, 144, 0.075);
 				border-radius: 4px;
-				border: solid 1px rgba(144, 144, 144, 0.5);
+				border: solid 1px;
 				content: '';
 				display: inline-block;
-				height: 1.65em;
+				height: 1.65rem;
 				left: 0;
-				line-height: 1.58125em;
+				line-height: 1.58125rem;
 				position: absolute;
 				text-align: center;
 				top: 0;
-				width: 1.65em;
+				width: 1.65rem;
 			}
 
 		input[type="checkbox"]:checked + label:before,
 		input[type="radio"]:checked + label:before {
-			background: #666666;
-			border-color: #666666;
-			color: #ffffff;
 			content: '\f00c';
 		}
 
-		input[type="checkbox"]:focus + label:before,
-		input[type="radio"]:focus + label:before {
-			border-color: #6bd4c8;
-		}
-
 	input[type="checkbox"] + label:before {
 		border-radius: 4px;
 	}
@@ -2175,57 +2292,106 @@
 	}
 
 	::-webkit-input-placeholder {
-		color: #999 !important;
 		opacity: 1.0;
 	}
 
 	:-moz-placeholder {
-		color: #999 !important;
 		opacity: 1.0;
 	}
 
 	::-moz-placeholder {
-		color: #999 !important;
 		opacity: 1.0;
 	}
 
 	:-ms-input-placeholder {
-		color: #999 !important;
 		opacity: 1.0;
 	}
 
 	.formerize-placeholder {
-		color: #999 !important;
 		opacity: 1.0;
 	}
 
-/* Box */
+	label {
+		color: #000000;
+	}
 
-	.box {
-		border-radius: 4px;
-		border: solid 1px rgba(144, 144, 144, 0.5);
-		margin-bottom: 2em;
-		padding: 1.5em;
+	input[type="text"],
+	input[type="password"],
+	input[type="email"],
+	input[type="tel"],
+	input[type="search"],
+	input[type="url"],
+	select,
+	textarea {
+		border-color: rgba(0, 0, 0, 0.2);
 	}
 
-		.box > :last-child,
-		.box > :last-child > :last-child,
-		.box > :last-child > :last-child > :last-child {
-			margin-bottom: 0;
+		input[type="text"]:focus,
+		input[type="password"]:focus,
+		input[type="email"]:focus,
+		input[type="tel"]:focus,
+		input[type="search"]:focus,
+		input[type="url"]:focus,
+		select:focus,
+		textarea:focus {
+			border-color: #47D3E5;
+			box-shadow: 0 0 0 1px #47D3E5;
 		}
 
-		.box.alt {
-			border: 0;
-			border-radius: 0;
-			padding: 0;
+	.select-wrapper:before {
+		color: rgba(0, 0, 0, 0.2);
+	}
+
+	input[type="checkbox"] + label,
+	input[type="radio"] + label {
+		color: #000000;
+	}
+
+		input[type="checkbox"] + label:before,
+		input[type="radio"] + label:before {
+			border-color: rgba(0, 0, 0, 0.2);
 		}
 
+	input[type="checkbox"]:checked + label:before,
+	input[type="radio"]:checked + label:before {
+		background-color: #000000;
+		border-color: #000000;
+		color: #ffffff;
+	}
+
+	input[type="checkbox"]:focus + label:before,
+	input[type="radio"]:focus + label:before {
+		border-color: #47D3E5;
+		box-shadow: 0 0 0 1px #47D3E5;
+	}
+
+	::-webkit-input-placeholder {
+		color: rgba(0, 0, 0, 0.75) !important;
+	}
+
+	:-moz-placeholder {
+		color: rgba(0, 0, 0, 0.75) !important;
+	}
+
+	::-moz-placeholder {
+		color: rgba(0, 0, 0, 0.75) !important;
+	}
+
+	:-ms-input-placeholder {
+		color: rgba(0, 0, 0, 0.75) !important;
+	}
+
+	.formerize-placeholder {
+		color: rgba(0, 0, 0, 0.75) !important;
+	}
+
 /* Icon */
 
 	.icon {
 		text-decoration: none;
 		border-bottom: none;
 		position: relative;
+		text-align: center;
 	}
 
 		.icon:before {
@@ -2241,93 +2407,97 @@
 			display: none;
 		}
 
-		.icon.style1:before {
-			color: #c3e895;
-		}
-
 		.icon.style2:before {
-			color: #8addaa;
+			border-radius: 2.75em;
+			display: inline-block;
+			height: 2.75em;
+			line-height: 2.75em;
+			width: 2.75em;
 		}
 
-		.icon.style3:before {
-			color: #6bd4c8;
+		.icon.major {
+			display: block;
+			margin: 0 0 1rem 0;
 		}
 
-		.icon.style4:before {
-			color: #57aed3;
-		}
+			.icon.major:before {
+				font-size: 1.25rem;
+			}
 
-		.icon.style5:before {
-			color: #4a87d3;
-		}
-
-		.icon.style6:before {
-			color: #6b88e6;
-		}
+	a.icon.style2:before {
+		-moz-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		-webkit-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		-ms-transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+		transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
+	}
 
-		.icon.major {
-			text-decoration: none;
-			color: #555;
-			cursor: default;
-			display: inline-block;
-			margin: 0 0 1.5em 0;
-		}
+	.icon.style2:before {
+		box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
+	}
 
-			.icon.major:before {
-				-moz-osx-font-smoothing: grayscale;
-				-webkit-font-smoothing: antialiased;
-				font-family: FontAwesome;
-				font-style: normal;
-				font-weight: normal;
-				text-transform: none !important;
-			}
+	a.icon.style2:hover:before {
+		box-shadow: inset 0 0 0 1px #47D3E5;
+		color: #47D3E5;
+	}
 
-			.icon.major:before {
-				font-size: 4em;
-				line-height: 1em;
-			}
+	a.icon.style2:active:before {
+		background-color: rgba(71, 211, 229, 0.1);
+		box-shadow: inset 0 0 0 1px #47D3E5;
+		color: #47D3E5;
+	}
 
 /* Image */
 
 	.image {
-		border-radius: 4px;
 		border: 0;
+		border-radius: 4px;
 		display: inline-block;
 		position: relative;
 	}
 
 		.image img {
-			border-radius: 4px;
 			display: block;
+			border-radius: 4px;
+		}
+
+		.image.left, .image.right {
+			width: 40%;
+			max-width: 10rem;
 		}
 
+			.image.left img, .image.right img {
+				width: 100%;
+			}
+
 		.image.left {
 			float: left;
-			padding: 0 1.5em 1em 0;
-			top: 0.25em;
+			margin: 0 1.5rem 1rem 0;
+			top: 0.25rem;
 		}
 
 		.image.right {
 			float: right;
-			padding: 0 0 1em 1.5em;
-			top: 0.25em;
+			margin: 0 0 1rem 1.5rem;
+			top: 0.25rem;
 		}
 
-		.image.left, .image.right {
-			max-width: 40%;
+		.image.fit {
+			display: block;
+			margin: 0 0 2rem 0;
+			width: 100%;
 		}
 
-			.image.left img, .image.right img {
+			.image.fit img {
 				width: 100%;
 			}
 
-		.image.fit {
+		.image.main {
 			display: block;
-			margin: 0 0 2em 0;
+			margin: 0 0 3rem 0;
 			width: 100%;
 		}
 
-			.image.fit img {
+			.image.main img {
 				width: 100%;
 			}
 
@@ -2335,22 +2505,22 @@
 
 	ol {
 		list-style: decimal;
-		margin: 0 0 2em 0;
-		padding-left: 1.25em;
+		margin: 0 0 2rem 0;
+		padding-left: 1.25rem;
 	}
 
 		ol li {
-			padding-left: 0.25em;
+			padding-left: 0.25rem;
 		}
 
 	ul {
 		list-style: disc;
-		margin: 0 0 2em 0;
-		padding-left: 1em;
+		margin: 0 0 2rem 0;
+		padding-left: 1rem;
 	}
 
 		ul li {
-			padding-left: 0.5em;
+			padding-left: 0.5rem;
 		}
 
 		ul.alt {
@@ -2359,8 +2529,8 @@
 		}
 
 			ul.alt li {
-				border-top: solid 1px rgba(144, 144, 144, 0.5);
-				padding: 0.5em 0;
+				border-top: solid 1px;
+				padding: 0.5rem 0;
 			}
 
 				ul.alt li:first-child {
@@ -2376,52 +2546,13 @@
 
 			ul.icons li {
 				display: inline-block;
-				padding: 0 1.25em 0 0;
+				padding: 0 0.75rem 0 0;
 			}
 
 				ul.icons li:last-child {
 					padding-right: 0;
 				}
 
-				ul.icons li .icon:before {
-					font-size: 1.5em;
-				}
-
-		ul.major-icons {
-			list-style: none;
-			padding-left: 0;
-		}
-
-			ul.major-icons li {
-				display: inline-block;
-				padding: 2.5em;
-				text-align: center;
-			}
-
-				ul.major-icons li .icon {
-					-moz-transform: rotate(45deg);
-					-webkit-transform: rotate(45deg);
-					-ms-transform: rotate(45deg);
-					transform: rotate(45deg);
-					border-radius: 4px;
-					border: solid 1px rgba(144, 144, 144, 0.5);
-					display: inline-block;
-					height: 8em;
-					line-height: 8em;
-					margin: 0;
-					text-align: center;
-					width: 8em;
-				}
-
-					ul.major-icons li .icon:before {
-						-moz-transform: rotate(-45deg);
-						-webkit-transform: rotate(-45deg);
-						-ms-transform: rotate(-45deg);
-						transform: rotate(-45deg);
-						display: inline-block;
-						line-height: inherit;
-					}
-
 		ul.actions {
 			cursor: default;
 			list-style: none;
@@ -2430,7 +2561,7 @@
 
 			ul.actions li {
 				display: inline-block;
-				padding: 0 1em 0 0;
+				padding: 0 1rem 0 0;
 				vertical-align: middle;
 			}
 
@@ -2439,12 +2570,12 @@
 				}
 
 			ul.actions.small li {
-				padding: 0 0.5em 0 0;
+				padding: 0 0.5rem 0 0;
 			}
 
 			ul.actions.vertical li {
 				display: block;
-				padding: 1em 0 0 0;
+				padding: 1rem 0 0 0;
 			}
 
 				ul.actions.vertical li:first-child {
@@ -2456,28 +2587,24 @@
 				}
 
 			ul.actions.vertical.small li {
-				padding: 0.5em 0 0 0;
+				padding: 0.5rem 0 0 0;
 			}
 
 				ul.actions.vertical.small li:first-child {
 					padding-top: 0;
 				}
 
-			ul.actions.uniform li > * {
-				min-width: 12em;
-			}
-
 			ul.actions.fit {
 				display: table;
-				margin-left: -1em;
+				margin-left: -1rem;
 				padding: 0;
 				table-layout: fixed;
-				width: calc(100% + 1em);
+				width: calc(100% + 1rem);
 			}
 
 				ul.actions.fit li {
 					display: table-cell;
-					padding: 0 0 0 1em;
+					padding: 0 0 0 1rem;
 				}
 
 					ul.actions.fit li > * {
@@ -2485,57 +2612,158 @@
 					}
 
 				ul.actions.fit.small {
-					margin-left: -0.5em;
-					width: calc(100% + 0.5em);
+					margin-left: -0.5rem;
+					width: calc(100% + 0.5rem);
 				}
 
 					ul.actions.fit.small li {
-						padding: 0 0 0 0.5em;
+						padding: 0 0 0 0.5rem;
+					}
+
+			@media screen and (max-width: 480px) {
+
+				ul.actions {
+					margin: 0 0 2rem 0;
+				}
+
+					ul.actions li {
+						padding: 1rem 0 0 0;
+						display: block;
+						text-align: center;
+						width: 100%;
+					}
+
+						ul.actions li:first-child {
+							padding-top: 0;
+						}
+
+						ul.actions li > * {
+							width: 100%;
+							margin: 0 !important;
+						}
+
+							ul.actions li > *.icon:before {
+								margin-left: -2rem;
+							}
+
+					ul.actions.small li {
+						padding: 0.5rem 0 0 0;
 					}
 
+						ul.actions.small li:first-child {
+							padding-top: 0;
+						}
+
+			}
+
 	dl {
-		margin: 0 0 2em 0;
+		margin: 0 0 2rem 0;
+	}
+
+		dl dt {
+			display: block;
+			font-weight: 400;
+			margin: 0 0 1rem 0;
+		}
+
+		dl dd {
+			margin-left: 2rem;
+		}
+
+		dl.style2 dt {
+			width: 25%;
+			float: left;
+		}
+
+		dl.style2 dd {
+			width: 70%;
+			float: left;
+		}
+
+		dl.style2:after {
+			content: '';
+			display: block;
+			clear: both;
+		}
+
+	ul.alt li {
+		border-top-color: rgba(0, 0, 0, 0.2);
+	}
+
+/* Section/Article */
+
+	section.special, article.special {
+		text-align: center;
+	}
+
+	header p {
+		position: relative;
+		margin: -0.65rem 0 1.5rem 0;
+		font-style: italic;
+	}
+
+	header h1 + p {
+		font-size: 1.375rem;
+	}
+
+	header h2 + p {
+		font-size: 1.25rem;
+	}
+
+	header h3 + p {
+		font-size: 1.1rem;
+	}
+
+	header h4 + p,
+	header h5 + p,
+	header h6 + p {
+		font-size: 0.9rem;
+	}
+
+	header p {
+		color: rgba(0, 0, 0, 0.75);
 	}
 
 /* Table */
 
 	.table-wrapper {
 		-webkit-overflow-scrolling: touch;
+		margin: 0 0 2rem 0;
 		overflow-x: auto;
 	}
 
+		.table-wrapper > table {
+			margin-bottom: 0;
+		}
+
 	table {
-		margin: 0 0 2em 0;
+		margin: 0 0 2rem 0;
 		width: 100%;
 	}
 
 		table tbody tr {
+			border: solid 1px;
 			border-left: 0;
 			border-right: 0;
 		}
 
-			table tbody tr:nth-child(2n + 1) {
-				background-color: rgba(144, 144, 144, 0.075);
-			}
-
 		table td {
-			padding: 0.75em 0.75em;
+			padding: 0.75rem 0.75rem;
 		}
 
 		table th {
-			color: #555;
-			font-size: 0.9em;
+			font-size: 0.9rem;
 			font-weight: 400;
-			padding: 0 0.75em 0.75em 0.75em;
+			padding: 0 0.75rem 0.75rem 0.75rem;
 			text-align: left;
 		}
 
 		table thead {
-			border-bottom: solid 1px rgba(144, 144, 144, 0.5);
+			border-bottom: solid 2px;
 		}
 
 		table tfoot {
-			border-top: solid 1px rgba(144, 144, 144, 0.5);
+			border-top: solid 2px;
 		}
 
 		table.alt {
@@ -2543,7 +2771,7 @@
 		}
 
 			table.alt tbody tr td {
-				border: solid 1px rgba(144, 144, 144, 0.5);
+				border: solid 1px;
 				border-left-width: 0;
 				border-top-width: 0;
 			}
@@ -2564,858 +2792,5625 @@
 				border-top: 0;
 			}
 
-/* Button */
+		table.fixed {
+			table-layout: fixed;
+		}
 
-	input[type="submit"],
-	input[type="reset"],
-	input[type="button"],
-	button,
-	.button {
-		-moz-appearance: none;
-		-webkit-appearance: none;
-		-ms-appearance: none;
-		appearance: none;
-		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
-		background-color: transparent;
-		border-radius: 4px;
-		border: 0;
-		box-shadow: inset 0 0 0 1px rgba(144, 144, 144, 0.5);
-		color: #555 !important;
-		cursor: pointer;
-		display: inline-block;
-		font-size: 0.9em;
-		font-weight: 400;
-		height: 2.75em;
-		letter-spacing: 0.125em;
-		line-height: 2.75em;
-		padding: 0 2em;
-		text-align: center;
-		text-decoration: none;
-		text-indent: 0.125em;
-		text-transform: uppercase;
-		white-space: nowrap;
+	table tbody tr {
+		border-color: rgba(0, 0, 0, 0.2);
 	}
 
-		input[type="submit"]:hover,
-		input[type="reset"]:hover,
-		input[type="button"]:hover,
-		button:hover,
-		.button:hover {
-			background-color: rgba(144, 144, 144, 0.075);
+		table tbody tr:nth-child(2n + 1) {
+			background-color: rgba(0, 0, 0, 0.05);
 		}
 
-		input[type="submit"]:active,
-		input[type="reset"]:active,
-		input[type="button"]:active,
-		button:active,
-		.button:active {
-			background-color: rgba(144, 144, 144, 0.2);
+		table tbody tr.alt {
+			background-color: rgba(0, 0, 0, 0.05) !important;
 		}
 
-		input[type="submit"].icon,
-		input[type="reset"].icon,
-		input[type="button"].icon,
-		button.icon,
-		.button.icon {
-			padding-left: 1.35em;
+	table th {
+		color: #000000;
+	}
+
+	table thead {
+		border-bottom-color: rgba(0, 0, 0, 0.2);
+	}
+
+	table tfoot {
+		border-top-color: rgba(0, 0, 0, 0.2);
+	}
+
+	table.alt tbody tr td {
+		border-color: rgba(0, 0, 0, 0.2);
+	}
+
+	table.uniform tbody tr:nth-child(2n + 1) {
+		background-color: transparent;
+	}
+
+/* Banner (transitions) */
+
+	.banner.onload-content-fade-up .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .banner.onload-content-fade-up .content {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+	.banner.onload-content-fade-down .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .banner.onload-content-fade-down .content {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+	.banner.onload-content-fade-left .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .banner.onload-content-fade-left .content {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+	.banner.onload-content-fade-right .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .banner.onload-content-fade-right .content {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+	.banner.onload-content-fade-in .content {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	body.is-loading .banner.onload-content-fade-in .content {
+		opacity: 0;
+	}
+
+	.banner.onload-image-fade-up .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onload-image-fade-up .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
 		}
 
-			input[type="submit"].icon:before,
-			input[type="reset"].icon:before,
-			input[type="button"].icon:before,
-			button.icon:before,
-			.button.icon:before {
-				margin-right: 0.5em;
-			}
+	body.is-loading .banner.onload-image-fade-up .image {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
 
-		input[type="submit"].fit,
-		input[type="reset"].fit,
-		input[type="button"].fit,
-		button.fit,
-		.button.fit {
-			display: block;
-			margin: 0 0 1em 0;
-			width: 100%;
+		body.is-loading .banner.onload-image-fade-up .image img {
+			opacity: 0;
 		}
 
-		input[type="submit"].small,
-		input[type="reset"].small,
-		input[type="button"].small,
-		button.small,
-		.button.small {
-			font-size: 0.7em;
+	.banner.onload-image-fade-down .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onload-image-fade-down .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
 		}
 
-		input[type="submit"].big,
-		input[type="reset"].big,
-		input[type="button"].big,
-		button.big,
-		.button.big {
-			font-size: 1.25em;
+	body.is-loading .banner.onload-image-fade-down .image {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+		body.is-loading .banner.onload-image-fade-down .image img {
+			opacity: 0;
 		}
 
-		input[type="submit"].special,
-		input[type="reset"].special,
-		input[type="button"].special,
-		button.special,
-		.button.special {
-			background-color: #555;
-			box-shadow: none !important;
-			color: #fff !important;
+	.banner.onload-image-fade-left .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onload-image-fade-left .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
 		}
 
-			input[type="submit"].special:hover,
-			input[type="reset"].special:hover,
-			input[type="button"].special:hover,
-			button.special:hover,
-			.button.special:hover {
-				background-color: #626262;
-			}
+	body.is-loading .banner.onload-image-fade-left .image {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
 
-			input[type="submit"].special:active,
-			input[type="reset"].special:active,
-			input[type="button"].special:active,
-			button.special:active,
-			.button.special:active {
-				background-color: #484848;
-			}
+		body.is-loading .banner.onload-image-fade-left .image img {
+			opacity: 0;
+		}
 
-		input[type="submit"].disabled, input[type="submit"]:disabled,
-		input[type="reset"].disabled,
-		input[type="reset"]:disabled,
-		input[type="button"].disabled,
-		input[type="button"]:disabled,
-		button.disabled,
-		button:disabled,
-		.button.disabled,
-		.button:disabled {
-			cursor: default;
-			opacity: 0.25;
+	.banner.onload-image-fade-right .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onload-image-fade-right .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	body.is-loading .banner.onload-image-fade-right .image {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+		body.is-loading .banner.onload-image-fade-right .image img {
+			opacity: 0;
+		}
+
+	.banner.onload-image-fade-in .image img {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	body.is-loading .banner.onload-image-fade-in .image img {
+		opacity: 0;
+	}
+
+	.banner.onscroll-content-fade-up .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.banner.onscroll-content-fade-up.is-inactive .content {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+	.banner.onscroll-content-fade-down .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.banner.onscroll-content-fade-down.is-inactive .content {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+	.banner.onscroll-content-fade-left .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.banner.onscroll-content-fade-left.is-inactive .content {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+	.banner.onscroll-content-fade-right .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.banner.onscroll-content-fade-right.is-inactive .content {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+	.banner.onscroll-content-fade-in .content {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	.banner.onscroll-content-fade-in.is-inactive .content {
+		opacity: 0;
+	}
+
+	.banner.onscroll-image-fade-up .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onscroll-image-fade-up .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.banner.onscroll-image-fade-up.is-inactive .image {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+		.banner.onscroll-image-fade-up.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.banner.onscroll-image-fade-down .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onscroll-image-fade-down .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.banner.onscroll-image-fade-down.is-inactive .image {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+		.banner.onscroll-image-fade-down.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.banner.onscroll-image-fade-left .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onscroll-image-fade-left .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.banner.onscroll-image-fade-left.is-inactive .image {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+		.banner.onscroll-image-fade-left.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.banner.onscroll-image-fade-right .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.banner.onscroll-image-fade-right .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.banner.onscroll-image-fade-right.is-inactive .image {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+		.banner.onscroll-image-fade-right.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.banner.onscroll-image-fade-in .image img {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	.banner.onscroll-image-fade-in.is-inactive .image img {
+		opacity: 0;
+	}
+
+/* Banner (style1) */
+
+	.banner.style1 {
+		-moz-align-items: stretch;
+		-webkit-align-items: stretch;
+		-ms-align-items: stretch;
+		align-items: stretch;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-direction: row;
+		-webkit-flex-direction: row;
+		-ms-flex-direction: row;
+		flex-direction: row;
+		-moz-justify-content: -moz-flex-end;
+		-webkit-justify-content: -webkit-flex-end;
+		-ms-justify-content: -ms-flex-end;
+		justify-content: flex-end;
+		position: relative;
+		text-align: left;
+		overflow-x: hidden;
+	}
+
+		.banner.style1 .content {
+			padding: 7rem 7rem 5rem 7rem ;
+			-moz-align-self: center;
+			-webkit-align-self: center;
+			-ms-align-self: center;
+			align-self: center;
+			-moz-flex-grow: 1;
+			-webkit-flex-grow: 1;
+			-ms-flex-grow: 1;
+			flex-grow: 1;
+			-moz-flex-shrink: 1;
+			-webkit-flex-shrink: 1;
+			-ms-flex-shrink: 1;
+			flex-shrink: 1;
+			width: 50%;
+			max-width: 48rem;
+			margin: 0 auto;
+		}
+
+		.banner.style1 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			border-radius: 0;
+			width: 50%;
+		}
+
+			.banner.style1 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.banner.style1 .content {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.banner.style1 .content {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.banner.style1 .content {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.banner.style1 .content {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+			}
+
+		}
+
+		@media screen and (orientation: portrait) {
+
+			.banner.style1 {
+				-moz-flex-direction: column-reverse;
+				-webkit-flex-direction: column-reverse;
+				-ms-flex-direction: column-reverse;
+				flex-direction: column-reverse;
+				text-align: center;
+			}
+
+				.banner.style1 .content {
+					display: -moz-flex;
+					display: -webkit-flex;
+					display: -ms-flex;
+					display: flex;
+					-moz-flex-direction: column;
+					-webkit-flex-direction: column;
+					-ms-flex-direction: column;
+					flex-direction: column;
+					-moz-justify-content: center;
+					-webkit-justify-content: center;
+					-ms-justify-content: center;
+					justify-content: center;
+					width: 100%;
+					max-width: 100%;
+				}
+
+				.banner.style1 .image {
+					width: 100%;
+					max-width: 100%;
+					height: 45vh;
+				}
+
+		}
+
+		.banner.style1.fullscreen {
+			min-height: 100vh;
+		}
+
+			@media screen and (orientation: portrait) {
+
+				.banner.style1.fullscreen .content {
+					min-height: 50vh;
+				}
+
+				.banner.style1.fullscreen .image {
+					height: 50vh;
+				}
+
+			}
+
+		.banner.style1.orient-right {
+			-moz-flex-direction: row-reverse;
+			-webkit-flex-direction: row-reverse;
+			-ms-flex-direction: row-reverse;
+			flex-direction: row-reverse;
+		}
+
+			@media screen and (orientation: portrait) {
+
+				.banner.style1.orient-right {
+					-moz-flex-direction: column-reverse;
+					-webkit-flex-direction: column-reverse;
+					-ms-flex-direction: column-reverse;
+					flex-direction: column-reverse;
+				}
+
+			}
+
+		.banner.style1.content-align-center {
+			text-align: center;
+		}
+
+		.banner.style1.content-align-right {
+			text-align: right;
+		}
+
+			@media screen and (orientation: portrait) {
+
+				.banner.style1.content-align-right {
+					text-align: center;
+				}
+
+			}
+
+		.banner.style1.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.banner.style1.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Banner (style2) */
+
+	.banner.style2 {
+		padding: 5.25rem 5.25rem 3.25rem 5.25rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		background-color: inherit;
+		position: relative;
+		text-align: center;
+		overflow-x: hidden;
+	}
+
+		.banner.style2 .content {
+			padding: 5.25rem 5.25rem 3.25rem 5.25rem ;
+			position: relative;
+			width: 40rem;
+			max-width: 100%;
+			background-color: inherit;
+			border-radius: 0.5rem;
+			margin-bottom: 2rem;
+			z-index: 1;
+		}
+
+		.banner.style2 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+		}
+
+			.banner.style2 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.banner.style2 {
+				padding: 3.75rem 3.75rem 1.75rem 3.75rem ;
+			}
+
+				.banner.style2 .content {
+					padding: 3.75rem 3.75rem 1.75rem 3.75rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.banner.style2 {
+				padding: 4rem 3rem 2rem 3rem ;
+			}
+
+				.banner.style2 .content {
+					padding: 4rem 3rem 2rem 3rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.banner.style2 {
+				padding: 3rem 3rem 1rem 3rem ;
+			}
+
+				.banner.style2 .content {
+					padding: 3.75rem 2.25rem 1.75rem 2.25rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.banner.style2 {
+				padding: 2rem 2rem 0.1rem 2rem ;
+			}
+
+				.banner.style2 .content {
+					padding: 2.5rem 1.5rem 0.5rem 1.5rem ;
+				}
+
+		}
+
+		.banner.style2.fullscreen {
+			min-height: 100vh;
+		}
+
+		.banner.style2.orient-left {
+			-moz-justify-content: -moz-flex-start;
+			-webkit-justify-content: -webkit-flex-start;
+			-ms-justify-content: -ms-flex-start;
+			justify-content: flex-start;
+			padding-left: 0;
+		}
+
+			.banner.style2.orient-left .content {
+				border-top-left-radius: 0;
+				border-bottom-left-radius: 0;
+			}
+
+		.banner.style2.orient-right {
+			-moz-justify-content: -moz-flex-end;
+			-webkit-justify-content: -webkit-flex-end;
+			-ms-justify-content: -ms-flex-end;
+			justify-content: flex-end;
+			padding-right: 0;
+		}
+
+			.banner.style2.orient-right .content {
+				border-top-right-radius: 0;
+				border-bottom-right-radius: 0;
+			}
+
+		.banner.style2.content-align-left {
+			text-align: left;
+		}
+
+		.banner.style2.content-align-right {
+			text-align: right;
+		}
+
+		.banner.style2.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.banner.style2.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Banner (style3) */
+
+	.banner.style3 {
+		padding: 7rem 7rem 5rem 7rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-direction: row-reverse;
+		-webkit-flex-direction: row-reverse;
+		-ms-flex-direction: row-reverse;
+		flex-direction: row-reverse;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		position: relative;
+		text-align: left;
+		overflow-x: hidden;
+	}
+
+		.banner.style3 .content {
+			width: 31.5rem;
+			max-width: 100%;
+		}
+
+		.banner.style3 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			width: 21rem;
+			height: 21rem;
+			border-radius: 100%;
+			margin: 0 3.5rem 2rem 0;
+		}
+
+			.banner.style3 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				width: 100%;
+				height: 100%;
+				border-radius: 100%;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.banner.style3 {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.banner.style3 {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.banner.style3 {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+			}
+
+				.banner.style3 .image {
+					width: 18.375rem;
+					height: 18.375rem;
+				}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.banner.style3 {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+				-moz-align-items: -moz-flex-start;
+				-webkit-align-items: -webkit-flex-start;
+				-ms-align-items: -ms-flex-start;
+				align-items: flex-start;
+			}
+
+				.banner.style3 .image {
+					width: 15.75rem;
+					height: 15.75rem;
+					margin: 0 2rem 2rem 0;
+				}
+
+		}
+
+		@media screen and (orientation: portrait) {
+
+			.banner.style3 {
+				-moz-align-items: center;
+				-webkit-align-items: center;
+				-ms-align-items: center;
+				align-items: center;
+				-moz-flex-direction: column-reverse;
+				-webkit-flex-direction: column-reverse;
+				-ms-flex-direction: column-reverse;
+				flex-direction: column-reverse;
+				text-align: center;
+			}
+
+				.banner.style3 .content {
+					width: 34rem;
+					max-width: 100%;
+				}
+
+				.banner.style3 .image {
+					margin-right: 0;
+				}
+
+		}
+
+		.banner.style3.fullscreen {
+			min-height: 100vh;
+		}
+
+		.banner.style3.orient-left {
+			-moz-flex-direction: row;
+			-webkit-flex-direction: row;
+			-ms-flex-direction: row;
+			flex-direction: row;
+		}
+
+			.banner.style3.orient-left .image {
+				margin: 0 0 2rem 3.5rem;
+			}
+
+			@media screen and (max-width: 736px) {
+
+				.banner.style3.orient-left .image {
+					margin: 0 0 2rem 2rem;
+				}
+
+			}
+
+			@media screen and (orientation: portrait) {
+
+				.banner.style3.orient-left {
+					-moz-flex-direction: column-reverse;
+					-webkit-flex-direction: column-reverse;
+					-ms-flex-direction: column-reverse;
+					flex-direction: column-reverse;
+				}
+
+					.banner.style3.orient-left .image {
+						margin-left: 0;
+					}
+
+			}
+
+		.banner.style3.content-align-center {
+			text-align: center;
+		}
+
+		.banner.style3.content-align-right {
+			text-align: right;
+		}
+
+		.banner.style3.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.banner.style3.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Banner (style4) */
+
+	.banner.style4 {
+		padding: 7rem 7rem 5rem 7rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-direction: row-reverse;
+		-webkit-flex-direction: row-reverse;
+		-ms-flex-direction: row-reverse;
+		flex-direction: row-reverse;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		position: relative;
+		text-align: left;
+		overflow-x: hidden;
+	}
+
+		.banner.style4 .content {
+			width: 31.5rem;
+			max-width: 100%;
+		}
+
+		.banner.style4 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			border-radius: 0;
+			border: solid 1px;
+			width: 13rem;
+			height: 23.11111rem;
+			margin-top: 2.5rem;
+			margin-bottom: 5rem;
+			margin-right: 3.5rem;
+		}
+
+			.banner.style4 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+			.banner.style4 .image:before {
+				content: '';
+				display: block;
+				background-position: center;
+				background-repeat: no-repeat;
+				border: solid 1px;
+				border-bottom: 0;
+			}
+
+			.banner.style4 .image:after {
+				content: '';
+				display: block;
+				background-position: center;
+				background-repeat: no-repeat;
+				border: solid 1px;
+				border-top: 0;
+			}
+
+			.banner.style4 .image:before {
+				height: 2.5rem;
+				background-size: 64px 32px;
+				margin-top: -2.5rem;
+				border-radius: 1rem 1rem 0 0;
+			}
+
+			.banner.style4 .image:after {
+				height: 3rem;
+				background-size: 64px 32px;
+				margin-bottom: -3rem;
+				border-radius: 0 0 1rem 1rem;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.banner.style4 {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.banner.style4 {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.banner.style4 {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+			}
+
+				.banner.style4 .image {
+					width: 11.375rem;
+					height: 20.22222rem;
+					margin-top: 2.1875rem;
+					margin-bottom: 4.625rem;
+				}
+
+					.banner.style4 .image:before {
+						height: 2.1875rem;
+						background-size: 56px 28px;
+						margin-top: -2.1875rem;
+						border-radius: 0.875rem 0.875rem 0 0;
+					}
+
+					.banner.style4 .image:after {
+						height: 2.625rem;
+						background-size: 56px 28px;
+						margin-bottom: -2.625rem;
+						border-radius: 0 0 0.875rem 0.875rem;
+					}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.banner.style4 {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+				-moz-align-items: -moz-flex-start;
+				-webkit-align-items: -webkit-flex-start;
+				-ms-align-items: -ms-flex-start;
+				align-items: flex-start;
+			}
+
+				.banner.style4 .image {
+					width: 8.125rem;
+					height: 14.44444rem;
+					margin-top: 1.5625rem;
+					margin-bottom: 3.875rem;
+				}
+
+					.banner.style4 .image:before {
+						height: 1.5625rem;
+						background-size: 40px 20px;
+						margin-top: -1.5625rem;
+						border-radius: 0.625rem 0.625rem 0 0;
+					}
+
+					.banner.style4 .image:after {
+						height: 1.875rem;
+						background-size: 40px 20px;
+						margin-bottom: -1.875rem;
+						border-radius: 0 0 0.625rem 0.625rem;
+					}
+
+		}
+
+		@media screen and (orientation: portrait) {
+
+			.banner.style4 {
+				-moz-align-items: center;
+				-webkit-align-items: center;
+				-ms-align-items: center;
+				align-items: center;
+				-moz-flex-direction: column-reverse;
+				-webkit-flex-direction: column-reverse;
+				-ms-flex-direction: column-reverse;
+				flex-direction: column-reverse;
+				text-align: center;
+			}
+
+				.banner.style4 .content {
+					width: 34rem;
+					max-width: 100%;
+				}
+
+				.banner.style4 .image {
+					margin-right: 0;
+					margin-left: 0;
+				}
+
+		}
+
+		.banner.style4.fullscreen {
+			min-height: 100vh;
+		}
+
+		.banner.style4.orient-left {
+			-moz-flex-direction: row;
+			-webkit-flex-direction: row;
+			-ms-flex-direction: row;
+			flex-direction: row;
+		}
+
+			.banner.style4.orient-left .image {
+				margin-right: 0;
+				margin-left: 3.5rem;
+			}
+
+			@media screen and (orientation: portrait) {
+
+				.banner.style4.orient-left {
+					-moz-flex-direction: column-reverse;
+					-webkit-flex-direction: column-reverse;
+					-ms-flex-direction: column-reverse;
+					flex-direction: column-reverse;
+				}
+
+					.banner.style4.orient-left .image {
+						margin-right: 0;
+						margin-left: 0;
+					}
+
+			}
+
+		.banner.style4.content-align-center {
+			text-align: center;
+		}
+
+		.banner.style4.content-align-right {
+			text-align: right;
+		}
+
+		.banner.style4.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.banner.style4.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Banner (style5) */
+
+	.banner.style5 {
+		padding: 7rem 7rem 5rem 7rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		background-color: inherit;
+		position: relative;
+		text-align: center;
+		overflow-x: hidden;
+	}
+
+		.banner.style5 .content {
+			position: relative;
+			width: 40rem;
+			max-width: 100%;
+			margin-bottom: 2rem;
+			z-index: 1;
+		}
+
+		.banner.style5 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+			opacity: 0.5;
+		}
+
+			.banner.style5 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.banner.style5 {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.banner.style5 {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.banner.style5 {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.banner.style5 {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+			}
+
+		}
+
+		.banner.style5.fullscreen {
+			min-height: 100vh;
+		}
+
+		.banner.style5.content-align-left {
+			text-align: left;
+		}
+
+		.banner.style5.content-align-right {
+			text-align: right;
+		}
+
+		.banner.style5.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.banner.style5.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+	.banner .image {
+		background-color: rgba(0, 0, 0, 0.125);
+	}
+
+	.banner.invert .image {
+		background-color: rgba(255, 255, 255, 0.125);
+	}
+
+	.banner.style4 .image {
+		border-color: rgba(0, 0, 0, 0.2);
+		background-color: rgba(0, 0, 0, 0.2);
+		border-width: 0;
+	}
+
+		.banner.style4 .image:before {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: rgba(0, 0, 0, 0.2)%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='11' y='12' width='42' height='8' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: rgba(0, 0, 0, 0.2);
+			width: 100%;
+		}
+
+		.banner.style4 .image:after {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: rgba(0, 0, 0, 0.2)%3B stroke-width: 1px%3B %7D%3C/style%3E%3Ccircle cx='32' cy='16' r='14' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: rgba(0, 0, 0, 0.2);
+			width: 100%;
+		}
+
+	.banner.style4.android .image:after {
+		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: rgba(0, 0, 0, 0.2)%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='6' y='4' width='52' height='24' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+	}
+
+	.banner.style4.invert .image {
+		border-color: white;
+		background-color: white;
+		border-width: 1px;
+	}
+
+		.banner.style4.invert .image:before {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='11' y='12' width='42' height='8' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: white;
+			width: calc(100% + 2px);
+			margin-left: -1px;
+		}
+
+		.banner.style4.invert .image:after {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Ccircle cx='32' cy='16' r='14' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: white;
+			width: calc(100% + 2px);
+			margin-left: -1px;
+		}
+
+	.banner.style4.invert.android .image:after {
+		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='6' y='4' width='52' height='24' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+	}
+
+/* Spotlight (transitions) */
+
+	.spotlight.onload-content-fade-up .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .spotlight.onload-content-fade-up .content {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onload-content-fade-down .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .spotlight.onload-content-fade-down .content {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onload-content-fade-left .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .spotlight.onload-content-fade-left .content {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onload-content-fade-right .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	body.is-loading .spotlight.onload-content-fade-right .content {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onload-content-fade-in .content {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	body.is-loading .spotlight.onload-content-fade-in .content {
+		opacity: 0;
+	}
+
+	.spotlight.onload-image-fade-up .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onload-image-fade-up .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	body.is-loading .spotlight.onload-image-fade-up .image {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+		body.is-loading .spotlight.onload-image-fade-up .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onload-image-fade-down .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onload-image-fade-down .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	body.is-loading .spotlight.onload-image-fade-down .image {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+		body.is-loading .spotlight.onload-image-fade-down .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onload-image-fade-left .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onload-image-fade-left .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	body.is-loading .spotlight.onload-image-fade-left .image {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+		body.is-loading .spotlight.onload-image-fade-left .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onload-image-fade-right .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onload-image-fade-right .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	body.is-loading .spotlight.onload-image-fade-right .image {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+		body.is-loading .spotlight.onload-image-fade-right .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onload-image-fade-in .image img {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	body.is-loading .spotlight.onload-image-fade-in .image img {
+		opacity: 0;
+	}
+
+	.spotlight.onscroll-content-fade-up .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.spotlight.onscroll-content-fade-up.is-inactive .content {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onscroll-content-fade-down .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.spotlight.onscroll-content-fade-down.is-inactive .content {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onscroll-content-fade-left .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.spotlight.onscroll-content-fade-left.is-inactive .content {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onscroll-content-fade-right .content {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+	.spotlight.onscroll-content-fade-right.is-inactive .content {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+	.spotlight.onscroll-content-fade-in .content {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	.spotlight.onscroll-content-fade-in.is-inactive .content {
+		opacity: 0;
+	}
+
+	.spotlight.onscroll-image-fade-up .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onscroll-image-fade-up .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.spotlight.onscroll-image-fade-up.is-inactive .image {
+		-moz-transform: translateY(1rem);
+		-webkit-transform: translateY(1rem);
+		-ms-transform: translateY(1rem);
+		transform: translateY(1rem);
+		opacity: 0;
+	}
+
+		.spotlight.onscroll-image-fade-up.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onscroll-image-fade-down .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onscroll-image-fade-down .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.spotlight.onscroll-image-fade-down.is-inactive .image {
+		-moz-transform: translateY(-1rem);
+		-webkit-transform: translateY(-1rem);
+		-ms-transform: translateY(-1rem);
+		transform: translateY(-1rem);
+		opacity: 0;
+	}
+
+		.spotlight.onscroll-image-fade-down.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onscroll-image-fade-left .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onscroll-image-fade-left .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.spotlight.onscroll-image-fade-left.is-inactive .image {
+		-moz-transform: translateX(1rem);
+		-webkit-transform: translateX(1rem);
+		-ms-transform: translateX(1rem);
+		transform: translateX(1rem);
+		opacity: 0;
+	}
+
+		.spotlight.onscroll-image-fade-left.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onscroll-image-fade-right .image {
+		-moz-transition: opacity 0.75s ease-in-out, -moz-transform 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out, -webkit-transform 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out, -ms-transform 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out;
+	}
+
+		.spotlight.onscroll-image-fade-right .image img {
+			-moz-transition: opacity 0.75s ease-in-out;
+			-webkit-transition: opacity 0.75s ease-in-out;
+			-ms-transition: opacity 0.75s ease-in-out;
+			transition: opacity 0.75s ease-in-out;
+			-moz-transition-delay: 0.5625s;
+			-webkit-transition-delay: 0.5625s;
+			-ms-transition-delay: 0.5625s;
+			transition-delay: 0.5625s;
+		}
+
+	.spotlight.onscroll-image-fade-right.is-inactive .image {
+		-moz-transform: translateX(-1rem);
+		-webkit-transform: translateX(-1rem);
+		-ms-transform: translateX(-1rem);
+		transform: translateX(-1rem);
+		opacity: 0;
+	}
+
+		.spotlight.onscroll-image-fade-right.is-inactive .image img {
+			opacity: 0;
+		}
+
+	.spotlight.onscroll-image-fade-in .image img {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+	}
+
+	.spotlight.onscroll-image-fade-in.is-inactive .image img {
+		opacity: 0;
+	}
+
+/* Spotlight (style1) */
+
+	.spotlight.style1 {
+		-moz-align-items: stretch;
+		-webkit-align-items: stretch;
+		-ms-align-items: stretch;
+		align-items: stretch;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-direction: row;
+		-webkit-flex-direction: row;
+		-ms-flex-direction: row;
+		flex-direction: row;
+		-moz-justify-content: -moz-flex-end;
+		-webkit-justify-content: -webkit-flex-end;
+		-ms-justify-content: -ms-flex-end;
+		justify-content: flex-end;
+		position: relative;
+		overflow-x: hidden;
+		text-align: left;
+	}
+
+		.spotlight.style1 .content {
+			padding: 7rem 7rem 5rem 7rem ;
+			-moz-align-self: center;
+			-webkit-align-self: center;
+			-ms-align-self: center;
+			align-self: center;
+			-moz-flex-grow: 1;
+			-webkit-flex-grow: 1;
+			-ms-flex-grow: 1;
+			flex-grow: 1;
+			-moz-flex-shrink: 1;
+			-webkit-flex-shrink: 1;
+			-ms-flex-shrink: 1;
+			flex-shrink: 1;
+			width: 65%;
+			max-width: 64rem;
+			margin: 0 auto;
+		}
+
+		.spotlight.style1 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			width: 35%;
+			min-width: 25rem;
+			border-radius: 0;
+		}
+
+			.spotlight.style1 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.spotlight.style1 .content {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.spotlight.style1 .content {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.spotlight.style1 .content {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+				width: 50%;
+				min-width: 0;
+			}
+
+			.spotlight.style1 .image {
+				width: 50%;
+				min-width: 0;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.spotlight.style1 .content {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+			}
+
+		}
+
+	@media screen and (max-width: 736px) and (orientation: portrait) {
+
+		.spotlight.style1 {
+			-moz-flex-direction: column-reverse;
+			-webkit-flex-direction: column-reverse;
+			-ms-flex-direction: column-reverse;
+			flex-direction: column-reverse;
+			text-align: center !important;
+		}
+
+			.spotlight.style1 .content {
+				width: 100%;
+			}
+
+			.spotlight.style1 .image {
+				width: 100%;
+			}
+
+				.spotlight.style1 .image img {
+					position: relative;
+				}
+
+	}
+
+		.spotlight.style1.orient-right {
+			-moz-flex-direction: row-reverse;
+			-webkit-flex-direction: row-reverse;
+			-ms-flex-direction: row-reverse;
+			flex-direction: row-reverse;
+		}
+
+	@media screen and (max-width: 736px) and (orientation: portrait) {
+
+		.spotlight.style1.orient-right {
+			-moz-flex-direction: column-reverse;
+			-webkit-flex-direction: column-reverse;
+			-ms-flex-direction: column-reverse;
+			flex-direction: column-reverse;
+		}
+
+	}
+
+		.spotlight.style1.content-align-center {
+			text-align: center;
+		}
+
+		.spotlight.style1.content-align-right {
+			text-align: right;
+		}
+
+		.spotlight.style1.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.spotlight.style1.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Spotlight (style2) */
+
+	.spotlight.style2 {
+		padding: 7rem 7rem 5rem 7rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-direction: row-reverse;
+		-webkit-flex-direction: row-reverse;
+		-ms-flex-direction: row-reverse;
+		flex-direction: row-reverse;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		position: relative;
+		overflow-x: hidden;
+		text-align: left;
+	}
+
+		.spotlight.style2 .content {
+			width: 44.5rem;
+			max-width: 100%;
+		}
+
+		.spotlight.style2 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			width: 21rem;
+			height: 21rem;
+			border-radius: 100%;
+			margin: 0 3.5rem 2rem 0;
+		}
+
+			.spotlight.style2 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				width: 100%;
+				height: 100%;
+				border-radius: 100%;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.spotlight.style2 {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.spotlight.style2 {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.spotlight.style2 {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+			}
+
+				.spotlight.style2 .image {
+					width: 18.375rem;
+					height: 18.375rem;
+				}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.spotlight.style2 {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+				-moz-align-items: -moz-flex-start;
+				-webkit-align-items: -webkit-flex-start;
+				-ms-align-items: -ms-flex-start;
+				align-items: flex-start;
+			}
+
+				.spotlight.style2 .image {
+					width: 15.75rem;
+					height: 15.75rem;
+					margin: 0 2rem 2rem 0;
+				}
+
+		}
+
+		@media screen and (orientation: portrait) {
+
+			.spotlight.style2 {
+				-moz-align-items: center;
+				-webkit-align-items: center;
+				-ms-align-items: center;
+				align-items: center;
+				-moz-flex-direction: column-reverse;
+				-webkit-flex-direction: column-reverse;
+				-ms-flex-direction: column-reverse;
+				flex-direction: column-reverse;
+				text-align: center !important;
+			}
+
+				.spotlight.style2 .content {
+					width: 34rem;
+					max-width: 100%;
+				}
+
+				.spotlight.style2 .image {
+					margin-right: 0;
+				}
+
+		}
+
+		.spotlight.style2.orient-left {
+			-moz-flex-direction: row;
+			-webkit-flex-direction: row;
+			-ms-flex-direction: row;
+			flex-direction: row;
+		}
+
+			.spotlight.style2.orient-left .image {
+				margin: 0 0 2rem 3.5rem;
+			}
+
+			@media screen and (max-width: 736px) {
+
+				.spotlight.style2.orient-left .image {
+					margin: 0 0 2rem 2rem;
+				}
+
+			}
+
+			@media screen and (orientation: portrait) {
+
+				.spotlight.style2.orient-left {
+					-moz-flex-direction: column-reverse;
+					-webkit-flex-direction: column-reverse;
+					-ms-flex-direction: column-reverse;
+					flex-direction: column-reverse;
+				}
+
+					.spotlight.style2.orient-left .image {
+						margin-left: 0;
+					}
+
+			}
+
+		.spotlight.style2.content-align-center {
+			text-align: center;
+		}
+
+		.spotlight.style2.content-align-right {
+			text-align: right;
+		}
+
+		.spotlight.style2.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.spotlight.style2.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Spotlight (style3) */
+
+	.spotlight.style3 {
+		padding: 7rem 7rem 5rem 7rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-direction: row-reverse;
+		-webkit-flex-direction: row-reverse;
+		-ms-flex-direction: row-reverse;
+		flex-direction: row-reverse;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		position: relative;
+		overflow-x: hidden;
+		text-align: left;
+	}
+
+		.spotlight.style3 .content {
+			width: 44.5rem;
+			max-width: 100%;
+		}
+
+		.spotlight.style3 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			border-radius: 0;
+			border: solid 1px;
+			width: 13rem;
+			height: 23.11111rem;
+			margin-top: 2.5rem;
+			margin-bottom: 5rem;
+			margin-right: 3.5rem;
+		}
+
+			.spotlight.style3 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+			.spotlight.style3 .image:before {
+				content: '';
+				display: block;
+				background-position: center;
+				background-repeat: no-repeat;
+				border: solid 1px;
+				border-bottom: 0;
+			}
+
+			.spotlight.style3 .image:after {
+				content: '';
+				display: block;
+				background-position: center;
+				background-repeat: no-repeat;
+				border: solid 1px;
+				border-top: 0;
+			}
+
+			.spotlight.style3 .image:before {
+				height: 2.5rem;
+				background-size: 64px 32px;
+				margin-top: -2.5rem;
+				border-radius: 1rem 1rem 0 0;
+			}
+
+			.spotlight.style3 .image:after {
+				height: 3rem;
+				background-size: 64px 32px;
+				margin-bottom: -3rem;
+				border-radius: 0 0 1rem 1rem;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.spotlight.style3 {
+				padding: 5rem 5rem 3rem 5rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.spotlight.style3 {
+				padding: 4rem 4rem 2rem 4rem ;
+			}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.spotlight.style3 {
+				padding: 3.75rem 3rem 1.75rem 3rem ;
+			}
+
+				.spotlight.style3 .image {
+					width: 11.375rem;
+					height: 20.22222rem;
+					margin-top: 2.1875rem;
+					margin-bottom: 4.625rem;
+				}
+
+					.spotlight.style3 .image:before {
+						height: 2.1875rem;
+						background-size: 56px 28px;
+						margin-top: -2.1875rem;
+						border-radius: 0.875rem 0.875rem 0 0;
+					}
+
+					.spotlight.style3 .image:after {
+						height: 2.625rem;
+						background-size: 56px 28px;
+						margin-bottom: -2.625rem;
+						border-radius: 0 0 0.875rem 0.875rem;
+					}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.spotlight.style3 {
+				padding: 2.5rem 2rem 0.5rem 2rem ;
+				-moz-align-items: -moz-flex-start;
+				-webkit-align-items: -webkit-flex-start;
+				-ms-align-items: -ms-flex-start;
+				align-items: flex-start;
+			}
+
+				.spotlight.style3 .image {
+					width: 8.125rem;
+					height: 14.44444rem;
+					margin-top: 1.5625rem;
+					margin-bottom: 3.875rem;
+				}
+
+					.spotlight.style3 .image:before {
+						height: 1.5625rem;
+						background-size: 40px 20px;
+						margin-top: -1.5625rem;
+						border-radius: 0.625rem 0.625rem 0 0;
+					}
+
+					.spotlight.style3 .image:after {
+						height: 1.875rem;
+						background-size: 40px 20px;
+						margin-bottom: -1.875rem;
+						border-radius: 0 0 0.625rem 0.625rem;
+					}
+
+		}
+
+		@media screen and (orientation: portrait) {
+
+			.spotlight.style3 {
+				-moz-align-items: center;
+				-webkit-align-items: center;
+				-ms-align-items: center;
+				align-items: center;
+				-moz-flex-direction: column-reverse;
+				-webkit-flex-direction: column-reverse;
+				-ms-flex-direction: column-reverse;
+				flex-direction: column-reverse;
+				text-align: center !important;
+			}
+
+				.spotlight.style3 .content {
+					width: 34rem;
+					max-width: 100%;
+				}
+
+				.spotlight.style3 .image {
+					margin-right: 0;
+					margin-left: 0;
+				}
+
+		}
+
+		.spotlight.style3.orient-left {
+			-moz-flex-direction: row;
+			-webkit-flex-direction: row;
+			-ms-flex-direction: row;
+			flex-direction: row;
+		}
+
+			.spotlight.style3.orient-left .image {
+				margin-right: 0;
+				margin-left: 3.5rem;
+			}
+
+			@media screen and (orientation: portrait) {
+
+				.spotlight.style3.orient-left {
+					-moz-flex-direction: column-reverse;
+					-webkit-flex-direction: column-reverse;
+					-ms-flex-direction: column-reverse;
+					flex-direction: column-reverse;
+				}
+
+					.spotlight.style3.orient-left .image {
+						margin-right: 0;
+						margin-left: 0;
+					}
+
+			}
+
+		.spotlight.style3.content-align-center {
+			text-align: center;
+		}
+
+		.spotlight.style3.content-align-right {
+			text-align: right;
+		}
+
+		.spotlight.style3.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.spotlight.style3.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Spotlight (style4) */
+
+	.spotlight.style4 {
+		padding: 7rem 5.25rem 5rem 5.25rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		background-color: inherit;
+		position: relative;
+		overflow-x: hidden;
+		text-align: center;
+	}
+
+		.spotlight.style4 .content {
+			padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+			position: relative;
+			width: 40rem;
+			max-width: 50%;
+			background-color: inherit;
+			border-radius: 0.5rem;
+			margin-bottom: 2rem;
+			z-index: 1;
+		}
+
+		.spotlight.style4 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+		}
+
+			.spotlight.style4 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.spotlight.style4 {
+				padding: 5rem 3.75rem 3rem 3.75rem ;
+			}
+
+				.spotlight.style4 .content {
+					padding: 2.5rem 2.5rem 0.5rem 2.5rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.spotlight.style4 {
+				padding: 4rem 3rem 2rem 3rem ;
+			}
+
+				.spotlight.style4 .content {
+					padding: 3rem 3rem 1rem 3rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.spotlight.style4 {
+				padding: 3rem 2.25rem 1rem 2.25rem ;
+			}
+
+				.spotlight.style4 .content {
+					padding: 2.25rem 2.25rem 0.25rem 2.25rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.spotlight.style4 {
+				padding: 2rem 1.5rem 0.1rem 1.5rem ;
+			}
+
+				.spotlight.style4 .content {
+					padding: 1.5rem 1.5rem 0.1rem 1.5rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			.spotlight.style4 .content {
+				max-width: 80%;
+			}
+
+		}
+
+		.spotlight.style4.fullscreen {
+			min-height: 100vh;
+		}
+
+		.spotlight.style4.halfscreen {
+			min-height: 50vh;
+		}
+
+		.spotlight.style4.orient-left {
+			-moz-justify-content: -moz-flex-start;
+			-webkit-justify-content: -webkit-flex-start;
+			-ms-justify-content: -ms-flex-start;
+			justify-content: flex-start;
+			padding-left: 0;
+		}
+
+			.spotlight.style4.orient-left .content {
+				border-top-left-radius: 0;
+				border-bottom-left-radius: 0;
+			}
+
+		.spotlight.style4.orient-right {
+			-moz-justify-content: -moz-flex-end;
+			-webkit-justify-content: -webkit-flex-end;
+			-ms-justify-content: -ms-flex-end;
+			justify-content: flex-end;
+			padding-right: 0;
+		}
+
+			.spotlight.style4.orient-right .content {
+				border-top-right-radius: 0;
+				border-bottom-right-radius: 0;
+			}
+
+		.spotlight.style4.content-align-left {
+			text-align: left;
+		}
+
+		.spotlight.style4.content-align-right {
+			text-align: right;
+		}
+
+		.spotlight.style4.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.spotlight.style4.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+/* Spotlight (style5) */
+
+	.spotlight.style5 {
+		padding: 7rem 5.25rem 5rem 5.25rem ;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		background-color: inherit;
+		position: relative;
+		overflow-x: hidden;
+		text-align: center;
+	}
+
+		.spotlight.style5 .content {
+			padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+			position: relative;
+			width: 40rem;
+			max-width: 52.5%;
+			background-color: inherit;
+			border-radius: 0.5rem;
+			margin-bottom: 2rem;
+			z-index: 1;
+		}
+
+		.spotlight.style5 .image {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+		}
+
+			.spotlight.style5 .image img {
+				-moz-object-fit: cover;
+				-webkit-object-fit: cover;
+				-ms-object-fit: cover;
+				object-fit: cover;
+				-moz-object-position: center;
+				-webkit-object-position: center;
+				-ms-object-position: center;
+				object-position: center;
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.spotlight.style5 {
+				padding: 5rem 3.75rem 3rem 3.75rem ;
+			}
+
+				.spotlight.style5 .content {
+					padding: 2.5rem 2.5rem 0.5rem 2.5rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.spotlight.style5 {
+				padding: 4rem 3rem 2rem 3rem ;
+			}
+
+				.spotlight.style5 .content {
+					padding: 3rem 3rem 1rem 3rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.spotlight.style5 {
+				padding: 3rem 2.25rem 1rem 2.25rem ;
+			}
+
+				.spotlight.style5 .content {
+					padding: 2.25rem 2.25rem 0.25rem 2.25rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.spotlight.style5 {
+				padding: 2rem 1.5rem 0.1rem 1.5rem ;
+			}
+
+				.spotlight.style5 .content {
+					padding: 1.5rem 1.5rem 0.1rem 1.5rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			.spotlight.style5 .content {
+				max-width: 80%;
+			}
+
+		}
+
+		.spotlight.style5.fullscreen {
+			min-height: 100vh;
+		}
+
+		.spotlight.style5.halfscreen {
+			min-height: 50vh;
+		}
+
+		.spotlight.style5.orient-left {
+			-moz-justify-content: -moz-flex-start;
+			-webkit-justify-content: -webkit-flex-start;
+			-ms-justify-content: -ms-flex-start;
+			justify-content: flex-start;
+		}
+
+		.spotlight.style5.orient-right {
+			-moz-justify-content: -moz-flex-end;
+			-webkit-justify-content: -webkit-flex-end;
+			-ms-justify-content: -ms-flex-end;
+			justify-content: flex-end;
+		}
+
+		.spotlight.style5.content-align-left {
+			text-align: left;
+		}
+
+		.spotlight.style5.content-align-right {
+			text-align: right;
+		}
+
+		.spotlight.style5.image-position-left .image img {
+			-moz-object-position: left;
+			-webkit-object-position: left;
+			-ms-object-position: left;
+			object-position: left;
+		}
+
+		.spotlight.style5.image-position-right .image img {
+			-moz-object-position: right;
+			-webkit-object-position: right;
+			-ms-object-position: right;
+			object-position: right;
+		}
+
+	.spotlight .image {
+		background-color: rgba(0, 0, 0, 0.125);
+	}
+
+	.spotlight.invert .image {
+		background-color: rgba(255, 255, 255, 0.125);
+	}
+
+	.spotlight.style3 .image {
+		border-color: rgba(0, 0, 0, 0.2);
+		background-color: rgba(0, 0, 0, 0.2);
+		border-width: 0;
+	}
+
+		.spotlight.style3 .image:before {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: rgba(0, 0, 0, 0.2)%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='11' y='12' width='42' height='8' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: rgba(0, 0, 0, 0.2);
+			width: 100%;
+		}
+
+		.spotlight.style3 .image:after {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: rgba(0, 0, 0, 0.2)%3B stroke-width: 1px%3B %7D%3C/style%3E%3Ccircle cx='32' cy='16' r='14' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: rgba(0, 0, 0, 0.2);
+			width: 100%;
+		}
+
+	.spotlight.style3.android .image:after {
+		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: rgba(0, 0, 0, 0.2)%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='6' y='4' width='52' height='24' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+	}
+
+	.spotlight.style3.invert .image {
+		border-color: white;
+		background-color: white;
+		border-width: 1px;
+	}
+
+		.spotlight.style3.invert .image:before {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='11' y='12' width='42' height='8' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: white;
+			width: calc(100% + 2px);
+			margin-left: -1px;
+		}
+
+		.spotlight.style3.invert .image:after {
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Ccircle cx='32' cy='16' r='14' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+			border-color: white;
+			width: calc(100% + 2px);
+			margin-left: -1px;
+		}
+
+	.spotlight.style3.invert.android .image:after {
+		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='6' y='4' width='52' height='24' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+	}
+
+/* Gallery (transitions) */
+
+	.gallery.onload-fade-in article .image img {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+		-moz-transition-delay: 4.8s;
+		-webkit-transition-delay: 4.8s;
+		-ms-transition-delay: 4.8s;
+		transition-delay: 4.8s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(1) .image img {
+		-moz-transition-delay: 0s;
+		-webkit-transition-delay: 0s;
+		-ms-transition-delay: 0s;
+		transition-delay: 0s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(2) .image img {
+		-moz-transition-delay: 0.15s;
+		-webkit-transition-delay: 0.15s;
+		-ms-transition-delay: 0.15s;
+		transition-delay: 0.15s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(3) .image img {
+		-moz-transition-delay: 0.3s;
+		-webkit-transition-delay: 0.3s;
+		-ms-transition-delay: 0.3s;
+		transition-delay: 0.3s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(4) .image img {
+		-moz-transition-delay: 0.45s;
+		-webkit-transition-delay: 0.45s;
+		-ms-transition-delay: 0.45s;
+		transition-delay: 0.45s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(5) .image img {
+		-moz-transition-delay: 0.6s;
+		-webkit-transition-delay: 0.6s;
+		-ms-transition-delay: 0.6s;
+		transition-delay: 0.6s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(6) .image img {
+		-moz-transition-delay: 0.75s;
+		-webkit-transition-delay: 0.75s;
+		-ms-transition-delay: 0.75s;
+		transition-delay: 0.75s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(7) .image img {
+		-moz-transition-delay: 0.9s;
+		-webkit-transition-delay: 0.9s;
+		-ms-transition-delay: 0.9s;
+		transition-delay: 0.9s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(8) .image img {
+		-moz-transition-delay: 1.05s;
+		-webkit-transition-delay: 1.05s;
+		-ms-transition-delay: 1.05s;
+		transition-delay: 1.05s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(9) .image img {
+		-moz-transition-delay: 1.2s;
+		-webkit-transition-delay: 1.2s;
+		-ms-transition-delay: 1.2s;
+		transition-delay: 1.2s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(10) .image img {
+		-moz-transition-delay: 1.35s;
+		-webkit-transition-delay: 1.35s;
+		-ms-transition-delay: 1.35s;
+		transition-delay: 1.35s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(11) .image img {
+		-moz-transition-delay: 1.5s;
+		-webkit-transition-delay: 1.5s;
+		-ms-transition-delay: 1.5s;
+		transition-delay: 1.5s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(12) .image img {
+		-moz-transition-delay: 1.65s;
+		-webkit-transition-delay: 1.65s;
+		-ms-transition-delay: 1.65s;
+		transition-delay: 1.65s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(13) .image img {
+		-moz-transition-delay: 1.8s;
+		-webkit-transition-delay: 1.8s;
+		-ms-transition-delay: 1.8s;
+		transition-delay: 1.8s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(14) .image img {
+		-moz-transition-delay: 1.95s;
+		-webkit-transition-delay: 1.95s;
+		-ms-transition-delay: 1.95s;
+		transition-delay: 1.95s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(15) .image img {
+		-moz-transition-delay: 2.1s;
+		-webkit-transition-delay: 2.1s;
+		-ms-transition-delay: 2.1s;
+		transition-delay: 2.1s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(16) .image img {
+		-moz-transition-delay: 2.25s;
+		-webkit-transition-delay: 2.25s;
+		-ms-transition-delay: 2.25s;
+		transition-delay: 2.25s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(17) .image img {
+		-moz-transition-delay: 2.4s;
+		-webkit-transition-delay: 2.4s;
+		-ms-transition-delay: 2.4s;
+		transition-delay: 2.4s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(18) .image img {
+		-moz-transition-delay: 2.55s;
+		-webkit-transition-delay: 2.55s;
+		-ms-transition-delay: 2.55s;
+		transition-delay: 2.55s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(19) .image img {
+		-moz-transition-delay: 2.7s;
+		-webkit-transition-delay: 2.7s;
+		-ms-transition-delay: 2.7s;
+		transition-delay: 2.7s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(20) .image img {
+		-moz-transition-delay: 2.85s;
+		-webkit-transition-delay: 2.85s;
+		-ms-transition-delay: 2.85s;
+		transition-delay: 2.85s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(21) .image img {
+		-moz-transition-delay: 3s;
+		-webkit-transition-delay: 3s;
+		-ms-transition-delay: 3s;
+		transition-delay: 3s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(22) .image img {
+		-moz-transition-delay: 3.15s;
+		-webkit-transition-delay: 3.15s;
+		-ms-transition-delay: 3.15s;
+		transition-delay: 3.15s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(23) .image img {
+		-moz-transition-delay: 3.3s;
+		-webkit-transition-delay: 3.3s;
+		-ms-transition-delay: 3.3s;
+		transition-delay: 3.3s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(24) .image img {
+		-moz-transition-delay: 3.45s;
+		-webkit-transition-delay: 3.45s;
+		-ms-transition-delay: 3.45s;
+		transition-delay: 3.45s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(25) .image img {
+		-moz-transition-delay: 3.6s;
+		-webkit-transition-delay: 3.6s;
+		-ms-transition-delay: 3.6s;
+		transition-delay: 3.6s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(26) .image img {
+		-moz-transition-delay: 3.75s;
+		-webkit-transition-delay: 3.75s;
+		-ms-transition-delay: 3.75s;
+		transition-delay: 3.75s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(27) .image img {
+		-moz-transition-delay: 3.9s;
+		-webkit-transition-delay: 3.9s;
+		-ms-transition-delay: 3.9s;
+		transition-delay: 3.9s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(28) .image img {
+		-moz-transition-delay: 4.05s;
+		-webkit-transition-delay: 4.05s;
+		-ms-transition-delay: 4.05s;
+		transition-delay: 4.05s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(29) .image img {
+		-moz-transition-delay: 4.2s;
+		-webkit-transition-delay: 4.2s;
+		-ms-transition-delay: 4.2s;
+		transition-delay: 4.2s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(30) .image img {
+		-moz-transition-delay: 4.35s;
+		-webkit-transition-delay: 4.35s;
+		-ms-transition-delay: 4.35s;
+		transition-delay: 4.35s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(31) .image img {
+		-moz-transition-delay: 4.5s;
+		-webkit-transition-delay: 4.5s;
+		-ms-transition-delay: 4.5s;
+		transition-delay: 4.5s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(32) .image img {
+		-moz-transition-delay: 4.65s;
+		-webkit-transition-delay: 4.65s;
+		-ms-transition-delay: 4.65s;
+		transition-delay: 4.65s;
+	}
+
+	.gallery.onload-fade-in article:nth-child(33) .image img {
+		-moz-transition-delay: 4.8s;
+		-webkit-transition-delay: 4.8s;
+		-ms-transition-delay: 4.8s;
+		transition-delay: 4.8s;
+	}
+
+	body.is-loading .gallery.onload-fade-in article .image img {
+		opacity: 0;
+	}
+
+	.gallery.onscroll-fade-in article .image img {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+		-moz-transition-delay: 4.8s;
+		-webkit-transition-delay: 4.8s;
+		-ms-transition-delay: 4.8s;
+		transition-delay: 4.8s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(1) .image img {
+		-moz-transition-delay: 0s;
+		-webkit-transition-delay: 0s;
+		-ms-transition-delay: 0s;
+		transition-delay: 0s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(2) .image img {
+		-moz-transition-delay: 0.15s;
+		-webkit-transition-delay: 0.15s;
+		-ms-transition-delay: 0.15s;
+		transition-delay: 0.15s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(3) .image img {
+		-moz-transition-delay: 0.3s;
+		-webkit-transition-delay: 0.3s;
+		-ms-transition-delay: 0.3s;
+		transition-delay: 0.3s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(4) .image img {
+		-moz-transition-delay: 0.45s;
+		-webkit-transition-delay: 0.45s;
+		-ms-transition-delay: 0.45s;
+		transition-delay: 0.45s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(5) .image img {
+		-moz-transition-delay: 0.6s;
+		-webkit-transition-delay: 0.6s;
+		-ms-transition-delay: 0.6s;
+		transition-delay: 0.6s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(6) .image img {
+		-moz-transition-delay: 0.75s;
+		-webkit-transition-delay: 0.75s;
+		-ms-transition-delay: 0.75s;
+		transition-delay: 0.75s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(7) .image img {
+		-moz-transition-delay: 0.9s;
+		-webkit-transition-delay: 0.9s;
+		-ms-transition-delay: 0.9s;
+		transition-delay: 0.9s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(8) .image img {
+		-moz-transition-delay: 1.05s;
+		-webkit-transition-delay: 1.05s;
+		-ms-transition-delay: 1.05s;
+		transition-delay: 1.05s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(9) .image img {
+		-moz-transition-delay: 1.2s;
+		-webkit-transition-delay: 1.2s;
+		-ms-transition-delay: 1.2s;
+		transition-delay: 1.2s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(10) .image img {
+		-moz-transition-delay: 1.35s;
+		-webkit-transition-delay: 1.35s;
+		-ms-transition-delay: 1.35s;
+		transition-delay: 1.35s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(11) .image img {
+		-moz-transition-delay: 1.5s;
+		-webkit-transition-delay: 1.5s;
+		-ms-transition-delay: 1.5s;
+		transition-delay: 1.5s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(12) .image img {
+		-moz-transition-delay: 1.65s;
+		-webkit-transition-delay: 1.65s;
+		-ms-transition-delay: 1.65s;
+		transition-delay: 1.65s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(13) .image img {
+		-moz-transition-delay: 1.8s;
+		-webkit-transition-delay: 1.8s;
+		-ms-transition-delay: 1.8s;
+		transition-delay: 1.8s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(14) .image img {
+		-moz-transition-delay: 1.95s;
+		-webkit-transition-delay: 1.95s;
+		-ms-transition-delay: 1.95s;
+		transition-delay: 1.95s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(15) .image img {
+		-moz-transition-delay: 2.1s;
+		-webkit-transition-delay: 2.1s;
+		-ms-transition-delay: 2.1s;
+		transition-delay: 2.1s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(16) .image img {
+		-moz-transition-delay: 2.25s;
+		-webkit-transition-delay: 2.25s;
+		-ms-transition-delay: 2.25s;
+		transition-delay: 2.25s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(17) .image img {
+		-moz-transition-delay: 2.4s;
+		-webkit-transition-delay: 2.4s;
+		-ms-transition-delay: 2.4s;
+		transition-delay: 2.4s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(18) .image img {
+		-moz-transition-delay: 2.55s;
+		-webkit-transition-delay: 2.55s;
+		-ms-transition-delay: 2.55s;
+		transition-delay: 2.55s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(19) .image img {
+		-moz-transition-delay: 2.7s;
+		-webkit-transition-delay: 2.7s;
+		-ms-transition-delay: 2.7s;
+		transition-delay: 2.7s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(20) .image img {
+		-moz-transition-delay: 2.85s;
+		-webkit-transition-delay: 2.85s;
+		-ms-transition-delay: 2.85s;
+		transition-delay: 2.85s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(21) .image img {
+		-moz-transition-delay: 3s;
+		-webkit-transition-delay: 3s;
+		-ms-transition-delay: 3s;
+		transition-delay: 3s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(22) .image img {
+		-moz-transition-delay: 3.15s;
+		-webkit-transition-delay: 3.15s;
+		-ms-transition-delay: 3.15s;
+		transition-delay: 3.15s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(23) .image img {
+		-moz-transition-delay: 3.3s;
+		-webkit-transition-delay: 3.3s;
+		-ms-transition-delay: 3.3s;
+		transition-delay: 3.3s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(24) .image img {
+		-moz-transition-delay: 3.45s;
+		-webkit-transition-delay: 3.45s;
+		-ms-transition-delay: 3.45s;
+		transition-delay: 3.45s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(25) .image img {
+		-moz-transition-delay: 3.6s;
+		-webkit-transition-delay: 3.6s;
+		-ms-transition-delay: 3.6s;
+		transition-delay: 3.6s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(26) .image img {
+		-moz-transition-delay: 3.75s;
+		-webkit-transition-delay: 3.75s;
+		-ms-transition-delay: 3.75s;
+		transition-delay: 3.75s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(27) .image img {
+		-moz-transition-delay: 3.9s;
+		-webkit-transition-delay: 3.9s;
+		-ms-transition-delay: 3.9s;
+		transition-delay: 3.9s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(28) .image img {
+		-moz-transition-delay: 4.05s;
+		-webkit-transition-delay: 4.05s;
+		-ms-transition-delay: 4.05s;
+		transition-delay: 4.05s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(29) .image img {
+		-moz-transition-delay: 4.2s;
+		-webkit-transition-delay: 4.2s;
+		-ms-transition-delay: 4.2s;
+		transition-delay: 4.2s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(30) .image img {
+		-moz-transition-delay: 4.35s;
+		-webkit-transition-delay: 4.35s;
+		-ms-transition-delay: 4.35s;
+		transition-delay: 4.35s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(31) .image img {
+		-moz-transition-delay: 4.5s;
+		-webkit-transition-delay: 4.5s;
+		-ms-transition-delay: 4.5s;
+		transition-delay: 4.5s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(32) .image img {
+		-moz-transition-delay: 4.65s;
+		-webkit-transition-delay: 4.65s;
+		-ms-transition-delay: 4.65s;
+		transition-delay: 4.65s;
+	}
+
+	.gallery.onscroll-fade-in article:nth-child(33) .image img {
+		-moz-transition-delay: 4.8s;
+		-webkit-transition-delay: 4.8s;
+		-ms-transition-delay: 4.8s;
+		transition-delay: 4.8s;
+	}
+
+	.gallery.onscroll-fade-in.is-inactive article .image img {
+		opacity: 0;
+	}
+
+/* Gallery (style1) */
+
+	.gallery.style1 {
+		background-color: #000000;
+		color: #ffffff;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-wrap: wrap;
+		-webkit-flex-wrap: wrap;
+		-ms-flex-wrap: wrap;
+		flex-wrap: wrap;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		position: relative;
+		width: 100%;
+		background-color: transparent;
+	}
+
+		.gallery.style1 input, .gallery.style1 select, .gallery.style1 textarea {
+			color: #ffffff;
+		}
+
+		.gallery.style1 a {
+			color: #ffffff;
+		}
+
+			.gallery.style1 a:hover {
+				color: #47D3E5;
+			}
+
+		.gallery.style1 strong, .gallery.style1 b {
+			color: #ffffff;
+		}
+
+		.gallery.style1 h1, .gallery.style1 h2, .gallery.style1 h3, .gallery.style1 h4, .gallery.style1 h5, .gallery.style1 h6 {
+			color: #ffffff;
+		}
+
+		.gallery.style1 blockquote {
+			border-left-color: white;
+		}
+
+		.gallery.style1 code {
+			background: rgba(255, 255, 255, 0.125);
+			border-color: white;
+		}
+
+		.gallery.style1 hr {
+			border-bottom-color: white;
+		}
+
+		.gallery.style1 input[type="submit"],
+		.gallery.style1 input[type="reset"],
+		.gallery.style1 input[type="button"],
+		.gallery.style1 button,
+		.gallery.style1 .button {
+			background-color: transparent;
+			box-shadow: inset 0 0 0 1px white;
+			color: #ffffff !important;
+		}
+
+			.gallery.style1 input[type="submit"]:hover,
+			.gallery.style1 input[type="reset"]:hover,
+			.gallery.style1 input[type="button"]:hover,
+			.gallery.style1 button:hover,
+			.gallery.style1 .button:hover {
+				box-shadow: inset 0 0 0 1px #47D3E5;
+				color: #47D3E5 !important;
+			}
+
+			.gallery.style1 input[type="submit"]:active,
+			.gallery.style1 input[type="reset"]:active,
+			.gallery.style1 input[type="button"]:active,
+			.gallery.style1 button:active,
+			.gallery.style1 .button:active {
+				background-color: rgba(71, 211, 229, 0.2);
+				box-shadow: inset 0 0 0 1px #47D3E5;
+				color: #47D3E5 !important;
+			}
+
+			.gallery.style1 input[type="submit"].special,
+			.gallery.style1 input[type="reset"].special,
+			.gallery.style1 input[type="button"].special,
+			.gallery.style1 button.special,
+			.gallery.style1 .button.special {
+				background-color: #ffffff;
+				box-shadow: none;
+				color: #000000 !important;
+			}
+
+				.gallery.style1 input[type="submit"].special:hover,
+				.gallery.style1 input[type="reset"].special:hover,
+				.gallery.style1 input[type="button"].special:hover,
+				.gallery.style1 button.special:hover,
+				.gallery.style1 .button.special:hover {
+					background-color: #47D3E5;
+				}
+
+				.gallery.style1 input[type="submit"].special:active,
+				.gallery.style1 input[type="reset"].special:active,
+				.gallery.style1 input[type="button"].special:active,
+				.gallery.style1 button.special:active,
+				.gallery.style1 .button.special:active {
+					background-color: #1ebdd1;
+				}
+
+		.gallery.style1 > .forward, .gallery.style1 > .backward {
+			display: none;
+		}
+
+		.gallery.style1 > .inner {
+			-moz-align-items: inherit;
+			-webkit-align-items: inherit;
+			-ms-align-items: inherit;
+			align-items: inherit;
+			display: inherit;
+			-moz-flex-wrap: inherit;
+			-webkit-flex-wrap: inherit;
+			-ms-flex-wrap: inherit;
+			flex-wrap: inherit;
+			-moz-justify-content: inherit;
+			-webkit-justify-content: inherit;
+			-ms-justify-content: inherit;
+			justify-content: inherit;
+		}
+
+		.gallery.style1 article {
+			overflow: hidden;
+			position: relative;
+			width: 25%;
+		}
+
+			.gallery.style1 article .image {
+				-moz-transition: opacity 0.2s ease-in-out;
+				-webkit-transition: opacity 0.2s ease-in-out;
+				-ms-transition: opacity 0.2s ease-in-out;
+				transition: opacity 0.2s ease-in-out;
+				display: block;
+				width: 100%;
+				border-radius: 0;
+			}
+
+				.gallery.style1 article .image img {
+					display: block;
+					width: 100%;
+					border-radius: 0;
+				}
+
+			.gallery.style1 article .caption {
+				-moz-align-items: center;
+				-webkit-align-items: center;
+				-ms-align-items: center;
+				align-items: center;
+				display: -moz-flex;
+				display: -webkit-flex;
+				display: -ms-flex;
+				display: flex;
+				-moz-flex-direction: column;
+				-webkit-flex-direction: column;
+				-ms-flex-direction: column;
+				flex-direction: column;
+				-moz-justify-content: center;
+				-webkit-justify-content: center;
+				-ms-justify-content: center;
+				justify-content: center;
+				-moz-pointer-events: none;
+				-webkit-pointer-events: none;
+				-ms-pointer-events: none;
+				pointer-events: none;
+				-moz-transition: opacity 0.2s ease-in-out;
+				-webkit-transition: opacity 0.2s ease-in-out;
+				-ms-transition: opacity 0.2s ease-in-out;
+				transition: opacity 0.2s ease-in-out;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				background-color: rgba(0, 0, 0, 0.5);
+				opacity: 0;
+				padding: 2rem;
+				z-index: 1;
+				font-size: 0.8rem;
+			}
+
+				.gallery.style1 article .caption a {
+					-moz-pointer-events: auto;
+					-webkit-pointer-events: auto;
+					-ms-pointer-events: auto;
+					pointer-events: auto;
+				}
+
+				.gallery.style1 article .caption h2, .gallery.style1 article .caption h3, .gallery.style1 article .caption h4, .gallery.style1 article .caption h5, .gallery.style1 article .caption h6 {
+					font-size: 1.25rem;
+					margin-bottom: 0.25rem;
+				}
+
+				.gallery.style1 article .caption > * {
+					max-width: 100%;
+					margin-bottom: 1rem;
+				}
+
+				.gallery.style1 article .caption > :last-child {
+					margin-bottom: 0;
+				}
+
+			.gallery.style1 article:hover .caption {
+				opacity: 1;
+			}
+
+		@media screen and (max-width: 1280px) {
+
+			.gallery.style1 article {
+				width: 33.33333%;
+			}
+
+				.gallery.style1 article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.gallery.style1 article {
+				width: 50%;
+			}
+
+				.gallery.style1 article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			.gallery.style1 article {
+				width: 100%;
+			}
+
+				.gallery.style1 article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+		.gallery.style1.small article {
+			width: 20%;
+		}
+
+			.gallery.style1.small article .caption {
+				padding: 1rem;
+			}
+
+		@media screen and (max-width: 1280px) {
+
+			.gallery.style1.small article {
+				width: 25%;
+			}
+
+				.gallery.style1.small article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.gallery.style1.small article {
+				width: 33.33333%;
+			}
+
+				.gallery.style1.small article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			.gallery.style1.small article {
+				width: 50%;
+			}
+
+				.gallery.style1.small article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+		.gallery.style1.big article {
+			width: 33.33333%;
+		}
+
+			.gallery.style1.big article .caption {
+				padding: 3rem;
+			}
+
+		@media screen and (max-width: 1280px) {
+
+			.gallery.style1.big article {
+				width: 50%;
+			}
+
+				.gallery.style1.big article .caption {
+					padding: 2rem;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.gallery.style1.big article {
+				width: 50%;
+			}
+
+				.gallery.style1.big article .caption {
+					padding: 2rem;
+				}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			.gallery.style1.big article {
+				width: 100%;
+			}
+
+				.gallery.style1.big article .caption {
+					padding: 1rem;
+				}
+
+		}
+
+/* Gallery (style2) */
+
+	.gallery.style2 {
+		background-color: #000000;
+		color: #ffffff;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-webkit-overflow-scrolling: touch;
+		position: relative;
+		background-color: transparent;
+	}
+
+		.gallery.style2 input, .gallery.style2 select, .gallery.style2 textarea {
+			color: #ffffff;
+		}
+
+		.gallery.style2 a {
+			color: #ffffff;
+		}
+
+			.gallery.style2 a:hover {
+				color: #47D3E5;
+			}
+
+		.gallery.style2 strong, .gallery.style2 b {
+			color: #ffffff;
+		}
+
+		.gallery.style2 h1, .gallery.style2 h2, .gallery.style2 h3, .gallery.style2 h4, .gallery.style2 h5, .gallery.style2 h6 {
+			color: #ffffff;
+		}
+
+		.gallery.style2 blockquote {
+			border-left-color: white;
+		}
+
+		.gallery.style2 code {
+			background: rgba(255, 255, 255, 0.125);
+			border-color: white;
+		}
+
+		.gallery.style2 hr {
+			border-bottom-color: white;
+		}
+
+		.gallery.style2 input[type="submit"],
+		.gallery.style2 input[type="reset"],
+		.gallery.style2 input[type="button"],
+		.gallery.style2 button,
+		.gallery.style2 .button {
+			background-color: transparent;
+			box-shadow: inset 0 0 0 1px white;
+			color: #ffffff !important;
+		}
+
+			.gallery.style2 input[type="submit"]:hover,
+			.gallery.style2 input[type="reset"]:hover,
+			.gallery.style2 input[type="button"]:hover,
+			.gallery.style2 button:hover,
+			.gallery.style2 .button:hover {
+				box-shadow: inset 0 0 0 1px #47D3E5;
+				color: #47D3E5 !important;
+			}
+
+			.gallery.style2 input[type="submit"]:active,
+			.gallery.style2 input[type="reset"]:active,
+			.gallery.style2 input[type="button"]:active,
+			.gallery.style2 button:active,
+			.gallery.style2 .button:active {
+				background-color: rgba(71, 211, 229, 0.2);
+				box-shadow: inset 0 0 0 1px #47D3E5;
+				color: #47D3E5 !important;
+			}
+
+			.gallery.style2 input[type="submit"].special,
+			.gallery.style2 input[type="reset"].special,
+			.gallery.style2 input[type="button"].special,
+			.gallery.style2 button.special,
+			.gallery.style2 .button.special {
+				background-color: #ffffff;
+				box-shadow: none;
+				color: #000000 !important;
+			}
+
+				.gallery.style2 input[type="submit"].special:hover,
+				.gallery.style2 input[type="reset"].special:hover,
+				.gallery.style2 input[type="button"].special:hover,
+				.gallery.style2 button.special:hover,
+				.gallery.style2 .button.special:hover {
+					background-color: #47D3E5;
+				}
+
+				.gallery.style2 input[type="submit"].special:active,
+				.gallery.style2 input[type="reset"].special:active,
+				.gallery.style2 input[type="button"].special:active,
+				.gallery.style2 button.special:active,
+				.gallery.style2 .button.special:active {
+					background-color: #1ebdd1;
+				}
+
+		.gallery.style2 > .forward, .gallery.style2 > .backward {
+			text-decoration: none;
+			-moz-transition: opacity 0.2s ease-in-out;
+			-webkit-transition: opacity 0.2s ease-in-out;
+			-ms-transition: opacity 0.2s ease-in-out;
+			transition: opacity 0.2s ease-in-out;
+			position: absolute;
+			top: 0;
+			width: 5rem;
+			height: 100%;
+			cursor: pointer;
+			opacity: 0;
+			z-index: 2;
+		}
+
+			.gallery.style2 > .forward:before, .gallery.style2 > .backward:before {
+				-moz-osx-font-smoothing: grayscale;
+				-webkit-font-smoothing: antialiased;
+				font-family: FontAwesome;
+				font-style: normal;
+				font-weight: normal;
+				text-transform: none !important;
+			}
+
+			.gallery.style2 > .forward:before, .gallery.style2 > .backward:before {
+				display: block;
+				top: calc(50% - 1.5rem);
+				width: 4rem;
+				height: 3rem;
+				line-height: 1em;
+				font-size: 3rem;
+				position: absolute;
+				text-align: center;
+			}
+
+		.gallery.style2:hover > .forward, .gallery.style2:hover > .backward {
+			opacity: 1;
+		}
+
+		.gallery.style2 > .forward {
+			right: 0;
+			background-image: linear-gradient(to left, rgba(0, 0, 0, 0.25) 15%, transparent);
+		}
+
+			.gallery.style2 > .forward:before {
+				content: '\f105';
+				right: 0;
+			}
+
+		.gallery.style2 > .backward {
+			left: 0;
+			background-image: linear-gradient(to right, rgba(0, 0, 0, 0.25) 15%, transparent);
+		}
+
+			.gallery.style2 > .backward:before {
+				content: '\f104';
+				left: 0;
+			}
+
+		.gallery.style2 > .inner {
+			display: inherit;
+			overflow-x: auto;
+			overflow-y: hidden;
+			position: relative;
+			width: 100%;
+		}
+
+		.gallery.style2 article {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			display: block;
+			position: relative;
+			overflow: hidden;
+			width: 22.5rem;
+			max-width: 75vw;
+		}
+
+			.gallery.style2 article .image {
+				display: block;
+				width: 100%;
+				border-radius: 0;
+			}
+
+				.gallery.style2 article .image img {
+					display: block;
+					width: 100%;
+					border-radius: 0;
+				}
+
+			.gallery.style2 article .caption {
+				-moz-align-items: center;
+				-webkit-align-items: center;
+				-ms-align-items: center;
+				align-items: center;
+				display: -moz-flex;
+				display: -webkit-flex;
+				display: -ms-flex;
+				display: flex;
+				-moz-flex-direction: column;
+				-webkit-flex-direction: column;
+				-ms-flex-direction: column;
+				flex-direction: column;
+				-moz-justify-content: center;
+				-webkit-justify-content: center;
+				-ms-justify-content: center;
+				justify-content: center;
+				-moz-pointer-events: none;
+				-webkit-pointer-events: none;
+				-ms-pointer-events: none;
+				pointer-events: none;
+				-moz-transition: opacity 0.2s ease-in-out;
+				-webkit-transition: opacity 0.2s ease-in-out;
+				-ms-transition: opacity 0.2s ease-in-out;
+				transition: opacity 0.2s ease-in-out;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				background-color: rgba(0, 0, 0, 0.5);
+				opacity: 0;
+				padding: 3rem;
+				z-index: 1;
+				font-size: 0.8rem;
+			}
+
+				.gallery.style2 article .caption a {
+					-moz-pointer-events: auto;
+					-webkit-pointer-events: auto;
+					-ms-pointer-events: auto;
+					pointer-events: auto;
+				}
+
+				.gallery.style2 article .caption h2, .gallery.style2 article .caption h3, .gallery.style2 article .caption h4, .gallery.style2 article .caption h5, .gallery.style2 article .caption h6 {
+					font-size: 1.25rem;
+					margin-bottom: 0.25rem;
+				}
+
+				.gallery.style2 article .caption > * {
+					max-width: 100%;
+					margin-bottom: 1rem;
+				}
+
+				.gallery.style2 article .caption > :last-child {
+					margin-bottom: 0;
+				}
+
+			.gallery.style2 article:hover .caption {
+				opacity: 1;
+			}
+
+		@media screen and (max-width: 980px) {
+
+			.gallery.style2 article .caption {
+				padding: 2rem;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.gallery.style2 article .caption {
+				padding: 2rem;
+			}
+
+		}
+
+		.gallery.style2.small article {
+			width: 17.5rem;
+		}
+
+			.gallery.style2.small article .caption {
+				padding: 2rem;
+			}
+
+		@media screen and (max-width: 980px) {
+
+			.gallery.style2.small article .caption {
+				padding: 2rem;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.gallery.style2.small article .caption {
+				padding: 2rem;
+			}
+
+		}
+
+		.gallery.style2.big article {
+			width: 30rem;
+		}
+
+			.gallery.style2.big article .caption {
+				padding: 4rem;
+			}
+
+		@media screen and (max-width: 980px) {
+
+			.gallery.style2.big article .caption {
+				padding: 3rem;
+			}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.gallery.style2.big article .caption {
+				padding: 2rem;
+			}
+
+		}
+
+/* Gallery (lightbox) */
+
+	@-moz-keyframes gallery-modal-spinner {
+		0% {
+			-moz-transform: rotate(0deg);
+			-webkit-transform: rotate(0deg);
+			-ms-transform: rotate(0deg);
+			transform: rotate(0deg);
+		}
+
+		100% {
+			-moz-transform: rotate(360deg);
+			-webkit-transform: rotate(360deg);
+			-ms-transform: rotate(360deg);
+			transform: rotate(360deg);
+		}
+	}
+
+	@-webkit-keyframes gallery-modal-spinner {
+		0% {
+			-moz-transform: rotate(0deg);
+			-webkit-transform: rotate(0deg);
+			-ms-transform: rotate(0deg);
+			transform: rotate(0deg);
+		}
+
+		100% {
+			-moz-transform: rotate(360deg);
+			-webkit-transform: rotate(360deg);
+			-ms-transform: rotate(360deg);
+			transform: rotate(360deg);
+		}
+	}
+
+	@-ms-keyframes gallery-modal-spinner {
+		0% {
+			-moz-transform: rotate(0deg);
+			-webkit-transform: rotate(0deg);
+			-ms-transform: rotate(0deg);
+			transform: rotate(0deg);
+		}
+
+		100% {
+			-moz-transform: rotate(360deg);
+			-webkit-transform: rotate(360deg);
+			-ms-transform: rotate(360deg);
+			transform: rotate(360deg);
+		}
+	}
+
+	@keyframes gallery-modal-spinner {
+		0% {
+			-moz-transform: rotate(0deg);
+			-webkit-transform: rotate(0deg);
+			-ms-transform: rotate(0deg);
+			transform: rotate(0deg);
+		}
+
+		100% {
+			-moz-transform: rotate(360deg);
+			-webkit-transform: rotate(360deg);
+			-ms-transform: rotate(360deg);
+			transform: rotate(360deg);
+		}
+	}
+
+	.gallery.lightbox .modal {
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-align-items: center;
+		-webkit-align-items: center;
+		-ms-align-items: center;
+		align-items: center;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		-moz-pointer-events: none;
+		-webkit-pointer-events: none;
+		-ms-pointer-events: none;
+		pointer-events: none;
+		-moz-user-select: none;
+		-webkit-user-select: none;
+		-ms-user-select: none;
+		user-select: none;
+		-moz-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
+		-webkit-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
+		-ms-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
+		transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
+		-webkit-tap-highlight-color: transparent;
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		outline: 0;
+		background-color: rgba(0, 0, 0, 0.75);
+		visibility: none;
+		opacity: 0;
+		z-index: 0;
+	}
+
+		.gallery.lightbox .modal:before {
+			-moz-animation: gallery-modal-spinner 1s infinite linear;
+			-webkit-animation: gallery-modal-spinner 1s infinite linear;
+			-ms-animation: gallery-modal-spinner 1s infinite linear;
+			animation: gallery-modal-spinner 1s infinite linear;
+			-moz-transition: opacity 0.25s ease;
+			-webkit-transition: opacity 0.25s ease;
+			-ms-transition: opacity 0.25s ease;
+			transition: opacity 0.25s ease;
+			-moz-transition-delay: 0.5s;
+			-webkit-transition-delay: 0.5s;
+			-ms-transition-delay: 0.5s;
+			transition-delay: 0.5s;
+			content: '';
+			display: block;
+			position: absolute;
+			top: 50%;
+			left: 50%;
+			width: 4rem;
+			height: 4rem;
+			margin: -2rem 0 0 -2rem;
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='96px' height='96px' viewBox='0 0 96 96' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: %23ffffff%3B stroke-width: 1.5px%3B %7D%3C/style%3E%3Cdefs%3E%3CclipPath id='corner'%3E%3Cpolygon points='0,0 48,0 48,48 96,48 96,96 0,96' /%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23corner)'%3E%3Ccircle cx='48' cy='48' r='32'/%3E%3C/g%3E%3C/svg%3E");
+			background-position: center;
+			background-repeat: no-repeat;
+			background-size: 4rem;
+			opacity: 0;
+		}
+
+		.gallery.lightbox .modal:after {
+			content: '';
+			display: block;
+			position: absolute;
+			top: 0.5rem;
+			right: 0.5rem;
+			width: 4rem;
+			height: 4rem;
+			cursor: pointer;
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='64px' viewBox='0 0 64 64' zoomAndPan='disable'%3E%3Cstyle%3Eline %7Bstroke: %23ffffff%3Bstroke-width: 1.5px%3B%7D%3C/style%3E%3Cline x1='20' y1='20' x2='44' y2='44' /%3E%3Cline x1='20' y1='44' x2='44' y2='20' /%3E%3C/svg%3E");
+			background-position: center;
+			background-repeat: no-repeat;
+			background-size: 3rem;
+		}
+
+		.gallery.lightbox .modal .inner {
+			-moz-transform: translateY(0.75rem);
+			-webkit-transform: translateY(0.75rem);
+			-ms-transform: translateY(0.75rem);
+			transform: translateY(0.75rem);
+			-moz-transition: opacity 0.25s ease, -moz-transform 0.25s ease;
+			-webkit-transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
+			-ms-transition: opacity 0.25s ease, -ms-transform 0.25s ease;
+			transition: opacity 0.25s ease, transform 0.25s ease;
+			opacity: 0;
+		}
+
+			.gallery.lightbox .modal .inner img {
+				display: block;
+				max-width: 90vw;
+				max-height: 85vh;
+				box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.35);
+			}
+
+		.gallery.lightbox .modal.visible {
+			-moz-pointer-events: auto;
+			-webkit-pointer-events: auto;
+			-ms-pointer-events: auto;
+			pointer-events: auto;
+			visibility: visible;
+			opacity: 1;
+			z-index: 10001;
+		}
+
+			.gallery.lightbox .modal.visible:before {
+				opacity: 1;
+			}
+
+		.gallery.lightbox .modal.loaded .inner {
+			-moz-transform: translateY(0);
+			-webkit-transform: translateY(0);
+			-ms-transform: translateY(0);
+			transform: translateY(0);
+			-moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease;
+			-webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
+			-ms-transition: opacity 0.5s ease, -ms-transform 0.5s ease;
+			transition: opacity 0.5s ease, transform 0.5s ease;
+			opacity: 1;
+		}
+
+		.gallery.lightbox .modal.loaded:before {
+			-moz-transition-delay: 0s;
+			-webkit-transition-delay: 0s;
+			-ms-transition-delay: 0s;
+			transition-delay: 0s;
+			opacity: 0;
+		}
+
+	@media screen and (max-width: 980px) {
+
+		.gallery.lightbox .modal .inner img {
+			max-width: 100vw;
+		}
+
+	}
+
+	.gallery article .image {
+		background-color: rgba(0, 0, 0, 0.125);
+	}
+
+/* Wrapper (style1) */
+
+	.wrapper.style1 > .inner {
+		padding: 7rem 3.5rem 5rem 3.5rem ;
+		margin: 0 auto;
+		max-width: 100%;
+		width: 64rem;
+	}
+
+		.wrapper.style1 > .inner.medium {
+			width: 48rem;
+		}
+
+		.wrapper.style1 > .inner.small {
+			width: 32rem;
+		}
+
+	@media screen and (max-width: 1680px) {
+
+		.wrapper.style1 > .inner {
+			padding: 5rem 2.5rem 3rem 2.5rem ;
+		}
+
+	}
+
+	@media screen and (max-width: 1280px) {
+
+		.wrapper.style1 > .inner {
+			padding: 4rem 4rem 2rem 4rem ;
+		}
+
+	}
+
+	@media screen and (max-width: 980px) {
+
+		.wrapper.style1 > .inner {
+			padding: 4.5rem 3rem 2.5rem 3rem ;
+		}
+
+	}
+
+	@media screen and (max-width: 736px) {
+
+		.wrapper.style1 > .inner {
+			padding: 3rem 2rem 1rem 2rem ;
+		}
+
+	}
+
+/* Wrapper (style2) */
+
+	.wrapper.style2 {
+		padding: 7rem;
+		background-color: #eeeeee;
+	}
+
+		.wrapper.style2 > .inner {
+			padding: 5.25rem 3.5rem 3.25rem 3.5rem ;
+			background-color: #ffffff;
+			border-radius: 0.5rem;
+			margin: 0 auto;
+			max-width: 100%;
+			position: relative;
+			width: 64rem;
+			z-index: 1;
+		}
+
+			.wrapper.style2 > .inner.medium {
+				width: 48rem;
+			}
+
+			.wrapper.style2 > .inner.small {
+				width: 32rem;
+			}
+
+		@media screen and (max-width: 1680px) {
+
+			.wrapper.style2 {
+				padding: 5rem;
+			}
+
+				.wrapper.style2 > .inner {
+					padding: 3.75rem 2.5rem 1.75rem 2.5rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 1280px) {
+
+			.wrapper.style2 {
+				padding: 4rem;
+			}
+
+				.wrapper.style2 > .inner {
+					padding: 3rem 2rem 1rem 2rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.wrapper.style2 {
+				padding: 2.25rem;
+			}
+
+				.wrapper.style2 > .inner {
+					padding: 3rem 2.25rem 1rem 2.25rem ;
+				}
+
+		}
+
+		@media screen and (max-width: 736px) {
+
+			.wrapper.style2 {
+				padding: 1.5rem;
+			}
+
+				.wrapper.style2 > .inner {
+					padding: 2rem 1.5rem 0.1rem 1.5rem ;
+				}
+
+		}
+
+	#wrapper > .wrapper.style2.invert:not(.color1):not(.color2):not(.color3):not(.color4):not(.color5):not(.color6):not(.color7) {
+		background-color: #222222;
+	}
+
+	#wrapper > .wrapper.style2.invert > .inner {
+		background-color: #000000;
+	}
+
+/* Items (transitions) */
+
+	.items.onload-fade-in > * > .inner {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+		-moz-transition-delay: 2.4s;
+		-webkit-transition-delay: 2.4s;
+		-ms-transition-delay: 2.4s;
+		transition-delay: 2.4s;
+	}
+
+	.items.onload-fade-in > *:nth-child(1) > .inner {
+		-moz-transition-delay: 0s;
+		-webkit-transition-delay: 0s;
+		-ms-transition-delay: 0s;
+		transition-delay: 0s;
+	}
+
+	.items.onload-fade-in > *:nth-child(2) > .inner {
+		-moz-transition-delay: 0.15s;
+		-webkit-transition-delay: 0.15s;
+		-ms-transition-delay: 0.15s;
+		transition-delay: 0.15s;
+	}
+
+	.items.onload-fade-in > *:nth-child(3) > .inner {
+		-moz-transition-delay: 0.3s;
+		-webkit-transition-delay: 0.3s;
+		-ms-transition-delay: 0.3s;
+		transition-delay: 0.3s;
+	}
+
+	.items.onload-fade-in > *:nth-child(4) > .inner {
+		-moz-transition-delay: 0.45s;
+		-webkit-transition-delay: 0.45s;
+		-ms-transition-delay: 0.45s;
+		transition-delay: 0.45s;
+	}
+
+	.items.onload-fade-in > *:nth-child(5) > .inner {
+		-moz-transition-delay: 0.6s;
+		-webkit-transition-delay: 0.6s;
+		-ms-transition-delay: 0.6s;
+		transition-delay: 0.6s;
+	}
+
+	.items.onload-fade-in > *:nth-child(6) > .inner {
+		-moz-transition-delay: 0.75s;
+		-webkit-transition-delay: 0.75s;
+		-ms-transition-delay: 0.75s;
+		transition-delay: 0.75s;
+	}
+
+	.items.onload-fade-in > *:nth-child(7) > .inner {
+		-moz-transition-delay: 0.9s;
+		-webkit-transition-delay: 0.9s;
+		-ms-transition-delay: 0.9s;
+		transition-delay: 0.9s;
+	}
+
+	.items.onload-fade-in > *:nth-child(8) > .inner {
+		-moz-transition-delay: 1.05s;
+		-webkit-transition-delay: 1.05s;
+		-ms-transition-delay: 1.05s;
+		transition-delay: 1.05s;
+	}
+
+	.items.onload-fade-in > *:nth-child(9) > .inner {
+		-moz-transition-delay: 1.2s;
+		-webkit-transition-delay: 1.2s;
+		-ms-transition-delay: 1.2s;
+		transition-delay: 1.2s;
+	}
+
+	.items.onload-fade-in > *:nth-child(10) > .inner {
+		-moz-transition-delay: 1.35s;
+		-webkit-transition-delay: 1.35s;
+		-ms-transition-delay: 1.35s;
+		transition-delay: 1.35s;
+	}
+
+	.items.onload-fade-in > *:nth-child(11) > .inner {
+		-moz-transition-delay: 1.5s;
+		-webkit-transition-delay: 1.5s;
+		-ms-transition-delay: 1.5s;
+		transition-delay: 1.5s;
+	}
+
+	.items.onload-fade-in > *:nth-child(12) > .inner {
+		-moz-transition-delay: 1.65s;
+		-webkit-transition-delay: 1.65s;
+		-ms-transition-delay: 1.65s;
+		transition-delay: 1.65s;
+	}
+
+	.items.onload-fade-in > *:nth-child(13) > .inner {
+		-moz-transition-delay: 1.8s;
+		-webkit-transition-delay: 1.8s;
+		-ms-transition-delay: 1.8s;
+		transition-delay: 1.8s;
+	}
+
+	.items.onload-fade-in > *:nth-child(14) > .inner {
+		-moz-transition-delay: 1.95s;
+		-webkit-transition-delay: 1.95s;
+		-ms-transition-delay: 1.95s;
+		transition-delay: 1.95s;
+	}
+
+	.items.onload-fade-in > *:nth-child(15) > .inner {
+		-moz-transition-delay: 2.1s;
+		-webkit-transition-delay: 2.1s;
+		-ms-transition-delay: 2.1s;
+		transition-delay: 2.1s;
+	}
+
+	.items.onload-fade-in > *:nth-child(16) > .inner {
+		-moz-transition-delay: 2.25s;
+		-webkit-transition-delay: 2.25s;
+		-ms-transition-delay: 2.25s;
+		transition-delay: 2.25s;
+	}
+
+	.items.onload-fade-in > *:nth-child(17) > .inner {
+		-moz-transition-delay: 2.4s;
+		-webkit-transition-delay: 2.4s;
+		-ms-transition-delay: 2.4s;
+		transition-delay: 2.4s;
+	}
+
+	body.is-loading .items.onload-fade-in > * > .inner {
+		opacity: 0;
+	}
+
+	.items.onscroll-fade-in > * > .inner {
+		-moz-transition: opacity 0.75s ease-in-out;
+		-webkit-transition: opacity 0.75s ease-in-out;
+		-ms-transition: opacity 0.75s ease-in-out;
+		transition: opacity 0.75s ease-in-out;
+		-moz-transition-delay: 2.4s;
+		-webkit-transition-delay: 2.4s;
+		-ms-transition-delay: 2.4s;
+		transition-delay: 2.4s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(1) > .inner {
+		-moz-transition-delay: 0s;
+		-webkit-transition-delay: 0s;
+		-ms-transition-delay: 0s;
+		transition-delay: 0s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(2) > .inner {
+		-moz-transition-delay: 0.15s;
+		-webkit-transition-delay: 0.15s;
+		-ms-transition-delay: 0.15s;
+		transition-delay: 0.15s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(3) > .inner {
+		-moz-transition-delay: 0.3s;
+		-webkit-transition-delay: 0.3s;
+		-ms-transition-delay: 0.3s;
+		transition-delay: 0.3s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(4) > .inner {
+		-moz-transition-delay: 0.45s;
+		-webkit-transition-delay: 0.45s;
+		-ms-transition-delay: 0.45s;
+		transition-delay: 0.45s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(5) > .inner {
+		-moz-transition-delay: 0.6s;
+		-webkit-transition-delay: 0.6s;
+		-ms-transition-delay: 0.6s;
+		transition-delay: 0.6s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(6) > .inner {
+		-moz-transition-delay: 0.75s;
+		-webkit-transition-delay: 0.75s;
+		-ms-transition-delay: 0.75s;
+		transition-delay: 0.75s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(7) > .inner {
+		-moz-transition-delay: 0.9s;
+		-webkit-transition-delay: 0.9s;
+		-ms-transition-delay: 0.9s;
+		transition-delay: 0.9s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(8) > .inner {
+		-moz-transition-delay: 1.05s;
+		-webkit-transition-delay: 1.05s;
+		-ms-transition-delay: 1.05s;
+		transition-delay: 1.05s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(9) > .inner {
+		-moz-transition-delay: 1.2s;
+		-webkit-transition-delay: 1.2s;
+		-ms-transition-delay: 1.2s;
+		transition-delay: 1.2s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(10) > .inner {
+		-moz-transition-delay: 1.35s;
+		-webkit-transition-delay: 1.35s;
+		-ms-transition-delay: 1.35s;
+		transition-delay: 1.35s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(11) > .inner {
+		-moz-transition-delay: 1.5s;
+		-webkit-transition-delay: 1.5s;
+		-ms-transition-delay: 1.5s;
+		transition-delay: 1.5s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(12) > .inner {
+		-moz-transition-delay: 1.65s;
+		-webkit-transition-delay: 1.65s;
+		-ms-transition-delay: 1.65s;
+		transition-delay: 1.65s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(13) > .inner {
+		-moz-transition-delay: 1.8s;
+		-webkit-transition-delay: 1.8s;
+		-ms-transition-delay: 1.8s;
+		transition-delay: 1.8s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(14) > .inner {
+		-moz-transition-delay: 1.95s;
+		-webkit-transition-delay: 1.95s;
+		-ms-transition-delay: 1.95s;
+		transition-delay: 1.95s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(15) > .inner {
+		-moz-transition-delay: 2.1s;
+		-webkit-transition-delay: 2.1s;
+		-ms-transition-delay: 2.1s;
+		transition-delay: 2.1s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(16) > .inner {
+		-moz-transition-delay: 2.25s;
+		-webkit-transition-delay: 2.25s;
+		-ms-transition-delay: 2.25s;
+		transition-delay: 2.25s;
+	}
+
+	.items.onscroll-fade-in > *:nth-child(17) > .inner {
+		-moz-transition-delay: 2.4s;
+		-webkit-transition-delay: 2.4s;
+		-ms-transition-delay: 2.4s;
+		transition-delay: 2.4s;
+	}
+
+	.items.onscroll-fade-in.is-inactive > * > .inner {
+		opacity: 0;
+	}
+
+/* Items (style1) */
+
+	.items.style1 {
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-wrap: wrap;
+		-webkit-flex-wrap: wrap;
+		-ms-flex-wrap: wrap;
+		flex-wrap: wrap;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		margin: 3rem 0;
+		position: relative;
+	}
+
+		.items.style1 > * {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			border-style: solid;
+			border-left-width: 1px;
+			border-top-width: 1px;
+		}
+
+		.items.style1.big > * {
+			padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+			width: 50%;
+		}
+
+			.items.style1.big > *:nth-child(-n + 2) {
+				border-top-width: 0;
+			}
+
+			.items.style1.big > *:nth-child(2n + 1) {
+				border-left-width: 0;
+			}
+
+		.items.style1.medium > * {
+			padding: 2.1875rem 2.1875rem 0.1875rem 2.1875rem ;
+			width: 33.33333%;
+		}
+
+			.items.style1.medium > *:nth-child(-n + 3) {
+				border-top-width: 0;
+			}
+
+			.items.style1.medium > *:nth-child(3n + 1) {
+				border-left-width: 0;
+			}
+
+		.items.style1.small > * {
+			padding: 1.3125rem 1.3125rem 0.1rem 1.3125rem ;
+			width: 25%;
+		}
+
+			.items.style1.small > *:nth-child(-n + 4) {
+				border-top-width: 0;
+			}
+
+			.items.style1.small > *:nth-child(4n + 1) {
+				border-left-width: 0;
+			}
+
+		@media screen and (max-width: 1280px) {
+
+			.items.style1.small > *:nth-child(-n + 4) {
+				border-top-width: 1px;
+			}
+
+			.items.style1.small > *:nth-child(4n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style1.small > * {
+				padding: 2.1875rem 2.1875rem 0.1875rem 2.1875rem ;
+				width: 33.33333%;
+			}
+
+				.items.style1.small > *:nth-child(-n + 3) {
+					border-top-width: 0;
+				}
+
+				.items.style1.small > *:nth-child(3n + 1) {
+					border-left-width: 0;
+				}
+
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.items.style1.medium > *:nth-child(-n + 3) {
+				border-top-width: 1px;
+			}
+
+			.items.style1.medium > *:nth-child(3n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style1.medium > * {
+				padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+				width: 50%;
+			}
+
+				.items.style1.medium > *:nth-child(-n + 2) {
+					border-top-width: 0;
+				}
+
+				.items.style1.medium > *:nth-child(2n + 1) {
+					border-left-width: 0;
+				}
+
+			.items.style1.small > *:nth-child(-n + 3) {
+				border-top-width: 1px;
+			}
+
+			.items.style1.small > *:nth-child(3n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style1.small > * {
+				padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+				width: 50%;
+			}
+
+				.items.style1.small > *:nth-child(-n + 2) {
+					border-top-width: 0;
+				}
+
+				.items.style1.small > *:nth-child(2n + 1) {
+					border-left-width: 0;
+				}
+
+		}
+
+		@media screen and (max-width: 480px) {
+
+			.items.style1.big > *:nth-child(-n + 2) {
+				border-top-width: 1px;
+			}
+
+			.items.style1.big > *:nth-child(2n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style1.big > * {
+				padding: 2.625rem 2.625rem 0.625rem 2.625rem ;
+				width: 100%;
+			}
+
+				.items.style1.big > *:nth-child(-n + 1) {
+					border-top-width: 0;
+				}
+
+				.items.style1.big > *:nth-child(1n + 1) {
+					border-left-width: 0;
+				}
+
+			.items.style1.medium > *:nth-child(-n + 2) {
+				border-top-width: 1px;
+			}
+
+			.items.style1.medium > *:nth-child(2n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style1.medium > * {
+				padding: 2.625rem 2.625rem 0.625rem 2.625rem ;
+				width: 100%;
+			}
+
+				.items.style1.medium > *:nth-child(-n + 1) {
+					border-top-width: 0;
+				}
+
+				.items.style1.medium > *:nth-child(1n + 1) {
+					border-left-width: 0;
+				}
+
+			.items.style1.small > *:nth-child(-n + 2) {
+				border-top-width: 1px;
+			}
+
+			.items.style1.small > *:nth-child(2n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style1.small > * {
+				padding: 2.625rem 2.625rem 0.625rem 2.625rem ;
+				width: 100%;
+			}
+
+				.items.style1.small > *:nth-child(-n + 1) {
+					border-top-width: 0;
+				}
+
+				.items.style1.small > *:nth-child(1n + 1) {
+					border-left-width: 0;
+				}
+
+			.items.style1.big > *, .items.style1.medium > *, .items.style1.small > * {
+				padding-left: 0;
+				padding-right: 0;
+			}
+
+			.items.style1.big > :first-child, .items.style1.medium > :first-child, .items.style1.small > :first-child {
+				padding-top: 0;
+			}
+
+			.items.style1.big > :last-child, .items.style1.medium > :last-child, .items.style1.small > :last-child {
+				padding-bottom: 0;
+			}
+
+				.items.style1.big > :last-child > .inner > :last-child, .items.style1.medium > :last-child > .inner > :last-child, .items.style1.small > :last-child > .inner > :last-child {
+					margin-bottom: 0;
+				}
+
+		}
+
+/* Items (style2) */
+
+	.items.style2 {
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-wrap: wrap;
+		-webkit-flex-wrap: wrap;
+		-ms-flex-wrap: wrap;
+		flex-wrap: wrap;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		margin: 3rem 0;
+		position: relative;
+		border: solid 1px;
+		border-radius: 4px;
+	}
+
+		.items.style2 > * {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			border-style: solid;
+			border-left-width: 1px;
+			border-top-width: 1px;
+		}
+
+		.items.style2.big > * {
+			padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+			width: 50%;
+		}
+
+			.items.style2.big > *:nth-child(-n + 2) {
+				border-top-width: 0;
+			}
+
+			.items.style2.big > *:nth-child(2n + 1) {
+				border-left-width: 0;
+			}
+
+		.items.style2.medium > * {
+			padding: 2.1875rem 2.1875rem 0.1875rem 2.1875rem ;
+			width: 33.33333%;
+		}
+
+			.items.style2.medium > *:nth-child(-n + 3) {
+				border-top-width: 0;
+			}
+
+			.items.style2.medium > *:nth-child(3n + 1) {
+				border-left-width: 0;
+			}
+
+		.items.style2.small > * {
+			padding: 1.3125rem 1.3125rem 0.1rem 1.3125rem ;
+			width: 25%;
 		}
 
-/* Main */
+			.items.style2.small > *:nth-child(-n + 4) {
+				border-top-width: 0;
+			}
+
+			.items.style2.small > *:nth-child(4n + 1) {
+				border-left-width: 0;
+			}
 
-	.main {
-		padding: 6em 0 4em 0 ;
-	}
+		@media screen and (max-width: 1280px) {
 
-		.main.style1 {
-			background: #fff;
-		}
+			.items.style2.small > *:nth-child(-n + 4) {
+				border-top-width: 1px;
+			}
 
-		.main.style2 {
-			background-color: #333;
-			color: rgba(255, 255, 255, 0.75);
-			background-attachment: fixed,							fixed;
-			background-image: url("images/overlay1.png"), url("../../images/header.jpg");
-			background-size: auto,							cover;
-		}
+			.items.style2.small > *:nth-child(4n + 1) {
+				border-left-width: 1px;
+			}
 
-			.main.style2 a {
-				border-bottom-color: rgba(255, 255, 255, 0.5);
+			.items.style2.small > * {
+				padding: 2.1875rem 2.1875rem 0.1875rem 2.1875rem ;
+				width: 33.33333%;
 			}
 
-				.main.style2 a:hover {
-					color: #ffffff;
+				.items.style2.small > *:nth-child(-n + 3) {
+					border-top-width: 0;
 				}
 
-			.main.style2 h1, .main.style2 h2, .main.style2 h3, .main.style2 h4, .main.style2 h5, .main.style2 h6, .main.style2 strong, .main.style2 b {
-				color: #ffffff;
-			}
+				.items.style2.small > *:nth-child(3n + 1) {
+					border-left-width: 0;
+				}
 
-			.main.style2 header p {
-				color: #ffffff;
+		}
+
+		@media screen and (max-width: 980px) {
+
+			.items.style2.medium > *:nth-child(-n + 3) {
+				border-top-width: 1px;
 			}
 
-			.main.style2 header.major:after {
-				background: #ffffff;
+			.items.style2.medium > *:nth-child(3n + 1) {
+				border-left-width: 1px;
 			}
 
-			.main.style2 input[type="submit"],
-			.main.style2 input[type="reset"],
-			.main.style2 input[type="button"],
-			.main.style2 button,
-			.main.style2 .button {
-				box-shadow: inset 0 0 0 1px #ffffff;
-				color: #ffffff !important;
+			.items.style2.medium > * {
+				padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+				width: 50%;
 			}
 
-				.main.style2 input[type="submit"]:hover,
-				.main.style2 input[type="reset"]:hover,
-				.main.style2 input[type="button"]:hover,
-				.main.style2 button:hover,
-				.main.style2 .button:hover {
-					background-color: rgba(255, 255, 255, 0.125);
+				.items.style2.medium > *:nth-child(-n + 2) {
+					border-top-width: 0;
 				}
 
-				.main.style2 input[type="submit"]:active,
-				.main.style2 input[type="reset"]:active,
-				.main.style2 input[type="button"]:active,
-				.main.style2 button:active,
-				.main.style2 .button:active {
-					background-color: rgba(255, 255, 255, 0.25);
+				.items.style2.medium > *:nth-child(2n + 1) {
+					border-left-width: 0;
 				}
 
-				.main.style2 input[type="submit"].special,
-				.main.style2 input[type="reset"].special,
-				.main.style2 input[type="button"].special,
-				.main.style2 button.special,
-				.main.style2 .button.special {
-					background-color: #ffffff;
-					box-shadow: inset 0 0 0 1px #ffffff !important;
-					color: #333 !important;
+			.items.style2.small > *:nth-child(-n + 3) {
+				border-top-width: 1px;
+			}
+
+			.items.style2.small > *:nth-child(3n + 1) {
+				border-left-width: 1px;
+			}
+
+			.items.style2.small > * {
+				padding: 3.5rem 3.5rem 1.5rem 3.5rem ;
+				width: 50%;
+			}
+
+				.items.style2.small > *:nth-child(-n + 2) {
+					border-top-width: 0;
 				}
 
-					.main.style2 input[type="submit"].special:hover,
-					.main.style2 input[type="reset"].special:hover,
-					.main.style2 input[type="button"].special:hover,
-					.main.style2 button.special:hover,
-					.main.style2 .button.special:hover {
-						background-color: rgba(255, 255, 255, 0.125) !important;
-						color: #ffffff !important;
-					}
+				.items.style2.small > *:nth-child(2n + 1) {
+					border-left-width: 0;
+				}
 
-					.main.style2 input[type="submit"].special:active,
-					.main.style2 input[type="reset"].special:active,
-					.main.style2 input[type="button"].special:active,
-					.main.style2 button.special:active,
-					.main.style2 .button.special:active {
-						background-color: rgba(255, 255, 255, 0.25) !important;
-					}
+		}
 
-			.main.style2 ul.major-icons li .icon {
-				border-color: #ffffff;
+		@media screen and (max-width: 480px) {
+
+			.items.style2.big > *:nth-child(-n + 2) {
+				border-top-width: 1px;
 			}
 
-			.main.style2 .icon.major {
-				color: #ffffff;
+			.items.style2.big > *:nth-child(2n + 1) {
+				border-left-width: 1px;
 			}
 
-/* Header */
+			.items.style2.big > * {
+				padding: 2.625rem 2.625rem 0.625rem 2.625rem ;
+				width: 100%;
+			}
 
-	#header {
-		padding: 9em 0 9em 0 ;
-		background-color: #4686a0;
-		color: rgba(255, 255, 255, 0.75);
-		background-attachment: fixed,							fixed,							fixed;
-		background-image: url("images/overlay2.png"), url("images/overlay3.svg"), linear-gradient(45deg, #9dc66b 5%, #4fa49a 30%, #4361c2);
-		background-position: top left,						center center,					center center;
-		background-size: auto,							cover,							cover;
-		overflow: hidden;
-		position: relative;
-		text-align: center;
-	}
+				.items.style2.big > *:nth-child(-n + 1) {
+					border-top-width: 0;
+				}
 
-		#header a {
-			border-bottom-color: rgba(255, 255, 255, 0.5);
-		}
+				.items.style2.big > *:nth-child(1n + 1) {
+					border-left-width: 0;
+				}
 
-			#header a:hover {
-				color: #ffffff;
+			.items.style2.medium > *:nth-child(-n + 2) {
+				border-top-width: 1px;
 			}
 
-		#header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header strong, #header b {
-			color: #ffffff;
-		}
+			.items.style2.medium > *:nth-child(2n + 1) {
+				border-left-width: 1px;
+			}
 
-		#header header p {
-			color: #ffffff;
-		}
+			.items.style2.medium > * {
+				padding: 2.625rem 2.625rem 0.625rem 2.625rem ;
+				width: 100%;
+			}
 
-		#header header.major:after {
-			background: #ffffff;
-		}
+				.items.style2.medium > *:nth-child(-n + 1) {
+					border-top-width: 0;
+				}
 
-		#header input[type="submit"],
-		#header input[type="reset"],
-		#header input[type="button"],
-		#header button,
-		#header .button {
-			box-shadow: inset 0 0 0 1px #ffffff;
-			color: #ffffff !important;
-		}
+				.items.style2.medium > *:nth-child(1n + 1) {
+					border-left-width: 0;
+				}
 
-			#header input[type="submit"]:hover,
-			#header input[type="reset"]:hover,
-			#header input[type="button"]:hover,
-			#header button:hover,
-			#header .button:hover {
-				background-color: rgba(255, 255, 255, 0.125);
+			.items.style2.small > *:nth-child(-n + 2) {
+				border-top-width: 1px;
 			}
 
-			#header input[type="submit"]:active,
-			#header input[type="reset"]:active,
-			#header input[type="button"]:active,
-			#header button:active,
-			#header .button:active {
-				background-color: rgba(255, 255, 255, 0.25);
+			.items.style2.small > *:nth-child(2n + 1) {
+				border-left-width: 1px;
 			}
 
-			#header input[type="submit"].special,
-			#header input[type="reset"].special,
-			#header input[type="button"].special,
-			#header button.special,
-			#header .button.special {
-				background-color: #ffffff;
-				box-shadow: inset 0 0 0 1px #ffffff !important;
-				color: #4686a0 !important;
+			.items.style2.small > * {
+				padding: 2.625rem 2.625rem 0.625rem 2.625rem ;
+				width: 100%;
 			}
 
-				#header input[type="submit"].special:hover,
-				#header input[type="reset"].special:hover,
-				#header input[type="button"].special:hover,
-				#header button.special:hover,
-				#header .button.special:hover {
-					background-color: rgba(255, 255, 255, 0.125) !important;
-					color: #ffffff !important;
+				.items.style2.small > *:nth-child(-n + 1) {
+					border-top-width: 0;
 				}
 
-				#header input[type="submit"].special:active,
-				#header input[type="reset"].special:active,
-				#header input[type="button"].special:active,
-				#header button.special:active,
-				#header .button.special:active {
-					background-color: rgba(255, 255, 255, 0.25) !important;
+				.items.style2.small > *:nth-child(1n + 1) {
+					border-left-width: 0;
 				}
 
-		#header ul.major-icons li .icon {
-			border-color: #ffffff;
 		}
 
-		#header .icon.major {
-			color: #ffffff;
-		}
+/* Items (style3) */
 
-		#header h1 {
-			margin: 0;
-		}
+	.items.style3 {
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		-moz-flex-wrap: wrap;
+		-webkit-flex-wrap: wrap;
+		-ms-flex-wrap: wrap;
+		flex-wrap: wrap;
+		-moz-justify-content: center;
+		-webkit-justify-content: center;
+		-ms-justify-content: center;
+		justify-content: center;
+		margin: 3rem 0;
+		position: relative;
+	}
 
-		#header p {
-			margin: 1em 0 0 0;
+		.items.style3 > * {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
 		}
 
-		#header .actions {
-			margin: 2.5em 0 0 0;
-			position: relative;
+		.items.style3.big > * {
+			padding: 1.75rem 1.75rem 0.1rem 1.75rem ;
+			width: 50%;
 		}
 
-			#header .actions:after {
-				background: #ffffff;
-				content: '';
-				height: 100vh;
-				left: 50%;
-				position: absolute;
-				top: 100%;
-				width: 1px;
-			}
-
-		#header .inner {
-			-moz-transition: -moz-transform 1.5s ease, opacity 2s ease;
-			-webkit-transition: -webkit-transform 1.5s ease, opacity 2s ease;
-			-ms-transition: -ms-transform 1.5s ease, opacity 2s ease;
-			transition: transform 1.5s ease, opacity 2s ease;
-			-moz-transition-delay: 0.25s;
-			-webkit-transition-delay: 0.25s;
-			-ms-transition-delay: 0.25s;
-			transition-delay: 0.25s;
-			-moz-transform: scale(1);
-			-webkit-transform: scale(1);
-			-ms-transform: scale(1);
-			transform: scale(1);
-			opacity: 1;
-			position: relative;
-			z-index: 1;
+		.items.style3.medium > * {
+			padding: 1.09375rem 1.09375rem 0.1rem 1.09375rem ;
+			width: 33.33333%;
 		}
 
-			#header .inner .actions {
-				-moz-transition: -moz-transform 1.25s ease;
-				-webkit-transition: -webkit-transform 1.25s ease;
-				-ms-transition: -ms-transform 1.25s ease;
-				transition: transform 1.25s ease;
-				-moz-transition-delay: 1s;
-				-webkit-transition-delay: 1s;
-				-ms-transition-delay: 1s;
-				transition-delay: 1s;
-				-moz-transform: translateY(0);
-				-webkit-transform: translateY(0);
-				-ms-transform: translateY(0);
-				transform: translateY(0);
-				opacity: 1;
-			}
-
-		#header:after {
-			-moz-transition: opacity 1s ease;
-			-webkit-transition: opacity 1s ease;
-			-ms-transition: opacity 1s ease;
-			transition: opacity 1s ease;
-			background-image: linear-gradient(45deg, #4fa49a, #4361c2);
-			content: '';
-			height: 100%;
-			left: 0;
-			opacity: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
+		.items.style3.small > * {
+			padding: 0.65625rem 0.65625rem 0.1rem 0.65625rem ;
+			width: 25%;
 		}
 
-	body.is-loading #header .inner {
-		-moz-transform: scale(1.05);
-		-webkit-transform: scale(1.05);
-		-ms-transform: scale(1.05);
-		transform: scale(1.05);
-		opacity: 0;
-	}
+		@media screen and (max-width: 1280px) {
+
+			.items.style3.small > * {
+				padding: 1.09375rem 1.09375rem 0.1rem 1.09375rem ;
+				width: 33.33333%;
+			}
 
-		body.is-loading #header .inner .actions {
-			-moz-transform: translateY(30em);
-			-webkit-transform: translateY(30em);
-			-ms-transform: translateY(30em);
-			transform: translateY(30em);
-			opacity: 0;
 		}
 
-	body.is-loading #header:after {
-		opacity: 1;
-	}
+		@media screen and (max-width: 980px) {
 
-/* Footer */
+			.items.style3.medium > * {
+				padding: 1.75rem 1.75rem 0.1rem 1.75rem ;
+				width: 50%;
+			}
 
-	#footer {
-		padding: 6em 0 6em 0 ;
-		background-color: #4686a0;
-		color: rgba(255, 255, 255, 0.75);
-		background-attachment: fixed,							fixed,							fixed;
-		background-image: url("images/overlay2.png"), url("images/overlay4.svg"), linear-gradient(45deg, #4361c2, #4fa49a 50%, #9dc66b 95%);
-		background-position: top left,						center center,					center center;
-		background-size: auto,							cover,							cover;
-		text-align: center;
-	}
+			.items.style3.small > * {
+				padding: 1.75rem 1.75rem 0.1rem 1.75rem ;
+				width: 50%;
+			}
 
-		#footer a {
-			border-bottom-color: rgba(255, 255, 255, 0.5);
 		}
 
-			#footer a:hover {
-				color: #ffffff;
+		@media screen and (max-width: 736px) {
+
+			.items.style3 {
+				margin: 2rem 0;
 			}
 
-		#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6, #footer strong, #footer b {
-			color: #ffffff;
 		}
 
-		#footer header p {
-			color: #ffffff;
-		}
+		@media screen and (max-width: 480px) {
 
-		#footer header.major:after {
-			background: #ffffff;
-		}
+			.items.style3.big > * {
+				padding: 1.3125rem 1.3125rem 0.1rem 1.3125rem ;
+				width: 100%;
+			}
 
-		#footer input[type="submit"],
-		#footer input[type="reset"],
-		#footer input[type="button"],
-		#footer button,
-		#footer .button {
-			box-shadow: inset 0 0 0 1px #ffffff;
-			color: #ffffff !important;
-		}
+			.items.style3.medium > * {
+				padding: 1.3125rem 1.3125rem 0.1rem 1.3125rem ;
+				width: 100%;
+			}
 
-			#footer input[type="submit"]:hover,
-			#footer input[type="reset"]:hover,
-			#footer input[type="button"]:hover,
-			#footer button:hover,
-			#footer .button:hover {
-				background-color: rgba(255, 255, 255, 0.125);
+			.items.style3.small > * {
+				padding: 1.3125rem 1.3125rem 0.1rem 1.3125rem ;
+				width: 100%;
 			}
 
-			#footer input[type="submit"]:active,
-			#footer input[type="reset"]:active,
-			#footer input[type="button"]:active,
-			#footer button:active,
-			#footer .button:active {
-				background-color: rgba(255, 255, 255, 0.25);
+			.items.style3.big > *, .items.style3.medium > *, .items.style3.small > * {
+				padding-left: 0;
+				padding-right: 0;
 			}
 
-			#footer input[type="submit"].special,
-			#footer input[type="reset"].special,
-			#footer input[type="button"].special,
-			#footer button.special,
-			#footer .button.special {
-				background-color: #ffffff;
-				box-shadow: inset 0 0 0 1px #ffffff !important;
-				color: #4686a0 !important;
+			.items.style3.big > :first-child, .items.style3.medium > :first-child, .items.style3.small > :first-child {
+				padding-top: 0;
 			}
 
-				#footer input[type="submit"].special:hover,
-				#footer input[type="reset"].special:hover,
-				#footer input[type="button"].special:hover,
-				#footer button.special:hover,
-				#footer .button.special:hover {
-					background-color: rgba(255, 255, 255, 0.125) !important;
-					color: #ffffff !important;
-				}
+			.items.style3.big > :last-child, .items.style3.medium > :last-child, .items.style3.small > :last-child {
+				padding-bottom: 0;
+			}
 
-				#footer input[type="submit"].special:active,
-				#footer input[type="reset"].special:active,
-				#footer input[type="button"].special:active,
-				#footer button.special:active,
-				#footer .button.special:active {
-					background-color: rgba(255, 255, 255, 0.25) !important;
+				.items.style3.big > :last-child > .inner > :last-child, .items.style3.medium > :last-child > .inner > :last-child, .items.style3.small > :last-child > .inner > :last-child {
+					margin-bottom: 0;
 				}
 
-		#footer ul.major-icons li .icon {
-			border-color: #ffffff;
 		}
 
-		#footer .icon.major {
-			color: #ffffff;
+	.items.style1 > * {
+		border-color: rgba(0, 0, 0, 0.2);
+	}
+
+	.items.style2 {
+		border-color: rgba(0, 0, 0, 0.2);
+	}
+
+		.items.style2 > * {
+			border-color: rgba(0, 0, 0, 0.2);
 		}
 
-		#footer .icons {
-			margin: 0;
+/* Index */
+
+	.index > * {
+		padding: 3rem 0 1rem 0 ;
+		display: -moz-flex;
+		display: -webkit-flex;
+		display: -ms-flex;
+		display: flex;
+		border-top: solid 1px;
+	}
+
+		.index > * > header {
+			-moz-flex-grow: 0;
+			-webkit-flex-grow: 0;
+			-ms-flex-grow: 0;
+			flex-grow: 0;
+			-moz-flex-shrink: 0;
+			-webkit-flex-shrink: 0;
+			-ms-flex-shrink: 0;
+			flex-shrink: 0;
+			width: 15rem;
 		}
 
-		#footer .copyright {
-			font-size: 0.8em;
-			list-style: none;
-			margin: 2em 0 0 0;
-			padding: 0;
+		.index > * > .content {
+			-moz-flex-grow: 1;
+			-webkit-flex-grow: 1;
+			-ms-flex-grow: 1;
+			flex-grow: 1;
+			-moz-flex-shrink: 1;
+			-webkit-flex-shrink: 1;
+			-ms-flex-shrink: 1;
+			flex-shrink: 1;
 		}
 
-			#footer .copyright li {
-				border-left: solid 1px;
-				display: inline-block;
-				line-height: 1em;
-				margin-left: 1em;
-				padding: 0 0 0 1em;
-			}
+	.index > :first-child {
+		border-top: 0;
+	}
 
-				#footer .copyright li:first-child {
-					border-left: 0;
-					margin-left: 0;
-					padding: 0;
-				}
+	@media screen and (max-width: 980px) {
 
-/* XLarge */
+		.index > * > header {
+			width: 11rem;
+		}
 
-	@media screen and (max-width: 1680px) {
+	}
 
-		/* Basic */
+	@media screen and (max-width: 736px) {
 
-			body, input, select, textarea {
-				font-size: 14pt;
-			}
+		.index > * > header {
+			width: 10rem;
+		}
+
+	}
+
+	@media screen and (max-width: 480px) {
 
-		/* Header */
+		.index > * {
+			-moz-flex-direction: column;
+			-webkit-flex-direction: column;
+			-ms-flex-direction: column;
+			flex-direction: column;
+		}
 
-			#header {
-				padding: 6em 0 6em 0 ;
+			.index > * > header {
+				width: 100%;
 			}
 
 	}
 
-/* Large */
+	.index > * {
+		border-top-color: rgba(0, 0, 0, 0.2);
+	}
+
+/* Wrapper */
 
-	@media screen and (max-width: 1140px) {
+	#wrapper {
+		background-color: inherit;
+		width: 100%;
+		overflow-x: hidden;
+	}
 
-		/* Basic */
+		#wrapper > .invert {
+			background-color: #000000;
+			color: #ffffff;
+		}
 
-			body, input, select, textarea {
-				font-size: 13pt;
+			#wrapper > .invert input, #wrapper > .invert select, #wrapper > .invert textarea {
+				color: #ffffff;
 			}
 
-			h1 br, h2 br, h3 br, h4 br, h5 br, h6 br {
-				display: none;
+			#wrapper > .invert a {
+				color: #ffffff;
 			}
 
-		/* List */
+				#wrapper > .invert a:hover {
+					color: #47D3E5;
+				}
 
-			ul.major-icons li {
-				padding: 2em;
+			#wrapper > .invert strong, #wrapper > .invert b {
+				color: #ffffff;
 			}
 
-				ul.major-icons li .icon {
-					height: 8em;
-					line-height: 8em;
-					width: 8em;
-				}
+			#wrapper > .invert h1, #wrapper > .invert h2, #wrapper > .invert h3, #wrapper > .invert h4, #wrapper > .invert h5, #wrapper > .invert h6 {
+				color: #ffffff;
+			}
 
-		/* Main */
+			#wrapper > .invert blockquote {
+				border-left-color: white;
+			}
 
-			.main {
-				padding: 4em 0 2em 0 ;
+			#wrapper > .invert code {
+				background: rgba(255, 255, 255, 0.125);
+				border-color: white;
 			}
 
-				.main.style2 {
-					background-attachment: scroll;
-				}
+			#wrapper > .invert hr {
+				border-bottom-color: white;
+			}
 
-		/* Header */
+			#wrapper > .invert .box {
+				border-color: white;
+			}
 
-			#header {
-				padding: 5em 0 5em 0 ;
-				background-attachment: scroll;
+			#wrapper > .invert input[type="submit"],
+			#wrapper > .invert input[type="reset"],
+			#wrapper > .invert input[type="button"],
+			#wrapper > .invert button,
+			#wrapper > .invert .button {
+				background-color: transparent;
+				box-shadow: inset 0 0 0 1px white;
+				color: #ffffff !important;
 			}
 
-				#header br {
-					display: inline;
+				#wrapper > .invert input[type="submit"]:hover,
+				#wrapper > .invert input[type="reset"]:hover,
+				#wrapper > .invert input[type="button"]:hover,
+				#wrapper > .invert button:hover,
+				#wrapper > .invert .button:hover {
+					box-shadow: inset 0 0 0 1px #47D3E5;
+					color: #47D3E5 !important;
 				}
 
-		/* Footer */
-
-			#footer {
-				padding: 4em 0 4em 0 ;
-				background-attachment: scroll;
-			}
+				#wrapper > .invert input[type="submit"]:active,
+				#wrapper > .invert input[type="reset"]:active,
+				#wrapper > .invert input[type="button"]:active,
+				#wrapper > .invert button:active,
+				#wrapper > .invert .button:active {
+					background-color: rgba(71, 211, 229, 0.2);
+					box-shadow: inset 0 0 0 1px #47D3E5;
+					color: #47D3E5 !important;
+				}
 
-	}
+				#wrapper > .invert input[type="submit"].special,
+				#wrapper > .invert input[type="reset"].special,
+				#wrapper > .invert input[type="button"].special,
+				#wrapper > .invert button.special,
+				#wrapper > .invert .button.special {
+					background-color: #ffffff;
+					box-shadow: none;
+					color: #000000 !important;
+				}
 
-/* Medium */
+					#wrapper > .invert input[type="submit"].special:hover,
+					#wrapper > .invert input[type="reset"].special:hover,
+					#wrapper > .invert input[type="button"].special:hover,
+					#wrapper > .invert button.special:hover,
+					#wrapper > .invert .button.special:hover {
+						background-color: #47D3E5;
+					}
 
-	@media screen and (max-width: 980px) {
+					#wrapper > .invert input[type="submit"].special:active,
+					#wrapper > .invert input[type="reset"].special:active,
+					#wrapper > .invert input[type="button"].special:active,
+					#wrapper > .invert button.special:active,
+					#wrapper > .invert .button.special:active {
+						background-color: #1ebdd1;
+					}
 
-		/* List */
+			#wrapper > .invert label {
+				color: #ffffff;
+			}
 
-			ul.major-icons li {
-				padding: 2em;
+			#wrapper > .invert input[type="text"],
+			#wrapper > .invert input[type="password"],
+			#wrapper > .invert input[type="email"],
+			#wrapper > .invert input[type="tel"],
+			#wrapper > .invert input[type="search"],
+			#wrapper > .invert input[type="url"],
+			#wrapper > .invert select,
+			#wrapper > .invert textarea {
+				border-color: white;
 			}
 
-				ul.major-icons li .icon {
-					height: 7em;
-					line-height: 7em;
-					width: 7em;
+				#wrapper > .invert input[type="text"]:focus,
+				#wrapper > .invert input[type="password"]:focus,
+				#wrapper > .invert input[type="email"]:focus,
+				#wrapper > .invert input[type="tel"]:focus,
+				#wrapper > .invert input[type="search"]:focus,
+				#wrapper > .invert input[type="url"]:focus,
+				#wrapper > .invert select:focus,
+				#wrapper > .invert textarea:focus {
+					border-color: #47D3E5;
+					box-shadow: 0 0 0 1px #47D3E5;
 				}
 
-		/* Main */
-
-			.main {
-				padding: 5em 3em 3em 3em ;
+			#wrapper > .invert .select-wrapper:before {
+				color: white;
 			}
 
-		/* Header */
-
-			#header {
-				padding: 8em 3em 8em 3em ;
+			#wrapper > .invert input[type="checkbox"] + label,
+			#wrapper > .invert input[type="radio"] + label {
+				color: #ffffff;
 			}
 
-		/* Footer */
+				#wrapper > .invert input[type="checkbox"] + label:before,
+				#wrapper > .invert input[type="radio"] + label:before {
+					border-color: white;
+				}
 
-			#footer {
-				padding: 5em 3em 5em 3em ;
+			#wrapper > .invert input[type="checkbox"]:checked + label:before,
+			#wrapper > .invert input[type="radio"]:checked + label:before {
+				background-color: #ffffff;
+				border-color: #ffffff;
+				color: #000000;
 			}
 
-		/* One */
-
-			#one {
-				text-align: center;
+			#wrapper > .invert input[type="checkbox"]:focus + label:before,
+			#wrapper > .invert input[type="radio"]:focus + label:before {
+				border-color: #47D3E5;
+				box-shadow: 0 0 0 1px #47D3E5;
 			}
 
-		/* Two */
-
-			#two {
-				text-align: center;
+			#wrapper > .invert ::-webkit-input-placeholder {
+				color: #ffffff !important;
 			}
 
-	}
-
-/* Small */
+			#wrapper > .invert :-moz-placeholder {
+				color: #ffffff !important;
+			}
 
-	@media screen and (max-width: 736px) {
+			#wrapper > .invert ::-moz-placeholder {
+				color: #ffffff !important;
+			}
 
-		/* Basic */
+			#wrapper > .invert :-ms-input-placeholder {
+				color: #ffffff !important;
+			}
 
-			body, input, select, textarea {
-				font-size: 12pt;
+			#wrapper > .invert .formerize-placeholder {
+				color: #ffffff !important;
 			}
 
-			h1 {
-				font-size: 1.75em;
+			#wrapper > .invert .icon.style2:before {
+				box-shadow: inset 0 0 0 1px white;
 			}
 
-			h2 {
-				font-size: 1.5em;
+			#wrapper > .invert a.icon.style2:hover:before {
+				box-shadow: inset 0 0 0 1px #47D3E5;
+				color: #47D3E5;
 			}
 
-			h3 {
-				font-size: 1.1em;
+			#wrapper > .invert a.icon.style2:active:before {
+				background-color: rgba(71, 211, 229, 0.1);
+				box-shadow: inset 0 0 0 1px #47D3E5;
+				color: #47D3E5;
 			}
 
-			h4 {
-				font-size: 1em;
+			#wrapper > .invert ul.alt li {
+				border-top-color: white;
 			}
 
-		/* List */
+			#wrapper > .invert header p {
+				color: #ffffff;
+			}
 
-			ul.major-icons li {
-				padding: 1.5em;
+			#wrapper > .invert table tbody tr {
+				border-color: white;
 			}
 
-				ul.major-icons li .icon {
-					height: 5em;
-					line-height: 5em;
-					width: 5em;
+				#wrapper > .invert table tbody tr:nth-child(2n + 1) {
+					background-color: rgba(255, 255, 255, 0.125);
 				}
 
-					ul.major-icons li .icon:before {
-						font-size: 42px;
-					}
-
-		/* Icon */
+				#wrapper > .invert table tbody tr.alt {
+					background-color: rgba(255, 255, 255, 0.125) !important;
+				}
 
-			.icon.major {
-				margin: 0 0 1em 0;
+			#wrapper > .invert table th {
+				color: #ffffff;
 			}
 
-		/* Button */
+			#wrapper > .invert table thead {
+				border-bottom-color: white;
+			}
 
-			input[type="submit"],
-			input[type="reset"],
-			input[type="button"],
-			button,
-			.button {
-				height: 3em;
-				line-height: 3em;
+			#wrapper > .invert table tfoot {
+				border-top-color: white;
 			}
 
-		/* Main */
+			#wrapper > .invert table.alt tbody tr td {
+				border-color: white;
+			}
 
-			.main {
-				padding: 3em 1.5em 1em 1.5em ;
+			#wrapper > .invert table.uniform tbody tr:nth-child(2n + 1) {
+				background-color: transparent;
 			}
 
-		/* Header */
+			#wrapper > .invert .banner .image {
+				background-color: rgba(255, 255, 255, 0.125);
+			}
 
-			#header {
-				padding: 4em 3em 4em 3em ;
+			#wrapper > .invert .banner.style4 .image {
+				border-color: white;
+				background-color: white;
+				border-width: 1px;
 			}
 
-				#header .actions {
-					margin: 2em 0 0 0;
+				#wrapper > .invert .banner.style4 .image:before {
+					background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='11' y='12' width='42' height='8' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+					border-color: white;
+					width: calc(100% + 2px);
+					margin-left: -1px;
 				}
 
-		/* Footer */
+				#wrapper > .invert .banner.style4 .image:after {
+					background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Ccircle cx='32' cy='16' r='14' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+					border-color: white;
+					width: calc(100% + 2px);
+					margin-left: -1px;
+				}
 
-			#footer {
-				padding: 3em 1.5em 3em 1.5em ;
+			#wrapper > .invert .banner.style4.android .image:after {
+				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='6' y='4' width='52' height='24' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
 			}
 
-	}
-
-/* XSmall */
-
-	@media screen and (max-width: 480px) {
-
-		/* List */
+			#wrapper > .invert .spotlight .image {
+				background-color: rgba(255, 255, 255, 0.125);
+			}
 
-			ul.actions {
-				margin: 0 0 2em 0;
+			#wrapper > .invert .spotlight.style3 .image {
+				border-color: white;
+				background-color: white;
+				border-width: 1px;
 			}
 
-				ul.actions li {
-					display: block;
-					padding: 1em 0 0 0;
-					text-align: center;
-					width: 100%;
+				#wrapper > .invert .spotlight.style3 .image:before {
+					background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='11' y='12' width='42' height='8' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+					border-color: white;
+					width: calc(100% + 2px);
+					margin-left: -1px;
 				}
 
-					ul.actions li:first-child {
-						padding-top: 0;
-					}
-
-					ul.actions li > * {
-						margin: 0 !important;
-						width: 100%;
-					}
-
-						ul.actions li > *.icon:before {
-							margin-left: -2em;
-						}
-
-				ul.actions.small li {
-					padding: 0.5em 0 0 0;
+				#wrapper > .invert .spotlight.style3 .image:after {
+					background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Ccircle cx='32' cy='16' r='14' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
+					border-color: white;
+					width: calc(100% + 2px);
+					margin-left: -1px;
 				}
 
-					ul.actions.small li:first-child {
-						padding-top: 0;
-					}
-
-		/* Button */
-
-			input[type="submit"],
-			input[type="reset"],
-			input[type="button"],
-			.button {
-				padding: 0;
+			#wrapper > .invert .spotlight.style3.android .image:after {
+				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='32px' viewBox='0 0 64 32' zoomAndPan='disable'%3E%3Cstyle%3Erect %7Bfill: transparent%3B stroke: white%3B stroke-width: 1px%3B %7D%3C/style%3E%3Crect rx='4' ry='4' x='6' y='4' width='52' height='24' vector-effect='non-scaling-stroke' /%3E%3C/svg%3E");
 			}
 
-		/* Main */
-
-			.main {
-				padding: 2em 1.5em 0.1em 1.5em ;
+			#wrapper > .invert .gallery article .image {
+				background-color: rgba(255, 255, 255, 0.125);
 			}
 
-		/* Header */
-
-			#header {
-				padding: 4em 2em 4em 2em ;
+			#wrapper > .invert .items.style1 > * {
+				border-color: white;
 			}
 
-				#header br {
-					display: none;
-				}
-
-		/* Footer */
-
-			#footer {
-				padding: 2em 1.5em 2em 1.5em ;
+			#wrapper > .invert .items.style2 {
+				border-color: white;
 			}
 
-				#footer .copyright {
-					margin: 1.5em 0 0 0;
+				#wrapper > .invert .items.style2 > * {
+					border-color: white;
 				}
 
-					#footer .copyright li {
-						border: 0;
-						display: block;
-						margin: 1em 0 0 0;
-						padding: 0;
-					}
-
-						#footer .copyright li:first-child {
-							margin-top: 0;
-						}
+			#wrapper > .invert .index > * {
+				border-top-color: white;
+			}
 
-	}
+		#wrapper > .color1 {
+			background-color: #30363d;
+		}
 
-/* XXSmall */
+		#wrapper > .color2 {
+			background-color: #db8992;
+		}
 
-	@media screen and (max-width: 320px) {
+		#wrapper > .color3 {
+			background-color: #ab7aad;
+		}
 
-		/* Basic */
+		#wrapper > .color4 {
+			background-color: #897cad;
+		}
 
-			html, body {
-				min-width: 320px;
-			}
+		#wrapper > .color5 {
+			background-color: #7794ce;
+		}
 
-		/* Main */
+		#wrapper > .color6 {
+			background-color: #64abb4;
+		}
 
-			.main {
-				padding: 2em 1em 0.1em 1em ;
-			}
+		#wrapper > .color7 {
+			background-color: #6ba78c;
+		}
 
-		/* Header */
+		#wrapper.divided > * {
+			box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.075);
+		}
 
-			#header {
-				padding: 3em 1em 3em 1em ;
+			#wrapper.divided > *:first-child {
+				box-shadow: none !important;
 			}
 
-		/* Footer */
+		#wrapper.divided > .invert {
+			box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.125);
+		}
 
-			#footer {
-				padding: 2em 1em 2em 1em ;
+			#wrapper.divided > .invert:first-child {
+				box-shadow: none !important;
 			}
-
-	}
diff --git a/assets/js/demo.js b/assets/js/demo.js
new file mode 100644
index 0000000..01ede5a
--- /dev/null
+++ b/assets/js/demo.js
@@ -0,0 +1,563 @@
+/*
+	Story by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+
+	Note: Only needed for demo purposes. Delete for production sites.
+*/
+
+(function($) {
+
+	var $window = $(window);
+
+	// Styles.
+		$(
+			'<style>' +
+				'.demo-animate-all:not(.gallery), .demo-animate-all:not(.gallery) *, .demo-animate-all:not(.gallery) *:before, .demo-animate-all:not(.gallery) *:after { transition: all 0.5s ease-in-out; }' +
+				'.demo-controls .property .classes { display: none; }' +
+				'.demo-controls .property[data-requires] { display: none; }' +
+				'.demo-controls .property[data-requires].active { display: inline; }' +
+				'.demo-controls .property .tooltip { position: relative; }' +
+				'.demo-controls .property .tooltip:before { content: \'Click to change!\'; font-size: 0.7rem; position: absolute; bottom: 100%; left: 0; background: #47D3E5; color: #ffffff; line-height: 1; white-space: nowrap; font-weight: bold; border-radius: 0.125rem; padding: 0.325rem 0.425rem; animation: demo-controls-tooltip 1.5s forwards; animation-delay: 1s; opacity: 0; }' +
+				'.demo-controls .property .tooltip:after { content: \'\'; position: absolute; bottom: calc(100% - 0.25rem); left: 0.5rem; border-left: solid 0.5rem transparent; border-right: solid 0.5rem transparent; border-top: solid 0.5rem #47D3E5; width: 0.5rem; height: 0.5rem; animation: demo-controls-tooltip 1.5s forwards; animation-delay: 1s; opacity: 0; }' +
+				'@keyframes demo-controls-tooltip {' +
+					'0% { opacity: 0; transform: translateY(0); }' +
+					'10% { opacity: 1; transform: translateY(0.125rem); }' +
+					'20% { opacity: 1; transform: translateY(-0.125rem); }' +
+					'30% { opacity: 1; transform: translateY(0.125rem); }' +
+					'40% { opacity: 1; transform: translateY(-0.125rem); }' +
+					'50% { opacity: 1; transform: translateY(0.125rem); }' +
+					'60% { opacity: 1; transform: translateY(0); }' +
+					'90% { opacity: 1; }' +
+					'100% { opacity: 0; }' +
+				'}' +
+			'</style>'
+		).appendTo($('head'));
+
+	// Functions.
+		$.fn.demo_controls = function(styles, userOptions) {
+
+			var $this = $(this),
+				$styleProperty, $stylePropertyClasses,
+				$controls, $x, $y, $z,
+				options,
+				current, i, j, k, s, n, count;
+
+			// No elements?
+				if (this.length == 0)
+					return $this;
+
+			// Multiple elements?
+				if (this.length > 1) {
+
+					for (var i=0; i < this.length; i++)
+						$(this[i]).demo_controls(styles, userOptions);
+
+					return $this;
+
+				}
+
+			// Options.
+				options = $.extend({
+					target: null,
+					palette: true
+				}, userOptions);
+
+			// Controls.
+				if (styles) {
+
+					$controls = $(
+						'<span class="demo-controls">' +
+							'<span class="property" data-name="style">' +
+								'<a href="#" class="title tooltip">style</a>' +
+								'<span class="classes"></span>' + (options.palette ? ', ' : ' ') +
+							'</span>' +
+							(options.palette ?
+								'<span class="property active" data-name="scheme">' +
+									'<a href="#" class="title">scheme</a>' +
+									'<span class="classes">' +
+										'<span data-class="-" class="active">default</span>' +
+										'<span data-class="invert">invert</span>' +
+									'</span>, ' +
+								'</span>' +
+								'<span class="property active" data-name="color">' +
+									'<a href="#" class="title">color</a>' +
+									'<span class="classes">' +
+										'<span data-class="-" class="active">default</span>' +
+										'<span data-class="color1">color1</span>' +
+										'<span data-class="color2">color2</span>' +
+										'<span data-class="color3">color3</span>' +
+										'<span data-class="color4">color4</span>' +
+										'<span data-class="color5">color5</span>' +
+										'<span data-class="color6">color6</span>' +
+										'<span data-class="color7">color7</span>' +
+									'</span>, ' +
+								'</span>'
+							: '') +
+						'</span>'
+					);
+
+				}
+				else {
+
+					$controls = $(
+						'<span class="demo-controls">' +
+							(options.palette ?
+								'<span class="property active" data-name="scheme">' +
+									'<a href="#" class="title">scheme</a>' +
+									'<span class="classes">' +
+										'<span data-class="-" class="active">default</span>' +
+										'<span data-class="invert">invert</span>' +
+									'</span> and ' +
+								'</span>' +
+								'<span class="property active" data-name="color">' +
+									'<a href="#" class="title">color</a>' +
+									'<span class="classes">' +
+										'<span data-class="-" class="active">default</span>' +
+										'<span data-class="color1">color1</span>' +
+										'<span data-class="color2">color2</span>' +
+										'<span data-class="color3">color3</span>' +
+										'<span data-class="color4">color4</span>' +
+										'<span data-class="color5">color5</span>' +
+										'<span data-class="color6">color6</span>' +
+										'<span data-class="color7">color7</span>' +
+									'</span>' +
+								'</span>'
+							: '') +
+						'</span>'
+					);
+
+				}
+
+			// Target.
+				switch (options.target) {
+
+					case 'previous':
+						$this.prev().find('.demo-controls').replaceWith($controls);
+						break;
+
+					default:
+						$this.find('.demo-controls').replaceWith($controls);
+						break;
+
+				}
+
+			// Styles.
+				if (styles) {
+
+					$styleProperty = $controls.find('.property[data-name="style"]');
+					$stylePropertyClasses = $styleProperty.children('.classes');
+
+					for (i in styles) {
+
+						current = false;
+						count = Object.keys(styles[i]).length;
+						n = 1;
+
+						// Add to style property.
+							$x = $('<span data-class="' + i + '">, ' + i + '</span>')
+								.appendTo($stylePropertyClasses);
+
+							if ($this.hasClass(i)) {
+
+								$x.addClass('active');
+								current = true;
+
+							}
+
+						// Step through properties.
+							for (j in styles[i]) {
+
+								$x = $(
+									'<span class="property" data-name="' + j + '" data-requires="' + i + '">' +
+										(n == count ? '<span>and </span>' : '') +
+										'<a href="#" class="title">' + j + '</a>' +
+										'<span class="classes">' +
+										'</span>' + (n < count ? ', ' : '') +
+									'</span>'
+								).appendTo($controls);
+
+								$y = $x.children('.classes');
+
+								if (current)
+									$x.addClass('active');
+
+								for (k in styles[i][j]) {
+
+									$z = $('<span data-class="' + k + '">, ' + styles[i][j][k].replace('*', '') + '</span>')
+										.appendTo($y);
+
+									if (styles[i][j][k].substr(-1, 1) == '*')
+										$z.addClass('default');
+
+									if (current
+									&&	$this.hasClass(k))
+										$z.addClass('active');
+
+								}
+
+								n++;
+
+							}
+
+					}
+
+				}
+
+			// Events.
+				$controls.on('click', 'a', function(event) {
+					event.preventDefault();
+				});
+
+				$controls.on('click', '.property.active', function(event) {
+
+					var $property = $(this);
+					var $classes = $property.find('.classes > *');
+					var $current = $classes.filter('.active');
+					var $next;
+
+					// Determine next.
+						if ($current.length == 0
+						||	$current.index() == $classes.length - 1)
+							$next = $classes.first();
+						else
+							$next = $current.next();
+
+					// Turn on animate all.
+						$this.addClass('demo-animate-all');
+
+					// Deactivate current.
+						$current.removeClass('active');
+						$this.removeClass($current.data('class'));
+
+					// Activate next.
+						$next.addClass('active');
+						$this.addClass($next.data('class'));
+
+					// Turn off animate all.
+						setTimeout(function() {
+							$this.removeClass('demo-animate-all');
+						}, 500);
+
+				});
+
+				$controls.on('click', '.property[data-name="style"]', function(event) {
+
+					var $property = $(this);
+					var $classes = $property.find('.classes > *');
+					var $current = $classes.filter('.active');
+					var $next;
+
+					// Determine next.
+						if ($current.length == 0
+						||	$current.index() == $classes.length - 1)
+							$next = $classes.first();
+						else
+							$next = $current.next();
+
+					// Turn on animate all.
+						$this.addClass('demo-animate-all');
+
+					// Deactivate current.
+						$current.removeClass('active');
+						$this.removeClass($current.data('class'));
+
+						$controls.find('.property[data-requires="' + $current.data('class') + '"]')
+							.removeClass('active');
+
+						$controls.find('.property[data-requires="' + $current.data('class') + '"] > .classes > .active').each(function() {
+
+							$(this).removeClass('active');
+
+							if ($(this).data('class') != '-')
+								$this.removeClass($(this).data('class'));
+
+						});
+
+					// Activate next.
+						$next.addClass('active');
+						$this.addClass($next.data('class'));
+
+						$controls.find('.property[data-requires="' + $next.data('class') + '"]')
+							.addClass('active');
+
+						$controls.find('.property[data-requires="' + $next.data('class') + '"] > .classes > .default').each(function() {
+
+							$(this).addClass('active');
+
+							if ($(this).data('class') != '-')
+								$this.addClass($(this).data('class'));
+
+						});
+
+					// Turn off animate all.
+						setTimeout(function() {
+							$this.removeClass('demo-animate-all');
+						}, 500);
+
+				});
+
+		};
+
+	// Elements.
+
+		// Wrappers.
+			$('.wrapper').demo_controls(null, {
+				palette: true
+			});
+
+		// Banner.
+			$('.banner').demo_controls({
+				style1: {
+					'size': {
+						'-': 'normal',
+						'fullscreen': 'fullscreen*'
+					},
+					'orientation': {
+						'orient-left': 'left*',
+						'orient-right': 'right'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style2: {
+					'size': {
+						'-': 'normal',
+						'fullscreen': 'fullscreen*'
+					},
+					'orientation': {
+						'orient-left': 'left',
+						'orient-center': 'center*',
+						'orient-right': 'right'
+					},
+					'content alignment': {
+						'content-align-left': 'left',
+						'content-align-center': 'center*',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style3: {
+					'size': {
+						'-': 'normal',
+						'fullscreen': 'fullscreen*'
+					},
+					'orientation': {
+						'orient-left': 'left',
+						'orient-right': 'right*'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style4: {
+					'size': {
+						'-': 'normal',
+						'fullscreen': 'fullscreen*'
+					},
+					'phone type': {
+						'iphone': 'iphone*',
+						'android': 'android'
+					},
+					'orientation': {
+						'orient-left': 'left',
+						'orient-right': 'right*'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style5: {
+					'size': {
+						'-': 'normal',
+						'fullscreen': 'fullscreen*'
+					},
+					'content alignment': {
+						'content-align-left': 'left',
+						'content-align-center': 'center*',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				}
+			});
+
+		// Spotlight.
+			$('.spotlight').demo_controls({
+				style1: {
+					'orientation': {
+						'orient-left': 'left',
+						'orient-right': 'right*'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left*',
+						'image-position-center': 'center',
+						'image-position-right': 'right'
+					}
+				},
+				style2: {
+					'orientation': {
+						'orient-left': 'left',
+						'orient-right': 'right*'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style3: {
+					'phone type': {
+						'iphone': 'iphone*',
+						'android': 'android'
+					},
+					'orientation': {
+						'orient-left': 'left',
+						'orient-right': 'right*'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style4: {
+					'size': {
+						'-size': 'normal',
+						'fullscreen': 'fullscreen*',
+						'halfscreen': 'halfscreen'
+					},
+					'orientation': {
+						'orient-left': 'left*',
+						'orient-center': 'center',
+						'orient-right': 'right'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+				style5: {
+					'size': {
+						'-size': 'normal',
+						'fullscreen': 'fullscreen*',
+						'halfscreen': 'halfscreen'
+					},
+					'orientation': {
+						'orient-left': 'left*',
+						'orient-center': 'center',
+						'orient-right': 'right'
+					},
+					'content alignment': {
+						'content-align-left': 'left*',
+						'content-align-center': 'center',
+						'content-align-right': 'right'
+					},
+					'image position': {
+						'image-position-left': 'left',
+						'image-position-center': 'center*',
+						'image-position-right': 'right'
+					}
+				},
+			});
+
+		// Gallery.
+			$('.gallery').demo_controls({
+				style1: {
+					'size': {
+						'small': 'small',
+						'medium': 'medium*',
+						'big': 'big'
+					}
+				},
+				style2: {
+					'size': {
+						'small': 'small',
+						'medium': 'medium*',
+						'big': 'big'
+					}
+				},
+			}, {
+				target: 'previous',
+				palette: false
+			});
+
+		// Items.
+			$('.items').demo_controls({
+				style1: {
+					'size': {
+						'small': 'small',
+						'medium': 'medium*',
+						'big': 'big'
+					}
+				},
+				style2: {
+					'size': {
+						'small': 'small',
+						'medium': 'medium*',
+						'big': 'big'
+					}
+				},
+				style3: {
+					'size': {
+						'small': 'small',
+						'medium': 'medium*',
+						'big': 'big'
+					}
+				}
+			}, {
+				target: 'previous',
+				palette: false
+			});
+
+})(jQuery);
\ No newline at end of file
diff --git a/assets/js/ie/PIE.htc b/assets/js/ie/PIE.htc
deleted file mode 100644
index ca3b547..0000000
--- a/assets/js/ie/PIE.htc
+++ /dev/null
@@ -1,96 +0,0 @@
-<!--
-PIE: CSS3 rendering for IE
-Version 1.0.0
-http://css3pie.com
-Dual-licensed for use under the Apache License Version 2.0 or the General Public License (GPL) Version 2.
--->
-<PUBLIC:COMPONENT lightWeight="true">
-<!-- saved from url=(0014)about:internet -->
-<PUBLIC:ATTACH EVENT="oncontentready" FOR="element" ONEVENT="init()" />
-<PUBLIC:ATTACH EVENT="ondocumentready" FOR="element" ONEVENT="init()" />
-<PUBLIC:ATTACH EVENT="ondetach" FOR="element" ONEVENT="cleanup()" />
-
-<script type="text/javascript">
-var doc = element.document;var f=window.PIE;
-if(!f){f=window.PIE={F:"-pie-",nb:"Pie",La:"pie_",Ac:{TD:1,TH:1},cc:{TABLE:1,THEAD:1,TBODY:1,TFOOT:1,TR:1,INPUT:1,TEXTAREA:1,SELECT:1,OPTION:1,IMG:1,HR:1},fc:{A:1,INPUT:1,TEXTAREA:1,SELECT:1,BUTTON:1},Gd:{submit:1,button:1,reset:1},aa:function(){}};try{doc.execCommand("BackgroundImageCache",false,true)}catch(aa){}for(var ba=4,Z=doc.createElement("div"),ca=Z.getElementsByTagName("i"),ga;Z.innerHTML="<!--[if gt IE "+ ++ba+"]><i></i><![endif]--\>",ca[0];);f.O=ba;if(ba===6)f.F=f.F.replace(/^-/,"");f.ja=
-doc.documentMode||f.O;Z.innerHTML='<v:shape adj="1"/>';ga=Z.firstChild;ga.style.behavior="url(#default#VML)";f.zc=typeof ga.adj==="object";(function(){var a,b=0,c={};f.p={Za:function(d){if(!a){a=doc.createDocumentFragment();a.namespaces.add("css3vml","urn:schemas-microsoft-com:vml")}return a.createElement("css3vml:"+d)},Ba:function(d){return d&&d._pieId||(d._pieId="_"+ ++b)},Eb:function(d){var e,g,j,i,h=arguments;e=1;for(g=h.length;e<g;e++){i=h[e];for(j in i)if(i.hasOwnProperty(j))d[j]=i[j]}return d},
-Rb:function(d,e,g){var j=c[d],i,h;if(j)Object.prototype.toString.call(j)==="[object Array]"?j.push([e,g]):e.call(g,j);else{h=c[d]=[[e,g]];i=new Image;i.onload=function(){j=c[d]={h:i.width,f:i.height};for(var k=0,n=h.length;k<n;k++)h[k][0].call(h[k][1],j);i.onload=null};i.src=d}}}})();f.Na={gc:function(a,b,c,d){function e(){k=j>=90&&j<270?b:0;n=j<180?c:0;m=b-k;p=c-n}function g(){for(;j<0;)j+=360;j%=360}var j=d.sa;d=d.zb;var i,h,k,n,m,p,r,t;if(d){d=d.coords(a,b,c);i=d.x;h=d.y}if(j){j=j.jd();g();e();
-if(!d){i=k;h=n}d=f.Na.tc(i,h,j,m,p);a=d[0];d=d[1]}else if(d){a=b-i;d=c-h}else{i=h=a=0;d=c}r=a-i;t=d-h;if(j===void 0){j=!r?t<0?90:270:!t?r<0?180:0:-Math.atan2(t,r)/Math.PI*180;g();e()}return{sa:j,xc:i,yc:h,td:a,ud:d,Wd:k,Xd:n,rd:m,sd:p,kd:r,ld:t,rc:f.Na.dc(i,h,a,d)}},tc:function(a,b,c,d,e){if(c===0||c===180)return[d,b];else if(c===90||c===270)return[a,e];else{c=Math.tan(-c*Math.PI/180);a=c*a-b;b=-1/c;d=b*d-e;e=b-c;return[(d-a)/e,(c*d-b*a)/e]}},dc:function(a,b,c,d){a=c-a;b=d-b;return Math.abs(a===0?
-b:b===0?a:Math.sqrt(a*a+b*b))}};f.ea=function(){this.Gb=[];this.oc={}};f.ea.prototype={ba:function(a){var b=f.p.Ba(a),c=this.oc,d=this.Gb;if(!(b in c)){c[b]=d.length;d.push(a)}},Ha:function(a){a=f.p.Ba(a);var b=this.oc;if(a&&a in b){delete this.Gb[b[a]];delete b[a]}},xa:function(){for(var a=this.Gb,b=a.length;b--;)a[b]&&a[b]()}};f.Oa=new f.ea;f.Oa.Rd=function(){var a=this,b;if(!a.Sd){b=doc.documentElement.currentStyle.getAttribute(f.F+"poll-interval")||250;(function c(){a.xa();setTimeout(c,b)})();
-a.Sd=1}};(function(){function a(){f.L.xa();window.detachEvent("onunload",a);window.PIE=null}f.L=new f.ea;window.attachEvent("onunload",a);f.L.ta=function(b,c,d){b.attachEvent(c,d);this.ba(function(){b.detachEvent(c,d)})}})();f.Qa=new f.ea;f.L.ta(window,"onresize",function(){f.Qa.xa()});(function(){function a(){f.mb.xa()}f.mb=new f.ea;f.L.ta(window,"onscroll",a);f.Qa.ba(a)})();(function(){function a(){c=f.kb.md()}function b(){if(c){for(var d=0,e=c.length;d<e;d++)f.attach(c[d]);c=0}}var c;if(f.ja<9){f.L.ta(window,
-"onbeforeprint",a);f.L.ta(window,"onafterprint",b)}})();f.lb=new f.ea;f.L.ta(doc,"onmouseup",function(){f.lb.xa()});f.he=function(){function a(h){this.Y=h}var b=doc.createElement("length-calc"),c=doc.body||doc.documentElement,d=b.style,e={},g=["mm","cm","in","pt","pc"],j=g.length,i={};d.position="absolute";d.top=d.left="-9999px";for(c.appendChild(b);j--;){d.width="100"+g[j];e[g[j]]=b.offsetWidth/100}c.removeChild(b);d.width="1em";a.prototype={Kb:/(px|em|ex|mm|cm|in|pt|pc|%)$/,ic:function(){var h=
-this.Jd;if(h===void 0)h=this.Jd=parseFloat(this.Y);return h},yb:function(){var h=this.ae;if(!h)h=this.ae=(h=this.Y.match(this.Kb))&&h[0]||"px";return h},a:function(h,k){var n=this.ic(),m=this.yb();switch(m){case "px":return n;case "%":return n*(typeof k==="function"?k():k)/100;case "em":return n*this.xb(h);case "ex":return n*this.xb(h)/2;default:return n*e[m]}},xb:function(h){var k=h.currentStyle.fontSize,n,m;if(k.indexOf("px")>0)return parseFloat(k);else if(h.tagName in f.cc){m=this;n=h.parentNode;
-return f.n(k).a(n,function(){return m.xb(n)})}else{h.appendChild(b);k=b.offsetWidth;b.parentNode===h&&h.removeChild(b);return k}}};f.n=function(h){return i[h]||(i[h]=new a(h))};return a}();f.Ja=function(){function a(e){this.X=e}var b=f.n("50%"),c={top:1,center:1,bottom:1},d={left:1,center:1,right:1};a.prototype={zd:function(){if(!this.ac){var e=this.X,g=e.length,j=f.v,i=j.qa,h=f.n("0");i=i.na;h=["left",h,"top",h];if(g===1){e.push(new j.ob(i,"center"));g++}if(g===2){i&(e[0].k|e[1].k)&&e[0].d in c&&
-e[1].d in d&&e.push(e.shift());if(e[0].k&i)if(e[0].d==="center")h[1]=b;else h[0]=e[0].d;else if(e[0].W())h[1]=f.n(e[0].d);if(e[1].k&i)if(e[1].d==="center")h[3]=b;else h[2]=e[1].d;else if(e[1].W())h[3]=f.n(e[1].d)}this.ac=h}return this.ac},coords:function(e,g,j){var i=this.zd(),h=i[1].a(e,g);e=i[3].a(e,j);return{x:i[0]==="right"?g-h:h,y:i[2]==="bottom"?j-e:e}}};return a}();f.Ka=function(){function a(b,c){this.h=b;this.f=c}a.prototype={a:function(b,c,d,e,g){var j=this.h,i=this.f,h=c/d;e=e/g;if(j===
-"contain"){j=e>h?c:d*e;i=e>h?c/e:d}else if(j==="cover"){j=e<h?c:d*e;i=e<h?c/e:d}else if(j==="auto"){i=i==="auto"?g:i.a(b,d);j=i*e}else{j=j.a(b,c);i=i==="auto"?j/e:i.a(b,d)}return{h:j,f:i}}};a.Kc=new a("auto","auto");return a}();f.Ec=function(){function a(b){this.Y=b}a.prototype={Kb:/[a-z]+$/i,yb:function(){return this.ad||(this.ad=this.Y.match(this.Kb)[0].toLowerCase())},jd:function(){var b=this.Vc,c;if(b===undefined){b=this.yb();c=parseFloat(this.Y,10);b=this.Vc=b==="deg"?c:b==="rad"?c/Math.PI*180:
-b==="grad"?c/400*360:b==="turn"?c*360:0}return b}};return a}();f.Jc=function(){function a(c){this.Y=c}var b={};a.Qd=/\s*rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d+|\d*\.\d+)\s*\)\s*/;a.Fb={aliceblue:"F0F8FF",antiquewhite:"FAEBD7",aqua:"0FF",aquamarine:"7FFFD4",azure:"F0FFFF",beige:"F5F5DC",bisque:"FFE4C4",black:"000",blanchedalmond:"FFEBCD",blue:"00F",blueviolet:"8A2BE2",brown:"A52A2A",burlywood:"DEB887",cadetblue:"5F9EA0",chartreuse:"7FFF00",chocolate:"D2691E",coral:"FF7F50",cornflowerblue:"6495ED",
-cornsilk:"FFF8DC",crimson:"DC143C",cyan:"0FF",darkblue:"00008B",darkcyan:"008B8B",darkgoldenrod:"B8860B",darkgray:"A9A9A9",darkgreen:"006400",darkkhaki:"BDB76B",darkmagenta:"8B008B",darkolivegreen:"556B2F",darkorange:"FF8C00",darkorchid:"9932CC",darkred:"8B0000",darksalmon:"E9967A",darkseagreen:"8FBC8F",darkslateblue:"483D8B",darkslategray:"2F4F4F",darkturquoise:"00CED1",darkviolet:"9400D3",deeppink:"FF1493",deepskyblue:"00BFFF",dimgray:"696969",dodgerblue:"1E90FF",firebrick:"B22222",floralwhite:"FFFAF0",
-forestgreen:"228B22",fuchsia:"F0F",gainsboro:"DCDCDC",ghostwhite:"F8F8FF",gold:"FFD700",goldenrod:"DAA520",gray:"808080",green:"008000",greenyellow:"ADFF2F",honeydew:"F0FFF0",hotpink:"FF69B4",indianred:"CD5C5C",indigo:"4B0082",ivory:"FFFFF0",khaki:"F0E68C",lavender:"E6E6FA",lavenderblush:"FFF0F5",lawngreen:"7CFC00",lemonchiffon:"FFFACD",lightblue:"ADD8E6",lightcoral:"F08080",lightcyan:"E0FFFF",lightgoldenrodyellow:"FAFAD2",lightgreen:"90EE90",lightgrey:"D3D3D3",lightpink:"FFB6C1",lightsalmon:"FFA07A",
-lightseagreen:"20B2AA",lightskyblue:"87CEFA",lightslategray:"789",lightsteelblue:"B0C4DE",lightyellow:"FFFFE0",lime:"0F0",limegreen:"32CD32",linen:"FAF0E6",magenta:"F0F",maroon:"800000",mediumauqamarine:"66CDAA",mediumblue:"0000CD",mediumorchid:"BA55D3",mediumpurple:"9370D8",mediumseagreen:"3CB371",mediumslateblue:"7B68EE",mediumspringgreen:"00FA9A",mediumturquoise:"48D1CC",mediumvioletred:"C71585",midnightblue:"191970",mintcream:"F5FFFA",mistyrose:"FFE4E1",moccasin:"FFE4B5",navajowhite:"FFDEAD",
-navy:"000080",oldlace:"FDF5E6",olive:"808000",olivedrab:"688E23",orange:"FFA500",orangered:"FF4500",orchid:"DA70D6",palegoldenrod:"EEE8AA",palegreen:"98FB98",paleturquoise:"AFEEEE",palevioletred:"D87093",papayawhip:"FFEFD5",peachpuff:"FFDAB9",peru:"CD853F",pink:"FFC0CB",plum:"DDA0DD",powderblue:"B0E0E6",purple:"800080",red:"F00",rosybrown:"BC8F8F",royalblue:"4169E1",saddlebrown:"8B4513",salmon:"FA8072",sandybrown:"F4A460",seagreen:"2E8B57",seashell:"FFF5EE",sienna:"A0522D",silver:"C0C0C0",skyblue:"87CEEB",
-slateblue:"6A5ACD",slategray:"708090",snow:"FFFAFA",springgreen:"00FF7F",steelblue:"4682B4",tan:"D2B48C",teal:"008080",thistle:"D8BFD8",tomato:"FF6347",turquoise:"40E0D0",violet:"EE82EE",wheat:"F5DEB3",white:"FFF",whitesmoke:"F5F5F5",yellow:"FF0",yellowgreen:"9ACD32"};a.prototype={parse:function(){if(!this.Ua){var c=this.Y,d;if(d=c.match(a.Qd)){this.Ua="rgb("+d[1]+","+d[2]+","+d[3]+")";this.Yb=parseFloat(d[4])}else{if((d=c.toLowerCase())in a.Fb)c="#"+a.Fb[d];this.Ua=c;this.Yb=c==="transparent"?0:
-1}}},U:function(c){this.parse();return this.Ua==="currentColor"?c.currentStyle.color:this.Ua},fa:function(){this.parse();return this.Yb}};f.ha=function(c){return b[c]||(b[c]=new a(c))};return a}();f.v=function(){function a(c){this.$a=c;this.ch=0;this.X=[];this.Ga=0}var b=a.qa={Ia:1,Wb:2,z:4,Lc:8,Xb:16,na:32,K:64,oa:128,pa:256,Ra:512,Tc:1024,URL:2048};a.ob=function(c,d){this.k=c;this.d=d};a.ob.prototype={Ca:function(){return this.k&b.K||this.k&b.oa&&this.d==="0"},W:function(){return this.Ca()||this.k&
-b.Ra}};a.prototype={de:/\s/,Kd:/^[\+\-]?(\d*\.)?\d+/,url:/^url\(\s*("([^"]*)"|'([^']*)'|([!#$%&*-~]*))\s*\)/i,nc:/^\-?[_a-z][\w-]*/i,Yd:/^("([^"]*)"|'([^']*)')/,Bd:/^#([\da-f]{6}|[\da-f]{3})/i,be:{px:b.K,em:b.K,ex:b.K,mm:b.K,cm:b.K,"in":b.K,pt:b.K,pc:b.K,deg:b.Ia,rad:b.Ia,grad:b.Ia},fd:{rgb:1,rgba:1,hsl:1,hsla:1},next:function(c){function d(p,r){p=new a.ob(p,r);if(!c){k.X.push(p);k.Ga++}return p}function e(){k.Ga++;return null}var g,j,i,h,k=this;if(this.Ga<this.X.length)return this.X[this.Ga++];for(;this.de.test(this.$a.charAt(this.ch));)this.ch++;
-if(this.ch>=this.$a.length)return e();j=this.ch;g=this.$a.substring(this.ch);i=g.charAt(0);switch(i){case "#":if(h=g.match(this.Bd)){this.ch+=h[0].length;return d(b.z,h[0])}break;case '"':case "'":if(h=g.match(this.Yd)){this.ch+=h[0].length;return d(b.Tc,h[2]||h[3]||"")}break;case "/":case ",":this.ch++;return d(b.pa,i);case "u":if(h=g.match(this.url)){this.ch+=h[0].length;return d(b.URL,h[2]||h[3]||h[4]||"")}}if(h=g.match(this.Kd)){i=h[0];this.ch+=i.length;if(g.charAt(i.length)==="%"){this.ch++;
-return d(b.Ra,i+"%")}if(h=g.substring(i.length).match(this.nc)){i+=h[0];this.ch+=h[0].length;return d(this.be[h[0].toLowerCase()]||b.Lc,i)}return d(b.oa,i)}if(h=g.match(this.nc)){i=h[0];this.ch+=i.length;if(i.toLowerCase()in f.Jc.Fb||i==="currentColor"||i==="transparent")return d(b.z,i);if(g.charAt(i.length)==="("){this.ch++;if(i.toLowerCase()in this.fd){g=function(p){return p&&p.k&b.oa};h=function(p){return p&&p.k&(b.oa|b.Ra)};var n=function(p,r){return p&&p.d===r},m=function(){return k.next(1)};
-if((i.charAt(0)==="r"?h(m()):g(m()))&&n(m(),",")&&h(m())&&n(m(),",")&&h(m())&&(i==="rgb"||i==="hsa"||n(m(),",")&&g(m()))&&n(m(),")"))return d(b.z,this.$a.substring(j,this.ch));return e()}return d(b.Xb,i)}return d(b.na,i)}this.ch++;return d(b.Wb,i)},D:function(){return this.X[this.Ga-- -2]},all:function(){for(;this.next(););return this.X},ma:function(c,d){for(var e=[],g,j;g=this.next();){if(c(g)){j=true;this.D();break}e.push(g)}return d&&!j?null:e}};return a}();var ha=function(a){this.e=a};ha.prototype=
-{Z:0,Od:function(){var a=this.qb,b;return!a||(b=this.o())&&(a.x!==b.x||a.y!==b.y)},Td:function(){var a=this.qb,b;return!a||(b=this.o())&&(a.h!==b.h||a.f!==b.f)},hc:function(){var a=this.e,b=a.getBoundingClientRect(),c=f.ja===9,d=f.O===7,e=b.right-b.left;return{x:b.left,y:b.top,h:c||d?a.offsetWidth:e,f:c||d?a.offsetHeight:b.bottom-b.top,Hd:d&&e?a.offsetWidth/e:1}},o:function(){return this.Z?this.Va||(this.Va=this.hc()):this.hc()},Ad:function(){return!!this.qb},cb:function(){++this.Z},hb:function(){if(!--this.Z){if(this.Va)this.qb=
-this.Va;this.Va=null}}};(function(){function a(b){var c=f.p.Ba(b);return function(){if(this.Z){var d=this.$b||(this.$b={});return c in d?d[c]:(d[c]=b.call(this))}else return b.call(this)}}f.B={Z:0,ka:function(b){function c(d){this.e=d;this.Zb=this.ia()}f.p.Eb(c.prototype,f.B,b);c.$c={};return c},j:function(){var b=this.ia(),c=this.constructor.$c;return b?b in c?c[b]:(c[b]=this.la(b)):null},ia:a(function(){var b=this.e,c=this.constructor,d=b.style;b=b.currentStyle;var e=this.wa,g=this.Fa,j=c.Yc||(c.Yc=
-f.F+e);c=c.Zc||(c.Zc=f.nb+g.charAt(0).toUpperCase()+g.substring(1));return d[c]||b.getAttribute(j)||d[g]||b.getAttribute(e)}),i:a(function(){return!!this.j()}),H:a(function(){var b=this.ia(),c=b!==this.Zb;this.Zb=b;return c}),va:a,cb:function(){++this.Z},hb:function(){--this.Z||delete this.$b}}})();f.Sb=f.B.ka({wa:f.F+"background",Fa:f.nb+"Background",cd:{scroll:1,fixed:1,local:1},fb:{"repeat-x":1,"repeat-y":1,repeat:1,"no-repeat":1},sc:{"padding-box":1,"border-box":1,"content-box":1},Pd:{top:1,right:1,
-bottom:1,left:1,center:1},Ud:{contain:1,cover:1},eb:{Ma:"backgroundClip",z:"backgroundColor",da:"backgroundImage",Pa:"backgroundOrigin",S:"backgroundPosition",T:"backgroundRepeat",Sa:"backgroundSize"},la:function(a){function b(s){return s&&s.W()||s.k&k&&s.d in t}function c(s){return s&&(s.W()&&f.n(s.d)||s.d==="auto"&&"auto")}var d=this.e.currentStyle,e,g,j,i=f.v.qa,h=i.pa,k=i.na,n=i.z,m,p,r=0,t=this.Pd,v,l,q={M:[]};if(this.wb()){e=new f.v(a);for(j={};g=e.next();){m=g.k;p=g.d;if(!j.P&&m&i.Xb&&p===
-"linear-gradient"){v={ca:[],P:p};for(l={};g=e.next();){m=g.k;p=g.d;if(m&i.Wb&&p===")"){l.color&&v.ca.push(l);v.ca.length>1&&f.p.Eb(j,v);break}if(m&n){if(v.sa||v.zb){g=e.D();if(g.k!==h)break;e.next()}l={color:f.ha(p)};g=e.next();if(g.W())l.db=f.n(g.d);else e.D()}else if(m&i.Ia&&!v.sa&&!l.color&&!v.ca.length)v.sa=new f.Ec(g.d);else if(b(g)&&!v.zb&&!l.color&&!v.ca.length){e.D();v.zb=new f.Ja(e.ma(function(s){return!b(s)},false))}else if(m&h&&p===","){if(l.color){v.ca.push(l);l={}}}else break}}else if(!j.P&&
-m&i.URL){j.Ab=p;j.P="image"}else if(b(g)&&!j.$){e.D();j.$=new f.Ja(e.ma(function(s){return!b(s)},false))}else if(m&k)if(p in this.fb&&!j.bb)j.bb=p;else if(p in this.sc&&!j.Wa){j.Wa=p;if((g=e.next())&&g.k&k&&g.d in this.sc)j.ub=g.d;else{j.ub=p;e.D()}}else if(p in this.cd&&!j.bc)j.bc=p;else return null;else if(m&n&&!q.color)q.color=f.ha(p);else if(m&h&&p==="/"&&!j.Xa&&j.$){g=e.next();if(g.k&k&&g.d in this.Ud)j.Xa=new f.Ka(g.d);else if(g=c(g)){m=c(e.next());if(!m){m=g;e.D()}j.Xa=new f.Ka(g,m)}else return null}else if(m&
-h&&p===","&&j.P){j.Hb=a.substring(r,e.ch-1);r=e.ch;q.M.push(j);j={}}else return null}if(j.P){j.Hb=a.substring(r);q.M.push(j)}}else this.Bc(f.ja<9?function(){var s=this.eb,o=d[s.S+"X"],u=d[s.S+"Y"],x=d[s.da],y=d[s.z];if(y!=="transparent")q.color=f.ha(y);if(x!=="none")q.M=[{P:"image",Ab:(new f.v(x)).next().d,bb:d[s.T],$:new f.Ja((new f.v(o+" "+u)).all())}]}:function(){var s=this.eb,o=/\s*,\s*/,u=d[s.da].split(o),x=d[s.z],y,z,B,E,D,C;if(x!=="transparent")q.color=f.ha(x);if((E=u.length)&&u[0]!=="none"){x=
-d[s.T].split(o);y=d[s.S].split(o);z=d[s.Pa].split(o);B=d[s.Ma].split(o);s=d[s.Sa].split(o);q.M=[];for(o=0;o<E;o++)if((D=u[o])&&D!=="none"){C=s[o].split(" ");q.M.push({Hb:D+" "+x[o]+" "+y[o]+" / "+s[o]+" "+z[o]+" "+B[o],P:"image",Ab:(new f.v(D)).next().d,bb:x[o],$:new f.Ja((new f.v(y[o])).all()),Wa:z[o],ub:B[o],Xa:new f.Ka(C[0],C[1])})}}});return q.color||q.M[0]?q:null},Bc:function(a){var b=f.ja>8,c=this.eb,d=this.e.runtimeStyle,e=d[c.da],g=d[c.z],j=d[c.T],i,h,k,n;if(e)d[c.da]="";if(g)d[c.z]="";if(j)d[c.T]=
-"";if(b){i=d[c.Ma];h=d[c.Pa];n=d[c.S];k=d[c.Sa];if(i)d[c.Ma]="";if(h)d[c.Pa]="";if(n)d[c.S]="";if(k)d[c.Sa]=""}a=a.call(this);if(e)d[c.da]=e;if(g)d[c.z]=g;if(j)d[c.T]=j;if(b){if(i)d[c.Ma]=i;if(h)d[c.Pa]=h;if(n)d[c.S]=n;if(k)d[c.Sa]=k}return a},ia:f.B.va(function(){return this.wb()||this.Bc(function(){var a=this.e.currentStyle,b=this.eb;return a[b.z]+" "+a[b.da]+" "+a[b.T]+" "+a[b.S+"X"]+" "+a[b.S+"Y"]})}),wb:f.B.va(function(){var a=this.e;return a.style[this.Fa]||a.currentStyle.getAttribute(this.wa)}),
-qc:function(){var a=0;if(f.O<7){a=this.e;a=""+(a.style[f.nb+"PngFix"]||a.currentStyle.getAttribute(f.F+"png-fix"))==="true"}return a},i:f.B.va(function(){return(this.wb()||this.qc())&&!!this.j()})});f.Vb=f.B.ka({wc:["Top","Right","Bottom","Left"],Id:{thin:"1px",medium:"3px",thick:"5px"},la:function(){var a={},b={},c={},d=false,e=true,g=true,j=true;this.Cc(function(){for(var i=this.e.currentStyle,h=0,k,n,m,p,r,t,v;h<4;h++){m=this.wc[h];v=m.charAt(0).toLowerCase();k=b[v]=i["border"+m+"Style"];n=i["border"+
-m+"Color"];m=i["border"+m+"Width"];if(h>0){if(k!==p)g=false;if(n!==r)e=false;if(m!==t)j=false}p=k;r=n;t=m;c[v]=f.ha(n);m=a[v]=f.n(b[v]==="none"?"0":this.Id[m]||m);if(m.a(this.e)>0)d=true}});return d?{J:a,Zd:b,gd:c,ee:j,hd:e,$d:g}:null},ia:f.B.va(function(){var a=this.e,b=a.currentStyle,c;a.tagName in f.Ac&&a.offsetParent.currentStyle.borderCollapse==="collapse"||this.Cc(function(){c=b.borderWidth+"|"+b.borderStyle+"|"+b.borderColor});return c}),Cc:function(a){var b=this.e.runtimeStyle,c=b.borderWidth,
-d=b.borderColor;if(c)b.borderWidth="";if(d)b.borderColor="";a=a.call(this);if(c)b.borderWidth=c;if(d)b.borderColor=d;return a}});(function(){f.jb=f.B.ka({wa:"border-radius",Fa:"borderRadius",la:function(b){var c=null,d,e,g,j,i=false;if(b){e=new f.v(b);var h=function(){for(var k=[],n;(g=e.next())&&g.W();){j=f.n(g.d);n=j.ic();if(n<0)return null;if(n>0)i=true;k.push(j)}return k.length>0&&k.length<5?{tl:k[0],tr:k[1]||k[0],br:k[2]||k[0],bl:k[3]||k[1]||k[0]}:null};if(b=h()){if(g){if(g.k&f.v.qa.pa&&g.d===
-"/")d=h()}else d=b;if(i&&b&&d)c={x:b,y:d}}}return c}});var a=f.n("0");a={tl:a,tr:a,br:a,bl:a};f.jb.Dc={x:a,y:a}})();f.Ub=f.B.ka({wa:"border-image",Fa:"borderImage",fb:{stretch:1,round:1,repeat:1,space:1},la:function(a){var b=null,c,d,e,g,j,i,h=0,k=f.v.qa,n=k.na,m=k.oa,p=k.Ra;if(a){c=new f.v(a);b={};for(var r=function(l){return l&&l.k&k.pa&&l.d==="/"},t=function(l){return l&&l.k&n&&l.d==="fill"},v=function(){g=c.ma(function(l){return!(l.k&(m|p))});if(t(c.next())&&!b.fill)b.fill=true;else c.D();if(r(c.next())){h++;
-j=c.ma(function(l){return!l.W()&&!(l.k&n&&l.d==="auto")});if(r(c.next())){h++;i=c.ma(function(l){return!l.Ca()})}}else c.D()};a=c.next();){d=a.k;e=a.d;if(d&(m|p)&&!g){c.D();v()}else if(t(a)&&!b.fill){b.fill=true;v()}else if(d&n&&this.fb[e]&&!b.repeat){b.repeat={f:e};if(a=c.next())if(a.k&n&&this.fb[a.d])b.repeat.Ob=a.d;else c.D()}else if(d&k.URL&&!b.src)b.src=e;else return null}if(!b.src||!g||g.length<1||g.length>4||j&&j.length>4||h===1&&j.length<1||i&&i.length>4||h===2&&i.length<1)return null;if(!b.repeat)b.repeat=
-{f:"stretch"};if(!b.repeat.Ob)b.repeat.Ob=b.repeat.f;a=function(l,q){return{t:q(l[0]),r:q(l[1]||l[0]),b:q(l[2]||l[0]),l:q(l[3]||l[1]||l[0])}};b.slice=a(g,function(l){return f.n(l.k&m?l.d+"px":l.d)});if(j&&j[0])b.J=a(j,function(l){return l.W()?f.n(l.d):l.d});if(i&&i[0])b.Da=a(i,function(l){return l.Ca()?f.n(l.d):l.d})}return b}});f.Ic=f.B.ka({wa:"box-shadow",Fa:"boxShadow",la:function(a){var b,c=f.n,d=f.v.qa,e;if(a){e=new f.v(a);b={Da:[],Bb:[]};for(a=function(){for(var g,j,i,h,k,n;g=e.next();){i=g.d;
-j=g.k;if(j&d.pa&&i===",")break;else if(g.Ca()&&!k){e.D();k=e.ma(function(m){return!m.Ca()})}else if(j&d.z&&!h)h=i;else if(j&d.na&&i==="inset"&&!n)n=true;else return false}g=k&&k.length;if(g>1&&g<5){(n?b.Bb:b.Da).push({fe:c(k[0].d),ge:c(k[1].d),blur:c(k[2]?k[2].d:"0"),Vd:c(k[3]?k[3].d:"0"),color:f.ha(h||"currentColor")});return true}return false};a(););}return b&&(b.Bb.length||b.Da.length)?b:null}});f.Uc=f.B.ka({ia:f.B.va(function(){var a=this.e.currentStyle;return a.visibility+"|"+a.display}),la:function(){var a=
-this.e,b=a.runtimeStyle;a=a.currentStyle;var c=b.visibility,d;b.visibility="";d=a.visibility;b.visibility=c;return{ce:d!=="hidden",nd:a.display!=="none"}},i:function(){return false}});f.u={R:function(a){function b(c,d,e,g){this.e=c;this.s=d;this.g=e;this.parent=g}f.p.Eb(b.prototype,f.u,a);return b},Cb:false,Q:function(){return false},Ea:f.aa,Lb:function(){this.m();this.i()&&this.V()},ib:function(){this.Cb=true},Mb:function(){this.i()?this.V():this.m()},sb:function(a,b){this.vc(a);for(var c=this.ra||
-(this.ra=[]),d=a+1,e=c.length,g;d<e;d++)if(g=c[d])break;c[a]=b;this.I().insertBefore(b,g||null)},za:function(a){var b=this.ra;return b&&b[a]||null},vc:function(a){var b=this.za(a),c=this.Ta;if(b&&c){c.removeChild(b);this.ra[a]=null}},Aa:function(a,b,c,d){var e=this.rb||(this.rb={}),g=e[a];if(!g){g=e[a]=f.p.Za("shape");if(b)g.appendChild(g[b]=f.p.Za(b));if(d){c=this.za(d);if(!c){this.sb(d,doc.createElement("group"+d));c=this.za(d)}}c.appendChild(g);a=g.style;a.position="absolute";a.left=a.top=0;a.behavior=
-"url(#default#VML)"}return g},vb:function(a){var b=this.rb,c=b&&b[a];if(c){c.parentNode.removeChild(c);delete b[a]}return!!c},kc:function(a){var b=this.e,c=this.s.o(),d=c.h,e=c.f,g,j,i,h,k,n;c=a.x.tl.a(b,d);g=a.y.tl.a(b,e);j=a.x.tr.a(b,d);i=a.y.tr.a(b,e);h=a.x.br.a(b,d);k=a.y.br.a(b,e);n=a.x.bl.a(b,d);a=a.y.bl.a(b,e);d=Math.min(d/(c+j),e/(i+k),d/(n+h),e/(g+a));if(d<1){c*=d;g*=d;j*=d;i*=d;h*=d;k*=d;n*=d;a*=d}return{x:{tl:c,tr:j,br:h,bl:n},y:{tl:g,tr:i,br:k,bl:a}}},ya:function(a,b,c){b=b||1;var d,e,
-g=this.s.o();e=g.h*b;g=g.f*b;var j=this.g.G,i=Math.floor,h=Math.ceil,k=a?a.Jb*b:0,n=a?a.Ib*b:0,m=a?a.tb*b:0;a=a?a.Db*b:0;var p,r,t,v,l;if(c||j.i()){d=this.kc(c||j.j());c=d.x.tl*b;j=d.y.tl*b;p=d.x.tr*b;r=d.y.tr*b;t=d.x.br*b;v=d.y.br*b;l=d.x.bl*b;b=d.y.bl*b;e="m"+i(a)+","+i(j)+"qy"+i(c)+","+i(k)+"l"+h(e-p)+","+i(k)+"qx"+h(e-n)+","+i(r)+"l"+h(e-n)+","+h(g-v)+"qy"+h(e-t)+","+h(g-m)+"l"+i(l)+","+h(g-m)+"qx"+i(a)+","+h(g-b)+" x e"}else e="m"+i(a)+","+i(k)+"l"+h(e-n)+","+i(k)+"l"+h(e-n)+","+h(g-m)+"l"+i(a)+
-","+h(g-m)+"xe";return e},I:function(){var a=this.parent.za(this.N),b;if(!a){a=doc.createElement(this.Ya);b=a.style;b.position="absolute";b.top=b.left=0;this.parent.sb(this.N,a)}return a},mc:function(){var a=this.e,b=a.currentStyle,c=a.runtimeStyle,d=a.tagName,e=f.O===6,g;if(e&&(d in f.cc||d==="FIELDSET")||d==="BUTTON"||d==="INPUT"&&a.type in f.Gd){c.borderWidth="";d=this.g.w.wc;for(g=d.length;g--;){e=d[g];c["padding"+e]="";c["padding"+e]=f.n(b["padding"+e]).a(a)+f.n(b["border"+e+"Width"]).a(a)+(f.O!==
-8&&g%2?1:0)}c.borderWidth=0}else if(e){if(a.childNodes.length!==1||a.firstChild.tagName!=="ie6-mask"){b=doc.createElement("ie6-mask");d=b.style;d.visibility="visible";for(d.zoom=1;d=a.firstChild;)b.appendChild(d);a.appendChild(b);c.visibility="hidden"}}else c.borderColor="transparent"},ie:function(){},m:function(){this.parent.vc(this.N);delete this.rb;delete this.ra}};f.Rc=f.u.R({i:function(){var a=this.ed;for(var b in a)if(a.hasOwnProperty(b)&&a[b].i())return true;return false},Q:function(){return this.g.Pb.H()},
-ib:function(){if(this.i()){var a=this.jc(),b=a,c;a=a.currentStyle;var d=a.position,e=this.I().style,g=0,j=0;j=this.s.o();var i=j.Hd;if(d==="fixed"&&f.O>6){g=j.x*i;j=j.y*i;b=d}else{do b=b.offsetParent;while(b&&b.currentStyle.position==="static");if(b){c=b.getBoundingClientRect();b=b.currentStyle;g=(j.x-c.left)*i-(parseFloat(b.borderLeftWidth)||0);j=(j.y-c.top)*i-(parseFloat(b.borderTopWidth)||0)}else{b=doc.documentElement;g=(j.x+b.scrollLeft-b.clientLeft)*i;j=(j.y+b.scrollTop-b.clientTop)*i}b="absolute"}e.position=
-b;e.left=g;e.top=j;e.zIndex=d==="static"?-1:a.zIndex;this.Cb=true}},Mb:f.aa,Nb:function(){var a=this.g.Pb.j();this.I().style.display=a.ce&&a.nd?"":"none"},Lb:function(){this.i()?this.Nb():this.m()},jc:function(){var a=this.e;return a.tagName in f.Ac?a.offsetParent:a},I:function(){var a=this.Ta,b;if(!a){b=this.jc();a=this.Ta=doc.createElement("css3-container");a.style.direction="ltr";this.Nb();b.parentNode.insertBefore(a,b)}return a},ab:f.aa,m:function(){var a=this.Ta,b;if(a&&(b=a.parentNode))b.removeChild(a);
-delete this.Ta;delete this.ra}});f.Fc=f.u.R({N:2,Ya:"background",Q:function(){var a=this.g;return a.C.H()||a.G.H()},i:function(){var a=this.g;return a.q.i()||a.G.i()||a.C.i()||a.ga.i()&&a.ga.j().Bb},V:function(){var a=this.s.o();if(a.h&&a.f){this.od();this.pd()}},od:function(){var a=this.g.C.j(),b=this.s.o(),c=this.e,d=a&&a.color,e,g;if(d&&d.fa()>0){this.lc();a=this.Aa("bgColor","fill",this.I(),1);e=b.h;b=b.f;a.stroked=false;a.coordsize=e*2+","+b*2;a.coordorigin="1,1";a.path=this.ya(null,2);g=a.style;
-g.width=e;g.height=b;a.fill.color=d.U(c);c=d.fa();if(c<1)a.fill.opacity=c}else this.vb("bgColor")},pd:function(){var a=this.g.C.j(),b=this.s.o();a=a&&a.M;var c,d,e,g,j;if(a){this.lc();d=b.h;e=b.f;for(j=a.length;j--;){b=a[j];c=this.Aa("bgImage"+j,"fill",this.I(),2);c.stroked=false;c.fill.type="tile";c.fillcolor="none";c.coordsize=d*2+","+e*2;c.coordorigin="1,1";c.path=this.ya(0,2);g=c.style;g.width=d;g.height=e;if(b.P==="linear-gradient")this.bd(c,b);else{c.fill.src=b.Ab;this.Nd(c,j)}}}for(j=a?a.length:
-0;this.vb("bgImage"+j++););},Nd:function(a,b){var c=this;f.p.Rb(a.fill.src,function(d){var e=c.e,g=c.s.o(),j=g.h;g=g.f;if(j&&g){var i=a.fill,h=c.g,k=h.w.j(),n=k&&k.J;k=n?n.t.a(e):0;var m=n?n.r.a(e):0,p=n?n.b.a(e):0;n=n?n.l.a(e):0;h=h.C.j().M[b];e=h.$?h.$.coords(e,j-d.h-n-m,g-d.f-k-p):{x:0,y:0};h=h.bb;p=m=0;var r=j+1,t=g+1,v=f.O===8?0:1;n=Math.round(e.x)+n+0.5;k=Math.round(e.y)+k+0.5;i.position=n/j+","+k/g;i.size.x=1;i.size=d.h+"px,"+d.f+"px";if(h&&h!=="repeat"){if(h==="repeat-x"||h==="no-repeat"){m=
-k+1;t=k+d.f+v}if(h==="repeat-y"||h==="no-repeat"){p=n+1;r=n+d.h+v}a.style.clip="rect("+m+"px,"+r+"px,"+t+"px,"+p+"px)"}}})},bd:function(a,b){var c=this.e,d=this.s.o(),e=d.h,g=d.f;a=a.fill;d=b.ca;var j=d.length,i=Math.PI,h=f.Na,k=h.tc,n=h.dc;b=h.gc(c,e,g,b);h=b.sa;var m=b.xc,p=b.yc,r=b.Wd,t=b.Xd,v=b.rd,l=b.sd,q=b.kd,s=b.ld;b=b.rc;e=h%90?Math.atan2(q*e/g,s)/i*180:h+90;e+=180;e%=360;v=k(r,t,h,v,l);g=n(r,t,v[0],v[1]);i=[];v=k(m,p,h,r,t);n=n(m,p,v[0],v[1])/g*100;k=[];for(h=0;h<j;h++)k.push(d[h].db?d[h].db.a(c,
-b):h===0?0:h===j-1?b:null);for(h=1;h<j;h++){if(k[h]===null){m=k[h-1];b=h;do p=k[++b];while(p===null);k[h]=m+(p-m)/(b-h+1)}k[h]=Math.max(k[h],k[h-1])}for(h=0;h<j;h++)i.push(n+k[h]/g*100+"% "+d[h].color.U(c));a.angle=e;a.type="gradient";a.method="sigma";a.color=d[0].color.U(c);a.color2=d[j-1].color.U(c);if(a.colors)a.colors.value=i.join(",");else a.colors=i.join(",")},lc:function(){var a=this.e.runtimeStyle;a.backgroundImage="url(about:blank)";a.backgroundColor="transparent"},m:function(){f.u.m.call(this);
-var a=this.e.runtimeStyle;a.backgroundImage=a.backgroundColor=""}});f.Gc=f.u.R({N:4,Ya:"border",Q:function(){var a=this.g;return a.w.H()||a.G.H()},i:function(){var a=this.g;return a.G.i()&&!a.q.i()&&a.w.i()},V:function(){var a=this.e,b=this.g.w.j(),c=this.s.o(),d=c.h;c=c.f;var e,g,j,i,h;if(b){this.mc();b=this.wd(2);i=0;for(h=b.length;i<h;i++){j=b[i];e=this.Aa("borderPiece"+i,j.stroke?"stroke":"fill",this.I());e.coordsize=d*2+","+c*2;e.coordorigin="1,1";e.path=j.path;g=e.style;g.width=d;g.height=c;
-e.filled=!!j.fill;e.stroked=!!j.stroke;if(j.stroke){e=e.stroke;e.weight=j.Qb+"px";e.color=j.color.U(a);e.dashstyle=j.stroke==="dashed"?"2 2":j.stroke==="dotted"?"1 1":"solid";e.linestyle=j.stroke==="double"&&j.Qb>2?"ThinThin":"Single"}else e.fill.color=j.fill.U(a)}for(;this.vb("borderPiece"+i++););}},wd:function(a){var b=this.e,c,d,e,g=this.g.w,j=[],i,h,k,n,m=Math.round,p,r,t;if(g.i()){c=g.j();g=c.J;r=c.Zd;t=c.gd;if(c.ee&&c.$d&&c.hd){if(t.t.fa()>0){c=g.t.a(b);k=c/2;j.push({path:this.ya({Jb:k,Ib:k,
-tb:k,Db:k},a),stroke:r.t,color:t.t,Qb:c})}}else{a=a||1;c=this.s.o();d=c.h;e=c.f;c=m(g.t.a(b));k=m(g.r.a(b));n=m(g.b.a(b));b=m(g.l.a(b));var v={t:c,r:k,b:n,l:b};b=this.g.G;if(b.i())p=this.kc(b.j());i=Math.floor;h=Math.ceil;var l=function(o,u){return p?p[o][u]:0},q=function(o,u,x,y,z,B){var E=l("x",o),D=l("y",o),C=o.charAt(1)==="r";o=o.charAt(0)==="b";return E>0&&D>0?(B?"al":"ae")+(C?h(d-E):i(E))*a+","+(o?h(e-D):i(D))*a+","+(i(E)-u)*a+","+(i(D)-x)*a+","+y*65535+","+2949075*(z?1:-1):(B?"m":"l")+(C?d-
-u:u)*a+","+(o?e-x:x)*a},s=function(o,u,x,y){var z=o==="t"?i(l("x","tl"))*a+","+h(u)*a:o==="r"?h(d-u)*a+","+i(l("y","tr"))*a:o==="b"?h(d-l("x","br"))*a+","+i(e-u)*a:i(u)*a+","+h(e-l("y","bl"))*a;o=o==="t"?h(d-l("x","tr"))*a+","+h(u)*a:o==="r"?h(d-u)*a+","+h(e-l("y","br"))*a:o==="b"?i(l("x","bl"))*a+","+i(e-u)*a:i(u)*a+","+i(l("y","tl"))*a;return x?(y?"m"+o:"")+"l"+z:(y?"m"+z:"")+"l"+o};b=function(o,u,x,y,z,B){var E=o==="l"||o==="r",D=v[o],C,F;if(D>0&&r[o]!=="none"&&t[o].fa()>0){C=v[E?o:u];u=v[E?u:
-o];F=v[E?o:x];x=v[E?x:o];if(r[o]==="dashed"||r[o]==="dotted"){j.push({path:q(y,C,u,B+45,0,1)+q(y,0,0,B,1,0),fill:t[o]});j.push({path:s(o,D/2,0,1),stroke:r[o],Qb:D,color:t[o]});j.push({path:q(z,F,x,B,0,1)+q(z,0,0,B-45,1,0),fill:t[o]})}else j.push({path:q(y,C,u,B+45,0,1)+s(o,D,0,0)+q(z,F,x,B,0,0)+(r[o]==="double"&&D>2?q(z,F-i(F/3),x-i(x/3),B-45,1,0)+s(o,h(D/3*2),1,0)+q(y,C-i(C/3),u-i(u/3),B,1,0)+"x "+q(y,i(C/3),i(u/3),B+45,0,1)+s(o,i(D/3),1,0)+q(z,i(F/3),i(x/3),B,0,0):"")+q(z,0,0,B-45,1,0)+s(o,0,1,
-0)+q(y,0,0,B,1,0),fill:t[o]})}};b("t","l","r","tl","tr",90);b("r","t","b","tr","br",0);b("b","r","l","br","bl",-90);b("l","b","t","bl","tl",-180)}}return j},m:function(){if(this.ec||!this.g.q.i())this.e.runtimeStyle.borderColor="";f.u.m.call(this)}});f.Tb=f.u.R({N:5,Md:["t","tr","r","br","b","bl","l","tl","c"],Q:function(){return this.g.q.H()},i:function(){return this.g.q.i()},V:function(){this.I();var a=this.g.q.j(),b=this.g.w.j(),c=this.s.o(),d=this.e,e=this.uc;f.p.Rb(a.src,function(g){function j(s,
-o,u,x,y){s=e[s].style;var z=Math.max;s.width=z(o,0);s.height=z(u,0);s.left=x;s.top=y}function i(s,o,u){for(var x=0,y=s.length;x<y;x++)e[s[x]].imagedata[o]=u}var h=c.h,k=c.f,n=f.n("0"),m=a.J||(b?b.J:{t:n,r:n,b:n,l:n});n=m.t.a(d);var p=m.r.a(d),r=m.b.a(d);m=m.l.a(d);var t=a.slice,v=t.t.a(d),l=t.r.a(d),q=t.b.a(d);t=t.l.a(d);j("tl",m,n,0,0);j("t",h-m-p,n,m,0);j("tr",p,n,h-p,0);j("r",p,k-n-r,h-p,n);j("br",p,r,h-p,k-r);j("b",h-m-p,r,m,k-r);j("bl",m,r,0,k-r);j("l",m,k-n-r,0,n);j("c",h-m-p,k-n-r,m,n);i(["tl",
-"t","tr"],"cropBottom",(g.f-v)/g.f);i(["tl","l","bl"],"cropRight",(g.h-t)/g.h);i(["bl","b","br"],"cropTop",(g.f-q)/g.f);i(["tr","r","br"],"cropLeft",(g.h-l)/g.h);i(["l","r","c"],"cropTop",v/g.f);i(["l","r","c"],"cropBottom",q/g.f);i(["t","b","c"],"cropLeft",t/g.h);i(["t","b","c"],"cropRight",l/g.h);e.c.style.display=a.fill?"":"none"},this)},I:function(){var a=this.parent.za(this.N),b,c,d,e=this.Md,g=e.length;if(!a){a=doc.createElement("border-image");b=a.style;b.position="absolute";this.uc={};for(d=
-0;d<g;d++){c=this.uc[e[d]]=f.p.Za("rect");c.appendChild(f.p.Za("imagedata"));b=c.style;b.behavior="url(#default#VML)";b.position="absolute";b.top=b.left=0;c.imagedata.src=this.g.q.j().src;c.stroked=false;c.filled=false;a.appendChild(c)}this.parent.sb(this.N,a)}return a},Ea:function(){if(this.i()){var a=this.e,b=a.runtimeStyle,c=this.g.q.j().J;b.borderStyle="solid";if(c){b.borderTopWidth=c.t.a(a)+"px";b.borderRightWidth=c.r.a(a)+"px";b.borderBottomWidth=c.b.a(a)+"px";b.borderLeftWidth=c.l.a(a)+"px"}this.mc()}},
-m:function(){var a=this.e.runtimeStyle;a.borderStyle="";if(this.ec||!this.g.w.i())a.borderColor=a.borderWidth="";f.u.m.call(this)}});f.Hc=f.u.R({N:1,Ya:"outset-box-shadow",Q:function(){var a=this.g;return a.ga.H()||a.G.H()},i:function(){var a=this.g.ga;return a.i()&&a.j().Da[0]},V:function(){function a(C,F,O,H,M,P,I){C=b.Aa("shadow"+C+F,"fill",d,j-C);F=C.fill;C.coordsize=n*2+","+m*2;C.coordorigin="1,1";C.stroked=false;C.filled=true;F.color=M.U(c);if(P){F.type="gradienttitle";F.color2=F.color;F.opacity=
-0}C.path=I;l=C.style;l.left=O;l.top=H;l.width=n;l.height=m;return C}var b=this,c=this.e,d=this.I(),e=this.g,g=e.ga.j().Da;e=e.G.j();var j=g.length,i=j,h,k=this.s.o(),n=k.h,m=k.f;k=f.O===8?1:0;for(var p=["tl","tr","br","bl"],r,t,v,l,q,s,o,u,x,y,z,B,E,D;i--;){t=g[i];q=t.fe.a(c);s=t.ge.a(c);h=t.Vd.a(c);o=t.blur.a(c);t=t.color;u=-h-o;if(!e&&o)e=f.jb.Dc;u=this.ya({Jb:u,Ib:u,tb:u,Db:u},2,e);if(o){x=(h+o)*2+n;y=(h+o)*2+m;z=x?o*2/x:0;B=y?o*2/y:0;if(o-h>n/2||o-h>m/2)for(h=4;h--;){r=p[h];E=r.charAt(0)==="b";
-D=r.charAt(1)==="r";r=a(i,r,q,s,t,o,u);v=r.fill;v.focusposition=(D?1-z:z)+","+(E?1-B:B);v.focussize="0,0";r.style.clip="rect("+((E?y/2:0)+k)+"px,"+(D?x:x/2)+"px,"+(E?y:y/2)+"px,"+((D?x/2:0)+k)+"px)"}else{r=a(i,"",q,s,t,o,u);v=r.fill;v.focusposition=z+","+B;v.focussize=1-z*2+","+(1-B*2)}}else{r=a(i,"",q,s,t,o,u);q=t.fa();if(q<1)r.fill.opacity=q}}}});f.Pc=f.u.R({N:6,Ya:"imgEl",Q:function(){var a=this.g;return this.e.src!==this.Xc||a.G.H()},i:function(){var a=this.g;return a.G.i()||a.C.qc()},V:function(){this.Xc=
-j;this.Cd();var a=this.Aa("img","fill",this.I()),b=a.fill,c=this.s.o(),d=c.h;c=c.f;var e=this.g.w.j(),g=e&&e.J;e=this.e;var j=e.src,i=Math.round,h=e.currentStyle,k=f.n;if(!g||f.O<7){g=f.n("0");g={t:g,r:g,b:g,l:g}}a.stroked=false;b.type="frame";b.src=j;b.position=(d?0.5/d:0)+","+(c?0.5/c:0);a.coordsize=d*2+","+c*2;a.coordorigin="1,1";a.path=this.ya({Jb:i(g.t.a(e)+k(h.paddingTop).a(e)),Ib:i(g.r.a(e)+k(h.paddingRight).a(e)),tb:i(g.b.a(e)+k(h.paddingBottom).a(e)),Db:i(g.l.a(e)+k(h.paddingLeft).a(e))},
-2);a=a.style;a.width=d;a.height=c},Cd:function(){this.e.runtimeStyle.filter="alpha(opacity=0)"},m:function(){f.u.m.call(this);this.e.runtimeStyle.filter=""}});f.Oc=f.u.R({ib:f.aa,Mb:f.aa,Nb:f.aa,Lb:f.aa,Ld:/^,+|,+$/g,Fd:/,+/g,gb:function(a,b){(this.pb||(this.pb=[]))[a]=b||void 0},ab:function(){var a=this.pb,b;if(a&&(b=a.join(",").replace(this.Ld,"").replace(this.Fd,","))!==this.Wc)this.Wc=this.e.runtimeStyle.background=b},m:function(){this.e.runtimeStyle.background="";delete this.pb}});f.Mc=f.u.R({ua:1,
-Q:function(){return this.g.C.H()},i:function(){var a=this.g;return a.C.i()||a.q.i()},V:function(){var a=this.g.C.j(),b,c,d=0,e,g;if(a){b=[];if(c=a.M)for(;e=c[d++];)if(e.P==="linear-gradient"){g=this.vd(e.Wa);g=(e.Xa||f.Ka.Kc).a(this.e,g.h,g.f,g.h,g.f);b.push("url(data:image/svg+xml,"+escape(this.xd(e,g.h,g.f))+") "+this.dd(e.$)+" / "+g.h+"px "+g.f+"px "+(e.bc||"")+" "+(e.Wa||"")+" "+(e.ub||""))}else b.push(e.Hb);a.color&&b.push(a.color.Y);this.parent.gb(this.ua,b.join(","))}},dd:function(a){return a?
-a.X.map(function(b){return b.d}).join(" "):"0 0"},vd:function(a){var b=this.e,c=this.s.o(),d=c.h;c=c.f;var e;if(a!=="border-box")if((e=this.g.w.j())&&(e=e.J)){d-=e.l.a(b)+e.l.a(b);c-=e.t.a(b)+e.b.a(b)}if(a==="content-box"){a=f.n;e=b.currentStyle;d-=a(e.paddingLeft).a(b)+a(e.paddingRight).a(b);c-=a(e.paddingTop).a(b)+a(e.paddingBottom).a(b)}return{h:d,f:c}},xd:function(a,b,c){var d=this.e,e=a.ca,g=e.length,j=f.Na.gc(d,b,c,a);a=j.xc;var i=j.yc,h=j.td,k=j.ud;j=j.rc;var n,m,p,r,t;n=[];for(m=0;m<g;m++)n.push(e[m].db?
-e[m].db.a(d,j):m===0?0:m===g-1?j:null);for(m=1;m<g;m++)if(n[m]===null){r=n[m-1];p=m;do t=n[++p];while(t===null);n[m]=r+(t-r)/(p-m+1)}b=['<svg width="'+b+'" height="'+c+'" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="g" gradientUnits="userSpaceOnUse" x1="'+a/b*100+'%" y1="'+i/c*100+'%" x2="'+h/b*100+'%" y2="'+k/c*100+'%">'];for(m=0;m<g;m++)b.push('<stop offset="'+n[m]/j+'" stop-color="'+e[m].color.U(d)+'" stop-opacity="'+e[m].color.fa()+'"/>');b.push('</linearGradient></defs><rect width="100%" height="100%" fill="url(#g)"/></svg>');
-return b.join("")},m:function(){this.parent.gb(this.ua)}});f.Nc=f.u.R({T:"repeat",Sc:"stretch",Qc:"round",ua:0,Q:function(){return this.g.q.H()},i:function(){return this.g.q.i()},V:function(){var a=this,b=a.g.q.j(),c=a.g.w.j(),d=a.s.o(),e=b.repeat,g=e.f,j=e.Ob,i=a.e,h=0;f.p.Rb(b.src,function(k){function n(Q,R,U,V,W,Y,X,S,w,A){K.push('<pattern patternUnits="userSpaceOnUse" id="pattern'+G+'" x="'+(g===l?Q+U/2-w/2:Q)+'" y="'+(j===l?R+V/2-A/2:R)+'" width="'+w+'" height="'+A+'"><svg width="'+w+'" height="'+
-A+'" viewBox="'+W+" "+Y+" "+X+" "+S+'" preserveAspectRatio="none"><image xlink:href="'+v+'" x="0" y="0" width="'+r+'" height="'+t+'" /></svg></pattern>');J.push('<rect x="'+Q+'" y="'+R+'" width="'+U+'" height="'+V+'" fill="url(#pattern'+G+')" />');G++}var m=d.h,p=d.f,r=k.h,t=k.f,v=a.Dd(b.src,r,t),l=a.T,q=a.Sc;k=a.Qc;var s=Math.ceil,o=f.n("0"),u=b.J||(c?c.J:{t:o,r:o,b:o,l:o});o=u.t.a(i);var x=u.r.a(i),y=u.b.a(i);u=u.l.a(i);var z=b.slice,B=z.t.a(i),E=z.r.a(i),D=z.b.a(i);z=z.l.a(i);var C=m-u-x,F=p-o-
-y,O=r-z-E,H=t-B-D,M=g===q?C:O*o/B,P=j===q?F:H*x/E,I=g===q?C:O*y/D;q=j===q?F:H*u/z;var K=[],J=[],G=0;if(g===k){M-=(M-(C%M||M))/s(C/M);I-=(I-(C%I||I))/s(C/I)}if(j===k){P-=(P-(F%P||P))/s(F/P);q-=(q-(F%q||q))/s(F/q)}k=['<svg width="'+m+'" height="'+p+'" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">'];n(0,0,u,o,0,0,z,B,u,o);n(u,0,C,o,z,0,O,B,M,o);n(m-x,0,x,o,r-E,0,E,B,x,o);n(0,o,u,F,0,B,z,H,u,q);if(b.fill)n(u,o,C,F,z,B,O,H,M||I||O,q||P||H);n(m-x,o,x,F,r-E,B,E,H,x,P);n(0,
-p-y,u,y,0,t-D,z,D,u,y);n(u,p-y,C,y,z,t-D,O,D,I,y);n(m-x,p-y,x,y,r-E,t-D,E,D,x,y);k.push("<defs>"+K.join("\n")+"</defs>"+J.join("\n")+"</svg>");a.parent.gb(a.ua,"url(data:image/svg+xml,"+escape(k.join(""))+") no-repeat border-box border-box");h&&a.parent.ab()},a);h=1},Dd:function(){var a={};return function(b,c,d){var e=a[b],g;if(!e){e=new Image;g=doc.createElement("canvas");e.src=b;g.width=c;g.height=d;g.getContext("2d").drawImage(e,0,0);e=a[b]=g.toDataURL()}return e}}(),Ea:f.Tb.prototype.Ea,m:function(){var a=
-this.e.runtimeStyle;this.parent.gb(this.ua);a.borderColor=a.borderStyle=a.borderWidth=""}});f.kb=function(){function a(l,q){l.className+=" "+q}function b(l){var q=v.slice.call(arguments,1),s=q.length;setTimeout(function(){if(l)for(;s--;)a(l,q[s])},0)}function c(l){var q=v.slice.call(arguments,1),s=q.length;setTimeout(function(){if(l)for(;s--;){var o=q[s];o=t[o]||(t[o]=new RegExp("\\b"+o+"\\b","g"));l.className=l.className.replace(o,"")}},0)}function d(l){function q(){if(!U){var w,A,L=f.ja,T=l.currentStyle,
-N=T.getAttribute(g)==="true",da=T.getAttribute(i)!=="false",ea=T.getAttribute(h)!=="false";S=T.getAttribute(j);S=L>7?S!=="false":S==="true";if(!R){R=1;l.runtimeStyle.zoom=1;T=l;for(var fa=1;T=T.previousSibling;)if(T.nodeType===1){fa=0;break}fa&&a(l,p)}J.cb();if(N&&(A=J.o())&&(w=doc.documentElement||doc.body)&&(A.y>w.clientHeight||A.x>w.clientWidth||A.y+A.f<0||A.x+A.h<0)){if(!Y){Y=1;f.mb.ba(q)}}else{U=1;Y=R=0;f.mb.Ha(q);if(L===9){G={C:new f.Sb(l),q:new f.Ub(l),w:new f.Vb(l)};Q=[G.C,G.q];K=new f.Oc(l,
-J,G);w=[new f.Mc(l,J,G,K),new f.Nc(l,J,G,K)]}else{G={C:new f.Sb(l),w:new f.Vb(l),q:new f.Ub(l),G:new f.jb(l),ga:new f.Ic(l),Pb:new f.Uc(l)};Q=[G.C,G.w,G.q,G.G,G.ga,G.Pb];K=new f.Rc(l,J,G);w=[new f.Hc(l,J,G,K),new f.Fc(l,J,G,K),new f.Gc(l,J,G,K),new f.Tb(l,J,G,K)];l.tagName==="IMG"&&w.push(new f.Pc(l,J,G,K));K.ed=w}I=[K].concat(w);if(w=l.currentStyle.getAttribute(f.F+"watch-ancestors")){w=parseInt(w,10);A=0;for(N=l.parentNode;N&&(w==="NaN"||A++<w);){H(N,"onpropertychange",C);H(N,"onmouseenter",x);
-H(N,"onmouseleave",y);H(N,"onmousedown",z);if(N.tagName in f.fc){H(N,"onfocus",E);H(N,"onblur",D)}N=N.parentNode}}if(S){f.Oa.ba(o);f.Oa.Rd()}o(1)}if(!V){V=1;L<9&&H(l,"onmove",s);H(l,"onresize",s);H(l,"onpropertychange",u);ea&&H(l,"onmouseenter",x);if(ea||da)H(l,"onmouseleave",y);da&&H(l,"onmousedown",z);if(l.tagName in f.fc){H(l,"onfocus",E);H(l,"onblur",D)}f.Qa.ba(s);f.L.ba(M)}J.hb()}}function s(){J&&J.Ad()&&o()}function o(w){if(!X)if(U){var A,L=I.length;F();for(A=0;A<L;A++)I[A].Ea();if(w||J.Od())for(A=
-0;A<L;A++)I[A].ib();if(w||J.Td())for(A=0;A<L;A++)I[A].Mb();K.ab();O()}else R||q()}function u(){var w,A=I.length,L;w=event;if(!X&&!(w&&w.propertyName in r))if(U){F();for(w=0;w<A;w++)I[w].Ea();for(w=0;w<A;w++){L=I[w];L.Cb||L.ib();L.Q()&&L.Lb()}K.ab();O()}else R||q()}function x(){b(l,k)}function y(){c(l,k,n)}function z(){b(l,n);f.lb.ba(B)}function B(){c(l,n);f.lb.Ha(B)}function E(){b(l,m)}function D(){c(l,m)}function C(){var w=event.propertyName;if(w==="className"||w==="id")u()}function F(){J.cb();for(var w=
-Q.length;w--;)Q[w].cb()}function O(){for(var w=Q.length;w--;)Q[w].hb();J.hb()}function H(w,A,L){w.attachEvent(A,L);W.push([w,A,L])}function M(){if(V){for(var w=W.length,A;w--;){A=W[w];A[0].detachEvent(A[1],A[2])}f.L.Ha(M);V=0;W=[]}}function P(){if(!X){var w,A;M();X=1;if(I){w=0;for(A=I.length;w<A;w++){I[w].ec=1;I[w].m()}}S&&f.Oa.Ha(o);f.Qa.Ha(o);I=J=G=Q=l=null}}var I,K,J=new ha(l),G,Q,R,U,V,W=[],Y,X,S;this.Ed=q;this.update=o;this.m=P;this.qd=l}var e={},g=f.F+"lazy-init",j=f.F+"poll",i=f.F+"track-active",
-h=f.F+"track-hover",k=f.La+"hover",n=f.La+"active",m=f.La+"focus",p=f.La+"first-child",r={background:1,bgColor:1,display:1},t={},v=[];d.yd=function(l){var q=f.p.Ba(l);return e[q]||(e[q]=new d(l))};d.m=function(l){l=f.p.Ba(l);var q=e[l];if(q){q.m();delete e[l]}};d.md=function(){var l=[],q;if(e){for(var s in e)if(e.hasOwnProperty(s)){q=e[s];l.push(q.qd);q.m()}e={}}return l};return d}();f.supportsVML=f.zc;f.attach=function(a){f.ja<10&&f.zc&&f.kb.yd(a).Ed()};f.detach=function(a){f.kb.m(a)}};
-var $=element;function init(){if(doc.media!=="print"){var a=window.PIE;a&&a.attach($)}}function cleanup(){if(doc.media!=="print"){var a=window.PIE;if(a){a.detach($);$=0}}}$.readyState==="complete"&&init();
-</script>
-</PUBLIC:COMPONENT>
diff --git a/assets/js/ie/backgroundsize.min.htc b/assets/js/ie/backgroundsize.min.htc
deleted file mode 100644
index 3d9960d..0000000
--- a/assets/js/ie/backgroundsize.min.htc
+++ /dev/null
@@ -1,7 +0,0 @@
-<component lightWeight="true">
-<attach event="onpropertychange" onevent="handlePropertychange()" />
-<attach event="ondetach" onevent="restore()" />
-<attach event="onresize" for="window" onevent="handleResize()" />
-<script type="text/javascript">
-var rsrc=/url\(["']?(.*?)["']?\)/,positions={top:0,left:0,bottom:1,right:1,center:0.5},doc=element.document;init(); function init(){var b=doc.createElement("div"),a=doc.createElement("img"),c,d;b.style.position="absolute";b.style.zIndex=-1;b.style.top=0;b.style.right=0;b.style.left=0;b.style.bottom=0;b.style.overflow="hidden";a.style.position="absolute";a.style.width=a.style.width="auto";b.appendChild(a);element.insertBefore(b,element.firstChild);d=[element.currentStyle.backgroundPositionX,element.currentStyle.backgroundPositionY];element.bgsExpando=c={wrapper:b,img:a,backgroundSize:element.currentStyle["background-size"], backgroundPositionX:positions[d[0]]||parseFloat(d[0])/100,backgroundPositionY:positions[d[1]]||parseFloat(d[1])/100};"auto"==element.currentStyle.zIndex&&(element.style.zIndex=0);"static"==element.currentStyle.position&&(element.style.position="relative");refreshDisplay(element,c)&&(refreshDimensions(element,c),refreshBackgroundImage(element,c,function(){updateBackground(element,c)}))} function refreshDisplay(b,a){var c=b.currentStyle.display;c!=a.display&&(a.display=c,a.somethingChanged=!0);return"none"!=c}function refreshDimensions(b,a){var c=b.offsetWidth-(parseFloat(b.currentStyle.borderLeftWidth)||0)-(parseFloat(b.currentStyle.borderRightWidth)||0),d=b.offsetHeight-(parseFloat(b.currentStyle.borderTopWidth)||0)-(parseFloat(b.currentStyle.borderBottomWidth)||0);if(c!=a.innerWidth||d!=a.innerHeight)a.innerWidth=c,a.innerHeight=d,a.somethingChanged=!0} function refreshBackgroundImage(b,a,c){var d=a.img,e=(rsrc.exec(b.currentStyle.backgroundImage)||[])[1];if(e&&e!=a.backgroundSrc){a.backgroundSrc=e;a.somethingChanged=!0;d.onload=function(){var b=d.width,e=d.height;1==b&&1==e||(a.imgWidth=b,a.imgHeight=e,a.constrain=!1,c(),d.style.visibility="visible",d.onload=null)};d.style.visibility="hidden";d.src=a.backgroundSrc;if(d.readyState||d.complete)d.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",d.src=a.backgroundSrc;a.ignoreNextPropertyChange= !0;b.style.backgroundImage="none"}else c()} function updateBackground(b,a){if(a.somethingChanged){var c=a.img,d=a.innerWidth/a.innerHeight,e=a.imgWidth/a.imgHeight,f=a.constrain;"contain"==a.backgroundSize?e>d?(a.constrain=d="width",e=Math.floor((a.innerHeight-a.innerWidth/e)*a.backgroundPositionY),c.style.top=e+"px",d!=f&&(c.style.width="100%",c.style.height="auto",c.style.left=0)):(a.constrain=d="height",e=Math.floor((a.innerWidth-a.innerHeight*e)*a.backgroundPositionX),c.style.left=e+"px",d!=f&&(c.style.width="auto",c.style.height="100%", c.style.top=0)):"cover"==a.backgroundSize&&(e>d?(a.constrain=d="height",e=Math.floor((a.innerHeight*e-a.innerWidth)*a.backgroundPositionX),c.style.left=-e+"px",d!=f&&(c.style.width="auto",c.style.height="100%",c.style.top=0)):(a.constrain=d="width",e=Math.floor((a.innerWidth/e-a.innerHeight)*a.backgroundPositionY),c.style.top=-e+"px",d!=f&&(c.style.width="100%",c.style.height="auto",c.style.left=0)));a.somethingChanged=!1}} function handlePropertychange(){var b=element.bgsExpando;b.ignoreNextPropertyChange?b.ignoreNextPropertyChange=!1:refreshDisplay(element,b)&&(refreshDimensions(element,b),refreshBackgroundImage(element,b,function(){updateBackground(element,b)}))}function handleResize(){var b=element.bgsExpando;"none"!=b.display&&(refreshDimensions(element,b),updateBackground(element,b))} function restore(){var b=element.bgsExpando;try{element.style.backgroundImage="url('"+b.backgroundSrc+"')",element.removeChild(b.wrapper),element.bgsExpando=null}catch(a){}};
-</script>
\ No newline at end of file
diff --git a/assets/js/ie/html5shiv.js b/assets/js/ie/html5shiv.js
deleted file mode 100644
index dcf351c..0000000
--- a/assets/js/ie/html5shiv.js
+++ /dev/null
@@ -1,8 +0,0 @@
-/*
- HTML5 Shiv v3.6.2 | @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,main,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 main mark meter nav output progress section summary time video",version:"3.6.2",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);
diff --git a/assets/js/ie/respond.min.js b/assets/js/ie/respond.min.js
deleted file mode 100644
index e8d6207..0000000
--- a/assets/js/ie/respond.min.js
+++ /dev/null
@@ -1,6 +0,0 @@
-/*! Respond.js v1.4.2: min/max-width media query polyfill
- * Copyright 2014 Scott Jehl
- * Licensed under MIT
- * http://j.mp/respondjs */
-
-!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='&shy;<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(a.document)}(this),function(a){"use strict";function b(){v(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();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))},g=function(a){return a.replace(c.regex.minmaxwh,"").match(c.regex.other)};if(c.ajax=f,c.queue=d,c.unsupportedmq=g,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,comments:/\/\*[^*]*\*+([^/][^*]*\*+)*\//gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\(\s*min\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,maxw:/\(\s*max\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,minmaxwh:/\(\s*m(in|ax)\-(height|width)\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/gi,other:/\([^\)]*\)/g},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var h,i,j,k=a.document,l=k.documentElement,m=[],n=[],o=[],p={},q=30,r=k.getElementsByTagName("head")[0]||l,s=k.getElementsByTagName("base")[0],t=r.getElementsByTagName("link"),u=function(){var a,b=k.createElement("div"),c=k.body,d=l.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=k.createElement("body"),c.style.background="none"),l.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&l.insertBefore(c,l.firstChild),a=b.offsetWidth,f?l.removeChild(c):c.removeChild(b),l.style.fontSize=d,e&&(c.style.fontSize=e),a=j=parseFloat(a)},v=function(b){var c="clientWidth",d=l[c],e="CSS1Compat"===k.compatMode&&d||k.body[c]||d,f={},g=t[t.length-1],p=(new Date).getTime();if(b&&h&&q>p-h)return a.clearTimeout(i),i=a.setTimeout(v,q),void 0;h=p;for(var s in m)if(m.hasOwnProperty(s)){var w=m[s],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?j||u():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?j||u():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(n[w.rules]))}for(var C in o)o.hasOwnProperty(C)&&o[C]&&o[C].parentNode===r&&r.removeChild(o[C]);o.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=k.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,r.insertBefore(E,g.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(k.createTextNode(F)),o.push(E)}},w=function(a,b,d){var e=a.replace(c.regex.comments,"").replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},i=!f&&d;b.length&&(b+="/"),i&&(f=1);for(var j=0;f>j;j++){var k,l,o,p;i?(k=d,n.push(h(a))):(k=e[j].match(c.regex.findStyles)&&RegExp.$1,n.push(RegExp.$2&&h(RegExp.$2))),o=k.split(","),p=o.length;for(var q=0;p>q;q++)l=o[q],g(l)||m.push({media:l.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:n.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}v()},x=function(){if(d.length){var b=d.shift();f(b.href,function(c){w(c,b.href,b.media),p[b.href]=!0,a.setTimeout(function(){x()},0)})}},y=function(){for(var b=0;b<t.length;b++){var c=t[b],e=c.href,f=c.media,g=c.rel&&"stylesheet"===c.rel.toLowerCase();e&&g&&!p[e]&&(c.styleSheet&&c.styleSheet.rawCssText?(w(c.styleSheet.rawCssText,e,f),p[e]=!0):(!/^([a-zA-Z:]*\/\/)/.test(e)&&!s||e.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&("//"===e.substring(0,2)&&(e=a.location.protocol+e),d.push({href:e,media:f})))}x()};y(),c.update=y,c.getEmValue=u,a.addEventListener?a.addEventListener("resize",b,!1):a.attachEvent&&a.attachEvent("onresize",b)}}(this);
\ No newline at end of file
diff --git a/assets/js/jquery.scrollex.min.js b/assets/js/jquery.scrollex.min.js
new file mode 100644
index 0000000..a4727fe
--- /dev/null
+++ b/assets/js/jquery.scrollex.min.js
@@ -0,0 +1,2 @@
+/* jquery.scrollex v0.2.1 | (c) @ajlkn | github.com/ajlkn/jquery.scrollex | MIT licensed */
+!function(t){function e(t,e,n){return"string"==typeof t&&("%"==t.slice(-1)?t=parseInt(t.substring(0,t.length-1))/100*e:"vh"==t.slice(-2)?t=parseInt(t.substring(0,t.length-2))/100*n:"px"==t.slice(-2)&&(t=parseInt(t.substring(0,t.length-2)))),t}var n=t(window),i=1,o={};n.on("scroll",function(){var e=n.scrollTop();t.map(o,function(t){window.clearTimeout(t.timeoutId),t.timeoutId=window.setTimeout(function(){t.handler(e)},t.options.delay)})}).on("load",function(){n.trigger("scroll")}),jQuery.fn.scrollex=function(l){var s=t(this);if(0==this.length)return s;if(this.length>1){for(var r=0;r<this.length;r++)t(this[r]).scrollex(l);return s}if(s.data("_scrollexId"))return s;var a,u,h,c,p;switch(a=i++,u=jQuery.extend({top:0,bottom:0,delay:0,mode:"default",enter:null,leave:null,initialize:null,terminate:null,scroll:null},l),u.mode){case"top":h=function(t,e,n,i,o){return t>=i&&o>=t};break;case"bottom":h=function(t,e,n,i,o){return n>=i&&o>=n};break;case"middle":h=function(t,e,n,i,o){return e>=i&&o>=e};break;case"top-only":h=function(t,e,n,i,o){return i>=t&&n>=i};break;case"bottom-only":h=function(t,e,n,i,o){return n>=o&&o>=t};break;default:case"default":h=function(t,e,n,i,o){return n>=i&&o>=t}}return c=function(t){var i,o,l,s,r,a,u=this.state,h=!1,c=this.$element.offset();i=n.height(),o=t+i/2,l=t+i,s=this.$element.outerHeight(),r=c.top+e(this.options.top,s,i),a=c.top+s-e(this.options.bottom,s,i),h=this.test(t,o,l,r,a),h!=u&&(this.state=h,h?this.options.enter&&this.options.enter.apply(this.element):this.options.leave&&this.options.leave.apply(this.element)),this.options.scroll&&this.options.scroll.apply(this.element,[(o-r)/(a-r)])},p={id:a,options:u,test:h,handler:c,state:null,element:this,$element:s,timeoutId:null},o[a]=p,s.data("_scrollexId",p.id),p.options.initialize&&p.options.initialize.apply(this),s},jQuery.fn.unscrollex=function(){var e=t(this);if(0==this.length)return e;if(this.length>1){for(var n=0;n<this.length;n++)t(this[n]).unscrollex();return e}var i,l;return(i=e.data("_scrollexId"))?(l=o[i],window.clearTimeout(l.timeoutId),delete o[i],e.removeData("_scrollexId"),l.options.terminate&&l.options.terminate.apply(this),e):e}}(jQuery);
\ No newline at end of file
diff --git a/assets/js/main.js b/assets/js/main.js
index c73a3da..d583df3 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -1,5 +1,5 @@
 /*
-	Photon by HTML5 UP
+	Story by HTML5 UP
 	html5up.net | @ajlkn
 	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
 */
@@ -8,17 +8,18 @@
 
 	skel.breakpoints({
 		xlarge: '(max-width: 1680px)',
-		large: '(max-width: 1140px)',
+		large: '(max-width: 1280px)',
 		medium: '(max-width: 980px)',
 		small: '(max-width: 736px)',
 		xsmall: '(max-width: 480px)',
-		xxsmall: '(max-width: 320px)'
+		xxsmall: '(max-width: 360px)'
 	});
 
 	$(function() {
 
 		var	$window = $(window),
-			$body = $('body');
+			$body = $('body'),
+			$wrapper = $('#wrapper');
 
 		// Disable animations/transitions until the page has loaded.
 			$body.addClass('is-loading');
@@ -26,23 +27,331 @@
 			$window.on('load', function() {
 				window.setTimeout(function() {
 					$body.removeClass('is-loading');
-				}, 250);
+				}, 100);
 			});
 
 		// Fix: Placeholder polyfill.
 			$('form').placeholder();
 
-		// Prioritize "important" elements on mobile.
-			skel.on('+mobile -mobile', function() {
+		// Prioritize "important" elements on medium.
+			skel.on('+medium -medium', function() {
 				$.prioritize(
-					'.important\\28 mobile\\29',
-					skel.breakpoint('mobile').active
+					'.important\\28 medium\\29',
+					skel.breakpoint('medium').active
 				);
 			});
 
-		// Scrolly.
-			$('.scrolly').scrolly();
+		// Browser fixes.
+
+			// IE: Flexbox min-height bug.
+				if (skel.vars.browser == 'ie')
+					(function() {
+
+						var flexboxFixTimeoutId;
+
+						$window.on('resize.flexbox-fix', function() {
+
+							var $x = $('.fullscreen');
+
+							clearTimeout(flexboxFixTimeoutId);
+
+							flexboxFixTimeoutId = setTimeout(function() {
+
+								if ($x.prop('scrollHeight') > $window.height())
+									$x.css('height', 'auto');
+								else
+									$x.css('height', '100vh');
+
+							}, 250);
+
+						}).triggerHandler('resize.flexbox-fix');
+
+					})();
+
+			// Object fit workaround.
+				if (!skel.canUse('object-fit'))
+					(function() {
+
+						$('.banner .image, .spotlight .image').each(function() {
+
+							var $this = $(this),
+								$img = $this.children('img'),
+								positionClass = $this.parent().attr('class').match(/image-position-([a-z]+)/);
+
+							// Set image.
+								$this
+									.css('background-image', 'url("' + $img.attr('src') + '")')
+									.css('background-repeat', 'no-repeat')
+									.css('background-size', 'cover');
+
+							// Set position.
+								switch (positionClass.length > 1 ? positionClass[1] : '') {
+
+									case 'left':
+										$this.css('background-position', 'left');
+										break;
+
+									case 'right':
+										$this.css('background-position', 'right');
+										break;
+
+									default:
+									case 'center':
+										$this.css('background-position', 'center');
+										break;
+
+								}
+
+							// Hide original.
+								$img.css('opacity', '0');
+
+						});
+
+					})();
+
+		// Smooth scroll.
+			$('.smooth-scroll').scrolly();
+			$('.smooth-scroll-middle').scrolly({ anchor: 'middle' });
+
+		// Wrapper.
+			$wrapper.children()
+				.scrollex({
+					top:		'30vh',
+					bottom:		'30vh',
+					initialize:	function() {
+						$(this).addClass('is-inactive');
+					},
+					terminate:	function() {
+						$(this).removeClass('is-inactive');
+					},
+					enter:		function() {
+						$(this).removeClass('is-inactive');
+					},
+					leave:		function() {
+
+						var $this = $(this);
+
+						if ($this.hasClass('onscroll-bidirectional'))
+							$this.addClass('is-inactive');
+
+					}
+				});
+
+		// Items.
+			$('.items')
+				.scrollex({
+					top:		'30vh',
+					bottom:		'30vh',
+					delay:		50,
+					initialize:	function() {
+						$(this).addClass('is-inactive');
+					},
+					terminate:	function() {
+						$(this).removeClass('is-inactive');
+					},
+					enter:		function() {
+						$(this).removeClass('is-inactive');
+					},
+					leave:		function() {
+
+						var $this = $(this);
+
+						if ($this.hasClass('onscroll-bidirectional'))
+							$this.addClass('is-inactive');
+
+					}
+				})
+				.children()
+					.wrapInner('<div class="inner"></div>');
+
+		// Gallery.
+			$('.gallery')
+				.wrapInner('<div class="inner"></div>')
+				.prepend(skel.vars.mobile ? '' : '<div class="forward"></div><div class="backward"></div>')
+				.scrollex({
+					top:		'30vh',
+					bottom:		'30vh',
+					delay:		50,
+					initialize:	function() {
+						$(this).addClass('is-inactive');
+					},
+					terminate:	function() {
+						$(this).removeClass('is-inactive');
+					},
+					enter:		function() {
+						$(this).removeClass('is-inactive');
+					},
+					leave:		function() {
+
+						var $this = $(this);
+
+						if ($this.hasClass('onscroll-bidirectional'))
+							$this.addClass('is-inactive');
+
+					}
+				})
+				.children('.inner')
+					//.css('overflow', 'hidden')
+					.css('overflow-y', skel.vars.mobile ? 'visible' : 'hidden')
+					.css('overflow-x', skel.vars.mobile ? 'scroll' : 'hidden')
+					.scrollLeft(0);
+
+			// Style #1.
+				// ...
+
+			// Style #2.
+				$('.gallery')
+					.on('wheel', '.inner', function(event) {
+
+						var	$this = $(this),
+							delta = (event.originalEvent.deltaX * 10);
+
+						// Cap delta.
+							if (delta > 0)
+								delta = Math.min(25, delta);
+							else if (delta < 0)
+								delta = Math.max(-25, delta);
+
+						// Scroll.
+							$this.scrollLeft( $this.scrollLeft() + delta );
+
+					})
+					.on('mouseenter', '.forward, .backward', function(event) {
+
+						var $this = $(this),
+							$inner = $this.siblings('.inner'),
+							direction = ($this.hasClass('forward') ? 1 : -1);
+
+						// Clear move interval.
+							clearInterval(this._gallery_moveIntervalId);
+
+						// Start interval.
+							this._gallery_moveIntervalId = setInterval(function() {
+								$inner.scrollLeft( $inner.scrollLeft() + (5 * direction) );
+							}, 10);
+
+					})
+					.on('mouseleave', '.forward, .backward', function(event) {
+
+						// Clear move interval.
+							clearInterval(this._gallery_moveIntervalId);
+
+					});
+
+			// Lightbox.
+				$('.gallery.lightbox')
+					.on('click', 'a', function(event) {
+
+						var $a = $(this),
+							$gallery = $a.parents('.gallery'),
+							$modal = $gallery.children('.modal'),
+							$modalImg = $modal.find('img'),
+							href = $a.attr('href');
+
+						// Not an image? Bail.
+							if (!href.match(/\.(jpg|gif|png|mp4)$/))
+								return;
+
+						// Prevent default.
+							event.preventDefault();
+							event.stopPropagation();
+
+						// Locked? Bail.
+							if ($modal[0]._locked)
+								return;
+
+						// Lock.
+							$modal[0]._locked = true;
+
+						// Set src.
+							$modalImg.attr('src', href);
+
+						// Set visible.
+							$modal.addClass('visible');
+
+						// Focus.
+							$modal.focus();
+
+						// Delay.
+							setTimeout(function() {
+
+								// Unlock.
+									$modal[0]._locked = false;
+
+							}, 600);
+
+					})
+					.on('click', '.modal', function(event) {
+
+						var $modal = $(this),
+							$modalImg = $modal.find('img');
+
+						// Locked? Bail.
+							if ($modal[0]._locked)
+								return;
+
+						// Already hidden? Bail.
+							if (!$modal.hasClass('visible'))
+								return;
+
+						// Lock.
+							$modal[0]._locked = true;
+
+						// Clear visible, loaded.
+							$modal
+								.removeClass('loaded')
+
+						// Delay.
+							setTimeout(function() {
+
+								$modal
+									.removeClass('visible')
+
+								setTimeout(function() {
+
+									// Clear src.
+										$modalImg.attr('src', '');
+
+									// Unlock.
+										$modal[0]._locked = false;
+
+									// Focus.
+										$body.focus();
+
+								}, 475);
+
+							}, 125);
+
+					})
+					.on('keypress', '.modal', function(event) {
+
+						var $modal = $(this);
+
+						// Escape? Hide modal.
+							if (event.keyCode == 27)
+								$modal.trigger('click');
+
+					})
+					.prepend('<div class="modal" tabIndex="-1"><div class="inner"><img src="" /></div></div>')
+						.find('img')
+							.on('load', function(event) {
+
+								var $modalImg = $(this),
+									$modal = $modalImg.parents('.modal');
+
+								setTimeout(function() {
+
+									// No longer visible? Bail.
+										if (!$modal.hasClass('visible'))
+											return;
+
+									// Set loaded.
+										$modal.addClass('loaded');
+
+								}, 275);
+
+							});
 
 	});
 
-})(jQuery);
\ No newline at end of file
+})(jQuery);
diff --git a/assets/sass/base/_page.scss b/assets/sass/base/_page.scss
new file mode 100644
index 0000000..a5e314e
--- /dev/null
+++ b/assets/sass/base/_page.scss
@@ -0,0 +1,38 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Basic */
+
+	// MSIE: Required for IEMobile.
+		@-ms-viewport {
+			width: device-width;
+		}
+
+	// MSIE: Prevents scrollbar from overlapping content.
+		body {
+			-ms-overflow-style: scrollbar;
+		}
+
+	// Ensures page width is always >=320px.
+		@include breakpoint(xsmall) {
+			html, body {
+				min-width: 320px;
+			}
+		}
+
+	body {
+		background: _palette(bg);
+
+		// Prevents animation/transition "flicker" on page load.
+		// Automatically added/removed by js/main.js.
+			&.is-loading {
+				*, *:before, *:after {
+					@include vendor('animation', 'none !important');
+					@include vendor('transition', 'none !important');
+				}
+			}
+
+	}
\ No newline at end of file
diff --git a/assets/sass/base/_typography.scss b/assets/sass/base/_typography.scss
new file mode 100644
index 0000000..c09953c
--- /dev/null
+++ b/assets/sass/base/_typography.scss
@@ -0,0 +1,231 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Type */
+
+	html {
+		font-size: 18pt;
+
+		@include breakpoint(xlarge) {
+			font-size: 14pt;
+		}
+
+		@include breakpoint(large) {
+			font-size: 12pt;
+		}
+
+		@include breakpoint(small) {
+			font-size: 11pt;
+		}
+
+		@include breakpoint(xxsmall) {
+			font-size: 10pt;
+		}
+	}
+
+	body {
+		background-color: _palette(bg);
+		color: _palette(fg);
+	}
+
+	body, input, select, textarea {
+		font-family: _font(family);
+		font-size: 1rem;
+		font-weight: _font(weight);
+		line-height: 1.65;
+	}
+
+	a {
+		@include vendor('transition', 'color #{_duration(transition)} ease-in-out');
+		text-decoration: underline;
+
+		&:hover {
+			text-decoration: none;
+		}
+	}
+
+	strong, b {
+		font-weight: _font(weight-bold);
+	}
+
+	em, i {
+		font-style: italic;
+	}
+
+	p {
+		margin: 0 0 _size(element-margin) 0;
+
+		&.major {
+			font-size: 1.25rem;
+		}
+	}
+
+	h1, h2, h3, h4, h5, h6 {
+		font-weight: _font(weight);
+		line-height: 1.375;
+		letter-spacing: _font(kerning);
+		margin: 0 0 (_size(element-margin) * 0.5) 0;
+
+		a {
+			color: inherit;
+			text-decoration: none;
+		}
+	}
+
+	h1 {
+		font-size: 3.5rem;
+		line-height: 1.2;
+	}
+
+	h2 {
+		font-size: 2.25rem;
+	}
+
+	h3 {
+		font-size: 1.5rem;
+	}
+
+	h4 {
+		font-size: 1.1rem;
+	}
+
+	h5 {
+		font-size: 0.9rem;
+	}
+
+	h6 {
+		font-size: 0.7rem;
+	}
+
+	sub {
+		font-size: 0.8rem;
+		position: relative;
+		top: 0.5rem;
+	}
+
+	sup {
+		font-size: 0.8rem;
+		position: relative;
+		top: -0.5rem;
+	}
+
+	blockquote {
+		border-left: solid (_size(border-width) * 4);
+		font-style: italic;
+		margin: 0 0 _size(element-margin) 0;
+		padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
+	}
+
+	code {
+		border-radius: _size(border-radius);
+		font-family: _font(family-fixed);
+		font-size: 0.9em;
+		margin: 0 0.25rem;
+		padding: 0.25rem 0.325rem;
+	}
+
+	pre {
+		-webkit-overflow-scrolling: touch;
+		font-family: _font(family-fixed);
+		font-size: 0.9em;
+		margin: 0 0 _size(element-margin) 0;
+
+		code {
+			display: block;
+			line-height: 1.5;
+			padding: 0.75rem 1rem;
+			overflow-x: auto;
+		}
+	}
+
+	hr {
+		border: 0;
+		border-bottom: solid _size(border-width);
+		margin: (_size(element-margin) * 1.25) 0;
+
+		&.major {
+			margin: (_size(element-margin) * 1.75) 0;
+		}
+	}
+
+	.align-left {
+		text-align: left;
+	}
+
+	.align-center {
+		text-align: center;
+	}
+
+	.align-right {
+		text-align: right;
+	}
+
+	@include breakpoint(small) {
+		p {
+			&.major {
+				font-size: 1.1rem;
+			}
+		}
+
+		h1 {
+			font-size: 2.5rem;
+		}
+
+		h2 {
+			font-size: 2rem;
+		}
+
+		h3 {
+			font-size: 1.25rem;
+		}
+
+		h4 {
+			font-size: 1rem;
+		}
+	}
+
+	@mixin color-typography($p: null) {
+
+		@if $p != null {
+			background-color: _palette($p, bg);
+			color: _palette($p, fg);
+		}
+
+		input, select, textarea {
+			color: _palette($p, fg-bold);
+		}
+
+		a {
+			color: _palette($p, fg-bold);
+
+			&:hover {
+				color: _palette($p, accent);
+			}
+		}
+
+		strong, b {
+			color: _palette($p, fg-bold);
+		}
+
+		h1, h2, h3, h4, h5, h6 {
+			color: _palette($p, fg-bold);
+		}
+
+		blockquote {
+			border-left-color: _palette($p, border);
+		}
+
+		code {
+			background: _palette($p, border-bg);
+			border-color: _palette($p, border);
+		}
+
+		hr {
+			border-bottom-color: _palette($p, border);
+		}
+	}
+
+	@include color-typography;
\ No newline at end of file
diff --git a/assets/sass/components/_banner.scss b/assets/sass/components/_banner.scss
new file mode 100644
index 0000000..df56a7f
--- /dev/null
+++ b/assets/sass/components/_banner.scss
@@ -0,0 +1,990 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Banner (transitions) */
+
+	.banner {
+
+		// Mixin.
+			@mixin transition-banner($event) {
+				$x: null;
+				$y: null;
+
+				@if ($event == 'load') {
+					$x: 'body.is-loading &';
+					$y: _duration(on-load);
+				}
+				@else if ($event == 'scroll') {
+					$x: '&.is-inactive';
+					$y: _duration(on-scroll);
+				}
+
+				// Content.
+					&.on#{$event}-content-fade-up {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateY(1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-down {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateY(-1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-left {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateX(1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-right {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateX(-1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-in {
+						.content {
+							@include vendor('transition', 'opacity #{$y} ease-in-out');
+						}
+
+						#{$x} {
+							.content {
+								opacity: 0;
+							}
+						}
+					}
+
+				// Image.
+					&.on#{$event}-image-fade-up {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateY(1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-down {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateY(-1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-left {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateX(1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-right {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateX(-1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-in {
+						.image {
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+							}
+						}
+
+						#{$x} {
+							.image {
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+			}
+
+		// On Load.
+			@include transition-banner('load');
+
+		// On Scroll.
+			@include transition-banner('scroll');
+
+	}
+
+/* Banner (style1) */
+
+	.banner.style1 {
+		@include vendor('align-items', 'stretch');
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'row');
+		@include vendor('justify-content', 'flex-end');
+		position: relative;
+		text-align: left;
+		overflow-x: hidden;
+
+		.content {
+			@include padding(_size(padding, default), _size(padding, default));
+			@include vendor('align-self', 'center');
+			@include vendor('flex-grow', '1');
+			@include vendor('flex-shrink', '1');
+			width: 50%;
+			max-width: (_size(inner) * 0.75);
+			margin: 0 auto;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			border-radius: 0;
+			width: 50%;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			.content {
+				@include padding(_size(padding, xlarge), _size(padding, xlarge));
+			}
+		}
+
+		@include breakpoint(large) {
+			.content {
+				@include padding(_size(padding, large), _size(padding, large));
+			}
+		}
+
+		@include breakpoint(medium) {
+			.content {
+				@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+			}
+		}
+
+		@include breakpoint(small) {
+			.content {
+				@include padding(_size(padding, small) * 1.25, _size(padding, small));
+			}
+		}
+
+		@include orientation(portrait) {
+			@include vendor('flex-direction', 'column-reverse');
+			text-align: center;
+
+			.content {
+				@include vendor('display', 'flex');
+				@include vendor('flex-direction', 'column');
+				@include vendor('justify-content', 'center');
+				width: 100%;
+				max-width: 100%;
+			}
+
+			.image {
+				width: 100%;
+				max-width: 100%;
+				height: 45vh;
+			}
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+
+					@include orientation(portrait) {
+						.content {
+							min-height: 50vh;
+						}
+
+						.image {
+							height: 50vh;
+						}
+					}
+				}
+
+			// Orientation.
+				&.orient-left {
+					// ...
+				}
+
+				&.orient-right {
+					@include vendor('flex-direction', 'row-reverse');
+
+					@include orientation(portrait) {
+						@include vendor('flex-direction', 'column-reverse');
+					}
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					// ...
+				}
+
+				&.content-align-center {
+					text-align: center;
+				}
+
+				&.content-align-right {
+					text-align: right;
+
+					@include orientation(portrait) {
+						text-align: center;
+					}
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					.image {
+						img {
+							// ...
+						}
+					}
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Banner (style2) */
+
+	.banner.style2 {
+		@include padding(_size(padding, default) * 0.75, _size(padding, default) * 0.75);
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('justify-content', 'center');
+		background-color: inherit;
+		position: relative;
+		text-align: center;
+		overflow-x: hidden;
+
+		.content {
+			@include padding(_size(padding, default) * 0.75, _size(padding, default) * 0.75);
+			position: relative;
+			width: (_size(inner) * 0.625);
+			max-width: 100%;
+			background-color: inherit;
+			border-radius: _size(border-radius-alt);
+			margin-bottom: _size(element-margin);
+			z-index: 1;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge) * 0.75, _size(padding, xlarge) * 0.75);
+
+			.content {
+				@include padding(_size(padding, xlarge) * 0.75, _size(padding, xlarge) * 0.75);
+			}
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large) * 0.75);
+
+			.content {
+				@include padding(_size(padding, large), _size(padding, large) * 0.75);
+			}
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium), _size(padding, medium));
+
+			.content {
+				@include padding(_size(padding, medium) * 1.25, _size(padding, medium) * 0.75);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small), _size(padding, small));
+
+			.content {
+				@include padding(_size(padding, small) * 1.25, _size(padding, small) * 0.75);
+			}
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+				}
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('justify-content', 'flex-start');
+					padding-left: 0;
+
+					.content {
+						border-top-left-radius: 0;
+						border-bottom-left-radius: 0;
+					}
+				}
+
+				&.orient-center {
+					// ...
+				}
+
+				&.orient-right {
+					@include vendor('justify-content', 'flex-end');
+					padding-right: 0;
+
+					.content {
+						border-top-right-radius: 0;
+						border-bottom-right-radius: 0;
+					}
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					text-align: left;
+				}
+
+				&.content-align-center {
+					// ...
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					.image {
+						img {
+							// ...
+						}
+					}
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Banner (style3) */
+
+	.banner.style3 {
+		$image-size: 21rem;
+		$content-size: (_size(inner) * 0.875) - $image-size - (_size(element-margin) * 1.75);
+
+		@include padding(_size(padding, default), _size(padding, default));
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'row-reverse');
+		@include vendor('justify-content', 'center');
+		position: relative;
+		text-align: left;
+		overflow-x: hidden;
+
+		.content {
+			width: $content-size;
+			max-width: 100%;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			width: $image-size;
+			height: $image-size;
+			border-radius: 100%;
+			margin: 0 (_size(element-margin) * 1.75) _size(element-margin) 0;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				width: 100%;
+				height: 100%;
+				border-radius: 100%;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge));
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large));
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+
+			.image {
+				width: ($image-size * 0.875);
+				height: ($image-size * 0.875);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small) * 1.25, _size(padding, small));
+			@include vendor('align-items', 'flex-start');
+
+			.image {
+				width: ($image-size * 0.75);
+				height: ($image-size * 0.75);
+				margin: 0 (_size(element-margin) * 1) _size(element-margin) 0;
+			}
+		}
+
+		@include orientation(portrait) {
+			@include vendor('align-items', 'center');
+			@include vendor('flex-direction', 'column-reverse');
+			text-align: center;
+
+			.content {
+				width: 34rem;
+				max-width: 100%;
+			}
+
+			.image {
+				margin-right: 0;
+			}
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+				}
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('flex-direction', 'row');
+
+					.image {
+						margin: 0 0 _size(element-margin) (_size(element-margin) * 1.75);
+					}
+
+					@include breakpoint(small) {
+						.image {
+							margin: 0 0 _size(element-margin) (_size(element-margin) * 1);
+						}
+					}
+
+					@include orientation(portrait) {
+						@include vendor('flex-direction', 'column-reverse');
+
+						.image {
+							margin-left: 0;
+						}
+					}
+				}
+
+				&.orient-right {
+					// ...
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					// ...
+				}
+
+				&.content-align-center {
+					text-align: center;
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Banner (style4) */
+
+	.banner.style4 {
+		$image-width: 13rem;
+		$content-size: (_size(inner) * 0.75) - $image-width - (_size(element-margin) * 1.75);
+
+		@include padding(_size(padding, default), _size(padding, default));
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'row-reverse');
+		@include vendor('justify-content', 'center');
+		position: relative;
+		text-align: left;
+		overflow-x: hidden;
+
+		.content {
+			width: $content-size;
+			max-width: 100%;
+		}
+
+		.image {
+			@include phone($image-width);
+			margin-right: (_size(element-margin) * 1.75);
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge));
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large));
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+
+			.image {
+				@include resize-phone($image-width, 0.875);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small) * 1.25, _size(padding, small));
+			@include vendor('align-items', 'flex-start');
+
+			.image {
+				@include resize-phone($image-width, 0.625);
+			}
+		}
+
+		@include orientation(portrait) {
+			@include vendor('align-items', 'center');
+			@include vendor('flex-direction', 'column-reverse');
+			text-align: center;
+
+			.content {
+				width: 34rem;
+				max-width: 100%;
+			}
+
+			.image {
+				margin-right: 0;
+				margin-left: 0;
+			}
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+				}
+
+			// Variant.
+				&.iphone {
+					// ...
+				}
+
+				&.android {
+					// ...
+				}
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('flex-direction', 'row');
+
+					.image {
+						margin-right: 0;
+						margin-left: (_size(element-margin) * 1.75);
+					}
+
+					@include orientation(portrait) {
+						@include vendor('flex-direction', 'column-reverse');
+
+						.image {
+							margin-right: 0;
+							margin-left: 0;
+						}
+					}
+				}
+
+				&.orient-right {
+					// ...
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					// ...
+				}
+
+				&.content-align-center {
+					text-align: center;
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Banner (style5) */
+
+	.banner.style5 {
+		@include padding(_size(padding, default), _size(padding, default));
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('justify-content', 'center');
+		background-color: inherit;
+		position: relative;
+		text-align: center;
+		overflow-x: hidden;
+
+		.content {
+			position: relative;
+			width: (_size(inner) * 0.625);
+			max-width: 100%;
+			margin-bottom: _size(element-margin);
+			z-index: 1;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+			opacity: _misc(overlay-opacity);
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge));
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large));
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small) * 1.25, _size(padding, small));
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					text-align: left;
+				}
+
+				&.content-align-center {
+					// ...
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+// Mixin
+
+	@mixin color-banner($p: null) {
+		.banner {
+			.image {
+				background-color: transparentize(_palette($p, fg-bold), 0.875);
+			}
+
+			@if ($p != 'invert') {
+				&.invert {
+					.image {
+						background-color: transparentize(_palette(invert, fg-bold), 0.875);
+					}
+				}
+			}
+		}
+
+		.banner.style4 {
+			.image {
+				@include color-phone($p);
+			}
+
+			// Variant.
+				&.iphone {
+					.image {
+						@include color-phone-variant('iphone', $p);
+					}
+				}
+
+				&.android {
+					.image {
+						@include color-phone-variant('android', $p);
+					}
+				}
+
+			@if ($p != 'invert') {
+				&.invert {
+					.image {
+						@include color-phone(invert);
+					}
+
+					// Variant.
+						&.iphone {
+							.image {
+								@include color-phone-variant('iphone', invert);
+							}
+						}
+
+						&.android {
+							.image {
+								@include color-phone-variant('android', invert);
+							}
+						}
+
+				}
+			}
+		}
+	}
+
+	@include color-banner;
\ No newline at end of file
diff --git a/assets/sass/components/_box.scss b/assets/sass/components/_box.scss
new file mode 100644
index 0000000..66178ca
--- /dev/null
+++ b/assets/sass/components/_box.scss
@@ -0,0 +1,34 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Box */
+
+	.box {
+		border-radius: _size(border-radius);
+		border: solid _size(border-width);
+		margin-bottom: _size(element-margin);
+		padding: 1.5rem;
+
+		> :last-child,
+		> :last-child > :last-child,
+		> :last-child > :last-child > :last-child {
+			margin-bottom: 0;
+		}
+
+		&.alt {
+			border: 0;
+			border-radius: 0;
+			padding: 0;
+		}
+	}
+
+	@mixin color-box($p: null) {
+ 		.box {
+ 			border-color: _palette($p, border);
+ 		}
+	}
+
+	@include color-box;
\ No newline at end of file
diff --git a/assets/sass/components/_button.scss b/assets/sass/components/_button.scss
new file mode 100644
index 0000000..9afca0c
--- /dev/null
+++ b/assets/sass/components/_button.scss
@@ -0,0 +1,114 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Button */
+
+	input[type="submit"],
+	input[type="reset"],
+	input[type="button"],
+	button,
+	.button {
+		@include vendor('appearance', 'none');
+		@include vendor('transition', (
+			'background-color #{_duration(transition)} ease-in-out',
+			'box-shadow #{_duration(transition)} ease-in-out',
+			'color #{_duration(transition)} ease-in-out'
+		));
+		border: 0;
+		cursor: pointer;
+		display: inline-block;
+		font-weight: _font(weight-bold);
+		letter-spacing: _font(kerning-alt);
+		text-align: center;
+		text-decoration: none;
+		text-transform: uppercase;
+		white-space: nowrap;
+		font-size: 0.75rem;
+		max-width: 20rem;
+		height: 3.75em;
+		line-height: 3.75em;
+		border-radius: 3.75em;
+		padding: 0 2.5em;
+		text-overflow: ellipsis;
+		overflow: hidden;
+
+		&.icon {
+			&:before {
+				margin-right: 0.5rem;
+			}
+		}
+
+		&.fit {
+			display: block;
+			margin: 0 0 (_size(element-margin) * 0.5) 0;
+			width: 100%;
+		}
+
+		&.small {
+			font-size: 0.6rem;
+			height: 3.325em;
+			line-height: 3.325em;
+			border-radius: 3.325em;
+			padding: 0 2em;
+		}
+
+		&.big {
+			font-size: 0.8rem;
+			height: 4em;
+			line-height: 4em;
+			border-radius: 4em;
+			padding: 0 3em;
+		}
+
+		&.wide {
+			min-width: 14em;
+		}
+
+		&.disabled,
+		&:disabled {
+			@include vendor('pointer-events', 'none');
+			opacity: 0.25;
+		}
+	}
+
+	@mixin color-button($p: null) {
+		input[type="submit"],
+		input[type="reset"],
+		input[type="button"],
+		button,
+		.button {
+			background-color: transparent;
+			box-shadow: inset 0 0 0 _size(border-width) _palette($p, border);
+			color: _palette($p, fg-bold) !important;
+
+			&:hover {
+				box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
+				color: _palette($p, accent) !important;
+			}
+
+			&:active {
+				background-color: transparentize(_palette($p, accent), 0.8);
+				box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
+				color: _palette($p, accent) !important;
+			}
+
+			&.special {
+				background-color: _palette($p, fg-bold);
+				box-shadow: none;
+				color: _palette($p, bg) !important;
+
+				&:hover {
+					background-color: _palette($p, accent);
+				}
+
+				&:active {
+					background-color: darken(_palette($p, accent), 12);
+				}
+			}
+		}
+	}
+
+	@include color-button;
\ No newline at end of file
diff --git a/assets/sass/components/_form.scss b/assets/sass/components/_form.scss
new file mode 100644
index 0000000..1550c62
--- /dev/null
+++ b/assets/sass/components/_form.scss
@@ -0,0 +1,312 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Form */
+
+	form {
+		$gutter: _size(element-margin) * 0.75;
+
+		margin: 0 0 _size(element-margin) 0;
+
+		.field {
+			margin: 0 0 ($gutter * 1) 0;
+			clear: both;
+
+			&.half {
+				clear: none;
+				width: 50%;
+				float: left;
+				padding: 0 0 0 ($gutter * 1 * 0.5);
+
+				&.first {
+					padding: 0 ($gutter * 1 * 0.5) 0 0;
+				}
+			}
+
+			&.third {
+				clear: none;
+				width: (100% / 3);
+				float: left;
+				padding: 0 0 0 ($gutter * 1 * 0.5);
+
+				&.first {
+					padding: 0 ($gutter * 1 * 0.5) 0 0;
+				}
+			}
+		}
+
+		> .actions {
+			clear: both;
+			margin: ($gutter * 1.25) 0 0 0 !important;
+		}
+
+		@include breakpoint(small) {
+			.field {
+				margin: 0 0 ($gutter * 0.75) 0;
+
+				&.half {
+					padding: 0 0 0 ($gutter * 0.75 * 0.5);
+
+					&.first {
+						padding: 0 ($gutter * 0.75 * 0.5) 0 0;
+					}
+				}
+			}
+
+			> .actions {
+				margin: ($gutter * 1) 0 0 0 !important;
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			.field {
+				&.half {
+					width: 100%;
+					float: none;
+					padding: 0;
+
+					&.first {
+						padding: 0;
+					}
+				}
+
+				&.third {
+					width: 100%;
+					float: none;
+					padding: 0;
+
+					&.first {
+						padding: 0;
+					}
+				}
+			}
+		}
+	}
+
+	label {
+		display: block;
+		font-size: 0.9rem;
+		font-weight: _font(weight-bold);
+		margin: 0 0 (_size(element-margin) * 0.5) 0;
+	}
+
+	input[type="text"],
+	input[type="password"],
+	input[type="email"],
+	input[type="tel"],
+	input[type="search"],
+	input[type="url"],
+	select,
+	textarea {
+		@include vendor('appearance', 'none');
+		background-color: transparent;
+		border-radius: _size(border-radius);
+		border: none;
+		border: solid _size(border-width);
+		color: inherit;
+		display: block;
+		outline: 0;
+		padding: 0 0.825rem;
+		text-decoration: none;
+		width: 100%;
+
+		&:invalid {
+			box-shadow: none;
+		}
+	}
+
+	.select-wrapper {
+		@include icon;
+		display: block;
+		position: relative;
+
+		&:before {
+			content: '\f078';
+			display: block;
+			height: _size(element-height);
+			line-height: _size(element-height);
+			pointer-events: none;
+			position: absolute;
+			right: 0;
+			text-align: center;
+			top: 0;
+			width: _size(element-height);
+		}
+
+		select::-ms-expand {
+			display: none;
+		}
+	}
+
+	input[type="text"],
+	input[type="password"],
+	input[type="email"],
+	input[type="tel"],
+	input[type="search"],
+	input[type="url"],
+	select {
+		height: _size(element-height);
+	}
+
+	textarea {
+		padding: 0.75rem 1rem;
+	}
+
+	input[type="checkbox"],
+	input[type="radio"], {
+		@include vendor('appearance', 'none');
+		display: block;
+		float: left;
+		margin-right: -2rem;
+		opacity: 0;
+		width: 1rem;
+		z-index: -1;
+
+		& + label {
+			@include icon;
+			@include vendor('user-select', 'none');
+			cursor: pointer;
+			display: inline-block;
+			font-size: 1rem;
+			font-weight: _font(weight);
+			padding-left: (_size(element-height) * 0.6) + 0.75rem;
+			padding-right: 0.75rem;
+			position: relative;
+			margin-bottom: 0;
+
+			&:before {
+				border-radius: _size(border-radius);
+				border: solid _size(border-width);
+				content: '';
+				display: inline-block;
+				height: (_size(element-height) * 0.6);
+				left: 0;
+				line-height: (_size(element-height) * 0.575);
+				position: absolute;
+				text-align: center;
+				top: 0;
+				width: (_size(element-height) * 0.6);
+			}
+		}
+
+		&:checked + label {
+			&:before {
+				content: '\f00c';
+			}
+		}
+	}
+
+	input[type="checkbox"] {
+		& + label {
+			&:before {
+				border-radius: _size(border-radius);
+			}
+		}
+	}
+
+	input[type="radio"] {
+		& + label {
+			&:before {
+				border-radius: 100%;
+			}
+		}
+	}
+
+	::-webkit-input-placeholder {
+		opacity: 1.0;
+	}
+
+	:-moz-placeholder {
+		opacity: 1.0;
+	}
+
+	::-moz-placeholder {
+		opacity: 1.0;
+	}
+
+	:-ms-input-placeholder {
+		opacity: 1.0;
+	}
+
+	.formerize-placeholder {
+		opacity: 1.0;
+	}
+
+	@mixin color-form($p: null) {
+		label {
+			color: _palette($p, fg-bold);
+		}
+
+		input[type="text"],
+		input[type="password"],
+		input[type="email"],
+		input[type="tel"],
+		input[type="search"],
+		input[type="url"],
+		select,
+		textarea {
+			border-color: _palette($p, border);
+
+			&:focus {
+				border-color: _palette($p, accent);
+				box-shadow: 0 0 0 _size(border-width) _palette($p, accent);
+			}
+		}
+
+		.select-wrapper {
+			&:before {
+				color: _palette($p, border);
+			}
+		}
+
+		input[type="checkbox"],
+		input[type="radio"], {
+			& + label {
+				color: _palette($p, fg);
+
+				&:before {
+					border-color: _palette($p, border);
+				}
+			}
+
+			&:checked + label {
+				&:before {
+					background-color: _palette($p, fg-bold);
+					border-color: _palette($p, fg-bold);
+					color: _palette($p, bg);
+				}
+			}
+
+			&:focus + label {
+				&:before {
+					border-color: _palette($p, accent);
+					box-shadow: 0 0 0 _size(border-width) _palette($p, accent);
+				}
+			}
+		}
+
+		::-webkit-input-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		:-moz-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		::-moz-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		:-ms-input-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		.formerize-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+	}
+
+	@include color-form;
\ No newline at end of file
diff --git a/assets/sass/components/_gallery.scss b/assets/sass/components/_gallery.scss
new file mode 100644
index 0000000..91ef227
--- /dev/null
+++ b/assets/sass/components/_gallery.scss
@@ -0,0 +1,616 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Gallery (transitions) */
+
+	.gallery {
+
+		// Mixin.
+			@mixin transition-gallery($event) {
+				$x: null;
+				$y: null;
+
+				@if ($event == 'load') {
+					$x: 'body.is-loading &';
+					$y: _duration(on-load);
+				}
+				@else if ($event == 'scroll') {
+					$x: '&.is-inactive';
+					$y: _duration(on-scroll);
+				}
+
+				&.on#{$event}-fade-in {
+					article {
+						.image {
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{_misc(gallery-limit) * _duration(gallery-delay)}');
+							}
+						}
+
+						@for $i from 0 through _misc(gallery-limit) {
+							&:nth-child(#{$i + 1}) {
+								.image {
+									img {
+										@include vendor('transition-delay', '#{$i * _duration(gallery-delay)}');
+									}
+								}
+							}
+						}
+					}
+
+					#{$x} {
+						article {
+							.image {
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+				}
+			}
+
+		// On Load.
+			@include transition-gallery('load');
+
+		// On Scroll.
+			@include transition-gallery('scroll');
+
+	}
+
+/* Gallery (style1) */
+
+	.gallery.style1 {
+		@include color-typography(invert);
+		@include color-button(invert);
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('flex-wrap', 'wrap');
+		@include vendor('justify-content', 'center');
+		position: relative;
+		width: 100%;
+		background-color: transparent;
+
+		> .forward, >.backward {
+			display: none;
+		}
+
+		> .inner {
+			@include vendor('align-items', 'inherit');
+			@include vendor('display', 'inherit');
+			@include vendor('flex-wrap', 'inherit');
+			@include vendor('justify-content', 'inherit');
+		}
+
+		article {
+			overflow: hidden;
+			position: relative;
+			width: 25%;
+
+			.image {
+				@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
+				display: block;
+				width: 100%;
+				border-radius: 0;
+
+				img {
+					display: block;
+					width: 100%;
+					border-radius: 0;
+				}
+			}
+
+			.caption {
+				@include vendor('align-items', 'center');
+				@include vendor('display', 'flex');
+				@include vendor('flex-direction', 'column');
+				@include vendor('justify-content', 'center');
+				@include vendor('pointer-events', 'none');
+				@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				background-color: transparentize(_palette(invert, bg), 1 - _misc(overlay-opacity));
+				opacity: 0;
+				padding: 2rem;
+				z-index: 1;
+				font-size: 0.8rem;
+
+				a {
+					@include vendor('pointer-events', 'auto');
+				}
+
+				h2, h3, h4, h5, h6 {
+					font-size: 1.25rem;
+					margin-bottom: 0.25rem;
+				}
+
+				> * {
+					max-width: 100%;
+					margin-bottom: 1rem;
+				}
+
+				> :last-child {
+					margin-bottom: 0;
+				}
+			}
+
+			&:hover {
+				.caption {
+					opacity: 1;
+				}
+			}
+		}
+
+		@include breakpoint(large) {
+			article {
+				width: (100% / 3);
+
+				.caption {
+					padding: 1rem;
+				}
+			}
+		}
+
+		@include breakpoint(medium) {
+			article {
+				width: 50%;
+
+				.caption {
+					padding: 1rem;
+				}
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			article {
+				width: 100%;
+
+				.caption {
+					padding: 1rem;
+				}
+			}
+		}
+
+		// Modifiers.
+
+			// size
+				&.small {
+					article {
+						width: 20%;
+
+						.caption {
+							padding: 1rem;
+						}
+					}
+
+					@include breakpoint(large) {
+						article {
+							width: 25%;
+
+							.caption {
+								padding: 1rem;
+							}
+						}
+					}
+
+					@include breakpoint(medium) {
+						article {
+							width: (100% / 3);
+
+							.caption {
+								padding: 1rem;
+							}
+						}
+					}
+
+					@include breakpoint(xsmall) {
+						article {
+							width: 50%;
+
+							.caption {
+								padding: 1rem;
+							}
+						}
+					}
+				}
+
+				&.medium {
+					// ...
+				}
+
+				&.big {
+					article {
+						width: (100% / 3);
+
+						.caption {
+							padding: 3rem;
+						}
+					}
+
+					@include breakpoint(large) {
+						article {
+							width: 50%;
+
+							.caption {
+								padding: 2rem;
+							}
+						}
+					}
+
+					@include breakpoint(medium) {
+						article {
+							width: 50%;
+
+							.caption {
+								padding: 2rem;
+							}
+						}
+					}
+
+					@include breakpoint(xsmall) {
+						article {
+							width: 100%;
+
+							.caption {
+								padding: 1rem;
+							}
+						}
+					}
+				}
+
+	}
+
+/* Gallery (style2) */
+
+	.gallery.style2 {
+		@include color-typography(invert);
+		@include color-button(invert);
+		@include vendor('display', 'flex');
+		-webkit-overflow-scrolling: touch;
+		position: relative;
+		background-color: transparent;
+
+		> .forward, >.backward {
+			@include icon;
+			@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
+			position: absolute;
+			top: 0;
+			width: 5rem;
+			height: 100%;
+			cursor: pointer;
+			opacity: 0;
+			z-index: 2;
+
+			&:before {
+				display: block;
+				top: calc(50% - 1.5rem);
+				width: 4rem;
+				height: 3rem;
+				line-height: 1em;
+				font-size: 3rem;
+				position: absolute;
+				text-align: center;
+			}
+		}
+
+		&:hover {
+			> .forward, > .backward {
+				opacity: 1;
+			}
+		}
+
+		> .forward {
+			right: 0;
+			background-image: linear-gradient(to left, rgba(0,0,0,0.25) 15%, rgba(0,0,0,0));
+
+			&:before {
+				content: '\f105';
+				right: 0;
+			}
+		}
+
+		> .backward {
+			left: 0;
+			background-image: linear-gradient(to right, rgba(0,0,0,0.25) 15%, rgba(0,0,0,0));
+
+			&:before {
+				content: '\f104';
+				left: 0;
+			}
+		}
+
+		> .inner {
+			@include vendor('display', 'inherit');
+			overflow-x: auto;
+			overflow-y: hidden;
+			position: relative;
+			width: 100%;
+		}
+
+		article {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			display: block;
+			position: relative;
+			overflow: hidden;
+			width: 22.5rem;
+			max-width: 75vw;
+
+			.image {
+				display: block;
+				width: 100%;
+				border-radius: 0;
+
+				img {
+					display: block;
+					width: 100%;
+					border-radius: 0;
+				}
+			}
+
+			.caption {
+				@include vendor('align-items', 'center');
+				@include vendor('display', 'flex');
+				@include vendor('flex-direction', 'column');
+				@include vendor('justify-content', 'center');
+				@include vendor('pointer-events', 'none');
+				@include vendor('transition', 'opacity #{_duration(transition)} ease-in-out');
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				background-color: transparentize(_palette(invert, bg), 1 - _misc(overlay-opacity));
+				opacity: 0;
+				padding: 3rem;
+				z-index: 1;
+				font-size: 0.8rem;
+
+				a {
+					@include vendor('pointer-events', 'auto');
+				}
+
+				h2, h3, h4, h5, h6 {
+					font-size: 1.25rem;
+					margin-bottom: 0.25rem;
+				}
+
+				> * {
+					max-width: 100%;
+					margin-bottom: 1rem;
+				}
+
+				> :last-child {
+					margin-bottom: 0;
+				}
+			}
+
+			&:hover {
+				.caption {
+					opacity: 1;
+				}
+			}
+		}
+
+		@include breakpoint(medium) {
+			article {
+				.caption {
+					padding: 2rem;
+				}
+			}
+		}
+
+		@include breakpoint(small) {
+			article {
+				.caption {
+					padding: 2rem;
+				}
+			}
+		}
+
+		// Modifiers.
+
+			// size
+				&.small {
+					article {
+						width: 17.5rem;
+
+						.caption {
+							padding: 2rem;
+						}
+					}
+
+					@include breakpoint(medium) {
+						article {
+							.caption {
+								padding: 2rem;
+							}
+						}
+					}
+
+					@include breakpoint(small) {
+						article {
+							.caption {
+								padding: 2rem;
+							}
+						}
+					}
+				}
+
+				&.medium {
+					// ...
+				}
+
+				&.big {
+					article {
+						width: 30rem;
+
+						.caption {
+							padding: 4rem;
+						}
+					}
+
+					@include breakpoint(medium) {
+						article {
+							.caption {
+								padding: 3rem;
+							}
+						}
+					}
+
+					@include breakpoint(small) {
+						article {
+							.caption {
+								padding: 2rem;
+							}
+						}
+					}
+				}
+
+	}
+
+/* Gallery (lightbox) */
+
+	@include keyframes('gallery-modal-spinner') {
+		0% {
+			@include vendor('transform', 'rotate(0deg)');
+		}
+
+		100% {
+			@include vendor('transform', 'rotate(360deg)');
+		}
+	}
+
+	.gallery.lightbox {
+		.modal {
+			@include vendor('display', 'flex');
+			@include vendor('align-items', 'center');
+			@include vendor('justify-content', 'center');
+			@include vendor('pointer-events', 'none');
+			@include vendor('user-select', 'none');
+			@include vendor('transition', (
+				'opacity #{_duration(gallery-lightbox)} ease',
+				'visibility #{_duration(gallery-lightbox)}',
+				'z-index #{_duration(gallery-lightbox)}'
+			));
+			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+			position: fixed;
+			top: 0;
+			left: 0;
+			width: 100%;
+			height: 100%;
+			outline: 0;
+			background-color: transparentize(_palette(invert, bg), 1 - _misc(lightbox-opacity));
+			visibility: none;
+			opacity: 0;
+			z-index: 0;
+
+			&:before {
+				@include vendor('animation', 'gallery-modal-spinner 1s infinite linear');
+				@include vendor('transition', 'opacity #{_duration(gallery-lightbox) * 0.5} ease');
+				@include vendor('transition-delay', '#{_duration(gallery-lightbox)}');
+				content: '';
+				display: block;
+				position: absolute;
+				top: 50%;
+				left: 50%;
+				width: 4rem;
+				height: 4rem;
+				margin: -2rem 0 0 -2rem;
+				background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="96px" height="96px" viewBox="0 0 96 96" zoomAndPan="disable"><style>circle {fill: transparent; stroke: #{_palette(invert, fg-bold)}; stroke-width: 1.5px; }</style><defs><clipPath id="corner"><polygon points="0,0 48,0 48,48 96,48 96,96 0,96" /></clipPath></defs><g clip-path="url(#corner)"><circle cx="48" cy="48" r="32"/></g></svg>');
+				background-position: center;
+				background-repeat: no-repeat;
+				background-size: 4rem;
+				opacity: 0;
+			}
+
+			&:after {
+				content: '';
+				display: block;
+				position: absolute;
+				top: 0.5rem;
+				right: 0.5rem;
+				width: 4rem;
+				height: 4rem;
+				cursor: pointer;
+				background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="64px" viewBox="0 0 64 64" zoomAndPan="disable"><style>line {stroke: #{_palette(invert, fg-bold)};stroke-width: 1.5px;}</style><line x1="20" y1="20" x2="44" y2="44" /><line x1="20" y1="44" x2="44" y2="20" /></svg>');
+				background-position: center;
+				background-repeat: no-repeat;
+				background-size: 3rem;
+			}
+
+			.inner {
+				@include vendor('transform', 'translateY(0.75rem)');
+				@include vendor('transition', (
+					'opacity #{_duration(gallery-lightbox) * 0.5} ease',
+					'transform #{_duration(gallery-lightbox) * 0.5} ease'
+				));
+				opacity: 0;
+
+				img {
+					display: block;
+					max-width: 90vw;
+					max-height: 85vh;
+					box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.35);
+				}
+			}
+
+			&.visible {
+				@include vendor('pointer-events', 'auto');
+				visibility: visible;
+				opacity: 1;
+				z-index: _misc(z-index-base) + 1;
+
+				&:before {
+					opacity: 1;
+				}
+			}
+
+			&.loaded {
+				.inner {
+					@include vendor('transform', 'translateY(0)');
+					@include vendor('transition', (
+						'opacity #{_duration(gallery-lightbox)} ease',
+						'transform #{_duration(gallery-lightbox)} ease'
+					));
+					opacity: 1;
+				}
+
+				&:before {
+					@include vendor('transition-delay', '0s');
+					opacity: 0;
+				}
+			}
+		}
+
+		@include breakpoint(medium) {
+			.modal {
+				.inner {
+					img {
+						max-width: 100vw;
+					}
+				}
+			}
+		}
+	}
+
+// Mixin
+
+	@mixin color-gallery($p: null) {
+		.gallery {
+			article {
+				.image {
+					background-color: transparentize(_palette($p, fg-bold), 0.875);
+				}
+			}
+		}
+	}
+
+	@include color-gallery;
\ No newline at end of file
diff --git a/assets/sass/components/_icon.scss b/assets/sass/components/_icon.scss
new file mode 100644
index 0000000..5a59b9a
--- /dev/null
+++ b/assets/sass/components/_icon.scss
@@ -0,0 +1,80 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Icon */
+
+	.icon {
+		@include icon;
+		border-bottom: none;
+		position: relative;
+		text-align: center;
+
+		> .label {
+			display: none;
+		}
+
+		&.style2 {
+			&:before {
+				border-radius: 2.75em;
+				display: inline-block;
+				height: 2.75em;
+				line-height: 2.75em;
+				width: 2.75em;
+			}
+		}
+
+		&.major {
+			display: block;
+			margin: 0 0 (_size(element-margin) * 0.5) 0;
+
+			&:before {
+				font-size: 1.25rem;
+			}
+		}
+	}
+
+	a.icon {
+		&.style2 {
+			&:before {
+				@include vendor('transition', (
+					'background-color #{_duration(transition)} ease-in-out',
+					'box-shadow #{_duration(transition)} ease-in-out',
+					'color #{_duration(transition)} ease-in-out'
+				));
+			}
+		}
+	}
+
+	@mixin color-icon($p: null) {
+ 		.icon {
+ 			&.style2 {
+ 				&:before {
+					box-shadow: inset 0 0 0 _size(border-width) _palette($p, border);
+ 				}
+ 			}
+ 		}
+
+		a.icon {
+			&.style2 {
+				&:hover {
+					&:before {
+						box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
+						color: _palette($p, accent);
+					}
+				}
+
+				&:active {
+					&:before {
+						background-color: transparentize(_palette($p, accent), 0.9);
+						box-shadow: inset 0 0 0 _size(border-width) _palette($p, accent);
+						color: _palette($p, accent);
+					}
+				}
+			}
+		}
+	}
+
+	@include color-icon;
\ No newline at end of file
diff --git a/assets/sass/components/_image.scss b/assets/sass/components/_image.scss
new file mode 100644
index 0000000..68284ec
--- /dev/null
+++ b/assets/sass/components/_image.scss
@@ -0,0 +1,61 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Image */
+
+	.image {
+		border: 0;
+		border-radius: _size(border-radius);
+		display: inline-block;
+		position: relative;
+
+		img {
+			display: block;
+			border-radius: _size(border-radius);
+		}
+
+		&.left,
+		&.right {
+			width: 40%;
+			max-width: 10rem;
+
+			img {
+				width: 100%;
+			}
+		}
+
+		&.left {
+			float: left;
+			margin: 0 1.5rem 1rem 0;
+			top: 0.25rem;
+		}
+
+		&.right {
+			float: right;
+			margin: 0 0 1rem 1.5rem;
+			top: 0.25rem;
+		}
+
+		&.fit {
+			display: block;
+			margin: 0 0 _size(element-margin) 0;
+			width: 100%;
+
+			img {
+				width: 100%;
+			}
+		}
+
+		&.main {
+			display: block;
+			margin: 0 0 (_size(element-margin) * 1.5) 0;
+			width: 100%;
+
+			img {
+				width: 100%;
+			}
+		}
+	}
\ No newline at end of file
diff --git a/assets/sass/components/_index.scss b/assets/sass/components/_index.scss
new file mode 100644
index 0000000..a7485c1
--- /dev/null
+++ b/assets/sass/components/_index.scss
@@ -0,0 +1,66 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Index */
+
+	.index {
+		> * {
+			@include padding(3rem, 0);
+			@include vendor('display', 'flex');
+			border-top: solid 1px;
+
+			> header {
+				@include vendor('flex-grow', '0');
+				@include vendor('flex-shrink', '0');
+				width: 15rem;
+			}
+
+			> .content {
+				@include vendor('flex-grow', '1');
+				@include vendor('flex-shrink', '1');
+			}
+		}
+
+		> :first-child {
+			border-top: 0;
+		}
+
+		@include breakpoint(medium) {
+			> * {
+				> header {
+					width: 11rem;
+				}
+			}
+		}
+
+		@include breakpoint(small) {
+			> * {
+				> header {
+					width: 10rem;
+				}
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			> * {
+				@include vendor('flex-direction', 'column');
+
+				> header {
+					width: 100%;
+				}
+			}
+		}
+	}
+
+	@mixin color-index($p: null) {
+		.index {
+			> * {
+ 				border-top-color: _palette($p, border);
+ 			}
+ 		}
+	}
+
+	@include color-index;
\ No newline at end of file
diff --git a/assets/sass/components/_items.scss b/assets/sass/components/_items.scss
new file mode 100644
index 0000000..790090e
--- /dev/null
+++ b/assets/sass/components/_items.scss
@@ -0,0 +1,338 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Items (transitions) */
+
+	.items {
+
+		// Mixin.
+			@mixin transition-items($event) {
+				$x: null;
+				$y: null;
+
+				@if ($event == 'load') {
+					$x: 'body.is-loading &';
+					$y: _duration(on-load);
+				}
+				@else if ($event == 'scroll') {
+					$x: '&.is-inactive';
+					$y: _duration(on-scroll);
+				}
+
+				&.on#{$event}-fade-in {
+					> * {
+						> .inner {
+							@include vendor('transition', 'opacity #{$y} ease-in-out');
+							@include vendor('transition-delay', '#{_misc(items-limit) * _duration(items-delay)}');
+						}
+
+						@for $i from 0 through _misc(items-limit) {
+							&:nth-child(#{$i + 1}) {
+								> .inner {
+									@include vendor('transition-delay', '#{$i * _duration(items-delay)}');
+								}
+							}
+						}
+					}
+
+					#{$x} {
+						> * {
+							> .inner {
+								opacity: 0;
+							}
+						}
+					}
+				}
+			}
+
+		// On Load.
+			@include transition-items('load');
+
+		// On Scroll.
+			@include transition-items('scroll');
+
+	}
+
+/* Items (style1) */
+
+	@mixin items-style1-size($name, $size, $padding) {
+		&.#{$name} {
+			> * {
+				@include padding($padding, $padding);
+				width: #{100% / $size};
+
+				&:nth-child(-n + #{$size}) {
+					border-top-width: 0;
+				}
+
+				&:nth-child(#{$size}n + 1) {
+					border-left-width: 0;
+				}
+			}
+		}
+	}
+
+	@mixin items-style1-size-reset($name, $size) {
+		&.#{$name} {
+			> * {
+				&:nth-child(-n + #{$size}) {
+					border-top-width: _size(border-width);
+				}
+
+				&:nth-child(#{$size}n + 1) {
+					border-left-width: _size(border-width);
+				}
+			}
+		}
+	}
+
+	.items.style1 {
+		@include vendor('display', 'flex');
+		@include vendor('flex-wrap', 'wrap');
+		@include vendor('justify-content', 'center');
+		margin: (_size(element-margin) * 1.5) 0;
+		position: relative;
+
+		> * {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			border-style: solid;
+			border-left-width: _size(border-width);
+			border-top-width: _size(border-width);
+		}
+
+		// Modifiers.
+
+			// Size.
+				@include items-style1-size(big, 2, _size(gutter));
+				@include items-style1-size(medium, 3, _size(gutter) * 0.625);
+				@include items-style1-size(small, 4, _size(gutter) * 0.375);
+
+				@include breakpoint(large) {
+					@include items-style1-size-reset(small, 4);
+					@include items-style1-size(small, 3, _size(gutter) * 0.625);
+				}
+
+				@include breakpoint(medium) {
+					@include items-style1-size-reset(medium, 3);
+					@include items-style1-size(medium, 2, _size(gutter));
+
+					@include items-style1-size-reset(small, 3);
+					@include items-style1-size(small, 2, _size(gutter));
+				}
+
+				@include breakpoint(xsmall) {
+					@include items-style1-size-reset(big, 2);
+					@include items-style1-size(big, 1, _size(gutter) * 0.75);
+
+					@include items-style1-size-reset(medium, 2);
+					@include items-style1-size(medium, 1, _size(gutter) * 0.75);
+
+					@include items-style1-size-reset(small, 2);
+					@include items-style1-size(small, 1, _size(gutter) * 0.75);
+
+					&.big,
+					&.medium,
+					&.small {
+						> * {
+							padding-left: 0;
+							padding-right: 0;
+						}
+
+						> :first-child {
+							padding-top: 0;
+						}
+
+						> :last-child {
+							padding-bottom: 0;
+
+							> .inner {
+								> :last-child {
+									margin-bottom: 0;
+								}
+							}
+						}
+					}
+				}
+
+	}
+
+/* Items (style2) */
+
+	@mixin items-style2-size($name, $size, $padding) {
+		&.#{$name} {
+			> * {
+				@include padding($padding, $padding);
+				width: #{100% / $size};
+
+				&:nth-child(-n + #{$size}) {
+					border-top-width: 0;
+				}
+
+				&:nth-child(#{$size}n + 1) {
+					border-left-width: 0;
+				}
+			}
+		}
+	}
+
+	@mixin items-style2-size-reset($name, $size) {
+		&.#{$name} {
+			> * {
+				&:nth-child(-n + #{$size}) {
+					border-top-width: _size(border-width);
+				}
+
+				&:nth-child(#{$size}n + 1) {
+					border-left-width: _size(border-width);
+				}
+			}
+		}
+	}
+
+	.items.style2 {
+		@include vendor('display', 'flex');
+		@include vendor('flex-wrap', 'wrap');
+		@include vendor('justify-content', 'center');
+		margin: (_size(element-margin) * 1.5) 0;
+		position: relative;
+		border: solid _size(border-width);
+		border-radius: _size(border-radius);
+
+		> * {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			border-style: solid;
+			border-left-width: _size(border-width);
+			border-top-width: _size(border-width);
+		}
+
+		// Modifiers.
+
+			// Size.
+				@include items-style2-size(big, 2, _size(gutter));
+				@include items-style2-size(medium, 3, _size(gutter) * 0.625);
+				@include items-style2-size(small, 4, _size(gutter) * 0.375);
+
+				@include breakpoint(large) {
+					@include items-style2-size-reset(small, 4);
+					@include items-style2-size(small, 3, _size(gutter) * 0.625);
+				}
+
+				@include breakpoint(medium) {
+					@include items-style2-size-reset(medium, 3);
+					@include items-style2-size(medium, 2, _size(gutter));
+
+					@include items-style2-size-reset(small, 3);
+					@include items-style2-size(small, 2, _size(gutter));
+				}
+
+				@include breakpoint(xsmall) {
+					@include items-style2-size-reset(big, 2);
+					@include items-style2-size(big, 1, _size(gutter) * 0.75);
+
+					@include items-style2-size-reset(medium, 2);
+					@include items-style2-size(medium, 1, _size(gutter) * 0.75);
+
+					@include items-style2-size-reset(small, 2);
+					@include items-style2-size(small, 1, _size(gutter) * 0.75);
+				}
+
+	}
+
+/* Items (style3) */
+
+	@mixin items-style3-size($name, $size, $padding) {
+		&.#{$name} {
+			> * {
+				@include padding($padding, $padding);
+				width: #{100% / $size};
+			}
+		}
+	}
+
+	.items.style3 {
+		@include vendor('display', 'flex');
+		@include vendor('flex-wrap', 'wrap');
+		@include vendor('justify-content', 'center');
+		margin: (_size(element-margin) * 1.5) 0;
+		position: relative;
+
+		> * {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+		}
+
+		// Modifiers.
+
+			// Size.
+				@include items-style3-size(big, 2, _size(gutter) * 0.5);
+				@include items-style3-size(medium, 3, _size(gutter) * 0.5 * 0.625);
+				@include items-style3-size(small, 4, _size(gutter) * 0.5 * 0.375);
+
+				@include breakpoint(large) {
+					@include items-style3-size(small, 3, _size(gutter) * 0.5 * 0.625);
+				}
+
+				@include breakpoint(medium) {
+					@include items-style3-size(medium, 2, _size(gutter) * 0.5);
+					@include items-style3-size(small, 2, _size(gutter) * 0.5);
+				}
+
+				@include breakpoint(small) {
+					margin: _size(element-margin) 0;
+				}
+
+				@include breakpoint(xsmall) {
+					@include items-style3-size(big, 1, _size(gutter) * 0.5 * 0.75);
+					@include items-style3-size(medium, 1, _size(gutter) * 0.5 * 0.75);
+					@include items-style3-size(small, 1, _size(gutter) * 0.5 * 0.75);
+
+					&.big,
+					&.medium,
+					&.small {
+						> * {
+							padding-left: 0;
+							padding-right: 0;
+						}
+
+						> :first-child {
+							padding-top: 0;
+						}
+
+						> :last-child {
+							padding-bottom: 0;
+
+							> .inner {
+								> :last-child {
+									margin-bottom: 0;
+								}
+							}
+						}
+					}
+				}
+
+	}
+
+// Mixin
+
+	@mixin color-items($p: null) {
+ 		.items.style1 {
+ 			> * {
+	 			border-color: _palette($p, border);
+	 		}
+ 		}
+
+ 		.items.style2 {
+ 			border-color: _palette($p, border);
+
+ 			> * {
+	 			border-color: _palette($p, border);
+	 		}
+ 		}
+	}
+
+	@include color-items;
\ No newline at end of file
diff --git a/assets/sass/components/_list.scss b/assets/sass/components/_list.scss
new file mode 100644
index 0000000..a2d5816
--- /dev/null
+++ b/assets/sass/components/_list.scss
@@ -0,0 +1,210 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* List */
+
+	ol {
+		list-style: decimal;
+		margin: 0 0 _size(element-margin) 0;
+		padding-left: 1.25rem;
+
+		li {
+			padding-left: 0.25rem;
+		}
+	}
+
+	ul {
+		list-style: disc;
+		margin: 0 0 _size(element-margin) 0;
+		padding-left: 1rem;
+
+		li {
+			padding-left: 0.5rem;
+		}
+
+		&.alt {
+			list-style: none;
+			padding-left: 0;
+
+			li {
+				border-top: solid _size(border-width);
+				padding: 0.5rem 0;
+
+				&:first-child {
+					border-top: 0;
+					padding-top: 0;
+				}
+			}
+		}
+
+		&.icons {
+			cursor: default;
+			list-style: none;
+			padding-left: 0;
+
+			li {
+				display: inline-block;
+				padding: 0 0.75rem 0 0;
+
+				&:last-child {
+					padding-right: 0;
+				}
+			}
+		}
+
+		&.actions {
+			cursor: default;
+			list-style: none;
+			padding-left: 0;
+
+			li {
+				display: inline-block;
+				padding: 0 (_size(element-margin) * 0.5) 0 0;
+				vertical-align: middle;
+
+				&:last-child {
+					padding-right: 0;
+				}
+			}
+
+			&.small {
+				li {
+					padding: 0 (_size(element-margin) * 0.25) 0 0;
+				}
+			}
+
+			&.vertical {
+				li {
+					display: block;
+					padding: (_size(element-margin) * 0.5) 0 0 0;
+
+					&:first-child {
+						padding-top: 0;
+					}
+
+					> * {
+						margin-bottom: 0;
+					}
+				}
+
+				&.small {
+					li {
+						padding: (_size(element-margin) * 0.25) 0 0 0;
+
+						&:first-child {
+							padding-top: 0;
+						}
+					}
+				}
+			}
+
+			&.fit {
+				display: table;
+				margin-left: (_size(element-margin) * -0.5);
+				padding: 0;
+				table-layout: fixed;
+				width: calc(100% + #{(_size(element-margin) * 0.5)});
+
+				li {
+					display: table-cell;
+					padding: 0 0 0 (_size(element-margin) * 0.5);
+
+					> * {
+						margin-bottom: 0;
+					}
+				}
+
+				&.small {
+					margin-left: (_size(element-margin) * -0.25);
+					width: calc(100% + #{(_size(element-margin) * 0.25)});
+
+					li {
+						padding: 0 0 0 (_size(element-margin) * 0.25);
+					}
+				}
+			}
+
+			@include breakpoint(xsmall) {
+				margin: 0 0 _size(element-margin) 0;
+
+				li {
+					padding: (_size(element-margin) * 0.5) 0 0 0;
+					display: block;
+					text-align: center;
+					width: 100%;
+
+					&:first-child {
+						padding-top: 0;
+					}
+
+					> * {
+						width: 100%;
+						margin: 0 !important;
+
+						&.icon {
+							&:before {
+								margin-left: -2rem;
+							}
+						}
+					}
+				}
+
+				&.small {
+					li {
+						padding: (_size(element-margin) * 0.25) 0 0 0;
+
+						&:first-child {
+							padding-top: 0;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	dl {
+		margin: 0 0 _size(element-margin) 0;
+
+		dt {
+			display: block;
+			font-weight: _font(weight-bold);
+			margin: 0 0 (_size(element-margin) * 0.5) 0;
+		}
+
+		dd {
+			margin-left: _size(element-margin);
+		}
+
+		&.style2 {
+			dt {
+				width: 25%;
+				float: left;
+			}
+
+			dd {
+				width: 70%;
+				float: left;
+			}
+
+			&:after {
+				content: '';
+				display: block;
+				clear: both;
+			}
+		}
+	}
+
+	@mixin color-list($p: null) {
+		ul {
+			&.alt {
+				li {
+					border-top-color: _palette($p, border);
+				}
+			}
+		}
+	}
+
+	@include color-list;
\ No newline at end of file
diff --git a/assets/sass/components/_section.scss b/assets/sass/components/_section.scss
new file mode 100644
index 0000000..6467123
--- /dev/null
+++ b/assets/sass/components/_section.scss
@@ -0,0 +1,49 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Section/Article */
+
+	section, article {
+		&.special {
+			text-align: center;
+		}
+	}
+
+	header {
+		p {
+			position: relative;
+			margin: (_size(element-margin) * -0.325) 0 (_size(element-margin) * 0.75) 0;
+			font-style: italic;
+		}
+
+		h1 + p {
+			font-size: 1.375rem;
+		}
+
+		h2 + p {
+			font-size: 1.25rem;
+		}
+
+		h3 + p {
+			font-size: 1.1rem;
+		}
+
+		h4 + p,
+		h5 + p,
+		h6 + p {
+			font-size: 0.9rem;
+		}
+	}
+
+	@mixin color-section($p: null) {
+		header {
+			p {
+				color: _palette($p, fg-light);
+			}
+		}
+	}
+
+	@include color-section;
\ No newline at end of file
diff --git a/assets/sass/components/_spotlight.scss b/assets/sass/components/_spotlight.scss
new file mode 100644
index 0000000..1cedf43
--- /dev/null
+++ b/assets/sass/components/_spotlight.scss
@@ -0,0 +1,1012 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Spotlight (transitions) */
+
+	.spotlight {
+
+		// Mixin.
+			@mixin transition-spotlight($event) {
+				$x: null;
+				$y: null;
+
+				@if ($event == 'load') {
+					$x: 'body.is-loading &';
+					$y: _duration(on-load);
+				}
+				@else if ($event == 'scroll') {
+					$x: '&.is-inactive';
+					$y: _duration(on-scroll);
+				}
+
+				// Content.
+					&.on#{$event}-content-fade-up {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateY(1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-down {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateY(-1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-left {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateX(1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-right {
+						.content {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+						}
+
+						#{$x} {
+							.content {
+								@include vendor('transform', 'translateX(-1rem)');
+								opacity: 0;
+							}
+						}
+					}
+
+					&.on#{$event}-content-fade-in {
+						.content {
+							@include vendor('transition', 'opacity #{$y} ease-in-out');
+						}
+
+						#{$x} {
+							.content {
+								opacity: 0;
+							}
+						}
+					}
+
+				// Image.
+					&.on#{$event}-image-fade-up {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateY(1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-down {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateY(-1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-left {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateX(1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-right {
+						.image {
+							@include vendor('transition', (
+								'opacity #{$y} ease-in-out',
+								'transform #{$y} ease-in-out'
+							));
+
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+								@include vendor('transition-delay', '#{$y * 0.75}');
+							}
+						}
+
+						#{$x} {
+							.image {
+								@include vendor('transform', 'translateX(-1rem)');
+								opacity: 0;
+
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+					&.on#{$event}-image-fade-in {
+						.image {
+							img {
+								@include vendor('transition', 'opacity #{$y} ease-in-out');
+							}
+						}
+
+						#{$x} {
+							.image {
+								img {
+									opacity: 0;
+								}
+							}
+						}
+					}
+
+			}
+
+		// On Load.
+			@include transition-spotlight('load');
+
+		// On Scroll.
+			@include transition-spotlight('scroll');
+
+	}
+
+/* Spotlight (style1) */
+
+	.spotlight.style1 {
+		@include vendor('align-items', 'stretch');
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'row');
+		@include vendor('justify-content', 'flex-end');
+		position: relative;
+		overflow-x: hidden;
+		text-align: left;
+
+		.content {
+			@include padding(_size(padding, default), _size(padding, default));
+			@include vendor('align-self', 'center');
+			@include vendor('flex-grow', '1');
+			@include vendor('flex-shrink', '1');
+			width: 65%;
+			max-width: _size(inner);
+			margin: 0 auto;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			width: 35%;
+			min-width: 25rem;
+			border-radius: 0;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			.content {
+				@include padding(_size(padding, xlarge), _size(padding, xlarge));
+			}
+		}
+
+		@include breakpoint(large) {
+			.content {
+				@include padding(_size(padding, large), _size(padding, large));
+			}
+		}
+
+		@include breakpoint(medium) {
+			.content {
+				@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+				width: 50%;
+				min-width: 0;
+			}
+
+			.image {
+				width: 50%;
+				min-width: 0;
+			}
+		}
+
+		@include breakpoint(small) {
+			.content {
+				@include padding(_size(padding, small) * 1.25, _size(padding, small));
+			}
+
+			@include orientation(portrait) {
+				@include vendor('flex-direction', 'column-reverse');
+				text-align: center !important;
+
+				.content {
+					width: 100%;
+				}
+
+				.image {
+					width: 100%;
+
+					img {
+						position: relative;
+					}
+				}
+			}
+		}
+
+		// Modifiers.
+
+			// Orientation.
+				&.orient-left {
+					// ...
+				}
+
+				&.orient-right {
+					@include vendor('flex-direction', 'row-reverse');
+
+					@include breakpoint(small) {
+						@include orientation(portrait) {
+							@include vendor('flex-direction', 'column-reverse');
+						}
+					}
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					// ...
+				}
+
+				&.content-align-center {
+					text-align: center;
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Spotlight (style2) */
+
+	.spotlight.style2 {
+		$image-size: 21rem;
+		$content-size: (_size(inner) * 0.75) - (_size(element-margin) * 1.75);
+
+		@include padding(_size(padding, default), _size(padding, default));
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'row-reverse');
+		@include vendor('justify-content', 'center');
+		position: relative;
+		overflow-x: hidden;
+		text-align: left;
+
+		.content {
+			width: $content-size;
+			max-width: 100%;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			width: $image-size;
+			height: $image-size;
+			border-radius: 100%;
+			margin: 0 (_size(element-margin) * 1.75) _size(element-margin) 0;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				width: 100%;
+				height: 100%;
+				border-radius: 100%;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge));
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large));
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+
+			.image {
+				width: ($image-size * 0.875);
+				height: ($image-size * 0.875);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small) * 1.25, _size(padding, small));
+			@include vendor('align-items', 'flex-start');
+
+			.image {
+				width: ($image-size * 0.75);
+				height: ($image-size * 0.75);
+				margin: 0 (_size(element-margin) * 1) _size(element-margin) 0;
+			}
+		}
+
+		@include orientation(portrait) {
+			@include vendor('align-items', 'center');
+			@include vendor('flex-direction', 'column-reverse');
+			text-align: center !important;
+
+			.content {
+				width: 34rem;
+				max-width: 100%;
+			}
+
+			.image {
+				margin-right: 0;
+			}
+		}
+
+		// Modifiers.
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('flex-direction', 'row');
+
+					.image {
+						margin: 0 0 _size(element-margin) (_size(element-margin) * 1.75);
+					}
+
+					@include breakpoint(small) {
+						.image {
+							margin: 0 0 _size(element-margin) (_size(element-margin) * 1);
+						}
+					}
+
+					@include orientation(portrait) {
+						@include vendor('flex-direction', 'column-reverse');
+
+						.image {
+							margin-left: 0;
+						}
+					}
+				}
+
+				&.orient-right {
+					// ...
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					// ...
+				}
+
+				&.content-align-center {
+					text-align: center;
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Spotlight (style3) */
+
+	.spotlight.style3 {
+		$image-width: 13rem;
+		$content-size: (_size(inner) * 0.75) - (_size(element-margin) * 1.75);
+
+		@include padding(_size(padding, default), _size(padding, default));
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'row-reverse');
+		@include vendor('justify-content', 'center');
+		position: relative;
+		overflow-x: hidden;
+		text-align: left;
+
+		.content {
+			width: $content-size;
+			max-width: 100%;
+		}
+
+		.image {
+			@include phone($image-width);
+			margin-right: (_size(element-margin) * 1.75);
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge));
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large));
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium) * 1.25, _size(padding, medium));
+
+			.image {
+				@include resize-phone($image-width, 0.875);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small) * 1.25, _size(padding, small));
+			@include vendor('align-items', 'flex-start');
+
+			.image {
+				@include resize-phone($image-width, 0.625);
+			}
+		}
+
+		@include orientation(portrait) {
+			@include vendor('align-items', 'center');
+			@include vendor('flex-direction', 'column-reverse');
+			text-align: center !important;
+
+			.content {
+				width: 34rem;
+				max-width: 100%;
+			}
+
+			.image {
+				margin-right: 0;
+				margin-left: 0;
+			}
+		}
+
+		// Modifiers.
+
+			// Variant.
+				&.iphone {
+					// ...
+				}
+
+				&.android {
+					// ...
+				}
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('flex-direction', 'row');
+
+					.image {
+						margin-right: 0;
+						margin-left: (_size(element-margin) * 1.75);
+					}
+
+					@include orientation(portrait) {
+						@include vendor('flex-direction', 'column-reverse');
+
+						.image {
+							margin-right: 0;
+							margin-left: 0;
+						}
+					}
+				}
+
+				&.orient-right {
+					// ...
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					// ...
+				}
+
+				&.content-align-center {
+					text-align: center;
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Spotlight (style4) */
+
+	.spotlight.style4 {
+		@include padding(_size(padding, default), _size(padding, default) * 0.75);
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('justify-content', 'center');
+		background-color: inherit;
+		position: relative;
+		overflow-x: hidden;
+		text-align: center;
+
+		.content {
+			@include padding(_size(padding, default) * 0.5, _size(padding, default) * 0.5);
+			position: relative;
+			width: (_size(inner) * 0.625);
+			max-width: 50%;
+			background-color: inherit;
+			border-radius: _size(border-radius-alt);
+			margin-bottom: _size(element-margin);
+			z-index: 1;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge) * 0.75);
+
+			.content {
+				@include padding(_size(padding, xlarge) * 0.5, _size(padding, xlarge) * 0.5);
+			}
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large) * 0.75);
+
+			.content {
+				@include padding(_size(padding, large) * 0.75, _size(padding, large) * 0.75);
+			}
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium), _size(padding, medium) * 0.75);
+
+			.content {
+				@include padding(_size(padding, medium) * 0.75, _size(padding, medium) * 0.75);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small), _size(padding, small) * 0.75);
+
+			.content {
+				@include padding(_size(padding, small) * 0.75, _size(padding, small) * 0.75);
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			.content {
+				max-width: 80%;
+			}
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+				}
+
+				&.halfscreen {
+					min-height: 50vh;
+				}
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('justify-content', 'flex-start');
+					padding-left: 0;
+
+					.content {
+						border-top-left-radius: 0;
+						border-bottom-left-radius: 0;
+					}
+				}
+
+				&.orient-center {
+					// ...
+				}
+
+				&.orient-right {
+					@include vendor('justify-content', 'flex-end');
+					padding-right: 0;
+
+					.content {
+						border-top-right-radius: 0;
+						border-bottom-right-radius: 0;
+					}
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					text-align: left;
+				}
+
+				&.content-align-center {
+					// ...
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+/* Spotlight (style5) */
+
+	.spotlight.style5 {
+		@include padding(_size(padding, default), _size(padding, default) * 0.75);
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('justify-content', 'center');
+		background-color: inherit;
+		position: relative;
+		overflow-x: hidden;
+		text-align: center;
+
+		.content {
+			@include padding(_size(padding, default) * 0.5, _size(padding, default) * 0.5);
+			position: relative;
+			width: (_size(inner) * 0.625);
+			max-width: 52.5%;
+			background-color: inherit;
+			border-radius: _size(border-radius-alt);
+			margin-bottom: _size(element-margin);
+			z-index: 1;
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			border-radius: 0;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				@include vendor('object-position', 'center');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				border-radius: 0;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			@include padding(_size(padding, xlarge), _size(padding, xlarge) * 0.75);
+
+			.content {
+				@include padding(_size(padding, xlarge) * 0.5, _size(padding, xlarge) * 0.5);
+			}
+		}
+
+		@include breakpoint(large) {
+			@include padding(_size(padding, large), _size(padding, large) * 0.75);
+
+			.content {
+				@include padding(_size(padding, large) * 0.75, _size(padding, large) * 0.75);
+			}
+		}
+
+		@include breakpoint(medium) {
+			@include padding(_size(padding, medium), _size(padding, medium) * 0.75);
+
+			.content {
+				@include padding(_size(padding, medium) * 0.75, _size(padding, medium) * 0.75);
+			}
+		}
+
+		@include breakpoint(small) {
+			@include padding(_size(padding, small), _size(padding, small) * 0.75);
+
+			.content {
+				@include padding(_size(padding, small) * 0.75, _size(padding, small) * 0.75);
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			.content {
+				max-width: 80%;
+			}
+		}
+
+		// Modifiers.
+
+			// Size.
+				&.fullscreen {
+					min-height: 100vh;
+				}
+
+				&.halfscreen {
+					min-height: 50vh;
+				}
+
+			// Orientation.
+				&.orient-left {
+					@include vendor('justify-content', 'flex-start');
+				}
+
+				&.orient-center {
+					// ...
+				}
+
+				&.orient-right {
+					@include vendor('justify-content', 'flex-end');
+				}
+
+			// Content Alignment.
+				&.content-align-left {
+					text-align: left;
+				}
+
+				&.content-align-center {
+					// ...
+				}
+
+				&.content-align-right {
+					text-align: right;
+				}
+
+			// Image Position.
+				&.image-position-left {
+					.image {
+						img {
+							@include vendor('object-position', 'left');
+						}
+					}
+				}
+
+				&.image-position-center {
+					// ...
+				}
+
+				&.image-position-right {
+					.image {
+						img {
+							@include vendor('object-position', 'right');
+						}
+					}
+				}
+
+	}
+
+// Mixin
+
+	@mixin color-spotlight($p: null) {
+		.spotlight {
+			.image {
+				background-color: transparentize(_palette($p, fg-bold), 0.875);
+			}
+
+			@if ($p != 'invert') {
+				&.invert {
+					.image {
+						background-color: transparentize(_palette(invert, fg-bold), 0.875);
+					}
+				}
+			}
+		}
+
+		.spotlight.style3 {
+			.image {
+				@include color-phone($p);
+			}
+
+			// Variant.
+				&.iphone {
+					.image {
+						@include color-phone-variant('iphone', $p);
+					}
+				}
+
+				&.android {
+					.image {
+						@include color-phone-variant('android', $p);
+					}
+				}
+
+			@if ($p != 'invert') {
+				&.invert {
+					.image {
+						@include color-phone(invert);
+					}
+
+					// Variant.
+						&.iphone {
+							.image {
+								@include color-phone-variant('iphone', invert);
+							}
+						}
+
+						&.android {
+							.image {
+								@include color-phone-variant('android', invert);
+							}
+						}
+
+				}
+			}
+		}
+	}
+
+	@include color-spotlight;
\ No newline at end of file
diff --git a/assets/sass/components/_table.scss b/assets/sass/components/_table.scss
new file mode 100644
index 0000000..d09c0ce
--- /dev/null
+++ b/assets/sass/components/_table.scss
@@ -0,0 +1,137 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Table */
+
+	.table-wrapper {
+		-webkit-overflow-scrolling: touch;
+		margin: 0 0 _size(element-margin) 0;
+		overflow-x: auto;
+
+		> table {
+			margin-bottom: 0;
+		}
+	}
+
+	table {
+		margin: 0 0 _size(element-margin) 0;
+		width: 100%;
+
+		tbody {
+			tr {
+				border: solid _size(border-width);
+				border-left: 0;
+				border-right: 0;
+			}
+		}
+
+		td {
+			padding: 0.75rem 0.75rem;
+		}
+
+		th {
+			font-size: 0.9rem;
+			font-weight: _font(weight-bold);
+			padding: 0 0.75rem 0.75rem 0.75rem;
+			text-align: left;
+		}
+
+		thead {
+			border-bottom: solid (_size(border-width) * 2);
+		}
+
+		tfoot {
+			border-top: solid (_size(border-width) * 2);
+		}
+
+		&.alt {
+			border-collapse: separate;
+
+			tbody {
+				tr {
+					td {
+						border: solid _size(border-width);
+						border-left-width: 0;
+						border-top-width: 0;
+
+						&:first-child {
+							border-left-width: _size(border-width);
+						}
+					}
+
+					&:first-child {
+						td {
+							border-top-width: _size(border-width);
+						}
+					}
+				}
+			}
+
+			thead {
+				border-bottom: 0;
+			}
+
+			tfoot {
+				border-top: 0;
+			}
+		}
+
+		&.fixed {
+			table-layout: fixed;
+		}
+	}
+
+	@mixin color-table($p: null) {
+		table {
+			tbody {
+				tr {
+					border-color: _palette($p, border);
+
+					&:nth-child(2n + 1) {
+						background-color: _palette($p, border-bg);
+					}
+
+					&.alt {
+						background-color: _palette($p, border-bg) !important;
+					}
+				}
+			}
+
+			th {
+				color: _palette($p, fg-bold);
+			}
+
+			thead {
+				border-bottom-color: _palette($p, border);
+			}
+
+			tfoot {
+				border-top-color: _palette($p, border);
+			}
+
+			&.alt {
+				tbody {
+					tr {
+						td {
+							border-color: _palette($p, border);
+						}
+					}
+				}
+			}
+
+			&.uniform {
+				tbody {
+					tr {
+						&:nth-child(2n + 1) {
+							background-color: transparent;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	@include color-table;
\ No newline at end of file
diff --git a/assets/sass/components/_wrapper.scss b/assets/sass/components/_wrapper.scss
new file mode 100644
index 0000000..32b3bf5
--- /dev/null
+++ b/assets/sass/components/_wrapper.scss
@@ -0,0 +1,120 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Wrapper (style1) */
+
+	.wrapper.style1 {
+		> .inner {
+			@include padding(_size(padding, default), _size(padding, default) * 0.5);
+			margin: 0 auto;
+			max-width: 100%;
+			width: _size(inner);
+
+			&.medium {
+				width: _size(inner) * 0.75;
+			}
+
+			&.small {
+				width: _size(inner) * 0.5;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			> .inner {
+				@include padding(_size(padding, xlarge), _size(padding, xlarge) * 0.5);
+			}
+		}
+
+		@include breakpoint(large) {
+			> .inner {
+				@include padding(_size(padding, large), _size(padding, large));
+			}
+		}
+
+		@include breakpoint(medium) {
+			> .inner {
+				@include padding(_size(padding, medium) * 1.5, _size(padding, medium));
+			}
+		}
+
+		@include breakpoint(small) {
+			> .inner {
+				@include padding(_size(padding, small) * 1.5, _size(padding, small));
+			}
+		}
+	}
+
+/* Wrapper (style2) */
+
+	.wrapper.style2 {
+		padding: _size(padding, default);
+		background-color: _palette(bg-alt);
+
+		> .inner {
+			@include padding(_size(padding, default) * 0.75, _size(padding, default) * 0.5);
+			background-color: _palette(bg);
+			border-radius: _size(border-radius-alt);
+			margin: 0 auto;
+			max-width: 100%;
+			position: relative;
+			width: _size(inner);
+			z-index: 1;
+
+			&.medium {
+				width: _size(inner) * 0.75;
+			}
+
+			&.small {
+				width: _size(inner) * 0.5;
+			}
+		}
+
+		@include breakpoint(xlarge) {
+			padding: _size(padding, xlarge);
+
+			> .inner {
+				@include padding(_size(padding, xlarge) * 0.75, _size(padding, xlarge) * 0.5);
+			}
+		}
+
+		@include breakpoint(large) {
+			padding: _size(padding, large);
+
+			> .inner {
+				@include padding(_size(padding, large) * 0.75, _size(padding, large) * 0.5);
+			}
+		}
+
+		@include breakpoint(medium) {
+			padding: _size(padding, medium) * 0.75;
+
+			> .inner {
+				@include padding(_size(padding, medium), _size(padding, medium) * 0.75);
+			}
+		}
+
+		@include breakpoint(small) {
+			padding: _size(padding, small) * 0.75;
+
+			> .inner {
+				@include padding(_size(padding, small), _size(padding, small) * 0.75);
+			}
+		}
+	}
+
+	#wrapper {
+		> .wrapper.style2 {
+			&.invert {
+				&:not(.color1):not(.color2):not(.color3):not(.color4):not(.color5):not(.color6):not(.color7) {
+					background-color: _palette(invert, bg-alt);
+				}
+
+				> .inner {
+					background-color: _palette(invert, bg);
+				}
+			}
+		}
+	}
\ No newline at end of file
diff --git a/assets/sass/ie8.scss b/assets/sass/ie8.scss
deleted file mode 100644
index b6b04d4..0000000
--- a/assets/sass/ie8.scss
+++ /dev/null
@@ -1,246 +0,0 @@
-@import 'libs/vars';
-@import 'libs/functions';
-@import 'libs/mixins';
-@import 'libs/skel';
-
-/*
-	Photon by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-// Vars
-
-	$ie-palette-border:				#ccc;
-	$ie-palette-border-bg:			transparent;
-	$ie-palette-border2:			#ccc;
-	$ie-palette-border2-bg:			transparent;
-	$ie-palette-dark-bg:			#666666;
-	$ie-palette-dark-fg-bold:		#ffffff;
-	$ie-palette-dark-fg:			#ffffff;
-	$ie-palette-dark-fg-light:		#ffffff;
-	$ie-palette-dark-border:		#ffffff;
-	$ie-palette-dark-border-bg:		transparent;
-	$ie-palette-dark-border2:		#ffffff;
-	$ie-palette-dark-border2-bg:	transparent;
-
-/* Basic */
-
-	hr {
-		border-bottom: solid 1px $ie-palette-border;
-	}
-
-	blockquote {
-		border-left: solid 4px $ie-palette-border;
-	}
-
-	code {
-		border: solid 1px $ie-palette-border;
-	}
-
-/* Section/Article */
-
-	header {
-		&.major {
-			&:after {
-				background: $ie-palette-border;
-			}
-		}
-	}
-
-/* Form */
-
-	input[type="text"],
-	input[type="password"],
-	input[type="email"],
-	select,
-	textarea {
-		-ms-behavior: url('assets/js/ie/PIE.htc');
-		border: solid 1px $ie-palette-border;
-		position: relative;
-	}
-
-/* List */
-
-	ul {
-		&.alt {
-			li {
-				border-top: solid 1px $ie-palette-border;
-			}
-		}
-
-		&.major-icons {
-			li {
-				.icon {
-					-ms-behavior: url('assets/js/ie/PIE.htc');
-					border: solid 1px $ie-palette-border;
-					position: relative;
-				}
-			}
-		}
-	}
-
-/* Table */
-
-	table {
-		thead {
-			border-bottom: solid 1px $ie-palette-border;
-		}
-
-		tfoot {
-			border-top: solid 1px $ie-palette-border;
-		}
-
-		&.alt {
-			tbody {
-				tr {
-					td {
-						border: solid 1px $ie-palette-border;
-						border-left-width: 0;
-						border-top-width: 0;
-					}
-				}
-			}
-		}
-	}
-
-/* Button */
-
-	input[type="submit"],
-	input[type="reset"],
-	input[type="button"],
-	button,
-	.button {
-		-ms-behavior: url('assets/js/ie/PIE.htc');
-		border: solid 1px $ie-palette-border;
-		position: relative;
-	}
-
-/* Image */
-
-	.image {
-		-ms-behavior: url('assets/js/ie/PIE.htc');
-
-		img {
-			-ms-behavior: url('assets/js/ie/PIE.htc');
-			position: relative;
-		}
-	}
-
-// Dark (mixin)
-
-	@mixin dark($ie-palette-this-bg: $ie-palette-dark-bg) {
-		background-color: $ie-palette-this-bg;
-		color: $ie-palette-dark-fg;
-
-		a {
-			border-bottom-color: $ie-palette-dark-fg;
-
-			&:hover {
-				color: $ie-palette-dark-fg-bold;
-			}
-		}
-
-		h1, h2, h3, h4, h5, h6, strong, b {
-			color: $ie-palette-dark-fg-bold;
-		}
-
-		header {
-			p {
-				color: $ie-palette-dark-fg-bold;
-			}
-
-			&.major {
-				&:after {
-					background: $ie-palette-dark-border;
-				}
-			}
-		}
-
-		input[type="submit"],
-		input[type="reset"],
-		input[type="button"],
-		button,
-		.button {
-			border: solid 1px $ie-palette-dark-border !important;
-			color: $ie-palette-dark-fg-bold !important;
-
-			&:hover {
-				background-color: $ie-palette-dark-border-bg;
-			}
-
-			&:active {
-				background-color: $ie-palette-dark-border2-bg;
-			}
-
-			&.special {
-				background-color: $ie-palette-dark-fg-bold;
-				border: solid 1px $ie-palette-dark-border !important;
-				color: $ie-palette-this-bg !important;
-
-				&:hover {
-					background-color: $ie-palette-dark-border-bg !important;
-					color: $ie-palette-dark-fg-bold !important;
-				}
-
-				&:active {
-					background-color: $ie-palette-dark-border2-bg !important;
-				}
-			}
-		}
-
-		ul {
-			&.major-icons {
-				li {
-					.icon {
-						border-color: $ie-palette-dark-border;
-					}
-				}
-			}
-		}
-
-		.icon {
-			&.major {
-				color: $ie-palette-dark-fg-bold;
-			}
-		}
-	}
-
-/* Main */
-
-	.main {
-		&.style2 {
-			@include dark(#333);
-			-ms-behavior: url('assets/js/ie/backgroundsize.min.htc');
-			background-image: url('../../images/header.jpg');
-			background-size: cover;
-			position: relative;
-
-			&:before {
-				background-image: url('images/overlay1.png');
-				content: '';
-				height: 100%;
-				left: 0;
-				position: absolute;
-				top: 0;
-				width: 100%;
-			}
-
-			> * {
-				position: relative;
-				z-index: 1;
-			}
-		}
-	}
-
-/* Header */
-
-	#header {
-		@include dark(#4686a0);
-	}
-
-/* Footer */
-
-	#footer {
-		@include dark(#4686a0);
-	}
\ No newline at end of file
diff --git a/assets/sass/ie9.scss b/assets/sass/ie9.scss
deleted file mode 100644
index f991ca5..0000000
--- a/assets/sass/ie9.scss
+++ /dev/null
@@ -1,66 +0,0 @@
-@import 'libs/vars';
-@import 'libs/functions';
-@import 'libs/mixins';
-@import 'libs/skel';
-
-/*
-	Photon by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-/* Header */
-
-	#header {
-		$from: _palette(accent3-alt);
-		$to: _palette(accent6-alt);
-
-		background-image: none;
-		filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#{$from}", endColorStr="#{$to}", GradientType=1);
-		position: relative;
-
-		&:before {
-			background-image:		url('images/overlay2.png'),		url('images/overlay3.svg');
-			background-position:	top left,							center center;
-			background-size:		auto,								cover;
-			content: '';
-			height: 100%;
-			left: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
-		}
-
-		> * {
-			position: relative;
-			z-index: 1;
-		}
-	}
-
-/* Footer */
-
-	#footer {
-		$from: _palette(accent6-alt);
-		$to: _palette(accent3-alt);
-
-		background-image: none;
-		filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#{$from}", endColorStr="#{$to}", GradientType=1);
-		position: relative;
-
-		&:before {
-			background-image:		url('images/overlay2.png'),		url('images/overlay4.svg');
-			background-position:	top left,							center center;
-			background-size:		auto,								cover;
-			content: '';
-			height: 100%;
-			left: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
-		}
-
-		> * {
-			position: relative;
-			z-index: 1;
-		}
-	}
\ No newline at end of file
diff --git a/assets/sass/layout/_wrapper.scss b/assets/sass/layout/_wrapper.scss
new file mode 100644
index 0000000..e99fcdb
--- /dev/null
+++ b/assets/sass/layout/_wrapper.scss
@@ -0,0 +1,49 @@
+///
+/// Story by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Wrapper */
+
+	@mixin wrapper-color($n) {
+		> .color#{$n} {
+			background-color: _palette(color#{$n});
+		}
+	}
+
+	#wrapper {
+		background-color: inherit;
+		width: 100%;
+		overflow-x: hidden;
+
+		> .invert {
+			@include color(invert);
+		}
+
+		@include wrapper-color(1);
+		@include wrapper-color(2);
+		@include wrapper-color(3);
+		@include wrapper-color(4);
+		@include wrapper-color(5);
+		@include wrapper-color(6);
+		@include wrapper-color(7);
+
+		&.divided {
+			> * {
+				box-shadow: inset 0 1px 0 0 _palette(border-alt);
+
+				&:first-child {
+					box-shadow: none !important;
+				}
+			}
+
+			> .invert {
+				box-shadow: inset 0 1px 0 0 _palette(invert, border-alt);
+
+				&:first-child {
+					box-shadow: none !important;
+				}
+			}
+		}
+	}
\ No newline at end of file
diff --git a/assets/sass/libs/_vars.scss b/assets/sass/libs/_vars.scss
index 13c7530..7205363 100644
--- a/assets/sass/libs/_vars.scss
+++ b/assets/sass/libs/_vars.scss
@@ -1,18 +1,39 @@
 // Misc.
 	$misc: (
-		z-index-base:		10000
+		z-index-base:		10000,
+		overlay-opacity:	0.5,
+		lightbox-opacity:	0.75,
+		gallery-limit:		32,
+		items-limit:		16
 	);
 
 // Duration.
 	$duration: (
-		transition:			0.2s
+		menu:				0.5s,
+		transition:			0.2s,
+		gallery-lightbox:	0.5s,
+		gallery-delay:		0.15s,
+		items-delay:		0.15s,
+		on-load:			0.75s,
+		on-scroll:			0.75s
 	);
 
 // Size.
 	$size: (
 		border-radius:		4px,
-		element-height:		2.75em,
-		element-margin:		2em
+		border-radius-alt:	0.5rem,
+		border-width:		1px,
+		element-height:		2.75rem,
+		element-margin:		2rem,
+		gutter:				3.5rem,
+		inner:				64rem,
+		padding:			(
+			default:		7rem,
+			xlarge:			5rem,
+			large:			4rem,
+			medium:			3rem,
+			small:			2rem
+		)
 	);
 
 // Font.
@@ -20,40 +41,40 @@
 		family:				('Source Sans Pro', Helvetica, sans-serif),
 		family-fixed:		('Courier New', monospace),
 		weight:				300,
-		weight-bold:		400
+		weight-bold:		400,
+		kerning:			-0.05em,
+		kerning-alt:		0.125em
 	);
 
 // Palette.
 	$palette: (
-		bg:					#fff,
-		fg:					#666,
-		fg-bold:			#555,
-		fg-light: 			#999,
-		border:				rgba(144,144,144,0.5),
-		border-bg:			rgba(144,144,144,0.075),
-		border2:			rgba(144,144,144,0.75),
-		border2-bg:			rgba(144,144,144,0.2),
-		accent1:			#c3e895,
-		accent2:			#8addaa,
-		accent3:			#6bd4c8,
-		accent4:			#57aed3,
-		accent5:			#4a87d3,
-		accent6:			#6b88e6,
-		accent1-alt:		desaturate(darken(#c3e895, 15), 20),
-		accent2-alt:		desaturate(darken(#8addaa, 15), 20),
-		accent3-alt:		desaturate(darken(#6bd4c8, 15), 20),
-		accent4-alt:		desaturate(darken(#57aed3, 15), 20),
-		accent5-alt:		desaturate(darken(#4a87d3, 15), 20),
-		accent6-alt:		desaturate(darken(#6b88e6, 15), 20),
+		color1:				#30363d,
+		color2:				#db8992,
+		color3:				#ab7aad,
+		color4:				#897cad,
+		color5:				#7794ce,
+		color6:				#64abb4,
+		color7:				#6ba78c,
+
+		bg:					#ffffff,
+		bg-alt:				#eeeeee,
+		fg:					#000000,
+		fg-bold:			#000000,
+		fg-light:			rgba(0,0,0,0.75),
+		border:				rgba(0,0,0,0.2),
+		border-alt:			rgba(0,0,0,0.075),
+		border-bg:			rgba(0,0,0,0.05),
+		accent:				#47D3E5,
 
-		dark: (
-			bg:				#666666,
+		invert: (
+			bg:				#000000,
+			bg-alt:			#222222,
+			fg:				#ffffff,
 			fg-bold:		#ffffff,
-			fg:				rgba(255,255,255,0.75),
-			fg-light:		rgba(255,255,255,0.5),
-			border:			#ffffff,
+			fg-light:		#ffffff,
+			border:			rgba(255,255,255,1.0),
+			border-alt:		rgba(255,255,255,0.125),
 			border-bg:		rgba(255,255,255,0.125),
-			border2:		rgba(255,255,255,0.75),
-			border2-bg:		rgba(255,255,255,0.25)
-		)
+			accent:			#47D3E5
+		),
 	);
\ No newline at end of file
diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index ccf4827..96b2df1 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -1,1408 +1,179 @@
-@import 'libs/vars';
-@import 'libs/functions';
-@import 'libs/mixins';
-@import url('font-awesome.min.css');
-@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic");
-
-/*
-	Photon by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-	@import "libs/skel";
-
-	@include skel-breakpoints((
-		xlarge: '(max-width: 1680px)',
-		large: '(max-width: 1140px)',
-		medium: '(max-width: 980px)',
-		small: '(max-width: 736px)',
-		xsmall: '(max-width: 480px)',
-		xxsmall: '(max-width: 320px)'
-	));
-
-	@include skel-layout((
-		reset: 'full',
-		boxModel: 'border',
-		grid: ( gutters: 2em ),
-		conditionals: true,
-		containers: 60em,
-		breakpoints: (
-			large: (
-				containers: 90%,
-				grid: (
-					gutters: 1.5em
-				),
-			),
-			medium: (
-				containers: (100%, true),
-			)
-		)
-	));
-
-/* Basic */
-
-	body {
-		background: _palette(bg);
-
-		&.is-loading {
-			*, *:before, *:after {
-				@include vendor('animation', 'none !important');
-				@include vendor('transition', 'none !important');
-			}
-		}
-	}
-
-	body, input, select, textarea {
-		color: _palette(fg);
-		font-family: _font(family);
-		font-size: 16pt;
-		font-weight: _font(weight);
-		line-height: 1.65em;
-	}
-
-	a {
-		@include vendor('transition', ('color #{_duration(transition)} ease-in-out', 'border-color #{_duration(transition)} ease-in-out'));
-		border-bottom: dotted 1px _palette(fg);
-		color: inherit;
-		text-decoration: none;
-
-		&:hover {
-			border-bottom-color: transparent !important;
-			color: _palette(accent3);
-		}
-	}
-
-	strong, b {
-		color: _palette(fg-bold);
-		font-weight: _font(weight-bold);
-	}
-
-	em, i {
-		font-style: italic;
-	}
-
-	p {
-		margin: 0 0 _size(element-margin) 0;
-	}
-
-	h1, h2, h3, h4, h5, h6 {
-		color: _palette(fg-bold);
-		line-height: 1em;
-		margin: 0 0 (_size(element-margin) * 0.5) 0;
-
-		a {
-			color: inherit;
-			text-decoration: none;
-		}
-	}
-
-	h1 {
-		font-size: 2.25em;
-		line-height: 1.35em;
-	}
-
-	h2 {
-		font-size: 2em;
-		line-height: 1.35em;
-	}
-
-	h3 {
-		font-size: 1.35em;
-		line-height: 1.5em;
-	}
-
-	h4 {
-		font-size: 1.25em;
-		line-height: 1.5em;
-	}
-
-	h5 {
-		font-size: 0.9em;
-		line-height: 1.5em;
-	}
-
-	h6 {
-		font-size: 0.7em;
-		line-height: 1.5em;
-	}
-
-	sub {
-		font-size: 0.8em;
-		position: relative;
-		top: 0.5em;
-	}
-
-	sup {
-		font-size: 0.8em;
-		position: relative;
-		top: -0.5em;
-	}
-
-	hr {
-		border: 0;
-		border-bottom: solid 1px _palette(border);
-
-		// This is the *only* instance where we need to rely on margin collapse.
-		margin: _size(element-margin) 0;
-
-		&.major {
-			margin: (_size(element-margin) * 1.5) 0;
-		}
-	}
-
-	blockquote {
-		border-left: solid 4px _palette(border);
-		font-style: italic;
-		margin: 0 0 _size(element-margin) 0;
-		padding: 0.5em 0 0.5em 2em;
-	}
-
-	code {
-		background: _palette(border-bg);
-		border-radius: _size(border-radius);
-		border: solid 1px _palette(border);
-		font-family: _font(family-fixed);
-		font-size: 0.9em;
-		margin: 0 0.25em;
-		padding: 0.25em 0.65em;
-	}
-
-	pre {
-		-webkit-overflow-scrolling: touch;
-		font-family: _font(family-fixed);
-		font-size: 0.9em;
-		margin: 0 0 _size(element-margin) 0;
-
-		code {
-			display: block;
-			line-height: 1.75em;
-			padding: 1em 1.5em;
-			overflow-x: auto;
-		}
-	}
-
-	.align-left {
-		text-align: left;
-	}
-
-	.align-center {
-		text-align: center;
-	}
-
-	.align-right {
-		text-align: right;
-	}
-
-/* Section/Article */
-
-	section, article {
-		&.special {
-			text-align: center;
-		}
-	}
-
-	header {
-		p {
-			color: _palette(fg-light);
-			margin: 0 0 (_size(element-margin) * 0.75) 0;
-			position: relative;
-		}
-
-		h2 + p {
-			font-size: 1.25em;
-			line-height: 1.5em;
-			margin-top: (_size(element-margin) * -0.5);
-		}
-
-		h3 + p {
-			font-size: 1.1em;
-			line-height: 1.5em;
-			margin-top: (_size(element-margin) * -0.4);
-		}
-
-		h4 + p,
-		h5 + p,
-		h6 + p {
-			font-size: 0.9em;
-			line-height: 1.5em;
-			margin-top: (_size(element-margin) * -0.3);
-		}
-
-		&.major {
-			margin: 0 0 (_size(element-margin) * 0.5) 0;
-
-			&:after {
-				background: _palette(border);
-				content: '';
-				display: inline-block;
-				height: 1px;
-				margin-top: (_size(element-margin) * 0.75);
-				width: 6em;
-			}
-
-			h2, h3, h4, h5, h6 {
-				margin: 0;
-			}
-
-			p {
-				margin: (_size(element-margin) * 0.35) 0 0 0;
-			}
-		}
-
-		&.special {
-			text-align: center;
-		}
-	}
-
-/* Form */
-
-	form {
-		margin: 0 0 _size(element-margin) 0;
-	}
-
-	label {
-		color: _palette(fg-bold);
-		display: block;
-		font-size: 0.9em;
-		font-weight: _font(weight-bold);
-		margin: 0 0 (_size(element-margin) * 0.5) 0;
-	}
-
-	input[type="text"],
-	input[type="password"],
-	input[type="email"],
-	select,
-	textarea {
-		@include vendor('appearance', 'none');
-		background: _palette(border-bg);
-		border-radius: _size(border-radius);
-		border: none;
-		border: solid 1px _palette(border);
-		color: inherit;
-		display: block;
-		outline: 0;
-		padding: 0 1em;
-		text-decoration: none;
-		width: 100%;
-
-		&:invalid {
-			box-shadow: none;
-		}
-
-		&:focus {
-			border-color: _palette(accent3);
-		}
-	}
-
-	.select-wrapper {
-		@include icon;
-		display: block;
-		position: relative;
-
-		&:before {
-			color: _palette(border);
-			content: '\f078';
-			display: block;
-			height: _size(element-height);
-			line-height: _size(element-height);
-			pointer-events: none;
-			position: absolute;
-			right: 0;
-			text-align: center;
-			top: 0;
-			width: _size(element-height);
-		}
-
-		select::-ms-expand {
-			display: none;
-		}
-	}
-
-	input[type="text"],
-	input[type="password"],
-	input[type="email"],
-	select {
-		height: _size(element-height);
-	}
-
-	textarea {
-		padding: 0.75em 1em;
-	}
-
-	input[type="checkbox"],
-	input[type="radio"], {
-		@include vendor('appearance', 'none');
-		display: block;
-		float: left;
-		margin-right: -2em;
-		opacity: 0;
-		width: 1em;
-		z-index: -1;
-
-		& + label {
-			@include icon;
-			color: _palette(fg);
-			cursor: pointer;
-			display: inline-block;
-			font-size: 1em;
-			font-weight: _font(weight);
-			padding-left: (_size(element-height) * 0.6) + 0.75em;
-			padding-right: 0.75em;
-			position: relative;
-
-			&:before {
-				background: _palette(border-bg);
-				border-radius: _size(border-radius);
-				border: solid 1px _palette(border);
-				content: '';
-				display: inline-block;
-				height: (_size(element-height) * 0.6);
-				left: 0;
-				line-height: (_size(element-height) * 0.575);
-				position: absolute;
-				text-align: center;
-				top: 0;
-				width: (_size(element-height) * 0.6);
-			}
-		}
-
-		&:checked + label {
-			&:before {
-				background: _palette(dark, bg);
-				border-color: _palette(dark, bg);
-				color: _palette(dark, fg-bold);
-				content: '\f00c';
-			}
-		}
-
-		&:focus + label {
-			&:before {
-				border-color: _palette(accent3);
-			}
-		}
-	}
-
-	input[type="checkbox"] {
-		& + label {
-			&:before {
-				border-radius: _size(border-radius);
-			}
-		}
-	}
-
-	input[type="radio"] {
-		& + label {
-			&:before {
-				border-radius: 100%;
-			}
-		}
-	}
-
-	::-webkit-input-placeholder {
-		color: _palette(fg-light) !important;
-		opacity: 1.0;
-	}
-
-	:-moz-placeholder {
-		color: _palette(fg-light) !important;
-		opacity: 1.0;
-	}
-
-	::-moz-placeholder {
-		color: _palette(fg-light) !important;
-		opacity: 1.0;
-	}
-
-	:-ms-input-placeholder {
-		color: _palette(fg-light) !important;
-		opacity: 1.0;
-	}
-
-	.formerize-placeholder {
-		color: _palette(fg-light) !important;
-		opacity: 1.0;
-	}
-
-/* Box */
-
-	.box {
-		border-radius: _size(border-radius);
-		border: solid 1px _palette(border);
-		margin-bottom: _size(element-margin);
-		padding: 1.5em;
-
-		> :last-child,
-		> :last-child > :last-child,
-		> :last-child > :last-child > :last-child {
-			margin-bottom: 0;
-		}
-
-		&.alt {
-			border: 0;
-			border-radius: 0;
-			padding: 0;
-		}
-	}
-
-/* Icon */
-
-	.icon {
-		@include icon;
-		border-bottom: none;
-		position: relative;
-
-		> .label {
-			display: none;
-		}
-
-		&.style1 { &:before { color: _palette(accent1); } }
-		&.style2 { &:before { color: _palette(accent2); } }
-		&.style3 { &:before { color: _palette(accent3); } }
-		&.style4 { &:before { color: _palette(accent4); } }
-		&.style5 { &:before { color: _palette(accent5); } }
-		&.style6 { &:before { color: _palette(accent6); } }
-
-		&.major {
-			@include icon;
-			color: _palette(fg-bold);
-			cursor: default;
-			display: inline-block;
-			margin: 0 0 (_size(element-margin) * 0.75) 0;
-
-			&:before {
-				font-size: 4em;
-				line-height: 1em;
-			}
-		}
-	}
-
-/* Image */
-
-	.image {
-		border-radius: _size(border-radius);
-		border: 0;
-		display: inline-block;
-		position: relative;
-
-		img {
-			border-radius: _size(border-radius);
-			display: block;
-		}
-
-		&.left {
-			float: left;
-			padding: 0 1.5em 1em 0;
-			top: 0.25em;
-		}
-
-		&.right {
-			float: right;
-			padding: 0 0 1em 1.5em;
-			top: 0.25em;
-		}
-
-		&.left,
-		&.right {
-			max-width: 40%;
-
-			img {
-				width: 100%;
-			}
-		}
-
-		&.fit {
-			display: block;
-			margin: 0 0 _size(element-margin) 0;
-			width: 100%;
-
-			img {
-				width: 100%;
-			}
-		}
-	}
-
-/* List */
-
-	ol {
-		list-style: decimal;
-		margin: 0 0 _size(element-margin) 0;
-		padding-left: 1.25em;
-
-		li {
-			padding-left: 0.25em;
-		}
-	}
-
-	ul {
-		list-style: disc;
-		margin: 0 0 _size(element-margin) 0;
-		padding-left: 1em;
-
-		li {
-			padding-left: 0.5em;
-		}
-
-		&.alt {
-			list-style: none;
-			padding-left: 0;
-
-			li {
-				border-top: solid 1px _palette(border);
-				padding: 0.5em 0;
-
-				&:first-child {
-					border-top: 0;
-					padding-top: 0;
-				}
-			}
-		}
-
-		&.icons {
-			cursor: default;
-			list-style: none;
-			padding-left: 0;
-
-			li {
-				display: inline-block;
-				padding: 0 1.25em 0 0;
-
-				&:last-child {
-					padding-right: 0;
-				}
-
-				.icon {
-					&:before {
-						font-size: 1.5em;
-					}
-				}
-			}
-		}
-
-		&.major-icons {
-			list-style: none;
-			padding-left: 0;
-
-			li {
-				display: inline-block;
-				padding: 2.5em;
-				text-align: center;
-
-				.icon {
-					@include vendor('transform', 'rotate(45deg)');
-					border-radius: _size(border-radius);
-					border: solid 1px _palette(border);
-					display: inline-block;
-					height: 8em;
-					line-height: 8em;
-					margin: 0;
-					text-align: center;
-					width: 8em;
-
-					&:before {
-						@include vendor('transform', 'rotate(-45deg)');
-						display: inline-block;
-						line-height: inherit;
-					}
-				}
-			}
-		}
-
-		&.actions {
-			cursor: default;
-			list-style: none;
-			padding-left: 0;
-
-			li {
-				display: inline-block;
-				padding: 0 (_size(element-margin) * 0.5) 0 0;
-				vertical-align: middle;
-
-				&:last-child {
-					padding-right: 0;
-				}
-			}
-
-			&.small {
-				li {
-					padding: 0 (_size(element-margin) * 0.25) 0 0;
-				}
-			}
-
-			&.vertical {
-				li {
-					display: block;
-					padding: (_size(element-margin) * 0.5) 0 0 0;
-
-					&:first-child {
-						padding-top: 0;
-					}
-
-					> * {
-						margin-bottom: 0;
-					}
-				}
-
-				&.small {
-					li {
-						padding: (_size(element-margin) * 0.25) 0 0 0;
-
-						&:first-child {
-							padding-top: 0;
-						}
-					}
-				}
-			}
-
-			&.uniform {
-				li {
-					> * {
-						min-width: 12em;
-					}
-				}
-			}
-
-			&.fit {
-				display: table;
-				margin-left: (_size(element-margin) * -0.5);
-				padding: 0;
-				table-layout: fixed;
-				width: calc(100% + #{(_size(element-margin) * 0.5)});
-
-				li {
-					display: table-cell;
-					padding: 0 0 0 (_size(element-margin) * 0.5);
-
-					> * {
-						margin-bottom: 0;
-					}
-				}
-
-				&.small {
-					margin-left: (_size(element-margin) * -0.25);
-					width: calc(100% + #{(_size(element-margin) * 0.25)});
-
-					li {
-						padding: 0 0 0 (_size(element-margin) * 0.25);
-					}
-				}
-			}
-		}
-	}
-
-	dl {
-		margin: 0 0 _size(element-margin) 0;
-	}
-
-/* Table */
-
-	.table-wrapper {
-		-webkit-overflow-scrolling: touch;
-		overflow-x: auto;
-	}
-
-	table {
-		margin: 0 0 _size(element-margin) 0;
-		width: 100%;
-
-		tbody {
-			tr {
-				border-left: 0;
-				border-right: 0;
-
-				&:nth-child(2n + 1) {
-					background-color: _palette(border-bg);
-				}
-			}
-		}
-
-		td {
-			padding: 0.75em 0.75em;
-		}
-
-		th {
-			color: _palette(fg-bold);
-			font-size: 0.9em;
-			font-weight: _font(weight-bold);
-			padding: 0 0.75em 0.75em 0.75em;
-			text-align: left;
-		}
-
-		thead {
-			border-bottom: solid 1px _palette(border);
-		}
-
-		tfoot {
-			border-top: solid 1px _palette(border);
-		}
-
-		&.alt {
-			border-collapse: separate;
-
-			tbody {
-				tr {
-					td {
-						border: solid 1px _palette(border);
-						border-left-width: 0;
-						border-top-width: 0;
-
-						&:first-child {
-							border-left-width: 1px;
-						}
-					}
-
-					&:first-child {
-						td {
-							border-top-width: 1px;
-						}
-					}
-				}
-			}
-
-			thead {
-				border-bottom: 0;
-			}
-
-			tfoot {
-				border-top: 0;
-			}
-		}
-	}
-
-/* Button */
-
-	input[type="submit"],
-	input[type="reset"],
-	input[type="button"],
-	button,
-	.button {
-		@include vendor('appearance', 'none');
-		@include vendor('transition', ('background-color #{_duration(transition)} ease-in-out', 'color #{_duration(transition)} ease-in-out'));
-		background-color: transparent;
-		border-radius: _size(border-radius);
-		border: 0;
-		box-shadow: inset 0 0 0 1px _palette(border);
-		color: _palette(fg-bold) !important;
-		cursor: pointer;
-		display: inline-block;
-		font-size: 0.9em;
-		font-weight: _font(weight-bold);
-		height: 2.75em;
-		letter-spacing: 0.125em;
-		line-height: 2.75em;
-		padding: 0 2em;
-		text-align: center;
-		text-decoration: none;
-		text-indent: 0.125em;
-		text-transform: uppercase;
-		white-space: nowrap;
-
-		&:hover {
-			background-color: _palette(border-bg);
-		}
-
-		&:active {
-			background-color: _palette(border2-bg);
-		}
-
-		&.icon {
-			padding-left: 1.35em;
-
-			&:before {
-				margin-right: 0.5em;
-			}
-		}
-
-		&.fit {
-			display: block;
-			margin: 0 0 (_size(element-margin) * 0.5) 0;
-			width: 100%;
-		}
-
-		&.small {
-			font-size: 0.7em;
-		}
-
-		&.big {
-			font-size: 1.25em;
-		}
-
-		&.special {
-			background-color: _palette(fg-bold);
-			box-shadow: none !important;
-			color: _palette(bg) !important;
-
-			&:hover {
-				background-color: lighten(_palette(fg-bold), 5);
-			}
-
-			&:active {
-				background-color: darken(_palette(fg-bold), 5);
-			}
-		}
-
-		&.disabled,
-		&:disabled {
-			cursor: default;
-			opacity: 0.25;
-		}
-	}
-
-// Dark (mixin)
-
-	@mixin dark($color-this-bg: _palette(dark, bg)) {
-		background-color: $color-this-bg;
-		color: _palette(dark, fg);
-
-		a {
-			border-bottom-color: transparentize(_palette(dark, fg), 0.25);
-
-			&:hover {
-				color: _palette(dark, fg-bold);
-			}
-		}
-
-		h1, h2, h3, h4, h5, h6, strong, b {
-			color: _palette(dark, fg-bold);
-		}
-
-		header {
-			p {
-				color: _palette(dark, fg-bold);
-			}
-
-			&.major {
-				&:after {
-					background: _palette(dark, border);
-				}
-			}
-		}
-
-		input[type="submit"],
-		input[type="reset"],
-		input[type="button"],
-		button,
-		.button {
-			box-shadow: inset 0 0 0 1px _palette(dark, border);
-			color: _palette(dark, fg-bold) !important;
-
-			&:hover {
-				background-color: _palette(dark, border-bg);
-			}
-
-			&:active {
-				background-color: _palette(dark, border2-bg);
-			}
-
-			&.special {
-				background-color: _palette(dark, fg-bold);
-				box-shadow: inset 0 0 0 1px _palette(dark, border) !important;
-				color: $color-this-bg !important;
-
-				&:hover {
-					background-color: _palette(dark, border-bg) !important;
-					color: _palette(dark, fg-bold) !important;
-				}
-
-				&:active {
-					background-color: _palette(dark, border2-bg) !important;
-				}
-			}
-		}
-
-		ul {
-			&.major-icons {
-				li {
-					.icon {
-						border-color: _palette(dark, border);
-					}
-				}
-			}
-		}
-
-		.icon {
-			&.major {
-				color: _palette(dark, fg-bold);
-			}
-		}
-	}
-
-/* Main */
-
-	.main {
-		@include padding(6em, 0);
-
-		&.style1 {
-			background: _palette(bg);
-		}
-
-		&.style2 {
-			@include dark(#333);
-			background-attachment:	fixed,							fixed;
-			background-image:		url('images/overlay1.png'),		url('../../images/header.jpg');
-			background-size:		auto,							cover;
-		}
-	}
-
-/* Header */
-
-	#header {
-		@include padding(9em, 0, (0,0,_size(element-margin),0));
-		@include dark(#4686a0);
-		background-attachment:	fixed,							fixed,							fixed;
-		background-image:		url('images/overlay2.png'),		url('images/overlay3.svg'),		linear-gradient(45deg, _palette(accent1-alt) 5%, _palette(accent3-alt) 30%, _palette(accent6-alt));
-		background-position:	top left,						center center,					center center;
-		background-size:		auto,							cover,							cover;
-		overflow: hidden;
-		position: relative;
-		text-align: center;
-
-		h1 {
-			margin: 0;
-		}
-
-		p {
-			margin: (_size(element-margin) * 0.5) 0 0 0;
-		}
-
-		.actions {
-			margin: (_size(element-margin) * 1.25) 0 0 0;
-			position: relative;
-
-			&:after {
-				background: _palette(dark, border);
-				content: '';
-				height: 100vh;
-				left: 50%;
-				position: absolute;
-				top: 100%;
-				width: 1px;
-			}
-		}
-
-		.inner {
-			@include vendor('transition', ('transform 1.5s ease', 'opacity 2s ease'));
-			@include vendor('transition-delay', '0.25s');
-			@include vendor('transform', 'scale(1)');
-			opacity: 1;
-			position: relative;
-			z-index: 1;
-
-			.actions {
-				@include vendor('transition', 'transform 1.25s ease');
-				@include vendor('transition-delay', '1s');
-				@include vendor('transform', 'translateY(0)');
-				opacity: 1;
-			}
-		}
-
-		&:after {
-			@include vendor('transition', 'opacity 1s ease');
-			background-image: linear-gradient(45deg, _palette(accent3-alt), _palette(accent6-alt));
-			content: '';
-			height: 100%;
-			left: 0;
-			opacity: 0;
-			position: absolute;
-			top: 0;
-			width: 100%;
-		}
-	}
-
-	body.is-loading {
-		#header {
-			.inner {
-				@include vendor('transform', 'scale(1.05)');
-				opacity: 0;
-
-				.actions {
-					@include vendor('transform', 'translateY(30em)');
-					opacity: 0;
-				}
-			}
-
-			&:after {
-				opacity: 1;
-			}
-		}
-	}
-
-/* Footer */
-
-	#footer {
-		@include padding(6em, 0, (0,0,_size(element-margin),0));
-		@include dark(#4686a0);
-		background-attachment:	fixed,							fixed,							fixed;
-		background-image:		url('images/overlay2.png'),		url('images/overlay4.svg'),		linear-gradient(45deg, _palette(accent6-alt), _palette(accent3-alt) 50%, _palette(accent1-alt) 95%);
-		background-position:	top left,						center center,					center center;
-		background-size:		auto,							cover,							cover;
-		text-align: center;
-
-		.icons {
-			margin: 0;
-		}
-
-		.copyright {
-			font-size: 0.8em;
-			list-style: none;
-			margin: _size(element-margin) 0 0 0;
-			padding: 0;
-
-			li {
-				border-left: solid 1px;
-				display: inline-block;
-				line-height: 1em;
-				margin-left: 1em;
-				padding: 0 0 0 1em;
-
-				&:first-child {
-					border-left: 0;
-					margin-left: 0;
-					padding: 0;
-				}
-			}
-		}
-	}
-
-/* XLarge */
-
-	@include breakpoint(xlarge) {
-
-		/* Basic */
-
-			body, input, select, textarea {
-				font-size: 14pt;
-			}
-
-		/* Header */
-
-			#header {
-				@include padding(6em, 0, (0,0,_size(element-margin),0));
-			}
-
-	}
-
-/* Large */
-
-	@include breakpoint(large) {
-
-		/* Basic */
-
-			body, input, select, textarea {
-				font-size: 13pt;
-			}
-
-			h1, h2, h3, h4, h5, h6 {
-				br {
-					display: none;
-				}
-			}
-
-		/* List */
-
-			ul {
-				&.major-icons {
-					li {
-						padding: 2em;
-
-						.icon {
-							height: 8em;
-							line-height: 8em;
-							width: 8em;
-						}
-					}
-				}
-			}
-
-		/* Main */
-
-			.main {
-				@include padding(4em, 0);
-
-				&.style2 {
-					background-attachment: scroll;
-				}
-			}
-
-		/* Header */
-
-			#header {
-				@include padding(5em, 0, (0,0,_size(element-margin),0));
-				background-attachment: scroll;
-
-				br {
-					display: inline;
-				}
-			}
-
-		/* Footer */
-
-			#footer {
-				@include padding(4em, 0, (0,0,_size(element-margin),0));
-				background-attachment: scroll;
-			}
-
-	}
-
-/* Medium */
-
-	@include breakpoint(medium) {
-
-		/* List */
-
-			ul {
-				&.major-icons {
-					li {
-						padding: 2em;
-
-						.icon {
-							height: 7em;
-							line-height: 7em;
-							width: 7em;
-						}
-					}
-				}
-			}
-
-		/* Main */
-
-			.main {
-				@include padding(5em, 3em);
-			}
-
-		/* Header */
-
-			#header {
-				@include padding(8em, 3em, (0,0,_size(element-margin),0));
-			}
-
-		/* Footer */
-
-			#footer {
-				@include padding(5em, 3em, (0,0,_size(element-margin),0));
-			}
-
-		/* One */
-
-			#one {
-				text-align: center;
-			}
-
-		/* Two */
-
-			#two {
-				text-align: center;
-			}
-
-	}
-
-/* Small */
-
-	@include breakpoint(small) {
-
-		/* Basic */
-
-			body, input, select, textarea {
-				font-size: 12pt;
-			}
-
-			h1 {
-				font-size: 1.75em;
-			}
-
-			h2 {
-				font-size: 1.5em;
-			}
-
-			h3 {
-				font-size: 1.1em;
-			}
-
-			h4 {
-				font-size: 1em;
-			}
-
-		/* List */
-
-			ul {
-				&.major-icons {
-					li {
-						padding: 1.5em;
-
-						.icon {
-							height: 5em;
-							line-height: 5em;
-							width: 5em;
-
-							&:before {
-								font-size: 42px;
-							}
-						}
-					}
-				}
-			}
-
-		/* Icon */
-
-			.icon {
-				&.major {
-					margin: 0 0 (_size(element-margin) * 0.5) 0;
-				}
-			}
-
-		/* Button */
-
-			input[type="submit"],
-			input[type="reset"],
-			input[type="button"],
-			button,
-			.button {
-				height: 3em;
-				line-height: 3em;
-			}
-
-		/* Main */
-
-			.main {
-				@include padding(3em, 1.5em);
-			}
-
-		/* Header */
-
-			#header {
-				@include padding(4em, 3em, (0,0,_size(element-margin),0));
-
-				.actions {
-					margin: _size(element-margin) 0 0 0;
-				}
-			}
-
-		/* Footer */
-
-			#footer {
-				@include padding(3em, 1.5em, (0,0,_size(element-margin),0));
-			}
-
-	}
-
-/* XSmall */
-
-	@include breakpoint(xsmall) {
-
-		/* List */
-
-			ul {
-				&.actions {
-					margin: 0 0 _size(element-margin) 0;
-
-					li {
-						display: block;
-						padding: (_size(element-margin) * 0.5) 0 0 0;
-						text-align: center;
-						width: 100%;
-
-						&:first-child {
-							padding-top: 0;
-						}
-
-						> * {
-							margin: 0 !important;
-							width: 100%;
-
-							&.icon {
-								&:before {
-									margin-left: -2em;
-								}
-							}
-						}
-					}
-
-					&.small {
-						li {
-							padding: (_size(element-margin) * 0.25) 0 0 0;
-
-							&:first-child {
-								padding-top: 0;
-							}
-						}
-					}
-				}
-			}
-
-		/* Button */
-
-			input[type="submit"],
-			input[type="reset"],
-			input[type="button"],
-			.button {
-				padding: 0;
-			}
-
-		/* Main */
-
-			.main {
-				@include padding(2em, 1.5em);
-			}
-
-		/* Header */
-
-			#header {
-				@include padding(4em, 2em, (0,0,_size(element-margin),0));
-
-				br {
-					display: none;
-				}
-			}
-
-		/* Footer */
-
-			#footer {
-				@include padding(2em, 1.5em, (0,0,_size(element-margin),0));
-
-				.copyright {
-					margin: (_size(element-margin) * 0.75) 0 0 0;
-
-					li {
-						border: 0;
-						display: block;
-						margin: 1em 0 0 0;
-						padding: 0;
-
-						&:first-child {
-							margin-top: 0;
-						}
-					}
-				}
-			}
-
-	}
-
-/* XXSmall */
-
-	@include breakpoint(xxsmall) {
-
-		/* Basic */
-
-			html, body {
-				min-width: 320px;
-			}
-
-		/* Main */
-
-			.main {
-				@include padding(2em, 1em);
-			}
-
-		/* Header */
-
-			#header {
-				@include padding(3em, 1em, (0,0,_size(element-margin),0));
-			}
-
-		/* Footer */
-
-			#footer {
-				@include padding(2em, 1em, (0,0,_size(element-margin),0));
-			}
-
-	}
\ No newline at end of file
+@import 'libs/vars';
+@import 'libs/functions';
+@import 'libs/mixins';
+@import 'libs/skel';
+@import 'font-awesome.min.css';
+@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i');
+
+/*
+	Story by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+*/
+
+	@include skel-breakpoints((
+		xlarge: '(max-width: 1680px)',
+		large: '(max-width: 1280px)',
+		medium: '(max-width: 980px)',
+		small: '(max-width: 736px)',
+		xsmall: '(max-width: 480px)',
+		xxsmall: '(max-width: 360px)'
+	));
+
+	@include skel-layout((
+		reset: 'full',
+		boxModel: 'border',
+		grid: ( gutters: 2rem )
+	));
+
+	@mixin color($p) {
+		@include color-typography($p);
+		@include color-box($p);
+		@include color-button($p);
+		@include color-form($p);
+		@include color-icon($p);
+		@include color-list($p);
+		@include color-section($p);
+		@include color-table($p);
+		@include color-banner($p);
+		@include color-spotlight($p);
+		@include color-gallery($p);
+		@include color-items($p);
+		@include color-index($p);
+	}
+
+	@mixin phone($image-width) {
+		@include vendor('flex-grow', '0');
+		@include vendor('flex-shrink', '0');
+		border-radius: 0;
+		border: solid _size(border-width);
+
+		img {
+			@include vendor('object-fit', 'cover');
+			@include vendor('object-position', 'center');
+			display: block;
+			width: 100%;
+			height: 100%;
+			border-radius: 0;
+		}
+
+		&:before {
+			content: '';
+			display: block;
+			background-position: center;
+			background-repeat: no-repeat;
+			border: solid _size(border-width);
+			border-bottom: 0;
+		}
+
+		&:after {
+			content: '';
+			display: block;
+			background-position: center;
+			background-repeat: no-repeat;
+			border: solid _size(border-width);
+			border-top: 0;
+		}
+
+		@include resize-phone($image-width, 1);
+	}
+
+	@mixin resize-phone($image-width, $image-factor) {
+		$image-pad-top: 2.5rem;
+		$image-pad-bottom: 3rem;
+		$image-height: ($image-width * (1920 / 1080));
+
+		width: ($image-width * $image-factor);
+		height: (($image-width * $image-factor) * (1920 / 1080));
+		margin-top: ($image-pad-top * $image-factor);
+		margin-bottom: (_size(element-margin) + ($image-pad-bottom * $image-factor));
+
+		&:before {
+			height: ($image-pad-top * $image-factor);
+			background-size: (64px * $image-factor) (32px * $image-factor);
+			margin-top: (($image-pad-top * $image-factor) * -1);
+			border-radius: (1rem * $image-factor) (1rem * $image-factor) 0 0;
+		}
+
+		&:after {
+			height: ($image-pad-bottom * $image-factor);
+			background-size: (64px * $image-factor) (32px * $image-factor);
+			margin-bottom: (($image-pad-bottom * $image-factor) * -1);
+			border-radius: 0 0 (1rem * $image-factor) (1rem * $image-factor);
+		}
+	}
+
+	@mixin color-phone($p) {
+		border-color: _palette($p, border);
+		background-color: _palette($p, border);
+
+		@if ($p != 'invert') {
+			border-width: 0;
+		}
+		@else {
+			border-width: _size(border-width);
+		}
+
+		&:before {
+			background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="32px" viewBox="0 0 64 32" zoomAndPan="disable"><style>rect {fill: transparent; stroke: #{_palette($p, border)}; stroke-width: #{_size(border-width)}; }</style><rect rx="4" ry="4" x="11" y="12" width="42" height="8" vector-effect="non-scaling-stroke" /></svg>');
+			border-color: _palette($p, border);
+
+			@if ($p == 'invert') {
+				width: calc(100% + #{_size(border-width) * 2});
+				margin-left: (_size(border-width) * -1);
+			}
+			@else {
+				width: 100%;
+			}
+		}
+
+		&:after {
+			background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="32px" viewBox="0 0 64 32" zoomAndPan="disable"><style>circle {fill: transparent; stroke: #{_palette($p, border)}; stroke-width: #{_size(border-width)}; }</style><circle cx="32" cy="16" r="14" vector-effect="non-scaling-stroke" /></svg>');
+			border-color: _palette($p, border);
+
+			@if ($p == 'invert') {
+				width: calc(100% + #{_size(border-width) * 2});
+				margin-left: (_size(border-width) * -1);
+			}
+			@else {
+				width: 100%;
+			}
+		}
+	}
+
+	@mixin color-phone-variant($v, $p) {
+		@if ($v == 'android') {
+			&:after {
+				background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="32px" viewBox="0 0 64 32" zoomAndPan="disable"><style>rect {fill: transparent; stroke: #{_palette($p, border)}; stroke-width: #{_size(border-width)}; }</style><rect rx="4" ry="4" x="6" y="4" width="52" height="24" vector-effect="non-scaling-stroke" /></svg>');
+			}
+		}
+		@else if ($p == 'iphone') {
+			// ...
+		}
+	}
+
+// Base.
+
+	@import 'base/page';
+	@import 'base/typography';
+
+// Component.
+
+	@import 'components/box';
+	@import 'components/button';
+	@import 'components/form';
+	@import 'components/icon';
+	@import 'components/image';
+	@import 'components/list';
+	@import 'components/section';
+	@import 'components/table';
+	@import 'components/banner';
+	@import 'components/spotlight';
+	@import 'components/gallery';
+	@import 'components/wrapper';
+	@import 'components/items';
+	@import 'components/index';
+
+// Layout.
+
+	@import 'layout/wrapper';
\ No newline at end of file
diff --git a/images/banner.jpg b/images/banner.jpg
new file mode 100644
index 0000000..064b5cf
Binary files /dev/null and b/images/banner.jpg differ
diff --git a/images/gallery/fulls/01.jpg b/images/gallery/fulls/01.jpg
new file mode 100644
index 0000000..eef785c
Binary files /dev/null and b/images/gallery/fulls/01.jpg differ
diff --git a/images/gallery/fulls/02.jpg b/images/gallery/fulls/02.jpg
new file mode 100644
index 0000000..ece17be
Binary files /dev/null and b/images/gallery/fulls/02.jpg differ
diff --git a/images/gallery/fulls/03.jpg b/images/gallery/fulls/03.jpg
new file mode 100644
index 0000000..2f87cf2
Binary files /dev/null and b/images/gallery/fulls/03.jpg differ
diff --git a/images/gallery/fulls/04.jpg b/images/gallery/fulls/04.jpg
new file mode 100644
index 0000000..3265bac
Binary files /dev/null and b/images/gallery/fulls/04.jpg differ
diff --git a/images/gallery/fulls/05.jpg b/images/gallery/fulls/05.jpg
new file mode 100644
index 0000000..ba9ff6e
Binary files /dev/null and b/images/gallery/fulls/05.jpg differ
diff --git a/images/gallery/fulls/06.jpg b/images/gallery/fulls/06.jpg
new file mode 100644
index 0000000..0a72acd
Binary files /dev/null and b/images/gallery/fulls/06.jpg differ
diff --git a/images/gallery/fulls/07.jpg b/images/gallery/fulls/07.jpg
new file mode 100644
index 0000000..39ca1b2
Binary files /dev/null and b/images/gallery/fulls/07.jpg differ
diff --git a/images/gallery/fulls/08.jpg b/images/gallery/fulls/08.jpg
new file mode 100644
index 0000000..4fd6a16
Binary files /dev/null and b/images/gallery/fulls/08.jpg differ
diff --git a/images/gallery/fulls/09.jpg b/images/gallery/fulls/09.jpg
new file mode 100644
index 0000000..0ac6c6c
Binary files /dev/null and b/images/gallery/fulls/09.jpg differ
diff --git a/images/gallery/fulls/10.jpg b/images/gallery/fulls/10.jpg
new file mode 100644
index 0000000..0c5aef0
Binary files /dev/null and b/images/gallery/fulls/10.jpg differ
diff --git a/images/gallery/fulls/11.jpg b/images/gallery/fulls/11.jpg
new file mode 100644
index 0000000..8d4f404
Binary files /dev/null and b/images/gallery/fulls/11.jpg differ
diff --git a/images/gallery/fulls/12.jpg b/images/gallery/fulls/12.jpg
new file mode 100644
index 0000000..6c856ba
Binary files /dev/null and b/images/gallery/fulls/12.jpg differ
diff --git a/images/gallery/thumbs/01.jpg b/images/gallery/thumbs/01.jpg
new file mode 100644
index 0000000..9b3c24c
Binary files /dev/null and b/images/gallery/thumbs/01.jpg differ
diff --git a/images/gallery/thumbs/02.jpg b/images/gallery/thumbs/02.jpg
new file mode 100644
index 0000000..4984cbf
Binary files /dev/null and b/images/gallery/thumbs/02.jpg differ
diff --git a/images/gallery/thumbs/03.jpg b/images/gallery/thumbs/03.jpg
new file mode 100644
index 0000000..44c6517
Binary files /dev/null and b/images/gallery/thumbs/03.jpg differ
diff --git a/images/gallery/thumbs/04.jpg b/images/gallery/thumbs/04.jpg
new file mode 100644
index 0000000..3233b5d
Binary files /dev/null and b/images/gallery/thumbs/04.jpg differ
diff --git a/images/gallery/thumbs/05.jpg b/images/gallery/thumbs/05.jpg
new file mode 100644
index 0000000..58be398
Binary files /dev/null and b/images/gallery/thumbs/05.jpg differ
diff --git a/images/gallery/thumbs/06.jpg b/images/gallery/thumbs/06.jpg
new file mode 100644
index 0000000..a79d0d0
Binary files /dev/null and b/images/gallery/thumbs/06.jpg differ
diff --git a/images/gallery/thumbs/07.jpg b/images/gallery/thumbs/07.jpg
new file mode 100644
index 0000000..9ca921b
Binary files /dev/null and b/images/gallery/thumbs/07.jpg differ
diff --git a/images/gallery/thumbs/08.jpg b/images/gallery/thumbs/08.jpg
new file mode 100644
index 0000000..5328ca5
Binary files /dev/null and b/images/gallery/thumbs/08.jpg differ
diff --git a/images/gallery/thumbs/09.jpg b/images/gallery/thumbs/09.jpg
new file mode 100644
index 0000000..e65647d
Binary files /dev/null and b/images/gallery/thumbs/09.jpg differ
diff --git a/images/gallery/thumbs/10.jpg b/images/gallery/thumbs/10.jpg
new file mode 100644
index 0000000..f0b1abd
Binary files /dev/null and b/images/gallery/thumbs/10.jpg differ
diff --git a/images/gallery/thumbs/11.jpg b/images/gallery/thumbs/11.jpg
new file mode 100644
index 0000000..c67cef9
Binary files /dev/null and b/images/gallery/thumbs/11.jpg differ
diff --git a/images/gallery/thumbs/12.jpg b/images/gallery/thumbs/12.jpg
new file mode 100644
index 0000000..a63d9dc
Binary files /dev/null and b/images/gallery/thumbs/12.jpg differ
diff --git a/images/header.jpg b/images/header.jpg
deleted file mode 100644
index e84417a..0000000
Binary files a/images/header.jpg and /dev/null differ
diff --git a/images/pic01.jpg b/images/pic01.jpg
index afbdfe4..707f35d 100644
Binary files a/images/pic01.jpg and b/images/pic01.jpg differ
diff --git a/images/pic02.jpg b/images/pic02.jpg
index 6741495..c4bc313 100644
Binary files a/images/pic02.jpg and b/images/pic02.jpg differ
diff --git a/images/pic03.jpg b/images/pic03.jpg
index 5b4de55..30464bb 100644
Binary files a/images/pic03.jpg and b/images/pic03.jpg differ
diff --git a/images/pic04.jpg b/images/pic04.jpg
deleted file mode 100644
index 1f6eb1c..0000000
Binary files a/images/pic04.jpg and /dev/null differ
diff --git a/images/pic05.jpg b/images/pic05.jpg
deleted file mode 100644
index 077a610..0000000
Binary files a/images/pic05.jpg and /dev/null differ
diff --git a/images/pic06.jpg b/images/pic06.jpg
deleted file mode 100644
index a4c22e1..0000000
Binary files a/images/pic06.jpg and /dev/null differ
diff --git a/images/sax.jpg b/images/sax.jpg
new file mode 100644
index 0000000..2886054
Binary files /dev/null and b/images/sax.jpg differ
diff --git a/images/spotlight01.jpg b/images/spotlight01.jpg
new file mode 100644
index 0000000..cb80775
Binary files /dev/null and b/images/spotlight01.jpg differ
diff --git a/images/spotlight02.jpg b/images/spotlight02.jpg
new file mode 100644
index 0000000..d36bdc8
Binary files /dev/null and b/images/spotlight02.jpg differ
diff --git a/images/spotlight03.jpg b/images/spotlight03.jpg
new file mode 100644
index 0000000..73a5bf5
Binary files /dev/null and b/images/spotlight03.jpg differ
diff --git a/index-demo.html b/index-demo.html
new file mode 100644
index 0000000..fa59a9d
--- /dev/null
+++ b/index-demo.html
@@ -0,0 +1,2829 @@
+<!DOCTYPE HTML>
+<!--
+	Story by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+
+	Note: Only needed for demo purposes. Delete for production sites.
+-->
+<html>
+	<head>
+		<title>Story by HTML5 UP</title>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<link rel="stylesheet" href="assets/css/main.css" />
+	</head>
+	<body>
+
+		<!-- Wrapper -->
+			<div id="wrapper" class="divided">
+
+				<!-- Banner -->
+					<section class="banner style1 orient-left content-align-left image-position-right fullscreen onload-image-fade-in onload-content-fade-right">
+						<div class="content">
+							<h1>Story</h1>
+							<p class="major">A (modular, highly tweakable) responsive one-page template designed by <a href="https://html5up.net">HTML5 UP</a> and released for free under the <a href="https://html5up.net/license">Creative Commons</a>.</p>
+							<p>This is a <strong>Banner</strong> element, and it's generally used as an introduction or opening statement. You can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-banner">details</a>).</p>
+							<ul class="actions vertical">
+								<li><a href="#first" class="button big wide smooth-scroll-middle">Get Started</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/banner.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Spotlight -->
+					<section class="spotlight style1 orient-right content-align-left image-position-center onscroll-image-fade-in" id="first">
+						<div class="content">
+							<h2>Spotlight</h2>
+							<p>This is a <strong>Spotlight</strong> element, and it's generally used &ndash; as its name implies &ndash; to spotlight a particular feature, subject, or pretty much whatever. You can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-spotlight">details</a>).</p>
+							<ul class="actions vertical">
+								<li><a href="#" class="button">Learn More</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/spotlight01.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Spotlight -->
+					<section class="spotlight style1 orient-left content-align-left image-position-center onscroll-image-fade-in">
+						<div class="content">
+							<h2>Spotlight</h2>
+							<p>This is also a <strong>Spotlight</strong> element, and it's here because this demo would look a bit empty with just one spotlight. Like all spotlights, you can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-spotlight">details</a>).</p>
+							<ul class="actions vertical">
+								<li><a href="#" class="button">Learn More</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/spotlight02.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Spotlight -->
+					<section class="spotlight style1 orient-right content-align-left image-position-center onscroll-image-fade-in">
+						<div class="content">
+							<h2>Spotlight</h2>
+							<p>And yes, this is another <strong>Spotlight</strong> element, and it's also here because I need to fill a bit of space. Naturally, like any other spotlight, you can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-spotlight">details</a>).</p>
+							<ul class="actions vertical">
+								<li><a href="#" class="button">Learn More</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/spotlight03.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Gallery -->
+					<section class="wrapper style1 align-center">
+						<div class="inner">
+							<h2>Gallery</h2>
+							<p>This is a <strong>Gallery</strong> element. It can behave as a lightbox (when given the <code>lightbox</code> class), and you can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-gallery">details</a>).</p>
+						</div>
+
+						<!-- Gallery -->
+							<div class="gallery style2 medium lightbox onscroll-fade-in">
+								<article>
+									<a href="images/gallery/fulls/01.jpg" class="image">
+										<img src="images/gallery/thumbs/01.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/02.jpg" class="image">
+										<img src="images/gallery/thumbs/02.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/03.jpg" class="image">
+										<img src="images/gallery/thumbs/03.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/04.jpg" class="image">
+										<img src="images/gallery/thumbs/04.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/05.jpg" class="image">
+										<img src="images/gallery/thumbs/05.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/06.jpg" class="image">
+										<img src="images/gallery/thumbs/06.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/07.jpg" class="image">
+										<img src="images/gallery/thumbs/07.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/08.jpg" class="image">
+										<img src="images/gallery/thumbs/08.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/09.jpg" class="image">
+										<img src="images/gallery/thumbs/09.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/10.jpg" class="image">
+										<img src="images/gallery/thumbs/10.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/11.jpg" class="image">
+										<img src="images/gallery/thumbs/11.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/12.jpg" class="image">
+										<img src="images/gallery/thumbs/12.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Title</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+							</div>
+
+					</section>
+
+				<!-- Items -->
+					<section class="wrapper style1 align-center">
+						<div class="inner">
+							<h2>Items</h2>
+							<p>This is an <strong>Items</strong> element, and it's basically just a grid for organizing items of various types. You can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-items">details</a>).</p>
+							<div class="items style1 medium onscroll-fade-in">
+								<section>
+									<span class="icon style2 major fa-diamond"></span>
+									<h3>One</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-save"></span>
+									<h3>Two</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-bar-chart"></span>
+									<h3>Three</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-wifi"></span>
+									<h3>Four</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-cog"></span>
+									<h3>Five</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-paper-plane"></span>
+									<h3>Six</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-desktop"></span>
+									<h3>Seven</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-refresh"></span>
+									<h3>Eight</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-hashtag"></span>
+									<h3>Nine</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-bolt"></span>
+									<h3>Ten</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-envelope"></span>
+									<h3>Eleven</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-leaf"></span>
+									<h3>Twelve</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+							</div>
+						</div>
+					</section>
+
+				<!-- Additional Elements -->
+					<section class="wrapper style1 align-center">
+						<div class="inner">
+							<h2>Additional Elements</h2>
+							<p>Finally, here are some additional elements you <em>might</em> find useful (and yup, they look fine with any <span class="demo-controls">appearance</span>).</p>
+							<div class="index align-left">
+
+								<!-- Text -->
+									<section>
+										<header>
+											<h3>Text</h3>
+										</header>
+										<div class="content">
+
+											<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
+											This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
+											This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>.
+											Finally, this is a <a href="#">link</a>.</p>
+
+										</div>
+									</section>
+
+								<!-- Heading -->
+									<section>
+										<header>
+											<h3>Headings</h3>
+										</header>
+										<div class="content">
+
+											<h1>Heading Level 1</h1>
+											<h2>Heading Level 2</h2>
+											<h3>Heading Level 3</h3>
+											<h4>Heading Level 4</h4>
+											<h5>Heading Level 5</h5>
+											<h6>Heading Level 6</h6>
+
+											<hr />
+
+											<header>
+												<h1>Heading with a Subtitle</h1>
+												<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
+											</header>
+											<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
+
+											<hr />
+
+											<header>
+												<h2>Heading with a Subtitle</h2>
+												<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
+											</header>
+											<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
+
+											<hr />
+
+											<header>
+												<h3>Heading with a Subtitle</h3>
+												<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
+											</header>
+											<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
+
+										</div>
+									</section>
+
+								<!-- Unordered List -->
+									<section>
+										<header>
+											<h3>Unordered List</h3>
+										</header>
+										<div class="content">
+
+											<h4>Default</h4>
+											<ul>
+												<li>Lorem ipsum dolor sit amet</li>
+												<li>Interdum adipiscing gravida odio</li>
+												<li>Porttitor sem non integer</li>
+												<li>Non faucibus ornare mi ut ante</li>
+												<li>Sagittis adipiscing eleifend</li>
+												<li>Felis amet dolore viverra</li>
+											</ul>
+
+											<h4>Alternate</h4>
+											<ul class="alt">
+												<li>Lorem ipsum dolor sit amet</li>
+												<li>Interdum adipiscing gravida odio</li>
+												<li>Porttitor sem non integer</li>
+												<li>Non faucibus ornare mi ut ante</li>
+												<li>Sagittis adipiscing eleifend</li>
+												<li>Felis amet dolore viverra</li>
+											</ul>
+
+										</div>
+									</section>
+
+								<!-- Ordered List -->
+									<section>
+										<header>
+											<h3>Ordered List</h3>
+										</header>
+										<div class="content">
+
+											<ol>
+												<li>Lorem ipsum dolor sit amet</li>
+												<li>Interdum adipiscing gravida odio</li>
+												<li>Porttitor sem non integer</li>
+												<li>Non faucibus ornare mi ut ante</li>
+												<li>Sagittis adipiscing eleifend</li>
+												<li>Felis amet dolore viverra</li>
+											</ol>
+
+										</div>
+									</section>
+
+								<!-- Definition List -->
+									<section>
+										<header>
+											<h3>Definition List</h3>
+										</header>
+										<div class="content">
+
+											<dl>
+												<dt>Interdum adipiscing odio</dt>
+												<dd>
+													<p>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent fringilla quis tincidunt felis sagittis eget tempus euismod. Ante ipsum primis vestibulum.</p>
+												</dd>
+												<dt>Non faucibus ornare mi ut ante</dt>
+												<dd>
+													<p>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent fringilla quis tincidunt felis sagittis eget tempus euismod. Ante ipsum primis vestibulum.</p>
+												</dd>
+												<dt>Felis amet dolore viverra</dt>
+												<dd>
+													<p>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent fringilla quis tincidunt felis sagittis eget tempus euismod. Ante ipsum primis vestibulum.</p>
+												</dd>
+											</dl>
+
+										</div>
+									</section>
+
+								<!-- Blockquote -->
+									<section>
+										<header>
+											<h3>Blockquote</h3>
+										</header>
+										<div class="content">
+
+											<blockquote>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent fringilla quis tincidunt felis sagittis eget tempus euismod. Ante ipsum primis vestibulum.</blockquote>
+
+										</div>
+									</section>
+
+								<!-- Code -->
+									<section>
+										<header>
+											<h3>Code</h3>
+										</header>
+										<div class="content">
+
+											<pre><code>i = 0;
+
+while (!deck.isInOrder()) {
+    print 'Iteration ' + i;
+    deck.shuffle();
+    i++;
+}
+
+print 'It took ' + i + ' iterations to sort the deck.';
+</code></pre>
+
+										</div>
+									</section>
+
+								<!-- Icons -->
+									<section>
+										<header>
+											<h3>Icons</h3>
+										</header>
+										<div class="content">
+
+											<h4>Style #1</h4>
+											<ul class="icons">
+												<li><a href="#" class="icon style1 fa-twitter"><span class="label">Twitter</span></a></li>
+												<li><a href="#" class="icon style1 fa-facebook"><span class="label">Facebook</span></a></li>
+												<li><a href="#" class="icon style1 fa-instagram"><span class="label">Instagram</span></a></li>
+												<li><a href="#" class="icon style1 fa-github"><span class="label">Github</span></a></li>
+												<li><a href="#" class="icon style1 fa-dribbble"><span class="label">Dribbble</span></a></li>
+											</ul>
+
+											<h4>Style #2</h4>
+											<ul class="icons">
+												<li><a href="#" class="icon style2 fa-twitter"><span class="label">Twitter</span></a></li>
+												<li><a href="#" class="icon style2 fa-facebook"><span class="label">Facebook</span></a></li>
+												<li><a href="#" class="icon style2 fa-instagram"><span class="label">Instagram</span></a></li>
+												<li><a href="#" class="icon style2 fa-github"><span class="label">Github</span></a></li>
+												<li><a href="#" class="icon style2 fa-dribbble"><span class="label">Dribbble</span></a></li>
+											</ul>
+
+										</div>
+									</section>
+
+								<!-- Buttons -->
+									<section>
+										<header>
+											<h3>Buttons</h3>
+										</header>
+										<div class="content">
+
+											<ul class="actions">
+												<li><a href="#" class="button special">Special</a></li>
+												<li><a href="#" class="button">Default</a></li>
+											</ul>
+											<ul class="actions">
+												<li><a href="#" class="button special big">Big</a></li>
+												<li><a href="#" class="button">Default</a></li>
+												<li><a href="#" class="button small">Small</a></li>
+											</ul>
+											<ul class="actions fit">
+												<li><a href="#" class="button special fit">Fit</a></li>
+												<li><a href="#" class="button fit">Fit</a></li>
+												<li><a href="#" class="button special fit">Fit</a></li>
+												<li><a href="#" class="button fit">Fit</a></li>
+											</ul>
+											<ul class="actions fit small">
+												<li><a href="#" class="button special fit small">Fit + Small</a></li>
+												<li><a href="#" class="button fit small">Fit + Small</a></li>
+												<li><a href="#" class="button special fit small">Fit + Small</a></li>
+												<li><a href="#" class="button fit small">Fit + Small</a></li>
+											</ul>
+											<ul class="actions">
+												<li><a href="#" class="button special icon fa-search">Icon</a></li>
+												<li><a href="#" class="button icon fa-download">Icon</a></li>
+											</ul>
+											<ul class="actions">
+												<li><span class="button special disabled">Special</span></li>
+												<li><span class="button disabled">Default</span></li>
+											</ul>
+
+										</div>
+									</section>
+
+								<!-- Actions -->
+									<section>
+										<header>
+											<h3>Actions</h3>
+										</header>
+										<div class="content">
+
+											<h4>Default</h4>
+											<ul class="actions">
+												<li><a href="#" class="button special">Default</a></li>
+												<li><a href="#" class="button">Default</a></li>
+											</ul>
+
+											<h4>Small</h4>
+											<ul class="actions small">
+												<li><a href="#" class="button special small">Small</a></li>
+												<li><a href="#" class="button small">Small</a></li>
+											</ul>
+
+											<h4>Vertical</h4>
+											<ul class="actions vertical">
+												<li><a href="#" class="button special">Default</a></li>
+												<li><a href="#" class="button">Default</a></li>
+											</ul>
+
+											<h4>Vertical + Small</h4>
+											<ul class="actions vertical small">
+												<li><a href="#" class="button special small">Small</a></li>
+												<li><a href="#" class="button small">Small</a></li>
+											</ul>
+
+											<h4>Vertical + Fit</h4>
+											<ul class="actions vertical">
+												<li><a href="#" class="button special fit">Default</a></li>
+												<li><a href="#" class="button fit">Default</a></li>
+											</ul>
+
+											<h4>Vertical + Small + Fit</h4>
+											<ul class="actions vertical small">
+												<li><a href="#" class="button special small fit">Small</a></li>
+												<li><a href="#" class="button small fit">Small</a></li>
+											</ul>
+
+										</div>
+									</section>
+
+								<!-- Form -->
+									<section>
+										<header>
+											<h3>Form</h3>
+										</header>
+										<div class="content">
+
+											<form method="post" action="#">
+												<div class="field half first">
+													<label for="name">Name</label>
+													<input type="text" name="name" id="name" value="" />
+												</div>
+												<div class="field half">
+													<label for="email">Email</label>
+													<input type="email" name="email" id="email" value="" />
+												</div>
+												<div class="field">
+													<label for="department">Department</label>
+													<div class="select-wrapper">
+														<select name="department" id="department">
+															<option value="">- Category -</option>
+															<option value="1">Manufacturing</option>
+															<option value="2">Shipping</option>
+															<option value="3">Administration</option>
+															<option value="4">Human Resources</option>
+														</select>
+													</div>
+												</div>
+												<div class="field third first">
+													<input type="radio" id="priority-low" name="priority" checked />
+													<label for="priority-low">Low Priority</label>
+												</div>
+												<div class="field third">
+													<input type="radio" id="priority-normal" name="priority" />
+													<label for="priority-normal">Normal Priority</label>
+												</div>
+												<div class="field third">
+													<input type="radio" id="priority-high" name="priority" />
+													<label for="priority-high">High Priority</label>
+												</div>
+												<div class="field">
+													<label for="message">Message</label>
+													<textarea name="message" id="message" rows="6"></textarea>
+												</div>
+												<div class="field half first">
+													<input type="checkbox" id="copy" name="copy" />
+													<label for="copy">Email me a copy of this message</label>
+												</div>
+												<div class="field half">
+													<input type="checkbox" id="human" name="human" checked />
+													<label for="human">I am a human and not a robot</label>
+												</div>
+												<ul class="actions">
+													<li><input type="submit" name="submit" id="submit" value="Send Message" /></li>
+												</ul>
+											</form>
+
+										</div>
+									</section>
+
+								<!-- Table -->
+									<section>
+										<header>
+											<h3>Table</h3>
+										</header>
+										<div class="content">
+
+											<h4>Default</h4>
+											<div class="table-wrapper">
+												<table>
+													<thead>
+														<tr>
+															<th>Name</th>
+															<th>Description</th>
+															<th>Price</th>
+														</tr>
+													</thead>
+													<tbody>
+														<tr>
+															<td>Item 1</td>
+															<td>Ante turpis integer aliquet porttitor.</td>
+															<td>29.99</td>
+														</tr>
+														<tr>
+															<td>Item 2</td>
+															<td>Vis ac commodo adipiscing arcu aliquet.</td>
+															<td>19.99</td>
+														</tr>
+														<tr>
+															<td>Item 3</td>
+															<td> Morbi faucibus arcu accumsan lorem.</td>
+															<td>29.99</td>
+														</tr>
+														<tr>
+															<td>Item 4</td>
+															<td>Vitae integer tempus condimentum.</td>
+															<td>19.99</td>
+														</tr>
+														<tr>
+															<td>Item 5</td>
+															<td>Ante turpis integer aliquet porttitor.</td>
+															<td>29.99</td>
+														</tr>
+													</tbody>
+													<tfoot>
+														<tr>
+															<td colspan="2"></td>
+															<td>100.00</td>
+														</tr>
+													</tfoot>
+												</table>
+											</div>
+
+											<h4>Alternate</h4>
+											<div class="table-wrapper">
+												<table class="alt">
+													<thead>
+														<tr>
+															<th>Name</th>
+															<th>Description</th>
+															<th>Price</th>
+														</tr>
+													</thead>
+													<tbody>
+														<tr>
+															<td>Item 1</td>
+															<td>Ante turpis integer aliquet porttitor.</td>
+															<td>29.99</td>
+														</tr>
+														<tr>
+															<td>Item 2</td>
+															<td>Vis ac commodo adipiscing arcu aliquet.</td>
+															<td>19.99</td>
+														</tr>
+														<tr>
+															<td>Item 3</td>
+															<td> Morbi faucibus arcu accumsan lorem.</td>
+															<td>29.99</td>
+														</tr>
+														<tr>
+															<td>Item 4</td>
+															<td>Vitae integer tempus condimentum.</td>
+															<td>19.99</td>
+														</tr>
+														<tr>
+															<td>Item 5</td>
+															<td>Ante turpis integer aliquet porttitor.</td>
+															<td>29.99</td>
+														</tr>
+													</tbody>
+													<tfoot>
+														<tr>
+															<td colspan="2"></td>
+															<td>100.00</td>
+														</tr>
+													</tfoot>
+												</table>
+											</div>
+
+										</div>
+									</section>
+
+								<!-- Images -->
+									<section>
+										<header>
+											<h3>Images</h3>
+										</header>
+										<div class="content">
+
+											<h4>Fit</h4>
+											<span class="image fit"><img src="images/banner.jpg" alt="" /></span>
+
+											<h4>Left</h4>
+											<p><span class="image left"><img src="images/pic01.jpg" alt="" /></span>Lorem ipsum dolor sit accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis volutpat lorem ipsum dolor sit amet dolor consequat.</p>
+
+											<h4>Right</h4>
+											<p><span class="image right"><img src="images/pic02.jpg" alt="" /></span>Lorem ipsum dolor sit accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Vestibulum ante ipsum primis in faucibus magna blandit adipiscing eu felis iaculis volutpat lorem ipsum dolor sit amet dolor consequat.</p>
+
+										</div>
+									</section>
+
+								<!-- Box -->
+									<section>
+										<header>
+											<h3>Box</h3>
+										</header>
+										<div class="content">
+
+											<div class="box">
+												<p>Felis sagittis eget tempus primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Magna sed etiam ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus lorem ipsum dolor sit amet nullam.</p>
+											</div>
+
+										</div>
+									</section>
+
+							</div>
+
+
+						</div>
+					</section>
+
+				<!-- Modifiers -->
+					<section class="wrapper style1 align-center" id="reference">
+						<div class="inner">
+							<h2>Elements Reference</h2>
+							<p>Oh, and this: a handy reference to all the modifiers supported by various elements.</p>
+							<div class="index align-left">
+
+								<!-- Banner -->
+									<section id="reference-banner">
+										<header>
+											<h3>Banner</h3>
+										</header>
+										<div class="content">
+
+											<h4>HTML</h4>
+<pre><code>&lt;section class="banner style<em>(N)</em> <em>(optional modifiers)</em>"&gt;
+  &lt;div class="content"&gt;
+    <em>(content)</em>
+  &lt;/div&gt;
+  &lt;div class="image"&gt;
+    &lt;img src="<em>(image URL)</em>" alt="Alternate text" /&gt;
+  &lt;/div&gt;
+&lt;/section&gt;</code></pre>
+
+											<hr />
+
+											<!-- style1 -->
+												<section>
+													<h4><code>banner style1</code></h4>
+													<p>A 50/50 vertical split between content and an image. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Shows content on the left, image on the right.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Shows content on the right, image on the left.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style2 -->
+												<section>
+													<h4><code>banner style2</code></h4>
+													<p>Boxed-in content set against an image background, and attached to either side of the screen or centered. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Attaches the content box to the left edge of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-center</code></td>
+																	<td>Places the content box in the center of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Attaches the content box to the right edge of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style3 -->
+												<section>
+													<h4><code>banner style3</code></h4>
+													<p>An image within a circular frame placed to the side of content. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Places the content on the left, image on the right.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Places the content on the right, image on the left.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-up</code></td>
+																	<td>Fades image up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-down</code></td>
+																	<td>Fades image down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-left</code></td>
+																	<td>Fades image left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-right</code></td>
+																	<td>Fades image right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-up</code></td>
+																	<td>Fades image up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-down</code></td>
+																	<td>Fades image down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-left</code></td>
+																	<td>Fades image left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-right</code></td>
+																	<td>Fades image right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style4 -->
+												<section>
+													<h4><code>banner style4</code></h4>
+													<p>An image within a phone-shaped frame placed to the side of content. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>iphone</code></td>
+																	<td>Uses iPhone styling for image frame.</td>
+																</tr>
+																<tr>
+																	<td><code>android</code></td>
+																	<td>Uses Android styling for image frame.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Places the content on the left, image on the right.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Places the content on the right, image on the left.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-up</code></td>
+																	<td>Fades image up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-down</code></td>
+																	<td>Fades image down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-left</code></td>
+																	<td>Fades image left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-right</code></td>
+																	<td>Fades image right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-up</code></td>
+																	<td>Fades image up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-down</code></td>
+																	<td>Fades image down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-left</code></td>
+																	<td>Fades image left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-right</code></td>
+																	<td>Fades image right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style5 -->
+												<section>
+													<h4><code>banner style5</code></h4>
+													<p>Content set directly against an image background. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+										</div>
+									</section>
+
+								<!-- Spotlight -->
+									<section id="reference-spotlight">
+										<header>
+											<h3>Spotlight</h3>
+										</header>
+										<div class="content">
+
+											<h4>HTML</h4>
+<pre><code>&lt;section class="spotlight style<em>(N)</em> <em>(optional modifiers)</em>"&gt;
+  &lt;div class="content"&gt;
+    <em>(content)</em>
+  &lt;/div&gt;
+  &lt;div class="image"&gt;
+    &lt;img src="<em>(image URL)</em>" alt="Alternate text" /&gt;
+  &lt;/div&gt;
+&lt;/section&gt;</code></pre>
+
+											<hr />
+
+											<!-- style1 -->
+												<section>
+													<h4><code>spotlight style1</code></h4>
+													<p>A 30/70 (or 70/30, depending on orientation) vertical split between content and an image. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Shows content on the left, image on the right.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Shows content on the right, image on the left.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style2 -->
+												<section>
+													<h4><code>spotlight style2</code></h4>
+													<p>An image within a circular frame placed to the side of content. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Places the content on the left, image on the right.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Places the content on the right, image on the left.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-up</code></td>
+																	<td>Fades image up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-down</code></td>
+																	<td>Fades image down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-left</code></td>
+																	<td>Fades image left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-right</code></td>
+																	<td>Fades image right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-up</code></td>
+																	<td>Fades image up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-down</code></td>
+																	<td>Fades image down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-left</code></td>
+																	<td>Fades image left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-right</code></td>
+																	<td>Fades image right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style3 -->
+												<section>
+													<h4><code>spotlight style3</code></h4>
+													<p>An image within a phone-shaped frame placed to the side of content. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Places the content on the left, image on the right.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Places the content on the right, image on the left.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-up</code></td>
+																	<td>Fades image up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-down</code></td>
+																	<td>Fades image down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-left</code></td>
+																	<td>Fades image left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-right</code></td>
+																	<td>Fades image right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-up</code></td>
+																	<td>Fades image up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-down</code></td>
+																	<td>Fades image down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-left</code></td>
+																	<td>Fades image left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-right</code></td>
+																	<td>Fades image right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style4 -->
+												<section>
+													<h4><code>spotlight style4</code></h4>
+													<p>Boxed-in content set against an image background, and attached to either side of the screen or centered. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>halfscreen</code></td>
+																	<td>Fills half the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Attaches the content box to the left edge of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-center</code></td>
+																	<td>Places the content box in the center of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Attaches the content box to the right edge of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style5 -->
+												<section>
+													<h4><code>spotlight style5</code></h4>
+													<p>Boxed-in content set against an image background. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>fullscreen</code></td>
+																	<td>Fills the height of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>halfscreen</code></td>
+																	<td>Fills half the height of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>orient-left</code></td>
+																	<td>Places the content box on the left of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-center</code></td>
+																	<td>Places the content box in the center of the screen.</td>
+																</tr>
+																<tr>
+																	<td><code>orient-right</code></td>
+																	<td>Places the content box on the right side of the screen.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>content-align-left</code></td>
+																	<td>Left-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-center</code></td>
+																	<td>Center-aligns content.</td>
+																</tr>
+																<tr>
+																	<td><code>content-align-right</code></td>
+																	<td>Right-aligns content.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>image-position-left</code></td>
+																	<td>Left-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-center</code></td>
+																	<td>Center-positions image.</td>
+																</tr>
+																<tr>
+																	<td><code>image-position-right</code></td>
+																	<td>Right-positions image.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-up</code></td>
+																	<td>Fades content up on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-down</code></td>
+																	<td>Fades content down on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-left</code></td>
+																	<td>Fades content left on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-right</code></td>
+																	<td>Fades content right on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-content-fade-in</code></td>
+																	<td>Fades in content on page load.</td>
+																</tr>
+																<tr>
+																	<td><code>onload-image-fade-in</code></td>
+																	<td>Fades in image on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-up</code></td>
+																	<td>Fades content up on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-down</code></td>
+																	<td>Fades content down on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-left</code></td>
+																	<td>Fades content left on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-right</code></td>
+																	<td>Fades content right on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-content-fade-in</code></td>
+																	<td>Fades in content on page scroll.</td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-image-fade-in</code></td>
+																	<td>Fades in image on page scroll.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>invert</code></td>
+																	<td>Inverts the color scheme.</td>
+																</tr>
+																<tr>
+																	<td><code>color1</code></td>
+																	<td>Uses background color #1.</td>
+																</tr>
+																<tr>
+																	<td><code>color2</code></td>
+																	<td>Uses background color #2.</td>
+																</tr>
+																<tr>
+																	<td><code>color3</code></td>
+																	<td>Uses background color #3.</td>
+																</tr>
+																<tr>
+																	<td><code>color4</code></td>
+																	<td>Uses background color #4.</td>
+																</tr>
+																<tr>
+																	<td><code>color5</code></td>
+																	<td>Uses background color #5.</td>
+																</tr>
+																<tr>
+																	<td><code>color6</code></td>
+																	<td>Uses background color #6.</td>
+																</tr>
+																<tr>
+																	<td><code>color7</code></td>
+																	<td>Uses background color #7.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+										</div>
+									</section>
+
+								<!-- Gallery -->
+									<section id="reference-gallery">
+										<header>
+											<h3>Gallery</h3>
+										</header>
+										<div class="content">
+
+											<h4>HTML</h4>
+<pre><code>&lt;div class="gallery style<em>(N)</em> <em>(optional modifiers)</em>"&gt;
+  &lt;article&gt;
+    &lt;a href="<em>(full image URL)</em>" class="image"&gt;
+      &lt;img src="<em>(thumbnail image URL)</em>" alt="Alternate text" /&gt;
+    &lt;/a&gt;
+    &lt;div class="caption"&gt;
+      <em>(caption)</em>
+    &lt;/div&gt;
+  &lt;/article&gt;
+  &lt;article&gt;
+    &lt;a href="<em>(full image URL)</em>" class="image"&gt;
+      &lt;img src="<em>(thumbnail image URL)</em>" alt="Alternate text" /&gt;
+    &lt;/a&gt;
+    &lt;div class="caption"&gt;
+      <em>(caption)</em>
+    &lt;/div&gt;
+  &lt;/article&gt;
+  &lt;article&gt;
+    &lt;a href="<em>(full image URL)</em>" class="image"&gt;
+      &lt;img src="<em>(thumbnail image URL)</em>" alt="Alternate text" /&gt;
+    &lt;/a&gt;
+    &lt;div class="caption"&gt;
+      <em>(caption)</em>
+    &lt;/div&gt;
+  &lt;/article&gt;
+  <em>...</em>
+&lt;/div&gt;</code></pre>
+
+											<hr />
+
+											<!-- style1 -->
+												<section>
+													<h4><code>gallery style1</code></h4>
+													<p>A grid of thumbnails with optional lightbox support. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>small</code></td>
+																	<td>Uses small thumbnails.</td>
+																</tr>
+																<tr>
+																	<td><code>medium</code></td>
+																	<td>Uses medium thumbnails.</td>
+																</tr>
+																<tr>
+																	<td><code>big</code></td>
+																	<td>Uses big thumbnails.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>lightbox</code></td>
+																	<td>Enables lightbox behavior.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-fade-in</code></td>
+																	<td>Fades in thumbnails on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-fade-in</code></td>
+																	<td>Fades in thumbnails on page scroll.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style2 -->
+												<section>
+													<h4><code>gallery style2</code></h4>
+													<p>A carousel of thumbnails with optional lightbox support. Supports these modifiers:</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>small</code></td>
+																	<td>Uses small thumbnails.</td>
+																</tr>
+																<tr>
+																	<td><code>medium</code></td>
+																	<td>Uses medium thumbnails.</td>
+																</tr>
+																<tr>
+																	<td><code>big</code></td>
+																	<td>Uses big thumbnails.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>lightbox</code></td>
+																	<td>Enables lightbox behavior.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-fade-in</code></td>
+																	<td>Fades in thumbnails on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-fade-in</code></td>
+																	<td>Fades in thumbnails on page scroll.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+										</div>
+									</section>
+
+								<!-- Items -->
+									<section id="reference-items">
+										<header>
+											<h3>Items</h3>
+										</header>
+										<div class="content">
+
+											<h4>HTML</h4>
+<pre><code>&lt;div class="items style<em>(N)</em> <em>(size modifier)</em> <em>(optional modifiers)</em>"&gt;
+  &lt;section&gt;
+    <em>(content)</em>
+  &lt;/section&gt;
+  &lt;section&gt;
+    <em>(content)</em>
+  &lt;/section&gt;
+  &lt;section&gt;
+    <em>(content)</em>
+  &lt;/section&gt;
+  &lt;section&gt;
+    <em>(content)</em>
+  &lt;/section&gt;
+  <em>...</em>
+&lt;/div&gt;</code></pre>
+
+											<hr />
+
+											<!-- style1 -->
+												<section>
+													<h4><code>items style1</code></h4>
+													<p>A grid of items separated by borders.</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>small</code></td>
+																	<td>Uses small items.</td>
+																</tr>
+																<tr>
+																	<td><code>medium</code></td>
+																	<td>Uses medium items.</td>
+																</tr>
+																<tr>
+																	<td><code>big</code></td>
+																	<td>Uses big items.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-fade-in</code></td>
+																	<td>Fades in items on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-fade-in</code></td>
+																	<td>Fades in items on page scroll.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style2 -->
+												<section>
+													<h4><code>items style2</code></h4>
+													<p>An outlined grid of items separated by borders.</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>small</code></td>
+																	<td>Uses small items.</td>
+																</tr>
+																<tr>
+																	<td><code>medium</code></td>
+																	<td>Uses medium items.</td>
+																</tr>
+																<tr>
+																	<td><code>big</code></td>
+																	<td>Uses big items.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-fade-in</code></td>
+																	<td>Fades in items on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-fade-in</code></td>
+																	<td>Fades in items on page scroll.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+											<hr />
+
+											<!-- style3 -->
+												<section>
+													<h4><code>items style3</code></h4>
+													<p>A borderless grid of items.</p>
+
+													<div class="table-wrapper">
+														<table class="alt uniform fixed">
+															<tbody>
+																<tr>
+																	<td><code>small</code></td>
+																	<td>Uses small items.</td>
+																</tr>
+																<tr>
+																	<td><code>medium</code></td>
+																	<td>Uses medium items.</td>
+																</tr>
+																<tr>
+																	<td><code>big</code></td>
+																	<td>Uses big items.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onload-fade-in</code></td>
+																	<td>Fades in items on page load.</td>
+																</tr>
+																<tr class="alt">
+																	<td colspan="2"></td>
+																</tr>
+																<tr>
+																	<td><code>onscroll-fade-in</code></td>
+																	<td>Fades in items on page scroll.</td>
+																</tr>
+															</tbody>
+														</table>
+													</div>
+												</section>
+
+										</div>
+									</section>
+
+								<!-- Wrapper -->
+									<section id="reference-wrapper">
+										<header>
+											<h3>Wrapper</h3>
+										</header>
+										<div class="content">
+
+											<h4>HTML</h4>
+<pre><code>&lt;div class="wrapper <em>(optional modifiers)</em>"&gt;
+  <em>(content)</em>
+&lt;/div&gt;</code></pre>
+
+											<h4>Modifiers</h4>
+
+											<div class="table-wrapper">
+												<table class="alt uniform fixed">
+													<tbody>
+														<tr>
+															<td><code>invert</code></td>
+															<td>Inverts the color scheme.</td>
+														</tr>
+														<tr>
+															<td><code>color1</code></td>
+															<td>Uses background color #1.</td>
+														</tr>
+														<tr>
+															<td><code>color2</code></td>
+															<td>Uses background color #2.</td>
+														</tr>
+														<tr>
+															<td><code>color3</code></td>
+															<td>Uses background color #3.</td>
+														</tr>
+														<tr>
+															<td><code>color4</code></td>
+															<td>Uses background color #4.</td>
+														</tr>
+														<tr>
+															<td><code>color5</code></td>
+															<td>Uses background color #5.</td>
+														</tr>
+														<tr>
+															<td><code>color6</code></td>
+															<td>Uses background color #6.</td>
+														</tr>
+														<tr>
+															<td><code>color7</code></td>
+															<td>Uses background color #7.</td>
+														</tr>
+													</tbody>
+												</table>
+											</div>
+
+										</div>
+									</section>
+
+							</div>
+
+
+						</div>
+					</section>
+
+				<!-- Footer -->
+					<footer class="wrapper style1 align-center">
+						<div class="inner">
+							<ul class="icons">
+								<li><a href="#" class="icon style2 fa-twitter"><span class="label">Twitter</span></a></li>
+								<li><a href="#" class="icon style2 fa-facebook"><span class="label">Facebook</span></a></li>
+								<li><a href="#" class="icon style2 fa-instagram"><span class="label">Instagram</span></a></li>
+								<li><a href="#" class="icon style2 fa-linkedin"><span class="label">LinkedIn</span></a></li>
+								<li><a href="#" class="icon style2 fa-envelope"><span class="label">Email</span></a></li>
+							</ul>
+							<p>&copy; Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>.</p>
+						</div>
+					</footer>
+
+			</div>
+
+		<!-- Scripts -->
+			<script src="assets/js/jquery.min.js"></script>
+			<script src="assets/js/jquery.scrollex.min.js"></script>
+			<script src="assets/js/jquery.scrolly.min.js"></script>
+			<script src="assets/js/skel.min.js"></script>
+			<script src="assets/js/util.js"></script>
+			<script src="assets/js/main.js"></script>
+
+		<!-- Note: Only needed for demo purposes. Delete for production sites. -->
+			<script src="assets/js/demo.js"></script>
+
+	</body>
+</html>
diff --git a/index.html b/index.html
index 8503f7c..fd38ea6 100644
--- a/index.html
+++ b/index.html
@@ -1,471 +1,44 @@
 <!DOCTYPE HTML>
-<!--
-	Photon by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
--->
 <html>
 	<head>
-		<title>Photon by HTML5 UP</title>
+		<title>Story by HTML5 UP</title>
 		<meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
-		<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
 		<link rel="stylesheet" href="assets/css/main.css" />
-		<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
-		<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
 	</head>
 	<body>
 
-		<!-- Header -->
-			<section id="header">
-				<div class="inner">
-					<span class="icon major fa-cloud"></span>
-					<h1>Hi, I'm <strong>Photon</strong>, another fine<br />
-					little freebie from <a href="http://html5up.net">HTML5 UP</a>.</h1>
-					<p>Accumsan feugiat mi commodo erat lorem ipsum, sed magna<br />
-					lobortis feugiat sapien sed etiam volutpat accumsan.</p>
-					<ul class="actions">
-						<li><a href="#one" class="button scrolly">Discover</a></li>
-					</ul>
-				</div>
-			</section>
+			<div id="wrapper" class="divided">
 
-		<!-- One -->
-			<section id="one" class="main style1">
-				<div class="container">
-					<div class="row 150%">
-						<div class="6u 12u$(medium)">
-							<header class="major">
-								<h2>Lorem ipsum dolor adipiscing<br />
-								amet dolor consequat</h2>
-							</header>
-							<p>Adipiscing a commodo ante nunc accumsan et interdum mi ante adipiscing. A nunc lobortis non nisl amet vis sed volutpat aclacus nascetur ac non. Lorem curae et ante amet sapien sed tempus adipiscing id accumsan.</p>
-						</div>
-						<div class="6u$ 12u$(medium) important(medium)">
-							<span class="image fit"><img src="images/pic01.jpg" alt="" /></span>
-						</div>
-					</div>
-				</div>
-			</section>
-
-		<!-- Two -->
-			<section id="two" class="main style2">
-				<div class="container">
-					<div class="row 150%">
-						<div class="6u 12u$(medium)">
-							<ul class="major-icons">
-								<li><span class="icon style1 major fa-code"></span></li>
-								<li><span class="icon style2 major fa-bolt"></span></li>
-								<li><span class="icon style3 major fa-camera-retro"></span></li>
-								<li><span class="icon style4 major fa-cog"></span></li>
-								<li><span class="icon style5 major fa-desktop"></span></li>
-								<li><span class="icon style6 major fa-calendar"></span></li>
-							</ul>
-						</div>
-						<div class="6u$ 12u$(medium)">
-							<header class="major">
-								<h2>Lorem ipsum dolor adipiscing<br />
-								amet dolor consequat</h2>
-							</header>
-							<p>Adipiscing a commodo ante nunc accumsan interdum mi ante adipiscing. A nunc lobortis non nisl amet vis volutpat aclacus nascetur ac non. Lorem curae eu ante amet sapien in tempus ac. Adipiscing id accumsan adipiscing ipsum.</p>
-							<p>Blandit faucibus proin. Ac aliquam integer adipiscing enim non praesent vis commodo nunc phasellus cubilia ac risus accumsan. Accumsan blandit. Lobortis phasellus non lobortis dit varius mi varius accumsan lobortis. Blandit ante aliquam lacinia lorem lobortis semper morbi col faucibus vitae integer placerat accumsan orci eu mi odio tempus adipiscing adipiscing adipiscing curae consequat feugiat etiam dolore.</p>
-							<p>Adipiscing a commodo ante nunc accumsan interdum mi ante adipiscing. A nunc lobortis non nisl amet vis volutpat aclacus nascetur ac non. Lorem curae eu ante amet sapien in tempus ac. Adipiscing id accumsan adipiscing ipsum.</p>
-						</div>
-					</div>
-				</div>
-			</section>
-
-		<!-- Three -->
-			<section id="three" class="main style1 special">
-				<div class="container">
-					<header class="major">
-						<h2>Adipiscing amet consequat</h2>
-					</header>
-					<p>Ante nunc accumsan et aclacus nascetur ac ante amet sapien sed.</p>
-					<div class="row 150%">
-						<div class="4u 12u$(medium)">
-							<span class="image fit"><img src="images/pic02.jpg" alt="" /></span>
-							<h3>Magna feugiat lorem</h3>
-							<p>Adipiscing a commodo ante nunc magna lorem et interdum mi ante nunc lobortis non amet vis sed volutpat et nascetur.</p>
-							<ul class="actions">
-								<li><a href="#" class="button">More</a></li>
-							</ul>
-						</div>
-						<div class="4u 12u$(medium)">
-							<span class="image fit"><img src="images/pic03.jpg" alt="" /></span>
-							<h3>Magna feugiat lorem</h3>
-							<p>Adipiscing a commodo ante nunc magna lorem et interdum mi ante nunc lobortis non amet vis sed volutpat et nascetur.</p>
-							<ul class="actions">
-								<li><a href="#" class="button">More</a></li>
+					<section class="banner style1 orient-left content-align-left image-position-right fullscreen onload-image-fade-in onload-content-fade-right">
+						<div class="content">
+							<h1>Musical Agency Name</h1>
+							<p class="major">A full service agency for representing the finest musicians in the New York area.</p>
+							<ul id="email" class="actions vertical">
+								<li><a href="#first" class="button big wide smooth-scroll-middle">Contact Us</a></li>
 							</ul>
 						</div>
-						<div class="4u$ 12u$(medium)">
-							<span class="image fit"><img src="images/pic04.jpg" alt="" /></span>
-							<h3>Magna feugiat lorem</h3>
-							<p>Adipiscing a commodo ante nunc magna lorem et interdum mi ante nunc lobortis non amet vis sed volutpat et nascetur.</p>
-							<ul class="actions">
-								<li><a href="#" class="button">More</a></li>
-							</ul>
-						</div>
-					</div>
-				</div>
-			</section>
-
-		<!-- Four -->
-			<section id="four" class="main style2 special">
-				<div class="container">
-					<header class="major">
-						<h2>Ipsum feugiat consequat?</h2>
-					</header>
-					<p>Sed lacus nascetur ac ante amet sapien.</p>
-					<ul class="actions uniform">
-						<li><a href="#" class="button special">Sign Up</a></li>
-						<li><a href="#" class="button">Learn More</a></li>
-					</ul>
-				</div>
-			</section>
-
-		<!-- Five -->
-		<!--
-			<section id="five" class="main style1">
-				<div class="container">
-					<header class="major special">
-						<h2>Elements</h2>
-					</header>
-
-					<section>
-						<h4>Text</h4>
-						<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
-						This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
-						This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>. Finally, <a href="#">this is a link</a>.</p>
-						<hr />
-						<header>
-							<h4>Heading with a Subtitle</h4>
-							<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
-						</header>
-						<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
-						<header>
-							<h5>Heading with a Subtitle</h5>
-							<p>Lorem ipsum dolor sit amet nullam id egestas urna aliquam</p>
-						</header>
-						<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
-						<hr />
-						<h2>Heading Level 2</h2>
-						<h3>Heading Level 3</h3>
-						<h4>Heading Level 4</h4>
-						<h5>Heading Level 5</h5>
-						<h6>Heading Level 6</h6>
-						<hr />
-						<h5>Blockquote</h5>
-						<blockquote>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus lorem ipsum dolor sit amet nullam adipiscing eu felis.</blockquote>
-						<h5>Preformatted</h5>
-						<pre><code>i = 0;
-
-while (!deck.isInOrder()) {
-print 'Iteration ' + i;
-deck.shuffle();
-i++;
-}
-
-print 'It took ' + i + ' iterations to sort the deck.';</code></pre>
-					</section>
-
-					<section>
-						<h4>Lists</h4>
-						<div class="row">
-							<div class="6u 12u$(medium)">
-								<h5>Unordered</h5>
-								<ul>
-									<li>Dolor pulvinar etiam.</li>
-									<li>Sagittis adipiscing.</li>
-									<li>Felis enim feugiat.</li>
-								</ul>
-								<h5>Alternate</h5>
-								<ul class="alt">
-									<li>Dolor pulvinar etiam.</li>
-									<li>Sagittis adipiscing.</li>
-									<li>Felis enim feugiat.</li>
-								</ul>
-							</div>
-							<div class="6u$ 12u$(medium)">
-								<h5>Ordered</h5>
-								<ol>
-									<li>Dolor pulvinar etiam.</li>
-									<li>Etiam vel felis viverra.</li>
-									<li>Felis enim feugiat.</li>
-									<li>Dolor pulvinar etiam.</li>
-									<li>Etiam vel felis lorem.</li>
-									<li>Felis enim et feugiat.</li>
-								</ol>
-								<h5>Icons</h5>
-								<ul class="icons">
-									<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
-									<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
-									<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
-									<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
-								</ul>
-							</div>
-						</div>
-						<h5>Actions</h5>
-						<div class="row">
-							<div class="6u 12u$(medium)">
-								<ul class="actions">
-									<li><a href="#" class="button special">Default</a></li>
-									<li><a href="#" class="button">Default</a></li>
-								</ul>
-								<ul class="actions small">
-									<li><a href="#" class="button special small">Small</a></li>
-									<li><a href="#" class="button small">Small</a></li>
-								</ul>
-								<ul class="actions vertical">
-									<li><a href="#" class="button special">Default</a></li>
-									<li><a href="#" class="button">Default</a></li>
-								</ul>
-								<ul class="actions vertical small">
-									<li><a href="#" class="button special small">Small</a></li>
-									<li><a href="#" class="button small">Small</a></li>
-								</ul>
-							</div>
-							<div class="6u 12u$(medium)">
-								<ul class="actions vertical">
-									<li><a href="#" class="button special fit">Default</a></li>
-									<li><a href="#" class="button fit">Default</a></li>
-								</ul>
-								<ul class="actions vertical small">
-									<li><a href="#" class="button special small fit">Small</a></li>
-									<li><a href="#" class="button small fit">Small</a></li>
-								</ul>
-							</div>
-						</div>
-					</section>
-
-					<section>
-						<h4>Table</h4>
-						<h5>Default</h5>
-						<div class="table-wrapper">
-							<table>
-								<thead>
-									<tr>
-										<th>Name</th>
-										<th>Description</th>
-										<th>Price</th>
-									</tr>
-								</thead>
-								<tbody>
-									<tr>
-										<td>Item One</td>
-										<td>Ante turpis integer aliquet porttitor.</td>
-										<td>29.99</td>
-									</tr>
-									<tr>
-										<td>Item Two</td>
-										<td>Vis ac commodo adipiscing arcu aliquet.</td>
-										<td>19.99</td>
-									</tr>
-									<tr>
-										<td>Item Three</td>
-										<td> Morbi faucibus arcu accumsan lorem.</td>
-										<td>29.99</td>
-									</tr>
-									<tr>
-										<td>Item Four</td>
-										<td>Vitae integer tempus condimentum.</td>
-										<td>19.99</td>
-									</tr>
-									<tr>
-										<td>Item Five</td>
-										<td>Ante turpis integer aliquet porttitor.</td>
-										<td>29.99</td>
-									</tr>
-								</tbody>
-								<tfoot>
-									<tr>
-										<td colspan="2"></td>
-										<td>100.00</td>
-									</tr>
-								</tfoot>
-							</table>
+						<div class="image">
+							<img src="images/sax.jpg" alt="" />
 						</div>
-
-						<h5>Alternate</h5>
-						<div class="table-wrapper">
-							<table class="alt">
-								<thead>
-									<tr>
-										<th>Name</th>
-										<th>Description</th>
-										<th>Price</th>
-									</tr>
-								</thead>
-								<tbody>
-									<tr>
-										<td>Item One</td>
-										<td>Ante turpis integer aliquet porttitor.</td>
-										<td>29.99</td>
-									</tr>
-									<tr>
-										<td>Item Two</td>
-										<td>Vis ac commodo adipiscing arcu aliquet.</td>
-										<td>19.99</td>
-									</tr>
-									<tr>
-										<td>Item Three</td>
-										<td> Morbi faucibus arcu accumsan lorem.</td>
-										<td>29.99</td>
-									</tr>
-									<tr>
-										<td>Item Four</td>
-										<td>Vitae integer tempus condimentum.</td>
-										<td>19.99</td>
-									</tr>
-									<tr>
-										<td>Item Five</td>
-										<td>Ante turpis integer aliquet porttitor.</td>
-										<td>29.99</td>
-									</tr>
-								</tbody>
-								<tfoot>
-									<tr>
-										<td colspan="2"></td>
-										<td>100.00</td>
-									</tr>
-								</tfoot>
-							</table>
-						</div>
-					</section>
-
-					<section>
-						<h4>Buttons</h4>
-						<ul class="actions">
-							<li><a href="#" class="button special">Special</a></li>
-							<li><a href="#" class="button">Default</a></li>
-						</ul>
-						<ul class="actions">
-							<li><a href="#" class="button big">Big</a></li>
-							<li><a href="#" class="button">Default</a></li>
-							<li><a href="#" class="button small">Small</a></li>
-						</ul>
-						<ul class="actions fit">
-							<li><a href="#" class="button fit">Fit</a></li>
-							<li><a href="#" class="button special fit">Fit</a></li>
-							<li><a href="#" class="button fit">Fit</a></li>
-						</ul>
-						<ul class="actions fit small">
-							<li><a href="#" class="button special fit small">Fit + Small</a></li>
-							<li><a href="#" class="button fit small">Fit + Small</a></li>
-							<li><a href="#" class="button special fit small">Fit + Small</a></li>
-						</ul>
-						<ul class="actions">
-							<li><a href="#" class="button special icon fa-download">Icon</a></li>
-							<li><a href="#" class="button icon fa-download">Icon</a></li>
-						</ul>
-						<ul class="actions">
-							<li><span class="button special disabled">Disabled</span></li>
-							<li><span class="button disabled">Disabled</span></li>
-						</ul>
 					</section>
 
-					<section>
-						<h4>Form</h4>
-						<form method="post" action="#">
-							<div class="row uniform 50%">
-								<div class="6u 12u$(xsmall)">
-									<input type="text" name="demo-name" id="demo-name" value="" placeholder="Name" />
-								</div>
-								<div class="6u$ 12u$(xsmall)">
-									<input type="email" name="demo-email" id="demo-email" value="" placeholder="Email" />
-								</div>
-								<div class="12u$">
-									<div class="select-wrapper">
-										<select name="demo-category" id="demo-category">
-											<option value="">- Category -</option>
-											<option value="1">Manufacturing</option>
-											<option value="1">Shipping</option>
-											<option value="1">Administration</option>
-											<option value="1">Human Resources</option>
-										</select>
-									</div>
-								</div>
-								<div class="4u 12u$(small)">
-									<input type="radio" id="demo-priority-low" name="demo-priority" checked>
-									<label for="demo-priority-low">Low</label>
-								</div>
-								<div class="4u 12u$(small)">
-									<input type="radio" id="demo-priority-normal" name="demo-priority">
-									<label for="demo-priority-normal">Normal</label>
-								</div>
-								<div class="4u$ 12u$(small)">
-									<input type="radio" id="demo-priority-high" name="demo-priority">
-									<label for="demo-priority-high">High</label>
-								</div>
-								<div class="6u 12u$(small)">
-									<input type="checkbox" id="demo-copy" name="demo-copy">
-									<label for="demo-copy">Email me a copy</label>
-								</div>
-								<div class="6u$ 12u$(small)">
-									<input type="checkbox" id="demo-human" name="demo-human" checked>
-									<label for="demo-human">Not a robot</label>
-								</div>
-								<div class="12u$">
-									<textarea name="demo-message" id="demo-message" placeholder="Enter your message" rows="6"></textarea>
-								</div>
-								<div class="12u$">
-									<ul class="actions">
-										<li><input type="submit" value="Send Message" class="special" /></li>
-										<li><input type="reset" value="Reset" /></li>
-									</ul>
-								</div>
-							</div>
-						</form>
-					</section>
-
-					<section>
-						<h4>Image</h4>
-						<h5>Fit</h5>
-						<div class="box alt">
-							<div class="row uniform 50%">
-								<div class="12u"><span class="image fit"><img src="images/pic06.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic02.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic03.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic03.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic02.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic04.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic02.jpg" alt="" /></span></div>
-								<div class="4u"><span class="image fit"><img src="images/pic03.jpg" alt="" /></span></div>
-							</div>
-						</div>
-						<h5>Left &amp; Right</h5>
-						<p><span class="image left"><img src="images/pic05.jpg" alt="" /></span>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.</p>
-						<p><span class="image right"><img src="images/pic05.jpg" alt="" /></span>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent tincidunt felis sagittis eget. tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent.</p>
-					</section>
-
-				</div>
-			</section>
-		-->
-
-		<!-- Footer -->
-			<section id="footer">
-				<ul class="icons">
-					<li><a href="#" class="icon alt fa-twitter"><span class="label">Twitter</span></a></li>
-					<li><a href="#" class="icon alt fa-facebook"><span class="label">Facebook</span></a></li>
-					<li><a href="#" class="icon alt fa-instagram"><span class="label">Instagram</span></a></li>
-					<li><a href="#" class="icon alt fa-github"><span class="label">GitHub</span></a></li>
-					<li><a href="#" class="icon alt fa-envelope"><span class="label">Email</span></a></li>
-				</ul>
-				<ul class="copyright">
-					<li>&copy; Untitled</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
-				</ul>
-			</section>
-
-		<!-- Scripts -->
+			</div>
 			<script src="assets/js/jquery.min.js"></script>
+			<script src="assets/js/jquery.scrollex.min.js"></script>
 			<script src="assets/js/jquery.scrolly.min.js"></script>
 			<script src="assets/js/skel.min.js"></script>
 			<script src="assets/js/util.js"></script>
-			<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
 			<script src="assets/js/main.js"></script>
-
+			<script type="text/javascript">
+				var a = 'mailto';
+				var b = ':'
+				var c = 'info';
+				var d = '@';
+				var e = 'nyjazzcollective';
+				var f = '.'
+				var g = 'com';
+				$('#email a').attr('href', a+b+c+d+e+f+g);
+			</script>
 	</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/indexold.html b/indexold.html
new file mode 100644
index 0000000..ca94cfd
--- /dev/null
+++ b/indexold.html
@@ -0,0 +1,352 @@
+<!DOCTYPE HTML>
+<!--
+	Story by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+-->
+<html>
+	<head>
+		<title>Story by HTML5 UP</title>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<link rel="stylesheet" href="assets/css/main.css" />
+	</head>
+	<body>
+
+		<!-- Wrapper -->
+			<div id="wrapper" class="divided">
+
+				<!-- One -->
+					<section class="banner style1 orient-left content-align-left image-position-right fullscreen onload-image-fade-in onload-content-fade-right">
+						<div class="content">
+							<h1>Story</h1>
+							<p class="major">A (modular, highly tweakable) responsive one-page template designed by <a href="https://html5up.net">HTML5 UP</a> and released for free under the <a href="https://html5up.net/license">Creative Commons</a>.</p>
+							<ul class="actions vertical">
+								<li><a href="#first" class="button big wide smooth-scroll-middle">Get Started</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/banner.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Two -->
+					<section class="spotlight style1 orient-right content-align-left image-position-center onscroll-image-fade-in" id="first">
+						<div class="content">
+							<h2>Magna etiam feugiat</h2>
+							<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id ante sed ex pharetra lacinia sit amet vel massa. Donec facilisis laoreet nulla eu bibendum. Donec ut ex risus. Fusce lorem lectus, pharetra pretium massa et, hendrerit vestibulum odio lorem ipsum dolor sit amet.</p>
+							<ul class="actions vertical">
+								<li><a href="#" class="button">Learn More</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/spotlight01.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Three -->
+					<section class="spotlight style1 orient-left content-align-left image-position-center onscroll-image-fade-in">
+						<div class="content">
+							<h2>Tempus adipiscing</h2>
+							<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id ante sed ex pharetra lacinia sit amet vel massa. Donec facilisis laoreet nulla eu bibendum. Donec ut ex risus. Fusce lorem lectus, pharetra pretium massa et, hendrerit vestibulum odio lorem ipsum dolor sit amet.</p>
+							<ul class="actions vertical">
+								<li><a href="#" class="button">Learn More</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/spotlight02.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Four -->
+					<section class="spotlight style1 orient-right content-align-left image-position-center onscroll-image-fade-in">
+						<div class="content">
+							<h2>Pharetra etiam nulla</h2>
+							<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id ante sed ex pharetra lacinia sit amet vel massa. Donec facilisis laoreet nulla eu bibendum. Donec ut ex risus. Fusce lorem lectus, pharetra pretium massa et, hendrerit vestibulum odio lorem ipsum dolor sit amet.</p>
+							<ul class="actions vertical">
+								<li><a href="#" class="button">Learn More</a></li>
+							</ul>
+						</div>
+						<div class="image">
+							<img src="images/spotlight03.jpg" alt="" />
+						</div>
+					</section>
+
+				<!-- Five -->
+					<section class="wrapper style1 align-center">
+						<div class="inner">
+							<h2>Massa sed condimentum</h2>
+							<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id ante sed ex pharetra lacinia sit amet vel massa. Donec facilisis laoreet nulla eu bibendum. Donec ut ex risus. Fusce lorem lectus, pharetra pretium massa et, hendrerit vestibulum odio lorem ipsum.</p>
+						</div>
+
+						<!-- Gallery -->
+							<div class="gallery style2 medium lightbox onscroll-fade-in">
+								<article>
+									<a href="images/gallery/fulls/01.jpg" class="image">
+										<img src="images/gallery/thumbs/01.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Ipsum Dolor</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/02.jpg" class="image">
+										<img src="images/gallery/thumbs/02.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Feugiat Lorem</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/03.jpg" class="image">
+										<img src="images/gallery/thumbs/03.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Magna Amet</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/04.jpg" class="image">
+										<img src="images/gallery/thumbs/04.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Sed Tempus</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/05.jpg" class="image">
+										<img src="images/gallery/thumbs/05.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Ultrices Magna</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/06.jpg" class="image">
+										<img src="images/gallery/thumbs/06.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Sed Tempus</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/07.jpg" class="image">
+										<img src="images/gallery/thumbs/07.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Ipsum Lorem</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/08.jpg" class="image">
+										<img src="images/gallery/thumbs/08.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Magna Risus</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/09.jpg" class="image">
+										<img src="images/gallery/thumbs/09.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Tempus Dolor</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/10.jpg" class="image">
+										<img src="images/gallery/thumbs/10.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Sed Etiam</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/11.jpg" class="image">
+										<img src="images/gallery/thumbs/11.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Magna Lorem</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+								<article>
+									<a href="images/gallery/fulls/12.jpg" class="image">
+										<img src="images/gallery/thumbs/12.jpg" alt="" />
+									</a>
+									<div class="caption">
+										<h3>Ipsum Dolor</h3>
+										<p>Lorem ipsum dolor amet, consectetur magna etiam elit. Etiam sed ultrices.</p>
+										<ul class="actions">
+											<li><span class="button small">Details</span></li>
+										</ul>
+									</div>
+								</article>
+							</div>
+
+					</section>
+
+				<!-- Six -->
+					<section class="wrapper style1 align-center">
+						<div class="inner">
+							<h2>Ipsum sed consequat</h2>
+							<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id ante sed ex pharetra lacinia sit amet vel massa. Donec facilisis laoreet nulla eu bibendum. Donec ut ex risus. Fusce lorem lectus, pharetra pretium massa et, hendrerit vestibulum odio lorem ipsum.</p>
+							<div class="items style1 medium onscroll-fade-in">
+								<section>
+									<span class="icon style2 major fa-diamond"></span>
+									<h3>Lorem</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-save"></span>
+									<h3>Ipsum</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-bar-chart"></span>
+									<h3>Dolor</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-wifi"></span>
+									<h3>Amet</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-cog"></span>
+									<h3>Magna</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-paper-plane"></span>
+									<h3>Tempus</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-desktop"></span>
+									<h3>Aliquam</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-refresh"></span>
+									<h3>Elit</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-hashtag"></span>
+									<h3>Morbi</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-bolt"></span>
+									<h3>Turpis</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-envelope"></span>
+									<h3>Ultrices</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+								<section>
+									<span class="icon style2 major fa-leaf"></span>
+									<h3>Risus</h3>
+									<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
+								</section>
+							</div>
+						</div>
+					</section>
+
+				<!-- Seven -->
+					<section class="wrapper style1 align-center">
+						<div class="inner medium">
+							<h2>Get in touch</h2>
+							<form method="post" action="#">
+								<div class="field half first">
+									<label for="name">Name</label>
+									<input type="text" name="name" id="name" value="" />
+								</div>
+								<div class="field half">
+									<label for="email">Email</label>
+									<input type="email" name="email" id="email" value="" />
+								</div>
+								<div class="field">
+									<label for="message">Message</label>
+									<textarea name="message" id="message" rows="6"></textarea>
+								</div>
+								<ul class="actions">
+									<li><input type="submit" name="submit" id="submit" value="Send Message" /></li>
+								</ul>
+							</form>
+
+						</div>
+					</section>
+
+				<!-- Footer -->
+					<footer class="wrapper style1 align-center">
+						<div class="inner">
+							<ul class="icons">
+								<li><a href="#" class="icon style2 fa-twitter"><span class="label">Twitter</span></a></li>
+								<li><a href="#" class="icon style2 fa-facebook"><span class="label">Facebook</span></a></li>
+								<li><a href="#" class="icon style2 fa-instagram"><span class="label">Instagram</span></a></li>
+								<li><a href="#" class="icon style2 fa-linkedin"><span class="label">LinkedIn</span></a></li>
+								<li><a href="#" class="icon style2 fa-envelope"><span class="label">Email</span></a></li>
+							</ul>
+							<p>&copy; Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>.</p>
+						</div>
+					</footer>
+
+			</div>
+
+		<!-- Scripts -->
+			<script src="assets/js/jquery.min.js"></script>
+			<script src="assets/js/jquery.scrollex.min.js"></script>
+			<script src="assets/js/jquery.scrolly.min.js"></script>
+			<script src="assets/js/skel.min.js"></script>
+			<script src="assets/js/util.js"></script>
+			<script src="assets/js/main.js"></script>
+
+	</body>
+</html>
\ No newline at end of file