/*VIERITYSPALKKIEN VÄRIT*/ 

/*vierityspalkin värit: ruskea*/ 
html	{ scrollbar-track-color: rgb(235,235,235); 
	scrollbar-arrow-color: rgb(222,227,220); 
	scrollbar-base-color: rgb(56,50,30); }  
 

/*TAUSTAKUVAT JA -VÄRIT*/
/*keskimmäisen päätekstisolun taustakuvamääritys on solumäärityksissä tämän tiedoston lopussa*/

/*taustaväri*/ 
body	{ background-color: #F4F4F4; text-align: left; 
		overflow-x: hidden; overflow-y: auto; } 

/*alkusivun taustakuva, vasen*/
.bgr	{ background-image: url(kuvat/cover.jpg); 
	background-repeat: no-repeat;
 	background-position: 0% 0%; 
	background-attachment: fixed;
 	background-color: #F4F4F4; }

/*muiden sivujen taustakuva, vasen*/
.bgr1	{ background-image: url(kuvat/cover2.jpg); 
	background-repeat: no-repeat; 
	background-position: 0% 0%; 
	background-attachment: fixed; 
	background-color: #F4F4F4; }
 
/*taustakuva, oikea solu*/
.bgr2	{ background-image: url(kuvat/right.jpg); 
	background-repeat: no-repeat; 
	background-position: 100% 0%; 
	background-attachment: fixed; 
	background-color: #F4F4F4; }
 
/*taustakuva, pop-upit*/ 
.bgr3	{ background-image: url(kuvat/pops.jpg);  
	background-repeat: no-repeat;  
	background-position: 50% 0%;  
	background-attachment: fixed;  
	background-color: #F4F4F4; } 

/*CSS-sivun taustakuvaesimerkki solun taustalla, ei taustaväriä*/
.stamp	{ background-image: url(kuvat/ts.png); 
	background-repeat: no-repeat;
 	background-position: 15% 30%;
 	background-attachment: scroll; }
 
 
 
 
/*LINKKIVÄRIT*/ 
 
/*linkkivärit heksadesimaaleina*/
a:link		{ color: #38321E; }
a:visited		{ color: #80579C; }
a:hover		{ color: #787753; }
a:active		{ color: #9A9A82; }
 
 
/*VAIHTOEHTOISET LINKKIVÄRIT*/ 
 
/*linkkivärit heksadesimaaleina esimerkkiin CSS-sivulla, kun kohteelle on tehty tyyliohje .examp*/ 
.examp :link	{ color: #606B5B; }
.examp :visited	{ color: #7B38AD; }
.examp :hover	{ color: #38321E; font-weight: bold; }
.examp :active	{ color: #97A668; font-weight: bold; }
 
.examp		{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; text-align: left; }
 
/*linkkivärit heksadesimaaleina esimerkkiin CSS-sivulla, kun kohteelle on annettu nimi examp*/ 
#examp :link	{ color: #2F8B2D; } 
#examp :visited	{ color: #7B38AD; } 
#examp :hover	{ color: #86A624; font-weight: bold; } 
#examp :active	{ color: #97A668; font-weight: bold; } 

/* ei linkkivärejä eikä alleviivausta, kerran vain Typografia-sivulla Egyptienne-kappaleessa */
#nolink	{ color: #000000; text-decoration: none; }



/*MENU-TYYLIT*/

/* päävalikon tekstit */
.m0l0iout { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: none; padding: 4px; color: #FFFFFF; }
.m0l0iover { font: 10px Verdana, Arial, Helvetica, sans-serif; text-decoration: none; padding: 4px; color: #FFFFFF; }

/* päävalikon tyylit */
.m0l0oout { text-decoration: none; border-width: 0px; background-color: #606B5B; filter: alpha(opacity=70); -moz-opacity: 70%; }
.m0l0oover { text-decoration: none; border-width: 0px; background-color: #7A717E; }


/* alavalikon tekstit */
.m0l1iout { font: italic 9px Arial, Helvetica, sans-serif; text-decoration: none; padding: 4px; color: #000000; }
.m0l1iover { font: italic 9px Arial, Helvetica, sans-serif; text-decoration: none; padding: 4px; color: #000000; }

/* alavalikon tyylit */
.m0l1oout { text-decoration: none; border-width: 0px; background-color: #C2BCC4; filter: alpha(opacity=80); -moz-opacity: 80%; }
.m0l1oover { text-decoration: none; border-width: 0px; background-color: #C2BCC4; }


/* ala-alavalikon tekstit */
.m0l2iout { font: 10px Verdana, Geneva, Arial, Helvetica, sans-serif; text-decoration: none; padding: 4px; color: #000000; }
.m0l2iover { font: 10px Verdana, Geneva, Arial, Helvetica, sans-serif; text-decoration: none; padding: 4px; color: #000000; }

/* ala-alavalikon tyylit */
.m0l2oout { text-decoration: none; border-width: 0px; background-color: #64858A; filter: alpha(opacity=80); -moz-opacity: 80%; }
.m0l2oover { text-decoration: none; border-width: 0px; background-color: #AACBD0; }


  

/*MENUN SIJAINTI*/
.menu	{ position: relative; left: 5; show: visible; top: 0px; z-index: 5; } 


/*PÄIVITYSTIEDOT OIKEASSA SOLUSSA*/
.update	{ line-height: 14px; text-align: left; font-family: Courier New, Courier, monospace; font-size: 7pt; font-style: italic; color: #969696; padding-top: 250px; padding-left: 3px; } 


/*KELLON SIJAINTI*/

.clock	{ text-align: left; margin-top: -15px; margin-left: -18px; }

 
 
 
 
 
/*KAPPALEMÄÄRITYKSET: LEIPÄTEKSTI, HTML + CSS + INTROT, POP-UPIT*/ 
 
/*fontit, leipätekstimääritys ja rivinväli sisältyvät kappalemäärityksiin*/

p		{ line-height:  18px; text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; widows: 3; orphans: 3; } 
.eka		{ line-height:  18px; text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; margin-top: -5px; widows: 3; orphans: 3; } 
.indent	{ line-height:  18px; text-align: left; text-indent: 2.2em; margin-top: 0px; widows: 3; orphans: 3; } 
 
blockquote	{ line-height: 18px; margin-left: 2.2em; margin-right: 15px; margin-top: 0px; padding-bottom: 1px; widows: 3; orphans: 3; } 
 
.lines		{ line-height: 16px; text-align: left; widows: 3; orphans: 3; } 
.ekas		{ line-height: 16px; text-align: left; font-family: Arial, Helvetica, sans-serif; margin-top: 0px; widows: 3; orphans: 3; } 
.indents	{ line-height: 16px; text-align: left; font-family: Arial, Helvetica, sans-serif; text-indent: 2em; margin-top: 0px; widows: 3; orphans: 3; } 
 
 
 
 
/*FONTIT*/ 

/* sivujen alun pääotsikot */
.title	{ font-family: Impact, Arial, Helvetica, Charcoal, sans-serif; font-size: 40pt; font-variant: small-caps; text-decoration: underline; letter-spacing: 0.02em; line-height: 50px; margin-bottom: 20px; padding-top: 10px; text-align: left; color: #939986; } 
.titles	{ font-family: Impact, Arial, Helvetica, Charcoal, sans-serif; font-size: 35pt; font-variant: small-caps; text-decoration: underline; letter-spacing: 0.02em; line-height: 45px; margin-bottom: 20px; padding-top: 10px; text-align: left; color: #939986; } 

/* Ideasta Internetiin -otsikon ylimääräinen ea-kohdan välistys vain IE:llä ja Geckoilla hyvin vähän; ainoa keino säilyttää alleviivaus */
#extra	{ letter-spacing: 0.03em; } 


/*fontit, rivinväli sisältyy kappalemäärityksiin*/ 
.smaller	{ font-family: Arial, Helvetica; font-size: 8pt; } 
.photos	{ font-family: Times New Roman; font-size: 9pt; color: #000000; font-style: italic; line-height: 16px; padding-left: 5px; padding-top: 5px; margin-bottom: 10px; } 
 
/*fontit, harmaa leipäteksti Lorem Ipsum -pop-upissa*/ 
#gray	{ line-height:  20px; text-align: left; widows: 3; orphans: 3;  color: rgb(130,130,130); }  
 
/*pääotsikot */
.kurs	{ font-family: Arial, Helvetica; font-style: italic; font-size: 12pt; color: inherit; margin-top: 0px; padding-top: 25px; } 
 
/*alaotsikot*/ 
.ots	{ line-height: 20px; font-family: Arial, Helvetica; font-style: italic; font-weight: bold; font-size: 9pt; color: inherit; padding-top: 10px; } 

/*vain Ostwald-otsikko, ei enää käytössä*/
.ostw	{ line-height: 20px; font-family: Arial, Helvetica; font-style: italic; font-weight: bold; font-size: 9pt; color: inherit; padding-left: 5px; margin-top: 0px; }
  
/*lähdemainintatekstit Typografia- ja Ideasta Internetiin -sivuilla, Lorem Ipsum -pop-upissa ja värisymboliikkataulukossa*/
.credit	{ font-family: Arial, Helvetica; font-size: 7pt; line-height: 11px; padding-left: 0px; margin-top: 4px; } 
 
 
 
/*PRE-TEKSTI*/ 
 
/*esivalmisteltu teksti*/ 
pre	{ margin-top: 0px; margin-bottom: 15px; font-size: 8pt; }
code	{ line-height: 16px; margin-bottom: 5px; font-size: 8pt; }

 
 
 
/*TEKSTILAATIKOIDEN JA SOLUJEN REUNAVIIVAT*/ 
 
/*reunaviivat*/ 
.box	{ border-style: solid; border-color: #939986; border-width: 1px; padding: 4px!important; } 
.box2	{ border-style: double; border-color: #939986; border-width: 4px; } 

/*reunaviivat + pyöreät kulmat CSS-sivun esimerkissä, määritys on myös sivulla ja tämä koskee Linkkejä ja lähteitä -sivun toista esimerkkiä hiukan pienemmillä kulmilla vain Gecko-selaimilla, myös IE ja Opera ottavat tästä fontin ja reunaviivan mutta ilman pyöristyksiä*/
.rc	{ padding: 5px 15px 10px 15px; font-family: Verdana, serif; font-size: 8pt; line-height: 17px; 
border-style: double; border-color: #939986; border-width: 4px; -moz-border-radius-topright: 1.2em; -moz-border-radius-bottomleft: 1.2em; } 

/*mikä sopii minkä kanssa? -taulukkodiv värisivulla*/
.what	{ border-style: double; border-color: #939986; border-width: 4px; float: left; padding: 0px;  margin: 5px 15px 10px 0px; width: 340px; background-color: #F4F4F4;}


/*REUNAVIIVAT SIVUJEN ALUSSA*/

div#hr	{ border-top-style: solid; border-top-width: 1px; border-color: #AAAAAA; margin-top: -5px; margin-bottom: 10px;}

 
 
 
/*KELLUVAT DIVIT*/ 
 
/*tekstiboxi-div vasemmalle*/ 
.vasen	{ float: left; padding: 2px 7px 5px 15px; margin: 6px 15px 10px 0px; width: 230px; } 
 
/*tekstiboxi-div oikealle*/ 
.oikea	{ float: right; padding: 2px 7px 5px 10px; margin: 6px 0px 10px 10px; width: 230px; } 
 
/*vain Värisyvyys-tekstiboxi-div Väri on valoa -sivulla oikealle*/ 
.debth	{ float: right; margin: 6px 0px 10px 10px; width: 230px; background-color: #F4F4F4; } 
 
/*sisältö-div vasemmalle, koodissa divillä nimi dots*/
div#dots	{ float: left; padding: 15px 10px 10px 0px; margin-right: 15px; margin-bottom: 15px; width: 200px; }  
 
/*Internet- ja galaksikartat, Väri on valoa -sivun alun kuvat ja renderit */ 
.imap	{ float: right; margin: 5px 0px 10px 10px; width: 252px; } 
 
/*koirankorvaesimerkki CSS-sivulla */ 
.curl	{ float: right; margin: 5px 0px 10px 5px; width: 200px; } 
 
/*värisivun neljän valokuvan div oikealle*/ 
.paletit	{ float: right; margin: 10px -5px 15px 10px; } 
 

  
/*suunnittelusivun kehystetyt esimerkkikuvat ja valintaikkunat, kultainen leikkaus ja valon heijastuminen*/
#boxes	{ border-style: solid; border-width: 1px; border-color: rgb(150,150,150); padding: 4px; } 
#right	{ float: right; margin: 3px 0px 10px 10px; width: 210px; } 
#left	{ float: left; margin: 3px 15px 10px 0px; width: 260px; } 
.golden	{ float: left; margin: 5px 15px 10px 0px; width: 208px; }

/* muutaman kuvan toinen reunaviiva väri- ja typosivuilla*/
#bord	{ border-style: solid; border-width: 1px; border-color: #DEDEDE; }

/*Sivuston tiedot -sivun valintaikkuna*/
#win	{ float: right; margin: 4px 0px 10px 10px; width: 150px; } 
 
/*colorpicker-esimerkkikuvat, kirjapainotekniikkavärit*/
#cpright	{ float: right; margin: 5px 0px 10px 15px; width: 360px; }
#cpleft		{ float: left; margin: 5px 15px 10px 0px; width: 360px; }

/*symmetrian ja ryhmittelyn esimerkkikuvat + fraktuura, Vitruvian ja toisten värien vaikutus*/
.tpright	{ float: right; margin: 5px 0px 10px 10px; width: 180px; }
.tpleft		{ float: left; margin: 5px 15px 10px 0px; width: 180px; }

/*laskurilukemakuva*/
.laright	{ float: right; margin: 15px 0px 10px 10px; width: 120px; }

/*värien sointuminen + aoh */
.sright	{ float: right; margin: 0px 0px 10px 10px; width: 159px; }
.sleft	{ float: left; margin: 5px 15px 10px 0px; width: 167px; }



  
/*HOVER-ESIMERKIT CSS-SIVULLA*/

/*teksti-hover -esimerkki, väri heksadesimaalina*/
#ex:hover	{ color: #606B5B; }

/*td-hover -esimerkki*/
td#hov:hover	{ background-color: #C1C6BE; padding: 8px 5px 11px 10px; }



/*KEHYSESIMERKKI HTML-SIVULLA*/
#borders	{ float: left;  margin: 3px 10px 10px 0px; width: 238px; }
.borders	{  border-style: ridge; border-width: 10px; border-color: #C7B9A1; }

/*reunaviiva + pas-partout*/
#pp	{ border-style: solid; border-width: 1px; margin:  8px 7px 15px 9px; border-color: #54483D; background-color: #F4F4F4; } /* viiva ruskea */


 
/*ANFANGIESIMERKIT*/ 
 
/*1. anfangiesimerkki CSS-sivulla; html-koodissa on kohteelle annettu myös nimeksi eka, että ei näkyisi muissa kuin tämän esimerkin eka-classissa; ei toimi Gecko-selaimilla*/ 
.p:first-letter#eka		{ line-height: 20px; text-align: left; font-size: 16pt; font-weight: bold; color: rgb(145,140,99); } 
 
/*2. anfangiesimerkki CSS-sivulla*/ 
#anfang	{ float: left; font-family: Times New Roman, serif; color: rgb(180,180,180); font-size: 70px; line-height: 50px; padding-top: 2px; } 

 
 
/*BORDERKUVAESIMERKIT CSS-SIVULLA*/ 
 
.bord	{ background-image: url(kuvat/borderimg.gif);  
	background-repeat: repeat;  
	background-position: 0% 0%;  
	float: left;  
	margin: 13px 10px 7px 0px; 
	width: 132px;  
	height: 132px; } 
 
.taus	{ background-image: url(kuvat/borderimg2.gif);  
	background-repeat: repeat;  
	background-position: 0% 0%;  
	float: left;  
	margin: 3px 10px 7px 0px; 
	width: 132px;  
	height: 132px; } 
 
div#bord	{ margin: 12px;  
	padding: 6px;  
	background: #F4F4F4; 
	width: 96px;  
	height: 96px; } 
 
 
/*kolmen divin taustat*/ 
.frame1	{ background-image: url(kuvat/fractal.jpg);  
	background-repeat: repeat;  
	background-position: 0% 0%;  
	float: left;  
	margin: 3px 10px 7px 0px; 
	width: 132px;  
	height: 132px; } 
 
.frame2	{ background-image: url(kuvat/fractal2.jpg);  
	background-repeat: repeat;  
	background-position: 0% 0%; 
	margin: 6px; 
	padding-top: 2px; 
	width: 120px;  
	height: 118px; } 
 
.frame3	{ background-image: url(kuvat/fractal3.jpg);  
	background-repeat: repeat;  
	background-position: 0% 0%; 
	margin: 6px; 
	padding-top: 2px; 
	width: 108px;  
	height: 104px; } 
 
div#frame	{ padding: 6px;  
	background-color: #F4F4F4; 
	margin: 6px; 
	padding-top: 2px; 
	width: 84px;  
	height: 82px; } 
 


 
/*KOKO SIVUN TAUSTAN TRANSPARENSSIESIMERKKI TYÖVAIHEET-SIVULLA*/
 .tra	{ filter:alpha(opacity=90); opacity: 0.9; -moz-opacity: 0.9; position: relative; background-color: #F4F4F4; } 

/*TRANSPARENSSIESIMERKKI CSS-SIVULLA EDELLISTÄ PIENEMMÄLLÄ ARVOLLA*/
#tra		{ filter:alpha(opacity=70); width: 58%; position: relative; top: 0; right: 0; opacity: 0.7; -moz-opacity: 0.7; background-color: #F4F4F4; }

/*arvo 100 ei toimi transparentin solun elementeillä, ei käytössä*/
.tra2	{ filter:alpha(opacity=100); opacity: 1; -moz-opacity: 1; position: relative; background-color: #F4F4F4; } 
 

/*ASEMOINTIESIMERKKI 1 CSS-SIVULLA*/
#outer1	{ float: right; width: 200px; margin: 15px 0px 10px 10px; }
#middle1	{ float: right; position: relative; top: -0.9em; right: 2em; z-index: 5; }
#inner1	{ padding:  0px 5px 0px 10px!important; }

/*ASEMOINTIESIMERKKI 2 CSS-SIVULLA*/
#outer2	{ float: right; width: 200px; margin: -2.1em 0px 10px 10px; }
#middle2	{ position: relative; top: 1.55em; left: 5em; z-index: 5; }
#inner2	{ padding: 0px 5px 0px 10px!important; }



/*PYÖRISTETYT KULMAT, ESIMERKKI 1 CSS-SIVULLA*/

/* common tags for rounded corners that can be used for many panels */
b.Rnd1	{ margin: 0 5px; }
b.Rnd2	{ margin: 0 3px; }
b.Rnd3	{ margin: 0 2px; }

/* container one */
/* adjust the position, size and colour of the panel here */
div.ContainerOne 	{ position: relative; top: 0px; left: 0px; width: 100%; height: 100px; background-color: #95998D; } 

/* adjust the minimum height of the panel here for mozilla only */
div[class="ContainerOne"] 	{ height: auto; min-height: 100px; }

 /* adjust the colour of the panel top and bottom here */
b.RndTopOne b, b.RndBottomOne b		{ display: block; height: 1px; overflow: hidden; background-color: #95998D; }

/* adjust the background colour here */
b.RndTopOne, b.RndBottomOne	{ display: block;background-color: #F4F4F4; } 

/* adjust the content width (to be slightly less than the panel width to get a margin), height and text alignment of the content here */
div.RPanelContentOne 	{ position: relative; top: 0px; left: 0px; display: block; margin:  0 auto; margin-top: 10px; margin-bottom: 10px; width: 96%; height: 100px; text-align: left; color: #FFFFFF; padding: 10px; } 

/* adjust the minimum height of the panel here for mozilla only */
div[class="RPanelContentOne"] 	{ height: auto; min-height: 100px; } 

b.RndTopOne b.Rnd4, b.RndBottomOne b.Rnd4	{ margin: 0 1px; height: 2px; }


/*PYÖRISTETYT KULMAT, ESIMERKKI 2 CSS-SIVULLA */
b.rtop, b.rbottom		{ display: block; background: #F4F4F4; }
b.rtop b, b.rbottom b	{ display:block; height: 1px; overflow: hidden; background: rgb(225,225,225); }
b.r1	{ margin: 0 5px; }
b.r2	{ margin: 0 3px; }
b.r3	{ margin: 0 2px; }
b.rtop b.r4, b.rbottom b.r4	{ margin: 0 1px; height: 2px; }


 
 
/*LUETTELOMERKIT + YLÄ- JA ALAINDEKSIT + LISÄTILAA OTSIKKOKUVAN ALLE (lisätila ei enää käytössä)*/
 
/*luettelomerkkikuva sivujen alun hakemistoihin, ruskea*/ 
.dot	{ list-style: url(kuvat/dotff.png); list-style-position: outside; line-height: 18px; margin-left: -10px; margin-bottom: 5px; margin-top: 0px; } 
 
/*luettelomerkkikuva linkkisivun alun hakemistooon, ruskea*/ 
.dot2	{ list-style: url(kuvat/dotff.png); list-style-position: outside; line-height: 20px; margin-left: 5px; margin-top: 10px; }  

/*luettelomerkkikuvaesimerkki css-sivulla*/
.dot3	{ list-style: url(kuvat/dotop.png); list-style-position: outside; line-height: 18px; margin-left: 5px; margin-bottom: 12px; margin-top: 0px; }
 
/*oletusarvoiset luettelomerkit sivujen alun hakemistojen ja suunnittelusivun lopun muistilistan sisennettyihin ulleihin */
.sis	{ margin-top: 0px; margin-left: 14px; } 
 
/*oletusarvoisten luettelomerkkien rivinväli html- ja css-sivulla*/ 
ul#space	{ line-height: 18px; padding-top: 10px; } 
ol#space	{ line-height: 18px; padding-top: 10px; } 
 
/*oletusarvoiset luettelomerkit värisymboliikkataulukkoon*/ 
ul#colors		{ margin-bottom: -3px; padding-left: 0px; list-style-type: circle; } 
 
/*luettelomerkkikuva vain värisivun leipätekstin luetteloihin, ruskea*/ 
.dots	{ list-style: url(kuvat/dotff.png); outside; line-height: 20px; margin-top: 0px; padding-bottom: 10px; padding-left: 4em; } 
 
/*numeroitu luettelomerkki kielioppisivun luetteloissa, Työvaiheet-, Sivuston tiedot- ja html-sivuilla*/ 
ol	{ line-height: 18px; padding-left: 4em; } 
 
/*sisennetyt luettelomerkit Työvaiheet-sivulla, ei tarvita Geckoilla 
ul#circle	{ list-style-type: circle; padding-bottom: 5px; } */ 
 
/*ylä- ja alaindeksit*/
sup	{ font-family: Arial, Helvetica, sans-serif; font-size: 6pt; line-height: 13px; }
sub	{ font-family: Arial, Helvetica, sans-serif; font-size: 6pt; line-height: 13px; }
 




/*POP-UPEISSA*/

/*hiukan kielpioppia -pop-upin leipätekstin sisennykset diveissä*/
#sis	{ padding: 0px 5px 0px 8px; }

/*hiukan kielioppia -pop-upin korostusvärit */
#col	{ background-color: #E8E6AE; }




 
/*TAULUKOT*/ 
 
/*taulukoiden solujen harmaa taustaväri*/
.c	{ vertical-align: top; text-align: left; background-color: rgb(235,235,235); } 

/*otsikkosolujen tausta negatiivisine fontteineen linkkisivulla*/
.bg	{ text-align: left; vertical-align: top; 
	background-image: url(kuvat/bar.jpg); background-position: left; background-repeat: repeat; 
	font-family: Arial, Helvetica, sans-serif; font-size: 9pt; color: #FFFFFF; font-weight: bold; 
	border-style: solid; border-color: #AE97BC; border-width: 1px; padding: 4px!important; }

 

/*ERIKOISMERKKITAULUKKO TYÖVAIHEET-SIVULLA*/

/*erikoismerkkien koko vain Työvaiheet-sivulla, merkki*/
.spec		{ vertical-align: top; padding: 4px 3px 2px 10px; font-family: Arial, Helvetica, sans-serif; font-size: 12pt; line-height: 17px; width: 25%; }

/*vain erikoismerkkitaulukkoon Työvaiheet-sivulle, koodi*/
.cell25		{ width: 25%; text-align: left; vertical-align: middle; padding: 7px; font-family: Arial, Helvetica, sans-serif; font-size: 9pt; }



/*AALLONPITUUSTAULUKKO VÄRI ON VALOA -SIVULLA*/

/*solut aallonpituustaulukossa */
.pad	{ vertical-align: top; text-align: left; padding: 3px; width: 50%; } 

/*uloin div aallonpituustaulukossa */
.wl	{ float: left; margin: 5px 15px 10px 0px; background-color: #F4F4F4; padding: 0px 7px 13px 5px; width: 230px; border-style: double; border-color: #939986; border-width: 4px; }




/*SOLUT*/

/*keskimmäinen päätekstisolu*/
.cell	{ vertical-align: top; text-align: left; width: 70%; padding: 30px 20px 40px 40px; border-style: dotted; border-color: #AEAEAE; border-width: 1px; 
background-image: url(kuvat/popsm.jpg); 
	background-repeat: no-repeat;
 	background-position: 70% 100%;
 	background-attachment: fixed; 
	background-color: #F4F4F4; } 

/*solu, jonka sisään on tehty taulukko*/
.nopad	{ vertical-align: top; text-align: left; padding: 0px; }
 
 

/* perussolut prosenttia taulukon leveydestä */
.c15	{ width: 15%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* puheviestintämalli */
.c20	{ width: 20%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* puheviestintämalli, yhdyssanat, värisymboliikka, fonttien yhteensopivuus, yhdyssanat, CSS-sivun kapeammat solut */
.c25	{ width: 25%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* puheviestintämalli */
.c30	{ width: 30%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* 2-sarakkeiset pop-upit, lukusanojen taivutus, puhelinnumerot, CSS-sivun kapeammat solut */
.c35	{ width: 35%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* värisymboliikka */
.c40	{ width: 40%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* yhdyssanat */
.c45	{ width: 45%; text-align: left; vertical-align: top; padding: 4px 5px 15px 4px; }	/* hiukan kielioppia, sanoja, värisymboliikka */
.c50	{ width: 50%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* hiukan kielioppia + alun sisältötaulukko, linkkisivu, CSS-sivun leveämmät solut */
.c55	{ width: 55%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* hiukan kielioppia, sanoja */
.c60	{ width: 60%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* puheviestintämalli */
.c70	{ width: 70%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* 2-sarakkeiset pop-upit, lukusanojen taivutus, puhelinnumerot, alkusivun päätekstisolu */
.c80	{ width: 80%; text-align: left; vertical-align: top; padding: 4px 10px 15px 4px; }	/* HTML-sivun leveämmät solut */