/* Global Styles */
	*
	{
		position: relative;
	}

	html,
	body
	{
		font: 400 16px/normal "Segoe UI", "Arial", "Helvetica", sans-serif;

		margin: 0;
		padding: 0;

		height: 100%;
		width: 100%;
	}

	html.no-scroll,
	html.no-scroll body
	{
		position: relative;
		overflow: hidden !important;
	}
	
	a
	{
		
	}

	a img
	{
		outline: 0;

		border: 0;
	}

/* Interface Elements */
	/* Links */
		a
		{
			-webkit-transition: color .25s;
			transition: color .25s;
		}
	
		.external-link
		{
			border-bottom: blue solid 0.1em;

			display: inline-block;
		}

		.external-link:visited
		{
			border-bottom-color: purple;
		}

		.external-link:active
		{
			border-bottom-color: red;
		}

	/* Buttons */
		[role="button"]
		{
			-webkit-appearance: none;
			-moz-appearance: none;
			-ms-appearance: none;
			appearance: none;
			background: #eee;
			border-radius: 0;
			box-shadow: none;
			cursor: pointer;
			outline: 0;

			color: #000;
			font: normal 400 0.8em/1.2em sans-serif;
			text-decoration: none;
			vertical-align: middle;

			border: #999 solid 1px;
			display: inline-block;
			margin: 0;
			padding: 3px 8px;
		}

	/* Blocks */
		header,
		section,
		main,
		nav,
		footer,
		.envelope
		{
			box-sizing: border-box;

			clear: both;
			display: block;

			width: 100%;
		}

		header:before,
		header:after,
		section:before,
		section:after,
		main:before,
		main:after,
		nav:before,
		nav:after,
		footer:before,
		footer:after,
		.envelope:before,
		.envelope:after
		{
			clear: both;
			display: block;

			content: "";
		}
		
		main [role='region'][data-ajax]
		{
			opacity: 1;
			-webkit-transition: all .5s;
			-khtml-transition: all .5s;
			-moz-transition: all .5s;
			-ms-transition: all .5s;
			-o-transition: all .5s;
			transition: all .5s;
		}
		
		main .loading[role='region'][data-ajax]
		{
			opacity: .25;
		}

	/* Fieldsets */
		fieldset
		{
			border: none;
			clear: both;
			display: block;
			margin: 0;
			padding: 0;

			width: 100%;
		}

		fieldset.controls
		{
			text-align: right;
		}

		fieldset.controls [role="button"]
		{
			display: inline-block;
		}
		
	/* Forms */
		form input,
		form textarea,
		form select
		{
			background: #fff;
			box-shadow: none;

			border: #aaa solid 1px;

			outline: none;
		}

		form input[type='checkbox'],
		form input[type='radio']
		{
			cursor: pointer;
		}

		form .invalid
		{
			border-color: #c00;
		}

		form label.invalid
		{
			color: #c00;
		}

	/* Dialog Windows */
		@-webkit-keyframes airlock-fadein
		{
			from
			{
				opacity: 0;
			}
			
			to
			{
				opacity: 1;
			}
		}

		@keyframes airlock-fadein
		{
			from
			{
				opacity: 0;
			}
			
			to
			{
				opacity: 1;
			}
		}

		#airlock
		{
			-webkit-animation: airlock-fadein .33s ease 0s 1 normal forwards;
			animation: airlock-fadein .33s ease 0s 1 normal forwards;
			background: rgba(0,0,0,.75);

			display: block;
			position: fixed;
			 top: 0;
			 left: 0;
			 z-index: 10;
			
			height: 100vh;
			width: 100vw;
		}

		dialog
		{
			-webkit-animation: airlock-fadein .33s ease 0s 1 normal forwards;
			animation: airlock-fadein .33s ease 0s 1 normal forwards;
			background: #fff;
			-webkit-transform: translate(-50%,-50%);
			-ms-transform: translate(-50%,-50%);
			transform: translate(-50%,-50%);

			display: none;
			padding: 1em;
			position: fixed;
			 top: 50%;
			 left: 50%;
			 z-index: -1;

			height: auto;
			min-width: 320px;
			width: 50%;
		}

		dialog[open]
		{
			display: block;
			z-index: 11;
		}

		dialog button
		{
			cursor: pointer;
		}

		dialog > .ui[data-close]
		{
			cursor: pointer;
			font-size: 1.25em;
			text-decoration: none;

			display: block;
			float: right;
			position: absolute;
			 top: 10px;
			 right: 10px;
		}

		dialog > .ui[data-close]:after
		{
			display: block;

			content: "\274c";
		}
	
	/* Notifications */
		output.notification
		{
			background: rgba(0,0,0,.9);
			-webkit-transition: transform .33s;
			-moz-transition: transform .33s;
			-ms-transition: transform .33s;
			-o-transition: transform .33s;
			transition: transform .33s;
			-webkit-transform: translateY(100%);
			-moz-transform: translateY(100%);
			-ms-transform: translateY(100%);
			-o-transform: translateY(100%);
			transform: translateY(100%);

			color: #fff;
			font-size: 1em;
			line-height: normal;
			text-shadow: rgba(0,0,0,.5) 0 1px 0;

			border-top: #999 solid 4px;
			box-sizing: border-box;
			clear: both;
			display: block;
			padding: 20px 52px 16px 16px;
			position: fixed;
			 bottom: 0;
			 left: 0;

			width: 100vw;
		}
	
		output.notification.in
		{
			-webkit-transform: translateY(0);
			-moz-transform: translateY(0);
			-ms-transform: translateY(0);
			-o-transform: translateY(0);
			transform: translateY(0);
		}

		output.notification.info
		{
			border-color: #0bf;
		}

		output.notification.success
		{
			border-color: #0f5;
		}

		output.notification.warning
		{
			border-color: #f90;
		}

		output.notification.error
		{
			border-color: #e00;
		}
	
		output.notification p
		{
			white-space: pre-line;
		}

		output.notification > .ui[data-close]
		{
			cursor: pointer;
			
			color: #fff;
			font-size: 1em;
			text-align: center;
			text-decoration: none;

			box-sizing: border-box;
			display: block;
			float: right;
			position: absolute;
			 top: 16px;
			 right: 16px;
			
			height: 100%;
		}

		output.notification > .ui[data-close]:after
		{
			display: block;

			content: "\274c";
		}