/* <style type="text/css" media="screen"> */

/* total width: 1004
 * TODO: recalculate these to match new design (Unified-xxx)
 
   left padding #content padding right-content border
   148 + 16 + 210 + 16 + 8+376+8 + 16 + 8+170+8 + 20

   height
   sites: 20px
   masthead image: 136px    (tabs: 28px)
   nav2: 24px
*/

/*
leftarea + 16 + centerarea + 8+rightarea+8

    leftarea = 148

    centerarea1 = 654
        detailpage = contentinfo +16+8+images/comments+8+16 = 654
            contentinfo = 230
            images/comments = 376
        listpage = atoz/popular+8 +8+editors/popular+8 = 654
            leftcol (atoz/popular) = 316
            rightcol (editors/popular) = 314
            atoz_yes/atoz_no

    rightarea = 170
*/

/* main template positioning */
#page	  { position: relative; margin: auto; }
#sites,
#utils    { position: absolute; top: 0; height: 16px; padding: 2px 8px; z-index: 1; }
#masthead { position: absolute; top: 20px;  height: 136px; }
#logo	  { position: absolute; top: 30px; }
#contentarea { position: relative; clear: both; min-height: 700px; }

#contenthead { position: relative; padding-left: 164px; padding-top: 8px; padding-bottom: 8px; min-height: 50px; }
#contentbody { position: relative; }
#contenthead #extra { position: absolute; bottom: 8px; left: 0; width: 128px;
text-align: right; padding-top: 4px; padding-right: 4px; }
#searchbox { float: right; margin: 0 8px 4px 4px; display: block; }

#left { position: absolute; top: 0; }

#right { position: absolute; top: 0; }
#right #right-inner { padding: 8px; margin: auto; height: 100%; }


#page           { width: 1004px; }
#sites          { width:  988px; left:    0px; }
#utils          { width:  388px; left:  600px; }
#masthead       { width: 1004px; }
#logo           {                left:   10px; }

#left           { width:  148px; left: -164px; }

#contentarea    { width:  654px; left:  164px; }
#contenthead    { width:  654px; left: -164px; }

#right          { width:  186px; left:  654px; height: 100%; }


/* centered on left bar */
#actionbox,     
#accountbox, 
#staticlinks    { width:  140px; margin: 2px 8px; }

#issue_box       { width:  132px; margin: 2px 8px; }

/* center layout 1 */
/* TODO: create .onecolumn, .twocolumn and rightbox and .leftbox classes that we can match on more easily */
#contentinfo { float: left; }
#contentinfo    { width:  336px; }
#images { width: 300px; margin: 0px 8px;  float: right; clear: right; }

#comments {
    width: 336px;
    margin: 8px 0 0 0; padding: 5px 0 0 0;
    float: left; clear: left;
}

/* center layout 2 */
.atoz_no #peoples_picks,    /* left col */
.atoz_yes #atoz             { width: 316px; padding: 8px 8px 0 0; float: left; clear: left; }

.atoz_no #editors_picks,    /* right col */
.atoz_yes #editors_picks,
.atoz_yes #peoples_picks    { width: 313px; padding: 8px; float: right; clear: right;
    border-left: #000 solid 1px;
    border-top: #000 solid 1px; 
    padding-bottom: 20px;
}

.atoz_yes #peoples_picks,
.atoz_yes #editors_picks    { border-bottom: #000 solid 4px; }


.articles #article_contents { width: 336px; float: left; clear: left; }

