body, html {
    overflow: hidden;
    margin: 0;
    font-size: 12px;
}

#mapContainer {
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0;
    position: absolute;
}

.float-panel {
    color: #ffffff;
    opacity: 0.88;
    border-radius: .5rem;
    background-color: #093b5d;
    -webkit-transition: all .25s ease-in;
    -moz-transition: all .25s ease-in;
    -o-transition: all .25s ease-in;
    position: absolute;
    width: 26rem;
    z-index: 2;
}

.float-panel .float-panel-title {
    height: 2.3rem;
    line-height: 2.3rem;
    padding-left: 1.5rem;
    color: #ffffff;
    font-size: 1rem;
    font-weight: bold;
    position: relative;
}

.float-panel .float-panel-title .pull-right .fa-circle-o-notch {
    margin-right: .5rem;
}

.float-panel .float-panel-content {
    width: 100%;
    overflow-y: auto;
}

.float-panel .float-panel-content .chart-content-div {
    width: 100%;
    height: 100%;
}

.float-panel .float-panel-content .row {
    margin: 0;
}

.float-panel.left {
    left: .5rem;
}

.float-panel.right {
    right: .5rem;
}

.float-panel.up {
    top: .5rem;
}

.float-panel.bottom {
    bottom: .5rem;
}

/* 滚动条美化 */
::-webkit-scrollbar {
    width: .5rem;
    height: .5rem;
}

::-webkit-scrollbar-button {
    height: 0;
    width: 0;
}

::-webkit-scrollbar-thumb {
    background: #FF9800;
}

::-webkit-scrollbar-track {
    background-color: #217da6;
}

/* 展开右边面板和右边面板的按钮容器 */
#expand-panel-right {
    cursor: pointer;
    font-size: 1.38rem;
    color: white;
    position: absolute;
    right: 1.5rem;
    top: 0.5rem;
}

#expand-panel-left {
    cursor: pointer;
    font-size: 1.38rem;
    color: white;
    position: absolute;
    left: 0.5rem;
    top: 0.5rem;
}

.float-panel-title .fa-arrow-circle-left {
    cursor: pointer;
    font-size: 1.38rem;
}

/* 修改默认的提示窗口样式 */
.mouse-tip-blue {
    font-style: normal;
    text-decoration: none;
    font-weight: normal;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 300001;
    padding: 1rem;
    color: #fff;
    border-radius: .3rem;
    background-color: rgba(18, 77, 119, 0.82);
    border: .1rem solid #607D8B;
    font-size: 1rem;
    box-shadow: 0 0 3rem #0aa8ef;
    max-width: 400px;
}

.mouse-tip-blue > p {
    font-size: 1.1rem;
    line-height: 1.5rem;
}

.mouse-tip-blue > p.title {
    font-size: 1.58rem;
    color: #00BCD4;
    font-weight: bold;
    padding-bottom: 0.5rem;
}

.tip-windows-container-blue {
    position: absolute;
    left: 0;
    bottom: 0;
    height: auto;
    overflow: hidden;
    display: none;
    z-index: 10000;
    cursor: default;
    border-radius: 0.2rem;
    padding: 0 0 0.4rem 0;
    background-color: #0a293d;
    box-shadow: 0 0.2rem 2rem #eeeeee;
}

.tip-window-content-blue {
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    overflow: hidden;
    text-align: left;
    line-height: 1.8rem;
    padding: 1rem;
    font-size: 1.2rem;
    white-space: nowrap;
    color: #ffffff;
}

.tip-windows-cusp-css3-blue {
    position: absolute;
    width: 0;
    height: 0;
    border: 0.8rem solid transparent;
    z-index: 10001;
    border-top-color: #08304a;
}

.tip-windows-cusp-css3-blue:after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border: 0.67rem solid transparent;
    left: -0.67rem;
    bottom: -0.5rem;
    border-top-color: #0a293d;
}

.tip-window-content-blue > p {
    margin: 0 0 .2rem 0;
    font-weight: normal;
    padding: 0;
    white-space: normal;
}

.tip-window-content-blue > p.orange {
    color: orange;
}

.tip-window-content-blue > p.link {
    text-decoration: underline;
    cursor: pointer;
    color: #00BCD4;
}

