body {
width:100%;
height:100%;
background:#090B22 url(/graf/bg_players.jpg) no-repeat center top;
background-attachment: fixed;
margin:0;
padding:0;
}
img {
border:0;
}

.btn {
background:#009;
color:#fff;
border:0;
padding:1px 20px;
}
.btn:hover {
background:#03c
}
.inline_block {
display:inline-block;
margin-right:1em
}

#bg {
width:992px;
background:transparent;
min-height:612px;
margin:0 auto
}
#header {
position:relative;
width:100%;
height:170px;
background:url(/graf/header.png) no-repeat 0 20px;
cursor:pointer
}
#header .hjklogo {
position:absolute;
left:0;
top:-3px;
height:170px;
width:170px
}
#header .slogan {
position:absolute;
left:0;
top:24px;
height:140px;
width:460px;
background:url(/graf/header_slogan.png) no-repeat 160px 0
}
#header .partners {
position:absolute;
left:185px;
top:108px;
height:50px;
width:320px;
display:none;
overflow:hidden
}
#header .partners a {
display:inline-block;
height:50px;
width:50px;
background:url(/adds/prtn/partners.png) no-repeat
}
#header .player {
position:absolute;
left:676px;
top:-25px;
display:none
}
#header .nbla,#footer .jpvfx {
position:absolute;
font-size:9px;
font-style:italic;
width:160px;
text-align:center;
cursor:default
}
#header .nbla {
color:#dcdcdf;
bottom:0;
left:0
}
#header .nbla a {
color:#dcdcdf
}

#footer .jpvfx {
top:-16px;
right:0;
color:#909090
}
#footer {
position:relative;
clear:both;
width:992px;
padding-top:5px;
border-top:1px solid #b0b0b0;
color:#b0b0b0;
text-align:center;
font-size:11px;
margin:2em auto 50px
}
#footer a {
color:#b0b0b0
}

#top_banner .content {
width:980px;
min-height:36px;
text-align:center;
margin:0 auto
}

#partnerLogos {
position:relative;
clear:both;
width:992px;
color:#b0b0b0;
text-align:center;
font-size:10px;
margin:2em auto 0;
padding:5px
}
#partnerLogos a {
display:inline-block;
height:45px;
margin-bottom:3px;
background:#fff;
overflow:hidden;
opacity:0.7px;
filter:alpha(opacity=70);
padding:2px
}

#runko {
width:100%;
min-height:420px
}
#runko td {
vertical-align:top
}
#runko td.top {
height:10px;
background:url(/graf/levTop.png) no-repeat top center
}
#runko td.bottom {
height:10px;
background:url(/graf/levBottom.png) no-repeat bottom center
}
#runko td.vas {
width:160px;
padding-right:10px
}
#runko td.oik {
width:240px;
padding-left:10px
}
#runko td.sivu {
width:582px
}
#runko #content {
float:left;
width:582px;
min-height:780px
}

.frame,.frame2 {
padding:10px
}
.frame h1 {
margin:0 0 2em
}

#top {
position:relative;
height:0;
width:992px;
background:transparent;
color:#ebebeb;
margin:0 auto
}
#top .line {
position:absolute;
width:100%;
top:10px;
text-align:center;
color:#ababaf
}
#top .kieli {
position:absolute;
width:972px;
font-size:10px;
text-align:right;
z-index:5000;
padding:3px 10px
}

#menuTop {
height:10px;
background:transparent url(/graf/menu_top.png) no-repeat top center
}
#menuBottom {
height:10px;
background:transparent url(/graf/menu_bottom.png) no-repeat bottom center;
margin-bottom:10px
}
#menuCont {
background:url(/graf/menu_mid.png) repeat-y;
width: 160px;
min-height:293px;
padding-top:5px;
padding-bottom:1em;
overflow:hidden
}
#menuCont h3 {
background:transparent url(/graf/arrow-e.png) no-repeat left;
background-position:2px;
text-transform:uppercase;
color:#e5e5e5;
border-top:1px solid #00c;
cursor:pointer;
margin:0;
padding:5px 5px 5px 16px
}
#menuCont h3.active {
background-image:url(/graf/arrow-s.png)
}
#menuCont h3.on {
color:#fff;
background-color:#00b
}
#menuCont h3.last {
border-bottom:1px solid #00c
}
#menuCont h3 a {
display:block;
color:#e5e5e5;
padding:0
}

#menu {
display:none;
margin:0 2px
}
#menu div {
background:#229;
border-top:1px solid #00c
}
#menu a {
display:block;
color:#fff;
text-decoration:none;
margin:0;
padding:1px 1px 1px 20px
}
#menu a:hover {
background:url(/graf/menu_on.gif) repeat-y
}
#menu a.on {
background:#e5e5e5;
color:#009
}
#menu a.on:hover {
background:#e5e5e5 url(/graf/menu_on.gif) repeat-y
}
#menu #submenu {
display:none;
border-bottom:1px solid #00c
}
#menu #submenu a.submenu {
padding-left:40px
}

