* { margin: 0; padding: 0 } img { position: relative } body { background: #252422 url(../images/bg.png) repeat-x scroll 0 0;font-family:'Helvetica Neue',Arial,Helvetica,sans-serif; font-size: 80%; text-align: center} h1, h2, h3 { font-family: "Calibri","Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif} #wrapper { width: 950px; margin: 1% auto 0;text-align: left; background: #fff url(../images/wrapper_top.png) no-repeat scroll center top; padding-top: 20px} #wrapper #logo { position: relative; left: 20px } #wrapper #logo a img { border: 0} #wrapper #menu { background: #393939 none no-repeat scroll 0 0; color: #fff;padding:1em 10px 2.2em; margin-top:0.3em;height: auto;position: relative} #wrapper #menu span.right { background: #393939 url(../images/menu_right.gif) no-repeat scroll 0 bottom;display: block; height: 100%; position: absolute; top: 0; z-index: 0; padding-top: 0.6em; width: 9px; right: -6px} #wrapper #menu span.left { background: #393939 url(../images/menu_left.gif) no-repeat scroll 0 bottom;display: block; height: 100%; position: absolute; top: 0; z-index: 0; padding-top: 0.6em; width: 9px; left:-6px} #wrapper #menu ul { padding-left: 13px } #wrapper #menu ul li { display: inline;} #wrapper #menu ul li a, #wrapper #menu ul li em { color: #fff; font-style: normal; padding: 5px 10px; text-decoration: none} #wrapper #menu ul li a:hover, #wrapper #menu ul li em {background: #3589B7; color: #fff} #wrapper #menu ul.left { float: left; margin-top: -14px} #wrapper #menu ul img { top: 8px } #wrapper #menu ul.right { float: right } #wrapper #imageSwitcher { width: 699px;float:left; height:220px; background:#fff none no-repeat scroll 10px 4px} .hidden { margin: -5000px; position: absolute } #menu ul li em, #menu ul li a { position: relative } #menu ul li em span, #menu ul li a span { height: 5px; width: 5px; position: absolute; background-image: url(../images/menu_corner_sprite_2.gif); background-repeat: no-repeat; background-position: -200px} #menu ul li em span.tl, #menu ul li em span.tr, #menu ul li a:hover span.tl, #menu ul li a:hover span.tr { top: 0px } #menu ul li em span.bl, #menu ul li em span.br, #menu ul li a:hover span.bl, #menu ul li a:hover span.br { bottom: 0; } #menu ul li em span.tl, #menu ul li em span.bl, #menu ul li a:hover span.bl, #menu ul li a:hover span.tl { left: 0 } #menu ul li em span.tr, #menu ul li em span.br, #menu ul li a:hover span.tr, #menu ul li a:hover span.br { right: 0 } #menu ul li em span.tl, #menu ul li a:hover span.tl { background-position: 0 -27px } #menu ul li em span.tr, #menu ul li a:hover span.tr { background-position: 0 0 } #menu ul li em span.bl, #menu ul li a:hover span.bl { background-position: 0 -49px } #menu ul li em span.br, #menu ul li a:hover span.br { background-position: 0 -22px } #menu ul li a.conference { background-color: #B75935 !important;} #menu ul li a.conference span { background-image: url(../images/menu_corner_sprite_3.gif) !important; } #menu ul li em span.tl, #menu ul li em span.tr, #menu ul li a.conference span.tl, #menu ul li a.conference span.tr { top: 0px } #menu ul li em span.bl, #menu ul li em span.br, #menu ul li a.conference span.bl, #menu ul li a.conference span.br { bottom: 0; } #menu ul li em span.tl, #menu ul li em span.bl, #menu ul li a.conference span.bl, #menu ul li a.conference span.tl { left: 0 } #menu ul li em span.tr, #menu ul li em span.br, #menu ul li a.conference span.tr, #menu ul li a.conference span.br { right: 0 } #menu ul li em.conference span.tl, #menu ul li a.conference span.tl { background-position: 0 -27px } #menu ul li em.conference span.tr, #menu ul li a.conference span.tr { background-position: 0 0 } #menu ul li em.conference span.bl, #menu ul li a.conference span.bl { background-position: 0 -49px } #menu ul li em.conference span.br, #menu ul li a.conference span.br { background-position: 0 -22px } #menu ul li a.conference:hover { background-color: #3589B7!important;} #menu ul li a.conference:hover span { background-image: url(../images/menu_corner_sprite_2.gif) !important; } #menu ul li em.conference { color: #000!important; position: relative; left: 20px} #menu ul li a.conference { position: relative; left: 60px} #content { width: 100%; height: auto; margin: 6px 0} #content div.block, div#footer{ background: #fff none repeat scroll 0 0} #content { overflow: hidden} #content div.block { width: 284px; float: left; margin-left:6px;padding: 12px; margin-bottom:6px !important; position:relative;border:1px solid #dcdcdc} #content div.block span.tl, #content div.block span.tr, #content div.block span.bl, #content div.block span.br { position: absolute; background: #e8e8e8 url(../images/grey_box_corners.gif) no-repeat scroll 0 0; width: 7px; height: 7px; display: block } #content div.block span.tl { top: -2px; left:-2px; } #content div.block span.tr { top: -2px; right:-2px; background-position: 0 -14px } #content div.block span.bl { bottom: -2px; left:-2px; background-position: 0 -7px} #content div.block span.br { bottom: -2px; right:-2px; background-position: 0 -21px} #content div.col1 div.block, #content div.col2 div.block, #content div.col3 div.block { min-height :30.3em } #content div.col1, #content div.col2, #content div.col3 { float: left } #content div.col1 div.block, #content div.col2 div.block, #content div.col3 div.block { float: none } #content div.col1 { margin-left: -2px } #content div.block h2, #content div.block h1, div#prodCats h2 { font-weight: normal; border-bottom:3px solid; font-size:1.4em ;margin-bottom: 1em; border-color: #b69d77} #content div.block h2.green,#content div.block h1.green, div#prodCats h2.green, content div.block h1, content div.block h2{ border-color: #b69d77 } #content div.block.first.whatIsJurang p {margin-bottom: 18px} #content div.block p.bottom-top { position: absolute; bottom: 50px} #content div.block p.bottom-bottom { position: absolute; bottom: 10px} #content div.block h2.blue, div#prodCats h2.blue { border-color: #b69d77 } #content div.block h2.brown, divv#prodCats h2.brown { border-color: #b69d77 } #content div.block p, div#prodCats p { padding: 5px } #content div.block ul, div#prodCats ul{ list-style: none } #content div.block ul.home-list { padding: 0em 1em 0; list-style-type: square;list-style-image:url(../images/bullet-blue.gif); list-style-position: inside;} #content div.block ul.home-list.green { list-style-image:url(../images/bullet-blue.gif) } #content div.block ul.home-list.gray { list-style-image:url(../images/bullet-gray.gif) } #content div.block ul li, div#prodCats ul li { margin: 1em 0 } #content div.block ul#partnerList { padding-left:0; margin: 0 0 1em } #content div.block ul#partnerList li { display: inline } #content div.block ul#partnerList li a img { border: 0; margin: 20px 0 0 } #content div.block ul#news li strong, #content div.block ul#news li a { display: block} ul#news { margin-bottom: 35px } #content.shop div.block.first { width: 186px!important } #content.shop div.block { float:left; padding:12px; min-height: 19.5em; width: 663px} ul.catMenu { margin-left:18px } ul.catMenu.sitemap { margin-left: 3em} ul.catMenu a, body.shop #content div.block.first ul.catMenu em { color: #333; } ul.catMenu a { text-decoration: none } ul.catMenu a:hover { text-decoration: underline; } ul.catMenu ul { margin-left: 20px} ul.catMenu.sitemap ul { margin: 1em 3em 0} ul.catMenu li { list-style-image: url(../images/bullet-blue.gif) } ul.catMenu li.disabled { list-style-image: url(../images/bullet-gray.gif) } ul.catMenu ul.grey li { list-style-image: url(../images/bullet-gray.gif)} ul.catMenu ul li { list-style-image: url(../images/bullet-blue.gif) } ul.catMenu ul.green li { list-style-image: url(../images/bullet-green.gif) } ul.catMenu ul li a { text-decoration: none } #content.shop div.block ul.productList { overflow: hidden } #content.shop div.block ul.productList li { float: left; font-size: 89%; line-height: 180%; min-width: 48%; position: relative;} #content.shop div.block ul.productList li p { padding: 0 } #content.shop div.block ul.productList li p a.button { position:absolute; bottom: 5px; left:25%} #content.shop div.block ul.productList li img { float: left } #content.shop div.block ul.productList li strong { color: #727272 } /*#content.twoCols div.col-1, #content.twoCols div.col-2 { float: left; width: 424px} #content.twoCols div.col-1 div.block, #content.twoCols div.col-2 div.block { width: 100%; min-height: 19.5em; } #content.twoCols div.col-1 { margin-right: 24px } #content.twoCols2 div.col-1, #content.twoCols2 div.col-2 { float: left} #content.twoCols2 div.col-1 { width: 595px; margin-left: 5px} #content.twoCols2 div.col-2 { width: 288px} #content.twoCols2 div.col-1 div.block, #content.twoCols2 div.col-2 div.block { width: 100%; min-height: 19.5em;margin:0 } #content.twoCols2 div.col-1 { margin-right: 31px } */ #content.twoCols div.col-1, #content.twoCols div.col-2 { float: left; width: 444px} #content.twoCols div.col-1 div.block, #content.twoCols div.col-2 div.block { width: 100%; min-height: 19.5em; } #content.twoCols div.col-1 { margin: 0 27px 0 -1px } #content.twoCols2 div.col-1, #content.twoCols2 div.col-2 { float: left} #content.twoCols2 div.col-1 { width: 595px; margin-left: 5px} #content.twoCols2 div.col-2 { width: 288px} #content.twoCols3 div.col-1, #content.twoCols3 div.col-2 { float: left} #content.twoCols3 div.col-1 { width: 288px; margin-left: 5px} #content.twoCols3 div.col-2 { width: 595px} #content.twoCols2 div.col-1 div.block, #content.twoCols2 div.col-2 div.block, #content.twoCols3 div.col-1 div.block, #content.twoCols3 div.col-2 div.block { width: 100%; min-height: 19.5em;margin:0 } #content.twoCols2 div.col-1,#content.twoCols3 div.col-1 { margin-right: 31px } #content.single div.block, #content.blog div.block { width: 880px } #content.single div.block div#contact-form { width: 652px; margin:0 auto } div#fairtrade { width: 100%; text-align: center; margin:-18px auto 0} div#fairtrade hr { border: 1px solid #B69D77; margin-bottom: 5px } div#fairtrade img{ margin: 0 auto } #content.our-partners div.block ul { margin: 20px auto; width: auto; text-align: center; padding: 0 20px} #content.our-partners div.block ul li { margin-top: 6em; text-align:left } #content.our-partners div.block ul li div { float: left} #content.our-partners div.block ul li p { padding: 0 5px 0 30%} #content.our-partners div.block ul li a img { border: none; float: left} #content.our-partners div.block dl dd { margin-bottom:50px; float: right; width: 70% } #content.our-partners div.block dl dt.right { float: right; clear: both} #content.our-partners div.block ul li#oromo_coffee div { padding: 0 0 0 6% } #content.our-partners div.block ul li#traidcraft div { padding: 5% 0 0 0 } #content.our-partners div.block ul li#traidcraft p { padding-right: 34% } #content.our-partners div.block ul li#divine div { padding: 3% 0 0 4% } #content.our-partners div.block ul li#cafe_direct div { padding: 2% 10% 0 0 } #content.our-partners div.block ul li#cafe_direct p { padding-right: 25% } #content.our-partners div.block ul li#equal_exchange div { padding: 4% 0 0 5% } #content.our-partners div.block ul li.right div { float: right} #content.our-partners div.block ul li.right p { padding-left: 0; padding-right: 30%} div.block { min-height: 100%} div.block ul.home-list { margin: 25px auto; width:80% } div.block blockquote { border: 1px solid #E5E5E5; padding: 5px 10px; position:relative; width: 60%; margin:1em auto 0; padding: 5px 10px} div.block blockquote p { padding: 0.2em 1em } div.block blockquote span.tl, div.block blockquote span.tr, div.block blockquote span.bl,div.block blockquote span.br { position: absolute; background-image: url(../images/blockquote-corner.gif) !important; background-repeat: no-repeat; background-attachment: scroll!important; width: 10px!important; height: 10px!important} div.block blockquote span.tl { background-position: -10px -1px!important; top: -4px !important;left:-1px !important } div.block blockquote span.tr { background-position:-11px -38px!important;right:-2px !important;top:-2px !important } div.block blockquote span.bl { background-position:-7px -21px!important;bottom:-2px!important;left:-4px !important } div.block blockquote span.br { background-position:-12px -54px!important;bottom:-1px!important;right:-3px !important } div.block blockquote span.thing, div.block blockquote.left span.thing { background:transparent url(/images/blockquote-bottom.gif) no-repeat scroll 0 0;height:12px;left:83%;margin-top:4px;position:absolute;width:15px} div.block blockquote.left span.thing { left: 15% } div.block span.author, #content.single div.block span.author{ display: block; position: relative; left: -24%; margin-top: 11px; text-align: right; font-size: 95% } div.block span.author.left, #content.single div.block span.author.left{ display: block; position: relative; left: 23%; margin-top: 11px; font-size: 95%;text-align: left } div.block span.author.left { left: 23%; text-align: left} div.block span.author span.name { font-weight: bold; color: #B9CA00; display: block; font-size: 110%} #content.details div.block.first { width: 609px !important; float: left; min-height: 430px; height: auto !important; height: 430px} #content.details div.block { width:240px; float:left; position: relative } #content.details div.block p { padding: 0.5em } #content.details div.block div#orderBox {border: 1px solid #eaeaea; background-color: #fff; padding: 1em 2em; position: absolute; width: 70%} #content.details div.block div#orderBox p { padding: 0 } #content.details div.block div#orderBox form { margin-top: 1.5em } #content.details div.block div#orderBox form table { margin-bottom: 1em } #content div.block h2 a { font-size: 12px; float: right } #content.blog div.block h2 a { font-size:inherit ;margin-bottom: 1em ; float: none; text-decoration: none; color: inherit;} #content div.block.first { width: 916px; margin-left: 4px } #content div.block ul.catMenu li.head { list-style-image: url(../images/bullet-gray.gif)} #content div.block ul.catmenu li.head { list-style-image: url(../images/bullet-gray.gif) !important} div#productHighlight { text-align: center; font-weight: bold ; margin-left:-2px} div#productHighlight img { margin: 0 0 24px 0 } div#productHighlight a.button { margin: 18px 0 0 65px } div#productHighlight strong span, div#productHighlight span { color: #660000 } div.block ul.home-list.spaced li { margin: 35px 0 !important } div#footer { clear: both; text-align: left; padding: 15px; font-size: 0.7em; color: #fff; height: 25px; background: #393939;border-top: 1px solid #000} div#footer ul { float: left; margin: 0.8em 0 0} div#footer ul li {display: inline; padding: 0 10px 0 0} div#footer ul li a, #content div#footer ul li a:visited, #content div#footer ul li a:active { color: #fff } div#footer ul li.twitter { padding-left: 16px; background: transparent url(../images/icons/twitter.gif) no-repeat scroll left center } div#footer ul li.facebook { padding-left: 16px; background: transparent url(../images/icons/facebook.gif) no-repeat scroll left center } div#footer ul li a:hover { color: #999 } div#footer p { text-align: right } .new { font-style: italic; font-weight: bold; color: red; text-decoration: none} .red { color: #880000 } .oos { color: red; display: block} .centreCSRImg { left:50%; margin: 0px 0 28px -82px; height: 154px } /* * Button styles * based on : http://particletree.com/features/rediscovering-the-button-element/ */ a.button, a.button:visited, button.button { display: block;float:left;margin:0 0.583em 0.667em 0;padding:0.5em;border-style: solid; border-width:1px;border-color: #eaeaea #bababa #bababa #eaeaea; background-color: #f5f5f5; background-position:7px center; background-repeat:no-repeat; background-attachment:scroll; font-size:87%;line-height:130%;text-decoration:none;font-weight:bold;color:#565656;cursor:pointer} button.button { width:auto; overflow:visible; padding: 4px 10px 4px 7px;line-height:17px} button.button img, a.button img{ margin: 0 3px -3px 0 !important; padding:0; border:none !important;width:16px;height:16px;float:none} button.button:hover, a.button:hover { background-color:#6299c5; border:1px solid #c2e1ef; color:#336699} a.button:active {background-color:#6299c5;border:1px solid #6299c5;color:#fff} button.button:hover, a.button:hover {background-color:#dff4ff;background-position: 7px center; background-repeat: no-repeat; border:1px solid #c2e1ef;color:#336699} a.button:active {background-color:#6299c5;border:1px solid #6299c5;color:#fff} .pos {color:#529214 !important} a.pos:hover, button.pos:hover {background-color:#E6EFC2 !important;border:1px solid #C6D880 !important;color:#529214 !important} a.pos:active {background-color:#529214 !important;border:1px solid #529214 !important;color:#fff !important} .neg {color:#d12f19 !important} a.neg:hover, button.neg:hover {background:#fbe3e4 !important;border:1px solid #fbc2c4 !important;color:#d12f19 !important} a.neg:active {background-color:#d12f19 !important;border:1px solid #d12f19 !important;color:#fff !important} .vcard { position: absolute; top:-200% } .paddTop { padding: 30px 0 0 0 ; display: block} ul#speakers { margin-top: 2em } ul#speakers li { overflow: hidden; padding-bottom:2em; } ul#speakers li p {width: 370px; float: right; margin-top: 0 !important} ul#speakers li img { float:left} #prodCats { background: #fff; float: left;height: 198px;padding:12px;width:207px;margin:0 0 0 7px} #midWrap { background:none repeat scroll 0 0 #FFFFFF;border:1px solid #DCDCDC;margin:0 auto;position:relative;top:5px;width:942px;height:222px;margin-bottom:10px;} #midWrap span { position: absolute; background: #e8e8e8 url(../images/grey_box_corners.gif) no-repeat scroll 0 0; width: 7px; height: 7px; display: block} #midWrap span.bl, #midWrap span.br { bottom: 0px; } #midWrap span.tl, #midWrap span.bl { left: 0px } #midWrap span.tr, #midWrap span.br { right: 0px } #midWrap span.tl { top: -2px; left: -2px} #midWrap span.tr { background-position: 0 -14px; top: -2px; right: -2px} #midWrap span.bl {background-position: 0 -7px; left: -2px; bottom: -2px} #midWrap span.br {bottom: -2px; right: -2px; background-position: 0 -21px} #midWrap h2.green { border-color: #668da3!important } #content.products div.block h3, #content.products-hampers div.block h3 { font-size: 1.4em; font-weight: normal} #content.products div.block ul, #content.products-hampers div.block ul{ width:50%;margin-bottom:2em;padding-left: 2em } #content.products div.block ul li, #content.products-hampers div.block ul li{ position: relative } #content.products div.block span.price { position: absolute; right: 0} #content.products div.block span.special { color: red } #content.products-hampers div.block ul { width: auto } #content.products-hampers div.block ul li { clear: both;margin-bottom:60px} #content.products-hampers div.block ul li img { float: left; margin-right: 2em } #content.products-hampers div.block span.price { font-size: 1.1em; font-weight: bold; margin-top: 20px; display: block} #phoneDetails {position: absolute; right: 60px; top: 10px; font-size: 1.2em; font-family: arial; text-align: center; float: right; } #phoneDetails b {display: block } #grey { background: #e8e8e8 } div.clear { clear: both } div.line { overflow: hidden; width: 100% } #content.twoCols2 div.line div.left { width: 602px !important} #content.twoCols div.line img { margin: 0!important } div.line div.block { margin-left: 4px !important } ul.iltr li { overflow: hidden; } ul.iltr li p img { float: left }