/* "Easy Clearing Method" */

/* Firefox/Safari/Opera */
.clear:after {
  content: ".";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden;
}

/* IE7 */
.clear {
  min-height: 1px;
}

/* IE5&6 */
* html .clear {
  height: 1px;
}

/* Body style */
body {
  font-family: Arial, sans-serif;
  font-size: 62.5%;
  margin: 0;
  padding: 0;
  background-color: white;
  background-image: url(../images/bg.png);
  background-repeat: repeat-x;
  background-position: left top;
  text-align: center;

}

#wrapper {
  width: 790px;
  margin: 15px auto;
  background-color: white;
  border: 1px solid #888888;
  text-align: left;
  font-size: 1.3em;
}

#banner {
  width: 760px;
  height: 154px;
/*  margin: 15px auto 0 auto; */
  margin: 15px 15px 0 15px;
  background: #ddd url(../images/logo.png) no-repeat center top;
  text-align: left;
  border: 1px solid #dddddd;
}

#nav li {
	display: inline;
	list-style-type: none;
/*	padding: 0px;
	margin: 0;*/
  background: #00457c;
}

#nav a {
	display: block;
	float: left;
  font-family: Verdana, Arial, sans-serif;
	font-size: 0.8em;
	color: white;
	text-decoration: none;
  text-transform: uppercase;
	background-color: #00457c;
	padding: 6px 5px 4px 5px;
/*	width: 8em; */
	margin-left: 2px;
/*	border-right: 1px solid #73AFB7;
	border-bottom: 1px solid #73AFB7; */
	margin-bottom: 2px;
	font-weight: bold;   
}

#nav a:hover {
	background: #20659c;
/*	border-right: 1px solid #14556B;
	border-bottom: 1px solid #14556B; */
	color: #FBEF99;
}
#nav {
	margin-top: 10px;
  height: 25px;
  background: #00457c;
}

#main {
/*  height: 100%; */
  margin-top: 0px;
  margin-left: 15px;
  margin-right: 15px;
  margin-bottom: 10px;
  background-image: url(../images/ruudut.jpg);
  background-color: white;
  background-repeat: repeat-y;
}

#main h1 {
  font-size: 1.5em;
}

#main h2 {
  font-size: 1.3em;
}

#main p {
  font-size: 0.9em;
}

#leftside {
  float: left;
  width: 175px;
}

#leftnav {
}

#leftnav p {
  width: 175px;
}

#leftnav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  width: 175px;
  border-bottom: 1px solid white;
  background-color: #ccc; 
} 

#leftnav li {
}

#leftnav a {
  text-decoration: none;
  color: white;
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.9em;
  text-transform: uppercase;
  border: 1px solid white;
  border-bottom: none;
  display: block;
  padding: 7px 5px 7px 15px;
/*  background: #e7e7e7; */
}

#leftnav ul ul a {
  padding: 7px 5px 7px 30px;
}

#leftnav a:hover {
/*  font-weight: bold; */
  background: #82c501;
}

/* Perusvärit */

.sininenbg      { background-color: #00457c; }
.keltainenbg    { background-color: #fdc300; }
.vaaleavihreabg { background-color: #71974c; }
.tummavihreabg  { background-color: #006a66; }
.punainenbg     { background-color: #982648; }
.lilabg         { background-color: #8e0062; }
.turkoosibg     { background-color: #4e8ea9; }
.ivfbg          { background-color: #e09f49; }

.harmaabg       { background-color: #444444; }


/* IE Fixes for #leftnav */
 
/* remove annoying gaps */
#leftnav li { 
  display: inline; 
}
 
/* force hover on entire width of  link */
* html #leftnav a {
  height: 1px;
}

#left {
  width: 165px;
/*  border: 1px dashed #ccc;*/
  padding: 5px;
  margin-top: 10px;
}

#left p {
  color: #333;
  margin-top: 5px;
  margin-bottom: 0px;
}

#center {
  margin-top: 10px;
  margin-left: 180px;
  /*border: 1px dashed #ccc; */
  padding-top: 2px;
}

#maintext {
  margin: 10px;
}

#maintext p {
  font-size: 1em;
}

#right {
  float: right;
}

#paivitetty {
  text-align: right;
  font-style: italic;
  font-size: 0.9em;
  color: gray;
}

#paivitetty p {
}

#bottom {
  clear:both;
  width: 100%;
  text-align: center;
  background-color: #00457c;
  color: white;
  border: 1px solid #888;
  margin: 0px;
  padding: 0px;
}

#bottom p {
  margin: 0px;
  padding: 0px;
  padding-top: 3px;
  padding-bottom: 3px;
}