﻿html, body { overflow: hidden;margin:auto;}
	*{ font-family: "Microsoft YaHei","寰蒋闆呴粦";}

.toolbarCover { display: none; width: 100%; height: 110px;margin:auto; overflow: hidden; position: absolute; z-index: 2; background: #000000; top: 0; left: 0; opacity: 0.6; filter: alpha(opacity = 60); border-bottom:2px solid #FFFFFF; }
.toolbar { position:fixed; _position: absolute; z-index: 0;background-color: #7fcbf7; top: 0; left: 0;    margin: 0 auto;width: 100%; height: 110px; overflow: hidden; text-align: center; border-bottom:2px solid #FFFFFF;background-size: 100% 100%;overflow-x: scroll; white-space: nowrap;}
.toolbar::-webkit-scrollbar { width: 0; height:0;!important;}
.toolbar .context{ width:100%; margin:5px auto;align:center;}
.toolbar  a{display:inline-block; *display:inline; zoom:1;float:center;color:#555;font-size:15px; width: 66px;   text-decoration: none;font-weight:500;color:#555; }
.toolbar .toolOption { position: relative; z-index: 1; margin-left: 2px; margin-right: 2px; padding-top: 10px; display: inline-block; background-repeat: no-repeat; }
.toolbar  a img{padding: 2px;}
.toolbar  a p{color: #014aa6;}

.toolbar a:hover img{ background-color: #f95555; }
.toolbar a:active img { background-color: #f95555;}
.toolbar a:hover p{color: #f95555;font-weight:500; }
.toolbar a:active p {color: #f95555;font-weight:500;}
.toolbar .helpOpen img{ background-color: #6EBFF7;}
.toolbar .helpOpen p{color: #6EBFF7;}

.toolbar .helpOpen img{background-color: #f95555;}
.toolbar .helpOpen p{color: #f95555;}
.toolbar .help img:hover { background-color: #f95555; }
.toolbar .help img:active { background-color: #f95555; }
.toolbar .help p:hover { color: #f95555; }
.toolbar .help p:active { color: #f95555; }


.toolbar .home img { }
.toolbar .home img:hover { background-color: #f95555; }
.toolbar .home img:active { background-color: #f95555; }


/*.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); }
*/

.toolbar .modetext .st,.toolbar .modetext .st_img{display:none;}
.toolbar .modeimage .wb,.toolbar .modeimage .wb_img{display:none;}


.toolbar .crosshairOpen img{ background-color: #f95555;}
.toolbar .crosshairOpen p{color: #f95555;font-weight:500;}


.toolbar .colorOpen img{ background-color: #f95555;}
.toolbar .colorOpen p{color: #f95555;font-weight:500;}






#colorOptions { z-index: 3; width: 0; height: 90px; overflow: hidden; position: absolute; left: 0; top:15px;padding-left:5px; }
.colorOptions { width: 350px; height: 90px; overflow: hidden; }
.colorOptions .colorOption { float: left; width: 60px; height: 90px; margin-left: 2px; margin-right: 1px; margin-top: 0; }
.colorOptions a p{font-weight: 400; color:#ffffff;}
.colorOptions .colorSelect{color:#ffffff;width: 66x;height: 90px;text-align: center;line-height: 20px;font-size: 15px;padding: 5px 0;}
.colorOptions .colorSelect1{}
.colorOptions .colorSelect2{}
.colorOptions .colorSelect3{}
.colorOptions .colorSelect4{}
.toolbar .colorOptions .colorSelect1:hover{color:black;}
.toolbar .colorOptions .colorSelect2:hover{color:yellow;}
.toolbar .colorOptions .colorSelect3:hover{color:black;}
.toolbar .colorOptions .colorSelect4:hover{color:yellow;}


/*
.toolbar .color { background-image: url(../img/color01.png); }
.toolbar .color:hover { background-image: url(../img/color01.png); }
.toolbar .color.colorOpen { background-image: url(../img/color01.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/color101.png); }
.colorSelect1.down { background: url(../img/color101.png); }
.colorSelect2 { background: url(../img/color102.png); }
.colorSelect2.down { background: url(../img/color102.png); }
.colorSelect3 { background: url(../img/color103png); }
.colorSelect3.down { background: url(../img/color101.png); }
.colorSelect4 { background: url(../img/color104.png); }
.colorSelect4.down { background: url(../img/color104.png); }
.colorSelect5 { background: url(../img/colorrecovery01.png); }
.colorSelect5:hover { background: url(../img/colorrecovery01.png); }
.colorSelect5.down { background: url(../img/colorrecovery01.png); }
*/


#volumeOptions { z-index: 3;width: 0; height: 90px; overflow: hidden; position: absolute; left: -1000px; top: 10px; padding-top: 5px;     margin-left: 20px; }
.volumeOptions {  }
.volumeOptions .volumeOption { float: left; margin-left: 2px; margin-right: 1px; margin-top: 0; }
#volumeOptions .volumeOptions a{width:60px;color:#ffffff;display:inline-block; *display:inline; zoom:1;}

/*
.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: 90px;overflow: hidden;   position: absolute; right: 0; top: 10px;    padding-top: 5px;
    padding-left: 0px;box-sizing: border-box;margin-right:2px;}
.speedOptions { width: 128px; }
.speedOptions a{width:60px;padding-right:0px; }
.speedOptions a img{width:58px; }
.speedOptions a p{color:white;}
/*
.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); }
.toolbar .fullscreen.fullscreenopen{background-image: url(../img/fullscreen-1.png); }

.toolbar .escscreen { background-image: url(../img/escscreen.png); }
.toolbar .escscreen:hover { background-image: url(../img/escscreen-2.png); }
.toolbar .escscreen:active { background-image: url(../img/escscreen-1.png); }

*/

.toolbar .volumeOpen img{ background-color: #f95555;}
.toolbar .volumeOpen p{color: #f95555;font-weight:500;}

.volumeOptions a p{color:white;}

.toolbar .readPoint .zd,.toolbar .readPoint .zd_img{display:none;}
.toolbar .readContinue .ld,.toolbar .readContinue .ld_img{display:none;}
.yydk,.yydk_img{display:none;}

#volumeOptions { z-index: 3; width: 0; height: 90px; overflow: hidden; position: absolute; left: 0; top: 10px; }
.volumeOptions { width: 192px; height: 90px; overflow: hidden; }
.volumeOptions .volumeOption { float: left; width: 90px; height: 90px; margin-left: 2px; margin-right: 2px; margin-top: 0; }

.volumeOptions .down .yydk,.volumeOptions .down .yydk_img{display:block;}
.volumeOptions .down .yygb,.volumeOptions .down .yygb_img{display:none;}

.iframeBox { position: fixed; _position: absolute; width: 100%; height: auto; overflow: hidden; top: 110px; left: 0; bottom: 0; z-index: 0; border-top:2px  #FFFFFF solid;}
.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; }