@import "value.scss"; @import "iconfont.scss"; html,body{ font-family:'PingFang SC','Microsoft Yahei'; width:100%; height:100%; min-width:1200px; overflow:hidden; overflow-x: auto; font-size:12px; margin:0px; padding:0px; background-color:$htmlbg; color:$normalfont; font-weight: 400; } .mainBody{ position: relative; width:100%; height:100%; } .iconfont{ color:#9d9d9d; vertical-align:middle; margin-top:-3px; display:inline-block; margin-right:3px; } .iconfont.active, .active>.iconfont, .activemore>.iconfont{ color:#4186ec; } .sidebarNav li:not(.activemore):hover .iconfont{ color: $menulihoverft; } .toggleBtn{ border-left: 1px solid #ffffff; margin-left: -102px; display:inline-block; margin-top:4px; a{ border:1px solid #ffffff; border-radius:100px; color:#ffffff; width:118px; height:24px; color:#ffffff; text-align:center; line-height:24px; display:inline-block; margin-left:20px; &:before{ content:url(../images/whiteArrow.png); width:7px; height:6px; padding-right:6px; } } } .icon-logo{ font-size:25px; color:#fff; margin-top:1px; } .app-type{ .iconfont.active, .active>.iconfont,.sidebarNav li:hover .iconfont{ color:$activebgcolor; } } .icon-customset,.activemore .icon-customset{ position:absolute; right: 40px; top: 2px; color:#9d9d9d; &:hover{ color:#4186ec; } } .selList.appWrap.app-type{ b,i{display:none;} } .specChannelTip{ height:30px; line-height: 30px; text-align:center; background-color:#ffe9ad; text-decoration:underline; display:none; cursor: pointer; color:#454440; border:1px solid #f7d57f; } .specChannelTip.showmysch{ display:block; } ::-webkit-scrollbar { width: 6px; height: 7px; } ::-webkit-scrollbar-track { /*background-color: #dcdcdc;*/ border-radius: 10px; } ::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.2); border-radius: 10px; } ::-webkit-scrollbar-button { /* background-color: #ccc;*/ } .hm-scroll::-webkit-scrollbar { width: 5px; } .hm-scroll::-webkit-scrollbar-thumb { background-color: #e1e3e4; background-clip: content-box; border-top: 5px solid rgba(255, 255, 255, 0); border-bottom: 5px solid rgba(255, 255, 255, 0); border-right: 4px solid rgba(255, 255, 255, 0); border-radius:none; } .hm-scroll::-webkit-scrollbar-track { background-color: transparent; border-radius:none; } .grayhm .tableList{ max-height:600px; overflow-y:auto; } .grayhm{ .hm-scroll::-webkit-scrollbar { width: 10px; } .hm-scroll::-webkit-scrollbar-thumb { background-clip: border-box; border-radius: 10px; } .hm-scroll::-webkit-scrollbar-track { background-color: #dcdcdcd; } } ul,li,p,a,h1,h2,h3,h4,h5,h6,dl,dt,dd,ol{padding:0px;margin:0px;list-style-type: none;text-decoration:none;} input,a{outline:none;} table{margin:0px;padding:0px;border-collapse:collapse;} em{font-style:normal;} .mr5{margin-right:5px;} .mr10{margin-right:10px;} .mr20{margin-right:20px;} .mr30{margin-right:30px;} .mt10{margin-top:10px;} .mt15{margin-top:15px;} .mt20{margin-top:20px;} .mt50{margin-top:50px;} .ml5{margin-left:5px;} .ml10{margin-left:10px;} .ml15{margin-left:15px;} .ml20{margin-left:20px;} .ml30{margin-left:30px;} .ml27{margin-left:27px;} .ml40{margin-left:40px;} .ml50{margin-left:50px;} .mb10{margin-bottom:10px;} .mb20{margin-bottom:20px;} .mb40{margin-bottom:40px !important;} .mb10{margin-bottom:10px;} .pb20{padding-bottom:20px;} .mtModel{margin-top: 20px;} .height30{height:30px; overflow: hidden; clear: both;} .pt5{padding-top:5px;} .left{float:left;} .right{float:right;} .hand{cursor: pointer;} .ckhand,.desc.ckhand{cursor: pointer;color:$activebgcolor;} .ckblue{font-size:12px;color:$formbluecolor;cursor:pointer;text-decoration:none;} .lh32{line-height: 32px;} .center{text-align:center;} .formDetailItem .toblock, .toblock{float:none;display: inline-block;vertical-align:middle;} .p{position:relative;} .p.zidx{z-index: 1;} .label{ color:$labelfontcolor; } .lglabel{ color:$lightfontcolor; } .tiplabel{ color:$tipftcolor; font-size:12px; margin-left: 20px; line-height: 34px; } ul li .darklabel,.darklabel{color:$darkfontcolor;} .smartlabel,.wrapTitle .smartlabel{ color:$lightfontcolor; font-size:12px; font-style:normal; } .channelSEL{ position:relative; display:inline-block; cursor: pointer; } .divcenter,.tableList .divcenter{ float:none; display:inline-block; margin:0 auto; } .channelSEL .iptform{cursor:pointer;} .nowrap{ white-space: nowrap; text-overflow: ellipsis; overflow-x:hidden; } .p{ position:relative; } .pcenter{ position:absolute; left:0px; top:50%; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); } .clear{ clear: both; } .clearfix:after { content:"\200B"; display:block; height:0; clear:both; } .clearfix {*zoom:1;} .myanm{ -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; } .myicon{ background-image:url(../images/icon2_2.png); background-repeat:no-repeat; } .packageIcon{ @extend .ckhand; width: 16px; height: 16px; display:inline-block; vertical-align:middle; border-radius:50%; border:1px solid $activebgcolor; font-size:8px; text-align:center; line-height: 16px; } .header{ height:$headerH; background-color:$headerbg; position: relative; z-index: 10; } .noreport .header{ background-color:$logobg; } .leftHeader{ width:$leftwidth; height:100%; text-align:center; display:inline-block; vertical-align:middle; background-color:$logobg; color:$logoFontColor; line-height: $headerH; float:left; } .leftHeader .logimg{ width:100px; height:24px; cursor: pointer; // margin-left:16px; margin-top:11px; background:url(../images/logo_.png) no-repeat center center; // background-size:100%; } .appicon{ @extend .myicon; height:20px; width:20px; display:inline-block; vertical-align:middle; margin-left:20px; margin-top:-2px; } .apple.appicon{ background-position:-12px -114px; } .android.appicon{ background-position:-40px -114px; } .web.appicon{ background-position:-101px -115px; width: 19px; height: 19px; } .rightHeader{ vertical-align:middle; padding:6px 0px; height:$iptheight; margin-left:$leftwidth; padding-left:$menuContGap; border-bottom:1px solid $headerbc; background-color:$logobg; } .channelTop { position:relative; z-index:1005; } .rightHeader .nociceInfo{ color:#fff; cursor: pointer; float: right; margin-right: 60px; line-height: $iptheight; } .noticeIcon{ @extend .myicon; height:16px; width:14px; display:inline-block; vertical-align:middle; margin-top: -2px; margin-right:6px; background-position:-130px -117px; cursor: pointer; } .rightHeader .wapSetInfo{ float:right; margin-right: 20px; cursor: pointer; line-height: $iptheight; label{ font-size: 14px; color: #ffffff; padding-left: 6px; cursor: pointer; } } .helpIcon{ @extend .myicon; height:16px; width:16px; display:inline-block; vertical-align:middle; margin-top: -2px; margin-right:8px; background-position:-10px -88px; cursor: pointer; } .helpInfo:hover .helpIcon,.helpIcon:hover{ background-position:-36px -88px; } .backRepIcon{ @extend .myicon; height:14px; width:14px; display:inline-block; vertical-align:middle; background-position:-197px -87px; margin-right:5px; margin-top:-2px; } .backRepWrap{ color:$comactiveftcolor; cursor: pointer; float:left; line-height: 34px; } .settingIcon{ background:url(../images/product02.png) no-repeat; cursor:pointer; } .settingBtn{ @extend .setIcons; background-position:-43px -6px; width: 24px; height: 24px; position:relative; cursor: pointer; } .settingBtn:hover,.settingBtn.active{ background-position:-43px -40px; } .settingList:before{ position:absolute; content:""; background:url(../images/arrow.png) no-repeat center bottom; width:100%; bottom:100%; height:12px; } .settingList{ background-color:#fff; border:1px solid $bordercolor; padding:10px 0px; position:absolute; top:100%; left:50%; transform: translateX(-50%); box-sizing: border-box; width:140px; margin-top:5px; display:none; @extend .animt; } .settingList li{ padding:0px 20px; line-height: 36px; cursor:pointer; color:$darkfontcolor; @extend .animt; height: 0px; } .settingList li .product{ @extend .settingIcon; background-position:-10px -12px; width:14px; height:14px; display: inline-block; vertical-align:middle; margin-right:5px; margin-top:-2px; } .settingList li.active .product,.settingList li:hover .product{ background-position:-32px -12px; } .settingList li .auth{ @extend .settingIcon; background-position:-9px -36px; width:16px; height:14px; display: inline-block; vertical-align:middle; margin-right:5px; margin-top:-2px; } .settingList li.active .auth,.settingList li:hover .auth{ background-position:-31px -36px; } .settingList li .channel{ @extend .settingIcon; background-position:-10px -80px; width:16px; height:14px; display: inline-block; vertical-align:middle; margin-right:5px; margin-top:-2px; } .settingList li.active .channel,.settingList li:hover .channel{ background-position:-30px -80px; } .settingList li .sysparams{ @extend .settingIcon; background-position:-10px -120px; width: 14px; height: 14px; display: inline-block; vertical-align:middle; margin-right:5px; margin-top:-2px; } .settingList li.active .sysparams,.settingList li:hover .sysparams{ background-position:-30px -120px; } .settingList li.active,.settingList li:hover{ color:$activebgcolor; } .setmore .settingList{ display:block; } .setmore .settingList li{ height:auto; } .appReportIcon{ @extend .settingIcon; background-position:-11px -100px; width:11px; height:12px; display: inline-block; vertical-align:middle; margin-left: 3px; } .copyBtnIcon{ background: url(../images/copy.png) no-repeat; width:12px; height:12px; display: inline-block; vertical-align:middle; margin-left: 3px; margin-top: -3px; cursor: pointer; &:hover{ background: url(../images/copy_hover.png) no-repeat; } } .rightHeader .helpInfo:hover{ color:$comactiveftcolor; } .rightHeader .flowinfo{ float:right; width:20px; height:34px; vertical-align:middle; line-height: $iptheight; margin-top:5px; } .rightHeader .userinfo{ float:right; vertical-align:middle; line-height: $iptheight; cursor:pointer; position:relative; } .userInfoWrap{ background-color:#fff; border:1px solid $bordercolor; border-radius:$comradius; box-sizing: border-box; width:280px; position:absolute; top:100%; right:-10px; } .userInfoWrapFlow { width:340px; } .userInfoWrap:before{ position:absolute; content:""; background:url(../images/arrow.png) no-repeat center bottom; width:12px; bottom:100%; right:15px; height:12px; } .userInfoWrap .userInfoDetail{ padding:20px 0 20px 20px; padding-bottom:0px; } .userInfoWrap .userInfoDetail .itemInfo{ line-height: 25px; padding-bottom:15px; } .userInfoWrap .userInfoBottom .itemBtn{ background:#ffffff; border:1px solid #c9c9c9; border-radius:3px; color:#333333; width:70px; height:28px; text-align: center; display: inline-block; line-height: 28px; margin-right: 14px; } .flowCircle { background:#ff3000; width:6px; height:6px; border-radius:100%; position: relative; left: -8px; z-index: 10; } .allflow { width:70px; height:6px; border-radius: 3px 3px; background:#e5e1e1; display:inline-block; } .userflowText { display:inline-block; } .useflow { height:6px; border-radius: 3px 3px; background:#6ecbee; } .useflowRed { background:#e88876; } .userInfoWrap .itemInfo.light{ color:$labelfontcolor; } .userInfoWrap .userInfoBottom{ height: 38px; line-height: 38px; text-align: center; padding-bottom: 24px; } .userInfoBottom .itemInfo{ width:49%; box-sizing: border-box; text-align:center; display:inline-block; } .userInfoBottom .itemInfo:hover{ color:$menuliactiveft; } .userInfoBottom .itemBtn:hover{ border:1px solid $menuliactiveft; color:$menuliactiveft; } .userInfoBottom .itemInfo:first-child{ border-right:1px solid $userbottombr; } .userInfoBottom.third{ .itemInfo:nth-child(1){ width:100px; } .itemInfo:nth-child(2){ border-right:1px solid $userbottombr; width:100px; } .itemInfo:nth-child(3){ width:70px; } .appLIcon{ @extend .setIcons; background-position:-113px -73px; width: 13px; height: 13px; cursor: pointer; margin-right:5px; } .appLIcon.active ,.appLIcon:hover{ background-position:-136px -73px; } } .userInfoBottom.byflow{ .itemInfo:nth-child(1){ width:120px; } .itemInfo:nth-child(2){ border-right:1px solid $userbottombr; width:120px; } .itemInfo:nth-child(3){ width:90px; } .appLIcon{ @extend .setIcons; background-position:-113px -73px; width: 13px; height: 13px; cursor: pointer; margin-right:5px; } .appLIcon.active ,.appLIcon:hover{ background-position:-136px -73px; } } .userInfoBotton{ width:49% !important; } .app_icon{ background:url(../images/app.png) no-repeat; display: inline-block; width: 16px; height: 16px; line-height: 34px; vertical-align: middle; margin-top: -3px; margin-right: -6px; } .userIcon{ @extend .myicon; height:16px; width:14px; display:inline-block; vertical-align:middle; margin-right:6px; background-position:-89px -88px; cursor: pointer; } .userflowType { margin-top:5px !important; float: right; width: 55px; height: 16px; } .flowType { @extend .setIcons; width:55px; height:16px; line-height:14px; text-align:center; color:#fff; background-position:-172px -8px; } .flowTypeRed { background-position:-172px -41px; } .userflowTypeLong { margin-top:5px !important; float: right; width: 68px; height: 16px; } .flowTypeRedLong { @extend .setIcons; width:68px; height:16px; line-height:14px; text-align:center; color:#fff; background-position:-162px -72px; } .small-font{ text-indent:7px; font-size:12px; -webkit-transform-origin-x: 0; -webkit-transform: scale(0.90); } .smallsize-font{ font-size:9.6px; } .userinfo .downIcon{ @extend .myicon; height:5px; width:8px; display:inline-block; vertical-align:middle; margin-left:6px; margin-top:-2px; background-position:-118px -93px; cursor: pointer; } .arrowIcon{ @extend .myicon; height:5px; width:8px; float:right; margin-top:14px; margin-right:10px; background-position:-118px -93px; cursor: pointer; } .userinfo.active .downIcon,.active .arrowIcon{ background-position:-144px -93px; } .whiteArrowIcon{ @extend .myicon; height:5px; width:8px; float:right; margin-top:7px; margin-right:10px; background-position:-128px -160px; cursor: pointer; } .active .whiteArrowIcon{ background-position:-154px -160px; } .setIcons{ background-image:url(../images/set4.png); background-repeat:no-repeat; display:inline-block; vertical-align:middle; margin-top:-2px; } .logtoolIcon{ @extend .setIcons; background-position:-107px -6px; width: 24px; height: 24px; cursor: pointer; } .logtoolIcon:hover ,.logtoolIcon.active{ background-position:-107px -40px; } .userIconN{ @extend .setIcons; background-position:-77px -6px; width: 24px; height: 24px; cursor: pointer; } .userIconN:hover ,.userIconN.active{ background-position:-77px -40px; } .helpIconN{ @extend .setIcons; background-position:-10px -6px; width: 24px; height: 24px; cursor: pointer; } .helpIconN:hover ,.helpIconN.active{ background-position:-10px -40px; } .productIconN{ @extend .setIcons; background-position:-138px -6px; width: 24px; height: 24px; cursor: pointer; } .productIconN:hover ,.productIconN.active{ background-position:-138px -40px; } .userPrizeIcon{ @extend .setIcons; width: 16px; height: 16px; } .regPrize{ background-position:-5px -99px; } .cuPrize{ background-position:-28px -99px; } .suPrize{ background-position:-52px -99px; } .goldPrize{ background-position:-73px -99px; } .damPrize{ background-position:-93px -101px; margin-top:0px; } .usetIcon{ @extend .setIcons; background-position:-26px -73px; width: 16px; height: 16px; cursor: pointer; margin-right:5px; margin-top:-3px; } .usetIcon.active{ background-position:-69px -73px; } .logoutIcon{ @extend .setIcons; background-position:-7px -74px; width: 13px; height: 15px; cursor: pointer; margin-right:5px; margin-top:-3px; } .logoutIcon.active{ background-position:-50px -74px; } .iptform{ border:1px solid $bordercolor; color:$darkfontcolor; padding-left:10px; height:$iptheight; line-height: $iptheight; display:inline-block; vertical-align:middle; width:160px; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .iptform.disable{ background-color:$eventbg; } .iptform.moredata{ width:220px; height:auto; padding-bottom:5px; line-height:28px; } .iptform.nobr{ height:20px; line-height:20px; border:none; background-color:transparent; } .iptform.iptnull,.selList.iptnull,.iptnull .iptform{ border-color:$formred; } textarea.iptform{ height:50px; resize:none; } .mybtn{} .mybtn.h30{ height:30px; line-height: 30px; } .mybtn.disable,.mybtn.disable:hover{ background-color:#f5f5f5; color:#aaa; cursor: default; border:1px solid $bordercolor; } .btn{ height:$btnheight; line-height:$btnheight; border:1px solid $bordercolor; color:$lightfontcolor; padding:0px 10px; float:left; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color:$defaultbg; cursor:pointer; } .btn.active,.btn.active:hover,.btnactive{ background-color:$logobg; border-color:$logobg; color:$activeftcolor; } .btn3{ height:$btnheight; line-height:$btnheight; border-color:$logobg; color:$activeftcolor; padding:0px 10px; float:left; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color:$logobg; cursor:pointer; } .btn3.lh30{ height:30px; line-height: 30px; } .btn3.toblock{float:none;display: inline-block;vertical-align:middle;} .btn3.oneCenter{ float:none; text-align:center; margin:0px auto; width:70px; } .btn2{ border:1px solid $bordercolor; color:$lightfontcolor; padding:6px; float:left; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color:$defaultbg; cursor:pointer; font-size:12px; margin-right: 5px; line-height:1em; } .btn2.big{ font-size:14px; padding:9px; } .btn2.dis{ border-color:$btndiscolor; color:$btndiscolor; cursor: default; } .btn:hover,.btn2.active{ border-color:$logobg; color:$logobg; } .btn4{ border:1px solid $logobg; color:$activeftcolor; padding:6px 6px; float:left; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color:$logobg; cursor:pointer; font-size:12px; margin-right: 5px; line-height:1em; } .btn5{ border:1px solid $logobg; color:$activeftcolor; height:$btnheight; line-height:$btnheight; float:left; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color:$logobg; cursor:pointer; font-size:12px; } .btn5.conwidth{width:70px;text-align:center;font-size:14px;} .btn6{ border:1px solid $bordercolor; color:$lightfontcolor; height:$btnheight; line-height:$btnheight; float:left; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color:$defaultbg; cursor:pointer; font-size:12px; } .btn7{ @extend .btn3; background-color:$btngraybg; } .btn7:hover{ background-color:$logobg; } .btn8{ @extend .btn; background-color:$btngraybg1; color:#666; } .btn8.dark:hover,.btn8.dark.active,.btn8.btnNo.dark:hover,.btn8.btnNo.dark.active{ color:$darkbluecolor; } .btn8.dark.dis:hover{ cursor:default; color:$lightfontcolor; } .btn.btnblock,.btn2.btnblock,.btn3.btnblock,.btn4.btnblock,.btn5.btnblock,.btn6.btnblock,.btn7.btnblock{ float:none;display:inline-block;vertical-align: middle; } .btnNo{ margin-left: -5px; border-top-left-radius:0px; border-bottom-left-radius:0px; } .btn.btnNo:hover,.btn.btnNo.active{ background-color:$defaultbg; border:1px solid $bordercolor; color:$activebgcolor; } .selList.noright{ border-top-right-radius:0px; border-bottom-right-radius:0px; } .contentWrap{ position: absolute; top:$headerH; bottom:0px; left:0px; right:0px; } .leftSidebar{ height:100%; background-color:$menubgcolor; float:left; position: absolute; //overflow-y:auto; border-right: 1px solid #e4e4e4; z-index: 99; box-sizing: border-box; } .sidebarNav{ width:100%; // padding-top:$menuTop; padding-bottom:30px; padding-top:10px; } .sidebarNav li{ height:$menuliheight; line-height:$menuliheight; padding-left:$menupadleft; border-left:$menulibw solid transparent; -webkit-transition:all 0.1s ease-in-out; -moz-transition:all 0.1s ease-in-out; transition:all 0.1s ease-in-out; cursor:pointer; } .subliWrap li{ -webkit-transition:all 0.1s ease-out; -moz-transition:all 0.1s ease-out; transition:all 0.1s ease-out; height:0px; overflow:hidden; } .subliWrap li a{ font-size:12px; } .subliWrap.subshow li{ height:32px; line-height:32px; } .menuicon{ @extend .myicon; height:16px; width:16px; display:inline-block; vertical-align:middle; margin-right:14px; margin-top:-2px; } .sidebarNav li .downicon{ @extend .menuicon; height:9px; width:5px; background-position:-67px -66px; float:right; margin-top:14px; margin-right: 18px; } .sidebarNav li.activemore .downicon{ @extend .menuicon; height:5px; width:9px; background-position:-91px -68px; float:right; margin-top:15px; margin-right: 18px; } .sidebarNav li:not(.activemore):not(.active):hover a{ color:$menulihoverft; } .sidebarNav li.active{ background-color:$menuliactivebg; border-left-color:$menuliactivebc; } .sidebarNav li.subli{ border-left-color:transparent; border-left-width: 3px; } .sidebarNav a{ text-decoration:none; color:$menuftcolor; font-size:14px; } .sidebarNav .active a ,.sidebarNav .activemore a { color:$menuliactiveft; } .sidebarNav .subli{ padding-left:40px; } .sidebarNav .subli.active{ border-left-color:$menuliactivebc; background-color:$menuliactivebg; } .sidebarNav .subli.active a{ color:$menuliactiveft; } .sidebarNav .subli:hover{ background:$menulihoverbg; } .submenuIcon{ background:url(../images/submenu.png) no-repeat; width: 15px; height: 16px; } .rightWrap{ width:100%; height:100%; float:right; overflow-y:auto; } .rightContent{ margin-left:186px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; padding:$contentp; // overflow-x:auto; // min-width:1000px; min-height:100%; // padding-bottom:50px; } .noreport .rightContent{ margin-left:0px; } .timeBtnWrap{ margin-bottom:$contentp; } .timeBtnWrap .btn{ margin-right:10px; } .timeBtnWrap.btn100 .btn{ width:100px; text-align:center; } .timeBtnWrap.timeBlock{ display: inline-block; vertical-align: middle; margin-bottom: 0px; } .wrapTitle2{ margin-right: -10px; } .wrapTitle2 .titlewrap{ width:50%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right:10px; float:left; } .wrapTitle{ height:$wraptitleH; background-color:$wraptitlebgc; border:1px solid $wraptitlebrc; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .wrapTitle.condition{ height:70px; padding-left: 20px; } .wrapTitle>span{ margin-left:20px; line-height:$wraptitleH; font-size:18px; } .wrapTitle .wrapMenu{ height:$wraptitleH; line-height:$wraptitleH; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom:2px solid transparent; padding:0px 20px; display:inline-block; cursor:pointer; @extend .myanm; } .wrapTitle .wrapMenu.active{ border-color:$activebgcolor; cursor: default; } .wrapTitle .selList{ margin-top:7px; margin-right: 10px; } .wrapTitle.condition .selList{ margin-top:17px; } .searchGroup .selList{ margin:0; } .chartWrap{ margin-top:$itemGap; margin-bottom:$itemGap; margin-right:-$itemGap; } .chartWrap.bigWrap{ border:1px solid $wraptitlebrc; border-radius:$comradius; background-color:$defaultbg; } .chartWrap .channelModule{ height:$iptheight; border:1px solid $wraptitlebrc; border-top-left-radius:$comradius; border-top-right-radius:$comradius; background:$tablethbg; } .chartWrap .channelModule>span{ line-height:$iptheight; font-size:18px; margin-left:20px; } .tabMenuChanel{ float:left; // overflow:hidden; } .tabMenuChanel.formTab{ float:none; background-color:$tablethbg; border:1px solid $wraptitlebrc; border-bottom:none; } .tabMenuChanel li{ height:$iptheight; line-height:$iptheight; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom:2px solid transparent; padding:0px 14px; display:inline-block; margin-left:-4px; cursor:pointer; @extend .myanm; } .tabMenuChanel.smallTab li{ height:35px; line-height: 35px; } .tabMenuChanel.formTab li,.tabMenuChanel.leftBorder li{ position:relative; font-size:14px; } .tabMenuChanel.formTab li:after,.tabMenuChanel.leftBorder li:after{ width:1px; background-color:$bordercolor; content:""; position:absolute; top:7px; bottom:5px; right:0px; } .tabMenuChanel.formTab li:last-child:after,.tabMenuChanel.leftBorder li:last-child:after{ width:0px; } .tabMenuChanel li.active{ border-color:$activebgcolor; cursor: default; } .tabMenuChanel.formTab li.active,.tabMenuChanel.leftBorder li.active{ border-color:transparent; color:$formbluecolor; } .formChannelInfo { padding:20px; border: 1px solid $tablebr; border-top:none; background:$defaultbg; border-radius:0 0 3px 3px; } .formDisabled{ padding:20px; } .formBody { height: 149px; overflow: hidden; } .formBody2 { height: 357px; overflow: hidden; } .formBody3 { height: 251px; overflow: hidden; } .formAlpha{ position: relative; top: -148px; width: 100%; height: 111px; padding-top:38px; background: rgba(0,0,0,0.5); border-radius:0 0 3px 3px; color:#fff; font-size: 16px; line-height:36px; text-align: center; } .formAlpha .phone, .formAlpha2 .phone, .formAlpha3 .phone{ font-size: 14px; } .formAlpha .phone a, .formAlpha2 .phone a, .formAlpha3 .phone a{ color:#a1c2fc; text-decoration:underline; margin:0 5px; } .buttonAlpha { margin-left:85px; } .formAlpha2{ position: relative; top: -357px; width: 100%; height: 216px; padding-top:142px; background: rgba(0,0,0,0.5); border-radius:0 0 3px 3px; color:#fff; font-size: 16px; line-height: 36px; text-align: center; } .formAlpha3{ position: relative; top: -75px; height: 70px; padding: 5px 20px 0 20px; background: rgba(0,0,0,0.5); border-radius:0 0 3px 3px; color:#fff; font-size: 16px; line-height: 36px; text-align: center; } .channelSetText { font-size:$labelfz; color:$labelbr; text-align:left; margin-bottom:24px; } .channelSetTitle { font-size:14px; color:#333; height:38px; line-height:38px; padding-left:10px; border: 1px solid $tablebr; background:$tablethbg; border-radius:3px 3px 0 0; } .channelBlackText { padding-left:153px; font-size:$labelfz; color:$labelbr; line-height:20px; padding-top:10px; } .channelSetOK{ float:right; font-size:12px; color:#666; padding-right:10px; } .channelSetOK span{ margin-top:-3px; } .selListChannel { display:inline-block; width:120px; } .channelCData { width:640px !important; } .channelCIP { width:360px !important; } .channelCIP input{ width:160px !important; } .channelCIPText { font-size:12px; color:#999; padding-left:24px; } .channelCIPTitle { font-size:14px; color:#333; text-align:center; } .formsaveIP{ margin:0 auto; width:220px; padding-bottom:20px; } .formsaveIP .btn5 ,.formsaveIP .btn6{ width:90px; text-align:center; margin:0 10px; } .channelCIP .formDetailItem { margin-bottom:20px !important; } .chartWrap .chartModule{ height:$wraptitleH; background-color:$wraptitlebgc; border:1px solid $wraptitlebrc; border-top-left-radius:$comradius; border-top-right-radius:$comradius; } .chartWrap .chartModule>span{ line-height:$wraptitleH; font-size:18px; margin-left:20px; } .tabMenu{ float:left; // overflow:hidden; } .tabMenu.formTab{ float:none; background-color:$tablethbg; border:1px solid $wraptitlebrc; border-bottom:none; } .tabMenu li{ height:$wraptitleH; line-height:$wraptitleH; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom:2px solid transparent; padding:0px 14px; display:inline-block; margin-left:-4px; cursor:pointer; @extend .myanm; } .tabMenu.smallTab li{ height:35px; line-height: 35px; } .tabMenu.formTab li,.tabMenu.leftBorder li{ position:relative; font-size:14px; } .tabMenu.formTab li:after,.tabMenu.leftBorder li:after{ width:1px; background-color:$bordercolor; content:""; position:absolute; top:7px; bottom:5px; right:0px; } .tabMenu.formTab li:last-child:after,.tabMenu.leftBorder li:last-child:after{ width:0px; } .tabMenu li.active{ border-color:$activebgcolor; cursor: default; } .tabMenu.formTab li.active,.tabMenu.leftBorder li.active{ border-color:transparent; color:$formbluecolor; } .formTabMenu{ height:40px; line-height:40px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom:1px solid $bordercolor; } .formTabMenu li{ position:relative; padding:0px 14px; display:inline-block; cursor: pointer; margin-left:-4px; } .formTabMenu li:after{ width:1px; background-color:$bordercolor; content:""; position:absolute; top:7px; bottom:8px; right:0px; } .formTabMenu li:first-child{ padding-left: 0px; } .formTabMenu li:last-child:after{ width:0px; } .formTabMenu li.active{ color:$formbluecolor; cursor: default; } .rigthM{ padding-top: 8px;padding-right: 10px; } .chartWrap .chartWrapItem{ float:left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: $itemGap; width:100%; } .chartWrap.two .chartWrapItem{ width:50%; } .chartWrap.three .chartWrapItem{ width:33.333%; } .chartItem{ border:1px solid $wraptitlebrc; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding:$wrapPadding; background-color:$defaultbg; min-height:200px; } .titleChart .chartItem{ border-top-left-radius:0px; border-top-right-radius:0px; border-top:none; } .chartWrap.bigWrap .chartItem{ border:none; border-radius:none; padding:10px; } .chartItem.tolist{ padding:0px; height:474px; } .chartItem.tolist.charth{ height:370px; } .chartItem.tolist .tableList{ max-height:474px; overflow-x:hidden; overflow-y:auto; } .chartItem.tolist.charth .tableList{ max-height:370px; } .chartItem.tolist .tableList table th,.nothborder .tableList table th{ border-top:none; } .chartItem.tolist .tableList table tr td:first-child,.chartItem.tolist .tableList table tr th:first-child{ border-left:none; } .chartItem.tolist .tableList table tr td:last-child,.chartItem.tolist .tableList table tr th:last-child{ border-right:none; } .tabpro{ display:inline-block; width:50%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right:10px; } .tabpro .tabTxt{ text-align:right; } .tabproBar{ width:100%; height:8px; } .tabproBar .proing{ @extend .myanm; background-color:$tabbarcolor; height:100%; } .tabproBar .proing.gray{ background-color:$tabbarbgcolor; } .chartWrap .chartTitle{ // overflow:hidden; line-height:25px; @extend .clearfix; } .chartBtnWrap{ float:right; overflow:hidden; margin-right:-5px; font-size:12px; color:$itemstrong; } .chartWrap .chartTitle.subtitle{ margin-bottom:20px; } .chartWrap .chartTitle h4{ font-size:16px; font-weight:normal; float:left; padding-left:10px; } .chartWrap .chartTitle .dataInfo{ float:right; margin-left: 10px; } .chartWrap .chartTitle .dataInfo label{ color:$itemlabel; } .chartWrap .chartTitle .dataInfo strong{ font-size:16px; color:$itemstrong; } .loadingWrap{ background-color:#fff; } .chartWrap .chartInfo,.chartWrap .infoItem,.chartWrap .loadingWrap{ height:$smartChartH; } .chartWrap .chartList{ height:$smartChartH; max-height:$smartChartH; overflow-y:auto; margin-top:10px; } .chartWrap.titleChart .chartInfo,.chartWrap .infoItem,.chartWrap.titleChart .loadingWrap{ height:$TitleChartH; } .chartWrap.smart .chartInfo,.chartWrap.smart .loadingWrap{ margin-top:10px; height:$smartChartH; } .chartWrap.bar .chartInfo,.chartWrap.bar .loadingWrap{ height:$barChartH; } .chartWrap.bar .chartList{ height:$barChartH; max-height:$barChartH; } .chartWrap.bar.spcbar .chartList{ height:$barChartH - 10px; max-height:$barChartH - 10px; } .chartWrap.chart300 .chartInfo,.chartWrap.chart300 .loadingWrap{ height:300px; } .chartWrap.map .chartInfo,.chartWrap.map .loadingWrap{ height:$mapChartH; } .chartWrap.funnel .chartInfo,.chartWrap.funnel .loadingWrap{ height:$funnelChartH; } .chartWrap.pie .chartInfo,.chartWrap.pie .loadingWrap{ height:$labelpieheight; width:$labelpiewidth; } .chartWrap.onepie .chartInfo,.chartWrap.onepie .loadingWrap{ height:$labelpieheight; } .pieCenter{ margin:0 auto; color:$labelfontcolor; } .pieCenter h4{ font-size: 18px; text-align:center; padding-top:10px; padding-bottom:5px; font-weight: normal; color:$darkfontcolor; } .pieCenter .left{ width:49%; text-align:right; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display:inline-block; } .pieCenter .right{ width:49%; text-align:left; } .loadingWrap .spinner{ position:absolute; top:50%; height:50px; left:50%; z-index: 1; margin-top:0px; } .loadingWrap .spinner>div{ width:5px; } .help{ @extend .myicon; height:16px; width:16px; display:inline-block; vertical-align:middle; margin-top: -2px; margin-left:8px; background-position:-166px -88px; cursor: pointer; } .helpRed { @extend .myicon; height:16px; width:16px; display:inline-block; vertical-align:middle; margin-top: -2px; margin-left:8px; background-position:-166px -116px; cursor: pointer; } .help.ml{ margin-left: 2px; } .copyright{ // position:absolute; // bottom:0px; // right:0px; // left:$leftwidth; text-align:center; line-height: $copyrightH; color:$lightfontcolor; margin-top:-30px; margin-left:$leftwidth; font-size:12px; } .noreport .rightContent{ padding-bottom:50px; } .copyright a{ color:inherit; } .copyright a:hover{ text-decoration:underline; } .noreport .copyright{ margin-left: 0px; margin-top:-50px; } .conditionWrap{ padding:20px; padding-bottom:0px; background-color:#fff; color:$labelfontcolor; line-height:34px; } .conditionWrap .condiItem{ padding-bottom:20px; } .condiTitleWrap{ padding-right:20px; padding-top:7px; line-height:34px; } .tableList{ overflow-x:auto; } .tableList.longList{ min-height:300px; background-color:#fff; } .tableList table{ width:100%; border-collapse:collapse; } .tableList table th{ border:1px solid $tablebr; height:$tablecellheight; vertical-align:middle; padding:0px 5px; white-space:nowrap; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; background-color:$tablethbg; color:$tablethft; font-weight: normal; } .cloneThead{ display:block; position:fixed; top:$headerH; left:auto; z-index: 1; } .tableList table td{ border:1px solid $tablebr; height:$tablecellheight; vertical-align:middle; padding:0px 5px; white-space:nowrap; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; background-color:$tablecelleven; color:$tabletdft; text-align:center; max-width:200px; @extend .nowrap; } .tableList table .error{ color:#e74646; } .tableList.chartList th,.tableList.chartList td{ height:25px; } .tableList.yeswrap table td{ text-overflow:inherit; max-width:inherit; } .tableList table td.name{ color:$tabletdactiveft; cursor: pointer; } .tableList table tr:nth-child(odd) td{ background-color:$tablecellodd; } .tableList table tr:hover td,.tableList table tr.active td{ background-color:$tablecellhover; } .tableList table td.lostinfo{ text-align:left; padding-left:40px; padding-top: 5px; padding-bottom:5px; } .tableList table td.lostinfo.m{ padding-left:20px; } .tableList table td .lost{ color:$lightfontcolor; } .tableList table td p{ margin-top:5px; } .tableList table td p.n{ color:$tabncolor; } .tabBar{ width:20px; height:40px; background-color:$tabbarbgcolor; position:relative; display:inline-block; vertical-align:bottom; } .tabBar .active{ background-color:$tabbarcolor; position:absolute; left:0px; right:0px; bottom:0px; } .labelWrap{ overflow:hidden; // margin-right:$labelpiewidth+$labelpiegap; padding-top:50px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float:left; margin-left:10px; min-height:$labelpieheight; width:50%; } .labelItem{ overflow:hidden; margin-bottom: 20px; position:relative; } .labeltype{ color:$labelcolor; font-size:$labelfz; line-height:$labelheight; position:absolute; left:0px; } .labelItem .labellist{ float:left; margin-left:$labellistpl; } .labelItem .label{ margin-bottom:14px; border-radius:13px; color:$labelcolor; font-size:$labelfz; border:1px solid $labelbr; height:$labelheight; line-height:$labelheight; display:inline-block; vertical-align:middle; padding:0px 10px; cursor: pointer; margin-right:14px; position:relative; } .labelItem.dis .label{ color:$labeldisft; border-color:$labeldisbr; cursor:default; } .labelItem.choice .label{ color:$labelselectedfc; border:none; margin-right:25px; } .labelItem.choice .label:after{ display:block; background:url(../images/remove.png) no-repeat center center; width:15px; height:26px; position:absolute; top:0px; right:-13px; content:""; } .labelItem.choice .label.first{ cursor:default; margin-right:14px; } .labelItem.choice .label.first:after{ background:none; } .labelchart{ /* position: absolute;*/ float:right; margin-top:-$labelpieheight - $labeltop; } .labeldistips{ font-size:12px; color:$labeldistips; margin-left:$labellistpl; line-height: 30px; } .addIcon{ background:url(../images/add03.png) no-repeat; } .whiteClose{ @extend .addIcon; background-position: 0 -260px; width: 13px; height: 13px; display:inline-block; cursor: pointer; } .formTitleWrap{ margin-bottom:$itemGap; } .formAddIcon{ @extend .addIcon; background-position:-1px -1px; height:12px; width:12px; display:inline-block; margin-right: 6px; } .formAddButton{ @extend .addIcon; background-position:-1px -100px; height:12px; width:12px; display:inline-block; margin-right: 6px; } .btn:hover .formAddButton{ background-position:-1px -141px; } .formAddIcon.dis{ background-position:-1px -100px; } .checkCount { line-height:34px; } .searchWrap{ float:right; width:188px; position:relative; margin-right:10px; margin-top:8px; } .searchWrap.searchSpec{ width: 160px; margin-top:5px; margin-bottom: 5px; float:left; } .searchWrap .searchIpt{ @extend .iptform; width:100%; padding-right:24px; } .searchIpt.selectIpt,.formDetailItem.paramsset .searchIpt.selectIpt,.formDetailItem .optionList .searchIpt.selectIpt{ line-height: 30px; height:30px; width: 160px; border-color:#c9c9c9; } .searchWrap:after,.powerSelectData .small .searchWrap:after{ @extend .addIcon; position:absolute; content:""; display:block; background-position:0 -20px; width: 14px; height: 15px; right:10px; top:10px; } .viewIcon{ @extend .addIcon; background-position:-1px -40px; width:12px; height:14px; } .lookIcon{ @extend .addIcon; background-position: 0 -163px; width: 14px; height: 15px; } .editIcon{ @extend .addIcon; background-position:-1px -59px; width:13px; height:15px; } .editIcon.dis,.dis>.editIcon{ background-position:-18px -59px; } .removeIcon{ @extend .addIcon; background-position:0 -80px;; width:14px; height:14px; } .subListIcon{ @extend .addIcon; background-position:-1px -122px; width: 12px; height: 9px; } .subAddIcon{ @extend .addIcon; background-position:-1px -141px; width: 12px; height: 12px; } .downMoreIcon{ @extend .addIcon; display:inline-block; background-position:0 -212px; width: 14px; height: 14px; cursor: pointer; vertical-align:middle; } .active .downMoreIcon,.downMoreIcon.active{ background-position:0 -188px; } .formBtn .viewIcon,.formBtn .editIcon,.formBtn .removeIcon,.formBtn .subListIcon,.formBtn .subAddIcon,.formBtn .lookIcon{ display:inline-block; margin-right:4px; vertical-align:middle; margin-top:-2px; } .formBtn{ color:$comactiveftcolor; display:inline-block; cursor: pointer; margin-right:20px; } .formBtn.dis{ color:$labeldisft; cursor:not-allowed; } .formOper.leftAlg{ text-align:left; padding-left:20px; } .formOper .btn2,.formOper .btn4{ display:inline-block; float:none; } .filpinfo{ height:100px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding:40px 20px 0px 20px; line-height:34px; background-color:#fff; } .filpinfo .numlabel{ color:$lightfontcolor; } .filpinfo .iptnum{ width:34px; margin:0px 4px; height:25px; line-height: 25px; } .comWrap{ border:1px solid $bordercolor; background-color:#fff; border-radius:$comradius; } .formDetailInfo{ padding:$formPad; /* padding-right: $formMg;*/ @extend .comWrap; border:1px solid $wraptitlebrc; } .formDetailInfo.notopr{ border-top-left-radius:0px; border-top-right-radius:0px; } .formDetailTitle{ color:$labelfontcolor; margin-bottom:$formtitlemb; } .formDetailTitle .pretitle{ color:$formbluecolor; } .formDetailItem{ line-height:$iptheight; margin-bottom: $formitemmb; .iptdesc{ margin-left: 155px;line-height: 20px; } } .formDetailItem.mb10{ margin-bottom:10px; } .formhalf{ -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display:inline-block; padding-right:80px; vertical-align:top; width:45%; } .formhalf .formDetailItem{ margin-bottom:15px; } .iptformdis{ @extend .iptform; border:none; background-color:$eventbg; overflow: hidden;white-space: nowrap;text-overflow: ellipsis; } .formline{ border-bottom:1px solid $bordercolor; line-height: 30px; margin-bottom:20px; } .formDetailItem .iptlabel{ width:$formlabelw; text-align:right; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 10px; display:inline-block; } .formDetailItem .iptwrap{ margin-left: $formlabelw; display:inline-block; padding-left: 5px; } .formDetailItem .formsubDetailWrap{ margin-top:3px; padding:30px; border-radius:$comradius; border:1px solid $bordercolor; background-color:$formtitlebg; } .formsubDetailWrap .formDetailItem.last{ margin-bottom:10px; } .label150 .iptlabel{ width:150px; } .label150 .iptwrap{ margin-left: 150px; display:inline-block; } .label150 .iptwrapNum { margin-left: 150px; display:inline-block; line-height:20px; padding:7px 0 7px 5px; } .startNumber { width: 100px !important; text-align: center; padding-left: 0; } .label150 .iptwrap.subdesc{ @extend .ckblue; width:320px; text-align:right; display:block; } .subdesc .normalText { display: inline-block; float: left; color:#999; } .formDetailItem.channalu .iptlabel{ width:200px; } .channalu .btn7{ margin:20px 0px 0px 200px; } .radioWrap{ display:inline-block; } .radioWrap .radiolabel{ color:$darkfontcolor; margin-right: 13px; display:inline-block; cursor: pointer; } .radioWrap .radiolabel.activeradio{ color:$activebgcolor; } .formDetailItem .iptform{ width:320px; } .desc{ font-size:12px; color:$lightfontcolor; } .descLong{ display: block; width: 500px; line-height: 20px; padding-top: 8px; } .formpowerWrap{ padding-left: 38px; margin-top: $formtitlemb; } .formapp{ @extend .comWrap; width:145px; margin-right: 20px; display:inline-block; } .formMdTitle{ background-color:$formtitlebg; height:$formtitlemdH; line-height:$formtitlemdH; text-align:center; border-bottom:1px solid $bordercolor; } .selectList{ overflow-y:auto; overflow-x:hidden; } .selectList li{ height: $optionliheight; line-height: $optionliheight; color: $optionlifc; cursor: pointer; text-align: left; padding: 0px $optionpad; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; white-space: nowrap; text-overflow: ellipsis; overflow-x:hidden; } .selectList li:hover{ background-color: $optionliactivebg; } .selectList li.active{ color: $optionliactivefc; } .selectList li.current,.channel .selectList li.current:hover{ background-color: $optionliactivefc; color:#fff; } .formapp .selectList{ height:$formpowerH; max-height:$formpowerH; } .formpowerInfo{ @extend .comWrap; width:730px; display:inline-block; } .formpowerInfo .powerContent{ min-height:$formpowerH; padding-top:$formmenup; padding-left: $formmenup; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .powerBtnWrap{ padding-bottom:40px; } .powerBtnWrap .btn2{ margin-right: 10px; } .powerChangeWrap{ margin-right:$formmenup; border-bottom:1px solid $comactiveftcolor; } .powerChangeWrap li{ display:inline-block; padding:8px 10px; border-bottom:1px solid transparent; cursor: pointer; border-top-left-radius:$comradius; border-top-right-radius:$comradius; box-sizing:border-box; color:$labelfontcolor; } .powerChangeWrap li.active,.powerChangeWrap li:hover{ background-color:$comactiveftcolor; color:#fff; } .formsaveBtnWrap{ margin:0 auto; width:280px; margin-top:40px; } .formsaveBtnWrap .btn5 ,.formsaveBtnWrap .btn6{ width:120px; text-align:center; margin-right: 20px; } .powerDetailInfo{ margin-top:20px; } .powermenu{ margin-bottom: 20px; } .powermenu.people{ margin-bottom: 4px; } .powermenu li{ width:49%; display:inline-block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: $formmenupr; padding-bottom: 20px; vertical-align:top; cursor: pointer; } .campbase .powerDetailInfo{ margin-top:5px; } .campbase .powermenu{ margin-bottom:0px; } .campbase .powermenu li{ padding-bottom: 10px; padding-right:20px; } .powermenu.block li{ display:block; } .powermenu.people li{ width:98%; } .powermenu li .mlabel,.mlabel{ color:$labelfontcolor; padding-left: 6px; } .powermenu.people li .mlabel{ color:$formpeople; } .powermenu li p{ line-height:18px; color:$lightfontcolor; font-size: 12px; padding-left: 24px; } .powermenu li.dis .mlabel,.powermenu li.dis p{ color:$formmenudis; cursor:default; } .powermenu input{ vertical-align:middle; } .powermenuTitle{ border-bottom:1px solid $bordercolor; line-height:36px; margin-right: $formmenup; margin-bottom:20px; } .powermenuTitle .span{ color:$comactiveftcolor; } .btn5.nextstep{ height:28px; line-height:28px; width:68px; display:block; float:right; text-align:center; margin-right: $formmenupr; margin-top: 40px; margin-bottom: 24px; } .btn5.nextstep.prestep{ margin-right:20px; } .powerSelectData{ color:$labelfontcolor; } .powerSelectData .datawrap,.datawrap{ @extend .comWrap; background-color:$formcampbg; display:inline-block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width:100%; } .tagWrap.datawrap{ padding: 10px; margin-left: 100px; width: 90%; } .tagWrap.datawrap .searchWrap .searchIpt{ width: 188px; } .channel .datawrap .selectList{ height:250px; max-height:250px; overflow-x: hidden; overflow-y:auto; } .campaginAction { float:right; padding-top:8px; } .campaignAllCheck { height:35px; border-left:1px solid #e4e4e4; border-right:1px solid #e4e4e4; border-bottom:1px solid #e4e4e4; background:#fffeea; line-height:35px; text-align:center; } .campaign .datawrap .campaignList{ height:240px; max-height:240px; overflow-x: hidden; overflow-y:auto; } .campaign .datawrap .campaignList.has{ height:272px; max-height:272px; } .powerSelectData .channel{ width:170px; margin-right: 10px; display:inline-block; vertical-align:top; } .powerSelectData .pt{ padding-bottom: 8px; } .powerSelectData .searchWrap{ width:150px; margin-left: 10px; float: left; } .powerSelectData .searchWrap .searchIpt{ height:25px; line-height:25px; } .powerSelectData .searchWrap:after{ top:7px; } .channel .selectList li{ height: 28px; line-height: 28px; } .channel .selectList li:hover{ background-color:$formcamplihover; } .powerSelectData .campaign{ width:250px; margin-right: 10px; display:inline-block; vertical-align:top; } .powerSelectData .campaign.big{ width:320px; } .campaignList{ margin-top:10px; } .campaignList li{ @extend .nowrap; display:inline-block; width:49%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 12px; margin-bottom: 10px; padding-left: 14px; cursor: pointer; } .one .campaignList{ margin-top:0px; } .one .campaignList li{ width:99%; display:block; margin-bottom: 0px; } .campaignList li .checkbox{margin-right:5px;} .formIcon{ background:url(../images/auth.png) no-repeat; display:inline-block; vertical-align:middle; } .radio{ @extend .formIcon; background-position:0 0; width:16px; height:16px; } .radio.active,.activeradio .radio{ background-position:0 -20px; } .checkbox{ @extend .formIcon; background-position:-1px -59px; width:14px; height:14px; } li.active .checkbox,.checkbox.active{ background-position:-1px -77px; } li.dis .checkbox,.checkbox.dis{ background-position:-1px -41px; } li.checked .checkbox,.checkbox.checked{ background-position: -1px -95px; } li.hased .checkbox,.checkbox.hased{ @extend .addIcon; background-position: 0 -236px; } .must:before{ content: '*'; color:$formred; vertical-align: bottom; font-size: 24px; display: inline-block; height:34px; line-height: 1.7em; } .error{ color:$formred; font-size:12px; font-style:normal; } .error.moreLetter{ display: inline-block; line-height: 20px; vertical-align: middle; width:300px; } .errorInfo{ display: block; text-align: right; padding-right: 50px; line-height:20px; } .paramsset .selList{ width:120px; } .ma2{ position:absolute; left:0px; bottom:0px; z-index:1; } .animt{ -webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; border-radius:3px; } .popchannellist{ position: absolute; top:1px; left: 98%; padding-bottom: 0px; border-bottom: 1px solid $bordercolor; border-top: 1px solid $bordercolor; z-index: 2; background-color: #fff; width:0px; color:$labelfontcolor; overflow:hidden; @extend .animt; } .popchannellist.doshow{ width:480px; } .popchannellist .title{ border-bottom: 1px dashed #dcdcde; height: 34px; line-height: 34px; padding: 0px 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-right: 1px solid $bordercolor; } .popchannellist .title>span{ padding-right: 10px; cursor: pointer; } .popchannellist .title>span.active{ color: $activebgcolor; } .popchannellist .title .right,.closeGray{ background: url(../images/close.png) center center no-repeat; height: 100%; width: 40px; cursor: pointer; } .closeBtn{ background: url(../images/close1.png) center center no-repeat; height: 100%; width: 30px; cursor: pointer; } .popchannellist .subtitle{ height: 30px; border-bottom: 1px dashed #dcdcde; display: table; padding: 0px 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-right: 1px solid $bordercolor; border-left: 1px solid $bordercolor; width:100%; } .popchannellist .subtitle span{ cursor: pointer; padding:3px 5px; margin-right:5px; line-height: 30px; color: $activebgcolor; } .popchannellist .subtitle span.sline{ border-left:2px solid $bordercolor; } .popchannellist .subtitle span.active{ background-color:$activebgcolor; color:#fff; border-radius:$comradius; } .popchannellist .poplist{ border-left-style: none; max-height: 300px; overflow-y:auto; min-height: 150px; padding: 10px; border-right: 1px solid $bordercolor; border-left: 1px solid $bordercolor; } .popchannellist .poplist li{ width:17%; cursor: pointer; height: 25px; line-height: 25px; float: left; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; margin-right: 10px; padding:0px 5px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 12px; color:#646464; text-align: left; } .popchannellist .poplist li.active{ background-color: $activebgcolor; color:#fff; } .circlewrap{ margin:0px 0px 30px 0px; } .circle{ width:25px; height:25px; border-radius:50%; line-height:25px; text-align:center; color:#fff; background-color:$bordercolor; display:inline-block; } .circlewrap .circleline{ height:1px; width:100px; background-color:$bordercolor; margin:0px 10px; vertical-align:middle; display:inline-block; } .circlelabel{ color:$lightfontcolor; } .active .circle{ background-color:$activebgcolor; } .active .circlelabel{ color:$darkfontcolor; } .appsdk{ width:100%; height:34px; clear:both; font-family:"SimHei"; font-size:14px; color:#666; } .appsdk .appTitle{ width:120px; line-height:34px; float:left; text-align:right; } .appsdk .appText{ float:left; clear:right; line-height:34px; } .appsdk .appText button{ width:36px; height:20px; line-height:20px; background:#fff; border-radius:2px 2px; font-size:12px; padding:0px; border:1px solid #ccc; margin-left:20px; cursor:pointer; } .appsdk .appid{ font-size:18px; color:#f8a20f; margin-right:20px; } .idenText { position:relative; top:-10px; margin-bottom:40px; } .appsdk .iden { font-size:12px; color:#999; } .appsdk .sdkButton { width:170px; height:34px; line-height:34px; text-align:center; color:#fff; background:#00a9e8; border-radius:4px 4px; display:inline-block; margin-left:38px; margin-right:40px; } .appsdk .sdkBack { color:#428ccc; font-size:14px; } .useSdk { color:#999; font-family:"SimHei"; padding-left:38px; margin-top:50px; } .useSdk .userTitle{ font-size:14px; line-height:34px; } .useSdk .userText{ font-size:12px; } .useSdk .circleline{ height:1px; width:24px; background-color:$bordercolor; margin:0px 10px; vertical-align:middle; display:inline-block; } .sdkSave { float: left; margin-top: 0px auto; } .sdkLast { float: left; margin-right: 20px; text-align: center; } .profileIcon{ background:url(../images/user.png) no-repeat; cursor:pointer; display:inline-block; vertical-align:middle; } .addItemIcon{ @extend .profileIcon; background-position:-10px -10px; height:28px; width:28px; } .addItemIcon.dis{ background-position:-47px -10px; cursor:default; } .numIconWrap{ width:25px; height:34px; display:inline-block; margin-left:-5px; vertical-align:middle; } .upNumIcon{ @extend .profileIcon; background-position:-155px -17px; height:17px; width:25px; float:left; } .upNumIcon:hover{ background-position:-85px -17px; } .downNumIcon{ @extend .profileIcon; background-position:-190px -17px; height:17px; width:25px; margin-top:-1px; float:left; } .downNumIcon:hover,.downNumIcon.active{ background-position:-120px -17px; } .delItemIcon{ @extend .profileIcon; background-position:-15px -49px; height:18px; width:18px; margin-top:8px; } .campaignAllCheck .delItemIcon { margin-top:-2px; } .addAttrIcon{ @extend .icon0413; background-position:-50px -23px; height:12px; width:12px; margin-right: 3px; } .dis .addAttrIcon,.addAttrIcon.dis{ @extend .profileIcon; background-position:-63px -52px; cursor:default; } .profileWrap{ padding:30px 30px 20px 30px; color:$labelfontcolor; } .profileWrap.datawrap{ border:1px solid $wraptitlebrc; } .profileItemWrap{ margin-top:20px; padding-left: $operwidth; padding-bottom:30px; } .eventItem .profileItemWrap{ display: inline-block; margin-top: 0px; margin-left: 30px; padding-bottom: 0px; } .eventItem.ugItem{ padding-top:10px; background-color:$formcamplihover; padding-bottom: 10px; padding-right:10px; } .profileWrap .selList,.profileWrap .moredata,.funnelWrap .selList,.funnelWrap .moredata{ background-color:#fff; } .profileItemWrap .selList span,.funnelWrap .selList span{ @extend .label; } .profileWrap .moredata .iptform{ width:120px; } .profileWrap .moredata .iptform.hasletter{ width:50px; min-width:50px; max-width:120px; } .operInfo{ position:absolute; top:17px; bottom:0px; border:1px solid $bordercolor; left:0px; width:$operwidth; border-right:none; } .operBtn{ width:34px; height:34px; background-color:$relbg; cursor:pointer; @extend .pcenter; text-align:center; line-height:34px; color:#fff; border-radius:50%; } .profileWrap .addItemIcon{ margin-left:$operwidth; margin-top:-17px; } .profileItemWrap .profileItem{ padding-bottom:12px; } .eventItem{ padding:0px; } .funnelWrap.last{ padding-bottom:10px; } .eventItem .eventItemsel { position:absolute; left:20px; top:50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); margin-top:3px; } .eventItem .profileItemWrap{ margin-left:190px; } .funnelWrap{ margin-left:30px; } .funnelWrap .eventItem .profileItemWrap{ margin-left:280px; } .funnelWrap.max400{ max-height:400px; overflow-y:auto; } .eventBox .profileItemWrap{ margin-left:23px; padding-bottom:20px; } .relLine{ height:25px; width:1px; background-color:$bordercolor; margin-left:30px; } .eventItem .txtLabel { position:absolute; left:20px; top:50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); margin-top:-5px; } .funnelWrap .eventItem .eventItemsel{ left:100px; margin-top:-5px; } .profileItem .cldItem{ vertical-align:top; } .valLabel{ border-radius:13px; color:$labelcolor; font-size:$labelfz; border:1px solid $labelbr; height:20px; line-height:20px; padding:0px 8px; display:inline-block; vertical-align:middle; cursor: pointer; margin-right:5px; margin-top:5px; max-width:100px; @extend .nowrap; } .valLabel.delLabel{ position:relative; padding-right:15px; } .valLabel.delLabel:after{ position:absolute; right:3px; content:""; background:url(../images/close.png) no-repeat center center; background-size:100%; width:10px; height:18px; } .valLabel.redTip{ border-color:$formred; } .relationWrap{ position:relative; height:70px; width:100px; margin:0 auto; width:1px; background-color:$labelbr; } .relationWrap div{ background-color:#fff; height:30px; line-height:30px; } .removeSpan{ color:$lightfontcolor; font-size:12px; line-height:34px; cursor:pointer; vertical-align:top; } .addAttrBtn .ckhand{ line-height:34px; font-size:12px; color:$tabletdactiveft; } .addAttrBtn.dis .ckhand{ cursor:default; color:$lightfontcolor; } .campIcon{ background:url(../images/camp01.png) no-repeat; cursor: pointer; display:inline-block; vertical-align:middle; } .downloadIcon{ @extend .campIcon; background-position:-10px -10px; height:13px; width:13px; } .downloadIcon:hover,.downloadIcon.active{ background-position:-57px -10px; } .dis .downloadIcon{ background-position:-193px -10px; cursor:not-allowed; } .emailIcon{ @extend .campIcon; background-position:-33px -11px; height:14px; width:11px; } .emailIcon:hover{ background-position:-80px -11px; } .smHelpIcon{ @extend .campIcon; background-position:-150px -11px; height:14px; width:14px; } .helpTipWrap{ position:absolute; top:100%; margin-top:5px; left:-5px; border-radius:$comradius; border:1px solid $activebgcolor; padding:14px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; width:200px; font-size:12px; line-height: 18px; color:$labelfontcolor; opacity:0; text-align:left; background-color:#fff; white-space:normal; z-index: 3; -webkit-transition:left 0.3s ease-in-out; -moz-transition:left 0.3s ease-in-out; transition:left 0.3s ease-in-out; border-radius:3px; } .helpRed .helpTipWrap{ border:1px solid #f00; } .bigTips .helpTipWrap{width:300px;} .helpTipWrap.winTips{ opacity: 1; display:none; left:inherit; } .helpTipWrap.active{ opacity:1; } .helpTipWrap:after{ position: absolute; display: block; content: ""; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 5px; bottom:100%; left: 5px;; border-bottom-color: $activebgcolor; } .helpRed .helpTipWrap:after{ border-bottom-color: #f00; } .longTip .help .helpTipWrap{ top:50px; } .longTip .help .helpTipWrap:after{ top:50px; } .longTip.tip40 .help .helpTipWrap{ top:40px; } .longTip.tip40 .help .helpTipWrap:after{ top:15px; } .longTip.tip15 .help .helpTipWrap:after{ top:15px; } .longTip.tip0 .help .helpTipWrap{ transform:none; top:-5px; left:initial; right:25px; } .longTip.tip0 .help .helpTipWrap:after{ top:8px; left:initial; right:-11px; border-right-color: transparent; border-left-color: $activebgcolor; } .rightTip .helpTipWrap,.rightTip .helpTipWrap{ left:initial; right:-5px; } .rightTip .helpTipWrap:after,.helpTipWrap.rightPosition:after{ left:initial; right:5px; } .help .helpTipWrap{ bottom: inherit; top: 4px; left: 100%; margin-left: 10px; transform: translateY(-50%); } .help .helpTipWrap:after{ right:100%; left:initial; top:50%; transform: translateY(-50%); border-bottom-color: transparent; border-right-color: $activebgcolor; } .helpRed .helpTipWrap:after{ right:100%; left:initial; top:50%; transform: translateY(-50%); border-bottom-color: transparent; border-right-color: #f00; } .helpTipWrap h6{ font-size:12px; color:$activebgcolor; font-weight: bold; display:inline-block; } .sortWrap{ width:13px; height:20px; display:inline-block; vertical-align:middle; } .sortWrap .ascIcon{ @extend .campIcon; background-position:-104px -7px; width:13px; height:11px; display:block; } .sortWrap .ascIcon.active{ background-position:-127px -7px; } .sortWrap .descIcon{ @extend .campIcon; background-position:-127px -17px; width:13px; height:10px; display:block; } .sortWrap .descIcon.active{ background-position:-104px -17px; } .f5Icon{ @extend .campIcon; background-position:-216px -11px; width:15px; height:14px; margin-right:4px; } .f5IconGray{ @extend .campIcon; background-position:-239px -11px; width:15px; height:14px; margin-right:4px; } .f5IconGray:hover,.btn8:hover .f5IconGray,.btn10:hover .f5IconGray{ background-position:-216px -11px; } pre{ display: block; padding: 9.5px; margin: 0 0 10px; font-size: 13px; line-height: 1.42857; white-space: pre-wrap; word-break: break-all; word-wrap: break-word; color: $labelfontcolor; background-color: #f5f5f5; border: 1px solid $wraptitlebrc; border-radius: $comradius; } /*loading*/ .alphaDiv{ width: 100%; background-color: rgba(0,0,0,0.2); position: fixed; // top: $headerH; top:0px; left: 0px; bottom:0px; z-index: 3; overflow: hidden; } .noreport .alphaDiv{ left:0px; } .spinner { margin: 100px auto; width: 100px; height: 100px; text-align: center; font-size: 10px; position: fixed; z-index: 999999; margin-top: -$headerH; top:50%; left:50%; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); } .spinner > div { background-color: $loadingbarcolor; height: 100%; width: 10px; display: inline-block; -webkit-animation: stretchdelay 1.2s infinite ease-in-out; -moz-animation: stretchdelay 1.2s infinite ease-in-out; animation: stretchdelay 1.2s infinite ease-in-out; } .spinner .rect2 { -webkit-animation-delay: -1.1s; -moz-animation-delay: -1.1s; animation-delay: -1.1s; } .spinner .rect3 { -webkit-animation-delay: -1.0s; -moz-animation-delay: -1.0s; animation-delay: -1.0s; } .spinner .rect4 { -webkit-animation-delay: -0.9s; -moz-animation-delay: -0.9s; animation-delay: -0.9s; } .spinner .rect5 { -webkit-animation-delay: -0.8s; -moz-animation-delay: -0.8s; animation-delay: -0.8s; } @-webkit-keyframes stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 20% { transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } } @-moz-keyframes stretchdelay { 0%, 40%, 100% { -moz-transform: scaleY(0.4); transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 20% { -moz-transform: scaleY(1.0); transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } } @keyframes stretchdelay { 0%, 40%, 100% { -moz-transform: scaleY(0.4); transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 20% { -moz-transform: scaleY(1.0); transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } } .dialogWin{ position: fixed; left: 50%; top:40%; background-color: #fff; border-radius: $comradius; border:1px solid $bordercolor; width:500px; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 998; } .dialogWin.mydw{ display:none; } .dialogWin.mydw.shdw{ display:block; } .dialogTitle{ height:40px; background-color:$activebgcolor; line-height:40px; color:#fff; text-indent:2em; border-top-right-radius:$comradius; border-top-left-radius:$comradius; } .dialogContent{ padding:20px; } .dialogContent .formInfo{ padding:10px 0px; } .dialogContent p{ text-align:center; } .dialogContent p.ptip{ margin:10px 0px; } .btnTwoWrap{ width:150px; margin:0px auto; margin-top:10px; overflow: hidden; } .infoTips{ position: fixed; left: 50%; top:50%; background-color: $comactiveftcolor; border-radius: 10px; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 9999; color:#fff; padding:20px; } .dialogDescWin{ position: fixed; left: 50%; top:50%; background-color: #fff; border-radius: $comradius; width:720px; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 99999; } .dialogDescWin .dlgTitle{ height:60px; line-height:60px; text-align:center; font-size:16px; } .dialogDescWin .dlgCnt{ padding:20px; padding-top:0px; max-height:480px; height:480px; overflow-x:hidden; overflow-y:auto; background-color:$descbg; } .dialogDescWin .dlgCnt p{ color:$descpcolor; padding-top:20px; padding-bottom:5px; } .dialogDescWin .dlgCnt img{ width: 100%; height: 200px; } .dialogDescWin.addWin{ width:300px; padding:30px; display:none; } .addText { background: url(../images/add.gif) no-repeat left center; padding-left:32px; font-size:12px; color:#666; } .addSuccess { margin-top:20px; line-height:18px; color:#42ac6c; margin-bottom:40px; } .addSuccess span { position:relative; top:-2px; margin-right:3px; } .addFailure { margin-top:20px; line-height:18px; color:#e74646; margin-bottom:14px; } .addFailureText{ text-indent: 25px; height: 20px; line-height: 20px; color: #e74646; } .failureAlert { position:relative !important; top:0px !important; left:10px; color:#999; } .addFailure span { position:relative; top:-2px; margin-right:3px; } .formsaveIP{ margin:0 auto; width:220px; padding-bottom:20px; } .formsaveIP .btn5 ,.formsaveIP .btn6{ width:90px; text-align:center; margin:0 10px; } .formAddWrap { margin-top:22px; padding:0 50px; } .formAddWrap .btn5, .formAddWrap .btn6{ width:80px; margin:0 10px; text-align:center; } .addHowImg { display:inline-block; margin-left:5px; } .dmpError { padding-left: 104px; line-height: 20px; padding-top: 10px; } .addRebate { display:inline-block; color:#999; margin-left:15px; } .stepWarp { clear:both; margin-bottom:20px; } .stepBox { display:inline-block; float:left; width:810px; padding:20px 20px 0 20px; height:auto; background:#fbfbfb; border:1px solid #c9c9c9; border-radius:3px 3px; } .stepBox .formDetailItem{ margin-bottom:20px; } .stepBox .addSuccess{ margin-top:8px; margin-bottom:0; } .stepBox .addFailure{ margin-top:8px; margin-bottom:0; } .stepDelete { display:inline-block; float:left; width:20px; height:20px; margin-left:4px; } .stepDelete .delItemIcon { margin-top:0; } .addProductText { line-height:34px; color:#999; padding-top:20px; } .linkTestError { height:120px; } .linkTestBox { border:none; } .linkTestBox .addChannelButton { margin:20px 0; } .makeDmpButton { margin-left: 5px; position: relative; top: 2px; } .makeDmp { padding-left:114px; } .makeDmp p{ width:200px; } .makeDmp .formsubDetailWrap{ margin-bottom:20px; padding-bottom:10px; } .redSpan{ width:10px; height:10px; background-color:$redcolor; display:inline-block; border-radius:100%; margin-right:10px; } .selList{ @extend .iptform; position:relative; cursor: pointer; } .selList.appWrap>span{ color:#ffffff; // float:right; margin-right:30px; } .selList:hover,.selList.active{ border:1px solid $selectactivebr; } .selList .arrowIcon{ position:absolute; right:0px; top:0px; } .selList .whiteArrowIcon{ position:absolute; right:0px; top:0px; } .selList>span{ margin-right: 10px; text-overflow: ellipsis; white-space: nowrap; max-width: 90%; display: inline-block; overflow: hidden; } .selList.dis{ cursor:default; } .selList.dis:hover,.selList.dis.active{ border-color:$bordercolor; } .selList.dis>span{ color:$lightfontcolor; } .optionList{ min-width: 100%; max-width:200%; position: absolute; background-color: #fff; top:100%; margin-top:0px; left: -1px; z-index: 3; border: 1px solid $optionbr; border-radius:$comradius; } .upSList .optionList{ top:inherit; bottom:100%; } .right.selList .optionList,.optionList.rightLayout,.rightLayoutWrap .optionList{ right:-1px; left:inherit; } .optionList ul{ padding:0px; max-height: 250px; overflow-y: auto; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } .optionList .border { border-top:1px solid $bordercolor; } .optionList.even ul:nth-child(odd){ background-color:$tablecellodd; } .optionList ul li{ height: $optionliheight; line-height: $optionliheight; color: $optionlifc; cursor: pointer; text-align: left; padding: 0px $optionpad; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; white-space: nowrap; text-overflow: ellipsis; overflow-x:hidden; } .optionList li:hover{ color: $optionliactivefc; } .optionList li.active{ background-color: $optionliactivebg; } .selList.appWrap{ display:block; margin:20px auto; border-color:#5f97fb; // border-radius:16px; background-color:#5f97fb; border-left:1px solid #ffffff; font-size: 14px; height: 20px; line-height: 20px; margin-top: 7px; } .selList.appWrap b,.selList.appWrap i,.platformIcon{ @extend .icon0413; width: 16px; height: 16px; margin-top:-2px; margin-right:3px; } .selList.appWrap b.apple,.platformIcon.apple{ background-position:-4px -2px; } .selList.appWrap b.android,.platformIcon.android{ background-position:-59px -2px; } .selList.appWrap b.web,.platformIcon.web{ background-position:-114px -3px; } .selList.appWrap .optionList ul li i.apple,.platformIcon.apple{ background-position:-24px -4px; } .selList.appWrap .optionList ul li i.android,.platformIcon.android{ background-position:-78px -4px; } .selList.appWrap .optionList ul li i.web,.platformIcon.web{ background-position:-136px -4px; } .selList.appWrap .optionList ul li.active i.apple,.platformIcon.apple{ background-position:-41px -4px; } .selList.appWrap .optionList ul li.active i.android,.platformIcon.android{ background-position:-96px -4px; } .selList.appWrap .optionList ul li.active i.web,.platformIcon.web{ background-position:-156px -4px; } .opIcon{ display: table-cell; padding-left: 20px; height: 16px; vertical-align: middle; cursor: pointer; color:$descpcolor; text-decoration: none; padding-right: 10px; } .opIcon:hover{ } .poptips{ position: absolute; z-index: 999; width:300px; height: auto; line-height: 40px; border-radius: $comradius; top:30px; margin-left:-90px; font-size: 14px; background-color:#fff; border:1px solid $activebgcolor; color:$darkfontcolor; opacity:0.9; } *:hover .poptips{ font-weight: normal; } .poptips .poparrow{ position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 5px; top:-10px; left: 50%; margin-left: -42px; border-bottom-color: $activebgcolor; } .attrItem{ overflow:hidden; } .attrItem{ .attrAlign{ margin-top: -2px; } .attrLabel{ color:$labelfontcolor; text-align: right; float:left; margin-right: 10px; width:120px; } .attrInfo{ float:left; } .attrMore{ height: 68px; position:relative; } .attrLine{ height:100%; background-color:$selectactivebr; width:1px; margin-right:10px; float: left; box-sizing: border-box; } .attrInfo .attrDesc{ font-size: 12px; line-height: 18px; color:$lightfontcolor; padding:10px 0px; } .attrInfo .iptform{width:250px;margin-right:10px;} .myLabel{ color:#fff; padding:3px 5px; border-radius:3px; font-size: 12px; } .ecpLabel{ @extend .myLabel; background-color:$exceptionbg; } .normalLabel{ @extend .myLabel; background-color:$normalbg; } .dateLabel{color:$lightfontcolor;margin-right:30px;line-height: 22px;} .attrDetail{ line-height: 22px; color:$labelfontcolor; margin-top:-3px; } .attrDetail em{margin-left: 30px;} .btn3.lastC{ height: 40px; line-height: 20px; font-size: 12px; } .nextSign{ @extend .profileIcon; background-color:#fff; background-position:-92px -52px; width: 15px; height: 15px; position:absolute; top:4px; left:0px; margin-left: -8px; } .attrMore.last{ .nextSign{ background-position:-114px -54px; width: 11px; height: 11px; margin-left: -6px; } .attrLine{ height:5px; } .attrLine.white{ background-color: #fff; } } .attrMore.first{ .attrLine{ margin-top: 10px; height: 58px; } } } .attrNoInfo{ height: 200px; line-height: 200px; text-align: center; color:$optionlifc; } .conditionBox .selList,.selList.whitebg{ background-color:#fff; color:$labelfontcolor; } .btnGroup{ border:1px solid $bordercolor; border-radius:$comradius; box-sizing:border-box; overflow:hidden; display:inline-block; vertical-align:middle; margin-left:10px; } .btnGroup li{ border-right:1px solid $bordercolor; padding:6px 15px; cursor: pointer; color:$labelfontcolor; float:left; background-color:#fff; } .btnGroup li.dis,.btnGroup li.dis:hover{ cursor:default; color:$labeldisft; background-color:#f5f5f5; } .btnGroup li:hover,.btnGroup li.active{ color:$tabletdactiveft; } .btnGroup li:last-child{ border-right:none; } .conditionWin{ position:absolute; top:100%; right: -20px; left:-20px; border-top:1px solid $headerbc; padding:20px 40px; background-color:#fff; z-index: 2; } .conditionWin .sanicon{ position:absolute; content:""; @extend .icon0413; background-position: -4px -43px; width: 17px; height: 8px; bottom:100%; left:80px; } .conditionWin.edit .sanicon{ left:195px; } .conditionWin .condiCont{ padding:20px; } .conditionWin .conditionItem{ } .conditionEventItem{ max-height: 400px; overflow-y: auto; } .conditionBoxBottom{ border-top:1px solid $headerbc; } .conditionWin.customWin{ top:150%; } .conditionWin.customWin .sanicon{ left:initial; right:80px; } .conditionWin.customWin.c1 .sanicon{ left:initial; right:214px; } .conditionWin.customWin.c2 .sanicon{ left:initial; right:350px; } .conditionAlpha{ position: fixed; background-color: rgba(0,0,0,0.4); z-index: 1; top: 140px; left: 186px; right: 10px; bottom:0px; overflow: hidden; } .conditionAlpha.topAlp{ top:60px; z-index: 4; } .conditionBoxBottom .ckhand{ color:$darkbluecolor; font-size:12px; line-height: 34px; } .conditionBoxBottom .ckhand.dis{ color:$disbtncolor; } .ckhand.dark{ color:$darkbluecolor; } .liTypeTitle{ color:$labeldisft; font-size:12px; text-align:center; } .liTypeTitle:before{ content:"\2014"; padding-right:10px; font-size:16px; } .liTypeTitle:after{ content:"\2014"; padding-left:10px; font-size:16px; } .dlOperTitle{ padding:0px; margin:0px; } .dlOperTitle.bbb{ border-bottom:1px solid $bordercolor; padding:5px 0px; } .dlOperTitle dd{ color:$darkbluecolor; margin-left: 0px; padding-left: 14px; cursor: pointer; line-height: 30px; } .dlOperTitle.popmenu{ padding:5px 0px; } .dlOperTitle.popmenu dd{ color:$lightfontcolor; } .dlOperTitle.popmenu dd.active,.dlOperTitle.popmenu dd:hover{ color:$darkbluecolor; } .dlOperTitle dd.active{ background-color: $optionliactivebg; } .openTipWin{ position: fixed; left: 50%; top:30%; background-color: #fff; border-radius: $comradius; width:470px; margin-left:-235px; z-index: 998; padding-top:40px; } .openTipWin .tipTit{ line-height: 40px; text-align:left; margin-top:-30px; border-bottom:1px solid $bordercolor; margin-bottom:10px; } .openTipWin .tipTit .closeGray{ top:5px; } .openTipWin .tipdesc p{ line-height: 20px; margin-bottom:10px; word-wrap:break-word; word-break:break-all; } .openTipWin .tipTit>span{ padding-left:40px; font-size:14px; color:$labelfontcolor; } .openTipWin .tipCont{ color:$labelfontcolor; padding:20px 40px; padding-top:0px; text-align:center; line-height: 25px; } .tipCont p { text-align:left; } .openBtnGroup{ width:200px; margin:0 auto; margin-bottom:20px; } .openBtnGroup .btn8{ width:70px; text-align: center; height:30px; line-height: 30px; font-size:12px; } .openBtnGroup .btn9{ width:70px; text-align: center; height:30px; line-height: 30px; font-size:12px; background-color:$logobg; color:#fff; display:inline-block; border-radius:$comradius; } .openTipWin .closeGray{ height:40px; position:absolute; top:12px; right:12px; } .icon0413{ background-image:url(../images/0416.png); background-repeat:no-repeat; cursor: pointer; display:inline-block; vertical-align:middle; } .delIcon{ @extend .icon0413; background-position:-70px -23px; width: 14px; height: 14px; } .delIcon.s1{ position:absolute; right:10px; top:10px; } .delIcon:hover,.delIcon.active{ background-position:-89px -23px; } .btnMoreGroup{ position:relative; float:right; vertical-align:middle; } .btnMoreGroup .primaryBtn{ background-color:$logobg; color:#fff; border-top-left-radius:$comradius; border-bottom-left-radius:$comradius; width:64px; height:30px; line-height: 30px; text-align:center; border-right:1px solid #e0e0e0; float:left; cursor: pointer; } .btnMoreGroup .primaryBtn.dis,.btnMoreGroup .primarySelBtn.dis{ background-color:$btngraybg1; cursor: default; border:1px solid $bordercolor; color:$lightfontcolor; } .btnMoreGroup .primarySelBtn.dis{border-left:none;} .btnMoreGroup .primarySelBtn{ background-color:$logobg; border-top-right-radius:$comradius; border-bottom-right-radius:$comradius; float:left; height:30px; width:30px; cursor:pointer; } .btnMoreGroup .btnMenu{ position:absolute; top:100%; right:0px; border:1px solid $bordercolor; border-radius:$comradius; width:74px; margin-top:1px; } .btnMoreGroup .btnMenu li{ line-height: 30px; padding-left: 10px; cursor: pointer; color:$labelfontcolor; background-color:#fff; font-size:12px; } .btnMoreGroup .btnMenu li.active,.btnMoreGroup .btnMenu li:hover{ color:$activebgcolor; } .btnMoreGroup .primarySelBtn:after{ content:""; display:inline-block; background: url('../images/select.png') no-repeat -10px -117px; width: 8px; height: 5px; margin-left:10px; margin-top:13px; } .btnMoreGroup .primarySelBtn.dis:after{ background-position:-10px -83px; } .nodata{ background:url(../images/nodata.png) no-repeat center center; width:100%; height:250px; position:relative; margin-bottom:20px; } .nodata h5{ font-size:24px; color:$nofontcolor; position:absolute; bottom:20px; font-weight: normal; text-align:center; width:100%; } .nodataTxt{ height: 100%; min-height: 250px; width:100%; box-sizing:border-box; line-height: 250px; text-align:center; font-size:24px; color:$nofontcolor; background-color:#fff; } .tipsList{ margin-top:20px; } .tipsList.statustip{ width:600px; margin:0 auto; } .tipsList dt{ font-size:14px; color:$labelfontcolor; line-height: 30px; } .tipsList.statustip dt{ margin-top:20px; color:$lightfontcolor; } .tipsList ol{ margin-left: 1em; } .tipsList li,.tipsList dd{ font-size:12px; color:$lightfontcolor; line-height: 18px; list-style-type: decimal; } .tipsList.statustip dd{ padding-left: 2em; } .tipsList.warnTip dt,.tipsList.warnTip li{ font-size:12px; line-height: 20px; color:$formred; } .tipsList.alert dt,.tipsList.alert li{ font-size:12px; line-height: 20px; color:#666; } .alert dt { margin-bottom:30px; } .lengedChart{ margin-right:150px; } .lengedWrap{ width:130px; position:absolute; right:20px; top:20px; } .lengedWrap .searchWrap.searchSpec{ width:130px; } .lengedWrap .searchIpt{ margin:0px; width:130px; float:left; } .lengedWrap ul{ width:100%; border-bottom:1px solid #d5d7d8; height:237px; max-height:237px; overflow-y:auto; } .lengedWrap li{ position:relative; padding:10px 10px 10px 20px; line-height: 16px; cursor: pointer; font-size:12px; } .lengedWrap li .sign{ width:10px; height:10px; border:1px solid #808080; border-radius:50%; display:inline-block; position:absolute; left:0px; top:12px; } .lengedWrap li.disable .sign{ border-color:#a6a6a6; } .lengedWrap li.disable{ color:#a6a6a6; cursor: default; } .custom{ background-image:url(../images/custommenu01.png); background-repeat:no-repeat; } .finshedWrap{ margin:0px auto; margin-top:70px; margin-bottom:40px; text-align:center; } .finshedIcon{ @extend .custom; background-position:-10px -10px; width: 32px; height: 32px; display:inline-block; vertical-align:middle; } .finshedWrap .finshLabel{ font-size:20px; color:$labelfontcolor; vertical-align:middle; padding-left: 10px; } .descWrap{ width: 320px; margin:0 auto; } .pTitle{ font-size:12px; color:$lightfontcolor; margin-top:30px; } .olList{ background-color:$btngraybg1; border:1px solid $wraptitlebrc; border-radius:2px; padding: 10px 25px; } .olList.normal{ background-color:transparent; border:none; padding-left: 15px; padding-top:0px; } .olList.normal li{ color:$lightfontcolor; } .olList li{ list-style-type:decimal; font-size:12px; color:$labelfontcolor; line-height: 20px; } .customNav{ background-color:$tablethbg; border-bottom:1px solid $headerbc; height:45px; vertical-align:middle; margin-bottom:0px; } .customNav li{ float:right; font-size:14px; color:$labelfontcolor; margin-right:20px; padding: 0px 10px; line-height: 45px; cursor: pointer; position:relative; } .customNav.custleft{ padding-left: 15px; } .customNav.custleft li{ float:left; } .customNav li.active{ color:$blackfontcolor; } .customNav li:after{ content:""; position:absolute; left:0px; bottom:-1px; height:2px; width:0px; background-color:$activebgcolor; transition:all 0.2s; } .customNav li.active:after{ width:100%; } .filterBox{ margin:20px 0px; } .filterBox .searchWrap{margin-top:0px;margin-right:0px;} .filterBox .searchIpt{height:32px;line-height: 32px;} .iconBtn{ border:1px solid $bordercolor; border-radius:$comradius; font-size:12px; padding:6px 10px 7px 10px; color:$labelfontcolor; display: inline-block; margin-left: 20px; cursor: pointer; background-color:$btngraybg1; } .iconBtn.disable,.iconBtn.disable:hover{ color:$lightfontcolor; cursor: default; border:1px solid $bordercolor; } .iconBtn.active ,.iconBtn:hover{ color:$darkbluecolor; border-color:$darkbluecolor; } .filterIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-83px -10px; width: 19px; height: 13px; margin-right:3px; } .iconBtn.active .filterIcon,.iconBtn:hover .filterIcon,.filterIcon:hover{ background-position:-83px -34px; } .dropIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-52px -10px; width: 16px; height: 13px; position:absolute; right:20px; top:20px; cursor: pointer; } .iconBtn.active .dropIcon,.iconBtn:hover .dropIcon,.dropIcon:hover{ background-position:-52px -34px; } .doBackIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-205px -9px; width: 13px; height: 14px; margin-right:3px; margin-top:-3px; } .iconBtn.active .doBackIcon,.iconBtn:hover .doBackIcon,.doBackIcon:hover,.doBackIconBlue{ background-position:-205px -34px; } .matchIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-113px -8px; width: 15px; height: 16px; margin-right:3px; } .iconBtn.active .matchIcon,.iconBtn:hover .matchIcon,.matchIcon:hover{ background-position:-113px -32px; } .collectionIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-138px -10px; width: 13px; height: 12px; margin-right:3px; } .iconBtn.active .collectionIcon,.iconBtn:hover .collectionIcon,.collectionIcon:hover{ background-position:-138px -34px; } .hascollect .collectionIcon,.hascollect.iconBtn:hover .collectionIcon{ background-position:-159px -10px; } .hascollectionIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-159px -10px; width: 13px; height: 12px; } .additionIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-182px -9px; width: 12px; height: 12px; margin-right:3px; margin-top:-3px; } .iconBtn.active .additionIcon,.iconBtn:not(.disable):hover .additionIcon,.additionIcon:hover{ background-position:-182px -34px; } .customRetentionIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-152px -148px; width: 14px; height: 10px; margin-right:3px; } .iconBtn.active .customRetentionIcon,.iconBtn:hover .customRetentionIcon,.customRetentionIcon:hover{ background-position:-152px -167px; } .customEventIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-176px -147px; width: 15px; height: 13px; margin-right:3px; } .iconBtn.active .customEventIcon,.iconBtn:hover .customEventIcon,.customEventIcon:hover{ background-position:-176px -167px; } .customFunnelIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-201px -147px; width: 14px; height: 13px; margin-right:3px; } .iconBtn.active .customFunnelIcon,.iconBtn:hover .customFunnelIcon,.customFunnelIcon:hover{ background-position:-201px -167px; } .matchOkIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-240px -9px; width: 18px; height: 18px; } .matchNoIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-266px -8px; width: 18px; height: 18px; } .matchEditIcon{ @extend .custom; display:inline-block; vertical-align:middle; background-position:-294px -10px; width: 13px; height: 15px; cursor:pointer; } .addReportIcon{ @extend .custom; background-position:-18px -153px; width: 50px; height: 50px; margin:0 auto; margin-top:135px; } .addReportIconDesc{ color:$lightfontcolor; text-align:center; margin-top:10px; font-size:16px; } .disReport{ .defineBox .defineBoxItem .chartBox{ background-color: $disbgcolor; } .addReportIcon{ background-position:-84px -153px; } .addReportIconDesc{ color:$disfontcolor; } } .customType{ margin:10px 0px 30px; } .customType .iconBtn{ padding:1px 8px; margin-left:10px; } .customType .iconBtn:first-child{ margin-left:0px; } .defineBox{ margin-right:-10px; overflow:hidden; } .defineBox .defineBoxItem{ width:50%; float:left; } .defineBox .defineBoxItem .chartBox{ margin-right:10px; margin-bottom:10px; border:1px solid $wraptitlebrc; border-radius:$comradius; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding:20px; padding-bottom:10px; background-color:$defaultbg; min-height:318px; position:relative; } .defineChartBox.defineBox .defineBoxItem .chartBox{ min-height:444px; } .boxTitle{ font-size:16px; font-weight:normal; } .pinfo{ color:$lightfontcolor; font-size:12px; margin:10px 0px; } .chartBox .snviewWrap{ margin-top:23px; margin-bottom:10px; } .customnew{ background-image:url(../images/custom.png); background-repeat:no-repeat; } .chartBox .snviewItem{ @extend .customnew; width: 114px; height: 65px; margin-left:20px; margin-right:15px; display:inline-block; } .chartBox .delbtn{ @extend .customnew; width: 14px; height: 14px; cursor: pointer; } .chartBox .delbtn.del{ background-position:-118px -5px; } .chartBox .delbtn.del:hover{ background-position:-142px -5px; } .chartBox .eidtbtn{ @extend .customnew; width: 12px; height: 13px; cursor: pointer; display: inline-block; } .chartBox .eidtbtn.eidt{ background-position:-166px -5px; } .chartBox .eidtbtn.eidt:hover{ background-position:-190px -5px; } .imgbtn{ cursor: pointer; } .imgbtn .two{ @extend .customnew; width: 14px; height: 15px; background-position:-23px -5px; } .imgbtn:hover{ .two{ background-position:-47px -5px; } } .imgbtn .three{ @extend .customnew; width: 14px; height: 15px; background-position:-71px -5px; } .imgbtn:hover{ .three{ background-position:-92px -5px; } } .blueArrow{ @extend .customnew; background-position:-5px -9px; width: 8px; height: 5px; float:right; margin-top:10px; margin-right:10px; cursor: pointer; } .selList i{ @extend .customnew; width: 14px; height: 14px; display: inline-block; } .selList .chartType.optionList ul li i.line{ background-position:-101px -27px; } .selList .chartType.optionList ul li i.columnstack{ background-position:-53px -27px; } .selList .chartType.optionList ul li i.pie{ background-position:-5px -27px; } .selList .chartType.optionList ul li i.table{ background-position:-149px -28px; } .selList .chartType.optionList ul li.active,.chartType.optionList ul li:hover{ i.line{ background-position:-125px -27px; } color:#4186ec; } .selList .chartType.optionList ul li.active,.chartType.optionList ul li:hover{ i.columnstack{ background-position:-77px -27px; } color:#4186ec; } .selList .chartType.optionList ul li.active,.chartType.optionList ul li:hover{ i.pie{ background-position:-29px -27px; } color:#4186ec; } .selList .chartType.optionList ul li.active,.chartType.optionList ul li:hover{ i.table{ background-position:-170px -28px; } color:#4186ec; } .stepWarp .selList i, .stepWarp .iconfont { display:none !important; } .emptyImg{ background-image:url(../images/empty.png); width: 100px; height: 100px; display: inline-block; } .chartTip{ font-size:12px; color: #999999; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; cursor:default; } .spetableList table{ width:100%; border-collapse:collapse; } .spetableList table th{ border:1px solid $tablebr; height:$tablecellheight; vertical-align:middle; padding:0px 5px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; background-color:$tablethbg; color:$tablethft; font-weight: normal; } .spetableList table td{ border:1px solid $tablebr; height:$tablecellheight; vertical-align:middle; padding:5px 5px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; background-color:$tablecelleven; color:$tabletdft; text-align:center; word-wrap:break-word; word-break:break-all; max-width:200px; min-width:80px; } .spetableList table tr:nth-child(odd) td{ background-color:$tablecellodd; } .spetableList table tr:hover td,.spetableList table tr.active td{ background-color:$tablecellhover; } .tipDate{ color: #666666; border-bottom: 1px solid #e4e4e4; padding-top:10px; padding-bottom: 10px; font-size:12px; } .tipVal{ display:inline-block; font-size:16px; font-weight:400; margin-top: 5px; } .chartBox .snviewItem.line{ background-position:-129px -55px; } .chartBox .snviewItem.columnstack{ background-position:-253px -55px; } .chartBox .snviewItem.pie{ background-position:-377px -55px; } .chartBox .snviewItem.table{ background-position:-501px -55px; } .chartBox .snviewItem.funnel{ background-position:-253px -55px; } .chartBox .snviewItem.eventstats{ background-position:-129px -55px; } .chartBox .snviewItem.retention{ background-position:-5px -55px; } .customname{ color: #00a9e8; cursor:pointer; border-bottom: 1px solid #00a9e8; } .boxBottom{ display:flex; justify-content:flex-end; color:$lightfontcolor; font-size:12px; position:absolute; bottom:16px; left:0px; right:20px; } .boxBottom .item{ margin-left:20px; } .chartBox .chartInfo,.chartBox .infoItem,.chartBox .loadingWrap{ height:310px; } .wrongIcon{ @extend .custom; background-position:-143px -189px; width: 32px; height: 32px; display:inline-block; vertical-align:middle; margin-top:-5px; } .lostInfo{ width: 100%; height:180px; text-align:center; vertical-align:middle; color:$nofontcolor; font-size:20px; line-height: 180px; } .customBigWin{ position:absolute; top:20px; right:50px; left: 270px; z-index: 5; } .customSet{ @extend .settingIcon; background-position:-32px -12px; width:14px; height:14px; display: inline-block; position:absolute; right:40px; top:10px; } .onOffBtn{ background-color:#d3d2d2; width:24px; height:14px; border-radius:29px; display:inline-block; vertical-align:middle; margin-left:10px; position:relative; cursor: pointer; } .onOffBtn:before{ content:""; width:8px; height:8px; border-radius:50%; background-color:#fff; position:absolute; left:3px; top:3px; } .onOffBtn.on{ background-color:#87b2ff; } .onOffBtn.on:before{ left:inherit; right:3px; } .eptIcon{ background-image:url(../images/export01.png); background-repeat:no-repeat; display:inline-block; vertical-align:middle; } .eptWrapGroup{ float:right; margin:10px; margin-bottom:0px; } .eptWrap{ display:inline-block; vertical-align:middle; width: 30px; height: 26px; text-align:center; cursor: pointer; background-color:$formcampbg; border:1px solid $formmenudis; border-radius:$comradius; } .eptWrap.big{ height:28px; } .eptWrap:hover,.eptWrap.lc:hover{ border-color:#a0a0a0; } .eptWrap.active{ background-color:#b5b5b5; border-color:transparent; } .eptWrap.lc{ border-top-right-radius:0px; border-bottom-right-radius:0px; border-right-color:transparent; margin-right:-5px; } .eptWrap.lc:hover{ margin-right:-4px; } .eptWrap.rc{ border-top-left-radius:0px; border-bottom-left-radius:0px; } .eptChart{ @extend .eptIcon; background-position:-10px -11px; width: 16px; height: 14px; display:inline-block; vertical-align:middle; margin-top:5px; } .active>.eptChart{ background-position:-10px -35px; } .eptList{ @extend .eptIcon; background-position:-50px -12px; width: 16px; height: 12px; display:inline-block; vertical-align:middle; margin-top:6px; } .active>.eptList{ background-position:-50px -36px; } .eptOut{ @extend .eptIcon; background-position:-87px -10px; width: 16px; height: 16px; display:inline-block; vertical-align:middle; margin-top:4px; } .active>.eptOut{ background-position:-87px -34px; } .orderIcon{ @extend .eptIcon; background-position:-119px -12px; width: 16px; height: 16px; display:inline-block; vertical-align:middle; margin-top:6px; } .inputFile{ position: absolute; opacity:0; width:100%; left:0px; top:0px; height:100%; cursor:pointer; } /*date begin*/ .dateRange{ @extend .iptform; width:240px; cursor: pointer; background-color:#fff; position:relative; } .dateRange.single{ width:120px; } .dateRange.active{ border-color:$dateactivecolor; background-color:$dateactivecolor; } .dateRange .dateletter span{ color:$datedisfc; display:inline-block; vertical-align:top; } .dateRange.active .dateletter span{ color:#fff; } .calcIcon{ background:url(../images/select.png) no-repeat center center; width:30px; height:20px; margin-top:7px; display:inline-block; } .dateRange.active .arrowIcon{ background:url(../images/select.png) no-repeat; background-position:-10px -151px; } .dateRange .cal{ @extend .calcIcon; background-position:-8px -6px; } .dateRange.active .cal{ background-position:-8px -40px; } .dateWarp{ background: $datebg; border: 1px solid $datebr; border-radius: $comradius; color: $datefc; position: absolute; top:45px; left: 0px; z-index: 8; margin-top: -11px; font-size: 12px; padding-left: $datewrapgap; } .rightDate .dateWarp{ left:initial; right:0px; } .dateWarp:after{ clear: both; height: 0; line-height: 0; display: block; content: ''; } .date-single{ float: left; margin: $datewrapgap; margin-left: 0px; background: #fff; border: 1px solid $datebr; border-radius: $comradius; padding-bottom: 10px; box-sizing:border-box; } .date-title{ height: 34px; line-height: 34px; text-align: center; position:relative; } .dateicon{ background:url(../images/time.png) no-repeat center center; height:16px; width:16px; cursor: pointer; display:block; position:absolute; top:8px; } .date-title .iconleft{ @extend .dateicon; background-position:-10px -9px; left:10px; } .date-title .iconright{ @extend .dateicon; background-position:-10px -43px; right:10px; } .date-label{ float: left; text-align: center; font-size: 14px; color: #323232; width: 80%; } .date-table th{ background: $datethbg; border-bottom: 1px solid $datethbr; border-top: 1px solid $datethbr; font-weight: normal; height: $datecellhw; line-height: $datecellhw; text-align: center; color: $datethfc; } .date-table td a{ height:$datecellhw; line-height:$datecellhw; text-align: center; width: $datecellhw; display: block; text-decoration: none; color:$datefc; cursor:pointer; margin:4px 4px 0px 4px; border:1px solid transparent; } .date-week .date-table td a{ height:$datecellhw; line-height:$datecellhw; width: $datewcellhw; } .date-month .date-table td a{ height:$datemcellhw; line-height:$datemcellhw; width: $datemcellhw; } .date-table td a.choose{ color: $dateactivecolor; border-radius:$dateradius; border-color:$dateactivecolor; } .date-month .date-table td a.choose{ border-radius:50%; } .date-table td a.disabled{ color:$datedisfc; } .date-table td a.start_end{ color:#fff; background-color:$dateactivecolor; border-radius:$dateradius; } .date-table td a.other-month{ display: none; } .date-footer{ padding-bottom:$datewrapgap; padding-right:15px; } .date-input{ line-height:$dateipth; } .date-input label{ display: inline-block; color:$datelabelfc; } .date-input input{ @extend .iptform; width:90px; height:$dateipth; line-height:$dateipth; } .date-footer .btn2,.date-footer .btn3{ height:26px; line-height:26px; width:64px; padding:0px; text-align:center; } .relativeDateWrap{ float:left; margin-top:15px; } .relativeDateWrap .btn{ clear:both; width: 60px; text-align: center; height: 25px; line-height: 25px; margin-top: 8px; } .productList { padding:32px 16px; border-radius:3px 3px; background:#fff; } .productLi { display:inline-block; width:324px; height:243px; background:url(../images/trackingio.png) no-repeat top center; border:1px solid #c9c9c9; border-radius:3px 3px; margin:0 16px; overflow:hidden; } .productLi:hover .productHover{ display:block; position:relative; top:-243px; } .productHover { display:none; width:324px; height:243px; background:rgba(0,0,0,0.6); border-radius:3px 3px; } .productHover .btnpro{ width:120px; height:36px; line-height:36px; border-radius:3px 3px; text-align:center; font-family:"SimHei"; color:#fff; font-size:14px; cursor:pointer; background:#00a9e8; margin:0px auto; position:relative; top:103px; } .productHover .productAlert{ font-family:"SimHei"; color:#fff; font-size:14px; line-height:20px; padding:90px 40px 0 40px; } .productLiNo{ background:url(../images/trackingioh.png) no-repeat top center; } .productLi .productStatus{ width:auto; height:30px; line-height:30px; text-align:right; font-size:12px; color:#fff; padding-right:10px; } .productLi .productTitle{ width:100%; height:26px; line-height:26px; text-align:center; font-family:"Arial"; font-size:26px; color:#333; margin-top:135px; margin-bottom:10px; } .productLi .productText{ width:100%; height:14px; line-height:14px; text-align:center; font-size:14px; color:#999; margin-bottom:28px; } .oneLink { padding:10px 20px; height:auto; border:1px solid #c9c9c9; border-radius:2px 2px; background:#fbfbfb; line-height:30px; font-size:12px; color:#999; } .oneLink p img { position:relative; top:3px; padding:0 5px; } .oneLinkfix .selList{ width:160px; margin-right:10px; } .oneLinkfix .searchIpt { width:160px; } .oneLinkfix .searchWrap input{ width:160px !important; } .oneLinkBack { line-height:34px; color:#999; } .onelinkDownload { width:calc(100% - 200px); padding:10px 20px; border:1px solid #c9c9c9; background:#f9f9f9; line-height:30px; display:inline-block; } .oneLinkTip { display:inline-block; line-height:34px; padding-right:10px; } .btn10{ height: 34px; line-height: 34px; border:1px solid #c9c9c9; color: #666; padding: 0px 10px; float: left; border-radius: 3px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fbfbfb; cursor: pointer; } .btn10 .formAddIcon{ @extend .addIcon; background-position:-1px -100px; height:12px; width:12px; display:inline-block; margin-right: 6px; } .btn10:hover{ border:1px solid #4e93cf; color: #4e93cf; } .btn10:hover .formAddIcon{ @extend .icon0413; background-position:-50px -23px; margin-top:-4px; } .authPowerWrap{ margin:20px; border-radius:$comradius; border:1px solid $bordercolor; } .authPowerWrap.authChannel{ margin-left:50px; border:none; } .authPowerWrap.authChannel{ .powerHeader,.roleList{display:none;} .powerInfoWrap{ padding:10px; margin-top: 0px; } } .nopower{ background:url(../images/nopower.png) no-repeat center center; width:20px; height: 100%; display: inline-block; vertical-align: middle; } .authPowerWrap{ .powerHeader{ height:35px; line-height: 35px; background-color:$formtitlebg; border-bottom:1px solid $bordercolor; text-align: left; } .powerHeader>span{ color:$darkfontcolor; font-size: 14px; padding-left: 15px; } .powerHeader .addRole{ color:$tabletdactiveft; float: right; margin-right: 10px; cursor: pointer; } .addRole{ .tiplabel{margin-left:0px;cursor: default;} .addAttrIcon{margin-top:-2px;} } .roleList{ padding-left:20px; padding-top:20px; } .roleList li{ margin-bottom: 20px; color:$lightfontcolor; } .roleList li .radiolabel{ display: inline-block; cursor: pointer; } .roleList li .radio{ margin-top: -2px; } .roleList li em{ color:$labelfontcolor; display: inline-block; width:215px; } .roleList li em.ckblue{ color:$tabletdactiveft; } .powerInfoWrap{ padding:10px; margin-top: 20px; } .powerInfoWrap{ p {color:$labelfontcolor;margin-bottom:10px;} .powerSteps{ margin-bottom: 20px; } .powerSteps li{ float:left; width:33%; color:$lightfontcolor; border-bottom:2px solid #c9c9c9; position:relative; text-align: center; height: 30px; margin-right: 0.5%; cursor: pointer; } .powerSteps.two li{width:49%;margin-right:2%;} .powerSteps li:last-child{margin-right:0px;} .powerSteps li em{ display: block; position:absolute; width:16px; height: 16px; line-height: 16px; color:#fff; left:50%; margin-left: -8px; bottom:-8px; background-color: #c9c9c9; border-radius:50%; text-align: center; } .powerSteps li.active{ color:$tabletdactiveft; border-color:$tabletdactiveft; } .powerSteps li.active em{ background-color: $tabletdactiveft; } .powerSelectWrap{ border-radius:$comradius; border:1px solid $bordercolor; position:relative; height:400px; } .powerSelectWrap{ .powerHeader{ text-align: center; position:relative; } .bR:after{ position:absolute; content:""; top:0px; bottom:0px; right:-1px; width:1px; background-color: $bordercolor; z-index: 1; } .leftSelectWrap{ position: absolute; left:0px; right:300px; top:0px; bottom:0px; border-right:1px solid $bordercolor; } .rightSelectWrap{ position: absolute; width:300px; right:0px; top:0px; bottom:0px; } .selInfosWrap{ margin:10px 0px; } .selInfosWrap dt{ border-bottom:1px solid $bordercolor; line-height: 20px; text-align: left; color:$labelfontcolor; margin:0px 15px 10px 15px; } .selInfosWrap li{ color:$labelfontcolor; height: 30px; line-height: 30px; padding-left: 15px; box-sizing:border-box; cursor: pointer; @extend .nowrap; overflow:hidden; } .selInfosWrap.w3 li{width:33%;display:inline-block;} .checkedText { color:#cdcdcd !important;} .selInfosWrap li .checkbox{ margin-right:5px; // margin-top:-2px; } .selInfosWrap li.current{ position:relative; background-color: #fff; border-bottom:1px solid $bordercolor; border-top:1px solid $bordercolor; width:301px; z-index: 1; color:#428ccc; } .selInfosWrap li.current:after{ position:absolute; content: ""; right:-2px; width:3px; top:0px; bottom:0px; background-color:#fff; } .selInfosWrap li.current:first-child{border-top:none;} .searchWrap{ float:none; margin-left: 10px; width:auto; } .scrollItem{ @extend .hm-scroll; max-height: 320px; overflow-y: auto; } .leftSelectWrap.appSel{background-color:$formtitlebg;} .leftSelectWrap.appSel{ .selInfosWrap{margin:0px;} .selInfosWrap li{ height: 35px; line-height: 35px; } } } .powerSelectWrap.selchannel{ .leftSelectWrap{ left:0px; width:300px; } .rightSelectWrap{ left:300px; right:0px; width:auto; } } .powerSelectWrap.selPower{height:850px;} .filterTab{ border-bottom: 1px solid $bordercolor; margin:0px 15px; } .filterTab li{ display:inline-block; padding-left: 10px; padding-right:20px; color:$labelfontcolor; line-height: 35px; cursor: pointer; } .filterTab li.active{ color:$tabletdactiveft; } .channelSelList{} .channelSelList li{ line-height: 40px; padding:0px 15px; } .channelSelList li{ .checkbox{margin-top:-2px;} em{ display: inline-block; width:170px; color:$labelfontcolor; } .campSelWrap{ border-radius:$comradius; border:1px solid $bordercolor; background-color:$formtitlebg; } .campSelWrap li.light{ color:$tabletdactiveft; } .selInfosWrap{margin-top:5px;} .selInfosWrap li{ float:left; height: 25px; line-height: 25px; } .searchWrap{margin-left:15px;line-height: 28px;width:inherit;width:200px;} .searchWrap .searchIpt{width:200px;height:28px;line-height: 28px;} .campTips{ position:absolute; top:100%; margin-top: -8px; right:0px; background-color:#fff; border:1px solid $activebgcolor; border-radius:$comradius; width:500px; padding:10px 0px; bottom:100%; color:$labelfontcolor; height:150px; z-index: 1; } .campTips ul{ max-height: 150px; overflow-y: auto; } .campTips ul li{ width:33%; line-height: 20px; padding:0px 10px; float:left; box-sizing:border-box; @extend .nowrap; } .campTips:after{ position:absolute; content:""; bottom:100%; right:20px; width:0px; height:0px; border:6px solid transparent; border-bottom-color:$activebgcolor; } } } } .natureWrap{ width:550px; } .natureWrap{ ul{margin-top:10px;} li{ display:inline-block; color:$labelfontcolor; width:23%; cursor:pointer; } .checkbox{margin-right:5px;} .closeGray{ top:0px; right: 0px; } .openBtnGroup{ width:100px; } .natureTitle{ position:absolute; top:15px; left: 40%; color:$labelfontcolor; font-size: 14px; } } .letterTips{ position:absolute; background-color:#fffeea; border:1px solid $activebgcolor; border-radius:$comradius; width:180px; padding:5px 10px; line-height: 20px; bottom:100%; color:$labelfontcolor; } .letterTips .closeGray{ display:inline-block; height:14px; width: 30px; vertical-align:middle; margin-top:-2px; } .letterTips:after{ position:absolute; content:""; top:100%; left:20px; width:0px; height:0px; border:4px solid transparent; border-top-color:$activebgcolor; } .powerSelWrap.roleWrap{ border-radius:$comradius; border:1px solid $bordercolor; display:inline-block; white-space:nowrap; width:80%; } .powerSelWrap{ .checkbox{margin-right:5px;} dl{ display: inline-block; width:30%; padding-right:15px; box-sizing:border-box; vertical-align: top; padding-left:15px; } dt{ border-bottom:1px solid $bordercolor; line-height: 35px; margin:5px 0px; cursor: pointer; } dd{ color:$labelfontcolor; line-height: 30px; cursor: pointer; } dd li{ padding-left:30px; } .disabedText { color:#cdcdcd !important;} .remark { color:#999 !important; padding-left:18px;} } .campCopy { display:inline-block; cursor:pointer; color:#00a9e8; padding-left:10px; } .appPageWrap{ .ckEvt{ @extend .ckblue; @extend .hand; } .stepBtn{ float: none; width: 100px; text-align: center; margin: 0 auto; margin-top: 20px; } .applogWrap{ padding:20px 0px; .logTestWrap{ @extend .comWrap; width:calc((99% - 15px)/2); float:left; .logTestTitle{ background-color:$formtitlebg; border-bottom:1px solid $bordercolor; height:40px; line-height: 40px; padding-left:10px; } .logTestCont{ padding:10px; height:300px; .appTitle{ width:auto; } overflow: hidden; } .tipsList{ margin-top:0px; dt{font-size:12px;color:$lightfontcolor} } } } .appEvtWrap{ margin-top:20px; padding-bottom:20px; box-sizing:border-box; max-height: 200px; overflow-y:auto; .appEvtItem{ width:calc((99% - 20px)/3); float:left; border:1px solid $bordercolor; box-sizing:border-box; padding:10px; background-color:$formtitlebg; margin: 10px 10px 0px 0px; &:nth-child(3n+3){ margin-right: 0px; } span{ display: inline-block; width:100%; max-width: 100%; @extend .nowrap; color:$labelfontcolor; text-align: center; line-height: 30px; } em{ display: inline-block; width:100%; text-align: center; } } &:after{ @extend .clearfix; } } .chartWrap{ margin:0px; } .chartModule{ height: 40px; span{ line-height: 40px; margin-left: 10px; font-size: 14px; } } .chainWrap{ margin-top: 10px; padding-left: 10px; max-height: 290px; overflow-y: auto; .mycircle{ width:5px; height: 5px; border-radius:50%; border:1px solid $activebgcolor; content: ""; position:absolute; top:5px; left:-3px; z-index: 2; background-color:#fff; } li{ padding-bottom:20px; padding-left:10px; position: relative; &:after,&:first-child:before{ @extend .mycircle; } &:last-child i{ display: none; } } i{ position:absolute; width:1px; top:5px; bottom:-5px; left:0px; background-color:$activebgcolor; } span{ display: inline-block; vertical-align: top; color:$labelfontcolor; width:50%; @extend .nowrap; } h6{ display: inline-block; vertical-align: top; color:$formbluecolor; font-weight: normal; width:23%; @extend .nowrap; cursor: pointer; } em{ display: inline-block; vertical-align: top; color:$lightfontcolor; width:120px; float:right; @extend .nowrap; } } .leftTipsSlider .tableList{ margin:20px 40px; td{ height:30px; line-height: 30px; text-align: left; padding-left:20px; } } .backLog{ color:#fff; margin-left: 10px; cursor: pointer; &:before{ @extend .custom; background-position:-230px -34px; width: 13px; height: 14px; display: inline-block; content:""; margin-top: -2px; vertical-align: middle; margin-right: 5px; } } .selList{ background-color: #fff; margin-top: 3px; margin-right: 5px; } } .leftTipsSlider{ position:fixed; right:0px; top:0px; bottom:0px; background-color:#fff; z-index: 100; width:0px; overflow:hidden; @extend .myanm; .slideHeader{ height:30px; line-height: 30px; background-color:#6790dd; color:#fff; text-align: center; } .slideHeader .whiteClose{ float:right; margin-right: 10px; margin-top: 8px; } .slideSub{ height:40px; line-height: 40px; background-color:#f4f4f4; padding-left: 20px; } .tipsInfo{ padding-left:20px; padding-top:10px; } .tipsInfo li{ line-height: 30px; color:$lightfontcolor; } } .leftTipsSlider.sliderSw{width:300px;} .leftTipsSlider.sliderSw1{width:500px;} .leftTipsSlider.sliderLog{width:500px;} .autoNum{ counter-reset: num 0; p{ counter-increment: num; &:before{ content:counter(num) "."; } } } .searchGroup{ float:right; margin-right:10px; margin-top:8px; input{ @extend .iptform; background-color:#fff; border-right:none; margin-right: -3px; border-top-right-radius:0px; border-bottom-right-radius:0px; padding-right:30px; } .btns{ border:1px solid $bordercolor; color:$labelfontcolor; height:$iptheight; line-height: $iptheight; display:inline-block; vertical-align:middle; width:50px; text-align: center; background-color:#fbfbfb; border-top-right-radius:$comradius; border-bottom-right-radius:$comradius; box-sizing:border-box; cursor: pointer; } &.active input{ border-color:$activebgcolor; } &.active .btns{ border-color:$activebgcolor; background-color: $activebgcolor; color:#fff; } .removeTxt{ background:url(../images/close.png) no-repeat center center; width: 15px; height: 15px; cursor: pointer; position: absolute; top: 8px; right: 55px; background-size: 100%; } } #mychart{ height:1500px; margin:0 auto; border:1px solid #dcdcdc; background-color: #ffffff; } #tip_shape{ background: rgba(0,0,0,0.6); opacity: 0.8; width: 200px; height: 30px; display:none; text-align: center; border-radius: 5px; font-size: 14px; color: #ffffff; line-height: 30px; } .panel{ position: relative; height: 550px; margin: 0 auto; background-color: #ffffff; overflow: hidden; } .btnPath{ margin-top:15px; margin-right:10px; width:140px!important; text-align: center; float: left; position: relative; } .word-ellipsis{ width: 120px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .firstActive{ background-color: #00a9e8; color: #ffffff; } .firstActive:hover{ color: #ffffff; } .winScroll{ max-height:500px; width: 540px; overflow: auto; top:10%; color: #737373; } .solidArrow{ background: url(../images/path.png) no-repeat center center; width: 15px; height: 15px; display: inline-block; background-position: -121px -22px; float: left; margin-top: 25px; margin-right: 10px; } .dottedArrow{ background: url(../images/path.png) no-repeat center center; width: 15px; height: 15px; display: inline-block; background-position: -121px -6px; float: left; margin-top: 25px; margin-right: 10px; } .currentIcon{ background: url(../images/path.png) no-repeat center center; width: 15px; height: 15px; line-height: 15px; display: inline-block; background-position: -74px -15px; float: left; position: absolute; top: 8px; left: 5px; } .currentActive{ border: 1px solid #00a9e8; } .fixedTable{ background: #ffffff; position:relative; table{ td{ .tditem{@extend .nowrap;} .helpBox{ position: absolute;top:5px;left:50%;margin-left: 30px; } } } .copyColWrap table td{color:$labelfontcolor;} } .copyColWrap{ position:absolute; top:44px; left:1px; z-index: 2; table{ min-width:auto; width:auto; td{color:$labelfontcolor;} td.name{ color: $tabletdactiveft; cursor: pointer; } } max-height: 601px; overflow:hidden; } .tableHeader{ width: 100%; overflow: hidden; border:1px solid #dcdcdc; border-bottom:none; position: relative; margin:0 auto; box-sizing: border-box; } .tableInfo{ width: 100%; min-height: 300px; max-height: 602px; overflow:auto; border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc; position: relative; margin:0 auto; box-sizing: border-box; } .nothborder{ .fixedTable{ .tableHeader{border-top:none;} .tableInfo{border-bottom:none;} } } .tableSpline{ position: absolute; top:0px; // height: 100%; width:100px; background-color: transparent; left:0px; background:linear-gradient(to right,#ccc,rgba(255,255,255,0) 30%,rgba(255,255,255,0)); display: none; z-index: 2; } .fixedTable table{ border-collapse: collapse; min-width: 100%; } .fixedTable table th,.fixedTable table td{ padding:0px; box-sizing: border-box; z-index:2; background-color: $headerbg; font-weight: normal; color: $tablethft; } .fixedTable table th div,.fixedTable table td div,.fixedTable table td .divspan{ border-right:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc; padding:5px; height:32px; line-height:32px; vertical-align: middle; text-align: center; } .fixedTable table td .divspan{ div{ padding:0px; border:none; } } .tableInfo table tr:nth-child(odd) td{ background-color: $tablecellodd; } .tableHeader table th{ background-color: $tablethbg; } .tableInfo table td{ color: $tabletdft; } .tableInfo tr:first-child td{border-top: 0px;} .tableInfo tr div{ white-space: nowrap; text-overflow: ellipsis; overflow:hidden; } .tableInfo tr td:first-child div,.header tr th:first-child div{ border-left: none; } .tableHeader tr th:last-child div,.tableInfo tr td:last-child div{border-right: none;} .tableInfo table td.name{ color: $tabletdactiveft; cursor: pointer; } .mainMenu{ margin-left:-10px; display: none; } .mainShow{ display: block; } .mainMenu div{ float: left; line-height: 34px; margin-right: 28px; font-size: 14px; cursor: pointer; color: #c6daff; width: 68px; text-align: center; letter-spacing:1px; } .mainMenu div.active{ border-bottom: 2px solid #ffffff; font-size: 16px; color: #ffffff; } .mainMenu div:hover{ font-size: 16px; color: #ffffff; } .backOld{ line-height: 35px; margin-right:30px; cursor:pointer; color:#fff; font-size:14px; } .bigBtn{ height:40px; text-align:center; color:#999999; cursor:pointer; position:absolute; bottom:0px; border-top: 1px solid #e4e4e4; border-right: 1px solid #e4e4e4; width:136px; padding-left:50px; background-color:#fff; } .bigBtn:hover, .bigBtn:active{ span{ background: url(../images/left_icon.png) no-repeat -10px -36px; } div{ color: $menuliactiveft; } } .smallBtn{ height:40px; text-align:center; color:#999999; cursor:pointer; position:absolute; bottom:0px; border-top: 1px solid #e4e4e4; border-right: 1px solid #e4e4e4; width:40px; background-color:#fff; } .smallBtn:hover, .smallBtn:active{ span{ background: url(../images/left_icon.png) no-repeat -40px -36px; } } .bigBtn div{ height:40px; line-height:40px; font-size:14px; color:#999999; float:left; padding-left:10px; } .unfold{ background: url(../images/left_icon.png) no-repeat -10px -10px; width: 20px; height: 16px; display: inline-block; margin-top:12px; float:left; } .nounfold{ background: url(../images/left_icon.png) no-repeat -40px -10px; width: 20px; height: 16px; display: inline-block; margin-top:12px; } .leftBig{ width:186px; overflow-y:auto; position:absolute; top:0px; bottom:41px; border-right: 1px solid #e4e4e4; background-color:#fff; } .leftSmall{ width:40px; position: relative; } .leftSmall li{ padding-left:9px; position:relative; } .smallMenu{ position:absolute; background-color:$menubgcolor; color:$menuftcolor; width:160px; left:8px; top:0px; z-index:9999; font-size:14px; border: 1px solid #e4e4e4; } .arrIcon{ background: url(../images/left_icon.png) no-repeat -10px -64px; width: 7px; height: 13px; display: inline-block; position: absolute; left: 2px; top: 14px; z-index:10000; } .outDiv{ position:absolute; left:37px; top:0px; width:179px; height:100%; } .leftSmall{ .sidebarNav .activemore a{ color:$menuftcolor; } .sidebarNav li:hover a{ color:$menuftcolor; } .smallMenu li:hover a{ color:$menulihoverft; } .sidebarNav .subli.active { border-left-color: $menubgcolor; background-color: $menubgcolor; a{ color:$menuliactiveft; } } .sidebarNav .smallMenu li.active { border-left-color: $menubgcolor; background-color: $menubgcolor; a{ color:$menuliactiveft; } } .sidebarNav .smallMenu li{ padding-left:7px; } .sidebarNav li.subli{ padding-left:20px; } } .addChannel{ font-size:14px; margin-bottom:14px; } .addChannelButton{ cursor:pointer; height: 34px; line-height: 34px; padding:0 15px; text-align: center; color: #fff; background: #00a9e8; border-radius: 4px 4px; display: inline-block; } .addProTest{ cursor:pointer; height: 32px; line-height: 32px; padding:0 15px; margin-bottom:20px; text-align: center; color: #333; border:1px solid #c9c9c9; background: #fbfbfb; border-radius: 4px 4px; display: inline-block; } .channelAddText { min-height:30px; line-height:22px; padding-left:163px; color:#666; } .channelAddText div{ padding:4px 0; } .changeIcon{ background: url(../images/complex.png) no-repeat -10px -9px; height: 13px; width: 14px; display: inline-block; cursor: pointer; margin: 0px 10px; } .deleteIcon{ background: url(../images/complex.png) no-repeat -34px -10px; width: 12px; height: 12px; display: inline-block; cursor: pointer; margin: 0px 10px; } .newaddIcon{ background: url(../images/complex.png) no-repeat -80px -8px; width: 13px; height: 13px; display: inline-block; cursor: pointer; margin: 0px 10px; } .eaddIcon{ background: url(../images/complex.png) no-repeat -56px -8px; width: 14px; height: 14px; display: inline-block; cursor: pointer; } .rateWrap{ position:absolute; top:100%; right:0px; border:1px solid $bordercolor; width:300px; background-color:#fff; border-radius:$comradius; .titWrap{ overflow: hidden; background-color:#f6f6f6; li{ width:50%; box-sizing:border-box; height: 40px; line-height: 40px; text-align: center; float: left; color:$labelfontcolor; border-bottom:1px solid $bordercolor; font-size: 14px; cursor: pointer; transition: all 0.2s; } li:first-child{border-right:1px solid $bordercolor;} li.active{ background-color: #fff; border-bottom-color:$activebgcolor; } } .rateInfo{ width:97%; height:auto; max-height: 300px; overflow-y: auto; padding:5px; .checkbox{margin-right:5px;} li{ height: 30px; line-height: 30px; box-sizing:border-box; padding-left: 5px; @extend .nowrap; cursor: pointer; color:$labelfontcolor; } li.dis{ color:$lightfontcolor; cursor: not-allowed; } } } .tableList table td{ .red{ color:#e74646; } .green{ color:#0aa372; } &.txright{ text-align: right; } } .adddis{ background: url(../images/adddis.png) no-repeat; width: 13px; height: 13px; display: inline-block; } .nobehavior { display:block; margin:0px auto; padding-top:100px; } .nobehaviorTitle { height:33px; line-height:33px; padding-top:12px; font-size:24px; color:#999999; text-align:center; } .nobehaviorText { width:520px; margin:0px auto; padding-top:40px; font-size:14px; color:#999999; text-align:left; font-size:14px; line-height:20px; } .openTipWin.orderWrap{ top:15%; // margin-top: -250px; width:400px; // height:530px; .tipCont{ padding:20px 30px; padding-top:0px; } p{ text-align: left; } } .orderUL{ li{ text-align: left; cursor: move; margin-bottom: 8px; .rate{ display: inline-block; background:#fafbfc; border:1px solid #d0d0d0; width:278px; height:28px; margin-left: 8px; padding-left: 5px; } } } .export ul li:hover{ color:$activebgcolor; } .noticeBox{ position: fixed; z-index: 2; right:24px; bottom:20px; .newInfo{ padding:10px 15px; background:#ffffff; border:1px solid #ebebeb; box-shadow:0 1px 10px 0 rgba(0,0,0,0.10); border-radius:2px; cursor: pointer; i{ background: url(../images/notice_ling.png) no-repeat center center; width:18px; height: 20px; vertical-align: middle; margin-top: -3px; display: inline-block; position: relative; margin-right: 5px; &:after{ content: ""; position: absolute; right:0px; top:0px; display: inline-block; background:#ff685c; width:5px; height:5px; border-radius:100%; } } } .noNewInfo{ background: url(../images/notice_info.png) no-repeat center center; width:40px; height:40px; cursor: pointer; } .noticeWin{ width:425px; overflow: hidden; .winTitle{ background:#5f97fb; height: 50px; border-top-left-radius: 5px; border-top-right-radius: 5px; padding-left: 20px; line-height: 50px; color:#fff; font-size: 16px; .noticeBack{ background: url(../images/notice_back.png) no-repeat center center; width:20px; height: 100%; display: inline-block; vertical-align: middle; margin-left: -10px; cursor: pointer; } .photo{ background: url(../images/notice_photo.png) no-repeat center center; height: 100%; width:24px; border-radius: 100%; display: inline-block; vertical-align: middle; margin-right: 8px; } &.small{font-size: 14px;} } .winCont{ height: 370px; max-height: 370px; overflow-y: auto; padding:0px 20px; background-color: #fff; border:1px solid #ebebeb; border-top: none; box-shadow:0 1px 10px 0 rgba(0,0,0,0.10); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; ul li{ border-bottom:1px solid #e4e4e4; i{ opacity:0.9; background:#ff685c; width:8px; height:8px; border-radius:100%; float:left; margin-top:22px; visibility: hidden; } h6{ padding-top:17px; padding-bottom: 5px; font-size: 14px; text-align: left; @extend .nowrap; margin-left: 15px; color:#666; font-weight: normal; cursor: pointer; &:hover{ text-decoration: underline; } } em{ display: block; text-align: right; color:#999; padding-bottom: 13px; } &.new{ i{visibility: visible;} h6{ color:#333; } } } .noticeLogo{ background: url(../images/notice_logo.png) no-repeat center right; width:100%; height: 25px; margin-top: 20px; } &.noInfo{ display: flex; justify-content: center; align-items: center; .noTips{ background: url(../images/notice_icon.png) no-repeat center top; width:60px; height: 60px; position: relative; p{ font-size: 14px; color:#666; text-align: center; margin-top: 38px; } } } .noticeDetail{ padding-top: 22px; .h5{ font-size:16px; word-wrap:break-word; } .p{ color:#999999; } .noticeNews{ line-height: 24px; padding-top: 20px; word-wrap:break-word; } } } } .hideNotice{ background: url(../images/notice_shou.png) no-repeat center center; width:40px; height:40px; cursor: pointer; margin-top: 10px; float: right; } } .appList{ margin-right: -14px; .appWrap{ width: 33.333%; box-sizing: border-box; padding-right: 14px; padding-top: 14px; display: inline-block; height:140px; .app{ background:#ffffff; height: 100%; border:1px solid #e4e4e4; border-radius:3px; cursor: pointer; &:hover{ border: 1px solid $logobg; box-shadow:0 1px 4px 0 rgba(0,0,0,0.10); } .setting{ background: url(../images/settings.png) no-repeat center center; width:16px; height:16px; cursor: pointer; margin-right: 13px; margin-top: -5px; padding: 7px; float: right; position: relative; &:hover{ background: url(../images/settings_hover.png) no-repeat center center; } ul{ background:#ffffff; border:1px solid #e4e4e4; box-shadow:0 1px 5px 0 rgba(0,0,0,0.10); border-radius:3px; width:78px; position: absolute; top:25px; right: 0px; li{ height:32px; line-height: 32px; padding-left: 10px; &:hover{ color: $menuliactiveft; } } } } .iconfont{ margin-left: 0px; color:#5f97fb; } .title{ font-size:16px; color:#333333; cursor: pointer; } .key{ font-size:12px; color:#666666; margin-left: 20px; margin-top: 20px; } .bottom{ font-size:12px; color:#666666; margin-left: 20px; margin-top: 14px; span:last-child{ margin-right: 20px; } .debugbtn{ background:#ffa331; border-radius:3px; width:70px; height:26px; color: #ffffff; text-align: center; line-height: 26px; display: inline-block; cursor: pointer; } } } } .more{ text-align: center; background:#fafafa; margin: auto; color:#666666; cursor: pointer; clear: both; margin-top: 20px; margin-right:15px; width: auto; height:32px; line-height:32px; } .noData{ text-align: center; span{ background: url(../images/no_data.png) no-repeat center center; display: inline-block; width:41px; height:41px; margin-top: 80px; } div{ font-size:14px; color:#999999; padding-top: 10px; } } }