body{ background-image: url(../img/bgs2.png) no-repeat; background-size: 100%; } .index_center{ width: 100%; background-color: #FFFFFF; } .index_main .index_title{ margin-bottom: 30px; } .index_main .index_title .index_title_blue{ width: 5px; height: 16px; background-color: #0080FF; float: left; } .index_main .index_title .index_title_p{ width: 80%; margin-left: 21px; float: left; margin-top: -2px; } .index_main{ width: 92%; margin: 0 auto; padding: 10px 0; } .index_main .index_main_center{ width: 100%; height: 76px; margin: 10px 0; } .index_main .index_main_center .index_main_center_right{ width: 49%; height: 76px; float: right; background-color: #d1d1d1; border-radius:10px 10px 10px 10px; } .index_main .index_main_center .index_main_center_left{ width: 49%; float: left; height: 76px; background-color: #d1d1d1; border-radius:10px 10px 10px 10px; } .index_main_text{ height: 100%; float: left; font-size: 16px; line-height: 76px; } .index_main_img{ float: left; margin: 13px 18px 0 18px; /*width: 30%; height: 70%;*/ width: 50px; height: 50px; } .index_main_text1{ /*字多的功能*/ font-size: 16px; margin-top: 16px; } .zwkf{ /*开放的功能背景是白的*/ background-color: #FFFFFF !important; border: 1px solid #e1e1e1; box-shadow:0px 5px 5px 0px #e1e1e1; } .wangns-ul{ width: 92%; margin: 0 auto !important; background-color: transparent; } .wangns-list{ margin-top: 10px; background-color: #FFFFFF; box-shadow:0px 5px 5px 0px #d6d8d8; border-radius:10px 10px 10px 10px; } .wangns-list-title{ display: block; margin-top: 14px; margin-bottom: 10px; } .wangns-list-title2{ display: block; margin-top: 10px; } /*setting*/ .wangs-setting-img{ width: 20px; height: 20px; margin-left: 10px; margin-right: 10px; float: left; } /*点扩散*/ .circle{ width: 140px; height: 140px; border-radius: 50%; border: 6px #0080FF solid; margin:0 auto; } .circle_p, .circle_span{ position: absolute; width: 130px; height: 130px; border-radius:50%; box-shadow: 0px 0px 35px #0080FF; margin: 0px; } .circle_dh{ animation: heartbeat 3s infinite; } .circle_span_dh{ animation: heartbeat 3s infinite; animation-delay: 1.5s; } @keyframes heartbeat{ 0%{transform: rotate(45deg) scale(1); opacity: 0.9;} 25%{transform: rotate(45deg) scale(1.5); opacity: 0.6;} 100%{transform: rotate(45deg) scale(1); opacity: 0.9;} } /*未完成、已完成、有隐患 */ .yuan{ width: 100px; height: 100px; border-radius: 50%; border: 5px #DDDDDD solid; margin:0 auto; margin-top: 14px; } .yuan span{ display: block; margin-top: 36px; } .wangns-red{ border: 5px red solid; box-shadow: 0px 0px 20px red; } .wangns-yellow{ border: 5px #F0AD4E solid; box-shadow: 0px 0px 20px #F0AD4E; } .wangns-green{ border: 5px green solid; box-shadow: 0px 0px 20px green; } .check_main{ width: 90%; margin: 0 auto; margin-top:10px; margin-bottom: 20px; border: 1px solid #e1e1e1; border-radius:10px 10px 10px 10px; box-shadow:0px 5px 5px 0px #e1e1e1; background-color: #FFFFFF; padding: 10px; } .wangns_check_li{ background-color: transparent; } .wangns_check_li:after{ background-color: transparent; } /*物联监测=======================================================================*/ .data_mod{ width: calc(100% - 40px); margin-bottom: 40px; box-sizing: border-box; border: 1px solid #2C58A6; position: relative; box-shadow: 0 0 10px #2C58A6; margin-left: 20px; margin-top:50px; height:280px; } .data_mod .main_title{ width: 180px; height: 35px; line-height: 33px; background-color: #142335; border: 1px solid #2C58A6; box-shadow: 0px 0px 6px #2C58A6; border-radius: .5em .5em .5em .5em; position: absolute; top: -17px; left: calc(50% - 90px); text-align:center; color:#fff; font-size: 18px; font-weight: 600; box-sizing: border-box; } .data_mod .main_title img{ position: absolute; top: 8px; left: 20px; } .data_mod .main_content { width:100%;height: 260px; position:absolute; z-index:1; margin-top:20px; } .l_t_line{ width: 2px; height: 24px; left: -3px; top: -3px; } .t_l_line{ height: 2px; width: 26px; left: -3px; top: -3px; } .t_line_box { position: absolute; width: 100%; height: 100%; } .t_line_box i{ background-color: #4788fb; box-shadow: 0px 0px 10px #4788fb; position: absolute; } .t_r_line{ height: 2px; width: 26px; right: -3px; top: -3px; } .r_t_line{ width: 2px; height: 24px; right: -3px; top: -3px; } .l_b_line{ width: 2px; height: 24px; left: -3px; bottom: -3px; } .b_l_line{ height: 2px; width: 26px; left: -3px; bottom: -3px; } .r_b_line{ width: 2px; height: 24px; right: -3px; bottom: -3px; } .b_r_line{ height: 2px; width: 26px; right: -3px; bottom: -3px; } .detailsHp{ background-color: #142335; } /*检查痕迹*/ .wangns-markUl{ width: 100%; } .wangns-markDiv{ width: 100%; margin-top: 10px; } .wangns-mark{ width: 33%; height: 150px; float: left; } .markSpan{ width: 100%; float: left; border: 1px solid #e1e1e1; background-color: #777777; color: #FFFFFF; } .wangns-mark-green{ width: 80%; height: 100px; margin: 10px auto; background-image: url(../img/icon/mark_green.png); background-size: 100%; } .wangns-mark-yellow{ width: 80%; height: 100px; margin: 10px auto; background-image: url(../img/icon/mark_yellow.png); background-size: 100%; } .wangns-mark-red{ width: 80%; height: 100px; margin: 10px auto; background-image: url(../img/icon/mark_red.png); background-size: 100%; } .wangns-mark-center{ padding-top:20px; color:#ffffff; font-size:12px; margin:0 auto; width:70%; }