﻿/*CSS 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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	
	border-spacing: 0;
	border:2px solid black;
	border-collapse:collapse;
	text-align:center;
}
th {
	font-size:20px;
	border:1px solid black;
	padding:5px 50px 5px 50px;
	border-collapse:collapse;
	}


td {
	font-size:15px;
	border:1px solid black;
	border-collapse:collapse;
}
html,body {
	margin:0;
	padding:0;
	background:#edece6;
	height:100%;
	font-family: 'Ubuntu', sans-serif;
	background-image:url('tausta_pieni.jpg');
	z-index:50;
}
h1 {
	line-height:150%;
	margin-top:0px;
	margin-bottom:0px;
	color:#181818;
	font-weight:bold;
	font-size:15px;
	text-shadow: 0px 1px 1px #d3d3d3;
	text-transform:lowercase;
	font-variant:small-caps;
}
h1:first-letter {
	text-transform:uppercase;
}
h2 {
	line-height:150%;
	margin-top:0px;
	margin-bottom:0px;
	color:#181818;
	font-weight:normal;
	font-size:14px;
	text-shadow: 0px 1px 1px #d3d3d3;
	text-transform:lowercase;
	font-variant:small-caps;
}
h2:first-letter {
	text-transform:uppercase;
}
p {
	line-height:140%;
	margin-top:1px;
	margin-bottom:5px;
	color:#606060;
	word-spacing:1px;
	font-size:14px;
}
b {
	font-weight:bold;
}
a#main {
	color:#575757;
	font-size:42px;
	padding:11px 50px 2px 25px;
	text-shadow: 0px 0px 2px #cccccc;
}
a#main:hover {
	text-shadow: 0px 0px 3px #b0b0b0;
}
a:link {
	color:#575757;
	text-decoration:none;
	-moz-transition:0.5s;
	-webkit-transition:0.5s;
	-o-transition:0.5s;
	transition:0.5s;
}
a:visited {
	color:#575757;
	text-decoration:none;
}
a:active {
	color:#575757;
	text-decoration:none;
}
a.link {
	color:#575757;
	padding:5px 5px 11px 5px;
	border-bottom:2px solid transparent;
	
}
a.link:hover {
	color:#373737;
	padding:5px 5px 11px 5px;
	border-bottom:2px solid #b5b5b5;
	text-shadow: 0px 1px 1px #cccccc;
}

a.content0close {
	border:2px solid #d3d3d3;
	margin:-22px -12px 0 0;
	float:right;
	padding:2px 5px 2px 5px;
	position:relative;
	background: #f7f7f7;
	color: #777777;
	text-align: center;
	display : block;
}
a.content0close:hover {
	
	color: #575757;
}
div#container {
	position:relative;
	width:900px;
	min-width:900px;
	height:auto !important;
	height:100%;
	min-height:100%;
	background:#fcfcfc;
	margin:auto auto auto 200px;
	border-right:2px solid #d3d3d3;
	border-left:2px solid #d3d3d3;
	box-shadow:0px 0px 2px #d3d3d3;
	webkit-box-shadow:0px 0px 2px #d3d3d3;
	moz-box-shadow:0px 0px 2px #d3d3d3;
}
div#header {
	position:relative;
	width:940px;
	height:200px;
	margin-left:-20px;
	padding:0px 0px 0px 0px;
	border-bottom:2px solid #d3d3d3;
	border-right:2px solid #d3d3d3;
	border-left:2px solid #d3d3d3;
	box-shadow:0px -2px 2px #d3d3d3;
	webkit-box-shadow:0px -2px 2px #d3d3d3;
	moz-box-shadow:0px -2px 2px #d3d3d3;
	background-image:url('tekym_otsake_minijack940.jpg');
	z-index: 75;
}
div#content0 {
	-moz-transition:0.5s;
	-webkit-transition:0.5s;
	-o-transition:0.5s;
	transition:0.5s;
	float:right;
	position:relative;
	box-shadow:1px -1px 2px #d3d3d3;
	webkit-box-shadow:1px -1px 2px #d3d3d3;
	moz-box-shadow:1px -1px 2px #d3d3d3;
	border:2px solid #d3d3d3;
	padding:20px 10px 10px 30px;
	width:220px;
	min-height:150px;
	margin:-2000px -264px 0 0;
	background: #fcfcfc;
	color: #575757;
	z-index: -1;
	overflow:hidden;
	opacity:0.8;
	-moz-opacity:.80;
	-ms-filter:”alpha(opacity=80)”;
	filter:alpha(opacity=80);
}
	div#content0 p {
		display:inline;
	}
div#content0:target {
	margin:-2px -264px 0 0;
	z-index:65;
}
div#content1 {
	position:relative;
	padding:20px;
	background:#f7f7f7;
	z-index: 90;
}
div#content1:hover {
	padding:20px 20px 19px 20px;
	border-bottom:1px dashed #d3d3d3;
}
div#content1:target {
	background:#f7f7f7;
	border-bottom:2px solid #d3d3d3;
	padding:20px 16px 18px 20px;
	border-right:4px solid #777777;
}
div#content2 {
	padding:20px;
	background:#fcfcfc;
	position:relative;
	z-index: 90;
}
div#content2:hover {
	padding:19px 20px 19px 20px;
	border-top:1px dashed #d3d3d3;
	border-bottom:1px dashed #d3d3d3;
}
div#content2:target {
	background:#fcfcfc;
	padding:18px 16px 18px 20px;
	border-top:2px solid #d3d3d3;
	border-bottom:2px solid #d3d3d3;
	border-right:4px solid #777777;
}
div#content3 {
	padding:20px;
	background:#f7f7f7;
	position:relative;
	z-index: 90;
}
div#content3:hover {
	padding:19px 20px 19px 20px;
	border-top:1px dashed #d3d3d3;
	border-bottom:1px dashed #d3d3d3;
}
div#content3:target {
	background:#f7f7f7;
	border-right:4px solid #777777;
	padding:18px 16px 18px 20px;
	border-top:2px solid #d3d3d3;
	border-bottom:2px solid #d3d3d3;
}
div#content4 {
	padding:20px;
	background:#fcfcfc;
	position:relative;
	z-index: 90;
}
div#content4:hover {
	padding:19px 20px 19px 20px;
	border-top:1px dashed #d3d3d3;
	border-bottom:1px dashed #d3d3d3;
}
div#content4:target {
	background:#fcfcfc;
	border-right:4px solid #777777;
	padding:18px 16px 18px 20px;
	border-top:2px solid #d3d3d3;
	border-bottom:2px solid #d3d3d3;
}
div#content5 {
	padding:20px 20px 20px 20px;
	background:#f7f7f7;
	position:relative;
	z-index: 90;
}
div#content5:hover {
	padding:19px 20px 19px 20px;
	border-top:1px dashed #d3d3d3;
	border-bottom:1px dashed #d3d3d3;
}
div#content5:target {
	background:#f7f7f7;
	border-right:4px solid #777777;
	padding:18px 16px 18px 20px;
	border-top:2px solid #d3d3d3;
	border-bottom:2px solid #d3d3d3;
}

div#contenty {
	position:relative;
	padding:20px;
	background:#f7f7f7;
	z-index: 90;
}
div#contenty:hover {
	padding:20px 20px 19px 20px;
	border-bottom:1px dashed #d3d3d3;
}
div#contenty:target {
	background:#f7f7f7;
	border-bottom:2px solid #d3d3d3;
	padding:20px 16px 18px 20px;
	border-right:4px solid #777777;
}

div#contentlast {
	padding-bottom:30px;
}
div#referenssitv {
	position:relative;
	float:left;
	width:400px;
	height:350px;
	padding:20px;
	background:#f7f7f7;
	z-index: 90;
}
div#referenssitv:hover {
	padding:20px 20px 19px 20px;
	border-bottom:1px dashed #d3d3d3;
}
div#referenssitv:target {
	background:#f7f7f7;
	border-bottom:2px solid #d3d3d3;
	padding:20px 16px 18px 20px;
	border-right:4px solid #777777;
}
div#referenssito {
	position:relative;
	float:right;
	width:500px;
	height:350px;
	margin-left:-200px;
	padding:20px;
	background:#f7f7f7;
	z-index: 0;
}
div#cargotec {
	float:right;
}
div#referenssito:hover {
	padding:20px 20px 19px 20px;
	margin-left:-300px;
	border-bottom:1px dashed #d3d3d3;
}
div#referenssito:target {
	background:#f7f7f7;
	margin-left:-300px;
	border-bottom:2px solid #d3d3d3;
	padding:20px 16px 18px 20px;
	border-right:4px solid #777777;
}
div#footer {
	position:absolute;
	width:100%;
	padding:5px 20px 5px 20px;
	margin-left:-20px;
	bottom:0;
	height:20px;
	border-top:2px solid #d3d3d3;
	border-right:2px solid #d3d3d3;
	border-left:2px solid #d3d3d3;
	box-shadow:0px 0px 2px #d3d3d3;
	webkit-box-shadow:0px 0px 2px #d3d3d3;
	moz-box-shadow:0px 0px 2px #d3d3d3;
	text-align: center;
	background:#ffffff;
	z-index: 95;
}
div#floater {
	position:fixed;
	width:100%;
	z-index:100;
	background:#ffffff;
	text-align:center;
	height:20px;
	border:2px;
	bottom:0;
	padding:5px 20px 5px 20px;
}
div#contentposter {
	float:left;
	position:relative;
	box-shadow:1px -1px 2px #d3d3d3;
	webkit-box-shadow:1px -1px 2px #d3d3d3;
	moz-box-shadow:1px -1px 2px #d3d3d3;
	border:2px solid #d3d3d3;
	padding:20px 10px 10px 30px;
	width:300px;
	min-height:500px;
	margin:-150px 0 0 1150px;
	background: #fcfcfc;
	color: #575757;
	z-index: 60;
	overflow:hidden;
	-moz-opacity:.80;
	-ms-filter:”alpha(opacity=80)”;
	filter:alpha(opacity=80);
}
div#linkbar {
	background: #a1a1a1;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	
}
div#twitter {
	float:right;
}
div#uutiset2 {
	float:left;
	width:550px
}
div#uutiset {
	position:relative;
	height:530px;
	padding:20px;
	background:#f7f7f7;
	z-index: 90;
}
div#uutiset:hover {
	padding:20px 20px 19px 20px;
	border-bottom:1px dashed #d3d3d3;
}
div#uutiset:target {
	background:#f7f7f7;
	border-bottom:2px solid #d3d3d3;
	padding:20px 16px 18px 20px;
	border-right:4px solid #777777;
}
div#ref {
	float:right;
}
/*Listan ominaisuus*/
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
/*Listan ominaisuus loppu */
a.link1 {
 margin-bottom: 0px;
 width: 180px;
 height:32px;
 display:block;
 background:transparent url('Nappulat/nappula_uutiset_.png') center top no-repeat;
}

