/*############################################################################*/
/*                                                                            */
/* Pages Cascading Style Sheet (Mozilla)                                      */
/* Copyright 2010-2011 Russell Warburton                                      */
/*                                                                            */
/* Filename: /styles/current/pages/pages.css (css)                            */
/* Author: Russell Warburton (russell@warburnet.com.au)                       */
/*                                                                            */
/* No portion of this computer program may be used without prior written      */
/* permission from the author. This computer program is protected by          */
/* international copyright laws.                                              */
/*                                                                            */
/* Created: --/--/--                                                          */
/* Updated: 07/04/11 - head comment section added                             */
/* Updated: 08/04/11 - reduced height of div.cards to 50px                    */
/* Updated: 18/12/11 - removed image glow                                     */
/*                                                                            */
/*############################################################################*/

body, form, h1, h2, h3, h4, h5, h6, input, li, ol, p, select, td, textarea, tr, ul
										{ font-family: arial, sans-serif; }

body#page								{ width: 100%; height: 100%; border: 0px; margin: 0px auto; padding: 0px; color: #000000; background-color: #C0C0C0; }
table#page								{ width: 998px; height: auto; border: 0px; margin: 0px auto; padding: 0px; color: #000000; background-color: #FFFFFF; background-image: url('images/body.background.gif'); background-repeat: repeat; background-attachment: scroll; }

td#page_top								{ width: 100%; height: 100%; }
td#page_left							{ width: 166px; height: 100%; }
td#page_middle							{ width: 666px; }
td#page_right							{ width: 166px; height: 100%; }
td#page_bottom							{ width: 100%; height: 100%; }

table#content							{ width: 100%; table-layout: fixed; }

tr#overview td table					{ width: 100%; padding: 4px; }
tr#overview td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }
tr#overview td table tr td.image		{ width: 30%; vertical-align: top; text-align: center; }
tr#overview td table tr td.text			{ width: 70%; vertical-align: top; text-align: left; }

tr#detail td table						{ width: 100%; padding: 4px; }
tr#detail td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }
tr#detail td table tr td.image			{ width: 50%; vertical-align: top; text-align: center; }
tr#detail td table tr td.text			{ width: 50%; vertical-align: top; text-align: left; }

tr#contacts td table					{ width: 100%; padding: 4px; }
tr#contacts td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }
tr#contacts td table tr td.image		{ width: 30%; vertical-align: middle; text-align: center; }
tr#contacts td table tr td.text			{ width: 70%; vertical-align: top; text-align: left; }

tr#information td table					{ width: 100%; padding: 4px; }
tr#information td table tr th			{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }
tr#information td table tr td.image		{ width: 30%; vertical-align: middle; text-align: center; }
tr#information td table tr td.text		{ width: 70%; vertical-align: top; text-align: left; }

tr#pricing td table						{ width: 100%; padding: 4px; }
tr#pricing td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }

tr#samples td table						{ width: 100%; padding: 4px; }
tr#samples td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }

tr#similars td table					{ width: 100%; padding: 4px; }
tr#similars td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }

tr#enquiry td table						{ width: 100%; padding: 4px; }
tr#enquiry td table tr th				{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }

img										{ float: none; border: 0px; margin: 0px; }
img.float_left							{ float: left; margin: 8px; }
img.float_right							{ float: right; margin: 8px; }
img.float								{ float: none; margin: 8px; }