.tip-window-content-blue > p.link:hover {
    color: orange;
}

.tip-window-content-blue > p.title {
    font-size: 1.58rem;
    color: #00BCD4;
    font-weight: bold;
    padding-bottom: 0.5rem;
}

.tip-window-content-blue > p kbd.label {
    background-color: #00BCD4;
    margin-left: .5rem;
    font-weight: normal;
    font-size: 1rem;
}

.tip-window-content-blue > p kbd.label:first-child {
    margin-left: 0;
}

.tip-window-content-blue > p.labels kbd {
    background-color: orange;
    font-size: 1rem;
    margin-left: .5rem;
}

.tip-window-content-blue > p.labels kbd:first-child {
    margin-left: 0;
}

.tip-window-content-blue > p.labels kbd.grey {
    background-color: grey;
}

.tip-window-content-blue > p.labels kbd.blue {
    background-color: #0a8fa0;
}

.tip-buttons {
    position: absolute;
    bottom: 0;
    width: 100%;
    line-height: 35px;
    text-align: right;
    padding-right: 1rem;
    padding-bottom: 1rem;
    left: 0;
    border-top: .1rem solid #135f92;
    padding-top: 1rem;
}

.tip-buttons .button {
    padding: .35rem .8rem;
    background-color: #ff9800;
    color: #fff;
    cursor: pointer;
    border-radius: .2rem;
    text-decoration: none;
    margin-left: .5rem;
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
}

.tip-buttons .button.disabled {
    background-color: gray;
    cursor: default;
}

#video-player {
    position: absolute;
    left: 0;
    top: 0;
    display: none;
    width: 380px;
    height: 696px;
    overflow: hidden;
    z-index: 10000;
    cursor: default;
    border-radius: 2px;
    padding: 10px;
    background-color: #0a293d;
    box-shadow: 0 2px 20px #eeeeee;
}

#video-player .title {
    font-size: 1.5rem;
    color: #00BCD4;
    font-weight: bold;
    padding-bottom: 0.5rem;
    height: 3rem;
}

kbd.orange {
    background-color: orange;
}

kbd.grey {
    background-color: grey;
}

kbd.blue {
    font-size: 1rem;
    background-color: #0a8fa0;
}

kbd.green {
    background-color: green;
}


/*
 今日警情
 height: 2.3rem + 7.5rem + 2.7rem
*/
#case-total {
    height: 12.5rem;
}

#case-total .float-panel-content {
    overflow-y: hidden;
}

#case-total .float-panel-content .total {
    text-align: center;
    color: #00BCD4;
    font-size: 6.8rem;
    line-height: 7.5rem;
}

#case-total .float-panel-content > .before {
    padding: 0 1rem;
    font-size: 1.1rem;
    line-height: 2.7rem;
}

#case-total .float-panel-content > .before > div {
    padding: 0;
    font-weight: bold;
}

#case-total .float-panel-content > .before .yesterday {
    color: #1ea1ff;
}

#case-total .float-panel-content > .before .yesterday kbd {
    background-color: #1ea1ff;
}

#case-total .float-panel-content > .before .before-yesterday {
    text-align: right;
    color: #FFC107;
}

#case-total .float-panel-content > .before .before-yesterday kbd {
    background-color: #FFC107;
}

#case-total .float-panel-title .pull-right {
    padding-right: 1rem;
}
/*
  警情分类统计柱状图
  top: 12.5rem + 0.5rem + 0.5rem
  height: 30rem
 */
#case-type-total {
    top: 13.5rem;
    bottom: 19rem;
}
#case-type-total .float-panel-content {
    height: calc(100% - 2.3rem);
    width: 100%;
    overflow: hidden;
}
/*
  警情列表
  top: 13.5rem + 30rem + 0.5rem
 */
#case-list-real-time {
    bottom: .5rem;
    height: 18rem;
}

#case-list-real-time .float-panel-content {
    padding: 0 .5rem 0 1.18rem;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
    height: calc(100% - 2.3rem);
}

#case-list-real-time .float-panel-content .case-item {
    border-radius: .3rem;
    padding: .5rem .8rem;
    background-color: rgb(8, 68, 108);
    cursor: pointer;
    margin-bottom: .3rem;
    border: .1rem solid #1a5e8c;
    font-size: 1rem;
}

