/*
TEXT STYLING
@see http://webtypography.net
@see http://www.sitepoint.com/article/eight-definitive-font-stacks/
*/

body
{
font-size:100%;
font: 1.0em/1.25em "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
}

h1, h2, h3
{
font-family: Cambria, "Hoefler Text", Utopia, "Liberation Serif", "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;
}

h1
{
font-size: 1.4em;
line-height: 0.892857em; /* == 1.25em/1.4em */
margin-top: 0.892857em;
margin-bottom: 0.892857em;
}

h2
{
font-size: 1.25em;
line-height: 1em; /* == 1.25em/1.25em */
margin-top: 2em;
margin-bottom: 1em;
}

h3, dt
{
font-weight: bold;
}

p, ul, dl, h3, dd, dt
{
margin-top: 1.25em;  /* same as line-height */
margin-bottom: 1.25em;
}

ul li
{
list-style: square outside;
margin-top: 0.3125em;
margin-bottom: 0.3125em;
}

code
{
color: #08c;
font-family: Monaco,"Andale Mono","Courier New",monospace;
font-size: 90%;
}

    code.subversion
    {
    padding-left: 40px;
    display: block;
    height: 30px;
    background: url('../img/subversion.gif') left center no-repeat;
    }

a:link, a:visited
{
color: #08c;
text-decoration: none;
}

a:hover, a:active
{
background-color: #eeeeee;
text-decoration: underline;
}

    a.img:hover, a.img:active  /* image links */
    {
    background-color: transparent;
    text-decoration: none;
    }

abbr, acronym
{
border-bottom: 0.06em dotted #000;
cursor: help;
}

blockquote
{
font-size: 1.1em;
line-height: 1.13636em; /* == 1.25em/1.4em */
margin-top: 1.13636em;
margin-bottom: 1.13636em;
}

/*
NAV
*/

#nav
{
position:absolute;
top: 0;
left: 0;
background: url('../img/logo.gif') top right no-repeat;
padding-top: 110px;
margin-top: 1.25em;
}

    .code #nav
    {
    background: url('../img/logo-code.gif') top right no-repeat;
    }

    .peru #nav
    {
    background: url('../img/logo-peru.gif') top right no-repeat;
    }

    #nav ul
    {
    font-size: 1.25em;
    line-height: 1em; /* == 1.25em/1.25em */
    width: 180px;
    float: right;
    margin: 0;
    margin-top: 1.25em;
    }

        #nav ul li
        {
        text-align: right;
        margin: 0;
        list-style: none;
        }

            #nav ul li a, #nav li.cur
            {
            padding: 10px;
            display: block;
            width: 150px;
            border-right: 10px solid #fff;
            border-top: 1px solid #fff;
            border-bottom: 1px solid #fff;
            text-decoration: none;
            background-color: transparent;
            margin-bottom: 5px;
            }

                #nav ul li a:hover, #nav ul li a:active
                {
                border-right: 10px solid #999;
                border-top: 1px solid #999;
                border-bottom: 1px solid #999;
                }

                #nav li.cur
                {
                border-right: 10px solid #000;
                border-top: 1px solid #000;
                border-bottom: 1px solid #000;
                }

      #nav p
      {
      margin: 1.25em 0 0 1em;
      color: #999;
      }

/*
MODULAR LAYOUT
@see http://24ways.org/2008/making-modular-layout-systems
*/

body
{
margin: 30px 20px 0;
background: #fff;
}

#content
{
width: 760px;
float: left;
background: transparent;
padding-bottom: 20px;
}

    #content.code
    {
    background: transparent url('../img/code-close.gif') bottom right no-repeat;
    padding-bottom: 70px;
    }

h1, h2, h3, p, blockquote, dl, code, table
{
margin-left: 230px;
}

    blockquote p
    {
    margin: 0;
    padding: 0 0 0 60px;
    background: url('../img/quote.gif') top left no-repeat;
    min-height: 33px;
    }

ul
{
margin-left: 250px; /* 230px + 20px */
}

/* images */

.pic p, .caption
{
font-size: 0.8em;
color: #999;
margin: 4px 0 10px;
}

/* placement */

.left
{
float: left;
margin-right: 20px;
}

.right
{
float: right;
margin-left: 20px;
}

.right.inset, .right-inset
{ /* img floated right within text, right-inset to support IE6 */
margin: 0 120px 0 20px;
}

.left.inset, .left-inset
{ /* img floated left within text, left-inset to support IE6 */
margin-left: 230px;
}

/* size */

.one
{
width: 100px;
}
.two, #nav
{
width: 210px;
}
.three
{
width: 320px;
}
.four
{
width: 430px;
}
.five
{
width: 540px;
}
.six
{
width: 650px;
}
.seven
{
width: 760px;
}

/* additions */
.frame
{
border: 1px solid #999;
}
.solo
{
margin-bottom: 20px;
}

/*
TABLES
*/

table { }

	table td, table th
	{
	padding: 0.4em 10px;
	}

	table th
	{
	font-weight: bold;
	}

	table tr.first
	{
	border-top: 1px solid #dedede;
	  /* when no thead, first row needs top border */
	}

	table td
	{
	border-left: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
	vertical-align: top;
	}

		table thead td
		{
		font-size: 80%;
		}

		table tfoot td
		{
		border: none;
		}

		table tbody td.first, table thead td.first
		{
		border-left: none;
		}

	table tfoot
	{
	text-align: right;
	}

	table thead th, table tbody tr th
	{
	background-color: #dedede;
	}

		table thead th
		{
		vertical-align: middle;
		}

		table tbody th
		{
		vertical-align: top;
		}

			table tbody tr th.light
			{
			background-color: transparent;
			border-left: 1px solid #dedede;
			border-bottom: 1px solid #dedede;
			}

/*
UTILITY
*/

.group:after
{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
margin: 0;
padding: 0;
}
.group {display:inline-block;}
.group {display:block;}
* html .group {height: 1%;}