TDataView_ui/styles/tools/toolRouteSearch.css

#directionsSearch {
    /*  background:url('/images/layout/directions/bf.png') repeat-x 0 0; */
    height: 100%;
}

#directionsSearch .topBar {
    height: 50px;
}

.note {
    color: #fff;
}

#directionsSearch .topBar .thtitle {
    width: 60px;
    height: 30px;
    color: #fff;
    font-size: 14px;
    position: absolute;
    top: 10px;
    line-height: 30px;
    left: 10px;
    text-align: center;
}

#directionsSearch .topBar div.active,
#directionsSearch .topBar div:hover {
    color: #0ffdfa;
    background: url(../../images/route/route-title-bg.png) no-repeat;
}

#directionsSearch .topBar div.active a,
#directionsSearch .topBar div:hover a {
    color: #0ffdfa;
}

#directionsSearch .topBar .search_type {
    padding: 5px 0 0 20px;
    display: none;
}

#routeSearchType {
    color: #ffffff;
    padding: 2px 14px 2px 5px;
    border-radius: 2px;
    /* border: 1px solid #fff; */
    display: inline-block;
    background: #0e6d8b url(../../images/layout/down.png) 64px no-repeat;
    background-size: 8px;
    cursor: pointer;
}

.routeTypeList {
    display: none;
    color: #fff;
    background: #0e6d8b;
    position: absolute;
    width: 75px;
    z-index: 99;
}

.routeTypeList li {
    padding: 2px 5px;
    cursor: pointer;
}

.routeTypeList li.active {
    background: #1e90ff;
    color: #fff;
}

/*.routeTypeList li:hover{
     background: #1e90ff;
     color: #fff;
 }*/
/*.search_type:hover .routeTypeList{
     display: block;
 }*/

#directionsSearch .topBar .search_type .btn:first-child {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

#directionsSearch .topBar .search_type .btn:last-child {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

#directionsSearch .routingTopPanel {
    position: relative;
    padding: 0 0 0 10px;
}

#routSearchContent .routserch-con-lt {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 7px;
    height: 7px;
    background: url(../../images/tools/routsearch-icon.png) -29px -7px no-repeat;
}

#routSearchContent .routserch-con-lb {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 7px;
    height: 7px;
    background: url(../../images/tools/routsearch-icon.png) -59px -7px no-repeat;
}

#routSearchContent .routserch-con-rt {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 7px;
    height: 7px;
    background: url(../../images/tools/routsearch-icon.png) -42px -7px no-repeat;
}

#abtnPrintLine {
    position: absolute;
    left: 137px;
    top: 13px;
    display: none;
    padding: 2px 5px 2px 20px;
    color: #fff;
}
#downloadLine {
    position: absolute;
    left: 182px;
    top: 13px;
    display: none;
    padding: 2px 5px 2px 20px;
    color: #fff;
}
.abtnElevation {
    position: absolute;
    left: 80px;
    top: 10px;
    color: #fff;
    width: 60px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    display: none;
}

.favRoute a {
    color: #fff;
    padding: 0 0 0 20px;
    background: url(../../images/route/ljgh_sc.png) no-repeat;
}

#directionsSearch .waypoints {

    position: relative;
    padding: 5px 0;
    /* height:85px; */
    z-index: 50;
}

#directionsSearch .points-content {
    overflow-y: auto;
}

#directionsSearch .waypointWrapper {
    clear: both;
    min-height: 35px;
    position: relative;
    margin-left: 5px;
}

#directionsSearch .waypointWrapper p {
    color: #fff;
}

#directionsSearch .waypointWrapper .waypoint {
    width: 100%;
    float: left;
}

#directionsSearch .waypointWrapper .waypoint .startIcon {
    float: left;
    width: 22px;
    height: 28px;
    overflow: hidden;
    background: url(/images/route/ljgh_sts.png) no-repeat -4px 2px;
}

