﻿/*----common-------*/
html, body, div, h1, h2, h3, h4, h5, h6, ul, li, p, table, input {
    margin: 0;
    padding: 0;
    font-family: "Microsoft YaHei";
    color: #fff;
}

li {
    list-style: none;
}

a {
    text-decoration: none;
    color: #fff;
}

body {
    overflow: hidden;
}

.fl_l {
    float: left;
}

.fl_r {
    float: right;
}

.clear {
    height: 0;
    border: none;
    padding: 0;
    margin: 0;
    clear: both;
}

.ta_c {
    text-align: center;
}

.pos_r {
    position: relative;
}

.pos_a {
    position: absolute;
}

.bdb {
    border: 1px solid #00c3ff;
}

.bg_black {
    background: rgba(0,37,49,0.85);
}

.shadow_inset {
    box-shadow: 0 0 5px #00c3ff inset;
}

.btn {
    display: inline-block;
    text-align: center;
    color: #fff;
}

.btn_blue {
    background: #0089b4;
}

input[type="text"], select, textarea {
    color: #fff;
}

input[type="checkbox"] {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    border: 1px solid #00c3ff;
    border-radius: 2px;
}

input[type="checkbox"], input[type="radio"] {
    position: relative;
    top: 2px;
    margin-right: 5px;
}

    input[type="checkbox"]:checked {
        background: url(img/checkbox.png);
        border: none;
    }
/*----¹ö¶¯ÌõÑùÊ½---*/
::-webkit-scrollbar {
    width: 12px;
    background-color: #0089b4;
    height: 12px;
}

::-webkit-scrollbar-track {
    background-color: #0089b4;
}

::-webkit-scrollbar-thumb {
    background-color: #00c3ff;
}
/*----Í¸Ã÷ºÚÉ«±³¾°¿òÑùÊ½&±êÌâÑùÊ½---------*/
.tit {
    font-weight: normal;
    font-size: 16px;
    color: #fff;
    line-height: 28px;
    padding: 0 18px;
    background: rgba(0,137,180,0.85);
    border: solid #00c3ff;
    border-width: 1px;
    box-shadow: 0 0 5px #00c3ff inset;
    position: relative;
}

    .tit i {
        position: absolute;
        right: 10px;
        top: 6px;
        color: #fff;
    }

.box {
    background: rgba(0,37,49,0.85);
    border: 1px solid #00c3ff;
    box-shadow: 0 0 5px #00c3ff inset;
    position: absolute;
    line-height: 30px;
}

.box_l {
    width: 315px;
    left: 10px;
}

/*---ËÑË÷¿òÑùÊ½----*/
.search_box {
    top: 95px;
    z-index: 1002;
}

.search_bar {
    margin: 10px 0;
    overflow: hidden;
}

    .search_bar input, .btn_search {
        float: left;
    }

    .search_bar input {
        width: 220px;
        line-height: 38px;
        padding-left: 10px;
        background: none;
        font-size: 14px;
        margin-left: 19px;
    }

.btn_search {
    width: 42px;
    background: #0089b4;
    line-height: 38px;
    border-left: 0;
}

.search_result {
    line-height: 30px;
    font-size: 14px;
    height: 145px;
    overflow-y: auto;
}

    .search_result a {
        display: block;
        padding-left: 20px;
    }

        .search_result a:hover, .search_result a.on {
            background: #0089b4;
        }

/*---µ¼º½Ìõ&logo----*/
.header {
    min-width: 1100px;
}

.logo {
    overflow: hidden;
    left: 10px;
    top: 10px;
    padding-right: 30px;
    border-left: 1px solid #00c3ff;
}

.logo_bg, .nav span, .nav_top {
    transform: skew(-28deg,0deg);
}

.logo_bg {
    width: 410px;
    height: 64px;
    margin-left: -30px;
    border-right: none;
}

.logo_img {
    left: 18px;
    top: 13px;
}

.logo_text {
    left: 84px;
    top: 10px;
    color: #fff;
    display: none;
}

    .logo_text b {
        font-size: 22px;
    }

    .logo_text label {
        font-size: 12px;
        letter-spacing: -1px;
        color: #e1e1e1;
    }

.nav_box {
    left: 397px;
    top: 35px;
}

.nav span, .nav_btn {
    display: inline-block;
    width: 200px;
    height: 38px;
    margin-right: 15px;
}

.nav span {
    background: rgba(0,37,49,0.85);
    border: 1px solid #00c3ff;
    box-shadow: 0 0 5px #00c3ff inset;
    width: 200px;
}

    .nav span.chose, .shipping_list a:hover, .service_list a:hover {
        background: rgba(0,137,180,0.85);
    }

.nav_btn {
    line-height: 38px;
    text-align: center;
    font-size: 18px;
    transform: skew(28deg,0deg);
}

.nav_top {
    width: 654px;
    height: 17px;
    left: 404px;
    top: 10px;
    border-left: none;
}

.nav label {
    display: block;
    transform: skew(28deg,0deg);
    top: 39px;
    left: 49px;
    display: none;
}

.shipping_list a, .service_list a {
    display: block;
    width: 198px;
    height: 38px;
    line-height: 38px;
    background: rgba(0,37,49,0.85);
    border: 1px solid #00c3ff;
    text-align: center;
    margin-top: 5px;
    font-size: 16px;
    box-shadow: 0 0 5px #00c3ff inset;
    box-shadow: 0 3px 5px #333;
}
/*-----end----*/
/*---ÉÏÏÂÊÕËõ±êÇ©------*/
.toggle_bg {
    width: 80px;
    height: 17px;
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: -40px;
    cursor: pointer;
}

    .toggle_bg b, .toggle_bg span {
        display: inline-block;
    }

    .toggle_bg span {
        width: 40px;
        overflow: hidden;
        height: 15px;
        position: absolute;
    }

    .toggle_bg b {
        width: 40px;
        height: 12px;
        background: rgba(0,137,180,0.7);
    }

.toggle_bg_left {
    left: 0;
}

.toggle_bg_right {
    right: 0;
}

.toggle_bg_left b {
    transform: skew(-28deg,0);
    margin-left: 5px;
}

.toggle_bg_right b {
    transform: skew(28deg,0);
    margin-left: -5px;
}

