body {
background-color: #D3D5D8;
color: #444444;
font-family: Tahoma, Arial, Helvetica, sans-serif;
-webkit-font-smoothing: antialiased;
font-size: 14px;
padding: 0px;
margin: 0px;
}

form {
padding: 0px;
margin: 0px;
}

br {
line-height: 16px;
}

p {
line-height: 14px;
}

img {
border-style: solid;
border-width: 0px;
}

a,
a:visited {
text-decoration: none;
color: #444444;
}

a:active,
a:hover {
text-decoration: none;
color: #444444;
}

#sisallysluettelo {
width: 880px;
margin: 71px auto 0 auto;
padding: 0 0 71px 0;
}

#sisallysluettelo h1 {
font-size: 100%;
font-weight: normal;
}

#sisallysluettelo .esikatselu {
width: 400px;
height: 250px;
margin: 10px;
float: left;
border: 10px solid #FFFFFF;
overflow: hidden;
position: relative;
text-align: center;
-webkit-box-shadow: 1px 1px 2px #E6E6E6;
-moz-box-shadow: 1px 1px 2px #E6E6E6;
box-shadow: 1px 1px 2px #e6e6e6;
cursor: default;
background: #FFFFFF;
}

#sisallysluettelo .esikatselu a {
cursor: default !important;
}

#sisallysluettelo .esikatselu .esikatselu-kehys {
width: 400px;
height: 250px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}

#sisallysluettelo .esikatselu img {
display: block;
position: relative;
}

#sisallysluettelo .esikatselu h1 {
text-transform: uppercase;
color: #FFFFFF;
font-size: 16px;
text-align: center;
position: relative;
padding: 10px;
background: rgba(0, 0, 0, 0.8);
margin: 20px 0 0 0;
}

#sisallysluettelo .esikatselu p {
font-style: italic;
font-size: 13px;
position: relative;
color: #FFFFFF;
padding: 10px 20px 20px;
text-align: center;
}

#sisallysluettelo .esikatselu span {
display: inline-block;
text-decoration: none;
padding: 7px 14px;
background: #343535;
color: #FFFFFF;
text-transform: lowercase;
-webkit-box-shadow: 0 0 1px #000000;
-moz-box-shadow: 0 0 1px #000000;
box-shadow: 0 0 1px #000000;
cursor: pointer;
}

#sisallysluettelo .esikatselu span:hover {
-webkit-box-shadow: 0 0 5px #000000;
-moz-box-shadow: 0 0 5px #000000;
box-shadow: 0 0 5px #000000;
cursor: pointer;
}

#sisallysluettelo .tiedot img {
-webkit-transform: scaleY(1);
-moz-transform: scaleY(1);
-o-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
-ms-transition: all 0.7s ease-in-out;
transition: all 0.7s ease-in-out;
}

#sisallysluettelo .tiedot .esikatselu-kehys {
background-color: rgba(255, 231, 179, 0.3);
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
}

#sisallysluettelo .tiedot h1 {
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
background: transparent;
margin: 20px 40px 0px 40px;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-o-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
color: #333333;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
}

#sisallysluettelo .tiedot p {
color: #333;
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-o-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
}

#sisallysluettelo .tiedot span {
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-o-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
}

#sisallysluettelo .tiedot:hover img {
-webkit-transform: scale(10);
-moz-transform: scale(10);
-o-transform: scale(10);
-ms-transform: scale(10);
transform: scale(10);
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
}

#sisallysluettelo .tiedot:hover .esikatselu-kehys {
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}

#sisallysluettelo .tiedot:hover h1,
#sisallysluettelo .tiedot:hover p,
#sisallysluettelo .tiedot:hover span {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}