#directionsSearch .waypointWrapper .waypoint .acrossIcon {
    float: left;
    width: 22px;
    height: 28px;
    overflow: hidden;
    background: url(/images/route/ljgh_sts.png) no-repeat -4px -29px;
}

#directionsSearch .waypointWrapper .waypoint .avoidIcon {
    float: left;
    width: 23px;
    height: 28px;
    overflow: hidden;
    background: url(/images/tools/avoid_point.png) no-repeat 0px 2px;
}

#directionsSearch .waypointWrapper .waypoint .stopIcon {
    float: left;
    width: 22px;
    height: 28px;
    overflow: hidden;
    background: url(/images/route/ljgh_sts.png) no-repeat -4px -61px;
}

#directionsSearch .waypointWrapper.across {
    display: block;
}

#directionsSearch .waypointWrapper.across p {
    float: left;
    margin-left: 10px;
    line-height: 28px;
}

#directionsSearch .waypointWrapper .waypoint .choose-across {
    height: 35px;

}

#directionsSearch .waypointWrapper .waypoint .addAcrossIcon {
    color: #fff;
}

#directionsSearch .waypointWrapper .waypoint .add-acrossIcon {
    float: left;
    width: 22px;
    height: 26px;
    overflow: hidden;
    background: url(/images/tools/routsearch-icon.png) no-repeat 1px 4px;
    cursor: pointer;
}

#directionsSearch .waypointWrapper .waypoint .addAcrossIcon {
    background: none;
    line-height: 29px;
    margin-left: 15px;
    cursor: pointer;
}

#directionsSearch .waypointWrapper .across-points-content {
    max-height: 120px;
    overflow: auto;
}

#directionsSearch .waypointWrapper #acrossPointsList {
    margin: 0px;
    margin-top: 0px;

}

#directionsSearch .waypointWrapper #acrossPointsList .across-li {
    height: 30px;
    margin-bottom: 5px;
}

#directionsSearch .waypointWrapper #acrossPointsList .across-li .searchBox .delete-cur-across {
    position: absolute;
    top: 5px;
    right: 35px;
    z-index: 2;
    color: #3286ff;
    background: url(../../images/layout/search-close.png) center center no-repeat;
    padding: 9px;
    display: none;
}

#directionsSearch .waypointWrapper #acrossPointsList .across-li .searchBox:hover .delete-cur-across {
    display: block;
}

#directionsSearch .waypointWrapper.avoid {
    display: block;
}

#directionsSearch .waypointWrapper.avoid p {
    float: left;
    margin-left: 10px;
    line-height: 28px;
}

#directionsSearch .waypointWrapper .waypoint .choose-avoid {
    height: 35px;

}

#directionsSearch .waypointWrapper .waypoint .addAvoidIcon {
    color: #fff;
}

#directionsSearch .waypointWrapper .waypoint .add-avoidIcon {
    float: left;
    width: 22px;
    height: 26px;
    overflow: hidden;
    background: url(/images/tools/routsearch-icon.png) no-repeat 0px 4px;
    cursor: pointer;
}

#directionsSearch .waypointWrapper .waypoint .addAvoidIcon {
    background: none;
    line-height: 29px;
    margin-left: 15px;
    cursor: pointer;
}

#directionsSearch .waypointWrapper .avoid-points-content {
    max-height: 120px;
    overflow: auto;
}

#directionsSearch .waypointWrapper #avoidAreaList {
    margin: 0px;
    margin-top: 0px;

}

#directionsSearch .waypointWrapper #avoidAreaList .avoid-li {
    height: 30px;
    margin-bottom: 5px;
}

#directionsSearch .waypointWrapper #avoidAreaList .avoid-li .searchBox .delete-cur-avoid {
    position: absolute;
    top: 5px;
    right: 25px;
    z-index: 2;
    color: #3286ff;
    display: none;
}

#directionsSearch .waypointWrapper #avoidAreaList .avoid-li .searchBox:hover .delete-cur-avoid {
    display: block;
}





