@charset "utf-8";

html {
	height: 100%;
}

body {
	width: 100%;
	height: 100%;
	font: 100% Arial, Helvetica, sans-serif;
	background: #FFFFFF; /* white */
	margin: 0; /* zero the margin of the body element to account for differing browser defaults */
	padding: 0; /* zero the padding of the body element to account for differing browser defaults */
	text-align: center; /* center the container in IE 5* browsers. */
						/* text is set to the center aligned in the #container selector */
	color: #FFFFFF; /* white */
	overflow-x: hidden; /* remove horizontal scroll bar as web pages do not require */
	overflow-y: scroll; /* auto vertical scroll bar */
}

.mainform #wrapper {
	width: 950px;  /* this will create a container 70% of the browser width */
	margin-left: auto; /* the auto margin (in conjunction with a width) center the page */
	margin-right: auto; /* the auto margin (in conjunction with a width) center the page */  
	background: #000000; /* black */
	position: relative;
	min-height: 100%;
	height: 100%;
	height: auto;
}

html>body #wrapper {
	height: auto;
}

* html #wrapper {
	height: 100%; /* with the * html hack feeding 100% height to IE6 and IE5.5 */
}

.mainform #content {
	padding-bottom: 120px;   /* MUST SPECIFY height of the footer for BOTTOM to work, must EQUAL FOOTER below */
}

/*.mainform #content2 {
	width: 950px;  /* this will create a container 70% of the browser width
	margin: 0 auto -98px; /* top-right-bottom-left. The auto margin (in conjunction with a width) center the page
	                      /* MUST SPECIFY height of the footer (92px) for it to appear back on browser at bottom
	padding-bottom: 98px; /*Modify padding value as needed for footer height
	position: relative;
	background: #000000; /* black was #ADAFAA = medium gray
	min-height: 100%;
} */

.mainform #header {
}

.mainform #topline {
	height: 15px;
	background: #FFFFFF; /* white */
}

.mainform #headerpart { 
	background: #000000; /* black */
}

.mainform #headerabn {
	background: #000000; /* black */
	color: #FFFFFF; /* white */
	font-size: 10px;
	font-family: "Times New Roman", Times, serif;
	font-weight: bold;
	margin: 0px 0px 0px 320px; /* top-right-bottom-left. It creates the space down the right side of the page. */
}

/*.mainform #calendarText {
	color: #FFFFFF; /* white 
	font-size:0.7em;
	font-weight:bold;
	text-align: left;
	padding: 0px 0px 6px 6px; /* top-right-bottom-left */
	
/*.mainform #lastupdate {
	width: 35%;
	float: right; /* since this element is floated (up), a width must be given 
	font-size: 0.7em;
	font-family: Calibri, Corbel,;
	text-align: right;
	padding: 5px 10px 0px 0px; /* top-right-bottom-left */

.mainform #menubar { 
}

.mainform #detail { 
	/*background: #000000; /* black */
}

.mainform #detailcontact1 {
	color: #FFFFFF; /* white */
	float: left; /* since this element is floated (up), a width must be given */
}

.mainform #detailcontact2 {
	color: #FFFFFF; /* white */
	float: left; /* since this element is floated (up), a width must be given */
}

.mainform #detailpart {
	color: #FFFFFF; /* white */
	padding: 0px 0px 0px 100px; /* The left margin can be given in percentages or pixels.
								 It creates the space down the left side of the page.
								 top-right-bottom-left */
	clear: both; /* Clear floats that may exist */
}

.typesize { /* used for Information page */
	color: #666666; /* dark grey */
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0px 0px 0px 10px; /* The left margin can be given in percentages or pixels.
								 It creates the space down the left side of the page.
								 top-right-bottom-left */
}

/* Infolink (for Information page) hyperlink: format style, color and size for links to suit */

a.infolink:link {
	color: #33CC66; /* green */
	text-decoration: none;
	font-weight: normal;
}

a.infolink:visited {
	color: #99CC99; /* green or 66FFCC or 99CC99 or CC33CC or 99FFCC or CCFFCC or CCFF99 or 99FF99*/
	text-decoration: none;
	font-weight: normal;
}

a.infolink:hover {
	color: #33FF00; /* green or 33CC33 33CC00 /// 33FF66 33FF33 33FF00 */
	text-decoration: underline;
	font-weight: normal;
}

a.infolink:active {
	color: #33CC66; /* green */
	text-decoration: none;
	font-weight: normal;
}

.mainform #detailcol1 { /* used for colour block list image */
	width: 25px;
	float: left; /* since this element is floated (up), a width must be given */
	text-align: left;
}

.mainform #detailcol2 { /* used for associates, services and and product images (?) */
	width: 700px;
	float: left; /* since this element is floated (up), a width must be given */
 	text-align: left;
}

