/**
 * PÄÄSKY 2 tyylisivu
 */


body, html{height:98%;}

body{
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/paaskybgr.jpg);
	background-size:auto;
	background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: left top;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;}

input{
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;}

#wayfForm{
	margin:auto;
	display:block;
	width:500px;
	margin-top:30px}
	
#wayfForm label{
	display:block;
	height:20px;
	width:200px;
	float:none;
	margin-bottom:6px;
	margin-left:200px;
	}

select, option { width: 200px; }
	
#logo{
	
	margin:20px 0 0 20px;
	}

#username{float:right;
     margin:60px 30px 0 0 ;}

#username a {
	 text-decoration:none;
	 font-weight:bold;
	 color:#339E35;
		 }	

#info,  #alertinfo {
	border:2px solid #339E35;
	margin:30px;
	padding:6px;
	clear:both;
	font-size:14px;
	text-align:center;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/ok.png);
	background-position: 20px 50%;
	background-repeat:no-repeat;
	background-size:39px 39px;	
}

#info2 {
	margin:30px;
	padding:6px;
	clear:both;
	font-size:14px;
	text-align:center;
	background-position: 20px 50%;
	background-repeat:no-repeat;
	background-size:39px 39px;	
}

#info3 {
	border:2px solid #339E35;
	margin:0px;
	padding:px;
	clear:both;
	font-size:12px;
	text-align:center;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/ok.png);
	background-position: 20px 50%;
	background-repeat:no-repeat;
	background-size:39px 39px;	
}

#alertinfo2 {
	border:2px solid #339E35;
	margin:10px;
	padding:6px 6px 6px 70px;
	clear:both;
	font-size:14px;
	text-align:left;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/ok.png);
	background-position: 3px 50%;
	background-repeat:no-repeat;
	background-size:39px 39px;	
}

#alertinfo3 {
	border:2px solid #339E35;
	margin:30px;
	padding:0px 0 0px 50px;
	clear:both;
	font-size:11px;
	text-align:left;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/ok.png);
	background-position: 3px 50%;
	background-repeat:no-repeat;
	background-size:39px 39px;	
}

#alertinfo {
	border:2px solid red;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/alert.png);}
	
#alertinfo2 {
	border:2px solid red;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/alert.png);}
	
#alertinfo3 {
	border:2px solid red;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/alert.png);}
	
#info a {
	color:#339E35;
	}
	
#info2 a {
	color:#339E35;
	}

#wrapper{
	margin: auto;
	width: 99%;
	position: absolute;
  height: 600px;
  padding:0;
	}

#container {
	
	background-color: #fff;
	width:900px;
	margin:auto;
	height:550px;
	overflow: auto;
	padding:0;}

#centercontent{
	margin:auto;
	margin-top:100px;
	}
	
#centercontent2{
	margin:auto;
	margin-top:10px;
	}

#centercontent3{
	margin:auto;
	margin-top:100px;
	}
	
#centercontent p{
	margin-top:0;
	
	margin:0 30px;}
	
#centercontent h2{
	margin-top:0;
	text-align:center;}
	
#centercontent3 h3{
	margin-top:0;
	margin-left:40px;
	font-size:1.2em;
	text-align:center;}
	
#centercontent3 h4{
	margin-top:0;
	margin-left:90px;
	font-size:1.2em;
	text-align:center;}
	
#centercontent3 h5{
	margin-top:0;
	margin-left:-100px;
	font-size:1.2em;
	text-align:center;}
	
#centercontent2 h2{
	margin-top:0;
	text-align:center;
	margin-left: 90px}
	
#centercontent a.systemlink{
	display:block;
	border-radius: 6px;
	width:300px;
	background-color:#7AB800;
	margin-bottom:10px;
	padding:20px 0 20px 60px;
	margin:auto;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/arrowbig.png);
	background-position: 10px 50%;
	background-repeat:no-repeat;
	background-size:37px 37px;
	color:#fff;
	font-size:1.2em;
	text-decoration:none;
	margin-top:100px;
	}
#centercontent a.systemlink:hover{
	background-color:#339E35;}

#centercontent3 a.systemlink{
	display:block;
	border-radius: 6px;
	width:300px;
	background-color:#7AB800;
	margin-bottom:10px;
	padding:20px 0 20px 60px;
	margin:auto;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/arrowbig.png);
	background-position: 10px 50%;
	background-repeat:no-repeat;
	background-size:37px 37px;
	color:#fff;
	font-size:1.2em;
	text-decoration:none;
	margin-top:100px;
	}
#centercontent3 a.systemlink:hover{
	background-color:#339E35;}
	
#passwordform{
	margin:auto;
	display:block;

	width:500px;
	margin-top:30px;}
input.passfield{display:block;
	height:20px;
	width:200px;
	margin-bottom:6px;
	}

#passwordform label{
	display:block;
	float:left;
	width:200px;
	font-size:14px;
	}
	
#passwordform label2{
	display:block;
	float:left;
	width:125px;
	font-size:14px;
	}
	
#systemlinks{
	
	float:left;
	padding-left:30px;
	width:560px;	
	}
	
#systemlinks h2{
	margin-top:0;}
	
#systemlinks a.systemlink{
	display:block;
	border-radius: 6px;
	width:200px;
	background-color:#7AB800;
	margin-bottom:10px;
	padding:20px 0 20px 60px;
	float:left;
	margin-right:10px;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/arrowbig.png);
	background-position: 10px 50%;
	background-repeat:no-repeat;
	background-size:37px 37px;
	color:#fff;
	font-size:1.2em;
	text-decoration:none;
	}

