* { margin:0; padding:0; }
/* font-size for tables is not inherited in IE5.x */
body {
	font: 11px/140% Tahoma, Arial, Verdana, sans-serif;
	background: url('images/bg-wrapper.gif') repeat top left; /*dots*/
	color: #595959;
	/*text-align: center; IE centering - breaks IE6&7 reposition.js*/
	padding: 0 0 15px 0; /* some space under footer */
}
img, :link img { border: none; }

a { color: #595959; text-decoration: underline; }
a:hover { text-decoration: none; }
.text a { color: #416cba; text-decoration: underline; }
.text a:hover { text-decoration: none; }

hr { /* Do not use HR tags - Class HR */
	height: 1px;
	border: none;
	/*  background-color: #aeaeae; */ /* Used in FF, Opera...*/
	/*  color: #aeaeae; */ /* Used in IE instead of background*/
}

#wrapperOuter {
	background: url('images/bg-wrapper-outer.gif') repeat-y top left; /*shadow*/
	margin: 0 auto; /* FF, Opera... centering */
	width: 919px;
	padding: 0px 15px; /*go fix IE5 - width: 949px*/
	text-align: left;
}
.wrapperFoot { /*bottom ending line*/
	margin: 0 -6px;
	height: 1px;
	background-color: #dadada;
	overflow: hidden;
}

.clear {
	clear: both;
	width: 0px; /* 	width: 100%; for IE ??? */
	height: 0px;
	overflow: hidden;
	font-size: 1px; /* needed for IE5.x <div class="clear"></div> */
}
.hr {
	background-color: #aeaeae;
	margin: 0;
	padding: 0;
	border: none;
	height: 1px;
	overflow: hidden;
}


/* ============================ */
/* Header - logo + header links */
#header {
	height: 48px;
	padding: 11px 0px; /* go fix IE5 - height:70px */
}
#logo {
	float: left;
	text-align: left;
	padding: 0 20px; /* margin do not work in IE5.x & IE6 */
}
#headerNavigation { float: right; text-align: right; }
#headerNavigation p { margin: 4px 0 0 0; }
#headerNavigation p.links {
 	text-align: right;
	padding: 0 0 5px 0;
	background: url('images/dotted-line.gif') repeat-x bottom left;
}

/* ========================== */
/* Navigation - menu + search */
#navigation {
	border-color: #e4e3e6 #ffffff #d5d5d5 #ffffff;
	border-width: 2px 0 2px 0;
	border-style: solid none solid none;
	padding: 2px 0;
	height: 51px;
}
#search, #menuNavigation { height: 51px; }
#search {
	float: left;
	text-align: left;
	width: 189px;
	background: #cc0000 url('images/bg-nav-search.gif') no-repeat center left; /*color to fix validator Warning*/
	color: #ffffff;
}
#search div { padding: 5px 15px 0px 15px; }
#search .inputText {
	border: none;
	width: 130px;
	padding: 2px;
	font-size: 11px;
	vertical-align: middle; /*or use position:relative + top:Xpx + height:XXpx*/
}
#search .inputImage {
	border: none;
	width: 17px;
	height: 17px;
	vertical-align: middle; /*or use position:relative + top:Xpx + height:XXpx*/
}
#menuNavigation {
	float: left;
	background: url('images/bg-menu.gif') repeat-x center left; /*color to fix validator Warning*/
	color: #ffffff;
	width: 730px;
	font-size: 12px;
	font-weight: bold;
}
#menuNavigation ul { list-style-type: none; margin: 0 0 0 13px; }
#menuNavigation li { float: left; }
#menuNavigation a {
	float: left;
	display: block;
	height: 21px;
	padding: 20px 20px 10px 20px;
	background: #cc0000 url('images/menu-button2.gif') no-repeat top center; /*color to fix validator Warning*/
	color: #ffffff;
	text-decoration: none;
}
#menuNavigation a:hover { background: url('images/menu-button2.gif') no-repeat bottom center; }

