/*
	Description: Default all-purpose stylesheet for piikkilanka.com "redesign '07".
	Created: 2007-04-04
	Last update: 2008-01-26
	Author: Teppo Koivula <teppo@piikkilanka.com>
	
	Please remember that studying, modifying and building upon is approved
	but it's unpolite, useless (you won't be learning much in the process) and
	possibly even illegal to publish and take credit for (unmodified) work of
	others - even if it's "only css" or "only html".
*/

* {
	margin: 0;
	padding: 0;
}

body {
	background: url('../images/bodyBackground_sideb.jpg') center top no-repeat black;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 0.8em;
	line-height: 150%;
	text-align: center;
	color: black;
}

#content a {
	color: #85a200;
}

#content a:hover {
	text-decoration: none;
	border-bottom: 1px dotted #85a200;
}

code {
	display: block;
	white-space: pre;
	margin: 1em 0 1.5em 0;
	padding: 0.5em;
	border: 1px solid #ddd;
	font-family: "Courier New", Courier, serif;
	font-size: 1em;
	line-height: 1.5em;
	color: #fff;
	background: #000;
}

p {
	margin-bottom: 1.5em;
}

h1 a {
	display: block;
	position: relative;
	top: 25px;
	left: 50px;
	height: 89px;
	width: 370px;
	background: url('../images/logo.jpg') no-repeat transparent !important;
}

h1 a span {
	display: none;
}

h2 {
	/* font-family: Verdana, Helvetica, Arial, sans-serif; */
	font-family: Georgia, "Times New Roman", Times, serif;
	border-bottom: 3px solid #b0c357;
	padding-bottom: 0.3em;
	letter-spacing: 0.1em;
	margin: 1.5em 0;
}

h2#slogan {
	font-family: Georgia, "Times New Roman", Times, serif;
	border: 0;
	margin: 0;
	padding: 0;
	font-size: 1.25em;
	letter-spacing: 0.05em;
	position: relative;
	top: -62px;
	left: 195px;
	width: 500px;
}

h2#slogan a {
	text-decoration: none;
	color: #a3b430;
}

#content h2 {
	font-size: 1.4em;
	line-height: 1.4em;
}

#content h2,
#content h2 a {
	font-weight: normal;
	margin: 1.5em 0 0.5em 0;
	border: 0 !important;
	color: black !important;
}

#content h2 a:hover {
	text-decoration: none;
}

h3 {
	/* font-family: Verdana, Helvetica, Arial, sans-serif; */
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1em;
	font-weight: normal;
	letter-spacing: 2px;
	margin: 1.5em 0;
}

h3 a:hover {
	text-decoration: none;
	border: 0 !important;
}

#content p.comment {
	margin-left: 18px;
}

a#logo {
	background: transparent;
	padding: 0;
}

a:link, a:visited,  a:active {
		color: blue;
		background: transparent;
		text-decoration: none;
}

a:hover {
		background: transparent;
		text-decoration: underline;
}

a img {
	background: transparent;
	padding: 0;
	border: 0;
}

#footer p.print {
	display: none !important;
}

#footer p.default {
	display: block !important;
}

#footer .feed_icon {
	position: relative;
	left: 15px;
	top: 3px;
}

p.signature {
	color: #666;
	padding: 25px 0 15px 0;
}

p.signature img {
	float: left;
	padding: 5px 10px 15px 0;
}

img.comments {
	float: none !important;
	height: 11px;
	width: 15px;
	padding: 0 5px !important;
	margin: 0 !important;
}

blockquote {
	margin: 2em 0 2em 4em;
	color: #8f9e2a;
}

blockquote:before, blockquote:after {
	color: #b0c357;
	display: block;
	font-size: 6em;
	width: 50px;
}

blockquote:before {
	font-family: Times New Roman, serif;
	content: open-quote;
	height: 0;
	margin: 50px 0 25px 0;
}

blockquote:after {
	font-family: Times New Roman, serif;
	content: close-quote;
	height: 0;
	margin: 40px 0 0 400px;
}

fieldset {
	border: 0;
}

input {
	padding: 0.1em 0.2em;
}

#content form {
	width: 400px;
	padding: 50px 0 0 50px;
}

#content form p {
	display: block;
	clear: both;
}

#content form label {
	float: left;
	width: 120px;
	padding-bottom: 15px;
	clear: left;
}

#content form label.long {
	width: 300px;
}

span.required {
	color: red;
}

#content form label.required:after {
	content: " *";
	color: red;
}

#content form input {
	float: left;
	width: 200px;
}

#content form input.button {
	width: auto;
	padding: 0.2em 0.5em;
	margin: 0.5em 0.5em 0 0;
	float: none;
}

#content form select {
	margin: 0 0 10px 0;
}

#content form textarea {
	width: 400px;
	height: 200px;
}

#content table.cv {
	padding: 0 0 2em 0;
	width: 100%;
}

#content table.cv tr {
	vertical-align: top;
}

#content table.cv th {
	padding: 0 2em 0 0;
	text-align: left;
}

