/* rakenne pohjautuu tähän: http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm  */
/* General styles */
  
  body {
        margin:0;
        padding:0;
        border:0;			/* This removes the border around the viewport in old versions of IE */
        width:100%;
        background:#fff;
        min-width:600px;    /* Minimum width of layout - remove line if not required */
							/* The min-width property does not work in old versions of Internet Explorer */
		font-size:90%;
    }


	/* Header styles */
 
#header {
text-align: center;
height: 159px;
margin-bottom: 6px;
background: white url(Kuvat/njs_bannerinpohja_1800.jpg) left no-repeat;
}


#otsikkopalkki {
  position:absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 159px; }


 div#vasenbanneri {
  position:absolute;
  top: 0px;
	}

 div#oikeabanneri {
  top: -50px;
  float:right;
	}


	/* column container */
	.colmask {
		position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	    clear:both;
	    float:left;
        width:100%;				/* width of whole page */
		overflow:hidden;		/* This chops off any overhanging divs */
	}
	/* holy grail 3 column settings */
	.holygrail {
/*	    background:#ff9;  */   	/* Right column background colour */
	}
    .holygrail .colmid {
        float:left;
        width:200%;
        margin-left:-170px; 	/* Width of right column;  oli -200px*/
        position:relative;
        right:100%;
        background:#fff;    	/* Centre column background colour */
    }
    .holygrail .colleft {
        float:left;
        width:100%;
        margin-left:-50%;
        position:relative;
        left:340px;         	/* Left column width (colmid: margin-left:) + right column width (col1wrap:right:); oli 400px */
/*        background:#FFD8B7;   */ 	/* Left column background colour */
    }
    .holygrail .col1wrap {
        float:left;
	    width:50%;
	    position:relative;
	    right:170px;        	/* Width of left column;  oli 200px */
	    padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
	}
	.holygrail .col1 {
        margin: 0 185px;     	/* Centre column side padding:
                            	Left padding = left column width (col2:right:) + centre column left padding width 
                            	Right padding = right column width (col1wrap:right:) + centre column right padding width
                            	oli :0 215px*/
        position:relative;
	    left:200%;
	    overflow:hidden;
	}

.holygrail .col2 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:160px;        	/* Width of left column content (left column width minus left and right padding) oli 170px */
        position:relative;
        right:5px;         	/* Width of the left-had side padding on the left column; oli 15px; jos lisäät arvoa, vasemman palstan vasen marginaali kapenee!! 25 px = muutama pikseli reunasta */
    }

.holygrail .col3 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:160px;        	/* Width of right column content (right column width minus left and right padding)  oli 170px */
        margin-right:10px;  	/* Width of right column right-hand padding + left column left and right padding oli 45px */
        position:relative;
        left:50%;
    }


p { 
    margin-left:2px;
    font-size: 0.9em; /*oli: 0.8em;*/
    margin-right:2px;
    margin-bottom:2px;
    text-align: left;
    padding:0px;
    line-height:1.1em;
    font-family: Verdana,Helvetica,Arial,sans-serif;
	color: #036; /*  oli: #000 */
    }
    
h2 { font-size: 1.5em;
    text-align: center;
	color: #036;
	background-color: #ddd;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-weight: bold;
    }

h3 { font-size: 1.2em;
    text-align: center;
	color: #036;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-weight: bold;
    }

h4 { font-size: 1.0em;
    text-align: left;
	color: #036;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-weight: bold;
    }
    
h5 { font-size: 0.6em;
    text-align: left;
	color: #036;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-weight: bold;
    }

h5.keskelle {
    text-align: center;
    }

#menu {
	list-style-type:none;
	border:1px solid #fff;
	margin:5px;
	padding:5px;
}

.col2 p {
    text-align: center;
    font-family: Verdana,Helvetica,Arial,sans-serif;
	color:#036;
	margin:1px;
    font-size: 0.9em;
    font-weight: bold;
/*	padding:2px;*/
}

.col2 h2 {
	background-color:#fff; /*oli:#c33 */;
}

#fixtaulukko {
	width: 154px;
	margin: 1px; 
	background-color: #036;
	font-size: 0.8em;
	text-align: left;	
    font-family: "Courier New",Courier,monospace;
    font-weight: bold;
	color: #ff3;
    padding: 4px;
    margin-top: 10px;
/*	border:1px solid #fff; */
	} 

#rightRail h2 {
    text-align: center;
    color: #036;    
	background-color: #fff;
	margin:0px;
	padding:0px;
}

