html { 
height: 100%;
margin: 0;
padding: 0;
overflow-y: scroll;
}

body {
margin: 0;
padding: 0;
height: 100%;
}

h1,h2,h3,h4 {

font-family: 'Droid Sans', Helvetica;

}

h1{

font-size: 28px;

}

h2{

font-size: 22px;

}

a:link {

text-decoration: none;
color: #147287;

}

a:visited {

text-decoration: none;
color: #147287;

}

a:hover {

text-decoration: none;
color: #9bd1dc;

}

#container {

margin-left:auto;
margin-right:auto;
width: 100%;
padding: 0;
min-height: 100%;
height:auto !important;
height:100%;
margin-bottom: -211px;
}

#hdwrapper {
margin-left:auto;
margin-right:auto;
width: 100%;
float: left;
background: url(hd.png);
}

#wrapper {

margin-left:auto;
margin-right:auto;
width: 1000px;

}

#main {

float: left;
width: 940px;
height: 280px;
background-color: white;
margin-top: 20px;
margin-left: 10px;
padding: 10px 20px 20px 20px;
font-family: Arial;
font-size: 16px;
}

#blogi_main {

float: left;
width: 650px;
margin-left: 10px;
padding-left: 20px;
padding-right: 10px;
font-family: Arial;
font-size: 16px;
word-wrap: break-word;
margin-bottom: 40px;
}

#blogi_main h2{


}

#gal_main {

float: left;
width: 700px;
margin-top: 40px;
margin-left: 80px;
margin-bottom: -30px;
padding-left: 40px;
padding-right: 40px;
font-family: Arial;
font-size: 16px;
height: 100px;

}

#main_haku {

float: left;
width: 500px;
margin-top: 40px;
margin-left: 40px;
margin-bottom: -30px;
padding-left: 40px;
padding-right: 40px;
font-family: Arial;
font-size: 16px;
min-height: 100px;

}

#hakusivu {

width: 300px;
padding: 10px;
font-family: Arial;
font-size: 16px;
float: right;
margin-top: 40px;

}

#main_haku img{


padding: 5px;
border: solid 1px #EFEFEF;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;


}


#main_haku  img:hover {

border: solid 1px #CCC;
-moz-box-shadow: 1px 1px 5px #999;
-webkit-box-shadow: 1px 1px 5px #999;
box-shadow: 1px 1px 5px #999;

}

.kcon {

float: left;
width: 800px;
margin-left: 10px;
padding-left: 40px;
padding-right: 40px;
font-family: Arial;
font-size: 16px;

}

.kcon h1 {

font-size: 25px;
text-align: center;

}

.teksti {

float: left;
width: 350px;
text-align: center;
height: 250px;
margin-left: 40px;
margin-bottom: 30px;
}

.teksti h3 {

margin-bottom: 5px;

}

.teksti img {

padding: 5px;
border: solid 1px #EFEFEF;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;

}
.teksti a:hover img{

border: solid 1px #CCC;
-moz-box-shadow: 1px 1px 5px #999;
-webkit-box-shadow: 1px 1px 5px #999;
box-shadow: 1px 1px 5px #999;

}

.sekalaiset {

text-align: center;
float: left;
width: 800px;
margin-left: 10px;
padding-left: 40px;
padding-right: 40px;
margin-top: 10px;

}

.sekalaiset p{

text-align: center;
float: left;
width: 600px;
margin-left: 100px;
font-family: Arial;
font-size: 14px;
margin-top: -10px;

}

.sekalaiset img {

display: block;
float: left;
margin-left: 60px;
margin-bottom: 30px;
font-family: Arial;
font-size: 16px;
padding: 5px;
border: solid 1px #EFEFEF;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;

}

.sekalaiset a:hover img{

	border: solid 1px #CCC;
	-moz-box-shadow: 1px 1px 5px #999;
	-webkit-box-shadow: 1px 1px 5px #999;
    box-shadow: 1px 1px 5px #999;
}

.gkuvat {

float:left;
list-style-type: none;
min-width: 400px;
max-width: 800px;
margin-left: auto;
margin-right: auto;
text-align: center;

}


