
  /*
  *
  *  Kyrös-Rasti css-tyylitiedosto 2010
  *
  *  Tyylitiedoston perusteet on tehnyt Matti Laatikainen (http://www.desertive.net/)
  *
  *  Tätä sivua muuttamalla saat välittömästi muutettua sivuston tyylitiedostoa
  *  Jos muutokset eivät miellytäkkään, voit aina kopioida ´Alkuperäinen tyylitiedosto´
  *  kohdasta alkuperäisen tyylitiedoston takaisin.
  *
  *  Tyylitiedosto on muodostettu mahdollisimman paljon tyyliin että ylimpänä olevat
  *  määritteet ovat sivun ylälaidassa ja alimpana olevat määritteet sivun alalaidassa,
  *  jolloin määritteiden etsiminen helpottuisi.
  *
  *  Jos haluat esimerkiksi tehdä normaalille sivulle (html-sivulle) tietynlaista tekstiä,
  *  kirjoita tälle sivulle esimerkiksi näin:
  * 
  *  .todella-isoa-tekstia {
  *  font-size: 40px;
  *  }
  *
  *  ja tämän jälkeen voit kirjoittaa html-sivulle esimerkiksi: 
  *  <span class=todella-isoa-tekstia>tämä teksti on isokokoista</span>
  *  (muista että ET laita todella-isoa-tekstia kummallekkaan puolelle lainausmerkkejä)
  *
  *  Lisää tyylitiedoston tekemiseen ohjeita löydät hakukoneeseen kirjoittamalla
  *  esimerkiksi css-opas.
  *
  */

/* Jotta sivu venyisi alalaitaan saakka, tulee sivun olla 100% korkea */

html
{
height: 100%;
}

/* Body määrittelee koko sivua määrittelevät tyylit */

body
{
color: #000000;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px; 
background-color: #ffffff;
overflow-y: auto;
margin: 0px;
padding: 0px;
background-image: url(../image/background.gif);
background-repeat: repeat-x;
background-color: #eceee6;
height: 100%;
}

/* a:link/a:visited/a:hover/a:active määrittelee koko sivua määrittelevät linkin-tyylit */