#content table.cv th.short, #content table.cv td.short {
	width: 180px;
}

#content div.portfolio {
	background: url('../images/portfolioItemFooter.jpg') left bottom no-repeat #e8eece;
	position: relative;
	top: -13px;
	padding: 15px 15px 5px 15px;
	margin-bottom: 10px;
}

#content div.portfolio ul {
	padding-bottom: 20px;
}

/*
#content div.journalEntryContent img {
	padding: 12px 25px 20px 12px;
	background: url('../images/post_image_background.jpg') left top no-repeat transparent;
}
*/

#content h3 {
	font-size: 1.1em;
	padding: 0.2em 0;
	margin: 0 0 1em 0;
	border-bottom: 1px solid #b0c357;
}

#skipToContent {
	position: absolute;
	height: 25px;
	line-height: 25px;
	text-align: center;
}

#skipToContent ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

#skipToContent a {
	display: block;
	margin: 0;
	padding: 0;
	background: transparent;
}

#skipToContent p {
	display: none;
}

#skipToContent a:hover {
	display: block;
	margin: 0;
	padding: 0;
	background: black;
}

#wrapper {
	background: white;
	width: 871px;
	margin: 0 auto;
	position: relative;
	left: 10px;
}

#wrapperTop {
	background: url('../images/wrapperTopBackground_sideb.jpg') center top no-repeat;
	height: 485px;
	width: 871px;
}

#wrapperContent {
	padding: 15px;
	text-align: left;
}

#content img {
	float: left;
	padding: 0 20px 20px 0;
}

#content img.right {
	float: right;
	padding: 0 0 20px 25px;
}

#content div.smallcontent {
	clear: left;
	float: left;
	width: 280px;
	margin: 15px 20px 0 0;
	padding: 0 20px 0 20px;
	background: url('../images/smallcontent_background.jpg') left top no-repeat white;
}

#content div.smallcontent p {
	margin: 0 0 1em 0;
	padding: 0;
}

#content div.smallcontent h3 {
	margin: 0 0 1em 0;
}

#content div.smallcontent2 {
	float: left;
	margin-top: 15px;
	width: 150px;
}

div.smallcontent2_thumb {
	width: 150px;
	height: 113px;
	overflow: hidden;
}

div.portfolio_thumb {
	float: right;
	width: 150px;
	height: 113px;
	overflow: hidden;
}

div.portfolio_thumb a, div.portfolio_thumb a:hover
{
	display: block;
	width: 150px;
	height: 113px;
	background: url('../images/portfoliothumb_background.png') left top no-repeat;
	cursor: hand;
}

div.portfolio_thumb.white {
	float: left;
}

div.portfolio_thumb.white a, div.portfolio_thumb.white a:hover
{
	background: url('../images/photothumb_background.png') left top no-repeat;
}

/*
div.portfolio_thumb a:hover
{
	background: url('../images/photothumb_background_hover.png') left top no-repeat !important;
}
*/

#wrapperContent ul {
	padding: 0 0 1em 2.5em;
}

#content ul {
	list-style-image: url('../images/list_arrow.png');
}

#content ul li ul {
	list-style: none;
	list-style-image: none;
	padding: 0 0 0 1em;
}

#tools {
	position: relative;
	top: -50px;
	left: 500px;
	width: 300px;
}

#navigation {
	padding: 0 20px 5px 10px;
	margin: 0 20px 10px 10px;
	width: 250px;
	float: left;
}

#navigation p {
	margin: 0;
	padding: 0;
}

#navigation h2 {
	font-size: 1.1em;
	margin: 1.5em 0 0 0;
	border-bottom: none;
}

#navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}

#navigation ul li {
	background: #b0c357;
	}

#navigation ul li a {
	text-decoration: none;
	color: black;
	background: #b0c357;
	display: block;
	padding: 4px 6px;
	border-bottom: 1px solid #a2af41;
	border-left: 4px solid #ced894;
	border-right: 4px solid #ced894;
	height: 1%;
}

#navigation ul li a:hover {
	background: url('../images/navi_li_background.jpg') left top repeat-x #fff;
}

#navigation ul li a.active {
	background: url('../images/navi_li_active.jpg') left top repeat-x #ced894;
}

#content {
	width: 500px;
	float: left;
}

#clearer {
	clear: both;
}

#wrapperBottom {
	height: 12px;
	background: url('../images/wrapperBottomBackground.jpg') center bottom no-repeat;
}

#footer {
	margin: 20px 0 0 0;
	font-size: 0.9em;
	clear: both;
	background: url('../images/footerBackground.jpg') left bottom repeat-x;
}

#footer p {
	margin: 0;
	padding: 10px 0 15px 0;
	color: white;
	text-shadow: 0 0 0 black;
}

#footer a {
	padding: 0;
	background: transparent;
	color: #b7c339;
	font-weight: bold;
}

#footer a:hover {
	padding: 0;
	background: transparent;
	color: white;
}

#footer p span.copyright {
	font-family: Arial, Verdana, Helvetica, sans-serif;
}