html { margin:0px; padding:0px; background:#EEEEEE; }
body { max-width:1680px; margin:0px auto; padding:0px; -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; 
	font-family:'Segoe UI', HelveticaNeue, Arial, sans-serif; font-size:20px; color:#222222; text-decoration-skip-ink:none;}
.page {max-width:1000px; min-width:240px; margin:0px auto; padding-left:1.5%; padding-right:1.5%;  background:#FFFFFF;}

.menubar {background:#000088; font-size:90%; }
.menubar ul {margin:0em; padding:0.5em 0em; list-style:none; color:#FFFFFF}
.menubar li {display:inline; margin:0em 3em 0em 0em; }
.menubar .last {margin:0px;}
.menubar .right {float:right; margin:0px;}
.menubar a {text-decoration:none; color:#FFFFFF; padding:0.5em 0.2em;}
.menubar a:hover {color:#00FFFF;}
#logo {float:right; padding-top:0.4em; padding-bottom:0em;}
#logo img {height:1.5em; border:0px;}
#expand_menu {display:none; padding-left:1em; padding-right:4em;}
#expand_menu img {position:relative; top:2px; border:0px;}

h1, h2, h3 { font-weight:normal; font-size:100%; margin:0em; padding:0em; }
.title {font-family:Impact, HelveticaNeue-CondensedBlack, "Droid Sans", AvenirNextCondensed-Bold, Futura-CondensedExtraBold, 'Times New Roman', Arial;
	color:#4488cc; color:#4488cc; font-size:300%;}
.small.title {font-size:230%; padding-top:0.2em; padding-bottom:0.2em;}

.subtitle {font-size:160%; font-weight:bold; color:#000088; padding-top:1em; padding-bottom:0.4em;}
.subtitle2 {font-weight:bold; font-size:200%; color:#000088; margin:0px 0px 0.5em 0px;}

.tagline { color:#000088; border-top:1px solid #000088; border-bottom:1px solid #000088; padding-bottom:0.1em;}
	
.titlebar {
	background: #D4EEFF;
	background: -webkit-linear-gradient(#AADDFF, #FFFFFF);
	background: -o-linear-gradient(#AADDFF, #FFFFFF);
	background: -moz-linear-gradient(#AADDFF, #FFFFFF);
	background: linear-gradient(#AADDFF, #FFFFFF);
	padding-top:0.3em; padding-bottom:0.1em;
	border-bottom:3px solid #000088;
}

.titlebar.borderless{ border-bottom:0px; }
.content {padding-top:0.75em; padding-bottom:2em; line-height:150%}

.content a:hover {background-color:#FFFF00;}
.content ul { list-style:square; }

.footerbar {background:#000088; font-size:90%; color:#FFFFFF; text-align:center; padding-top:0.5em; padding-bottom:0.5em; clear:both;}
.footerbar:before {content:"\00A9  Advanced Software Engineering Ltd"}
	
@media (max-width:920px) {
	.flex.title { font-size: 250%; }
	.menubar li	{margin-right:1.5em}
}

@media (max-width:750px) {
	.flex.title { font-size: 200%; }
	.menubar li	{margin-right:0.4em}
}
	
@media screen and (max-width:619px) {
	.flex.title { font-size: 175%; }
	.flex2.title { font-size:200%; }
	.subtitle2 { font-size:150%; }
	.menubar {text-align:left;}
	.menubar {padding-left:0px;}
	.menubar ul {position:absolute; visibility:hidden; padding:0px; margin:0px; background:#3388ff;}
	.menubar li {display:block; border-bottom:1px solid #0000ff; margin:0px;}
	.menubar .last {border-bottom:1px solid #3388ff;}
	.menubar li a {display:block; padding:0.5em 1.5em 0.5em 1.5em; }
	#expand_menu {display:inline-block;}
	
	.content {font-size:90%}
	.tagline {font-size:90%}
}
	
@media screen and (max-width:400px) {
	.footerbar {font-size:80%}
}