#HJKTVpreview {
position:relative
}
#hjktv_screen {
position:relative;
width:276px;
height:155px
}

.levTop {
clear:both;
height:5px;
background:url(/graf/levTop.png) no-repeat center top;
margin:0
}
.levBottom {
height:5px;
background:url(/graf/levBottom.png) no-repeat center bottom;
margin:0 0 10px
}
.levMid {
min-height:70px;
background:url(/graf/levMid.png) repeat-y;
overflow:hidden;
margin:0;
padding:0 5px
}

.wideTop {
clear:both;
height:5px;
background:url(/graf/wideTop.png) no-repeat center top;
margin:0
}
.wideBottom {
height:5px;
background:url(/graf/wideBottom.png) no-repeat center bottom;
margin:0 0 10px
}
.wideMid {
min-height:70px;
background:url(/graf/wideMid.png) repeat-y;
overflow:hidden;
margin:0;
padding:0 5px
}

.levnfMid {
min-height:70px;
overflow:hidden;
margin:0 0 10px 10px;
padding:0 1px
}

.margTop {
height:5px;
background:url(/graf/margTop.png) no-repeat center top
}
.margBottom {
height:5px;
background:url(/graf/margBottom.png) no-repeat center bottom
}
.margMid {
min-height:90px;
background:url(/graf/margMid.png) repeat-y;
overflow:hidden;
padding:0 5px
}

.margbMid {
min-height:90px;
border:1px solid #dcdcdf;
overflow:hidden;
margin:0 20px;
padding:0 10px
}
.margnfMid {
min-height:60px;
background:transparent;
overflow:hidden;
padding:0
}

.addsCont {
margin-bottom:10px;
text-align:center
}

.addsTop {
height:10px;
background:url(/graf/menu_top.png) no-repeat
}
.addsBottom {
height:10px;
background:transparent url(/graf/menu_bottom.png) no-repeat bottom center;
margin-bottom:10px
}
.addsMid {
background:url(/graf/menu_mid.png) repeat-y;
min-height:90px;
color:#fff;
overflow:hidden;
padding:0 10px
}

.noframeCont {
clear:both;
margin-bottom:10px;
text-align:center
}
.noframeMid {
margin:0;
padding:0
}
.noframeKapCont {
float:left;
width:291px;
text-align:center;
overflow:hidden
}
.noframeKapMid {
min-height:90px;
background:#e5e5e5;
margin:0
}

#content .title,#content_wide .title,.margCont .title,.margnfCont .title,.uvTitle {
font-size:10px;
font-weight:700;
letter-spacing:0.2em;
text-align:center;
color:#e5e5e5;
background:#009 url(/graf/bg_title.png) repeat-x center bottom;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
margin:0 0 0.5em;
padding:1px 0
}
#content .title,#content_wide .title {
margin:0 0 1em
}

.margCont .raami {
background:#009 url(/graf/bg_verkko.jpg) repeat-y center top;
color:#fff;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
padding:5px 5px 1em
}
.margCont .raami h4 {
text-align:center;
color:#dcdcdf
}
.margCont #ostoskori {
font-size:14px
}
.margCont .ostoskori_btn a {
background:#00c;
font-weight:700;
font-size:12px;
padding:2px 1em
}
.margCont .ostoskori_btn a:hover {
background:#03c;
padding:2px 1em
}

.HjkTabs .ui-tabs-panel {
background:#009 url(/graf/bg_lippu.jpg) repeat-y center top;
color:#ebebeb;
padding:0
}
.HjkTabs .taulu {
position:relative;
text-align:center;
min-height:218px;
margin:2em 0
}
.HjkTabs .taulu .logot img {
margin:0 10px
}
.HjkTabs .taulu .matsi {
font-size:16px;
font-weight:700;
color:#fff
}
.HjkTabs .taulu .sarja {
margin-bottom:1em
}
.HjkTabs .more, .more {
margin-top:1em;
text-align:right
}
.HjkTabs .more a, .more a {
display:block;
padding-right:1em;
font-size:10px;
color:#ccc
}
.HjkTabs .more a:hover, .more a:hover {
color:#fff;
background:#009
}
.HjkTabs .taulu .edMatsi {
position:absolute;
width:100%;
bottom:-1.5em;
font-size:11px;
padding-top:1px
}
.HjkTabs .taulu .edMatsi a {
display:block;
background:url(/graf/bg_opacity_30.png)
}
.HjkTabs .taulu .edMatsi a:hover {
background:#009
}
.HjkTabs .taulu .edMatsi .stats {
position:absolute;
bottom:1.8em;
right:0;
padding-right:5px;
font-size:9px;
color:#ccd
}

