@import url("reset.css");
@import url("menus.css");

/* ============================================================================
Common elements
============================================================================ */

body {
	margin:0;
	padding:0;
	font: 12px Arial, Helvetica, sans-serif;
	text-align: center;
	background: #4C4C4C;
}

a:link {color: #06C;}
a:visited {color: #50C1F0;}
a:hover {color: #FE2F05;text-decoration:none;}
a:active {color: #FE2F05;}
strong {font-weight: bold;}
.align-right {text-align: right;}
hr.clear {clear: both;visibility: hidden;height: 0;padding: 0;margin: 0;}

/* ============================================================================
Global positioning
============================================================================ */
#wrapper {
	width: 100%;
	background: #FFF url(../graphics/bg-page.gif) bottom repeat-x;
	padding-bottom: 20px;
}
#wrapper:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#wrapper {display:inline-block;}
/* Hide from IE Mac \*/
#wrapper {display:block;}
/* End hide from IE Mac */
/* ============================================================================
Header
============================================================================ */
#header {width: 911px;margin: 0 auto;text-align: left; overflow:hidden;}
#logo img {margin: 4px 0 6px 0;}
#top-tools{margin-right:-8px;}

/* ============================================================================
Billboard
============================================================================ */
#billboard {max-height: 210px;width: 100%;margin-bottom: 30px;overflow: hidden;}
#billboard div {
	height: 210px;
	overflow: hidden;
}
#billboard div div {
	height: 210px;
	width: 100%;
	background-position: center !important;
	background-repeat: no-repeat !important;
	overflow: hidden;
}
#billboard div div span {
	display:block;
	width:911px;
	margin:0 auto;
}
#billboard div div a {
	display:block!important;
	width:107px;
	height:18px!important;
	margin-top:177px;
	margin-left:151px;
}
#img-nav {
	position:relative;
   z-index:5000;
}
#img-nav:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#img-nav {display:inline-block;}
/* Hide from IE Mac \*/
#img-nav {display:block;}
/* End hide from IE Mac */
#img-nav-holder {
	width:911px;
	margin:0 auto;
	text-align: right;
	margin-top:-80px;
	margin-bottom:49px;
}
#img-nav a {
	display:block;
	width:31px;
	height:31px;
	margin-left:1px;
	background-color: Aqua;
	float:right;
	background: url(../graphics/button-previous.gif);
}
#img-nav a.pause {background: url(../graphics/button-pause.gif);}
#img-nav a.play {background: url(../graphics/button-play.gif);}
#img-nav a.previous {background: url(../graphics/button-previous.gif);}
#img-nav a.next {background: url(../graphics/button-next.gif);}
/* ============================================================================
Content
============================================================================ */
#content {width: 911px;text-align: left;margin: 0 auto;}   
#content:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#content {display:inline-block;}
/* Hide from IE Mac \*/
#content {display:block;}
/* End hide from IE Mac */

/* ============================================================================
Main content
============================================================================ */
#frontpage #main-content {width: 744px;}
#detailpage #main-content {width: 558px;}
#main-content {float:left;line-height: 150%;}   
#main-content:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#main-content {display:inline-block;}
/* Hide from IE Mac \*/
#main-content {display:block;}
/* End hide from IE Mac */

/* ============================================================================
Related content
============================================================================ */
#related-content {width: 167px;float: left;overflow: hidden;}  
#detailpage #related-content {padding-left: 19px} 
#related-content:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#related-content {display:inline-block;}
/* Hide from IE Mac \*/
#related-content {display:block;}
/* End hide from IE Mac */

/* ============================================================================
Paragraphs 
============================================================================ */

/* LAYOUT OF FLOATING BOXES */
.body-box {padding-left: 19px;float:left;}
#frontpage .body-box {width: 477px;}
#detailpage .body-box {width: 539px;}

.section-box {width: 229px;padding-left: 19px;float: left;overflow: hidden;}
#related-content .section-box {width: 167px;padding-left: 0;}

