/*********************************************
  
  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; }
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; }
.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; }