.srjTbl td {
font-size:12px;
line-height:1.4em
}
.leveysinfo {
border-bottom:1px solid #0ff;
font-size:10px;
color:#0ff;
text-align:right
}

.matseissa_mukana {
text-align:center;
margin:0;
padding:10px
}
.matseissa_mukana img {
opacity:0.8px;
filter:alpha(opacity=80)
}

.tblLista td {
vertical-align:top;
border-top:1px solid #e5e5e5
}
.tblLista th {
vertical-align:top;
border-top:1px solid #e5e5e5;
border-bottom:1px solid #000;
text-align:left;
font-size:12px;
font-weight:400
}
.tblLista {
border-bottom:1px solid #e5e5e5
}
.tblLista tr:hover {
background:#efefef
}
.tblLista a {
display:block;
padding:0 0.5em
}
.tblLista button {
width:100px;
font-size:10px;
font-weight:400;
cursor:pointer;
margin:1px 1em
}
.tblLista .sign {
width:24px;
height:16px
}
.tblLista .sign[rel=vihr] {
background:url(/graf/liikvalot.png) no-repeat 10px 3px
}
.tblLista .sign[rel=kelt] {
background:url(/graf/liikvalot.png) no-repeat -10px 3px
}
.tblLista .sign[rel=pun] {
background:url(/graf/liikvalot.png) no-repeat -30px 3px
}
.tblLista .tv {
font-size:x-small
}
.tblListaOts {
font-size:1.1em;
margin-top:1em
}

#statsOts {
position:relative;
border:0;
width:90px;
font-family:tahoma;
font-size:10px;
font-weight:700;
text-transform:lowercase;
text-align:left;
letter-spacing:0.2em;
background:#009 url(/graf/bg_title.png) repeat-x center bottom;
color:#e5e5e5;
cursor:pointer;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
padding:1px 10px
}
#statsOts:hover {
background:#00a
}
#stats {
display:none;
font-size:12px;
padding:1em
}

.statsLst td:first-child,.statsLst th:first-child {
text-align:left
}
.statsLst th {
color:#009;
font-size:9px;
border:0;
vertical-align:bottom;
padding:1px 0 1px 4px;
text-align: right;
}
.statsLst td span.nro {
display:inline-block;
width:24px
}
.statsLst .kelt {
background:#ff0;
padding:0 1px
}
.statsLst .pun {
background:red;
padding:0 1px
}
.statsLst td {
width:40px;
text-align:right;
padding:2px
}
.statsLst td:first-child {
width:160px;
text-align:left;
padding:2px 1em
}
.statsLst td input {
width:32px
}
.statsLst .last td {
border-top:1px solid #000
}
.statsSummary tr.head td {
font-size:9px;
min-width:1em
}
.statsSummary .matsi a {
display:none;
padding:0
}
.statsSummary td {
text-align:center;
font-size:9px;
border-right:1px solid #e5e5e5;
padding:0 4px
}
.statsSummary tr td:first-child {
text-align:left;
font-size:12px;
border-left:1px solid #e5e5e5
}

#show_matsi {
margin-bottom:3em;
padding-bottom:2em;
border-bottom:1px solid #36c
}
#show_matsi .logo {
width:80px;
text-align:center;
vertical-align:top
}
#show_matsi .taulu {
text-align:center;
border-top:1px solid #36c;
border-bottom:1px solid #36c
}
#show_matsi h2 {
font-size:24px;
margin-top:.5em
}
#show_matsi .sarja {
text-align:center;
font-weight:700;
margin-bottom:.4em
}
#show_matsi .tulos {
font-size:24px;
margin-bottom:.5em;
padding-bottom:.5em
}
#show_matsi .aikajapaikka {
text-align:center;
font-size:x-small;
padding-top:0.5em
}
#show_matsi .scorers {
text-align:center;
padding-bottom:1em
}
#show_matsi .scorers div {
display:inline-block;
text-align:left;
color:#009
}
#show_matsi .info {
display:inline-block;
text-align:left;
margin:1em 0;
}
#show_matsi .info2 {
text-align:center;
margin:1em 0 0;
}

#matsilista {
margin-bottom:3em
}

.gameList {
margin-bottom:2em
}
.gameList h3 {
cursor:pointer
}
.gameList h3 .status {
font-weight:400;
font-size:12px;
padding-left:1em
}

.filterCont {
font-size:10px;
margin-top:1em
}

