﻿

/******************/
/* General Styles */
/******************/

body {
	background: #d9d9d9 url('images/body-bg.jpg') repeat-x top left;
	text-align: center;
	font-size: 75%;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
}

div.scroll {
 	overflow: auto;
 	overflow-x: hidden;
}

.left {
 	float: left;
 	margin-right: 15px;
}

ul.left {
 	margin-right: 30px;
}

.right {
 	float: right;
 	margin-left: 15px;
}

.clear {
 	clear: both;
 	height: 0;
}

img {
 	border: none;
}

.centeredimage {
 	text-align: center;
}

.centeredimage img {
 	margin: 0 auto;
}

.imgright {
	float: right;
	border: 5px solid #ededed;
	margin: 0 0 15px 15px;
}

.imgleft {
	float: left;
	border: 5px solid #ededed;
	margin: 0 15px 15px 0;	
}

/********************/
/* Container Styles */
/********************/
div#outer {
 	margin: 0 auto;
 	width: 984px;
 	position: relative;
 	padding-bottom: 40px;
}

div#outer div#seo {
 	position: absolute;
 	bottom: 0;
 	left: 0;
 	text-align: left;
 	color: #aaaaaa;
}

div#outer div#seo h1, div#outer div#seo p {
 	margin: 0;
 	padding: 0;
 	font-size: 0.8em;
 	font-weight: normal;
}

div#containerouter {
 	text-align: center;
	margin: 0 auto;
 	width: 984px;
}

div#containerinner {
	text-align: center;
}

/*****************/
/* Header Styles */
/*****************/
div#header {
 	height: 183px; 
 	position: relative;
 	background: transparent url("images/header-bg.jpg") no-repeat top center; 
 	padding: 0;
}

div#header h2 {
 	width: 278px;
 	height: 108px;
 	position: absolute;
 	top: 33px;
 	left: 0;
 	background-image: url(images/logo.jpg);
 	background-repeat: no-repeat;
 	background-position: top left;
 	text-indent: -9999px; 
 	padding: 0;
 	border: 0;
 	margin: 0;
}

ul#language {
 	list-style: none;
 	float: right;
 	margin-right: 10px 0 0 5px;
 	margin-top: 10px;
 	padding: 0;
}

* html ul#language {
  	display: inline;
  	margin-right: 13px;
}

ul#language li {
 	float: left;
 	margin-right: 10px;
}

ul#language li a {
 	display: block;
 	text-decoration: none;
 	color: #fff;
}

ul#language li a:hover {
 	color: #fff;
 	text-decoration: underline;
}

ul#header-navigation {
	width: 982px;
	display: block;
	background: #fff url("images/header-navigation-bg.jpg") repeat-x bottom left;
	position: absolute;
	top: 151px;
	left: 0;
	list-style: none;
	text-align: left;	
	padding: 5px 0;
	border: 1px solid #c7c7c7; 
	border-width: 0 1px; 
	margin: 0;
}

* html ul#header-navigation {
	padding: 0;
}

ul#header-navigation li {
 	display: inline;
 	font-size: 1.6em; 
 	padding: 0;
}

ul#header-navigation li.first {
 	margin-left: 25px;
}

ul#header-navigation li a {
 	color: #737172;
 	text-decoration: none;
 	padding: 0 15px 0 0;
}

ul#header-navigation li a:hover {
	text-decoration: none;
	color: #1da2e5;
}

/******************/
/* Content Styles */
/******************/
div#content {
	background: #f8faf9;
	text-align: left;
	border: 1px solid #c7c7c7; 
	border-top: 0; 
 	margin: 0 0 10px 0;
}

div#content h2 {
 	color: #0283c5;
 	font: normal 1.8em 'arial light', arial, verdana, helvetica,sans-serif;
 	margin: 0 0 10px;
}

div#content h3 {
 color: #000000;
 font-weight: bold;
 font-size: 1.2em;
 line-height: 1.3em;
 clear: left;
}

div#content h3.topspace {
 margin-top: 30px;
}

div#content h4 {
 color: #000000;
 font-weight: bold;
 font-size: 1em;
}

div#content p {
 	font-size: 1.1em;
 	line-height: 1.5em;
 	text-align: justify;
}

