/*------------------------------------------------------------*/
/* Perfect Layout                                             */
/*   Version 1.0 Beta                                         */
/*                                                            */
/*   Created by Dwight House                                  */
/*   http://perfect.dwightdesign.com/                         */
/*------------------------------------------------------------*/

/*------------------------------------------------------------*/
/* layout.css                                                 */
/* Handles the structual layout of major sections of the page */
/*    for the computer screen.                                */
/*------------------------------------------------------------*/

/*------------------------------------------------------------*/
/* Structural layout code.                                    */
/*------------------------------------------------------------*/

/* Every kind of content will be inside the #page. */
#page
{
	margin:0 auto; /* No top and bottom margin, auto margin on the left and right, which combined with the width, creates a centered layout. */
	padding:3em 0; /* Creates space above and below #page (consistant across all browsers, as opposed to margin). */
	width:80%;     /* The width of the whole webpage, in this case a percentage of the width of the window. */
	min-width:600px;
	max-width:1200px;
}

/* Stabilizes placement of #navigation when it comes after #content in code. */
#wrapper
{
	float:left;
	width:100%;
}

#content
{
	margin:0 0 0 200px; /* Provides a margin into which the #navigation menu can flow. Must be equal to or greater than the width of #navigation. */
}

#navigation
{
	float:left;        /* So that #content will flow around #navigation, rather than appearing below it. */
	width:200px;       /* Width of navigation menu, must be equal to or less than the left margin of #content. */
	margin-left:-100%; /* Allows the placement of #navigation after #content in the code. Technique inspired by Position is Everything's article "One True Layout: Appendix D" (http://www.positioniseverything.net/articles/onetruelayout/appendix/holygrail). */
}

/*------------------------------------------------------------*/
/* Padding for each major section inside #page.               */
/*------------------------------------------------------------*/

.headerPadding
{
	padding:1em;
}

.contentPadding
{
	padding:1em;
	min-height:450px; /* This is where min-height should be declared for #content content. It's different for IE 6, see ie6Hacks.css. */
}

.navigationPadding
{
	padding:1em 0.5em 1em 0.5em;
}

.footerPadding
{
	padding:1em;
}