.mainform #detailcol3  { /* used for contact type */
	width: 125px;
	float: left; /* since this element is floated (up), a width must be given */
 	text-align: left;
}	

.mainform #detailcol4 { /* used for associates, contact names and product images (?) */
	width: 300px;
	float: left; /* since this element is floated (up), a width must be given */
 	text-align: left;
}

.mainform #detailcol5 { /* used for product names */
	width: 210px;
	float: left; /* since this element is floated (up), a width must be given */
 	text-align: left;
}

.mainform #detailcol6 { /* used for QR code */
	width: 200px;
 	text-align: left;
}

/* Detailink (for Contacts page) hyperlink: format style, color and size for links to suit */

a.detailink:link, a.detailink:visited, a.detailink:active {
	color: #FFFFFF; /* white */
	text-decoration: underline;
	font-weight: normal;
}

a.detailink:hover {
	color: #00ADEF; /* cyan or vivid blue */
	text-decoration: underline;
	font-weight: normal;
}

/* Button with CSS only */

.button1 {
	background-image: url(../images/download_button80.png);
	background-position: top; /* the background position (in combination with the height!) makes it possible that only the top of the whole sprite will be visible */  
	height:17px;
	width:80px;
	display:block;
}

.button1:hover /* mouseOver */
{
	background-image: url(../images/download_button80.png);
	background-position: bottom;
	height:17px;
	width:80px;
}

/* Button with CSS & JQuery */
.button2, .button2 a {
    background: url(images/download_button80.png) 0 -17px;
	background-repeat: no-repeat;
    height: 17px;
    width: 80px;
    display: block;
}

.button2 a {
	background-position: 0 17;
}

.mainform #footer {
	height: 98px;
	position: fixed;
	bottom: 0px;
}

/*.mainform #footer2 {
	width: 950px;  /* this will create a container 70% of the browser width
	margin: 0 auto; /* top-right-bottom-left. The auto margin (in conjunction with a width) center the page
                         /* MUST SPECIFY height of the footer (92px) for it to appear back on browser at bottom
 	height: 98px;
	position: relative;
	background: #FFFFFF; /* white; was #ADAFAA = medium gray
} */

.mainform #footermenu {
	background: #000000; /* black */
	height: 20px;
	padding: 4px 0px 0px 0px; /* top-right-bottom-left */
}

.mainform #footermenucol {
	width: 9.7em; /* was 8em */
	float: left; /* since this element is floated (up), a width must be given */
	color: #CCC; /* light gray */
	font-size: 13px;
	font-family: Calibri, Century, Corbel;
	font-weight: normal;
	text-align: center;
}

/* footermenucol Hyperlink: format style, color and size for links to suit */

#footermenucol a:link, a:visited, a:active {
	color: #808080; /* silver */
	text-decoration: underline;
	font-weight: normal;
}

#footermenucol a:hover {
	color: #00ADEF; /* cyan or vivid blue */
	text-decoration: underline;
	font-weight: normal;
}
	
.mainform #colourbar {
	/*background: #000000; /* black */
}

.mainform #colourbarline {
	background: #000000; /* black */
	height: 10px;
}

.mainform #footerpart {
	background: #FFFFFF; /* white */
	clear: both; /* Clear floats that may exist */
}

.mainform #footercol1 {
	width: 40%;
	float: left; /* since this element is floated (up), a width must be given */
	color: #666666; /* dark gray */
	font-size: 11px;
	font-family: Calibri, Century, Corbel;
	font-weight: normal;
	text-align: left;
	padding: 0px 0px 0px 10px; /* top-right-bottom-left
	                              the top margin should be given to every element that will be placed in the side columns */
}

.mainform #footercol2 {
	width: 28%;
	float: left; /* since this element is floated (up), a width must be given */
	color: #666666; /* dark gray */
	font-size: 11px;
	font-family: Calibri, Century, Corbel;
	font-weight: normal;
	text-align: centre;
	/*padding: 0px 0px 0px 0px; /* top-right-bottom-left
	                              the top margin should be given to every element that will be placed in the side columns */
}

.mainform #footercol3 {
	width: 29%;
	float: left; /* since this element is floated (up), a width must be given */
	color: #666666; /* dark gray */
	font-size: 11px;
	font-family: Calibri, Century, Corbel;
	font-weight: normal;
	text-align: right;
	padding: 0px 10px 0px 0px; /* top-right-bottom-left */
}

/* footerlink hyperlink: format style, color and size for links to suit */

a.footerlink:link, a.footerlink:visited, a.footerlink:active {
	color: #666666; /* dark gray */
	text-decoration: underline;
	font-weight: normal;
}

a.footerlink:hover {
	color: #00ADEF; /* cyan or vivid blue */
	text-decoration: underline;
	font-weight: normal;
}