div#content .newsdate {
 font-style: italic;
 color: #333333;
}

div#content div.col {
 width: 345px;
 float: left;
}

div#content div.casestudy {
	padding-bottom: 10px; 
 	border-bottom: 1px solid #ddd;
 	margin-bottom: 25px;
}



/******************/
/* Leftcol Styles */
/******************/

div#leftcol {
	width: 190px;
 	float: left;
 	display: inline;
 	background-color: #f7f7f7;
	text-align: left;
	padding: 0; 
	border: 1px solid #c7c7c7;
 	margin: 25px 10px 10px 10px;
}


div#leftcol div.box {
 	width: auto;
 	background: transparent url("images/icon-solutions.jpg") no-repeat 10px 0; /* Solutions */
 	padding: 0 10px 0 55px;
 	margin: 10px 0 20px;
}

/* Products */ 	div#leftcol div.box + div.box { background-image: url("images/icon-products.jpg"); }
/* Services */ 	div#leftcol div.box + div.box + div.box { background-image: url("images/icon-services.jpg"); }
/* Support */   div#leftcol div.box + div.box + div.box + div.box { background-image: url("images/support-icon.jpg"); }
/* Freeware */ 	div#leftcol div.box + div.box + div.box + div.box + div.box { background-image: url("images/icon-info.jpg"); }
/* Info */ 		div#leftcol div.box + div.box + div.box + div.box + div.box + div.box { background-image: url("images/icon-info.jpg"); }





div#leftcol div.box h3 {
 	color: #373737;
 	text-align: left;
 	font-size: 1.0em;
 	color: #393939;
 	padding-top: 0;
 	margin: 0 0 5px;
}

div#leftcol div.box ul {
 	list-style-type: none;
 	padding: 0;
 	margin: 0;
}

div#leftcol div.box ul li {
	font-size: 0.9em;
	line-height: 1.2em;
 	list-style-type: none;
 	padding: 5px 0 0;
 	border-top: 1px solid #ddd;
 	margin: 0 0 5px;
}

div.box ul a {
 	color: #393939;
 	text-decoration: none;
}

div#leftcol div.box ul a:hover {
 	color: #0082c3;
 	text-decoration: none;
}


/**************/
/* Middle Col */
/**************/
div#middlecol {
	width: 750px;
 	float: left;
 	text-align: left;
 	margin: 25px 10px 15px 10px;
}

* html div#middlecol {
	margin-right: 5px;
}

div#middlecol.rightboxes {
	width: 520px;
}

div#middlecol.drawingdesign {
 background: transparent url('images/drawing_design_background.jpg') no-repeat 50% 100%;
}

div#middlecol h2 {
	border-bottom: 1px solid #ccc;	
}

div#middlecol a {
 font-weight: bold;
 text-decoration: none;
 color: #0082C3;
}

div#middlecol a:hover {
 text-decoration: underline;
}

div#middlecol ul li {
 margin-bottom: 5px;
}

div#middlecol ul.actions,
div#middlecol p .action
 {
 	/*background: transparent url('images/mini-arrow-blue.jpg') no-repeat 0 4px;*/
 	list-style-type: none;
 	padding-left: 15px;
 	margin-left: 0;
 	margin-top: 20px;
}

div#middlecol ul.actions li {
	background: transparent url("images/mini-arrow-blue.jpg") no-repeat 0 4px;
	list-style-type: none; 
	padding-left: 10px; 
}

ul.nospace, div.nospace {
 margin-top: -7px;
}

div.nospace ul {
 margin-top: 0;
}

ul.actions ul {
 margin-top: .5em;
}

a.action {
 padding-left: 20px;
 background: transparent url('images/mini-arrow-blue.jpg') no-repeat 0 50%;
}

h4.news {
 margin: 0;
 margin-bottom: -10px;
}

div#content div.galleryitem {
 	float: right;
 	width: 210px;
 	height: 5em;
 	border: 0px;
 	padding: 5px;
 	margin-right: 25px;
 	margin-bottom: 15px;
}

div#content div.galleryitem .galleryname {
 font-weight:normal;
 font-size:small;
}

div#content div.galleryitem p {
/*
 text-align: center;
*/
 margin: 0px 0 5px;
 text-align: center;

}