#case-list-real-time .float-panel-content .case-item:hover {
    background-color: rgba(14, 83, 130, 0.99);
}

#case-list-real-time .float-panel-content .case-item .case-head {
    border-bottom: .1rem solid #eee;
    margin-bottom: .3rem;
    padding-bottom: .2rem;
    font-size: 1rem;
}

#case-list-real-time .float-panel-content .case-item .case-content {
    position: relative;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type {
    position: absolute;
    border-radius: .3rem;
    padding: 0 .4rem;
    font-size: 1rem;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq1 {
    background-color: #ff1a0c;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq2 {
    background-color: #ff940b;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq3 {
    background-color: #FFC107;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq4 {
    background-color: #03A9F4;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq5 {
    background-color: #30e1ff;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq6 {
    background-color: #8BC34A;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq7 {
    background-color: #0aff28;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq8 {
    background-color: #0aff28;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq9 {
    background-color: #8a6d3b;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq10 {
    background-color: #8a6d3b;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq11 {
    background-color: #8a6d3b;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq12 {
    background-color: #8a6d3b;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq13 {
    background-color: #8a6d3b;
}

#case-list-real-time .float-panel-content .case-item .case-content .label-type.jq19 {
    background-color: #ff421e;
}

#case-list-real-time .float-panel-content .case-item .case-content kbd {
    background-color: #4CAF50;
    padding: .1rem .35rem;
    font-size: 1rem;
}

#case-list-real-time .float-panel-content .case-item .case-content > p {
    margin: 0;
}

#case-list-real-time .float-panel-content .case-item .case-content .content {
    margin-bottom: .2rem;
    text-indent: 3rem;
    line-height: 1.68rem;
}

#case-list-real-time .float-panel-title .search-alarm {
    position: absolute;
    right: 2rem;
    top: .01rem;
}

#case-list-real-time .float-panel-title .search-alarm input {
    height: 1.3rem;
    width: 8rem;
    background-color: #0c2b40;
    border: 0;
    border-radius: 5rem;
    padding-left: 1.6rem;
    outline: none;
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
}

#case-list-real-time .float-panel-title .search-alarm .fa {
    position: absolute;
    top: .6rem;
    left: .4rem;
}

#case-list-real-time .float-panel-title .alarm-type-choose {
    margin-left: .6rem;
    color: #00bcd4;
}

#case-list-real-time .float-panel-title .alarm-type-choose:hover {
    color: orange;
}

#case-list-real-time .alarm-type-select {
    display: none;
    z-index: 18;
    position: absolute;
    max-width: 18rem;
    background-color: rgba(8, 57, 90, 0.95);
    border-radius: .2rem;
    padding: .3rem .5rem 1rem .8rem;
    border: .1rem solid rgba(0, 188, 212, 0.88);
}

#case-list-real-time .alarm-type-select .btns {
    text-align: right;
    width: 100%;
    border-top: .1rem solid #00BCD4;
    clear: both;
    padding-top: .8rem;
}

#case-list-real-time .alarm-type-select .btns .button {
    padding: .35rem .8rem;
    background-color: #ff9800;
    color: #fff;
    border-radius: .2rem;
    text-decoration: none;
    margin-left: .5rem;
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
}

#case-list-real-time .alarm-type-select .btns .button:hover {
    background-color: #fff;
    color: #ff9800;
}

#case-list-real-time .alarm-type-select .btns .button.red {
    background-color: #ff230f;
}

#case-list-real-time .alarm-type-select .btns .button.red:hover {
    background-color: #fff;
    color: #ff230f;
}

#case-list-real-time .alarm-type-select .btns .button.green {
    background-color: #28dd1f;
}

#case-list-real-time .alarm-type-select .btns .button.green:hover {
    background-color: #fff;
    color: #28dd1f;
}

#case-list-real-time .alarm-type-select .btns .button.open-alarm-layer {
    display: none;
}

#case-list-real-time .alarm-type-select > ul {
    overflow: hidden;
    float: left;
    padding: 0;
    margin: 0;
    border-top: .1rem solid rgba(238, 238, 238, 0.55);
    width: 100%;
    margin-bottom: .5rem;
    clear: both;
}

#case-list-real-time .alarm-type-select > ul:first-child {
    border-top: 0;
}