#directionsSearch .waypointWrapper.TD .waypoint .startIcon,
#directionsSearch .waypointWrapper.TD .waypoint .acrossIcon,
#directionsSearch .waypointWrapper.TD .waypoint .stopIcon {
    cursor: pointer;
}

#directionsSearch .waypointWrapper.TD .waypoint .startIcon.active,
#directionsSearch .waypointWrapper.TD .waypoint .acrossIcon.active,
#directionsSearch .waypointWrapper.TD .waypoint .stopIcon.active {
    background-color: #01b7ff;
}

#directionsSearch .waypointWrapper .waypoint .searchBox {
    float: right;
    position: relative;
    width: 100%;
}

#directionsSearch .waypointWrapper .waypoint .searchBox .input {
    position: absolute;
    top: 0px;
    left: 30px;
    z-index: 1;
    width: 252px;
    color: #727272;
    border: 0px;
    background: #eeeeee;
}

#directionsSearch .ui-autocomplete {
    width: 181px;
    position: absolute;
    left: 32px;
    top: 29px;
    border-top: none;
    z-index: 100;
    display: none;
}

#directionsSearch .ui-autocomplete li {}

#directionsSearch .ui-autocomplete li a {
    display: block;
    padding: 6px 8px;
}

#directionsSearch .ui-autocomplete li a:hover {
    text-decoration: none;
}

#directionsSearch .ui-autocomplete li a strong {
    font-weight: normal;
}

#directionsSearch .ui-autocomplete li a span {
    color: #fff;
}

#directionsSearch .waypointWrapper .deleteButton {
    float: right;
    display: block;
    width: 6px;
    height: 6px;
    overflow: hidden;
    margin: 13px 0 0 0;
    cursor: pointer;
    background: url(/images/layout/directions/delete.png) no-repeat left top;
}

#directionsSearch .waypointWrapper .deleteButton:hover {
    background-position: left -6px;
}

#directionsSearch .ui-autocomplete-close {
    text-align: right;
}

#directionsSearch .ui-autocomplete-close a {
    text-align: right;
    color: #fff;
}


#directionsSearch .routingPanelBar {
    /*position:relative;*/
    padding: 0px;
    overflow: hidden;
    height: 35px;
    z-index: 10;
    margin-top: 16px;
}

#directionsSearch .routingPanelBar .search_type {
    float: left;
    margin-left: 25px;
}

#directionsSearch button {
    border: 0;
    background: #0e6d8b;
    color: #fff;
    padding: 2px 6px;
    display: inline-block;
    border-radius: 2px;
    /* margin-left: 5px; */
    height: 24px;
}

.clearRoute a {
    color: #fff;
}

#directionsSearch .routingPanelBar .btn-group {
    float: left;
    width: 75px;
    margin-left: 25px;
}

#directionsSearch .routingPanelBar .showOptions {
    float: left;
    margin: 10px 15px 0 0;
    width: 60px;
}

#directionsSearch .routingPanelBar .clearRoute {
    float: left;
    margin: 0px 0 0 25px;
}

#directionsSearch .routingPanelBar .clearRoute a {
    background: #0e6d8b;
    color: #fff;
    padding: 2px 6px;
    border-radius: 2px;
    /* border: 1px solid #fff; */
    display: inline-block;
}

#directionsSearch .favRoute {
    position: absolute;
    width: 60px;
    height: 30px;
    right: 10px;
    top: 10px;
    line-height: 30px;
    text-align: center;
    display: none;
}

#directionsSearch .routeSettings {
    padding: 5px 20px;
    overflow: hidden;
    height: 20px;
    display: none;
    position: relative;
    z-index: 10;
}

#directionsSearch .routeSettings label {
    float: left;
    width: 106px;
    overflow: hidden;
    color: #fff;
}

#directionsSearch .routeSettings label * {
    vertical-align: text-bottom;
}

#directionsSearch .routeSettings label span {
    margin: 0 3px;
}

