body {
  background: url(../img/90669.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
    height: 100%;
	font-family: 'Work Sans', sans-serif;
font-weight: 400;
	color: #222;
	line-height: 1.75em;
	text-align: left;
	cursor: default;
	font-size: 1em;
}

iframe { width: 100%; max-width: 900px; }
img { width: 100%; }

#wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

hr {
   padding: 0;
   margin: 75px 0;
   border: none;
   border-top: 2px solid #ccc;
}



.logo { max-width: 250px; padding: 10px 25px; }


.content2020 {
    background:#fff;
}

@media all and (min-width: 640px) { .content2020 {
    max-width:1200px;
    margin: 100px auto 200px auto;
    background:#fff;
      border-radius: 25px;
      -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25); } }


#header {
    padding: 25px 25px 0 25px;
}

.content {
	padding: 50px 15px;
}


@media all and (min-width: 640px) { .content {
    	padding: 100px; } }



#site-count {
	text-align: center;
	text-transform: uppercase;
	font-size: 0.8em;
	letter-spacing: 0.1em;
}

#site-count p { font-size: 3em; margin-bottom: -20px; }

#footer {
	padding: 25px 0;
	background: #f5f5f5;
	text-align: center;
	text-transform: uppercase;
	font-size: 0.9em;
      border-radius: 0 0 25px 25px;
}



.clear { clear: both; }

input[type="radio"] { display:none; }
label {
  text-align:right;
  color:#555;
  margin: 0 0.5%;
  padding-bottom:30px;
  cursor:pointer;
  text-transform:uppercase;
  font-size: 0.8em;
  letter-spacing: 0.03em;
}

