/**************************************************
 *  Sisältää Smallville-fi:n ulkoasun tyylitiedot *
 *  Desing by Lari <lari89@gmail.com>             *
 *  Ethän kopioi luvatta!                         *
 **************************************************/
* {
	padding: 0;
	margin: 0;
	font-family: Helcetica, Arial, Sans-serif;		
}	
body {				
  margin: 0px;				
  font-size: 12px;	
  color: #fff;							
  background-color: #14212f;
  font-family: Helcetica, Arial, Sans-serif;
  
  /* Tämä tarvitaan dropdown-menua varten 
  Löytyy osoitteesta http://www.xs4all.nl/~peterned/csshover.html */
  behavior: url(csshover.htc);			
}	

/* Linkkien värit */		
a:link    { color: #fff; }	
a:visited { color: #fff; }	    
a:hover   { color: #999; }			
a:active  { color: #999; }

#side a:link    { color: #fff; }
#side a:visited { color: #fff; }
#side a:hover   { color: #ccc; }
#side a:active  { color: #ccc; }
			
img { border:0;margin:0;padding:0; }
strong { font-weight: bold; }
span { font-size: 12px; }

#pohja {
  margin: 0;				  
  margin-left: auto;			  
  margin-right: auto;			  
  width: 750px;			  
  background-color: #14212f;			  
  border: 0;			  			  
  padding: 0;		
}

#header {
  float: left;
  width: 750px;
  height: 200px;  
  background-image: url(kuvat/header.jpg);
  background-repeat: no-repeat;
  background-position: bottom;
}

/* Smallville-Fi otsikko (kuvana) */
h1 {
  margin-top: 143px;
  margin-left: 15px;
  float: left; 
}


/* Otsikot */			
h2, h3, h4 {			
  text-align:center;			
  font-size: 12px;
  font-family: Arial, Verdana, "Century Gothic";			
  color: #fff;
  padding-top: 4px;			
}
th h4 {
  padding-top: 0;
}


			

/* Yleiset taulukoiden määritykset */
table {			  			  
  border-collapse: collapse;			
}		
table td {			  
  vertical-align: middle;	
  font-size: 12px;		
}






	
/* Päävalikko (punainen palkki) */			
#mainmenu {	
  width: 750px;
  height: 52px;
  float: left;
  background-image: url(kuvat/mainmenu.gif);
  background-repeat: no-repeat;			
  border: 0;
  margin: 0;
  padding: 0;			
}			
#mainmenu ul {				
  list-style: none;				
  border-left: 1px solid #3c4f6b;
  border-right: 1px solid #222c3b;
  height: 31px;
  width: 560px;
  padding: 0;
  margin: 0;
  margin-left: auto;
  margin-right: auto;			
}					
#mainmenu li {			  	
  margin: 0;
  padding: 0;				
  float: left;		
}		
#mainmenu li a {
  float: left;
  font-size: 12px;
  color: white;
  text-decoration: none;
  padding: 8px 0 8px 0;
  margin: 0;
  width: 110px;
  text-align: center;
  border-left: 1px solid #222c3b;
  border-right: 1px solid #3c4f6b;
  background-image: none;	
}
#mainmenu li a:hover {
  background-image: url(kuvat/mainmenu_hover.gif);
  background-repeat: repeat-x;
}




/* dropdown-menu */
#submenu {
	float: left;
	clear: both;
	width: 142px;
	height: 190px;
	background-image: url(kuvat/submenu.gif);
	background-repeat: no-repeat;	
	padding: 0 0 0 7px;
	margin: 0 0 4px 0;
}			
#submenu ul {	
  border: 0;			
  list-style: none;				
  width: 140px;
  margin-top: 4px;	
  margin-left: 1px;		
}
#submenu ul.first,
#submenu ul.second {
  border-right: 1px solid #0c1726;
  border-left: 1px solid #0c1726;
  margin-left: 0;
}
#submenu ul a, #submenu ul a:visited {				
  color: #fff;				
  text-decoration: none;				
  display: block;				
  padding: 5px 0 5px 10px;				
  width: 130px;				
  background: #00101d;
  border:0;			
  border-bottom: 1px solid #0c1726;
}				
#submenu ul li a:hover {				
  color: #fff;				
  text-decoration: none;				
  background-color: #0c1726;			
}	
#submenu ul li {			  					
  float: left;				
  position: relative;			
}	
#submenu ul li ul, #submenu ul li ul li ul {				
  list-style: none;				
  position: absolute;				
  left: 140px;				
  top: -1px;				
  display: none;				
  width: 140px;				
  border: 1px solid #0c1726;				
  border-bottom:0;
  margin: 0;			
}			
#submenu ul li ul li, #submenu ul li ul li ul li {								
  margin-bottom: 0;
  border-right:0;			
}		
#submenu ul li:hover ul.first, #submenu ul li ul li:hover ul.second { display: block; }







/* - */
#content {
  float: left;
  width: 750px;
  padding-bottom: 10px;
  background-color: #1c293c;
}


/* Vasemman laidan pikkulaatikot */
#side {
  float: left;
  display: block;
  clear: none;
  width: 149px;
}
div.sidebox {
  width: 142px;
  float: left;
  margin-left: 7px;
  clear: both;
  margin-top: 1px;
}
div.sidebox .title {
  background-image: url(kuvat/boxtitle.gif);
  background-repeat: repeat-x;
  height: 25px;
}
div.sidebox .title a:hover {
  color: #999;
} 
div.sidebox .smalltitle {
  background-color: #0c1723;
  padding-bottom: 3px;
}
div.sidebox .content {
  text-align: center;
  padding: 5px 0 5px 0;
  background-color: #0c1723;
  border: 1px solid #2e4362;
  color: #fff;
  font-size: small;
}
div.sidebox .content p {
  font-size: 12px;
  line-height: 150%;
  color: #fff;
}
div.sidebox .content p.center {
  text-align: center;
}


