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(../img/toolbar-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(../img/help.png); }
.toolbar .help:hover { background-image: url(../img/help-2.png); }
.toolbar .help.helpOpen { background-image: url(../img/help-1.png); }
.toolbar .home { background-image: url(../img/home.png); }
.toolbar .home:hover { background-image: url(../img/home-2.png); }
.toolbar .home:active { background-image: url(../img/home-1.png); }
.toolbar .back { background-image: url(../img/back.png); }
.toolbar .back:hover { background-image: url(../img/back-2.png); }
.toolbar .back:active { background-image: url(../img/back-1.png); }
.toolbar .forward { background-image: url(../img/forword.png); }
.toolbar .forward:hover { background-image: url(../img/forword-2.png); }
.toolbar .forward:active { background-image: url(../img/forword-1.png); }
.toolbar .refresh { background-image: url(../img/refresh.png); }
.toolbar .refresh:hover { background-image: url(../img/refresh-2.png); }
.toolbar .refresh:active { background-image: url(../img/refresh-1.png); }

.toolbar .modetext { background-image: url(../img/modetext.png); }
.toolbar .modetext:hover { background-image: url(../img/modetext-2.png); }
.toolbar .modeimage { background-image: url(../img/modeimage.png); }
.toolbar .modeimage:hover { background-image: url(../img/modeimage-2.png); }

.toolbar .color { background-image: url(../img/color.png); }
.toolbar .color:hover { background-image: url(../img/color-2.png); }
.toolbar .color.colorOpen { background-image: url(../img/color-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(../img/color1.png); }
.colorSelect1.down { background: url(../img/color1-1.png); }
.colorSelect2 { background: url(../img/color2.png); }
.colorSelect2.down { background: url(../img/color2-1.png); }
.colorSelect3 { background: url(../img/color3.png); }
.colorSelect3.down { background: url(../img/color3-1.png); }
.colorSelect4 { background: url(../img/color4.png); }
.colorSelect4.down { background: url(../img/color4-1.png); }
.colorSelect5 { background: url(../img/colorrecovery.png); }
.colorSelect5:hover { background: url(../img/colorrecovery-2.png); }
.colorSelect5.down { background: url(../img/colorrecovery-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(../img/volumemute.png); }
.volumeOptions .volumemute:hover { background: url(../img/volumemute-2.png); }
.volumeOptions .volumemute.down { background: url(../img/volumemute-1.png); }
.volumeOptions .volumeOption1 { background: url(../img/volumedown.png); }
.volumeOptions .volumeOption1:hover { background: url(../img/volumedown-2.png); }
.volumeOptions .volumeOption1:active { background: url(../img/volumedown-1.png); }
.volumeOptions .volumeOption2 { background: url(../img/volumeup.png); }
.volumeOptions .volumeOption2:hover { background: url(../img/volumeup-2.png); }
.volumeOptions .volumeOption2:active { background: url(../img/volumeup-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(../img/speedlow.png); }
.speedOptions .speedOption1:hover { background: url(../img/speedlow-2.png); }
.speedOptions .speedOption1:active { background: url(../img/speedlow-1.png); }
.speedOptions .speedOption2 { background: url(../img/speedhigh.png); }
.speedOptions .speedOption2:hover { background: url(../img/speedhigh-2.png); }
.speedOptions .speedOption2:active { background: url(../img/speedhigh-1.png); }

.toolbar .pagezoomin { background-image: url(../img/pagezoomin.png); }
.toolbar .pagezoomin:hover { background-image: url(../img/pagezoomin-2.png); }
.toolbar .pagezoomin:active { background-image: url(../img/pagezoomin-1.png); }
.toolbar .pagezoomout { background-image: url(../img/pagezoomout.png); }
.toolbar .pagezoomout:hover { background-image: url(../img/pagezoomout-2.png); }
.toolbar .pagezoomout:active { background-image: url(../img/pagezoomout-1.png); }

.toolbar .volume { background-image: url(../img/volume.png); }
.toolbar .volume:hover { background-image: url(../img/volume-2.png); }
.toolbar .volume.volumeOpen { background-image: url(../img/volume-1.png); }

.toolbar .read { }
.toolbar .readPoint { background-image: url(../img/readcontinue.png); }
.toolbar .readPoint:hover { background-image: url(../img/readcontinue-2.png); }
.toolbar .readContinue { background-image: url(../img/readpoint.png); }
.toolbar .readContinue:hover { background-image: url(../img/readpoint-2.png); }

.toolbar .crosshair { background-image: url(../img/crosshair.png); }
.toolbar .crosshair:hover { background-image: url(../img/crosshair-2.png); }
.toolbar .crosshair.crosshairOpen { background-image: url(../img/crosshair-1.png); }

.toolbar .screenopen { background-image: url(../img/screenopen.png); }
.toolbar .screenopen:hover { background-image: url(../img/screenopen-2.png); }
.toolbar .screenopen.screenopenOpen { background-image: url(../img/screenclose-1.png); }

.toolbar .fullscreen { background-image: url(../img/fullscreen.png); }
.toolbar .fullscreen:hover { background-image: url(../img/fullscreen-2.png); }
.toolbar .fullscreen:active { background-image: url(../img/fullscreen-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(../img/swichjian.png); }
.screen .change .jian:active { background: url(../img/swichjian-1.png); }
.screen .change .jian.down { background: url(../img/swichjian-1.png); }

.screen .change .fan { display: block; width: 60px; height: 60px; background: url(../img/swichfan.png); margin-top: 5px; }
.screen .change .fan:active { background: url(../img/swichfan-1.png); }
.screen .change .fan.down { background: url(../img/swichfan-1.png); }

.screen .change .pin { display: block; width: 60px; height: 60px; background: url(../img/swichpinyin.png); margin-top: 5px; }
.screen .change .pin:active { background: url(../img/swichpinyin-1.png); }
.screen .change .pin.down { background: url(../img/swichpinyin-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(../img/barview.png) }
.changeToolbar .changeToToolbar1.down { display: block; width: 60px; height: 60px; background: url(../img/barview-1.png) }
.changeToolbar .changeToToolbar1:hover { display: block; width: 60px; height: 60px; background: url(../img/barview-2.png) }
.changeToolbar .changeToToolbar1:active { display: block; width: 60px; height: 60px; background: url(../img/barview-1.png) }

.changeToolbar .changeToToolbar2 { margin-top: 5px; display: block; width: 60px; height: 60px; background: url(../img/barsound.png) }
.changeToolbar .changeToToolbar2.down { display: block; width: 60px; height: 60px; background: url(../img/barsound-1.png) }
.changeToolbar .changeToToolbar2:hover { display: block; width: 60px; height: 60px; background: url(../img/barsound-2.png) }
.changeToolbar .changeToToolbar2.active { display: block; width: 60px; height: 60px; background: url(../img/barsound-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; }