.toggle_bg i {
    position: absolute;
    left: 38px;
    top: 1px;
}

.leaflet-control-attribution {
    display: none;
}

.leaflet-container {
    cursor: default;
}

.leaflet-popup-pane, .leaflet-control {
    cursor: auto;
}

.leaflet-dragging .leaflet-container, .leaflet-dragging .leaflet-clickable {
    cursor: default;
}

.leaflet-top {
    top: 300px;
}

.tip {
    display: block;
    padding-left: 17px;
    height: 30px;
    line-height: 30px;
    cursor: default;
}

.tlink {
    position: absolute;
    left: 310px;
    top: 0;
    height: 40px;
    line-height: 40px;
    background: #3A6F96;
    color: #fff;
    border-bottom: 1px solid #eee;
}

    .tlink a {
        display: inline-block;
        height: 40px;
        line-height: 40px;
        padding: 0 20px;
        font-size: 16px;
        color: #fff;
    }

        .tlink a:hover {
            background: #4982AD;
        }

.header {
    height: 74px;
    position: relative;
}

.banner {
    height: 63px;
    position: relative;
}

.navver {
    height: 25px;
    line-height: 25px;
    padding: 0 5px;
    background: #d4eaff;
}

.sidder {
    position: absolute;
    left: 0;
    top: 103px;
    width: 299px;
    bottom: 0;
    border-right: 1px solid #ccc;
}

    .sidder .all {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 33px;
        overflow: auto;
    }

.botter, .botter2 {
    position: absolute;
    left: 340px;
    height: 200px;
    right: 10px;
    bottom: 10px;
    background-color: rgba(0,37,49,0.85);
    z-index: 1000;
}

.botter2 {
    height: 0;
    bottom: 0;
    background-color: transparent;
}

.kwtitle {
    position: absolute;
    left: 15px;
    top: 6px;
}

    .kwtitle span {
        margin-right: 12px;
        font-size: 15px;
    }

    .kwtitle .shipname {
        color: #3B92E7;
    }

    .kwtitle .callsign {
        color: #59A50F;
    }

    .kwtitle .mmsi {
        color: #F42C2C;
    }

    .kwtitle .imo {
        color: #EE5AF9;
    }


.top_ports {
    position: absolute;
    right: 8px;
    top: 7px;
    width: 300px;
    border: 1px solid #ddd;
    padding: 5px 7px;
    border-radius: 5px;
    line-height: 18px;
    height: 36px;
}

    .top_ports a {
        display: inline-block;
        width: 45px;
    }

.big_ships {
    position: absolute;
    left: 490px;
    top: 46px;
    display: none;
}

    .big_ships a {
        display: inline-block;
        width: 130px;
        height: 40px;
        line-height: 42px;
        text-align: center;
        background: #cc0000;
        color: white;
        border-radius: 10px;
        margin-right: 10px;
    }

.sidder .bar {
    position: absolute;
    right: -16px;
    top: 50%;
    width: 17px;
    height: 68px;
    margin-top: -34px;
    cursor: pointer;
    background: url(img/mapinfo_arrow_left.png);
    z-index: 1001;
}

.toggle_side .sidder {
    width: 0;
}

    .toggle_side .sidder .bar {
        background-image: url(img/mapinfo_arrow_right.png);
    }

.toggle_side .mainer {
    left: 0;
}

.toggle_side .botter {
    left: 0;
}

.mapshadow .h {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 4px;
}

.mapshadow .v {
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
}

.mapshadow i {
    display: block;
    background: #000;
    overflow: hidden;
}

.mapshadow .h i {
    width: 100%;
    height: 1px;
}

.mapshadow .v i {
    height: 100%;
    width: 1px;
    float: left;
}

.i1 {
    opacity: 0.20;
    filter: alpha(opacity=20);
}

.i2 {
    opacity: 0.15;
    filter: alpha(opacity=15);
}

.i3 {
    opacity: 0.10;
    filter: alpha(opacity=10);
}

.i4 {
    opacity: 0.05;
    filter: alpha(opacity=5);
}

/*---´¬²°É¸Ñ¡ÑùÊ½---*/
.filters .section .lists {
    margin: 10px 0 10px 20px;
    font-size: 14px;
}

    .filters .section .lists label {
        display: inline-block;
    }

.filters .section .lists_full {
}

    .filters .section .lists_full label {
        display: block;
        width: 100%;
    }

.filters .section .lists label i {
    color: #b1b1b1;
    font-style: normal;
}

.filters .section .lists label b {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 1px solid #fff;
    background: #ffcc66;
    position: relative;
    left: 3px;
    top: 3px;
}

.col3 label {
    width: 135px;
}

.col4 label {
    width: 100px;
}

.panels {
    padding: 8px 0;
}

    .panels .head {
        height: 26px;
        line-height: 26px;
        font-weight: normal;
        text-indent: 20px;
        position: relative;
        color: #06C;
        background: url(img/arrow_right.gif) no-repeat 7px 8px;
        cursor: pointer;
    }

        .panels .head .r {
            position: absolute;
            right: 0;
            top: 0;
            padding: 0 7px;
        }

    .panels .body {
        padding: 0 0 10px 0;
        display: none;
    }

    .panels .on .head {
        background-color: #EBF2FA;
        background-image: url(img/arrow_bottom.gif);
    }

    .panels .on .body {
        display: block;
    }

.loading {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.01);
    z-index: 100000;
    -webkit-user-select: none;
}

    .loading div {
        position: fixed;
        top: 50%;
        margin-top: -22px;
        width: 100%;
    }

        .loading div span {
            display: block;
            margin: 0 auto;
            position: relative;
            width: 100px;
            padding: 10px 0 10px 10px;
            background: rgba(0,0,0,.5);
            border-radius: 5px;
        }

            .loading div span i {
                color: #fff;
                font-style: normal;
                white-space: nowrap;
                padding-left: 20px;
                background: url(img/loading.svg) no-repeat left;
            }

.shiptype1 {
    color: #3B92E7;
}

.shiptype2 {
    color: #59A50F;
}

.shiptype3 {
    color: #F42C2C;
}

.shiptype5 {
    color: #EE5AF9;
}

.shiptype6 {
    color: #FF6600;
}