/* BODY BOXES - for bodytext 
-------------------------------- */
#main-content .body-box .img-right-txt-left .img-container,
#main-content .body-box .img-left-txt-right .img-container {display: inline !important;}
#main-content .body-box .img-right-txt-left .img-container table {float: right;margin: 0 0 5px 19px;}
#main-content .body-box .img-left-txt-right .img-container table {float: left;margin: 0 19px 5px 0;}
#main-content .body-box .img-bottom-txt-top .img-container table,
#main-content .body-box .img-top-txt-bottom .img-container table {margin: 0 0 15px 0;}

#main-content .body-box .img-right-txt-left .img-container table .images img,
#main-content .body-box .img-left-txt-right .img-container table .images img,
#main-content .body-box .img-top-txt-bottom .img-container table .images img,
#main-content .body-box .img-bottom-txt-top .img-container table .images img {border: 1px solid #CCC;padding:2px;}

#detailpage #main-content .body-box .img-top-txt-bottom .txt-container,
#detailpage #main-content .body-box .img-bottom-txt-top .txt-container {width:539px;}
#main-content .body-box .txt-container h1 {font-size: 22px;margin-bottom: 18px;font-weight:normal;text-transform: uppercase;}
#main-content .body-box .txt-container h2 {font-size: 15px;margin-bottom: 5px;font-weight:bold;color: #FE2F05;}
#main-content .body-box .txt-container h3 {font-size: 15px;margin-bottom: 5px;font-weight:bold;}
#main-content .body-box .txt-container h4 {font-weight: bold;margin-bottom: 0;}
#main-content .body-box .txt-container p {margin-bottom: 15px;}
#frontpage #main-content .body-box .txt-container p {font-size: 15px;}

#main-content .body-box .txt-container p .text2 {font-size: 12px;margin-bottom: 15px;}
#main-content .body-box .txt-container ul {margin-bottom: 15px;}
#main-content .body-box .txt-container ul li {padding: 2px 0 2px 15px;margin-bottom:0!important;background: url(../graphics/arrow.gif) left no-repeat;}
#main-content .body-box .txt-container ol {margin-left: 25px; list-style:decimal;}
#main-content .body-box .txt-container ol li {margin-bottom: 15px;}

#main-content .body-box .txt-container table {border-collapse: collapse;width: 100%;margin-bottom: 15px;margin-top: 5px;}
#main-content .body-box .txt-container table th {background: #b0b0b0;color: #FFF;padding: 5px 4px;}
#main-content .body-box .txt-container table td {padding: 5px 4px;}


#main-content .body-box .txt-container form {width:229px;margin-bottom:20px;}
#main-content .body-box .txt-container form label {font-weight:bold;}
#main-content .body-box .txt-container form input {width: 229px;font-family:Arial,Helvetica,Sans-serif;font-size: 11px;}
#main-content .body-box .txt-container form select {width: 229px;font-family:Arial,Helvetica,Sans-serif;font-size: 11px;}
#main-content .body-box .txt-container form input.button {
	background: #0080E0 url(../graphics/bg-global-menu-active.gif) center center repeat-x;
	border: 1px solid #0080E0;
	width: 139px;
	color: #FFF;
	font-weight: bold;
	padding: 2px;
	height: 24px;
	outline:none;
}

/* PRODUCTS BOX
------------------------------------------------------- */
#main-content .products {background: #ededed;padding: 16px 0;margin-bottom: 20px;}
#main-content .products:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#main-content .products {display:inline-block;}
/* Hide from IE Mac \*/
#main-content .products {display:block;}
/* End hide from IE Mac */

.products h1,
.products h2,
.products h3,
.products h4,
.products p {padding-left: 19px;margin-bottom: 15px !important;}

.products table {border: none; margin: 5px 0 0 0;}
.products td {padding: 0 0 10px 19px !important;border: none;width: 241px;}
#main-content .products img {
	float: left;
	max-width: 50px;
	max-height: 50px;
	_width: 50px;
	_height: 50px;
	overflow: hidden;
	margin: 0 15px 30px 0;
}


/* BOXES - infobox and actionbox - for related content and links 
----------------------------------------------------------------- */

