/* This document is used to style the main unique elements that appear on every page */

body {
	background-color: #fff;
	font: 15px 'Roboto', sans-serif;
}

html, body {
	height: 100%; /* Fix to keep footer pushed to page bottom */
    min-width: 705px;
	min-height:100%;
	position:relative;
	margin:0;
	padding:0;
	height:100%;
}


/* header */
header {
	width: 100%;
	height: 100px;
	min-width: 705px;
	background: linear-gradient(140deg, rgba(44,182,232,1) 0%, rgba(43,211,230,1) 30%, rgba(0,107,128,1) 100%);
	
	
	/* Keep header fixed */
	overflow: hidden;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	
	-webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -ms-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
	
	/* fix for flicker on size change */
	-webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
    backface-visibility: hidden;
}

#logo {
	margin: 25px;
	height: 50px;
	
	-webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}

header nav {
	bottom: 3%;
	right: 0;
	position: absolute;
}

/* Keep menu items together */
header nav ul li {
	float: left;
	display: inline-block;
}

#navbackground {
	position: absolute;
	right: -100px;
	bottom: 0;
	width: 604px;
	height: 30px;
	-webkit-transform: skew(-20deg);
	   -moz-transform: skew(-20deg);
		 -o-transform: skew(-20deg);
		-ms-transform: skew(-20deg);
	background: #fff;
	border-top: 1px solid #aaa;
}



/* Set menu text colours */
header nav ul li a {
	font: bold 16px Arial, sans-serif;
	font-style: italic;
	text-transform: uppercase;
}
.currentPage {
	color: #06bbe0 !important;
}

/* Set menu hover text colours */
header nav ul li a:hover, .currentPage:hover {
	color: #06bbe0;
	text-decoration: none;
	-webkit-transition: 0.2s ease;
    -moz-transition: 0.2s ease;
    -ms-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease;
}

/* Prepare menu items for underline */
header nav ul li a, .currentPage {
	position: relative;
	text-decoration: none;
}

/* Add 0 width underline to all menu items */
.currentPage:after, header nav ul li a:after {
    position: absolute;
    height: 1px;
    margin: 0 auto;
    content: '';
    left: 0;
    right: 0;
    width: 0;
    background-color: #000099;
    bottom: -5%; /* Required heavy adjustment due to line height */
}

/* Make underline full width with animation upon hover */
.currentPage:hover:after, header nav ul li a:hover:after {
    width: 80%;
	-webkit-transition: 0.4s ease;
    -moz-transition: 0.4s ease;
    -ms-transition: 0.4s ease;
    -o-transition: 0.4s ease;
    transition: 0.4s ease;
}



#main {
	padding-top: 100px; /* navbar height */
	
	/* Include the padding in the page height so the footer will not get pushed down and the header doesn't out content*/
	/* This resolves having to use min-height: calc(100% - 120px) which IE8 doesn't support */
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	display: flex;
	position:relative;
	min-height: 100%;
}


/* Content holder styling */
#content {
	position:relative;
	display: flex;
	width: 100% /* IE width fix */
}

/* footer */
footer {
	width: 100%;
	padding: 9px 0 2px 0;
	background-color: #19afe6;
	font-size: 15.2px;
	line-height: 26px;
	height: 60px;
	color: #fff;
	background: linear-gradient(to bottom, rgba(23,158,207,1) 0%, rgba(23,158,207,1) 44%, rgba(25,143,179,1) 100%);
	
	position:absolute;
	bottom: 0;
	left: 0; /* IE pos fix */
	text-align: center;
}

/* Shared */
.menuItem, #footer-links a {
	text-decoration: none;
	margin-right: 20px;
}
.menuItem {
	color: #2b0e72;
}
#footer-links a:last-child {
	margin-right: 0;
}
#footer-links a {
	color: #aaf;
	text-decoration: none;
	color: #ccebff;
	margin-right: 30px;
	font-size: 17px;
}
#isoimg {
	height: 61px;
	position: absolute;
	right: 5px;
	top: 5px;
	border-radius: 3px;
	filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.3));
    left: 1806px;
}



/* Page left navigation */
#navbar {
	background-color: #eee;
	background: linear-gradient(to bottom, #eeeeee 0%,#ffffff 100%);
	line-height: 20px;
	width: 200px;
	padding: 20px;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
	margin-top: -10%; /* Move the page nav up under the header so that white doesn't show when the header is squished */
	padding-top: 10%; /* Shift the content back down from under the header */
}
#navbar li {
	padding-bottom: 20px;
}
#navbar li:first-child {
	padding-top: 20px; /* Re-add the top padding for the item list after items have been shifted under header and back */
}

.navbarlink {
	color: #000;
    letter-spacing: 0;
	font-size: 18px;
	margin-bottom: 20px;
	text-transform: uppercase;
}
.navbarlink:hover {
	color: #1a8cff;
	text-decoration: none;
}
.selectedlink {
	font-weight: bold;
}