.ship_info {
    padding: 5px 10px;
}

    .ship_info h4 {
        border-bottom: 1px solid #ddd;
        margin-bottom: 5px;
        font-weight: normal;
        font-size: 15px;
    }

    .ship_info table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

        .ship_info table td {
            padding: 1px 0;
            font-size: 12px;
            line-height: 1.5em;
        }

        .ship_info table .label {
            text-align: left;
        }

.ship_pic {
    display: block;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 100px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    color: #fff;
    background: #0089b4 url(/Content/img/nopic.png) no-repeat center;
    border: 1px solid #fff;
    cursor: pointer;
}

/*´¬²°ÐÅÏ¢¿òÀÍÊÏÎ¢µµ°¸ÐÅÏ¢*/
.lloydmicroarchives span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 120px;
    display: block;
}

.ship_ext {
    padding: 5px 10px;
    max-height: 95px;
    overflow: auto;
}

    .ship_ext table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
        border: 1px solid #ddd;
    }

        .ship_ext table .th {
        }

        .ship_ext table td {
            padding: 0 3px;
            font-size: 14px;
        }

.ship_btn {
    padding: 5px 10px;
    text-align: right;
}

    .ship_btn a {
        display: inline-block;
        margin-right: 5px;
        padding: 0 15px;
        border-radius: 4px;
        border: 1px solid #00c3ff;
        background: #017aa1;
    }

        .ship_btn a:hover {
            background: #0089b4;
        }

.ship_btns {
    text-align: right;
    padding: 10px 8px;
}

    .ship_btns a {
        display: inline-block;
        margin: 0 5px;
        padding: 0 9px;
        border-radius: 4px;
        border: 1px solid #00c3ff;
        background: #017aa1;
        font-size: 13px;
        cursor: pointer;
    }

        .ship_btns a:hover {
            background: #0089b4;
        }

.form {
    padding: 15px 0;
}

    .form table {
        width: 100%;
        border-collapse: collapse;
    }

    .form td {
        padding: 3px 5px;
    }

    .form .c {
        text-align: center;
    }

    .form .name {
        text-align: right;
    }

    .form .select {
        width: 216px;
        padding: 5px;
        border-radius: 4px;
        border: 1px solid #00c3ff;
        background: #017aa1;
    }

    .form .input {
        width: 200px;
        padding: 7px;
        border-radius: 4px;
        border: 1px solid #00c3ff;
        background: #017aa1;
    }

    .form .textarea {
        width: 200px;
        padding: 7px;
        height: 60px;
        border-radius: 4px;
        border: 1px solid #00c3ff;
        background: #017aa1;
    }

    .form .hidesubmit {
        position: absolute;
        width: 0;
        height: 0;
        opacity: 0.01;
        filter: alpha(opacity=1);
    }

.button {
    display: inline-block;
    margin-right: 5px;
    padding: 0 20px;
    border-radius: 4px;
    border: 1px solid #00c3ff;
    background: #017aa1;
}

    .button:hover {
        background: #0089b4;
    }

.querys {
    position: absolute;
    left: 19px;
    top: 49px;
    width: 273px;
    background: rgba(0,37,49,0.85);
    border: 1px solid #00c3ff;
}

    .querys a {
        display: block;
        height: 30px;
        line-height: 30px;
        text-indent: 7px;
    }

        .querys a.on,
        .querys a:hover {
            color: #fff;
            background: #0089b4;
            box-shadow: 0 0 5px #00c3ff inset;
        }

.table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #eee;
}

    .table .th {
        background: #eee;
    }

    .table td {
        padding: 5px 5px;
        border-bottom: 1px solid #eee;
        text-align: center;
    }

    .table .l {
        text-align: left;
    }

    .table .r {
        text-align: right;
    }

.botter .top {
    height: 30px;
    cursor: default;
}

.botter .tabs {
    position: absolute;
    left: 20px;
    top: 3px;
    height: 30px;
}

    .botter .tabs li {
        display: block;
        float: left;
        padding: 5px 15px 4px;
        cursor: pointer;
        font-size: 16px;
    }

        .botter .tabs li:hover {
            color: #00c3ff;
        }

        .botter .tabs li.on, #AlarmTab a.on {
            border-bottom: 2px solid #00c3ff;
            color: #00c3ff;
        }

.botter .top100 {
    position: absolute;
    right: 513px;
    top: 7px;
}

.botter .search {
    position: absolute;
    right: 8px;
    top: 5px;
    padding-left: 10px;
}

    .botter .search input {
        padding: 2px 12px;
        border: 1px solid #00c3ff;
        border-radius: 15px;
        margin: 2px 0 0 10px;
        outline: none;
        background: #002531;
        width: 150px;
    }

.botter .bot {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 40px;
    overflow: auto;
}

.list {
}

    .list table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14px;
        color: #fff;
    }

        .list table td {
            text-align: center;
        }

        .list table .tit {
            font-size: 14px;
        }

        .list table tr {
            height: 30px;
        }

        .list table .th td {
            padding: 6px 3px;
        }

        .list table .on {
            background: #0089b4;
        }

        .list table .l {
            text-align: left;
        }

        .list table .r {
            text-align: right;
        }