div#content div.galleryitem a.action {
 padding-left: 15px;
 float: left;
 clear: left;
 width: 100%;
}

/* Styles for Image Magnifier */

.magnify {
	width: 320px;
	height: 248px;
	position: relative;
	z-index: 100;
	left: 400;
	top: 50;
}

.magnify a.imghover, 

.magnify a.imghover:visited { width: 320px; height: 248px; display: block; top: 0; left: 0; text-decoration: none; border: 0; }

.magnify  { width: 320px; height: 248px; position: relative; z-index: 100; float: right; margin-left: 15px; }

.mag_center  { width: 100%; float: none; text-align: center; margin-left: auto; }

.mag_center img { margin: auto; }

.mag_center a.imghover:hover .large { left: 10px;  }

.magnify a .large { width: 0; height: 33px; display: block; position: absolute; border: 0; top: 0px; left: -1px;}

.magnify a.imghover:hover .large{ width: 480px; height: 372px; display: block; position: absolute; top: -65px; left: -100px; border: 10px solid #fff; 

}

/**********/
/* Search */
/**********/
form#search {
 	position: absolute;
 	z-index: 10;
 	margin: 0;
 	padding: 0;
 	top: 157px;
 	right: 0;
}

form#search input {
	width: 150px; 
 	padding: 0;
 	margin: 0;
 	margin-right: 5px;
 	vertical-align: top;
}

form#search input#searchbutton {
	width: 22px;
}

.isearch-highlight {
 	font-weight: bold;
}

.isearch-score {
 	font-size: 90%;
 	color: #343434;
}

/***************/
/* Form Styles */
/***************/
div#content form fieldset {
 margin: 2em 0 0 0;
 padding: 1em auto;
 overflow: hidden; /* Safari hack. Safari needs overflow:hidden to force proper display of fieldset */
}

div#content form fieldset.buttons {
 border: none;
 margin-bottom: 2em;
}

div#content form fieldset.buttons input, div#content form input.button {
 width: auto;
 padding: 1px 3px;
}

div#content form fieldset fieldset {
 clear: left;
}

div#content form legend {
 color: #0082C3;
 font-size: 1.2em;
 font-weight: bold;
}

div#content form label {
 width: 8em;
 float: left;
 clear: left;
 text-align: right;
 margin-top: .5em;
}

div#content form label.checkbox {
 clear: none;
 width: 90%;
 margin-left: 1em;
 text-align: left;
}

div#content form label.inline {
 clear: none;
 width: 6em;
 margin-left: 20px;
}

div#content form label.required {
 font-weight: bold;
}

div#content form label.error {
 color: #ff0000;
 font-weight: bold;
}

div#content form label.full {
 width: auto;
}

/* IE 5/6 hack to make tel and fax numbers line up on form */
* html div#content form div.ieworkaround {
 margin-top: -15px;
}

/* IE 5/6 hack to make tel and fax numbers line up on form */
* html div#content form div.ieworkaround label {
 margin-top: 8px;
}

/* IE 7 hack to make tel and fax numbers line up on form */
html div#content form div.ieworkaround {
 *margin-top: -15px;
}

/* IE 7 hack to make tel and fax numbers line up on form */
html div#content form div.ieworkaround label {
 *margin-top: 8px;
}

div#content form input, div#content form select {
 float: left;
 margin-top: .5em;
 width: 20em;
 margin-left: 1em;
}

div#content form select {
 width: auto;
}

div#content form input {
 padding: 2px;
}

div#content form input.small {
 width: 8em;
}

div#content form input.error {
 border: 2px solid #ff0000;
}

div#content form table {
 clear: left;
 margin-top: 10px;
}

div#content form table thead th {
 width: 10em;
 text-align: center;
}

div#content form table tbody th {
 width: 10em;
}

div#content form table input {
 float: none;
 margin: 0;
 width: 10em;
}

div#content form textarea {
 clear: left;
 float: left;
 margin-bottom: 1em;
 margin-left: 10px;
 padding: 2px;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 1.1em;
 width: 40em;
}

div#content form input.checkbox {
 clear: left;
 width: auto;
}