a.link1:hover {
   background-image: url('Nappulat/nappula_uutiset_active.png');
}

a.link2 {
 margin-bottom: 0px;
 width: 180px;
 height:32px;
 display:block;
 background:transparent url('Nappulat/nappula_palvelut.png') center top no-repeat;
}

a.link2:hover {
   background-image: url('Nappulat/nappula_palvelut_active.png');
}
a.link3 {
 margin-bottom: 0px;
 width: 180px;
 height:32px;
 display:block;
 background:transparent url('Nappulat/nappula_referenssit.png') center top no-repeat;

}

a.link3:hover {
   background-image: url('Nappulat/nappula_referenssit_active.png');
}

a.link4 {
 margin-bottom: 0px;
 width: 180px;
 height:32px;
 display:block;
 background:transparent url('Nappulat/nappula_info.png') center top no-repeat;

}

a.link4:hover {
   background-image: url('Nappulat/nappula_info_active.png');
}

a.link5 {
 margin-bottom: 0px;
 width: 180px;
 height:32px;
 display:block;
 background:transparent url('Nappulat/nappula_yhteystiedot.png') center top no-repeat;

}

a.link5:hover {
   background-image: url('Nappulat/nappula_yhteystiedot_active.png');
}
a.linkup {
	display:block;
	height:20px;
	width:25px;
	background-color:#a1a1a1;
}
	
a.linkemail {
	-moz-transform: rotate(-45deg);

	-webkit-transform: rotate(-45deg);

	-o-transform: rotate(-45deg);

	-ms-transform: rotate(-45deg);

	transform: rotate(-45deg);

	box-shadow:0px 0px 2px #cccccc;

	webkit-box-shadow:0px 0px 2px #cccccc;

	moz-box-shadow:0px 0px 2px #cccccc;

	border:1px solid #b5b5b5;

	margin:30px 0px 0px 20px;

	padding: 5px 8px 5px 50px;

	float:right;

	background: #575757;

	color: #d3d3d3;

	text-align: right;

	z-index: 80;

	position:absolute;
}

a.linkemail:hover {

	margin:10px 0px 0px 40px;

	box-shadow:0px 0px 4px #dddddd;

	webkit-box-shadow:0px 0px 4px #dddddd;

	moz-box-shadow:0px 0px 4px #dddddd;

}