/*  
Theme Name: hilja
Theme URI: http://hilja.net
Description: Built by Hiljá.
Author: Antti Hiljá
Author URI: http://hilja.net
*/

/* Meyer reset
***************************************************************************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;}
/* remember to define focus styles! */
:focus {
	outline: 0;}
body {
	line-height: 1;
	color: black;
	background: white;}
ol, ul {
	list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;}
caption, th, td {
	text-align: left;
	font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";}
blockquote, q {
	quotes: "" "";}

/* End Mayer reset
***************************************************************************************************/

/* Begin Links
***************************************************************************************************/

a { color: #00c0c0;
	text-decoration: none;
	outline: 0;
}
a:hover { color: #333;
	text-decoration: underline;
}
#footer a {
	color: #333;
	text-decoration: none;
}
#footer a:hover {
	color: #000;
	text-decoration: underline;
}
.uppercase {
	text-transform: uppercase;
}
p a.post-edit-link {
	position: fixed;
	top: 0;
	right: 0;
	padding: 4px;
}
a.post-edit-link {
	position: absolute;
	top: 0;
	right: 0;
	padding: 2px 6px;
}
#customfields-nav a[href^="http://"] {
	background: transparent url(images/external-link2.png) top right no-repeat;
	display: inline-block;
	padding: 0 13px 0 0;
}
#customfields-nav a[href^="http://hilja.net"] {
	background: transparent;
	display: inline-block;
	padding: 0;
}
/* End Links
***************************************************************************************************/

/* Begin Typography & Colors
**************************************************************************************************/
html { 	height: 100%; /* Cause onf Sticky Footer */
		margin-bottom: 1px;
}
body { height: 100%; /* Cause onf Sticky Footer */
	font-size: 62.5%; /* Resets 1em to 10px */
	font-family: "Lucida Grande", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #333;
	text-align: center;
}
p {
	margin: 0 0 10px 0;
	font-size: 1.12em;
	line-height: 170%;
}
strong, b {
	font-weight: bold;
}
em, i {
	font-style: italic;
}
#page {
	text-align: center;
	line-height: 150%;
}	
.blogentry a {
	text-align: left;
	font-size: 1em;
	color: #74b993;
}
.postmetadata {
	color: #996666;
}	
.postmetadata {
	text-transform: uppercase;
}
.postmetadata a { /* Postmetadata thingy */
	text-align: left;
	font-size: 1em;
	color: #444;
	text-transform: lowercase;
}
.postmetadata a:hover {
	text-align: left;
}
.date {
	font-size: 0.8em;
	color: #888;
}
.blognarrowcolumn a:hover, .blogentry a:hover { 
	text-align: left;
	font-size: 1em;
	color: #333;
}
small {
	font-family: "Helvetica Neue" Helvetica, Arial, Sans-Serif;
	font-size: .9em;
	font-weight: normal;
}
h2.pagetitle {
	font-size: 1em;
}
h1, h2, h3, h5, h6 {
	font-family: "Helvetica Neue", Helvetica, Arial, Sans-Serif, Verdana ;
}
h1 {
	font-weight: bold;
	font-size: 2em;
}
#titlefield h1 {
	margin: 0 auto;
	padding: 0;
	font-weight: normal;
	font-size: 1.2em;
}
h2 {
	font-weight: bold;
	font-size: 1em;
	margin: 30px 0 0;
}
.post h2 {
	margin-bottom: 10px;
}
h3 {
	font-size: 1.3em;
}
h3.comments {
	padding: 0;
	margin: 40px auto 20px ;
}
h4 {
	display: inline;
	font-weight: normal;
	text-transform: uppercase;
	font-size: 1.2em;
	font-family: "Lucida Grande", "HelveticaNeue", Helvetica, Arial, sans-serif;
}
h5 {
	font-size: 0.9em;
	display: inline;
	color: #333;
	font-weight: normal;
	text-transform: uppercase;
}
h1, h1 a, h1 a:hover, h1 a:visited, .description {
	text-decoration: none;
}
h3, h3 a, h3 a:visited, h4, h4 a, h4 a:visited {
	color: #333;
}	
h2 a, h2 a:visited {
	color: #333;
}
h2 a, h3 a, h4 a, {
	text-decoration: none;
}
.blog h2 a:hover, .blog h3 a:hover, .blog h4 a:hover, .post h2 a:hover, .post h3 a:hover, .post h4 a:hover {
	color: #888;
}
/* Begin headers
**********************************************/
h2.pagetitle {
	margin-top: 0;
}
#sidebar h2 {
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}
h4 {
    padding: 0;
    margin: 0;
}   
/* End headers
********************************************/
.entrytext a, .luelisaa a, .entry a {
	color: #A39480;
}
.entrytext a:hover, .luelisaa a:hover, .entry a:hover {
	color: #333;
}
.commentlist li, #commentform input, #commentform textarea {
	font: 1em 'Lucida Grande', Verdana, Helvetica, Arial, Sans-Serif;
	line-height: 1.5em;
}	
.commentlist li {
	font-weight: bold;
}
.commentlist cite a {
	font-weight: bold;
	font-style: normal;
	font-size: 1em;
	color: #333;
	text-decoration: underline;
}
.commentlist p {
	font-style: normal;
	font-weight: normal;
	line-height: 1.5em;
	text-transform: none;
}
#commentform p {
	font-family: Helvetica, Arial, Verdana, Sans-Serif;
}
.commentmetadata {
	font-weight: normal;
}
.commentmetadata a {
	color: #888;
}
#sidebar {
	font: 1.15em 'Lucida Grande', Verdana, Helvetica, Arial, Sans-Serif;
	line-height: 1.5;
	font-weight: normal;
}
small, .nocomments, blockquote, strike {
	color: #777;
}	
code {
	font: 1.1em 'Courier New', Courier, Fixed;
}
h2 a:hover, h3 a:hover {
	color: #888;
	text-decoration: none;
}
#footer p {
	display: inline;
	font-size: 1em;
}
/* End Typography & Colors
***************************************************************************************************/