.lists {
}

    .lists dl {
    }

    .lists dt {
    }

    .lists dd {
    }

    .lists dt {
        text-indent: 32px;
        height: 25px;
        line-height: 25px;
        position: relative;
    }

        .lists dt u {
            display: block;
            position: absolute;
            left: 5px;
            top: 8px;
            width: 9px;
            height: 9px;
            overflow: hidden;
            background: url(img/s_plus.gif) no-repeat center;
        }

        .lists dt.on u {
            background-image: url(img/s_minus.gif);
        }

        .lists dt b {
            display: block;
            position: absolute;
            left: 18px;
            top: 7px;
            width: 10px;
            height: 10px;
            overflow: hidden;
            background: #fcd;
        }

        .lists dt i {
            display: block;
            position: absolute;
            right: 0px;
            top: 0px;
            color: #06c;
            font-style: normal;
            font-size: 12px;
            padding: 0 10px;
        }

            .lists dt i.new {
                background: #f00;
                padding: 0;
                right: 10px;
                top: 16px;
                width: 8px;
                height: 8px;
                border-radius: 10px;
                overflow: hidden;
            }

        .lists dt span {
            font-size: 12px;
            color: gray;
        }

    .lists dd {
    }

    .lists .g {
        text-indent: 11px;
    }

        .lists .g b {
            display: block;
            position: absolute;
            left: 3px;
            top: 14px;
            width: 12px;
            height: 12px;
            overflow: hidden;
            background: #fcd;
            border-radius: 10px;
        }

    .lists a {
        display: block;
        padding-left: 17px;
        height: 30px;
        line-height: 30px;
        position: relative;
        white-space: nowrap;
        font-size: 16px;
        margin: 0px 0px 2px 0px;
    }

        .lists a .r {
            display: block;
            position: absolute;
            right: 4px;
            top: 0px;
            height: 25px;
        }

            .lists a .r i {
                float: left;
                display: block;
                width: 20px;
                height: 25px;
                margin: 6px auto;
            }

                .lists a .r i.del {
                    /*/background: url(img/del.gif) no-repeat center;*/
                }

                .lists a .r i.alt {
                    /*background: url(img/edit.gif) no-repeat center;*/
                }

                .lists a .r i.info {
                    background: url(img/info.gif) no-repeat 0px 1px;
                }

                .lists a .r i.infonew {
                    background: url(img/infonew.gif) no-repeat 0px 1px;
                }

        .lists a .new {
            background: #f00;
            display: block;
            position: absolute;
            left: -7px;
            top: 16px;
            width: 8px;
            height: 8px;
            border-radius: 10px;
            overflow: hidden;
        }

        .lists a.gray {
            color: gray;
        }

        .lists a.on {
            background: #0089B4;
        }

        .lists a:hover {
            background: #0089B4;
        }

    .lists dd a {
        padding-left: 17px;
    }


.lists_ports {
    padding: 10px;
}

    .lists_ports dl {
        margin-top: 10px;
    }

    .lists_ports dt {
        padding: 5px;
    }

    .lists_ports a {
        display: inline-block;
        margin-right: 5px;
        padding: 5px;
    }

.lists_message li {
    padding: 10px;
    color: #444;
    font-size: 13px;
}

    .lists_message li .msg {
        margin-top: 5px;
        display: inline-block;
        padding: 3px 8px;
        color: #fff;
        background: #2ed441;
        border-radius: 5px;
        word-break: break-all;
        line-height: 1.6em;
    }

.xtitle {
    display: block;
    color: #000;
    height: 22px;
    line-height: 22px;
    position: relative;
}

.big_buttons {
    text-align: center;
}

    .big_buttons a {
        color: #999;
        display: block;
        margin: 20px 20px;
        font-size: 16px;
        height: 50px;
        line-height: 50px;
        border: 1px solid #ddd;
        border-radius: 30px;
    }

        .big_buttons a:hover {
            background: #fafafa;
        }

.pages {
    padding: 5px 0;
    color: gray;
    font-size: 12px;
    text-align: right;
}

    .pages a {
        margin-left: 5px;
    }

.more_data {
    display: block;
    color: gray;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
}

.popup {
}

    .popup h4 {
        font-weight: normal;
        color: #06c;
        font-size: 13px;
    }

    .popup p {
        margin: 0;
        color: #666;
        font-size: 12px;
    }

.group_color {
    padding: 10px 0;
}

    .group_color b {
        display: inline-block;
        width: 16px;
        height: 16px;
        overflow: hidden;
        border: 3px solid #fff;
        cursor: pointer;
        margin: 5px;
        border-radius: 15px;
    }

        .group_color b.on {
            border-color: #f60;
        }

.group_colors i {
    display: inline-block;
    border: 1px solid #fff;
    width: 12px;
    height: 12px;
    margin: 0 2px;
}

    .group_colors i.on {
        border-color: #000;
    }

.custom_tab {
    position: absolute;
    left: 50px;
    right: 70px;
    top: 0;
    height: 45px;
    text-align: center;
}

    .custom_tab ul {
        width: 164px;
        height: 45px;
        margin: 4px auto 0;
    }

        .custom_tab ul li {
            width: 80px;
            padding: 9px 0;
            float: left;
            position: relative;
            background: #f6f6f6;
            color: #666;
            border: 1px solid #ddd;
            display: inline-block;
            font-size: 14px;
            text-align: center;
            cursor: pointer;
        }

            .custom_tab ul li:first-child {
                border-radius: 20px 0 0 20px;
            }

            .custom_tab ul li:last-child {
                border-radius: 0 20px 20px 0;
                border-left-width: 0;
            }

            .custom_tab ul li.on {
                background: #fff;
                color: #000;
            }

    .custom_tab .new {
        background: #f00;
        display: block;
        position: absolute;
        right: 9px;
        top: 4px;
        width: 8px;
        height: 8px;
        border-radius: 10px;
        overflow: hidden;
    }

/*¸Û¿Ú*/
.port_tab li {
    display: inline-block;
}

.port_tab a {
    display: inline-block;
    padding: 6px;
    border-left: 1px solid #E2A5A5;
    margin: 4px 0;
    background: rgba(11, 54, 68, 0.85);
    cursor: pointer;
}

.domesticPort a:hover {
    background-color: #047FA7;
}

.port-tab-seleted {
    background: rgba(0,137,180,0.85) !important;
    border-bottom: 1px solid #8D77B1;
}

.OneOnePort li {
    display: inline-block;
}

.OneOnePort a {
    display: inline-block;
    padding: 3px 0 3px 23px;
    width: 200px;
}

    .OneOnePort a:hover {
        background-color: #9C82BD;
    }

.port-refer li {
    display: inline-block;
}

.port-refer a {
    display: inline-block;
    padding: 2px 4px;
}

    .port-refer a:hover {
        background-color: #EAE3E3;
    }

.port-refer-selected, .port-selected {
    background-color: #9C82BD;
}

.interPortGroup li {
    display: inline-block;
}

.interPortGroup a {
    display: inline-block;
    padding: 3px 0 3px 23px;
    width: 200px;
}

    .interPortGroup a:hover {
        background-color: #9C82BD;
    }

