html {
font-size: 10px;
}
body {
padding: 0;
margin: 0;
cursor: default;
background-color: #020D32 !important;
width: 100%;
height: 1080px;
overflow: hidden;
}
.hidden {
display: none
}
.nodata {
color: #999;
line-height: 4rem;
font-size: 1.4rem;
width: 100%;
text-align: center;
}
.header {
/*background-image: url(../images/img_headline.png);*/
height: 10.8rem;
width: 100%;
float: left;
background-size: 100% 100%;
background-repeat: no-repeat;
position: relative;
}
.header_logo {
background-image: url(../images/logo.png);
height: 117px;
width: 570px;
float: left;
background-size: 100% 100%;
background-repeat: no-repeat;
position: relative;
background-position: -20px -14px;
z-index: 1;
}
.header_background {
background-color: #162449;
height: 62px;
width: 100%;
float: left;
border-bottom: 2px solid #202f5a;
position: absolute;
z-index: 0;
}
.header_background > div {
float: right;
width: 65%;
height: 22px;
line-height: 22px;
margin-top: 20px;
}
.app_default {
float: left;
color: #ffffff;
font-size: 16px;
cursor: pointer;
margin-right: 20px;
}
.app_default > a {
color: #ffffff !important;
cursor: pointer !important;
}
.app_active {
float: left;
font-size: 16px;
color: #2aaef2;
cursor: pointer;
margin-right: 20px;
}
.app_active > a {
color: #2aaef2 !important;
cursor: pointer !important;
}
.app_icon {
height: 14px;
width: 14px;
float: left;
background-size: 100% 100%;
background-repeat: no-repeat;
position: relative;
margin-top: 5px;
margin-right: 4px;
}
.screen_default_icon {
background-image: url(../images/icon_bigScreenNormal.png);
}
.screen_active_icon {
background-image: url(../images/icon_bigScreenSelected.png);
}
.search_default_icon {
background-image: url(../images/icon_searchNorma.png);
}
.search_active_icon {
background-image: url(../images/icon_searchSelected.png);
}
.elevator_default_icon {
background-image: url(../images/icon_elevatorNormal.png);
}
.elevator_active_icon {
background-image: url(../images/icon_elevatorSelected.png);
}
.data_default_icon {
background-image: url(../images/icon_dateNormal.png);
}
.data_active_icon {
background-image: url(../images/icon_dateSelected.png);
}
.deviceadmin_default_icon {
background-image: url(../images/icon_settingNormal.png);
}
.deviceadmin_active_icon {
background-image: url(../images/icon_settingSelected.png);
}
.header_bar {
width: 100%;
height: 1.4rem;
font-size: 1.4rem;
font-family: Microsoft YaHei;
font-weight: 400;
color: #D9EFFF;
line-height: 1.4rem;
position: absolute;
top: 5.8rem;
bottom: 3.6rem;
}
.header_bar > span {
cursor: pointer;
margin-left: 2rem;
margin-right: 2rem;
}
.header_bar > span > a {
border-bottom: 2px solid;
}
.control_active {
color: #2AAEF2;
}
.main_title {
width: 31rem;
height: 7rem;
font-size: 3.2rem;
font-weight: 600;
color: #FFFFFF;
line-height: 7rem;
text-shadow: 2px 2px 0px #02004d;
margin: 0 auto;
text-align: center;
}
.layout_dialog {
background: linear-gradient(39deg, #081531 0%, #17274b 100%);
overflow: hidden;
outline: 0;
border-radius: 2px;
position: fixed !important;
z-index: 10000;
color: #B9E3FF;
border: 1px solid #003670;
display: none;
left: 50%;
top: 50%;
}
.layout_caption {
float: left;
width: 100%;
height: 4.5rem;
border-radius: 0.5rem 0.5rem 0 0;
line-height: 4rem;
background: linear-gradient(109deg, #052c60 0%, #2e68b7 100%);
}
.layout_title {
float: left;
font-size: 2rem;
font-weight: 400;
color: #B9E3FF;
padding-left: 1.8rem;
opacity: 0.9;
}
.layout_content {
float: left;
width: 100%;
padding-top: 2rem;
}
.layout_close {
background-image: url(../images/btn_close.png);
width: 1.4rem;
height: 1.4rem;
float: right;
background-repeat: no-repeat;
margin: 1.8rem 1.5rem 0 0;
cursor: pointer;
}
.clearn {
background: #000000;
opacity: 0.5;
width: 100%;
height: 100%;
z-index: 102;
position: absolute;
left: 0;
top: 0;
line-height: 0;
font-size: 0;
overflow: hidden;
display: none;
}
.monitor_content {
float: left;
width: 100%;
}
.body_content {
float: left;
/*padding-left: 2rem;*/
/*padding-right: 2rem;*/
width: 100%;
}
.body_side {
margin-left: 1rem;
width: 22%;
height: 100%;
float: left;
}
.body_center {
width: 56%;
height: 100%;
float: left;
position: relative;
z-index: 100000;
margin-left: 2rem;
margin-right: 2rem;
}
.side_right {
width: 19%;
height: 100%;
float: right;
}
.container_data_show {
background-color: #1B2342;
}
.container_data_show > div {
float: left;
width: 100%;
}
.container_data_show .top > span {
float: left;
width: 33.3%;
font-size: 1.6rem;
color: #2AAEF2;
}
.container_data_show .top .caption {
text-align: center;
color: #fff;
font-size: 1.4rem;
font-weight: bold;
letter-spacing: 3px;
}
.floor_row_item {
float: left;
width: 100%;
border-bottom: 1px solid #3F4973;
height: 9rem;
line-height: 9rem
}
.floor_row_item > span {
float: left
}
.floor_row_item .floor_name {
font-size: 2rem;
color: #fff;
padding: 2rem;
cursor: pointer;
width: 4.8rem;
}
.floor_row_item .room_count {
width: 4rem;
height: 4rem;
background: #0164CF;
line-height: 4rem;
text-align: center;
color: #fff;
border-radius: 2rem;
font-weight: bold;
margin-top: 4.2rem;
font-size: 1.4rem;
}
.floor_row_item .room_list {
margin-top: 2rem;
line-height: 3.5rem;
width: 68%;
overflow-x: hidden;
margin-left: 1rem;
margin-right: 1rem;
}
.floor_row_item .penson_icon {
color: #60befe;
margin-top: 5rem;
font-size: 1.4rem;
line-height: 3rem;
cursor: pointer;
position: relative;
}
.room_item {
height: 7rem;
width: 5rem;
display: block;
float: left;
/*color: #000;*/
font-weight: bold;
font-size: 1.4rem;
margin: 0 1rem;
text-align: center;
cursor: pointer;
}
.room_free {
background-image: url('/static/images/img_doorEmpty.png');
background-repeat: no-repeat;
background-size: contain;
}
.room_free_back {
float: left;
width: 7rem;
margin-left: 7px;
height: 10px;
margin-top: 1px;
}
.room_busy {
background-image: url('/static/images/img_doorNomal.png');
background-repeat: no-repeat;
background-size: contain;
color: #1e98f9;
}
.room_important {
background-image: url('/static/images/img_doorWarning.png');
background-repeat: no-repeat;
background-size: contain;
color: #fff !important;
color: red;
}
.room_more_none {
width: 1.5rem;
height: 3rem;
line-height: 3rem;
margin-top: 5rem;
margin-left: 1.5rem;
}
.room_more_left {
width: 1.5rem;
height: 3rem;
line-height: 3rem;
margin-top: 5rem;
margin-left: 1.5rem;
background-image: url('/static/images/img_nextPage.png');
cursor: pointer;
}
.room_more_right {
width: 1.5rem;
height: 3rem;
line-height: 3rem;
margin-top: 5rem;
background-image: url('/static/images/img_nextPage.png');
transform: rotate(180deg);
-ms-transform: rotate(180deg); /* IE 9 */
-moz-transform: rotate(180deg); /* Firefox */
-webkit-transform: rotate(180deg); /* Safari 和 Chrome */
-o-transform: rotate(180deg); /* Opera */
cursor: pointer;
}
.floor_room_row_item {
margin-top: 3rem;
margin-left: 2rem;
margin-right: 2rem;
float: left;
padding-top: 1rem;
}
.floor_room_row_item.room_active {
background-image: url('/static/images/img_doorSelected.png');
background-repeat: no-repeat;
background-size: contain;
}
.dianti_run_bg1_div {
position: absolute;
background-color: #193258;
left: 10%;
bottom: 0;
height: 94%;
width: 80%;
}
.dianti_run_bg2_div {
position: absolute;
background-color: #3b4a67;
left: 10%;
bottom: 0;
height: 91%;
width: 80%;
}
.dianti_run_bg3_div {
position: absolute;
background-color: #3b4a67;
left: 10%;
top: 1rem;
height: 3rem;
width: 10%;
}
.liftimg {
position: absolute;
width: 3.6rem;
height: 5.4rem;
z-index: 1000;
bottom: 0;
background-color: #88aadf;
display: block;
}
.liftimg > span {
display: block;
text-align: center;
font-weight: bold;
border-radius: 5px 5px 0 0;
}
.floor_num{
width: 100%;
height: 30%;
background-color: #99df1c;
border-radius: 5px 5px 0 0;
}
.lift_door_left{
position: absolute;
z-index: -1;
display: block;
width: 45%;
top: 20%;
height: 80%;
left: 5%;
}
.lift_door_right{
position: absolute;
z-index: -1;
display: block;
width: 45%;
top: 20%;
height: 80%;
right: 6%;
}
.lift_door_right>img,.lift_door_left>img{
width: 100%;
height: 100%;
}
.title_image {
background-image: url(../images/img_titleBg.png);
background-repeat: no-repeat;
background-size: 100% 100%;
width: 31.6rem;
height: 3.2rem;
margin: 0 auto;
margin-bottom: 1.5rem;
font-size: 1.8rem;
text-align: center;
color: #D9EFFF;
line-height: 3.2rem;
font-weight: bold;
}
.lift_timer {
position: absolute;
left: 4rem;
width: 19rem;
height: 2rem;
line-height: 2rem;
color: #ccc;
text-align: center;
top: 0.5rem;
border: 1px solid #193258;
border-radius: 1rem;
background: #182040;
}
.content_box {
width: 100%;
height: auto;
background-color: #08183A;
background-image: linear-gradient(rgba(8, 24, 58, 1), rgba(8, 24, 58, 1));
box-shadow: 5px 5px 5px 5px rgb(8 24 58 /20%);
margin-bottom: 2rem;
position: relative;
/*opacity: 0.6;*/
}
.corner {
width: 1rem;
height: 1rem;
position: absolute;
opacity: 0.6;
}
.corner_top_left {
border-style: solid none none solid;
border-width: 1px 0 0 1px;
border-color: #7DAAFF transparent transparent #7DAAFF;
top: 0;
left: 0;
}
.corner_top_right {
border-style: solid solid none none;
border-width: 1px 1px 0 0;
border-color: #7DAAFF #7DAAFF transparent transparent;
top: 0;
right: 0;
}
.corner_bottom_left {
border-style: none none solid solid;
border-width: 0 0 1px 1px;
border-color: transparent transparent #7DAAFF #7DAAFF;
bottom: 0;
left: 0;
}
.corner_bottom_right {
border-style: none solid solid none;
border-width: 0 1px 1px 0;
border-color: transparent #7DAAFF #7DAAFF transparent;
bottom: 0;
right: 0;
}
.device_row {
float: left;
width: 100%;
height: 4rem;
margin-bottom: 2rem;
padding: 1px 0px;
color: #ffffff;
font-size: 1.6rem;
font-family: Microsoft YaHei;
}
.device_icon {
float: left;
background-repeat: no-repeat;
width: 5.2rem;
height: 4rem;
background-size: 100% 100%;
margin-right: 1rem;
}
.scout {
background-image: url(../images/img_code.png);
}
.scout_progress {
float: left;
width: 82%;
height: 1.8rem;
background: linear-gradient(38deg, #02143e 0%, #0073e8 100%);
-webkit-text-fill-color: transparent;
border-radius: 10px;
margin-top: 0.5rem;
}
.camera {
background-image: url(../images/img_camera.png);
}
.camera_location {
background-image: url(../images/img_cameraLocation.png);
}
.camera_progress {
float: left;
width: 82%;
height: 1.8rem;
background: linear-gradient(38deg, #14182e 0%, #fd890c 100%);
-webkit-text-fill-color: transparent;
border-radius: 10px;
margin-top: 0.5rem;
}
.door {
background-image: url(../images/img_rke.png);
}
.door_progress {
float: left;
width: 82%;
height: 1.8rem;
background: linear-gradient(38deg, #0a1e3b 0%, #4ee899 100%);
-webkit-text-fill-color: transparent;
border-radius: 10px;
margin-top: 0.5rem;
}
.offline_box {
float: left;
width: 40%;
}
.offline_warning {
float: left;
width: 24px;
height: 22px;
background-image: url(../images/img_offlineWarning.png);
}
.offline_warning_text {
width: 5.8rem !important;
font-size: 1.4rem;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FF7237;
line-height: 2.2rem;
padding-left: 0.5rem;
}
.nick_name {
width: 9.9rem;
height: 3rem;
border: 1px solid #62A2CD;
background: linear-gradient(0deg, #010514 0%, #061739 98%);
}
.total_box {
width: 85%;
margin: 0 auto;
background-color: rebeccapurple;
}
.total_field {
float: left;
width: 100%;
height: 2rem;
line-height: 2rem;
}
.total_value_row {
float: left;
width: 100%;
height: 7rem;
line-height: 7rem;
}
.total_value {
font-size: 2.5rem !important;
font-family: "Arial";
color: #FFFFFF;
float: left;
}
.total_number_value {
float: left;
width: 40%;
}
.total_dynamic_val {
float: left;
width: 60%;
font-size: 14px;
}
.total_row {
float: left;
color: #2AAEF2;
width: 50%;
height: 2rem;
line-height: 2rem;
font-size: 1.6rem;
}
.circle_flag {
float: left;
width: 0.8rem;
height: 0.8rem;
margin: 0.5rem 0.5rem 0 0;
border-radius: 100%;
background-color: #2AAEF2;
}
.place_area {
width: 36rem;
margin-left: 2rem;
margin-right: 2rem;
}
.place_field_title {
float: left;
background-color: rgba(65, 160, 235, 0.15);
height: 5rem;
line-height: 5rem;
color: #2AAEF2;
width: 100%;
}
.place_field_title > span {
float: left;
width: 15%;
text-align: center;
}
.place_value {
float: left;
height: 5.5rem;
line-height: 5.5rem;
color: #CFCFCF;
width: 100%;
}
.place_value > span {
float: left;
width: 15%;
text-align: center;
}
.place_index {
color: #FFC300;
font-family: Arial;
font-style: italic;
}
.nick_name_box {
background-image: url(../images/img_photoBorder.png);
height: 10.2rem;
width: 9rem;
float: left;
background-size: 9rem 10rem;
background-repeat: no-repeat;
position: relative;
margin-top: 1rem;
margin-bottom: 2rem;
cursor: pointer;
padding: 2px 2px 0 2px;
margin-right: 1.7rem;
}
.nick_name_box > img {
width: 100%;
height: 9.8rem;
}
.nick_name_box > div {
background-image: url(../images/img_photoNameBg.png);
height: 2rem;
width: 6.9rem;
background-size: 100% 100%;
background-repeat: no-repeat;
line-height: 2rem;
margin: -1rem auto 0 auto;
text-align: center;
color: #fff;
font-weight: 400;
position: relative;
font-size: 1.2rem;
}
.nick_name_titel {
color: #fff;
width: 2.6rem;
height: 2.6rem;
border-radius: 100px;
background-color: #f10303;
font-size: 14px;
line-height: 2.6rem;
position: absolute;
top: -10px;
right: -9px;
text-align: center;
}
.nick_name_box_small {
background-image: url(../images/img_photoBorder.png);
height: 16.2rem;
width: 15rem;
float: left;
background-size: 100% 100%;
background-repeat: no-repeat;
position: relative;
margin-bottom: 3rem;
cursor: pointer;
padding: 2px 2px 0 2px;
margin-right: 1rem;
}
.nick_name_box_small > img {
width: 100%;
height: 16rem;
}
.nick_name_box_small > div {
background-image: url(../images/img_photoNameBg.png);
height: 3rem;
width: 9.9rem;
background-size: 100% 100%;
background-repeat: no-repeat;
line-height: 3rem;
margin: -1.4rem auto 0 auto;
text-align: center;
color: #fff;
font-weight: 400;
position: relative;
}
.nick_name_reminder {
background-image: url(../images/img_reminder.png);
height: 2.4rem;
width: 2.4rem;
background-size: 100% 100%;
background-repeat: no-repeat;
line-height: 2.4rem;
text-align: center;
color: #fff;
position: absolute;
right: -0.8rem;
top: -0.8rem;
cursor: pointer;
font-size: 1.2rem;
}
.flag_value {
float: right;
width: 50%;
height: 1.8rem;
line-height: 1.8rem;
margin-top: 2.2rem;
}
.up_icon {
background-image: url(../images/img_increase.png);
width: 0.9rem;
height: 1.3rem;
background-size: 100% 100%;
background-repeat: no-repeat;
float: left;
margin: 2.4rem 0 0 0.5rem;
}
.up_text {
float: left;
color: #f04538 !important;
margin-left: 5px;
}
.down_icon {
background-image: url(../images/img_reduce.png);
width: 0.9rem;
height: 1.3rem;
background-size: 100% 100%;
background-repeat: no-repeat;
float: left;
margin: 0.2rem 0.5rem 0 1rem;
}
.down_text {
float: left;
color: green;
}
.search_box {
float: left;
width: 38rem;
height: 4.4rem;
background: rgba(33, 42, 72, 0.65);
border: 1px solid rgba(153, 204, 255, 0.25);
border-radius: 2px;
}
.search_key {
float: left;
width: 3rem;
height: 3.2rem;
font-size: 1.4rem;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
line-height: 1.6rem;
margin: 0.5rem 0.5rem 0 1rem;
border-right: 1px solid #fff;
padding-right: 1rem;
}
.search_input {
float: left;
width: 30rem;
height: 3.2rem;
resize: none;
outline: none;
border: none;
font-size: 1.4rem;
line-height: 3.2rem;
margin-top: 0.5rem;
padding: 0 1rem;
background-color: transparent;
color: #ffffff;
letter-spacing: 1px;
}
.search_botton {
background-image: url(../images/btn_search.png);
width: 6rem;
height: 4.6rem;
background-size: 100% 100%;
background-repeat: no-repeat;
float: right;
cursor: pointer;
}
#search_result ul {
padding: 1rem !important
}
#search_result li {
line-height: 2rem;
font-size: 1.2rem;
color: #999999;
}
#search_result ul:hover {
background-color: #ededed;
}
.person_info_title {
float: left;
width: 100%;
height: 5rem;
line-height: 5rem;
background-color: rgb(29, 38, 71);
text-align: center;
color: #fff;
font-weight: bold;
letter-spacing: 1px;
font-size: 1.6rem;
}
#fulltext_search_datatype .datatypeitem {
cursor: pointer;
color: #b5b3b3;
margin-right: 2rem;
height: 3rem;
display: inline-block;
line-height: 4rem;
padding: 0.5rem;
font-size: 1.4rem;
}
#fulltext_search_datatype .datatypeitem.active {
color: #fff;
border-bottom: 2px solid #2aaef2;
background-color: transparent !important;
font-weight: bold;
font-size: 1.6rem;
}
#fulltext_search_condition {
font-size: 1.6rem;
margin-top: 1rem;
color: #ccc;
margin-left: 27.5rem;
position: relative;
}
#fulltext_search_condition .datelist {
position: absolute;
left: 0;
top: 3rem;
background-color: #1b2342;
border: 1px solid #999;
border-radius: 3px;
padding: 0.5rem;
}
#fulltext_search_condition .datelist > div {
cursor: pointer;
line-height: 3rem;
}
#fulltext_search_condition .datelist > div:hover {
background-color: #535c91
}
.person_left {
margin-left: 3.5rem;
float: left;
width: 35%;
height: 100%;
}
.person_right {
float: right;
margin-right: 3.5rem;
width: 55%;
height: 100%;
}
.person_title {
float: left;
width: 100%;
height: 4rem;
margin-bottom: 1.5rem;
}
.person_title_text {
width: 100%;
height: 100%;
font-size: 1.4rem;
font-family: Microsoft YaHei;
font-weight: bold;
color: #D9EFFF;
line-height: 4rem;
float: left;
}
.person_line {
background-image: url(../images/img_tltleLine.png);
width: 100%;
height: 2px;
background-size: 100% 100%;
background-repeat: no-repeat;
float: left;
}
.person_img_box {
float: left;
width: 12.5rem;
height: 13rem;
}
.person_img_box > img {
width: 100%;
height: 100%;
cursor: pointer;
}
.person_field {
float: right;
width: 75%;
height: 3rem;
line-height: 3rem;
margin-bottom: 1rem;
}
.person_field > span {
float: left;
width: 30%;
height: 100%;
font-size: 1.4rem;
color: #aba8a8;
margin-right: 1rem;
}
.person_field > input {
float: left;
width: 25%;
height: 100%;
font-size: 1.6rem;
font-weight: 500;
border: 1px solid #3F4973;
outline: none;
background-color: transparent;
margin-right: 1rem;
color: #ffffff;
padding: 0 0.8rem;
}
.person_field2 {
float: left;
width: 100%;
height: 100%;
font-size: 1.6rem;
font-weight: 500;
border: 1px solid #3F4973;
outline: none;
background-color: transparent;
color: #ffffff;
padding: 0 0.8rem;
}
.combox_icon {
float: left;
margin: 0.5rem 0 0 -3rem;
color: #fff;
font-size: 20px !important;
cursor: pointer;
}
.confirm {
background-color: #2AAEF2;
}
.cancel {
background-color: #3F4973;
}
.active {
background-color: #898ed7 !important;
color: #fff;
}
.trajectory_box {
width: 95%;
float: left;
color: #ffffff;
border-left: 2px dashed #ffffff;
font-size: 16px;
}
.trajectory_icon {
position: absolute;
width: 12px;
height: 12px;
border-radius: 100px;
background-color: #f47920;
left: -6px;
top: 9px;
}
.trajectory_box > span {
float: left;
width: 90%;
height: 32px;
line-height: 32px;
padding-left: 15px;
position: relative;
}
.trajectory_img_box {
float: left;
width: 90%;
padding: 10px 0px 0px 15px;
position: relative;
}
.trajectory_img_box > img {
float: left;
width: 95px;
height: 100px;
margin: 0 10px 10px 0;
border: 1px solid #6e6a6a;
}
.person_card {
float: left;
width: 8.5rem;
height: 11rem;
margin: 1rem;
border: 1px solid #3f4973;
border-radius: 3px;
padding: 1rem;
}
.person_card > img {
width: 8.5rem;
height: 11rem;
}
.person_name {
background-image: url(/static/images/img_photoNameBg.png);
height: 1.8rem;
background-size: 100% 100%;
background-repeat: no-repeat;
line-height: 1.8rem;
text-align: center;
color: #fff;
font-weight: 400;
position: relative;
display: block;
width: 100%;
margin-top: 0.2rem;
}
.return_prev {
height: 25px;
line-height: 25px;
cursor: pointer;
font-size: 12px;
position: absolute;
left: 10px;
top: 5px;
}
.return_prev > i {
float: left;
}
.return_prev > span {
font-size: 14px;
float: left;
line-height: 25px;
padding-left: 2px;
}
.system_log_name {
float: left;
font-size: 2.5rem;
background: linear-gradient(180deg, #fff 0%, #a285e1 100%);
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin: 1rem 0 0 3rem;
height: 40px;
line-height: 4rem;
font-family: "微软雅黑" !important;
}