/*-----------------------------------------------------------------------------
pmurbach.com Screen Stylesheet

version:   1.2
date:      March 2009
author:    Pierre Murbach
email:     info@pmurbach.com

website:   http://www.pmurbach.com

version history: N/A
-----------------------------------------------------------------------------*/

/* Import other stylesheets
-----------------------------------------------------------------------------*/

/* @import url("otherstylesheet.css"); */

/* Remove margin, padding and border from everything
-----------------------------------------------------------------------------*/

*
{
	margin: 0;
	padding: 0;
}

body
{
	font: 11px/1.5em "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	color: #555;
	text-align: center;
	background: #c9c6c6 url(../images/l-bg.gif) repeat-y fixed center;
}

h1, h2, h3, h4, h5, h6
{
	font-family: helvetica, Arial, Verdana, sans-serif;
	font-weight: normal;
	padding: 0 0 0 10px;
	margin-bottom: 0.5em;
	color: #666;
}

/* Styles for layout
-----------------------------------------------------------------------------*/

.clear { clear: both; }
.right { float: right; }
.left { float: left; }

/* Typography
-----------------------------------------------------------------------------*/

/* H1
---------------------------------------------*/

h1
{
	font-size: 172%;
	line-height: 1.3em;
	color: #5E5E5E;
	font-weight: bold;
}

/* H2
---------------------------------------------*/

h2
{
	font-size: 164%;
	line-height: 1.3em;
	color: #666666;
	padding-top: 4px;
}

/* H3
---------------------------------------------*/

h3
{
	font-size: 145%;
	line-height: 1.3em;
	padding: 0.5em 0 0 10px;
}

/* H4
---------------------------------------------*/

h4
{
	font-size: 100%;
	line-height: 1.3em;
	text-align: right;
}

p { padding: 0 5px 10px 10px; }

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

a
{
	text-decoration: none;
	color: #000;
}

a:link
{
	text-decoration: none;
	color: #000;
}

