@charset "utf-8"; /* Installation style*/ body{font-family:Arial,Helvetica,sans-serif,Microsoft Yahei;} /**{outline:0;} *:focus, *:active{outline:0;}*/ .installation{margin-left: 24px;margin-top: 12px;position: relative;} .hasbeen-list{ height: 190px; overflow-y: auto; } .port-add li.curr, .hasbeen-list li.curr{ background-color:#67a2e1; background-image:-webkit-linear-gradient(top, #67a2e1, #4c86c4); /* Chrome 10-25, iOS 5+, Safari 5.1+ */ background-image:linear-gradient(to bottom, #67a2e1, #4c86c4); /* Chrome 26, Firefox 16+, IE 10+, Opera */ color:#fff;} .btn-sm,.btn-sm-b{ width:148px; height:48px; font-size:20px;} .btn-sm-b{line-height:39px; background:url(../images/installation/map/btn_save_normal.png) no-repeat; color:#fff;} .btn-sm{line-height:30px; background: url(../images/installation/btn_normal_Group_Edit.png) no-repeat; color:#666;} .btn-sm:hover, .btn-sm-b:hover{ background:url(../images/installation/btn_selected_Group_Edit.png) no-repeat; color:#fff;} .btn-lg,.btn-lg-w,.btn-add,.btn-add-gray{width:192px; font-size:20px; text-align:center;} .btn-lg-w{ height:48px; line-height:38px; background:url(../images/installation/group/btn_normal_Select_the_device.png) no-repeat; color:#666;} .btn-lg{ height:48px; line-height:20px;background: url(../images/installation/group/btn_selected_save.png) no-repeat;color:#fff;} .btn-lg:hover,.btn-lg-w:hover{ background: url(../images/installation/group/btn_selected_Select_the_device.png) no-repeat; color:#fff;} .btn-add,.btn-add-gray{height:42px; line-height:37px; } .btn-add{ background: url(../images/installation/group/btn_normal_add.png) no-repeat;color:#666;} .btn-add-gray{ background:url(../images/installation/group/btn_dis_add_50.png) no-repeat; cursor:not-allowed; color:#b2b2b2;} .btn-add-gray:hover{ color:#b2b2b2;} .btn-add:hover{ background: url(../images/installation/group/btn_selected_add.png) no-repeat; color:#fff;} .border-red{ border:4px solid #f44975;} .border-red .ins-c-left{ width:481px; } .border-red .ins-c-right{width:479px; } .border-red .ins-group-cont1{height:438px;/*586px;*/} /* 1手动,自动扫描 style*/ .insta-sele-btn{ display:block; width:1234px; height:58px; margin:0 auto; padding:10px 0;} .insta-sele-btn a{ float:left; display:inline-block; width:617px; height:58px; line-height:50px; text-align:center; color:#fff; font-size:28px; background: url(../images/installation/btn_normal_Manual_installtion.png) no-repeat;} .insta-sele-btn a:hover{ background:url(../images/installation/btn_selected_Search.png) no-repeat;} .insta-sele-btn a.curr{ background:url(../images/installation/btn_normal_Auto_Search.png) no-repeat;} .instal_left{ float:left; width:264px; height:518px;border-right: 1px solid #ebeced;} .instal_left h3, .ins-table-header dt{color: #333;font-size: 22px;height: 62px; line-height:62px; text-align:center;} .instal_left h3{border-bottom: 1px solid #ebeced;} .instal_right{ float:left; width:968px;} .ins-table-header{ display:block;} .ins-table-header dt{ float:left;border-bottom:1px solid #ebeced;border-right:1px solid #ebeced; width:155px; font-weight:normal;} .ins-table-header dt:last-child{ border-right:0; width:191px;} /*table 固定样式*/ .inst_main { height:455px;overflow-x: hidden;overflow-y: auto;} .inst_table tr:nth-child(odd){ background:#fafafa;} .inst_table td{ position:relative; width:155px;height:50px; border-right:1px solid #ebeced;border-bottom:1px solid #ebeced; font-size:18px; color:#666; text-align:center;} .inst_table td:nth-child(1){ width:154px;} .inst_table td:last-child{ border-right:0; width:auto;} .inst_table td >button.dropdown-toggle{background-color:transparent; font-size:18px; color:#666; border:0;} .inst_table td >ul.dropdown-menu{ background:#fff;} .input_box{ border:0; background-color:transparent; width:150px; height:40px; line-height:40px;font-size:18px; color:#666; text-align:center;} .input_box:focus{ border:1px solid #1f72cc;color:#1f72cc;} .port-add{ width:100%;} .port-add li{border-bottom:1px solid #ebeced; height:50px; line-height:50px; cursor:pointer; font-size:20px; color:#333; text-align:center;} .port-add li.curr{ height:50px; } .insta_bottom{ height:82px; display:block; border-top:1px solid #d8d9db;} .insta_bottom span{ float:left; display:block; width:100%; margin-top:20px; padding:0 20px;} .insta_bottom span a{ display:inline-block; margin:0 2px; text-align:center;} /*进度条*/ .progress-out { position: relative; border: 1px solid #3e516a; background-color: #3e516a; margin:55px auto 25px; border-radius:50px; } .progress-in { position: absolute; height: 100%; width: 0%; border: none; background-color: #51c6f8;border-radius:50px; text-align: center; color: #fff; z-index: 1; } .percent-show { position: absolute; width: 100%; height: 100%; top: 0; left: 0; color: #000; text-align: center; z-index: 2;border-radius:50px; } .percent-show span{ display:inline-block; position:absolute; top:-35px; left:127px; color:#51c6f8; font-size:20px;} .hasbeen-list{ display:block; width:100%; margin-top:30px;} .hasbeen-list li a{ display:block; height:60px; line-height:60px; background:url(../images/installation/icon_file.png) no-repeat 35px center; padding-left:78px; text-align:left; color:#fff; font-size:22px; overflow:hidden; width:480px; text-overflow:ellipsis; } .btn_cancel, .btn_change{ width:148px; height:48px; border: 1px solid transparent; display:inline-block; line-height:42px;} .btn_cancel{ background:url(../images/installation/btn_pop_normal_Cancel.png) no-repeat;} .btn_change{ background:url(../images/installation/btn_pop_normal_toinstall.png) no-repeat} .btn_cancel:hover, .btn_change:hover{ background:url(../images/installation/btn_pop_selected_cancel.png) no-repeat; color:#fff;} /* ====================================*/ /* 2群组编辑 style*/ .instal-group-list{ position:relative; float:left; width:411px; height:578px; border-right:1px solid #d8d9db;} .instal-group-list:nth-child(3){ width:410px; border-right:none;} .instal-group-list h2{ background:#f5f6fa; border-bottom:1px solid #fff; height:65px; line-height:65px; text-align:center; font-size:22px;} .btlr{ border-top-left-radius:5px;} .btrr{ border-top-right-radius:5px;} .instal-group-list h2.fontgray{ color:#a6a7a9;} .ins-group-cont,.ins-group-cont1{ padding:10px 0; overflow-y:auto; overflow-x:hidden} .ins-group-cont{height:440px;border-top:1px solid #d8d9db;} .ins-group-cont1{ padding-left:10px; height:594px;} .ins-group-cont input{ display:block; width:308px; height:40px; border:1px solid #1f72cc; padding:0 10px; margin:8px auto; font-size:20px; color:#1f72cc;font-family:Microsoft Yahei,Arial,Helvetica,sans-serif;} .ins-group-cont input.inpu1{ border:1px solid #666; color:#999;} .instal-group-addcont,.instal-group-addcont li{ display:block; width:100%;} .instal-group-addcont li{ position:relative; height:52px; line-height:52px; text-align:center; color:#666; font-size:22px; cursor:pointer;} .instal-group-addcont li:hover{ background-color:#67a2e1; background-image:-webkit-linear-gradient(top, #67a2e1, #4c86c4); /* Chrome 10-25, iOS 5+, Safari 5.1+ */ background-image:linear-gradient(to bottom, #67a2e1, #4c86c4); /* Chrome 26, Firefox 16+, IE 10+, Opera */ color:#fff; height:52px; line-height:52px;} .instal-group-addcont li.curr{color:#1f72cc;} .instal-group-addcont li.curr:hover{ color:#fff;} .instal-group-addcont li span{ position:absolute; right:0; top:10px; display:inline-block;} .instal-group-addcont li span >a{ width:32px; height:32px; display:inline-block; margin-right:20px;} .instal-group-addcont li span >a.ico1{ background:url(../images/installation/group/icon_delete_selected.png) no-repeat;} .instal-group-addcont li span >a.ico2{ background:url(../images/installation/group/icon_edit_selected.png) no-repeat;} .instal-group-addcont li:hover span{ position:absolute; right:0; top:10px; display:inline-block;} .instal-group-addcont li:hover span >a{ width:32px; height:32px; display:inline-block; margin-right:20px;} .instal-group-addcont li:hover span >a.ico1{ background:url(../images/installation/group/icon_delete_normal.png) no-repeat;} .instal-group-addcont li:hover span >a.ico2{ background:url(../images/installation/group/icon_edit_normal.png) no-repeat;} .instal-group-bottom{ height:82px;border-top:1px solid #d8d9db;} .instal-group-bottom a,.instal-content-bottom a{ display:block; margin:0 auto; margin-top:20px;} .instal-group-list p.group-add{ display:block; position:absolute; bottom:0; width:100%; background:#fff;} .instal-group-list p.group-add a{ display:block; margin:15px auto; padding-left:30px;} /* ====================================*/ /*状态面板*/ .ins-group-cont .instal_normal{ margin:10px 13px 20px 13px; } .ins-group-cont1 .instal_normal{ margin:10px 5px 20px 5px; } .ins-c-cont .instal_normal{ margin:10px 5px; } .instal_normal{ float:left;width:104px; height:113px; position:relative;cursor:pointer; background:#fff;} .i_main_normal{height:113px; border-radius:3px; box-shadow:0 0 7px rgba(0, 0, 0, 0.3) inset;} .i_main_normal div{ position:absolute; top:-5px; right:-10px; z-index:10;} .i_main_normal h2{ position: absolute; top:0; left:0; width:100%; height:24px; line-height:24px; font-size:16px; color:#fff; border-top-left-radius:3px;border-top-right-radius:3px; border:none;} .header_ico i{ display:inline-block; width:100%; font-style:normal; padding-left:45px; text-align:left; background-position:18px center;} .icon_auto{ background:url(../images/installation/group/icon_AUTO.png) no-repeat;} .icon_cool{ background:url(../images/installation/group/icon_COOL.png) no-repeat;} .icon_dry{ background: url(../images/installation/group/icon_DRY.png) no-repeat ;} .icon_fan{ background: url(../images/installation/group/icon_FAN.png) no-repeat ;} .icon_heat{ background:url(../images/installation/group/icon_HEAT.png) no-repeat;} .icon_off{background:url(../images/installation/group/icon_off.png) no-repeat;} .icon_fault{background:url(../images/installation/group/icon_fault.png) no-repeat;} .icon_outline{background:url(../images/installation/group/icon_break.png) no-repeat;} .i_main_normal p{position:absolute;display:block; width:85px;left:10px;top:35px; height:54px;} .i_main_normal b{ position:absolute; bottom:5px;left:2px; display:block; width:101px; font-weight:normal; text-align:center; font-size:14px; color:#666;} /*设备框颜色 */ .device_blue h2{ background:#1f72cc; text-align:center;} /* .device_blue:hover, */ .blue_border{ border:2px solid #1f72cc;} .device_lightblue h2{ background:#51c6f8; text-align:center;} /* .device_lightblue:hover, */ .lightblue_border{ border:2px solid #51c6f8;} .device_pink h2{ background:#f44975;} /* .device_pink:hover, */ .pink_border{ border:2px solid #f44975;} .device_red h2{ background:#ff0000;} /* .device_red:hover, */ .red_border{ border:2px solid #ff0000;} .device_yellow h2{ background:#f0b22c; text-align:center;} /* .device_yellow:hover, */ .yellow_border{ border:2px solid #f0b22c;} .device_green h2{ background:#1fcc87; text-align:center;} /* .device_green:hover, */ .green_border{ border:2px solid #1fcc87;} .device_gray h2{ background:#b1b1b1; text-align:center;} /* .device_gray:hover, */ .gray_border{ border:2px solid #b1b1b1;} /*installation*/ .instal-bg{background:url(../images/installation/group/left_highlight.png) no-repeat left; height:660px;} .instal-nav{ float:left; width:263px;} .instal-content{ float:right; position:relative; width:968px; background:#fff;height:659px; margin-top:1px;border-top-right-radius:5px;border-bottom-right-radius:5px} .instal-nav h2{ height:65px; padding-left:55px; line-height:65px;border-bottom: 1px solid #1a232f;} .instal-nav .tree{ height:512px; overflow-y:auto;} .ins-nav-bottom{ height:82px; border-top:1px solid #949ca8; background:#2e3d52; margin-left:1px; border-bottom-left-radius:3px;} .ins-nav-bottom a{ display:block; height:82px; line-height:82px; background:url(../images/installation/group/icon_Custom_Groups_normal.png) no-repeat 40px center; padding-left:84px; text-align:left; color:#969eaa; font-size:20px;} .ins-nav-bottom a:hover{ background:url(../images/installation/group/icon_Custom_Groups_selected.png) no-repeat 40px center; color:#51c6f8;} .ins-c-left{ float:left; height:651px; width:485px; border-right:1px solid #d8d9db; background:#f5f6fa;} .instal-content h1{ height:65px; border-bottom:1px solid #d8d9db; line-height:65px; text-align:left; padding-left:20px; font-size:22px; color:#333; position:relative;} .ins-c-left-none{ height:593px; font-size:18px; color:#999; text-align:center; padding-top:220px; position:relative;} .ins-c-left-none a{ display:block; position:absolute; bottom:20px; left:150px;background:url(../images/installation/group/btn_normal_Select_the_device.png) no-repeat; width:192px; height:48px; line-height:40px; text-align:center; color:#666;font-size:20px;} .ins-c-left-none a:hover{ background:url(../images/installation/group/btn_selected_save.png) no-repeat; color:#fff;} .ins-c-right{ float:right; width:483px; background:#fff;} .ins-c-right >h1 span{ position:absolute; right:0; top:20px;} .ins-c-right >h1 span i{ display:block; float:right; width:1px; background:#a4aab3; height:32px; margin-right:20px;} .ins-c-right >h1 span a, .ins-c-right >h1 span a.curr1, .ins-c-right >h1 span a.curr2, .ins-c-right >h1 span a.curr3{ display:block; float:right; width:34px; height:32px; margin-right:20px;} .ins-c-right >h1 span a.ico1{ background:url(../images/installation/group/search_normal.png) no-repeat center;} .ins-c-right >h1 span a.ico1:hover, .ins-c-right >h1 span a.curr1{ background:url(../images/installation/group/search_selected.png) no-repeat center;} .ins-c-right >h1 span a.ico2{ background:url(../images/installation/group/icon_name_normal.png) no-repeat center;} .ins-c-right >h1 span a.ico2:hover, .ins-c-right >h1 span a.curr2{ background: url(../images/installation/group/icon_name_selected.png) no-repeat center;} .ins-c-right >h1 span a.ico3{ background:url(../images/installation/group/icon_mode_normal.png) no-repeat center;} .ins-c-right >h1 span a.ico3:hover, .ins-c-right >h1 span a.curr3{ background: url(../images/installation/group/icon_mode_selected.png) no-repeat center;} .ins-c-right >h1 span input.ser-inp{ position:absolute; right:62px; top:-7px; border:1px solid #1f72cc; width:155px; height:40px;padding:0 10px; font-size:20px; color:#1f72cc;} .ins-c-cont{ height:438px; overflow-y: scroll;-webkit-transform: translateZ(0px);-webkit-overflow-scrolling: touch} .instal-content-bottom,.instal-content-bottom1{ position:absolute; bottom:1px;left:0; z-index:99; height:82px; background:#fff; width:100%; border-top:1px solid #d8d9db;border-bottom-right-radius:5px;} .instal-button{ border-top:1px solid #d8d9db; height:73px; width:100%; padding:0 17px;font-family:Arial,Helvetica,sans-serif,Microsoft Yahei;} .instal-button a{ display:inline-block; width:128px; height:42px; line-height:37px; text-align:center; margin-top:17px; font-size:20px;} .instal-button a.extract:hover, .instal-button a.add:hover{ background:url(../images/installation/btn_selected_AddExtract.png) no-repeat; color:#fff;} .instal-button a.extract{ background:url(../images/installation/btn_normal_extract.png) no-repeat; color:#adaeb0;} .instal-button a.add{ float:right; background: url(../images/installation/btn_normal_add.png) no-repeat; color:#666;} .ins-but-text{ float:left; margin-top:22px;} .p8{ padding:8px 7px;} .ins-c-list{ display:block;} .ins-c-list li{ display:block; height:51px; line-height:51px; border-bottom:1px solid #d8d9db; background:url(../images/installation/group/icon_folder.png) no-repeat 13px center; padding-left:53px;} .ins-c-list li a{ font-size:20px; color:#666;} .ins-c-list li a.curr{color:#1f72cc;} /*地图*/ .ins-cont-map{ height:577px;} .instal-nav .tree >input.tree-inp{ display:block; margin:18px auto 15px auto; border:1px solid #91979e; height:40px; width:200px; padding:0 10px;background-color:transparent;color: #49505a; font-size:18px;} .instal-nav .tree >input:-moz-placeholder, .instal-nav .tree >input::-moz-placeholder{ /* Mozilla Firefox*/ color: #3494f59; opacity:1; font-family:Arial,Helvetica,sans-serif,Microsoft Yahei; } .instal-nav .tree >input:-ms-input-placeholder{ color: #494f59;opacity:1; font-family:Arial,Helvetica,sans-serif,Microsoft Yahei; } .instal-nav .tree >input::-webkit-input-placeholder{ color: #494f59;opacity:1; font-family:Microsoft Yahei,Arial,Helvetica,sans-serif; } .ins-cont-map a.bnt-l{ position:absolute;top:247px; right:478px; width:49px; height:154px; background: url(../images/installation/map/Control_popup_zhan_left.png) no-repeat;} .ins-cont-map a.bnt-l:hover{ background: url(../images/installation/map/Control_popup_zhan_sele_left.png) no-repeat;} .ins-cont-map a.bnt-r{ position:absolute;top:247px; right:0; width:49px; height:154px; background:url(../images/installation/map/Control_popup_normal_left.png) no-repeat;} .ins-cont-map a.bnt-r:hover{ background:url(../images/installation/map/Control_popup_selected_left.png) no-repeat;} .ins-cont-map .none-text{ text-align:center; color:#999; display:block; line-height:510px; height:510px; font-size:16px;} .box-s-b{ border-left:1px solid #d8d9db; box-shadow:0 0 5px rgba(0, 0, 0, 0.1);} .site-right{ position:absolute; z-index:999px; right:0; top:0; display:inline-block;} .instal-content-bottom1 span{ width:320px; margin:0 auto; margin-top:20px; display:block;} .instal-content-bottom1 a{ display:inline-block; text-align:center; float:left;} .overflow_has{ overflow-y:auto; overflow-x:hidden; height:210px;} .map-groupUnits{position:absolute;right:-480px;transition: all .3s;z-index: 998} .map-groupUnits-show{right:0;} .map-groupUnits a.bnt-r{ position:absolute;top:247px; left:-51px; width:49px; height:154px; background:url(../images/installation/map/Control_popup_normal_left.png) no-repeat;} .map-groupUnits a.bnt-r:hover{ background:url(../images/installation/map/Control_popup_selected_left.png) no-repeat;} .map-content{overflow:hidden;} .border-red .map-content-left{width: 100%} .mapUnitsDiv{position:absolute;width:132px;height:auto;left:0;} .mapUnitsDiv .instal_normal{float:none;} /*#imgBox{transition:scale .3s};*/ .img-content{overflow:hidden;position: relative;} #selectedUnitsDiv{ padding:10px 5px; } /** 修改 选中unit样式,不然两个设备之间没有空隙了*/ #selectedUnitsDiv .instal_normal{ margin:10px 4px; } /*plus-minus 17-8-15*/ .plus-minus{ display:block; padding:0; margin:10px;} .plus-minus .big,.plus-minus .small{ display:inline-block;width:32px; height:32px;text-align:center; line-height:32px; font-size:18px; font-weight:normal; color: #666; border: 1px solid #d8d9db; background-color: #f4f5f7; background-image: linear-gradient(top, #fff 0%, #fff 20%, #f4f5f7 60%, #ecedf0 100%); background-image: -webkit-linear-gradient(top, #fff 0%, #fff 20%, #f4f5f7 60%, #ecedf0 100%); background-image: -moz-linear-gradient(top, #fff 0%, #fff 20%, #f4f5f7 60%, #ecedf0 100%); background-image: -o-linear-gradient(top, #fff 0%, #fff 20%, #f4f5f7 60%, #ecedf0 100%); background-image: -ms-linear-gradient(top, #fff 0%, #fff 20%, #f4f5f7 60%, #ecedf0 100%); } .plus-minus .big:hover{ background-color: #448ae5; background-image: linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -webkit-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -moz-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -o-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -ms-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); color:#fff; border-color:#66afe9; -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6); box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6); } .plus-minus .small:hover{ background-color: #448ae5; background-image: linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -webkit-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -moz-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -o-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); background-image: -ms-linear-gradient(top, #448ae5 0%, #3275d6 60%, #1d63c5 100%); color:#fff; border-color:#66afe9; -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6); box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);} .plus-minus .scaleNum{ display: inline-block; width: 60px; text-align: center; } #imgBox .instal_normal{ /*position: absolute;*/ float: left } #saveGroupUnitsBtn{ width: 144px; background: url(../images/installation/btn_selected_Group_Edit.png) no-repeat; } #showImgDiv{ position: absolute; top: 0; left: 0; margin-left: 313px; margin-top: 150px; display: none; z-index: 9999; } .miniMapContent{ border: 1px solid #f44975; background: transparent; position: absolute; z-index: 10000; top: 0; /* box-shadow: 0 0 0 1000px rgba(0,0,0,0.4); */ } .miniMap{ background: rgba(255,255,255,0.4); /* border: 1px solid #eee; */ position: absolute; bottom: 0; left: 0; z-index: 10; /* overflow: hidden; */ } .miniUnit{ height: 5px; width: 5px; background: red; border-radius: 50%; border: 1px solid red; position: absolute; } .mimiMapContainer{ position: absolute; bottom: 0; z-index: 100; background-color: #f5f6fa; }