/*
	anikistit.net css
	lauri j
	v.1.6 17.9.2008
	v1.5 15.9.2008
	v1.0 22.4.2007
*/


/******************************
	LAYOUT BLOCKS & GENERAL
******************************/

* {
	padding: 0;
	margin: 0;
}

html, body {
	height: 100%;
}

body {
	font-size: 62.5%;
	min-width: 970px;
	background: #101010;
	color: #535049;
	text-align: center;
}

#preloader {
	position: absolute;
	top: -1000px;
	height: 100px;
	width: 100px;
	overflow: hidden;
}

#wrapper {
	position: relative;
	width: 970px;
	margin: 0 auto 0 auto;
	min-height: 100%;
	background-color: #101010;
	text-align: left;
	/*url(../fauxcolumns.png) repeat-y 50% 0;*/
}

#content {
	text-align: left;
	position: relative;
	min-width: 970px;
}

/* ie6 hack */
* html #content {
	height: 100%;
}

#associates {
	position: relative;
	width: 270px;
	float: left;
}

#sitewide {
	position: relative;
	width: 270px;
	float: left;
}

#sitewide div.news {
	margin: 0 0 20px 0;
}

#sitewide div.links {
	margin: 0 0 20px 0;
}

#personal {
	position: relative;
	width: 640px;
	margin: 0 0 0 40px;
	float: left;
}

#footer {
	clear: both;
	padding: 0;
	margin: 30px 0 0 310px;
	text-align: left;
	height: 50px;
}

#footer p {
	padding: 25px 0 20px 0;
	font-family: "Arial", "Helvetica", sans-serif;
	font-weight: normal;
	font-size: 1.0em;
	line-height: 1.05em;
	text-transform: uppercase;
	color: #5c5b59;
}

#personal img, #sitewide img, #associates img {
	border: none;
}

#sitewide a, #associates a, #personal a  { color: #8c2a2a; text-decoration: none; }
#sitewide a:hover, #associates a:hover, #personal a:hover  { color: #e5d0d0; text-decoration: underline; }
#sitewide a:visited , #associates a:visited, #personal a:visited { color: #8c2a2a; }


/******************************
	MAIN NAVIGATION
******************************/

#navigation {
	width: 680px;
	height: 320px;
	margin: 0 0 0 290px;
	background-image: url(../kuvat/nav.jpg);
	position: relative;
}

#navigation li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	position: absolute;
}

#navigation a {
	display: block;
	/*border: solid 1px #f00;*/
}


#navigation a:hover {
	background: transparent url(../kuvat/nav.jpg);
	background-repeat: no-repeat;
}

#nav_antti { left: 194px; top: 100px; width: 60px; height: 60px; }
#nav_chrzu { left: 224px; top: 46px; width: 60px; height: 60px; }
#nav_lauri { left: 280px; top: 15px; width: 60px; height: 60px; }
#nav_lotta { left: 340px; top: 15px; width: 60px; height: 60px; }
#nav_niina { left: 396px; top: 46px; width: 60px; height: 60px; }
#nav_reetta { left: 426px; top: 100px; width: 60px; height: 60px; }
#nav_samppa { left: 426px; top: 165px; width: 60px; height: 60px; }
#nav_sara { left: 396px; top: 218px; width: 60px; height: 60px; }
#nav_simo { left: 340px; top: 248px; width: 60px; height: 60px; }
#nav_taru { left: 280px; top: 248px; width: 60px; height: 60px; }
#nav_tommi { left: 224px; top: 218px; width: 60px; height: 60px; }
#nav_home { left: 310px; top: 126px; width: 60px; height: 60px; }

#nav_antti a, #nav_chrzu a, #nav_lauri a, #nav_lotta a, #nav_niina a, #nav_reetta a, #nav_samppa a,
#nav_sara a, #nav_simo a, #nav_taru a, #nav_tommi a {
	display: block;
	padding: 60px 0 0 0;
	overflow: hidden;
	height: 0px !important;
	height /**/:60px;
}

#nav_home a {
	display: block;
	padding: 60px 0 0 0;
	overflow: hidden;
	height: 0px !important;
	height /**/:60px;
}

#nav_antti a:hover  { background-position: -194px -420px; }
#nav_chrzu a:hover  { background-position: -224px -686px; }
#nav_lauri a:hover  { background-position: -280px -335px; }
#nav_lotta a:hover  { background-position: -340px -655px; }
#nav_niina a:hover  { background-position: -396px -366px; }
#nav_reetta a:hover  { background-position: -426px -740px; }
#nav_samppa a:hover  { background-position: -426px -485px; }
#nav_sara a:hover  { background-position: -396px -858px; }
#nav_simo a:hover  { background-position: -340px -568px; }
#nav_taru a:hover  { background-position: -280px -888px; }
#nav_tommi a:hover  { background-position: -224px -538px; }
#nav_home a:hover  { background-position: -310px -446px; }


