/* custom fonts */
@font-face{
font-family:"MyriadRegular";
src:url("../fonts/2bd106a4-3872-4193-8627-d7af96dd4f7e.eot?#iefix");
src:url("../fonts/2bd106a4-3872-4193-8627-d7af96dd4f7e.eot?#iefix") format("eot"),url("../fonts/c5b1c170-d8f7-41f9-85c2-0ab670780c6b.woff") format("woff"),url("../fonts/ba1ff8f6-0c27-4e7b-8be5-818b6c3dd801.ttf") format("truetype"),url("../fonts/a379413e-a0b8-44dc-b250-1e000e4092a4.svg#a379413e-a0b8-44dc-b250-1e000e4092a4") format("svg");
font-weight: normal;
font-style: normal;
}
@font-face{
font-family:"MyriadRegular";
src:url("../fonts/4f2af761-c017-4801-9aa5-5d30643373ce.eot?#iefix");
src:url("../fonts/4f2af761-c017-4801-9aa5-5d30643373ce.eot?#iefix") format("eot"),url("../fonts/acfb7490-30f6-4bf4-a1b8-70ff9172d209.woff") format("woff"),url("../fonts/5bf402e3-ba96-414e-bc7e-cb6689fe32c1.ttf") format("truetype"),url("../fonts/c5dceae7-427a-4765-b06b-ea2eecca3434.svg#c5dceae7-427a-4765-b06b-ea2eecca3434") format("svg");
font-weight: bold;
font-style: normal;
}



/* general */
body {
    margin: 0;
    padding: 0;
	font: 14px/1.4 "MyriadRegular", Arial;
	font-weight: bold;
}



/* common */
.hide { display: none; }

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.lt-ie8 .cf {
    zoom: 1;
}

#wrapper {
    margin: 0 auto;
    position: relative;
   	width: 940px;
    height: 705px;
}

a {
	outline: none;
}

a.marker {
    background: url('../images/marker-icons-4.png') no-repeat left top;
    width: 43px;
    height: 43px;
    position: absolute;
    background-size: 400% 200%;
	transition: transform .2s ease-in-out;
	transform: scale(0.93);
}
a.marker:hover {
    background-position: 0 100%;
	transform: scale(1);
}
a.marker-rotation-1 { 
	background-position: 0 0;		
	-ms-transform-origin: right bottom; /* IE 9 */
	-o-transform-origin: right bottom; /* IE 9 */
	-webkit-transform-origin: right bottom; /* Chrome, Safari, Opera */
	transform-origin: right bottom;
}
a.marker-rotation-1:hover { background-position: 0 -43px; }
a.marker-rotation-2 { 
	background-position: -43px 0;
	-ms-transform-origin: left bottom; /* IE 9 */
	-o-transform-origin: left bottom; /* IE 9 */
	-webkit-transform-origin: left bottom; /* Chrome, Safari, Opera */
	transform-origin: left bottom;
}
a.marker-rotation-2:hover { background-position: -43px -43px; }
a.marker-rotation-3 { 
	background-position: -86px 0;	
	-ms-transform-origin: left top; /* IE 9 */
	-o-transform-origin: left top; /* IE 9 */
	-webkit-transform-origin: left top; /* Chrome, Safari, Opera */
	transform-origin: left top;
}
a.marker-rotation-3:hover { background-position: -86px -43px; }
a.marker-rotation-4 { 
	background-position: -129px 0;
	-ms-transform-origin: right top; /* IE 9 */
	-o-transform-origin: right top; /* IE 9 */
	-webkit-transform-origin: right top; /* Chrome, Safari, Opera */
	transform-origin: right top;
}
a.marker-rotation-4:hover { background-position: -129px -43px; }

	a.marker.scaledown {
		-ms-transform: scale(0.21); /* IE 9 */
		-o-transform: scale(0.21); /* IE 9 */
		-webkit-transform: scale(0.21); /* Chrome, Safari, Opera */
		transform: scale(0.21);	
	}
	a.marker.scaledown:hover {
		/* -ms-transform: scale(0.22); 
		-o-transform: scale(0.22); 
		-webkit-transform: scale(0.22);
		transform: scale(0.22); */
	}
	
	a.marker.scaledown.marker-rotation-2 {
	}
	
	a.marker.scaledown.marker-rotation-3 {
	}
	
	a.marker.scaledown.marker-rotation-4 {
	}

/* front page */
#frontpage {
    position: relative;
    background: url('../images/yleiskuva2.jpg') no-repeat center top;
    background-size: 100% 100%;
    margin: 0 auto;
    padding-bottom: 75%; /* maintain aspect ratio 2:1 */
}
#frontpage-2 {
    position: relative;
    background: url('../images/yleiskuva2.jpg') no-repeat center top;
    background-size: 100% 100%;
    margin: 0 auto;
    padding-bottom: 75%; /* maintain aspect ratio 2:1 */
}

#frontpage-2 .overlay,
#location .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 101%;
    background: #fff;
    opacity: 0;
    display: none;
    z-index: 3;
}


#ghostmarker {
	width: 188px;
	height: 140px;
	background: rgba(0,0,0,0.0);
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	margin-left: -94px;
	margin-top: -70px;
}