#related-content .info-box,
#related-content .action-box {margin-bottom: 20px;}
.info-box,
.action-box {border-top: 3px solid #000;padding-top:1px;margin-bottom: 0;}
.info-box:after,
.action-box:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.info-box,
.action-box {display:inline-block;}
/* Hide from IE Mac \*/
.info-box,
.action-box {display:block;}
/* End hide from IE Mac */

.info-box h1,
.action-box h1,
.info-box h2,
.action-box h2,
.info-box h3,
.action-box h3 {
	font-weight: bold;
	font-size: 15px;
	margin-bottom: 8px;
	line-height: 15px;
	padding: 0;
	line-height: 15px;
}
.info-box h1,
.info-box h2,
.info-box h3 {margin-top: 8px;}
.action-box h2 {color: #FE2F05;}
.info-box .img-container,
.action-box .img-container {overflow: hidden; display: inline;}

#related-content .info-box .img-container td.images {background: #ededed; margin: 0; padding: 0;}
#related-content .info-box .txt-container {background: #ededed;padding: 6px 10px;}
.info-box .txt-container,
.action-box .txt-container {padding: 6px 0 0 0;}
.info-box .txt-container p,
.action-box .txt-container p {margin-bottom: 15px;line-height: 15px;}

.info-box ul {margin-bottom: 15px;line-height: 15px;}
.info-box ul li {margin: 15px 0;}
.info-box .txt-container a {padding: 5px 0 5px 15px;background: url(../graphics/arrow.gif) left no-repeat;}
.action-box ul {margin-bottom: 8px;}
.action-box ul li {border-bottom: 1px solid #FFF;overflow: hidden;}
.action-box li a {
	display: block;
	width: 179px;
	padding: 6px 10px 6px 40px;
	color: #000;
	text-decoration: none;
	font-weight:bold;
	background: #ededed url(../graphics/next-step-std-bullet.gif) 8px 8px no-repeat;
}
.action-box li a:hover {text-decoration: underline;}
a.trail {background: #ededed url(../graphics/icon-application.gif) 8px 8px no-repeat!important;}
a.demo {background: #ededed url(../graphics/icon-computer.gif) 8px 6px no-repeat!important;}
a.factsheet {background: #ededed url(../graphics/icon-document.gif) 8px 6px no-repeat!important;}
a.contact {background: #ededed url(../graphics/icon-phone.gif) 8px 6px no-repeat!important;}

/* ============================================================================
Footer
============================================================================ */
#footer {width: 911px;margin: 10px auto;text-align: left;padding-bottom: 20px;}
#footer:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#footer {display:inline-block;}
/* Hide from IE Mac \*/
#footer {display:block;}
/* End hide from IE Mac */

#footer h2,
#footer legend {color: #FFF;font-size: 15px;font-weight: bold;margin-bottom: 15px;}
#footer form {width: 477px;	padding-left: 186px;float: left;}
#footer form label {display: block;color: #b0b0b0;font-size: 11px;margin-bottom: 3px;}
#footer form input {
	width: 306px;
	background: #dbdbdb;
	border: none;
	margin-bottom: 8px;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 2px;
	height: 19px;
}
#footer form input.button {
	background: #0080E0 url(../graphics/bg-global-menu-active.gif) center center repeat-x;
	border: 1px solid #0080E0;
	width: 139px;
	color: #FFF;
	font-weight: bold;
	padding: 2px;
	height: 24px;
	outline:none;
}
#footer form textarea {
	width: 391px;
	height: 119px;
	background: #dbdbdb;
	border: none;
	margin-bottom: 8px;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
}
#address {width: 223px;padding-left: 19px;float: left;font-size: 11px;}
#address em {color: #b0b0b0;font-style: normal;}
#address p {margin-bottom: 15px;color:#FFF;}
#address a {color: #FFF;text-decoration:underline;}
#address a:hover {color: #FFF;text-decoration:none;}

#webdesign {width: 223px;padding-left: 19px;margin-top: 110px;float: left;font-size: 11px;}
#webdesign a {color: #777;text-decoration: none;padding-right: 16px;}
#webdesign a:hover {text-decoration: underline;}