/* -- global styles --------------------*/

body     { background:url(../images/spring/back-tile.gif);}

* { margin:0; padding:0; outline:none;}

.clearAll      { clear:both; font-size:1px; line-height:1px; height:.01em;}
.clearAll span { display:block; height:1px;}
p.clearAll     { margin:0 0 10px 0; padding:10px 0 0 0;}

.spacer8      { height:8px;}

.fLeft  {float:left;}
.fRight {float:right;}



/* -- main layout --------------------*/
#shell   { margin:0 auto; background:url(../images/spring/back-sundial.gif) 160px 0 no-repeat; border-top:1px dotted #eff4d9;}
#shell, #header, #topNav, #content, #footer   { width:980px;}
#header, #topNav, #content, #footer   { margin-top:10px;}

#header  { height:70px;}
#topNav  { height:28px; background: url(../images/spring/topNav-grad.gif) repeat-x; text-align:center;}
#content { text-align:left;}
#footer  { height:50px;}

#sideBar { background:url(../images/spring/back-sidebar.jpg) 1px 0 no-repeat; float:left; padding:20px; min-height:400px;}

#sideBar, .clearAll span { width:346px;}
.clearAll span {  padding:0 20px;}
#contentRt {width:550px; float:right;}

#shell, #header, #sideBar, #contentRt, #topNav ul,#topNav ul li,
#hero, .feature
 { position:relative;}

.sideBack {background:url(../images/spring/back-sidebarTile.gif) repeat-y;}

.twoCol   {float:left; width:346px; margin:10px 20px 0 0;}


