* { text-decoration: none !important; }

/* =================================================
Reset (Eric Meyer-style)
==================================================== */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, small, strike, strong, sub, sup, tt, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	/*vertical-align: baseline;*/
}

/* =================================================
Body Basics
==================================================== */
html {
	background: #FFF;
}
body {
	font-size: 87.5%; /* 14px, fed to IE */
	line-height: 1.4285714285714286em;
	margin: 0;
	padding: 0;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	color: #666;
	background: #FFF;
}
html > body {
	font-size: 14px; /* 14px, fed to every other (modern/good) browser...obviously not IE6 */
}

/* =================================================
Links
==================================================== */
a {
	text-decoration: none;
}
a:link, a:visited {
	color: #06F;
}
a:hover, a:focus {
	color: #039;
	text-decoration: none;
}
a:active, a:focus {
	color: #000;
}
/* Print URL after links
http://css-tricks.com/snippets/css/print-url-after-links/  */
@media print {
	a:after {
		content: " (" attr(href) ") ";
		font-size: 0.8em;
		font-weight: normal;
	}
}

/* =================================================
"Skip to" Links (Accessibility)
==================================================== */
a.skip {
	position: absolute;
	top: 0; 
	left: -999em; 
	z-index: 10; 
	display: block;
	border: 1px solid #000;
}
a.skip:focus, a.skip:active { 
	position: absolute; 
	top: 0.7em; 
	left: 1em; 
	text-decoration: none; 
	padding: 10px; 
	background: #FFF; 
}
a.skip:hover {
	color: #039;
}

/* =================================================
Structure (Main)
==================================================== */
	#bar { color: #000; font-size: 12px; background: #CCC; }
		#bar .inner { width: 940px; margin: 0 auto; padding: 0.75em 0; }
		#bar a { color: #FFF; }
		#bar ul { margin: 0 auto; padding: 0; list-style: none; }
		#bar li { display: inline; margin: 0; padding: 0; }
		#bar span { font-size: 12px; color: #CCC; padding-left: 0.5em; padding-right: 0.5em; }

		p#welcome-msg { text-align: right; }
		p#welcome-msg span { background: url("/ui/user.gif") no-repeat left center; padding-left: 14px; }
		p#welcome-msg a:hover,
		p#welcome-msg a:focus { text-decoration: none; }

	input.input-text { position: relative; z-index: 2; }
	#header-login label { position: relative; z-index: 1; width: auto; text-align: left; display: inline; margin-right: 0; padding-right: 0; float: none; }
	label.inlined { padding-left: 6px; font-weight: normal; font-size: 12px; opacity: 0.75; -webkit-transition: opacity 0.15s linear; }
	label.inlined + input.input-text { margin-top: -22px; }

	#quick-search { margin: 0 0 1em; }
	#quick-search fieldset { display: block; height: 30px; min-height: 30px; background: url("/ui/search-bg.gif") no-repeat left top; position: relative; border: none; padding: 0; }
		#quick-search fieldset input { vertical-align: middle; }
		#quick-search legend, 
		#quick-search label { display: none; }
		#quick-search #search-fld { width: 130px; top: 8px; margin-left: 10px; font-weight: normal; border: 0; }
		#quick-search input { color: #999; }
		#quick-search input.active { color: #000; /* "active" class applied by jQuery on focus/text-entry */ }
		#quick-search #search-btn { width: 30px; }
		#quick-search input:focus { background: none; }



#masthead { border-bottom: 1px solid #CCC; margin: 0; background: #444/*#F2F2F2 url("/ui/masthead-bg.gif") repeat-x center center*/; }
	#masthead .container { position: relative; width: 940px; margin: 0 auto; }
	#masthead p { text-align: left; margin: 0; line-height: 2.5em; font-size: 0.9em; color: #999; }
		#masthead strong { color: #FFF; }
		#masthead a { color: #FFF; }
		#masthead p#call { position: absolute; top: 0; right: 0; }
		#masthead p#welcome-msg {  }

		#masthead form {  }
		#masthead-user, #masthead-pass { width: 120px; }
		

body#checkout #head { background: #EEE; }
#head { border-bottom: 1px solid #CCC; position: relative; z-index: 2; }

.min-height-fast-hack {
	min-height: 70px;
	height: auto !important;
	height: 70px; 
}

	#head a#logo { float: left; margin: 0; padding: 20px 0; /* 70px minus 30px (height of logo) = 40px divide by 2 = 20px */ }

	#head h4 { margin: 0; line-height: 70px; /* checkout header */ }
	div#head h4 { float: left; display: inline; margin: 0 0 0 15px; padding: 0 0 0 30px; line-height: 70px; color: #777; font-weight: normal; background: url("/ui/secure.gif") no-repeat 10px 50%; }

	#head form#quick-search { float: left; width: 180px; height: 30px; margin: 17px 20px; }
		#head form#quick-search fieldset { background: url("/ui/search-fld-bg.gif") no-repeat left center; height: 36px; }
		#head form#quick-search input,
		#head form#quick-search input[type=text],
		#head form#quick-search input[type=submit] { vertical-align: middle; border: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; position: absolute; /*line-height: 30px;*/ }
			#head form#quick-search input:focus { border: none; }

		#head form#quick-search #search-btn { width: 30px; margin: 0 10px 0 0; top: 3px; left: 140px; }

		#head li.active,
		#head li.active:hover,
		#head li.active:focus { color: #000; }

/* 
Fixing IE z-index bug
http://jonathanstegall.com/2009/01/15/ie-z-index-bug-with-css-dropdown-menu/
*/

	#head ul { float: left; list-style: none; padding: 0; margin: 0; position: relative; z-index: 998; }
		#head a { font-size: 1.1428571428571428571428571428571em/* 16px */; font-weight: bold; color: #000; text-decoration: none; }
			#head li a:hover, #head li a:focus { text-decoration: none; color: #936; }
			#head li ul a:hover,
			#head li ul a:focus { background: none; background: #603; }
			#head li:hover, 
			#head li.sfHover { background: url("/ui/nav-arrow.gif") no-repeat center bottom; }
			
			#head li:hover li, 
			#head li.sfHover li  { background-image: none; /* turn it off for sub-levels */ }
			#head li li:hover, 
			#head li li.sfHover { background-color: #603; /* leave a "trail" */ }

			#head a.drop span { background: url("/ui/nav-drop-arrow.gif") no-repeat left center; padding-left: 17px; }
			#head a.basket span { background: url("/ui/basket.gif") no-repeat left center; padding-left: 20px; }
				#head a.basket span.qty { background: none; padding: 0; color: #999; }

			#head a.basket:hover span,
			#head a.basket:focus span { color: #666; }
			#head li { float: left; margin: 0; padding: 0; position: relative; }
			#head li li { /*z-index: 999;*/ }
			#head li a { display: block; /* click-area (overall height) of level-one nav elements should be 70px (or "em" equiv.) */ line-height: 70px; padding: 0 7px; }
			#head a span {  }

			#head li ul a { border-top: 1px solid #C69; border-bottom: 1px solid #603; font-size: 1em; font-weight: normal; }
			#head li ul a.first { border-top: none; }
			#head li ul a.last { border-bottom: none; }
			#head li em { font-style: normal; }
 
			#head li ul { position: absolute; left: -999em; top: 100%; padding: 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin: 0; background: #936; background: -moz-linear-gradient(top, #C69, #936); background: -webkit-gradient(linear, left top, left bottom, from(#C69), to(#936)); }

			#head li:hover ul ul, 
			#head li:hover ul ul ul,
			#head li:hover ul ul ul ul, 
			#head li.sfHover ul ul, 
			#head li.sfHover ul ul ul, 
			#head li.sfHover ul ul ul ul {
				left: -999em;
			}
			#head li:hover ul,
			#head li li:hover ul,
			#head li li li:hover ul,
			#head li li li li:hover ul,
			#head li.sfHover ul,
			#head li li.sfHover ul,
			#head li li li.sfHover ul,
			#head li li li li.sfHover ul {
				left: auto;
			}

			#head ul li:hover,
			#head ul li.hover { position: relative; }
			#head li ul li, #global-nav li ul li a { float: none; display: block; }
			#head li ul li { _display: inline; /* for IE6 */ position: relative; }
			#head li ul li a { width: 11em/*150px*/; display: block; padding: 0.5em; line-height: 1; font-weight: normal; color: #FFF; }
			#head li ul li a:hover,
			#head li ul li a:focus { color: #FFF; }
		
			/* Sub-Sub Menu */
			#head li ul li ul { z-index: 100; border: 1px solid #603; }
			#head li ul li:hover ul,
			#head li ul li.sfHover ul { top: 2px; left: 11.1em/*160px*/; margin: 0; }


