@charset "utf-8";
/* CSS Document - Raholan siirtolapuutarha*/

@font-face {
    font-family: 'deliusregular';
    src: url('fonts/delius-regular-webfont.eot');
    src: url('fonts/delius-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/delius-regular-webfont.woff') format('woff'),
         url('fonts/delius-regular-webfont.ttf') format('truetype'),
         url('fonts/delius-regular-webfont.svg#deliusregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'eb_garamond_12_all_scallsc';
    src: url('fonts/ebgaramond12-allsc-webfont.eot');
    src: url('fonts/ebgaramond12-allsc-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ebgaramond12-allsc-webfont.woff') format('woff'),
         url('fonts/ebgaramond12-allsc-webfont.ttf') format('truetype'),
         url('fonts/ebgaramond12-allsc-webfont.svg#eb_garamond_12_all_scallsc') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'mathilderegular';
    src: url('fonts/mathilde-webfont.eot');
    src: url('fonts/mathilde-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/mathilde-webfont.woff') format('woff'),
         url('fonts/mathilde-webfont.ttf') format('truetype'),
         url('fonts/mathilde-webfont.svg#mathilderegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body{
margin: 0;
}

footer{
height: 75px;
width: 960px;
margin: auto;
margin-top: 20px;
position: relative;
text-align: center;
}

/* sisältää muut paitsi footerin */
#sitoja{
width: 960px;
height: 720px;
margin: auto;
margin-top: 25px;
text-align: center;
position: relative;	
}

/* leipäteksti alue */
#content1{
font-family: "eb_garamond_12_all_scallsc" , "Sans-serif";
color: #000;
width: 670px; 
height: 650px;
margin: auto;
float: left;
position: relative;
background: rgba(255,255,255,0.7);
border: 4px solid #fff;
border-radius:10px;
overflow: auto;
}

/* sivu teksti alue */
#content2{
width: 270px; 
height: 650px;
margin: auto;
float: right;
position: relative;
text-align: center;
background: rgba(231,184,10,0.7);
border: 4px solid #fff;
border-radius:10px;
overflow: auto;  

font-family: "deliusregular", "Sans-serif";
color: #000;
}


/* sivujen kuvat */
.kuva{
width: 600px;
height: auto;
border: 5px solid white;
border-radius: 2px;	
}

#galleria{
font-family: "eb_garamond_12_all_scallsc" , "Sans-serif";
width: 940px;
height: 650px;
margin: auto;
float: right;
position: relative;
text-align: center;
background: rgba(231,184,10,0.7);
border: 4px solid #fff;
border-radius:10px;
overflow: auto;    
}

h2{
font-size: 32px;
color: #000; 
margin-bottom: 10px;
}

p span, span {
text-align: left;
display: block;
font-size: 20px;
margin-left: 50px;
color: #000; 
}

.info{
display: block;
font-size: 14px;
margin-left: 55px;
margin-bottom: 8px;
color: #000;  
}

.sivu{
margin-left: 25px;
margin-bottom: 25px;
width: 220px;
}

.sivuots{
margin-left: 25px;
font-weight: bold;
}

.sivusauna p{
  font-size: 14px;
  width: 220px;
}

p {
margin-top: 10px;
font-size: 20px;
}

#footertxt{
font-family: "deliusregular", "Sans-serif";
color: #000;
float: left;
font-size: 14px;
width: 750px;
margin-left: 55px;
}

#facelink{
float: right;
}

.otsikko, .otsikkohal{
font-size: 24px;
margin-top: 25px;
margin-bottom: 25px;
font-weight: bolder;
margin-left: 15px;    
}

.otsikkoiso, .otsikkohaliso{
font-size: 26px;
margin-top: 25px;
margin-bottom: 25px;
font-weight: bolder;    
}

.otsikkohaliso, .otsikkohal{
text-align: left;
margin-left: 25px;  
}

.jasen, .lomake{
margin-bottom: 15px;
margin-left: 60px;
width: 550px;
text-align: left;
border-bottom: 1px dotted black;    
}

.urgent{
width: 245px;
margin-bottom: 15px;
font-size: 24px;
float: left;
color: red;  
}

.jasen{
font-size: 16px;
}

.lomake{
width: 350px;
font-size: 24px;
float: left;
}

.vali{
float: right;
display: inline;
margin-left: 55px;
font-size: 16px;
}

.lomake:link, .linkki:link{
text-decoration:none;
color: #000;
font-weight: bolder;
}    /* unvisited link */

.lomake:visited, .linkki:visited{
text-decoration:none;
color: #FF855C;
font-weight: bolder;
} /* visited link */