/* -- colors --------------------*/
#footer,.clearAll span 
{ border-top:1px solid #ada257;}

#topNav, .textBar, #hero, .fiveRow div, select, .cartItem img, .cartQt input
{ border:1px solid #ada257;}

.productImage img, .category div img
{ border:4px solid #ada257;}

.cart
{ border:8px solid #ada257;}

.cartItem, p.clearAll, .twoCol p
{ border-bottom:1px solid #ada257;}

#logo p, #footer, .category div h1 span, .details span, .price span, .cartItem h3, .info h2, .checkout h4, .search h2, .orderItem p span, .tks h1
{ color:#90853e;}/*light brown color*/
 
#hdrTopRt p, input, .category, .product, .cartItem h2, .cartQt, .info p, .infoField, .search h2, .info ul,  .orderItem p, .tks h3, .tks p
{ color:#614c29;}/*main brown color*/

#sideBar h2, .disclaimerSide, .cart h1, .info h1
{ color:#e2fb9a;}

#sideBar h1 { color:#72a44e;}

#sideBar p.copy, .sideLinks h3, .name, .search h1
{color:#FFFFFF;}

span.error { color:#990000;}
p.error  { color:#FFFFFF !important; background:#990000; padding:2px 4px 4px 4px; margin-right:20px;}
input.error, select.error   { border:1px solid #990000; background:#FF8B8B;}

/*hovers*/
#hdrTopRt p a, .category h1 a, .info p a, .search p a, .search h2 a { color:#6a5835; text-decoration:none;}
#hdrTopRt p a:hover, .category h1 a:hover, .info p a:hover, .search p a:hover, .search h2 a:hover, .tks p a:hover { text-decoration:underline;}

#logo p a, #footer a, .info h2 a { color:#90853e; text-decoration:none;}
#logo p a:hover, #footer a:hover, .info h2 a:hover { text-decoration:underline;}

.sideLinks h3 a, .disclaimerSide a, .name a, .fiveRow div a { color:#FFFFFF; text-decoration:none;}
.sideLinks h3 a:hover, .disclaimerSide a:hover, .name a:hover, .fiveRow div a:hover { text-decoration:underline;}

.search h1,, .info h1, .cart h1 { background:#ada257;}

.search h1 a, .info h1 a   { color:#e2fb9a; background:#ada257; text-decoration:none; display:block; width:auto;}
.search h1 a:hover, .info h1 a:hover   { background:#a0761c;}

.cartQt a:link,.cartQt a:visited, .tks p a:link, .tks p a:visited { color:#6a5835; text-decoration:underline;}
.cartQt a:hover, .cartQt a:active, .tks p a:hover, .tks p a:active { color:#90853e; text-decoration:underline;}




/*-- fonts --------------------*/


#header, #topNav, input, #sideBar, .disclaimerSide, .category, .product, .name, .fiveRow, .cart, .info, .search, .tks h3, .tks h1
 { font-family:Georgia, "Times New Roman", Times, serif; letter-spacing:.04em;}

#footer, #sideBar p.copy, select, .textBar, .plainText p, .tks { font-family:Arial, Helvetica, sans-serif;}


#logo p, #footer, .disclaimerSide, .checkout h4 span
{ font-size:11px; line-height:14px;}

#hdrTopRt p, #sideBar p.copy, .btnMed1, .btnMed2, .product p, .details span, .price span, .info p, .total p span, .textBar, select, .error, .info ul, .tks p
{ font-size:12px; line-height:16px;}

.sideLinks h3, .category h1, .btnBigHey a, .cartItem h2, .cartItem h3, .total p, .search p, .tks h3
{ font-size:14px; line-height:16px;}

#sideBar h2, .cart h1, .info h1, .info h2, .checkout h4, .search h2, .tks h1
{ font-size:18px; line-height:20px;}

.name, .fiveRow div a, .product h1, .price, .search h1
{ font-size:22px; line-height:24px; font-weight:normal;}

#sideBar h2, .details span, .price span, .cart h1, .info h1, .info h2, .checkout h4, .tks h1 {text-transform:lowercase; font-weight:normal;}



/* -- buttons --------------------*/
.ltBtn1 a  { padding:2px 6px; background:#e7f1bc; border:2px solid #ccd9a5; margin:0 2px; display:inline-block;}
.ltBtn1 a:hover { background:#ada257; text-decoration:none !important; color:#FFFFFF !important;}


input.btnMed1, .btnMed1 a  { background:#628c45; border:2px solid #ada257; color:#FFFFFF; padding:1px 8px; display:inline-block; text-decoration:none;}
input.btnMed1:hover, .btnMed1 a:hover { background:#466531; cursor:pointer;}

.btnMed2 a  { background:#ada257; border:2px solid #d2c170; color:#FFFFFF; padding:1px 8px; text-decoration:none; display:inline-block;}
.btnMed2 a:hover { background:#988144; cursor:pointer;}

input.btnBigHey, .btnBigHey a  { display:block; background:#4c74b0; border:2px solid #ccd9a5; color:#FFFFFF; padding:6px 16px; text-decoration:none;}
input.btnBigHey:hover, .btnBigHey a:hover { background:#375684; cursor:pointer;}



/* -- form fields --------------------*/
.textBar, .cartQt input  { background:#fff url(../images/spring/field-grad.gif) repeat-x; margin:0 4px 0 0; padding:3px; }
select { margin:0 4px 0 0;}
option { padding:2px 4px;}


/* -- header --------------------*/
#logo                       { height:50px; width:400px; position:absolute; top:26px; left:8px;}
#hdrTopRt                   { position:absolute; top:0; right:0; width:660px; height:50px; text-align:right;}
#hdrTopRt form, #hdrTopRt p { float:right;}
#hdrTopRt p                 { margin-top:5px;}
#hdrTopRt form              { width:240px;}



/* -- footer --------------------*/
#footer              { padding-top:6px; clear:both;}



/* -- sidebar --------------------*/
#sideBar h1   { font-size:56px; line-height:54px; font-weight:normal;}
#sideBar p    { width:300px; margin:10px 0 0 0;}
#sideBar h2   { font-style:italic; border-bottom:1px solid #e2fb9a; margin:30px 0 6px 0; padding:0 0 3px 0; clear:both;}
.sideLinks h3 { font-weight:normal; background:url(../images/spring/ico-sidebarCarrot.gif) 0 1px no-repeat; padding:0 8px 0 15px; float:left; margin:3px 0;}

.view a, .view a img   { width:65px; border:none;}
.view a       { border:1px solid #e2fb9a; margin:6px 8px 2px 2px; float:left;}
.view a:hover { border:3px solid #e2fb9a; margin:4px 6px 0 0;}

.disclaimerSide {margin:4px 0 0 0;}

p.copy a img       { float:left; border:1px solid #e2fb9a; height:50px; margin:0 10px 10px 0; opacity:.65; filter:Alpha(opacity=65);}
p.copy a img:hover { opacity:100; filter:Alpha(opacity=100);}



/* -- home page --------------------*/
#hero    { height:320px; background:url(../images/spring/back-sidebar.jpg) no-repeat;}
.title   { float:left; margin:20px 0 0 20px; display:inline;}

.feature { height:320px; width:594px; float:right; background-repeat: no-repeat;}
.image       { display:block; height:300px; width:574px; border:none; margin:10px;}
.image:hover { border:1px solid #e2fb9a; height:298px; width:572px;}

.feature .name { position:absolute; left:-330px; top:200px; width:300px; height:80px; text-align: right; padding:0 18px 0 0; background:url(../images/spring/ico-sidebarCarrot.gif) top right no-repeat;}
.name span     {font-size:14px;}

.fiveRow { margin:10px 0 0 0; height:240px;}
.fiveRow div { width:186px; height:240px; margin:0 10px 0 0; float:left; display:inline; background-repeat:no-repeat;}
.fiveRow div a { display:block; width:162px; height:216px; background:url(../images/spring/fiveRow-gradW.png) 0 0 no-repeat; padding:12px;}
.fiveRow div a:hover {border:2px solid #e2fb9a; padding:10px;}
.noMarg  {margin:0 !important;}



/* -- category page --------------------*/
.category   {}
.category div         { float:left; margin:200px 20px 0 0; position:relative; height:60px; width:160px;}
.category div h1      { font-weight:normal; width:140px; position:absolute; top:5px;}
.category div img     { position:absolute; bottom:60px;}
.category div p.mag   { position:absolute; top:5px; right:0;}
.category div p.mag a { display:block; height:21px; width:16px; background:url(../images/spring/ico-mag.gif) no-repeat;}



/* -- product page --------------------*/
.product    {}
.product h1 { margin:20px 0 5px 0;}

.productImage img   { float:left; margin:0px 10px 0 0;}
.thumbs             { float:left;}
.thumbs img         { float:none; margin:0 10px 10px 0;} 
.thumbs a img:hover { border:4px solid #e2fb9a;}

.product p    { width:300px; float:left; margin:10px 0 0 0;}
.details      { float:right; width:230px; margin:10px 0 0 0;}
.details p    { width:145px; margin:0 0 6px 0;}
.details span { display:block; width:75px; float:left; margin:0 10px 6px 0; font-style:italic; text-align:right;}
.price        { float:left; height:30px; width:415px; text-align:right; padding:0 4px; margin:1px 0 0 0; background:#ccd9a5;}
.price span   { font-style:italic;}
.price select { width:130px; float:left; margin:5px 0 0 0;}



/* -- pop over cart --------------------*/
#cartBox   { position:absolute; width:351px; top:35px; right:30px; z-index:1000;}

.top               { background:url(../images/spring/cart-menuTop.gif) no-repeat; height:10px;}
.cart              { width:335px; background:#FFFFFF; float:left;} 
.cart h1           { padding:0 4px 8px 4px; font-style:italic;}
.cartItem          { margin:6px; padding-bottom:6px;}
.cartItem img      { width:50px; float:left;}
.cartItem h2, .cartItem h3 { width:260px; padding:6px 0 0 0; float:right; font-weight:normal;}
.cartQt            { margin:0 10px; font-size:12px;}
.cartQt input      { width:20px;}
.cartItem .btnMed1 { margin-top:2px;}
.checkout          { margin:6px;}
.checkout h4       { float:left;}
.close             { position:absolute; top:20px; right:8px;}



/* -- cart and checkout page --------------------*/
.infoBox       { clear:both; padding:10px 0 0 80px;}
.info span.btnMed1 { display:inline; float:right; margin:8px 20px 10px 0;}
.info h1       { padding:8px 4px 8px 8px; background:#ada257; font-style:italic;}
.info h2       { float:left; width:350px; padding:0 0 8px 0; font-style:italic;}
.info p        { clear:both;}
.info p span   { font-size:10px; font-style:italic;}
.infoField     { padding:10px 16px 0 0; float:left;}
.infoField p   { padding-bottom:3px;}
.infoField input { display:inline; float:left;}

.fWidth1 { width:218px;}
.fWidth2 { width:170px;}
.fWidth3 { width:70px;}
.fWidth4 { width:430px;}

.fWidth1 input,.fWidth1 select { width:205px;}
.fWidth2 input,.fWidth2 select { width:161px;}
.fWidth3 input,.fWidth3 select { width:62px;}

.total   { float:right; width:200px; padding-right:20px; margin-bottom:40px;}
.total p { text-align:right; padding:2px 0;}
.total p span { width:100px; text-align:right; float:left;}

.radioGroup { width:200px; float:left; text-align:right;}
.radioGroup p { margin:2px 0;}

.infoBox input.btnMed1 {float:right; margin:6px 20px 0 0;}

.info ul {margin:4px 20px;}



/* -- search --------------------*/
.search       {}
.search h1    { background:#ada257;}
.search h1 a  { padding:3px;}
.search h2    { padding:3px 0 3px 20px;}
.search p     { margin:3px 0 3px 40px; padding:2px; clear:both;}
.search p span   { float:left; padding-top:20px;}
.search p img { width:60px; border:4px solid #ada257; float:left; margin-right:10px;}
.search p img:hover { border:4px solid #e2fb9a;}

/* -- text --------------------*/
.plainText p { padding:0 0 8px 12px;}

/*-- sitte map -------*/
.twoCol h1   { font-size: 16px;}
.twoCol h1 a { padding:1px 0 1px 10px !important;}
.twoCol h2   { font-size: 14px;}
.twoCol h2   { font-size: 11px; line-height:13px;}
.twoCol p    {}


/* -- order History --------------------*/
.orderItem img    { width:30px; border:4px solid #ada257; float:left; margin:6px;}
.orderItem div    { float:right; width:220px; margin-right:20px;}
.orderItem h2     { float:left; margin:0; padding:6px; width:440px;}
.orderItem p      { float:left; margin:0; padding:0; width:220px;}
.orderItem p span { float:left; margin:0; padding:0 6px;; width:100px; text-align:right;}


/* -- thank you page --------------------*/
.tks { width:655px; margin:20px 0 0 40px;}
.tks td { border-bottom:1px solid #90853e; border-right:1px solid #90853e;}
.tks p, .tks h3 { padding:4px; font-weight:normal;}
.tks p.clearAll { width:500px;}

.tks div.type  { width:200px; text-align:right; padding:6px; float:left;}
.tks div.info  { width:300px; text-align:left; padding:6px; float:left;}


