body {
 margin: 0;
 padding: 0;
 color: #333; 
 font-size:13px; 
 font-family:'Open Sans', Segoe UI, Tahoma,Helvetica,sans-serif;
 word-spacing: 2px;
 background-color: #ffffff; 
  /*background-image: url("http://www.toimistokalusteet.com/images/templates/maralux3_tiles/images/back.jpg");
  background-position: top center;
  background-repeat: no-repeat;
  background-attachment:fixed;*/  
}


h1, h2, h3 {
 margin: 0;
 font-family: 'Roboto Condensed', 'Open Sans', Segoe UI, Tahoma,Helvetica,sans-serif; 
 font-weight: normal;
 color: #333;
}

h1 { font-size: 22px; text-transform: uppercase}

h2 { font-size: 18px; text-transform: uppercase}

p, ul, ol, h3 {
 margin-top: 0;
 line-height: 150%;
 text-align: left;

}

a { color: #00a8c6; text-decoration: none; } 
a.sivuosa { color: #627686; text-decoration: none; }
a.lisaa { 
 float: right;
 padding: 0px 5px;
 position: relative;
 left: 0px;
 margin-top: 20px;
 margin-right: 0px;
 display: block;
 color: #999;
 text-decoration: none; 
 text-align: center;
 font-size:10px; }

a.lisaa:hover {text-decoration: none; color: #00a8c6;}
a:hover { text-decoration: none; color: #00a8c6;}

hr { 
 border:1px solid #D4D8CB; 
 width: 98%;
}

#topback {
 width: 100%; 
 background: #fff; 
 height: 670px; 
 position: absolute; 
 top: 70px;
}

#ylaosa {
 width: 100%; max-width: 960px;
 margin:auto; 
 position: absolute;
 left: 0; right: 0;
}

#leftside {
 width: 30%;
 max-width: 220px;
 /*position: absolute;
 top: 40px;
 border-right: 0px solid #ebebeb;
 margin: 80px auto 0px auto;*/
 margin-top: 70px;
 float: left;
}

#mainscreen {
 margin-top: 70px;
 margin-left: 1%;
 width: 75%;
 max-width: 720px;
 height: 550px;
 background: #ffffff; /*#65c34d;*/
 float: left;
}

#mainscreentitle {
 width: 100%;
 height: 550px;
 margin: auto;
 position: absolute;
 left: 0; right: 0; top: 0px;
 background: #252525;
 opacity: 0.3;
}

#mainscreen h1 {
 width: 100%;
 text-align: center;
 color: #fff;
 font-size: 42px;
 overflow: hidden;
 z-index: 30;
 margin: auto;
 position: absolute;
 left: 0; right: 0; top: 70px;
}

#mainscreenlist {
 width: 100%;
 text-align: center;
 font-size: 14px;
 color: #ffffff;
 font-transform: capitalize;
 position: absolute;
 top: 130px; left: 0; right: 0;
 z-index: 91;
}


#mainscreentitle h2 {
 width: 100%;
 text-align: center;
 color: #fff;
 font-size: 42px;
 overflow: hidden;
 /*margin: auto;
 position: absolute;
 left: 0; right: 0; top: 150px;
 text-shadow: 1px 1px #ebebeb;*/
}

#scrolldown {
 width: 103px;
 margin: auto;
 position: absolute;
 left: 0; right: 0; top: 230px;
}

@media screen and (max-width: 490px) {
  #leftside {top: 110px;}
}

#logo { 
 padding: 0px 0px;
 text-align: center;
 background-color: #ffffff;
 width: auto;
 float: left;
}

#logo img{
 width: auto;
 height: 60px;
}

#ylayhteys {
 float: right;
 margin-right: 15px;
 margin-top: 5px;
 font-size: 12px;
 color: #252525;
}

#block {
 margin-top: 0px;
 padding: 0px;
 text-align: left;
 background-color: #00a8c6; /*#5eb545;*/
 padding: 7px 10px 13px 10px;
 overflow: hidden;
 height: 530px;

}

#block ul {
 list-style-type: none;
 padding: 0px;
 font-size: 15px;
 text-transform: capitalize;
}

#block a {color: #fff;}
#block ul {font-size: 11px;}
#block h2 {font-size: 14px; color: #fff;}

@media screen and (max-width: 730px) {
  #block ul {font-size: 11px;}
  #block h2 {font-size: 12px;}
}

#block li {
  display: block;
  line-height: 190%;
}