/* ================== */
/* flash presentation */
#presentation {
	border: 1px solid #d0d0d0;
	height: 190px;
	margin: 2px 0 0 0;
	padding: 0px 1px;
}

/* =========== */
/* #leftColumn */
#leftColumn {
	float: left;
	width: 212px;
	border: 1px solid #e4e4e4; /*go fix IE5 - width: 214px; */
	margin: 22px 0 0 0; /*same top-margin as #content*/
}
#leftColumn a { color: #416cba; text-decoration: underline; }
#leftColumn a:hover { text-decoration: none; }
#leftColumn .hr { margin: 13px 0 6px 0; }


/* ========= */
/* #mainMenu */
#mainMenu ul { list-style-type: none; }
#mainMenu a {
	display: block;
	height: 18px;
	border-bottom: 1px solid #ffffff;
	text-decoration: none;
	padding: 1px 0 0 0;
}
#mainMenu a.l1 {
	text-indent: 8px;
	background: #ce1920 url('images/menu-l1.gif') no-repeat top right;
	color: #ffffff;
}
#mainMenu a.l1Open {
	text-indent: 8px;
	background: #ce1920 url('images/menu-l1-open.gif') no-repeat top right;
	color: #ffffff;
}
#mainMenu a.l2, #mainMenu a.l2Open {
	text-indent: 21px;
	background: #838383 url('images/arrow-l2.gif') no-repeat center left;
	color: #ffffff;
}
#mainMenu a.l3, #mainMenu a.l3Open {
	text-indent: 28px;
	background: #b5b5b5 url('images/arrow-l3.gif') no-repeat center left;
	color: #3c3c3c;
}
#mainMenu a.l4 {
	text-indent: 37px;
	background: #d9d9d9 url('images/arrow-l4.gif') no-repeat center left;
	color: #3c3c3c;
}
#mainMenu a.l4Open {
	text-indent: 37px;
	background: #ffffff url('images/arrow-l4.gif') no-repeat center left;
	color: #ec1d25;
}
#mainMenu a.l1:hover, #mainMenu a.l1Open:hover {
	background: url('images/menu-l1-over.gif') no-repeat top right;
}
#mainMenu a.l2:hover, #mainMenu a.l3:hover, #mainMenu a.l4:hover, #mainMenu a.l2Open:hover, #mainMenu a.l3Open:hover {
	background-color: #eeeeee;
	color: #3c3c3c;
}

/* ======= */
/* #footer */
.footLine { /* instead of HR */
	height: 2px;
	border: none;
	background-color: #d5d5d5;
	margin: 40px 0 0 0;
	overflow: hidden;
}
#footer p { float: left; padding: 10px 5px 0px 5px; }
#footer .designedBy { float: right; padding: 0 0 10px 0; }
.designedBy img { padding: 4px 7px 0 0; width: 58px; height: 20px; }
.designedBy a { text-decoration: none; }

/* ===================== */
/* #content declarations */
#content {
	float: left;
	width: 678px;
	margin: 22px 0 0 27px; /*go fix IE5 - width: 705px; */
	text-align: left;
}

#contentFrontPage .content1Col1, #sitemap .contents1Col1 { float: left; width: 46%; }
#contentFrontPage .content1Col2, #sitemap .contents1Col2 { float: right; width: 46%; }

#contentCategory .content2Col1, #contentCategory .content2Col2, #contentCategory .content2Col3 {
	float: left;
	width: 31%;
	margin: 0 11px 0 0;
}

#contentCategory h3 { color: #ec1d25; }

#contentArticle { margin: 0 15px 0 0; }
#contentArticle div.specs { margin: 40px 0 0 0; }
#contentArticle div.specs h3 { color: #50504e; background-color: #c1c1c1; padding: 3px 10px; font-size: 11px; }
#contentArticle table.download { margin: 20px 0 0 0; }
#contentArticle table.download, #contentArticle table.specs { width: 100%; border-collapse: collapse; }

