/*********************************************

  

  Custom SilverStripe Emerging South Theme

  By Dieter Orens



**********************************************/



html{ height:100%; }



body { height:100%; font:62.5% Arial, Helvetica, sans-serif; color:#5b5b5b; }



.clear{ clear:both; }



/* ----------------------------- $Sticky Footer just in case -------------------------------------------------- */



#MainContainer { min-height:100%; height:auto !important; height:100%; margin:0 auto -147px; }

#Push { height:147px; }



/* ----------------------------- $Container ------------------------------------------------------------------- */



.container { position:relative; width:920px; margin:0 auto; overflow:hidden; }

.container * { margin-left:25px; margin-right:25px; }

.container * * { margin-left:0; margin-right:0; }



/* ----------------------------- $MainNavigation -------------------------------------------------------------- */



#MainNavigation { background-color:#535f74; border-top:7px solid #363f4f; }

#MainNavigation ul{ position:relative; overflow:hidden; width:100%; }

#MainNavigation ul li{ float:left; margin-right:1.5em; padding:.6em 0; }

#MainNavigation a{ color:#dadada; font-size:1.2em; text-decoration:none; }

#MainNavigation a:hover, #MainNavigation a:active, #MainNavigation a.current, #MainNavigation a.section, #MainNavigation a.section:hover, #MainNavigation a.current:hover{ color:#fff1a2; }



/* ----------------------------- $Header ---------------------------------------------------------------------- */



#Header{ background-color:#0c0f16; border-top:7px solid #363f4f; border-bottom:7px solid #363f4f; height:160px; }

#Header h1{ position:relative; }

#Header h1 a{ display:block; text-indent:-30000px; width:391px; height:131px; background:url(../images/ESheaderlogo.gif) no-repeat left top; margin-top:10px; }

#Header p.tagline{ display:none; }



/* ----------------------------- $CountryNav ------------------------------------------------------------------ */



#CountryNav{ position:absolute; right:0; top:30px; }

#CountryNav ul{ position:relative; overflow:hidden; width:100%; }

#CountryNav li{ float:left; margin-right:10px; }

#CountryNav li .link{ border-top:2px solid #0c0f16; border-bottom:2px solid #0c0f16; }

#CountryNav li .current{ border-top:2px solid #fff; border-bottom:2px solid #fff; }



/* ----------------------------- $Search ---------------------------------------------------------------------- */



#SearchContainer{ position:relative; }

#SearchBar{ margin-left:50%; background:#363f4f url(../images/roundwhitesearch.gif) no-repeat -85px top; height:44px; padding-left:150px; }



/* ----------------------------- $ContentDivision ------------------------------------------------------------- */



#Content{ margin-bottom:3em; }

#MainContent{ width:535px; float:left; }

body #SideContent{ width:295px; float:right; margin-left:0; }



/* ----------------------------- $MainContent ----------------------------------------------------------------- */



#MainContent .ad{ margin:10px 0 20px; }



/* ----------------------------- $BlogEntries ------------------ */



.hentry{ position:relative; margin-bottom:4em; }

.hentry .header{ position:relative;  }

.publish{ position:absolute; background:url(../images/dateIcon.gif) no-repeat left top; width:58px; height:77px; left:0; top:0;  }

.publish .month{ font-size:1.6em; font-weight:bold; color:#6d83a8; display:block; margin:3px 0 0 12px;}

.publish .day{ font-size:1.6em; font-weight:bold; color:#FFF; display:block; margin-top:4px; width:95%; text-align:center; }

.publish .year{ font-size:1.4em; color:#7c6709; display:block; margin:5px 0 0 10px;}

.headHolder{ margin-left:75px; }

.holder{ border-bottom:1px solid #f0eee8; padding-top:1.5em; padding-bottom:4em; overflow:hidden; }

p.holder{ margin-left:75px; border:none; padding:0; position:relative; }

h2.entry-title{ font-size:3.2em; color:#666; line-height:1; }

h2.entry-title a, h2.entry-title a:link, h2.entry-title a:visited{ color:#666; text-decoration:none; }

h2.entry-title a:hover, h2.entry-title a:active{ background:#666; color:#FFF; }

.hentry p.info{ color:#900; font-size:1.4em; font-weight:bold; margin-top:.5em; position:relative; }

.hentry p.info a{ }

.hentry p.info a:link,.hentry p.info a:visited{ color:#900; }

a.readmore:link, a.readmore:visited{ color:#4287ff; }

.hentry p.info a:hover, .hentry p.info a:active{ color:#FFF; background-color:#900; }

a.readmore:hover, a.readmore:active{ color:#FFF; text-decoration:none; background-color:#4287ff; }

.country{ border:1px solid #f0eee8; position:absolute; right:0; width:25px; }

.tags { position:relative; clear: both; }

.tags h3{ position:absolute; left:0; top:0; }

.raw{ margin:1em 0; }



/* ----------------------------- $Pagination ------------------- */



ol.pagination{ position:relative; overflow:hidden; }

ol.pagination li{ float:left; margin-right:.5em; font-size:1.2em; }

ol.pagination li a{ text-decoration:none; }



/* ----------------------------- $Comments --------------------- */



#PageCommentsHolder h3{ margin-bottom:.5em; }

#PageCommentsHolder h4{ color:#363f4f; font-weight:bold; font-size:1.4em; margin-left:65px; }

#PageCommentsHolder h4 a, #PageCommentsHolder h4 a:link, #PageCommentsHolder h4 a:visited{ color:#900; text-decoration:none; }

#PageCommentsHolder h4 a:hover, #PageCommentsHolder h4 a:active{ color:#FFF; background-color:#900; }

#CommentHolder{ margin-bottom:5em; }

.comment p{ margin-top:.5em; }

#PageComments li{ position:relative; margin-bottom:1em; padding:1em; }

#PageComments .comment{ margin-left:65px; }

#PageComments .comment img{ display:block; margin:10px 0; }

#PageComments .fn{ text-transform:capitalize; }

#PageComments .photo{ padding:4px; position:absolute; background:#FFF; border:1px solid #CCC; }

#PageComments .even{ background:#eef2f5 url(../images/commentRoundTopRight.gif) right top no-repeat; border-bottom:4px solid #d5e3ed; }

#PageComments .time{ font-size:1em; color:#999; }

#PageComments li li{ margin:0; padding:0; }

#PageCommentsHolder a.feed{ padding-left:20px; background-image:url(../images/feed-icon.png); background-repeat:no-repeat; background-position:left center; }

#CodeHelp ul{ margin-left:2em; margin-bottom:1em; }

#CodeHelp h5{ margin-left:0; }

#CodeHelp { border-top:3px solid #d5e3ed; margin-bottom:1em; padding:3px; background:#eef2f5; }

#CodeHelpInner{ background-color:#FFFFCC; border:1px solid #d5e3ed; }

#CodeHelp p{ margin:1em 0 .5em 1em; }

#CodeHelp li p{ margin:0; }



/* ----------------------------- $SideContent ----------------------------------------------------------------- */



#SideContent h2{ color:#ffd100; font-size:1.8em; min-height:23px; }

#SideContent .innerInner h2{ height:auto; margin-bottom:.5em; margin-top:0; }

#SideContent ul{ font-size:1.2em; }

#SideContent .ad{ margin:10px 0; }



/* ----------------------------- $Rounded SideStuff --------- */



.outerOuter{ background:#363f4f url(../images/roundlefttop.gif) no-repeat left top; margin:2em 0; }

.outerInner{ background:url(../images/roundrighttop.gif) no-repeat right top; }

.innerOuter{ background:url(../images/roundrightbottom.gif) no-repeat right bottom; }

.innerInner{ background:url(../images/roundleftbottom.gif) no-repeat left bottom; padding:1em 13px 1.3em 13px; }



.innerInner .blockList li{ margin-bottom:2px; }

#SideContent .innerInner .blockList li a, .innerInner .blockList li a:link, .innerInner .blockList li a:visited{ color:#FFF; display:block; text-decoration:none; background-color:#535f74; padding:5px; }

#SideContent .innerInner .blockList li a:hover, .innerInner .blockList li a:active{ background-color:#0c0f16; }

.innerInner .blockList li a strong{ color:#fff; font-size:1.4em; display:block; line-height:1; font-weight:normal; }

.innerInner .blockList li a span{ color:#ffd100; font-size:1.2em; }



/* ----------------------------- $Scrolling Module --------- */

.module{ position:relative; }

.outerOuter .module ul, .outerOuter .module ol{ height:32em; overflow:hidden; }

.module .controls{ position:absolute; right:35px; top:3px; z-index:10; text-indent:-30000px; visibility:hidden;}

.module:hover .controls, .hover .controls{ visibility:visible;}

.outerOuter .module ul.hover, .outerOuter .module ol.hover{ background-color:#8797b3; }

.controls em{ width:19px; height:24px; display:block; position:absolute; top:0; cursor:pointer;}

em.up{ background:url(../images/upIE.gif) top left no-repeat; left:14px; top:0;}

em.down{  background:url(../images/downIE.gif) top left no-repeat;left:0; top:0;}



/* ----------------------------- $Network ------------------ */



#pNetwork{ background:url(../images/ESnetworkbg.gif) no-repeat left top; width:295px; height:45px; text-align:right; }

#pNetwork a{ text-decoration:none; display:block; margin-right:20px; padding-top:10px; font-size:1.2em; font-weight:bold; color:#FFF; }

#pNetwork a strong{ color:#5795ff; }

#pNetwork a span{ color:#ffd100; }

#pNetwork a:hover strong{ color:#c00; }



/* ----------------------------- $Ads ---------------------- */



#SideContent #Ads{ position:relative; overflow:hidden; width:100%; margin:10px 0 20px 3px;  }

#Ads li{ float:left; border:6px solid #f0eee8; margin:5px 5px 0 0; }

#Ads img{ display:block; }



/* ----------------------------- $TagCloud ----------------- */



#TagCloud p{ line-height:1.2; margin-top:-.2em; font-size:1em; }

#TagCloud a, #TagCloud a:link, #TagCloud a:visited{ color:#FFF; text-decoration:none; }

#TagCloud a:hover, #TagCloud a:active{ color:#ffd100; }

.very-unpopular{ font-size:1.2em; }

.unpopular{ font-size:1.4em; }

.not-very-popular{ font-size:1.6em; }

.somewhat-popular{ font-size:1.8em; }

.popular{ font-size:2em; }

.more-popular{ font-size:2.2em; }

.very-popular{ font-size:2.4em; }

.ultra-popular{ font-size:2.8em; }



/* ----------------------------- $RecentComments ----------- */



#RecentComments h2{ background:url(../images/recentCommentsIcon.gif) no-repeat right bottom; }



/* ----------------------------- $Subscribe ---------------- */



#Subscribe h2{ background:url(../images/subscribeIcon.gif) no-repeat right bottom; }

#SideContent #Subscribe li a{ padding-left:25px; background-repeat:no-repeat; background-position:5px center; }

#MainFeed a{ background:url(../images/mainFeed.png); }

#BrazilianFeed a{ background:url(../images/brazilFeed.gif); }

#SouthAfricanFeed a{ background-image:url(../images/saFeed.gif); }

#DeliciousFeed a, #DeliciousFeedBR a, #DeliciousFeedSA a{ background-image:url(../images/deliciousFeed.gif); }

#TwitterFeed a{ background-image:url(../images/twitter.png); }



/* ----------------------------- $Delicious ---------------- */



#Delicious h2{ background:url(../images/deliciousIcon.gif) no-repeat right bottom; }



/* ----------------------------- $RecentlyHere ------------- */



#MBL_COMM .mbl_h,#MBL_COMM .mbl_fo_hidden{ display:none; }

body table#MBL_COMM td.mbl_join_img, body table#MBL_COMM td.mbl_join, body table#MBL_COMM td.mbl_img{ background-color:#363f4f; color:#FFF; }

body table#MBL_COMM img{ border-color:#f0eee8; }





/* ----------------------------- $Footer ---------------------------------------------------------------------- */



#Footer { background-color:#0c0f16; color:#dadada; height:140px; border-top:7px solid #363f4f; }

#Footer a{ color:#fff1a2; }

#Footer p{ margin-top:.5em; }