a:link { color: #770000; text-decoration: none;}
a:visited { color: #770000; text-decoration: none;}
a:hover { color: #440000; text-decoration: underline;}
a:active { color: #440000; text-decoration: none;}

/* Pääotsikko */

h1 {
font-family: Arial, Helvetica, serif;
font-size: 24px;
font-weight: bold;
color: #3a4140;
margin-bottom: 5px;
display: inline;
}


/* Väliotsikko */

h2 {
font-family: Arial, Helvetica, serif;
font-size: 20px;
font-weight: bold;
color: #3a4140;
margin-bottom: 1px;
display: inline;
}

p {
margin-top: 9px;
}

/* Maincontainer on koko sivun ympärillä oleva laatikko. */

#maincontainer{
position: relative;
height: 100%;
width: 800px;
margin: 0 auto;
border: 0px solid black;
}

/* Page on koko sivun kokoinen taulu. */

.page{
position: relative;
margin: auto;
padding: 0;
border-collapse: collapse;
width: 100%;
height: 100%;
border: 0px solid black;
}

/* Tässä määritellään taulun solujen tyyli */

.page td{
padding: 0px;
margin: 0px;
}

/* Tässä määritellään taulun ylimmän solun tyyli */

.page-taustaa{
height: 166px;
overflow: hidden;
}

/* Logo määrittelee logo-kuvan määritteet */

.logo{
position: relative;
display: block;
width: 330px;
height: 100px;
padding: 0px;
margin: 0px;
background-image:url(../image/logo.gif);
}

/* Sisäänkirjaus-nuolen määritteet */

.log-in-arrow{
position: absolute;
top: 0px;
right: 0px;
display: block;
width: 20px;
height: 20px;
padding: 0px;
margin: 0px;
background-color: transparent;
background-image:url(../image/log-in-arrow.gif);
background-repeat: no-repeat;
}

/* Logo-kisasivu määrittelee kisasivulla sijaitsevan logo-kuvan määritteet */

.logo-kisasivu{
position: relative;
display: block;
width: 430px;
height: 100px;
padding: 0px;
margin: 0px;
background-image:url(../image/logo-kisasivu.gif);
background-position: 3px 0px;
}

/* Menu-list on yläpalkin kategoria-linkkien ympärillä oleva taulu */

.menu-list-ul {
position: absolute;
left: -7px;
margin: auto;
padding: 0;
border-collapse: collapse;
height: 62px;
width: 814px;
border: 0px solid black;
color: #ffffff;
background-color: transparent;
background-image:url(../image/menu_background.gif);
background-repeat: no-repeat;
list-style: none;
}

/* Tässä määritellään kategoria-taulun solujen tyylit */

.menu-list-ul li{
float: left;
border: 0px solid black;
height: 62px;
text-align: center;
display: block;
margin-left: auto;
margin-right: auto;
}

/* Tässä määritellään kategoria-linkkien tyylit */

.menu-list-ul li a {color: #cccccc; font-size: 16px; padding: 13px 19px; position: relative; top: 21px;}
.menu-list-ul li a.bold {color: #ffffff; font-size: 16px; padding: 13px 19px; position: relative; top: 21px;}
.menu-list-ul li a:hover {color: #ffffff; font-size: 16px; text-decoration: none;}

/* Kategoria-taulun tyhjä solu */

.menu-blank-li {
width: 170px;
}

/* Kategoria-taulun linkkien välillä oleva viiva */

.menu-dotted-li{
background-image:url(../image/menu_viiva.gif);
background-repeat: repeat-x;
width: 1px;
}

/* Kategorian etusivu kuva */

.page-image-etusivu{
overflow-y: hidden;
background-image:url(../image/sivulogot.gif);
background-position: 0px 0px;
background-repeat: repeat-x;
background-color: #1f4c26;
width: 183px;
height: 132px;
border: 0px solid black;
}

/* Kategorian seurainfo kuva */

.page-image-seurainfo{
overflow-y: hidden;
background-image:url(../image/sivulogot.gif);
background-position: -183px 0px;
background-repeat: repeat-x;
background-color: #1f4c26;
width: 183px;
height: 132px;
border: 0px solid black;
}

/* Kategorian iltarastit kuva */

.page-image-iltarastit{
overflow-y: hidden;
background-image:url(../image/sivulogot.gif);
background-position: -366px 0px;
background-repeat: repeat-x;
background-color: #1f4c26;
width: 183px;
height: 132px;
border: 0px solid black;
}

/* Kategorian kilpailut kuva */

.page-image-kilpailut{
overflow-y: hidden;
background-image:url(../image/sivulogot.gif);
background-position: -549px 0px;
background-repeat: repeat-x;
background-color: #1f4c26;
width: 183px;
height: 132px;
border: 0px solid black;
}

/* Kategorian nuoret kuva */

.page-image-nuoret{
overflow-y: hidden;
background-image:url(../image/sivulogot.gif);
background-position: -732px 0px;
background-repeat: repeat-x;
background-color: #1f4c26;
width: 183px;
height: 132px;
border: 0px solid black;
}

/* Kategorian esittelytekstin tausta */

.page-pohja{
position: relative;
background-image:url(../image/sivulogo_tausta.gif);
background-repeat: repeat-x;
background-color: #1f4c26;
height: 132px;
color: #ffffff;
border: 0px solid black;
}

/* Dots on pistemmäinen viiva esittelytekstin ja kategoria-kuvan välissä */

.dots{
position: relative;
left: -6px;
border: 0px solid black;
float: left;
height: 132px;
width: 10px;
background-image:url(../image/dotted.gif);
}

/* Esittelytekstin laatikko */

.page-teksti{
height: 112px;
position: relative;
top: 17px;
padding: 0px 30px;
}

/* Esittelytekstin otsikko */

.page-otsikko{
font-family: Arial, Helvetica, serif;
font-size: 27px;
font-weight: bold;
color: #f4f6ee;
}

.page-otsikko-kisa{
font-family: Arial, Helvetica, serif;
font-size: 24px;
font-weight: bold;
color: #f4f6ee;
}

/* Esittelyteksti */

.page-pikkuteksti{
overflow: hidden;
position: relative;
top: 10px;
height: 55px;
font-style: italic;
font-size: 14px;
color: #f4f6ee;
}

.page-pikkuteksti-kisa{
overflow: hidden;
position: relative;
top: 10px;
height: 55px;
font-style: italic;
font-size: 14px;
color: #f4f6ee;
}

/* Tämä on page-taulun solu. Solu yhdistää kategoria-kuvan alla olevan sivulista-solun nuolen yhtenäiseksi yllä olevan solun kanssa*/

.arrow-yla{
background-image:url(../image/vasen_yla.gif);
background-position: right top;
height: 8px;
border: 0px solid black;
}

/* Tämä on Internet Explorer korjaus. Toimittaa saman asian kuin ylläoleva yhtenäistämis-kuva */

.ie-arrow-yla{
position: relative;
top: -8px;
background-image:url(../image/vasen_yla.gif);
background-position: right top;
height: 8px;
width: 184px;
border: 0px solid black;
}

/* Tämä on sivun vasemmassa laidassa oleva kategorian sivulista */

.left-menu{
background-image: url(../image/vasen_ala.gif);
background-repeat: repeat-x;
background-color: #3a4140;
width: 183px;
border-width: 0px 0px 0px 1px;
border-style: solid;
border-color: #c2c2c2;
height: 100%;
}

/* Tämä on page-taulun solu. Tämä solu on vasemmalla olevan sivulistan solu. */

.content{
background-image: url(../image/oikea_taka.gif);
background-repeat: repeat-x;
background-color: #d5d4c8;
border-width: 0px 1px 0px 1px;
border-style: solid;
border-color: #c2c2c2;
height: 100%;
}

/* Tässä määritellään vasemman laidan sivulistan paikka */

.left-menu-div{
position: relative;
border: 0px solid black;
margin-top: 52px;
padding: 0px 15px 0px 15px;
}

/* Tässä määritellään vasemman laidan sivulistan linkkien tyylit */

.left-menu-link-selected a {color: #ffffff; font-size: 14px; font-weight: bold;}
.left-menu-link-selected a:hover {color: #dddddd; font-size: 14px; font-weight: bold; text-decoration: none;}
.left-menu-link a {color: #8e9794; font-size: 14px; font-weight: bold;}
.left-menu-link a:hover {color: #d5dfdd; font-size: 14px; font-weight: bold; text-decoration: none;}
.left-menu-link-link a {color: #97c3b2; font-size: 14px; font-weight: bold;}
.left-menu-link-link a:hover {color: #e1f5ed; font-size: 14px; font-weight: bold; text-decoration: none;}

/* Tässä määritellään vasemman laidan sivulistan linkkien välissä olevat viivat */

.left-menu-viiva {
display: block;
border-width: 1px 0px 0px 0px;
border-style: dotted;
border-color: #ffffff;
margin-top: 10px;
margin-bottom: 9px;
background-color: transparent;
}

/* Tässä määritellään pääsisällön paikka */

.content-div{
position: relative;
border: 0px solid black;
margin-top: 41px;
padding: 0px 40px 0px 40px;
}

/* Piste-viiva (yleensä otsikoiden alla tai jakamassa asioita) */

.content-viiva {
display: block;
border-width: 1px 0px 0px 0px;
border-style: dotted;
border-color: #000000;
margin-top: 10px;
margin-bottom: 9px;
background-color: transparent;
}

/* Iso otsikko */

.content-otsikko{
font-family: Arial, Helvetica, serif;
font-size: 24px;
font-weight: bold;
color: #3a4140;
}

/* Keskisuuri otsikko */

.content-otsikko-keskustelu{
font-family: Arial, Helvetica, serif;
font-size: 20px;
font-weight: bold;
color: #3a4140;
}

/* Otsikon perässä oleva lisäteksti (esim. päivämäärä) */

.content-otsikko-lisa{
font-family: Times New Roman, Times, serif;
font-size: 15px;
font-weight: bold;
color: #3a4140;
}


/* Pääsisällön leipäteksti */

.content-text{
font-size: 12px;
color: #000000;
line-height: 17px;
}

/* Tästä eteenpäin on määritelty painikkeita ja tekstialueita sun muita */

.m_p_1{
position: relative;
top: 1px;
border: 1px solid #3f7506;
background-color: #ecf8e3;
-moz-border-radius: 8px 8px 0px 0px;
cursor: pointer;
}

.m_p_2{
position: relative;
top: 1px;
border: 1px solid #72b42d;
background-color: #d2e7c2;
-moz-border-radius: 8px 8px 0px 0px;
cursor: pointer;
}

.script-textarea{
width: 650px; 
height: 370px; 
background-color: #ecf8e3; 
border: 1px solid #3f7506; 
font-size: 10px;
}

.script-textarea-2{
font-family: Arial, Helvetica, sans-serif;
width: 532px;
height: 400px;
background-color: #f3f3e9; 
border: 1px solid #3a4140; 
font-size: 12px;
}

.script-textarea-3{
position: relative;
right: 2px;
font-family: Arial, Helvetica, sans-serif;
width: 545px;
height: 50px;
background-color: transparent; 
border: 1px dotted #000000; 
font-size: 14px;
font-style: italic;
color: #ffffff;
}

.script-textarea-none{
display: none; 
}

.harmaa-teksti{
color: #777777;
}

.lisaa-iconi{
position: absolute;
top: -39px;
right: 0px;
}

.hallinta-iconit{
position: absolute;
top: -20px;
right: 0px;
}

.hallinta-iconit-2{
position: absolute;
top: 0px;
right: 2px;
}

.button-submit {
background-color: #ccd8c3; 
border: 1px solid #3f7506; 
font-size: 11px;
position: absolute;
right: 3px;
bottom: -17px;
}

.button-submit:hover {
background-color: #fcfff3; 
border: 1px solid #000000; 
font-size: 11px;
cursor: pointer;
position: absolute;
right: 3px;
bottom: -17px;
}

.button-submit-1 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 11px;
position: absolute;
right: 40px;
top: -4px;
}

.button-submit-1:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 11px;
cursor: pointer;
position: absolute;
right: 40px;
top: -4px;
}


.button-submit-1-2 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 11px;
position: absolute;
left: 40px;
top: -4px;
}

.button-submit-1-2:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 11px;
cursor: pointer;
position: absolute;
left: 40px;
top: -4px;
}


.button-submit-1-3 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 11px;
position: absolute;
left: 40px;
top: -20px;
}

.button-submit-1-3:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 11px;
cursor: pointer;
position: absolute;
left: 40px;
top: -20px;
}

.button-submit-1-4 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 11px;
padding: 1px;
}

.button-submit-1-4:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 11px;
cursor: pointer;
padding: 1px;
}

.pikku {
width: 20px;
}

.button-submit-2 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 22px;
position: absolute;
right: 40px;
top: 15px;
}

.button-submit-2:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 22px;
cursor: pointer;
position: absolute;
right: 40px;
top: 15px;
}

.button-submit-2-1 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 22px;
position: absolute;
right: 0px;
top: 15px;
}

.button-submit-2-1:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 22px;
cursor: pointer;
position: absolute;
right: 0px;
top: 15px;
}