#case-list-real-time .alarm-type-select > ul li {
    padding: .2rem .5rem;
    border-radius: .2rem;
    background-color: #114c75;
    float: left;
    list-style: none;
    color: #eee;
    margin-right: .5rem;
    margin-top: .5rem;
    cursor: pointer;
    position: relative;
}

#case-list-real-time .alarm-type-select > ul li.active {
    background-color: #1d6ea7;
}

#case-list-real-time .alarm-type-select > ul li:hover {
    background-color: #1d6ea7;
}

#case-list-real-time .alarm-type-select > ul li .lbl-check {
    display: none;
    position: absolute;
    left: 0;
    top: -.3rem;
    color: #00BCD4;
}

#case-list-real-time .alarm-type-select > ul li.active .lbl-check {
    display: block;
}

.alarm-remark {
    margin: 0 0 .5rem 0;
    padding: 0;
    list-style: none;
    color: #fff;
}

.symbol-warn {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
}

.symbol-warn.red {
    background-color: #ff1a0c;
    -webkit-box-shadow: 0 0 27px 4px #f57a53;
}

.symbol-warn.deeporange {
    background-color: #FF5508;
    -webkit-box-shadow: 0 0 27px 4px #f57a53;
}

.symbol-warn.orange {
    background-color: #ff940b;
    -webkit-box-shadow: 0 0 27px 4px #ffb581;
}

.symbol-warn.yellow {
    background-color: #FFC107;
    -webkit-box-shadow: 0 0 27px 4px #ffe46e;
}

.symbol-warn.blue {
    background-color: #0694F4;
    -webkit-box-shadow: 0 0 27px 4px #6bd5f4;
}

.symbol-warn.linghtblue {
    background-color: #30e1ff;
    -webkit-box-shadow: 0 0 27px 4px #91e4f4;
}

.symbol-warn.lowgreen {
    background-color: #8BC34A;
    -webkit-box-shadow: 0 0 27px 4px #b7d18a;
}

.symbol-warn.green {
    background-color: #ACFF0E;
    -webkit-box-shadow: 0 0 27px 4px #ceff85;
}

.symbol-warn.deepgreen {
    background-color: #15ff39;
    -webkit-box-shadow: 0 0 25px 2px #87ff76;
}

.bubble-pulse {
    background: #FF5722;
    border-radius: 50%;
    height: .8rem;
    width: .8rem;
}

.bubble-pulse.red {
    background: #ff1a0c;
}

.bubble-pulse.deeporange {
    background: #FF5508;
}

.bubble-pulse.orange {
    background-color: #ff940b;
}

.bubble-pulse.yellow {
    background-color: #FFC107;
}

.bubble-pulse.blue {
    background-color: #0694F4;
}

.bubble-pulse.linghtblue {
    background-color: #30e1ff;
}

.bubble-pulse.green {
    background-color: #ACFF0E;
}

.bubble-pulse.lowgreen {
    background-color: #8BC34A;
}

.bubble-pulse:after {
    content: "";
    border-radius: 50%;
    height: 2.6rem;
    width: 2.6rem;
    position: absolute;
    margin: -.92rem 0 0 -.92rem;
    animation: pulsate 2s ease-out;
    animation-iteration-count: infinite;
    opacity: 0;
    filter: alpha(opacity=0);
    box-shadow: 0 0 0.2rem 0.2rem #FF5722;
    animation-delay: 1.1s;
}

.bubble-pulse.red:after {
    box-shadow: 0 0 .2rem .2rem #ff1a0c;
}

.bubble-pulse.deeporange:after {
    box-shadow: 0 0 .2rem .2rem #FF5508;
}

.bubble-pulse.orange:after {
    box-shadow: 0 0 .2rem .2rem #ff940b;
}

.bubble-pulse.yellow:after {
    box-shadow: 0 0 .2rem .2rem #FFC107;
}

.bubble-pulse.blue:after {
    box-shadow: 0 0 .2rem .2rem #0694F4;
}

.bubble-pulse.linghtblue:after {
    box-shadow: 0 0 .2rem .2rem #30e1ff;
}

.bubble-pulse.green:after {
    box-shadow: 0 0 .2rem .2rem #ACFF0E;
}