#rightRail a {
    text-align: center;
    color: #fff;    
}

#rightRail h3 {
    text-align: center;
    color: #036;    
	margin:3px;
	padding:2px;
}

#rightRail h4 {
    text-align: center;
    color: #ff3;
	margin:3px;
	padding:2px;
}

#rightRail h5 {
    text-align: center;
    color: #ff3;    
	margin:3px;
	padding:0px;
}

.article {
	border:1px solid #036;
	margin-bottom:10px;
	overflow:hidden;
}
* html .article {
	height:1%; /* So IE plays nice */
}

.article p {
	padding-bottom:3px;
	margin:2px;
	margin-left:10px;
}
   
.article h2 {
	margin-top:0px;
	font-size: 1.4em;	
}

.article h3 {
	margin-top:0px;
	font-size: 1.5em;	
}

.article h4 {
	margin-top:5px;
font-size: 1.0em;
margin-left:14px;
}

.otsikkopalkki {
	border:1px solid #036;
	overflow:hidden;
	margin-bottom:10px;
}
* html .otsikkopalkki {
	height:1%; /* So IE plays nice */
}

.otsikkopalkki h2 {
	margin-top:0px;
	font-size: 1.6em;	
	margin-bottom:0px;
}

.oikealle {
	padding:2px;
	padding-top:6px;
	padding-bottom:6px;
	padding-left:4px;
	overflow: hidden; /*IE6 ylivirtabugi hoitoon*/
	float:right;
	}

.vasemmalle {
	padding:2px;
	padding-top:6px;
	padding-bottom:6px;
	padding-right:4px;
	overflow: hidden; /*IE6 ylivirtabugi hoitoon*/
	float:left;
	}

#joukkue {
	border:2px solid #fff;
	float: left;} /*tällä joukkuekuva asetaan taulukon vasemmalle puolelle */

#table { 
     width:100%;
	margin-left: auto; 
	margin-right: auto;
	border:1px solid #fff;
	font-size: 0.9em;
	color: #ff3;
    font-family: Verdana,Helvetica,Arial,sans-serif;
	text-align: center;	}

.pelaajaluettelo td, th {
    text-align: center;
    font-size: 1.0em;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-weight: bold;
    color: #036;    
	padding:7px;
}

.pelaajaluettelo {
margin-left: auto;
margin-right: auto;
}

#pelilista td, th {
	text-align: center;	
	font-size: 0.9em;
    font-family: Verdana,Helvetica,Arial,sans-serif;
 /*   font-weight: bold; */
    color: #036;    
    padding: 7px;
/*	border:1px dotted #036; */
}

#yhteys td, th {
	text-align: center;	
	font-size: 0.9em;
    font-family: Verdana,Helvetica,Arial,sans-serif;
 /*   font-weight: bold; */
    color: #036;    
    padding: 7px;
/*	border:1px dotted #036; */
}

#yhteys th {
 font-weight: bold; 
}

#yhteys {
margin-left: auto;
margin-right: auto;
}

	/* Footer styles */
#footer {
 	background-color:#036;
       clear:both;
        float:left;
        width:100%;
    }

 #footer p {
    text-align: center;
    font-size: 0.8em;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-weight: bold;
    color: #ff3;    
}

.linkki img {border:0px}

.linkki {border:0px}

.linkki:hover {border:0px}

/*tästä alkaa listan kesytys valikoksi */

#leftRail ul {
    font-family: Verdana,Helvetica,Arial,sans-serif;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 160px; /* Width of Menu Items */
	border-bottom: 1px solid #ccc;
	}
	
#leftRail ul li {
	position: relative;
	}
	
#leftRail li ul {
	position: absolute;
	left: 159px; /* Set 1px less than menu width */
	top: 0;
	display: none;
	}

/* Styles for Menu Items */
#leftRail ul li a {
	display: block;
	text-decoration: none;
    font-weight: bold;
    font-size: 0.8em;
	color: #ff3;
	background: #036; /* IE6 Bug */
	padding: 5px;
	border: 1px solid #ccc; /* IE6 Bug */
	border-bottom: 0;
	}
	
/* Holly Hack. IE Requirement \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */

#leftRail ul li a:hover { 
color: #fff; background: #000; } /* Hover Styles */

#leftRail li ul li a { padding: 2px 5px; } /* Sub Menu Styles */

#leftRail li:hover ul, li.over ul { display: block; } /* The magic */

/*  menujen peruste: http://www.alistapart.com/articles/horizdropdowns */