html {box-sizing:border-box; font-size:0.625rem; line-height:1.4; height:100%; width:100%;}

*, *:before, *:after {box-sizing:inherit;}

/* Base | Clearing */
article:after,
aside:after,
div:after,
fieldset:after,
footer:after, 
form:after,
header:after,
nav:after,
section:after,
ul:after,
dl:after {
	clear: both;
	content: "";
	display: block;
	height: 0;
	visibility: hidden;
}

html,
button,
input,
select,
textarea {color:rgb(34,34,34);}

/* selection */
::-moz-selection {color:rgb(255,255,255); background:rgb(175,200,54); text-shadow:none;}
::selection {color:rgb(255,255,255); background:rgb(175,200,54); text-shadow:none;}

a {color:rgb(74,199,237);}

hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}

audio,
canvas,
img,
video {vertical-align:middle;}

textarea {resize:vertical;}

.browsehappy {margin:0.2em 0; background:rgb(204,204,204); color:rgb(0,0,0); padding:0.2em 0;}

body {font-family:"ProximaNova-Reg",Helvetica,Arial,sans-serif; font-size:1.4rem; line-height:1.8rem;}

header {margin:0;}

footer {margin:0;}

article {margin:0 0 2em 0; padding:0.5em 0 0 0;}

section {margin:0 0 2.5em 0;}

/* headings */
h1, h2, h3, h4, h5, h6 {font-family:"ProximaNova-Light",Helvetica,Arial,sans-serif; font-weight:400; color:rgb(74,​92,​105); margin:0 0 0.75em 0;}
h1 {font-size:230.8%; margin:0 0 0.6em 0;}
h2 {font-size:138.5%; line-height:1.4em;}
h3 {font-size:115%; line-height:1.4em;}
h4 {font-size:100%; line-height:1.4em; margin:0;}
h5 {font-size:100%; line-height:1.5em; margin:0;}
h6 {font-size:100%; line-height:1.5em; margin:0;}

/* text */
p {line-height:1.5em; margin:0 0 1em 0;}

/* lists */
ul,
ol {line-height:1.5em; margin:0.5em 0 1em 0; padding:0;}
	ul li,
	ol li {margin:0 0 0.5em 1.5em;}
	
/* definition lists */
dl {line-height:1.5em; margin:0.5em 0 1em 0; padding:0;}
	dl dt {float:left; width:200px; border-bottom:1px solid rgb(247,247,249); color:rgb(165,165,165);}
	dl dd {margin-left:200px; border-bottom:1px solid rgb(247,247,249);}
	dl dd:after {display:block; visibility:hidden;clear:both; width:100%; height:1px; content:"."; line-height:1px;}

/* blockquote */
blockquote {line-height:1.5em; margin:0.5em 0 1.5em 0; padding:0;}

/* figure */
figure {margin:0 0 0.75em 0;}
	figure .img {}
figcaption {font-style:italic; color:rgb(68,68,68);}

.app {position: relative;}

.wrapper {width:92%; margin:0 4% 0 4%;}

/* ===================
    ALL:U4 Theme
   =================== */

/* @font-face */

/* @font-face | UNIT4 Sans light */
@font-face {
	font-family:'ProximaNova-Light';
	src:url('fonts/ProximaNova/ProximaNova-Light-webfont.eot');
	src:url('fonts/ProximaNova/ProximaNova-Light-webfont?iefix') format('eot'),
	    url('fonts/ProximaNova/ProximaNova-Light-webfont.woff') format('woff'),
	    url('fonts/ProximaNova/ProximaNova-Light-webfont.ttf') format('truetype'),
	    url('fonts/ProximaNova/ProximaNova-Light-webfont.svg#webfont') format('svg');
	font-weight:400;
	font-style:normal;
}

