/**************************************Canvas序列对比复选框Start********************/
.seriCompareBar { width: 90px; height: 50px; position: absolute; /*background: rgba(0,0,0,0.5);*/ /*display: none;*/ pointer-events: none; }
    .seriCompareBar span { position: absolute; left: 20px; top: -5px; font: 12px/26px Arial, sans-serif; font-weight: bold; color: #FFF; }
    .seriCompareBar > div { width: 60px; height: 18px; background: #333; margin: 20px auto; position: relative; -moz-border-radius: 50px;
                             -webkit-border-radius: 50px; border-radius: 50px; -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); 
                             -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2);
                              box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); }

.seriCompareSlide:before { content: 'ON'; color: #00bf00; position: absolute; left: 3px; top: 0px; font: 12px/23px Arial, sans-serif; font-weight: bold; }
.seriCompareSlide:after { content: 'OFF'; color: #000; position: absolute; right: 3px; top: 0px; font: 12px/23px Arial, sans-serif; font-weight: bold; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.15); }
.seriCompareSlide input[type=checkbox] { visibility: hidden; }
.seriCompareSlide label { pointer-events: auto; display: block; width: 25px; height: 14px; cursor: pointer; position: absolute; top: 2px; left: 2px; z-index: 1; 
                          background: #fcfff4;
                           background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); 
                           background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
                            background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); 
                            border-radius: 50px; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; -webkit-transition: all 0.4s ease; 
                            transition: all 0.4s ease; -moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); }
/**************************************Canvas序列对比复选框End********************/


/**************************************竖屏序列对比复选框Start********************/
.seriCompareSlideSP:before { content: 'ON'; color: #00bf00; position: absolute; left: 3px; top:-5px; font: 12px/23px Arial, sans-serif; font-weight: bold; }
.seriCompareSlideSP:after { content: 'OFF'; color: #000; position: absolute; right: 3px; top: -5px; font: 12px/23px Arial, sans-serif; font-weight: bold; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.15); }
.seriCompareSlideSP input[type=checkbox] { visibility: hidden; }
.seriCompareSlideSP label { pointer-events: auto; display: block; width: 25px; height: 14px; cursor: pointer; position: absolute; top: 2px; left: 2px; z-index: 1; 
                          background: #fcfff4;
                           background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); 
                           background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
                            background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); 
                            border-radius: 50px; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; -webkit-transition: all 0.4s ease; 
                            transition: all 0.4s ease; -moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); }
/**************************************Canvas序列对比复选框End********************/