/*
-----------------------------------------------------------------------------------------------
peterhammerquist.com
Global Desktop Styles
Winter 2011
-----------------------------------------------------------------------------------------------
*/

html 
{
	height: 100%;
}
body
{
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	background-color: #ffffff;
}
#grid
{
	width: 100%;
	min-width: 100%;
	min-height: 100%;
	padding: 0;
	margin: 0;
	text-align: center;

	background-color: #FFFFFF;
	background-repeat: repeat-y;
	background-position: 50% 0;
	background-attachment: fixed;
}
#content
{
	width: 980px;
	margin: 0 auto;
	padding: 128px 0 0 0;
	text-align: left;
	clear: both;
	position: relative;		
	z-index: 500;
}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* HEADER */

#header-wrapper
{
	width: 100%;
	min-width: 980px;
	height: 96px;
	top: 0;
	left: 0;
	padding: 0;
	margin: 0;
	overflow: hidden;
	position: fixed;
	z-index: 1000;
	border-bottom: 1px solid #cccccc;
	background-color: #eaeaea;
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-image: url("images/parchment_sprite_2560x600_001.jpg");	
}
#header-title
{
	width: 980px;
	height: 96px;
	padding: 0;
	margin: 0 auto;
	overflow: hidden;
}
#header-title h1 a
{
	color: #000000;
	display: block;
	padding: 0;
	margin: 40px 0 0 20px;
	overflow: hidden;
}
#header-title h1 a:hover
{
	color: #a50010;	
}

#print-head
{
	display: none;
}
#sub-header
{
	width: 940px;
	padding: 0;
	margin: 0px auto 0 auto;
	overflow: hidden;
}
#header-menu
{
	float: left;	
}
#header-menu h3
{
	float: left;
	height: 32px;
	line-height: 32px;
	padding: 0 20px 0 0;
	
	font-weight: 700;
	color: #666666;	
}

#header-info
{
	float: right;	
}
#header-info h3
{
	float: left;
	padding: 0 0 0 20px;
	font-weight: 400;
	color: #999999;		
}


/* ------------------------------------------------------------------------------------------------------------------------ */
/* SUB-HEAD */


.sub-head, .search-terms, .site-about
{
	display: none;	
}


/* ------------------------------------------------------------------------------------------------------------------------ */
/* PORTFOLIO THUMBS */

.project-thumb-wrapper
{
	width: 100%;
	background-color: #ffffff;
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-image: url("images/parchment_body_test_001.jpg");	
}	

.project-thumb-list, .project-feature-list
{
	width: 960px;
	padding: 0 0 0 20px;
	margin: 0 auto;
	overflow: hidden;	
	clear: both;	
}
.project-thumb-list h3, .project-feature-list h3
{
	margin: 0;
	padding: 0;	
}

/* SMALL REGULAR THUMBS */

.project-thumb-small
{
	width: 220px;
	height: 208px;
	
	overflow: hidden;		
	float: left;
	margin: 0 0;
	padding: 0 20px 0 0;
}

.project-thumb-small a
{
	width: 220px;
	height: 176px;

	display: block;
	margin: 0 0;
	padding: 0 0 0 0;
}
.project-thumb-small .thumb-image
{
	width: 220px;
	height: 128px;
	
	overflow: hidden;
	display: block;
	background-color: #000000;
	background-position: 0 0;
	background-repeat: no-repeat;	
}
.project-thumb-small .thumb-title
{
	width: 200px;	
	display: block;
	margin: 8px 0 0 0;
}

/* LARGE FEATURED THUMBS */

.project-thumb-large
{
	width: 460px;
	height: 330px;
	
	overflow: hidden;		
	float: left;
	margin: 0 0;
	padding: 0 20px 0 0;
}

.project-thumb-large a
{
	width: 460px;
	height: 298px;

	display: block;
	margin: 0 0;
	padding: 0 0 0 0;
}
.project-thumb-large .thumb-image
{
	width: 460px;
	height: 266px;
	
	overflow: hidden;
	display: block;
	background-color: #000000;
	background-position: 0 0;
	background-repeat: no-repeat;	
}
.project-thumb-large .thumb-title
{
	width: 440px;	
	display: block;
	margin: 8px 0 0 0;
}

/* -------------------------------------------------------------------------------------------------------------------------------- */
/* PROJECT */

.project
{
	overflow: hidden;
	padding: 0;
	margin: 0;	
	clear: both;
	position: relative;
}

/* IMAGES */