.bubble-pulse.lowgreen:after {
    box-shadow: 0 0 .2rem .2rem #8BC34A;
}

@keyframes pulsate {
    0% {
        transform: scale(0.1, 0.1);
        opacity: 0;
        filter: alpha(opacity=0);
    }
    50% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }
    100% {
        transform: scale(1.2, 1.2);
        opacity: 0;
        filter: alpha(opacity=0);
    }
}

.alarm-descript-simple {
    position: absolute;
    right: 27.8rem;
    bottom: calc((100% - 2rem) * 0.2 + 2rem);
    width: 3rem;
    height: 3rem;
    background-color: #0a4f7d;
    color: #fff;
    display: none;
    z-index: 2;
    line-height: 3rem;
    text-align: center;
    font-size: 2rem;
    border-radius: 50%;
    cursor: pointer;
}

.alarm-descript-simple:hover {
    color: orange;
}

.alarm-descript {
    width: 9rem;
    position: absolute;
    right: 27.8rem;
    bottom: calc((100% - 2rem) * 0.2 + 2rem);
    border-radius: .2rem;
    color: #eee;
    z-index: 2;
    display: none;
    background: linear-gradient(to left, #00BCD4, #00BCD4) left top no-repeat, linear-gradient(to bottom, #00BCD4, #00BCD4) left top no-repeat, linear-gradient(to left, #00BCD4, #00BCD4) right top no-repeat, linear-gradient(to bottom, #00BCD4, #00BCD4) right top no-repeat, linear-gradient(to left, #00BCD4, #00BCD4) left bottom no-repeat, linear-gradient(to bottom, #00BCD4, #00BCD4) left bottom no-repeat, linear-gradient(to left, #00BCD4, #00BCD4) right bottom no-repeat, linear-gradient(to left, #00BCD4, #00BCD4) right bottom no-repeat;
    background-size: .2rem 2rem, 2rem .2rem, .2rem 2rem, 2rem .2rem;
    padding: .8rem;
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
}

.alarm-descript .close-panel {
    position: absolute;
    right: 1rem;
    cursor: pointer;
}

.alarm-descript .close-panel:hover {
    color: orange;
}

.alarm-descript .content {
    background-color: rgba(9, 59, 93, 0.58);
    padding: .8rem .3rem;
}

.alarm-descript .desc-item {
    text-align: center;
    overflow: hidden;
}

.alarm-descript .desc-item .spread-container {
    margin: 0 auto;
}

.alarm-descript .desc-item .bubble-pulse {
    margin: .6rem auto;
}

.alarm-descript .desc-item .bubble-pulse:after {
    margin: -.9rem 0 0 -1.3rem;
}

.alarm-descript .desc-item .symbol-warn {
    margin: .6rem auto;
}

.alarm-descript .desc-item .symbol-text {
    text-align: center;
}

.alarm-descript .desc-item label {
    height: 1rem;
    width: 1rem;
    vertical-align: middle;
    border-radius: 50%;
    margin-right: .5rem;
}

.alarm-descript .desc-item label.red {
    background-color: #ff1a0c;
}

.alarm-descript .desc-item label.deeporange {
    background-color: #FF5508;
}

.alarm-descript .desc-item label.orange {
    background-color: #ff940b;
}

.alarm-descript .desc-item label.yellow {
    background-color: #FFC107;
}

.alarm-descript .desc-item label.blue {
    background-color: #0694F4;
}

.alarm-descript .desc-item label.linghtblue {
    background-color: #30e1ff;
}

.alarm-descript .desc-item label.lowgreen {
    background-color: #8BC34A;
}

.alarm-descript .desc-item label.green {
    background-color: #ACFF0E;
}
/*
    底部分时折线图
    width: 计算值
    height: 20rem  固定高度
 */
#case-hour-total {
    width: calc(100% - 27rem - 80rem);
    height: 18rem;
    bottom: .5rem;
    right: 80rem;
}

#case-hour-total .float-panel-content {
    margin-top: -1.8rem;
    height: calc(100%);
    overflow: hidden;
}
/*
   警力统计
   height: 30rem 固定高度
   bottom: 18rem + 0.5rem + 0.5rem
 */
#police-total {
    bottom: .5rem;
    height: 18rem;
}