.gkuvat li {

float: left;
margin: 5px;
width: 200px;
height: 220px;
text-align: center;
padding-left: 20px;
padding-right: 10px;
padding-top: 20px;
padding-bottom: 20px;
list-style-type: none;

}

.gkuvat li a{

font-size: 18px;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
}

.gkuvat li img {

padding: 5px;
border: solid 1px #EFEFEF;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;
margin-top: 5px;
text-align: center;
margin-left: auto;
margin-right: auto;
}


.gkuvat li a:hover img {

border: solid 1px #CCC;
-moz-box-shadow: 1px 1px 5px #999;
-webkit-box-shadow: 1px 1px 5px #999;
box-shadow: 1px 1px 5px #999;

}

#blogi_main img {

display: block;
padding: 5px;
border: solid 1px #EFEFEF;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;

}

#blogi_main a:hover img {

border: solid 1px #CCC;
-moz-box-shadow: 1px 1px 5px #999;
-webkit-box-shadow: 1px 1px 5px #999;
box-shadow: 1px 1px 5px #999;
}

.kuvb {

font-size: 10px;
color: gray;
text-align: center;
padding-left: 10px;
padding-right: 10px;

}

#ylapalkki {

float: left;
margin-top: 20px;
margin-bottom: 20px;
width: 100%;
font-family: Arial, Helvetica;
font-size: 16px;

}



#sivu {

width: 225px;
height: 520px;
float: right;
text-align: left;
margin-right: 50px;
border-left: 1px dashed gray;

}

#sivu form {

width: 100px;
border: none;

}

#sivu input { 

border: 1px solid gray;
width: 120px;
outline: none;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
} 



#sivu fieldset {

width: 190px;
border: 0;
height: 50px;
margin-left: 30px;
}

#sivu form .hakunappi {

outline:none;
height: 50px;
width: 50px;
border: none;
background: url(hakunappi.png) no-repeat 8px 0px;
float: right;

}

#sivu form .hakunappi:hover {

outline:none;
height: 50px;
width: 50px;
border: none;
background: url(hakunappih.png) no-repeat 8px 0px;

}

#hakusivu form {

width: 225px;
border: 0;

}

#hakusivu input { 

border: 1px solid gray;
width: 120px;
outline: none;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
} 


#hakusivu fieldset {

width: 225px;
border: 0;
height: 50px;
margin-left: 30px;
}

#hakusivu form .hakunappi {

outline:none;
height: 50px;
width: 50px;
border: none;
background: url(hakunappi.png) no-repeat 8px 15px;

}

#hakusivu form .hakunappi:hover {

outline:none;
height: 50px;
width: 50px;
border: none;
background: url(hakunappih.png) no-repeat 8px 15px;

}

.palkki {

padding-bottom: 25px;
top: 150px;
font-family: Arial, Helvetica;
font-size: 16px;
list-style-type: none;
text-align: left;

}

.palkki li {

margin-top: 10px;


}

.palkki li a {

-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;
color: #8c332f;
}

.palkki li a:hover {

color: #cf9187;

}

.kategoriat {
top: 300px;
text-align: left;
font-family: Arial, Helvetica;
font-size: 16px;
list-style-type: none;

}
.kategoriat li{

margin-top: 6px;
}

.kategoriat li a {

-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;


}

.kategoriat li a:hover{

color: #84a8c6;

}

.artikkelit .aika {

display: block;
font-weight: bold;
height: 30px;
width: 70px;
padding-top: 3px;
float: left;

}

.artikkelit .aikaetu {

font-size: 14px;

}

.artikkelit .suo {

font-size: 14px;
display: block;
height: 30px;
width: 110px;
padding-top: 3px;
float: left;
font-weight: bold;
}

.artikkelit .suo a {

font-weight: normal;
color: #5d7583;

}

.artikkelit .suo a:hover {

font-weight: normal;
color: #9bb7c8;

}

.artikkelit li {

margin-top: 5px;

}

.artikkelit {

margin-bottom: 40px;

}

.vasen2 { float: left; margin-bottom: 30px; margin-top: 30px;}
.oikea3 { float: right; margin-bottom: 30px; margin-top: 30px;}