.port-tip {
    position: absolute;
    background-color: white;
    border: 1px solid #ccc;
    width: 261px;
    display: none;
    max-height: 300px;
    overflow-y: scroll;
    background-color: rgba(0,37,49,0.85);
}

    .port-tip a {
        display: block;
        padding: 0 9px;
        width: 225px;
        cursor: pointer;
        position: relative;
        height: 26px;
        line-height: 27px;
        overflow: hidden;
    }

.port-tip-a-hover {
    background: #0089b4;
}

/*µ½¸ÛÌáÐÑ*/
.app-selectedports {
    height: 146px;
    margin-top: 7px;
    overflow-y: scroll;
    width: 260px !important;
}

    .app-selectedports li {
        float: left;
        padding: 4px 0px 0px 11px;
        margin: 0 0 5px 6px;
        width: 97px;
        height: 26px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }

    .app-selectedports span {
        display: inline-block;
        float: left;
        line-height: 22px;
        width: 77px;
        white-space: nowrap;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        overflow: hidden;
    }

    .app-selectedports a {
        line-height: 22px;
    }







/*ÏÔÊ¾·ûºÅ*/
.legendBox { /*position:absolute;right:0;top:25px;z-index:1001;*/
    width: 200px;
    background: #e1f0ff;
    border: 1px solid #C8E1FB;
}

    .legendBox ul {
        padding: 10px;
    }

        .legendBox ul li {
            padding-left: 12px;
            height: 28px;
            text-indent: 3em;
            line-height: 28px;
            color: #666;
        }

            .legendBox ul li.legend_title {
                height: 20px;
                line-height: 20px;
                font-weight: bold;
                border-top: 1px solid #DBE8F3;
                margin: 3px 0;
                padding-left: 0;
                text-indent: 0;
                color: #333;
            }

            .legendBox ul li.fisShip {
                background: url(img/Screenshots/fisShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.redShip {
                background: url(img/Screenshots/redShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.purpleShip {
                background: url(img/Screenshots/purpleShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.lawShip {
                background: url(img/Screenshots/lawShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.yellowShip {
                background: url(img/Screenshots/yellowShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.greenShip {
                background: url(img/Screenshots/greenShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.grayShip {
                background: url(img/Screenshots/grayShip.gif) no-repeat 12px center;
            }

            .legendBox ul li.navigation {
                background: url(img/Screenshots/navigation.gif) no-repeat 12px center;
                line-height: 30px;
                height: 30px;
            }

            .legendBox ul li.turn {
                background: url(img/Screenshots/turn.gif) no-repeat 12px center;
                line-height: 30px;
                height: 30px;
            }

            .legendBox ul li.aisymbol {
                background: url(img/Screenshots/aisymbol.gif) no-repeat 12px center;
                line-height: 45px;
                height: 45px;
                text-indent: 8em;
            }

            .legendBox ul li.dplusymbol {
                background: url(img/Screenshots/dplusymbol.gif) no-repeat 12px center;
                line-height: 45px;
                height: 45px;
                text-indent: 8em;
            }

            .legendBox ul li.sAis {
                background: url(img/Screenshots/sAis.gif) no-repeat 12px center;
                line-height: 45px;
                height: 45px;
                text-indent: 8em;
            }

/**Â¼ÈëÇøÓòÑùÊ½**/
.entry_lat_1 {
    float: left;
    margin-left: 5px;
}

    .entry_lat_1 a {
        margin-top: 6px;
    }

.entry_lng_1 {
    float: left;
    margin-left: 10px;
}

    .entry_lng_1 a {
        margin-top: 6px;
    }

#entry_div_1 {
    overflow: auto;
    height: 200px;
}

    #entry_div_1 input {
        display: inline-block;
        width: 24px;
        height: 22px;
        background: #017aa1;
        border: 1px solid #00c3ff;
        margin: 2px 0;
    }

    #entry_div_1 label {
        display: inline-block;
        width: 25px;
    }

    #entry_div_1 select {
        display: inline-block;
        width: 38px;
        margin-left: 5px;
    }

    #entry_div_1 .du {
        width: 28px;
    }

    #entry_div_1 .fen {
        width: 49px;
    }

.entry_lat_1 a, .entry_lat_2 a {
    background: url(/Content/img/NSEW.png) no-repeat;
    background-position-y: -18px;
}

.entry_lat_1 .ns, .entry_lat_2 .ns {
    background: url(/Content/img/NSEW.png) no-repeat;
    background-position-y: 0px;
}

.entry_lng_1 a, .entry_lng_2 a {
    background: url(/Content/img/NSEW.png) no-repeat;
    background-position-y: -54px;
}

.entry_lng_1 .ew, .entry_lng_2 .ew {
    background: url(/Content/img/NSEW.png) no-repeat;
    background-position-y: -36px;
}

.entry_lat_2 {
    float: left;
    margin-left: 5px;
}

    .entry_lat_2 a {
        margin-top: 6px;
    }

.entry_lng_2 {
    float: left;
    margin-left: 10px;
}

    .entry_lng_2 a {
        margin-top: 6px;
    }

#entry_div_2 {
    overflow: auto;
    height: 200px;
}

    #entry_div_2 input {
        display: inline-block;
        width: 24px;
        height: 22px;
        background: #017aa1;
        border: 1px solid #00c3ff;
        margin: 2px 0;
    }

    #entry_div_2 label {
        display: inline-block;
        width: 25px;
    }

    #entry_div_2 select {
        display: inline-block;
        width: 38px;
        margin-left: 5px;
    }

    #entry_div_2 .du {
        width: 28px;
    }

    #entry_div_2 .miao {
        width: 31px;
    }

.entry_line_div {
    position: relative;
    height: 25px;
}

    .entry_line_div span {
        width: 11px;
        text-align: center;
    }

    .entry_line_div a {
        margin-left: 5px;
        height: 18px;
        width: 38px;
        cursor: pointer;
    }

    .entry_line_div div, .entry_line_div label, .entry_line_div span, .entry_line_div a, .entry_line_div input {
        float: left;
        display: inline-block;
    }

.entry_addnew {
    cursor: pointer;
    position: absolute;
    display: block;
    width: 60px;
    height: 15px;
    top: 8px;
    right: 5px;
    text-align: right;
}

/*Ñ¡Ïî¿¨ÑùÊ½*/