a:link									{ text-decoration: underline; color: #0000CC; background: transparent; }
a:visited								{ text-decoration: underline; color: #0000CC; background: transparent; }
a:hover									{ text-decoration: underline; color: #FF0000; background: transparent; }
a:active								{ text-decoration: underline; color: #0000CC; background: transparent; }
a:link img								{ border: none; }
a:visited img							{ border: none; }
a:hover img								{ border: none; }
a:active img							{ border: none; }

h1										{ font-size: 16pt; font-weight: bold; text-align: left; margin: 0; color: #000000; background: transparent; }
h2										{ font-size: 12pt; font-weight: bold; text-align: left; margin: 0; color: #000000; background: transparent; }
h3										{ font-size: 11pt; font-weight: bold; text-align: left; margin: 0; color: #000000; background: transparent; }

p.links									{ font-size: 10pt; font-weight: bold; text-align: center; color: #000000; margin-top: 6px; margin-bottom: 6px; }
p.phone									{ font-size: 12pt; font-weight: bold; text-align: center; color: #000000; margin-top: 2px; margin-bottom: 2px; }
p.address								{ font-size: 10pt; font-weight: normal; text-align: center; color: #000000; margin-top: 2px; margin-bottom: 2px; }
p.vat									{ font-size: 10pt; font-weight: normal; text-align: center; color: #000000; margin-top: 2px; margin-bottom: 2px; }
p.updated								{ font-size: 10pt; font-weight: normal; text-align: center; color: #000000; }
p.copyright								{ font-size: 8pt; font-weight: normal; text-align: center; color: #000000; }
p.slogan								{ font-size: 13pt; font-weight: bold; text-align: left; color: #008080; }
p.obsolete								{ font-size: 13pt; font-weight: bold; text-align: left; color: #FF0000; }
p.overview								{ font-size: 13pt; font-weight: normal; text-align: left; color: #000000; }
p.welcome								{ font-size: 14pt; font-weight: normal; text-align: left; color: #000000; }
p.debug									{ font-size: 8pt; font-weight: normal; text-align: left; color: yellow; background-color: black; margin: 0px; padding: 2px; }

td.h1									{ width: 100%; background-color: transparent; }
td.h2									{ width: 100%; height: 26px; background-color: #C0C0C0; background-image: url('images/h2.background.jpg'); background-position: top left; background-repeat: no-repeat; padding-left: 6; }
td.shortcuts							{ width: 100%; background-color: #F0F0F0; }

div.cards								{ display: block; width: 480px; height: 40px; margin-left: auto; margin-right: auto; }
div.cards div							{ display: inline-block; width: 50px; height: 33px; padding: 4px; border: 0px; margin: 0px; text-align: center; }

div.translator							{ width: 120px; height: 54px; margin-left: auto; margin-right: auto; }

img.preloaded_image						{ display: none; }

table.downloads							{ border: 2px inset #000000; background-color: #FFFFFF; }
table.downloads td						{ border: 1px solid black; color: #000000; }
table.downloads tr th					{ background-color: #000000; padding: 4px; color: #FF0000; }
table.downloads tr.odd td				{ background-color: #FFFFFF; padding: 4px; }
table.downloads tr.even td				{ background-color: #F0F0F0; padding: 4px; }

table.technical							{ border: 2px inset #000000; background-color: #FFFFFF; }
table.technical td						{ border: 1px solid black; color: #000000; }
table.technical tr th					{ background-color: #000000; padding: 4px; color: #FF0000; }
table.technical tr.odd td				{ background-color: #FFFFFF; padding: 4px; }
table.technical tr.even td				{ background-color: #F0F0F0; padding: 4px; }

table.pricing							{ border: 2px inset #000000; background-color: #FFFFFF; }
table.pricing td						{ border: 1px solid black; color: #000000; }
table.pricing tr th						{ background-color: #000000; padding: 4px; color: #FF0000; }
table.pricing tr.odd td					{ background-color: #FFFFFF; padding: 4px; }
table.pricing tr.even td				{ background-color: #F0F0F0; padding: 4px; }

div.preview								{ display: block; width: 100%; padding: 0px; border: 0px; margin: 0px; }
div.preview table						{ width: 100%; border: 0px; border-spacing: 3px; padding: 3px; }
div.preview table div					{ display: block; width: 100%; padding: 0px; border: 0px; margin: 0px; }
div.preview table tr.title				{ width: 100%; }
div.preview table tr.body				{ width: 100%; }
div.preview table tr.order				{ width: 100%; }
div.preview table tr.title th			{ width: 100%; background-color: #C0C0C0; padding: 3px 8px 3px 8px; }
div.preview table tr.body td.image		{ width: 30%; height: auto; vertical-align: middle; font-size: 9pt; font-weight: normal; text-align: center; }
div.preview table tr.body td.text		{ width: 70%; height: auto; vertical-align: top; font-size: 11pt; font-weight: normal; text-align: left; }
div.preview table tr.order td			{ width: 100%; height: auto; }

div.link								{ display: inline-block; width: 128px; padding: 0px; border: 0px; margin: 0px; text-align: center; }
div.link table							{ border: 0px; border-spacing: 0px; padding: 0px; margin: 0px auto; }
div.link table tr td div				{ display: block; width: 100%; text-align: center; padding: 0px; border: 0px; margin: 0px; }
div.link table tr.image					{ width: 100%; }
div.link table tr.image img				{ width: 80px; }
div.link table tr.title					{ width: 100%; }
div.link table tr.purchase				{ width: 100%; }
div.link table tr td div a:link			{ display: block; padding: 0px; border: 0px; margin: 0px; overflow: hidden; font-size: 8pt; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: top left; background-repeat: no-repeat; filter:blendTrans(duration=0.5); }
div.link table tr td div a:visited		{ display: block; padding: 0px; border: 0px; margin: 0px; overflow: hidden; font-size: 8pt; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: top left; background-repeat: no-repeat; filter:blendTrans(duration=0.5); }
div.link table tr td div a:hover		{ display: block; padding: 0px; border: 0px; margin: 0px; overflow: hidden; font-size: 8pt; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: underline; cursor: pointer; background-position: top left; background-repeat: no-repeat; filter:blendTrans(duration=0.5); }

div.sample								{ display: inline-block; width: 19%; padding: 0px; border: 0px; margin: 0px; text-align: center; }
div.sample table						{ border: 0px; border-spacing: 0px; padding: 0px; margin: 0px auto; }
div.sample table tr td div				{ display: block; width: 100%; text-align: center; padding: 0px; border: 0px; margin: 0px; }
div.sample table tr.image				{ width: 100%; }
div.sample table tr.title				{ width: 100%; }
div.sample table tr td div a:link		{ display: block; padding: 0px; border: 0px; margin: 0px; overflow: hidden; font-size: 8pt; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: top left; background-repeat: no-repeat; filter:blendTrans(duration=0.5); }
div.sample table tr td div a:visited	{ display: block; padding: 0px; border: 0px; margin: 0px; overflow: hidden; font-size: 8pt; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: top left; background-repeat: no-repeat; filter:blendTrans(duration=0.5); }
div.sample table tr td div a:hover		{ display: block; padding: 0px; border: 0px; margin: 0px; overflow: hidden; font-size: 8pt; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: underline; cursor: pointer; background-position: top left; background-repeat: no-repeat; filter:blendTrans(duration=0.5); }

div.column								{ display: inline-block; width: 216px; padding: 0px; border: 0px; margin: 0px; vertical-align: top; }
div.column table						{ width: 100%; border: 0px; border-spacing: 3px; padding: 3px; }
div.column table tr.title				{ width: 100%; height: 50px; background-repeat: no-repeat; }
div.column table tr.overview			{ width: 100%; height: 120px; background-repeat: no-repeat; }
div.column table tr.features			{ width: 100%; height: 400px; background-repeat: no-repeat; }
div.column table tr.purchase			{ width: 100%; height: 100px; background-repeat: no-repeat; }
div.column table tr.title td			{ vertical-align: middle; font-size: 12pt; font-weight: bold; text-align: center; }
div.column table tr.overview td			{ vertical-align: top; font-size: 10pt; font-weight: normal; text-align: center; }
div.column table tr.features td			{ padding: 20px 20px 20px 4px; vertical-align: top; font-size: 10pt; font-weight: normal; text-align: left; }
div.column table tr.purchase td			{ vertical-align: top; font-size: 10pt; font-weight: normal; text-align: center; }
div.column table tr.features td ul		{ list-style-position: outside; list-style-image: url(arrow.gif); list-style-type: square; }
div.column table tr.features td ul li	{ margin-left: 0; margin-right: 10%; margin-top: .5em; margin-bottom: .5em; }

div.image								{ position: relative; float: left; width: 110px; height: 110px; }
div.image img.background				{ position: absolute; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px; z-index: 1; filter: none; }
div.image img.foreground				{ position: absolute; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px; z-index: 2; filter: none; }

div.thumb								{ display: inline-block; width: 160px; }
div.thumb div.image						{ display: inline-block; width: 150px; height: 100px; padding: 5px; margin-left: auto; margin-right: auto; text-align: center; }
div.thumb div.image img					{ display: inline-block; width: auto; height: 100px; }
div.thumb div.text						{ display: inline-block; width: 150px; height: 20px; padding: 5px; text-align: center; vertical-align: middle; }
div.thumb div.text a:link				{ display: block; overflow: hidden; color: black; font-size: 8pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: top left; background-repeat: no-repeat; }
div.thumb div.text a:visited			{ display: block; overflow: hidden; color: black; font-size: 8pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: top left; background-repeat: no-repeat; }
div.thumb div.text a:hover				{ display: block; overflow: hidden; color: black; font-size: 8pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: underline; cursor: pointer; background-position: top left; background-repeat: no-repeat; }
div.thumb div.text a:active				{ display: block; overflow: hidden; color: black; font-size: 8pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: underline; cursor: pointer; background-position: top left; background-repeat: no-repeat; }

div.wizard								{ display: inline-block; width: 100%; line-height: 20px; padding: 0px; border: 0px; margin: 0px; }
div.wizard div.back						{ display: table-cell; width: 80px; height: 20px; padding: 1px; margin-left: auto; margin-right: auto; text-align: center; }
div.wizard div.step						{ display: table-cell; width: 20px; height: 20px; padding: 1px; margin-left: auto; margin-right: auto; text-align: center; }
div.wizard div.next						{ display: table-cell; width: 80px; height: 20px; padding: 1px; margin-left: auto; margin-right: auto; text-align: center; }
div.wizard div a:link					{ display: block; overflow: hidden; color: black; font-size: 10pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: left top; background-repeat: no-repeat; }
div.wizard div a:visited				{ display: block; overflow: hidden; color: black; font-size: 10pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: left top; background-repeat: no-repeat; }
div.wizard div a:hover					{ display: block; overflow: hidden; color: black; font-size: 10pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: left top; background-repeat: no-repeat; }
div.wizard div a:active					{ display: block; overflow: hidden; color: black; font-size: 10pt; font-weight: bold; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; cursor: pointer; background-position: left top; background-repeat: no-repeat; }
div.wizard div.back a:link				{ width: 80px; background-image: url('images/wizard.back.link.gif'); }
div.wizard div.back a:visited			{ width: 80px; background-image: url('images/wizard.back.visited.gif'); }
div.wizard div.back a:hover				{ width: 80px; background-image: url('images/wizard.back.hover.gif'); }
div.wizard div.back a:active			{ width: 80px; background-image: url('images/wizard.back.active.gif'); }
div.wizard div.step a:link				{ width: 20px; background-image: url('images/wizard.step.link.gif'); }
div.wizard div.step a:visited			{ width: 20px; background-image: url('images/wizard.step.visited.gif'); }
div.wizard div.step a:hover				{ width: 20px; background-image: url('images/wizard.step.hover.gif'); }
div.wizard div.step a:active			{ width: 20px; background-image: url('images/wizard.step.active.gif'); }
div.wizard div.next a:link				{ width: 80px; background-image: url('images/wizard.next.link.gif'); }
div.wizard div.next a:visited			{ width: 80px; background-image: url('images/wizard.next.visited.gif'); }
div.wizard div.next a:hover				{ width: 80px; background-image: url('images/wizard.next.hover.gif'); }
div.wizard div.next a:active			{ width: 80px; background-image: url('images/wizard.next.active.gif'); }