#directionsSearch .slot-directionsContent {
    overflow: hidden;
    overflow-y: auto;
    /* background-color: #0e74d1; */
}

.slot-directionsContent .slot-title {
    color: #fff;
    /* background: url(../../images/route/slot-title.png) no-repeat; */
    padding: 5px 12px;
    background-size: 100%;
    margin-top: 5px;
    margin-bottom: 10px;
    font-weight: bold;
    display: none;
}

#roadViewListWrap {
    /*max-height: 279px;*/
    max-height: 400px;
    overflow: hidden;
    overflow-y: auto;
}

#directionsSearch #roadViewList {
    position: relative;
}

#roadViewList .not-result {
    margin-top: 0px;
    color: #ff6600;
    font-weight: bold;
    text-align: center;
    width: 100%;
    padding: 15px 0;
    text-align: center;
    font-size: 12px;
}

#roadViewList li {
    cursor: pointer;
    overflow: hidden;
    zoom: 1;
    padding: 5px 0;
    float: left;
    clear: both;
    width: 240px;
    color: #fff;
}

#roadViewList li.cur {}

#roadViewList li span {
    display: block;
}

#roadViewList .maneuverLink {
    padding: 0 5px 0 20px;
    color: #666;
    display: block;
    line-height: 18px;
    font-size: 12px;
}

#roadViewList .maneuverHolder {
    position: relative;
    display: block;
    overflow: hidden;
}

#roadViewList .maneuverType {
    float: left;
    display: block;
    width: 20px;
    padding: 0 5px 0 0;
    text-align: right;
}


#roadViewList .maneuverType .maneuverNumber {
    color: #fff;
    font-size: 0px;
    font-weight: normal;
    display: block;
    width: 22px;
    height: 22px;
    overflow: hidden;
}

#roadViewList .maneuverType .maneuverNumber.C {
    background: url(/images/route/D-C.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TL {
    background: url(/images/route/D-TL.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TSLL {
    background: url(/images/layout/D-TSLL.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TSHL {
    background: url(/images/layout/D-TSHL.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TR {
    background: url(/images/route/D-TR.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TSLR {
    background: url(/images/layout/D-TSLR.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TSHR {
    background: url(/images/layout/D-TSHR.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.KL {
    background: url(/images/layout/D-KL.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.KR {
    background: url(/images/layout/D-KR.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TU {
    background: url(/images/layout/D-TU.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.TRU {
    background: url(/images/layout/D-TRU.png) no-repeat;
}

#roadViewList .maneuverType .maneuverNumber.EXIT {
    background: url(/images/layout/D-EXIT.png) no-repeat;
}


#roadViewList .maneuverProgress {
    float: right;
    color: #fff;
    font-size: 11px;
}

#roadViewList .maneuverDescription {
    width: 185px;
    float: left;
    padding-left: 30px;
}

#roadViewList .maneuverDescription span {
    display: inline;
    color: #fff;
}

#roadViewList .maneuverDescription .next-street {
    font-weight: bold;
    color: #fff;
}

#roadViewList .maneuverDescription .distance-description {}

#slot-busWaysList {
    clear: both;
}

#slot-busWaysList li {
    line-height: 25px;
    padding: 0 10px;
    width: 250px;
    cursor: pointer;
    height: 25px;
}

#slot-busWaysList .cur {
    font-weight: bold;
}

#slot-busWaysList li:hover {}












/* S pointSearchResult */
#pointSearchResult {
    z-index: 1000;
    display: none;
    width: 100%;
    overflow: hidden;
    overflow-y: auto;
    border-top: 1px solid #04fdff;
    max-height: 250px;
    /* background-color: #0e74d1; */
}

#pointSearchResult .header h3 {
    color: #fff;
    font-size: 12px;
    font-weight: normal;
}

#pointSearchResult .header {
    /* background: url(/images/layout/bg_tools.png) repeat-x left top; */
    padding: 5px 0 5px 15px;
    cursor: pointer;
}

#pointSearchResult .open .header {
    color: #fff;
}

#pointSearchResult .open .d-waypoints {
    padding: 10px 0px 10px 0px;
    display: block;
}

#pointSearchResult .open .d-waypoints h3 {
    color: #fff;
}

#pointSearchResult .d-waypoints .areaSelect {
    padding: 3px 0;
    float: left;
    margin: 0 15px 0 0;
}

#pointSearchResult .d-waypoints .areaSelect a {
    font-size: 14px;
}

#pointSearchResult .place-dl {
    cursor: pointer;
    padding: 5px;
}

#pointSearchResult .place-dl dt {
    font-size: 14px;
}

#pointSearchResult .place-dl dt i {
    float: left;
}

