TDataView_ui/styles/basic.css

html,
body {
    /* background: #e5e9ec url(img/preloader.gif) no-repeat center center; */
    overflow: hidden;
    width: 100%;
    height: 100%;
    font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, 'PingFang SC', 'Lantinghei SC', 'Hiragino Sans GB', sans-serif;
    color: #6f7b8a;
    font-size: 14px;
}

.main {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 99999;
}

.main iframe {
    width: 100%;
    height: 100%;
    background: #fff;
}

.main .bk {
    font-size: 14px;
    color: #fff;
    background: #088EE6;
    border-radius: 5px;
    text-align: center;
    padding: 2px 16px;
    position: fixed;
    right: 268px;
    top: 5px;
    z-index: 9999999;
    cursor: pointer;
}

.layout-split-north {
    display: none;
}

hr {
    width: 100%;
    height: 1px;
    border: 0px;
    background: url(../images/layout/bg-sideBar-line.png) no-repeat center center;
}

/* S reset */

.menu-tabs .menu a:hover {
    /*background: #378BE0;*/
}

/*::selection {
    background: #098e83;
}

::-moz-selection {
    background: #098e83;
}*/

select:focus,
input:focus,
textarea:focus {
    border-color: #378BE0;
}

a {
    /*-webkit-tap-highlight-color: #098e83;*/
}

.menu-tabs .menu a:hover {
    /*background: #378BE0;*/
}

table.box-header th {
    background-color: #378BE0;
    color: #fff;
}

.masthead,
.menu a:hover,
.menu-tabs .menu .nav,
.menu-tabs .active a,
.menu-tabs .tabs .nav .active a,
.menu-tabs .active a:hover,
.menu-tabs .tabs .active a:hover {
    /*background: #378BE0;*/
}

.menu .links a,
.pipes a,
.menu .stat a {
    color: #378BE0;
}


.menu .links a:hover,
.pipes a:hover,
.menu .stat a:hover,
.tags .cloud a:hover {
    color: #378BE0;
}

.lit {
    color: #378BE0;
}

.panel {
    border: none;
    background: rgba(45, 53, 68, 1);
}

.panel .header {}

.panel .body {
    border: none;
}

.panel .footer {
    border: none;
}

.cell {
    margin: 20px;
}


/* E reset */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: ' Microsoft Yahei', 'Helvetica Neue', Helvetica, 'PingFang SC', 'Lantinghei SC', 'Hiragino Sans GB', sans-serif;
}

#appMain {
    width: 100%;
    height: 100%;
    position: relative;
}

input,
button,
select,
textarea {
    outline: none;
    font-family: ' Microsoft Yahei', 'Helvetica Neue', Helvetica, 'PingFang SC', 'Lantinghei SC', 'Hiragino Sans GB', sans-serif;
}

input::-ms-clear {
    display: none;
}

img {
    border: none;
}

li {
    list-style-type: none;
}