#police-total .float-panel-content {
    position: absolute;
    overflow: hidden;
    height: calc(100% - 2.3rem);
}

#police-total .float-panel-content .police-total-number {
    position: absolute;
    bottom: 0.18rem;
    height: 3.5rem;
    width: 100%;
}

#police-total .float-panel-content .police-total-number {
    overflow: hidden;
}

#police-total .float-panel-content .police-total-number .col-sm-4 {
    margin: 0;
    padding: 0;
}

#police-total .float-panel-content .police-total-number .col-sm-4:first-child {
    width: 28%;
}

#police-total .float-panel-content .police-total-number .col-sm-4:last-child {
    color: #FF9800;
}

#police-total .float-panel-content .police-total-number p {
    font-size: 1rem;
}

#police-total .float-panel-content .police-total-number span {
    font-size: 1.5rem;
    font-weight: bold;
}
/*
  数据图层
  top: 0.5rem;
  bottom: 30rem + 19rem + 0.5rem
 */
#data-resources {
    top: 0.5rem;
    bottom: 19rem;
}

#data-resources .float-panel-content {
    padding: .2rem;
    height: calc(100% - 2.3rem);
    overflow-y: auto;
    overflow-x: hidden;
}

#data-resources .float-panel-content .data-resource-group {
    width: 100%;
    padding: .5rem;
    border-bottom: .1rem solid rgba(238, 238, 238, 0.38);
    margin-bottom: 0;
    float: left;
    position: relative;
}

#data-resources .float-panel-content .data-resource-group .data-resource-group-title {
    margin-bottom: .5rem;
    color: #00BCD4;
}

#data-resources .float-panel-content .data-resource-group:last-child {
    border-bottom: 0;
}

#data-resources .float-panel-content .data-resource-group .right {
    width: calc(100% - 6.18rem);
    float: right;
}

#data-resources .float-panel-content .data-resource-group .layer-theme {
    width: 5.5rem;
    background-color: #0a374b;
    height: 5.5rem;
    border-radius: 50%;
    font-size: 2.5rem;
    top: calc(50% - 2.75rem);
    position: absolute;
    cursor: pointer;
}

#data-resources .float-panel-content .data-resource-group .layer-theme .in-circle {
    width: 4.4rem;
    text-align: center;
    height: 4.4rem;
    line-height: 4.4rem;
    border-radius: 50%;
    font-size: 2.5rem;
    margin: .55rem auto 0;
}

#data-resources ul.data-resource-group-list {
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#data-resources ul.data-resource-group-list li {
    float: left;
    list-style: none;
    padding: .3rem 1.5rem .3rem 1.5rem;
    cursor: default;
    background-color: #114c75;
    margin-right: .38rem;
    margin-bottom: .5rem;
    border-radius: .3rem;
    position: relative;
    font-size: 1rem;
}

#data-resources ul.data-resource-group-list li .symbol {
    font-size: .9rem;
}

#data-resources ul.data-resource-group-list li.hide {
    display: none;
}

#data-resources ul.data-resource-group-list li > i {
    margin-right: .2rem;
}

#data-resources ul.data-resource-group-list li:hover, ul.data-resource-group-list li.active {
    background-color: #1d6ea7;
}

#data-resources ul.data-resource-group-list li .float-checked, #data-resources ul.data-resource-group-list li.active .float-unchecked{
    display: none;
}

#data-resources ul.data-resource-group-list li.active .float-checked, #data-resources ul.data-resource-group-list li .float-unchecked {
    position: absolute;
    color: #29e0f7;
    left: 0.2rem;
    top: 0;
    font-size: 1.1rem;
    line-height: 2rem;
    display: block;
}

#data-resources ul.data-resource-group-list li label.float-dropdown {
    position: absolute;
    color: #29e0f7;
    cursor: pointer;
    right: 0;
    top: 0;
    font-size: 1.1rem;
    line-height: 2rem;
    width: 1.2rem;
    text-align: center;
    display: block;
    border-top-right-radius: 0.3rem;
    border-bottom-right-radius: 0.3rem;
}

#data-resources ul.data-resource-group-list li label.float-dropdown:hover {
    color: #ffffff;
    background-color: rgba(12, 62, 95, 0.9);
}