.locusBox {
    padding: 5px;
    width: 380px;
    font: normal 12px/19px Arial,sans-serif;
}

    .locusBox .attrName {
        width: 60px;
        text-align: left;
        display: inline-block;
    }

    .locusBox .attrCont {
        width: 115px;
        display: inline-block;
    }

.locusTab {
    height: 25px;
    border-bottom: 1px solid #00c3ff;
    position: relative;
}

    .locusTab .locus_ul {
        height: 24px;
        position: absolute;
        left: 0;
        top: 0;
    }

        .locusTab .locus_ul a {
            float: left;
            padding-left: 12px;
            display: inline-block;
            height: 24px;
            line-height: 24px;
            margin-right: 4px;
            border: 1px solid #00c3ff;
            background: rgba(0,37,49,0.85);
            transform: skew(-28deg,0deg);
        }

            .locusTab .locus_ul a span {
                display: block;
                float: left;
                padding-right: 12px;
                color: white;
                height: 24px;
                cursor: pointer;
                transform: skew(28deg,0deg);
            }
            /*.locusTab .locus_ul a:hover { background: url(/Content/img/lucosTab.png) no-repeat 0 -48px; text-decoration: none; }
.locusTab .locus_ul a:hover span { background: url(/Content/img/lucosTab.png) no-repeat right -48px; }
.locusTab .locus_ul a.cur { background: url(/Content/img/lucosTab.png) no-repeat 0 0; font-weight: bold; color: #095DC8; }
.locusTab .locus_ul a.cur span { background: url(/Content/img/lucosTab.png) no-repeat right 0; }
.locusTab .locus_ul a.cur:hover { background: url(/Content/img/lucosTab.png) no-repeat 0 0; }
.locusTab .locus_ul a.cur:hover span { background: url(/Content/img/lucosTab.png) no-repeat right 0; }*/
            .locusTab .locus_ul a.cur {
                background: rgba(0,137,180,0.85);
            }

.locusTab_main {
    width: 380px;
    position: relative;
    padding: 10px 0 5px 0;
    overflow-x: hidden;
    overflow-y: auto;
}

.xtip {
    position: fixed;
    bottom: 20px;
    left: -150px;
    width: 300px;
    margin-left: 50%;
    text-align: center;
    z-index: 9999;
}

    .xtip div {
        display: inline-block;
        padding: 10px;
        color: #FFF;
        background: #FF0000;
        border-radius: 6px;
        font-size: 14px;
        min-width: 100px;
    }

.XPop {
    position: absolute;
    background: #fff;
    border: 1px solid #64ABDB;
    box-shadow: 3px 3px 5px #aaa;
    min-width: 100px;
    min-height: 20px;
    z-index: 10000;
}

    .XPop ul {
        margin: 0;
        padding: 3px 5px;
    }

        .XPop ul li {
            line-height: 22px;
        }

            .XPop ul li input {
                margin-right: 3px;
            }

.alarm_config {
    padding: 10px 5px;
}

#alarm_config_tab {
    border-bottom: 1px solid #ddd;
    padding: 0 10px;
}

    #alarm_config_tab a {
        display: inline-block;
        padding: 3px 10px;
        margin-right: 5px;
    }

        #alarm_config_tab a.on {
            background: #eee;
        }

#alarm_config_box {
    min-height: 170px;
}

#alarm_config_btn {
    text-align: center;
}

#listenAlertsBox {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1001;
    width: 846px;
}

#AlarmBoxMax .min {
    position: absolute;
    right: 10px;
    top: -10px;
    overflow: hidden;
    font-size: 32px;
}

#AlarmBoxMax .body {
    width: 100%;
    height: 282px;
    overflow: auto;
}

#AlarmBoxMin {
    font-size: 14px;
    color: #00c3ff;
    cursor: pointer;
}

    #AlarmBoxMin b {
        padding: 0 2px;
        color: red;
    }

#AlarmTab {
    height: 28px;
    padding: 3px 0 0 10px;
    text-align: center;
}

    #AlarmTab a {
        display: inline-block;
        height: 28px;
        line-height: 28px;
        padding: 0 10px;
        position: relative;
    }

        #AlarmTab a i {
            position: absolute;
            right: 0px;
            top: 0px;
            min-width: 12px;
            line-height: 1em;
            text-align: center;
            padding: 1px;
            background: red;
            border-radius: 5px;
            color: white;
            font-style: normal;
            font-size: 12px;
            display: none;
        }

            #AlarmTab a i.new {
                display: block;
            }

#AlarmForm {
    margin: 10px 0 10px 20px;
}

    #AlarmForm select, #AlarmForm input {
        border: 1px solid #00c3ff;
        background: #002531;
        padding-left: 10px;
        outline: none;
        margin-right: 5px;
    }

    #AlarmForm select {
        height: 30px;
        width: 118px;
    }

    #AlarmForm input {
        height: 28px;
        width: 108px;
    }

.bell_box {
    width: auto;
    height: 40px;
    float: right;
    line-height: 40px;
    padding: 0 12px;
}

    .bell_box i {
        font-size: 16px;
        margin-right: 3px;
    }

.quite_btn {
    font-size: 14px;
    color: #00c3ff;
}

.user_name {
    margin: 0 10px;
    color: #fff;
    font-size: 16px;
}

.xtable {
    border-collapse: collapse;
    table-layout: fixed;
    cursor: default;
    width: 100%;
    font-size: 14px;
    line-height: 30px;
}

    .xtable, .xtable td {
        text-align: center;
    }

        .xtable td {
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }

            .xtable td.l {
                float: none;
                text-align: left;
            }

            .xtable td.r {
                float: none;
                text-align: right;
            }

        .xtable .bg, .xtable .th, .xtable .tf {
        }

        .xtable .ov {
            background: #fafafa;
        }

        .xtable .on {
            background: #ffb;
        }

.pages {
    padding: 10px 0;
    color: gray;
    text-align: center;
}

    .pages a, .pages span {
        margin: 0 3px;
    }

.nodata {
    display: block;
    color: gray;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
}

.more_data {
    display: block;
    color: gray;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
}


.zcBtns {
    padding: 3px 0px;
    min-height: 22px;
}

.zcBtnsR {
    margin-left: auto;
    float: right;
}

