/*------------------------------------------------------------------
GENERAL
------------------------------------------------------------------*/
*
{
 margin          : 0;
 padding         : 0;
}

body
{
 background      : #e5e5e5 url(../img/layout/bg_main.gif) no-repeat top center;
 color           : #5b5c5c;
 font-family     : "Trebuchet MS", verdana, sans-serif;
 font-size       : 62.5%;
 line-height     : 1.4;
 text-align      : center;
 word-wrap       : break-word;
}

img
{ 
 border          : 0;
 display         : block;
}

div#mainframe
{
 background      : #fff;
 font-size       : 1.2em;
 margin          : 0 auto;
 text-align      : left;
 width           : 770px;
}


/*------------------------------------------------------------------
GENERIC TEXT PADDING
------------------------------------------------------------------*/
p
{
 padding         : 5px 0;
}


/*------------------------------------------------------------------
HEADER
------------------------------------------------------------------*/
div#header
{
 clear           : both;
 padding         : 25px;
 position        : relative;
}

div#header h1 a
{
 background      : url(../img/layout/logo.png) no-repeat top left;
 cursor          : pointer;
 display         : block;
 height          : 48px;
 margin-bottom   : 10px;
 overflow        : hidden;
 text-indent     : -5000px;
 width           : 567px;
}

div#header h2
{
 font-size       : 1.8em;
 font-weight     : 400;
}

div#header a#microsite_link
{
 background      : url(../img/layout/microsite_link.png) no-repeat top left;
 cursor          : pointer;
 display         : block;
 height          : 102px;
 overflow        : hidden;
 position        : absolute;
 right           : 40px;
 text-indent     : -5000px;
 top             : 80px;
 width           : 176px;
}

div#header p
{
 font-size       : 1.4em;
 padding         : 0;
 width           : 475px;
}


/*------------------------------------------------------------------
TEXT HEADERS
-----------------------------------------------------------------*/
h3
{
 border-bottom   : 1px solid #ccc;
 font-size       : 1.1em;
 margin          : 5px 0;
 padding         : 5px 0;
 text-transform  : uppercase;
}

h4
{
 font-size       : 1.6em;
 font-weight     : 400;
 margin          : 5px 0;
 padding         : 5px 0;
}


/*------------------------------------------------------------------
CONTENT
------------------------------------------------------------------*/
div#content
{
 clear           : both;
 padding         : 0 0 25px 25px;
}


/*------------------------------------------------------------------
SIDEBAR
------------------------------------------------------------------*/
div#content div#blog_sidebar
{
 float           : left;
 width           : 225px;
}

div#content div#blog_middle
{
 float           : right;
 width           : 505px;
}


/*------------------------------------------------------------------
CATEGORY NAVIGATION
------------------------------------------------------------------*/
ul#category li,
ul#editor li,
ul#mainnav
{
 list-style-type: none;
}

ul#category li a
{
 display         : block;
 height          : 30px;
 overflow        : hidden;
 text-indent     : -5000px;
 width           : 225px;
}

ul#category li a:hover
{
 background-position:100% 0;
}

ul#category li#business-economy a 
{
 background-image: url(../img/layout/nav_c_business_economy.gif);
}

ul#category li#environment a
{
 background-image: url(../img/layout/nav_c_environment.gif);
}

ul#category li#families-lifestyle a 
{
 background-image: url(../img/layout/nav_c_families_lifestyle.gif);
}

ul#category li#politics-energy a
{
 background-image: url(../img/layout/nav_c_politics_energy.gif);
}

ul#category li#urban-planning a
{
 background-image: url(../img/layout/nav_c_urban_planning.gif);
}


/*------------------------------------------------------------------
EDITOR NAVIGATION
------------------------------------------------------------------*/
ul#editor
{
 margin-bottom   : 20px;
}

ul#editor li
{
 margin-left:1px;
 border          : 1px solid #ccc;
 margin-bottom   : 5px;
 position        : relative;
 width           : 222px;
}

ul#editor li a
{
 background      : #ffffff url(../img/layout/nav_panel_bg.gif) no-repeat top left;
 color           : #5b5c5c;
 display         : block;
 padding         : 2px;
 text-decoration : none;
}

ul#editor li a:hover 
{
 background      : #f1f1f1 url(../img/layout/nav_panel_bg.gif) no-repeat top right;
}

ul#editor li dl dt
{
 font-weight     : 700;
 font-size       : 1.2em;
}

ul#editor li dl dd.editor
{
 background      : url(../img/layout/editor.gif) no-repeat top left;
 display         : block;
 height          : 15px;
 overflow        : hidden;
 right           : 0px;
 position        : absolute;
 text-indent     : -5000px;
 top             : 0px;
 width           : 54px;
}


/*------------------------------------------------------------------
MAIN NAVIGATION
------------------------------------------------------------------*/
ul#mainnav li a
{
 color           : #5b5c5c;
 font-weight     : 700;
 text-decoration : none;
 text-transform  : uppercase;
}


/*------------------------------------------------------------------
Clearfix
------------------------------------------------------------------*/
.clearfix
{
 display         : inline-block;
}

.clearfix:after
{
 content         : ".";
 clear           : both;
 display         : block;
 height          : 0;
 visibility      : hidden;
}

* html .clearfix
{
 height          : 1%;
}

.clearfix
{
 display         : block;
}