/* Begin structure
***************************************************************************************************/
#page {
	width: 700px;
	height: 100%;
	margin: 0 auto;
}
body > #page {
	height: auto;
	min-height: 100%;
}
#header {
	width: 700px;
	padding: 00;
	text-align: center;
}
#content {
	padding-bottom: 12em;  /* STYCKY FOOTER thingy. Must be same height as the footer */
}
#blogcontent { /* For blog */
	padding-bottom: 12em;  /* STYCKY FOOTER thingy. Must be same height as the footer */
	text-align: left;
}
.entrytext {
	width: 100%;
}
.blogentry {
	padding: 0 10px 20px 10px;
}
.blog {
    width: 100%;
    padding: 25px 10px 10px 10px;
    clear: both;
    text-align: left;
}
a.more-link {
	color: #000;
	height: 10px;
	float: left;
	text-align: right;
 	background: transparent url('images/ball-red.gif') no-repeat 0 9px;
 	padding: 3px 12px;
 }
.entrytextnarrow01, .entrytextnarrow02, .entrytextnarrow03 {
	width: 28%;
	height: 30em;
	padding: 10px;
	margin: 10px 8px 0 8px;
	text-align: left;
	float: left;
	background-image: url('images/tausta07.png');
	background-repeat: repeat-x;
}
/* Round corners to the #postmetadata *********************************************************************************/

.postmetadata {
	text-align: left;
	width: 100%;
	position: relative;
	padding: .4em .6em;
	background: transparent url('images/tausta04.png');
}
.tl, .tr, .bl, .br {
	position: absolute;
	width: 5px;
	height: 5px;
	display: block;
}
.tl {
	background: transparent url(images/corner-tl5.gif) no-repeat;
	top: 0;
	left: 0;
}	
.tr {
	background: transparent url(images/corner-tr5.gif) no-repeat;
	top: 0;
	right: 0;
}
.bl {
	background: transparent url(images/corner-bl5.gif) no-repeat;
	bottom: 0;
	left: 0;
}
.br {
	background : transparent url(images/corner-br5.gif) no-repeat;
	right: 0;
	bottom: 0;
}
/* End round corners to the header *************************************************************************************/

.date {
	float: left;
}
.entry {
	width: 500px;
    margin: 0;
    text-align: left;
    padding: 0 0 2em 0;
}
.post {
	margin: 0;
    padding: .5em 0 2em 0;
   	clear: both;
   	background: #fff;
   	text-align: center;
}	
#footer {
	padding: 1em 0 1em 0;
	width: 100%;
	border-top: 1px solid #ddd;
	position: relative;
	margin-top: -12em; /* STICKY FOOTER thingy. Negative value of footer height */
	height: 10em;
	clear: both;
}
/* Clearfix hack */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
/* End Clearfix hack */

/* Begin structure
***************************************************************************************************/

/* Begin images
***************************************************************************************************/
img { 
	-ms-interpolation-mode: bicubic;
	max-width: 100%;
}
p img.alignnone, p img.aligncenter, p img.alignleft, p img.alignright, p img.attachment {
	padding: 15px 0 35px 0;
}
p img.aligncenter {
	display: block;
	margin: 0 auto;
}	
.alignleft {
    float: left;
}
.alignright {
    float: right;
}
/* End Images **************************************************************************************
***************************************************************************************************/

