/*
  Contents:
  1.0 (XHTML reset in all.css)
  2.0 Base styles
  3.0 Structural
  4.0 Blocks
    4.1 Headings and navigation
    4.2 General Content
    4.3 About
    4.4 Portfolio
    4.3 Contact  
*/

/*****************************************************************
2.0 Base styles
*****************************************************************/
.replaced{ display:block; position:relative; }
.replaced span{ background-repeat:no-repeat; display:block; height:100%; left:0; position:absolute; top:0; width:100%; z-index:10; }
.hidden{ display:none; }


/*****************************************************************
3.0 Structural
*****************************************************************/
#frame{ margin:0 auto; width:1000px; position:relative; }
#content{ height:554px; left:352px; overflow:hidden; position:absolute; top:0px; width:550px; }
.page{ height:454px; padding:50px 0; overflow:hidden; }


/*****************************************************************
4.0 Blocks
*****************************************************************/
/* 4.1 Headings and navigation */
h1{ background:url('../images/site-title.gif') 0 0 no-repeat; height:458px; left:0; overflow:hidden; position:absolute; text-indent:-9999px; top:50px; width:114px; }
h1 a{ display:block; height:100%; width:100%; }

h2#byline{ height:63px; left:300px; position:absolute; top:500px; width:647px; }
h2#byline span{ background-image:url('../images/site-byline.gif'); }

#navigation-main{ left:240px; position:absolute; top:22px; }
#navigation-main li{  }
#navigation-main a{ background-image:url('../images/navigation.gif'); display:block; overflow:hidden; text-indent:-9999px; width:60px; }
#navigation-main .nav-about a{ background-repeat:no-repeat; height:96px; }
#navigation-main .nav-about a:hover{ background-position:-60px 0; }
#navigation-main .nav-portfolio a{ background-position:0 -96px; height:100px; }
#navigation-main .nav-portfolio a:hover{ background-position:-60px -96px; }
#navigation-main .nav-contact a{ background-position:0 -196px; height:91px; }
#navigation-main .nav-contact a:hover{ background-position:-60px -196px; }

/* 4.2 General Content */
#content a:link{ background:url('../images/dot-01.gif') center bottom repeat-x; padding-bottom:2px; }
#content a:visited{ background:url('../images/dot-01-visited.gif') center bottom repeat-x; padding-bottom:2px; }
#content a:hover{ background-image:none; }
#content ul{ list-style-type:square; margin-left:20px; }

/* 4.3 About */

/* 4.4 Portfolio */
#portfolio ul{ font-weight:bold; line-height:1.5; margin-left:0; }
#portfolio li{ display:inline; float:left; margin-right:56px; width:213px; }
#content #portfolio a{ background:#fff url('../images/portfolio-bk.gif') 0 0 no-repeat; display:block; height:131px; padding:6px 6px 12px; width:201px; }
#content #portfolio a:hover{ background:none; }
#content #portfolio img{ display:block; opacity:0.3;/*ie*/ }
#content #portfolio a:hover img{ opacity:1;/*ie*/ }
#content #portfolio span{ background:#fff; margin-left:-3px; padding:0 5px; }


/* 4.3 Contact */
#contact ul{ margin-left:40px; }
#contact li{ display:inline; float:left; margin-right:20px; width:200px; }
.type{ color:#5a1374; display:block; }
.value,
.street-address,
.locality,
.region,
.postal-code{ margin-left:10px; }
