body {
    background: #bcf5ff url('img/valotausta.jpg') no-repeat 50% 0%;
    margin: 0;
    padding: 0;
	font-family: "Tahoma", "Dejavu Sans", sans-serif;
}

a, :link { 
	text-decoration: none; 
	font-weight: bold; 
}

:link {color: #3491a8;}
:visited {color: #58585a;}
:link:hover, :visited:hover {color: #000; text-decoration: underline;}
:link:active, :link:active {color: #cdf5ff;}

dl {margin: 0 0 0 .8em;}
dl dt {margin: 0 0 .5em 0;}
dl dd+dt {margin-top: 1.5em;}
dl dd {margin: 0 0 1em 2em;}

fieldset { padding: .5em; border: 1px solid #888; margin-bottom: 1em; }

input, textarea {
margin:0.2em;
padding:0.1em;
}

ul { list-style-type: square; list-style-color: #02ccff;}

p {
	margin-top: 0;
}

p.ingress {
    font-weight: bold;
    color: #3491a8;
    line-height: 1.8em;
}

#mainone p {
    line-height: 1.4em;
}

img {
    border: none;
}

img.right {
    float: right;
}

img.left {
    float: left;
    margin-right: 1em;
}

div, blockquote p {
    margin: 0;
    padding: 0;
}

blockquote {
	background: #02ccff url('img/quote.png') no-repeat 0.7em 0.7em;
	text-indent: 1em;
	color: #fff;
	padding: 1em;
	font-weight: bold;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px; /* Vain CSS3-standardissa */
}


h2 {
    background: transparent url('img/otsikkomerkki.jpg') no-repeat 0 3px;
    height: 17px;
    font-size: 1.3em;
    /* tarvitaanko? width: 140px; */
	margin: 1.4em 0 0.8em;
	font-weight: normal;
	padding: 0 0 0 12px;
	color: #58585a;
	letter-spacing: 0.15ex;
	text-transform: uppercase;
}
h3 {

	margin: 1.6em 0 0.5em;
	font-weight: normal;
	padding: 0;
	color: #58585a;
	letter-spacing: 0.15ex;
	text-transform: uppercase;
	clear: left;
}

h4, dt {
    font-size: 115%;
    font-weight: normal;
	color: #58585a;
	text-transform: uppercase;
	letter-spacing: 0.1ex;
}

th {
    text-align: left;
}
/*
* Elementtien asettelua ja layoutia
*/
#container {
    width: 1000px;
    margin: 0 auto;
}

#preheader {
	height: 104px;
	position: relative;
}

#preheader h1, #preheader p, #palkki h3, #lataa-tai-tilaa span, #footer h2 {
    display: none;
}

#preheader img {
	position: absolute;
	top: 17px;
	left: 32px;
}

#infonavi {
	position: absolute;
	bottom: 16px;
	right: 6px;
}

#infonavi form, #infonavi p, #infonavi input, #googlehaku {
	display: inline;
	margin: 0;
	padding: 0;
}

#infonavi a {
	margin-right: 0.5em;
	color: #58585a;
	font-size: 0.7em;
	font-weight: bold;
	text-transform: uppercase;
}

#hakupainike {
    position: relative; 
    left: 3px; 
    top: 6px;
}

#header {
    background: transparent url('img/header.jpg') no-repeat 50% 0%;
    height: 265px;
	position: relative;
}
/*** IE6 Fix ***/
* html #header{
	height: 264px;
}

#navi {
	position: absolute;
	bottom: 0px;
	right: 165px;
}

#navi li {
	list-style: none;
    float: left;
	text-align: center;
	width: 134px; /* CSS2-standardin mukaan pakko olla */
}

#navi a {
	display: block;
	width: 132px;
	height: 32px;
    background: transparent url('img/navibutton-unactive.png') no-repeat 0% 0%;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
}
#navi a:hover, #navi .current a {
    background-image: url('img/navibutton-active.png');
	color: #58585a;
	text-decoration: none;
}

#navi a span {
	position: relative;
	top: 10px;
}

#postheader {
	height: 155px;
	position: relative;
}

#palkki {
    position: absolute;
    top: 29px;
    left: 0px;
    background: transparent url('img/palkki.jpg') no-repeat 0% 0%;
    height: 105px;
	width: 700px;
	padding-left: 60px;
}
#palkki a {
    margin-left: 30px;
}
#palkki :link:hover {
	border-bottom: 1px solid #02ccff;
}

#lataa-tai-tilaa {
    position: absolute;
    top: 29px;
    right: 0px;
}
#lataa-tai-tilaa span {
    display: none;
}