/* Begin main navigationn **************************************************************************
***************************************************************************************************/

div.navmenuwrap {
	position: relative;
	width: 700px;
	height: 40px;
	background: transparent url('images/bar.gif') no-repeat bottom center;
	overflow: hidden;}

ul.navmenu {
	text-align: center;
	overflow: hidden;}

ul.navmenu li {
	display: inline;}
	
ul.navmenu li a {
	display: inline-block;
	padding: 10px 15px;
	color: #333;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.1em;
	border: 0;}

ul.navmenu li a:hover {
	text-decoration: underline;
	border: 0;}

ul.navmenu li.works-link a,
ul.navmenu li.blog-link a {
	font-size: 1em;
	font-weight: normal;
	position: absolute;
	text-transform: lowercase;
	padding: 2px;
	top: 8px;}
ul.navmenu li.works-link a {
	left: 0;}
ul.navmenu li.blog-link a {
	right: 0;}

ul.navmenu li.current-cat a,
ul.navmenu li.current_page_item a{
	text-decoration: underline;}

/* End main navigationn 
***************************************************************************************************/

/* Begin sub navigationn
***************************************************************************************************/

#navmenu2 {
	width: 100%;
	border-bottom: .1em solid #ddd;
	margin: 1em 0 .5em 0;
	padding: 0 0 1em 0;
	text-transform: capitalize;
	font-size: 1em;
	overflow: hidden;}

#navmenu2 ul {
	list-style: none;
	margin: 0;
	padding: .5em 0 0 0;
	list-style-type: none;
	width: 100%;
	float: left;}
	
#navmenu2 ul li a {
	border: 0;
	text-indent: -9999px;
	display: block;
	float: left;
	width: 18px;
	height: 18px;
	margin: 0 .7em .5em 0;
	padding: 0;
	background: transparent url(images/pallo.gif) no-repeat;}

#navmenu2 ul li a:hover {
	background: #000;}

#navmenu2 ul li {
	display: block;
	float: left;
}
#navmenu2 .navmenu2head { /* Sub navigaion headers and bullets */
	width: 7.5em;
	text-align: right;
	padding: .3em 2em 0 0;
	margin: 0;
	background: url(images/triangle-right.gif) no-repeat;
	background-position: 8em .5em;
}
#navmenu2 .current-cat a,
#navmenu2 .current_page_item a {
	text-decoration: underline;
	background: #000;
}
/* End sub navigationn 
***************************************************************************************************/

/* Begin blog sub navigation
***************************************************************************************************/
#navmenu3 {
	width: 100%;
	border-bottom: .1em solid #ddd;
	margin: 1em 0 .5em 0;
	padding: 0 0 1em 0;
	overflow: hidden;
}
#navmenu3 ul {
	width: 100%;
	margin: .5em 0 0 0;
	padding: 0em 0 .5em 0;
	float: left;
	list-style: none;
	text-align: center;
}
#navmenu3 ul li a {
	font-size: 1em;
	color: white;
	display: block;
	float: left;
	height: 19px;
	padding: 3px 12px 0 12px;
	margin: 0 6px 0 0;
	overflow: hidden;
	text-align: center;
	background: black;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;	
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#navmenu3 ul li a:hover {
	-webkit-border-radius: 0;
	-khtml-border-radius: 0;	
	-moz-border-radius: 0;
	border-radius: 0;
	text-decoration: none;
}
#navmenu3 ul li.current-cat a {
	-webkit-border-radius: 0;
	-khtml-border-radius: 0;	
	-moz-border-radius: 0;
	border-radius: 0;
	text-decoration: none;
}
#navmenu3 ul li {
	display: block;
	float: left;
	text-align: center;
}
#navmenu3 .navmenu3head { /* Sub navigaion headers and bullets */
	width: 5.4em;
	text-align: right;
	padding: .3em 2em 0 0;
	margin: 0;
	background: url(images/triangle-right.gif) no-repeat;
	background-position: 6em .5em;
}
/* End blog sub navigation
***************************************************************************************************/

/* Begin next prev navigation
***************************************************************************************************/
#customfields-nav {
	position: relative;
	text-align: center;
	height: 18px;
	padding: 5px 0;
	font-size: 1em;
}
span.navigation-left a, span.navigation-right a, a span.navigation-left, a span.navigation-right {
	position: absolute;
	text-indent: -9999px;
	height: 15px;
	color: #888;
	display: block;
	height: 18px;
	width: 18px;
	text-transform: lowercase;
	background: transparent url(images/next-prev-sprite.png) no-repeat;
}
span.navigation-right a,
a span.navigation-right {
	background-position: right 0;
	top: 5px;
	right: 0;
}
span.navigation-left a,
a span.navigation-left {
	background-position: left 0;
	top: 5px;
	left: 0;
}
span.navigation-right a:hover,
a:hover span.navigation-right {
	background-position: right -18px;
}
span.navigation-left a:hover,
a:hover span.navigation-left {
	background-position: left -18px;
}
/* End next prev navigation **********************************************************************
***************************************************************************************************/