#contentArticle table.download td, #contentArticle table.download th, #contentArticle table.specs th, #contentArticle table.specs td {
	border-color: #ffffff;
	border-width: 2px;
	border-style: solid none solid none;
	padding: 2px 10px;
}
#contentArticle table.download th, #contentArticle table.specs th {
	color: #ffffff;
	background-color: #838383;
}
#contentArticle table.download tr.trMouseOut, #contentArticle table.specs tr.trMouseOut {
	color: #50504e;
	background-color: #dadada;
}
#contentArticle table.download tr.trMouseOn, #contentArticle table.specs tr.trMouseOn {
	background: #eee;
}

#contentArticle table.download img {
	height: 20px;
}

#contentArticle .content3Col1 { float: left; width: 220px; }
#contentArticle .content3Col2 { float: right; width: 418px; }
#contentArticle .content3Col2 p { text-align: justify; }

#contentArticle table.download td.icons { width: 30px; text-align: right; }
#contentArticle table.specs .col1 { width: 70%; }
#contentArticle table.specs .col2 { width: 30%; }

#contentArticle .accessories { padding: 30px 0 0 0; }
#contentArticle .accessories .content3Col3 { float: left; width: 310px; }
#contentArticle .accessories .content3Col4 { float: right; width: 310px; text-align: right; }
#contentArticle .accessories .box { width: 310px; height:150px; }

#contentPage .blockContent { margin: 0 15px 0 0; }
#contentPage .blockContent p { margin: 10px 0 0 0; text-align: justify; }



/* ========== */
/* blockHead */
#leftColumn h2.blockHead {
	background: #dddddd url('images/block-head.gif') repeat-x top left;
	height: 21px;
	color: #ffffff;
	padding: 3px 10px 0px 12px;
	font-size: 12px;
}
#content .blockHead h2 { color: #ec1d25; font-size: 12px; font-weight: bold; }
#content .blockHead .hr {
	margin: 4px 10px 0 0;
	background-color: #c8c8c8;
	height: 1px;
}
#content .blockHead .icon {
	float: right;
	height: 50px;
	position: relative; /*fixes IE5-6 bug with negative margins*/
}
#contentFrontPage .blockHead .icon {
	margin: -15px 0 0 0;
}
#contentCategory .blockHead .icon {
	margin: 0;
}
#contentArticle .blockHead {
	margin: 0 0 10px 0;
}


/* ============= */
/* blockContent */
#leftColumn .blockContent { font-size: 12px; padding: 9px 10px 2px 15px; }
#leftColumn .blockContent p.date { font-size: 10px; color: #416cba; }
#leftColumn .blockContent h3 a, #leftColumn .blockContent h3 {
	font-size: 11px; color: #ec1d25; text-decoration: none;
}
#leftColumn .blockContent h3 a:hover { text-decoration: underline; }
#leftColumn .blockContent p { font-size: 11px; }
#content .blockContent h3 { font-size: 11px; font-weight: bold; }

/* =========== */
/* .BOX */
.box {
	background-color: #ededed;
	margin: 10px 0 0 0;
	text-align: left;
}
.boxTop {
	background: url('images/box-top.gif') no-repeat top left;
	height: 5px;
	width: 31px;
	position: relative;
	top: -1px;
	left: -1px;
	font-size: 1px; /* fixes IE5-6 */
/*	margin: 0 -1px -1px 0; */
}
/* Interesting issue:
When use position:absolute, and right after that float a div, the floated div moves .boxTop after the float!
This is in IE7!
*/
#contentCategory .content2Col1 .box, #contentCategory .content2Col2 .box, #contentCategory .content2Col3 .box {
	height:320px;
}
#contentFrontPage .box { height: 320px; }


