/**
 * Author: Stephen Wilson
 *
 * Version: 1.0.0
 *
 * Date: XX XX 2010
 *
 * Contents:
 * 1. HTML ELEMENTS
 * 2. NAVIGATION
 * 3. LAYOUT
 * 4. CORNERS 'N' BORDERS
 * X. *** IE6 ***
 */

* { margin:0; padding:0; }

body { color:#333; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:1.5em; }

/* --------->>> 1. HTML ELEMENTS <<<--------- */

a { outline:none; color:#04a; text-decoration:none; }

a:hover { text-decoration:underline; }

a.buyNow { display:block; height:21px; font-weight:bold; text-align:center; line-height:21px; cursor:pointer; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; }

h1 { color:#04a; font:normal 36px/1.1em Arial, Helvetica, sans-serif; }

h2,
h3 { margin-bottom:10px; color:#04a; }

h2 { font:bold 18px/1.4em Arial, Helvetica, sans-serif; }

h3 { font:bold 14px/1.5em Arial, Helvetica, sans-serif; }

h4,
h5,
h6 { color:#04a; font:bold 12px/1.5em Arial, Helvetica, sans-serif; }

hr { width:100%; height:1px; margin-bottom:10px; border:none; background-color:#ccc; color:#ccc; }

img { border:none; }

img.alignL { display:inline; float:left; margin:0 10px 10px 0; }

img.alignR { display:inline; float:right; margin:0 0 10px 10px; }

p { margin-bottom:10px; }

p.small { margin-bottom:5px; font-size:11px; font-style:italic; line-height:1.4em; }

table { width:100%; border:none; border-collapse:collapse; margin-bottom:10px; font-size:11px; line-height:1.4em; }

table td,
table th { padding:4px; }

table.data tr.odd { background-color:#eef; }

table.data th { font-size:12px; line-height:1.5em; }

table.data th,
table.data td { border-bottom:1px solid #ccc; }

table.data th.odd,
table.data td.odd { background-color:#eef; }

table.data .buyNow { width:58px; border:1px solid #017; background:#04a; color:#fff; font-size:11px; background:-moz-linear-gradient(top, #37d, #04a); background:-webkit-gradient(linear, left top, left bottom, from(#37d), to(#04a)); }

#headerColumn2 { color:#04a; font:normal 30px/100px Arial, Helvetica, sans-serif; text-align:right; }

#contentColumn1 ul,
#contentColumn2 ul { list-style:none; }

#contentColumn1 ul li { border-bottom:1px solid #ccc; padding:6px 0; }

#contentColumn1 ul li.last { border-bottom:none; }

#contentColumn1 ul li a { color:#04a; font-weight:bold; }

#contentColumn2 ul { margin-bottom:10px; margin-left:10px; }

#contentColumn2 ul li { padding-left:21px; background:url(../images/bullet.png) no-repeat 0 1px; }

#contentColumn2 .column1 img { padding:4px; border:1px solid #ccc; background-color:#fff; }

#contentColumn2 .column1 form img { padding:0; border:none; } /* Temp hack */

#products,
#contentColumn2 .column2 { font-size:11px; }

#products a,
#contentColumn2 .column2 a { color:#fff; }

#products a.buyNow,
#contentColumn2 .column2 a.buyNow { width:58px; border:1px solid #017; background:#fff; color:#017; background:-moz-linear-gradient(top, #fff, #ccc); background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#999)); }

#products a.buyNow { /*margin:0 auto;*/ }

#products h3,
#contentColumn2 .column2 h3 { margin-bottom:5px; color:#fff; font:normal 18px/1.4em Arial, Helvetica, sans-serif; }

#products h4,
#contentColumn2 .column2 h4 { color:#fc0; font:bold 18px/1.4em Arial, Helvetica, sans-serif; }

#products table,
#contentColumn2 .column2 table { margin:0; }

#promotion { color:#fff; }

#promotion h3 { text-transform:uppercase; }

#banner a.buyNow { float:left; width:160px; margin-right:10px; border:1px solid #666; background:#fff; color:#017; background:-moz-linear-gradient(top, #fff, #ccc); background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#999)); }

#banner h1,
#banner p { color:#fff; text-shadow:#017 1px 1px 3px; }

#banner p { font-size:18px; line-height:1.4em; }

#footer ul { list-style:none; }

#footer ul li a { color:#666; }

#footer .column1 p { color:#04a; }

#footer .column2 p { text-align:right; }

/* --------->>> 2. NAVIGATION <<<--------- */

/* Main menu */

#navigation ul { height:35px; margin-bottom:10px; padding:0 20px; background:url(../images/navigation-ul.png); }

#navigation ul li { display:inline; float:left; padding:0 0 0 11px; background:url(../images/navigationUP.png) 0 50%; }

#navigation ul li a { display:block; padding:0 11px 0 0; background:url(../images/navigationUP.png) 100% 50%; color:#04a; line-height:35px; }

#navigation ul li#selected { background:url(../images/navigationOVER.png) 0 50%; }

#navigation ul li#selected a { background:url(../images/navigationOVER.png) 100% 50%; color:#fff; }

#navigation ul li#selected a:hover { text-decoration:none; }

/* --------->>> 3. LAYOUT <<<--------- */

#page { width:870px; margin:0 auto; }

#headerColumn1,
#headerColumn2 { display:inline; float:left; width:50%; }

#logo { width:370px; height:70px; margin-top:10px; background:url(../images/logo.png); font-size:0; line-height:0; text-indent:-9999px; }

#contentColumn1,
#contentColumn2 { display:inline; float:left; overflow:hidden; }

#contentColumn1 { width:180px; margin-right:10px; }

#contentColumn2 { width:680px; }

#contentColumn2 .column1,
#contentColumn2 .column2 { display:inline; float:left; }

#contentColumn2 .column1 { width:490px; margin-right:10px; }

#contentColumn2 .column2 { width:180px; }

#addThis,
#promotion { text-align:center; }

#promotion { /*width:170px; height:255px; margin-bottom:10px; background:url(../images/promotion.png);*/ }

#promotionInner { padding:10px; }

#banner { width:660px; height:200px; margin-bottom:10px; padding:9px; border:1px solid #ccc; background-color:#fff; }

#bannerInner { height:140px; padding:30px 10px 30px 245px; }

#banner .style1 { background:url(../images/banner-style1.jpg); }

#banner .style2 { background:url(../images/banner-style2.jpg); }

#products { width:700px; }

#products .blockStyle2,
#products .cbStyle2 { display:inline; float:left; margin-right:10px; }

#products .blockStyle2 { width:85px; }

#products .cbStyle2 { width:105px; }

#footer { margin-top:20px; border-top:5px solid #04a; background-color:#eef; }

#footerInner { padding:5px 15px; }

#footer .column1,
#footer .column2 { display:inline; float:left; width:50%; }

#footerColumn1,
#footerColumn2,
#footerColumn3,
#footerColumn4 { display:inline; float:left; width:210px; }

.clear { clear:both; height:0; font-size:0; line-height:0; }

/* --------->>> 4. CORNERS 'N' BORDERS <<<--------- */

.cbStyle1,
.cbStyle2 { margin-bottom:10px; }

.cbStyle1 .cornerT,
.cbStyle2 .cornerT,
.cbStyle1 .cornerB,
.cbStyle2 .cornerB { margin:0 0 0 20px; }

.cbStyle1 .cornerT div,
.cbStyle2 .cornerT div,
.cbStyle1 .cornerB div,
.cbStyle2 .cornerB div { position:relative; left:-20px; width:20px; font-size:0; line-height:0; }

/* Style 1 */

.cbStyle1 .cornerT { height:10px; background:url(../images/cbStyle1Corner.png) no-repeat 100% 0; }

.cbStyle1 .cornerB { height:10px; background:url(../images/cbStyle1Corner.png) no-repeat 100% 100%; }

.cbStyle1 .cornerT div { height:10px; background:url(../images/cbStyle1Corner.png) no-repeat 0 0; }

.cbStyle1 .cornerB div { height:10px; background:url(../images/cbStyle1Corner.png) no-repeat 0 100%; }

.cbStyle1 .borderL { padding:0 0 0 9px; border-color:#ccc; border-style:solid; border-width:0 0 0 1px; background:#fff url(../images/cbStyle1Border.png) no-repeat 0 100%; }

.cbStyle1 .borderR { padding:0 9px 0 0; border-color:#ccc; border-style:solid; border-width:0 1px 0 0; background:#fff url(../images/cbStyle1Border.png) no-repeat 100% 100%; }

.cbStyle1 .content { display:block; width:100%; background:#fff url(../images/cbStyle1Content.png) repeat-x 0 100%; }

/* Style 2 */

.cbStyle2 .cornerT { height:10px; background:url(../images/cbStyle2Corner.png) no-repeat 100% 0; }

.cbStyle2 .cornerB { height:10px; background:url(../images/cbStyle2Corner.png) no-repeat 100% 100%; }

.cbStyle2 .cornerT div { height:10px; background:url(../images/cbStyle2Corner.png) no-repeat 0 0; }

.cbStyle2 .cornerB div { height:10px; background:url(../images/cbStyle2Corner.png) no-repeat 0 100%; }

.cbStyle2 .borderL { padding:0 0 0 9px; border-color:#017; border-style:solid; border-width:0 0 0 1px; background:#37d url(../images/cbStyle2Border.png) no-repeat 0 100%; }

.cbStyle2 .borderR { padding:0 9px 0 0; border-color:#017; border-style:solid; border-width:0 1px 0 0; background:#f00 url(../images/cbStyle2Border.png) no-repeat 100% 100%; }

.cbStyle2 .content { display:block; width:100%; background:#37d url(../images/cbStyle2Content.png) repeat-x 0 100%; color:#fff; }

/* ... */

/*
.cbStyle1 .content:after,
.cbStyle2 .content:after { display:block; clear:both; height:0; content:"."; visibility:hidden; }

.cbStyle1 .content,
.cbStyle2 .content { display:inline-block; } for IE Mac */

/* No script */

.blockStyle1 { margin-bottom:10px; padding:9px; border:1px solid #ccc; background:#fff url(../images/cbStyle1Content.png) repeat-x 0 100%; }

.blockStyle2 { margin-bottom:10px; padding:9px; border:1px solid #017; background:#7cd url(../images/cbStyle2Content.png) repeat-x 0 100%; color:#fff; }

/* --------->>> X. *** IE6 *** <<<--------- */

#ie6 { padding:10px; border-bottom:1px solid #000; background-color:#c00; color:#fff; text-align:left; }

#ie6 div { padding-left:26px; background:url(../images/ie6.png) no-repeat 0 50%; }

#ie6 div a { color:#fff; font-weight:bold; }

/* Quick fixes */

#overDiv table { width:200px !important; margin-bottom:0 !important; padding:0 !important; font-size:11px !important; line-height:1.4em !important; }

#overDiv table td { padding:0; }