a:visited { text-decoration: none; }
a:hover { color: #93bf35; }

a:active
{
	text-decoration: none;
	color: #000;
}

p a,
ul a,
dl a,
ol a,
div.contactme a { font-weight: bold; }

/*--------------------------------------------
LISTS
---------------------------------------------*/

ul, 
dl,
.paginate { padding: 0 0 15px 10px; }
ul li { list-style: none; }
ul li,
ol li { padding: 0 0 0.3em 0; }

dd
{
	padding: 0 0 1em 0;
	color: #666;
}

ol { padding: 0 0 15px 27px; }

#posted
{
	float: right;
	width: 195px;
}

#posted ul { width: 195px; }
#posted ul li { width: 195px; }

ul.bulletlist li
{
	background: url(http://images/icon_bullet.gif) no-repeat;
	padding: 0 0 2px 20px;
}

ul.thumblist
{
	display: block;
	width: 100%;
	margin: 20px 0 20px 0;
}

ul.thumblist li
{
	float: left;
	display: block;
	width: 125px;
	margin: 0 7px 7px 0;
	padding: 0;
}

ul.thumblist li a
{
	padding: 0;
	margin: 0;
}

/*--------------------------------------------
IMAGES
---------------------------------------------*/

img { border: 0; }

img.thumb
{
	float: left;
	padding-right: 10px;
	padding-top: 0;
	padding-left: 0;
}

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

.c1-c2-ph h2 + p { border-bottom: 1px solid #000; }

.c1-c2-ph #c1 h2 + p
{
	padding: 0 0 1em 10px;
	margin: 0 5px 1em 0;
}

.c1-c2-ph #c2 h2 + p
{
	padding: 0 0 1em 5px;
	margin: 0 0 1em 5px;
}

/* Project summary dl */
dl.project-summary
{
	position: relative;
	border-bottom: 1px solid #ccc;
}

#c1 dl.project-summary
{
	margin: 0 5px 0.5em 0;
	padding: 0 0 1em 10px;
}

#c2 dl.project-summary
{
	margin: 0 0 0.5em 5px;
	padding: 0 0 1em 5px;
}

dl.project-summary dt
{
	position: relative;
	text-transform: uppercase;
	font-size: 1.2em;
	margin: 0 0 0.5em 0;
}

dl.project-summary dd
{
	position: relative;
	display: block;
	margin: 16px 10px 0 0;
}

dl.project-summary ds
{
	position: relative;
	display: block;
	margin: 16px 10px 0 0;
}

/*--------------------------------------------
HOMEPAGE
---------------------------------------------*/

p.intro
{
	font-family: helvetica, arial, verdana, sans-serif;
	font-size: 145%;
	color: #666;
	width: 630px;
	line-height: 1.5em;
}

p.intro a { font-weight: normal; }

#recentwork
{
	background: #F3FFBF;
	border-top: 3px solid #93bf35;
	margin: 25px 0 0 0;
}

#recentwork p
{
	float: right;
	width: 195px;
	margin: 0;
}

#sectiontitle
{
	font-size: 200%;
	margin: 1em 0 0.5em;
}

#home div.post { border-bottom: none; }
#footer { clear: left; }

/*--------------------------------------------
MISC
---------------------------------------------*/

hr,
.hide { display: none; }
blockquote { margin: 1em 0 1em 1em; }
.cl { clear: left; }
.cr { clear: right; }
.cb { clear: both; }

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

h2#logotype
{
	padding: 0;
	margin: 0;
}

#masthead ul#skiplinks { display: none; }

#masthead h1#logotype
{
	float: left;
	padding: 0 0 30px;
	margin: 50px 0 0;
}

#masthead h1#logotype a
{
	text-indent: -9999px;
	display: block;
	width: 440px;
	height: 55px;
	background: url(../images/logotype.png) no-repeat 0 0;
	overflow: hidden;
	margin-left: 1px;
}

#masthead h1#logotype a:hover { background-position: 0 -55px; }

#masthead p
{
	clear: left;
	float: left;
	width: 405px;
	height: 30px;
	border-bottom: 15px solid #93bf35;
	padding-bottom: 2px;
}

#masthead p span { visibility: hidden; }

#masthead ol
{
	float: right;
	width: 356px;
	height: 30px;
	list-style: none;
	border-bottom: 15px solid #787878;
	padding-bottom: 2px;
	padding-left: 60px;
}

#topnav li
{
	float: left;
	padding: 0 12px;
	font-weight: bold;
	color: #a7a7a7;
}

#container
{
	width: 840px;
	margin: 0 auto;
	text-align: left;
	position: relative;
	background: #fff;
}

#content
{
	margin: 0 0 30px 0;
	padding: 0 0 30px;
}

/* PAGE STRUCTURE 
---------------------------------------------*/

/* 3 column layout c1-c2-c3 */
.c1-c2-c3 #c1
{
	clear: both;
	float: left;
	width: 415px;
	padding: 15px 0 5px 0;
	border-top: 3px solid #93bf35;
}

.c1-c2-c3 #c2
{
	float: left;
	width: 205px;
	padding: 12px 0 0 5px;
	margin: 0 5px 0 0;
	border-top: 3px solid #93bf35;
	font-weight: bold;
}

.c1-c2-c3 #c3
{
	float: right;
	width: 205px;
	padding: 12px 5px 5px 0;
	border-top: 3px solid #ccea8d;
}

#photos.c1-c2-c3 #c1
{
	clear: both;
	float: left;
	width: 500px;
	padding: 15px 0 5px 0;
	border-top: 3px solid #93bf35;
}

#photos.c1-c2-c3 #c2
{
	float: left;
	width: 125px;
	padding: 15px 0 0 0;
	margin: 0 5px 0 0;
	border-top: 3px solid #93bf35;
}

/* 2 column layout c1-c2 */
.c1-c2 #c2
{
	float: right;
	width: 205px;
	padding: 12px 5px 5px 0;
	border-top: 3px solid #ccea8d;
}

.c1-c2 #c1
{
	clear: both;
	float: left;
	width: 625px;
	padding: 15px 0 0 0;
	margin: 0 5px 0 0;
	border-top: 3px solid #93bf35;
}

/* 2 column layout for PORTFOLIO homepage c1-c2-ph */
.c1-c2-ph #c2
{
	float: right;
	width: 420px;
	padding: 15px 0 0 0;
	border-top: 3px solid #93bf35;
}

.c1-c2-ph #c1
{
	clear: both;
	float: left;
	width: 420px;
	padding: 15px 0 0 0;
	border-top: 3px solid #93bf35;
}

/* 2 column layout for PORTFOLIO detail c1-c2-c3-pd */
.c1-c2-c3-pd #c1
{
	float: left;
	width: 840px;
	padding: 15px 0 0 0;
	border-top: 3px solid #93bf35;
}

.c1-c2-c3-pd #c3
{
	float: right;
	width: 210px;
	padding: 12px 0 5px 0;
	border-top: 3px solid #000;
}

.c1-c2-c3-pd #c2
{
	clear: both;
	float: left;
	width: 625px;
	padding: 15px 0 0 0;
	margin: 0 5px 0 0;
	border-top: 3px solid #000;
}

/* 1 column layout c1-c2 */
.c1 #c1
{
	float: left;
	width: 840px;
}

/* Homepage layout c1-c2-c3 */
#home.c1-c2-c3 #c1
{
	float: left;
	width: 840px;
	border: none;
}

#home.c1-c2-c3 #c2
{
	clear: both;
	float: left;
	width: 415px;
	padding: 15px 5px 5px 0;
	margin: 0;
	border-top: 3px solid #93bf35;
}

#home.c1-c2-c3 #c3
{
	float: left;
	width: 205px;
	padding: 12px 0 0 0;
	margin: 0 5px 0 0;
	border-top: 3px solid #93bf35;
}

#home.c1-c2-c3 #c4
{
	float: right;
	width: 210px;
	padding: 12px 0 5px 0;
	border-top: 3px solid #ccea8d;
}

/* footer */
#aboutfooter
{
	float: left;
	width: 840px;
	padding: 2em 0 2em 0;
	margin: 5em 0 0 0;
	border-top: 3px solid #93bf35;
}

#aboutmark
{
	float: left;
	width: 615px;
	margin: 0 5px 0 0;
}

#aboutworkwithme
{
	float: left;
	width: 205px;
	margin: 0;
	padding: 0 0 0 10px;
}

#aboutworkwithme h4
{
	margin: 0;
	padding: 0;
	background: url(../logo.gif) no-repeat top left;
	height: 40px;
	width: 210px;
}

#aboutworkwithme h4 a
{
	display: block;
	height: 40px;
	width: 210px;
	text-indent: -999em;
	overflow: hidden;
}

/* footer */
#footer
{
	clear: left;
	font-size: 90%;
	line-height: 130%;
	color: #999;
	padding: 2em 0 2em 0;
}

#footer p.copyright
{
	float: left;
	color: #999;
	width: 615px;
	padding: 10px 0 0 10px;
	margin: 0 5px 0 0;
	border-top: 3px solid #93bf35;
}

#footer p.pagenumber
{
	float: right;
	width: 200px;
	padding: 10px 10px 0 0px;
	border-top: 3px solid #ccea8d;
	text-align: right;
}

#footer p.pagenumber a { padding: 0 0 0 5px; }

/* Misc structure elements */
.clear
{
	clear: both;
	visibility: hidden;
}