.project-images
{
	width: 700px;
	margin: 0;
	padding: 0 0 0 20px;
	overflow: hidden;
}
.project-image-wrapper
{
	width: 700px;
	margin: 0 0 48px 0;
	padding: 0 0;
	overflow: hidden;
}

/* INFO */

#project-description
{
	width: 220px;
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 20px;
	z-index: 600;
	
	margin: 0 0 48px 0;
	padding: 0 0 0 0;
}
#project-description h2
{
	margin: 2px 0 19px 0;	
}

.project-info
{
	clear: both;
	margin: 0 0;	
}
.project-details
{
	clear: both;
	margin: 0 0;		
}
.project-details h4
{
	width: 60px;
}
.project-details p
{
	/* width: 160px; */
}
.project-url
{
	margin: 14px 0 0 0;	
}
p.back_button
{
	clear: both;	
}

.project-spacer
{
	display: block;
	/* border-top: 1px solid #cccccc;	*/
	height: 48px;
	clear: both;
	margin: 0 20px;
}


/* ------------------------------------------------------------------------------------------------------------------------ */
/* FLICKR */

.photo-thumb-list
{
	width: 960px;
	padding: 0 0 0 20px;
	margin: 0;
	overflow: hidden;	
	clear: both;	
}
.flickr-thumb
{
	width: 300px;
	height: 288px;	
	overflow: hidden;		
	float: left;
	margin: 16px 20px 0px 0;
	padding: 0;
}
.flickr-thumb a
{
	display: block;
	font-weight: bold;
	overflow: hidden;
	width: 300px;
	height: 176px;	

}
.flickr-thumb img
{
	display: block;
	/* width: 300px; */
}


/* ------------------------------------------------------------------------------------------------------------------------ */
/* FOOT */

#site-foot
{
	width: 100%;
	min-width: 980px;
	padding: 0;
	margin: -240px 0 0 0 ;
	clear: both;
	position: relative;		
	/* opacity: 0.8; */

	background-color: #000000;	
	background-repeat: no-repeat;
	background-position: 50% -200px;
	background-image: url("images/parchment_sprite_2560x600_001.jpg");	
}
#foot-content
{
	width: 980px;
	height: 240px;
	padding: 0;
	margin: 0 auto 0 auto;
	position: relative;
	overflow: hidden;
}
.foot-spacer
{
	display: block;
	height: 288px;
	clear: both;
}

.foot-column
{
	width: 480px;
	padding: 0 0 0 0px;	
	float: left;
	overflow: hidden;
}
.foot-about-column
{
	width: 620px;
	padding: 0 0 0 20px;	
	float: left;
	overflow: hidden;
}


.foot-client-column
{
	width: 320px;
	padding: 0 0 0 20px;	
	float: left;
	overflow: hidden;
}

.foot-sub-column
{
	width: 160px;
	padding: 0 0px 0 0;	
	float: left;
}

#foot-content h3
{
	padding: 0 0;
	margin: 18px 0 0 0;
}
#foot-content h3.foot-contact
{
	margin: 30px 0 0 0;	
}
#foot-content p
{
	padding: 0 0;
	margin: 18px 0 0 0;
	color: #999999;
}
#foot-content .foot-about-column p
{
	padding: 0 160px 0 0;	
}
#foot-content h3
{
	color: #ffffff;	
}
#foot-content span
{
	width: 60px;
	display: block;
	float: left;
}
#foot-content em
{
	display: block;
	float: left;	
}
#foot-content em, #foot-content a
{
	color: #999999;	
}
#foot-content a:hover
{
	color:  #a50010;		
}


/* modal window */
/* ------------------------------------------------------------------------------- */

#modal-wrapper
{
	display: none;	
	
	width: 340px;
	height: 340px;
	top: 50%;
	left: 50%;
	margin-left: -170px;
	margin-top: -170px;
	margin-bottom: 0;
	margin-right: 0;

	position: fixed;
	padding: 0;	
	background-color: #ffffff;	
	z-index: 9010;
}

#modal-blackout
{
	display: none;	
		
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	position: fixed;	
	overflow: hidden;
	background-color: #000000;
	z-index: 9000;		
}

.modal_button
{
	width: 24px;
	height: 24px;
	background-image: url("images/gallery_buttons_1_24x24.png");
	background-repeat: no-repeat;
	text-indent: -9999px;
	display: block;
	position: absolute;	
}