/* boxHead */
#contentFrontPage .boxHead { padding: 10px 22px 0 22px; }
#contentCategory .boxHead { padding: 10px 8px 0 8px; }
#contentArticle .accessories .boxHead { padding: 15px 8px 0 8px; }
.boxHead a { text-decoration: none; }
#contentFrontPage .boxHead a span { color: #ec1d25; }
#contentCategory .boxHead h3 a { color: #ec1d25; }
#contentArticle h3 a { color: #ec1d25; }

/* prodTitle - in .boxHead */
.boxHead .prodTitle { padding: 0 0 12px 0; }

/* boxContent */
#contentFrontPage .boxContent { padding: 0 22px 20px 22px; }
#contentCategory .boxContent, #contentArticle .accessories .boxContent { padding: 0 8px 8px 8px; }

/* .boxContent .prodIcon */
.boxContent .prodIcon {
	height: 150px;
	background-color: #ffffff;
	color: #000000; /*Validator warning - color and BG are the same*/
	border: 1px solid #e3e3e3;
	position: relative;
}
.prodIcon table { width: 100%; height: 100%; position: relative; }
.prodIcon td { vertical-align: middle; text-align: center; }

/* .boxContent .prodZoom */
.boxContent .prodZoom, div.prodZoom {
	text-align: right;
	margin: 4px 0 0 0;
	height: 22px;
	clear: both;
}
.prodZoom a {
	background: url('images/button-zoom.gif') top left;
	float: right;
	display: block;
	height: 22px;
	width: 22px;
	cursor: url("highslide/graphics/zoomin.cur"), pointer;
    outline: none;
}
div.prodZoomSmall {
	text-align: right;
	padding: 3px 0 0 0;
	height: 17px;
	width: 17px;
	clear: both;
}
.prodZoomSmall a {
	background: url('images/button-zoom-small.gif') top left;
	display: block;
	height: 17px;
	width: 17px;
	cursor: url("highslide/graphics/zoomin.cur"), pointer;
    outline: none;
}


/* .boxContent .prodDesc */
.boxContent .prodDesc { padding: 12px 0 0 0; }

/* .boxContent .prodLink */
.boxContent .prodLink { text-align: right; }

/* BREADCRUMB */
.breadcrumb { margin: 5px 0 0 0; }
.breadcrumb span { color: #a8a8a8; }

/* Formatting Input forms */
.inputText { border: 1px solid; }

/* Main product photo */
#contentArticle .content3Col1 .prodIcon { border: 1px solid #e4e4e4; height: 150px; }

/* Accessories photos */
	/*Fixes IE 5-6 - not displaying in the right place the floated accessories*/
#contentArticle .accessories .content3Col3 .box { float: left; }
#contentArticle .accessories .content3Col4 .box { float: right; } /* left also possible*/
	/* .boxContent .boxImage */
#contentArticle .accessories .boxImage { float: left; margin: 20px 20px 0 8px; }
#contentArticle .accessories .boxImage .prodIcon { background-color: #ffffff; width: 130px; height: 80px; }
#contentArticle .accessories .prodDesc { padding: 0; }

#contentArticle .articleActions img { margin: 0px 5px; }

p.iconPrint, p.iconContact, p.iconEmail, p.iconDownload {
	margin: 2px 0;
}
p.iconPrint .first, p.iconContact .first, p.iconEmail .first, p.iconDownload .first {
	display: block;
	float: left;
	height: 14px;
	width: 14px;
	padding: 0 5px 0 0;
}
p.iconPrint {
	background: url('images/icon-print.gif') no-repeat center left;
}
p.iconContact {
	background: url('images/icon-contact.gif') no-repeat center left;
}
p.iconEmail {
	background: url('images/icon-email.gif') no-repeat center left;
}
p.iconDownload {
	background: url('images/icon-download.gif') no-repeat center left;
}


#contentNews .date { float: left; width: 100px; margin: 10px 0 0 0; }
#contentNews .text { float: left; width: 560px; margin: 10px 0 0 0; }
#contentNews .text h3 a { font-size: 11px; color: #416cba; }
#contentNews .text p { text-align: justify; }

#contentNewsArticle div.text { margin: 10px 0 0 0; }
#contentNewsArticle .text p { text-align: justify; }

#contentSearch #searchForm { margin: 5px 0 10px 0; }
#contentSearch div.data { margin: 10px 0 0 0; }
#contentSearch .data h3 a, #contentSearch .data p a { font-size: 11px; color: #416cba; }

#contactForm {
	width: 530px; /* may be Ems will be better for resizing */
	padding: 5px;
}
#contactForm h2 {
	font-size: 12px;
}
#contactForm form {
	width: 100%;
	font-size: 11px;
	margin: 10px 0 20px 0;
}
#contactForm form textarea {
	width: 280px;
	height: 200px;
}
#contactForm .form_desc {
	clear: both;
	float: left;
	width: 140px; /* may be Ems will be better for resizing */
	padding: 0 5px;
}
#contactForm .form_input {
	float: left;
	width: 360px; /* may be Ems will be better for resizing */
}
#contactForm .form_desc, #contactForm .form_input {
	margin-top: 5px;
}
#contactForm form select,
#contactForm form textarea,
#contactForm form input {
	border: 1px solid #b2b2b2;
	padding: 2px;
	color: #595959;
	font: 11px/140% Tahoma, Arial, Verdana, sans-serif;
}