/* @font-face | UNIT4 Sans regular */
@font-face {
	font-family:'ProximaNova-Reg';
	src:url('fonts/ProximaNova/ProximaNova-Reg-webfont.eot');
	src:url('fonts/ProximaNova/ProximaNova-Reg-webfont?iefix') format('eot'),
	    url('fonts/ProximaNova/ProximaNova-Reg-webfont.woff') format('woff'),
	    url('fonts/ProximaNova/ProximaNova-Reg-webfont.ttf') format('truetype'),
	    url('fonts/ProximaNova/ProximaNova-Reg-webfont.svg#webfont') format('svg');
	font-weight:400;
	font-style:normal;
}

/* @font-face | UNIT4 Sans semibold */
@font-face {
	font-family:'ProximaNova-SBoldt';
	src:url('fonts/ProximaNova/ProximaNova-SBold-webfont.eot');
	src:url('fonts/ProximaNova/ProximaNova-SBold-webfont?iefix') format('eot'),
	    url('fonts/ProximaNova/ProximaNova-SBold-webfont.woff') format('woff'),
	    url('fonts/ProximaNova/ProximaNova-SBold-webfont.ttf') format('truetype'),
	    url('fonts/ProximaNova/ProximaNova-SBold-webfont.svg#webfont') format('svg');
	font-weight:400;
	font-style:normal;
}

/* @font-face | UNIT4 Sans bold */
@font-face {
	font-family:"ProximaNova-Bold";
	src:url('fonts/ProximaNova/ProximaNova-Bold-webfont.eot');
	src:url('fonts/ProximaNova/ProximaNova-Bold-webfont?iefix') format('eot'),
	    url('fonts/ProximaNova/ProximaNova-Bold-webfont.woff') format('woff'),
	    url('fonts/ProximaNova/ProximaNova-Bold-webfont.ttf') format('truetype'),
	    url('fonts/ProximaNova/ProximaNova-Bold-webfont.svg#webfont') format('svg');
	font-weight:400;
	font-style:normal;
}

b,
strong {font-family:'ProximaNova-Bold'; font-weight:400;}

.header-container {background-color:rgb(255,255,255);}
	.header-container .logo {float:left; margin:9px 1em 0.75em 0;}
		.header-container .logo #svg-logo {height:22px; width:82px;}
			.header-container .logo #svg-logo g {fill:rgb(255,255,255);}
	.header-container .title {margin:10px 0 10px 0; font-size:120%;}
	.header-container .divider {height:3px; width:100%; clear:both;}

