body
{
  /* background-color: #DFE9FF;  */
  background-color: White;
  font-family: Verdana,Arial,Sans-Serif; 
  font-size:12px; 
  color:#2c2c2c;
  margin: 0px;
}

/* Core Colours */

h1 {color: #333399;}
h2 {color: #333399;}
h3 {color: #333399;}

a {color: #3399FF; text-decoration: none;}
a:hover {color: #333399; text-decoration: underline;}
a:visited {color: #3366CC;}

hr {color: #333399;}

/* Top Section */

.bannerSection
{
  width: 100%;
  background-color: White;
  background-image: url('../img/banner.png');
  /*background-image: url('../img/grad-down-top.png');*/
  background-position: top left;
  background-repeat: repeat-x;
  margin: 0px;
  height:88px;
  color: #FFFFFF;
}

.bannerbar
{
    width: 900px;
    float: none;
		margin-left: auto;
		margin-right: auto;
		padding-top: 8px; 
}

.sitelogo 
{
	width: 230px; 
	height: 80px;
	z-index: 1;
	position: absolute;
	background: url(../img/qsclogo.png); 
}

.teamcoherence
{
	width: 630px;
	height: 50px;
	z-index: 1;
	position: absolute;
	margin: 15px 0 0 270px; 
	background: url(../img/teamcoherence.png); 
}

/* Menu Section */

.menuSection
{
  width: 100%;
  height: 20px;
  background-image: url('../img/menubackground.bmp'); 
  background-position: top left;
  background-repeat: repeat-x;
  color: White;
}

.menucontainer
{
  width: 920px;
  height: 20px;
  background-color: #333399;
	margin-left: auto;
	margin-right: auto;
  color: White;
}

.menucontainer a {color: #FFFFFF; text-decoration: none;}
.menucontainer a:hover {color: #FFFFFF; text-decoration: none;}
.menucontainer a:visited {color: #FFFFFF;}

.menubar
{
  font-size:110%;
  height: 20px;
  color: White;
}

/* Breadcrumbs */

.breadcrumbsSection
{
  width: 100%;
  height: 25px;
  padding: 10px 0 10px 0;
}

.breadcrumbs
{
  width: 900px;
	margin-left: auto;
	margin-right: auto;
	color: Black;
}

.breadcrumbs ul 
{
	position: absolute;
	margin: 0 0 0 0;
	float: left; 
	width: 560px; 
	list-style: none; 
}

.breadcrumbs ul li 
{
	display: inline; 
	padding: 0 0 0 10px;
	background: transparent url(../img/bg_bullet_arrow.png) no-repeat 0 50%;
}

/* Front Page Body (2-col) */

.bodyBackground
{
  width: 100%;
  position:relative;
  /* background-image: url('../img/grad-down.png'); */
  background-position: top left; 
  background-repeat: repeat-x;
}

.bodySection
{
  width: 916px;
	margin-left: auto;
	margin-right: auto;
	padding-left:10px;
	padding-right:10px;
	background-color: white;
}

.bodySection p.right {text-align:right;}

.bodySection h1
{
	font-size: 150%;
	margin: 2px 0 20px 0;
	text-align: left;
	border-top: solid 2px;
	clear: both;
}

.bodySection h1.center
{
	margin: 20px 0 0 0;
	font-size: 150%; 
	text-align: center;
	border: none;
	padding: none;
}

.bodySection h1.left
{
	margin: 0 0 0 0;
	font-size: 150%; 
	text-align: left;
	border: none;
	padding: none;
}

.bodySection h1.underline
{
	margin: 0 0 0 0;
	font-size: 150%; 
	text-align: left;
	border-top: none;
	border-bottom: solid 2px;
	padding: none;
	margin: 0 0 10px 0;
}

.bodySection h2
{
	margin: 20px 0 0 0;
	font-size: 120%; 
	text-align: left;
	border-bottom: solid 1px;
	padding: none;
	clear: both;
}

.bodySection h2.right
{
	margin: 20px 0 0 0;
	font-size: 120%; 
	text-align: right;
	border-bottom: solid 1px;
	padding: none;
	clear: both;
}

.bodySection h2.no-underline
{
	margin: 20px 0 0 0;
	font-size: 120%; 
	text-align: left;
	border: none;
	padding: none;
	clear: both;
}

.bodySection ul
{
	position: relative;
	margin: 0 0 15px 20px;
	width: 680px; 
	float: left; 
	list-style: none;
	clear:right;
}

.bodySection ul li 
{
	padding: 0 0 0 10px; 
	background: transparent url(../img/bg_bullet_normal.gif) no-repeat 0 50%; 
}

.bodySection table.no-border-resellers {clear:both; width:90%; border-collapse: collapse; border: 0px}
.bodySection table td.logo  {width: 45%; padding: 20px 0px 20px 10px; text-align:center; vertical-align:top; font-weight:normal; font-size:100%; border: 0px;}
.bodySection table td.address  {width: 55%; padding: 20px 0px 20px 10px; text-align:left; vertical-align:top; font-weight:normal; font-size:100%; border:0px; border-bottom: 1px solid #808080;}
.bodySection table td.address-noborder  {width: 55%; padding: 20px 0px 20px 10px; text-align:left; vertical-align:top; font-weight:normal; font-size:100%; border:0px; border: none;}

.bodySection table.no-border-partners {clear:both; width:95%; border-collapse: collapse; border: 0px}
.bodySection table td.logo-partners  {padding: 20px 0px 20px 10px; text-align:center; vertical-align:top; font-weight:normal; font-size:100%; border: 0px;}
.bodySection table td.address-partners  {padding: 20px 0px 20px 10px; text-align:left; vertical-align:top; font-weight:normal; font-size:110%; border:0px;}

.bodySection table.prices {clear:both; width:100%; border-collapse: collapse; border: 1px solid #808080;}
.bodySection table td.top {text-align:center; font-weight:bold; font-size:100%;}
.bodySection table td.product {width: 140px; text-align:left; font-weight:normal; font-size:100%;}
.bodySection table td.price {width: 60px; text-align:center; font-weight:normal; font-size:100%;}
.bodySection table td.desc {text-align:left; font-weight:normal; font-size:100%;}
.bodySection table td.addindesc {width: 280px; text-align:left; font-weight:normal; font-size:100%;}
.bodySection table td.center {text-align:center; font-weight:normal; font-size:100%;}
.bodySection table td.product-sep {width: 140px; text-align:left; font-weight:normal; font-size:100%; border-bottom: 2px solid #000000; border-left: 1px solid #808080; border-right: 1px solid #808080; border-top: 1px solid #808080;}
.bodySection table td.price-sep {width: 60px; text-align:center; font-weight:normal; font-size:100%; border-bottom: 2px solid #000000; border-left: 1px solid #808080; border-right: 1px solid #808080; border-top: 1px solid #808080;}
.bodySection table td.desc-sep {text-align:left; font-weight:normal; font-size:100%; border-bottom: 2px solid #000000; border-left: 1px solid #808080; border-right: 1px solid #808080; border-top: 1px solid #808080;}

.clear-contentunit {clear:both; width:900px; height:0.1em; border:none; background:rgb(210,210,210); color:rgb(210,210,210);}

.lefthalfbody
{
  width: 400px;
  float: left;
  padding: 5px 25px 15px 25px;
}

.righthalfbody
{
  width: 400px;
  float: right;
  padding: 5px 25px 10px 25px;
}

.lefthalfmenu
{
  width: 210px;
  float: left;
  padding: 0 0 0 0;
}

.lefthalfmenu table {clear: both; width: 100%; table-layout: fixed; border-collapse: collapse; empty-cells: show;}
.lefthalfmenu table td {padding: 2px 0 2px 0; border: none; text-align: left;}
.lefthalfmenu img {border-style: none; padding: 1px;}
.lefthalfmenu img.center {clear:both; float:none; display:block; margin:0 auto; padding:1px; border:none;}
.lefthalfmenu h2 {font-size: 130%; border: none;	padding: none;}
.lefthalfmenu h3 {margin: 0 0 0 0; font-size: 115%; border: none;	padding: none;}

.righthalftext
{
  width: 680px;
  float: right;
  padding: 0 0 0 5px;
}

.righthalftext table {clear:both; width:95%; border-collapse: collapse; border: 1px solid #808080;}
.righthalftext table.no-border {clear:both; width:95%; border-collapse: collapse; border: 0px}
.righthalftext table th {padding:4px 2px 4px 2px; border: 1px solid #808080; text-align:center; background-color:rgb(228,228,228); font-weight:bold; font-size:110%;}
.righthalftext table td {padding:7px 4px 7px 4px; border: 1px solid #808080; text-align:left; font-weight:normal; font-size:110%;}
.righthalftext table td.no-border {padding:7px 2px 7px 2px; border: 0px; text-align:left; font-weight:normal; font-size:110%;}
.righthalftext table td.top {text-align:center; font-weight:bold; font-size:110%;}
.righthalftext table td.product {width: 140px; text-align:left; font-weight:normal; font-size:110%;}
.righthalftext table td.price {width: 60px; text-align:center; font-weight:normal; font-size:110%;}
.righthalftext table td.desc {text-align:left; font-weight:normal; font-size:110%;}
.righthalftext table td.addindesc {width: 280px; text-align:left; font-weight:normal; font-size:110%;}
.righthalftext table td.center {text-align:center; font-weight:normal; font-size:110%;}
.righthalftext table td.product-sep {width: 140px; text-align:left; font-weight:normal; font-size:110%; border-bottom: 2px solid #000000; border-left: 1px solid #808080; border-right: 1px solid #808080; border-top: 1px solid #808080;}
.righthalftext table td.price-sep {width: 60px; text-align:center; font-weight:normal; font-size:110%; border-bottom: 2px solid #000000; border-left: 1px solid #808080; border-right: 1px solid #808080; border-top: 1px solid #808080;}
.righthalftext table td.desc-sep {text-align:left; font-weight:normal; font-size:110%; border-bottom: 2px solid #000000; border-left: 1px solid #808080; border-right: 1px solid #808080; border-top: 1px solid #808080;}

.pricelist table { font-size:smaller; clear:both; width:100%; border-collapse: collapse; border: none;}
.pricelist table td {text-align: left; vertical-align:text-bottom; border-left: none; border-right:1px solid rgb(220,220,220); border-bottom:1px solid rgb(220,220,220); border-top:1px solid rgb(220,220,220);}
.pricelist table td.pricesheader { font-weight:bolder; text-align: left; vertical-align:text-bottom; border-bottom: 2px solid #808080; border-left:none; border-right:none; border-top: none;}
.pricelist table td.priceseven { text-align: left; vertical-align:text-bottom; background-color:rgb(244,244,244);}

.righthalftext p.center {text-align:center;}

.column3-unit-right { margin-left:20px; margin-bottom:5px; font-size: 80%; float:right; width:220px; border:solid 1px rgb(160,214,81); background-color:rgb(217,239,185); padding: 0 5px 5px 10px; }
.column3-unit-right h1 { text-align:left; font-size: 160%; border: none;	padding: none; margin-top:5px; margin-bottom:0px; border-bottom: 1px solid; }

/* Articles */

.article p.header { padding:none; height:18px; color: #333399; font-size: 16px; text-align: left; font-weight:bold; width:420px; 
                    position:relative; border-bottom:solid 1px; margin-bottom: 0px; }
.article p.date { position: relative; text-align: right; font-size: 11px; font-style:italic; font-weight:lighter; margin: none; 
                  padding: none; }

/* Footer */

.footer
{
  width: 900px;
	clear:both;
  background-color: White; 
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 15px;
	font-size: 11px; 
	color: #2c2c2c;
	padding-left:10px;
	padding-right:10px;
}

/********************/
/*  COMMON CLASSES  */
/********************/
img {border: none; clear:both; float:left; padding:1px 30px 0 0;}
img.center {clear:both; float:none; display:block; margin:0 auto; padding:1px; border:none;}
img.right {border: none; clear: both; float: right; padding:1px 0 0 30px;}
img.left {border: none; clear: both; float: none; padding: 1px 0 0 0;}

/* Lightbox stuff */
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 5px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:img/gif); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../img/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../img/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding: 0 30px 0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }