/* CSS Document */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%; height: 100%; overflow: -moz-scrollbars-vertical;
     overflow: scroll;}

body {
	margin: 0; 
	font-family:Verdana, Geneva, sans-serif; 
	font-size: 12px ;
	color:#000000; 	
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	  height: 100%;
	 }
	 
.res_img {
    background: url("../img/ylapalkki.jpg") no-repeat center top;
		/*height: auto; or your image's height*/
		height: 229px; /*or your image's height*/
		padding: 0;		
	}


.kehys{ width: 100%; max-width: 750px; overflow: visible; margin-left:auto; margin-right:auto; padding-left: 0; clear: both;
}

.sarake1 {
	float: left;
	margin: 2px;
	text-align:left;
	height: 100%;
	width: 100%;
	min-width: 200px;
	max-width: 360px;
	padding-left:40px;
	padding-right:10px;
} 

.sarake2 {
	float: left;
	text-align:left;
	margin: 2px;
	height: 100%;
	width: 100%;
	min-width: 200px;
	max-width: 380px;
	overflow:auto;
	padding-left:40px;
	padding-right:5px;
} 





	
.sarake3_left {
	float: left;
	text-align:left;
	line-height: 1.5;
	margin: 2px;
	padding-top:50px;
	padding-bottom:20px;
	padding-left:50px;
	height: 100%;
	width: 100%;
	min-width: 240px;
	max-width: 290px;
	overflow:auto;
} 

.sarake3_center {
	float: left;
	text-align:left;
	line-height: 1.5;
	margin: 2px;
	height: 100%;
	width: 100%;
	min-width: 240px;
	max-width: 260px;
	overflow:auto;
	padding-top:50px;
	padding-right:10px;
	padding-bottom:20px;
	padding-left:50px;
} 

.sarake3_right {
	float: left;
	text-align:left;
	line-height: 1.5;
	margin: 2px;
	height: 100%;
	width: 100%;
	min-width: 170px;
	max-width: 170px;
	overflow:auto;
	padding-top:50px;
	padding-right:10px;
	padding-bottom:20px;
	padding-left:50px;
} 

 .footer {
	width: 100%;
	min-height: 150px;
	max-height: 450px;
	background:#005DB3;
	text-align:center;
	overflow:auto;
	font-family:Verdana, Geneva, sans-serif; 
	font-size: 14px; 
	color:#ffffff;
	clear: both;
	}


.copy {max-width: 1280px; overflow: visible; margin-left:auto; margin-right:auto; padding-left: 0; text-decoration: none; font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999; text-align:right;}
a.copy:visited { font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999;}
a.copy:hover {font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999;}
a.copy:active {font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999;}

@media all and (max-width: 768px), 
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), 
only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), 
only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), 
only screen and (min-resolution: 192dpi) and (max-width: 1024px), 
only screen and (min-resolution: 2dppx) and (max-width: 1024px) 
{

	.res_img {
		background: url("../img/ylapalkki2.jpg") no-repeat left top;
			/*height: auto; or your image's height*/
			height: 116px; /*or your image's height*/
			padding: 0;		
		}
	
	.sarake1 {
		float: left;
		margin: 0px;
		text-align:left;
		height: 100%;
		width: 100%;
		min-width: 200px;
		max-width: 340px;
		padding-right:10px;
		padding-bottom:0px;
		padding-left:40px;
	} 
	
	.sarake2 {
		float: left;
		text-align:left;
		margin: 0px;
		height: 100%;
		width: 100%;
		min-width: 200px;
		max-width: 340px;
		overflow:auto;
		padding-right:5px;
		padding-bottom:0px;
		padding-left:40px;
	} 
	
	.sarake3_left {
		float: left;
		text-align:left;
		line-height: 1.0;
		margin: 2px;
		padding-top:30px;
		padding-bottom:5px;
		padding-left:50px;
		height: 100%;
		width: 98%;
		min-width: 240px;
		max-width: 98%;
		overflow:auto;
	} 
	
	.sarake3_center {
		float: left;
		text-align:left;
		line-height: 1.0;
		margin: 2px;
		height: 100%;
		width: 98%;
		min-width: 240px;
		max-width: 98%;
		overflow:auto;
		padding-top:10px;
		padding-right:10px;
		padding-bottom:5px;
		padding-left:50px;
	} 
	
	.sarake3_right {
		float: left;
		text-align:left;
		line-height: 1.0;
		margin: 2px;
		height: 100%;
		width: 98%;
		min-width: 170px;
		max-width: 98%;
		overflow:auto;
		padding-top:10px;
		padding-right:10px;
		padding-bottom:5px;
		padding-left:50px;
	} 
	
	 .footer {
		width: 99%;
		min-height: 150px;
		max-height: 280px;
		background:#005DB3;
		text-align:center;
		overflow:auto;
		font-family:Verdana, Geneva, sans-serif; 
		font-size: 14px; 
		color:#ffffff;
		clear: both;
		}
	
	p { 
		width: 99%;
	}
	.copy {max-width: 90%; overflow: visible; margin-left:auto; margin-right:auto; padding-left: 0; text-decoration: none; font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999; text-align:right;}
	a.copy:visited { font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999;}
	a.copy:hover {font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999;}
	a.copy:active {font-family: verdana, sans-serif; font-size: 10px ; font-weight: normal; color: #999999;}
}