.tagit {

float: left;
width: 100%;
font-size: 14px;
margin-bottom: 40px;
margin-top: 20px;

}

.tagit a {
display: inline-block;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;
color: white;
background-color: #6b6b6b;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
padding: 3px 6px 3px 6px;
margin-top: 4px;
}

.tagit a:hover {

color: #67c950;

}


.arkisto {

list-style-type: none;

}
.arkisto li {

font-family: Arial;
font-size: 16px;
margin-left: -40px;
padding-bottom: 5px;

}


.oikeal {

font-size: 12px;
margin-top: 20px;
margin-right: 350px;
float: right;
width: 300px;
text-align: right;
margin-bottom: -30px;
}

.vasenl {

font-size: 12px;
margin-top: 20px;
margin-left: 50px;
float: left;
width: 300px;
margin-bottom: -30px;

}
#left {

float: left;
width: 450px;
height: 267px;

}

#right {

float: left;
width: 450px;
height: 267px;

}

#il {

margin-left: 20px;
float: left;
width: 400px;
height: 267px;

}

#ir {

margin-left: 70px;
float: left;
width: 400px;
height: 267px;

}

#generaattori {

margin-left: 0px;
float: left;
width: 350px;
height: auto;
background-color: white;
margin-top: 20px;
margin-left: 10px;
padding: 10px 20px 20px 20px;
font-family: Arial;
font-size: 16px;

}

#generaattori form,fieldset{

border: 0;

}

#form fieldset {

border: 1px dashed gray;

}

input.button {
	width: auto;
	padding: 9px 15px;
	background: #617798;
	border: 0;
	font-size: 14px;
	color: #FFFFFF;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	float: right;
	margin-right: 100px;
	}
	
input:hover.button {

	background: #acbfdb;

	}
	
#puppu {

margin-left: 60px;
float: left;
width: 500px;
height: auto;

}

.nappulata {

margin-bottom: 10px;
float: left;
height: 20px;
width: 150px;

}

.nappulatb {

margin-bottom: 10px;
float: left;
height: 20px;
width: 150px;

}

#wait {

margin-left: 250px;
margin-top: 300px;

}


#message {

float: left;
width: 500px;
height: auto;
margin-top: 20px;
margin-left: 10px;
padding: 10px 20px 20px 20px;
font-family: Arial;
font-size: 16px;
}

.slideshow {

float: right;

}

.slideshow img {

padding: 5px;
border: solid 1px #EFEFEF;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;

}

.slideshow a:hover img {

	border: solid 1px #CCC;
	-moz-box-shadow: 1px 1px 5px #999;
	-webkit-box-shadow: 1px 1px 5px #999;
    box-shadow: 1px 1px 5px #999;
}

#main3 {

margin-left: 10px;
margin-bottom: 30px;
float: left;
width: 470px;
height: 267px;
background-color: white;
margin-top: 40px;
padding: 0px 20px 0px 20px;
}

#main4 {

margin-left: 40px;
margin-bottom: 30px;
float: left;
margin-top: 40px;

}

#ia {

margin-top: 20px;
margin-left: 50px;
float: left;
width: 400px;
height: 267px;
font-family: Arial;
font-size: 16px;
margin-bottom: 50px;
}

#ib {

margin-top: 20px;
margin-left: 70px;
float: left;
width: 400px;
height: 267px;
font-family: Arial;
font-size: 16px;
margin-bottom: 50px;
}


#header {
position: relative;
margin-left: auto;
margin-right: auto;
height: 80px;
width: 1000px;
}


#header img {

margin-top: 16px;
float: left;
margin-left: 20px;
}
#header .logo {

