@charset "utf-8"; /* Original design work, including graphics and all related scripts, Copyright (c) OCDesignsOnline.com, All Rights Reserved. Used with permission by Africa-Direct. */ /* General page formatting -------------------------------------------------- */ body { margin:0 2px !important; padding:0 !important; } .x-bg { background:#000 none; padding:10px 0; } .x-bg * { margin:0; padding:0; vertical-align:top; } .x-bg img { border:0; } .x-bg, .x-content { margin:0 auto; text-align:center; vertical-align:top; } .x-content { background:transparent none; padding:10px 0 !important; } .x-content, #x-head, #x-foot { width:960px; position:relative; margin:0 auto; } #x-bg-head, #x-bg-foot { width:100%; position:relative; margin:0 auto; } #CentralArea, #x-tmpl, #x-home, #x-shop, #x-feat, .x-tb-title, .x-tb-top, .x-tb-mid, .x-tb-btm, ul.x-tt { width:737px; } #LeftPanel, .x-ln-title, .x-ln-top, .x-ln-mid, .x-ln-btm { width:210px !important; } #CentralArea, #x-tmpl, #x-home { margin:0 !important; padding:0 !important; float:right; vertical-align:top; } #x-home { padding:0 !important; } #LeftPanel { margin:0 !important; padding:0 !important; float:left; vertical-align:top !important; } #CentralArea .r3 { background-color:#FFF; } /* catalog pg background, same as tb bg color */ #CentralArea .r3_cm { padding:10px; } #CentralArea .ctrlbr { padding:3px 10px; } #CentralArea .cmpBr { padding:0 10px; } #CentralArea span.pdmt img { vertical-align:middle; } #CentralArea span.tpr, #CentralArea a.tpr { font-size:11px; line-height:15px; padding-top:0; padding-bottom:0; } #TopPromoArea { display:none !important; margin:0 !important; padding:0 !important; } .x-bg * { font-family:Arial, Tahoma, Sans-serif; text-decoration:none; } .x-bg, .x-bg p, .x-bg a, .x-bg li { font-size:12px; color:#111; } .x-bg a:link, .x-bg a:visited, .x-bg a:active { color:#111; } .x-bg a:hover { color:#53AD7F; } .x-bg .x-tb-mid, .x-bg .x-tb-mid p, .x-bg .x-tb-mid a, .x-bg .x-tb-mid li { color:#EDE9DD; font-size:13px; } .x-bg .x-tb-mid a:link, .x-bg .x-tb-mid a:active, .x-bg .x-tb-mid a:visited { color:#F1DFA4; } .x-bg .x-tb-mid a:hover { color:#53AD7F; } .x-ln-mid, .x-ln-mid p, .x-ln-mid li, .x-tb-mid, .x-tb-mid p, .x-tb-mid li { text-align:left; line-height:18px; } #CentralArea p, #x-tmpl p, #x-home .x-tb-mid ul, #x-tmpl .x-tb-mid ul { padding:0 0 15px; } #CentralArea ul, #x-head ul, #LeftPanel ul, #x-foot ul, #x-tmpl ul, #x-tmpl ul.x-tt { list-style-type:none; } #CentralArea li, #x-tmpl li { background:transparent url(images/x-tb-bull.png) 0 0 no-repeat; padding:0 0 5px 15px; } #x-hd-menu li, #x-tmpl ul.x-tt li { display:inline; float:left; background:transparent none; padding:0; } .x-tb-mid ol { padding:0 15px 15px 25px; } .x-tb-mid ol li { background:transparent none; padding:0 0 5px 0; } .x-tb-mid a, .x-tb-mid a:link, .x-tb-mid a:active, .x-tb-mid a:visited, .x-tb-mid a:hover { text-decoration:underline; } #x-head *, #x-foot *, #LeftPanel *, #x-home *, #x-tmpl * { text-decoration:none; } .x-content, #x-hd-menu, #x-hd-srch, .x-ln-mid, .x-ln-ins, .x-tb-mid, .x-tb-ins, .x-tb-title, #x-shop, #x-feat, #x-tg, ul.x-tt { overflow:hidden; } #x-hd-sbtn, #x-hd-menu li, #x-ln-sbtn, #LeftPanel li, #x-ln-nbtn, #x-ft-nbtn { cursor:pointer; } #LeftPanel .x-ln-promo, #LeftPanel ul li a, #LeftPanel ul li span, #x-shop a, #x-shop a img, #x-feat .x-fp * { display:block; } #LeftPanel .ttl, #LeftPanel .link, #LeftPanel .all_cats, #LeftPanel .cnt, #LeftPanel .v4acpcont, #x-cat ul.lev1 li br, #x-cat ul.lev2 li br, #x-tmpl .x-fb br, .x-hide { display:none !important; } #LeftPanel .x-ln-temp, #x-template #LeftPanel .x-ln-home { display:none; } #x-template #LeftPanel .x-ln-temp { display:block; } /* Header formatting -------------------------------------------------- */ #x-head { height:242px; background:transparent url(images/x-head.png) 0 0 no-repeat; margin-bottom:10px; } #x-hd-logo { position:absolute; left:0; top:0; width:93px; height:243px; display:block; background:transparent url(images/x-hd-logo.png) 0 0 no-repeat; } #x-hd-mail { position:absolute; left:244px; top:70px; width:280px; height:30px; display:block; background:transparent url(images/x-hd-mail.png) 0 0 no-repeat; } /* search box */ #x-hd-srch { position:absolute; left:664px; top:70px; width:254px; height:30px; } #x-hd-sbox { width:230px; height:30px; line-height:30px; font-size:13px; color:#CFCBC5; border:0 none; background-color:transparent; margin:0; padding:0 10px; float:left; } #x-hd-sbtn { width:1px; height:30px; float:right; border:0 none; background-color:transparent; } /* menu bar images */ #x-hd-menu a { top:132px; height:30px; position:absolute; display:block; background-color:transparent; background-position:0 0; background-repeat:no-repeat; } #x-hd-menu-01 { left:190px; width:80px; background-image:url(images/x-hd-menu-01.png); } #x-hd-menu-02 { left:325px; width:110px; background-image:url(images/x-hd-menu-02.png); } #x-hd-menu-03 { left:493px; width:100px; background-image:url(images/x-hd-menu-03.png); } #x-hd-menu-04 { left:651px; width:100px; background-image:url(images/x-hd-menu-04.png); } #x-hd-menu-05 { left:808px; width:134px; background-image:url(images/x-hd-menu-05.png); } #x-hd-menu-01:hover { background-image:url(images/x-hd-menu-01h.png); } #x-hd-menu-02:hover { background-image:url(images/x-hd-menu-02h.png); } #x-hd-menu-03:hover { background-image:url(images/x-hd-menu-03h.png); } #x-hd-menu-04:hover { background-image:url(images/x-hd-menu-04h.png); } #x-hd-menu-05:hover { background-image:url(images/x-hd-menu-05h.png); } /* Left panel formatting -------------------------------------------------- */ /* left text boxes */ .x-ln-title { background:transparent url(images/x-ln-title.png) 0 0 no-repeat; height:36px; } .x-ln-mid { } .x-ln-btm { background:transparent none; height:22px; } #LeftPanel .x-ln-ins { padding:10px 10px 0; } #LeftPanel .x-ln-promo { margin:0 0 15px; } /* categories menu */ .x-ln-title-cats { background-image:url(images/x-ln-title-cats.png); } .x-ln-title-read { background-image:url(images/x-ln-title-read.png); } #LeftPanel .lev1 li { margin:0 5px; } #LeftPanel .lev1 li.first { border-top:0 none; } #LeftPanel .lev1 li a, #LeftPanel .lev1 li span { color:#EDE9DD; background:transparent url(images/x-ln-lev1.png) 5px 6px no-repeat; font-size:13px; line-height:16px; padding:6px 5px 6px 26px; } #LeftPanel .lev1 li span, #LeftPanel .lev1 li a:hover { color:#53AD7F; } #LeftPanel .lev2, #LeftPanel ul.lev3 { padding:0 0 5px; } #LeftPanel .lev2 li, #LeftPanel .lev3 li { border:0 none; } #LeftPanel .lev2 li a, #LeftPanel .lev2 li span { color:#EDE9DD; background:transparent none; font-size:12px; line-height:14px; padding:3px 10px 3px 36px; } #LeftPanel .lev3 li a, #LeftPanel .lev3 li span { color:#EDE9DD; background:transparent none; font-size:11px; line-height:14px; padding:2px 10px 2px 46px; } #LeftPanel .lev2 li span, #LeftPanel .lev3 li span, #LeftPanel .lev2 li a:hover, #LeftPanel .lev3 li a:hover { color:#53AD7F; } /* newsletter text box */ .x-ln-title-news { background-image:url(images/x-ln-title-news.png); } #x-ln-nbtn { width:100px; height:38px; background:transparent url(images/x-ln-nbtn.png) 0 0 no-repeat; margin:0 0 5px; display:block; float:right; border:0 none; } #x-ln-news p { color:#EDE9DD; } #x-ln-news p.x-ckbx { margin:10px 0; overflow:hidden; } #x-ln-news p.x-ckbx:not(#foo) { overflow:hidden !important; } #x-ln-news p.x-ckbx:not(#foo) > input { width:16px; height:16px; position:absolute; left:0; opacity:0; float:left; } #x-ln-news p.x-ckbx > label { font-size:11px; line-height:16px; padding-left:5px; } #x-ln-news p.x-ckbx:not(#foo) > label { float:left; padding-left:20px; } #x-ln-news p.x-ckbx:not(#foo) > input + label { background:transparent url(images/x-ckbx.png) 0 0 no-repeat; height:16px; } #x-ln-news p.x-ckbx:not(#foo) > input[type=checkbox]:checked + label { background-position:0 -16px; } /* Homepage formatting -------------------------------------------------- */ /* promo banners */ #x-hm-bann { width:737px; height:300px; margin:0 auto 20px; display:block; } #x-hm-give { width:737px; height:53px; margin:0 auto 20px; display:block; } /* text boxes */ .x-tb-title { background:transparent url(images/x-tb-title.png) 0 0 no-repeat; height:36px; } .x-tb-top { background:transparent url(images/x-tb-top.png) 0 0 no-repeat; height:5px; } .x-tb-mid { background:transparent url(images/x-tb-mid.png) 0 0 repeat-y; padding:5px 0 15px; } .x-tb-btm { background:transparent url(images/x-tb-btm.png) 0 0 no-repeat; height:18px; } .x-tb-ins { padding:10px 15px 0; } /* shop cats boxes */ .x-tb-title-shop { background-image:url(images/x-tb-title-shop.png); } #x-shop { margin-bottom:15px; } #x-shop a { width:168px; height:183px; background:transparent url(images/x-fc-bg.png) 0 0 no-repeat; margin:0 0 15px 13px; float:left; } #x-shop a.x-first { } #x-shop a, #x-shop a:link, #x-shop a:active, #x-shop a:visited { color:#FFF; text-align:center; font-size:13px; line-height:16px; font-weight:normal; } #x-shop a:hover { color:#53AD7F; } #x-shop a img { width:144px; height:124px; margin:13px auto 22px; } /* Homepage auto featured items -------------------------------------------------- */ /* general */ .x-tb-title-feat { background-image:url(images/x-tb-title-feat.png); } #x-feat .x-fp { width:168px; height:254px; background:transparent url(images/x-fp-bg.png) center top no-repeat; margin:7px 0 0 13px; /* margin:5px 0 0 9px; */ padding-top:20px; float:left; } /* gallery image */ #x-feat table.gallery td.picture div.image img { max-width:140px; width:auto !important; width:140px; margin:0 auto; vertical-align:middle; border:0 none !important; } /* img 140px x 100px average, border optional */ #x-feat table.gallery td.picture div.image img.sale { width:auto; height:auto; } /* optional floating sale icon */ /* gallery title and text */ #x-feat table.gallery div.ttl a { color:#111; font:normal 11px/12px Arial, Tahoma, Sans-serif; text-decoration:none; position:relative; z-index:9999; cursor:pointer; } /* title font */ #x-feat table.gallery div.ttl a:link, #x-feat table.gallery div.ttl a:active, #x-feat table.gallery div.ttl a:visited { color:#111 !important; text-decoration:none !important; } #x-feat table.gallery div.ttl a:hover { color:#53AD7F !important; text-decoration:none !important; } #x-feat table.fixed tr td span.bin, #x-feat div.basics span.bin, #x-feat table.fixed tr td span.bid, #x-feat div.basics span.bid { color:#53AD7F !important; font:bold 12px/30px Arial, Tahoma, Geneva, Sans-serif !important; display:block; float:left; margin:0 15px; } /* price font and location */ /* shop button */ #x-feat table.gallery table.fixed { width:168px; height:30px; background:transparent url(images/x-fp-bbtn.png) right center no-repeat; margin-top:0; } /* set height to same as button img */ /* hide bin or bid pricing */ #x-feat div.basics span.bid, #x-feat table.fixed tr td span.bid { display:none; } /* borders and spacing resets */ #x-feat table.gallery td.picture { text-align:center; vertical-align:middle; } /* height auto set inline to 140px */ #x-feat table.gallery td.picture div.image { width:140px; height:140px; vertical-align:middle; text-align:center; display:table-cell; margin:0 auto !important; padding:0 14px; } #x-feat table.gallery div.ttl { height:42px; margin:0; padding:10px 15px 2px; position:relative; } /* title text, set height to accommodate up to 3 rows of title text */ #x-feat table.gallery div.ttl a { display:block; height:80px; } /* extend link over buy button */ #x-feat table.v4shwc td.grItm { width:100%; } #x-feat #showcase, #x-feat table.v4stw, #x-feat table.v4shwc td.grItm, #x-feat table.gallery td.picture { margin:0; padding:0; } #x-feat .whiter-rcp .whiter-n, #x-feat .whiter-s, #x-feat table.gallery .mi, #x-feat div.basics div.clr, #x-feat table.gallery div.catItms, #x-feat div.basics div.prices div.amount img, #x-feat div.basics span.label, #x-feat div.subtitle, #x-feat div.anchors div.group, #x-feat img.ii, #x-feat img.iippl, #x-feat table.v4shwc td.bline, #x-feat table.fixed tr td .label, #x-feat table.fixed tr td img, #x-feat table.fixed tr td .time2, #x-feat table.gallery span.disct, #x-feat table.gallery span.disct2, #x-feat table.gallery .oriprs, #x-feat table.gallery .ship, x-fa table.gallery .stp { display:none; } #x-feat .whiter-rcp { border:0 none; } #x-feat table.v4shwc td.lcell { border-right:0 none; } /* Subpages formatting -------------------------------------------------- */ #x-subp { overflow:hidden; margin:0 0 20px; } /* title bars */ .x-tb-title-abou { background-image:url(images/x-tb-title-abou.png); } .x-tb-title-faqs { background-image:url(images/x-tb-title-faqs.png); } .x-tb-title-poli { background-image:url(images/x-tb-title-poli.png); } #x-subp h1 { color:#53AD7F; text-align:left; font:bold 16px/19px Arial, Tahoma, Sans-serif; margin:0 0 15px; padding:15px 10px 12px; background:transparent url(images/x-dvdr.png) center bottom no-repeat; } #x-subp .x-cl { clear:both; width:0; height:0; } #x-subp .x-subt { color:#F1DFA4; font-weight:bold; font-style:italic; } /* images */ #x-subp img.x-subl { padding:5px; background-color:#EDE9DD; border:2px solid #70C69A; float:left; margin:0 10px 5px; } #x-subp img.x-subr { padding:5px; background-color:#EDE9DD; border:2px solid #70C69A; float:right; margin:0 0 5px 10px; } /* tables */ #x-staff { width:737px; border:0 none; border-collapse:collapse; margin:0 auto 20px; padding:0; cellpadding:0; cellspacing:0; } #x-staff td { color:#EDE9DD; text-align:left; vertical-align:top; padding:10px; } #x-staff td img { background-color:#EDE9DD; padding:4px; border:2px solid #7F4133; margin:0 auto; } #x-book { width:737px; border:0 none; border-collapse:collapse; margin:0 auto 20px; padding:0; cellpadding:0; cellspacing:0; } #x-book td { color:#EDE9DD; text-align:left; vertical-align:top; padding:10px; } #x-book td img { background-color:#EDE9DD; padding:4px; border:2px solid #7F4133; margin:0 auto; } /* Template formatting -------------------------------------------------- */ /* description */ .x-tb-title-desc { background-image:url(images/x-tb-title-desc.png); } .x-tb-title-main { background-image:url(images/x-tb-title.png); } #x-template h1 { color:#53AD7F; text-align:left; font:bold 16px/36px Arial, Tahoma, Sans-serif; margin:0 0 15px; padding:0 15px; } #x-template h2 { color:#53AD7F; text-align:left; font:bold 15px/18px Arial, Tahoma, Sans-serif; margin:0 0 15px; padding:0; } #CentralArea h5, #x-tmpl h5 { color:#F1DFA4; text-align:left; font:bold 13px/18px Arial, Tahoma, Sans-serif; margin:0; padding:5px 0 10px; } /* image gallery side */ #x-tg { width:737px; margin:0 auto 15px; overflow:hidden; } #x-gm { width:560px; float:left; } #x-gm-top { width:560px; /* height:20px; */ height:0; /* background:transparent url(images/x-gm-top.png) 0 0 no-repeat; */ } #x-gm-mid { width:520px; /* height:460px; */ /* background:transparent url(images/x-gm-mid.png) 0 0 no-repeat; */ padding:10px 20px; text-align:center; } #x-gm-btm { width:560px; height:20px; /* background:transparent url(images/x-gm-btm.png) 0 0 no-repeat; */ margin:0 auto; } #x-gm img { /* height:460px; */ width:auto; max-width:520px; margin:0 auto; } #x-gt { float:right; } #x-gt, #x-gt .x-gt-mid { width:160px; } #x-gt .x-gt-mid { overflow:hidden; } #x-gt .x-gt-mid img { width:70px; margin:8px 0 0 8px; display:block; float:left; cursor:pointer; } #x-gt .x-gt-mid img.x-hide { display:none; } #x-tg .x-cl { clear:both; width:0; height:0; } /* specs table */ #x-sp { width:707px; border:0 none; border-collapse:collapse; margin:0 auto 18px; padding:0; cellpadding:0; cellspacing:0; } #x-sp th, #x-sp td { color:#EDE9DD; text-align:left; padding:5px 10px; font-size:13px; line-height:18px; } #x-sp th { color:#F1DFA4; text-align:right; font-weight:normal; width:20%; } /* terms tabs varying */ ul.x-tt { height:32px; background:transparent url(images/x-tt-bg.png) 0 0 no-repeat; position:relative; } ul.x-tt li a img { height:32px; top:0; position:absolute; display:block; } ul.x-tt li a img#x-tt-01 { left:56px; width:120px; } ul.x-tt li a img#x-tt-02 { left:218px; width:120px; } ul.x-tt li a img#x-tt-03 { left:382px; width:110px; } ul.x-tt li a img#x-tt-04 { left:536px; width:150px; } #terms1 { display:block; visibility:visible; } #terms2, #terms3, #terms4 { display:none; } /* terms field images */ #x-tmpl img.x-img-fl { padding:5px; background-color:#EDE9DD; border:2px solid #70C69A; float:left; margin:0 10px 5px; } #x-tmpl img.x-img-fr { padding:5px; background-color:#EDE9DD; border:2px solid #70C69A; float:right; margin:0 0 5px 10px; } /* Footer with links formatting -------------------------------------------------- */ #x-foot { height:93px; background:transparent url(images/x-foot.png) 0 0 no-repeat; text-align:left; } #x-foot p, #x-foot a { font-size:12px; line-height:15px; letter-spacing:0.05em; } #x-foot p.x-links, #x-foot p.x-links a, #x-foot p.x-links a:link, #x-foot p.x-links a:active, #x-foot p.x-links a:visited { color:#53AD7F; } #x-foot p.x-links a:hover { color:#80D5A9; } #x-foot p.x-copy, #x-foot p.x-copy a, #x-foot p.x-copy a:link, #x-foot p.x-copy a:active, #x-foot p.x-copy a:visited { color:#EDE9DD; } #x-foot p.x-copy a:hover { color:#F1DFA4; } #x-foot p.x-links { padding:20px 0 0 25px; } #x-foot p.x-copy { padding:7px 0 0 25px; }