#pointSearchResult .place-dl dt i img {
    height: 30px;
}

#pointSearchResult .place-dl dt a {
    line-height: 30px;
    font-size: 14px;
    color: #fff;
}

#pointSearchResult button {
    border: 0px solid #dcdcdc;
    height: 25px;
    line-height: 25px;
    color: #fff;
    font-weight: bold;
    font-size: 13px;
    text-decoration: none;
    position: relative;
    background: #104792;
    cursor: pointer;
    width: 55px;
}

#pointSearchResult button.btn-set-way {
    width: 77px;
}

#pointSearchResult .place-dl dd {
    font-size: 12px;
    margin: 0 0 5px 0;
    padding: 0 0 0 18px;
    clear: both;
}

#pointSearchResult .place-dl dd p {
    padding: 0px;
    line-height: 18px;
    margin: 0px;
    color: #fff;
}

#pointSearchResult .place-dl.cur {}

#pointSearchResult .place-dl.cur dt a {
    font-weight: bold;
}

#pointSearchResult .place-dl.cur dt .btn-set-way {
    display: block;
}

#pointSearchResult .place-dl .btn-set-way {
    float: right;
    display: none;
}

#pointSearchResult .place-dl:hover {}

#pointSearchResult .place-dl:hover .btn-set-way {
    display: block;
}


#pointSearchResult .d-waypoints {
    padding: 0 10px;
    overflow: hidden;
    display: none;
}

#pointSearchResult .d-waypoints h3 {
    font-weight: normal;
}

#pointSearchResult .d-waypoints .areaSelect {
    cursor: pointer;
    padding: 3px 0px;
    clear: both;
    overflow: hidden;
    width: 100%;
    text-indent: 20px;
    border-bottom: 1px solid #0e96cf;
}

#pointSearchResult .d-waypoints .areaSelect a {
    font-size: 14px;
    color: #1efef6;
}

.routcategory-list-wrap h3 {
    font-size: 16px;
    padding: 5px 20px;
    color: #fff;
    margin-bottom: 5px;
    border-bottom: 1px solid #0e96cf;
}

.routcategory-list-wrap .areaSelect {
    cursor: pointer;
    padding: 3px 20px;
    clear: both;
    overflow: hidden;
    border-bottom: 1px solid #0e96cf;
}

.routcategory-list-wrap .areaSelect dt a {
    line-height: 20px;
    font-size: 14px;
    color: #1efef6;
}

.routcategory-list-wrap {
    padding: 0px;
    margin: 0px;
}



/* E pointSearchResult */


#routeElevationWrap {
    position: absolute;
    z-index: 99999999999999999;
    left: 0px;
    bottom: 0px;
    width: 100%;
    display: none;
    height: 178px;
}

#routeElevationWrap .close {
    position: absolute;
    right: 0px;
    top: 0px;
    text-indent: -999999px;
    overflow: hidden;
    background: url(../../images/layout/bg_close.gif) no-repeat center 7px;
    border: none;
    width: 30px;
    height: 30px;
    z-index: 1000000;
}

#directionsSearch .tip {
    color: #fff;
    margin-left: 34px;
    font-size: 12px;
    opacity: 0.87;
}

#pointsSearchPageJump .count {
    display: inline-block !important;
    color: #fff;
}