root { 
    display: block;
}

body {
    margin: 0 auto;
    padding: 0px;
    background-color:#ededed;
    font-family: Tahoma, Verdana, sans-serif;
    font-size: 0.8em;
    color: #000000;
}

#main_div {
    width: 1024px;
    height: 1125px;
    margin: 0 auto;
    background-color: #ededed;
    border-left: solid 3px #949d36;
    border-right: solid 3px #949d36;
}

#header {
    position: relative;
    margin: 0 auto;
    float: none;
    width: 1024px;
    height: 230px;
    margin: 0 auto;
    background-color: #ffffff;
}

#top-header {
    position: relative;
    float: left;
    height: 23px;
    width: 1024px;
    background-image: url(../../images/top-header-bg.gif);
}

#middle-header {
    position:relative;
    float:left;
    height: 166px;
    width: 1024px;
}

#banner1 {
    position:relative;
    float:left;
    height: 166px;
    width: 240px;
}

#banner2 {
    position:relative;
    float:left;
    height: 166px;
    width: 784px;
    background-image: url("http://www.thaitrucknavigator.org/truck/thaitrucknavigator/trucknavigator/templates/68portal/images/header-image.png");
}

#bottom-header {
    float:left;
    position:relative;
    height: 30px;
    width: 1004px;
    background-color: #006633;
    padding: 10px;
    color: #ffffff;
    font-size: 15px;
    font-family: Tahoma;
}

#menubar {
    position: relative;
    margin: 0 auto;
    width: 1024px;
    height: 80px;
    background-color: #ffffff;
}

#menuicon_1_div {
    position: relative;
    float: left;
    cursor:pointer;
}

#menuicon_2_div {
    position: relative;
    float: left;
    cursor:pointer;        
}

#menuicon_3_div {
    position: relative;
    float: left;
    cursor:pointer;
}

#menuicon_4_div {
    position: relative;
    float: left;
    cursor:pointer;
}

#menuicon_5_div {
    position: relative;
    float: left;
    cursor:pointer;
}

#left_gap {
    position: relative;
    float: left;
    width: 30px;
    height: 780px;
    background-color: #ffffff;
}

#wrapper {
    position: relative;
    float: left;
    width: 1024px;
    height: 780px;
}

#right_gap {
    position: relative;
    float: left;
    width: 30px;
    height: 780px;
}

#left_wrapper {
      float: left;
      width: 324px;
      height: 780px;
      background-color: #8a9507;
      /* background-image: url(../../images/green-bg.png); */
}

#changearea_wrapper {
    float: left;
    width: 264px;
    height: 780px;
}

#div_changeselect {
    width: 250px;
    height: 350px;
}

#div_symbol {
    width: 323px;
    height: 430px;
    overflow-y: auto;
}

#change_area_menu {
    width: 250px;
    height: 655px;
    overflow-y: auto;
    background-color: #8a9507;
    margin: 0 auto;
}

#layer_tree_wrapper {
    float: left;
    width: 329px;
    height: 780px;
    display:none;
}

#layer_menu {
    width: 317px;
    height: 663px;
    overflow-y: auto;
    background-color: #8a9507;
    margin: 0 auto;
}

#transpoint_tree_wrapper {
    float: left;
    width: 264px;
    height: 780px;
    display:none;
    background: #8a9507;
}

#div_search_transpoint {
    width: 244px;
    height: 250px;
    padding: 10px;
    background: #8a9507;
}

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

#nodename_text {
    width: 240px;
    height: 18px;
    border: 0px solid;
}

#nodetype_select {
    width: 240px;
    height: 20px;
    border: 0px solid;
}

#province_select {
    width: 240px;
    height: 20px;
    border: 0px solid;
}

#div_search_transpoint_result {
    width: 303px;
    height: 390px;
    padding: 10px;
    background: #8a9507;
    overflow-y: auto;
}

#controlline_tree_wrapper {
    float: left;
    width: 264px;
    height: 780px;
    display:none;
}

#div_search_controlline {
    width: 244px;
    height: 210px;
    padding: 10px;
    background: #8a9507;
}

#roadname {
    width: 190px;
}

#trucksize {
    width: 80px;
}

#begin_time1 {
    width: 70px;
}

#end_time1 {
    width: 70px;
}

#begin_time2 {
    width: 70px;
}

#end_time2 {
    width: 70px;
}

#div_search_controlline_result {
    width: 303px;
    height: 430px;
    padding: 10px;
    background: #8a9507;
    overflow-y: auto;
}

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

#div_search_transline {
    width: 244px;
    height: 210px;
    padding: 10px;
    background: #8a9507
}

#transline_type {
    width: 182px;
}

#transline_name {
    width: 165px;
}

#div_search_transline_result {
    width: 303px;
    height: 400px;
    padding: 10px;
    background: #8a9507;
    overflow-y: auto;
}

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

#transline_tree_wrapper {
    float: left;
    width: 264px;
    height: 780px;
    display:none;
}

#right_wrapper {
    position: relative;
    float: left;
    width: 700px;
    height: 700px;
    background-color: #ffffff;
}

#icon_wrapper {
    position: relative;
    background-color: #8a9507;
    width : 700px;
    height: 48px;
    background-image: url(../../images/icon_wrapper_bg.png);
}

#zoominicon_div {
    position: relative;
    margin-left: 50px;
    float: left;
    cursor:pointer;
}

#zoomouticon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#zoomextenticon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#panicon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#overviewmapicon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#infoicon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#labelicon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#distanceicon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#printicon_div {
    position: relative;
    margin-left: 20px;
    float: left;
    cursor:pointer;
}

#map_wrapper {
    position: relative;
    background-color: #cccccc;
    width : 700px;
    height: 700px;
}

#div_mainmap {
    position: relative;
    background-color: #cccccc;
    width : 700px;
    height: 700px;
}

#destination_point {
    position: absolute;
    top: 300px;
    left: 300px;
}

#div_identifymap {
    position: relative;
    display: none;
    background-color: #cccccc;
    width : 700px;
    height: 700px;
    cursor:pointer;
}

#div_distancemap {
    position: relative;
    display: none;
    background-color: #cccccc;
    width : 700px;
    height: 700px;
    cursor:pointer;
}

#div_refmap {
    /* display:none; */
    position: absolute;
}

#mapinfo_wrapper {
    position: relative;
    background-color: #666666;
    width : 700px;
    height: 32px;
    font-weight: bold;
    color:#ffffff;
    text-align:center;
    line-height:30px;
}

#utmx {
    border: solid 0px;
    width: 100px;
    background-color: #666666;
    font-weight: bold;
    color:#ffffff;
}

#utmy {
    border: solid 0px;
    width: 100px;
    background-color: #666666;
    font-weight: bold;
    color: #ffffff;
}

#show_scale {
    border: solid 0px;
    width: 100px;
    background-color: #666666;
    font-weight: bold;
    color: #ffffff;
}

#background_control {
    display:none;
}


#div_changeregion {
    margin-left: 10px;
}

#div_changeprov{
    margin-left: 10px;
}

#div_changedist{
    margin-left: 10px;
}

#div_changeloc{
    margin-left: 10px;
}

#div_showsymbol {
    margin-left: 10px;
}

#footer {
    position:relative;
    height: 16px;
    width: 1004px;
    background-image: url(../../images/footer-bg.png);
    color:#006633;
    float:left;
    padding: 10px;
}