.button-submit-2-2 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 20px;
}

.button-submit-2-2:hover {
background-color: #fcfcef; 
border: 1px solid #000000; 
font-size: 20px;
cursor: pointer;
}

.button-submit-3 {
background-color: #cad2cf; 
border: 1px solid #161818; 
font-size: 11px;
position: relative;
top: 2px;
}

.button-submit-3:hover {
background-color: #e8f0ed; 
border: 1px solid #070808; 
font-size: 11px;
position: relative;
top: 2px;
cursor: pointer;
}

.text-submit {
background-color: #cad2cf; 
border: 1px solid #161818; 
font-size: 14px;
position: relative;
top: 1px;
}

.text-submit-1 {
background-color: #f3f3e9; 
border: 1px solid #3a4140; 
font-family: Times New Roman, Times, serif;
font-size: 20px;
font-weight: bold;
color: #3a4140;
}

.text-submit-2 {
background-color: #f3f3e9; 
border: 1px solid #3a4140; 
font-weight: bold;
color: #3a4140;
font-size: 24px;
font-family: Arial, Helvetica, serif;
}

.text-submit-3 {
background-color: #ececdf; 
border: 1px solid #3a4140; 
font-size: 12px;
position: relative;
}

.text-submit-3-2 {
background-color: #f3f3e9; 
border: 1px solid #3a4140;
font-size: 12px;
position: relative;
}

