﻿@import url(muut.css);


html {margin: 0; padding: 0;}
body{margin: 0px; padding: 0px; background: #F7F7F7;}

/***************************************************
				LAYOUT
***************************************************/
#masthead{width:920px;}
#header{margin-left: -1px; height: 50px; width: 919px; background: transparent url(../images/tausta_ylapaa.jpg) top left no-repeat; padding: 15px 0px 0px 40px; font: small Verdana,sans-serif; color: #969696;}
#header a{color: #969696; text-decoration: none;}
#header a:hover{color: #999; text-decoration: underline;}
#nimi{margin-top: -30px; padding: 0; color: #000000; font-weight: normal; border-bottom: 1px solid #dcdcdc;}
#content{width:920px; min-height: 600px; margin: 0 0 0 50px; background: transparent url(../images/tausta_content10.jpg);background-repeat:repeat-y;}
#main{padding: 0px 10px 0px 20px; margin: 0px  0px 0px 10px; width: 660px; height: auto; min-height: 600px; background-color: transparent; float: left; border-right: 1px solid #dcdcdc;}
#main2 {padding: 0px 10px 0px 20px; margin: 0px  0px 0px 10px; height: auto; min-height: 600px; background-color: transparent;width: 88%}
#sidebar{float: right; width: 210px; padding: 20px 0 0 0; font: 12px Verdana,sans-serif; background-color: transparent; height: 100%;}
#sidebar img {border: none;}
#vibes{width: 200px; overflow: hidden;}
#clear {clear: both;}
#footer {font-size: small; color: #505050; width: 898px; text-align: center; height: 40px; padding-top: 5px;
	padding-right: 10px; padding-bottom: 0px; padding-left: 10px; 
background: transparent url(../images/tausta_alapaa.jpg) no-repeat;margin: 0 0 0 50px; border-top: 1px solid #dcdcdc;}
#footer {font-size: 90%; color: #808080;}
#footer a {color: #808080; text-decoration: none;}
#footer a:hover{color: #999; text-decoration: underline;}	
#footer img {border: none;}
#CaptivateContent {
	margin-left:-20px;
	margin-top:20px;
	
	
	}