body.basket #head li a#nav-basket,
body.products #head li a#nav-products,
body.services #head li a#nav-services,
body.support #head li a#nav-support,
body.account #head li a#nav-account { color: #603; }

#nav-basket .qty { font-size: 0.75em; }

/* =================================================
Breadcrumbs Trail
==================================================== */
#breadcrumbs { margin: 1em 10px 0 0.75em; }
	#breadcrumbs ul { list-style: none; margin: 0; padding: 0; }
		#breadcrumbs li { display: inline; margin: 0; padding: 0 6px 0 14px; background: url("/ui/bullet.gif") no-repeat left center; font-size: 0.75em; }
			#breadcrumbs li.home { background-image: url("/ui/home.gif"); }
			#breadcrumbs strong,
			#breadcrumbs a { color: #666; text-decoration: none; }
			#breadcrumbs a:hover,
			#breadcrumbs a:focus { text-decoration: none; color: #039; }
		#breadcrumbs p { position: absolute; right: 0; display: inline; font-size: 0.75em; }
			#breadcrumbs p a { font-weight: bold; text-decoration: none; color: #06F; }
			#breadcrumbs p a:hover, #breadcrumbs p a:focus { /*text-decoration: none;*/ color: #039; }


#body { background: #FFF; padding: 0 0 3em; position: relative; }
	#content {  }
		#content p:last-child { margin-bottom: 0; /* remove bottom margin for last paragraph of #content (CSS3) */ }
	#sidebar { margin-top: 6em; font-size: 0.85714285714285714285714285714286em; /* 12px */ }

	dl.menu { border: 1px solid #CCC; }
		.menu dt { display: block; padding: 0.5em 0.5em 0.65em; background: #DDD; }
		.menu dd { margin-left: 0; }
			.menu dd a { display: block; padding: 0.35em 5px; border-top: 1px solid #CCC; text-decoration: none; font-size: 1.2em; font-weight: bold; color: #333; }
			.menu dd a:hover,
			.menu dd a:focus { text-decoration: none; }
			.menu dd a.current { background: #DDD; color: #000; }
				.menu dd ul { list-style: none; margin: 0; padding: 0; }
				.menu dd li { margin: 0; padding: 0; }
				.menu dd li a { padding-left: 22px; color: #666; font-size: 1em; font-weight: normal; }
				.menu dd li a:hover,
				.menu dd li a:focus {  }
				.menu dd li a.current { background: #EEE; color: #000; font-weight: bold; background: url("/ui/bullet.gif") no-repeat 5px center; }

#foot { position: relative; background: url("/ui/foot-bg.gif") no-repeat 50% -1px; border-top: 1px solid #CCC; font-size: 0.85714285714285714285714285714286em; /* 12px */ margin: 0; padding: 1em 0 1em; color: #999; }
	#foot h5 { padding-bottom: .5em; margin: 0; color: #777; }
	#foot address { margin: 0; padding: 0; }

	#foot .logo-sml { background: url("/ui/macwarehouse-sml.gif") no-repeat 0 5px; width: 105px; height: 2em; min-height: 12px; display: block; float: left; }
	#foot .logo-sml strong { position: absolute; left: -999em; }

	#foot form { border-top: 1px solid #FFF; padding-top: 10px; }
		#foot label { display: none; }
	#foot ul { list-style: none; margin-left: 0; }
	#foot ul a:link,
       #foot ul a:visited { text-decoration: none; }
       #foot ul a:hover,
       #foot ul a:focus,
       #foot ul a:active { color: #039; text-decoration: none; text-shadow: 1px 0 0 #FFF; }
	#foot li { border-top: 1px solid #FFF; border-bottom: 1px solid #AAA; padding: 3px 0 3px 5px; }
	#foot li.last { border-bottom: none; }
		#foot li a { display: block; background: url("/ui/bullet.gif") no-repeat left center; padding-left: 14px; }
			/* recent views need removing, it's no longer used (or could it be used for something else?) */
			#recent-views li { padding: 3px 0; }
			#recent-views li.last { text-align: right; }		
			#recent-views li a { background: none; padding-left: 0; }
			#recent-views img { float: left; border: 1px solid #CCC; margin-right: 10px; }
			#recent-views span { display: block; margin-left: 77px; /* image (67px) + space (10px) */ }
			#recent-views small { color: #999; }
			#recent-views p { border-top: 1px solid #FFF; padding-top: 3px; }
				#recent-views p a { font-weight: bold; }
		#legal { color: #999; }
			#legal p { margin: 0; line-height: 2em; display: inline; }
			#legal p strong { color: #999; }
			#legal a { text-decoration: none; }
			#legal a:hover, #legal a:focus { text-decoration: none; }


			#legal ul { float: right; margin: 0; padding: 0; list-style: none; }
				#legal ul li { display: inline; border-top: none; border-bottom: none; margin: 0; padding: 0; }
					#legal ul li a { float: left; width: auto; margin: 0; padding: 0 8px; border-right: 1px solid #CCC; background: none; font-weight: normal; border-top: none; border-bottom: none; /*display: inline;*/ line-height: 2em; }
					#legal ul li.last a { border-right: none; padding-right: 0; }
					#legal ul li a:hover, #legal ul li a:focus { text-decoration: none; }

		#search-foot p { margin: 0; }
		#search-foot input { vertical-align: middle; }


#legal, #banner_468 { display: inline; float: left; margin-left: 10px; margin-right: 10px; }
#legal { width: 462px; margin-left: 0; }
#banner_468 { width: 468px; margin-right: 0; }

/* =================================================
Basic Typography
==================================================== */
h1, h2, h3, h4, h5, h6 {
	color: #000;
	font-weight: bold;
}
h1 {
	margin: 0.45454545454545455 0 0.9090909090909091em;
	font-size: 2em/*1.5714285714285714em*/;
	line-height: 0.9090909090909091em/*1.4285714285714285714285714285714em*/;
	font-weight: bold;
	letter-spacing: -1px;
}
h1,
h1 a:link,
h1 a:visited,
h1 a:hover,
h1 a:active {
	color: #000 /*#C39 #C09 #906 */;
}
h1 .amp {
	font-weight: normal;
	color: #999;
}
h1 .serif {
	font-weight: normal;
	color: #999;
}
h1 .basket-status {
	color: #AAA;
}

/* anaglyptic text 
h1 {
	padding: 5px 0 0 20px;
	font: 200px Helvetica, Sans-Serif;
	letter-spacing: -5px;
	color: rgba(255,0,0,0.5);
	text-shadow: rgba(0,0,255,0.5) -3px -3px 0; 
}
*/ 

h2, .h2 {
	margin: 0;
	font-size: 1.4285714285714286em; /* */
	line-height: 1em;
	margin-bottom: 1em;
}
h2,
.h2,
h2 a:link,
h2 a:visited,
h2 a:hover,
h2 a:active { color: #333; }
h2 em.serif { font-weight: lighter; color: #666; }
h2.short-desc { font-size: 1em/*0.8571428571428571em*/; font-weight: normal; color: #999; }

h3, .h3, legend {
	margin: 0;
	font-size: 1.2857142857142858em;
	line-height: 1.1111111111111112em;
	margin-bottom: 1.1111111111111112em;
}
h4, .h4 {
	margin: 0;
	font-size: 1.1428571428571428em;
	line-height: 1.25em;
	margin-bottom: 1.25em;
}
h5, h6, p, .p, ul, ol, dl, blockquote, pre {
	margin: 0;
	font-size: 1em; /* 14px */
	line-height: 1.4285714285714286em;
	margin-bottom: 1.4285714285714286em;
}

p.small, small, form p.note, form .row ul, form .row ul, form .row dl {
	/* smaller stuff */
	margin: 0;
	font-size: 0.8571428571428571em; /* 12px? */
	line-height: 1.6666666666666667em;
	margin-bottom: 1.6666666666666667em;
}
/* =================================================
Basic Table
==================================================== */
table {
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid #CCC;
	background: #FFF;
	font-size: 0.8571428571428571em;
	line-height: 1.6666666666666667em;
	margin-bottom: 1.6666666666666667em;
}
caption {
	font-weight: normal;
	margin-bottom: 0.75em;
	color: #999;
	letter-spacing: 1px;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
tr {
	background: transparent;
}
tr.odd {
	background: #EFEFEF;
}
th, td {
	vertical-align: top;
	border: 1px solid #CCC;
	padding: 0.5em;
	background: transparent;
}
th[rowspan], td[rowspan] { 
	vertical-align: middle; /* align shared rows (rowspans) vertically central */ 
}
th[colspan]
td[colspan] { 
	text-align: center; /* align shared columns (colspan) horizontally central */ 
}
th.empty, td.empty {
	border: none;
	background: transparent;
}
th.quiet, td.quiet { 
	color: #999;
}
thead {
	
}
thead th,  thead td {
	padding-top: 0.95em;
	padding-bottom: 0.95em;
	border: 1px solid #369;
	text-shadow: 1px 0 0 #036;
	background: #48C url("/ui/thead-bg.gif") repeat-x left bottom;
	color: #FFF;
	text-transform: uppercase;
}
/*
tfoot {
	font-size: 0.85714285714285714285714285714286em;
	line-height: 1.6666666666666667em;
}
*/
tfoot p, tfoot ul, tfoot ol, tfoot dl {
	margin-bottom: 0; /* remove bottom margin, make sure it's the only element in the tfoot */
}
tbody {
}
thead em { font-weight: normal; }
thead a:link,
thead a:visited { color: #FFF; /* assuming a standard blue background for "thead td/th" */ text-decoration: none; }
thead a:hover,
thead a:active,
thead a:focus { color: #FFF; text-decoration: none; }


table.bundle th, 
table.bundle td { border-left: none; border-right: none; }
table.bundle a { text-decoration: none; }
	table.bundle a:hover,
	table.bundle a:focus { text-decoration: none; }
table.bundle ul { margin: 0; list-style: none; }
	table.bundle li a { background: url("/ui/bullet.gif") no-repeat left center; padding-left: 15px; }


table#saved-baskets-tbl ul { margin: 0; list-style: none; }
	table#saved-baskets-tbl li a { padding-left: 15px; background: url("/ui/bullet.gif") no-repeat left center; }

/* =================================================
Unordered, Ordered and Definition Lists
==================================================== */
ul, ol {
	margin-left: 1.5em;
	padding: 0;
}
li > ul,  li > ol {
	font-size: 1.0em; /* use the adjacent selector to keep the font-size in control */
}
li {
	padding-left: 0.25em;
}
li ul,  li ol {
	margin-bottom: 0;
}
ul {
	list-style-type: disc;
}
ul ul {
	list-style-type: circle;
}
ul ul ul {
	list-style-type: square;
}
ol {
	list-style-type: decimal;
}
ol ol {
	list-style-type: lower-alpha;
}
ol ol ol {
	list-style-type: lower-roman;
}
dl {
}
dt {
	color: #000;
}
dd {
	margin-left: 1em;
}
dd ol,
dd ul { 
	margin-bottom: 0;
}

/* =================================================
Extras
==================================================== */
img {
	border: 0;
}

address {
	display: inline; color: #000;
}

hr {
	border: none;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #fff;
	clear: both;
	margin: 0.81em 0;
	height: 0;
}
sup, sub {
	vertical-align: baseline;
	position: relative;
	top: -1.7ex /* -0.4em */;
	font-size: /*0.7em*/10px;
	font-weight: lighter;
	padding-left: 0.2em;
}
sub {
	top: 0ex/*0.4em*/;
}
hr {
	border: none;
	border-top: 1px solid #EEE;
	border-bottom: 1px solid #CCC;
	clear: both;
	margin: 0.81em 0;
	height: 0;
}
em {
	font-style: italic;
}
q, code, th, dt, strong {
	font-weight: bold;
}
del {
	text-decoration: line-through;
}
ins {
	text-decoration: none;
	font-weight: bold;
}
code {
	font-size: 1.1em;
	font-weight: bold;
}
acronym { 
	letter-spacing: 1px; 
}
abbr, acronym {
	cursor: help; /*border-bottom: 1px dotted #CCC;*/
}
a abbr, a acronym {
	/* border turned is because links are already underlined */
	border-bottom: none;
}

pre, tt, code, kbd, samp, var {
	font-family: Monaco, "Courier New", Courier, monospace;
}

pre {
	/* crosss browser "pre", helps with wrapping problems */
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
}

/* =================================================
Meta Data
==================================================== */
#post-meta { /*font-size: 75%;*/
	color: #999;
	font-style: italic;
	font-size: 0.78571428571428571428571428571429em; /* 12px */
}
#post-meta a,  #post-meta strong {
	color: #444; /*font-weight: normal;*/
	font-style: normal;
}
/* =================================================
Navigation
==================================================== */
.v-nav {
	list-style: none;
	margin-left: 0;
	padding: 0;
}
.v-nav li {
	margin: 0;
	padding: 0;
}
.v-nav a {
	display: block;
}

/* =================================================
quotes, blockquotes, cites and pullquotes 
==================================================== */
cite {
	font-style: italic;
}
blockquote {
	margin-left: 3em;
	margin-right: 3em;
	text-align: left/*justify*/;
	quotes: “
}
blockquote cite {
	display: block;
	text-align: right; /*color: #999;*/
	font-weight: normal;
	margin-top: 1.4285714285714286em;
}
blockquote.left,
blockquote.right {
	width: 300px;
	padding: 5px 0;
	border-width: 3px 0;
	font-size: 1.4em;
}
blockquote.left {
	margin: 5px 15px 5px 0;
	float: left;
	text-align: right;
}
blockquote.right {
	margin: 5px 0 5px 15px;
	float: right;
	text-align: left;
}
q {
	font-style: italic;
	content: none;
}
q:before, q:after {
	content: ""; /* if IE can't see it, nobody will! Manually code the HTML quotes “ (left double quote) and ” (right double quote) */
}
q {
	quotes: "\201C" "\201D";
}
q:before {
	content: open-quote;
}
q:after {
	content: close-quote;
}

/* =================================================
Noscript
==================================================== */
.noscript { background-color: #FFC; padding: 1em; border: 1px solid #9D9B57; margin: 0 0 1em; }
	.noscript h4 { margin: 0 0 0.25em; color: #C03; }
	.noscript p { margin: 0; }


/* =================================================
Messages: Default [Blue], Error [Yellow], Success [Green], Save [Purple])
==================================================== */
.message { padding: 5px; margin: 1em 0 1.5em; background: #DDD; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.message .inner { border: 1px solid #999; padding: 0.8em; color: #000; min-height: 30px; background: #FFF; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
.message h6 { color: #000; margin: 0; padding: 0; font-size: 1.25em; font-weight: normal; }
.message h6 a,
.message h6 a:visited { color: #000; }

.message ul { margin: 0.5em 0 0 30px; }
	.message li { color: #666; }

div.success { background: #86D958; }
div.success .inner { border: 1px solid #229322; }
div.error { background: #E4D563; }
div.error .inner { border: 1px solid #C7B323; }

p.error { color: #F00; font-weight: bold; }


/* =================================================
Invoice Address Table
==================================================== */
table#invoice-addresses {  }
	table#invoice-addresses td,
	table#invoice-addresses th { border-left: none; border-right: none; }


/* =================================================
Product Listings (General Products Table List [compare table in result page, accessories/"customers who bought..."/matching model/featured accessories table in item & kit page, recently viewed items table in recent views])
USE EXTREME CAUTION when changing this table, it affects a LOT!!!
==================================================== */
.product-listings { 
	/*border: 2px solid #71B8FF;*/
}
.product-listings th, .product-listings td {
	border-left: none;
	border-right: none;
}
.product-listings .section th {
	background: #9BE url("/ui/table-section-bg.jpg") repeat-x left center; 
	color: #036; 
	text-shadow: 1px 1px 0 #CDF; 
	font-size: 1.2em;  
	letter-spacing: -1px;
}
.product-listings td.image {
	padding-left: 0;
	padding-right: 0;
}
.product-listings td.image img {
	border: 1px solid #CCC;
	padding: 4px;
	background: #FFF;
}
.product-listings thead { 
	border: 1px solid #369;
}
.product-listings thead a {
	color: #FFF;
}
.product-listings h3 {
	margin: 0;
}
.product-listings h3 a {
	text-decoration: none;
	color: #039/*#333;*/
}
.product-listings h3 a:hover,
.product-listings h3 a:focus {
	text-decoration: none;
	color: #000;
}
.product-listings h3 a:focus { 
	background: #FF9;
}
.product-listings p {
	margin: 0;
}
.product-listings small {
	color: #999; margin: 0;
}
.product-listings .price {
	font-size: 1.35em;
}
.product-listings a.more {
	white-space: nowrap;
}
.product-listings input { /* usually a checkbox */ }
.product-listings label { /* reset defaults */ }


a.add { display: block; width: 60px; height: 30px; background: url("/ui/buttons/add-sprite.gif") no-repeat 0 0; }
a.add:hover,
a.add:focus { background-position: 0 -30px; }

a.details { display: block; text-align: center; padding: 0.6em 0.4em; }


#recommended h2 { padding-left: 16px; background: url("/ui/flame.gif") no-repeat left center; color: #F60; }
#recommended thead { border-color: #E57E2A; }
#recommended thead th { background: #E57E2A url("/ui/recommended-thead-bg.gif") repeat-x left bottom; border-color: #E57E2A; text-shadow: 1px 0 0 #000; }

div#other-categories { margin-top: 20px; }

/* =================================================
Compare Table (Result Page)
==================================================== */
.compare {  }
.rating { margin: 0.5em 0 0; }


/* =================================================
Search Categories
==================================================== */
/*#search-categories dt a,
#search-categories dt a:visited { text-decoration: none; color: #000; }
#search-categories dt a:visited { color: #909; }
#search-categories dt a:hover,
#search-categories dt a:active,
#search-categories dt a:focus { text-decoration: none; color: #039 }
#search-categories .quiet { font-weight: normal; }*/
#search-categories { border: 1px solid #CCC; background: #F2F2F2; padding: 5px; margin: 0.8em 0; }
#search-categories p { font-size: 1.3em; margin: 10px 0 0 10px; }
#search-categories ul { margin: 0.5em 0 1em; padding: 0; list-style: none; }
#search-categories li { width: 200px; float: left; font-size: 11px; }
#search-categories a { padding: 5px 0 5px 5px; }


/* =================================================
Catalogue Folders (Folder Page)
==================================================== */
#cat-grid { background: url("/ui/cat-grid-vert.gif") repeat-y left top; }
	#cat-grid .divider { clear: both; float: none; background: url("/ui/cat-grid-horiz.gif") no-repeat center center; height: 11px; margin: 0; }

.folders { margin: 1em 0 2em; clear: both; }

.cat-folder { width: 300px; float: left; display: inline; margin: 10px 10px; }
.cat-folder.alpha { margin-left: 0; }
.cat-folder.omega { margin-right: 0; }
.cat-folder:hover { color: #000; }
.cat-folder div { padding: 10px; }
.cat-folder img { float: left; margin-right: 10px; }
.cat-folder p { margin: 0 0 0 110px; /* margin left = img width + img margins */ padding: 0 10px 0 0; font-size: 0.87em; line-height: 1.25; color: #999; }
	.cat-folder p.outdent { margin: 0; /* take margin-left off */; }
.cat-folder h3 { margin: 0; font-weight: normal; font-size: 0.85em; }
	.cat-folder h3 a { text-decoration: none; font-weight: bold; }
	.cat-folder h3 a:hover,
	.cat-folder h3 a:focus { /*color: #039;*/ text-decoration: none; }



/* =================================================
Back to Category (Folder Sidebar)
==================================================== */
#back-to-category {  }
#back-to-category h3 a { color: #000; text-decoration: none; }
#back-to-category h4 { margin: 0; }


/* =================================================
Jargon Buster (Item/Kit)
==================================================== */
.jargon h5,
.jargon h6 {
	margin: 0 0 0 0.75em; color: #666;
}
.jargon p { 
	margin-left: 0.75em; 
}



/* =================================================
Forms
==================================================== */
form.inline { margin: 0; }

p.legend {
	margin-bottom: 1em;
}
p.legend em {
	color: #C00;
	font-style: normal;
}
div.errors {
	margin: 0 0 10px 0;
	padding: 5px 10px;
	border: #FC6 1px solid;
	background-color: #FFC;
}
div.errors p {
	margin: 0;
}
div.errors p em {
	color: #C00;
	font-style: normal;
	font-weight: bold;
}

form p.note, form .row ul, form .row ol, form .row dl {
	margin-left: 170px;
}
form p.note { margin-bottom: .9em; }

fieldset {
	padding: 10px;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	border: 1px solid #BBB;
	position: relative; /* For better <legend> positioning */
	margin: 0 0 2em;
}
fieldset.basic {
	padding: 0;
	border: none;
}

legend {
	font-weight: bold;
	color: #000;
	padding: 0.5em;
	margin: 0;
}
form .row, form .controlset div {
	padding: 0.5em 0;
}
fieldset .controlset div {
	padding: 0;
}

input, textarea, select, button {
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

textarea {
	padding: 5px 2px; 
}

label, span.label, input, textarea, select {
/*
	margin: 0 0 0.75em;
*/
}
label, span.label {
	margin-right: 10px;
	padding-right: 10px;
	width: 150px;
	display: block;
	float: left;
	text-align: right;
	position: relative;
}
label.error, span.error {
	color: #C00;
}
label em, span.label em {
	position: absolute;
	right: 0; 
	font-style: normal;
	font-weight: bold;
	color: #C00;
}

table.product-listings label, 
label.basic { padding: 0; width: auto; display: inline; float: none; text-align: left; margin: 0; }

input.error {
	border-color: #C00;
	background-color: #FFF;
}
input:focus, input.error:focus, textarea:focus {
	background-color: #FFF;
	border-color: #2DAEBF;
}
.controlset label, .controlset input {
	display: inline;
	float: none;
}
.controlset div {
	margin-left: 170px;
}
form .buttonrow {
	margin: 1em 0 1em 180px;
}
fieldset .buttonrow {
	margin-left: 170px; /* assuming fieldsets have a left padding of 10px */
}
optgroup {
	font-style: normal;
	font-weight: bold;
}
option {
	font-weight: normal; 
}
optgroup option { 
	padding-left: 7px; /* remove or reduce indent */
}

/* text-shadow: color x_offset y_offset blur_radius; */

input[type="submit"], input[type="reset"], input[type="button"], input.submit, button, .button, label, select, .pointer {
	cursor: pointer;
}

input[type="text"], input[type="password"], textarea {
	border: 1px solid #AAA/*#79C*/; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
}

input, textarea {
	/* a bit o' css3 */
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
}  
input.text, textarea, select { background: transparent url("/ui/input-bg.gif") no-repeat 0 0; border: 1px solid #bbb; -moz-border-radius: 2px; -webkit-border-radius: 2px; -webkit-box-shadow: 0 1px 1px #fff; }
input.text:focus, textarea:focus, select:focus { outline: none; border-color: #999; color: #333; border: 1px solid #2daebf; }

.row input,
.buttonrow input { 
	vertical-align: middle;
}
.buttonrow a { 
	font-weight: bold;
	/* using links as the button (inside a paragraph) */
}
.buttonrow a.cancel { 
	color: #C00; 
}

button {
	width: auto;
	overflow: visible;
	text-align: center; 
}

/* =================================================
Global classes, text and display treatments
==================================================== */
.serif {
	font-family: Palatino, Georgia, 'Times New Roman', serif;
}
/* replace at some point with minimalist names such as "txt-l", "txt-r", "txt-j", "txt-c"...every little helps */
.txt-left {
	text-align: left;
}
.txt-right {
	text-align: right;
}
.txt-centre {
	text-align: center;
}
.txt-justify {
	text-align: justify;
}
.uppercase {
	text-transform: uppercase;
}
.small-caps {
	font-variant: small-caps;
}
.capitalize {
	text-transform: capitalize;
}
.lowercase {
	text-transform: lowercase;
}
.amp {
	font-family: "Baskerville", "Goudy Old Style", "Palatino", "Book Antiqua", serif;
	font-style: italic;
}
.dropcap { /* needs work, from http://spyrestudios.com/quick-tip-easy-way-to-create-drop-caps-on-your-blog */
	/*
	font-family:Georgia, serif;
	font-weight: 400;
	color: #ccc;
	*/
	font-size: 46px;
	float: left;
	line-height: 1em;
	margin-bottom: -0.4em;
	margin-right: 0.09em;
	position: relative;
}
.muted {
	color: #989B9E;
}
.new {
	background: #6A3/*#6C0*/;
	color: #FFF;
	font-size: 10px;
	font-weight: bold;
	padding: 1px;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}
.clearance { 
	background: #C00;
	color: #FFF;
	font-size: 10px;
	font-weight: bold;
	padding: 1px;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}
.phone { 
	padding-left: 18px; background: url("/ui/phone-icon.gif") no-repeat left center; }
}
/* display properties */
.inline {
	display: inline;
}
.block, .h2, .h3, .h4, .p {
	display: block;
}
.none {
	display:none;
}
.inline-block {
	display: inline-block; 

}
.noshow, .no-show, .hide {
	position: absolute;
	left: -999em;
}


/* =================================================
Floats and Product Image Treatment
==================================================== */
.left {
	float: left;
}
.right {
	float: right;
}
/*
.img {
	background: url("image-bg.jpg") no-repeat left top;
}
*/
img.left {
	margin: 0 10px 10px 0;
}
img.right {
	margin: 0 0 10px 10px;
}
.img img {
	border: 0;
	margin: 5px 5px 10px;
}
img.thumb {
	margin: 0 0 0.5em;
}
.price {
	color: #C31B77;
}

/* =================================================
Refine Search (Result Page)
==================================================== */
#refine-search {  }
#refine-search ul { list-style: none; margin: 0.5em; }
#refine-search li { padding: 0.3em 0; border-top: 1px solid #EEE; border-bottom: 1px solid #AAA; }
#refine-search li.first { border-top: none; }
#refine-search li.last { border-bottom: none; }
#refine-search .section { border: 1px solid #CCC; margin: 0 0 0.85em; -moz-border-radius: 5px; background: #CCC; }
#refine-search h4 { /*border-bottom: 1px solid #CCC; background: #EEE;*/ color: #000; padding: 0.5em; margin-bottom: 0; text-shadow: 1px 0px 0px #FFF; }
#refine-search strong,
#refine-search a { text-transform: capitalize; }
#refine-search a:link { text-decoration: none; color: #000; }
#refine-search a:visited { text-decoration: none; color: #909; }
#refine-search a:hover,
#refine-search a:active,
#refine-search a:focus { text-decoration: none; color: #039; }

#refine-search form { margin: 0.5em 0; padding: 0; }
#refine-search input { vertical-align: middle; }


/* =================================================
Pagination
==================================================== */
.pagination {
	margin: 15px 15px 20px 0;
	clear: both;
}
	.pagination a,
	.pagination span,
	.pagination strong {
		color: #06F;
		font-size: 14px;
		font-weight: bold;
		display: inline;
		padding: 6px 10px;
		margin: 0 1px 0 0;
		background-color: #fff;
		text-decoration: none;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		border: 1px solid #DDD;
	}	
	.pagination a.selected,
	.pagination span.selected {
		background-color: #97bb3f;
		border-color: #87a739;
		background-position: bottom left;
		background-repeat: repeat-x;
	}
	.pagination strong {
		color: #000;
		border-color: #CCC;
	}
	.pagination span.disabled {
		border: none;
		background: none;
		color: #666;
		font-weight: normal;
	}
	.pagination a:hover {
		color: black;
		background-color: #eef;
	}
	.pagination a:active {
		position: relative;
		top: 1px;
		left: 1px;
		border-color: #FFF;
		background-color: #06F;
		color: #FFF;
	}


/* =================================================
Reviews (Item/Kit/All Reviews)
==================================================== */
.review { padding: 0 0 1em; margin: 1em 0 2em; }
	.helpful { color: #999; border-top: 1px solid #CCC; padding-top: 0.5em; margin-top: 0.5em; font-size: 0.8571428571em; /* 12px */ }
	.helpful a { font-weight: bold; }
	.review h3 { margin: 0 0 0.22em; }
	.review .reply h5 { margin-bottom: 0; color: #666; font-size: 75%; /* our reply/comment */ }
	.review .reply p { color: #999; font-size: 75% }
	.review .grid_4 { border-top: 2px solid #BBB; }
	.review .grid_4,
	.review .grid_8 { padding-top: 1em; }


.review { border: none; }
.hreview { background: url("/ui/review-head.gif") no-repeat left top; padding: 5px 0 0; }
	.hreview .item { background: url("/ui/review-body.gif") repeat-y left top; padding: 10px; }
	.hreview h6 { margin: 0 0 0.5em; }
	.hreview h6 em { font-weight: lighter; }
	.hreview h6 a { text-decoration: none; color: #000; }
	.hreview blockquote { margin: 0 0 0.5em; }
	.hreview dl { padding: 25px 0 0 1em; margin: 0; background: url("/ui/review-foot.gif") no-repeat left top; }
	.hreview dt { color: #999; font-weight: lighter; }
	.hreview dt strong { color: #444; } 

.site-review { margin: 0 0 20px; border: 1px solid #CCC; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; }
	.site-review .hreview { background: none; margin: 1em; }
		.site-review .reviewer { color: #603; }
		.site-review blockquote { margin: 1em; color: #000; font-size: 1.15em; font-weight: bold; }

/* =================================================
Order History (Table)
==================================================== */
.order {
	width: 100%;
	border: 3px solid #C9D9F1;
	margin: 0 0 2.5em;
}
.order thead {
	text-transform: none;
}
.order thead small {
	font-weight: normal;
}
.order thead th {
	border: none;
}
.order th, .order td {
	border: 1px solid #B7CCEC;
}
.order tr.sub-header {
	background: #C9D9F1;
	color: #000;
	font-weight: bold;
}
.order dl {
	margin: 0.25em 0;
}
.order dt {
	font-weight: bold;
	margin: 0;
	font-size: 1.3em;
}
.order dd {
	margin: 0; color: #666;
}
.order tbody.items {
	border: 1px solid #CCC;
}
.order tbody.items a {
	text-decoration: none;
}
.order tbody.items a:hover,
.order tbody.items a:focus {
	text-decoration: none;
}
.order tbody.items tr.odd td {
	background: #EBF1FA;
}
.order tbody.items th, .order tbody.items td {
	border-left: none;
	border-right: none;
}
.order tfoot {
	font-size: 0.85em;
}
.order dt em {
	font-size: 0.75em;
	color: #999;
	font-weight: normal;
}


/* maintain case */
.CANCELLED {
	border-color: #CCC;
}
.CANCELLED thead th {
	background: #AAA url("/ui/thead-subdued-bg.gif") repeat-x left bottom;
	text-shadow: 1px 0 0 #666;
}
.CANCELLED th, .CANCELLED td {
	border: 1px solid #CCC;
}
.CANCELLED tr.sub-header {
	background: #CCC;
	color: #666;
	font-weight: bold;
}
.CANCELLED tbody.items tr.odd td {
	background: #CCC;
}
.CANCELLED dt {
	color: #666;
}
.CANCELLED tbody.items td[colspan] {
	text-align: center;
}


/* =================================================
More Links (Previous/Next)
==================================================== */
.prev-and-next {
	width: 100%;
	height: 27px;
	margin: 0 0 18px
}
.prev-and-next a {
	background: #eee;
	display: inline;
	float: left;
	padding: 4px 15px;
	text-decoration: none;
	-webkit-border-radius: 13px;
	-moz-border-radius: 13px;
}
ul.prev-and-next {
	list-style: none;
}
ul.prev-and-next li {
	display: inline;
}
ul.prev-and-next li.next a {
	float: right !important;
}

/* =================================================
Basket/Quote Content (Table)
==================================================== */
.basket {
	border: none;
}
.basket h3 { 
	margin: 0;
}
.basket thead {
	border: 1px solid #369;
}
.basket tbody {
	border: 1px solid #CCC;
}
.basket tfoot {
	font-size: 1.25em; border: none;
}
.basket thead th, .basket tbody td {
	border-left: none;
	border-right: none;
}
.basket .total {
	background: #FF9;
}
.basket tfoot td { 
	border: none; 
}
.basket h3 a { 
	text-decoration: none; color: #000;
}
.basket a.more {
	background: url("/ui/bullet.gif") no-repeat left center; 
	padding-left: 15px;
	text-decoration: none;
	color: #000;
}
.basket a.more:hover {
	text-decoration: none;
}
.basket tfoot small {
	display: block; font-weight: normal; font-size: 65%; margin: 0; color: #999;
}
td.shipping-option { 
	vertical-align: middle;
}
td.shipping-option h3 { 
	
}
.basket tfoot th { 
	border: 1px solid #CCC; 
	vertical-align: middle;
}
tr.total th { 
	background: #FF9;
}
fieldset#shipping-option { 
	/*border: 1px solid #CCC;
	padding: 1em;*/
	margin-right: 40px;
}
	fieldset#shipping-option ul {
		margin-left: 0; list-style: none;
	}
		fieldset#shipping-option li {
			display: block; margin-left: 0; padding: 0;
		}
		fieldset#shipping-option a {
			display: block; padding: 3px; background: url("/ui/bullet.gif") no-repeat 5px 50%; padding-left: 20px; 
		}
		fieldset#shipping-option a.selected {
			 color: #000; text-decoration: none; font-weight: bold;
		}
		fieldset#shipping-option a:hover,
		fieldset#shipping-option a:focus {
			color: #000;
		}


/* =================================================
Unavailable Products Table
==================================================== */
#unavailable {
	border: none;
}
#unavailable thead {
	border: 1px solid #CCC;
}
#unavailable thead th {
	background: #CCC; color: #FFF; text-shadow: 1px 0 0 #999; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC;
}
#unavailable tbody {
	border: 1px solid #CCC;
}
#unavailable tfoot {
	 border: none;
}
#unavailable thead th, #unavailable tbody td {
	border-left: none;
	border-right: none;
}
#unavailable h3 a { 
	text-decoration: none; color: #999;
}
#unavailable p {
	color: #999;
}
#unavailable a {
	color: #999;
}
#unavailable input.update-quantity {
	background: #EEE; color: #999; border: 1px solid #BBB;
}



p.forbid-order { font-weight: bold; }

#payment-option form {  }
	#payment-options fieldset { margin: 0 0 2em; }
	#payment-option label { text-align: left; float: none; width: auto; display: inline; margin: 0; padding: 0; }
	#payment-option input.radio { padding: 0; margin: 0; display: inline; float: none; }
	#payment-option #proceed { }


#basket-acc {  }
	.basket-accessory { padding: 0.75em 0; border-top: 1px solid #CCC; }
	.basket-accessory a { text-decoration: none; }
	.basket-accessory h4 { margin: 0; }
		.basket-accessory h4 a { color: #000; }
	.basket-accessory em { font-weight: normal; }
	.basket-accessory img { margin: 0 10px 10px 0; float: left; }
	.basket-accessory p { margin: 0 0 0 77px; /* img width + margins */ }
		.basket-accessory p a { color: #666; }
	.basket-accessory a.add { display: block; margin: 0.6em 0 0; width: 70px; height: 30px; background: url("/ui/buttons/add-sprite.gif") no-repeat 0 0; }
		.basket-accessory a.add:hover, .basket-accessory a.add:focus { background-position: 0 -30px; }


/* =================================================
Float clearing (see P.I.E: www.positioniseverything.net)
==================================================== */
.clearfix:after, form div.row:after, #head:after, #head ul:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix, form div.row, #head, #head ul {
	display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix, * html form div.row, * html form #head {
	height: 1%;
}
.clearfix, form div.row, #head, #head ul {
	display: block;
}
/* End hide from IE-mac (commented backslash hack) */

/* =================================================
jQuery Tabs
==================================================== */
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { 
/* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
.ui-tabs-hide { display: none; }
}

/* Hide useless elements in print layouts... */
@media print {
.ui-tabs-nav { display: none; }
}

/* Skin */
ul.tabs li { background-image: none; padding: 0; }
/*.ui-tabs-nav { font-size: 1.1em; }*/
.ui-tabs-nav { list-style: none; margin: 0; padding: 0; }
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */ display: block; clear: both; content: " "; }
.ui-tabs-nav li { list-style: none; float: left; margin: 0 0 0 0.3em; min-width: 7em; /* be nice to Opera */ }
.ui-tabs-nav a, .ui-tabs-nav a span { display: block; padding: 0 1em; background: url("/ui/tab2.gif") no-repeat; }
.ui-tabs-nav a { margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */ padding-left: 0; color: #999; font-weight: bold; line-height: 1.8em; text-align: center; text-decoration: none; white-space: nowrap; /* required in IE 6 */ outline: 0; /* prevent dotted border in Firefox */ }
.ui-tabs-nav .ui-tabs-selected a { position: relative; top: 1px; z-index: 2; margin-top: 0; color: #000; }
.ui-tabs-nav a span { width: 5.5em/*64px*/; /* IE 6 treats width as min-width */ min-width: 5.5em/*64px*/; height: 1.5em; /* IE 6 treats height as min-height */ min-height: 1.5em/*18px*/; padding-top: 6px; padding-right: 0; }
*>.ui-tabs-nav a span { /* hide from IE 6 */ width: auto; height: auto; }
.ui-tabs-nav .ui-tabs-selected a span { padding-bottom: 1px; }
.ui-tabs-nav .ui-tabs-selected a, .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active { background-position: 100% -150px; }
.ui-tabs-nav a, .ui-tabs-nav .ui-tabs-disabled a:hover, .ui-tabs-nav .ui-tabs-disabled a:focus, .ui-tabs-nav .ui-tabs-disabled a:active { background-position: 100% -100px; }
.ui-tabs-nav .ui-tabs-selected a span, .ui-tabs-nav a:hover span, .ui-tabs-nav a:focus span, .ui-tabs-nav a:active span { background-position: 0 -50px; }
.ui-tabs-nav a span, .ui-tabs-nav .ui-tabs-disabled a:hover span, .ui-tabs-nav .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span { background-position: 0 0; }
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */ cursor: text; }
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-unselect a:hover, .ui-tabs-nav .ui-tabs-unselect a:focus, .ui-tabs-nav .ui-tabs-unselect a:active { /* @ Opera, we need to be explicit again here now... */ cursor: pointer; text-decoration: none/*underline*/; color: #000; }
.ui-tabs-panel { border-top: 1px solid #999; padding: 2em 0; background: #FFF; /* declare background color for container to avoid distorted fonts in IE while fading */ }
.ui-tabs-nav .ui-tabs-selected a { text-decoration: none; /* turn off underline for selected tab hovers, etc */ }
.ui-tabs-loading em { padding: 0 0 0 20px; background: url("/ui/loading.gif") no-repeat 0 50%; }

#tab-container { margin: 1em 0 1.5em; }

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */ display: inline-block; }
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */ display: inline-block; }



/* =================================================
Header (Notable)
==================================================== */
#header { border-top: 5px solid #666; }
div#header { position: relative; height: 54px; margin: 0 auto 27px; }

div#header h3 { float: left; font-size: 24px; line-height: 1; margin: 0; position: absolute; top: 21px; left: 0; letter-spacing: -1px; }
div#header h3 a, div#header h3 a:visited { font-weight: bold; }
div#header h3 a:hover { color: #777; }
div#header h3 { background: url("/ui/macwarehouse.gif") no-repeat left top; height: 25px; width: 160px; }
div#header h3 em { position: absolute; left: -999em; }

ul.navi li a, ul.navi li a:visited { width: 85px; }
ul.navi { float: right; margin: 0; }
ul.navi li { display: block; float: left; line-height: 1; }
ul.navi li a { display: block; font-weight: bold; width: 90px; margin: 9px 0 0 0/*-1px*/; padding: 18px 5px 11px 15px; text-decoration: none; color: #333; cursor: pointer; }
ul.navi li a:hover, 
ul.navi li.current a { background: #666; color: #FFF; border: 0; margin: 0; padding-top: 27px; text-shadow: 0 -1px 1px rgba(0,0,0,.25); -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius: 0 0 3px 3px; position: relative; z-index:2; }
ul.navi li span { display: block; font-size: 16px; line-height: 1; font-weight: bold; }



/* ================================================= 
Configurator Link (Catalogue)
==================================================== */
#config {  }
	#config p {  }
	#config big { display: block; }
	#config a {  }

.transparent {
	/* cross-browser transparency */
	opacity: 0.7; /* Modern Browsers */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /* IE 8 */
	filter: alpha(opacity=70); /* IE 5-7 */
	-moz-opacity: 0.7; /* Netscape */
	-khtml-opacity: 0.7;  /* Safari 1 */
}


.element {
	/* cross-browser min-height/min-width */
	height: auto !important;/*all browsers except ie6 will respect the !important flag*/
	min-height: 500px;
	height: 500px; /*Should have the same value as the min height above*/
}




#apple-products dl a,
#apple-products dl a:visited { text-decoration: none; }
#apple-products dl a:hover,
#apple-products dl a:active,
#apple-products dl a:focus { text-decoration: none; color: #000 }
	#apple-products dt a { color: #000; }
	#apple-products dd { margin-left: 0; font-size: 13px; }
	#apple-products dd a { color: #999; padding-left: 14px; background: url("/ui/bullet.gif") no-repeat left center; }
	#apple-products dd a:hover,
	#apple-products dd a:focus { text-decoration: none; }

/* =================================================
Global Navigation
==================================================== */
#global-nav {
	/*background: url("/ui/navigation/global-nav-bck-rpt.gif") repeat-x top;*/
	width: 940px;
	height: 37px;
}
#global-nav ul {
	padding: 0;
	margin: 0;
	position: relative;
	z-index: 100;
}
#global-nav li ul { 
	border-bottom: 1px solid #CCC;
	position: relative;
	top: auto; 
	z-index: 9999;
}
#global-nav ul li {
	float: left;
	list-style-type :none;
	margin: 0;
	padding: 0;
}
#global-nav li ul a {
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
}
#global-nav ul li a {
	display: block;
	padding: 9px 10px 10px;
}
#global-nav ul li a.drop {
	padding-left: 19px;
	background: url("/ui/dropnav-arrow.gif") no-repeat 6px 50%;
}
#global-nav ul li a.basket {
	padding-left: 25px;
	background: url("/ui/basket.gif") no-repeat 6px 50%;
}

#global-nav ul li a:link, #global-nav ul li a:visited {
	color: #000;
	text-decoration: none;
}
#global-nav ul li a:hover {
	color: #06F;
	text-decoration: none;
}
#global-nav ul.set2 li {
	border-right: none;
}
#global-nav ul.set2 {
	float: right;
}
#global-nav ul.set1 li.active-trail {
	border-left: none;
	border-right: none;
}
/*#global-nav ul li.active-trail a.active:link, #global-nav ul li a.active:visited*/
#global-nav ul li.active-trail a.active {
	color: #FFF;
	font-weight: bold;
	/*background: url("/ui/navigation/global-nav-bck-active.gif") no-repeat top;*/
	padding: 10px 10px 15px;
}
#global-nav ul li.active-trail a.active:hover {
	color: #FFF;
	font-weight: bold;
	/*background: url("/ui/navigation/global-nav-bck-active.gif") no-repeat top;*/
	padding: 10px 10px 15px;
}

#global-nav li ul { background: #FFF; }

/* Submenu */

.hasChildren {
	/* for jQuery to apply */
	position: absolute;
	width: 5px; 
	height: 5px;
	background: black;
	right: 0;
	bottom: 0; 
}
#global-nav li ul {
	display: none;
	position: absolute;
	left: auto;
	top: 100%;
	padding: 0;
	margin: 0;
	background: #EEE;
	z-index: 999;
}
#global-nav li:hover > ul {
	font-size: 13px;
	display: block;
	z-index: 1000;
	box-shadow: 0 0 6px rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0 6px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0 6px rgba(0,0,0,0.3);
}
#global-nav li ul li, #global-nav li ul li a {
	float: none;
	display: block;
}
#global-nav li ul li {
	_display: inline; /* for IE6 */
	position: relative;
}
#global-nav li ul li a {
	width: 150px;
	display: block;
	border-top: 1px solid #CCC;
	padding: 0.35em 0.5em;
}

/* Sub-Sub Menu */
#global-nav li ul li ul {
	display: none;
}
#global-nav li ul li:hover ul {
	left: 100%;
	top: 5px;
	left: 160px;
	margin: 0;
}
#global-nav li form,
#global-nav li fieldset {
	margin: 0; 
	padding: 0; 
	border: none;
}
#global-nav li form {
	margin: 0 1em;
}
#global-nav li form input[type="text"] {
	border: none;
       /* turn off the CSS3 attributes (set earlier) */
	border-radius: none; 
	-moz-border-radius: none;
	-webkit-border-radius: none;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