#contents {
    background: #fff url('img/bg-contents-top.jpg') no-repeat 0% 0%;
	position: relative;
	display: block;
	clear: both;
	padding: 1px 250px 1px 30px;
	min-height: 440px;
}

#mainone {
    width: 350px;
}

#maintwo {
    width: 350px;
	position: absolute;
	top: 1px;
	left: 400px;
}

#side {
    width: 200px;
	position: absolute;
	top: 1px;
	right: 0px;
}
/* line-height: 1.8em; ei toimi IE6:ssa */
#side img {
	margin: 6px 6px 0px 0px;
}

h3.uutisotsikko {
	font-size: 1em;
    font-weight: bold;
	letter-spacing: normal;
	text-transform: none;
    color: #02ccff;
	margin: 0;
	padding: 0;
}
table.uutistaulukko {
    position: relative;
    top: -2em;
}
.uutistaulukko ul {
	margin: 1em;
	padding: 0;
}
#maintwo p {
	margin-top: 0px;
}

#footer {
    background: transparent url('img/bg-bottom.jpg') no-repeat 50% 0%;
    height: 160px;
	padding: 70px 30px 0px;
	font-size: small;
    clear: both;
}

#partners, #partners img {
	/* width: 100-290px; CSS2-standardin mukaan levys pitäisi olla, mutta en jaksa laittaa jokaiselle elementille sitä erikseen ja yleisimmät selaimet toimii silti oikein */
	float: left;
	margin-right: 15px;
}

#links {
	float: right;
	/* width: 450px;  CSS2-standardin mukaan pakko olla */
	border-left: 1px solid #57cbf5;
}

#links, #links a {
	font-weight: normal; 
    	color: #57cbf5;
}

#links ul {
	/* width: 100-150px; CSS2-standardin mukaan levys pitäisi olla, mutta en jaksa laittaa jokaiselle elementille sitä erikseen ja yleisimmät selaimet toimii silti oikein */
	float: left;
	list-style: none;
	margin: 0;
	padding-left: 24px;
}

#postfooter {
    text-align: center;
    color: #58585a;
    margin-bottom: 1em;
}
#postfooter a {
    color: #58585a;
}


/*
* sivukohtaisia juttuja
*/
table .alt {
background: #e9e9e9;
}

th {
vertical-align: top;
margin:0.2em;
padding:0.1em;
}

form .info { /* vaadi käyttäjltä mitään, näytetään ohjeissa ja virhetilanteissa */
margin-left: 10px;
}

form .error { /* vaadi käyttäjltä mitään, näytetään ohjeissa ja virhetilanteissa */
margin-left: 10px;
color: red;
}

.warning {
    font-weight: bold; 
    padding: 1em;
    border: 1px dotted red;
    color: red;
}

.notice {
    font-weight: bold; 
    padding: 1em;
    border: 1px solid #58585a;
    background-color: #0cf;
    color: #fff;
}

p.lataa, p.selaa {
height: 80px;
background: #fff url('img/cdrom.jpg') no-repeat;
margin: 20px auto;
padding: 20px 0 0 90px;
}

p.linkkilista {
	margin-left: 0.8em;
	line-height: 26px;
}

p.linkkilista img {
	margin-right: 6px;
}

/*
* OHJELMAT
*/
#ohjelmataulukko h4, #opastaulukko h4 {
    margin: 0;
    padding: 0;
    color: #02ccff;
}
#ohjelmataulukko img, #opastaulukko img {
    margin: 1em;
}
#ohjelmaesittely h2 {
    margin: 0.5em 0;
}
#ohjelmaesittely blockquote {
	background: #fff;
	text-indent: 0em;
	color: #000;
	padding: 0em;
	font-weight: normal;
}
#kuvankaappaukset {
    margin: 2em 0 1em 80px;
}
#ohjelmaotsikkokuvake {
    float: left;
    margin-right: 1em;
    z-index: 99;
}
#asennusikoni {
    float: right;
    margin-right: 100px;
    z-index: 99;
}

#vaihtoehtokentta, #lahdekoodianalyysi {
    position: relative;
    clear: right;
    top: 42px;
    float: right;
    width: 20em;
    font-style: italic;
    background: #02ccff no-repeat 0.7em 0.7em;
	color: #fff;
	padding: 1em;
	font-weight: bold;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px; /* Vain CSS3-standardissa */
}

p.kuvitettu_linkki {
    line-height: 48px;
    clear: left;
}
p.kuvitettu_linkki img {
    float: left;
    margin-right: 6px;
}