input[type="radio"][id="fantasia"]:checked + label { color: #f2777a; }
input[type="radio"][id="fantasia"]:checked ~ .elaimet,
input[type="radio"][id="fantasia"]:checked ~ .historia,
input[type="radio"][id="fantasia"]:checked ~ .nykyaika,
input[type="radio"][id="fantasia"]:checked ~ .tulevaisuus,
input[type="radio"][id="fantasia"]:checked ~ .muut {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="elaimet"]:checked + label { color: #f2777a; }
input[type="radio"][id="elaimet"]:checked ~ .fantasia,
input[type="radio"][id="elaimet"]:checked ~ .historia,
input[type="radio"][id="elaimet"]:checked ~ .nykyaika,
input[type="radio"][id="elaimet"]:checked ~ .tulevaisuus,
input[type="radio"][id="elaimet"]:checked ~ .muut {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="historia"]:checked + label { color: #f2777a; }
input[type="radio"][id="historia"]:checked ~ .fantasia,
input[type="radio"][id="historia"]:checked ~ .elaimet,
input[type="radio"][id="historia"]:checked ~ .nykyaika,
input[type="radio"][id="historia"]:checked ~ .tulevaisuus,
input[type="radio"][id="historia"]:checked ~ .muut {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="nykyaika"]:checked + label { color: #f2777a; }
input[type="radio"][id="nykyaika"]:checked ~ .fantasia,
input[type="radio"][id="nykyaika"]:checked ~ .elaimet,
input[type="radio"][id="nykyaika"]:checked ~ .historia,
input[type="radio"][id="nykyaika"]:checked ~ .tulevaisuus,
input[type="radio"][id="nykyaika"]:checked ~ .muut {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="tulevaisuus"]:checked + label { color: #f2777a; }
input[type="radio"][id="tulevaisuus"]:checked ~ .fantasia,
input[type="radio"][id="tulevaisuus"]:checked ~ .elaimet,
input[type="radio"][id="tulevaisuus"]:checked ~ .historia,
input[type="radio"][id="tulevaisuus"]:checked ~ .nykyaika,
input[type="radio"][id="tulevaisuus"]:checked ~ .muut {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="muut"]:checked + label { color: #f2777a; }
input[type="radio"][id="muut"]:checked ~ .fantasia,
input[type="radio"][id="muut"]:checked ~ .elaimet,
input[type="radio"][id="muut"]:checked ~ .historia,
input[type="radio"][id="muut"]:checked ~ .nykyaika,
input[type="radio"][id="muut"]:checked ~ .tulevaisuus {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="tallit"]:checked + label { color: #f2777a; }
input[type="radio"][id="tallit"]:checked ~ .kennelit,
input[type="radio"][id="tallit"]:checked ~ .fantasia2 {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="kennelit"]:checked + label { color: #f2777a; }
input[type="radio"][id="kennelit"]:checked ~ .tallit,
input[type="radio"][id="kennelit"]:checked ~ .fantasia2 {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

input[type="radio"][id="fantasia2"]:checked + label { color: #f2777a; }
input[type="radio"][id="fantasia2"]:checked ~ .tallit,
input[type="radio"][id="fantasia2"]:checked ~ .kennelit {
  width:0;
  height:0;
  padding:0;
  margin:0;
  opacity:0;
}

.tile {
  width:100%;
  float:left;
  transition:all 1s;
   margin: -10px 0 !important;
}






A:link, A:visited, A:active {
   color: #fe6469;
   text-decoration: none;
   -webkit-transition: 0.3s ease-in-out;
   -moz-transition: 0.3s ease-in-out;
   -o-transition: 0.3s ease-in-out;
   transition: 0.3s ease-in-out;
font-weight: bold;
border-bottom: 1px solid #ddd;
padding-bottom: 2px;
}

A:hover { color: #4657e5; border-bottom: 1px solid #4657e5; }

A:link.footerlink, A:visited.footerlink, A:active.footerlink {
   color: #fff;
   text-decoration: none;
}

A:hover.footerlink {
   color: #4657e5;
}



A:link.button, A:visited.button, A:active.button {
   color: #fe6469;
   text-decoration: none;
   padding: 15px 25px;
   font-weight: 700;
   font-size: 0.9em;
   letter-spacing: 0.2em;
   border: 2px solid #fe6469;
   text-transform: uppercase;
}

A:hover.button {
   color: #fff;
   background: #fe6469;
   border: 2px solid #fe6469;
}

A:link.button2, A:visited.button2, A:active.button2 {
   color: #fe6469;
   text-decoration: none;
   padding: 10px 13px;
   font-weight: 700;
   font-size: 0.75em;
   letter-spacing: 0.2em;
   border: 2px solid #fe6469;
   text-transform: uppercase;
}

A:hover.button2 {
   color: #c44ad3;
   border: 2px solid #c44ad3;
}


h1 { font-size: 3em; color: #222; margin: 0 0 25px 0; line-height: 1.5em; }
h2 { font-size: 2em; color: #222; line-height: 1.2em; margin: 0 0 10px 0; }
h3 { font-size: 1.25em; color: #555; !important; }
h4 { font-size: 0.7em; color: #555; }

h1, h2, h3, h4 { font-family: 'Abril Fatface', serif; font-weight:400; text-align: left; word-wrap: break-word; line-height: 1.2em; letter-spacing: 0.03em; }



.category {
text-align: center;
background: limegreen;
color: #fff;
font-weight: bold;
padding: 50px 0;
margin: 0 10px 20px 10px !important;
font-size: 1.5em;
line-height: 2em;
}

.divider {
	width: 100px;
	height: 2px;
	background: #dadada;
}


.tilastolohko {
   padding: 10px 0;
   background: #f1f1f1;
   text-align: center;
}

.pudotus-otsikko a, .pudotus-otsikko { color: #666 !important; cursor: pointer; }

.pudotus {
margin-top: 25px;
background: #f1f1f1;
padding: 25px;
text-align: left;
}

.fas, .fab, .far { margin-right: 5px; }

.pudotus p { padding: 0; }

.pudotus a { font-weight: 400; }

.pudotus h1 { color: #666; font-size: 1.5em; }

.column {
   padding: 25px !important;
   margin: 25px 0 !important;
text-align: left;
background: #fff0ee;
}

@media all and (min-width: 600px) { .column { padding: 50px !important; } }

.column h1 { font-size: 1.5em; font-weight: 300 !important; letter-spacing: 0 !important; font-family: 'Work Sans', sans-serif; }
.column h2 { font-size: 0.9em; line-height:1.5em; color: #777;  font-weight: 300; text-align: left; margin: 10px 0 0 0 !important; letter-spacing: 0; font-family: 'Work Sans', sans-serif;  }

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

.col {
	display: block;
	float:left;
	margin: 0 0 0 2.6%;
}
.col:first-child { margin-left: 0; }

.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

.span_1_of_2 { width: 49.2%; }
.span_3_of_4 { width: 74.6%; }
.span_2_of_4 { width: 48.2%; }
.span_1_of_4 { width: 22%; }
.span_2_of_3 { width: 65%; }
.span_1_of_3 { width: 32.26%; }
.span_3_of_5 { width: 59.36%; }
.span_2_of_5 { width: 39.04%; }
.span_1_of_5 { width: 18.72%; }
.span_5_of_6 { width: 68.56%; }
.span_4_of_6 { width: 66.13%; }
.span_3_of_6 { width: 49.2%; }
.span_2_of_6 { width: 32.26%; }
.span_1_of_6 { width: 14%; }

@media only screen and (max-width: 480px) {
	.col {  margin: 10px 0; }
	.span_1_of_2, .span_1_of_4, .span_2_of_4, .span_3_of_4, .span_1_of_3, .span_2_of_3, .span_2_of_5, .span_1_of_5, .span_4_of_6, .span_2_of_6, .span_1_of_6 { width: 100%; }
}

.pohja {
	background: #f9f9f9;
	padding: 20px 20px 0 20px;
	margin-top: 25px;
}

.pohja h1 { font-size: 1.5em; font-weight: 400; }
.pohja h2 { font-size: 0.8em; font-weight: 300; }

.pohja img {
	-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,0.25);
	-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,0.25);
	box-shadow: 0 0 5px 0 rgba(0,0,0,0.25);
}