html, body { margin:0; padding:0; }
body {
	height:100%;
	width:100%;
}

p, h1, h2, h3 {
	font-family: 'Open Sans', sans-serif; font-weight:100; line-height:1.4;
}

#wrapper {
	position:absolute;
    height:100%;
    width:100%;
}

.panels { 
    position:relative;
    height:100vh;
    width:100%;
}
#pa { 
	width:100%;
	margin:0 auto;
	position:fixed;
	top:0;
	background: url("/images/bg.jpg") no-repeat;
	background-size:cover;
	background-position:center;
	z-index:-1;
	color:#aaaaaa;
	text-align:center;
}

#logo { width:50%; margin:0 70% 0 0; }
#isoKuva { width:100%; height:100vh; }
#logoMain { width:580px; margin: 40px 0 20px 0; }
#paaTeksti { margin: 40px 53% 0 auto; width:40%; font-family: 'Open Sans', sans-serif; font-size:2em; color:black; font-weight: 100; line-height: 1.3; height:100px;}
#alaTeksti { margin: 70px 53% 0 auto; width:40%; font-family: 'Open Sans', sans-serif; font-size:1.5em; color:black; font-weight: 100; line-height: 1.3; height:20px;}

#pb { width:100%; min-height:57vh; margin-top:90vh; background-color:#6B5730; z-index:1; color:white; }
#panelContainer { width:80%; margin:0 auto; padding:100px 0; }
#nuoliAlas { margin: -87px auto 0 auto; text-align:center; width:100%; }
#nuoliAlasObj { 
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out; 
	-o-transition: all 0.3s ease-in-out; 
	-ms-transition: all 0.3s ease-in-out; 
}

#copyright { background-color:#6B5730; width:100%; height:50px; color:white; margin: 0 auto; text-align:center; }
.copyrightText { font-size:0.8em; margin:0; padding:30px 0 5px 0; background-color: #6B5730; }
.footerLink { color:lightgray; text-decoration: none; }
.footerLink:hover { color:white; }

.center { text-align:center; }
.vasen { float:left; width:46%; }
.oikea { float:right; width:46%; }
.hide { display: none !important; }
.show { display: inline !important; }

.ajaxIcons, .ajaxTexts { text-align: center; margin-right:190px; }
.done, .working, .fail { font-size: 10em; }
.working { color:#eba622; }
.done { color:lightgreen; }
.fail { color:tomato; }
p.fail, p.done, p.working { font-size: 2em; margin:0; }

form#contact label { margin-right:10px; }
form#contact input, form#contact textarea { width:300px; padding:10px; font-size: 1em; margin-bottom:4px; color:black; }
form#contact textarea { height:100px; width:303px; }
form#contact td.textarea { vertical-align:top; }
form#contact td.submit { text-align:right; }
form#contact input[type=submit] { width:100px; background-color:#6B5730; border:1px solid white; color: white; padding: 10px 15px; }
form#contact input[type=submit]:hover { border:1px solid lightgray; color: lightgray; cursor:pointer; }


#kuvaukset { margin: 20px 57% 0 auto; width:32%; }
#huoneistot, #julkisivut, #katot, #epox { display: none; color:grey; }

.huoneistot:hover,
.julkisivut:hover,
.katot:hover,
.epox:hover { color:gray; cursor: help; }


/* MEDIA QUERIES */

@media (max-width: 1340px) {
	#alaTeksti { font-size: 1.3em; white-space: nowrap; }
}

@media (max-width: 1200px) {
	#logoMain { width:100%; margin-left:5px; }
	#alaTeksti { font-size: 1.1em; margin-top:30px; }
	#paaTeksti { white-space: nowrap; }
}

@media (max-width: 990px) {
	#panelContainer div.vasen,
	#panelContainer div.oikea { margin:0; float:none; white-space: nowrap; }
	#pa { background-position: 45% 65%; }
	#kuvaukset { width:45vw; margin:10px 50vw 0 auto; }
	#kuvaukset div { color:black; }
}

/* MEDIA QUERIES PORTRAIT */

@media (max-width: 600px) and (orientation: portrait) {
	#kuvaukset { width:42wv; margin:10px 47vw 0 auto; }
	#logoMain { width:140%; margin:0 0 -40px 30px; }
	form#contact textarea { width:45.6vw; }
	form#contact input { width:45vw; }
	#panelContainer div.vasen h3,
	#panelContainer div.oikea h3 { font-size: 2.2em; }
	#pb { margin-top:75vh; }
}

@media (max-width: 430px) and (orientation: portrait) {
	#alaTeksti { font-size: 4vmin; margin-top:10px; }
	#paaTeksti { font-size: 7vmin; }
	#huoneistot p, #julkisivut p, #katot p, #epox p { font-size: 2.9vmin; line-height: 120%; }
	#huoneistot h3 { font-size: 3.3vmin; }
	#pa { background-position: 37% 65%; }
}

/* MEDIA QUERIES LANDSCAPE */

@media (max-width: 1300px) and (orientation: landscape) {
	#logoMain { margin: -30px 0 0 30px; }
}

@media (max-width: 770px) and (orientation: landscape) {
	#logoMain { margin:-50px 0 0 0; width:40vw; }
	#paaTeksti { margin:10px 0 0 30px; font-size: 5vmin; }
	#alaTeksti { margin:-30px 0 0 30px; }
	#huoneistot p, #julkisivut p, #katot p, #epox p { font-size: 2.8vmin; line-height: 130%; }
	#huoneistot h3 { font-size: 3.2vmin; line-height: 30%; }
	#pb { margin-top:83vh; }
	#nuoliAlas { margin: -100px auto 0 auto; }
}

/* MEDIA QUERIES */