.main aside {background:#13336A;}

.u4-gradient {
	background: #4ac7ed;
	background: -moz-linear-gradient(left,  #4ac7ed 0%, #4ac7ed 4%, #f68d2e 4%, #f68d2e 13%, #bec2c7 13%, #bec2c7 37%, #afc836 37%, #afc836 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#4ac7ed), color-stop(4%,#f68d2e), color-stop(13%,#bec2c7), color-stop(37%,#afc836), color-stop(100%,#afc836));
	background: -webkit-linear-gradient(left,  #4ac7ed 0%, #4ac7ed 4%, #f68d2e 4%, #f68d2e 13%, #bec2c7 13%, #bec2c7 37%, #afc836 37%, #afc836 100%);
	background: -o-linear-gradient(left,  #4ac7ed 0%, #4ac7ed 4%, #f68d2e 4%, #f68d2e 13%, #bec2c7 13%, #bec2c7 37%, #afc836 37%, #afc836 100%);
	background: -ms-linear-gradient(left,  #4ac7ed 0%, #4ac7ed 4%, #f68d2e 4%, #f68d2e 13%, #bec2c7 13%, #bec2c7 37%, #afc836 37%, #afc836 100%);
	background: linear-gradient(to right,  #4ac7ed 0%, #4ac7ed 4%, #f68d2e 4%, #f68d2e 13%, #bec2c7 13%, #bec2c7 37%, #afc836 37%, #afc836 100%);
}

.title {color:rgb(124,135,142);}


.footer-container {background-color:rgb(255,255,255);}
	.footer-container .divider {height:3px; width:100%; clear:both;}

/* states */
.state-selected {color:rgb(255,255,255); background:rgb(110,167,62); text-shadow:none;}

/* code */
.code {margin:1em 0; border-left:3px solid rgb(74,199,237);}
	.code h4 {padding:0.5em 0 0.5em 16px; border-left:none; border-top:1px solid rgb(241,241,241); border-right:1px solid rgb(241,241,241);}

#last_update {color:rgb(119,119,119);}

/* article | figure */
article figure.img {width:100%; max-width:100%; height:auto;}
	article figure.img .inner {position:relative; display:inline-block; width:100%; max-width:100%; padding:0;}
	article figure.img .inner img {width:100%; max-width:1200px;}

/* forms */
form, .form {position:relative;}

fieldset {border:none; border-bottom:1px solid rgb(222,222,222); padding:0 0 1em 0; margin:0 0 1em 0;}
	fieldset:first-child {}
	fieldset > fieldset {margin:20px 0; padding:20px; border:1px solid rgb(200,201,203); border-radius:1px;}

legend {font-size:123.1%; font-weight:700; margin:0 0 0.75em 0;}
.form .legend {display:block; font-size:123.1%; font-weight:700; margin:0 0 0.75em 0;}

/* form | labels */
form label,
.form label {display:inline-block; float:left; clear:left; width:44%; margin:3px 1% 3px 0; padding:6px 0 6px 0;}
.form .label-group {display:inline-block; float:left; clear:left; width:50%; margin:3px 1% 3px 0; padding:6px 0 6px 0; line-height:20px;}

/* forms | input */
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"] {
	position:relative;
	display:inline-block;
	padding:7px;
	color:rgb(0,0,0);
	border:1px solid rgb(169,177,181);
	background:rgb(255,255,255);
	box-shadow:none; 
	border-radius:2px;
	box-sizing:padding-box;
	filter:none;}

[type="search"] {
	-webkit-appearance:textfield;
	   -moz-appearance:textfield;
	        appearance:textfield;
	box-sizing:border-box;}

/* forms | input[readonly] */
input[readonly] {border-radius:3px;}
	input[readonly]:hover {cursor:default;}
	input[readonly]:focus {color:rgb(50,50,51); background-color:rgb(255,255,255); box-shadow:none;}

/* forms | textarea */
textarea {
	display:block;
	min-height:200px;
	max-height:500px;
	margin:0;
	padding:10px;
	resize:vertical;
	color:rgb(0,0,0);
	border:1px solid rgb(169,177,181);
	background:rgb(255,255,255);
	box-shadow:none; 
	font-size:13px; font-size:1.3rem;
	border-radius:2px;
	filter:none;}

/* forms | select */
select {position:relative; padding:6px 4px; border:1px solid rgb(169,177,181); background-color:rgb(255,255,255); border-radius:2px;}
	select option {padding:0 7px 0 7px; margin:7px 0;}

/* forms | placeholder */
[placeholder]::-webkit-input-placeholder {color:rgb(169,177,181);}
[placeholder]:-moz-placeholder {opacity:1; color:rgb(169,177,181);}
[placeholder]::-moz-placeholder {opacity:1; color:rgb(169,177,181);}
[placeholder]:-ms-input-placeholder {color:rgb(169,177,181);}
[placeholder]::placeholder {color:rgb(169,177,181);}

[placeholder]:focus::-webkit-input-placeholder {color:rgba(169,177,181,0.4);}
[placeholder]:focus:-moz-placeholder {opacity:1; color:rgba(169,177,181,0.4);}
[placeholder]:focus::-moz-placeholder {opacity:1; color:rgba(169,177,181,0.4);}
[placeholder]:focus:-ms-input-placeholder {color:rgba(169,177,181,0.4);}
[placeholder]:focus::placeholder {color:rgba(169,177,181,0.4);}

/* forms | .form */

.form input[type="date"],
.form input[type="datetime"],
.form input[type="datetime-local"],
.form input[type="email"],
.form input[type="month"],
.form input[type="number"],
.form input[type="password"],
.form input[type="search"],
.form input[type="tel"],
.form input[type="text"],
.form input[type="time"],
.form input[type="url"],
.form input[type="week"] {float:right; width:49%; margin:3px 0; background-color:rgb(255,255,255); border:1px solid rgb(169,177,181); border-radius:2px;}

.form input[type="date"] {float:left; width:7em; margin:3px 0; padding-right:22px; background:url("../Images/icons/icon_input-date_grey.png") no-repeat right center;}
	.form input[type="date"]:focus {background-image:url("../Images/icons/icon_input-date_darkgrey.png");}

form input[type="date"]:focus, .form input[type="date"]:focus,
form input[type="email"]:focus, .form input[type="email"]:focus,
form input[type="number"]:focus, .form input[type="number"]:focus,
form input[type="password"]:focus, .form input[type="password"]:focus,
form input[type="tel"]:focus, .form input[type="tel"]:focus,
form input[type="text"]:focus, .form input[type="text"]:focus {outline:none; border:1px solid #5ac6ef; background-color:#ffffe8; box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.15), 0 0 4px 0 #5ac6ef;}

/* textarea */
.form textarea {float:right; width:49%; margin:3px 0; background-color:rgb(255,255,255); border:1px solid #cccccc; border-radius:2px;}
form textarea:focus, .form textarea:focus {outline:none; border:1px solid #5ac6ef; background-color:#ffffe8; box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.15), 0 0 4px 0 #5ac6ef;}

/* select */
.form select {float:right; width:49%; margin:3px 0; border-radius:2px;}
form select:focus,
.form select:focus {outline:none; border:1px solid #5ac6ef; background-color:#ffffe8; box-shadow:inset 0 0 1px rgba(0, 0, 0, 0.15), 0 0 4px 0 #5ac6ef;}

/* forms | checkbox */
input[type="checkbox"] {float:left; margin:8px 5px 0 0; padding:0; border:none;}
.form .checkboxes {display:inline-block; float:left; clear:left; width:100%; margin:0; padding:0; line-height:34px;}
	.form .checkboxes label {display:inline-block; float:left; clear:right; width:49%; margin:0; padding:0; line-height:30px;}
.form .checkbox-status {display:block; float:left; line-height:30px;}

/* checkbox - TEMP_CHECKBOXES */
.form .checkboxes label {display:inline-block; float:left; clear:right; width:auto; margin:0 2% 0 0; padding:0; line-height:30px;}

/* forms | radio */
input[type="radio"] {float:left; margin:8px 5px 0 0;}
.form .radio {display:inline-block; width:100%;}

/* forms | submit */
input[type="submit"] {display:inline-block; height:30px; width:auto; margin:0; padding:0 15px; background-color:rgb(242,139,26); border:none; border-radius:2px; color:#ffffff; font-size:14px; cursor:pointer;}
	input[type="submit"]:hover,
	input[type="submit"]:focus {outline:none; color:rgb(255,255,255); border:1px solid #ffa13a; background-color:#ffa13a; transition:all .1s linear; cursor:pointer;}
	input[type="submit"]:active {cursor:pointer; color:rgb(255,255,255); border-color:rgb(242,139,26); background-color:#ffa13a; transition:all .1s linear;}
	.form input[type="submit"] {clear:both; float:right; display:inline-block;}

/* forms | button */
input[type="button"] {padding:7px; border:1px solid #b7b7b7; background:#e2e2e2; border-radius:3px;}
	input[type="button"]:hover,
	input[type="button"]:focus {outline:none; cursor:pointer; color:rgb(255,255,255); border-color:#ffa13a; background-color:#ffa13a; transition:all .1s linear;}
	input[type="button"]:active {cursor:pointer; color:rgb(255,255,255); border-color:rgb(242,139,26); background-color:#ffa13a; transition:all .1s linear;}
button {padding:4px 14px 4px 14px; border:1px solid #b7b7b7; background-color:#e2e2e2; border-radius:3px;}
	button:hover,
	button:focus {cursor:pointer; color:rgb(255,255,255); border-color:#ffa13a; background-color:#ffa13a; transition:all .1s linear;}
	button:active {cursor:pointer; color:rgb(255,255,255); border-color:rgb(242,139,26); background-color:#ffa13a; transition:all .1s linear;}

/* :disabled */
input:disabled {cursor:default;}
input[type="password"]:disabled,
input[type="text"]:disabled {color:#6f6f6f; border-color:#c9c9c9; background-color:#f1f1f1;}

label + .filter {float:left;}

label + input[type="radio"] {float:left; margin:10px 0 0 0;}

fieldset .button {float:left; clear:left; margin:3px 0 3px 51%;}
	fieldset .button input[type="submit"] {}

.form.left {}
	.form.left label {clear:left; margin:0 0 -5px 0; line-height:30px;}
	.form.left label + input {clear:left;}
	.form.left .button {clear:left; margin:3px 0 3px 0;}
	.form.left .message-inline.validation {float:left; clear:left;}

/* forms | validation */
.form .asterisk {float:left; display:block; margin:3px 0 0 5px; font-size:120%;}
.form label > .asterisk {float:none; display:inline-block; margin:3px 0 0 5px; font-size:120%; border:none;}

.form .inline.error {clear:both; display:inline-block; margin:4px 0 4px 51%;}
.form input.state-error {border-color:rgb(192,47,47);}
	.form input.state-error:focus {background-color:rgb(255,255,204);}
.form .required-label {display:inline-block; padding:0 0 0 5px;}
	.form .required-label.state-error {color:rgb(192,47,47);}

.form .inline.success {clear:both; display:inline-block; margin:4px 0 4px 51%;}

/* buttons */
.btn {}

	.btn.btn-primary {color:rgb(255,255,255); border:1px solid rgb(57,157,194); background-color:rgb(57,157,194);}
	.btn.btn-primary:hover,
	.btn.btn-primary:focus,
	.btn.btn-primary:active {color:rgb(255,255,255); border:1px solid rgb(1,128,175); background-color:rgb(1,128,175);}

	.btn[disabled] {opacity:0.3;}

	.btn.btn-size-sm {height:20px; font-size:1.2rem;}
	.btn.btn-size-md {height:25px; font-size:1.3rem;}
	.btn.btn-size-lg {height:30px; font-size:1.4rem;}
	.btn.btn-size-xl {height:45px; font-size:1.6rem;}

/* message | general */
.message {display:block; color:rgb(50,50,51); line-height:1.5em;}

/* message | types */
.message.error,
.message.alert {color:rgb(132,47,47);}
.message.warning {color:rgb(211,135,29);}
.message.success,
.message.confirmation {color:rgb(66,132,47);}
.message.info {color:rgb(52,141,245);}

/* message | box */
	.message.box {display:block; margin:10px 0 0 0; padding:15px; font-size:13px; font-size:1.3rem; line-height:1.2em; background:rgba(247,247,249,.25);}
		.message.box.error,
		.message.box.alert {background:rgba(201,48,48,.25);}
		.message.box.success,
		.message.box.confirmation {background:rgb(219,239,185);}
		.message.box.info {background:rgba(127,182,244,.25);}
		.message.box.warning {background:rgba(211,135,29,.25);}

/* message | inline */
	.message.inline {margin:.75em 0 0 0; line-height:1.2rem;}
		.message.inline.info {font-style:italic;}
		.message.inline.error,
		.message.inline.alert {color:rgb(238,64,64);}
		.message.inline.warning {}
		/* Dirty hack for <RequiredFieldValidator Display="Dynamic" />  */
		.message.inline[style*="inline"] {display:block !Important;}

/* message | popup */
	.message.popup {}
		.message.popup .buttons {overflow:auto; }
			.message.popup .buttons .ok {float:right; width:100px; text-align:center;}
			.message.popup .buttons .cancel {float:left; width:100px; text-align:center;}

/* message | sticky */
	.message.sticky {position:fixed; z-index:9999; left:0; right:0; bottom:0; display:block; width:100%; height:auto; margin:10px auto 0 auto; padding:25px; font-size:13px; font-size:1.3rem; line-height:1.2em;
	-webkit-box-shadow: 0 -20px 40px 0 rgba(255,255,255,1);
	-moz-box-shadow: 0 -20px 40px 0 rgba(255,255,255,1);
	box-shadow: 0 -20px 40px 0 rgba(255,255,255,1);}
			.message.sticky > .inner {box-sizing:border-box; width:100%; margin:0 auto 0 auto;}
		.message.sticky.info {background-color:rgba(189,209,231,.80);}

/* reference */
.reference {margin:0 0 0 0.2em;}

/* ==============
    MOBILE:Menu
   ============== */

.nav-main ul {margin:0; padding:0; list-style:none;}

.nav-main li {margin:0 0 0.5em 0;}

.nav-main a {
	display:block;
	margin:0 0 10px 0;
	padding:7px 0;

	text-align:center;
	text-decoration:none;
	font-weight:400;

	color:rgb(124,135,142);
}

.nav-main .state-active a {
	background:rgb(175,200,54);
	color:rgb(255,255,255);
}

.nav-main a:hover,
.nav-main a:focus {color:#222222; text-decoration:none; background-color:rgba(0,0,0,0.15);}

.nav-tableofcontents {margin:0 0 2em 0;}
	.nav-tableofcontents ul {margin:0; padding:0;}
	.nav-tableofcontents li {margin:0 0 0.25em 1em;}

/* ==============
    MOBILE:Main
   ============== */

.main {padding:30px 0 30px 0;}

.main article h1 {font-size:2em; line-height:2.8rem;}

.main aside {color:rgb(255,255,255); padding:0 5% 10px 0;}

.footer-container footer {color:rgb(124,135,142); padding:0.5em 0 0.5em 0;}

/* ===============
    ALL:IE Fixes
   =============== */

.ie7 .title {padding-top:20px;}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* page specific */
.page-login {width:100%; height:100%; background:rgb(255,255,255) url("../img/page-login_bg.jpg") center center no-repeat;}

.comp-login {position:fixed; top:50%; left:50%; width:320px;
	-ms-trans-transform:translate(-50%, -50%);
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);}
	.comp-login >.inner {padding:4px 0 0 0;}
	
	.comp-login header {background-color:rgb(255,255,255);}
		.comp-login header .logo {display:inline-block; margin:40px 0 10px 40px;}
		.comp-login header .divider {height:3px; width:100%; clear:both;}
			.comp-login header .logo img {}
	
	.comp-login .body {background-color:rgb(255,255,255); padding:25px 40px 25px 40px;}
	
	.comp-login .form-login {}
		.comp-login .form-login label[for="Username"] {display:none;}
		.comp-login .form-login input[type="text"] {float:none; width:100%; margin:0.5em 0 0.5em 0;}
		.comp-login .form-login label[for="UserPass"] {display:none;}
		.comp-login .form-login input[type="password"] {float:none; width:100%; margin:0.5em 0 0.5em 0;}
		.comp-login .form-login label[for="Persist"] {display:inline-block; width:100%; margin:0.5em  0 0.5em 0; padding:0;}
		.comp-login .form-login input[type="checkbox"] {position:relative; bottom:1px; float:none; vertical-align:middle; margin:0 7px 0 0;}
		.comp-login .form-login .inline.error {margin:0 0 4px 9px;}
		.comp-login .form-login input[type="submit"] {float:none; width:100%; margin:0.5em 0 0 0;}
		

/* ==========================================================================
   Media Queries
   ========================================================================== */

/* @mediaquery - INTERMEDIATE */
@media only screen and (min-width:480px) {

	.nav-main a {
		float:left;
		margin:0 1.7%;
		padding:7px 1em;
		margin-bottom:0;
	}
	.nav-main li:first-child a {margin:0 1.7% 0 0 ;}
	.nav-main li:last-child a {margin:0 0 0 1.7%;}

	.nav-main ul li {display:block;}

	.oldie .nav-main a {margin:0 0.7%;}
}

/* @mediaquery - WIDE */
@media only screen and (min-width:768px) {

	.header-container,
	.main aside {
		-webkit-box-shadow:0 5px 10px #aaa;
		   -moz-box-shadow:0 5px 10px #aaa;
		        box-shadow:0 5px 10px #aaa;
	}

	.title {float:left;}

	.nav-main {float:right; width:50%;}

	.main .nav-tableofcontents {position:fixed; right:0; width:25%;}
	
	.main article {float:left; width:72%;}

	.main aside {float:right; width:25%;}
}

/* @mediaquery - MAX */
@media only screen and (min-width:1140px) {

	.wrapper {
		width:100%; /* 1140px - 10% for margins */
		margin:0 auto;
	}

	.main.wrapper {
		width:1026px; /* 1140px - 10% for margins */
	}
	
	.header-container .logo {margin:9px 1em 0 4%;}
	
	.header-container {
		position:fixed;
		z-index:10;
		top:0;
		right:0;
		left:0;
	}
	
	.main-container {
		position: relative;
		top:50px;
	}

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {background-color:transparent; border:0; overflow:hidden; *text-indent:-9999px;}
.ir:before {content:""; display:block; width:0; height:150%;}

.hidden {display:none !important; visibility:hidden;}

.visuallyhidden {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
	.visuallyhidden.focusable:active,
	.visuallyhidden.focusable:focus {clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto;}

.invisible {visibility:hidden;}

.clearfix:before,
.clearfix:after {content:" ";display:table;}
.clearfix:after {clear:both;}
.clearfix {*zoom:1;}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {

    @page {margin:1cm;}

    header h1:after {
    content: url(https://chart.googleapis.com/chart?cht=qr&amp;chs=150x150&amp;chl=http://www.knowgifts.com&amp;choe=UTF-8);
    }

	* {background:transparent !important; color:#000000 !important; box-shadow:none !important; text-shadow:none !important;}

    body {width:100%; margin:0; padding:0;}

	a,
	a:visited {text-decoration:underline; color:inherit;}

	a[href]:after {content:" (" attr(href) ")";}

	abbr[title]:after {content:" (" attr(title) ")";}

	/* Don't show links */
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after,
	.logo a:after {content:"";}

	pre,
	blockquote {border:1px solid #999999; page-break-inside:avoid;}

	thead {display:table-header-group;}

	tr,
	img {page-break-inside:avoid;}

	img {max-width:100% !important;}

	@page {margin:1.5cm 0 1cm 0;}

	p,
    h1,
	h2,
	h3 {orphans:3; widows:3;}

    h1,
	h2,
	h3 {break-after:avoid; page-break-after:avoid; page-break-inside:avoid;}
	
	table th {text-align:left;}
	
	/* removed! */
	article > footer {display:none;}
	/* removed! | header */
	.nav-main {display:none;}
    .header-container .divider {display:none;}
	/* removed! | functional */

    /* reset positions */
    .header-container {position:relative;}
    .main-container {top:0;}

    /* display settings */
    .header-container {display:block;}
    .main-container {display:block;}
	
	/* reset widths! */

    /* reset floats! */
	.main article {float:none;}
    .main aside {float:none;}

	/* reset margins! */
    .header-container .logo {margin:0 1em 0 0;}
    .header-container .title {margin:0;}
	article {margin:0;}

    /* adjust margins */
    .header-container {margin:0 0 2em 0;}
	
	/* reset paddings! */
    .main {padding:0;}
	article {padding:0;}

	/* adjust paddings */
	
	/* position relative - Chrome fix */
	article {position:relative;}
	section {position:relative;}
    header {position:relative;}
    .code {position:relative;}
    h1,
	h2,
	h3 {position:relative;}
	
	/* page-breaks */
	article {display:block; page-break-before:always; page-break-after:always; break-before:always; break-after:always; }
	section {}
		section li {page-break-inside:avoid;}
    header {page-break-inside:avoid;}
	.code {page-break-inside:avoid;}
	
	/* images */
	.header-container .logo #svg-logo {width:100px; height:22px; margin:0.5em 1em 0 0;}
	.header-container .logo #svg-logo g {fill:rgb(0,0,0);}
	
}