.mainform #bottomline {
	height: 20px;
	background: #FFFFFF; /* white */
}

/* Special definitions for PRINTER FACTS page*/

.mainform #wrapperfacts {
	width: 100%;  /* this will create a container 70% of the browser width */
	margin: 0 auto; /* the auto margin (in conjunction with a width) center the page */
	background: #FFFFFF; /* white; was #ADAFAA = medium gray */
	position: relative;
	min-height: 100%;
	height: 100%;
	height: auto;
}

html>body #wrapperfacts {
	height: auto;
}

* html #wrapperfacts {
	height: 100%; /* with the * html hack feeding 100% height to IE6 and IE5.5 */
}

.mainform #contentfacts {
	width: 80%;  /* this will create a container 70% of the browser width */
	margin: 0 auto; /* the auto margin (in conjunction with a width) center the page */
	padding-bottom: 105px;   /* MUST SPECIFY height of the footer for BOTTOM to work, must > EQUAL FOOTER below */
	background: #FFFFFF; /* white */
}

.mainform #footerfacts {
	width: 100%;  /* this will create a container 70% of the browser width */
	margin: 0 auto; /* the auto margin (in conjunction with a width) center the page */
	background: #FFFFFF; /* white */
	height: 98px;
	position: fixed;
	bottom: 0px;
}

.mainform #footerfacts950 {
	width: 950px;  /* this will create a container 70% of the browser width */
	margin: 0 auto; /* the auto margin (in conjunction with a width) center the page */
}

.clear {clear: both;}

a.copysymbol {
	font-size: 0.8em;
}

/* General Hyperlink: format style, color and size for links to suit */

.hyperlink:link {
	color: #C0C0C0; /* silver */
	text-decoration: none;
	font-weight: normal;
}

.hyperlink:visited {
	color: #FF00FF; /* fuscia/purple */
	text-decoration: none;
	font-weight: normal;
}

.hyperlink:hover {
	color: #0000FF; /* vivid blue */
	text-decoration: underline;
	font-weight: normal;
}

.hyperlink:active {
	color: #FF0000; /* red */
	text-decoration: none;
	font-weight: normal;
}

/* Sitemap: format bullets (style, color and size) links and headings to suit */

#sitemap {
	color: #000000; /* black */
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	margin-left: 15px;
	margin-right: 15px;
}
#sitemap ul li {
	list-style-type: disc;
	list-style-image: url(../SpryAssets/images/arrow-right.gif);
	text-decoration: none;
	line-height: 18px;
	margin-left: -25px;
}	
#sitemap ul ul li {
	list-style-type: square;
	list-style-image: none;
	text-decoration: none;
	line-height: 18px;
	margin-left: 35px;
}	
#sitemap ul ul ul li {
	list-style-type: circle;
	list-style-image: none;
	text-decoration: none;
	line-height: 18px;
	margin-left: 55px;
}
	
#sitemap a:link {
	color: #000000; /* black */
	text-decoration: none;
}
#sitemap a:visited {
	color: #000000; /* black */
	text-decoration: none;
}
#sitemap a:hover {
	color: #0000FF; /* vivid blue */
	text-decoration: underline;
	font-weight: bold;
}
#sitemap a:active {
	color: #000000; /* black */
	text-decoration: none;
}

/* Styles: format bullets (style, color and size) text and headings to suit */

.style1 { /* used for DETAIL HEADING text */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 18px;
	color: #FFFFFF; /* white */
	text-align: left;
	padding: 20px 0px 10px 60px; /* top-right-bottom-left */
}

.style2 { /* used for DETAIL Intro Text */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: left;
	padding: 10px 80px 20px 60px; /* top-right-bottom-left */
}

.style3 { /* used for DETAIL text */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: left;
	padding: 3px 0px 10px 0px; /* top-right-bottom-left */	
}

.style4 { /* used for ASSOCIATE text */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: left;
	padding: 3px 0px 3px 50px; /* top-right-bottom-left */	
}

.style5 { /* used for PRODUCT image */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: left;
	padding: 3px 0px 3px 25px; /* top-right-bottom-left */	
}

.style6 { /* used for CONTACT US detail */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: left;
	padding: 3px 0px 40px 0px; /* top-right-bottom-left */	
}

.style7 { /* used for CONTACT US image */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: center;
	padding: 3px 0px 0px 25px; /* top-right-bottom-left */	
}

.style8 { /* used for INFORMATION detail */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF; /* white */
	vertical-align: middle;
	text-align: left;
	padding: 0px 0px 5px 10px; /* top-right-bottom-left */	
}

/* Remove GoDaddy Ad Banner from top of web page display */

#conash3D0 {
    height: 0px;
	top: -1px;
}