body {
   color: #101020;
   background: rgb(39,40,111) url(/pix/body.png);
   font-family: Verdana, Helvetica, sans-serif;
   font-size: 8pt;  
   margin: 0;
   padding: 0;
   border: 0;
}

.cbody {
   background: rgb(212,212,235) url(/pix/bg.png) top left repeat-y;
   max-width:1200px;
   margin: auto;
   margin-top: 10px;
   margin-bottom: 10px;
   width:expression(document.body.clientWidth > 1200? "1200px": "auto" );
   min-width: 821px;
}

img {
   vertical-align: middle;
   border: 0;     
}

#nomargin {
   margin-left: 0px;
   margin-right: 0px;
   padding-left: 0px;
   padding-right: 0px;
}

/* ##### Header ##### */

#header {
   padding: 10px 10px 0 10px;
   min-height: 70px;
   max-height: 80px;
   color: rgb(200,200,230);
}

#header p {
   margin: 0 0.5em;
   padding:0;
}

.en {
   background: rgb(40,40,140) top left no-repeat url(/pix/palkkiy.jpg);
}
.fi {
   background: rgb(40,40,140) top left no-repeat url(/pix/palkkiy.jpg);
}

.logo {
   position: relative;
   height: 57px;
   padding-left: 170px;
}

.myinfo, .myinfo a {
   font-size: 95%;
   text-decoration: none;
   font-weight: bold;
   color: rgb(200,200,230);
   background: transparent;
}
	
.subWrap {
   background: rgb(255,164,5) url(/pix/suby.png) no-repeat top left;
   max-height: 89px;
}

.subHeader {
   background: transparent url(pix/suba.png) no-repeat bottom left;
   color: black;
   max-height: 83px;
   padding: 3px 0;
}

.subHeader a {
   color: black;
   background-color: transparent;
   text-decoration: none;
   font-weight: bold;
}

.subHeader a:hover {
   color: white;
}

.subHeader div div {
  float:left;
  padding: 0 0.5em;
  margin: 0;
}

.drop {
  position: absolute;
  border:1px solid blue;
  padding: 0.5em;
  margin:0;
  border: 1px solid rgb(30,30,130);
  background-color: #d8d8ed;
  color: black;
  z-index: 5000;
} 

.drop a {
   text-decoration: none;
   color: #3040c0;
}

.drop a:hover {
   color: #6080ff;
}

/* ##### Footer ##### */

#footer {
   color: black;
   background: rgb(40,40,140) url(/pix/palkkia.jpg) top left no-repeat;
   font-size: 95%;
   text-align: center;
   clear: both;
   padding: 10px;
   height: 32px; /* 32+10+10=52 */
}

#footer a {
   color: black;
   background-color: transparent;
   text-decoration: underline;
   font-weight: bold;
}

#footer a:hover {
   text-decoration: none;
}

/* sivupalkki */

.sideBar {
   width: 170px;
   float: left;
   clear: left;
   text-align: center;
   margin: 0;
}

.sideBar h2 { 
   color: white;
   background: rgb(48,33,159) url(/pix/gradient.png);
   font-weight: bold;
   font-size: 100%;
   margin: 0;
   padding: 0.8ex 1ex;
   text-align: left;
}

.sideBar h2 > a {
   color: white;
   text-decoration: none;
}

.sideBar h2 > a:hover {
   color: black;
   background-color: white;
}

ul {
   list-style-type: none;
   list-style-position: outside;
   text-align: left;
   margin: 2px 2ex 2px 2ex;
   padding: 0;
}

#main ul {
   list-style-type: disc;
}


li {
   margin: 0;
   padding: 0;
}


.sideBar p{
   background-color: transparent;
   line-height: 1.25em;
   margin: 1em 0.25em 1.5em 0.75em;
   padding: 0;
   display: block;
}
/*
.sideBar a {
text-decoration: underline;
}

.sideBar a:hover {
text-decoration: none;
}
*/
.boxed {
   font-size: 90%;
   margin: 2em 0.75em 2em 2em;
   border: 1px solid rgb(30,30,130);
   background-color: #d8d8ed;
}


.quote {
   border: 1px solid rgb(30,30,130);
   padding: 0.5em;
   background-color: #c8c8e6;
   width: auto;
}

/* leipäosa */

