@font-face {
    font-family: 'zalamandercapsbold';
    src: url('font/just_another_foundry_-_zalamandercaps-bold-webfont.woff2') format('woff2'),
         url('font/just_another_foundry_-_zalamandercaps-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,400,900,700');

a, a:link, a:visited {
	cursor: pointer;
	font-weight:bold;
	text-decoration:none;
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: 	all 0.2s ease 0s;
    -o-transition: 		all 0.2s ease 0s;
    transition: 		all 0.2s ease 0s;
	color:#f47822;
	text-shadow: none;
}
a:hover, 
a:active {
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: 	all 0.2s ease 0s;
    -o-transition: 		all 0.2s ease 0s;
    transition: 		all 0.2s ease 0s;
	color: #ffffff;
}
.nav li a{
	font: 600 15px/15px "Source Sans Pro",Helvetica, Arial, sans-serif;
}
p {
	margin-bottom: 10px;
}

h2 {
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 150px auto;
	background-color: transparent;
	background-image: url('img/joon.svg');
	padding-bottom: 10px;
}
#header h1{
	font: 700 30px/30px "zalamandercapsbold",Helvetica, Arial, sans-serif;
	letter-spacing: 3px;
	margin-bottom: 0px;
	color: #ffffff;
	text-align: left; 
}
#header p{
	font: 400 15px/15px "Source Sans Pro",Helvetica, Arial, sans-serif;
	margin-bottom: 0px;
	color: #ffffff;
	text-align: center; 
	text-align: left; 
}
#information h2,
#asukoht h2,
#korruptsioon h2 {
	font: 700 35px/40px "zalamandercapsbold",Helvetica, Arial, sans-serif;
	margin-bottom: 20px;
	color: #f47822;
	text-align: center; 
}
#asukoht h3 {
	font: 700 25px/25px "Source Sans Pro",Helvetica, Arial, sans-serif;
	margin-bottom: 20px;
	color: #ffffff;
	text-align: center; 
}
#asukoht h3 span {
	font: 700 15px/15px "Source Sans Pro",Helvetica, Arial, sans-serif;
	margin-bottom: 20px;
	color:#f47822;
	text-align: center; 
}
#dialog p,
#information p,
#asukoht p,
#korruptsioon p {
	font: 400 15px/21px "Source Sans Pro",Helvetica, Arial, sans-serif;
	margin-bottom: 10px;
	color: #ffffff;
	text-align: center; 
}
#dialog h2,
#panorama_map .info h2 {
	font: 700 35px/40px "zalamandercapsbold",Helvetica, Arial, sans-serif;
	margin-bottom: 20px;
	color: #f47822;
	background-position: center bottom;
	text-align: center; 
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: 	all 0.2s ease 0s;
	-o-transition: 		all 0.2s ease 0s;
	transition: 		all 0.2s ease 0s;
	opacity: 0;
}
#dialog h2 {
	opacity: 1;
}

.hint{
	font: 400 10px/10px "Source Sans Pro",Helvetica, Arial, sans-serif;
	color: #ffffff;
	text-align: center;
	top: calc(100% + 5px);
	left: calc(-1vw + 4px);
	width: 5vw;
	letter-spacing: 1px;
	position: absolute;
}

.punkt:nth-child(1) .hint,
.punkt:nth-child(3) .hint,
.punkt:nth-child(6) .hint,
.punkt:nth-child(9) .hint,
.punkt:nth-child(11) .hint,
.punkt:nth-child(13) .hint,
.punkt:nth-child(15) .hint{
	top: auto;
	bottom: 100%;
	bottom:calc(100% + 5px);
}
#panorama_map .info p {
	font: 400 15px/21px "Source Sans Pro",Helvetica, Arial, sans-serif;
	margin-bottom: 10px;
	color: #ffffff;
	text-align: justify;
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: 	all 0.2s ease 0s;
	-o-transition: 		all 0.2s ease 0s;
	transition: 		all 0.2s ease 0s;
	opacity: 0;
}

#panorama_map .punkt.active .info .float h2 {
	-webkit-transition: all 0.2s ease 0.3s;
	-moz-transition: 	all 0.2s ease 0.3s;
	-o-transition: 		all 0.2s ease 0.3s;
	transition: 		all 0.2s ease 0.3s;
	opacity: 1;
}
#panorama_map .punkt.active .info .float p {
	-webkit-transition: all 0.2s ease 0.4s;
	-moz-transition: 	all 0.2s ease 0.4s;
	-o-transition: 		all 0.2s ease 0.4s;
	transition: 		all 0.2s ease 0.4s;
	opacity: 1;
}

#panorama_map .punkt .info .float p:last-child {
	margin-bottom: 50px;
}
p b {
	color:#f47822;
}
@media only screen and (max-width: 1000px){
	#dialog h2,
	#header h1,
	#information h2,
	#asukoht h2,
	#korruptsioon h2,
	#panorama_map .info h2 {
		font: 700 5vh/5.2vh "zalamandercapsbold",Helvetica, Arial, sans-serif;
	}
	#dialog p,
	#information p,
	#asukoht p,
	#korruptsioon p,
	#panorama_map .info p {
		font: 400 2vh/2.1vh "Source Sans Pro",Helvetica, Arial, sans-serif;
	}
	#header .headline p{
		font: 400 4vw/4.1vw "Source Sans Pro",Helvetica, Arial, sans-serif;
	}
	#header .headline h1,
	#header .headline p{
		text-align: center;
	}
	.nav li a{
		margin: 10px 0px 10px 0px;
		font: 700 4vw/4.1vw "Source Sans Pro",Helvetica, Arial, sans-serif;
	}
	#header a.irllogo{
		border: none;
	}
}