#sivuntaustapohja {
 width: 100%;
 margin: auto;
 position: absolute;
 left: 0; right: 0; top: 650px;
 background: #fff; /*#00a8c6;*/
}

#sentteri {
 width: 100%;
 max-width: 960px;
 margin: 0 auto;
 clear: both;
}

#content {
 width: 100%;
 margin: 20px auto 60px auto;
 float: left;
 position: relative;
 left: 0%;

}

@media screen and (max-width: 490px) {
  #content {margin-top: 100px;}
}

.item {
 display: block;
 width: 429px;
 margin: 0px 20px 30px 0px;
 padding: 0px 20px 10px 10px;
 background-color:#ffffff;
 overflow:hidden;
 float: left;
 /*border-radius:8px;	
 -moz-border-radius:8px;	
 -webkit-border-radius:8px;*/
 border-right: 1px solid #ebebeb;
 border-bottom: 1px solid #ebebeb;
 /*border: 0px solid #ebebeb;*/
 -webkit-transition: left .4s ease-in-out, top .4s ease-in-out .4s;
 -moz-transition: left .4s ease-in-out, top .4s ease-in-out .4s;
 -ms-transition: left .4s ease-in-out, top .4s ease-in-out .4s;
 -o-transition: left .4s ease-in-out, top .4s ease-in-out .4s;
 transition: left .4s ease-in-out, top .4s ease-in-out .4s;
}

.item img {
 width: 25%;
 height: auto;
 margin-left: 10px;
 margin-bottom: 10px;
 float: right;
}

.item iframe {
 max-width: 100%;   
}

.item ul {
 padding-left: 15px;
 list-style-type: square;
}

.post {
 border: 0px solid #7E7564;
}

.post .news {
 margin-bottom: 0px;
}

.post .meta {
 font-size: 11px;
 color: #999;
}

.post h1.otsikko {
 letter-spacing: 0.4px;
 line-height: 120%;
 font-weight: 400; 
 text-transform: uppercase;
 margin-bottom: 15px;
}

.post .otsikko a {
 text-decoration: none;
 text-transform: capitalize;
}

.post .otsikko:hover {
 color: #627686;
}

.post .entry {
 margin-bottom: 4px;
 padding: 3px 0px 0px 0px;
 font-size: 12px;
 color: #555;
 line-height: 140%;
 text-align: left;
}

.post .entry h3{ 
 font-family: 'Open Sans', Segoe UI, Tahoma,Helvetica,sans-serif;
 font-size: 11px;
 color: #444;
 line-height: 140%;
 word-spacing: 2px;
}

#luelisaaosa {
 clear: both;
 width: 100%;
 overflow: hidden;
}

.seur {
 width: 79px;
 height: 100px;
 color: #222;
 padding: 5px;
 margin-left: 15px;
}

.seur a {
 color: #222;
}

.seur img {
 width: 79px;
 height: 53px;
 margin-bottom: 85px;
}

#alkuun {
  width: 79px;
  height: 53px;
  position: fixed;
  bottom: 25px;
  right: 20px;
  z-index:201;
}

#alkuun img{
  width: 79px;
  height: 53px;
}


/* MENU */
#topalue {
 width: 100%;
 height: 65px;
 background-color: #ffffff;
 overflow: hidden;
 position: fixed;
 z-index:90;
 border-bottom: 0px solid #efefef;
}

#menutausta {
  width: 100%;
  max-width: 960px;   
  margin: auto;
  overflow:hidden;
  position: fixed;
  left: 0; right: 0;
}

#navigation {font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; width: 100%; position: absolute; bottom: 0px;}

#navigation ul { 
 list-style-type: none; 
 text-align: right;
 letter-spacing:1px;
 font-weight: 400; 
 padding: 0px;
 margin: 5px 15px 5px 0px;
}

#navigation li {
 display: inline-block;
 margin-left: 25px;
} 

#navigation a {
 color: #252525; /*#5ab342; */
 text-decoration:none;
 font-size: 14px;
}

@media screen and (max-width: 960px) {
  #navigation a {font-size: 11px;}
}

@media screen and (max-width: 730px) {
  #navigation a {font-size: 9px;}
  #navigation li {margin-right: 10px;
    }
}

@media screen and (max-width: 490px) {
  #navigation a {font-size: 9px;}
  #navigation li { width: 100%; margin-right: 3px;}
  #navigation ul {margin: 5px 0px 5px 0px;}
}

#navigation a:hover{
  color: #00a8c6; 
}

