@import url("standard.css");
@import url("colors.css");


/*
# --- C S S - I N F O ------------------------------------------------------{}*/

/*
   Cascading Stylesheet http://www.dennisfrank.net
   Design, CSS and HTML by Dennis Frank - http://www.dennisfrank.net
   last update: 2006-07-05
*/

/*
# --- B O D Y --------------------------------------------------------------{}*/

	body {
		font-family: "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
		min-width: 770px;
		float: left; width: 100%;
		padding-top: 24px;
	}

/*
# --- L I N K S ------------------------------------------------------------{}*/
        
    a {
		cursor: pointer;
		text-decoration: none;
		border-bottom-width: 1px;
		border-bottom-style: dotted;
	}

    a:hover {border-bottom-style: solid;}
	
    a:active {}
    
    a:visited {}
	    
/*
# --- B L O C K S ----------------------------------------------------------{}*/

	h1 {
		position: absolute;
		z-index: 1000;
		top: 0; left: 38%;
		margin: 16px 0 0 -160px;
		width: 154px; height: 71px;
		font-size: 1em;
	}
		
	h2 {
		position: relative;
		left: 38%; top: 0;
		margin: 0 0 8px 13px;
		line-height: 160%;
		min-height: 60px;
		width: 19em;
		font-size: 90%;
		float: left;
		font-weight: normal;
	}
	
	#container {
		position: relative;
		float: left; clear: both;
		width: 100%;
		padding-top: 27px;
	}

	#content {
		position: relative;
		clear: both;
		margin-top: -2px; /* for IE/win */
		float: left;
		width: 100%;
	}

	#footer {
		float: left;
		width: 100%;
	}

/*
# --- H E A D E R ----------------------------------------------------------{}*/
	
	h1 a {
		display: block;
		width: 154px; height: 71px;
		text-decoration: none;
		border-width: 0;
		background-color: transparent;
		/* Phark Image Replacement (Modified for IE 5): http://www.eingko.net/blog/?p=16 */
		text-indent: -100em;
		overflow: hidden;
		/* see Hacks for IE 5 Mac */
	}
	
	h1:hover {/* see ie.css */}
/*
# --- C O N T E N T --------------------------------------------------------{}*/
	
	#content hr {display: block; visibility: hidden; clear: both; margin-bottom: 5em;}
	
	#default #content {padding-top: 140px;}
	
	h3 {
		font-size: 100%;
		font-weight: normal;
		line-height: 100%;
		text-align: left;
	}
	
	a#button-portfolio {
		position: absolute;
		top: 40px;
		right: 62%; margin-right: -207px;
		display: block;
		border-width: 0;
		background-position: 100% 0;
		height: 109px; width: 341px;
		/* Phark Image Replacement (Modified for IE 5): http://www.eingko.net/blog/?p=16 */
		text-indent: -100em;
		overflow: hidden;
		/* see Hacks for IE 5 Mac */
		
	}
		
	a:hover#button-portfolio {
		background-position: 0 -109px;
	}
	
	#content h3, #content p, #contactForm, #contactThanks, #hcard {
		position: relative;
		left: 13px; left: 2px;
		margin: .2em 0 .5em 38%; padding-left: 13px;
		width: 35em; max-width: 55%;
	}

	.section {
		margin-bottom:4em; 
		margin-left:5em;
	}

	#content p.info {font-size: 85%; margin-top: -4em;}

	#content #skills {
		overflow: auto;
		width: 30em; /* see ie.css */
		margin-top: 2em;
		padding: 13px 0 13px 13px;
		border-style: solid; border-width: 1px;
		border-width: 1em 0 0 0;
	}

	#skills img {
		border-width: 1px; border-style: solid;
		margin: 0em 1em .5em 0;
		float: left;
	}
		
	#skills strong {
		display: block;
	}

	#content .box {
		width: 31em;
		padding: 1em;
		left: 1px; padding-left: 14px;
		background-repeat: repeat-y;
	}
	
	strong.tel {font-size: 150%;}
	a.goyellow {border: 0;}
	
	#hcard {clear: both; margin-bottom: 2em;}
	
	#hcard p, #contactThanks p {max-width: 100%; margin-left:0; left: 0; padding: 0;}
	.fn {font-weight: bold;}

	h4 {
		position: relative;
		font-size: 130%;
		width: 38%;
		text-align: right;
		margin: 0 0 -.9em 0;
		line-height: 130%;
		float: left;
		color: #d7ddc8;
	}
	
	h4 span {display: block; padding-right: 13px;}
	

	.item {
		position: relative;
		margin : 0;
		padding: 3em 0 8em 0;
	}
	
	.item h4 {
		float: none;
		font-size: 170%;
		color: #fff;
	}

	.item .type {
		position: relative;
		top: 0; left: 38%;
		margin-left: 13px;
		width: 578px;
	}

	.item .image a {
		display: block;
		text-decoration: none;
		line-height: 0em;
		width: 725px; /* for IE/win */
	}

	.item .image {
		position: relative;
		display: block;
		left: 50%;
		margin-left: -376px;
		margin-top: 8px;
		width: 725px; width: 759px;
		padding: 13px 14px 11px 13px;
		border-width: 1px; border-style: solid;
	}

	.item a:hover.image {text-decoration: none;}
		
	.item .image img {
		clear: both; float: none;
	}
	
	.item .infos {margin-top: 1em; font-size: 90%;}
	#content .item .infos p {margin-bottom: 0; margin-top: 0;}
	.item .infos strong {font-weight: normal;}
	