#contactForm .form_input {
	position: relative; /* to work with ABSOLUTE positioning of hints */
}

#contactForm div span.hint {
	/* font: normal 11px/14px verdana; */
	background:#eee url(images/bg-span-hint-grey.gif) no-repeat top left;
	color:#444;
	border:1px solid #888;
	padding:5px 5px 5px 40px;
	width:250px;
	position:absolute;
	margin: -12px 0 0 24px;
	display:none;
	z-index: 100;
}

#contactForm div.welldone span.hint {
	background:#9fd680 url(/images/bg-span-hint-welldone.jpg) no-repeat top left;
	border-color:#749e5c;
	color:#000;
}
#contactForm div.kindagood span.hint {
	background:#ffffcc url(images/bg-span-hint-kindagood.jpg) no-repeat top left;
	border-color:#cc9933;
}
/*
#contactForm div.welldone {
	background:transparent url(images/bg-fieldset-welldone.gif) no-repeat center right;
	padding-right: 20px;
}
*/
#contactForm div div.error {
	color: #ff0000;
}
#contactForm div.welldone div.error {
	visibility: hidden;
	/* display: none; */ /* or may be better is: visibility: hidden; */
}
#contactForm .required {
	color: #ff0000;
}

#contactForm div.error p {
	margin:0;
	padding:0;
}
#contactForm .inputSubmit {
	background-color: #ffffff;
}
#contactForm .notes p {
	text-align: left;
	padding: 2px;
}
#contactForm form .inputImage {
	border: none;
}
/* CAPTCHA FORMATTING (+ all inputsText) */
#contactForm .inputText, #contactForm .inputCaptcha {
	width: 170px;
}
#contactForm .inputCaptcha {
	margin: 5px 0 0 0;
}
#contactForm .imgCaptcha {
	border: 1px solid #b2b2b2;
}

div div.form_status1 {
	display: none;
	position: absolute; /* this is the key!? for TEXTAREA */
/*	top:0; */ /* not needed for inputs but for OPERA for textareas */
	padding: 7px;
	border: 1px solid #ffffff;
}
div.welldone div.form_status1 {
	display: inline;
	background: transparent url(images/bg-fieldset-welldone.gif) no-repeat top right;
}

.imgCaptcha { padding: 2px; }

