/* ================================ */
/* main layout */

    /*default is left oriented page that bleeds*/
    table.layout{
        height:             100%;
        width:              100%;
    }

    body.center table.layout{
        margin-left:    auto;
        margin-right:   auto;
    }

    body.center table.page{ width: 965px; /*same as div.grid width*/ }
    body.center table.popup{ width: 775px; /*same as div.popup width*/ }

    table.layout tr.layout-row td.layout-bottom{ vertical-align: bottom; }

    table.layout tr.layout-row td.layout-cell{ background-color: #FFFFFF; }

    .debug table.layout tr.layout-row td.layout-cell{ background: url("../img/grid.gif"); }
    .border{ border: 1px solid red; }

    h1.align-top{ margin-top: -.1em; }
    h2.align-top{ margin-top: -.2em; }
    .align-top{ margin-top: -.3em; }
    .align-top img{ margin-top: .3em; }
    h2.bold
    {
		font-weight:bold;
    }

/* ================================ */
/* div version, idea adapted from Blueprint CSS */

    div.grid{ width:965px; }
    div.popup{ width:820px; }

    .span-1{ width:179px; }
    .span-2{ width:363px; }
    .span-3{ width:559px; }
    .span-4{ width:745px; }
    .span-5{ width:935px; }
    
    .span-third{ width:33%; }
    .span-two-thirds{ width:66%; }
    .span-half{ width: 50%; }
    .span-quarter{ width: 25%; }

    .append-1 {padding-right:190px;}
    .append-2 {padding-right:380px;}
    .append-3 {padding-right:570px;}
    .append-4 {padding-right:760px;}

    .prepend-1 {padding-left:190px;}
    .prepend-2 {padding-left:380px;}
    .prepend-3 {padding-left:570px;}
    .prepend-4 {padding-left:760px;}

    .gutter-right{ margin-right:15px; }
    .gutter-left{ margin-left:15px; }
    .gutter-both{ margin-left:15px; margin-right:15px; }

    .gutter-right-half{ margin-right:8px; }
    .gutter-left-half{ margin-left:8px; }
    .gutter-both-half{ margin-left:8px; margin-right:8px; }

    .margin-none, div.titlelink h1, div.titlelink h2{ margin-bottom: 0; }
    .margin, form{ margin-bottom: 15px; }
    .margin-quarter, h2, form .checkbox, ul.fancy, .portrait img, div.titlelink{ margin-bottom: 4px; }
    .margin-half, h1, p, p.intro, div.arrowlink, form .input, .list .head, table.typical, ul.pager{ margin-bottom: 8px; }
    .margin-double{ margin-bottom: 30px; }
    .margin-triple{ margin-bottom: 45px; }

    .pad{ padding: 15px; }
    .pad-quarter{ padding: 4px; }
    .pad-half{ padding: 8px; }
    
    .pad-left{ padding-left: 15px; }
	.pad-left-double{ padding-left:30px;}
    .pad-left-half{ padding-left: 8px; }

    .pad-right{ padding-right: 15px; }

    .pad-top{ padding-top: 15px; }
    .pad-top-half{ padding-top: 8px; }
    .pad-top-quarter{ padding-top: 4px; }
	.pad-top-triple{padding-top:45px;}
	.pad-bottom{ padding-bottom: 15px; }
    .pad-bottom-half{ padding-bottom: 8px; }

    .pad-sides{ padding-left:15px; padding-right:15px; }