/*
# --- F O O T E R ----------------------------------------------------------{}*/

	#footer p {
		width: 38%;
		margin-left: -13px;
		text-align: right;
		font-size: 80%;
	}

/*
# --- F O R M S ------------------------------------------------------------{}*/

	#contactForm {clear: both; margin-bottom: 0; padding-left: 0; left: 2px;}

	#contactForm fieldset {
		width: 30em; /* see ie.css */
		margin: 2em 0 0 0;
		padding: 13px 0 13px 13px;
		border-style: solid; border-width: 1px;
		border-width: 1em 0 0 0;		
	}

	#contactForm p {
		font-size: 80%;
		line-height: 120%;
		margin: 0; padding: 0;
		width: 18em;
		clear: both;
	}

	#contactForm legend {display: none;}
	
	#contactForm label {}
	#contactForm div {position: relative; z-index: 100; width: 50%; margin-bottom: 1em; float: left;}
	#contactForm div input {width: 13em;}
	#contactForm textarea {width: 28em; margin-bottom: .5em;}
	
	input, checkbox, textarea {border-width: 1px;}
	
	#contactSubmit {
		float: right;
		width: 13em;
		height: 3em;
		margin: -3em 1.3em 0 0;
	}
	
	.contactError, #contactThanks {
		border-width: 5px;
		border-style: solid;
		padding: .5em;
	}

	.contactError {margin: 1em 1em 1em 0;}
	#contactThanks {left: 13px;}
	
	#contactForm #phone, #contactForm #mail {display: none;}

/*
# --- H A C K S ------------------------------------------------------------{}*/

h1 a {
	/* Phark Image Replacement IE 5 Mac Hack: http://www.eingko.net/blog/?p=16l */
	line-height: 71px;
	overflow: visible;
	/* Hide from IE 5 Mac \*/
	overflow: hidden;
	/* End hide from IE 5 Mac */
}

a#button-portfolio {
	/* Phark Image Replacement IE 5 Mac Hack: http://www.eingko.net/blog/?p=16l */
	line-height: 109px;
	overflow: visible;
	/* Hide from IE 5 Mac \*/
	overflow: hidden;
	/* End hide from IE 5 Mac */
}