#systemlinks a.systemlink:hover{
	background-color:#339E35;}
	
#extralinks{
	margin-left:20px;
	margin-right:30px;
	float:right;
	border-left:1px solid #ccc;
	height: 300px;
	padding-left:10px;

	}

input[name="salasana"] {
	width:200px;
	background-color:#339E35;
	margin-bottom:10px;
	padding:10px 0 10px 10px;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/arrowsmall.png);
	background-position: 95% 50%;
	background-repeat:no-repeat;
	background-size:17px 18px;
	border-radius: 3px;
	color:#fff;
	font-size:0.8em;
	text-align:left;
	border-width:0;
	cursor:pointer;
	margin-left:200px;
	
		}

input[name="salasana3"] {
	width:200px;
	background-color:#339E35;
	margin-bottom:10px;
	padding:10px 0 10px 10px;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/arrowsmall.png);
	background-position: 95% 50%;
	background-repeat:no-repeat;
	background-size:17px 18px;
	border-radius: 3px;
	color:#fff;
	font-size:0.8em;
	text-align:left;
	border-width:0;
	cursor:pointer;
	margin-left:125px;
	
		}
	
input[name="salasana"]:hover {
   background-color:#007D57;
		}
		
input[name="salasana3"]:hover {
   background-color:#007D57;
		}
		
footer{
	height:40px;
	background-color:#525252;
	position: absolute;
    bottom: 0;
	width:900px;
	clear:both;
	text-align:right;
	padding-top:20px;
}

footer2{
	height:40px;
	background-color:#525252;
	position: absolute;
    bottom: -16;
	width:900px;
	clear:both;
	text-align:right;
	padding-top:20px;
}

footer a{
	color:#fff;
	margin:20px;
	text-decoration:none;	
	}
	
footer2 a{
	color:#fff;
	margin:20px;
	text-decoration:none;
	}
	
#return{
	}
	
#extralinks input[name="salasana2"],#extralinks input[name="logout"] {
	width:230px;
	background-color:#339E35;
	margin-bottom:10px;
	padding:10px 0 10px 10px;
	background-image: url(https://spevaluointi.traficom.fi/errordocs/img/arrowsmall.png);
	background-position: 95% 50%;
	background-repeat:no-repeat;
	background-size:17px 18px;
	border-radius: 3px;
	color:#fff;
	font-size:0.8em;
	text-align:left;
	border-width:0;
	cursor:pointer;
		}
	
#extralinks input[name="salasana2"]:hover, #extralinks input[name="logout"]:hover {
   background-color:#007D57;
		}
	
@media all and (max-width: 1000px){
	body, html{
		height:auto;
		}
	body{
		background-image:none;
		}
	#wrapper{
		margin: auto;
		height: auto;
		padding:0px;
		position:relative;
		}
		
	#container{width:100%;
		height:auto;
		}
	footer{width:100%;
		position:relative;
		clear:both;
		}
	footer2{width:100%;
		clear:both;
		margin-bottom:-14px;
		}		
	#centercontent {
		width:100%;
		padding:10px 0 30px 0;
		clear:both;
		border-top:1px solid #ccc;
		}
	#centercontent3 {
		width:100%;
		padding:10px 0 30px 0;
		clear:both;
		}
		
	#centercontent3 h3{
		width:100%;
		padding:0px 0 0px 0;
		clear:both;
		margin-left: -25px;
		}
		
	#centercontent3 h4{
		width:100%;
		padding:0px 0 px 0;
		clear:both;
		margin-left: -155px;
		min-width: 500px;
		}
		
	#centercontent2 h2{
		width:100%;
		padding:0px 0 px 0;
		clear:both;
		margin-left: -2px;
		}
		
	#centercontent3 h5{
		width:100%;
		padding:0px 0 0px 0;
		clear:both;
		margin-left: -25px;
		}

		
	input.passfield{display:block;
		height:20px;
		float:none;
		margin-bottom:20px;
		}
	#passwordform{
		margin:auto;
		width:200px;
		margin-top:30px;}
	#passwordform label{
		display:block;
		float:none;
	}
	#passwordform label2{
		display:block;
		float:none;
	}	
	
	input[name="salasana"] {
		margin-left:0;}
		
	input[name="salasana3"] {
		margin-left:0;}
			
	
	#extralinks {
		padding:20px 0 0 0;
		margin:0;
		clear:both;
		border-left:0px solid #ccc;
		width:100%;
		border-top:1px solid #ccc;
		height:auto;}
	#info, #alertinfo{
		padding:6px 6px 6px 70px;
		width:auto;
		margin:20px 0;
		text-align:left;
		}
	#alertinfo2{
		padding:6px 6px 6px 70px;
		width:auto;
		margin:20px 0;
		text-align:left;
		}
	#alertinfo3{
		padding:6px 6px 6px 70px;
		width:auto;
		margin:20px 0;
		text-align:left;
		}
	#extralinks input[name="salasana2"],#extralinks input[name="logout"] {
		width:100%;}
	#username{clear:both;
		 margin:20px 0 10px 0;
		 padding-top:10px;
		 width:100%;
		 border-top:1px solid #ccc;}
	#logo{
		float:left;
		margin:20px 0 0 0;
		margin-bottom:20px;
		}
		
	#wayfForm label{
		display:block;
		height:20px;
		width:200px;
		float:none;
		margin-bottom:6px;
		margin-left:0px;
	}

}