#navigation a.current {
  color: #00a8c6;
}


.gallery { list-style: none; padding: 0; margin: 0; }
.gallery:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
.gallery li { float: left; width: 20%; max-height: 250px; overflow: hidden;}
@media screen and (max-width: 1600px) { 
  .gallery li { float: left; width: 20%; max-height: 180px; overflow: hidden;}
}
@media screen and (max-width: 1140px) { 
  .gallery li { float: left; width: 20%; max-height: 140px; overflow: hidden;}
}
@media screen and (max-width: 900px) { 
  .gallery li { float: left; width: 20%; max-height: 100px; overflow: hidden;}
}

.gallery li a { display: block; margin: 5px; border: 0px solid #3c3c3c; }
.gallery li img { display: block; width: 100%; height: auto; }

#thumbcell {
  width: 32%; margin-right: 1%; margin-bottom: 0px; float: left; overflow: hidden; margin-bottom: 10px;
}

#thumbcell_kuva {
width: 100%; height: 150px; overflow: hidden;
}

#thumbcell_kuva img {width: 100%;}

#thumbcell_teksti {
width: 100%;  padding-top: 3px; height: 80px; line-height: 110%; font-size: 12px;
}
/*
@media screen and (max-width: 1400px) { 
  #thumbcell {
  width: 32%; margin-right: 1%; margin-bottom: 0px; float: left; overflow: hidden; margin-bottom: 10px;
  }
  #thumbcell_kuva {
  width: 100%; height: 150px; overflow: hidden;
  }
}
*/
@media screen and (max-width: 900px) { 
  #thumbcell {
  width: 48%; margin-right: 2%; margin-bottom: 0px; float: left; overflow: hidden; margin-bottom: 10px;
}
}

@media screen and (max-width: 640px) { 
  #thumbcell {
  width: 100%; margin-bottom: 10px; overflow: hidden;
  }
  #thumbcell_kuva {
  width: 100%; height: auto; max-height: 170px; overflow: hidden; 
  }
  #thumbcell_teksti {
  width: 100%;  padding-top: 3px; height: 60px; line-height: 110%; font-size: 12px;
  }
}

.gallerythumb {width: 100%; }

#yhteyslomake {
  width: 100%;
  margin: 10px 0px 10px 0px;
  padding: 0px 0px 5px 0px;
  font-family: 'verdana', sans-serif;
  font-size: 10px;
  background: #ffffff; /*#f05b29; */
  z-index:60;
}

#yhteyslomake h3{
  padding: 10px 0px 0px 15px;
}

#yhteyslomake input[type=text]
{
width:95%;
display:block;
font-family: 'verdana', sans-serif;
font-size: 10px;
padding: 10px;
border: 0px;
background-color: #efefef;
margin: 7px auto;
}

#yhteyslomake input[type=email]
{
width:95%;
display:block;
font-family: 'verdana', sans-serif;
font-size: 10px;
padding: 10px;
border: 0px;
margin: 7px auto;
background-color: #efefef;
}

#yhteyslomake select
{
width:95%;
display:block;
font-family: 'verdana', sans-serif;
font-size: 10px;
padding: 10px;
border: 0px;
background-color: #efefef;
margin: 7px auto;
}

#yhteyslomake input[type=submit]
{
width:99%;
display:block;
margin: 7px auto 7px auto;
background: #8fbe00; 
color: #efefef;
font-family: 'Roboto Condensed', sans-serif;
font-size: 21px;
font-weight: bold;
padding: 10px;
cursor: pointer;
border: 0px;
}

#yhteyslomake textarea
{
width:95%;
display:block;
margin: 7px auto;
font-family: 'verdana', sans-serif;
font-size: 10px;
padding: 10px;
border: 0px;
background-color: #efefef;
}

#footer {
 width: 100%;
 padding: 15px;
 background: #8fbe00;
 position: fixed;
 bottom: 0;
 z-index: 80;
 text-align: center;
 color: #fff;
 font-size: 18px;
 font-weight: bold;
 border-top: 5px solid #fff;
}

#maskotti {
 width: 200px;
 position: fixed;
 left: 7%;
 bottom: 40px;
 z-index: 81;
}

#maskotti img {
 width: 200px;
}

@media screen and (max-width: 1279px) {
 #maskotti {
  visibility: hidden;
 }
}

@media screen and (max-width: 1599px) {
 #maskotti {
  left: 0%;
 }
 #maskotti img {
  width: 180px;
 }
}