/******************************************************
OIKEA MENUVALIKKO
******************************************************/
.menu{width: 95%; margin-left:0px; margin-top: 0px;}
.menu .headerbar{background: transparent url(../images/tausta_navi2.gif) no-repeat 2px 2px; 
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size: 12px; margin-bottom: 0; text-transform: uppercase; padding: 10px 5px 10px 5px;}
.menu .headerbar a{text-decoration: none; color: #404040; display: block; text-align:center; font-weight: bold}
.menu ul{list-style-type: none; margin: 0; padding: 0; margin-bottom: 0px;}
.menu ul li{ padding-bottom: 2px; margin: 0 5px 0 5px;}
.menu ul li a{font-family:Georgia, "Times New Roman", Times, serif;background: #F1F1F1; display: block; padding: 1px 0; line-height: 20px;
				padding-left: 5px; text-decoration: none; color: #505050;}
.menu ul li a:visited{color: #404040;}
.menu ul li a:hover{color: #AAAAAA; background: #FFFFFF;}


#alkuun 	 {float: right; margin-top: 20px; margin-bottom: 0px; padding-bottom: 0px; padding-top: 20px; border: none; width: 50px; background: transparent url(../images/arrowup.png) no-repeat bottom right;}
#alkuun p {text-align: right; font-size: 40px; margin-right: -30px; text-align: right; padding: 0 20px 10px 20px; color: #FFFFFF;}


/****************************************************
					Linkit: main 
****************************************************/

#main p a:link, #main2 p a:link {color: #069; text-decoration:underline;}

#main p a:link.out, #main2 p a:link {color: #069; 
text-decoration:underline;
background: transparent url(../images/ikkuna.jpg) top right no-repeat;
}


#main p a:hover, #main2 p a:hover {text-decoration: none;}
#main p a:visited, #main2 p a:visited{color: #069; text-decoration: none;}

#alkuun p a:link	{font-size: 30px; color: #ffffff; padding-top: 0px; margin-top: 20px; text-decoration: none; margin-right: 20px}
#alkuun p a:visited	 {color: #999; text-decoration: none;}
#alkuun p a:hover	 {color: #666; text-decoration:none;}



/****************************************************
			OTSIKOT JA KAPPALEET
****************************************************/

#main h2, #main2 h2 {margin: 1em 0 20px 1em; font-size: 1.6em; font-weight: normal;}
#main h3, #main2 h3 {margin: 1em 0 10px 1em;font-size: 1.4em;font-weight: normal;}
#main h4, #main2 h4{margin: 20px 0 10px 1em; font-size: 1.3em; font-weight: normal;}

#main p, #main2 p {font-family: Arial; font-size: 1em; color: #151515; line-height: 135%;	padding: 5px 20px 0px 20px;}

#sidebar p {font-size: 90%;	line-height: 120% !important; padding: 0 10px 0 10px;; font-family: Arial, Helvetica, sans-serif;}

.suurenna {align:center; color: #54A872;!important}
.suurenna a {text-decoration: none; color:#54A872;}
.suurenna a:hover {text-decoration: underline;color:#33F9;}



/********************************' 
LUETTELO
*********************************/

#main ul, #main2 ul{line-height: 120%;	margin-bottom: 0em;	margin-top: 0em;}
#main li, #main2 li{line-height: 150%;	margin-bottom: 0em; margin-top: 0em; margin-left: 1em;color:#404040; margin-right: 2em; text-align: left !important; font-family: Arial; font-size: 1.05em;}


/********************************' 
	SARAKKEET
*********************************/

#main .sarakkeet {padding-left: 15px;	padding-right: 15px; width: 100%;}
#main .oikea {text-align: left; margin-left: 0px; padding-left: 10px; padding-right: 0px; margin-right: 1px; width: 49%; float: left;}
#main .vasen {text-align: left; margin-left: 1px; margin-right: 1px; padding-left: 0px; padding-right: 0px; width: 49%; float: left; }


/*************************************************
 YLÄLINKINT 
 ************************************************/

#utility{font: 75% Verdana,sans-serif; color: #919999; padding: 0 0 5px 0; margin-right: -40px;	text-align: right;}
#utility a{color: #808080; text-decoration:none;}
#utility a:hover{text-decoration: underline;}


/************************************************** 
SIVUN PÄÄOTSIKKO
**************************************************/

#nimi h1{font: bold 175% Arial,sans-serif; color: #404040; width: 80%; padding-top: 0; padding-right: 0;
padding-bottom: 0; padding-left: 40px;}

/*******************************************************
SIVUN LOGON MÄÄRITYKSET
*******************************************************/
#logo{width: 400px}
#logo img {border: none;}
#logo a {margin: 10px 0 0 50px; display:block;}
#logo a:hover{background: transparent url(../images/lyseo2.gif) no-repeat; margin: 10px 0 0 50px;}
#logo a:hover, h1 a:focus, h1 a:active { 
background: transparent url(../images/lyseo2.gif) no-repeat;}
#logo a:hover img, a:focus img, a:active img  {background: transparent; visibility : hidden;}

/*************************************** 
SIVUN PÄÄNAVIGOINTI 
****************************************/

#globalNav{position: relative; width: 920px; min-width: 400px; height: 40px;
color: #cccccc; padding: 0px; margin: 0 0 25px 50px; 
background-image: url(../images/navi_tausta.gif);
font-size:17px; font-family:Verdana, Geneva, sans-serif; letter-spacing: 0px; word-spacing: -2px;}
#globalNav img{margin-bottom: -4px; border:none;}
#globalLink{position: absolute; top: 8px; height: 22px;	min-width: 640px; padding: 0px; margin: 0px; left: 10px; z-index: 100;}
a.glink, a.glink:visited{color: #636363; font-weight: normal; margin: 0px;
	padding: 2px 5px 4px 5px; border-right: 2px solid #959595; text-decoration:none;}
a.glink:hover{text-decoration: none; color: #333;}
.skipLinks {display: none;}

/**********************************************
PÄÄNAVIGOINNIN ALAVALIKKO
***********************************************/

.subglobalNav{position: absolute; top: 100px; left: 0px; min-width: 800px; height: 20px;
	padding: 20px 0px 0px 100px; visibility: hidden; color: #2a2a2a; font-size:17px; font-family:Verdana, Geneva, sans-serif; letter-spacing: 0px;
	letter-spacing: 1px;}
.subglobalNav a:link, .subglobalNav a:visited {font-size: 80%; color: #2a2a2a; text-decoration:none;}
.subglobalNav a:hover{color: #959595;}


/*******************************************************
		VAIN YHDEN PALSTAN SISÄLÖTBOKSI 
*********************************************************
*/
#kurssibox {border: 2px #778073 solid; background-color:#e0f0db; margin-left: 20%;	margin-right: 20%; margin-top: 20px;}
#kurssibox h2 {	background-color: #b3bfac; margin: 0px; padding: 5px 10px 10px 10px; border-bottom: 2px solid #959d93; font-family:"Myriad","Myriad Pro","Lucida Grande","Lucida Sans Unicode",Verdana; font-size: 160%; color:#343634; letter-spacing: 1px; text-align: center;}
#kurssibox p {color: #2a2a2a; margin: 0px; padding: 10px 5px 10px 20px; 
font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 105%}


.highlight {border: 2px #778073 solid; background-color:#e0f0db; margin-left: 10%;	
margin-right: 10%; margin-top: 20px; }


/*******************************************************************
				Main oikea yläkulma linkki
*******************************************************************/

#floatmenu	{float: right; margin-top: 10px; margin-bottom: 10px; padding: 5px 0 8px 0; font-size: 12px; font-family: arial; border: 1px #E5E5E5 solid;background-color: #F9F9F9; width: 250px;}
#floatmenu ul {list-style-type: none; margin-left: 0px; padding-left: 10px;}
#floatmenu li {list-style-type: none; margin-left: 0px;}
#floatmenu a:link, #floatmenu a:visited {color: #555555; text-decoration:underline;}
#floatmenu a:hover{color: #808080; text-decoration:none;}

/***********************************************
			SISENNYSTYYLI 
***********************************************
*/

.intend1	{margin-left: 40px;}
.intend2	{margin-left: 80px;}
.intend3	{margin-left: 150px;}
.intend4	{align: center;}
.intend5	{margin-left: 40px;	border: 1px solid #EAEAEA;}


/***********************************************
		TAULUKKOTYYLI
***********************************************
*/

.taulukko {border-collapse: separate;}
.taulukko td { border: solid 1px #558040; background-color: #D6E6CF; text-align:center; font-family: Verdana; font-size: .9em;}
.taulukko2 {border-collapse: separate; margin-top: 2em;}
.taulukko2 td {border: solid 1px #558040; padding-left:15px; text-align: left; background-color: #D6E6CF; text-align:left; font-family: Verdana; font-size: .9em;}


/**********************************************************
		AJANKOHTAISTA BOKSI
**********************************************************/

#main2 .ajankohtaista {border: 1px #7b8986 solid; margin: 20px 0 20px 0; background-color: #dee5db;}
#main2 .ajankohtaista h2 {margin: 0px; padding: 0.4ex 0.9ex; border-bottom: 1px solid #A4AAB6; background: #B3BFAC; font-family: "Trebuchet MS"; font-size: 165%; color: #778073; letter-spacing: 0.1em;}
#main2 .ajankohtaista hr {margin-left:10px; margin-right:10px; color:#C0C0C0;}
#main2.ajankohtaista img {margin-right:5px;}
#main2 .ajankohtaistateksti {margin: 0px; margin-top:10px; margin-bottom:5px; padding: 0 1em 0 1em; font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;}
#main2 .letter  {color:#778073; font-size: 220%; float: left; padding: 0 5px 0 5px;}
#main2 .ajankohtaistabottom em {font-size: small; float:right; line-height: 80%; margin: 0px 0px 25px 0; padding: 0 0 20px 0; color:#778073; font-weight: bold;}


/********************************/
/*  TULOSTUS */
/********************************/
@media print {.header-top {width:900px; height:80px; background:rgb(240,240,240); overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}}
@media print {#masthead, #globalNav, #header, #footer, #sidebar {display: none;}}
@media print{#nimi{margin-top: 50px; padding: 0; color: #000000; font-weight: normal; border-bottom: none;}}
@media print {#main {width: 90%; padding: 0; border-right: none; }}
@media print {.nav2 {float:left; width:900px; border:none; background:rgb(240,240,240); color:rgb(75,75,75); font-size:1.0em; font-size:130%;}} /*Color navigation bar normal mode*/
@media print {.main {clear:both; width:900px; padding-bottom:30px; background:transparent;}}
@media print {.main-navigation {display:inline /*Fix IE floating margin bug*/; float:left; width:199px; border-right:solid 1px rgb(200,200,200); border-bottom:solid 1px rgb(200,200,200); background-color:rgb(240,240,240); overflow:visible !important /*Firefox*/; overflow:hidden /*IE*/;}}
@media print {.footer {clear:both; width:900px; height:3.7em; padding:1.1em 0 0; background:rgb(240,240,240); font-size:1.0em; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}}
html {filter: expression(document.execCommand("BackgroundImageCache", false, true));} /*IE proprietary flicker hack for background images. Not validating, but OK*/