#modal-close
{
	background-position: 0 0;
	top: -12px;
	right: -12px;
	z-index: 9020;	
}
#modal-error-msg
{
	z-index: 9100;	
	color: #00ffff;
	position: absolute;	
	bottom: 8px;
	right: 8px;
	margin: 0;
	padding: 0;
	display: none;	
}

.modal-loading
{
	background: url(images/spinner.gif) no-repeat center center;	
}


/* ------------------------------------------------------------------------------------------------------------------------ */
/* CONTACT FORM */

#contact-form-wrapper
{
	width: 300px;
	height: 320px;
	overflow: hidden;
	padding: 10px 20px 0 20px;
	border: 1px solid #000000;
}
#contact-over
{
	display: none;
	width: 300px;
	height: 300px;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 200;
	background:  #ffffff url(/images/spinner.gif) no-repeat center center;	
}
#contact-fields
{
	margin: 16px 0 0 0;
}
#contact-fields p
{
	overflow: hidden;
	padding: 0;	
	clear: both;
	margin: 0 0 8px 0;		
}
#contact-fields p.form-button
{
	float: right;
	margin: 2px 0 0 0;		
}
#contact-fields input, #contact-fields select, #contact-fields textarea
{
	width: 288px;
	line-height: 16px;		
	padding: 3px 5px;		
}
#contact-fields input, #contact-fields select
{
	height: 16px;
}
#contact-fields textarea
{
	height: 152px;	
}
#contact-fields p.form-button input
{
	width: auto;
	height: 24px;
	line-height: 24px;
	padding: 0 20px;
	margin: 0;
	border: none;
	
	font-size: 12px;
	font-weight: normal;	
	
	color: #ffffff;
	background-color: #333333;
	
}
#contact-fields p.form-button input:hover
{
	background-color: #a50010;	
}


/* SITE ERROR */

.site-error
{
	width: 960px;
	padding: 0 0 31px 20px;
	margin: 0;
	overflow: hidden;	
	clear: both;	
}
.site-error a
{
	color: #a50010;	
}
.site-error h1
{
	margin: 8px 0 10px 0;
}

/* ------------------------------------------------------------------------------------------------------------------------ */
/* DEFAULTS */

/* ------------------------------------ */
/* LINKS */

a{
	color: #000000;;
	text-decoration: none;
}
a:hover, p a:hover, p a
{
	color: #a50010;	
	text-decoration: none;
}

/* ------------------------------------ */
/* TYPOGRAPHY */


body, h1, h2, h3, h4, p, td, li, input, textarea, select, label, span.label
{
	font-size: 11px;
	font-weight: normal;
	text-align: left;
	font-family: helvetica, Arial, Sans-Serif;
	color: #666666;	
}
h1, h2, h3, h4, p, td, li, input, textarea, select, label, span.label
{
	line-height: 16px;	
	margin: 0;
	padding: 0;
}
h2, h3
{
	font-weight: 400;
	font-family: "athelas", "Georgia", georgia, times, serif;
	color: #000000;
}
h2
{
	font-size: 16px;	
}
h3
{
	font-size: 14px;	
}
h4
{
	color: #000000;
}

ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
li {
	overflow: hidden;
}

/* H1 SITE HEAD */

h1 {
	color: #000000;
	font-size: 24px;
	line-height: 32px; 
	letter-spacing: 0em;
	font-family: "athelas", "Georgia", georgia, times, serif;
	font-style: normal;
	font-weight: 400;
}
h1 span 
{
	font-weight: 700;
}

/* FORMS */

input, select, textarea
{
	font-family: helvetica, 'Lucida Grande', lucida,  Arial, Sans-Serif;
	margin: 0 0;
	padding: 3px 5px;	
	border: 1px solid #999999;
}
label, td{
	margin: 0 0 0 0; 
	padding: 0;	
	display: block;	
}
label, span.label
{
	letter-spacing: 0.06em;
	color: #666666;
	font-style: italic;		
}


/* OTHER */

em{
	color: #666666;
	font-style: normal;	
}

.clear{
	clear: both;
}

.hide, .hide_print
{
	display: none;	
}

img{ 
	display: block;
	border: 0;
	margin: 0;
	padding: 0;	
}

table{
	padding: 0px;
	margin: 0px;
	border-collapse: collapse;	
}

form{
	padding: 0px;
	margin: 0px;
	clear: both;
}

#fixed-js-error
{
	display: none;
	position: fixed;
	top: 30px;
	right: 30px;	
	z-index: 9999;
	background-color: #ffffff;
	padding: 3px 6px;
	border: 1px solid #cccccc;
}


/* FIN */