#data-resources .float-panel-title .pull-right {
    padding-right: 1rem;
}

#data-resources .float-panel-title .pull-right .fa {
    cursor: pointer;
    font-size: 1.38rem;
}

/* 带颜色的圆框 */
.symbol-red {
    background-color: #ffffff;
    border: .1rem solid #ff0e18;
    color: #ff0e18;
    font-size: 1.8rem;
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    border-radius: 50%;
}

.symbol-blue {
    background-color: #ffffff;
    border: .2rem solid #093858;
    color: #093858;
    font-size: 1.38rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 2.1rem;
    text-align: center;
    border-radius: 50%;
}

.symbol-online {
    background-color: #ffffff;
    border: .2rem solid #337ab7;
    color: #337ab7;
    font-size: 1.38rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 2.1rem;
    text-align: center;
    border-radius: 50%;
}

.symbol-offline {
    background-color: #ffffff;
    border: .2rem solid gray;
    color: gray;
    font-size: 1.38rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 2.1rem;
    text-align: center;
    border-radius: 50%;
}

.symbol-black {
    background-color: #ffffff;
    border: .2rem solid black;
    color: black;
    font-size: 1.38rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 2.1rem;
    text-align: center;
    border-radius: 50%;
}

.symbol-gray {
    background-color: #ffffff;
    border: .2rem solid gray;
    color: gray;
    font-size: 1.38rem;
    width: 2.5rem;
    height: 2.5rem;
    line-height: 2.1rem;
    text-align: center;
    border-radius: 50%;
}

/* 图层过滤面板 */
.data-resource-filter-panel {
    z-index: 18;
    position: absolute;
    max-width: 25rem;
    background-color: rgba(12, 62, 95, 0.9);
    border-radius: .5rem;
    padding: .3rem .5rem .5rem .8rem;
    box-shadow: 0 0 3rem #0aa8ef;
}

.data-resource-filter-panel .totals {
    color: orange;
    font-size: 1.98rem;
    margin-bottom: .5rem;
    font-weight: bold;
    margin-right: 2rem;
}

.data-resource-filter-panel .totals small {
    font-size: 1rem;
    font-weight: normal;
    margin-right: .5rem;
}

.data-resource-filter-panel > .fa.fa-close {
    position: absolute;
    right: .6rem;
    top: .28rem;
    color: #fff;
    cursor: pointer;
}

.data-resource-filter-panel > .fa.fa-close:hover {
    color: #29e0f7;
}

.data-resource-filter-panel ul {
    overflow: hidden;
    float: left;
    padding: 0;
    border-top: .1rem solid rgba(238, 238, 238, 0.55);
    width: 100%;
    margin: 0 0 .5rem;
    clear: both;
}

.data-resource-filter-panel ul:first-child {
    border-top: 0;
}

.data-resource-filter-panel ul li {
    border-radius: .2rem;
    background-color: #114c75;
    padding: .3rem 1.3rem .3rem 1.5rem;
    float: left;
    list-style: none;
    color: #eee;
    margin-right: .5rem;
    margin-top: .5rem;
    cursor: pointer;
    position: relative;
}

.data-resource-filter-panel ul li .label-check {
    display: none;
    position: absolute;
    left: 0.3rem;
    top: 0.3rem;
    color: #00BCD4;
}

.data-resource-filter-panel ul li.active .label-check {
    display: block;
}

.data-resource-filter-panel ul li:hover {
    background-color: #1d6ea7;
}

.data-resource-filter-panel ul li.active {
    background-color: #1d6ea7;
}

/* 数据资源显示设置 */
#data-resources-display-setup {
    width: 60rem;
    height: 40rem;
    overflow-y: auto;
    overflow-x: hidden;
}

#data-resources-display-setup .group {
    width: 98%;
    padding: .5rem;
    float: left;
    margin: .5rem;
    position: relative;
    background-color: #f5f5f5;
    box-shadow: 0.2rem 0.2rem 0.1rem #bbbbbb;
}

#data-resources-display-setup .title {
    border-bottom: .1rem dashed #d5d5d5;
    font-size: 1.1rem;
    font-weight: bold;
    line-height: 2rem;
    padding-left: 1rem;
}

#data-resources-display-setup ul {
    margin: 0;
    padding: .5rem 0 0 0;
    overflow: hidden;
}