#searchForm form input {
	border: 1px solid #b2b2b2;
	padding: 2px;
	color: #595959;
	font: 11px/140% Tahoma, Arial, Verdana, sans-serif;
}
#searchForm form .inputImage {
	border: none;
	padding: 0;
	margin: 0;
}
#searchForm form .srch1 {
	float: left;
}
#searchForm form .srch2 {
	float: left;
	margin: 0 4px;
}

#sitemap ul { list-style-type: none; }
#sitemap .blockHead h2 {
	padding: 1px 10px 1px 10px;
	background-color: #ec1d25;
	color: #ffffff;
}
#sitemap .blockContent {
	padding: 5px 10px 5px 10px;
}

/* Page navigation styling */
.pagenav {
	clear: both;
	text-align: center;
	margin: 10px 0px;
}
/*
.pagenav a, .pagenav .pg_current {
	padding: 2px 2px;
}
.pagenav a:hover {
	background-color: #EBF6FC;
	text-decoration: none;
	color: #000000;
	border: 1px solid #99DAFA;
}
*/

.pagenav a {
	padding: 2px 10px;
	border: 1px solid #e3e3e3;
	background-color: #e3e3e3;
}
.pagenav a:hover {
	background-color: #ffffff;
	text-decoration: none;
	color: #000000;
}
.pagenav .pg_current {
	padding: 2px 10px;
	border: 1px solid #e3e3e3;
}

.mailError, .mailNotSuccessfull, .mailSuccessfull {
	margin: 10px 0;
	padding: 20px;
	background: #f3f3f3;
	border: 1px solid #bbbbbb;
	text-align: justify;
	/* font-weight: bold; */
}
.mailError {
	color: #ff0000;
}
.mailNotSuccessfull {
	color: #000000;
}
.mailSuccessfull {
	color: #54ad00;
}

#contentFrontPage2 { margin: 0px 0 30px 0; }
#contentFrontPage2 h2 { color: #ec1d25; font-size: 12px; }


#contentCategory .content2Col41, #contentCategory .content2Col42, #contentCategory .content2Col43 {
	float: left;
	width: 31%;
	margin: 0 11px 0 0;
}

#contentCategory .content2Col41 .box, #contentCategory .content2Col42 .box, #contentCategory .content2Col43 .box {
	height:250px;
}
#contentCategory .content2Col41 .prodIcon, #contentCategory .content2Col42 .prodIcon, #contentCategory .content2Col43 .prodIcon {
	width: 190px;
	height: 110px;
	background-color: #ffffff;
	color: #000000; /*Validator warning - color and BG are the same*/
	border: 1px solid #e3e3e3;
	margin: 0 auto;
}
#contentCategory .content2Col41 .boxHead, #contentCategory .content2Col42 .boxHead, #contentCategory .content2Col43 .boxHead, #contentCategory .content2Col41 .boxContent, #contentCategory .content2Col42 .boxContent, #contentCategory .content2Col43 .boxContent {
	text-align: left;
}

#contentClients .client { margin: 20px 0 0 0; }
#contentClients .image { float: left; width: 104px; height: 73px; margin: 0 15px 0 0; border: 1px solid #e2e2e2; }
#contentClients .image table { width: 100%; height: 100%; position: relative; }
#contentClients .image td { vertical-align: middle; text-align: center; }

#contentClients h3 a { font-size: 11px; color: #416cba; text-transform: uppercase; }
#contentClients .text, #contentClients .text p { text-align: justify; }
#contentClients .text { padding: 0 10px 0 0; }

#contentClient .blockContent { padding: 15px 0 0 0; }
#contentClient .image { float: left; width: 160px; margin: 0 10px 0 0; text-align: center; border: 1px solid #e2e2e2; }
#docs { clear: both; padding: 10px 0 0 0; }
#docs td { padding: 2px 15px 2px 0; }


/*FIX - Big letters for tables. Why?*/
#contentArticle table { font-size: 11px; }