margin-top: 20px;
float: left;
width: 450px;
}
#header .logo a {
  margin-left: 10px;
  font-family: 'Droid Sans', serif;
  font-size: 36px;
  font-style: normal;
  text-shadow: 2px 2px 2px #000;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0em;
  word-spacing: 0em;
  color: white;
}
#header .logo a:hover {
  margin-left: 10px;
  font-family: 'Droid Sans', serif;
  font-size: 36px;
  font-style: bold;
  text-shadow: 0px 0px 2px #fff;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0em;
  word-spacing: 0em;
  color: white;
}
#header .logo span a {
  position: absolute;
  margin-top: 30px;
  margin-left: 10px;
  font-family: 'Droid Sans', serif;
  font-size: 10px;
  font-style: normal;
  text-shadow: none;
  text-decoration: none;
  text-transform: none;
  color: white;
}
#header .logo span a:hover {
  position: absolute;
  margin-top: 30px;
  margin-left: 10px;
  font-family: 'Droid Sans', serif;
  font-size: 10px;
  font-style: bold;
  text-shadow: none;
  text-decoration: none;
  text-transform: none;
  color: white;
}

#header .rss {

float: right;
width: 30px;
height: 30px;

}

#header .twitter {

float: right;
width: 22px;
height: 22px;
}

#header .fb {

float: right;
width: 22px;
height: 22px;

}

.rss {

margin-top: 10px;
height: 32px;
display: block;
background-image: url(rss.png);

}
.rss:hover {

height: 32px;
display: block;
background-image: url(rssh.png);

}
.twitter {

margin-top: 14px;
height: 22px;
display: block;
background-image: url(twitter.png);

}
.twitter:hover {

height: 32px;
display: block;
background-image: url(twitterh.png);

}
.fb {

margin-top: 14px;
height: 22px;
display: block;
background-image: url(fb.png);

}
.fb:hover {

height: 22px;
display: block;
background-image: url(fbh.png);

}
#nav {
float: right;
height: 40px;
margin-top: 30px;
margin-right: 80px;
}

ul#navi { 
  float: right; 
  margin: 0; 
  padding: 0;
}

ul#navi li { display: inline; }

ul#navi li a {
  text-decoration: none;  
  font-family: "Droid Sans", serif;
  font-size: 20px;
  font-style: normal;
  padding: 0px 15px 0px 0px;
  color: white;
}

.clearfooter {
height: 211px;
clear: both;
}

#footer {

position: relative;
width: 100%;
height: 210px;
background-color: #fbfbfb;
border-top: 1px dashed gray;
}

#footerkeskitys {
width: 1000px;
margin-left: auto;
margin-right: auto;
}

#footervasen {

float:left;
width: 350px;
margin-left: 30px;
height: 160px;

}

#footervasen ul {

list-style-type: none;
margin-left: -40px;

}

#footervasen .vkoma {

font-family: Arial;
font-size: 14px;

}

#footervasen .vkomb {

font-family: Arial;
font-size: 14px;

}

#footeroikea {

float:left;
width: 190px;
margin-left: 20px;
height: 160px;

}

#muu {

float:left;
width: 140px;
margin-left: 20px;
height: 160px;

}

.muuta {

list-style-type: none;
font-family: Arial;
font-size: 14px;
margin-left: -40px;

}

.muuta li {

margin-top: 5px;

}

.muutak {

list-style-type: none;
font-family: Arial;
font-size: 14px;
margin-left: -40px;

}

.muutak li {

margin-top: 4px;

}

.muutak li a{

font-size: 12px;

}

 
.artikkelit {

list-style-type: none;

}
.artikkelit li {

font-family: Arial;
font-size: 18px;
margin-left: -40px;
padding-bottom: 15px;

}

.artikkelit .aika {

font-family: Arial;
font-size: 14px;

}
footer {
text-align: right;
margin-right: 50px;
font-size: 10px;
font-family: Arial, Helvetica;
}

ul#navi a {
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;
}

ul#navi #a {color: #3883d7; }
ul#navi #b {color: #c95050; }
ul#navi #c  {color: #67c950; }
ul#navi #d  {color: #d2bc62; }

#ab a:hover {color: #3883d7; }
#bb a:hover {color: #c95050; }
#cb a:hover {color: #67c950; }
#db a:hover {color: #d2bc62; }

.admin {color: #c95050; }


#blogi_main input { 
	padding: 9px;
	border: solid 1px #E5E5E5;
	outline: 0;
	font: normal 13px/100% Verdana, Tahoma, sans-serif;
	width: 250px;
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	}
	
#blogi_main .komm { 