div#content input.text {
 background-color: #ffffff !important; /* Stop yellow colouring of auto-fill boxes */
}

/**********/
/* Errors */
/**********/

div#content div.error {
 background-color: #ff0000;
 padding: 1px 10px;
 color: #ffffff;
}

/****************/
/* Testimonials */
/****************/
div.testimonial {
 background-image: url(images/quote_left.gif);
 background-repeat: no-repeat;
 background-position: top left;
 padding-top: 6px;
 padding-left: 15px;

}

* html div.testimonial {
 	padding-top: 0;
}

div.testimonialinner {
 background-image: url(images/quote_right.gif);
 background-repeat: no-repeat;
 background-position: bottom right;
 padding-right: 10px;
 padding-bottom: 2px;

}

* html div.testimonialinner {
 	padding-bottom: 0;
}


div.testimonialinner p {
 	padding: auto;
 	margin: auto;
}

p.testimonee {
 	margin-top: 0;
 	padding-top: 0;
 	
}

* html p.testimonee {
 	margin-top: -15px;
}

.testimonee {
 	color: #0082C3;
 	font-weight: bold;
 	padding-bottom: 10px; 
 	border-bottom: 1px solid #ddd;
}

address {
 	font-style: normal;
 	margin-bottom: 20px;
}

address span.name {
 	font-weight: bold;
}

/*************/
/* Right Col */
/*************/
div#rightcol {
 	float: right;
 	width: 210px;
 	display: inline;
 	background-color: #f7f7f7;
 	text-align: left;
 	padding: 0;
 	margin: 25px 10px 15px;
}

div#rightcol img, div#rightcol object, div#rightcol embed {
	padding-bottom: 2px;
 	margin-bottom: 10px;
}

div#rightcol div.box {
	width: auto;
	background-color: transparent;
	padding: 10px;
	margin-bottom: 10px;
	border: 1px solid #c7c7c7;
	background-color:#ddd
}

div#rightcol div.box h3 {
	width: auto;
	color: #373737;
	font-size: 1em;
	text-align: left;
	color: #393939;
	padding-top: 0px;
	margin: 0 0 5px;
}

div#rightcol div.box ul li {
	font-size: 1em;
 	list-style-type: none;
 	padding: 5px 0 0;
 	border-top: 1px solid #fff;
 	margin: 0 0 5px;

}

div#rightcol div.box ul.actions {
	padding: 0;
 	border-top: 1px solid #fff;
 	margin: 0 0 5px;
}

div#rightcol div.box ul.actions li {

	list-style-type: none;
	color: #fff;
}

div#rightcol div.box ul.actions li a {
	color: #393939;
	text-decoration: none;
}

div#rightcol div.box ul.actions li a:hover,
div#rightcol div.box ul.actions li a:active
 {
	color: #0082c3;
	text-decoration: none;

}

/*****************/
/* Footer Styles */
/*****************/

div#footer {
	clear: both;
  	background: #000;
 	text-align: left;
 	padding: 5px 15px 10px;
 	margin: 0 0 10px;
}

div#footer div.line {
 	display: none;
}

ul#footer-navigation {
	list-style: none;
 	padding: 10px 0 0;
 	margin: 0;
}

ul#footer-navigation li {
 	display: inline;
 	padding: 2px 0;
}

ul#footer-navigation li.first {
 	
}

ul#footer-navigation li a {
 	padding: 0 15px 0 0;
 	color: #fff;
 	text-decoration: none;
}

ul#footer-navigation li a:hover {
 	text-decoration: underline;
}

div#footer p {
 	font-size: .75em;
 	color: #fff;	
 	margin: 10px 0 0 0;
}

div#footer a {
 	text-decoration: none;
 	color: #fff;
}

div#footer a:hover {
 	text-decoration: underline;
}


/*************************/
/* IE5.5 Box Model Hacks */
/*************************/

/*
* html div#header {
 height: 183px;
 he\ight: 183px;
}
*/

* html ul#header-navigation {
 height: 32px;
 he\ight: 32px;
 padding-top: 5px;
}

/*
* html div.box {
 width: 165px;
 w\idth: 159px;
}

* html div.box h3 {
 height: 19px;
 he\ight: 18px;
}

*/