#main {
   color: black;
   background: rgb(224,224,240) /*url(pix/bgr.png)*/ top right repeat-y;
   text-align: justify;
   line-height: 1.5em;
   margin: 0 19px 0 181px;
   padding: 10px;
   font-size: 100%;
   min-width: 620px;
   min-height: 600px;  
   max-width:  992px; 
}

#main h1 {
   background: transparent url(/pix/arrow.png) no-repeat left bottom;
   font-size: 115%;
   font-weight: bold;
   text-align: left;
   margin: 1em 0 0 0;
   padding: 0;
   padding-left: 20px;
}

#main h2 {
   background: transparent url(/pix/arrow.png) no-repeat left bottom;
   font-size: 110%;
   font-weight: bold;
   text-align: left;
   margin: 1em 0 0 0;
   padding: 0;

   padding-left: 20px;
}

#main h3 {
   background: transparent url(/pix/arrow.png) no-repeat left bottom;
   font-size: 105%;
   font-weight: bold;
   text-align: left;
   margin: 1em 0 0 0;
   padding: 1em 0 0 0;
   padding-left: 20px;

}


#main h2+h3 {
   margin: 0;
   padding: 0;
}

a {
   text-decoration: none;
   color: #3040c0;
}

#main a:visited, .sideBar a:visited {}

a:hover {
   color: #6080ff;
}

#main p {
   margin: 0.5em 0 0.5em 0;
   padding: 0;
   overflow: auto;   
  xmax-width: 60em;
}


#main .cmd {
   color: white;
   background-color: #66e;
   background: rgb(48,33,159) url(/pix/gradient.png);
   border-style: outset;
   border-color: rgb(30,0,130);
   border-width: 2px 2px 2px 2px;
   margin: 2px 1px 2px 1px;
   padding-left: 4px;
   padding-right: 4px;
   font-variant: small-caps;
   text-decoration: none;
}

#main .cmd * {
   color: white;
   text-decoration: none;
}

.wide {
   width: 100%;
}

.wideshadow {
   width: 95%;
}

.shadow,.wideshadow {
   background-color: rgb(155,155,166) ;
   border-style: solid;
   border-color: rgb(189,189,204);
   border-width: 0 1px 1px 1px;
   padding: 0px 1px 1px 0px;
   margin:  1em  0;
   float: left;  /* pakko olla, jotta asettuu tablen ympärille */
}

.cleargroup {
   overflow: auto;
   width: 100%;
}

.floating {
  float: left;
  margin-right: 2em;
}

.group, /*.buttongroup,*/ .widegroup {
   xoverflow: auto;
   overflow-x: hidden;
   overflow-y: auto;
   width: 100%;
}

.buttongroup {
 overflow: auto;
 width: 100%;
}

.floating .buttongroup {
    width: auto;  /* ie-korjaus */
}

.buttongroup .innergroup {
    float: none;  /* opera-korjaus kait */
}

.innergroup {
   float: right;
}

a.button, span.inputbutton {
   color: white;
   background: transparent url(/pix/nappi2.png) no-repeat scroll top right;
   margin: 2px 1px 2px 1px;
   font-variant: small-caps;
   font-size: 12px;
   text-decoration: none;
   line-height: 18px;
   display: block;
   float: left;
   border: 0;
}

.button span, .inputbutton input {
   background: rgb(35,35,139) url(/pix/nappi1.png) no-repeat;
   line-height: 18px;
   display: block;
   padding: 0px 9px 0px 9px;
   margin-right: 18px;
   border: 0;
}

.inputbutton input {
   background: transparent url(/pix/nappi1.png) no-repeat;
   line-height: 14px;
   height: 18px;
   display: block;
   padding: 0px 9px 0px 9px;
   margin-right: 18px;
   border: 0;
   color: white;
}

/*#main .cmd *:hover {
border-style: inset;
}*/


/* taulukko */

table {
   background-color: #d8d8ed;
   border: solid rgb(30,0,130) 1px;
   padding: 0;
   border-collapse: collapse;
   margin: 0;
}

.ranking {
   width: auto;
   margin: 0;
}

em {
   font-style: normal;
   font-weight: bold;
}

caption  {
   text-align: left;
   font-weight: bold;
   font-style: italic;
   background: rgb(48,33,159) url(/pix/gradient.png) repeat-x top left;
   border: solid rgb(30,0,130) 1px;
   color: white;
   border-collapse: collapse;
   border-bottom: 0;  
   width: auto;
   padding: 0 1em;
}

caption a {
   color: white;
}

tr {
   border: 0;
}

th a {
   color: inherit;
}