display: block;
font-size: 12px;
font-family: Arial;
margin-top: 5px;
margin-bottom: 5px;
color: gray;

}

#blogi_main textarea { 
	padding: 9px;
	border: solid 1px #E5E5E5;
	outline: 0;
	font: normal 13px/100% Verdana, Tahoma, sans-serif;
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	}

#blogi_main textarea { 
	width: 630px;
	max-width: 630px;
	height: 200px;
	line-height: 150%;
	font-family: Arial;
	font-size: 14px;
	}

#blogi_main input:hover, textarea:hover,
input:focus, textarea:focus { 
	border-color: #C9C9C9; 
	-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
	}

#blogi_main #form label { 
	margin-left: 10px; 
	color: black; 
	}

#blogi_main .submit input {
	width: auto;
	padding: 9px 15px;
	background: #617798;
	border: 0;
	font-size: 14px;
	color: #FFFFFF;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	float: right;
	margin-top: 20px;
	}
	
#blogi_main .submit input:hover {

	background: #acbfdb;

	}

#blogi_main .tarkistus {
float: left;
display: block;
margin-top: 10px;
width: 345px;
}

#blogi_main .check {
float: left;
display: block;
margin-top: 10px;
width: 130px;
}

#blogi_main #check {
float: left;
display: block;
width: 20px;
height: 20px;
margin-top: 10px;
}

#blogi_main #challenge {
float: left;
display: block;
width: 30px;
margin-right: 20px;
}

.pingit {

margin-top: 130px;
text-align: center;
margin-bottom: 50px;
}

.kommenttialue {

width: 650px;
float: left;
border-bottom: 1px dashed gray;

}

.kommenttiloota {

width: 630px;
float: left;
padding: 20px 10px 10px 10px;
border-top: 1px dashed gray;
}


.eikom {

text-align: center;
margin-bottom: 10px;
}

.tiedot a, .normi a {

color: #832121;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;

}
.tiedot a:hover, .normi a:hover {

color: #f69494;

}


.tiedotk {

height: 55px;
margin-bottom: 20px;
padding-bottom: 5px;
width: 650px;
float: left;

}

.tiedotk img {

float:left;
margin-right: 10px;

}

.tiedotk .kir {

float: left;
height: 55px;
padding-top: 20px;

}

.normikb {

float: right;
margin-top: -2px;
margin-right: -20px;
}

.normika {

margin-top: -2px;
float: right;
margin-right: 10px;

}

.suosittele {

display: block;
margin-top: 30px;
font-size: 14px;
width: 630px;

}

.social {

width: 650px;
float: left;
height: 60px;
border-bottom: 1px dashed gray;
margin-bottom: 10px;

}


.social a img {

float: left;
margin-right: 20px;
display: block;

}

.social span {

float: left;
margin-right: 45px;
margin-top: 15px;
font-size: 13px;
font-weight: bold;

}

.kommentit {

margin-left: -40px;
list-style-type: none;

}

#footerkeski{

float:left;
width: 190px;
margin-left: 20px;
height: 160px;

}

#footeroikea h3 {color: #245782;}
#footervasen h3 {color: #823424;}
#footerkeski h3 {color: #578224;}
#muu h3 {color: #827c24;}

.virhe {

color: red;

}

#pilvi {

float: left;
width: 600px;
padding: 40px;


}
.FlattrButton {

margin-left: 40px;
margin-bottom: 10px;

}

div.vaihto {
width:640px; 
height:30px; 
float:left;
margin-bottom: 30px;
}
div.vaihto a  {
padding-top: 10px;
border: solid 1px #CCC;
-webkit-transition: 0.2s ease-in;
-moz-transition: 0.2s ease-in;
-o-transition: 0.2s ease-in;
width:645px; 
height:30px; 
display:block;
font-family: 'Droid Sans', Helvetica;
font-weight: bold;
text-align:center;
}
div.vaihto a:link {
text-decoration:none;
}
div.vaihto a:hover {
text-decoration:none;
border: solid 1px #CCC;
-moz-box-shadow: 1px 1px 5px #999;
-webkit-box-shadow: 1px 1px 5px #999;
box-shadow: 1px 1px 5px #999;
}