#pelaajalista {
width:100%;
display:none
}
#pelaajalista .tblLista {
width:100%
}
#pelaajalista .title {
padding-left:1em;
text-align:left;
margin:1.2em 0 0.3em
}
#pelaajalista .tblLista td {
background:url(/graf/half_shade.png) repeat-x center center;
border-bottom:1px solid #fff
}
#pelaajalista .tblLista td:first-child {
width:60px;
text-align:right
}
#pelaajalista .tblLista td a {
font-size:1.2em;
color:#009;
padding:2px 20px
}

.pelaajakortti {
clear:both;
display:none;
border-bottom:1px solid #ebebeb;
padding:1em 3em
}
.pelaajakortti .pelaajakuva {
float:left;
width:140px;
min-height:160px;
margin-right:2em;
margin-bottom:1em;
text-align:center
}
.pelaajakortti .card {
float:left;
width:300px
}
.pelaajakortti .card h3 {
margin-top:0
}
.pelaajakortti .card .pos {
font-weight:700
}
.pelaajakortti .card .stats {
font-size:11px
}
.pelaajakortti h1 {
margin-bottom:1em;
font-weight:700
}
.pelaajakortti .foot {
clear:both
}

ul.tt_dropdown {
list-style:none;
background:#009;
color:#e5e5e5;
font-size:11px;
font-weight:700;
border:2px solid #dcdcdf;
-moz-border-radius:6px;
-webkit-border-radius:6px;
min-width:150px;
-webkit-box-shadow:5px 10px 10px rgba(0,0,0,.8);
-moz-box-shadow:5px 10px 10px rgba(0,0,0,.8);
padding:6px 0
}
ul.tt_dropdown a {
display:block;
z-index:101;
color:#e5e5e5;
text-decoration:none;
border-bottom:1px solid #00c;
text-transform:uppercase;
padding:2px 2em 2px 1em
}
ul.tt_dropdown a:hover,a.nested:hover:after {
color:#fff;
background:#00a url(/graf/menu_on.gif) repeat-y
}

#header .nbla a:hover,#footer a:hover,#top .kieli a:hover,#menuCont h3 a.on,.margCont .raami a:hover,.HjkTabs .taulu a {
color:#fff
}
#partnerLogos a:hover,.matseissa_mukana img:hover {
opacity:1px;
filter:alpha(opacity=100)
}
#runko td.sivu_wide,#runko #content_wide {
width:822px
}
#top .kieli a,.margCont .raami a {
color:#e5e5e5
}

.kapvCont,.kapvalkvCont,.kapnfvCont {
float:left;
width:286px;
margin-right:5px;
overflow:hidden
}
.kapvTop,.kapoTop {
height:5px;
background:url(/graf/kapTop.png) no-repeat center top;
margin:0
}
.kapvBottom,.kapoBottom {
height:10px;
background:url(/graf/kapBottom.png) no-repeat center bottom;
margin:0 0 10px
}
.kapvMid,.kapoMid {
min-height:90px;
background:url(/graf/kapMid.png) repeat-y;
color:#e5e5e5;
margin:0;
padding:0 5px
}
.kapoCont,.kapvalkoCont,.kapnfoCont {
float:left;
width:286px;
margin-left:5px;
overflow:hidden
}
.kapvalkvTop,.kapvalkoTop {
height:5px;
background:url(/graf/kapvalkTop.png) no-repeat center top;
margin:0
}
.kapvalkvBottom,.kapvalkoBottom {
height:10px;
background:url(/graf/kapvalkBottom.png) no-repeat center bottom;
margin:0 0 10px
}
.kapvalkvMid,.kapvalkoMid {
min-height:90px;
background:url(/graf/kapvalkMid.png) repeat-y;
color:#000;
margin:0;
padding:0 5px
}
.kapnfvTop,.kapnfoTop,.noframeKapTop,.noframeKapBottom {
height:0;
background:transparent;
margin:0
}
.kapnfvBottom,.kapnfoBottom {
height:0;
background:transparent;
margin:0 0 10px
}
.kapnfvMid,.kapnfoMid {
min-height:90px;
background:transparent;
color:#e5e5e5;
margin:0;
padding:0
}

.margCont,.margnfCont {
margin-bottom:10px
}
.margnfTop,.margnfBottom {
height:0
}
.noframeTop,.noframeBottom {
height:0;
background:transparent
}
.margCont .ostoskori_btn,.HjkTabs .taulu .aika {
margin-top:1em
}

#seurMatsi,.filterCont .remove {
display:none
}
.statsLst td,.statsLst th,#pelaajalista .tblLista td:first.child a {
text-align:right
}
.statsLst tr:first-child:hover,.statsSummary tr.head:hover {
background:transparent
}
.highlight {
background-color: #ff0;
}

.sininen {
background: #006;
padding: 5px;
}
.sininen a {
color:#e5e5e5;
}
.sininen a:hover {
color:#fff;
}