*{margin:0;padding:0;border:0;}

/* Main elements */
aside{
	display:block;
	width:18%;
	height:auto;
	background-color:white;
	text-align:left;
	float:right;
	margin:0px;}
aside a{
	margin-right:0px;
}
aside img{margin-bottom: 0px; margin-top:15px; padding-top:0px; background-color:white;width:95%; height:251px; max-width:150px;
}
body{
	max-width: 849px;
	height:auto;
	margin: 0 auto;
	font-size: 12pt;
	/*line-height: 120%;*/
	color: #363636;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	background-color: white;
	background:url("/images-page/background_image.jpg") top center fixed no-repeat;
}
footer{
	font-size:.8em;color:gray;
    position:static;
    height: 30px;
    width: 100%;
    display:inline-block;
    padding:10px 0 0 0;
    margin:0px;
}
h1{ 
	color:rgb(91,155,213);
	font-size: 1.2em;		/* 12.5/16 */
	font-weight: bold;
	line-height: 130%;
	padding-left:0px;
	margin:10px 0 10px 10px;
	page-break-after: avoid;
	width:100%;
	z-index:1;}
h2{
	font-size: 1.0em;
	line-height: 120%;
	font-weight: bold;
	color:rgb(226,107,10);
	page-break-after: avoid;
	padding-bottom:2px;
	padding-top:10px;
}
h2 a:visited{text-decoration:none;}
a:active {top:1px;}
h3{
	font-size: 1.0em;
	font-family: Arial, sans-serif;
	line-height: 120%;
	color:rgb(84,130,53);
	font-weight: bold;
	page-break-after: avoid;
}
h4{
	font-size: 0.9em;
	font-family: Arial, sans-serif;
	line-height: 120%;
	color:rgb(0,112,192);
	font-weight: bold;
	page-break-after: avoid;
}
header{
  width: 100%;
  height: auto; 
  clear: both;
  column-count:1;
}
header a {padding-right:24px;}
header img{width:90%; max-width:500px;}
html {display:block;}
img{
	margin: 0;
	padding: 0;
	border: 0;
	display: block;
}
li{font-size: 0.85em;}
ol {counter-reset: li; /* Initiate a counter */
    list-style: decimal;
    margin:0px 0 0 15px;
    list-style: decimal;}
ol li{margin: 0 0 0 20px;
	padding:0 0 0 -20px;
	display:list-item !important;}
ol ol {margin: 0 0 0 2em; /* Add some left margin for inner lists */}
p{font-size: 0.85em;margin-top:5px; margin-bottom:5px; margin-left:-2px; /*line-height:130%;*/}
section{
	background-color:white;
	display:block;
	height:auto;
	margin:0px;
	padding:0;
	position:relative;
	width: 100%;
}
section p{margin:5px 10px 5px 10px;}
section ul{list-style:none;}
section a{text-decoration:none;}
ul{
    list-style: none;
    padding:0;
    margin:0px 0 10px 28px;
}

/* Ids */
#main{
	max-width: 749px;
	margin:0 auto;
	padding:0;
	background-color:white;}
#content{
	display:block;
	width:79%;
	min-height:400px;
	float:left;
	margin-top:-10px;
	margin-bottom:0px;
	padding:10px;
	background-color:white;}