/* Varsinainen sisältö */
#page {
  clear: none;
  float: left;
  display: block;
  width: 600px;
  margin-top: 4px;
}
div.box {
  float: left;
  width: 587px; 
  border-left: 6px solid #1c293c;
  margin-bottom: 15px;
}
div.box .title {
  background-image: url(kuvat/boxtitle.gif);
  background-repeat: repeat-x;
  height: 25px;
  border: 0;
  float: left;
  width: 587px;
  border-top: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
}
div.box .smalltitle, div.box .smalltitle2, div.box .smalltitle3 {
  background: #2e435b;
  padding: 0 0 4px 0;
  border-top: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
  float: left;
  width: 587px;
}

/* Näitä käyttämällä vältytään joissain paikoissa tupla-borderilta */
div.box .smalltitle2 { border-top: 0; }
div.box .smalltitle3 { border-bottom: 0; }

div.box .bigtitle {
  padding: 0 0 4px 0;
  margin: 0;
  border: 0;
  background: #2e435b;
  width: 587px;
  float:left;
}
div.box .bigtitle h2 {
  color: #fff;
  background: #2e435b;
  font-size: 16px;
}
div.box .content {
  background-color: #2e435b;
  color: #fff;
  float: left;
  width: 587px;
}
div.box p {
  padding: 5px;
  font-size: 12px;
  line-height: 150%;
  color: #fff;

}
div.box p.center {
  text-align: center;
}
div.box img.top {
  float:left;
  border:0;
  margin:0;
  padding:0;
}
/* tekstien seassa olevat kuvat, vasemmalle tai oikealle */
div.box .content .imageleft {
  margin: 5px 10px 5px 10px;
  float: left;
}
div.box .content .imageright {
  margin: 5px 10px 5px 10px;
  float: right;
}


/* Yksilölliset taulukoiden määritykset */
#supervoimat, #muutmaat, #kirjepaperit, .sivuroolit, .jaksolista, .visitors {
  width: 587px;
  border: 0;
  float: left;
}

/* etusivun seuraavat jaksot */
#seuraavatjaksot {
  border: 0;
  width: 587px;
}
#seuraavatjaksot td.col1 {
  width: 100px;
  border-right: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
  padding: 5px;
  vertical-align: middle;
}
#seuraavatjaksot td.col2 {
  border-bottom: 1px solid #1c293c;
  padding: 5px;
  vertical-align: middle;
  text-align: left;
}

/* kävijätilastot historia-sivulla */
.visitors td {
  width: 25%;
  text-align: center;
  vertical-align: middle;
  border-left: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
}

/* supervoimien kuvat ja kirjepaperit */
#supervoimat td, #kirjepaperit td {
  vertical-align: middle;
  text-align: center;
  width: 50%;
  border: 0;
  border-left: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
  padding: 4px;
}

/* linkit-sivun muut maat */
#muutmaat td {
  vertical-align: middle;
  text-align: center;
  width: 25%;
  border: 0;
}

/* sivuroolit */
.sivuroolit td {
  width: 33%;
  text-align: center;
  vertical-align: middle;
  border: 0;
  border-left: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
}

/* taulukoiden otsikot */
.jaksolista th, #kirjepaperit th, .visitors th {
  background-image: url(kuvat/boxtitle.gif);
  background-repeat: repeat-x;
  height: 25px;
  border: 0;
  border-left: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
  vertical-align: middle;
  text-align: center;
}
th.nimi { width: 250px; }
th.usa { width: 140px; }
th.suomi { width: 197px; }
.world-tv th {
  height: 25px;
  border: 0;
  border-left: 1px solid #1c293c;
  vertical-align: middle;
  text-align: center;
}

/* Maailman tv-aikataulu */
.world-tv {
  width: 587px;
}
.world-tv td {
  width: 25%;
  border-left: 1px solid #1c293c;
  border-top: 1px solid #1c293c;
  padding: 2px 5px 2px 5px;
}

/* jaksolista */
.jaksolista td {
  vertical-align: middle;
  text-align: center;
  border: 0;
  border-left: 1px solid #1c293c;
  border-bottom: 1px solid #1c293c;
  height: 20px;
}



/* Sivukartta */
#sitemap ul {
  padding: 5px 0 5px 20px;
}



/*  Ala-palkki, copyright yms. */
#footer {
	float: left;
	height: 25px;
	width: 750px;
	margin-bottom: 40px;
	background-image: url(kuvat/footer.gif);
	background-repeat: no-repeat;
	background-position: bottom;
	text-align: center;
}
#footer p {
  color: #ccc;
  text-align: center;
  padding: 5px 10px 5px 10px;
  line-height: 15px;
}
#footer a,
#footer a:link,
#footer a:visited {
  color: #ccc;
}
#footer a:hover,
#footer a:active {
  color: #fff;
}





/*  Korjaukset IE:tä varten */
* html #page {
  float: right;
}
* html div.sidebox {
  margin-left: 4px;
}

/* IE 5.5:sta alaspäin */
@media tty {
  i{content:"\";/*" "*/}}@m;
#submenu ul { width: 142px; } 
#submenu ul a, #submenu ul a:visited { width: 140px; }
#mainmenu ul {margin-left:100px;width:552px;} /*";}
}/* */

/* Vanhemmat Operat menee edellisestä sekasin, siksi tämä */
html>body #mainmenu ul {
  	margin-left: auto;
	width:560px;
}