html {
height:100%;
}

body {  
margin:0;
padding:0;
height:100%;
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(right, #2A3F4D 0%, #5D8AA8 50%, #2A3F4D 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(right, #2A3F4D 0%, #5D8AA8 50%, #2A3F4D 100%);

/* Opera */ 
background-image: -o-linear-gradient(right, #2A3F4D 0%, #5D8AA8 50%, #2A3F4D 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #2A3F4D), color-stop(0.5, #5D8AA8), color-stop(1, #2A3F4D));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(right, #2A3F4D 0%, #5D8AA8 50%, #2A3F4D 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to left, #2A3F4D 0%, #5D8AA8 50%, #2A3F4D 100%);
/* IE FILUUN TÄMÄ background:#5D8AA8; */
font-family:calibri, arial;
}

h1 {
color:#485A62;
font-size:50px;
text-align:center;
}

.subtitle {
	margin: -1.2em auto 2em auto;
}

.subtitle span {    
    display: block;
    text-align: center;
    font-size: 2em;
    font-weight: 700;
    color: #485A62;
}

h2 {color:#485A62;}

h3 {
color:#485A62;
font-size:24px;
}

h4 {
color:#485A62;
font-size:22px;
}

img {
margin:10px;
float:right;
width:40%;
}

.kehys {
	position:relative;
 /* needed for footer positioning*/
	margin:0 auto;
 /* center, not in IE5 */
	height:auto !important;
 /* real browsers */
	height:100%;
 /* IE6: treaded as min-height*/
	min-height:100%;
 /* real browsers */
background:white;
box-sizing:border-box;
-moz-box-sizing:border-box; /*FF*/
width:1038px;
padding-top:0.1px;
padding-bottom:80px;
box-shadow:0px 0px 10px 0.1px black;
min-height:96vh;
}

.kuvanauha {
height:300px;
background:#485A62;
text-decoration:center;
display:flex;
}

.kuvanauha > div {
	position:relative;
	padding:22px 0;
}

.kuvanauha img {
margin:auto;
width:auto;
}

.kuvateksti {
	opacity:0;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:calc(100% - 40px);
	background:#2A3F4D;
	margin:22px auto;
	transition:opacity 0.5s;
}

.kuvanauha > div:hover .kuvateksti {
	opacity:0.9;
}

.nav {
width:100%;
overflow:hidden;
color:white;
font-size:20px;
background:#536872;
border-bottom:12px double #485A62;
border-top:12px double #485A62;
}

.nav ul {      
clear:left;
float:left;
text-align:center;    
margin:0;
padding:0; 
list-style:none;
display:inline;
position:relative;
left:50%;
}

.nav li {
margin:0;
padding:0;
float:left;
display:block;
position:relative;
right:50%;
}

.nav ul li a {
text-align:center;
text-decoration:none;
color:white;
display:block;
padding:1em 0.5em;
}

.nav a:hover {
background:#485A62;
}

.yht {
background:#485A62;
color:white;
border:1px;
float:right;
padding:8px;
margin:40px 60px 20px 26px;
border-radius:5px;
}

.sert img {
width:500px;
}

.leip {
font-size:20px;
margin:40px 7% 0% 7%; 
padding-bottom:4em;
}

.ala {
  border-top:12px double #485A62;
  color:white;
  text-align:center;
	position:absolute;
	width:100%;
	bottom:0px;
 /* stick to bottom */
	background:#536872;
	padding-bottom:2em;
}

/* slideshow'ta */

.rslides1 {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides1 li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides1 li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides1 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

.rslides2 {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides2 li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides2 li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides2 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

.rslides3 {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides3 li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides3 li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides3 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

.ala > a.tilaajavastuu {
	display:block;
	margin:auto;
	height:4em;
}

.ala > a.tilaajavastuu > img {
	max-height:100%;
	width:auto;
	float:none;
}