th {
   border: 0;
   background: rgb(200,200,230);
   font-size: 90%;
   text-align: left; 
   color: rgb(30,0,130);
   border-bottom: solid rgb(30,0,130) 1px;  
   padding: 0 0.3em;
}

.headercol {
   font-weight: bold;
}	

td {
   border: 0;
   font-weight: inherit;
   padding: 0.1em 0.3em;
}

.pageselect {
   float: right;
}

.xp {
   width: auto;
   text-align: left;
   border-collapse: collapse;
   padding: 4px;
}



.buttongroup .buttongroup, .infoline .buttongroup {
   float: right;
}

.forum .buttongroup {
   font-size: 12px;
   float: left;
}

.message {
   clear: both;
   margin: 0 1em 1em 0.2em;
}

.forumtitle {
   width: 100%;
}

table.forum {
   width: 100%;
}

.forum caption {
  
}

.forumleft {
	max-width: 13em;
}
 
.info em {
   margin-right: 2em;
   white-space: nowrap;
}

.forum .info, .infoline {
   font-size: 90%;
   font-style : normal;
   font-weight: normal;
   float: left;
   color: rgb(30,0,130);
}

.forum td {
   border-bottom: 1px solid rgb(30,0,130);
   border-top: 1px solid rgb(30,0,130);
}

.forum tr {
   border-bottom: 1px solid rgb(30,0,130);
   border-top: 1px solid rgb(30,0,130);
}

.forumsivu {
   background-color: rgb(200,200,230);
   width: 20%;
}

.even {
   background-color: rgb(200,200,230);
}


.gallery {
   background-color: transparent;
   border: 0;
   text-align: center;
   width: 99%;
}

.gallery caption {
   text-align: left;
}


.image {
   border: 0;
   /*	padding: 1em; */
   text-align: center;
   clear: both;
}

.shadow table {
   margin:0;
   padding: 0;
}

input {
   font: inherit;
}

.img {
   border-style: none;
}

.kehys {
   margin: 0;
   padding: 0;
}


.tv {
   padding: 5em;
   margin: 0;
  background-repeat: no-repeat;
   border: 0;
   width: 603px;
   height: 504px;
   float: left; 
}
 
.tv-yla {
   width: 603px;
height: 36px;
   background-image: url(/pix/tv-yla.png);
   clear: both;

}
.tv-vas {
   width: 36px; 
   height: 400px;
   background-image: url(/pix/tv-vas.png);
   float: left;
}
.tv-ala {
   width: 603px;
   height: 68px;
   background-image: url(/pix/tv-ala.png);
   clear: both;
}
.tv-oik {
   width: 37px;
 height: 400px;
   background-image: url(/pix/tv-oik.png);

}

.tv-keski {
   width: 530px;
height: 400px;
   float: left;
}


.kappaleet {
   overflow: auto;
   margin: 0; 
  width:100%;
}

.kappalevas {
   width:48%;
   float: left;
   padding-right: 1%;
}

.kappaleoik {
   width: 48%;
 float: left;
   padding-left: 1%;
}

.keskitys {
   text-align: center;
 margin: 1em auto;
}

.readonly {
   border-style: none;
   background-color: #d8d8ed;
}

.plist img {
float: left;
margin: 0.5em;
}
.plist div div {
 float: left;
}

.plist p {
  
}
.plist {
overflow: auto;
margin-bottom: 1em;
width: 100%;
}

.reportlink {
  font-size: 7pt;  
}


.level-bar {
        border: 1px solid #000;
    border: 1px solid #4cb14c;
        position: relative;
        margin-bottom: 16px;
}

.progress {
        height: 22px;
        background: #b4df5b;
        background: -moz-linear-gradient(top, #b4df5b 0%, #00df00 100%);
        background: -webkit-linear-gradient(top, #b4df5b 0%, #00df00 100%);
        background: linear-gradient(to bottom, #b4df5b 0%, #00df00 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4df5b', endColorstr='#00df00',GradientType=0 );
}

.level-bar .xp-progress {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        padding: 4px;
        text-align: center;
}
.level-num {
        position: absolute;
        left: -2em;
        font-weight: bold;
        font-size: 20px;
}

.xp-progress > a {
        color: #000;
}


a img[width="16"] {
    width: auto;
    height: auto;
    max-width: 16px;
    max-height: 16px;
}

.gallery a img[width="120"] {
    width: auto;
    height: auto;
    max-width: 120px;
    max-height: 120px;
}