/*  
    0. template
    1. main
	2. residential 
	3. commercial
	4. design studio
	5. who
	6. servies
	7. process
	8. press
	9. contact
	10. viewer
*/


/*  +-------------+
    | 0. template |
    +-------------+  */

/* all */
*
{
	color: #666666;
	padding: 0px;
	margin: 0px;
}

/* body*/
body
{
	background-color: #000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding-bottom: 10px;
	padding-top: 8px;
	width: 100%;
}

/* container */
div#container
{
	margin: auto;
	width: 800px;
}

/* header */
div#header
{
	background-color: #900;
}

/* logo */
div#header h1.logo
{
	color: #fff;
	font-size: 2.22em;
	height: 133px;
	position: relative;
	width: 800px;
}

/* logo image */
div#header h1.logo span
{
	background: url( 'images/logo.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* lists */
ul
{
	list-style: none;
}

/* navigation */
div#navigation
{
	background-color: #464646;
	border-bottom: solid 5px #333333;
	border-top: solid 5px #666666;
	height: 25px;
	width: 800px;
}

/* navigation list */
div#navigation ul
{
	padding-left: 48px;
	padding-top: 6px;
}

/* navigation list item */
div#navigation ul li
{
	float: left;
}

/* navigation list item link */
div#navigation ul li a
{
	color: #9C9C9C;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.22em;
	font-weight: bold;
	letter-spacing: .1px;
	margin-left: 17px;
	text-decoration: none;
}

/* navigation list item link hover and current*/
div#navigation ul li a:hover, div#navigation ul li a.current
{
	color: #eee;
}

/* footer */
div#footer
{
	clear: both;
	background-color: #900;
	height: 86px;
	width: 800px;
}

/* footer list */
div#footer ul
{
	padding-left: 105px;
	padding-top: 37px;
	width: 800px;
}

/* footer list item */
div#footer ul li
{
	float: left;
	line-height: 20px;
	padding-left: 2px;
}

/* footer list item link */
div#footer ul li a
{
	color: #fff;
	text-decoration: none;
}

/* footer list seperator */
div#footer li.seperator
{
	line-height: 20px;
	color: #f66;
	font-size: 14px;
}

/* footer copyright */
div#footer div.copyright
{
	clear: left;
	color: #f66;
	text-align: center;
}



/* column */
div.column
{
	float: left;
	width: 400px;
}

/* paragraph */
p
{
	color: #fff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	line-height: 16px;
}

/* template */
div#template
{
	color: #666666;
	font-size: 12px;
	line-height: 17px;
	margin: auto;
	padding-bottom: 30px;
	padding-left: 75px;
	padding-top: 30px;
	width: 725px;
}

/* outer box */
div#template div.outer-box
{
	background-color: #fff;
	border: solid 1px #8d8d8d;
	border-left: solid 1px #fff;
	border-top: solid 1px #fff;
	width: 632px;
	padding: 8px;
}

/*inner box */
div#template div.inner-box
{
	background-color: #fff;
	border: solid 1px #8d8d8d;
	border-right: solid 1px #fff;
	border-bottom: solid 1px #fff;
	width: 630px;
}

/* right floated item */
.right
{
	float: right;
	padding-left: 14px;
}



/*  +-------------+
    | 1. main     |
    +-------------+  */

/* columns */
/* left column */
div#main div.left-column
{
	float: left;
	width: 403px;
}

/* left column */
div#main div.right-column
{
	float: left;
	width: 397px;
}

/* home-splash */
h3#home-splash
{
	color: #fff;
	font-size: 1.65em;
	height: 314px;
	position: relative;
	width: 403px;
}

/* home-splash image */
h3#home-splash span
{
	background: url( 'images/home-splash.jpg' );
	background-color: #666666;
	position: absolute;
	width: 100%;
	height: 100%;
}

/* home-space-container */
div#home-space-container
{
	background-color: #666666;
	height: 73px;
	width: 403px;
}

/* home-space */
h3#home-space
{
	background-color: #666666;
	color: #fff;
	font-size: 1.65em;
	height: 60px;
	padding-left: 63px;
	position: relative;
	width: 215px;
}

/* home-space image */
h3#home-space span
{
	background-color: #666666;
	background: url( 'images/home-space.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* home-designs */
h3#home-designs
{
	background-color: #900;
	color: #DE9256;
	font-size: 1.65em;
	height: 61px;
	position: relative;
	width: 397px;
}

/* home-designs image */
h3#home-designs span
{
	background-color: #666666;
	background: url( 'images/home-designs.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* narrative */
div#narrative
{
	background-color: #c60;
	height: 294px;
	padding-left: 22px;
	padding-right: 22px;
	padding-top: 32px;
}

/* narrative paragraph */
div#narrative p
{
	padding-bottom: 10px;
}

/*  +-----------------------+
    | 2. residential        |
    +-----------------------+  */

div.gallery
{
	padding-bottom: 11px;
	padding-top: 11px;
}

ul.gallery
{
	height: 65px;
}

ul.gallery li
{
	float: left;
	padding-right: 5px;
}

div#residential-template
{
	background-color: #fff;
	height: 650px;
}

/* left column */
div#residential-template div.left-column
{
	background-color: #c26000;
	float: left;
	height: 650px;
	width: 320px;
}

/* title */
h3#residential-studio-title
{
	color: #fff;
	font-size: 1.65em;
	height: 61px;
	position: relative;
	width: 320px;
}

/* title span */
h3#residential-studio-title span
{
	background: url( 'images/residential.gif' );
	background-color: #666666;
	position: absolute;
	width: 100%;
	height: 100%;
}

/* splash */
h3#residential-studio-splash
{
	color: #fff;
	font-size: 1.65em;
	height: 417px;
	position: relative;
	width: 320px;
}

/* splash span */
h3#residential-studio-splash span
{
	background: url( 'images/residential-splash.jpg' );
	background-color: #666666;
	position: absolute;
	width: 100%;
	height: 100%;
}

/* right column */
div#residential-template div.right-column
{
	float: left;
	height: 650px;
	width: 446px;
	background-color: #fff;
	padding-left: 20px;
	padding-right: 14px;
}

/* paragraph */
div#residential-template div.right-column p
{
	color: #666666;
}

div#residential-template div.right-column p.top
{
	padding-top: 30px;
}

div.right-column p.quote
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	line-height: 16px;
	padding-top: 20px;
}

div.right-column p.quote span.reference
{
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 1.12em;
	font-style: italic;
}


/*  +-----------------------+
    | 3. commercial         |
    +-----------------------+  */

div#commercial-template
{
	background-color: #fff;
	height: 522px;
}

/* left column */
div#commercial-template div.left-column
{
	background-color: #c26000;
	float: left;
	height: 522px;
	width: 320px;
}

/* title */
h3#commercial-studio-title
{
	color: #fff;
	font-size: 1.65em;
	height: 61px;
	position: relative;
	width: 320px;
}

/* title span */
h3#commercial-studio-title span
{
	background: url( 'images/commercial.gif' );
	background-color: #666666;
	position: absolute;
	width: 100%;
	height: 100%;
}

/* splash */
h3#commercial-studio-splash
{
	color: #fff;
	font-size: 1.65em;
	height: 417px;
	position: relative;
	width: 320px;
}

/* splash span */
h3#commercial-studio-splash span
{
	background: url( 'images/commercial-splash.jpg' );
	background-color: #666666;
	position: absolute;
	width: 100%;
	height: 100%;
}

/* right column */
div#commercial-template div.right-column
{
	float: left;
	height: 522px;
	width: 446px;
	background-color: #fff;
	padding-left: 20px;
	padding-right: 14px;
}

/* paragraph */
div#commercial-template div.right-column p
{
	color: #666666;
}

div#commercial-template div.right-column p.top
{
	padding-top: 30px;
}

/*  +-----------------------+
    | 4. design studio      |
    +-----------------------+  */

div#design-template
{
	background-color: #fff;
	height: 400px;
}

/* left column */
div#design-template div.left-column
{
	float: left;
	width: 276px;
}

/* right column */
div#design-template div.right-column
{
	float: left;
	width: 504px;
	background-color: #fff;
	padding-left: 20px;
}

div#design-template div.right-column p
{
	color: #666666;
	width: 440px;
	line-height: 14px;
	padding-bottom: 11px;
}



/* design-studio-splash */
h3#design-studio-splash
{
	color: #fff;
	font-size: 1.65em;
	height: 400px;
	position: relative;
	width: 276px;
}

/* design-studio-splash span */
h3#design-studio-splash span
{
	background: url( 'images/design-studio-splash.jpg' );
	background-color: #666666;
	position: absolute;
	width: 100%;
	height: 100%;
}


/* logo container */
div#design-template div.logo-container
{
	padding-bottom: 10px;
	padding-left: 0px;
	padding-top: 30px;
}

/* logo */
div#design-template h3.logo
{
	color: #fff;
	font-size: 2.22em;
	height: 29px;
	position: relative;
	width: 349px;
}

/* logo image */
div#design-template h3.logo span
{
	background: url( 'images/design-studio.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}



/*  +-------------+
    | 5. who      |
    +-------------+  */

/* who template */
div.who-template
{
	color: #666666;
	background-color: #666666;
}

/* narrative */
div.who-template div.narrative
{
	padding: 24px 8px 24px 8px;
}

/* process template paragraph */
div.who-template p
{
	color: #666666;
	padding-top: 11px;
	line-height: 14px;
}

/* services template paragraph point */
div.who-template p span.point
{
	color: #666666;
	font-weight: bold;
}

div.who-template div.outer
{
	height: 100%;
	background-color: #fff;
}

div.who-template div.outer-box
{
	padding-left: 16px;
}

div.who-template img
{
	padding-left: 20px;
}

div.who-template div.profile
{
	position: relative;
	top: -200px;
	left: 200px;
	width: 425px;
	margin-bottom: -155px;
}

div.who-template h4
{
	color: #000;
	font-size: .82em;
}

div.who-template span.title
{
	color: #000;
	font-size: .82em;
}


/*  +-------------+
    | 6. servies  |
    +-------------+  */

/* services template */
div.services-template
{
	color: #666666;
	background-color: #c60;
}

/* narrative */
div.services-template div.narrative
{
	padding: 24px 8px 24px 8px;
}

/* header */
div.services-template h3.header
{
	color: #fff;
	font-size: 1.22em;
	height: 29px;
	position: relative;
	width: 349px;
}

/* header image */
div.services-template h3.header span
{
	background: url( 'images/services.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* process template paragraph */
div.services-template p
{
	color: #666666;
	padding-top: 14px;
}

/* services template paragraph point */
div.services-template p span.point
{
	color: #666666;
	font-weight: bold;
}


/*  +-------------+
    | 7. process  |
    +-------------+  */

/* process template */
div.process-template
{
	color: #666666;
	background-color: #c60;
}

/* narrative */
div.process-template div.narrative
{
	padding: 24px 8px 24px 8px;
}

/* header */
div.process-template h3.header
{
	color: #fff;
	font-size: 1.22em;
	height: 27px;
	position: relative;
	width: 334px;
}

/* header image */
div.process-template h3.header span
{
	background: url( 'images/process.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* process template paragraph */
div.process-template p
{
	color: #666666;
	padding-top: 14px;
}

/* process template paragraph point */
div.process-template p span.point
{
	color: #666666;
	font-weight: bold;
}

/*  +-------------+
    | 8. press    |
    +-------------+  */

/* press template */
div.press-template
{
	color: #666666;
	background-color: #c60;
}

/* narrative */
div.press-template div.narrative
{
	padding: 34px 105px 16px 105px;
}

/* header */
div.press-template h3.header
{
	color: #fff;
	font-size: 2.22em;
	height: 29px;
	position: relative;
	width: 349px;
}

/* header image */
div.press-template h3.header span
{
	background: url( 'images/press.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* paragraph */
div.press-template p
{
	color: #666666;
	line-height: 14px;
	padding-top: 10px;
}

/* paragraph */
div.press-template p span.important
{
	color: #666666;
	font-style: italic;
	font-weight: bold;
}

/* press releases */
div.press-template div.press-releases
{
	border-bottom: solid 1px #666666;
	border-top: solid 1px #666666;
	margin-bottom: 10px;
	padding-bottom: 10px;
	margin-top: 10px;
	padding-top: 10px;
}

/* sub header */
div.press-template h5
{
	font-size: 12px;
	line-height: 17px;
	padding-bottom: 10px;
}

/* list item */
div.press-template div.press-releases ul li
{
	padding-bottom: 6px;
}

/* list link */
div.press-template a
{
	color: #00e;
	font-size: 10px;
}

/* more information */
div.press-template div.more-information
{
	font-size: 10px;
}

/* more information span */
div.press-template div.more-information span
{
	font-weight: bold;
}

/* more information list item */
div.press-template div.more-information ul li
{
	line-height: 13px;
}

/*  +-------------+
    | 9. contact  |
    +-------------+  */

/* contact template */
div.contact-template
{
	background-color: #900;
}

/* contact template list item */
div.contact-template li
{
	color: #666666;
}

/* logo container */
div.contact-template div.logo-container
{
	padding-bottom: 16px;
	padding-left: 191px;
	padding-top: 24px;
}

/* logo */
div.contact-template h3.logo
{
	color: #fff;
	font-size: 2.22em;
	height: 107px;
	position: relative;
	width: 249px;
}

/* logo image */
div.contact-template h3.logo span
{
	background: url( 'images/logo-white.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* child outer box */
div.contact-template div.child-outer-box
{
	background-color: #fff;
	border: solid 1px #8d8d8d;
	border-left: solid 1px #efefef;
	border-top: solid 1px #efefef;
	margin-bottom: 60px;
	margin-left: 115px;
	padding: 6px;
	width: 386px;
}

/* child inner box */
div.contact-template div.child-inner-box
{
	background-color: #fff;
	border: solid 1px #8d8d8d;
	border-right: solid 1px #fff;
	border-bottom: solid 1px #fff;
	padding: 7px;
	width: 368px;
}

/* contact container */
div.contact-template div.contact-container
{
	padding-bottom: 20px;
	padding-top: 16px;
}

/* contact */
div.contact-template h4.contact
{
	color: #000;
	font-size: .82em;
	height: 27px;
	position: relative;
	width: 321px;
}

/* contact image */
div.contact-template h4.contact span
{
	background: url( 'images/contact.gif' );
	position: absolute;
	width: 100%;
	height: 100%;
}

/* email list link */
ul.email a
{
	color: #900;
}

/* underline */
div.contact-template .underline
{
	color: #666666;
	text-decoration: underline;
}


/*  +-------------+
    | 10. viewer  |
    +-------------+  */

body#viewer
{
	background-color: #fff;
}

body#viewer div.container
{
	width: 100%;
	margin: auto;
}