/******************************
	SITEWIDE
******************************/

#sitewide h2 {
	padding: 50px 0 0 0;
	margin: 55px 0 25px 0;
	overflow: hidden;
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:50px;
}

#sitewide p, #sitewide h3, #associates h3, #sitewide ul {
	margin-left: 1px;
	font-family: "Trebuchet MS", sans-serif;
	font-weight: normal;
	font-size: 1.2em;
	line-height: 1.25em;
	color: #d3d0c9;
}

#sitewide p {
	text-align: left;
	color: #92908b;
}

#sitewide h3 {
	font-family: "Arial", "Helvetica", sans-serif;
	font-weight: bold;
	margin-bottom: 10px;
	text-transform: uppercase;
}

#associates h3 {
	font-family: "Arial", "Helvetica", sans-serif;
	font-weight: bold;
	margin-top: 20px;
	margin-bottom: 10px;
	text-transform: uppercase;
}

#sitewide .signature {
	margin-top: 10px;
	font-size: 1.2em;
	line-height: 1.0em;
	text-transform: uppercase;
}

#sitewide ul {
	line-height: 1.2em;
	color: #92908b;
	list-style: none;
}

#sitewide li {
	margin-bottom: 5px;
}


/******************************
	PERSONAL
******************************/

#personal h2 {
	padding: 21px 0 0 0;
	margin: 83px 0 27px 0;
	overflow: hidden;
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/:21px;
}

#personal p, #personal h3, #personal h4, #personal ul, #personal address {
	font-family: "Trebuchet MS", sans-serif;
	font-weight: normal;
	font-size: 1.4em;
	line-height: 1.6em;
	text-align: left;
	/*word-spacing: 0.1em;*/
	color: #d3d0c9;
}

#personal p {
	margin: 0 0 12px 0;
	color: #92908b;
}

#personal p.caption {
	margin: 10px 0 20px 0;
	font-weight: bold;
	font-size: 1.2em;
	line-height: 1.15em;
}

#personal ul {
	margin: 0 0 20px 0;
	color: #92908b;
	list-style: none;
}

#personal h3 {
	font-family: "Arial", "Helvetica", sans-serif;
	font-weight: bolder;
	margin: 40px 0 10px 0;
	text-transform: uppercase;
}

#personal h4 {
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 1.2em;
	font-weight: normal;
	margin: 25px 0 5px 0;
	text-transform: uppercase;
}

#personal address {
	margin: 0 0 20px 0;
	font-style: normal;
	font-weight: normal;
	color: #92908b;
}

#personal img.solo {
	margin: 0 0 0 0;
}

#personal img.thumbnail {
	float: left;
	border: none;
	margin: 0 8px 8px 0;
}

#personal div.gallery {
	margin: 20px 0 0 0;
	min-height: 360px;
	clear: both;
}

#personal em {
	font-style: normal;
	font-weight: bold;
}


/******************************
	IMAGE REPLACEMENTS
******************************/

#h_news { background-image: url(../kuvat/icon_news.png); }
#h_links { background-image: url(../kuvat/icon_links.png); }

#h_manifesto { background-image: url(../kuvat/h_manifesto.png); }
#h_yhteystiedot { background-image: url(../kuvat/h_yhteystiedot.png); }
#h_cv { background-image: url(../kuvat/h_cv.png); }
#h_portfolio { background-image: url(../kuvat/h_portfolio.png); }
#h_animaatiot { background-image: url(../kuvat/h_animaatiot.png); }
#h_poimintoja{ background-image: url(../kuvat/h_poimintoja.png); }
#h_hep { background-image: url(../kuvat/h_hep.png); }

#h_antti_laakso { background-image: url(../kuvat/h_antti_laakso.png); }
#h_chrzu { background-image: url(../kuvat/h_chrzu.png); }
#h_lauri_jarvenpaa { background-image: url(../kuvat/h_lauri_jarvenpaa.png); }
#h_lotta_rapeli { background-image: url(../kuvat/h_lotta_rapeli.png); }
#h_niina_suominen { background-image: url(../kuvat/h_niina_suominen.png); }
#h_reetta_neittaanmaki { background-image: url(../kuvat/h_reetta_neittaanmaki.png); }
#h_samppa_kukkonen { background-image: url(../kuvat/h_samppa_kukkonen.png); }
#h_sara_wahl { background-image: url(../kuvat/h_sara_wahl.png); }
#h_simo_ruotsalainen { background-image: url(../kuvat/h_simo_ruotsalainen.png); }
#h_taru_varpumaa { background-image: url(../kuvat/h_taru_varpumaa.png); }
#h_tommi_juutilainen { background-image: url(../kuvat/h_tommi_juutilainen.png); }