div, ul, li, a{ margin:0; padding:0; border:0; } div.torchrelay{ font-size:13px; height:320px; width:300px; } div.torchrelay a:link, div.torchrelay a:visited{ color:#0033FF; text-decoration:none; } div.torchrelay a:hover{ font-weight:bold; } div.torchrelay a:active{ color:#0033FF; text-decoration:none; } /* board head */ div.boardhead{ width:300px; position:relative; } a.player{ display: block; float: left; height: 18px; background-position: 0 0; margin-right: 1em; } a.prevButton{ width: 36px; background-image: url("http://phinix.chen.googlepages.com/prevButton.png"); } a.playButton{ width: 49px; background-image: url("http://phinix.chen.googlepages.com/playButton.png"); } a.nextButton{ width: 36px; background-image: url("http://phinix.chen.googlepages.com/nextButton.png"); } a.pauseButton{ width: 49px; background-image: url("http://phinix.chen.googlepages.com/pauseButton.png"); display:none; } a.player:hover{ background-position: 0 -18px; } a.player:active{ background-position: 0 -36px; } div.regionLink{ float:right; clear:right; text-align: right; font-size: 12px; } div.regionLink a{ margin:0 0 0 1em; text-decoration:underline; } div.regionLink a.selected{ color: #000000; padding:0 0 2px 0; background-image: url("http://phinix.chen.googlepages.com/triangle.gif"); background-repeat: no-repeat; background-position: center 100%; } /* board content */ .scrollWrapper{ border-top:#e60000 solid 2px; border-bottom:#e60000 solid 2px; position:relative; height:270px; } div.boardContent{ float:left; width:300px; height:250px; overflow-y:hidden; } html>body div.scrollWrapper{ position:relative; float:left; } li{ padding-left:8px; line-height:2em; list-style-type:none; border-bottom:#ccc solid 1px; border-top:#ccc solid 1px; } html>body li{ position:relative; } li.noTorch{ background:#f2f2f2; list-style-image:url("http://phinix.chen.googlepages.com/dot-gray.gif"); list-style-position:inside; } li.torched{ background:#fff; list-style-image:url("http://phinix.chen.googlepages.com/dot-red-transparent.png"); list-style-position:inside; } li.selected{ font-weight:bold; border:#999 solid 2px; list-style-image: url("http://phinix.chen.googlepages.com/torch.png"); list-style-position:inside; padding-left:0; } span.date{ color:#666; position:absolute; right:8px; } a.name{ padding-right:23px; background-position:100%; } div.show a.name{ background-image:url("http://phinix.chen.googlepages.com/minus_sm.gif"); background-repeat:no-repeat; } div.show ul{ display:block; } div.hide a.name{ background-image:url("http://phinix.chen.googlepages.com/plus_sm.gif"); background-repeat:no-repeat; } div.hide ul{ display:none; } div.province ul li{ padding-left:28px; } div.province ul li.selected{ padding-left:20px; } div.province ul a.name{ background-image:none; } ul.show{ display:block; } ul.hide{ display:none; } a.selected{ font-weight:bold; text-decoration:none; } .scrollUp, .scrollDown{ position:relative; float:left; left:0; z-index:5; width:300px; height:10px; background-position:0 10px; } .scrollUp{ top:0; background-image:url("http://phinix.chen.googlepages.com/scrollUp.gif"); } .scrollDown{ bottom:0; background-image:url("http://phinix.chen.googlepages.com/scrollDown.gif"); } .scrollUp:hover, .scrollDown:hover{ background-position:0 0; } ]]>