html, body { overflow: hidden; }
.toolbarCover { display: none; width: 100%; height: 80px; overflow: hidden; position: absolute; z-index: 2; background: #000000; top: 0; left: 0; opacity: 0.6; filter: alpha(opacity = 60); }
.toolbar { position: fixed; _position: absolute; z-index: 0; background-image:url(imgtoolbar-bg.gif); top: 0; left: 0; margin-left: auto; margin-right: auto; width: 100%; height: 80px; overflow: hidden; text-align: center; }
.toolbar .toolOption { position: relative; z-index: 1; margin-left: 2px; margin-right: 2px; margin-top: 10px; width: 60px; height: 60px; display: inline-block; background-repeat: no-repeat; }

.toolbar .help { background-image: url(imghelp.png); }
.toolbar .help:hover { background-image: url(imghelp-2.png); }
.toolbar .help.helpOpen { background-image: url(imghelp-1.png); }
.toolbar .home { background-image: url(imghome.png); }
.toolbar .home:hover { background-image: url(imghome-2.png); }
.toolbar .home:active { background-image: url(imghome-1.png); }
.toolbar .back { background-image: url(imgback.png); }
.toolbar .back:hover { background-image: url(imgback-2.png); }
.toolbar .back:active { background-image: url(imgback-1.png); }
.toolbar .forward { background-image: url(imgforword.png); }
.toolbar .forward:hover { background-image: url(imgforword-2.png); }
.toolbar .forward:active { background-image: url(imgforword-1.png); }
.toolbar .refresh { background-image: url(imgrefresh.png); }
.toolbar .refresh:hover { background-image: url(imgrefresh-2.png); }
.toolbar .refresh:active { background-image: url(imgrefresh-1.png); }

.toolbar .modetext { background-image: url(imgmodetext.png); }
.toolbar .modetext:hover { background-image: url(imgmodetext-2.png); }
.toolbar .modeimage { background-image: url(imgmodeimage.png); }
.toolbar .modeimage:hover { background-image: url(imgmodeimage-2.png); }

.toolbar .color { background-image: url(imgcolor.png); }
.toolbar .color:hover { background-image: url(imgcolor-2.png); }
.toolbar .color.colorOpen { background-image: url(imgcolor-1.png); }
#colorOptions { z-index: 3; width: 0; height: 60px; overflow: hidden; position: absolute; left: 0; top: 10px; }
.colorOptions { width: 320px; height: 60px; overflow: hidden; }
.colorOptions .colorOption { float: left; width: 60px; height: 60px; margin-left: 2px; margin-right: 2px; margin-top: 0; }

.colorSelect1 { background: url(imgcolor1.png); }
.colorSelect1.down { background: url(imgcolor1-1.png); }
.colorSelect2 { background: url(imgcolor2.png); }
.colorSelect2.down { background: url(imgcolor2-1.png); }
.colorSelect3 { background: url(imgcolor3.png); }
.colorSelect3.down { background: url(imgcolor3-1.png); }
.colorSelect4 { background: url(imgcolor4.png); }
.colorSelect4.down { background: url(imgcolor4-1.png); }
.colorSelect5 { background: url(imgcolorrecovery.png); }
.colorSelect5:hover { background: url(imgcolorrecovery-2.png); }
.colorSelect5.down { background: url(imgcolorrecovery-1.png); }

#volumeOptions { z-index: 3; width: 0; height: 60px; overflow: hidden; position: absolute; left: 0; top: 10px; }
.volumeOptions { width: 192px; height: 60px; overflow: hidden; }
.volumeOptions .volumeOption { float: left; width: 60px; height: 60px; margin-left: 2px; margin-right: 2px; margin-top: 0; }
.volumeOptions .volumemute { background: url(imgvolumemute.png); }
.volumeOptions .volumemute:hover { background: url(imgvolumemute-2.png); }
.volumeOptions .volumemute.down { background: url(imgvolumemute-1.png); }
.volumeOptions .volumeOption1 { background: url(imgvolumedown.png); }
.volumeOptions .volumeOption1:hover { background: url(imgvolumedown-2.png); }
.volumeOptions .volumeOption1:active { background: url(imgvolumedown-1.png); }
.volumeOptions .volumeOption2 { background: url(imgvolumeup.png); }
.volumeOptions .volumeOption2:hover { background: url(imgvolumeup-2.png); }
.volumeOptions .volumeOption2:active { background: url(imgvolumeup-1.png); }

#speedOptions { z-index: 3; width: 0; height: 60px; overflow: hidden; position: absolute; right: 0; top: 10px; }
.speedOptions { width: 128px; height: 60px; overflow: hidden; }
.speedOptions .speedOption { float: right; width: 60px; height: 60px; margin-left: 2px; margin-right: 2px; margin-top: 0; }
.speedOptions .speedOption1 { background: url(imgspeedlow.png); }
.speedOptions .speedOption1:hover { background: url(imgspeedlow-2.png); }
.speedOptions .speedOption1:active { background: url(imgspeedlow-1.png); }
.speedOptions .speedOption2 { background: url(imgspeedhigh.png); }
.speedOptions .speedOption2:hover { background: url(imgspeedhigh-2.png); }
.speedOptions .speedOption2:active { background: url(imgspeedhigh-1.png); }

.toolbar .pagezoomin { background-image: url(../img/pagezoomin.png); }
.toolbar .pagezoomin:hover { background-image: url(imgpagezoomin-2.png); }
.toolbar .pagezoomin:active { background-image: url(imgpagezoomin-1.png); }
.toolbar .pagezoomout { background-image: url(imgpagezoomout.png); }
.toolbar .pagezoomout:hover { background-image: url(imgpagezoomout-2.png); }
.toolbar .pagezoomout:active { background-image: url(imgpagezoomout-1.png); }

.toolbar .volume { background-image: url(imgvolume.png); }
.toolbar .volume:hover { background-image: url(imgvolume-2.png); }
.toolbar .volume.volumeOpen { background-image: url(imgvolume-1.png); }

.toolbar .read { }
.toolbar .readPoint { background-image: url(imgreadcontinue.png); }
.toolbar .readPoint:hover { background-image: url(imgreadcontinue-2.png); }
.toolbar .readContinue { background-image: url(imgreadpoint.png); }
.toolbar .readContinue:hover { background-image: url(imgreadpoint-2.png); }

.toolbar .crosshair { background-image: url(imgcrosshair.png); }
.toolbar .crosshair:hover { background-image: url(imgcrosshair-2.png); }
.toolbar .crosshair.crosshairOpen { background-image: url(imgcrosshair-1.png); }

.toolbar .screenopen { background-image: url(imgscreenopen.png); }
.toolbar .screenopen:hover { background-image: url(imgscreenopen-2.png); }
.toolbar .screenopen.screenopenOpen { background-image: url(imgscreenclose-1.png); }

.toolbar .fullscreen { background-image: url(imgfullscreen.png); }
.toolbar .fullscreen:hover { background-image: url(imgfullscreen-2.png); }
.toolbar .fullscreen:active { background-image: url(imgfullscreen-1.png); }

.iframeBox { position: fixed; _position: absolute; width: 100%; height: auto; overflow: hidden; top: 80px; left: 0; bottom: 0; z-index: 0; }
.iframeBox iframe { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; }
.x-crosshair1 { z-index: 1; display: none; width: 5px; background: #ff0000; position: absolute; top: 0; left: 0; }
.x-crosshair2 { z-index: 1; display: none; width: 5px; background: #ff0000; position: absolute; top: 0; left: 0; }
.y-crosshair1 { z-index: 1; display: none; height: 5px; background: #ff0000; position: absolute; top: 0; left: 0; }
.y-crosshair2 { z-index: 1; display: none; height: 5px; background: #ff0000; position: absolute; top: 0; left: 0; }

.screen { width: 100%; height: 200px; background: #aaaaaa; position: fixed; _position: absolute; left: 0; bottom: -200px; overflow: hidden; z-index: 0; }
.screen .screenCon { font-weight: bolder; height: 190px; margin-top: 5px; margin-left: 15px; margin-right: 170px; overflow: hidden; background: #ffffff; }
.screen .screenCon .table { border-collapse: separate; border-spacing: 0; width: 100%; height: 190px; overflow: hidden; text-align: center; }
.screen .closeScreen { font-weight: bolder; text-align: center; width: 15px; height: 15px; line-height: 15px; text-decoration: none; background: #ffffff; color: #49484A; display: block; position: absolute; right: 10px; top: 5px; }

.screen .change { width: 60px; height: 200px; overflow: hidden; position: absolute; right: 95px; top: 5px; }
.screen .change .jian { display: block; width: 60px; height: 60px; background: url(imgswichjian.png); }
.screen .change .jian:active { background: url(imgswichjian-1.png); }
.screen .change .jian.down { background: url(imgswichjian-1.png); }

.screen .change .fan { display: block; width: 60px; height: 60px; background: url(imgswichfan.png); margin-top: 5px; }
.screen .change .fan:active { background: url(imgswichfan-1.png); }
.screen .change .fan.down { background: url(imgswichfan-1.png); }

.screen .change .pin { display: block; width: 60px; height: 60px; background: url(imgswichpinyin.png); margin-top: 5px; }
.screen .change .pin:active { background: url(imgswichpinyin-1.png); }
.screen .change .pin.down { background: url(imgswichpinyin-1.png); }

.changeToolbar { width: 60px; height: 125px; overflow: hidden; position: fixed; _position: absolute; bottom: 5px; right: 30px; }
.changeToolbar .changeToToolbar1 { display: block; width: 60px; height: 60px; background: url(imgbarview.png) }
.changeToolbar .changeToToolbar1.down { display: block; width: 60px; height: 60px; background: url(imgbarview-1.png) }
.changeToolbar .changeToToolbar1:hover { display: block; width: 60px; height: 60px; background: url(imgbarview-2.png) }
.changeToolbar .changeToToolbar1:active { display: block; width: 60px; height: 60px; background: url(imgbarview-1.png) }

.changeToolbar .changeToToolbar2 { margin-top: 5px; display: block; width: 60px; height: 60px; background: url(imgbarsound.png) }
.changeToolbar .changeToToolbar2.down { display: block; width: 60px; height: 60px; background: url(imgbarsound-1.png) }
.changeToolbar .changeToToolbar2:hover { display: block; width: 60px; height: 60px; background: url(imgbarsound-2.png) }
.changeToolbar .changeToToolbar2.active { display: block; width: 60px; height: 60px; background: url(imgbarsound-1.png) }

.cover { width: 100%; height: 100%; position: fixed; _position: absolute; top: 0; left: 0; _bottom: 0; z-index: 9999; }
.cover .coverBg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #000000; opacity: 0.5; filter: alpha(opacity = 50); }
.cover .coverTxt { position: absolute; left: 50%; top: 50%; margin-left: -50px; margin-top: -15px; width: 100px; height: 30px; line-height: 30px; font-size: 20px; font-weight: bolder; text-align: center; color: #ffffff; }