#data-resources-display-setup li {
    float: left;
    list-style: none;
    padding-left: 1rem;
    min-width: 14rem;
}

#data-resources-display-setup li label {
    line-height: 2rem;
    font-size: 1.1rem;
    font-weight: normal;
}
/*
    疫情态势
 */
#health-total {
    width: 26rem;
    height: 18rem;
    bottom: .5rem;
    right: 27rem;
}

#health-total .float-panel-content {
    margin-top: -1.8rem;
    height: calc(100%);
    overflow: hidden;
}
/*
    重点人员管控态势
 */
#important-human {
    width: 26rem;
    height: 18rem;
    bottom: .5rem;
    right: 53.5rem;
}

#important-human .float-panel-content {
    margin-top: -1.8rem;
    height: calc(100%);
    overflow: hidden;
}

#toolbar {
    position: absolute;
    right: 27rem;
    top: .5rem;
    color: #fff;
    background-color: #093b5d;
    z-index: 3;
    padding: .5rem 0;
}

#toolbar .item {
    width: 3.3rem;
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    font-size: 1.38rem;
    cursor: pointer;
    float: left;
    position: relative;
}

#toolbar .item.split {
    border-right: .1rem solid #fff;
    margin-right: .2rem;
    padding-right: .2rem;
}

#toolbar .dropdown a {
    color: #fff;
    text-decoration: none;
}

#toolbar .dropdown-menu {
    background-color: #093b5d;
    border: .1rem solid rgba(238, 238, 238, 0.38);
    padding: .5rem .5rem;
}

#toolbar .menu-item {
    padding: .2rem .5rem;
    background-color: #114c75;
    margin-bottom: .4rem;
    border-radius: .2rem;
    cursor: pointer;
    position: relative;
    min-width: 5rem;
}

#toolbar .menu-item:hover {
    background-color: #1d6ea7;
}

#toolbar .menu-item.active {
    background-color: #1d6ea7;
}

#toolbar .menu-item .checked {
    display: none;
}

#toolbar .menu-item.active .checked {
    display: inline-block;
}


#search {
    position: absolute;
    left: .5rem;
    top: .5rem;
    bottom: .5rem;
    width: 26rem;
    z-index: 3;
    display: none;
}

#search-key-panel {
    position: absolute;
    left: 0;
    top: 0;
    width: 26rem;
    height: 3.5rem;
    color: #fff;
    background-color: #093b5d;
    z-index: 3;
    padding: .5rem 0;
    border-radius: .5rem;
}

#search-key-panel input[type="text"] {
    position: absolute;
    left: .5rem;
    padding-left: 2.5rem;
    width: 23rem;
    background-color: #093b5d;
    border: 0;
    color: white;
}

#search-result-panel {
    position: absolute;
    left: 0;
    top: 3.7rem;
    right: 0;
    bottom: 0;
    background-color: #093b5d;
    border: 0;
    border-radius: .5rem;
    padding: .5rem;
    overflow-y: auto;
    display: none;
}

#search-result-panel .item {
    margin-right: 0;
    margin-left: 0;
    padding: .3rem .5rem;
    border-radius: .3rem;
    cursor: pointer;
    border: .1rem solid #093b5d;
    font-size: 1rem;
}

#search-result-panel .item .col-xs-2 {
    width: 3rem;
    padding-left: 0;
    padding-right: 0;
}

#search-result-panel .item .col-xs-10 {
    width: 20rem;
    padding-left: .2rem;
    padding-right: .2rem;
}

#search-result-panel img {
    width: 3rem;
    height: 3rem;
}

#search-result-panel .title {
    font-size: 1.5rem;
    color: #00BCD4;
    line-height: 2.5rem;
}

#search-result-panel .content {
    font-size: 1rem;
    color: white;
    line-height: 1.5rem;
    padding-top: .5rem;
}

#search-result-panel .page-panel {
    color: white;
    font-size: 1.1rem;
}

#search-result-panel .page-panel span {
    cursor: pointer;
    padding: .2rem .4rem .2rem .4rem;
    margin-right: .5rem;
    border: solid white 1px;
}

#search-result-panel .page-panel span.checked {
    font-size: 1.3rem;
    cursor: default;
    border: none;
}