@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;
}