/* Start contact list ******************************************************************************
***************************************************************************************************/
ul#contactlist {
	list-style: none;
	margin: 0 auto;
	padding: 15px 0 0 0;
}
ul#contactlist li {
	display: inline;
	font-size: 1em;
}
ul#contactlist li.separator {
	display: inline;
	padding: 0 3px 0 20px;
	background: transparent url('images/ball-black.gif') no-repeat;
	background-position: 4px 3px;
}
/* End contact list ********************************************************************************
***************************************************************************************************/

/* Begin entrylists ********************************************************************************
***************************************************************************************************/

.entry ol {
	padding: 0 0 0 35px;
	margin: 0;
}
.entry ol li {
	margin: 0;
	padding: 0;
}
.postmetadata ul, .postmetadata li {
	display: inline;
	list-style-type: none;
	list-style-image: none;
}	
/* End entrylists **********************************************************************************
***************************************************************************************************/

/* Begin form elements *****************************************************************************
***************************************************************************************************/

/* Searchform */
li#search-wrap {
	width: 179px;
	height: 22px;
	position: relative;
}
li #searchform {
	margin: 0;
	padding: 0;
}
li #searchform input#s {
	padding: 3px 22px 3px 6px;
	border: 1px solid #888;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;	
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#searchsubmit {
	width: 22px;
	height: 22px;
	border: 0;
	background: transparent url('images/next-prev-sprite.gif') no-repeat 0 -36px;
	position: absolute;
	top: 0;
	right: 0;
}
li #searchform input#searchsubmit:hover {
	background-position: 0 -58px;
}
/* End searchform */
#commentform {
	padding: 20px 0 0 0;
	overflow: hidden;
}
.entry form { /* This is mainly for password protected posts, makes them look better. */
	text-align: center;
}
select.archive {
	width: 145px;
}	
input.button {
	width: 170px;
	padding: 5px;
	margin: 0;
	border: 1px solid #888;
	background-color: #ededed;
}
input.btnhov {
	background-color: yellow;
}
label.emaillabel, label.namelabel, label.websitelabel, label.textlabel {
	float: left;
	display: block;
	width: 55px;
	padding: 7px;
	text-transform: uppercase;
	text-align: right;
}	
#author, #email {
	float: left;
	border: 1px solid #888;
	background: transparent url('images/tausta04.png');
	width: 200px;
}	
#url {
	float: left;
	border: 1px solid #888;
	width: 200px;
}	
#commentform input {
	padding: 4px;
}	
#commentform textarea {
	width: 619px;
	padding: 5px;
	border: 1px solid #888;
}
#commentform #submit {
	margin: 5px 0 15px 0;
	float: right;
}
/* End form elements *******************************************************************************
***************************************************************************************************/

/* Begin Comments **********************************************************************************
***************************************************************************************************/
.commentlist {
	padding: 0 0 10px 0;
}
.commentlist li {
	margin: 0;
	padding: 5px 7px 5px 7px;
	list-style: none;
	border-bottom: 1px solid #ddd;
}
.commentlist p {
	margin: 10px 0 10px 0;
}
#commentform p {
	margin: 0 0 10px 0;
}
.nocomments {
	text-align: center;
	margin: 0;
	padding: 0;
}
.commentmetadata {
	margin: 0;
	display: block;
}
/* End comments ************************************************************************************
***************************************************************************************************/

/* Begin Various Tags & Classes ********************************************************************
***************************************************************************************************/

img#wpstats { /* This is to hide wordpress.com Stats smiley */
	display: none
}
.clear {
	clear: both;
}
.inline {
	display: inline;}

acronym, abbr, span.caps {
	cursor: help;}

acronym, abbr {
	border-bottom: 1px dashed #999;}

blockquote {
	margin: 15px 30px 0 10px;
	padding-left: 20px;}

blockquote {
	margin: 5px 0 0;
	display: block;}

cite {
	display: inline;}

.center {
	text-align: center;}

.textalignleft {
	text-align: left;}

.hrhide {
	display: none;}

a img {
	border: none;}

.edit {
	clear: both;
	float: right;}
	
/* End Various Tags & Classes ********************************************************************
***************************************************************************************************/