/*
	--------------------------
	Common Page Styles
	--------------------------
*/

/*  Custom Classes
--------------------------  */

/* contain */
.contain:after	{ content: ""; display: block; clear: both; visibility: hidden; height: 0px; }
.contain		{ display: inline-block; }

/* hidden */
.hidden	{ display: none; }

/* clear */
.clear	{ clear: both; }

/* General */
.left	    { float: left; }
.right	    { float: right; }
.textright	{ text-align: right; }
.centre		{ text-align: center; }
.nowrap     { white-space: nowrap; }
.red        { color: #ff0000; }

/*  Typography 
--------------------------  */
html, body  { height:100%; width:100%; }

body 		{ font-family: Trebuchet MS, Helvetica, sans-serif; color: #666; background-color: #e0e0e0; font-size: 1em; line-height: 1.1em; margin: 0px; padding: 0em; width: 100%; text-align: center; }

h1 			{ font-family: Georgia, serif; font-size: 1.25em; color: #000; margin: 0px 0px 0.75em 0px; border-bottom: solid 1px #d9d9d9; padding: 0px 0px 0.75em 0px; }
h2 			{ font-family: Georgia, serif; font-size: 1.15em; color: #000; margin: 0px 0px 0.75em 0px; font-weight: normal; line-height: 1.25em; }
h3 			{ font-family: Georgia, serif; font-size: 0.9em; color: #000; margin: 0px 0px 0.75em 0px; }
h4, h5, h6, h7	{ font-family: Georgia, serif; font-size: 0.8em; color: #000; margin: 0px; }

h2 span { font-size: 0.9em; }

p,li,dt,dd,label	{ font-size: 0.85em; }
li li, li p	{ font-size: 1em; }

a 			{ text-decoration: underline; color: #666; }
a:hover		{ text-decoration: none; color: #666; }

a img		{ border: 0px; }

input, select, textarea		{ font-family: arial,helvetica; font-size: 0.85em; color: #6d6d6f; }

input.radio, input.check    { width: 2em; }

table   { width: 100%; margin: 0.25em 0px 0.75em 0px; }
table thead th  { font-size: 0.85em; }
table tbody td  { font-size: 0.85em; }
table tfoot td  { font-size: 0.85em; padding-top: 0.75em; }
table tfoot.key td  { font-size: 0.65em; padding-top: 0.75em; }

/*  Template 
--------------------------  */

div#outer   { background: #fff; width: 60em; text-align: left; margin: 0px auto; }

div#header  { margin: 0.5em 0px 0.5em 0px; width: 60em; }
div#header img#logo  { margin: 2em 2em 0px 2em; width: 17.4em; float: left; }
div#header ul  { list-style-type: none; margin: 0px 1em 0px 0px; padding: 0px; width: 23em; float: right; }
div#header ul li  { float: right; margin-right: 0.75em; }
div#header ul li a  { text-decoration: none; padding-right: 0.75em; color: #000; }
div#header ul li a:hover  { text-decoration: underline; }
div#header ul li.search  { margin-right: 0px; }
div#header ul li.search input  { font-size: 0.85em; }
div#header div.basketsummary   { float: right; width: auto; margin: 0px 2em 0px 0px; text-align: right; font-family: Trebuchet MS, sans-serif; }
div#header div.basketsummary a  { text-decoration: none; font-size: 0.85em; color: #000; }
div#header div.basketsummary a:hover  { text-decoration: underline; }

div#header div.callus   { width: 36em; margin: 1.5em 2em 0px 0px; text-align: right; float: right; font-weight: bold; font-family: Trebuchet MS, sans-serif; }

div#toplinks { font-family: helvetica, sans-serif; background: #fff url(../files/template/toplinksbg.gif) repeat-x top; width: 60em; }
div#toplinks ul  { list-style-type: none; margin: 0.15em 0px 0.15em 2em; padding: 0px; float: left; }
div#toplinks ul li  { float: left; margin-right: 3em; padding: 0.5em 0px; }
div#toplinks ul li a  { text-decoration: none; padding-right: 0.75em; font-weight: bold; color: #000; }
div#toplinks ul li a:hover  { text-decoration: underline; }
div#toplinks ul li.selected a  { text-decoration: underline; }
div#toplinks div.search  { margin: 0.35em 0px 0px 0px; padding-right: 2em; float: right; }
div#toplinks div.search input  { font-size: 0.75em; }

/*  Content 
--------------------------  */

div.content { width: 56em; padding: 1em 2em; border-top: solid 1px #e9e9e9; }

div.intro   { clear: both; padding-top: 0.75em; margin-top: 0px; float: none; }

div.home    { width: 25em; float: left; margin: 1em 0.75em 0px 0.5em; }

div.latestproducts { width: 13em; background: #efefef; margin: 1em 0.75em 0px 0px; padding: 0.75em; float: left; }
div.latestproducts.end { margin-right: 0px; }
div.latestproducts h2   { background-color: #fff; padding: 0.3em 0.6em; margin-bottom: 0.5em; text-align: center; }
div.latestproducts h2 a { text-decoration: none; color: #000; }
div.latestproducts ul  { list-style-type: none; margin: 0px; padding: 0px; width: 100%; }
div.latestproducts ul li  { background-color: #fff; float: left; width: 100%; height: 13.65em; margin: 0px; padding: 0px; }
div.latestproducts div.imageholder   { height: 9em; margin-bottom: 0px; vertical-align: middle; position: relative; }
div.latestproducts div.imageholder img { max-width: 9em; max-height: 9em; vertical-align: middle; }
div.latestproducts div.imageholder img.discount   { position: absolute; top: 10px; right: 10px; }

/*  Footer 
--------------------------  */

div#footer  { margin: 2em 0px 0px 0px;  color: #676767; width: 60em; border-top: solid 1px #d9d9d9; padding: 0.5em 0px; }
div#footer ul  { list-style-type: none; margin: 0px 0px 0.25em 2em; padding: 0px; width: 56.5em; }
div#footer ul li  { display: inline; margin-right: 0.35em; font-size: 0.75em; }
div#footer ul li a  {  text-decoration: none; padding-right: 0.75em; }
div#footer ul li a:hover  { text-decoration: underline; }
div#footer ul li.last  { float: right; margin-right: 0.75em; }
div#footer ul li.last a  { padding-right: 0px; }

/*
	Greyout Panes
*/
#greyoutcontent	{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; margin: 0px; padding: 1em; z-index: 50; background-color: #fff; text-align: center; }
#greyoutcontent img { top: 50%; margin-top: -15px; position: relative; }