/* location view */
#location-wrapper {
    overflow: hidden;
}
#location-position {
    overflow: visible !important;
    transition: transform .6s ease-in-out;
}
#location {
    position: relative;
    background: url('../images/bg-location-1-low.jpg') no-repeat center top;
    background-size: 100% 100%;
    margin: 0 auto;
    padding-bottom: 74.4%;
	cursor: url('images/zoomin2.cur'),pointer;
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
}

	#location.location-2 {
		background-image: url('../images/bg-location-3-low.jpg');
	}
	
	#location.location-3 {
		background-image: url('../images/bg-location-2-low.jpg');
	}
	
	#location.location-4 {
		background-image: url('../images/bg-location-4-low.jpg');
	}
	
	#location.location-5 {
		background-image: url('../images/bg-location-5-low.jpg');
	}
	
	/*
	#location.hires {
		background-image: url('../images/bg-location-1.jpg');
	}
	*/

	body.zoom-in #location {
		cursor: url('images/zoomout2.cur'),pointer;
		cursor: -webkit-zoom-out;
		cursor: -moz-zoom-out;	
	}
	
#location #loading-indicator {
    background: url('../images/loading.gif') no-repeat center center;
    width: 24px;
    height: 24px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -12px;
    margin-left: -12px;
}
#location .overlay {
    display: block;
    opacity: 1;
}
    #location .overlay img.loading {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -12px;
        margin-top: -12px;
    }

a.nav-button {
    display: none;
    position: fixed;
    background: #fff;
    background: rgba(255,255,255,0.80);
    padding: 16px 22px 16px 42px;
    z-index: 10;
	line-height: 18px;
	font-size: 15px;
	font-weight: bold;
	color: #6aac3c;
	text-decoration: none;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	border-bottom-right-radius: 4px;
	
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
	
	transition-timing-function: ease-in-out;
	-webkit-transition-timing-function: ease-in-out; /* Safari and Chrome */
	
}

	a.nav-button img {
		position: absolute;
		display: block;
		width: 15px;
		height: 18px;
		left: 17px;
		top: 16px;
		border: none;
		
		-webkit-transition-duration: 0.3s;
		-moz-transition-duration: 0.3s;
		-o-transition-duration: 0.3s;
		transition-duration: 0.3s;
		
		transition-timing-function: ease-in-out;
		-webkit-transition-timing-function: ease-in-out; /* Safari and Chrome */
	}
	
	a.nav-button:hover {
		background: rgba(255,255,255,0.95);
		padding: 16px 25px 16px 39px;
	}
	
		a.nav-button:hover img {
			left: 14px;
		}

#back-to-full-view {
    display: inline-block;
}

/* popup */
.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
  border-radius: 5px;
  border: 2px solid #6aac3c;
}
    .white-popup h2 {
        color: #6aac3c;
        font-size: 18px;
    }
	
	
	.white-popup img {
		display: block;
		float: left;
		margin-right: 20px;
	}
	
a.btn {
	display: inline-block;
	color: #fff;
	font-weight: bold;
	font-size: 14px;
	line-height: 18px;
	padding: 6px 12px;
	border: 1px solid #fff;
	text-decoration: none;
	
	text-shadow:1px 1px 1px rgba(0,0,0,0.4);
	
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
	box-shadow: 1px 1px 2px rgba(0,0,0,0.3);

	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	
	background: #8be050; /* Old browsers */
	background: -moz-linear-gradient(top,  #8be050 0%, #6aac3c 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8be050), color-stop(100%,#6aac3c)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #8be050 0%,#6aac3c 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #8be050 0%,#6aac3c 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #8be050 0%,#6aac3c 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #8be050 0%,#6aac3c 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8be050', endColorstr='#6aac3c',GradientType=0 ); /* IE6-9 */


}

	a.btn:hover {
		background: #6aac3c; /* Old browsers */
		background: -moz-linear-gradient(top,  #6aac3c 0%, #4c9300 99%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6aac3c), color-stop(99%,#4c9300)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  #6aac3c 0%,#4c9300 99%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  #6aac3c 0%,#4c9300 99%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  #6aac3c 0%,#4c9300 99%); /* IE10+ */
		background: linear-gradient(to bottom,  #6aac3c 0%,#4c9300 99%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6aac3c', endColorstr='#4c9300',GradientType=0 ); /* IE6-9 */

	}
	
	


      /**
       * Fade-zoom animation for first dialog
       */
      
      /* start state */
      .zoom-anim-dialog {
        opacity: 0;

        -webkit-transition: all 0.2s ease-in-out; 
        -moz-transition: all 0.2s ease-in-out; 
        -o-transition: all 0.2s ease-in-out; 
        transition: all 0.2s ease-in-out; 

		-ms-transform-origin: center center; /* IE 9 */
		-o-transform-origin: center center; /* IE 9 */
		-webkit-transform-origin: center center; /* Chrome, Safari, Opera */
		transform-origin: center center;

        -webkit-transform: scale(0.8); 
        -moz-transform: scale(0.8); 
        -ms-transform: scale(0.8); 
        -o-transform: scale(0.8); 
        transform: scale(0.8); 
      }

      /* animate in */
      .mfp-ready .zoom-anim-dialog {
        opacity: 1;

        -webkit-transform: scale(1); 
        -moz-transform: scale(1); 
        -ms-transform: scale(1); 
        -o-transform: scale(1); 
        transform: scale(1); 
      }

      /* animate out */
      .mfp-removing .zoom-anim-dialog {
        -webkit-transform: scale(0.8); 
        -moz-transform: scale(0.8); 
        -ms-transform: scale(0.8); 
        -o-transform: scale(0.8); 
        transform: scale(0.8); 

        opacity: 0;
      }

      /* Dark overlay, start state */
      .mfp-bg {
        opacity: 0.001; /* Chrome opacity transition bug */
        -webkit-transition: opacity 0.3s ease-out; 
        -moz-transition: opacity 0.3s ease-out; 
        -o-transition: opacity 0.3s ease-out; 
        transition: opacity 0.3s ease-out;
      }
      /* animate in */
      .mfp-ready.mfp-bg {
        opacity: 0.8;
      }
      /* animate out */
      .mfp-removing.mfp-bg {
        opacity: 0;
      }