.zcBtn, .zcBtnBig, .zcBtnDis, .zcBtnBigDis {
    display: inline-block;
    text-align: center;
    outline: none;
    background: #0089b4;
    border: 1px solid #00c3ff;
    font-size: 14px;
    width: 90px;
    height: 28px;
    line-height: 28px;
}

.zcBtnBig, .zcBtnBigDis {
    background-image: url(/Content/img/btnBgBig.gif);
    width: 65px;
}

.zcBtnDis, .zcBtnBigDis {
    background-position: 0 -54px;
    cursor: default;
}

.zcBtn:hover, .zcBtnBig:hover {
    background-position: 0 -27px;
    text-decoration: none;
}

.form-horizontal .login-heading {
    display: block;
    font-size: 25px;
    font-weight: 700;
    padding: 20px 0;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 25px;
    box-sizing: border-box;
    color: #AFA9B8;
}

.form-horizontal .form-group {
    margin: 0 0 25px 0;
    position: relative;
    box-sizing: border-box;
}

    .form-horizontal .form-group i {
        position: absolute;
        top: 12px;
        left: 20px;
        font-size: 17px;
        color: #c8c8c8;
        transition: all 0.5s ease 0s;
    }

.form-horizontal .form-control {
    background: rgba(255,255,255,1);
    border-radius: 2px;
    box-shadow: none;
    padding: 0 20px 0 45px;
    height: 40px;
    border: none;
    font-family: 'Microsoft YaHei';
    color: black;
}

    .form-horizontal .form-control:focus {
    }

        .form-horizontal .form-control:focus + i {
            color: #666;
            border: none;
        }

.form-control {
    display: block;
    width: 282px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #fff;
}

.form-horizontal .btn {
    font-size: 14px;
    color: #fff;
    background: #db3235;
    border-radius: 2px;
    padding: 10px 0;
    border: none;
    transition: all 0.5s ease 0s;
    font-family: 'Microsoft YaHei';
    width: 100%;
}

.form-horizontal .text {
    line-height: 20px;
    color: #fff;
    font-family: 'Microsoft YaHei';
}

.form-horizontal .main-checkbox input[type=checkbox] {
    margin: 4px 0 0;
    line-height: normal;
}

.form-horizontal .main-checkbox {
    float: left;
    margin-right: 5px;
}

    .form-horizontal .main-checkbox label {
        width: 20px;
        height: 20px;
        position: absolute;
        cursor: pointer;
        max-width: 100%;
        margin-top: 5px;
        font-weight: 700;
    }

.clear {
    clear: both;
    height: 0;
}

.ta_c {
    text-align: center;
}


.loginMain {
    height: 138px;
    overflow: hidden;
    padding: 38px 9px 0 9px;
    width: 287px;
    background: url(img/loginBox.png) no-repeat 0 0;
}

    .loginMain ul {
        width: 100%;
        clear: both;
        padding-top: 4px;
        margin-bottom: 10px;
        *margin-bottom: -10px;
    }

        .loginMain ul li {
            height: 21px;
            padding-top: 7px;
            color: #676767;
        }

            .loginMain ul li span {
                display: inline-block;
                float: left;
                height: 21px;
                vertical-align: middle;
            }

    .loginMain .loginPadLeft {
        padding: 7px 0 0 48px;
    }

.loginName {
    color: #fff;
    font-size: 28px;
    margin: 2% 0 0 10%;
}

    .loginName img {
        vertical-align: middle;
        margin-right: 10px;
    }

.sSelect {
    padding-right: 9px;
}

    .sSelect select {
        border: 1px solid #7E9DB9;
        height: 20px;
        color: #618BA1;
    }

.loginWrap {
    width: 347px;
    margin: 15% auto 0;
}

.shipTypeCheck .ckLabel {
    height: 22px;
    line-height: 22px;
    display: inline-block;
    color: #0066A7;
    cursor: pointer;
}

.shipTypeCheck .ckInput {
    position: relative;
    top: 2px;
}

.icon_right {
    z-index: 99;
    position: absolute;
    top: 13px;
    right: 9px;
}

.icon_right1 .icon_reply {
    z-index: 9999;
    position: absolute;
    left: 5%;
    top: 2%;
    color: #fff;
    display: block;
    background: url('img/mapLayer.png') left center no-repeat;
    padding-left: 35px;
    line-height: 30px;
    font-size: 20px;
    padding-left: 29px;
}

.tab_map {
    width: 81px;
    display: block;
    padding: 3px 0 3px 5px;
    overflow: hidden;
    position: absolute;
    top: 50px;
    right: 0;
}

    .tab_map a {
        display: inline-block;
        width: 74px;
        float: left;
        height: 48px;
        margin-right: 5px;
        border: 1px solid #00c3ff;
        position: relative;
        cursor: pointer;
        border-radius: 1px;
    }

    .tab_map b {
        font-weight: normal;
        position: absolute;
        bottom: 0;
        right: 0;
        display: inline-block;
        width: 50px;
        height: 20px;
        line-height: 20px;
        text-align: center;
        background: rgba(0,37,49,0.3);
        font-size: 14px;
        border-radius: 5px;
    }

.sea_maplayer {
    background: url('img/area_pic.jpg');
}

.maplayer {
    background: url('img/map_pic.jpg');
}

.star_maplayer {
    background: url('img/star_pic.jpg');
}

.tab_map .sel b {
    background: #0089b4;
}

.tab_map a.fl_r {
    float: right;
}

.tab_map1 {
    position: absolute;
    z-index: 10;
    right: 9px;
    top: 118px;
}

.tab_map u {
    text-decoration: none;
    display: block;
    font-size: 12px;
}

.tab_map img {
    height: 26px;
}
/*leaflet css adjument*/
.leaflet-top {
    top: 126px;
}

.sel {
    border: 1px solid red !important;
}

.toleft_btn {
    position: absolute;
    left: 326px;
    top: 195px;
    width: 17px;
    height: 80px;
    cursor: pointer;
}

    .toleft_btn span, .toleft_btn b {
        display: inline-block;
    }

    .toleft_btn span {
        width: 17px;
        height: 40px;
        overflow: hidden;
    }

    .toleft_btn b {
        width: 12px;
        height: 40px;
        background: rgba(0,137,180,0.7);
    }

.toggle-bg_top b {
    transform: skew(0,28deg);
    margin-top: 5px;
}