a {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

a:hover {
    color: #378BE0;
    text-decoration: none;
}

a:active {
    outline: none;
    blr: expression(this.onFocus=this.blur());
}

a:visited {}

a:focus {
    outline: none;
}

button:focus {
    outline: none;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.btn {
    position: relative;
    cursor: pointer;
    background: #ffffff;
    color: #666666;
    text-align: center;
    font-size: 14px;
    border: 0px;
}

.btn8 {
    width: 125px;
}

.btn6 {
    width: 105px;
}

.btn5 {
    width: 90px;
}

.btn4 {
    width: 75px;
}

.btn3 {
    width: 60px;
}

.btn2 {
    width: 45px;
}

.btn1 {
    width: 30px;
}

.t-l {
    text-align: left !important;
}

.t-r {
    text-align: right !important;
}

.t-c {
    text-align: center !important;
}

.f-l {
    float: left !important;
}

.f-r {
    float: right !important;
}

.f-n {
    float: none !important;
}

.form .verify {
    display: inline-block;
    line-height: 33px;
    padding: 0 0 0 10px;
}

.background-none {
    background: none !important;
}

.background-note {
    color: #ffffff !important;
    background: #62707D !important;
}

.background-success {
    color: #ffffff !important;
    background: #0AA699 !important;
}

.background-warning {
    color: #ffffff !important;
    background: #FFCC33 !important;
}

.background-error {
    color: #ffffff !important;
    background: #F35958 !important;
}

.btn-default {
    width: 64px;
    height: 34px;
    border: 2px solid #aaa;
    border-radius: 4px;
    margin: 0 48px;
    color: #666;
    background: #fff;
    font-size: 16px;
    line-height: 32px;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active {
    color: #378BE0;
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
    background-color: #ffffff;
    border-color: #cccccc;
}

.btn-primary {
    color: white;
    background-color: #0090d9;
    border-color: #0090d9;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    color: white;
    background-color: #0075b0;
    border-color: #0075b0;
}

.btn-primary:active,
.btn-primary.active {
    background-image: none;
}

.btn-primary.disabled,
.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled:active,
.btn-primary.disabled.active,
.btn-primary[disabled],
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary.active {
    background-color: #0090d9;
    border-color: #0090d9;
}

.btn-primary.btn-transparent {
    color: #AAA;
    border-color: #0090d9;
}

.btn-primary.btn-transparent:hover,
.btn-primary.btn-transparent:focus,
.btn-primary.btn-transparent:active,
.btn-primary.btn-transparent.active {
    background-color: #0090d9;
    color: white;
}

.btn-primary .badge {
    color: #0090d9;
    background-color: white;
}

.btn-success {
    color: white;
    background-color: #0b4496;
    border-color: #0b4496;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active {
    color: white;
    background-color: #1b67d5;
    border-color: #1b67d5;
}

.btn-success:active,
.btn-success.active {
    background-image: none;
}

.btn-success.disabled,
.btn-success.disabled:hover,
.btn-success.disabled:focus,
.btn-success.disabled:active,
.btn-success.disabled.active,
.btn-success[disabled],
.btn-success[disabled]:hover,
.btn-success[disabled]:focus,
.btn-success[disabled]:active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-success:hover,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success.active {
    background-color: #0aa699;
    border-color: #0aa699;
}

.btn-success.btn-transparent {
    color: #AAA;
    border-color: #0aa699;
}

.btn-success.btn-transparent:hover,
.btn-success.btn-transparent:focus,
.btn-success.btn-transparent:active,
.btn-success.btn-transparent.active {
    background-color: #0aa699;
    color: white;
}

.btn-success .badge {
    color: #0aa699;
    background-color: white;
}

.btn-warning {
    color: white;
    background-color: #ffcc33;
    border-color: #ffcc33;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active {
    color: white;
    background-color: #ffc20a;
    border-color: #ffc20a;
}

.btn-warning:active,
.btn-warning.active {
    background-image: none;
}

.btn-warning.disabled,
.btn-warning.disabled:hover,
.btn-warning.disabled:focus,
.btn-warning.disabled:active,
.btn-warning.disabled.active,
.btn-warning[disabled],
.btn-warning[disabled]:hover,
.btn-warning[disabled]:focus,
.btn-warning[disabled]:active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning,
fieldset[disabled] .btn-warning:hover,
fieldset[disabled] .btn-warning:focus,
fieldset[disabled] .btn-warning:active,
fieldset[disabled] .btn-warning.active {
    background-color: #ffcc33;
    border-color: #ffcc33;
}

.btn-warning.btn-transparent {
    color: #AAA;
    border-color: #ffcc33;
}

.btn-warning.btn-transparent:hover,
.btn-warning.btn-transparent:focus,
.btn-warning.btn-transparent:active,
.btn-warning.btn-transparent.active {
    background-color: #ffcc33;
    color: white;
}

.btn-warning .badge {
    color: #ffcc33;
    background-color: white;
}

.btn-danger {
    color: white;
    background-color: #d9534f;
    border-color: #d9534f;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active {
    color: white;
    background-color: #d2322d;
    border-color: #d2322d;
}

.btn-danger:active,
.btn-danger.active {
    background-image: none;
}

.btn-danger.disabled,
.btn-danger.disabled:hover,
.btn-danger.disabled:focus,
.btn-danger.disabled:active,
.btn-danger.disabled.active,
.btn-danger[disabled],
.btn-danger[disabled]:hover,
.btn-danger[disabled]:focus,
.btn-danger[disabled]:active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger,
fieldset[disabled] .btn-danger:hover,
fieldset[disabled] .btn-danger:focus,
fieldset[disabled] .btn-danger:active,
fieldset[disabled] .btn-danger.active {
    background-color: #d9534f;
    border-color: #d9534f;
}

.btn-danger.btn-transparent {
    color: #AAA;
    border-color: #d9534f;
}

.btn-danger.btn-transparent:hover,
.btn-danger.btn-transparent:focus,
.btn-danger.btn-transparent:active,
.btn-danger.btn-transparent.active {
    background-color: #d9534f;
    color: white;
}

.btn-danger .badge {
    color: #d9534f;
    background-color: white;
}

.btn-info {
    color: white;
    background-color: #b5d1d8;
    border-color: #b5d1d8;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active {
    color: white;
    background-color: #9ac0ca;
    border-color: #9ac0ca;
}

.btn-info:active,
.btn-info.active {
    background-image: none;
}

.btn-info.disabled,
.btn-info.disabled:hover,
.btn-info.disabled:focus,
.btn-info.disabled:active,
.btn-info.disabled.active,
.btn-info[disabled],
.btn-info[disabled]:hover,
.btn-info[disabled]:focus,
.btn-info[disabled]:active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-info:hover,
fieldset[disabled] .btn-info:focus,
fieldset[disabled] .btn-info:active,
fieldset[disabled] .btn-info.active {
    background-color: #b5d1d8;
    border-color: #b5d1d8;
}

.btn-info.btn-transparent {
    color: #AAA;
    border-color: #b5d1d8;
}

.btn-info.btn-transparent:hover,
.btn-info.btn-transparent:focus,
.btn-info.btn-transparent:active,
.btn-info.btn-transparent.active {
    background-color: #b5d1d8;
    color: white;
}

.btn-info .badge {
    color: #b5d1d8;
    background-color: white;
}

.btn-white {
    color: #777;
    background-color: white;
    border-color: white;
}

.btn-white:hover,
.btn-white:focus,
.btn-white:active,
.btn-white.active {
    color: #777;
    background-color: #ebebeb;
    border-color: #ebebeb;
}

.btn-white:active,
.btn-white.active {
    background-image: none;
}

.btn-white.disabled,
.btn-white.disabled:hover,
.btn-white.disabled:focus,
.btn-white.disabled:active,
.btn-white.disabled.active,
.btn-white[disabled],
.btn-white[disabled]:hover,
.btn-white[disabled]:focus,
.btn-white[disabled]:active,
.btn-white[disabled].active,
fieldset[disabled] .btn-white,
fieldset[disabled] .btn-white:hover,
fieldset[disabled] .btn-white:focus,
fieldset[disabled] .btn-white:active,
fieldset[disabled] .btn-white.active {
    background-color: white;
    border-color: white;
}

.btn-white.btn-transparent {
    color: #AAA;
    border-color: white;
}

.btn-white.btn-transparent:hover,
.btn-white.btn-transparent:focus,
.btn-white.btn-transparent:active,
.btn-white.btn-transparent.active {
    background-color: white;
    color: #777;
}

.btn-white .badge {
    color: white;
    background-color: #777;
}

.btn-inverse {
    color: white;
    background-color: #62707d;
    border-color: #62707d;
}

.btn-inverse:hover,
.btn-inverse:focus,
.btn-inverse:active,
.btn-inverse.active {
    color: white;
    background-color: #505c66;
    border-color: #505c66;
}

.btn-inverse:active,
.btn-inverse.active {
    background-image: none;
}

.btn-inverse.disabled,
.btn-inverse.disabled:hover,
.btn-inverse.disabled:focus,
.btn-inverse.disabled:active,
.btn-inverse.disabled.active,
.btn-inverse[disabled],
.btn-inverse[disabled]:hover,
.btn-inverse[disabled]:focus,
.btn-inverse[disabled]:active,
.btn-inverse[disabled].active,
fieldset[disabled] .btn-inverse,
fieldset[disabled] .btn-inverse:hover,
fieldset[disabled] .btn-inverse:focus,
fieldset[disabled] .btn-inverse:active,
fieldset[disabled] .btn-inverse.active {
    background-color: #62707d;
    border-color: #62707d;
}

.btn-inverse.btn-transparent {
    color: #AAA;
    border-color: #62707d;
}

.btn-inverse.btn-transparent:hover,
.btn-inverse.btn-transparent:focus,
.btn-inverse.btn-transparent:active,
.btn-inverse.btn-transparent.active {
    background-color: #62707d;
    color: white;
}

.btn-inverse .badge {
    color: #62707d;
    background-color: white;
}


/*S================================= filterCover*/

#filterCover {
    background: url(img/alpha-50.png);
    width: 100%;
    height: 100%;
    position: fixed;
    _position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 10049;
    display: none;
}

.modal-filter-cover {
    background: url(img/alpha-50.png);
    width: 100%;
    height: 100%;
    position: fixed;
    _position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 900000;
}


/*E================================= filterCover*/




.cover-panel {
    position: relative;
}

.cover-iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: 0;
    opacity: 0;
    visibility: visibility;
    background: #000;
    border: 0px solid #01b7ff;
}

.cover-content {
    position: relative;
    width: 100%;
    height: 100%;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: 1;
}

.popup-lt {
    position: absolute;
    top: 0px;
    left: -20px;
    bottom: 19px;
    width: 20px;
    /* background: url(../images/popup/bg-pp-2d-lt.png) top left no-repeat; */
}

.popup-lb {
    position: absolute;
    left: -20px;
    bottom: 0px;
    width: 42px;
    height: 19px;
    /* background: url(../images/popup/bg-pp-2d-lb.png) top left no-repeat; */
}

.popup-rt {
    position: absolute;
    right: -8px;
    top: 0px;
    bottom: 19px;
    width: 8px;
    /* background: url(../images/popup/bg-pp-2d-rt.png) top left no-repeat; */
}

.popup-rb {
    position: absolute;
    right: -8px;
    bottom: 0px;
    height: 19px;
    left: 22px;
    /* background: url(../images/popup/bg-pp-2d-rb.png) top right no-repeat; */
}

.popup-ct {
    cursor: move;
    height: 48px;
    /* background: url(../images/popup/bg-pp-23d-ct.png) top left repeat-x; */
}

.popup-cb {
    background: #ffffff;
}

/*E================================= Scrollbox*/
.modal .cover-content {
    /*border: 2px solid #01b7ff;*/
    /*background: url(../images/layout/bg-normal.png);*/
}

.modal .modal-header {
    background: #378BE0;
    font-size: 18px;
    font-weight: normal;
    color: #fff;
    padding: 12px 20px;
}

.modal .modal-body {
    position: relative;
    padding: 15px 30px 0;
    overflow-y: auto;
    background: #fefefe;
}

.modal .modal-header .close {
    position: absolute;
    right: 15px;
    top: 10px;
    text-indent: -999999px;
    overflow: hidden;
    background: url(../images/layout/bg_close.gif) no-repeat center 7px;
    border: none;
    width: 30px;
    height: 30px;
}

.modal .modal-header h3 {
    font-size: 18px;
    font-weight: normal;
    /*line-height: 25px;*/
    color: #fff;
}

.modal .modal-footer {
    padding: 15px;
    margin-bottom: 0;
    text-align: center;
    background: #fff;
}

.input {
    border: 0px solid #dcdcdc;
    height: 28px;
    display: inline-block;
    line-height: 28px;
    color: #666;
    padding: 0 8px;
    border: 1px solid #aaa;
    /*background: #3371c8;*/
}

.item-form .btn2 {
    width: 57px !important;
}

.btn-small {
    height: 22px;
    line-height: 22px;
    font-size: 12px;
    font-weight: normal;
}



/*S leaflet*/
.leaflet-bottom {
    margin-bottom: 30px;
}

/*E leaflet*/


.downloadIEUpdata {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 999999999999999999999999;
    background: #000 url(../images/layout/bg_body.jpg) no-repeat center center;
}

.downloadIEUpdata p {
    position: absolute;
    font-size: 20px;
    top: 50%;
    left: 0;
    margin-top: -15px;
    margin-left: 0;
    color: #fff;
    width: 100%;
    text-align: center;
}

.versionControl {
    position: absolute;
    z-index: 99999999999;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 50%;
    height: 50%;
    margin: auto;
    /*padding: 0 5%;*/
    overflow: hidden;
    display: none;
}

.versionControl ul li {
    line-height: 35px;
    font-size: 16px;
}

.versionControl p {
    font-size: 16px;
    line-height: 40px;
    margin: 20px 0 10px;
}

.versionControl .close {
    position: absolute;
    right: 20px;
    font-size: 36px;
    top: 0;
    cursor: pointer;
}

.versionControl .cover-content {
    background: #fff;
}

.versionControl .popup-ct {
    line-height: 48px;
    padding-left: 20px;
}

.versionControl .popup-cb {
    padding: 4% 20px;
    overflow-y: scroll;
    height: 70%;
    overflow-x: hidden;
}

.versionHide {
    width: 200px;
    height: 80px;
    text-align: center;
    border-radius: 10px;
    border: 1px solid #ccc;
    background: #fff;
    font-size: 16px;
    position: absolute;
    z-index: 99999999999;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 30px;
    display: none;
}

.versionHide p.choose {
    margin-top: 20px;
}

.versionHide button {
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px 12px;
    background: #eee;
    color: #111;
    margin: 5px;
}

#tufuTips {
    position: absolute;
    z-index: 19;
    display: none;
    margin-top: -20px;
    margin-left: 15px;
    font-size: 30px;
    text-shadow: 0 0 5px #fff;
    color: #332;
}

.boldicon {
    color: yellow;
}

.emptyicon {
    color: yellow;
    width: 80px !important;
    text-align: center;
    margin-left: -40px !important;
    margin-top: 0px !important
}

.emptyiconx {
    color: yellow;
    width: 80px !important;
    text-align: center;
    margin-left: 40px !important;
    margin-top: 0px !important
}

#xieyi {
    position: absolute;
    z-index: 9992;
    left: 50%;
    top: 50%;
    margin-top: -250px;
    margin-left: -400px;
    background: #fff;
    display: none;
}

#xieyi.active {
    display: block;
}

#xieyi iframe {
    border: none;
}

#xieyi .title {
    position: relative;
    font-size: 20px;
    text-align: center;
    padding: 20px 0;
}

#xieyi .close {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 40px;
    margin: 0;
    cursor: pointer;
}
.leaflet-draw-tooltip-single{
    color: rgb(255, 255, 255);
    background: rgba(0, 0, 0, 0.3);
    padding: 5px 10px;
    min-width: 120px;
}