/* =================================================
Footnotes DIV
==================================================== */
.footnotes {
	clear: both;
	font-size: 0.75em;
	color: #999;
	border: 1px solid #CCC;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px; /* the as-yet unpublished "standard" */
	-moz-box-shadow: 0 0 6px rgba(66,66,66,.5);
	-webkit-box-shadow: 0 0 6px rgba(66,66,66,.5);
	box-shadow: 0 0 6px rgba(66,66,66,.5); /* the as-yet unpublished "standard" */
	margin: 2em 1em;
	padding: 1em;
}
.footnotes a { color: #666; }
.footnotes ol,
.footnotes ul,
.footnotes p { margin-bottom: 0; }


/* =================================================
Special Quote Section
==================================================== */
.big-quote { /*position: relative; float: left; width: 960px; height: 250px;*/ font-family: Georgia,serif; color: #C31B77/*#000#B39*/; margin: 0 0 1em 0; }
	.big-quote p { /*float: left; position: relative;*/ background: url("img/bg_quote.gif") top left no-repeat; margin-left: 30px; margin-top: 1em; padding-left: 60px; font-size: 2em; /*width: 760px;*/ line-height: 110%; }
		.big-quote p a { color: #000/*#B39*/; text-decoration: none; }
	.big-quote cite { margin-left: 10px; color: #999; font-style: italic; font-size: 0.4em!important; }


/* =================================================
Address Scroller (UL-based) ["choose-delivery-addres" and "my-delivery-addresses"]
==================================================== */
.scroller {
	height: 15.4em; /* will accomodate 7 single-list list entries */
	overflow: auto;
	border: 3px solid #DDD;
	margin: 1em;
}
	.scroller ul {
		list-style: none;
		margin: 0;
	}
	.scroller li {
		margin: 0;
		padding: 0;
	}
	.scroller ul a {
		padding: .35em 0.5em;
		display: block;
		border-bottom: 1px solid #CCC;
	}
	.scroller ul li:last a { 
		border-bottom: none;
	}
	.scroller a:link {
		text-decoration: none;
		background: #FFF;
	}
	.scroller a:hover,
	.scroller a:focus { 
		text-decoration: none;
		background: #06F/*#039 #FF9*/;
		color: #FFF;
	}


/* =================================================
Product Compatibility
==================================================== */
.compat-mac { background: url("/ui/compat-mac.gif") no-repeat left center; padding-left: 20px; }
.compat-pc { background: url("/ui/compat-pc.gif") no-repeat left center; padding-left: 20px; }


/* =================================================
Recent Invoices Table
==================================================== */
table#inv-list { width: 100%; }
	table#inv-list a { text-decoration: none; }
	table#inv-list a:hover,
	table#inv-list a:focus { text-decoration: none; }


/* =================================================
FAQ page
==================================================== */
body.faq {  }
	body.faq #content h2 { margin: 2.3em 0; font-size: 1.5em; padding-top: 1em; border-top: 1px solid #CCC; }
	body.faq #content dl { margin-left: 2em; }
	body.faq #content dt { font-size: 1.2em; margin: 1em 0; }
	body.faq #content dt:before { content: "Question: "; }
	body.faq #content dd { margin: 0.714285em 0 0.714285em 2em; }


/* =================================================
Payment Type (Basket Sidebar)
==================================================== */
#payment-type { list-style: none; margin: 0; padding: 0; }
	#payment-type li { margin: 0 0 .5em; padding: 0; }
	#payment-options span { display: none; }
	#payment-type a { display: block; height: 30px; width: 150px; }

	#pay-card a { background: url("/ui/buttons/pay-with-card.gif") no-repeat 0 0; }
	#pay-accnt a { background: url("/ui/buttons/pay-on-account.gif") no-repeat 0 0; }
	#accnt-req a { background: url("/ui/buttons/account-requsition.gif") no-repeat 0 0; }
	#card-req a { background: url("/ui/buttons/card-requisition.gif") no-repeat 0 0; }
	#cnvrt-quote a { background: url("/ui/buttons/save-as-quote.gif") no-repeat 0 0; }
	#start-chkout a { background: url("/ui/buttons/start-checkout.gif") no-repeat 0 0; }

	#payment-type a:hover,
	#payment-type a:focus { background-position: 0 -30px; }
	#payment-type a:active { background-position: 0 -60px; }


.acc-menu ul { list-style: none; margin-left: 0; }
	.acc-menu li { margin: 0 0 0.5em; padding-left: 20px; background: url("/ui/bullet.gif") no-repeat 0 .35em; }
	.acc-menu a { display: block; font-weight: bold; }

/* =================================================
Configurator Link (in Folder Hierarchy)
==================================================== */
.print-supplies-config { border: 1px solid #CCC; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; padding: 0.5em; margin: 0 0 1em; }
	.print-supplies-config h3 { font-size: 1.5em; line-height: 1; margin: 0; padding: 0; }
	.print-supplies-config p { font-weight: normal; color: #666; margin: 0; }
	.print-supplies-config p a { font-weight: bold; }
	.print-supplies-config a { text-decoration: none; }
	.print-supplies-config a:hover,
	.print-supplies-config a:focus { color: #039; text-decoration: none; }



/* =================================================
Result Page (Grid)
==================================================== */
.results-grid { margin: 0; padding: 0; width: 100%; list-style: none; }
.results-grid .grid_third { margin-bottom: 20px; }
	/* grid_third is 300px wide */
	.results-grid .img { float: left; display inline; width: 70px; margin-right: 10px; text-align: center; /* image is 67px wide */ }
	.results-grid .info { float: left; display inline; width: 210px; margin-left: 10px; }

		.results-grid h3 { margin: 0; color: #777; }
			.results-grid h3 small { color: #999; font-weight: light; }
			.results-grid h3 a { color: #039; text-decoration: none; }
			.results-grid h3 a:hover,
			.results-grid h3 a:focus { color: #000; }
			.results-grid h3 img { float: left; margin: 0 10px 0 0; }
		.results-grid p { font-size: 0.875em; margin-left: 77px; /* img width + margins */ }
		.results-grid dl,
		.results-grid dt,
		.results-grid dd { margin: 0; padding: 0; }
		.results-grid dd a.add { margin-top: 5px; }

/* =================================================
Result Page (Style Switchers)
==================================================== */
.result-style-list { background: url("/ui/icon/results-list.gif") no-repeat left center; padding-left: 14px; }
.result-style-grid { background: url("/ui/icon/results-grid.gif") no-repeat left center; padding-left: 14px; }




div.extra-products { margin: 0 0 2em; }
	div.extra-products h2 { margin: 1em 0 0; font-size: 1.7em; letter-spacing: -1px; }