.toggle-bg_bottom b {
    transform: skew(0,-28deg);
    margin-top: -5px;
}

.toggle-bg_top, .toggle-bg_bottom, .toleft_btn i {
    position: absolute;
}

.toggle-bg_top {
    top: 0;
}

.toggle-bg_bottom {
    bottom: 0;
}

.toleft_btn i {
    top: 33px;
    left: 4px;
}

#polyline-measure-control {
    background-image: url(/Content/img/ruler.png);
}

/* º½ÔË search*/
.hySearch {
    top: 28px;
    z-index: 1002;
    width: 736px;
    left: 10px;
    background: rgba(0,37,49,0.85);
    border: 1px solid #00c3ff;
    box-shadow: 0 0 5px #00c3ff inset;
    position: absolute;
    line-height: 36px;
    height: 57px;
}

    .hySearch div {
        margin: 10px 20px;
        overflow: hidden;
    }

    .hySearch input {
        width: 48px;
        line-height: 23px;
        height: 23px;
        padding-left: 0px;
        background: white;
        font-size: 14px;
        margin-left: 3px;
        border: 1px solid #ccc;
        border-radius: 2px;
        color: #000;
        text-align: center;
    }

.trackHistory {
    width: 209px;
    color: red;
    display: block;
    z-index: 9999;
    box-shadow: 0 0 5px #00c3ff inset;
    z-index: 1002;
    width: 177px;
    background: rgba(0,37,49,0.85);
    border: 1px solid #00c3ff;
    box-shadow: 0 0 5px #00c3ff inset;
    position: absolute;
    color: #fff;
    font-size: 14px;
    top: 59px;
    left: 19px;
}

    .trackHistory div {
        margin: 11px 20px 34px 16px;
        overflow: hidden;
    }

    .trackHistory button {
        z-index: 1002;
        width: 146px;
        background: rgba(0,37,49,0.85);
        border: 1px solid #00c3ff;
        box-shadow: 0 0 5px #00c3ff inset;
        position: absolute;
        color: #fff;
        font-size: 14px;
        height: 28px;
        line-height: 27px;
    }

.openeye {
    color: #64E564;
}

.openalert {
    color: #64E564;
}

.closealert {
    color: #fff;
}

.closeeye {
    color: #fff;
}

.leaflet-div-icon {
    background: yellow;
    border: 1px solid #F00707;
}

.pwd {
    background: rgba(0, 37, 49, 0);
    padding: 1px 20px; /* border-radius:5px; */
    margin: 10px auto;
}

.pwd {
    width: 228px;
}

    .pwd input[type="password"] {
        line-height: 20px;
        padding: 5px 10px;
        border: 1px solid #ccc;
        width: 207px;
        border-radius: 3px;
        color: #000;
    }

    .load p, .pwd p, .upd_pwd p {
        margin-bottom: 13px;
    }
.leaflet_label_base {
    border-width: 2px;
}

.leaflet_label_orange {
    border-color: #595855;
}

.leaflet_label_color_1 {
    border-color: #ff3a1a
}
.leaflet_label_color_2 {
    border-color: #ff9d00;
}

.leaflet_label_color_3 {
    border-color: #aa61ff;
}

.nodata {
	display: block;
	color: #b7b5b5;
	padding: 10px 0;
	text-align: center;
	cursor: pointer;
	position: absolute;
	left: 45%;
	top: 42%;
}

.port_item {
    width: 100%;
    height: 340px;
}
.port_title {
     height: 48px;
    border-bottom: 1px solid #1b727b;
    margin: 0 40px;
    font-size: 15px;
}
.zoombar {
    position:absolute;  
    top:277px;
    right:10px;
    z-index:1001;
    background:rgba(0, 37, 49, 0.85);border:1px solid #00c3ff;
}
.zoombar a{
    display:block;
    line-height:23px;
    padding:0 4px;
    font-size:13px;
    cursor:pointer;
}
.zoombar a:hover{
    background:rgba(74, 141, 162, 0.5);
}
.maptabs_bg { position: absolute; bottom: 0; right: 0; height: 80px; background: #fff; z-index: 1001; opacity: 0.7; }
.maptabs_box { position: absolute; bottom: 10px; right: 10px; z-index: 1002; }
.maptabs_box a { display: inline-block; position: absolute; }
.maptabs_box_show { width: 258px; height: 60px; }
.maptabs_box_show a { border: 1px solid #2770d4; z-index: 1002; }
.maptabs_box_show a:hover { border: 1px solid #fff; }
.maptabs_box_hide { width: 96px; height: 60px; }
.maptabs_box_hide a { border: 1px solid #fff; top: 0; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25); }
.map_layer1 { right: 0; opacity: 1; z-index: 1005; }
.maptabs_box_hide a.map_layer2 { right: 10px; opacity: 0.5; z-index: 1004; }
.maptabs_box_hide a.map_layer3 { right: 20px; opacity: 0.3; z-index: 1003; }
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar { border: 0; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25); }
.maptabs_box b { position: absolute; bottom: 0; right: 0; display: inline-block; width: 50px; line-height: 20px; color: #fff; background: rgba(0, 0, 0, 0.5); text-align: center; font-weight: normal; }
.maptabs_box .map_layer1 b { background: #2770d4; }
.maptabs_box img { vertical-align: middle; }
.portCalResult { font-size: 14px;line-height: 1.5em;}
.anlysise_ports { margin: 20px 10px; }
.portCalResult span { display:inline-block; }
.portCalResult .desc {display: inline-block;margin: 0px 5px; }
.portCalResult .portsname  { }
.portCalResult .portsname label {display: inline-block;padding: 4px; }
.portCalResult .sels { color:#04f004; }
.portCalResult table { width: 380px;margin: 0px auto;border-collapse: collapse;margin-top: 10px;} 
.portCalResult table td,.portCalResult table th { border: 1px solid #fff;text-align: center; }
.anlysise_shiplist{ font-size: 14px;line-height: 1.5em;height: 300px;overflow: auto;}
.anlysise_shiplist table { margin: 0px auto;border-collapse: collapse;margin-top: 10px;width: 640px;} 
.anlysise_shiplist table td,.anlysise_shiplist table th { border: 1px solid #fff;text-align: center; }