.lomake:hover{
text-decoration:none;
text-shadow: 6px 6px 6px rgba(255,255,255,0.8);
}   /* mouse over link */

.linkki:hover{
text-decoration:none;
text-shadow: 6px 6px 6px rgba(255,255,255,0.8);
-webkit-transform: scale(1,1.5); /* Chrome, Safari, Opera */
-ms-transform: scale(1,1.5); /* IE 9 */
-moz-transform: scale(1,1.5);
transform: scale(1,1.5);
}   /* mouse over link */


/* navigaatio alkaa */

.Navi{
/* Navigaation Ul elementti */
width: 940px;
height: 50px;
margin: auto;

position: relative;
overflow: hidden;
display: inline-block;
margin-top: 10px;
}

.Navi li{
/* Nappien liukuvärien määrittäminen: */
background-color: #f0f0f0;
background-image: -webkit-gradient(linear,left top, left bottom,from(#e7b80a), color-stop(0.5,#FF855C), color-stop(0.92, #e7b80a));
background-image: -moz-linear-gradient(#e7b80a 0%, #FF855C 50%, #e7b80a 92%);
background-image: -o-linear-gradient(#e7b80a 0%, #FF855C 50%, #e7b80a 92%);
background-image: -ms-linear-gradient(#e7b80a 0%, #FF855C 50%, #e7b80a 92%);
background-image: linear-gradient(#e7b80a 0%, #FF855C 50%, #e7b80a 92%);

border-right: 1px solid rgba(9, 9, 9, 0.125);


/* Nappien väliset varjostumat */
box-shadow: 1px -1px 0 rgba(255, 255, 255, 0.6) inset;
-moz-box-shadow: 1px -1px 0 rgba(255, 255, 255, 0.6) inset;
-webkit-box-shadow: 1px -1px 0 rgba(255, 255, 255, 0.6) inset;

position:relative;
height: 50px;
width: 120px;
text-align: center;
float: left;
list-style: none;
margin: 2px;
}

.Navi li:after{

/* Napin sisään elementti hoverin liukuväriä varten */	

content:'.';
text-indent:-9999px;
overflow:hidden;
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
z-index:1;
opacity:0;

/* Hoverin liukuvärit */

background-image:-webkit-gradient(linear, left top, right top, from(rgba(168,168,168,0.5)),color-stop(0.5,rgba(168,168,168,0)), to(rgba(168,168,168,0.5)));
background-image:-moz-linear-gradient(left, rgba(168,168,168,0.5), rgba(168,168,168,0) 50%, rgba(168,168,168,0.5));
background-image:-o-linear-gradient(left, rgba(168,168,168,0.5), rgba(168,168,168,0) 50%, rgba(168,168,168,0.5));
background-image:-ms-linear-gradient(left, rgba(168,168,168,0.5), rgba(168,168,168,0) 50%, rgba(168,168,168,0.5));
background-image:linear-gradient(left, rgba(168,168,168,0.5), rgba(168,168,168,0) 50%, rgba(168,168,168,0.5));

/* Creating borders with box-shadow. Useful, as they don't affect the size of the element. */

box-shadow:-1px 0 0 #a3a3a3,-2px 0 0 #fff,1px 0 0 #a3a3a3,2px 0 0 #fff;
-moz-box-shadow:-1px 0 0 #a3a3a3,-2px 0 0 #fff,1px 0 0 #a3a3a3,2px 0 0 #fff;
-webkit-box-shadow:-1px 0 0 #a3a3a3,-2px 0 0 #fff,1px 0 0 #a3a3a3,2px 0 0 #fff;

/* This will create a smooth transition for the opacity property */

-moz-transition:0.25s all;
-webkit-transition:0.25s all;
-o-transition:0.25s all;
transition:0.25s all;
}

/* Treating the first LI and li:after elements separately */

.Navi li:first-child{
border-radius: 4px 0 0 4px;
}

.Navi li:first-child:after,
.Navi li.selected:first-child:after{
box-shadow:1px 0 0 #a3a3a3,2px 0 0 #fff;
-moz-box-shadow:1px 0 0 #a3a3a3,2px 0 0 #fff;
-webkit-box-shadow:1px 0 0 #a3a3a3,2px 0 0 #fff;
border-radius:4px 0 0 4px;
}

.Navi li:last-child{
border-radius: 0 4px 4px 0;
}

/* Treating the last LI and li:after elements separately */

.Navi li:last-child:after,
.Navi li.selected:last-child:after{
box-shadow:-1px 0 0 #a3a3a3,-2px 0 0 #fff;
-moz-box-shadow:-1px 0 0 #a3a3a3,-2px 0 0 #fff;
-webkit-box-shadow:-1px 0 0 #a3a3a3,-2px 0 0 #fff;
border-radius:0 4px 4px 0;
}

.Navi li:hover:after,
.Navi li.selected:after,
.Navi li:target:after{
/* liukuvärin käynnistin */
opacity:1;
}

.Navi:hover li.selected:after,
.Navi:hover li:target:after{
/* Hides the targeted li when we are hovering on the UL */
opacity:0;
}

.Navi li.selected:hover:after,
.Navi li:target:hover:after{
opacity:1 !important;
}

/* Nappien tyylit (fontti, tekstin asettelu yms) */

.Navi li a{
color: #fff;
display: inline-block;
font-size: 18px;
font-weight: bold;
font-family: 'deliusregular';
padding: 12px 5px 14px;
position: relative;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.6);
z-index:2;
text-decoration:none !important;
white-space:nowrap;
}

/* Vaihtuvan taustakuvan määritykset */

#slideshow {
    position:relative;
    height:0px;
    z-index:-1;
}
  
#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}
  
#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}
  
#slideshow IMG.last-active {
    z-index:9;
}
  
#slideshow img {
    /* Set rules to fill background */
    min-height: 100%;
    min-width: 1024px;
  
    /* Set up proportionate scaling */
    width: 100%;
    height: auto;
  
    /* Set up positioning */
    position: fixed;
    top: 0;
    left: 0;
}
  
@media screen and (max-width: 1024px){
    img.bg {
    left: 50%;
    margin-left: -512px;
}
}


/* Gallerian pikkukuvat */
.pienet{
margin: 25px 10px 25px;
}
   
.pienet img{
height: 80px;
border: 2px solid #fff;
border-radius: 5px;
margin: 5px 5px 5px 5px;
}
 
.pienet img:hover {
height: 80px;
border: 2px dotted #fff;
border-radius:10px;
cursor:pointer;
-ms-transform: scale(1.1,1.1); /* IE 9 */
-webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
-moz-transform: scale(1.1,1.1);
transform: scale(1.1,1.1);
}

/* LIGHTBOX */

/* line 7, ../sass/lightbox.sass */
body:after {
  content: url(img/close.png) url(img/loading.gif) url(img/prev.png) url(img/next.png);
  display: none;
}

/* line 11, ../sass/lightbox.sass */
.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

/* line 20, ../sass/lightbox.sass */
.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}
/* line 28, ../sass/lightbox.sass */
.lightbox .lb-image {
  display: block;
  height: auto;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
/* line 32, ../sass/lightbox.sass */
.lightbox a img {
  border: none;
}

/* line 35, ../sass/lightbox.sass */
.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
/* line 38, ../../../../.rvm/gems/ruby-1.9.3-p392/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

/* line 44, ../sass/lightbox.sass */
.lb-container {
  padding: 4px;
}

/* line 47, ../sass/lightbox.sass */
.lb-loader {
  position: absolute;
  top: 43%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

/* line 56, ../sass/lightbox.sass */
.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(img/loading.gif) no-repeat;
}

/* line 63, ../sass/lightbox.sass */
.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

/* line 71, ../sass/lightbox.sass */
.lb-container > .nav {
  left: 0;
}

/* line 74, ../sass/lightbox.sass */
.lb-nav a {
  outline: none;
}

/* line 77, ../sass/lightbox.sass */
.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  cursor: pointer;
  /* Trick IE into showing hover */
  display: block;
}

/* line 84, ../sass/lightbox.sass */
.lb-prev {
  left: 0;
  float: left;
}
/* line 87, ../sass/lightbox.sass */
.lb-prev:hover {
  background: url(img/prev.png) left 48% no-repeat;
}

/* line 90, ../sass/lightbox.sass */
.lb-next {
  right: 0;
  float: right;
}
/* line 93, ../sass/lightbox.sass */
.lb-next:hover {
  background: url(img/next.png) right 48% no-repeat;
}

/* line 96, ../sass/lightbox.sass */
.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
/* line 38, ../../../../.rvm/gems/ruby-1.9.3-p392/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

/* line 103, ../sass/lightbox.sass */
.lb-data {
  padding: 0 4px;
  color: #bbbbbb;
}
/* line 106, ../sass/lightbox.sass */
.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}
/* line 111, ../sass/lightbox.sass */
.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
  color: #fff;
}
/* line 115, ../sass/lightbox.sass */
.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}
/* line 121, ../sass/lightbox.sass */
.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(img/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
}
/* line 130, ../sass/lightbox.sass */
.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}