.tekstieditori {
position: absolute;
top: -28px;
left: 200px;
}

.boxi {
position: absolute; 
display: none;
width: 300px;
height: 150px;
background-image:url(../image/box.png);
z-index: 999;
}

.paikka1 {
top: -150px;
left: -135px;
}

.paikka2 {
top: -150px;
left: -90px;
}

.paikka3 {
top: -150px;
left: -42px;
}

.table-nakymaton {
border: 0px solid black;
}

.table-nakymaton td {
padding: 0px 0px 2px 5px;
}

.tabe {
border-width: 1px;
border-style: solid;
border-spacing: 2px;
border-collapse: collapse;
border-color: #505050;
padding: 1px;
}

.tabe td {
border-width: 1px;
border-style: solid;
border-color: #505050;
padding: 1px;
}

.div-area{
width: 500px; 
height: 320px; 
background-color: #ecf8e3; 
border: 1px solid #3f7506; 
font-size: 12px;
}

.image-down {
position: relative;
top: 5px;
}

.kansio {
margin-bottom: 5px;
}

.kansio a {color: #000000;}
.kansio a:hover {color: #666666; text-decoration: none;}

.kansio-sisalto {
margin: 0px 0px 0px 20px;
}

.lankku {color: #000000;}
.lankku:hover {color: #666666; text-decoration: none;}

.pieni-poista {color: #000000; font-size: 10px; text-decoration: none;}
.pieni-poista:hover {color: #990000; font-size: 10px; text-decoration: none;}

/* Tässä on määritelty Nuori-suomi logon tyyli */

.nuori-suomi{
display: block; 
margin-left: auto;
margin-right: auto;
border: 0px solid black;
}

/* Pienempi leipäteksti */

.pienempi-teksti {
font-size: 11px;
}

/* Pre:tä voi käyttää jos haluaa rivinvaihdosten tulevan itsestään html-sivua kirjoittaessa (ettei tarvitse kirjoittaa aina [BR] tms.). Käyttö: <pre>Tekstiä</pre> */

pre {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px; 
line-height: 17px;
}

ul {
list-style-type: circle;
padding: 0px 0px 0px 15px;
margin: 0px;
}