/* Classes */
.alignLeft { float:left; margin-right: 2em; }
.alignRight { float:right; margin-left: 1em; }
.bordertop{border-top:medium rgb(68,90,51) solid;padding:5px 0 0 0;}
.bullet{background-image: url(../images-page/bullet-green.png);background-repeat: no-repeat;background-position: 0px 5px;background-size:7px 7px;padding-left: 20px;padding-bottom:5px;}
.cvBullet{margin-bottom:0px;margin-left:20px;list-style-image:url('/images-page/bullet-red.png');list-style-type:none;margin-right: 0;margin-top: 0;}
.code{font-size: 0.9em;font-family: Calibri;margin-top:0;margin-bottom:0; padding:15px; background-color:#DFDFDF}
.code p {margin-bottom:-0px}
.colourblue{color:rgb(13,29,183); display:inline; font-weight:bold;}
.colourdarkgreen{color:rgb(0,128,0); display:inline;}
.colourwhitebackground{background-color:white;}
.contactus{width:417px; font-size:0.9em;}
.expandcolor{color:rgb(226,107,10); font-weight:bold;}
.italic{display:inline;font-style:italic;}
.inline{display:inline;}
.floatleft { float:left;}
.floatright { float:right; z-index:100;}
.floatnone{float:none;}
.headertext{background-color:white; font-size:0.9em;}
.leader{font-weight:bold; color:darkgreen;}
.logo{ visibility:hidden; display:none;}
.logowide{width:100%;}
.marginbottomneg10{margin-bottom:-10px;}
.margintopneg10{margin-top:-10px;}
.olnotopmargin{margin:0 0 0 12px}
.paddingleft20{padding-left: 20px;}
.paddingright20{padding-right: 20px;}
.photo{float: left;margin-top:5px;margin-right: 10px;}
.proverbs{float: right;margin-top:5px;margin-right: 10px;}
.quote{font-style:italic;text-align:center;}
.runInHeading{font-weight:bold;display:inline;}
.spotlights{list-style-type:none;background-color:white;display:inline-block;width:100%;margin-left:10%;}
.spotlights li{float:left;height:auto;margin:0 auto;}
.textalignleft {text-align: left;}
.textalignright {text-align: right;}
.textaligncenter{text-align:center;}
.textverticallyalignmiddle{vertical-align:middle;}
.underline{text-decoration:underline;}
.usermanual{}
.usermanualimg{border:1px solid #021a40; margin-top:5px; margin-bottom:3px; width:80%; line-height:130%;}

.tbl{display:table;table-layout:fixed; background-color:rgb(226,219,218);}
.tblcell{display:table-cell; width:40%;}
.tblcellproduct{display:table-cell;padding:0 0 5px 10px; width:100%; vertical-align:middle;}
.tblcellshop{display:table-cell;padding:0 0 5px 65px; width:40%; vertical-align:middle; text-align:center;}
.tblcellnopadding{display:table-cell;}
.tblcellha{height:auto;}
.tblcellwa{width:auto;}
.tblindent{margin-top:0px;margin-right:auto;margin-bottom:.4em;margin-left:12%;font-size:0.9em;}
.tblindentdouble{margin-left:27%;}
.tblfooter{caption-side:bottom;display:table-caption;text-align:center;}
.tblfooter img{width:75%;margin:0 0 0 10%;}
.tblshadow{-webkit-box-shadow:7px 7px 7px 0px rgba(50,50,50,0.49);-moz-box-shadow:7px 7px 7px 0px rgba(50,50,50,0.49);box-shadow:7px 7px 7px 0px rgba(50,50,50,0.49);}
.tbltalks{display:table;width:85%;margin-left:5.7%;table-layout:fixed;}
.tblrow{width:auto; display:table-row;}

/* nav related */
.hiddenformobile{}
.lastchild{float:right;}
.mobdisabled {pointer-events: none;}
.mobilemenu{display:none;visibility:hidden;height:0;margin:0;padding:0;}

@media all and (max-width: 35em) {
    [role=main] {transition: all .25s;width: 100%;position: absolute;z-index: 2;top: 0;right: 0;}
    [role=navigation] {width: 75%;position: absolute;z-index: 1;top: 0;right: 0;}
    .active [role=main] {transform: translateX(-75%);}
}
@media screen and (max-width: 500px){
	h1{margin: 6px 0 15px 0;text-align:center;}
	/*header img{visibility:hidden;display:none;height:0;}*/
    header img{width:100%;}
	html,body{margin:0;padding:0;}
	nav{margin:5px auto 0 auto;height:auto;}
	section{margin-top:0px;width:100%;}
	#content{margin-top:-15px;margin-bottom:0px;padding-top:0;}
	.contactus{width: 100%;}
	.footerright{visibility:hidden;display:none;}
	.hiddenformobile{visibility:hidden;display:none;}
	.mobilemenu{visibility:visible;display:block;height:auto;background:none;margin:14px 0 0 0;}
	.mobilemenu ul{max-width:480px;width:100%; float:none; display:block; text-align:center;height:auto;}
	.mobilemenu li {margin: -3px 1px 0 5px;padding:0px; clear:none; background:none; display:inline-block;height:35px;
					top:3px;background-color:darkgreen;width: 100%; left:0; text-align:center;}
	.mobilemenu li a:last-child{margin-top:-1px;}
	.mobilemenu ul li, li a {width:100%;margin-top:-1px;}
	.mobilemenu a {padding:0px 0 0 0px;height:35px; line-height:130%;margin:0 auto;color:azure; text-decoration: none;background-color:darkgreen; font-size:1em;}
	.mobilemenu a:hover {color:chocolate;}
	.mobilemenu li.active > a{color:chocolate;}
	.mobilemenu .active{display:none;visibility:hidden;height:0;margin:0;padding:0;}
}
@media screen and (max-width:750px){
	aside{visibility:hidden;display:none;height:0;}
	body {background:none;}
/*	header img{visibility:hidden;display:none;} */
    header img{max-width:550px; padding:20px 0 0 20px;}
	nav ul li:hover > ul {top:55px !important;z-index:100;}
/*	section{margin-top:25px;width:100%;} */
	#content{width:95%;padding-right:15%;}
	.logo{height:160px; width:121px;margin-right:5px;visibility:visible;display:inline;}
	.hiddenformobile{margin-top:10px; margin-bottom:10px;}
	.spotlights{visibility:hidden;height:0;display:none;}
}
@media screen and (min-width:750px){
    #main{max-width:849px; margin:0 auto;}
    body .usermanual{max-width:90%;}
/*    header img{width:auto; height:6em; } */
    header a {padding-right:0px;}
    header img{max-width:550px; padding:20px 0 10px 10px;}
	nav ul li:hover > ul {left:0%; z-index:100;}
    .usermanual{
        -moz-column-count:2;
        -webkit-column-count:2;
        column-count:2;
        -moz-column-gap:30px;
        -webkit-column-gap:30px;
        column-gap:30px;
        column-width:40%;
        color:#000000;
        float:left;
        font-size:13px;}
}
@media screen and (min-width:1200px){
    #content .usermanual{width:82%;}
	nav ul li:hover > ul {z-index:100;}
    .body{max-width:90%; width:90%;}
    .usermanual{-moz-column-count:3; -webkit-column-count:3; column-count:3; column-width:25%; font-size:13px;}
}
